html, body { height:100%; cursor: default; font-family:Arial, Helvetica, sans-serif;}
body { text-align:center;margin:0px; }
/* body.lab { user-select: none; } prevents Surface Pen making unwanted text selections */

::-webkit-scrollbar { 
    width: 12px; height: 13px; 
}
::-webkit-scrollbar-button { display:none;}
::-webkit-scrollbar-track {
    background: rgba(245,250,253,1); 
    box-shadow: inset 0 0 5px rgba(0,0,0,0.3); 
    border-radius: 4px;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb {
    border-radius: 3px;margin-left:1px;
    background-color:rgba(162,242,255,1);
    box-shadow: inset 0 0 4px rgba(255,255,255,0.5); 
    border:1px outset rgba(118,163,168,0.6);
}
::-webkit-scrollbar-thumb:window-inactive {
	background-color:rgba(207,245,248,0.4);
}
::-webkit-scrollbar-track-piece  { /* 4 */ }
::-webkit-scrollbar-corner { 
    background: rgba(189,230,235,0.5); 
    box-shadow: inset 0 0 4px rgba(0,0,0,0.1); 
}
::-ms-clear { width: 0; height: 0; }
::-ms-reveal { width: 0; height: 0; }
::-webkit-input-placeholder { color: #acc; font-style: italic; font-size: 80%; text-align: center; }
:-moz-placeholder {color: #acc; font-style: italic; font-size: 80%; text-align: center; }
::-moz-placeholder { color: #acc; font-style: italic; font-size: 80%; text-align: center; }
:-ms-input-placeholder { color: #acc; font-style: italic; font-size: 80%; text-align: center; }

ul { box-sizing: initial !important; }
ul li, ul li a { box-sizing: border-box !important; }


.loader {
    border: 16px solid #f0f0f0; border-top: 16px solid rgba(235,217,201,1); border-radius: 50%;
    width: 120px; height: 120px; text-align:center;
    animation: loader_spin 1.5s linear infinite;
}
.loader-sm {
    border: 8px solid #f3f3f3; border-top: 8px solid rgba(235,217,201,1); border-radius: 50%;
    width: 40px; height: 40px; text-align:center; margin:0px auto 5px auto;
    animation: loader_spin 1.5s linear infinite;
}
.loader-sm-center-rel { top:50%;left:50%;margin-left:-20px;margin-top:-20px; }
td .loader-sm, .loader-sm.loader-c { position: absolute;top: 50%;left: 50%;margin-left: -28px;margin-top: -28px; display:none;}
tr.loading td .loader-sm {display:block;}
.loader-xs {
    border: 4px solid #f3f3f3; border-top: 4px solid rgba(235,217,201,1); border-radius: 50%;
    width: 16px; height: 16px; text-align:center; margin:0px auto 5px auto;
    animation: loader_spin 1.5s linear infinite;
}
.loader-xxs {
    border: 3px solid #f3f3f3; border-top: 3px solid rgba(235,217,201,1); border-radius: 50%;
    width: 12px; height: 12px; text-align:center; float:left;margin:0.1em 0.3em 0.1em 0.2em;
    animation: loader_spin 1.5s linear infinite;
}
.theme-lab .loader,
.theme-lab .loader-sm,
.theme-lab .loader-xs ,
.theme-lab .loader-xxs {
    border-top-color:rgba(201,235,235,1);
}
.loader-xs-center-rel { top:50%;left:50%;margin-left:-12px;margin-top:-12px; }
@keyframes loader_spin {  0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.gc-error-icon { float:left; margin:0.2em 0.3em; }

.blockUI.blockOverlay { border-radius:6px !important; border-bottom-left-radius:1px !important; border-bottom-right-radius:1px !important; margin-bottom:0px !important; width:auto !important;height:auto !important;top:-1px !important;left:-1px !important;right:-1px !important;bottom:-1px !important;background: radial-gradient(ellipse farthest-corner at center, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.9) 100%) !important; }
.blockUI.blockMsg.blockElement { border-radius:10px; min-width:200px; font-size:0.9em;}
.blockUI h2 { margin-bottom: 0.2em !important; }
.loader-xs-icon { float:left;width:32px;margin:0px 4px; }
.loader-xs-icon .loader-xs { margin:8px; }
.loader-xs-msg { display:inline-block;margin:8px 10px 7px 0px;text-align:center; }


.locdot-16 { display:inline-block; width:14px; height:14px;line-height:17px; border-radius:7px;border-top-left-radius:2px; border:1px solid rgba(255,255,255,1); position:relative; }
.locdot-8 { display:inline-block; width:7px; height:7px;line-height:9px; border-radius:4px;border-top-left-radius:1px; border:1px solid rgba(255,255,255,1); position:relative; }
.locdot-16.dot-RF:after {
    font-family: Arial, Helvetica, sans-serif; content: "\2665"; font-weight: normal;
    text-shadow: none; color: #fff; opacity: 0.9; font-size: 13px;
    position: relative; top: -5px; left: 0px;line-height: 17px;
}
.locdot-16.dot-FSF:after {
    font-family: Arial, Helvetica, sans-serif; content: "\29BF"; font-weight: normal;
    text-shadow: none; color: #fff; opacity: 0.9; font-size: 10px;
    position: relative; top: -6px; left: 0px; line-height: 17px;
}

.ui-dialog { padding: 2px; border-top-left-radius:8px; border-top-right-radius:8px; border-bottom-left-radius:1px; border-bottom-right-radius:1px; border-width:2px; box-shadow: 3px 4px 14px rgba(0,0,0,0.7); }
.ui-dialog-titlebar { border-bottom-left-radius:0px; border-bottom-right-radius:0px; border-top-left-radius:5px; border-top-right-radius:5px; font-weight:normal; padding-left:5px !important; }
.ui-dialog-title-icon { margin:0px 8px 0px 4px;position:relative;top:1px; }
.ui-dialog-titlebar-close { top:5px; }
.ui-menu-item .locdot-16.dot-RF:after { top:-3px;left:-1px; }
.ui-menu-item .locdot-16.dot-FSF:after { top:-4px;left:-2px; }


/*

.location_dot_16 {
    position: relative;
    top: 1px;
}

span.location_dot_16 {
    display: inline-block;
    border-radius: 7px;
    border-top-left-radius: 2px;
    height: 13px;
    width: 13px;
    border: 1px solid #fff;
}

span.location_dot_8 {
    display: inline-block;
    border-radius: 4px;
    border-top-left-radius: 1px;
    height: 7px;
    width: 7px;
    border: 1px solid #fff;
}

li.ui-menu-item span.location_dot_16 {
    position: relative;
    top: 3px;
}

    li.ui-menu-item span.location_dot_16:after {
        position: relative;
        top: -4.5px;
    }

    li.ui-menu-item span.location_dot_16.dot-rf:after,
    li.ui-menu-item span.location_dot_16.dot-RF:after {
        position: relative;
        left: -0.5px;
    }

    li.ui-menu-item span.location_dot_16.dot-fsf:after,
    li.ui-menu-item span.location_dot_16.dot-FSF:after {
        position: relative;
        top: -5px;
    }

span.location_dot_16.dot-cfc:after,
span.location_dot_16.dot-CFC:after {
    font-family: Arial, Helvetica, sans-serif;
    content: "\20E0";
    font-weight: normal;
    text-shadow: none;
    color: #fff;
    opacity: 0;
    font-size: 13px;
    position: relative;
    top: -3px;
    line-height: 50%;
}

span.location_dot_16.dot-rf,
span.location_dot_16.dot-RF {
    width: 13px;
    height: 13px;
    border-radius: 7px;
    border-top-right-radius: 2px;
    border: 1px solid #fff;
}

    span.location_dot_16.dot-rf:after,
    span.location_dot_16.dot-RF:after {
        font-family: Arial, Helvetica, sans-serif;
        content: "\2665";
        font-weight: normal;
        text-shadow: none;
        color: #fff;
        opacity: 0.9;
        font-size: 13px;
        position: relative;
        top: -1px;
        left: 0.5px;
        line-height: 50%;
    }

span.location_dot_16.dot-fsf,
span.location_dot_16.dot-FSF {
    width: 13px;
    height: 13px;
    border-radius: 7px;
    border-bottom-left-radius: 2px;
    border: 1px solid #fff;
}

    span.location_dot_16.dot-fsf:after,
    span.location_dot_16.dot-FSF:after {
        font-family: Arial, Helvetica, sans-serif;
        content: "\29BF";
        font-weight: normal;
        text-shadow: none;
        color: #fff;
        opacity: 0.9;
        font-size: 10px;
        position: relative;
        top: -1.5px;
        left: -2px;
        line-height: 50%;
    }
/-*li.ui-menu-item span.location_dot_16.dot-RF:after,
li.ui-menu-item span.location_dot_16.dot-rf:after { position:relative; top:-4px!important; left:0px; }*-/
span.location_dot_16.dot-ppn,
span.location_dot_16.dot-PPN {
    width: 13px;
    height: 13px;
    border-radius: 3px !important;
    border: 1px solid #fff;
}

    span.location_dot_16.dot-ppn:after,
    span.location_dot_16.dot-PPN:after {
        content: "\03C1";
        color: #fff;
        font-size: 13px;
        line-height: 10px;
        position: relative;
        top: -3px;
        left: 0px;
    }



    header, #wd_header_toolbar { font-family:"neosans", Arial,sans-serif; width:100%;min-width:1024px; height:24px; background: #a4d1dc url(/" & SiteId & "/images/skin/cfc_toolbar_lab_bkg.gif) repeat-x; background-position: left top; background-size:none; } 

    #wd_nav_toolbar { position:relative; width:100%;min-width:1024px; height:50px; text-align:center;margin:0px;padding:0px;background: #97b5ba url(/" & SiteId & "/images/skin/cfc_menubar_lab_bkg.gif); background-repeat:repeat-x; background-position: center top;background-size:none; } 


                
    .container.full-width { width:100%; }
    div.no-gutter { padding-left:0px; padding-right:0px; }

    #navbar_left, #header_location { text-align: left; }
    #navbar_info, #header_clock { text-align: center; position:relative;height:50px; } 
    #navbar_info { font-size:11px; font-family:Arial,Helvetica,sans-serif;}
    #navbar_right, #header_user { text-align: right; }
    
    #header_clock { font-size:16px;height:24px;overflow:hidden;line-height:90%; padding-top:5px; }

    #wd_section_main { position:absolute; top:74px; left:0px; right:0px; bottom:0px; background: #d1e3ec url(/" & SiteId & "/images/skin/cfc_wallpaper_lab_bkg.jpg) repeat;background-position: top center; background-size:100%; background-size:100% 100%;overflow:hidden; } 

    header #current_location_dot { position:relative; top:2px; left:1px;}
    header #current_location_caret, header #current_user_caret { position:relative; top:4px; }
    header #current_location_name { font-size:12px; color:#444; }
    header #current_usertype_name { font-size:11px; color:#444; display:inline-block;padding:5px 1px 0px 3px; }
    header #current_user_name  { display:inline-block;padding:2px 5px 0px 3px; }
    header a, header a:link, header a:visited { color:#fff; display:inline-block; text-decoration:none; width:auto; transition: background linear 0.2s; }
    header a:active { color:#fff; display:inline-block; text-decoration:none; background:linear-gradient(to bottom, #cae5e5 0%, rgba(255,255,255,0)); position:relative; top:1px;  }
    header a:hover { color:#fff; display:inline-block; text-decoration:none; background:linear-gradient(to bottom, #cae5e5 0%, rgba(255,255,255,0)); }
    header .ic16-caret { opacity:0.5; }
    header a:hover .ic16-caret,header a:active .ic16-caret { opacity:1; }
    li a span.location_dot_16 { position:relative;top:3px; }

    #header_location_menu { width:auto; position:absolute;top:2px; left:2px; min-width:280px; z-index:995; line-height:28px; height:auto; display:none;}
    #header_location_menu ul { padding: 3px; height:auto; list-style:none; }
    #header_location_menu li { height:20px;padding:3px; list-style:none; }
    #header_location_menu li.ui-menu-item { text-align:left; height:24px; width:100%; }
    #header_location_menu li.ui-menu-divider { height:1px; padding:1px; }
    #header_location_menu li a { display:inline-block;width:100%; text-align:left; } 
    #header_location_menu li.youAreHere { padding: 5px 0.4em 2px 0.4em; background-color: #DDDCD5; border-radius:4px;min-height:36px; } 
    #header_location_menu li.youAreHere span.location_dot_16 { position:relative;top:7px; }

    #header_user_menu { width:auto; position:absolute;top:22px; width:250px; right:2px; z-index:995; line-height:28px; height:auto; }
    #header_user_menu ul { padding: 3px; height:auto; list-style:none; }
    #header_user_menu li { height:20px;padding:3px; list-style:none; }
    #header_user_menu li a { display:inline-block;width:100%; } 
    #header_user_menu li.ui-menu-item { text-align:left; height:24px; width:100%; text-align:right;}
    #header_user_menu li.ui-menu-divider { height:1px;padding:1px; }
    #header_user_menu li a { display:inline-block;width:100%;  } 
    #header_user_menu li.youAre { padding: 5px 0.4em 2px 0.4em; background-color: #DDDCD5; border-radius:4px; min-height:36px;} 

    span.location_dot_16 { display:inline-block;border-radius:7px; border-top-left-radius:2px; height:13px;width:13px;border:1px solid #fff; }
    span.location_dot_8 { display:inline-block;border-radius:4px; border-top-left-radius:1px; height:7px;width:7px;border:1px solid #fff; }
    li.ui-menu-item span.location_dot_16 { border-radius:8px; border-top-left-radius:3px;height:16px;width:16px; }
    span.location-dot-16 { display:inline-block;border-radius:7px; border-top-left-radius:2px; height:13px;width:13px;border:1px solid #fff; }
    span.location-dot-8 { display:inline-block;border-radius:4px; border-top-left-radius:1px; height:7px;width:7px;border:1px solid #fff; }
    li.ui-menu-item span.location-dot-16 { border-radius:8px; border-top-left-radius:3px;height:16px;width:16px; }

    nav a, nav a:link, nav a:visited { opacity: 0.7; display:inline-block;height:40px;width:38px; padding:2px 1px; border-radius:3px; text-decoration:none; transition: background-color linear 0.2s; }
    nav a:hover { text-decoration:none; background-color:#cae5e5; opacity: 1; }
    nav a:active { text-decoration:none; position:relative;top:1px;left:1px; background-color:#cae5e5; opacity: 1; }
    #navbar_left { padding-top:5px; padding-left:5px; }
    #navbar_right { padding-top:5px; padding-right:5px; }
    #navbar_left a { float:left; }
    #navbar_right a { float:right; }

@keyframes anim-clock-1 { 0% { opacity: 0; } 20% { opacity:0; } 35% { opacity:0.8; } 65% { opacity:0.8; } 80% { opacity:0; } 100% { opacity:0; } }
.anim-clock-1s {
    animation-name:anim-clock-1;
    animation-delay:0s;
    animation-duration:1s;
    animation-direction:alternate;
    animation-iteration-count:infinite;
}

@keyframes anim-flash-1 { 0% { opacity: 0.1; } 40% { opacity:0.8; } 50% { opacity:1; } 60% { opacity:0.8; } 100% { opacity:0.1; } }
.anim-flash-1s {
    animation-name:anim-flash-1;
    animation-delay:0s;
    animation-duration:2s;
    animation-direction:alternate;
    animation-iteration-count:infinite;
}

#wd_spin {     
    position: fixed; top:0px;left:0px;right:0px;bottom:0px; 
    width:100%; height:100%; z-index:999999999;
    background: #fff;
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(244,240,236,1) 100%);
}
body.lab #wd_spin { background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(230,255,250,1) 100%); }
#wd_spin_bkg {
    position: fixed; top:0px;left:0px;right:0px;bottom:0px; 
    width:100%; height:100%; z-index:999999999;
    background-image:url(/" & SiteId & "/images/skin/anim_progress.gif);
    background-position: center center;
    background-repeat:no-repeat;
}
body.lab #wd_spin_bkg {
    background-image:url(/" & SiteId & "/images/skin/lab/anim_progress.gif);
}
#wd_spin_lbl {
    position: fixed; top:50%;left:0px;right:0px;bottom:0px; padding-top:72px;
    font-family: "neosans",Arial,sans-serif;
    font-size:16px; font-weight:bold;
}
*/

/* BUTTONS */


.navbutton.mini { 
    margin-bottom:5px; margin-left:20px; padding-top:14px;padding-bottom:11px;padding-left:40px;width:320px !important;float:left; font-size:20px;
} 
.navbutton.mini.tab-menu-btn > span {position: absolute;top: 2px;left: 6px; }

.navbutton {
    position:relative;
    box-shadow:1px 1px 4px rgba(0,0,0,0.2);
	background:linear-gradient( to bottom, rgba(250,250,250,1) 0%, rgba(240,240,240,1) 45%, rgba(233,233,233,1) 55%, rgba(190,190,190,1) 100%);
	background-color:#ededed;
	border-radius:16px;
	border:1px solid #dcdcdc;
	display:inline-block;
	font-family:"neosans-regular",Arial,Helvetica,sans-serif;
	font-size:24px;
	padding:38px 10px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
    width:100%;
    text-align:center;
}

.navbutton:link,.navbutton:visited,.navbutton:active,.navbutton:hover { color: #444; }
	 
.navbutton.red { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(255,170,170,1) 45%, rgba(255,79,79,1) 55%, rgba(155,133,133,1) 100%); 
    color:rgba(128,8,8,1)!important ; border-color:rgba(209,16,16,1) !important;
}
.navbutton.green, .neoButton.green { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(205,253,205,1) 45%, rgba(187,243,187,1) 55%, rgba(191,208,191,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}
.navbutton.blue { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(188,188,255,1) 45%, rgba(164,164,248,1) 55%, rgba(181,181,216,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}
.navbutton.magenta { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(247,190,255,1) 45%, rgba(237,171,248,1) 55%, rgba(213,187,216,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}
.navbutton.cyan { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(205,253,246,1) 45%, rgba(187,243,235,1) 55%, rgba(191,208,207,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}
.navbutton.orange { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(255,205,174,1) 45%, rgba(251,186,147,1) 55%, rgba(216,190,174,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}
.navbutton.yellow { 
	background:linear-gradient( to bottom, rgba(255,255,255,1) 0%, rgba(253,255,197,1) 45%, rgba(243,246,177,1) 55%, rgba(209,210,188,1) 100%); 
    color:rgba(64,64,64,1) ; border-color:rgba(210,210,210,1);
}

.navbutton:hover {
	border:1px solid #7edcd6; 
	background-color:#dfdfdf;
    background:linear-gradient(to bottom, #c8f0ed 0%, #dff6f4 100%) !important;  
    color:#444448 !important; 
    box-shadow:0px 0px 4px rgba(73,71,48,0.4); 
    text-decoration:none !important;
    text-decoration:none;
}
.navbutton:active {
    border:1px solid #7edcd6; background:linear-gradient(to top, #c8f0ed 0%, #dff6f4 100%);  color:#444448 !important; box-shadow:0px 0px 2px rgba(73,71,48,0.4);
	position:relative;
	top:1px;left:1px;
    text-decoration:none;
}

.navbuttonsmall {
	box-shadow:1px 1px 4px rgba(0,0,0,0.3);
	background-color:#ededed;
	background:linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	border-radius:8px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#212;
	font-family:arial;
	font-size:12px;
	font-weight:bold;
	padding:8px 12px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;

}.navbuttonsmall:hover {
	border:1px solid #7edcd6; background:linear-gradient(to bottom, #c8f0ed 0%, #dff6f4 100%);  
    color:#444448 !important; 
    box-shadow:0px 0px 4px rgba(73,71,48,0.4); 
    text-decoration:none !important;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
	behavior: url(PIE/PIE.htc);
    text-decoration:none;
}.navbuttonsmall:active {
    border:1px solid #7edcd6; background:linear-gradient(to top, #c8f0ed 0%, #dff6f4 100%);  color:#444448 !important; box-shadow:0px 0px 2px rgba(73,71,48,0.4);
	position:relative;
	top:1px;left:1px;
    text-decoration:none;
}


/* TABLES */

table.property-table { width:100%; }
table.property-table th { padding: 2px 5px; max-width:50%; background:linear-gradient(to right, #fff 0%, #ddd 100%); }
table.property-table td { padding: 2px 5px; min-width:50%; background:linear-gradient(to left, #fff 0%, #ddd 100%); }

/* PANELLING */
.panel-wall { position:absolute; left:0; right:0; top:0; bottom:0; padding:0; text-align:center; }

.panel-less { border-radius:0px; box-shadow: none; background-color:transparent; }
.panel-glass { border-radius:14px; box-shadow: 3px 3px 5px rgba(0,0,0,0.2); background-color:rgba(255,255,255,0.4); }
.panel-square { border-radius:0px; box-shadow: 0 2px 1px 0 rgba(255, 255, 255, 0.2) inset, 3px 3px 5px rgba(0,0,0,0.2); background-color:rgba(255,255,255,0.4); border:1px solid rgba(255,255,255,0.6); }
.panel-square:before, .panel-square:after {
    content: "";
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    width: 42px;
    height: 100%;
    top: -10px;
    right: 50px;
    -webkit-transform: rotate(50deg);
    transform: rotate(50deg);
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-filter: blur(5px);
    filter: blur(5px);
}
.panel-square:after {
    right: -20px;
    width: 20px;
}
.panel-square:before, .panel-square:after {
    content: "";
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    width: 42px;
    height: 100%;
    top: -10px;
    right: 50px;
    transform: rotate(50deg);
    transform-origin: top center;
    filter: blur(15px);
}
.panel-size-menu-hero { position:absolute; margin:0px auto; left:0px; right:0px; max-width:1024px; width:1024px; top:32px; height:120px; padding:0px; overflow:hidden; }
.panel-size-menu-body { position:absolute; margin:0px auto; left:0px; right:0px; max-width:1024px; width:1024px; top:240px; bottom:80px; padding:20px; }

.panel-size-100-80 { position:absolute; left:100px; right:100px; top:80px; bottom:80px; padding:20px; }
.panel-size-10 { position:absolute; left:10px; right:10px; top:10px; bottom:10px; padding:10px; }

.panel-size-l-1-3rd { position:absolute; left:10px; width:280px; top:10px; bottom:10px; padding:10px; }
.panel-size-r-2-3rd { position:absolute; left:300px; right:10px; top:10px; bottom:10px; padding:10px; }

.panel-size-l-1-3rd { position:absolute; left:10px; width:280px; top:10px; bottom:10px; padding:10px; }
.panel-size-l-r-stretch { position:absolute; left:300px; right:190px; top:10px; bottom:10px; padding:10px; }
.panel-size-r-1-3rd { position:absolute; right:10px; width:170px; top:10px; bottom:10px; padding:10px; }

.animated { animation-fill-mode: forwards; }


/* ELEMENTS */


.btn-xl
{
	background:linear-gradient(to bottom,rgba(250,250,250,1) 0, rgba(240,240,240,1) 45%, rgba(233,233,233,1) 55%, rgba(190,190,190,1) 100%);
	background-color:#ededed;
    color:#444;
	border:1px solid #dcdcdc;
	border-radius:16px;
	box-shadow:1px 1px 4px rgba(0,0,0,0.2);
	display:inline-block;
	font-family:"neosans",Arial,Helvetica,sans-serif;
	font-size:24px;
	padding:38px 10px;
	text-align:center;
	text-decoration:none;
	text-shadow:1px 1px 0 #fff;
	width:auto;
}
.btn-xl-size-100 {
	width:100%;
}

.btn-xl.red
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(255,170,170,1) 45%, rgba(255,79,79,1) 55%, rgba(155,133,133,1) 100%);
	border-color:rgba(209,16,16,1) !important;
	color:rgba(128,8,8,1) !important;
}

.btn-xl.green
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(205,253,205,1) 45%, rgba(187,243,187,1) 55%, rgba(191,208,191,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl.blue
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(188,188,255,1) 45%, rgba(164,164,248,1) 55%, rgba(181,181,216,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl.magenta
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(247,190,255,1) 45%, rgba(237,171,248,1) 55%, rgba(213,187,216,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl.cyan
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(205,253,246,1) 45%, rgba(187,243,235,1) 55%, rgba(191,208,207,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl.orange
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(255,205,174,1) 45%, rgba(251,186,147,1) 55%, rgba(216,190,174,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl.yellow
{
	background:linear-gradient(to bottom,rgba(255,255,255,1) 0, rgba(253,255,197,1) 45%, rgba(243,246,177,1) 55%, rgba(209,210,188,1) 100%);
	border-color:rgba(210,210,210,1);
	color:rgba(64,64,64,1);
}

.btn-xl:hover
{
	background:linear-gradient(to bottom,#c8f0ed 0,#dff6f4 100%) !important;
	background-color:#dfdfdf;
	border:1px solid #7edcd6;
	box-shadow:0 0 4px rgba(73,71,48,0.4);
	color:#444448 !important;
	text-decoration:none !important;
}
.btn-xl:link,.btn-xl:visited,.btn-xl:active,.btn-xl:hover
{
	color:#444;
}
.btn-xl span.btn-icon { position:absolute; top:10px; left:10px; }

@keyframes color-waiting {
    0% { background-color: #009999; }
    100% { background-color: #000066; }
}
div.directive {
    display:inline-block;
    position:relative;
    min-height:95px;
    border-radius:7px;
    background-color:#006;
    color:#fff;
    padding:4px;
    text-align:center;
    width:auto;
    margin:0px auto;
    box-shadow: 7px 7px 17px rgba(0,0,0,0.3); 
    transition:opacity 0.35s;
}
div.directive-inner {     
    display:inline-block;
    border:4px solid #fff;
    border-radius:5px;
    font-size:48px;
    font-family: 'neosans-regular', Arial, sans-serif;
    line-height:normal;
    color:inherit;
    background-color:inherit;
    padding:15px 20px 12px 20px;
    text-align:center; 
}
div.directive-label { color:inherit; }
div[class^="directive-icon-"] div.directive-inner,
div[class*=" directive-icon-"] div.directive-inner
{     
    padding-left:90px;
    color:inherit;
    position:absolute;top:20px;left:25px;
    background-image:url(/workdesk/images/library/icons/_sprite_ic48_all.png);
	background-repeat:no-repeat;
	display:inline-block;
	height:52px;
	width:52px;
}
div.directive-icon-scan div.directive-icon { 

    background-position:-416px -52px;
}
div.directive-icon-success div.directive-icon { 
    position:absolute;top:20px;left:25px;
}
div.directive-icon-fail div.directive-icon { 
    position:absolute;top:20px;left:25px;
}

div.directive-status-waiting {
    animation: color-waiting 2s ease-in-out 1;
    animation-direction:alternate; 
    animation-iteration-count:infinite;
}
div.directive-status-granted {
    background-color:#009900;
}
div.directive-status-denied {
    background-color:#CC2A28;
}

.input { border:1px inset #ccc;background-color:white; border-radius:4px; padding:4px;min-width:200px;font-size:16px;}
