html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}input[type=submit]::-moz-focus-inner,input[type=button]::-moz-focus-inner{border:0}input[type=submit]:focus,input[type=button]:focus{outline:none}

/** Typography **/
body { min-width: 320px; font-size: 14px; line-height: 22px;color: #3d3d3d; font-family: "proxima-nova",sans-serif; padding: 0; font-weight: 400;}
h1 { font-family: "cordale",sans-serif;
	font-weight: 400;
	font-size: 36px;
	color: #1b6a94;
	padding-top: 25px;
	line-height: 1.4em;}
@media(max-width: 800px) {
	h1 {
		font-size: 30px;
	}
}
@media(max-width: 400px) {
	h1 {
		font-size: 21px;
	}
}
h2 {
	font-family: "proxima-nova",sans-serif;;
	font-weight: 700;
	font-size: 15px;
	color: #3b3b3b;
	text-transform: uppercase;
	margin: 10px 0 6px 0;
	padding: 8px 0 4px;
}
@media(max-width: 800px) {
	h2 {
		font-size: 13px;
		line-height: 16px;
	}
}
@media(max-width: 400px) {
	h2 {
		font-size: 11px;
		line-height: 14px;
	}
}
h3 { }
h4 { }
p { padding: 8px 0; }
a { color:  #0000FF; text-decoration: none; text-decoration: underline;}
a:hover { color: #000; }
ul { padding: 6px 0 7px; }
li { background: url("/assets/images/bullet.png") no-repeat scroll 0 12px transparent; margin-left: 3px; padding: 4px 15px; }
table {width: 100%;}
td, th { padding: 4px 9px; text-align: center; border: 1px solid #d6d6d6;}
th { text-align: center; }
input,textarea,select { display: block; box-shadow: 2px 2px 3px 0 #ECECEC inset; border: 1px solid #D4D4D4; padding: 4px 6px; color: #3b4042; background-color: #FFFFFF;
	line-height: 30px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0; }
label { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 2px; }
input[type="text"] { height: 30px; }
textarea { margin-top: 10px; width: 100%; height: 100px; }
input:focus,textarea:focus,select:focus { box-shadow: 2px 2px 3px 0 #ECECEC inset, 0 0 8px 0 rgba(0, 0, 0, 0.3); border-color: #C2C2C2; }
input:hover,textarea:hover,select:hover { border-color: #C2C2C2;}
input.date { background-image: url(/assets/images/icons/date.png); background-repeat: no-repeat; background-position: 97% 6px;}
input.readonly { background-color: #eeeeee; color: #6b6b6b; box-shadow: none; border: 1px solid #D4D4D4; }
input.readonly:focus,textarea.readonly:focus,select.readonly:focus { box-shadow: inherit; border: 1px solid #D4D4D4; }
input.readonly:hover,textarea.readonly:hover,select.readonly:hover { border: 1px solid #D4D4D4;}
.ui-datepicker { font-size: 10px;}
.ui-datepicker select { display: inline; }

/** Repeated Elements **/
.clr { clear:both; }
.contain { _height: 1%; display: block; }
.contain:after  {content: "."; visibility: hidden; display: block; clear: both; height: 0; font-size: 0; overflow:hidden; }
.clearfix { *zoom: 1; }
.clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; }
.clearfix:after { clear: both; }

/** Main Containers **/
.mid { margin: 0 auto;
	max-width: 1050px;
	padding: 0 40px;
	position: relative;
	width: 100%;
	box-sizing: border-box; }
#content { padding-bottom: 25px;  z-index: 1; }
#header { width: 100%; z-index: 999; }

/** MESSAGES **/
#messages .success { background: #def1ca; color: #4e8117; font-weight: bold; padding: 10px 10px; }
#messages .success p { padding: 0;}
#messages .error { background: #FFE6E6; color: #470101; font-weight: bold; padding: 10px 10px; }
#messages .error p { padding: 0;}

.header-table td {
	padding: 40px 0;
	border: none;
	vertical-align: middle;
}

/** Navigation **/
#mainnav { padding-top: 5px; float: left; clear: both; }
#mainnav li { margin: 0; padding: 0; list-style: none; display: block; float: left; background: none; }
#mainnav ul { margin: 0; padding: 0; list-style: none; }
#mainnav a { display: block; padding: 0 18px; line-height: 60px; text-decoration: none; font-size: 14px; color: #fff; }
#mainnav a:hover { color: #000; }
#mainnav li.active a { color: #000; font-weight: bold; }

/** Logo **/
#frontlogo { display: block; float: left; font-size: 36px; padding: 0; text-decoration: none; line-height: 40px; font-weight: 400; font-family: "jubilat-n4", "jubilat"}
#frontlogo img {
	display: block; max-width: 80%; max-height: 150px;}

/** Contact Info **/
#contactinfo { display: block; float: right; font-size: .9em; padding: 0; line-height: 20px; height: 20;}
#quickemail, #quickphone { display: block; float: right; line-height: 24px;}
#quickphone {
	margin-left: 40px;
}
#quickemail i, #quickphone i {
	font-size: 22px;
	margin-right: 10px;
	position: relative;
}
#quickemail i {
	top: 2px;
}
#quickphone i {
	top: 4px;
}
#quickemail, #quickphone, #quickemail a, #quickphone a {
	color: #092959; text-transform: uppercase; text-decoration: none; font-weight: 700;
}

#basicform h1 { font-size: 1.4em; padding-bottom: 0; }
#basicform h2 { font-size: 1.0em; border: none; font-weight: bold; padding-bottom: 15px;  }
#basicform .summary h3 { background-color: #F4F4F4; padding-top: 3px; }

#basicform ul#tabs { margin: 20px 0 0 0; padding: 0; border: 1px solid #DEDFD8; overflow: hidden; width: 100%; display: table; }
#basicform ul#tabs li { margin: 0; padding: 0; background: none; display: table-cell; text-align: center;  }
#basicform ul#tabs li a { display: block; padding: 8px 0; text-decoration: none; line-height: 20px; border-right: 1px solid #DEDFD8; background-color: #fff;}
#basicform ul#tabs li a:hover { background-color: #F5FFF4; }
#basicform ul#tabs li a.active { cursor: default; }

#basicform.dental1 ul#tabs li a { font-size: .9em; }
#basicform.dental1 ul#tabs li a.step5link { border-right: none; }
#basicform.enroll ul#tabs li:last-child a { border-right: none; }
#basicform ul#tabs li a.active { background-color: #E5E6E1; text-decoration: none; color: #000;  }
#basicform ul#tabs li a.complete { background-color: #E6FFD9; color: #708F69; }
#basicform .step { padding-top: 20px; }
#basicform .step ul { padding: 0; margin: 25px 0 0 0; background: none; border: 1px solid #DEDFD8; background-color: #fff; }
#basicform .step ul.content li {
    padding-left: 25px;
}
#basicform .step ul li { padding: 12px 0 ; margin: 0; background: none; border-bottom: 1px dashed #DEDFD8; overflow: hidden;}
#basicform .step ul li.last { border: none; }
#basicform .step ul li.hidden,
#basicform .step ul li.payment-errors {
    display: none;
    padding-left: 25px;
    color: red;
}
#basicform .step ul li.payment-errors-server {
    padding-left: 25px;
    color: red;
}
#basicform .step ul li label { display: block; float: left; margin: 0 20px 2px 0; width: 240px; padding: 0 0 0 20px; text-align: right; font-size: .9em; line-height: 30px; }
#basicform .step ul li label.error { color: #FC4E4E; margin-left: 10px; padding: 0; border: none; font-size: .8em; width: auto; }
#basicform .step ul li input { width: 220px; float: left;  }
#basicform #invoice-step2 ul li input { width: 200px; }
#basicform .step ul li input[type="checkbox"] { width: 20px; padding: 0; margin-top: 7px;}
#basicform .step ul li input.long { width: 360px; }
#basicform .step ul li select { float: left; width: 150px; padding: 4px 5px; }
#basicform .step ul li .radios { clear: both; padding: 10px 0 0 0; position: relative; }
#basicform .step ul li .radios .radios_directions { font-size: .9em; width: 260px; display: inline-block; text-align: right; padding: 0 15px 0 0;  }
#basicform .step ul li .radios input { display: inline-block; width: auto; margin: 0 7px; padding: 0; float: none; }
#basicform .step ul li .radios label { display: inline-block; width: auto; margin: 0; padding: 0; float: none; }
#basicform .step ul li .radios label.error { position: absolute; left: 390px; top: 7px; padding: 0 10px; }
#basicform .step ul li.comments { padding: 0 25px 20px 25px;}
#basicform .error { border: 1px solid #FC4E4E;  }
#basicform .instructions { border: 1px solid #DEDFD8;  padding: 15px 25px; background-color: #fff; }
#basicform .attention { border: 1px solid #000BC8;  margin: 25px 0 0 0; padding: 15px 25px; background-color: #EEEFFF; font-weight: bold; font-size: .9em; color: #000BC8; }
#basicform .step { display: none; }
#basicform #step1 {display: block; }
#basicform #invoice-step1, #basicform #invoice-step2, #basicform #invoice-step3 {display: block;}
#basicform .buttons { width: 100%; overflow: hidden; padding-top: 25px; }
#basicform .buttons a, #basicform .buttons button { display: block; padding: 6px 11px; text-decoration: none;font-weight: bold; border: none; color: white; font-size: 14px; line-height: 22px;}
#basicform .buttons a.nextbutton, #basicform .buttons button.nextbutton {background: #186DEE;}
#basicform .buttons a.previousbutton {background: #888888;}
#basicform .buttons a:hover, #basicform .buttons button:hover { text-decoration: underline; cursor: pointer; }
#basicform .nextbutton { float: right; }
#basicform .previousbutton { float: left; }
#basicform .box {border: 1px solid #DEDFD8; padding: 25px; margin-top: 25px; }
#basicform .box.error { border: 2px solid #FC4E4E; background-color: #fdf1f1;}
#basicform dl { margin: 0; padding: 0; font-size: .9em; margin-bottom: 20px; }
#basicform dt { margin: 0; display: block; float: left; width: 300px; min-height: 18px; line-height: 18px; padding: 5px 0; border-top: 1px dashed #DEDFD8;}
#basicform dd { margin: 0; display: block; float: left; width: 347px; min-height: 18px; line-height: 18px; padding: 5px 0; border-top: 1px dashed #DEDFD8;}
#basicform .tinynote { font-size: .7em; line-height: 16px; }
#basicform .hiddeninputs { clear: both; font-size: .8em; padding-top: 10px; display: none;  }
#basicform .hiddeninputs .margintop { margin-top: 10px; }
#basicform .sslsecured { float: right; padding-top: 10px; }
.ajaxloader { margin-top: 25px; padding: 5px 15px; overflow: hidden; background-color: #E6FFD9; color: #247600; display: none; }
.ajaxloader p { float: left; font-size: .9em; padding: 0; }
.ajaxloader img { float: right; }
/*#basicform.dental #tabs a.step0link, #basicform.enroll #tabs a.step0link { padding: 16px 0; }*/

/** Enroll Form **/
#basicform #enrollform #step0 ul { margin: 0 0 0 25px; border: none; }
#basicform #enrollform #step0 ul li { padding: 4px 15px; background: url(/assets/images/bullet.png) no-repeat scroll 0 12px transparent; border: none; }
#basicform #enrollform #step0 { display: block; }
#basicform #enrollform #step1 { display: none; }
#dependents ul{ display: none; }
#dependents_r div { display: none; }
#basicform #dependents h3 { padding-left: 60px; }
a.adddependent { background: url(/assets/images/icons/add.png) no-repeat 10px 24px; padding: 20px 3px 0 35px; font-size: .9em; display: block;}

/** Waiver Form **/
#basicform #waiverform #step0 ul { margin: 0 0 0 25px; border: none; }
#basicform #waiverform #step0 ul li { padding: 4px 15px; background: url(/assets/images/bullet.png) no-repeat scroll 0 12px transparent; border: none; }
#basicform #waiverform #step0 { display: block; }
#basicform #waiverform #step1 { display: none; }
#step5 .box { background-color: #fff;}
#step5 h3 { padding: 20px 0 5px 0; }

/** Content Templates **/
.col-wrap { overflow: hidden; padding: 8px 0; }
.col-1-2 { float: left; width: 65%; margin-right: 5%; }
.col-2-2 { float: left; width: 30%; }

/** CC Expiration Fields **/
#basicform #invoice-step2 ul li input.exp {
    width: 95px;
}
#basicform .step ul li span.exp {
    width: 10px;
    display: block;
    float: left;
    text-align: center;
    font-size: 20px;
    position: relative;
    top: 10px;
}
#basicform #invoice-step2 ul li label {
  width: 160px;
  text-align: left;
}

.cc {
  display: block;
  float: left;
  position: relative;
}
.cc::after {
    display: block;
    float:left;
    width:55px;
    height:33px;
    background:url(/assets/images/cards.png) no-repeat -83px 100px;
    content: " ";
    position: absolute;
    top: 3px;
    right: 3px;
}
.cc.visa::after {background-position:-83px -311px}
.cc.mastercard::after {background-position:-83px -191px}
.cc.discover::after {background-position:-83px -371px}
.cc.amex::after {background-position:-83px -71px}

#basicform .step ul li.cvc {
  position: relative;
  overflow: visible;
  height: 40px;
}
.cvc-help {
  display: none;
  width: 220px;
  padding: 10px;
  filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  -webkit-filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3));
  position: absolute;
  bottom: 60px;
  left: 0px;
  background: white;
}
.cvc-help::after {
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid white;
  content: " ";
  position: absolute;
  bottom: -10px;
  left: 102px;
}
.cvc-help img {
  width: 200px;
}

/* Beneficiary Page */
.text__required-field {
	color:red;
}
#beneficiary_form select {
	height: 30px;
	line-height: 30px;
}
#beneficiary_form h4 {
	padding-top: 10px;
	display: block;
	clear: both;
}
#beneficiary_form input {
	list-style-type: none;
	width: 200px;
}
#beneficiary_form div[generated="true"] {
	border: none;
	color: #FC4E4E;
	padding-top: 2px;
	font-size: 11px;
	line-height: 13px;
}
#beneficiary_form div.container {
	display: block;
}
#beneficiary_form div.container div.column {
	display: block;
	float: left;
	padding-bottom: 25px;
	padding-right: 20px;
}
#beneficiary_form div.container div.row {
	display: block;
	width: 100%;
	padding: 12px 0;
	margin: 0;
	background: none;
	border-bottom: 1px dashed #DEDFD8;
	overflow: hidden;
}
#beneficiary_form div.container div.row:last-child {
	border: none;
}
#beneficiary_form div.beneficiary__name { width: 160px;  }
#beneficiary_form div.beneficiary__name input { width: 160px; }
#beneficiary_form div.beneficiary__address { width: 200px; }
#beneficiary_form div.beneficiary__address input { width: 200px; }
#beneficiary_form div.beneficiary__ssn { width: 160px; }
#beneficiary_form div.beneficiary__ssn input { width: 160px; }
#beneficiary_form div.beneficiary__relationship { width: 90px; }
#beneficiary_form div.beneficiary__relationship input { width: 90px; }
#beneficiary_form div.beneficiary__percentage { width: 90px; }
#beneficiary_form div.beneficiary__percentage input { width: 90px; }
#beneficiary_form div.container div.row div {
	display: block;
	float: left;
	padding-bottom: 15px;
	padding-right: 10px;
}
.beneficiary_form__important-info {
	color: red;
	padding-bottom: 15px;
}
.beneficiary_form__signature-header {
	padding-bottom: 0px !important;
	margin-bottom: 0px !important;
}
.beneficiary_form__signature-subheader {
	padding-bottom: 10px;
}

/* Pin Page */
#pin_form input{
	margin-bottom: 15px;
}

@media (max-width: 779px) {
	.scroller {
		display: block;
		width: 100%;
		overflow-x: auto;
		position: relative;
	}
	.scroller table {
		display: block;
		width: 100%;
	}
	.scroller table td,
	.scroller table th {
		min-width: 100px;
	}
	#header .mid {
		width: 100%;
		padding: 0;
	}
	#header #frontlogo {
		display: block;
		width: 100%;
		margin-bottom: 0px;
		margin-top: 40px;
		padding: 0px;
	}
	#header #frontlogo img {
		display: block;
		max-width: 90%;
		max-height: 80px;
		margin: auto;
	}
	#header #contactinfo {
		display: block;
		width: 100%;
		right: 0;
		box-sizing: border-box;
		padding: 0 5%;
	}
	#header #contactinfo #quickemail,
	#header #contactinfo #quickphone {
		display: block;
		float: left;
		width: auto;
		box-sizing: border-box;
		text-align: left;
		position: absolute;
		top: 10px;
	}
	#header #contactinfo #quickemail {
		right: 5%;
	}
	#header #contactinfo #quickphone {
		left: 5%;
	}
	#header #contactinfo #quickphone {
		background-position: right;
		padding: 0 24px 0 0px;
		margin-left: 0;

	}
	#content .mid {
		padding: 0 5%;
		width: 100%;
	}
	#mainnav {
		width: 100%;
	}
	#mainnav ul {
		width: 100%;
	}
	#mainnav ul li {
		width: 100%;
	}
	#mainnav ul li a {
		line-height: 30px;
		padding: 0 5%;
	}
	#basicform ul#tabs li {
		display: block;
		width: 100%;
	}
	#basicform.dental1 ul#tabs li a {
		font-size: 1em;
	}
	#basicform.dental ul#tabs li a.step0link,
	#basicform.dental ul#tabs li a.step1link,
	#basicform.dental ul#tabs li a.step2link,
	#basicform.dental ul#tabs li a.step3alink,
	#basicform.dental ul#tabs li a.step3blink,
	#basicform.dental ul#tabs li a.step4link,
	#basicform.dental ul#tabs li a.step5link,
	#basicform.enroll ul#tabs li a.step0link,
	#basicform.enroll ul#tabs li a.step1link,
	#basicform.enroll ul#tabs li a.step2link,
	#basicform.enroll ul#tabs li a.step3link,
	#basicform.enroll ul#tabs li a.step4link,
	#basicform.enroll ul#tabs li a.step5link,
	#basicform.enroll ul#tabs li a.step6link {
		display: block;
		width: 100%;
	}
	#basicform.dental ul#tabs li a br,
	#basicform.enroll ul#tabs li a br {
		display: none;
	}
	#basicform .step ul li input.long,
	#basicform .step ul li select {
		width: 220px;
	}
	#basicform .step ul li.comments h3 {
		background: white;
		font-size: .9em;
  		line-height: 30px;
  		font-weight: normal;
	}

}
@media (max-width: 540px) {
	#basicform .step ul li {
		padding: 10px 5%;
	}
	#basicform .step ul li label {
		text-align: left;
		display: block;
		width: 100%;
		padding: 0px;
	}
	#basicform .step ul li input,
	#basicform .step ul li input.long,
	#basicform .step ul li select,
	#basicform .step ul li textarea {
		text-align: left;
		display: block;
		width: 100%;
	}
	#basicform .buttons a {
		box-sizing: border-box;
		width: 100%;
		margin-bottom: 10px;
		text-align: center;
	}
	#basicform .step #skip_dental_box li input[type="checkbox"],
	#basicform .step #dental_inputs .same input[type="checkbox"] {
		position: absolute;
	}
	#basicform .step #skip_dental_box li label,
	#basicform .step #dental_inputs .same label {
		padding-left: 20px;
	}
	#basicform .step ul li .radios .radios_directions {
		width: auto;
	}
	#basicform .step ul li.comments {
		padding: 10px 5%;
	}
	#basicform .step ul li.comments textarea {
		margin-top: 0px;
	}
}

@media (max-width: 471px) {
  #basicform .step ul li.cvc {
    height: 72px;
  }
  #basicform #invoice-step2 ul li input.exp.first {
    clear: both;
  }
  .cvc-help {
    bottom: 90px;
  }
  .cvc-help::after {
    left: 98px;
  }
}