.editorCurrent {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    -moz-box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    outline: none;
    min-height: 16px;
    display:inline-block;
    width:100%;
    margin-bottom:10px;
}

.editorCurrent:focus {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
    -moz-box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
    box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
}

.editorCurrentActive {
    /* border:#5ad04f solid 2px; padding:2px 5px;*/
    
}

.focus {
    border: black dotted 2px;
}

.pointer {
    border: black solid 1px;
    background-color: #c9c9c9;
    /*border-left: black solid 1px;*/
}

.tableLine {
    border: black dotted 1px;
    /*border-left: black solid 1px;*/
}

.ui-selecting {
    background: #FECA40;
}

.ui-setselecting {
    background: green;
}

.ui-selectee {
    border: black dotted 1px;
}

.ui-selected {
    background: #F39814;
    color: white;
    opacity: 0.2;
}

.moveBlock {
    border: black dotted 1px;
    /*border-left: black solid 1px;*/
}

/* resize */
.layoutResize {
    position: absolute;
}

.borderResize {
    position: absolute;
    opacity: 0.5;
    border-style: dashed;
    border-width: 1px;
}

.pointBlock {
    position: absolute;
    border: black solid 1px;
    background-color: #FFFFFF;
    width: 8px;
    height: 8px;
    margin: -5;
    padding: 0;
    z-index: 100000;
}

.nwResize {
    margin: -5px;
    cursor: nw-resize;
}

.nResize {
    margin: -5px;
    cursor: n-resize;
}

.neResize {
    margin: -5px;
    cursor: ne-resize;
}

.wResize {
    margin: -5px;
    cursor: w-resize;
}

.eResize {
    margin: -5px;
    cursor: e-resize;
}

.swResize {
    margin: -5px;
    cursor: sw-resize;
}

.sResize {
    margin: -5px;
    cursor: s-resize;
}

.seResize {
    margin: -5px;
    cursor: se-resize;
}

/*end resize */

/*jotform*/
.jotForm {
    display: block;
    background: #ffffff url(../theme/default/images/jotform.jpg) no-repeat
        center center;
}

.onlineForm {
    display: block;
    background: #ffffff url(../theme/default/images/jotform.jpg) no-repeat
        center center;
}

.onlineFlash {
    display: block;
    background: #ffffff url(../theme/default/images/onlineFlash.jpg)
        no-repeat center center;
}

.jotFormLoad {
    display: block;
    background: #ffffff url(../theme/default/images/loading07.gif) no-repeat
        center center;
}

.fbLikebox {
    background: #ffffff url(../theme/default/images/fblikebox.png) no-repeat
        center center;
}

.fbpageplugin {
    background: #ffffff url(../theme/default/images/fblikebox.png) no-repeat
        center center;
}

/*************  Start socialnetwork  ***************/
.fb_comment_light, .fb_comment_dark  {
    display: inline-block; 
    width: 564px;
    height:301px;
    border:0;
}
.fb_comment_light  {
    background: url(../theme/default/images/comment_light.png) no-repeat left top;
}
.fb_comment_dark  {
    background: url(../theme/default/images/comment_dark.png) no-repeat left top;
}
.fb_light_likebox, .fb_dark_likebox {
    display: inline-block;
    width: 300px;
    border:0;
}
.fb_light_likebox{
    background: url(../theme/default/images/light_like_box.png) no-repeat 10px 7px;
}
.fb_dark_likebox{
    background: url(../theme/default/images/dark_like_box.png) no-repeat center center;
}
.fb_light_standard, .fb_dark_standard{
    display: inline-block;
    width: 351px;
    height: 20px;
    border:0;
}
.fb_light_standard{    
    background:  url(../theme/default/images/light_standard.png) no-repeat left top;    
}
.fb_dark_standard{
    background: url(../theme/default/images/dark_standard.png) no-repeat left top;
}
.fb_light_box_count, .fb_dark_box_count {
    display:block;
    width:49px;
    height: 86px;
    border:0;
}
.fb_light_box_count{    
    background: url(../theme/default/images/light_box_count.png) no-repeat left top;
}
.fb_dark_box_count{    
    background: url(../theme/default/images/dark_box_count.png) no-repeat left top;
}
.fb_light_button_count, .fb_dark_button_count { 
    display:block;
    width: 86px;
    height: 20px;
    border:0;
}
.fb_light_button_count{    
    background: url(../theme/default/images/light_button_count.png) no-repeat left top;
}
.fb_dark_button_count{
    background: url(../theme/default/images/dark_button_count.png) no-repeat left top;
}
.fbmargin{
    margin-bottom:15px;
}

.tableSelecttemplate {
    background-color: #e5e5e5;
    border-top: 1px solid #a1a1a1;
    border-bottom: 1px solid #a1a1a1;
    min-width: 960px;
}

.frameaddblock,.frameaddblockSide {
    background: #fff;
    border: 1px solid #3f3f3f;
    cursor: pointer;
    padding: 0;
    margin: 5px;
    text-align: center;
}

.frameaddblock:hover,.frameaddblockSide:hover {
    border: 1px solid #4c4c4c;
}

input.btnblockAdd,input.btnblockAdd:hover {
    /*background: url(../theme/default/images/icn_addblock.jpg);
    background-repeat: no-repeat;
    background-position: center;*/
    background-color:#fff;
    width: 100%;
    height: 30px;
    border: 0;
    cursor: pointer;
    background-color: #fff;
    text-align: center;
}

input.btnblockAdd:hover {
    /*background: url(../theme/default/images/icn_addblock_h.jpg);
    background-repeat: no-repeat;
    background-position: center;*/
    background-color: #fff;
}

.txtblockname {
    padding: 0;
    text-align: left;
    margin: 0;
}

.bgblockTop,.bgblockBottom,.bgblockSide {
    background-color: #535353;
    border: 1px dotted #fff !important;
    margin: 0 10px 0 5px;
}
.bgblockSide {
    margin: 0;
}

.blockAvaliable,.blockmanageTop,.blockmanageBottom,.blockmanageLeft,.blockmanageRight
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.blockAvaliable {
    height: auto;
    color: #3e3e3e;
    min-height: 480px;
    margin: 0;
    border: 1px solid #fff;
    background-color: #fff;
    width:246px;
}
.titleBlockAvaliable{
    background-color: #6ca062;
    color:#fff;
    padding:12px;
}

.blockmanageTop,.blockmanageBottom {
    width: 100%;
    height: 60px;
}

.blockmanageLeft,.blockmanageRight {
    width: 200px;
    height: auto;
}

ul.blockmanageTop li,ul.blockmanageBottom li {
    width: 100%;
    float: left;
    margin: 3px 0;
}

#sortable2 li.ui-state-highlight {
    padding: 0;
}

#sortable1 li.blocklist,#sortable2 li.blocklist {
    width: 866px;
    padding: 10px;
    margin: 5px 5px 0 5px;
    /*cursor: move;*/
    display: block;
    list-style: none;
    background:#e2e2e2;
    border:1px solid #999;
    min-height: 30px;
    }
/*#sortable1 li.blocklist:hover,#sortable2 li.blocklist:hover{
    background:#000;
    z-index:99;
}*/

#sortable3 li.blocklist,#sortable4 li.blocklist,#sortable0 li.blocklist
    {
    display: block;
    float: none;
    /*cursor: move;*/
    width: auto;
    padding: 10px;
    margin: 5px 5px 0 5px;
    background:#e2e2e2;
    border:1px solid #999;
    min-height: 30px;
    }
/*#sortable3 li.blocklist:hover,#sortable4 li.blocklist:hover,#sortable0 li.blocklist:hover{
    background:#000;
}*/

li.blocklist div.block_editor {
    margin: 0;
    padding: 0;
    width: 100%;
    word-wrap:break-word;
    cursor:auto;
    float:left;
}
li.blocklist div.blockName{margin-top: 7px;float:none;}
li.blocklist div a{color:#006fdd;}
li.blocklist div a:hover{color:#004edd;}

li.blocklist:hover{background-color:#000;}

.block_data_roll {
    background-color: #f7f7f7;
    color: #6d6d6d;
    border: 1px solid #d2d2d2;
    padding: 15px;
    margin-bottom: 7px;
}

.bgblockview {
    background-color: #e9e9e9;
    padding: 7px;
}

.bgblockname {
    background-color: #f7f7f7;
    color: #6d6d6d;
    border: 1px solid #d2d2d2;
    padding: 15px;
    margin-bottom: 7px;
}

.ui-sortable-placeholder {
    border: 1px dotted black;
    visibility: visible !important;
}
.blockName{word-wrap:break-word;}
.blockName input {
    border: 1px solid #ccc;
    margin: 0 0 5px 0;
    width:165px;
}

a.linktxt,a.linktxt:hover {
    margin-top: 2px;
    font-size: 11px;
    text-decoration: none;
    cursor: pointer;
}

a.linktxt,a.linktxt img {
    margin-top: 3px;
}

a.linktxt:hover {
    text-decoration: underline;
}

.rvclear {
    clear: both;
}

.txteditable {
    margin: 5px;
    padding: 5px;
    font-size: 11px;
    text-align: center;
}

[contentEditable=true]:empty:before {
    content: attr(data-ph);
    color: #c0c0c0;
    font-size:12px;
    padding-left:7px;
    line-height:24px;
}

.addBlockLink {
    color: #61ac5b;
    margin-top: 5px;
    margin-bottom: 5px;
    cursor: pointer;
    font-family:Verdana;
    font-size: 14px;
}
.addBlockLink img{padding-right:5px;}

.areaCustom {
    margin-top: 0px;
    margin-bottom: 10px;
    min-height: 25px;
}

.ui-resizable-e {
    width:7px;
    cursor:e-resize;
}
.ui-resizable-s {
    height:7px;
    cursor:s-resize;
}
.titlePagelayout{
    font-size:13px;
    line-height:22px;
    background:#fff url(../theme/default/images/icon_info.png) no-repeat 10px 10px; 
    margin:3px 0 5px 5px; 
    padding:10px;
}
.titlePagelayout .info_message{
    color:#494949;
    padding-left:28px;
}

/*Layout mode*/
li.ui-state-highlight.blocklist:not(.ui-state-disabled):hover {
    background: black
        url(../theme/default/images/iconlayout/normal_move.png)
        no-repeat 99.7% 7% !important;
    cursor:move;
}

li.blocklist:not(.ui-state-disabled) > a > img {
    height:16px;
    width:16px;
}

div.block_editor.editorCurrent{
    background-color:white !important;
}
.bodybackgroundBlackonlayout{
    background-color:rgba(0, 0, 0, 0.95) !important;
}

li.ui-state-highlight.blocklist > a.linktxt > img:not([title=Close]):hover{
  opacity: 0.6;
}
li.ui-state-highlights.blocklist > a.linktxt > img:not([title=Close]):hover{
  opacity: 0.6;
}

.brdgridBlock{
    background-color: #000;
    float: right;
    border-top-left-radius: 8px 8px;
    border-top-right-radius: 8px 8px;
    padding: 4px;
    display: block;
    position: relative;
    top: -25px;
    height: 21px;
}

button.nextButton,
button.backButton,
button.parentButton,
button.childButton,
button.pasteButton,
button.copyButton{
    background-image:url(../theme/default/images/sprite_wys_gridline.png);
    background-repeat:no-repeat;
    background-position:0 0;
    background-color:#000;
    width:20px;
    height:25px;
    cursor:pointer;
    border:0;
    padding:0;
    margin:0;
}
button.nextButton:hover{background-position:-30px 0;}
button.nextButton-dis{background-position:-60px 0;} 

button.backButton{background-position:0 -30px;}
button.backButton:hover{background-position:-30px -30px;}
button.backButton-dis{background-position:-60px -30px;}



button.parentButton{background-position:0 -60px;}
button.parentButton:hover{background-position:-30px -60px;}
button.parentButton-dis{background-position:-60px -60px;}

button.childButton{background-position:0 -90px;}
button.childButton:hover{background-position:-30px -90px;}
button.childButton-dis{background-position:-60px -90px;}

button.pasteButton{background-position:0 -120px;}
button.pasteButton:hover{background-position:-30px -120px;}
button.pasteButton-dis{background-position:-60px -120px;}

button.copyButton{background-position:0 -150px;}
button.copyButton:hover{background-position:-30px -150px;}
button.copyButton-dis{background-position:-60px -150px;}

div.editorCurrent div, div.editorCurrent p{
    padding-top:0 !important;
    margin-right:-2px !important;
}
.Glvgn{
    position: relative;
    float:right;
    top : -25px;
    top:0 !important;
    }
.SelectGrid{
    background-color: rgba(0, 0, 255, 0.3);
}
/* ---------------------- End GridLine ---------------------- */


@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.3); }
  50% {
    opacity: 1;
    -webkit-transform: scale(1.05); }
  70% {
    -webkit-transform: scale(0.9); }
  100% {
    -webkit-transform: scale(1); } }
@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateY(30px); }
  80% {
    -webkit-transform: translateY(-10px); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px); }
  80% {
    -webkit-transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px); }
  80% {
    -webkit-transform: translateX(10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateX(30px); }
  80% {
    -webkit-transform: translateX(-10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0); }
  20% {
    -webkit-transform: translateY(0); }
  40% {
    -webkit-transform: translateY(-30px); }
  50% {
    -webkit-transform: translateY(0); }
  60% {
    -webkit-transform: translateY(-15px); }
  80% {
    -webkit-transform: translateY(0); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes shake {
  0% {
    -webkit-transform: translateX(0); }
  10% {
    -webkit-transform: translateX(-10px); }
  20% {
    -webkit-transform: translateX(10px); }
  30% {
    -webkit-transform: translateX(-10px); }
  40% {
    -webkit-transform: translateX(10px); }
  50% {
    -webkit-transform: translateX(-10px); }
  60% {
    -webkit-transform: translateX(10px); }
  70% {
    -webkit-transform: translateX(-10px); }
  80% {
    -webkit-transform: translateX(10px); }
  90% {
    -webkit-transform: translateX(-10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1); }
  10% {
    -webkit-transform: scale(0.9) rotate(-3deg); }
  20% {
    -webkit-transform: scale(0.9) rotate(-3deg); }
  30% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  40% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  50% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  60% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  70% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  80% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  90% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  100% {
    -webkit-transform: scale(1) rotate(0); } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(20px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes bounceIn {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3); }
  50% {
    opacity: 1;
    -moz-transform: scale(1.05); }
  70% {
    -moz-transform: scale(0.9); }
  100% {
    -moz-transform: scale(1); } }
@-moz-keyframes bounceInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateY(30px); }
  80% {
    -moz-transform: translateY(-10px); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes bounceInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateY(-30px); }
  80% {
    -moz-transform: translateY(10px); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes bounceInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateX(-30px); }
  80% {
    -moz-transform: translateX(10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateX(30px); }
  80% {
    -moz-transform: translateX(-10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes bounce {
  0% {
    -moz-transform: translateY(0); }
  20% {
    -moz-transform: translateY(0); }
  40% {
    -moz-transform: translateY(-30px); }
  50% {
    -moz-transform: translateY(0); }
  60% {
    -moz-transform: translateY(-15px); }
  80% {
    -moz-transform: translateY(0); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes shake {
  0% {
    -moz-transform: translateX(0); }
  10% {
    -moz-transform: translateX(-10px); }
  20% {
    -moz-transform: translateX(10px); }
  30% {
    -moz-transform: translateX(-10px); }
  40% {
    -moz-transform: translateX(10px); }
  50% {
    -moz-transform: translateX(-10px); }
  60% {
    -moz-transform: translateX(10px); }
  70% {
    -moz-transform: translateX(-10px); }
  80% {
    -moz-transform: translateX(10px); }
  90% {
    -moz-transform: translateX(-10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes rotateInDownLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInUpLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInUpRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInDownRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateIn {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes tada {
  0% {
    -moz-transform: scale(1); }
  10% {
    -moz-transform: scale(0.9) rotate(-3deg); }
  20% {
    -moz-transform: scale(0.9) rotate(-3deg); }
  30% {
    -moz-transform: scale(1.1) rotate(3deg); }
  40% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  50% {
    -moz-transform: scale(1.1) rotate(3deg); }
  60% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  70% {
    -moz-transform: scale(1.1) rotate(3deg); }
  80% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  90% {
    -moz-transform: scale(1.1) rotate(3deg); }
  100% {
    -moz-transform: scale(1) rotate(0); } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes fadeInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(20px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(20px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes bounceIn {
  0% {
    opacity: 0;
    -ms-transform: scale(0.3); }
  50% {
    opacity: 1;
    -ms-transform: scale(1.05); }
  70% {
    -ms-transform: scale(0.9); }
  100% {
    -ms-transform: scale(1); } }
@-ms-keyframes bounceInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateY(30px); }
  80% {
    -ms-transform: translateY(-10px); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes bounceInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateY(-30px); }
  80% {
    -ms-transform: translateY(10px); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes bounceInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateX(-30px); }
  80% {
    -ms-transform: translateX(10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateX(30px); }
  80% {
    -ms-transform: translateX(-10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes bounce {
  0% {
    -ms-transform: translateY(0); }
  20% {
    -ms-transform: translateY(0); }
  40% {
    -ms-transform: translateY(-30px); }
  50% {
    -ms-transform: translateY(0); }
  60% {
    -ms-transform: translateY(-15px); }
  80% {
    -ms-transform: translateY(0); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes shake {
  0% {
    -ms-transform: translateX(0); }
  10% {
    -ms-transform: translateX(-10px); }
  20% {
    -ms-transform: translateX(10px); }
  30% {
    -ms-transform: translateX(-10px); }
  40% {
    -ms-transform: translateX(10px); }
  50% {
    -ms-transform: translateX(-10px); }
  60% {
    -ms-transform: translateX(10px); }
  70% {
    -ms-transform: translateX(-10px); }
  80% {
    -ms-transform: translateX(10px); }
  90% {
    -ms-transform: translateX(-10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes rotateInDownLeft {
  0% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInUpLeft {
  0% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInUpRight {
  0% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInDownRight {
  0% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateIn {
  0% {
    -ms-transform-origin: center center;
    -ms-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: center center;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes tada {
  0% {
    -ms-transform: scale(1); }
  10% {
    -ms-transform: scale(0.9) rotate(-3deg); }
  20% {
    -ms-transform: scale(0.9) rotate(-3deg); }
  30% {
    -ms-transform: scale(1.1) rotate(3deg); }
  40% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  50% {
    -ms-transform: scale(1.1) rotate(3deg); }
  60% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  70% {
    -ms-transform: scale(1.1) rotate(3deg); }
  80% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  90% {
    -ms-transform: scale(1.1) rotate(3deg); }
  100% {
    -ms-transform: scale(1) rotate(0); } }
@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(20px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-20px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    transform: translateY(2000px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    transform: translateX(2000px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3); }
  50% {
    opacity: 1;
    transform: scale(1.05); }
  70% {
    transform: scale(0.9); }
  100% {
    transform: scale(1); } }
@keyframes bounceInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }
  60% {
    opacity: 1;
    transform: translateY(30px); }
  80% {
    transform: translateY(-10px); }
  100% {
    transform: translateY(0); } }
@keyframes bounceInUp {
  0% {
    opacity: 0;
    transform: translateY(2000px); }
  60% {
    opacity: 1;
    transform: translateY(-30px); }
  80% {
    transform: translateY(10px); }
  100% {
    transform: translateY(0); } }
@keyframes bounceInRight {
  0% {
    opacity: 0;
    transform: translateX(2000px); }
  60% {
    opacity: 1;
    transform: translateX(-30px); }
  80% {
    transform: translateX(10px); }
  100% {
    transform: translateX(0); } }
@keyframes bounceInLeft {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }
  60% {
    opacity: 1;
    transform: translateX(30px); }
  80% {
    transform: translateX(-10px); }
  100% {
    transform: translateX(0); } }
@keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes bounce {
  0% {
    transform: translateY(0); }
  20% {
    transform: translateY(0); }
  40% {
    transform: translateY(-30px); }
  50% {
    transform: translateY(0); }
  60% {
    transform: translateY(-15px); }
  80% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }
@keyframes shake {
  0% {
    transform: translateX(0); }
  10% {
    transform: translateX(-10px); }
  20% {
    transform: translateX(10px); }
  30% {
    transform: translateX(-10px); }
  40% {
    transform: translateX(10px); }
  50% {
    transform: translateX(-10px); }
  60% {
    transform: translateX(10px); }
  70% {
    transform: translateX(-10px); }
  80% {
    transform: translateX(10px); }
  90% {
    transform: translateX(-10px); }
  100% {
    transform: translateX(0); } }
@keyframes rotateInDownLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(-90deg);
    opacity: 0; }
  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInUpLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(90deg);
    opacity: 0; }
  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInUpRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(-90deg);
    opacity: 0; }
  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInDownRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(90deg);
    opacity: 0; }
  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateIn {
  0% {
    transform-origin: center center;
    transform: rotate(-200deg);
    opacity: 0; }
  100% {
    transform-origin: center center;
    transform: rotate(0);
    opacity: 1; } }
@keyframes tada {
  0% {
    transform: scale(1); }
  10% {
    transform: scale(0.9) rotate(-3deg); }
  20% {
    transform: scale(0.9) rotate(-3deg); }
  30% {
    transform: scale(1.1) rotate(3deg); }
  40% {
    transform: scale(1.1) rotate(-3deg); }
  50% {
    transform: scale(1.1) rotate(3deg); }
  60% {
    transform: scale(1.1) rotate(-3deg); }
  70% {
    transform: scale(1.1) rotate(3deg); }
  80% {
    transform: scale(1.1) rotate(-3deg); }
  90% {
    transform: scale(1.1) rotate(3deg); }
  100% {
    transform: scale(1) rotate(0); } }
.trip-block {
  display: none;
  padding: 8px;
  position: absolute;
  text-align: center;
  min-width: 100px;
  border-radius: 3px; }
  .trip-block:before {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute; }
  .trip-block.n:before, .trip-block.s:before {
    border-width: 8px;
    left: 50%;
    margin-left: -8px; }
  .trip-block.e:before, .trip-block.w:before {
    border-width: 8px;
    top: 50%;
    margin-top: -8px; }
  .trip-block.n:before {
    top: 100%; }
  .trip-block.s:before {
    bottom: 100%; }
  .trip-block.e:before {
    right: 100%; }
  .trip-block.w:before {
    left: 100%; }
  .trip-block.screen-ne, .trip-block.screen-se, .trip-block.screen-sw, .trip-block.screen-nw, .trip-block.screen-center {
    position: fixed; }

.trip-block.animated.flash {
  -moz-animation: flash 0.5s 0s ease both;
  -webkit-animation: flash 0.5s 0s ease both;
  animation: flash 0.5s 0s ease both; }
.trip-block.animated.bounce {
  -moz-animation: bounce 0.5s 0s ease both;
  -webkit-animation: bounce 0.5s 0s ease both;
  animation: bounce 0.5s 0s ease both; }
.trip-block.animated.shake {
  -moz-animation: shake 0.5s 0s ease both;
  -webkit-animation: shake 0.5s 0s ease both;
  animation: shake 0.5s 0s ease both; }
.trip-block.animated.tada {
  -moz-animation: tada 0.5s 0s ease both;
  -webkit-animation: tada 0.5s 0s ease both;
  animation: tada 0.5s 0s ease both; }
.trip-block.animated.fadeIn {
  -moz-animation: fadeIn 0.5s 0s ease both;
  -webkit-animation: fadeIn 0.5s 0s ease both;
  animation: fadeIn 0.5s 0s ease both; }
.trip-block.animated.fadeInUp {
  -moz-animation: fadeInUp 0.5s 0s ease both;
  -webkit-animation: fadeInUp 0.5s 0s ease both;
  animation: fadeInUp 0.5s 0s ease both; }
.trip-block.animated.fadeInDown {
  -moz-animation: fadeInDown 0.5s 0s ease both;
  -webkit-animation: fadeInDown 0.5s 0s ease both;
  animation: fadeInDown 0.5s 0s ease both; }
.trip-block.animated.fadeInLeft {
  -moz-animation: fadeInLeft 0.5s 0s ease both;
  -webkit-animation: fadeInLeft 0.5s 0s ease both;
  animation: fadeInLeft 0.5s 0s ease both; }
.trip-block.animated.fadeInRight {
  -moz-animation: fadeInRight 0.5s 0s ease both;
  -webkit-animation: fadeInRight 0.5s 0s ease both;
  animation: fadeInRight 0.5s 0s ease both; }
.trip-block.animated.fadeInUpBig {
  -moz-animation: fadeInUpBig 0.5s 0s ease both;
  -webkit-animation: fadeInUpBig 0.5s 0s ease both;
  animation: fadeInUpBig 0.5s 0s ease both; }
.trip-block.animated.fadeInDownBig {
  -moz-animation: fadeInDownBig 0.5s 0s ease both;
  -webkit-animation: fadeInDownBig 0.5s 0s ease both;
  animation: fadeInDownBig 0.5s 0s ease both; }
.trip-block.animated.fadeInLeftBig {
  -moz-animation: fadeInLeftBig 0.5s 0s ease both;
  -webkit-animation: fadeInLeftBig 0.5s 0s ease both;
  animation: fadeInLeftBig 0.5s 0s ease both; }
.trip-block.animated.fadeInRightBig {
  -moz-animation: fadeInRightBig 0.5s 0s ease both;
  -webkit-animation: fadeInRightBig 0.5s 0s ease both;
  animation: fadeInRightBig 0.5s 0s ease both; }
.trip-block.animated.bounceIn {
  -moz-animation: bounceIn 0.5s 0s ease both;
  -webkit-animation: bounceIn 0.5s 0s ease both;
  animation: bounceIn 0.5s 0s ease both; }
.trip-block.animated.bounceInDown {
  -moz-animation: bounceInDown 0.5s 0s ease both;
  -webkit-animation: bounceInDown 0.5s 0s ease both;
  animation: bounceInDown 0.5s 0s ease both; }
.trip-block.animated.bounceInUp {
  -moz-animation: bounceInUp 0.5s 0s ease both;
  -webkit-animation: bounceInUp 0.5s 0s ease both;
  animation: bounceInUp 0.5s 0s ease both; }
.trip-block.animated.bounceInLeft {
  -moz-animation: bounceInLeft 0.5s 0s ease both;
  -webkit-animation: bounceInLeft 0.5s 0s ease both;
  animation: bounceInLeft 0.5s 0s ease both; }
.trip-block.animated.bounceInRight {
  -moz-animation: bounceInRight 0.5s 0s ease both;
  -webkit-animation: bounceInRight 0.5s 0s ease both;
  animation: bounceInRight 0.5s 0s ease both; }
.trip-block.animated.rotateIn {
  -moz-animation: rotateIn 0.5s 0s ease both;
  -webkit-animation: rotateIn 0.5s 0s ease both;
  animation: rotateIn 0.5s 0s ease both; }
.trip-block.animated.rotateInDownLeft {
  -moz-animation: rotateInDownLeft 0.5s 0s ease both;
  -webkit-animation: rotateInDownLeft 0.5s 0s ease both;
  animation: rotateInDownLeft 0.5s 0s ease both; }
.trip-block.animated.rotateInDownRight {
  -moz-animation: rotateInDownRight 0.5s 0s ease both;
  -webkit-animation: rotateInDownRight 0.5s 0s ease both;
  animation: rotateInDownRight 0.5s 0s ease both; }
.trip-block.animated.rotateInUpLeft {
  -moz-animation: rotateInUpLeft 0.5s 0s ease both;
  -webkit-animation: rotateInUpLeft 0.5s 0s ease both;
  animation: rotateInUpLeft 0.5s 0s ease both; }
.trip-block.animated.rotateInUpRight {
  -moz-animation: rotateInUpRight 0.5s 0s ease both;
  -webkit-animation: rotateInUpRight 0.5s 0s ease both;
  animation: rotateInUpRight 0.5s 0s ease both; }

.trip-close {
  font-size: 80%;
  float: right;
  margin-top: -5px; }
  .trip-close:hover {
    text-decoration: none; }

.trip-content {
  clear: right; }

.trip-progress-bar {
  height: 1px;
  background-color: #444;
  width: 0; }

.trip-overlay {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  background: black;
  width: 100%;
  height: 100%;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7; }

.trip-prev, .trip-next {
  padding: 5px 10px; }

/*
 *  TODO:
 *  implement with more details later
 */
.trip-exposed {
  background: white; }

.trip-block.black {
  background: #333;
  color: #DDD;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0; }
  .trip-block.black .trip-close {
    color: #ddd; }
    .trip-block.black .trip-close:hover {
      color: #fff; }
  .trip-block.black.n:before {
    border-top-color: #333; }
  .trip-block.black.s:before {
    border-bottom-color: #333; }
  .trip-block.black.e:before {
    border-right-color: #333; }
  .trip-block.black.w:before {
    border-left-color: #333; }

.trip-block.white {
  background: #fff;
  color: #333; }
  .trip-block.white .trip-close {
    color: #333; }
    .trip-block.white .trip-close:hover {
      color: #000; }
  .trip-block.white.n:before {
    border-top-color: #fff; }
  .trip-block.white.s:before {
    border-bottom-color: #fff; }
  .trip-block.white.e:before {
    border-right-color: #fff; }
  .trip-block.white.w:before {
    border-left-color: #fff; }

.trip-overlay.yeti {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2; }

.trip-block.yeti {
  padding: 0px;
  background: #008cba;
  color: #fff;
  -moz-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0; }
  .trip-block.yeti.n:before {
    margin-top: -1px;
    border-top-color: #008cba; }
  .trip-block.yeti.s:before {
    border-bottom-color: #006687; }
  .trip-block.yeti.e:before {
    border-right-color: #008cba; }
  .trip-block.yeti.w:before {
    border-left-color: #008cba; }
  .trip-block.yeti .trip-header {
    position: relative;
    font-size: 18px;
    background: #006687;
    margin: 0px;
    border-radius: 3px 3px 0px 0px;
    padding: 5px; }
  .trip-block.yeti .trip-content {
    font-size: 12px;
    padding: 15px;
    max-width: 450px; }
  .trip-block.yeti .trip-close {
    right: 0px;
    top: 0px;
    margin: 3px 8px 0px 0px;
    color: #fff;
    font-size: 16px; }
    .trip-block.yeti .trip-close:hover {
      color: #000; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev,
  .trip-block.yeti .trip-progress-wrapper .trip-next {
    font-size: 12px;
    color: #fff; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev:hover,
  .trip-block.yeti .trip-progress-wrapper .trip-next:hover {
    background: #006687; }
  .trip-block.yeti .trip-progress-wrapper .trip-next {
    float: right;
    border-radius: 0px 0px 5px 0px; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev {
    display: none;
    float: left;
    border-radius: 0px 0px 0px 5px; }

.trip-overlay.dark {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2; }

.trip-block.dark {
  background: #333;
  padding: 0;
  color: #fff;
  -moz-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=92);
  opacity: 0.92; }
  .trip-block.dark.n:before {
    margin-top: -1px;
    border-top-color: #333; }
  .trip-block.dark.s:before {
    border-bottom-color: #555; }
  .trip-block.dark.e:before {
    border-right-color: #333; }
  .trip-block.dark.w:before {
    border-left-color: #333; }
  .trip-block.dark .trip-header {
    position: relative;
    font-size: 16px;
    background: #555;
    margin: 0;
    border-radius: 3px 3px 0px 0px;
    padding: 5px; }
  .trip-block.dark .trip-content {
    font-size: 12px;
    padding: 1em;
    max-width: 450px; }
  .trip-block.dark .trip-close {
    right: 0;
    top: 0;
    margin: 3px 8px 0 0;
    color: #fff;
    font-size: 16px; }
    .trip-block.dark .trip-close:hover {
      color: #000; }
  .trip-block.dark .trip-progress-wrapper .trip-prev,
  .trip-block.dark .trip-progress-wrapper .trip-next {
    font-size: 12px;
    color: #fff; }
  .trip-block.dark .trip-progress-wrapper .trip-prev:hover,
  .trip-block.dark .trip-progress-wrapper .trip-next:hover {
    background: #666; }
  .trip-block.dark .trip-progress-wrapper .trip-next {
    float: right;
    border-radius: 0px 0px 5px 0px; }
  .trip-block.dark .trip-progress-wrapper .trip-prev {
    display: none;
    float: left;
    border-radius: 0px 0px 0px 5px; }
  .trip-block.dark .trip-progress-wrapper .trip-progress-bar {
    background: green; }
    
    
    
 /* overwrite */   
.trip-content{font-size:11px;}
.trip-block.n::before, .trip-block.s::before{
    border-width:5px;
    margin-left:-5px;
}
.trip-block.black.e::before {border-right-color:#5c82cd;}
.trip-block.black.n::before {border-top-color:#5c82cd;}
.trip-block.black{
    background-color:#5c82cd;
    color:#f8f1eb;
    background: -webkit-radial-gradient(#5c82cd, #577cc3); /* Safari 5.1 to 6.0 */
    background: -o-radial-gradient(#5c82cd, #577cc3); /* For Opera 11.6 to 12.0 */
    background: -moz-radial-gradient(#5c82cd, #577cc3); /* For Firefox 3.6 to 15 */
    background: radial-gradient(#5c82cd, #577cc3);
    font-size:10px;
}
.trip-block.black a{text-decoration:none;}
.trip-block.black a.trip-prev,  .trip-block.black a.trip-next,  .trip-block.black a.trip-skip{
    color:#bfcff0;
    text-decoration:none;
    font-size:10px;
    line-height:18px;
}
.trip-block.black a.trip-prev:hover,  .trip-block.black a.trip-next:hover,  .trip-block.black a.trip-skip:hover{
      color:#4866a4;
  }
.trip-block.e::before, .trip-block.w::before {border-width:5px; margin-top:-5px;}
.trip-block.black .trip-close, .trip-block.black .trip-close:hover {
    color: #5c82cd;
    background: #fff;
    border-radius: 30px;
    font-size: 10px;
    width:12px;
    height:12px;
    line-height:1;
}
  
.editorCurrent {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    -moz-box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    box-shadow: 0px 0px 0px 1px rgba(127, 127, 127, 0.75);
    outline: none;
    min-height: 16px;
    display:inline-block;
    width:100%;
    margin-bottom:10px;
}

.editorCurrent:focus {
    -webkit-box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
    -moz-box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
    box-shadow: 0px 0px 0px 1px rgba(26, 219, 84, 0.75);
}

.editorCurrentActive {
    /* border:#5ad04f solid 2px; padding:2px 5px;*/
    
}

.focus {
    border: black dotted 2px;
}

.pointer {
    border: black solid 1px;
    background-color: #c9c9c9;
    /*border-left: black solid 1px;*/
}

.tableLine {
    border: black dotted 1px;
    /*border-left: black solid 1px;*/
}

.ui-selecting {
    background: #FECA40;
}

.ui-setselecting {
    background: green;
}

.ui-selectee {
    border: black dotted 1px;
}

.ui-selected {
    background: #F39814;
    color: white;
    opacity: 0.2;
}

.moveBlock {
    border: black dotted 1px;
    /*border-left: black solid 1px;*/
}

/* resize */
.layoutResize {
    position: absolute;
}

.borderResize {
    position: absolute;
    opacity: 0.5;
    border-style: dashed;
    border-width: 1px;
}

.pointBlock {
    position: absolute;
    border: black solid 1px;
    background-color: #FFFFFF;
    width: 8px;
    height: 8px;
    margin: -5;
    padding: 0;
    z-index: 100000;
}

.nwResize {
    margin: -5px;
    cursor: nw-resize;
}

.nResize {
    margin: -5px;
    cursor: n-resize;
}

.neResize {
    margin: -5px;
    cursor: ne-resize;
}

.wResize {
    margin: -5px;
    cursor: w-resize;
}

.eResize {
    margin: -5px;
    cursor: e-resize;
}

.swResize {
    margin: -5px;
    cursor: sw-resize;
}

.sResize {
    margin: -5px;
    cursor: s-resize;
}

.seResize {
    margin: -5px;
    cursor: se-resize;
}

/*end resize */

/*jotform*/
.jotForm {
    display: block;
    background: #ffffff url(../theme/default/images/jotform.jpg) no-repeat
        center center;
}

.onlineForm {
    display: block;
    background: #ffffff url(../theme/default/images/jotform.jpg) no-repeat
        center center;
}

.onlineFlash {
    display: block;
    background: #ffffff url(../theme/default/images/onlineFlash.jpg)
        no-repeat center center;
}

.jotFormLoad {
    display: block;
    background: #ffffff url(../theme/default/images/loading07.gif) no-repeat
        center center;
}

.fbLikebox {
    background: #ffffff url(../theme/default/images/fblikebox.png) no-repeat
        center center;
}

.fbpageplugin {
    background: #ffffff url(../theme/default/images/fblikebox.png) no-repeat
        center center;
}

/*************  Start socialnetwork  ***************/
.fb_comment_light, .fb_comment_dark  {
    display: inline-block; 
    width: 564px;
    height:301px;
    border:0;
}
.fb_comment_light  {
    background: url(../theme/default/images/comment_light.png) no-repeat left top;
}
.fb_comment_dark  {
    background: url(../theme/default/images/comment_dark.png) no-repeat left top;
}
.fb_light_likebox, .fb_dark_likebox {
    display: inline-block;
    width: 300px;
    border:0;
}
.fb_light_likebox{
    background: url(../theme/default/images/light_like_box.png) no-repeat 10px 7px;
}
.fb_dark_likebox{
    background: url(../theme/default/images/dark_like_box.png) no-repeat center center;
}
.fb_light_standard, .fb_dark_standard{
    display: inline-block;
    width: 351px;
    height: 20px;
    border:0;
}
.fb_light_standard{    
    background:  url(../theme/default/images/light_standard.png) no-repeat left top;    
}
.fb_dark_standard{
    background: url(../theme/default/images/dark_standard.png) no-repeat left top;
}
.fb_light_box_count, .fb_dark_box_count {
    display:block;
    width:49px;
    height: 86px;
    border:0;
}
.fb_light_box_count{    
    background: url(../theme/default/images/light_box_count.png) no-repeat left top;
}
.fb_dark_box_count{    
    background: url(../theme/default/images/dark_box_count.png) no-repeat left top;
}
.fb_light_button_count, .fb_dark_button_count { 
    display:block;
    width: 86px;
    height: 20px;
    border:0;
}
.fb_light_button_count{    
    background: url(../theme/default/images/light_button_count.png) no-repeat left top;
}
.fb_dark_button_count{
    background: url(../theme/default/images/dark_button_count.png) no-repeat left top;
}
.fbmargin{
    margin-bottom:15px;
}

.tableSelecttemplate {
    background-color: #e5e5e5;
    border-top: 1px solid #a1a1a1;
    border-bottom: 1px solid #a1a1a1;
    min-width: 960px;
}

.frameaddblock,.frameaddblockSide {
    background: #fff;
    border: 1px solid #3f3f3f;
    cursor: pointer;
    padding: 0;
    margin: 5px;
    text-align: center;
}

.frameaddblock:hover,.frameaddblockSide:hover {
    border: 1px solid #4c4c4c;
}

input.btnblockAdd,input.btnblockAdd:hover {
    /*background: url(../theme/default/images/icn_addblock.jpg);
    background-repeat: no-repeat;
    background-position: center;*/
    background-color:#fff;
    width: 100%;
    height: 30px;
    border: 0;
    cursor: pointer;
    background-color: #fff;
    text-align: center;
}

input.btnblockAdd:hover {
    /*background: url(../theme/default/images/icn_addblock_h.jpg);
    background-repeat: no-repeat;
    background-position: center;*/
    background-color: #fff;
}

.txtblockname {
    padding: 0;
    text-align: left;
    margin: 0;
}

.bgblockTop,.bgblockBottom,.bgblockSide {
    background-color: #535353;
    border: 1px dotted #fff !important;
    margin: 0 10px 0 5px;
}
.bgblockSide {
    margin: 0;
}

.blockAvaliable,.blockmanageTop,.blockmanageBottom,.blockmanageLeft,.blockmanageRight
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.blockAvaliable {
    height: auto;
    color: #3e3e3e;
    min-height: 480px;
    margin: 0;
    border: 1px solid #fff;
    background-color: #fff;
    width:246px;
}
.titleBlockAvaliable{
    background-color: #6ca062;
    color:#fff;
    padding:12px;
}

.blockmanageTop,.blockmanageBottom {
    width: 100%;
    height: 60px;
}

.blockmanageLeft,.blockmanageRight {
    width: 200px;
    height: auto;
}

ul.blockmanageTop li,ul.blockmanageBottom li {
    width: 100%;
    float: left;
    margin: 3px 0;
}

#sortable2 li.ui-state-highlight {
    padding: 0;
}

#sortable1 li.blocklist,#sortable2 li.blocklist {
    width: 866px;
    padding: 10px;
    margin: 5px 5px 0 5px;
    /*cursor: move;*/
    display: block;
    list-style: none;
    background:#e2e2e2;
    border:1px solid #999;
    min-height: 30px;
    }
/*#sortable1 li.blocklist:hover,#sortable2 li.blocklist:hover{
    background:#000;
    z-index:99;
}*/

#sortable3 li.blocklist,#sortable4 li.blocklist,#sortable0 li.blocklist
    {
    display: block;
    float: none;
    /*cursor: move;*/
    width: auto;
    padding: 10px;
    margin: 5px 5px 0 5px;
    background:#e2e2e2;
    border:1px solid #999;
    min-height: 30px;
    }
/*#sortable3 li.blocklist:hover,#sortable4 li.blocklist:hover,#sortable0 li.blocklist:hover{
    background:#000;
}*/

li.blocklist div.block_editor {
    margin: 0;
    padding: 0;
    width: 100%;
    word-wrap:break-word;
    cursor:auto;
    float:left;
}
li.blocklist div.blockName{margin-top: 7px;float:none;}
li.blocklist div a{color:#006fdd;}
li.blocklist div a:hover{color:#004edd;}

li.blocklist:hover{background-color:#000;}

.block_data_roll {
    background-color: #f7f7f7;
    color: #6d6d6d;
    border: 1px solid #d2d2d2;
    padding: 15px;
    margin-bottom: 7px;
}

.bgblockview {
    background-color: #e9e9e9;
    padding: 7px;
}

.bgblockname {
    background-color: #f7f7f7;
    color: #6d6d6d;
    border: 1px solid #d2d2d2;
    padding: 15px;
    margin-bottom: 7px;
}

.ui-sortable-placeholder {
    border: 1px dotted black;
    visibility: visible !important;
}
.blockName{word-wrap:break-word;}
.blockName input {
    border: 1px solid #ccc;
    margin: 0 0 5px 0;
    width:165px;
}

a.linktxt,a.linktxt:hover {
    margin-top: 2px;
    font-size: 11px;
    text-decoration: none;
    cursor: pointer;
}

a.linktxt,a.linktxt img {
    margin-top: 3px;
}

a.linktxt:hover {
    text-decoration: underline;
}

.rvclear {
    clear: both;
}

.txteditable {
    margin: 5px;
    padding: 5px;
    font-size: 11px;
    text-align: center;
}

[contentEditable=true]:empty:before {
    content: attr(data-ph);
    color: #c0c0c0;
    font-size:12px;
    padding-left:7px;
    line-height:24px;
}

.addBlockLink {
    color: #61ac5b;
    margin-top: 5px;
    margin-bottom: 5px;
    cursor: pointer;
    font-family:Verdana;
    font-size: 14px;
}
.addBlockLink img{padding-right:5px;}

.areaCustom {
    margin-top: 0px;
    margin-bottom: 10px;
    min-height: 25px;
}

.ui-resizable-e {
    width:7px;
    cursor:e-resize;
}
.ui-resizable-s {
    height:7px;
    cursor:s-resize;
}
.titlePagelayout{
    font-size:13px;
    line-height:22px;
    background:#fff url(../theme/default/images/icon_info.png) no-repeat 10px 10px; 
    margin:3px 0 5px 5px; 
    padding:10px;
}
.titlePagelayout .info_message{
    color:#494949;
    padding-left:28px;
}

/*Layout mode*/
li.ui-state-highlight.blocklist:not(.ui-state-disabled):hover {
    background: black
        url(../theme/default/images/iconlayout/normal_move.png)
        no-repeat 99.7% 7% !important;
    cursor:move;
}

li.blocklist:not(.ui-state-disabled) > a > img {
    height:16px;
    width:16px;
}

div.block_editor.editorCurrent{
    background-color:white !important;
}
.bodybackgroundBlackonlayout{
    background-color:rgba(0, 0, 0, 0.95) !important;
}

li.ui-state-highlight.blocklist > a.linktxt > img:not([title=Close]):hover{
  opacity: 0.6;
}
li.ui-state-highlights.blocklist > a.linktxt > img:not([title=Close]):hover{
  opacity: 0.6;
}

.brdgridBlock{
    background-color: #000;
    float: right;
    border-top-left-radius: 8px 8px;
    border-top-right-radius: 8px 8px;
    padding: 4px;
    display: block;
    position: relative;
    top: -25px;
    height: 21px;
}

button.nextButton,
button.backButton,
button.parentButton,
button.childButton,
button.pasteButton,
button.copyButton{
    background-image:url(../theme/default/images/sprite_wys_gridline.png);
    background-repeat:no-repeat;
    background-position:0 0;
    background-color:#000;
    width:20px;
    height:25px;
    cursor:pointer;
    border:0;
    padding:0;
    margin:0;
}
button.nextButton:hover{background-position:-30px 0;}
button.nextButton-dis{background-position:-60px 0;} 

button.backButton{background-position:0 -30px;}
button.backButton:hover{background-position:-30px -30px;}
button.backButton-dis{background-position:-60px -30px;}



button.parentButton{background-position:0 -60px;}
button.parentButton:hover{background-position:-30px -60px;}
button.parentButton-dis{background-position:-60px -60px;}

button.childButton{background-position:0 -90px;}
button.childButton:hover{background-position:-30px -90px;}
button.childButton-dis{background-position:-60px -90px;}

button.pasteButton{background-position:0 -120px;}
button.pasteButton:hover{background-position:-30px -120px;}
button.pasteButton-dis{background-position:-60px -120px;}

button.copyButton{background-position:0 -150px;}
button.copyButton:hover{background-position:-30px -150px;}
button.copyButton-dis{background-position:-60px -150px;}

div.editorCurrent div, div.editorCurrent p{
    padding-top:0 !important;
    margin-right:-2px !important;
}
.Glvgn{
    position: relative;
    float:right;
    top : -25px;
    top:0 !important;
    }
.SelectGrid{
    background-color: rgba(0, 0, 255, 0.3);
}
/* ---------------------- End GridLine ---------------------- */


@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }
@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.3); }
  50% {
    opacity: 1;
    -webkit-transform: scale(1.05); }
  70% {
    -webkit-transform: scale(0.9); }
  100% {
    -webkit-transform: scale(1); } }
@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateY(30px); }
  80% {
    -webkit-transform: translateY(-10px); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px); }
  80% {
    -webkit-transform: translateY(10px); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px); }
  80% {
    -webkit-transform: translateX(10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -webkit-transform: translateX(30px); }
  80% {
    -webkit-transform: translateX(-10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes bounce {
  0% {
    -webkit-transform: translateY(0); }
  20% {
    -webkit-transform: translateY(0); }
  40% {
    -webkit-transform: translateY(-30px); }
  50% {
    -webkit-transform: translateY(0); }
  60% {
    -webkit-transform: translateY(-15px); }
  80% {
    -webkit-transform: translateY(0); }
  100% {
    -webkit-transform: translateY(0); } }
@-webkit-keyframes shake {
  0% {
    -webkit-transform: translateX(0); }
  10% {
    -webkit-transform: translateX(-10px); }
  20% {
    -webkit-transform: translateX(10px); }
  30% {
    -webkit-transform: translateX(-10px); }
  40% {
    -webkit-transform: translateX(10px); }
  50% {
    -webkit-transform: translateX(-10px); }
  60% {
    -webkit-transform: translateX(10px); }
  70% {
    -webkit-transform: translateX(-10px); }
  80% {
    -webkit-transform: translateX(10px); }
  90% {
    -webkit-transform: translateX(-10px); }
  100% {
    -webkit-transform: translateX(0); } }
@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0);
    opacity: 1; } }
@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1); }
  10% {
    -webkit-transform: scale(0.9) rotate(-3deg); }
  20% {
    -webkit-transform: scale(0.9) rotate(-3deg); }
  30% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  40% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  50% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  60% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  70% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  80% {
    -webkit-transform: scale(1.1) rotate(-3deg); }
  90% {
    -webkit-transform: scale(1.1) rotate(3deg); }
  100% {
    -webkit-transform: scale(1) rotate(0); } }
@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(20px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }
@-moz-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }
@-moz-keyframes bounceIn {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3); }
  50% {
    opacity: 1;
    -moz-transform: scale(1.05); }
  70% {
    -moz-transform: scale(0.9); }
  100% {
    -moz-transform: scale(1); } }
@-moz-keyframes bounceInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateY(30px); }
  80% {
    -moz-transform: translateY(-10px); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes bounceInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateY(-30px); }
  80% {
    -moz-transform: translateY(10px); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes bounceInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateX(-30px); }
  80% {
    -moz-transform: translateX(10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -moz-transform: translateX(30px); }
  80% {
    -moz-transform: translateX(-10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-moz-keyframes bounce {
  0% {
    -moz-transform: translateY(0); }
  20% {
    -moz-transform: translateY(0); }
  40% {
    -moz-transform: translateY(-30px); }
  50% {
    -moz-transform: translateY(0); }
  60% {
    -moz-transform: translateY(-15px); }
  80% {
    -moz-transform: translateY(0); }
  100% {
    -moz-transform: translateY(0); } }
@-moz-keyframes shake {
  0% {
    -moz-transform: translateX(0); }
  10% {
    -moz-transform: translateX(-10px); }
  20% {
    -moz-transform: translateX(10px); }
  30% {
    -moz-transform: translateX(-10px); }
  40% {
    -moz-transform: translateX(10px); }
  50% {
    -moz-transform: translateX(-10px); }
  60% {
    -moz-transform: translateX(10px); }
  70% {
    -moz-transform: translateX(-10px); }
  80% {
    -moz-transform: translateX(10px); }
  90% {
    -moz-transform: translateX(-10px); }
  100% {
    -moz-transform: translateX(0); } }
@-moz-keyframes rotateInDownLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInUpLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInUpRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateInDownRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes rotateIn {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0);
    opacity: 1; } }
@-moz-keyframes tada {
  0% {
    -moz-transform: scale(1); }
  10% {
    -moz-transform: scale(0.9) rotate(-3deg); }
  20% {
    -moz-transform: scale(0.9) rotate(-3deg); }
  30% {
    -moz-transform: scale(1.1) rotate(3deg); }
  40% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  50% {
    -moz-transform: scale(1.1) rotate(3deg); }
  60% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  70% {
    -moz-transform: scale(1.1) rotate(3deg); }
  80% {
    -moz-transform: scale(1.1) rotate(-3deg); }
  90% {
    -moz-transform: scale(1.1) rotate(3deg); }
  100% {
    -moz-transform: scale(1) rotate(0); } }
@-ms-keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes fadeInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(20px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-20px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(20px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateY(0); } }
@-ms-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px); }
  100% {
    opacity: 1;
    -ms-transform: translateX(0); } }
@-ms-keyframes bounceIn {
  0% {
    opacity: 0;
    -ms-transform: scale(0.3); }
  50% {
    opacity: 1;
    -ms-transform: scale(1.05); }
  70% {
    -ms-transform: scale(0.9); }
  100% {
    -ms-transform: scale(1); } }
@-ms-keyframes bounceInDown {
  0% {
    opacity: 0;
    -ms-transform: translateY(-2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateY(30px); }
  80% {
    -ms-transform: translateY(-10px); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes bounceInUp {
  0% {
    opacity: 0;
    -ms-transform: translateY(2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateY(-30px); }
  80% {
    -ms-transform: translateY(10px); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes bounceInRight {
  0% {
    opacity: 0;
    -ms-transform: translateX(2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateX(-30px); }
  80% {
    -ms-transform: translateX(10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -ms-transform: translateX(-2000px); }
  60% {
    opacity: 1;
    -ms-transform: translateX(30px); }
  80% {
    -ms-transform: translateX(-10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-ms-keyframes bounce {
  0% {
    -ms-transform: translateY(0); }
  20% {
    -ms-transform: translateY(0); }
  40% {
    -ms-transform: translateY(-30px); }
  50% {
    -ms-transform: translateY(0); }
  60% {
    -ms-transform: translateY(-15px); }
  80% {
    -ms-transform: translateY(0); }
  100% {
    -ms-transform: translateY(0); } }
@-ms-keyframes shake {
  0% {
    -ms-transform: translateX(0); }
  10% {
    -ms-transform: translateX(-10px); }
  20% {
    -ms-transform: translateX(10px); }
  30% {
    -ms-transform: translateX(-10px); }
  40% {
    -ms-transform: translateX(10px); }
  50% {
    -ms-transform: translateX(-10px); }
  60% {
    -ms-transform: translateX(10px); }
  70% {
    -ms-transform: translateX(-10px); }
  80% {
    -ms-transform: translateX(10px); }
  90% {
    -ms-transform: translateX(-10px); }
  100% {
    -ms-transform: translateX(0); } }
@-ms-keyframes rotateInDownLeft {
  0% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInUpLeft {
  0% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: left bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInUpRight {
  0% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(-90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateInDownRight {
  0% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(90deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: right bottom;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes rotateIn {
  0% {
    -ms-transform-origin: center center;
    -ms-transform: rotate(-200deg);
    opacity: 0; }
  100% {
    -ms-transform-origin: center center;
    -ms-transform: rotate(0);
    opacity: 1; } }
@-ms-keyframes tada {
  0% {
    -ms-transform: scale(1); }
  10% {
    -ms-transform: scale(0.9) rotate(-3deg); }
  20% {
    -ms-transform: scale(0.9) rotate(-3deg); }
  30% {
    -ms-transform: scale(1.1) rotate(3deg); }
  40% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  50% {
    -ms-transform: scale(1.1) rotate(3deg); }
  60% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  70% {
    -ms-transform: scale(1.1) rotate(3deg); }
  80% {
    -ms-transform: scale(1.1) rotate(-3deg); }
  90% {
    -ms-transform: scale(1.1) rotate(3deg); }
  100% {
    -ms-transform: scale(1) rotate(0); } }
@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(20px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-20px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    transform: translateY(2000px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }
  100% {
    opacity: 1;
    transform: translateY(0); } }
@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    transform: translateX(2000px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }
  100% {
    opacity: 1;
    transform: translateX(0); } }
@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3); }
  50% {
    opacity: 1;
    transform: scale(1.05); }
  70% {
    transform: scale(0.9); }
  100% {
    transform: scale(1); } }
@keyframes bounceInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }
  60% {
    opacity: 1;
    transform: translateY(30px); }
  80% {
    transform: translateY(-10px); }
  100% {
    transform: translateY(0); } }
@keyframes bounceInUp {
  0% {
    opacity: 0;
    transform: translateY(2000px); }
  60% {
    opacity: 1;
    transform: translateY(-30px); }
  80% {
    transform: translateY(10px); }
  100% {
    transform: translateY(0); } }
@keyframes bounceInRight {
  0% {
    opacity: 0;
    transform: translateX(2000px); }
  60% {
    opacity: 1;
    transform: translateX(-30px); }
  80% {
    transform: translateX(10px); }
  100% {
    transform: translateX(0); } }
@keyframes bounceInLeft {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }
  60% {
    opacity: 1;
    transform: translateX(30px); }
  80% {
    transform: translateX(-10px); }
  100% {
    transform: translateX(0); } }
@keyframes flash {
  0% {
    opacity: 1; }
  25% {
    opacity: 0; }
  50% {
    opacity: 1; }
  75% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes bounce {
  0% {
    transform: translateY(0); }
  20% {
    transform: translateY(0); }
  40% {
    transform: translateY(-30px); }
  50% {
    transform: translateY(0); }
  60% {
    transform: translateY(-15px); }
  80% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }
@keyframes shake {
  0% {
    transform: translateX(0); }
  10% {
    transform: translateX(-10px); }
  20% {
    transform: translateX(10px); }
  30% {
    transform: translateX(-10px); }
  40% {
    transform: translateX(10px); }
  50% {
    transform: translateX(-10px); }
  60% {
    transform: translateX(10px); }
  70% {
    transform: translateX(-10px); }
  80% {
    transform: translateX(10px); }
  90% {
    transform: translateX(-10px); }
  100% {
    transform: translateX(0); } }
@keyframes rotateInDownLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(-90deg);
    opacity: 0; }
  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInUpLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(90deg);
    opacity: 0; }
  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInUpRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(-90deg);
    opacity: 0; }
  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateInDownRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(90deg);
    opacity: 0; }
  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }
@keyframes rotateIn {
  0% {
    transform-origin: center center;
    transform: rotate(-200deg);
    opacity: 0; }
  100% {
    transform-origin: center center;
    transform: rotate(0);
    opacity: 1; } }
@keyframes tada {
  0% {
    transform: scale(1); }
  10% {
    transform: scale(0.9) rotate(-3deg); }
  20% {
    transform: scale(0.9) rotate(-3deg); }
  30% {
    transform: scale(1.1) rotate(3deg); }
  40% {
    transform: scale(1.1) rotate(-3deg); }
  50% {
    transform: scale(1.1) rotate(3deg); }
  60% {
    transform: scale(1.1) rotate(-3deg); }
  70% {
    transform: scale(1.1) rotate(3deg); }
  80% {
    transform: scale(1.1) rotate(-3deg); }
  90% {
    transform: scale(1.1) rotate(3deg); }
  100% {
    transform: scale(1) rotate(0); } }
.trip-block {
  display: none;
  padding: 8px;
  position: absolute;
  text-align: center;
  min-width: 100px;
  border-radius: 3px; }
  .trip-block:before {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute; }
  .trip-block.n:before, .trip-block.s:before {
    border-width: 8px;
    left: 50%;
    margin-left: -8px; }
  .trip-block.e:before, .trip-block.w:before {
    border-width: 8px;
    top: 50%;
    margin-top: -8px; }
  .trip-block.n:before {
    top: 100%; }
  .trip-block.s:before {
    bottom: 100%; }
  .trip-block.e:before {
    right: 100%; }
  .trip-block.w:before {
    left: 100%; }
  .trip-block.screen-ne, .trip-block.screen-se, .trip-block.screen-sw, .trip-block.screen-nw, .trip-block.screen-center {
    position: fixed; }

.trip-block.animated.flash {
  -moz-animation: flash 0.5s 0s ease both;
  -webkit-animation: flash 0.5s 0s ease both;
  animation: flash 0.5s 0s ease both; }
.trip-block.animated.bounce {
  -moz-animation: bounce 0.5s 0s ease both;
  -webkit-animation: bounce 0.5s 0s ease both;
  animation: bounce 0.5s 0s ease both; }
.trip-block.animated.shake {
  -moz-animation: shake 0.5s 0s ease both;
  -webkit-animation: shake 0.5s 0s ease both;
  animation: shake 0.5s 0s ease both; }
.trip-block.animated.tada {
  -moz-animation: tada 0.5s 0s ease both;
  -webkit-animation: tada 0.5s 0s ease both;
  animation: tada 0.5s 0s ease both; }
.trip-block.animated.fadeIn {
  -moz-animation: fadeIn 0.5s 0s ease both;
  -webkit-animation: fadeIn 0.5s 0s ease both;
  animation: fadeIn 0.5s 0s ease both; }
.trip-block.animated.fadeInUp {
  -moz-animation: fadeInUp 0.5s 0s ease both;
  -webkit-animation: fadeInUp 0.5s 0s ease both;
  animation: fadeInUp 0.5s 0s ease both; }
.trip-block.animated.fadeInDown {
  -moz-animation: fadeInDown 0.5s 0s ease both;
  -webkit-animation: fadeInDown 0.5s 0s ease both;
  animation: fadeInDown 0.5s 0s ease both; }
.trip-block.animated.fadeInLeft {
  -moz-animation: fadeInLeft 0.5s 0s ease both;
  -webkit-animation: fadeInLeft 0.5s 0s ease both;
  animation: fadeInLeft 0.5s 0s ease both; }
.trip-block.animated.fadeInRight {
  -moz-animation: fadeInRight 0.5s 0s ease both;
  -webkit-animation: fadeInRight 0.5s 0s ease both;
  animation: fadeInRight 0.5s 0s ease both; }
.trip-block.animated.fadeInUpBig {
  -moz-animation: fadeInUpBig 0.5s 0s ease both;
  -webkit-animation: fadeInUpBig 0.5s 0s ease both;
  animation: fadeInUpBig 0.5s 0s ease both; }
.trip-block.animated.fadeInDownBig {
  -moz-animation: fadeInDownBig 0.5s 0s ease both;
  -webkit-animation: fadeInDownBig 0.5s 0s ease both;
  animation: fadeInDownBig 0.5s 0s ease both; }
.trip-block.animated.fadeInLeftBig {
  -moz-animation: fadeInLeftBig 0.5s 0s ease both;
  -webkit-animation: fadeInLeftBig 0.5s 0s ease both;
  animation: fadeInLeftBig 0.5s 0s ease both; }
.trip-block.animated.fadeInRightBig {
  -moz-animation: fadeInRightBig 0.5s 0s ease both;
  -webkit-animation: fadeInRightBig 0.5s 0s ease both;
  animation: fadeInRightBig 0.5s 0s ease both; }
.trip-block.animated.bounceIn {
  -moz-animation: bounceIn 0.5s 0s ease both;
  -webkit-animation: bounceIn 0.5s 0s ease both;
  animation: bounceIn 0.5s 0s ease both; }
.trip-block.animated.bounceInDown {
  -moz-animation: bounceInDown 0.5s 0s ease both;
  -webkit-animation: bounceInDown 0.5s 0s ease both;
  animation: bounceInDown 0.5s 0s ease both; }
.trip-block.animated.bounceInUp {
  -moz-animation: bounceInUp 0.5s 0s ease both;
  -webkit-animation: bounceInUp 0.5s 0s ease both;
  animation: bounceInUp 0.5s 0s ease both; }
.trip-block.animated.bounceInLeft {
  -moz-animation: bounceInLeft 0.5s 0s ease both;
  -webkit-animation: bounceInLeft 0.5s 0s ease both;
  animation: bounceInLeft 0.5s 0s ease both; }
.trip-block.animated.bounceInRight {
  -moz-animation: bounceInRight 0.5s 0s ease both;
  -webkit-animation: bounceInRight 0.5s 0s ease both;
  animation: bounceInRight 0.5s 0s ease both; }
.trip-block.animated.rotateIn {
  -moz-animation: rotateIn 0.5s 0s ease both;
  -webkit-animation: rotateIn 0.5s 0s ease both;
  animation: rotateIn 0.5s 0s ease both; }
.trip-block.animated.rotateInDownLeft {
  -moz-animation: rotateInDownLeft 0.5s 0s ease both;
  -webkit-animation: rotateInDownLeft 0.5s 0s ease both;
  animation: rotateInDownLeft 0.5s 0s ease both; }
.trip-block.animated.rotateInDownRight {
  -moz-animation: rotateInDownRight 0.5s 0s ease both;
  -webkit-animation: rotateInDownRight 0.5s 0s ease both;
  animation: rotateInDownRight 0.5s 0s ease both; }
.trip-block.animated.rotateInUpLeft {
  -moz-animation: rotateInUpLeft 0.5s 0s ease both;
  -webkit-animation: rotateInUpLeft 0.5s 0s ease both;
  animation: rotateInUpLeft 0.5s 0s ease both; }
.trip-block.animated.rotateInUpRight {
  -moz-animation: rotateInUpRight 0.5s 0s ease both;
  -webkit-animation: rotateInUpRight 0.5s 0s ease both;
  animation: rotateInUpRight 0.5s 0s ease both; }

.trip-close {
  font-size: 80%;
  float: right;
  margin-top: -5px; }
  .trip-close:hover {
    text-decoration: none; }

.trip-content {
  clear: right; }

.trip-progress-bar {
  height: 1px;
  background-color: #444;
  width: 0; }

.trip-overlay {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  background: black;
  width: 100%;
  height: 100%;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7; }

.trip-prev, .trip-next {
  padding: 5px 10px; }

/*
 *  TODO:
 *  implement with more details later
 */
.trip-exposed {
  background: white; }

.trip-block.black {
  background: #333;
  color: #DDD;
  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0;
  box-shadow: rgba(0, 0, 0, 0.2) 0 2px 4px 0; }
  .trip-block.black .trip-close {
    color: #ddd; }
    .trip-block.black .trip-close:hover {
      color: #fff; }
  .trip-block.black.n:before {
    border-top-color: #333; }
  .trip-block.black.s:before {
    border-bottom-color: #333; }
  .trip-block.black.e:before {
    border-right-color: #333; }
  .trip-block.black.w:before {
    border-left-color: #333; }

.trip-block.white {
  background: #fff;
  color: #333; }
  .trip-block.white .trip-close {
    color: #333; }
    .trip-block.white .trip-close:hover {
      color: #000; }
  .trip-block.white.n:before {
    border-top-color: #fff; }
  .trip-block.white.s:before {
    border-bottom-color: #fff; }
  .trip-block.white.e:before {
    border-right-color: #fff; }
  .trip-block.white.w:before {
    border-left-color: #fff; }

.trip-overlay.yeti {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2; }

.trip-block.yeti {
  padding: 0px;
  background: #008cba;
  color: #fff;
  -moz-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0; }
  .trip-block.yeti.n:before {
    margin-top: -1px;
    border-top-color: #008cba; }
  .trip-block.yeti.s:before {
    border-bottom-color: #006687; }
  .trip-block.yeti.e:before {
    border-right-color: #008cba; }
  .trip-block.yeti.w:before {
    border-left-color: #008cba; }
  .trip-block.yeti .trip-header {
    position: relative;
    font-size: 18px;
    background: #006687;
    margin: 0px;
    border-radius: 3px 3px 0px 0px;
    padding: 5px; }
  .trip-block.yeti .trip-content {
    font-size: 12px;
    padding: 15px;
    max-width: 450px; }
  .trip-block.yeti .trip-close {
    right: 0px;
    top: 0px;
    margin: 3px 8px 0px 0px;
    color: #fff;
    font-size: 16px; }
    .trip-block.yeti .trip-close:hover {
      color: #000; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev,
  .trip-block.yeti .trip-progress-wrapper .trip-next {
    font-size: 12px;
    color: #fff; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev:hover,
  .trip-block.yeti .trip-progress-wrapper .trip-next:hover {
    background: #006687; }
  .trip-block.yeti .trip-progress-wrapper .trip-next {
    float: right;
    border-radius: 0px 0px 5px 0px; }
  .trip-block.yeti .trip-progress-wrapper .trip-prev {
    display: none;
    float: left;
    border-radius: 0px 0px 0px 5px; }

.trip-overlay.dark {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  opacity: 0.2; }

.trip-block.dark {
  background: #333;
  padding: 0;
  color: #fff;
  -moz-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  -webkit-box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  box-shadow: rgba(0, 0, 0, 0.39) 0 2px 2px 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=92);
  opacity: 0.92; }
  .trip-block.dark.n:before {
    margin-top: -1px;
    border-top-color: #333; }
  .trip-block.dark.s:before {
    border-bottom-color: #555; }
  .trip-block.dark.e:before {
    border-right-color: #333; }
  .trip-block.dark.w:before {
    border-left-color: #333; }
  .trip-block.dark .trip-header {
    position: relative;
    font-size: 16px;
    background: #555;
    margin: 0;
    border-radius: 3px 3px 0px 0px;
    padding: 5px; }
  .trip-block.dark .trip-content {
    font-size: 12px;
    padding: 1em;
    max-width: 450px; }
  .trip-block.dark .trip-close {
    right: 0;
    top: 0;
    margin: 3px 8px 0 0;
    color: #fff;
    font-size: 16px; }
    .trip-block.dark .trip-close:hover {
      color: #000; }
  .trip-block.dark .trip-progress-wrapper .trip-prev,
  .trip-block.dark .trip-progress-wrapper .trip-next {
    font-size: 12px;
    color: #fff; }
  .trip-block.dark .trip-progress-wrapper .trip-prev:hover,
  .trip-block.dark .trip-progress-wrapper .trip-next:hover {
    background: #666; }
  .trip-block.dark .trip-progress-wrapper .trip-next {
    float: right;
    border-radius: 0px 0px 5px 0px; }
  .trip-block.dark .trip-progress-wrapper .trip-prev {
    display: none;
    float: left;
    border-radius: 0px 0px 0px 5px; }
  .trip-block.dark .trip-progress-wrapper .trip-progress-bar {
    background: green; }
    
    
    
 /* overwrite */   
.trip-content{font-size:11px;}
.trip-block.n::before, .trip-block.s::before{
    border-width:5px;
    margin-left:-5px;
}
.trip-block.black.e::before {border-right-color:#5c82cd;}
.trip-block.black.n::before {border-top-color:#5c82cd;}
.trip-block.black{
    background-color:#5c82cd;
    color:#f8f1eb;
    background: -webkit-radial-gradient(#5c82cd, #577cc3); /* Safari 5.1 to 6.0 */
    background: -o-radial-gradient(#5c82cd, #577cc3); /* For Opera 11.6 to 12.0 */
    background: -moz-radial-gradient(#5c82cd, #577cc3); /* For Firefox 3.6 to 15 */
    background: radial-gradient(#5c82cd, #577cc3);
    font-size:10px;
}
.trip-block.black a{text-decoration:none;}
.trip-block.black a.trip-prev,  .trip-block.black a.trip-next,  .trip-block.black a.trip-skip{
    color:#bfcff0;
    text-decoration:none;
    font-size:10px;
    line-height:18px;
}
.trip-block.black a.trip-prev:hover,  .trip-block.black a.trip-next:hover,  .trip-block.black a.trip-skip:hover{
      color:#4866a4;
  }
.trip-block.e::before, .trip-block.w::before {border-width:5px; margin-top:-5px;}
.trip-block.black .trip-close, .trip-block.black .trip-close:hover {
    color: #5c82cd;
    background: #fff;
    border-radius: 30px;
    font-size: 10px;
    width:12px;
    height:12px;
    line-height:1;
}