/*Base*/
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; height:100%;}
html, button, input, select, textarea { font-family: "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; color:#3e3e3e; }
img {border: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, img { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
.hidden { display: none !important; }

h1{ color: #000000;font-size: 20px}
h2{color: #000000;font-size: 18px}
h3{color: #000000;font-size: 16px}
h4{color: #000000;font-size: 14px}
h5{color: #000000;font-size: 14px}
h6{color: #000000;font-size: 14px}
p{color: #202020;font-size: 18px}
li{color: #202020;font-size: 16px;margin-bottom: 8px;}
li a{color:#5195ce}
li a:hover{color:#000000 !important}
li a:visited{color:#5195ce}
a{ color: #5195ce;word-wrap: break-word;}
a:hover{color: #000000}
a:visited{color: #1a5586}
#imgLogo{background-image: url(../img/logos/emblem.png);}

html { -webkit-font-smoothing: antialiased; }
.clearfix:after {
   visibility: hidden;
   display: block;
   font-size: 0;
   content: " ";
   clear: both;
   height: 0;
   }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
   
* {
    outline: none;
}
body { 
    font-size: 12px;
    line-height: 1.6em;
    background-color: #171717;
    margin: 0;
    padding: 0;
    border: 0;
    overflow-y: auto;
    height: 100%; 
    max-height: 100%; 
}

#contentleftblock {
    display: block;
    width: 214px;
    min-height: 95%;
    padding: 0;
    margin:0;
    overflow: hidden;
    position: absolute;
    top: 44px;
    left: 4px;
}

#contentmainblock {
    background-color: #5195ce;
    color: #ffffff !important;
    padding: 8px 8px 8px 8px !important;
    display: block;
    position: absolute;
    top: 44px;
    left: 218px;
    width:640px;
    height:480px;
    z-index: 1;
}

#contentmaininnerbody {
    background-color: #ffffff !important;
    height: 100%;
    overflow: auto;
    z-index: 100;
}
#contentmaininnerbody h1, #contentmaininnerbody h2, #contentmaininnerbody h3, #contentmaininnerbody h4, #contentmaininnerbody p, #contentmaininnerbody a {
    margin: 16px;
    padding: 0;
}
#contentmaininnercontent {
    margin: 0;
}
#contentmainbottomleft {
    position: absolute;
    left: 8px;
    display: inline-block;
}

#contentmainbottomright {
    position: absolute;
    right: 0;
    color: #ffffff;
    font-size: 18px;
    display: inline-block;
    width: 160px;
}

.contentmainbottomsmall {
    color: #ffffff;
    font-size: 10px;
    opacity: 0.5;
    -moz-opacity: 0.5;
    padding: 0;
    margin: 0;
}

.contentmainbottommedium {
    color: #ffffff;
    font-size: 14px;
    padding: 0;
    margin: 0;
}

.contentmainbottomlarge {
    color: #ffffff;
    font-size: 18px;
    padding: 0;
    margin: 0;
}

#appletType {
    position: relative;
    margin: 8px 8px 0 0;
    float: right;
    display: inline-block;
}

.labTimeBlock {
    height: 56px;
    display: inline-block;
}

.divider {
    background: url(../img/2x40-Divider.png) no-repeat;
    margin: 8px 4px 0 4px;
    width: 2px;
    height: 40px;
    display: inline-block;
}
#partnerImage {
    position: absolute;
    display: inline-block;
}
#sideswitch {
    position: absolute;
    left: 85px;
    width:44px;
    height:44px;
    text-indent: -999px;
    display: inline-block;
    cursor: pointer;
}
.switchopen { background-image:url('../img/ico-sideopen.png'); background-repeat: no-repeat;} 
.switchopen:hover { background-position: 0 -44px; }
.switchclosed { background-image:url('../img/ico-sideclosed.png'); background-repeat: no-repeat;}
.switchclosed:hover { background-position: 0 -44px; }
.findingLab{background:url('../img/lab-check-40.gif') no-repeat 8px 20px;background-color: #000000 !important;min-height:100%;margin:-16px 0;padding:16px 0 0 48px;}
#contenttop {
    height: 31px;
    color: #ffffff;
    display: block;
    font-size: 20px;
    text-align: left;
    padding-top: 11px;
    position: absolute;
    top: 0;
    left: 218px;
    width: 664px;
    height: 33px;
    line-height: 1em;
    z-index: 9998;
}
#contenttop p {
    display: inline-block;
}

#labseparator {
    height:44px;
    line-height: 44px;
    font-size: 20px;
    padding: 0 0 0 50px;
    background-image:url('../img/logos/ico-50-plabs-5195CE.png'); background-repeat: no-repeat;
    margin-bottom: 4px;
}
#labseparator p {
    color: #FFFFFF !important;
}
.device {
    background-color: #202020;
    width: 100%;
    height: 100%;
}

#contentleftblock a {
    height:44px;
    position: relative;
    display:block;
    background-color: #202020;
    margin: 0 4px 4px 0;
    padding: 0 ;
    overflow: hidden;
    color: #666666;
    text-decoration: none;
    font-size: 16px;
}
#contentleftblock a:hover {
    background-color: #2f2f2f;
    color: #ffffff;
    background-position: 0 -44px;
}

.ico-text {
    margin-left: 44px;
    padding-top: 12px;
    display: block;
}

.stateOn {
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    height: 12px;
    background: url(../img/12-currentstatus.png) no-repeat;
}
.stateOff {
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    height: 12px;
    background: url(../img/12-currentstatus.png) no-repeat;
    background-position: 0 -24px;
}
.stateBusy {
    position: absolute;
    left: 0;
    top: 0;
    width: 12px;
    height: 12px;
    background: url(../img/12-currentstatus.png) no-repeat;
    background-position: 0 -12px;
}
.ico-home { background: url(../img/ico-home.png) no-repeat;}
.ico-learn { background: url(../img/ico-learn.png) no-repeat;}
.ico-help { background: url(../img/ico-help.png) no-repeat;}
.ico-tutorial { background: url(../img/ico-tutorial.png) no-repeat;}
.ico-login { background: url(../img/ico-login.png) no-repeat;}
.ico-mgmt { background: url(../img/ico-mgmt.png) no-repeat;height: 32px;}

.ico-switch { background: url(../img/ico-switch.png) no-repeat;}
.ico-router { background: url(../img/ico-router.png) no-repeat;}
.ico-db { background: url(../img/ico-dbsrv.png) no-repeat;}
.ico-ad { background: url(../img/ico-activedir.png) no-repeat;}
.ico-w8 { background: url(../img/ico-win8.png) no-repeat;}
.ico-pc { background: url(../img/ico-win8.png) no-repeat;}
.ico-web { background: url(../img/ico-websrv.png) no-repeat;}
.ico-email { background: url(../img/ico-mailsrv.png) no-repeat;}
.ico-server { background: url(../img/ico-server.png) no-repeat;}
.ico-esx { background: url(../img/ico-server.png) no-repeat;}
.ico-fileserver { background: url(../img/ico-fileserver.png) no-repeat;}

.ico-logout{background: url(../img/32-logout.png) no-repeat;width: 32px;height: 32px;}
.ico-liveSupport{background: url(../img/32-message.png) no-repeat;}
.ico-notice{background: url(../img/32-notice.png) no-repeat;}
.ico-alerts{background: url(../img/32-alert.png) no-repeat;}
.ico-settings{background: url(../img/32-cogs.png) no-repeat;}
.ico-user{background: url(../img/32-user.png) no-repeat;}
.ico-down{ background: url(../img/tooltip-arrow-down.png) no-repeat 70px 7px;padding-right: 20px;}
.ico-applet{background: url(../img/62x40-clienttoggle.png) no-repeat;width: 62px;height:40px}

.ico-poweron{background: url(../img/40-power.png) no-repeat;}
.ico-poweroff{background: url(../img/40-power.png) no-repeat; background-position: 0 -120px}
.ico-powerreboot{background: url(../img/40-reset.png) no-repeat;}
.ico-powerreset{background: url(../img/40-restart.png) no-repeat;}
.ico-powerbackup{background: url(../img/40-savestate.png) no-repeat;}
.ico-powerrestore{background: url(../img/40-loadstate.png) no-repeat;}
.ico-powerreconnect{background: url(../img/40-re-connect.png) no-repeat;}
.ico-powersuspend{background: url(../img/40-suspend.png) no-repeat;}
.ico-request-working{background: url(../img/48-working.png) no-repeat;margin: 8px;}
.ico-working{background: url(../img/busyanim-40-blue-practice-labs.gif) no-repeat;display: none}
.ico-powerrefresh{background: url(../img/40-status2.png) no-repeat;cursor: pointer;height: 40px;width: 40px;margin-top: 0;float: left;margin-right: 0;}
.ico-powerrefresh:hover {background-position: 0 -40px}
.ico-noconnect{background: url(../img/40-dead.png) no-repeat;}

.ico-copy{background: url(../img/40-copy.png) no-repeat;}
.ico-paste{background: url(../img/40-paste.png) no-repeat;}
.ico-autologin{background: url(../img/40-autologin.png) no-repeat;background-position: 0 -80px;cursor:pointer}
.ico-autologin:hover{background-position: 0 -40px;}
.ico-autologindisabled{background: url(../img/40-autologin.png) no-repeat;background-position: 0 0;cursor:pointer}
.ico-autologindisabled:hover{background-position: 0 -120px;}

.ico-msword{background: url(../img/word.png) no-repeat;width: 16px;height: 16px;position: absolute;right: 8px;top:4px;cursor:pointer}
.ico-adobepdf{background: url(../img/pdf.png) no-repeat 0 2px;padding-left: 20px;position: absolute;right: 8px;top:4px;cursor: pointer}
.moduleBack{position: absolute;right: 8px;top: 24px;}

.ico-c-default{background: url(../img/ico-r-default.png) no-repeat;}
.ico-c-move{background: url(../img/ico-r-move.png) no-repeat;}
.ico-c-popup{background: url(../img/ico-r-popup.png) no-repeat;}
.ico-c-snpright{background: url(../img/ico-r-snpright.png) no-repeat;}
.ico-c-max{background: url(../img/ico-r-max.png) no-repeat;}
.ico-c-min{background: url(../img/ico-r-min.png) no-repeat;}
.processing{background: url(../img/processing-anim-480.gif) no-repeat;margin: auto auto auto auto;width: 480px;height: 480px;}
#deviceBusy:hover{background-position: 0 0;}
.powerico-48 {
    color: #cacaca;
    cursor: pointer;
    height: 40px;
    width: 40px;
    display: none;
    margin-top: 0;
    float: left;
    margin-right: 8px;
}
.powerico-48:hover {
    background-position: 0 -40px;
    color: #ffffff;
}

/* applets */
#applets {
    float: right;    
    height: 38px;
    margin: -4px 0 0 5px;
    display: inline-block;
}
.topApplet {
    width: 40px;
    float: right;
    height: 32px;
    margin-left: 5px;
    cursor: pointer;
    display: inline-block;
}
.topApplet:hover {
    background-position: 0 -32px;
}
.topAppletActive {
    background-position: 0 -128px;
}
.topAppletIndicator {
    position: relative;
    top: -4px;
    right: -26px;
    font-size: 13px;
}

.topMenu{
    height: 44px !important;
    padding-left:37px;
    font-size:14px;
    color: #666666;
    text-decoration: none;
    line-height: 1.2em;
    margin-top:7px;
    display: inline-block;
}
.topMenu:hover {
    background-position: 0 -32px;
    color: #ffffff;
}


.ui-tooltip {
    padding: 4px;
	color: #000000;
	position: absolute;
	background: #ffffff;
	border: 2px solid #ffffff;
    text-align: center;
    font-size: 11px;
    z-index: 9999;
    -webkit-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    -moz-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
}
.ui-tooltip:after, .ui-tooltip:before {
	left: 100%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;

}

.ui-tooltip:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #ffffff;
	border-width: 2px;
	top: 50%;
	margin-top: 2px;

}
.ui-tooltip:before {
    border-color: rgba(194, 225, 245, 0);
	border-left-color: #ffffff;
	border-width: 7px;
	top: 50%;
	margin-top: -7px;

}

.mainHeading{padding: 0;margin: 0;font-size: 20px;font-weight: normal;color: #ffffff;overflow: hidden;height: 26px;display: block;float: left;line-height: 1.1em}
.mainHeadingBack{background: url(../img/32-back.png) no-repeat;background-position: -8px -4px;padding: 0 0 0 24px;}
.mainHeading a { color: #ffffff;text-decoration: none}
.mainHeading a:hover{ color: #5195ce !important;}
.mainHeading a:visited{ color: #ffffff;}
.textError{ color: #990000;line-height: 1em}

.contentTools{ min-height: 16px;padding: 4px 8px 0 0;width: 120px;position: absolute;right: 0;top: 0;background-color: inherit}
.contentTitle{position: absolute;left: 8px;top: 2px;color: #ffffff !important;font-size: 14px;}
.contentPositioning {cursor: pointer;float: right;width: 16px;height: 16px;margin-left: 8px;}


.terminal{ background-color: #000000;color: #ffffff;word-break-wrap: break-word;word-break: break-all;overflow-x: auto;overflow-y: auto;line-height: 1.2em;display: none;}
.terminalConnected{ display: block;overflow: hidden }
.ciscoTerminal{ background-color: #000000;color: #ffffff;font-family: Courier New, monospace;overflow-y: scroll;height: 100%;font-size:15px }
.noTerminal{ overflow: hidden;min-height: 100%;background-color: #000000;color: #ffffff;display: none}
.terminalBuffer{ padding-left: 16px;}
.terminalWindow{ padding-left: 16px;}
.terminalAlert{background-color: #ffa500 !important}
.cursor{ background-color: #2e8b57;margin-bottom: 3px;}
.hidden{display: none}
.nullterminal{ background-color: #708090;color: #ffffff;text-align: center;padding: 0;}
.nullterminal p { line-height: 1.5;}
.nullterminal div { margin: 0 auto 0 auto;padding-top: 100px;width: 760px;height: 200px;}
.mylab{ font-weight: bold;color:#483d8b}

#contentRightBlock {
    display: block;
    width: 100px;
    height: 100px;
    margin-left: 4px;
    font-size: 14px;
    position: absolute;
    left: 1514px;
    top: 44px;
    display: none;
    overflow: auto;
}

#fragmentContentBlock {
    position: absolute;
    overflow: hidden;
    height: 690px;
    margin: 0;
    padding: 8px;
    background-color: #5195ce;
}
#fragmentContentBlockInnerTools {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 56px;
    width: 100%;
    background-color: #5195ce;   
}
#fragmentContentBlockInner {
    background-color: #2f2f2f;
    margin: 0;
    padding: 8px 0 8px 8px;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    overflow-y: scroll;
}

#fragmentContentBlock .exerciseTitle{
    color: #a8cae6;
}

.fragmentResize {
    width: 16px;
    height: 16px;
    position: absolute;
    bottom: 16px;
    right: 1px;
    background-color: #ff4500;
}

.tools {
    height: 56px;
    width: 100%;
    overflow: hidden;
    background-color: #5195ce;
    margin: 8px 0 0 -8px;
    padding: 0 8px 0 8px;
    display: none;
}

#fragmentDefault {
    display: block;
    position: absolute;
    top: 44px;
    left: 210px;
    width:640px;
    height:480px;
    margin-left: 8px;
    background-color: #5195ce;
    overflow: hidden;
    display: none;
    z-index: 10;
}

#fragmentRight {
    display: block;
    position: absolute;
    top: 44px;
    left: 1536px;
    width:640px;
    height:480px;
    margin-left: 8px;
    background-color: #5195ce;
    overflow: hidden;
    display: none;
    z-index: 10;
}


#fragmentMove {
    display: block;
    position: absolute;
    top: 94px;
    left: 258px;
    width:640px;
    height:480px;
    margin-left: 8px;
    background-color: #5195ce;
    overflow: hidden;
    display: none;
    z-index: 100;
    cursor: move;
    -webkit-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    -moz-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
}

#exercise {
    padding: 16px;
    background-color: #ffffff;
    color: #000000 !important;
    line-height: 1.6em;
    cursor: default;
    min-height: 100%;
}

.exerciseHighlight {
    background-color: #ff8c00 !important;
}
#fragmentNavigation {
    list-style-type:none;
    margin: 24px 0 0 -32px;
    padding: 0;
}
.activeExercise {
    color: #ffffff !important;
}
.accessedExercise {
    color: #7f7f7f !important;
}
#fragmentNavigation li {
    font-size: 22px;
    margin-right:16px;
    display: inline;
    cursor: pointer;
    color: #1f1f1f;
}
#fragmentNavigation li:hover {
    color: #ffffff;
}

#fragmentNavigation .size {
    width: 38px;height: 16px;position: absolute;left: 8px;top:0;cursor: pointer;font-size: 16px;padding: 0;color: #000000;
}
#fragmentNavigation .size span:hover{ color: #ffffff;}

#fragmentNavigation a {
    color: #ffffff;
    font-size: 14px;
}
#fragmentNavigation a:hover {
    color: #000000 !important;
}
#fragmentNavigation a:visited {
    color: #ffffff;
}
#frag_100 {
    text-decoration:none;
    float:right;
    font-size:14px;
    margin: 8px 8px 0 0;
}
.img {
    max-width: 100%;
    margin: 8px 0 8px 0;
}

#deviceAlerts {
    display: block;
    position: absolute;
    top: 44px;
    left: 218px;
    height: 32px;
    background-color: #5195ce;
    overflow: hidden;
    display: none;
    z-index: 100;
    padding: 0 8px 16px 8px;
}
#deviceAlerts p{color: #ffffff !important;}

.appletContent {
    background-color: #202020;
    color: #ffffff;
    width: 348px;
    z-index: 1000;
    position: absolute;
    right: 16px;
    top: 52px;
    line-height: 1.4em;
    display: none;
    max-height: 600px;
    overflow-y: auto;
    margin:0;
    padding:16px;
    -webkit-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    -moz-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
}
.appletContent p {
    padding: 0;
    margin: 0 0 4px 4px;
    color: #ffffff;
    width: 340px;
    font-size: 14px;
    border-bottom: 1px dotted #2f2f2f;
}
.appletContent p:hover {
    background-color: #5f5f5f;
}
.messageDelete {
    position: absolute;
    right: 4px;
    top: 4px;
    width: 24px;
    height: 24px;
    margin-left: 8px;
    background: url(../img/24-close-lt.png) no-repeat;
    cursor: pointer;
}
.messageDelete:hover{background-position: 0 -24px}

#launchInNewWindowSetting{ background-color: #ffffff;color: #000000 !important; padding:0 3px 0 2px}
#settingsContent{ display: inline-block;display:none}
#settingsContentInner{background-color: #3f3f3f}

.deviceResolutionSelected {
    background-color: #6495ed;
}

.menuHeading {
    color: #ffffff;
    margin: 0;
    padding: 0;
    cursor: default !important;
}
.menuInput {
    border: none;
    height: 32px;
    width: 320px;
    font-size: 14px !important;
    margin: 0 0 4px 2px !important;
    padding: 0 0 0 8px !important;
}
pre, code { font-family: monospace, sans-serif;}
pre code {
	line-height: 1.6em;
	}
pre {
	border-left: 8px solid #aaaaaa;
    background-color: #f0f0f0;
    color: #000000;
	margin: 0 0 16px 0;
    padding: 8px;
	overflow: auto;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
}

/* target IE7 and IE6 */
*:first-child+html pre {
	padding-bottom: 8px;
	overflow-y: hidden;
	overflow: visible;
	overflow-x: auto; 
	}
* html pre { 
	overflow: visible;
	overflow-x: auto;
}



#powerFunctions p {
    color: #ffffff !important;
}
.validInput {
    border-left: 8px solid #006400 !important;
}
.invalidInput {
    border-left: 8px solid #ff8c00 !important;
}

#activityPromptHeading{color: #5195ce}
#activityPromptYes{color: #008b8b;font-weight: bold}
#activityPromptNo{color: #00bfff;font-weight: bold;margin-left: 50px;}
.active {
    width: 100%;
    background-color: #5195ce !important;
    color: #ffffff !important;
}
.active:hover{
    background-color: #5195ce !important;
}
#activityPrompt {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -moz-opacity: 0.9;
    opacity: 0.9;
    background-color: #1f1f1f;
    text-align: center;
    line-height: 1.5em;
    font-size: 20px;
    display: none;
}
#activityPrompt h2, #activityPrompt p {color: #ffffff !important}
.activityResponseMessage:hover {
    cursor: pointer;
    color: #6495ed !important;
}
.warningTime{ font-size: 30px;}
.warningWrap{ font-size: 24px;}
.warningTimeOrange{ color: #ff8c00 !important}
.warningTimeRed{ color: #ff4500 !important}
.menuItem{cursor: pointer}
.menuItemHighlight{padding: 0 3px 2px 3px;}
.menuItemHighlightSelect{padding: 0 3px 2px 3px;background-color: #ffffff!important;color: #000000!important}
.menuItemHighlightGreyed{color: #999999 !important}
.menuItemHighlight:hover {background-color: #ffffff;color: #000000 !important;cursor: pointer}
#userFunctions p{ font-size: 13px;padding: 0 0 2px 0;margin: 4px 0 0 0;line-height: 1em;color:#ffffff !important}

.saveLayout {
    cursor: pointer;
    background-color: #008000;
}
.restoreLayout {
    cursor: pointer;
    background-color: #008b8b;
}

#emptyTools input[type=text] {
    border: 4px solid white; 
    -webkit-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    padding: 8px;
    background: rgba(255,255,255,0.5);
    margin: 0 0 8px 0;
    font-size: 18px;
    width: 300px;
}

.courseLink {
     color: #000000;
     font-size: 15px;
     text-decoration: none;
     padding: 0 0 0 32px !important;
     margin: 0 0 0 0 !important;
     background: url(../img/16-link.png) no-repeat -16px 0;
     background-position: 0 3px;
}
.courseLink:hover{color: #ffffff;}
.courseLink:visited {color: #1e90ff;}
.courseLink:visited:hover {color: #ffffff;}
.courseComplete{color:#006400 !important}
.courseInProgress{color: #1e90ff !important}
.courseComplete:hover{color:#ffffff !important}
.courseInProgress:hover{color: #ffffff !important}

.courseFilter {
     background-color: #ff8c00;
}
.panel{ 
    background-color: #B6D7F3;
    /*-webkit-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    -moz-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 16px 8px -16px rgba(2,0,0,0.1); */
    margin: 8px;
    border-bottom: 2px solid #f0f0f0;
    padding: 8px 8px 8px 8px;
}

.expiredCourse {
     padding: 0;
     margin: 0;
     color: #ff0000;
}

#alertWindow {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -moz-opacity: 0.9;
    opacity: 0.9;
    background-color: #1f1f1f;
    text-align: center;
    line-height: 1.5em;
    font-size: 20px;
    display: none;
    z-index: 10001;
}
#alertContent {
    display: none;
    max-width: 75%;
    min-height: 200px;
    position: relative;
    margin: 100px auto 0 auto;
    padding: 16px;
    -moz-opacity: 1;
    opacity: 1;
    background-color: #ffffff;
    color: #000000;
     -webkit-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    -moz-box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);
    box-shadow: 0px 1px 15px rgba(50, 50, 50, 1);   
    z-index: 10002;
}

input[type=button] {
    padding: 20px;
    margin: 0 0 8px 16px;
    font-size: 18px;
    cursor: pointer;
    border: 1px solid #333333;
}

input[type=button]:hover {
    background: #cfcfcf;
    border: 1px solid #9f9f9f;
}

select {
    padding: 20px;
    margin: 0 0 8px 16px;
    font-size: 18px;
    cursor: pointer;
}

input[type=text] {
    padding: 20px;
    margin: 0 0 8px 16px;
    font-size: 18px;
    cursor: pointer;
}

textarea {
    padding: 20px;
    margin: 0 0 8px 16px;
    font-size: 18px;
    height: 200px;
}


.error{color:#990000 !important}

.contentPanel {
     background-color: #a8cae6;
    padding: 8px 8px 8px 8px;
    margin-bottom: 16px;
    -webkit-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    -moz-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 16px 8px -16px rgba(2,0,0,0.1);
}
.warningPanel {
    background-color: #ff0000;
    border-left: 8px solid #000000;
    padding: 4px;
    margin: 8px;
}
.collapsedPanel {
    padding-left: 10px;
    background: url(../img/tooltip-arrow-down.png) no-repeat 2px 7px;
}

#login input[type=text] {
    border: 4px solid #000000; 
    -webkit-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    padding: 16px;
    margin: 0 0 8px 0;
    font-size: 18px;
    width: 200px;
    color: #000000;
}
#login input[type=password] {
    border: 4px solid #000000; 
    -webkit-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    -moz-box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    box-shadow: inset 0 0 8px  rgba(0,0,0,0.1),0 0 16px rgba(0,0,0,0.1); 
    padding: 16px;
    margin: 0 0 8px 0;
    font-size: 18px;
    color: #000000;
}

table {
    *border-collapse: collapse; /* IE7 and lower */
    border-spacing: 0;
    width: 100%;
}

.bordered {
    border: solid #000000 1px;
    margin: 8px 8px 16px 8px;
    -webkit-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    -moz-box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 8px 8px -16px rgba(2,0,0,0.1); 
    box-shadow: 0 4px 4px 0  rgba(2,0,0,0.1),0 16px 8px -16px rgba(2,0,0,0.1);
}

.bordered tbody tr:hover {
    background: #fbf8e9;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;     
}    
thead { 
    font-weight: bold;
    background: #a8cae6;
    color: #ffffff;
}
.bordered thead td {
    border-left: 1px solid #000000;
    padding: 8px;
    text-align: left;    
}
.bordered tbody td {
    border-left: 1px solid #000000;
    border-top: 1px solid #000000;
    padding: 8px;
    text-align: left;    
}

.bordered th {
    background-color: #dce9f9;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
    background-image: -webkit-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:    -moz-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:     -ms-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:      -o-linear-gradient(top, #ebf3fc, #dce9f9);
    background-image:         linear-gradient(top, #ebf3fc, #dce9f9);
    -webkit-box-shadow: 0 1px 0 rgba(255,255,255,.8) inset; 
    -moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;  
    box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;        
    border-top: none;
    text-shadow: 0 1px 0 rgba(255,255,255,.5); 
}

.bordered td:first-child, .bordered th:first-child {
    border-left: none;
}

.progressIndicator {
    /*position: relative;*/
    float: right;
    width: 100px;
    margin: 0 -8px 2px 0;
    padding-bottom: 1px;
    font-size: 10px;
    text-align: center;
    /*clear: right;*/
    line-height: 1.6em;
}
.progressModule {
    margin: -8px -8px 8px;
}
.progressNotStarted {
    color: #ffffff !important;
    background-color: #000000;
}
.progressStarted {
    color: #000000 !important;
    background-color: #1e90ff;
}
.progressComplete {
    color: #ffffff !important;
    background-color: #006400;
}
#supportBar {
    padding: 0 8px 0 8px;
    overflow: auto;
    background-color: #ffffff;
    display:none;
    min-height: 100%
}
.helpIcon, .helpSelection {
    width:78px;
    height:88px;
    margin:0;
    text-align: center;
    background-repeat: no-repeat;
    background-position: 12px 28px;
    background-color: #ffffff;
    display: inline-block;
    cursor: pointer;
    padding: 4px;
}

.helpSelection:hover{background-color:#cccccc !important}
.helpIcon p{ color: #000000;font-size: 12px;margin:-8px 0 !important}
.helpIconHover { background-color: #f0f0f0; }

#helpConnect { background-image: url(../img/64-connect.png);}
#helpKeyboard { background-image: url(../img/64-keyboard.png); }
#helpScreenLayout { background-image: url(../img/64-layout.png); }
#helpScreenSize { background-image: url(../img/64-screen-size.png); }
#helpTutorial { background-image: url(../img/64-tutorial.png); }
#helpCall { background-image: url(../img/64-help.png); }
.helpContent { display:none; background-color: #ffffff; padding: 8px; }
.helpContent p, .helpContent ul li{ color: #000000 !important;}
.helpLayouts{background: url(../img/screenlayouts.png) no-repeat;width: 436px;height:86px}
.helpScreenSmall{background: url(../img/helpDialogSmall.png) no-repeat;width: 640px;height:480px}
.helpLangBar2012{background: url(../img/helpLang2012.png) no-repeat;width: 640px;height:480px}
.helpLangBar2008{background: url(../img/helpLang2008.png) no-repeat;width: 640px;height:480px}
#helpJava{background: url(../img/logo_java.png) no-repeat;padding-left: 72px;min-height:85px}
#helpHtml5{background: url(../img/logo_html5.png) no-repeat 0 6px;padding-left: 72px;min-height:85px}
.screenHelper{ position: absolute;top: 48px;left: 222px;border: 4px dashed #ff0000;z-index: 10000;display: none;}
.dimensionText{margin: 0 auto 0 auto;text-align: center;font-size: 24px;color: #ff0000;max-width: 400px;height: 24px;background-color: #000000;padding: 8px;}

#deviceSelector{
	position: absolute;
    left: 40px;
	background: #ffffff;
	border: 4px solid #5195CE;
    max-width: 400px;
    height: 70px;
    display: none;
}
#deviceSelector:after, #deviceSelector:before {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#deviceSelector:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #ffffff;
	border-width: 24px;
	margin-top: -24px;
}
#deviceSelector:before {
	border-color: rgba(81, 149, 206, 0);
	border-right-color: #5195CE;
	border-width: 30px;
	margin-top: -30px;
}
#deviceOnSelector {
	position: absolute;
    bottom: 48px;
    left: 16px;
	background: #ffffff;
	border: 4px solid #5195CE;
    width: 250px;
    display: none;
}
#deviceOnSelector:after, #deviceOnSelector:before {
	top: 100%;
	left: 16%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
#deviceOnSelector:after {
	border-color: rgba(255, 255, 255, 0);
	border-top-color: #ffffff;
	border-width: 32px;
	margin-left: -32px;
}
#deviceOnSelector:before {
	border-color: rgba(81, 149, 206, 0);
	border-top-color: #5195CE;
	border-width: 38px;
	margin-left: -38px;
}
#layoutCallout {
	position: absolute;
    top: 64px;
    right: 16px;
	background: #ffffff;
	border: 4px solid #5195CE;
    display: none;
}
#layoutCallout:after, #layoutCallout:before {
	bottom: 100%;
	left: 145px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
#layoutCallout:after {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 32px;
	margin-left: -32px;
}
#layoutCallout:before {
	border-color: rgba(81, 149, 206, 0);
	border-bottom-color: #5195CE;
	border-width: 38px;
	margin-left: -38px;
}
#deviceDescriptionSlim {
     position: absolute;
     left: 2px;
     background-color: #000000;
     color: #ffffff;
     width: 18px;
     padding: 4px;
     display: none;
     overflow:hidden;
     z-index: 500;
     border: 4px solid #ffffff;
     word-break:break-all;
}
#deviceDescriptionSlim h2{
    margin: 4px 4px 0 4px;
    font-size: 18px;
    color: #ffffff;
    word-break:break-all;
}

#deviceDescription {
	position: absolute;
    left: 2px;
    width: 184px;
	background: #000000;
	border: 4px solid #ffffff;
    display: none;
    padding: 0 8px 0 8px;
    z-index: 500;
}
#deviceDescription p{ color: #ffffff;font-size: 12px;margin: 0;}
#deviceDescription h2{ color: #ffffff}
#deviceDescription:after, #deviceDescription:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
#deviceDescription:after {
	border-color: rgba(0, 0, 0, 0);
	border-bottom-color: #000000;
	border-width: 8px;
	margin-left: -8px;
}
#deviceDescription:before {
	border-color: rgba(255, 255, 255, 0);
	border-bottom-color: #ffffff;
	border-width: 14px;
	margin-left: -14px;
}
.helpAssist{ background-color: #ff7777;border: 1px solid #000000;color: #000000;margin-left: 16px;max-width: 675px;}
#firstTimePanel {
    width:650px;
    position: absolute;
    top:-368px;
    right:0;
    left:0;
    margin: 0 auto 0 auto;
    z-index: 8000;
    background-color: #f0f0f0;
    padding:16px 16px 0 16px;
    -webkit-box-shadow: 0px 1px 15px #202020;
    -moz-box-shadow: 0px 1px 15px #202020;
    box-shadow: 0px 1px 15px #202020;
    z-index: 10001;
}
.descriptionHighlight{color:#5195CE}

.menuButton{ cursor: pointer;background-color: #3a3a3a;text-align: center}
.menuButton:hover{ background-color: #ffffff !important;color: #000000 !important;cursor: pointer}
.chatPanel {display:none}
.chatMessage{ padding: 0;margin: 0 0 4px;line-height: 1em;font-size: 12px}
.chatDisplay {color: #6495ed;}
.ico-ciscoScript{background: url(../img/40-script.png) no-repeat;}