@import url("../../include/font/font-roboto.css");

/* General Styles */
body {background-color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 11px; }
p,div,ul,li,td,input,select,textarea {font-family: Arial, Helvetica, sans-serif; font-size: 11px; }
h1,h2,h3,h4,h5,h6 {font-family: Arial, Helvetica, sans-serif;}

h1 {font-size:150%;}
h2 {font-size:125%; margin-bottom: 5px; margin-top: 0px; }
h3 {font-size:100%; margin-bottom: 5px; margin-top: 10px; }
h4 {font-size:100%; margin-bottom: 5px; margin-top: 0px; font-weight: normal; } 

.small {font-size:85%; }
.note {font-size:85%; color:#666; font-style:italic }

/* Button and Link Styles */
a.button:active, a.button:link, a.button:visited, input.button, button.button {font-family: Arial, Helvetica, sans-serif; background:#fff url(../images/buttonbg_gray.png) left top repeat-x; border:1px solid #ccc; color:#333; display:inline-block; margin:0; padding:4px; text-align:center; text-decoration:none; width:auto; font-weight:bold; font-size:12px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
a.button:hover, input.button:hover, button.button:hover {background-color:#fff; background-image:none; color:#000; cursor:pointer }

a.buttonSmall:active, a.buttonSmall:link, a.buttonSmall:visited, input.buttonSmall, button.buttonSmall {padding:2px 4px; font-size:10px}
a.buttonBlue:active, a.buttonBlue:link, a.buttonBlue:visited, input.buttonBlue, button.buttonBlue {background:#0091c5 url(images/ui-bg_highlight.png) 0 -10px repeat-x; color:#fff; font-size:125%; padding:4px 8px}
a.buttonBlue:hover, input.buttonBlue:hover, button.buttonBlue:hover {background-color:#fff; background-image:none; color:#000; cursor:pointer }

a:active, a:link, a:visited {font-weight:bold; text-decoration: none; color: #666; }
a:hover {color: #333}

/* Common Page Elements */
.pageContainer {width:100%; text-align:center; margin:0px; padding:0px;}
.pageContent {width:900px; margin:0 auto; text-align:left;}

.utilityNav {width:600px; float:right; text-align:right; color:#666; font-size:11px; clear:both; vertical-align:bottom}
.utilityNav a:active, .utilityNav a:link, .utilityNav a:visited {color:#666;}
.utilityNav a:hover {color:#333;}

input[type="text"], input[type="password"], input[type="email"], input[type="tel"], select, textarea {display:block;padding:5px; border:1px solid #ccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; max-width:100%}
input[type="radio"], input[type="checkbox"] { border:none;}
input[type="text"]:focus, input[type="password"]:focus,input[type="email"]:focus, input[type="tel"]:focus, textarea:focus {border:3px solid #666; padding:3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}

a img {border:0}

/* errors */
.errorText{ color: #e75301; }
.error{ color: #e75301; }
.errorCheckArrows:before { width: 10px; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 7px solid #e75301; content: ""; position: absolute; top: 0px; left: -17px; }
.errorCheckArrows { background-color: #e75301; color: #fff; padding: 2px 6px 2px 2px; font-size: 9px; width: auto!important; height: 12px; line-height: 12px; position: relative; left: 20px; bottom:2px; display:inline-block!important}
.errorCheckArrowsElm {border-color:#e75301 !important; background-color:#fffaeb; color:#e75301; padding:4px;}
#passWordError .errorCheckArrows {left:0}

/* Other */
.clear {clear:both; font-size:0px; height:0px}


/* Reg Page */
body {background-color:#fff}
#regPageBody {margin:0}
#eventBanner {margin:10px auto 0 auto; text-align:left; padding:5px; background-color:#fff;  border:3px solid #f5f5f5;}
#regContentContainer {background-color:#ddd; padding:20px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#regPageLoginText { width:260px; padding:10px; text-align:center;}
.regtextarea {width:95%; min-width: 198px; height: 100px; margin-left: 2px; margin-top: 2px;}
#regPageLogin {width: 250px; float: right; clear: right; padding: 10px; background-color:#f5f5f5; border:3px solid transparent; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-bottom:20px}
#regPageHelp {text-align: right;}

#footer {width: 750px}
#regPageSocial {width: 300px; padding: 0; text-align: left; margin-top: 10px; display:inline-block}
#regFormContainer {width: 540px; float: left; background-color: #f5f5f5; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-bottom: 3px solid transparent; border-left: 3px solid transparent; border-right: 3px solid transparent; padding:10px; 
}
#regEventText {width: 540px; float: left; background-color: #fff; padding: 10px; border-bottom: 1px dotted #ccc; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border-top: 3px solid transparent; border-left: 3px solid transparent; border-right: 3px solid transparent}

.loginSectionHeader, .regSectionHeader {font-size:12px; padding-bottom:20px; color:#333; font-weight:bold}
#loginPassword {margin-top:15px}
#loginEmail span, #loginEmail input, #loginEmail button, #loginPassword span, #loginPassword input, #loginPassword button {display:block}
#registerFieldsTable {width:100%}
#registerFieldsTable td {padding-bottom:10px;}
#registerFieldsTable select, #registerFieldsTable input {max-width:515px}
#loginFieldsTable {padding:3px}
#loginFieldsTable input {max-width:215px}
a.buttonLogin:active, a.buttonLogin:link, a.buttonLogin:visited, input.buttonLogin, button.buttonLogin  {margin-top:10px}
#overlay{display: none;position: absolute;top:0%;left:0%;width:100%;height:95%;z-index:51;-moz-opacity: 0.5;opacity:.50;filter:alpha(opacity=50);}
#helpPopup{display: none;position: absolute;margin-left:-370px;left:50%;top:10px;padding:0px;width:740px;height:90%;border: 2px solid #aaa;background-color: white;z-index: 52;overflow: none;text-align: center;}

.reminderButton {float:right}
.reminderButton a:active, .reminderButton a:link, .reminderButton a:visited { background:#ededed url(../images/buttonbg_gray.png) left top repeat-x; border:1px solid #ccc; color:#333; display:inline-block; margin:0px; padding:5px 8px 4px 4px; text-align:center; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-decoration:none; width:auto; font-weight:bold; color:#333; font-size:12px; line-height:20px}
.reminderButton a:hover {color:#000; background-image:none; background-color:#fff}
.reminder {color:#000; background-image:none}
.reminderButton img {float:left;  border:none}

#pre_disclaimer {width:100%;height:90%;overflow:auto}
#pre_disclaimer_buttons {text-align:center; margin-top:10px}
#tpBug {float:right; margin:3px 20px 0 0;width:115px; text-align:right}
#webcastby {}
#privacyPolicy {display:inline-block; margin-left:20px}
#reg_footer_disclaimer ~ #privacyPolicy {margin-left:10px}
#privacyPolicy a {color:#99a3a6; font-size:9px}
#reg_footer_disclaimer {float:left;padding:0 20px 0 0; width:760px; color:#666}
#reg_footer_disclaimer p {margin: 1.12em 0 0 0}

a.buttonFAQ:active, a.buttonFAQ:link, a.buttonFAQ:visited {font-family: Arial, Helvetica, sans-serif; background-color:#ededed ; display:inline-block; margin:5px 0; padding:4px 8px; text-align:left; text-decoration:none; width:auto; font-weight:normal; font-size:12px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; float:right;}
a.buttonFAQ:hover {background-color:#EF8A53; color:#fff; cursor:pointer}
a.buttonFAQ img {vertical-align:text-bottom}

.regLandingText {border-bottom:3px solid transparent!important}

/* Restrict Form Element Widths */
#registerFieldsTable {width:515px; table-layout:fixed}
#registerFieldsTable td {width:515px}

/* Images can't be wider than the Landing Page Text container */
#regEventText img {max-width:100%}
#regEventText td>img {max-width:800px; height: auto;}

.roomviewselect {text-align:center;cursor:pointer;border:3px solid #ccc; background-color:#eee; -webkit-border-radius: 11px; -moz-border-radius: 11px; border-radius: 11px; padding:20px; font-family:Arial, Helvetica, sans-serif; margin:0 auto;color:#333}
.roomviewselect:hover, .roomviewselect:focus {background-color:#fff; border-color:#00aeec}
.roomviewselect img {max-width:100%}
#inRoomView {margin:auto;width:100%;text-align:center}


/* =================== Only Reg Layout 4 ========================= */
#regLayout4 * {font-family:Roboto, Arial, Helvetica, sans-serif}

/* Bars */ 
#regTitleBar, #regDateBar, #regContentBar, #regFooterBar {text-align:center; padding:20px}
#regTitleBar {background-color:#00aeec}
#regTitleBar h1 {font-size: 3.0em; color:#fff; text-align:center; font-weight:300}
#regDateBar {background-color:#959595; color:#fff; padding-bottom:15px}
#regDateBar h2 {font-size: 2.0em; color:#fff; text-align:center; font-weight:300}
#regContentBar {background-color:transparent}  
#regContentBar p, #regContentBar div, #regContentBar ul, #regContentBar li, #regContentBar td, #regContentBar input, #regContentBar select, #regContentBar textarea {font-size:14px}
#regFooterBar {background-color:#333; border-top:4px solid #00aeec; color:#ccc!important}
.regContentWidth {width:900px; max-width:100%; margin:0 auto; text-align:left;}
#regContentBar .regContentWidth {min-height:300px}
#regContentBar .regContentWidth img {max-width:100%}
#regDateBar .reminderButton {float:none; margin-left:15px; display:inline-block; vertical-align:3px}
#regDateBar .reminderButton>a:active, #regDateBar .reminderButton>a:link, #regDateBar .reminderButton>a:visited {background: transparent url(../images/white-opacity-25.png) top left repeat; color:#fff; border:none; font-weight: 300; font-size:16px; padding: 8px 16px  }
#regDateBar .reminderButton>a:hover {background-image:url(../images/white-opacity-50.png); background-repeat:repeat}
#regDateBar .reminderButton>a img {display:none}
#regDateBar .reminderButton>a:before {content:" + "; font-size:24px;  vertical-align:top; padding-right:5px}

#reminderButtonSub {margin:0;padding:0;background-color:#959595}
#reminderButtonSub li {list-style-type: none;text-align:left;}
#reminderButtonSub a:active, #reminderButtonSub a:link, #reminderButtonSub a:visited {max-width:100%;border-radius:0; background: transparent; color:#fff; border:none; font-weight: 300; font-size:14px; display:inline-block; width:100%; padding:10px 0}
#reminderButtonSub a:hover{background-image:url(../images/white-opacity-50.png); }

/* Forms */ 
#regLayout4 label {text-align:left; color:#333}
#regLayout4 input[type="text"], #regLayout4 input[type="password"], #regLayout4 input[type="email"], #regLayout4 input[type="number"], #regLayout4 input[type="tel"], #regLayout4 select, #regLayout4 textarea {display:block; margin-bottom:10px;padding:10px; font-size:1.2em}
#regLayout4 input[type="text"]:focus, #regLayout4 input[type="password"]:focus, #regLayout4 input[type="email"]:focus, #regLayout4 input[type="number"]:focus, #regLayout4 input[type="tel"]:focus, #regLayout4 textarea:focus {border:3px solid #666; padding:8px;}
#regLayout4 input.buttonSubmit, #regLayout4 button.buttonSubmit, #regLayout4 a.buttonSubmit, #regLayout4 a:link.buttonSubmit, #regLayout4 a:visited.buttonSubmit {padding:10px 20px; font-size:1.2em; background-image:none; border:none; background-color:#00aeec; color:#fff}
#regLayout4 input.buttonSubmit:hover, #regLayout4 button.buttonSubmit:hover, #regLayout4 a.buttonSubmit:hover {background-image:url(../images/black-opacity-25.png); background-repeat:repeat} 
#regLayout4 .customQuestionWrapper {display:block; margin-bottom:10px;}
/*.loginFormElement {display:inline-block!important}*/

/* General Formatting */
a.footerLink:active, a.footerLink:link, a.footerLink:visited {font-weight:bold; text-decoration: none; color: #99a3a6; font-size:11px}
a.footerLink:hover {color: #eee}
#loginFormWrapper, #regFormWrapper {padding:20px 0; clear:both}
#regLayout4 #loginFormHeaderText, #regLayout4 #regFormHeaderText {margin:20px 0; font-size:1.2em; font-weight:bold}
#regFooterBar #tpBug {margin:0}
.segmentTitle {font-size:22px}
	

/* =================== Portals ========================= */

.segmentCheckBoxDiv {float:left; margin-right:5px; text-align:center; line-height:22px; margin-top:4px}
.segmentBlockWrapper img {max-width:100%}
.segmentCheckBoxDiv ~ .segmentBlockWrapper { margin-left:25px}
.viewSegmentButton a:active, .viewSegmentButton a:link, .viewSegmentButton a:visited { background: #f0f0f0 url("../images/buttonbg_gray.png") repeat-x scroll left top; border: 1px solid #CCCCCC; border-radius: 3px; color: #333333; display: inline-block; font-size: 12px; font-weight: bold; line-height: 20px; margin: 0 0 10px 20px; padding: 4px 8px; text-align: center; text-decoration: none; width: auto; }
.reminderButtonPortal a:active, .reminderButtonPortal a:link, .reminderButtonPortal a:visited { background: #f0f0f0 url("../images/buttonbg_gray.png") repeat-x scroll left top; border: 1px solid #CCCCCC; border-radius: 3px; color: #333333; display: inline-block; font-size: 11px; font-weight: bold; line-height: 11px; margin: 0px; padding: 2px 5px; text-align: center; text-decoration: none; width: auto; }
.viewSegmentButton a:hover, .reminderButtonPortal a:hover { background-image: none; background-color: #fff; color: #000000; }
a.view_unlink:active,a.view_unlink:hover,a.view_unlink:visited{font-weight:bold; text-decoration: none; color: #666;cursor: text;}

/* Layout 4 Portals */
#regLayout4 a.buttonSubmit {font-size:14px!important; padding:5px 10px!important}
.reminderButtonPortal #reminderButtonSub a:active, .reminderButtonPortal #reminderButtonSub a:link, .reminderButtonPortal #reminderButtonSub a:visited  {font-size:11px}
#regLayout4 .reminderButtonPortal>a:active, #regLayout4 .reminderButtonPortal>a:link, #regLayout4 .reminderButtonPortal>a:visited, #regLayout4 #regProfile {background: transparent url(../images/black-opacity-25.png) top left repeat; color:#fff; border:none; font-weight: 300; font-size:12px; padding: 6px 8px 4px 8px  }
#regLayout4 .reminderButtonPortal>a:hover, #regLayout4 #regProfile:hover {background-image:url(../images/black-opacity-50.png); background-repeat:repeat}
#regLayout4 a:active.view_link, #regLayout4 a:link.view_link, #regLayout4 a:visited.view_link {font-weight:500}
#regContentBar div.segmentBlockWrapper:first-child {margin-top:15px}

/* =================== Media Queries for Mobile Devices ============================*/

@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) and (orientation:portrait) {
	.pageContent, #regContentContainer {width:100%}
	#regContentContainer {padding:0!important}
	#regEventText, #regPageLogin, #regFormContainer, #regPageSocial, #regPageHelp, #reg_footer_disclaimer, #reg_footer, #webcastby, #portal_checkbox {width: auto!important; max-width:100%; float:none!important; clear:both }
	#webcastby {display:block; text-align:right}
	#regPageLogin, #regFormContainer {margin-top:10px}
	#regFormContainer, #regEventText {border:3px solid transparent}
	#helpPopup {left:0; margin-left:0; width:100%}
	.reminderButton, #regPageHelp {float:none; width:100%; text-align:center; margin:5px auto; clear:both}
	#regContentContainer {padding:10px}
	
	#regEventText {max-width:100% !important;}
	#regContentBar {}
	#regContentBar .regContentWidth {width:100%; max-width:100%; padding:0!important}
	.regContentWidth input {max-width:calc(100% - 20px)}
	.regContentWidth input[type="checkbox"] {max-width:100%;}
}

/* Do not put any code below the media queries */