﻿/*====================================== 
	
	Color information
	
	-
		 
========================================*/

/*====================================== 
		CSS reset/normalize 
========================================*/

/*===== Correct `block` display not defined in IE 8/9. =====*/
article,aside,details,figcaption,figure,footer,header,hgroup,
main,nav,section,summary {display: block;}
pre {white-space: pre-wrap;}
small {font-size: 80%;}
svg:not(:root) {overflow: hidden;}

/* Hides giant arrows that show up on inventory pages on Chrome *smh* */
.container.cf .widgets svg[class*="fa"], .container.cf .widgets-details svg[class*="fa"] {display: none !important;}




	
/*====================================== 

			Typography

=======================================*/
.roboto {font-family: Roboto, sans-serif; font-weight: 400;}
.roboto-bold {font-family: Roboto, sans-serif; font-weight: 700;}
.roboto-bold-italic {font-family: Roboto, sans-serif; font-weight: 700; font-style: italic;}
.roboto-italic {font-family: Roboto, sans-serif; font-weight: 400; font-style: italic;}
.roboto-light {font-family: Roboto, sans-serif; font-weight: 300;}

@font-face {font-family: sans-extended; src: url(../webfonts/sans-extended/sans-extended-regular.woff);} .sans-extended {font-family: sans-extended;}
@font-face {font-family: sans-extended-bold; src: url(../webfonts/sans-extended/sans-extended-bold.woff);} .sans-extended-bold {font-family: sans-extended-bold;}
@font-face {font-family: sans-extended-italic; src: url(../webfonts/sans-extended/sans-extended-italic.woff);} .sans-extended-italic {font-family: sans-extended-italic;}

html {font-size: 16px;}

.white {color: #fff;}
.grey {color: #303030;}
.light-grey {color: #999;}
.blue {color: #0100CC;}
.orange {color: #FF7F00}

h1.extralarge {font-size: 4em;}

.text-shadow {text-shadow: 2px 2px 2px rgba(0,0,0,0.6);}
.text-capitalize {text-transform: uppercase !important;}
.underline {text-decoration: underline;}

h1 {font-size: 2.4rem;}
h2 {font-size: 2.0rem;}
h3 {font-size: 1.7rem;}
h4 {font-size: 1.4rem;}
h5 {font-size: 1.2rem;}
h6 {font-size: 0.8rem;}

.large {font-size: 1.6rem;}
.medium {font-size: 1.2rem;}
.small {font-size: 0.8rem;}


@media screen and (min-width: 992px) {
	.text-right-lg {text-align: right;}
	.text-left-lg {text-align: left;}
	.text-center-lg {text-align: center;}
}

@media screen and (min-width: 768px) {
	.text-right-md {text-align: right;}
	.text-left-md {text-align: left;}
	.text-center-md {text-align: center;}
}

@media screen and (min-width: 575px) {
	.text-right-sm {text-align: right;}
	.text-left-sm {text-align: left;}
	.text-center-sm {text-align: center;}
}





/*====================================== 

			Base Styles

========================================*/
* {box-sizing: border-box;}

.clear {clear: both;}
img {border: 0;max-width:100%;} 

body {
    font-family: roboto, sans-serif;
    margin: 0;
	padding:0;
	background-color: #fff;
	color: #111;
	font-size: 1.0rem;
	background-image: url(../siteart/slides/01.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	background-attachment: fixed;
}

.margin-center {margin: 0 auto;}

.container-fluid {padding: 0; overflow-x: hidden;}

.z-100 {z-index: 100;}
.z-200 {z-index: 200;}
.z-300 {z-index: 300;}
.z-400 {z-index: 400;}
.z-500 {z-index: 500;}
.z-600 {z-index: 600;}
.z-700 {z-index: 700;}
.z-800 {z-index: 800;}
.z-900 {z-index: 900;}

@media screen and (min-width: 992px) { .position-lg-absolute {position: absolute !important;} }






/*====================================== 

	Borders, Backgrounds, Shadows

========================================*/

@media screen and (min-width: 992px) { 
	.extra-rounded-bottom-lg {border-bottom-left-radius: 1.5rem; border-bottom-right-radius: 1.5rem;} 
	.orange-bg-lg {background-color: #FF7F00 !important;}
	.orange-bg-lg.trans-bg {background-color: rgba(255,127,0,0.5) !important;}
}

.tile-bg {background: url(../siteart/subtle-patterns/tile-bg.png) repeat;} 
.lines-bg {background: url(../siteart/subtle-patterns/lines-bg.png) repeat;}
.dots-bg {background: url(../siteart/subtle-patterns/dots-bg.png) repeat;}
.triad-bg {background: url(../siteart/subtle-patterns/triad-bg.png) repeat;}
.dark-bg {background: url(../siteart/subtle-patterns/dark-bg.png) repeat;}

.light-grey-bg {background-color: #f9f9f9;}
.white-bg {background-color: white;}
.blue-bg {background-color: #0100CC;} .blue-bg.trans-bg {background-color: rgba(1,0,203,0.5);}
.orange-bg {background-color: #FF7F00} .orange-bg.trans-bg {background-color: rgba(255,127,0,0.5);}

.drop-shadow {box-shadow: 1px 1px 2px 3px rgba(0,0,0,0.2);}

hr.thick {border-width: 5px;}
hr.white {border-color: white;}
hr.orange {border-color: #FF7F00;}
hr.blue {border-color: #0100CC;}


/*====================================== 

			Link Styles

=======================================*/

a {text-decoration: none; color: #136cab;}
a:hover  {color: red; text-decoration: none;}
a.white {color: #fff;}
p.white > a {color: #fff;}
a.dark {color: #333}
a.hov-under:hover {text-decoration: underline;}





/*======================================

			Header Styles

=======================================*/

header{
	width:100%;
	background-color: #136cab;
	display: block;
}

/* Shrink the hamburger icon a little on mobile and mess w/ colors */
.navbar-toggler {padding: 0.4rem;}
.navbar-toggler-icon {width: 1.4rem; height: 1.4rem;}
.navbar-dark .navbar-toggler {border-color: rgba(255,255,255,1.0);}

/* Edit Nav Items */
nav .nav-item {font-family: sans-extended, sans-serif; padding: .2rem 0.1rem;}
.navbar-dark .navbar-nav .nav-link {color: rgba(255,255,255,0.9); font-size: 1.0rem;}
@media screen and (min-width:768px) {.navbar-dark .navbar-nav .nav-link {font-size: 0.8rem;}}
@media screen and (min-width: 1250px) {nav .nav-item {font-family: sans-extended, sans-serif; padding: .2rem 0.3rem;}}

/* Nav active class */
.nav-item.active, .nav-item:hover {border-bottom: 3px solid white;}



/*======================================

			Carousel Styles

======================================*/
.carousel-card {
	position: absolute; 
	bottom: 10px; 
	left: 10%;
	width: 50%;
}

/* Fixes issue with transition in Firefox */
.carousel-item {
	transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;
	transition: transform 0.5s ease, -webkit-transform 0.5s ease;
	-webkit-backface-visibility: visible;
	        backface-visibility: visible;
}

/* Adjust positioning that gets screwed up in IE */
#floating-content-home {top: 0;}
@media screen and (min-width: 992px) { #floating-content-home { top: 180px; left: -15px;}}
@media screen and (min-width: 1250px) { #floating-content-home { top: 340px;}}
@media screen and (min-width: 1500px) { #floating-content-home { top: 480px;}}






/*======================================

		Contact Form Styles

======================================*/

form#contact-form input, form#contact-form textarea, form#contact-form select, form#contact-form input#CaptchaAnswer {
	width: 100%;
	padding: 5px 10px;
	margin: 6px 0;
	border: 1px solid #ddd;
	border-radius: 0;
}

input[type="date"]:not(.has-value):before{
  color: lightgray;
  content: attr(placeholder);
}

form#contact-form input, form#contact-form textarea {-webkit-appearance: none;}

form#contact-form input[type="checkbox"] {
	width: 15px;
	height: 15px;
	border: 1px solid #aaa;
	border-radius: 0;
	background-color: white;
	outline-color: rgba(255,127,0,0.7);
	padding: 0;
}

form#contact-form input[type="checkbox"]:checked {
	border: 1px solid #aaa;
	background-color: #FF7F00;
	box-shadow: inset -1px -1px 1px 0px #fff, inset 1px 1px 1px 0px #fff;
}

form#contact-form input:focus, form#contact-form textarea:focus {
	border: 1px solid #bbb;
}

/* One line Captcha */
.CaptchaPanel {
	margin:0 0 0 0 !important;
	padding:0 0 0 0 !important;
	text-align: center;
	line-height:normal !important;
}

.CaptchaImagePanel {
	margin:0 0 0 0;
	padding:0 0 0 0;
	width: 50%;
	display: inline-block;
	float: left;
}

.CaptchaMessagePanel {
	padding:0 0 0 0 !important;
	margin:0 0 0 0 !important;
	font-weight:normal !important;
	font-size:11px;
	line-height:13px;
	width: 50%;
	display: inline-block;
	float: left;
}

.CaptchaAnswerPanel {
	margin:0 0 0 0;
	padding:2px 0px 2px 0px !important;
}

.CaptchaWhatsThisPanel {
	line-height:0;
	margin:0 0 0 0;
	padding:8px 0 8px 0 !important;
}

.CaptchaWhatsThisPanel a {color:#000;}
.CaptchaWhatsThisPanel a:hover {text-decoration:none;} 
#CaptchaImage {margin-top: 10px !important;}
#CaptchaAnswer {
	width: 40% !important; 
}






/*======================================

			Footer Styles

======================================*/






/*======================================

		  Responsive Styles

======================================*/

@media screen and (max-width: 1120px) {
	
}

/*===== Bootstrap col-lg breakpoint =====*/
@media screen and (max-width: 992px) {
	html {font-size: 16px;}
}

@media screen and (max-width: 800px) {
	html {font-size: 14px;}	
}

/*===== Bootstrap col-md breakpoint =====*/
@media screen and (max-width: 768px) {
	html {font-size: 16px;}	
}

@media screen and (max-width: 670px) {
	
}

/*===== Bootstrap col-sm breakpoint =====*/
@media screen and (max-width: 575px) {
	html {font-size: 14px;}	
}

@media only screen and (max-width: 480px) {
	
}

@media screen and (max-width: 447px){
	
}

@media screen and (max-width: 414px){
	
}
	
