/* CSS Rules that might potentially be used in the frontend or backend (eg widgets etc)
   Has a far-future Expires header for max cachability, so when edited you'll need to bump the version,
   see logic/lib/shared_css.inc
   */


/* IcoMoon Zes svg button font http://icomoon.io/app/ */
@font-face {
    font-family: 'IcoMoonZes';
    src:url('/interchange-5/en_US/IcoMoon/zes/fonts/zes.eot');
    src:url('/interchange-5/en_US/IcoMoon/zes/fonts/zes.eot?#iefix') format('embedded-opentype'),
    url('/interchange-5/en_US/IcoMoon/zes/fonts/zes.woff') format('woff'),
    url('/interchange-5/en_US/IcoMoon/zes/fonts/zes.ttf') format('truetype'),
    url('/interchange-5/en_US/IcoMoon/zes/fonts/zes.svg#zes') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
    font-family: 'IcoMoonZes';
    content: attr(data-icon);
    speak: none;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    margin-left:2px;
}

/* Modal popup styles, used in logic/ServerTag/templates/modal_popup.html */
.LB_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
    z-index: 90000001;
}

.LB_window {
    position: absolute;
    z-index: 90000002;
    background: #7290b6;
    color:#000000;
    display:none;
    -moz-box-shadow: 0px 0px 15px #888;
    box-shadow: 0px 0px 15px #888;
}

.LB_window #codebox {
    width: 420px;
    height: 80px;
    margin: 0 65px 15px 65px;
    border: 1px dotted #666;
    overflow: auto;
}
.LB_window label {
    margin: 0;
}
.LB_title {
    padding: 4px 10px 0;
    font-size: 14px ;
    font-weight: 600;
    font-family:  'Open Sans', Verdana, Sans-serif;
    color: #fff;
    overflow: none;
    white-space: nowrap;
}
.LB_minortitle {
    font-weight: normal;
    white-space: nowrap;
}
.LB_caption{
    height:25px;
    padding:10px 30px 10px 25px;
    float:left;
    width: 100%;
}

#LB_closeWindow{
    height:25px;
    padding:10px 25px 10px 0;
    float:right;
}

.LB_closeAjaxWindow{
    cursor: move;
    height: 26px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    padding:7px 10px 3px 0;
    margin-bottom:1px;
}

.LB_closeAjaxWindow a {
    cursor: pointer;
    position: absolute;
    top:2px;
    right: 6px;

}

.LB_closeButton:before {
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    font-family: IcoMoonZes;
    content: "\e1ad";
    color: #333;
    font-size: 9px;
}

.LB_content{
    text-align: left;
    overflow:auto;
    background: #fff;
    border: solid 1px #c0c0c0;
    border-bottom: none;
}

div .LB_content .LB_frame{
	height:99%;
    width:99%;
    display:block;
    -webkit-box-flex:1;
    -moz-box-flex:1;
    -ms-flex:1;
    box-flex:1;
}

.LB_content > div {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: box;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    box-orient: vertical;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

}

.LB_buttons {
    border: solid 1px #c0c0c0;
    border-top: none;
    background: #f0f0f0;
    text-align: right;
    background-image: linear-gradient(bottom, rgb(237,237,237) 100%, rgb(245,245,245) 60%, rgb(250,250,250) 19%);
    background-image: -moz-linear-gradient(bottom, rgb(237,237,237) 100%, rgb(245,245,245) 60%, rgb(250,250,250) 19%);
    background-image: -webkit-linear-gradient(bottom, rgb(237,237,237) 19%, rgb(245,245,245) 60%, rgb(250,250,250) 19%);
    background-image: -ms-linear-gradient(bottom, rgb(237,237,237) 100%, rgb(245,245,245) 60%, rgb(250,250,250) 19%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(1, rgb(237,237,237)), color-stop(0.6, rgb(245,245,245)), color-stop(0.19, rgb(250,250,250)) );
}
.LB_buttons input {
    margin-left: 5px;
}
.LB_resize{
    background: transparent url( "/interchange-5/en_US/litbox_handle.gif" ) no-repeat bottom right;
    height: 10px;
    width: 10px;
    position: absolute;
    bottom: 6px;
    right: 6px;
    cursor: se-resize;
}
div.LB_input { display:none; }
#LB_loading {
    text-align: center;
}
#LB_loading #LB_loadText {
    font: bold 14px Verdana, Arial, Helvetica, Sans-serif;
    color: #999;
    vertical-align: middle;
}
#LB_loading #LB_throbber {
    vertical-align:middle;
    margin-right: 5px;
}

/* Popup Styles */
.popup_heading {
    color: #fff;
    font: bold 14px Verdana, Arial, Helvetica, Sans-serif;
    padding: 19px 14px;
    margin: 0px;
    background: #1f344e url(/interchange-5/en_US/popup_head_bg.jpg) no-repeat right top;
    border: none;
}
.popup_progress_area {
    background: #fff;
    border-top: solid 1px #dfdfdf;
    border-bottom: solid 1px #dfdfdf;
    padding: 9px 14px 12px;
}
.progress_bar_waiting {
    margin-top: 9px;
    height: 13px;
    border: solid 1px #b2b2b2;
    background: #f3f3f3 url(/interchange-5/en_US/progress_wait.jpg) repeat-x bottom left;
}
.progress_bar_done {
    height: 13px;
    width: 0;
    border: none;
    background: #c0ffc0 url(/interchange-5/en_US/progress_done.jpg) repeat-x bottom left;
}
.popup_time_remaining {
    color: #666;
    margin-top: 4px;
    margin-left: 2px;
}


/*Tooltip tag */
div.tooltip {
    margin-left: 5px;
    margin-right: 5px;
    padding: 8px;
    border: 1px solid #a8c0c9;
    background-color: #e8f2fb;
    position: absolute;
    top: 0px;
    left: 0px;
    border-radius:5px;
    font-style: italic;
    opacity:0;
    display: none;
    -webkit-transition: opacity 0.5s ease 0.5s;
    -moz-transition: opacity 0.5s  ease 0.5s;
    -ms-transition: opacity 0.5s ease 0.5s;
    transition: opacity 0.5s  ease 0.5s;
    box-shadow: 1px 1px 6px #666;
}
div.tooltip_show {
    opacity: 1;
    display: block;

}

div.tooltip:after, div.tooltip:before {
    content: "";
    position: absolute;
    display:block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px;
}

.tooltip_right {
    margin-right: 0px;
}

div.tooltip_right:before, div.tooltip_right:after {
    top: 8px;
    left: 0;
    margin-left:-20px
}

div.tooltip_right:before {
    border-color: transparent #a8c0c9 transparent transparent;
    margin-left:-21px;
}
div.tooltip_right:after {
    border-color: transparent #e8f2fb transparent transparent;
}


div.tooltip_left:before, div.tooltip_left:after {
    top: 8px;
    right: 0;
    margin-right:-20px
}

div.tooltip_left:before {
    border-color: transparent  transparent transparent #a8c0c9;
    margin-right:-21px;
}
div.tooltip_left:after {
    border-color: transparent  transparent transparent #e8f2fb;
}

div.tooltip_above:before, div.tooltip_above:after {
    bottom: 0px;
    left: 8px;
}

div.tooltip_above:before {
    border-color:  #a8c0c9 transparent  transparent  transparent ;
    margin-bottom:-21px;
}
div.tooltip_above:after {
    border-color:  #e8f2fb  transparent  transparent transparent ;
    margin-bottom:-20px
}

div.tooltip_below:before, div.tooltip_below:after {
    top: 0px;
    left: 8px;
}

div.tooltip_below:before {
    border-color:  transparent  transparent #a8c0c9 transparent ;
    margin-top:-21px

}
div.tooltip_below:after {
    border-color:  transparent  transparent #e8f2fb transparent ;
    margin-top:-20px;
}

div.tooltip .tooltip_close {
    display: block;
    float:right;
    margin:0 0 4px 4px;;
    border-bottom: none;
    background-image:url('/interchange-5/en_US/litbox_close.png');
    background-size: 16px;
    width: 16px;
    height: 16px;
    transition: box-shadow 1s;
}
div.tooltip .tooltip_close:hover {
    box-shadow: 0 0 6px  orange;
}

/* dropdown, drop-display tag */
.drop_display {
    border: 1px solid #A3A3A3;
}
.area_drop h1 a {
    text-decoration: underline !important;
    display: block;
}
.area_drop h1.adup, .area_drop h1.addown {
    font: bold 11px Verdana, Arial, Helvetica, Sans;
    position:relative;
    padding: 0;
    margin: 0 0 0px;
    clear: both;
    line-height: 1em;
    border-radius: 0px;
    border:none;
    border-bottom: 1px solid #BDBDBD;
    border-top: 1px solid #FFFFFF;
    background: #e9e9e9; /* Old browsers */
    background: -moz-linear-gradient(top, #e9e9e9 0%, #d9d9d9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e9e9e9), color-stop(100%,#d9d9d9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e9e9e9 0%,#d9d9d9 100%); /* Chrome10+,Safari5.1+ */
    background: -ms-linear-gradient(top, #e9e9e9 0%,#d9d9d9 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9e9', endColorstr='#d9d9d9',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top, #e9e9e9 0%,#d9d9d9 100%); /* W3C */
}
.area_drop h1.adup a, .area_drop h1.adup a:hover, .area_drop h1.addown a, .area_drop h1.addown a:hover {
    margin: 0;
    padding: 0;
    border: none;
    text-decoration:none;
    padding: 4px;
    padding-left: 20px;
}
.area_drop h1.adup a {
    background: url(/interchange-5/en_US/btn_arrow_down.gif) no-repeat 7px 45%
}
.area_drop h1.addown a {
    background: url(/interchange-5/en_US/btn_arrow_up.gif) no-repeat 7px 45%
}
.dropdown_link_inner a {
    line-height: 1.5em !important;
}
.area_drop span.dropdown_link_inner {
    margin: 0 0 -1px 0;
    text-decoration:none;
    padding:4px 4px 4px 20px;
}
.adup span.dropdown_link_inner {
    background: url(/interchange-5/en_US/btn_arrow_down.gif) no-repeat 7px 45%;
}
.addown span.dropdown_link_inner {
    background: #f9f9f9 url(/interchange-5/en_US/btn_arrow_up.gif) no-repeat 7px 45%;
    z-index: 1000;
    position:relative;
}
.area_drop h1.adup a, .area_drop h1.adup a:hover, .area_drop h1.addown a, .area_drop h1.addown a:hover {
    font: bold 11px Verdana, Arial, Helvetica, Sans;
    color: #15428b;
}
span.addown, span.adup, span.dropdown_link_inner {
    display: inline-block;

}
span.adup {
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}
span.addown  {
    box-shadow: 0 1px 5px #292929;
    border-top: 1px solid #bbb;
    border-left: 1px solid #bbb;
    border-right: 1px solid #bbb;
}
.area_drop div.adup {
    display: none;
}
.area_drop div.addown {
    padding: 8px; display: block;
}
div.area_drop.dropdown {
    display:inline-block;
    position: relative;
}
div.area_drop.dropdown div.addown {
    z-index: 999;
}
div.area_drop.dropdown div.adup,div.area_drop.dropdown div.addown {
    background: #f9f9f9;
    min-width: 100px;
    position: absolute;
    top: 100%;
    border-top:none;
    left: 0;
    text-align:left;
    border:1px solid #bbb;
    box-shadow: 0px 1px 5px #292929;
    margin-top: -1px;
}
.area_drop a:focus {
    outline: none;
    -moz-outline: none;
}


/*Admin header bar (in the backend, and in liveedit) */
#_z_admin_header a {
	font-size: 13px;
color: #959595;
}

#_z_header_tools {
 float: right;
}
#_z_admin_header {
background: #292929;
color: #959595;
font-family: Ubuntu;
}
#_z_admin_header a {
    text-decoration: none;
 }
#_z_admin_header a:hover {
 	color: #2791EB !important;
}

/* The editing mode selector, in the header where you choose between visit site, live edit, website manager */
#_z_admin_header #editing_mode {
     display: inline-block;
    text-transform: lowercase;
}

#_z_admin_header #editing_mode ul {
	margin:0;
   	list-style:none;
	padding:0;
    border-left: 1px solid #999
    padding-left: 1px;
   margin-right: 18px;
}

#_z_admin_header #editing_mode #editing_mode_preview a, #_z_admin_header #editing_mode #editing_mode_liveedit a, #_z_admin_header #editing_mode #editing_mode_website a{
    overflow-x: hidden;
    font-size:11px;
    line-height: 50px;
}
#editing_mode_liveedit a:before {
  font-family: 'IcoMoonZes';
  content: "\e001";
  margin-right: 4px;
  display: inline-block;
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  margin-left:2px;
}
#editing_mode_preview a:before {
  font-family: 'IcoMoonZes';
  content: "\e158";
  margin-right: 4px;
  display: inline-block;
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  margin-left:2px;

}

#editing_mode_website a:before {
  font-family: 'IcoMoonZes';
  content: "\e0c9";
  display: inline-block;
  margin-right: 4px;
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  margin-left:2px;
}

#_z_admin_header #editing_mode a, #_z_admin_header #editing_mode a:hover {

    border: 0px none;
	padding:0px 10px 0px 10px;
    text-align:center;
	text-decoration:none;
    display: block;
    overflow-y: hidden;

}

#_z_admin_header #editing_mode li {
    float: left;
    margin:0;
    padding:0;
   margin-left:2px;
   font-size:11px;
   font-weight: 700;
}
#_z_admin_header #editing_mode .current_editing_mode, #_z_admin_header #editing_mode .current_editing_mode:hover {
  color: #fff;
}
#_z_admin_header #editing_mode .current_editing_mode a, #_z_admin_header #editing_mode .current_editing_mode a:hover {
  color: #fff;
 }


#_z_admin_header span, #_z_admin_header li, #_z_admin_header div {
font-size: 11px;
}


#_z_admin_header, #_z_admin_header_em {
    width: 100%;
}
#_z_admin_header a, #_z_admin_header span, #_z_admin_header div, #_z_admin_header img {
    vertical-align:middle;
 }

#_z_admin_header div, #_z_admin_header span {
    line-height:100%;
}

#_z_admin_header img {
    vertical-align:middle;
 }

#_z_admin_header .topmenu {
    text-align:right;
    padding-right: 8px;
}


#_z_admin_header div.area_drop.dropdown div.addown {
    border-left: 1px solid #ccc;

}
#_z_admin_header div.area_drop.dropdown div.addown a {
    line-height: 2em;
    color:#666;
}

/* Style for admin account drop down*/
.dropdown{
	display:inline-block;
    display: inline-block;
    margin-bottom: 3px;

}
#account_optarea{
	right:0px ;
	left:auto ;
}
#account_optarea{
	padding:10px;
}
.addown{
	z-index:700 !important;
}
#adm_avatar_ico{
	margin-top:3px;
}
#logout_admn{
	padding:8px 10px;
	float:right;
	border:1px solid #ccc;
	background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2YyZjJmMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+");
	border-radius: 2px;
	cursor:pointer;
	font: normal 12px Verdana, Arial, Helvetica, Sans-serif;
	color: #000;
}
#logout_admn:hover{
	box-shadow:0 0 6px #999999;
	text-shadow:1px 1px #AAAAAA;
	border:1px solid #AAAAAA;
}
#_z_admin_header div.area_drop.dropdown div#account_optarea.addown .usr_details.usr_div a{
	color: rgb(39, 145, 235) ;
	border-bottom: 1px solid rgb(190, 222, 249);
	border-collapse: collapse;
	font-size:12px;
	line-height: 17px ;
}

#_z_admin_home_link img {
  background: #fff;
  padding:2px;
}

#_z_admin_home_link {
  margin-left: 6px;
  margin-top:13px;
}
#_z_admin_header a._z_admin_home_link_drop {
  font-size: 13px;
}

#_z_admin_home_link_wrap  {
 float: left;
  margin-top: 8px;
}

/* LIVEEDIT related styles */
._z_liveedit_component_on_template ._z_draghandle {
 display: none;
}
._z_liveedit_component_preview .component_edit {
    display:none;
}


._z_liveedit_extra_preview {
    display:none;
}

._z_liveedit_component {
    position:relative;
 	border: 1px dashed #ccc;
    margin:1px;
    min-height: 20px;
    padding-top:14px !important;
    transition: transform 0.5s;
}

._z_liveedit_component:hover {
    border: 1px dashed #FF9900;
}
._z_liveedit_dragging {
    -webkit-transform:rotate(-2deg);
    -moz-transform:rotate(-2deg);
    -ms-transform:rotate(-2deg);
    transform:rotate(-2deg);
    box-shadow: 0px 0px 15px #666;
    display: inline-block;
    opacity: 1;
    z-index: 2000 !important;
}

.component_edit ._z_rightbutton {
    float:right;
    padding: 2px 4px 1px 0
}
.component_edit ._z_rightbutton img {
    border-right:none;
}
._z_liveedit_component  .component_edit {
    background:#E3E0DB;
    width:100%;
    text-align:left;
    clear:both;
    height: 14px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8;
   z-index: 1000;
    padding:0;
    margin:0;
    font-size:8px;
    line-height:8px;
    color: #666;
    display: table-cell;
    vertical-align:middle;
}
._z_liveedit_component  .component_edit.customised {
   background:#dcabab;
}
.component_edit img, .component_add:hover img {
    position: unset !important;
    display: inline !important;
    vertical-align: middle !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
 }
._z_liveedit_component:hover > .component_edit {
    background:#FECA2C;
    opacity: 1;
}
div._z_liveedit_dropzone_hover  {
    border: 1px dashed #FF9900;
    height: 100px;
    opacity: 1;
    background: #ffda69;
    display: block;
    clear: both;
 }
._z_liveedit_dropzone {
    display: none;
}
._z_liveedit_dropzone_drag {
    display: block;
    border: 1px dashed #ffc778;
    height: 15px;
    min-width:5px;
    opacity: 0.6;
    background: #ffeeba;
    font-family: Arial, Helvetica, sans-serif;
	font-size: 8px;
    color: #666;
    clear: both;
 }

div#_z_admin_header       input.add_btn, div#_z_admin_header  input.add_btn{
    background: #3079ED url(/interchange-5/en_US/monoicons/light/plus32.png) no-repeat 9px 50%;
    padding: 9px 11px;
	padding-left: 32px;
	border: none;
    color: #fff;
    font-family: Ubuntu;
    font-size: 13px;
    background-size: 17px, auto;
    margin-right: 9px;
    text-transform: unset;
}
input.add_btn:hover, input.add_sml_btn:hover {
    border: 1px solid #335998;
    text-shadow: 1px 1px 6px #666;
    box-shadow: 0px 0px 2px #999;
}
._z_liveedit_wrapper input.admin-button {
    padding: 4px 8px;
    width: unset !important;
    background: #3079ED;
    font-family: Ubuntu;
    font-size: 13px;
}
body div a._zes_icon_link {
    display: inline !important;
    color: #333 !important;
    font-size: 10px !important;
    line-height: 10px !important;
    transition: text-shadow 0.5s, color 0.5s;
    text-decoration: none;
    vertical-align: middle;
}
body div .component_edit a {
    line-height: 10px !important;
    font-size: 10px !important;
    color: #333 !important;
    font-weight: normal !important;
}
a._zes_icon_link:hover {
    color: #666 !important;
    text-shadow: 0 0 10px white;
}