/*----------------------------------------------------	

	color-snowmobile-srd.CSS

	CREATED BY: Steele Digital Media
	SITE: www.steeledigitalmedia.com
	CREATED: Wed 18.08.15
	AUTHOR: Graham Steele
	VERSION: 2.0
	
	DESCRIPTION:	Styles of appearance. Images, colour, font, shadows, etc.
					Also include any changes to layout styles included in "style-2ilp-v2.css"

----------------------------------------------------*/

/*--- 1-0. Common Elements -----------------------------------------------------------------------------------*/
html						{ font-size:100%; }
body 						{ background:#FFFFFF url(/snowmobile-safety-recovery-device/img/bg-body.png) center top repeat-y; color:#727272; font-family:'Open Sans',Helvetica,Arial,sans-serif; font-size:1em; line-height:1.5em; }
a							{ color:#727272; text-decoration:none; }
a:hover,a:focus 			{ color:#e60a0a; text-decoration:none; }
img							{}
h1,h2,h3,h4,h5,h6 			{ color:#666; font-family:'Open Sans',sans-serif; font-weight:300; text-shadow:0 0 1px rgba(0,0,0,0.01); }
h1,h2,h3					{ margin:0 0 25px; }
h1 span, h2 span			{ color:#e60a0a; }
h3							{ font-size:22px; position:relative; text-indent:15px; }
h3.title:before				{ content:"\A"; border-style: solid; border-width: 8px 0 8px 11px; border-color: transparent transparent transparent #e60a0a; position: absolute; left:0; top:7px; }	
h3.title:after				{ background:url(/images/bg_off.png) repeat; content: ""; height:5px; margin-left:10px; position:absolute; top:12px; width:99%; }
h3.title					{ font-family:'Lato',sans-serif; overflow: hidden; line-height:28px; }
h3.h-inline					{ display:inline; left:30px; margin-left:-30px !important; top:3px; }
h4							{ font-weight:700; }


/*--- 2. SITEWIDE ELEMENTS ---------------------------------------------------------------------------------------------------------------------------------------------------------------*/
		
/*--- 2-1. Layout --------------------------------------------------------------------------------------------*/
.main-content				{ margin:0 2%; }
.main-content .container	{ width:100%; }

/*--- 2-2. Header --------------------------------------------------------------------------------------------*/
#header						 {
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #f8f8f8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f8f8f8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#f8f8f8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#f8f8f8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#f8f8f8 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%,#f8f8f8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8',GradientType=0 ); /* IE6-9 */
}

/*--- 2-3. Nav -----------------------------------------------------------------------------------------------* /

/*** Default Menu Style ***/
.nav						{ margin-top:35px; }
.nav li 					{ border-left:1px solid #d2d2d2; }
.nav li:first-of-type		{ border-left:none; }
.nav li>a	 				{ color:#656565; font-size:16px; font-weight:700; padding:0 16px; text-transform:uppercase; }
.nav li>a:hover 			{ background:none; color:#e60a0a; }


/*--- 2-4. Footer --------------------------------------------------------------------------------------------*/
#footer .footer-top			{ /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,2d2d2d+100 */
background: #000000; /* Old browsers */
background: -moz-linear-gradient(top, #000000 0%, #2d2d2d 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#2d2d2d)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #000000 0%,#2d2d2d 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #000000 0%,#2d2d2d 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #000000 0%,#2d2d2d 100%); /* IE10+ */
background: linear-gradient(to bottom, #000000 0%,#2d2d2d 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#2d2d2d',GradientType=0 ); /* IE6-9 */
color:#A1A1A1;
padding:50px 0; }
#footer .footer-top a		{ color:#A1A1A1; }
#footer .footer-top h3		{ color:#A1A1A1; }
#footer .footer-bottom		{ color:#000; font-size:75%; line-height:30px; padding:15px; }

/*--- 2-5. Main ----------------------------------------------------------------------------------------------*/

#main 						{ background-color: #fff; }

/* Buttons */
.btn-color					{ background-color:#e60a0a; color:#fff; }
.btn-special 				{ border-radius:0; padding:8px 15px; }
a:hover.btn-color				{ background-color:#fff; }


/*--- 2-8. Breadcrumbs ---------------------------------------------------------------------------------------*/
.breadcrumb-wrapper			{ background:#000; }
.breadcrumb-wrapper h2.title { color:#fff; font-size:20px; font-weight:700; line-height:20px; margin:20px 0; text-transform:uppercase; }
.breadcrumbs				{ margin:20px 0; }
.breadcrumbs ul				{ margin:0; }
.breadcrumbs ul li			{ color: #f8f8f8; line-height:20px; }
.breadcrumbs ul li a		{ color: #f8f8f8; font-weight: 600; }
.breadcrumbs ul li:before	{ color: #f8f8f8; }



/*--- 3. PAGE ELEMENTS -------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*--- 3-1. Index ---------------------------------------------------------------------------------------------*/

/* Product Lead */
.tp-caption					{ text-align:center; }

/* Slogan */
.slogan 					{ background:#000; color:#fff; width:100%; }
.slogan-content 			{ padding:25px 0; }
.slogan-content h2.slogan-title	{ color:#fff; font-size:30px; font-weight:700; line-height:40px; margin:0; text-transform:uppercase; }


/* Content Box */
div.content-box.big 		{ border: none; background: #e60a0a; }
div.content-box.big:hover	{ background: #e60a0a; }
div.content-box-info h2		{ color:#fff; padding-top:25px; }


@media (max-width: 979px) {
	/*--- 2-3. Nav -----------------------------------------------------------------------------------------------*/
	.navbar-toggle { border:1px solid #ddd; color:#888; margin-top:25px; }
	.navbar-toggle i { font-size:1.5em !important; }
	/*** Mobile Menu Style ***/
	.nav						{ border-top:1px solid #d2d2d2; float:none; margin-top:0px; }
	.nav li 					{ border-left:none; border-bottom:1px solid #F7F7F7; padding:8px 0; text-align:center; }
	.nav li>a	 				{ color:#656565; font-size:16px; font-weight:700; padding:0 16px; text-transform:uppercase; }
	.nav li>a:hover 			{ background:none; color:#e60a0a; }
	
	/*--- 3-1. Index ---------------------------------------------------------------------------------------------*/
	
	/* SLOGAN */
	.slogan-content 			{ padding-top:10px; padding-bottom:35px; text-align:center; }
	.get-started				{ margin-top:10px; }
	.get-started a				{ float:none!important; }
}