﻿/************** font-face.css *************/
/* poppins-300 - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 300;
	src: local(''), url('../fonts/poppins-v20-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('../fonts/poppins-v20-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-regular - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	src: local(''), url('../fonts/poppins-v20-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('../fonts/poppins-v20-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-500 - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	src: local(''), url('../fonts/poppins-v20-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('../fonts/poppins-v20-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-700 - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 700;
	src: local(''), url('../fonts/poppins-v20-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('../fonts/poppins-v20-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-900 - latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 900;
	src: local(''), url('../fonts/poppins-v20-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
	url('../fonts/poppins-v20-latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/*******************************************************************/
/* GENERAL HTML ELEMENTS */
/*******************************************************************/

body
{
	font-family: Poppins , Helvetica, Arial;
	color: #000000;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6
{
	font-weight: 400;
	margin-bottom: 20px;
}
h1
{
	font-size: 36px;
	font-weight: 300;
	margin-right: 10px;
	color: #0068A9;
}
h2
{
	font-size: 30px;
	color: #0068A9;
	margin: 0 0 .83em;
}
h3
{
	font-size: 20px;
}
.section-div > h3
{
	margin-top:0;
	margin-bottom:0;
}
p
{
	font-size: 16px;
	line-height: 1.3;
	margin-bottom: 20px;
	color: #000;
}

a, input
{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
a
{
	color:#06c;
}
input[type="text"], select, textarea
{
	padding: 4px 8px;
	border:1px solid #BCD;
}



/*******************************************************************/
/* TEMPLATE - overall structure */
/*******************************************************************/

#outer
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: auto;
	background-color: #6391c7;
}
#wrapper
{
	width: 100%;
	margin: 0 auto;
	zoom: 1;
	overflow: hidden;
}
#headerOuter, #mainNavBarOuter, #mainOuter, #footerOuter
{
	width: 100%;
	margin: inherit auto;
	position: relative;
	overflow: hidden;
}
#header, #mainNavBar, #main, #footer
{
	width: 960px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}
#main
{
	padding-top: 0px;
	background-color: #e4f0fc; /*#bbcfe6;*/
}


/*******************************************************************/
/* TOPBAR - application badge, my account */
/*******************************************************************/

#topBar
{
	background-position: 0% 0%;
	position: relative;
	background-color: #E7E7E7;
	overflow: hidden;
	background: -moz-linear-gradient(top,  #c7c7c7 0%, #dddddd 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c7c7c7), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #c7c7c7 0%,#dddddd 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #c7c7c7 0%,#dddddd 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #c7c7c7 0%,#dddddd 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #c7c7c7 0%,#dddddd 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7c7c7', endColorstr='#dddddd',GradientType=0 ); /* IE6-9 */
	background-repeat: repeat;
	background-attachment: scroll;
}
#topBar.line-back
{
	background-color: #f5fAff;
	background-image: none;
	filter: none;
	border-top: 2px solid #69c;
	box-shadow: 0 2px 8px rgba(22,44,55,0.1) inset;
}

#topBarInner
{
	margin: 0 auto;
	width: 960px;
}
#productBadge, .button-container
{
	background-position: 0% 0%;
	color: #FFF;
	background: #89acd4; /* Old browsers */
	background: -moz-linear-gradient(top,  #89acd4 0%, #5b7db1 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#89acd4), color-stop(100%,#5b7db1)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #89acd4 0%,#5b7db1 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #89acd4 0%,#5b7db1 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #89acd4 0%,#5b7db1 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #89acd4 0%,#5b7db1 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89acd4', endColorstr='#5b7db1',GradientType=0 ); /* IE6-9 */
	background-repeat: repeat;
	background-attachment: scroll;
}
#productBadge
{
	font-size: 75%;
	color: #FFFFFF;
	background-color: #6391c7;
	padding: 0;
	display: inline-block;
	float: left;
	margin-left: 12px;
	position: relative;
	line-height: 20px;
}
#productLogo
{
	height: 20px;
	width: 20px;
	display: inline-block;
	color: #FFFFFF;
	font-weight: 700;
	text-align: center;
	border-right: 1px solid #47a;
	font-weight: 300;
}
#productLogo sm
{
	font-size: 70%;
	padding-left: 0px;
	vertical-align: baseline;
}
#productTitle
{
	border-left: 1px solid #8bd;
	display: inline-block;
	height: 20px;
	padding: 0px 10px 0 6px;
}
#accountPanel
{
	display: inline-block;
	float: right;
	margin-right: 12px;
	width: auto;
	text-align: right;
	height: 20px;
}
.button-container
{
	display: inline-block;
	height: 20px;
	width: auto;
}
a.myaccount, a.loginstatus, #Username
{
	text-decoration: none;
	color: #FFFFFF;
	display: inline-block;
	padding-right: 8px;
	font-size: 11px;
	white-space: nowrap;
	height: 20px;
	line-height: 20px;
	vertical-align: bottom;
}
a.myaccount, a.loginstatus
{
	border-left: 1px solid #8bd;
	border-right: 1px solid #47a;
	padding-left: 8px;
	float: left;
}
a.myaccount:hover, a.loginstatus:hover
{
	background: #89acd4;
}
#Username
{
	color: #197abc;
	float: left;
}
.icon-user.reverse, .icon-key
{
	color: #FFF;
	padding-right: 6px;
	font-size: 160%;
	text-align: left;
	margin-top: 2px;
	display: inline-block;
	float: left;
}
.loginstatus .icon-key
{
	margin-top: 1px;
}


/*******************************************************************/
/* HEADER - logo, title */
/*******************************************************************/

#headerOuter
{
	background-color: #FFFFFF;
}
#header {
	padding-left: 15px;
}
#logo {
	background-image: url(../images/ExamFXTC-combo-logo.png);
	background-repeat: no-repeat;
	height: 51px;
	margin-top: 20px;
	margin-left: 0px;
	text-indent: -2000px;
	display: block;
}

/*******************************************************************/
/* NAVBAR */
/*******************************************************************/

#mainNavBarOuter
{
	border-bottom: 1px solid #bcd;
	background-color: #89acd4;
	background: #89acd4; /* Old browsers */
	background: -moz-linear-gradient(top,  #89acd4 0%, #597bb0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#89acd4), color-stop(100%,#597bb0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #89acd4 0%,#597bb0 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89acd4', endColorstr='#597bb0',GradientType=0 ); /* IE6-9 */
	box-shadow: 0 2px 10px rgba(0,0,0,.3);
	height: 40px;
	z-index: 1;
}
#mainNavBar a
{
	text-decoration: none;
	display: inline-block;
	float: left;
	width: 239px;
	height: 2.5em;
	line-height: 2.5em;
	vertical-align: middle;
	color: #FFFFFF;
	border-right: 1px solid #9AB8CE;
}
#mainNavBar a:first-child
{
	width: 238px;
	border-left: 1px solid #9AB8CE;
}

#mainNavBar a:hover
{
	background-color: #89acd4;
}
#mainNavBar a i
{
	padding-right: 2%;
	padding-left: 2%;
}
#mainNavBar a img
{
	display: inline;
	float: left;
	padding-right: 4%;
	padding-left: 4%;
	margin-top: .6em;
	opacity: 0.5;
}
#mainNavBar a.current
{
	font-weight: 400;
	text-transform: uppercase;
	background-color: #496ba0;
	background: #496ba0; /* Old browsers */
	background: -moz-linear-gradient(top,  #496ba0 0%, #193b70 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#496ba0), color-stop(100%,#193b70)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #496ba0 0%,#193b70 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #496ba0 0%,#193b70 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #496ba0 0%,#193b70 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #496ba0 0%,#193b70 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#496ba0', endColorstr='#193b70',GradientType=0 ); /* IE6-9 */
}
#mainNavBar a.current:hover
{
	background-color: #395b90;
	background: #395b90; /* Old browsers */
	background: -moz-linear-gradient(top,  #496ba0 0%, #294b80 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#496ba0), color-stop(100%,#294b80)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #496ba0 0%,#294b80 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#496ba0', endColorstr='#294b80',GradientType=0 ); /* IE6-9 */
}
#mainNavBar a.current img
{
	opacity: 0.9;
}
#mainNavBar a.current:hover img
{
	opacity: 1;
}


/*******************************************************************/
/* CONTENT */
/*******************************************************************/

h1.subtitle
{
	font-weight:300;
	margin: 0;
}

p.subtitle
{
	margin-bottom: 10px;
}

.panel-bar, h3
{
	background-color: #3c78b1;
	font-size: 24px;
	color: #FFF;
	padding: 5px 15px;
	border-bottom: 2px solid #cfd7e0;
}
#divSurvey .panel-bar
{
	cursor:pointer;
}
.panel-bar i
{
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 10px;
	margin-left: 10px;
}
.divRecipients
{
	float:left; 
	width:630px;
}
.divRecipients label.horizontal
{
	width:50px;
}
.divRecipients label.horizontal.recFirst
{
	width:90px;
}
.section-panel .divRecipients input
{
	margin-left:0px;
}
#addMoreRAF, #addMoreTYM
{
	text-decoration:none;
	color:#FFF;
	padding:4px 8px; 
	background-color:#06a;
	font-weight:700;
	margin-top: 5px;
	display: inline-block;
}
#addMoreRAF:hover, #addMoreTYM:hover
{
		background-color:#28c;

}
.recEmail
{
	width:220px;
}
.recFirst
{
	width:120px;
}

.email-preview-container
{
	margin:10px 5px 10px 15px; 
	float:left; 
	width:600px;
	padding:10px 20px;
	background-color:#e7edf4;
	border: 0px solid #FFF;
	box-shadow: 0 0px 4px rgba(0,0,0,0.05);
}
.email-preview-container label
{
	width:70px;
	float:left;
	display:inline-block;
	clear:left;
	font-size:0.8em;
	margin-left:0!important;
}
.email-preview-container div
{
	margin:0 0 10px; 
	float:left; 
	width:400px;
	font-size:0.8em;
}
.email-preview-container div.w80
{
	width:80%;
}

.email-preview-container div.w90
{
	width:90%;
}
.panel strong
{
	font-weight:500;
}

#txtRAFSenderEmail,#txtRAFSenderName,#txtTYMSenderEmail,#txtTYMSenderName
{
	width:249px;
}

.recFirst 
{
	width:158px;
}
/*******************************************************************/
/* FOOTER */
/*******************************************************************/

#footerOuter {
	background-color: #6391c7;
	padding-top: 10px;
}
#footerOuter p
{
	padding: 0px 20px 10px;
	color: #dde3e9;
	font-size: 12px;
}
#footerOuter a
{
	color: #FFF;
	text-decoration: none;
}
#footerOuter a:hover
{
	color: #4371A7;
}


/*******************************************************************/
/* HELPER CLASSES */
/*******************************************************************/

.col
{
	display: inline-block;
	float: left;
	padding: 0;
}
.float-left-half, .float-right-half
{
	display: inline-block;
	width: 48%;
	float: left;
}
.float-right-half
{
	float: right;
	text-align: right;
}

.help-tip-dash
{
	background: url(./images/help_icon.png) top right no-repeat transparent;
	_background: none;
	_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src=./images/help_icon.png);
	display: block;
	float: left;
	height: 13px;
	margin-top: 22px;
	position: relative;
	right: 0;
	top: 0;
	width: 14px;
	pointer: pointer;
	pointer: hand;
}

.tooltip
{
	background-color: #FFd;
	color: #2c68a1;
	font-size: 13px;
	padding: 4px 8px;
	border: 1px solid #2c68a1;
	box-shadow: 1px 1px 4px rgba(0,0,0,0.5);
}
#colorbox
{
	z-index: 10000;
	border: 0;
	box-shadow: 0px 1px 4px rgba(0,0,0,0.2);
}
#cboxContent
{
	margin-top: 0;
}
#cboxLoadedContent
{
	background: #FFF !important;
	padding: 0px !important;
	overflow: hidden;
}
.gen-blue-button, .gen-blue-button-sm
{
	background-color: #3c78b1;
	color: #EEE;
	cursor: pointer;
	padding: 7px 12px;
	border: none;
	text-decoration: none;
	text-align: center;
	font-weight: 400;
	background: #496ba0; /* Old browsers */
	background: -moz-linear-gradient(top,  #496ba0 0%, #294b80 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#496ba0), color-stop(100%,#294b80)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #496ba0 0%,#294b80 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #496ba0 0%,#294b80 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#496ba0', endColorstr='#294b80',GradientType=0 ); /* IE6-9 */
}
.gen-blue-button-sm
{
	padding: 2px 8px 3px;
	font-size: 12px;
}

.gen-blue-button:hover, .gen-blue-button-sm:hover, .cyan-blue-btn:hover
{
	background: #698bc0; /* Old browsers */
	background: -moz-linear-gradient(top,  #698bc0 0%, #496ba0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#698bc0), color-stop(100%,#496ba0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #698bc0 0%,#496ba0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #698bc0 0%,#496ba0 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #698bc0 0%,#496ba0 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #698bc0 0%,#496ba0 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#698bc0', endColorstr='#496ba0',GradientType=0 ); /* IE6-9 */
}
.cyan-blue-btn
{
	border-bottom: 1px solid #bcd;
	background-color: #89acd4;
	background: #89acd4; /* Old browsers */
	background: -moz-linear-gradient(top,  #89acd4 0%, #597bb0 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#89acd4), color-stop(100%,#597bb0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #89acd4 0%,#597bb0 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #89acd4 0%,#597bb0 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89acd4', endColorstr='#597bb0',GradientType=0 ); /* IE6-9 */
	z-index: 1;
	color: #f7f7f7;
	cursor: pointer;
	padding: 7px 12px;
	border: none;
	text-decoration: none;
	text-align: center;
	font-weight:400;
}
.flat-btn
{
	background-color: #5c98d1;
	border-color: #cde #4c88c1 #4c88c1 #cde;
	border-width: 1px;
	border-style: solid;
	padding: 4px 15px;
	background: #47aa;
	text-decoration: none;
	cursor: pointer;
	padding: 7px 12px;
	color: #f7f7f7;
	margin-bottom: 10px;
	display: inline-block;	
}
.flat-btn:hover
{
		background-color: #059;
}
.flat-btn b
{
	font-weight:400;
	color:#FFF;
}
.error-msg
{
	color: #c30;
	font-size: 14px;
	font-weight: 500;
	margin-left: 15px;
}
.m20
{
	margin:20px;
}
label.horizontal
{
	width:100px;
	display:inline-block;
}
.horizontal
{
	margin:5px inherit;
}

/*******************************************************************/
/* FOLLOWUP CONTENT */
/*******************************************************************/

.section-panel h2,
.section-panel p,
.section-panel label,
.section-panel input,
.section-panel textarea,
.section-panel select,
.section-panel button,
.section-panel .flat-btn,
.star-rating
{
	margin-left:15px;
}
.section-panel label,
.section-panel input
{
	margin-top:5px;
	margin-bottom:5px;
	margin-right:15px;
}
.section-panel h2
{
	margin-top: 15px;
	margin-bottom: 20px;
	margin-right: 15px;
}
.section-panel p
{
	margin-right:20px;
}
.section-panel textarea
{
	width:94.5%;
	margin-top:10px;
}
.smaller
{
	font-size: 90%;
}
.vertical-stack
{
	display: block;
	margin-bottom: 5px;
}
#divPassScore, #divPassUnfamiliar, #divHowWeDid, #pnlFail, .contact-panel, #divFailScore, .section-div
{
	background-color: #d8e3ef; /*rgba(0,0,0,0.05);*/
	padding-bottom:0px;
	margin-bottom:10px;
}
.note
{
	font-size:.75em; 
	color:#777;
	margin:0 20px 1em;
	padding-bottom:10px;
}

.contact-panel
{
	margin-left: 42px;
	margin-right: 20px;
	margin-top: 0px;
	padding-top: 0px;
	padding-bottom: 0px;
	display:none;
}
#lblPassEmail
{
	clear:left;
}
.rdoLabel
{
	cursor:pointer;
}
#rdoContactNo, #rdoFailContactNo
{
	display: inline-block;
	clear: left;
	margin-top: 4px;
}
#txtPhone2
{
	margin-right:20px;
}
#txtPassEmail
{
	width:300px;
}
#btnSubmitPass, #btnSubmitFail, .flat-btn b
{
	font-weight:500;
}
.section-div .panel
{
	display:none; /* hide all panels to start */
}

.error
{
	color:#c00;
}
input.error
{
	border:1px solid #C00!important;
}
label.error
{
	display:block;
	text-align:right;
}
.send-status
{
	margin: 10px auto 20px;
	padding: 5px 12px;
	background-color: #333;
	color: #FFF;
	text-align:center;
}
