/* ==========================================================================
   Author's custom styles
   ========================================================================== */



/* TYPOGRAPHY */
body { font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 17px; line-height: 1.2em; }
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { font-family: "Roboto Slab", Georgia, "Times New Roman", Times, serif; color: #518BC9; }
h1, .h1 { font-size: 1.412em }
h2, .h2 { font-size: 1.271em }
h3, .h3 { font-size: 1.154em }
h4, .h4 { font-size: 1.125em }
h5, .h5 { font-size: 1.092em}
h6, .h6 { font-size: 1.000em}
p, .para { line-height: 1.4em; }

p a { text-decoration: underline; }
p a:hover { text-decoration: none; }

p.text-center { text-align: center;}
p.mt20 { margin-top: 20px; }
p.mb20 { margin-bottom: 20px; }

.spacer {}
.spacer-horizontal {}

/* FORM */
form fieldset { border: none; padding: 0; margin: 0;}
form fieldset legend { }
form textarea { resize: vertical; }
form .form-control-static { line-height: 1; /*margin: 0; padding: 0; min-height: 0;*/}
form div.form-group.mt10 { margin-top: 10px; } 
form div.form-group.mb10 { margin-bottom: 10px; } 
form div.form-group.mt20,
form.mt20 { margin-top: 20px; }
form div.form-group.mb20,
form.mb20 { margin-bottom: 20px; }
form.mt30 { margin-top: 30px; }
form.mb30 { margin-bottom: 30px; }

.recaptcha {}

.pure-button,
a.pure-button { padding: 0.5em 2em; }
.pure-button-primary,
a.pure-button-primary { background-color: #518bc9}

/* TABLE */
.table-custom {}
.table-custom > thead > tr > th { vertical-align: middle; background: #518bc9; color: #FFF; font-weight: 500; }
.table-custom > thead > tr > th,
.table-custom > tbody > tr > td { }

.table-tollfree { margin-top: 20px; }
.table-tollfree > thead > tr > th,
.table-tollfree > tbody > tr > td { width: 50%; }

/* .logo */
.logo img { display: block; width: 100%; max-width: 250px; height: auto; /*margin: 0 auto;*/ margin-bottom: 20px; }

/* .jumbotron */
.jumbotron { background: #EEF3F9; }
.jumbotron-mask {background: -moz-linear-gradient(left,  rgba(238,243,249,1) 0%, rgba(238,243,249,1) 50%, rgba(238,243,249,0) 100%);
background: -webkit-linear-gradient(left,  rgba(238,243,249,1) 0%,rgba(238,243,249,1) 50%,rgba(238,243,249,0) 100%);
background: linear-gradient(to right,  rgba(238,243,249,1) 0%,rgba(238,243,249,1) 50%,rgba(238,243,249,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eef3f9', endColorstr='#00eef3f9',GradientType=1 );}
.jumbotron .container { padding-bottom: 60px; padding-top: 40px; }
.jumbotron h1,
.jumbotron h2 { margin-bottom: 0; margin-top: 10px; font-size: 32px; }
.jumbotron h2 { color: #333; font-weight: 500; font-size: 26px;}

/* #wrap */
#wrap { min-height: 280px; padding-top: 20px; padding-bottom: 30px; }

#wrap .secondary { border-top: 1px dotted #CCC; margin-top: 30px; padding-top: 30px; }
#wrap .secondary-bg p,
#wrap .notice p { padding: 15px; }
#wrap .notice { margin: 20px 0; }

/* .contain */
.contain { max-width: 560px; margin: 0 auto; width: 100%; }

/* #footer */
#footer { padding: 35px 0; background: #EEF3F9; text-align: center; font-size: 14px; }
#footer p { margin: 0;}



/* CORRECTION FOR GOOGLE RECAPTCHA ELEM */
@media only screen and (max-width: 360px) {
	form li.validation,
	form fieldset.validation { width: 248px !important; overflow: hidden;}
	form #rc-imageselect, 
	form .g-recaptcha { -webkit-transform:scale(0.82); transform:scale(0.82); -webkit-transform-origin:0 0; transform-origin:0 0;}
}

/* FIX FOR FIREFOX FIELDSET STYLING */
/* SEE: https://stackoverflow.com/questions/17408815/fieldset-resizes-wrong-appears-to-have-unremovable-min-width-min-content/17863685#17863685) */
@-moz-document url-prefix() {
  fieldset { display: table-cell; }
}




/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {	
	.jumbotron { background: #EEF3F9 url('../img/jumbo-bg.jpg') right center no-repeat; background-size: cover; }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.jumbotron-text { padding-top: 20px; }
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.jumbotron .container { background: none;}
	.jumbotron-text { padding-top: 30px;}
}