/*
Theme Name:     tintmaster
Description:    This is the main theme for Tintmaster
Author:         tintmast_admin
Template:       twentythirteen

(optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
*/

@charset "UTF-8";
/* CSS Document */

body {padding: 0; width: 100%; margin: 0; font-family: 'Open Sans', sans-serif !important;}
.alignright {margin: 0 0 0 10px !important;}
.alignleft {margin: 0 10px 0 0 !important;}
h1, h2, h3, h4 {text-transform: uppercase; font-family: 'Open Sans', sans-serif !important;}
h2 {font-size: 26px;}
.widget {background: none; padding: 0; margin: 0;}
h1 {color: #fe4e4f; font-size: 34px; margin-bottom: 15px;}
#header {
	width: 100%; 
	max-width: 1365px;
	margin: 0 auto;
	display: block;
	padding: 5px 2%;
	display: table;
}

#main-navigation {
	display: table-cell;
	width: 70%;
	float: left;
}

.nav-menu {
	list-style-type: none;
	width: 100%;
	padding: 15px 0 !important;
}

.nav-menu li a {
	display: block; 
	color: #000; 
	text-transform: uppercase;
	padding: 10px;
	font-size: 21px;
	letter-spacing: -.5px;
	float: left;
	text-decoration: none;
	border-right: 1px solid #ada8a8;
	margin: 0;
	font-weight: 400;
}

.nav-menu li:hover > a,
.nav-menu li a:hover,
.nav-menu li:focus > a,
.nav-menu li a:focus {
	background:none;
	color: #ff1111;
}

.nav-menu .current_page_item > a,
.nav-menu .current_page_ancestor > a,
.nav-menu .current-menu-item > a,
.nav-menu .current-menu-ancestor > a {
	color: #ff1111;
	font-style: normal;
}

	
#main-navigation ul li.home a {
	padding-left: 0;
}

#main-navigation ul li.last a {
	padding-right:0;
	border-right: none;
}

.nav-menu .sub-menu, .nav-menu .children {
	background: none;
	border: none;
	padding-top: 15px;
	margin-top: 25px;
}

.nav-menu .sub-menu li, .nav-menu .children li{margin: 0 !important; display: block;}
.nav-menu .sub-menu a, .nav-menu .children a{
	background: #ff1111;
	color: #fff;
	margin: 0 !important;
	border: none;
}

.nav-menu .sub-menu a:hover, .nav-menu .children a:hover {background: #000; color: #fff;}

#searchbar { 
	width: 22%;
	display: table-cell;
	min-width:100px;
	padding: 18px 15px 18px 10px;
	margin: 0;
	float: left;
}

#searchbar .widget {padding: 0 0 0 10px; margin: 0; background: none;}

#searchbar .widget input {background: none; background: url(/wp-content/themes/tintmaster/images/bg-search.jpg) no-repeat; background-position: 3px center; padding-left: 25px; border: 2px solid #d3d3d3; box-sizing: border-box;}

#social-icons {
	width: 8%; 
	display: table-cell;
	float: left;
	padding: 20px 0;
}

#social-icons ul{
	list-style-type: none; 
	padding: 0;
	overflow: hidden;
	margin: 0;
}
	
#social-icons ul li {
	float: left; 
	padding: 0 3px;
}

#mobile-header {display: none; overflow: hidden;}
#mobile-header .top {width: 100%; padding: 10px 2%; overflow: hidden;}
#mobile-header #social-icons {padding: 0; width: auto;}
    #menu-btn {display: block; height: 30px; background: url("/wp-content/themes/tintmaster/images/menu-icon.png") no-repeat top center; width: 30px; float: right;}
   .mobile-nav {display: none;}
   #mobile-nav.expand {display: block !important;}
	
   .mobile-nav { background: none; background-size: 100% 105px; font-style: normal; height: auto; margin:0 ; width: 100%;}
   .mobile-nav ul { margin: 0; padding: 0; }
   .mobile-nav li { float: none; list-style: none; margin: 0; padding: 0;}

   
   .mobile-nav a:link,
   .mobile-nav a:visited { 
background: #545454; /* Old browsers */
background: -moz-linear-gradient(top,  #545454 0%, #727272 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #545454 0%,#727272 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #545454 0%,#727272 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#545454', endColorstr='#727272',GradientType=0 ); /* IE6-9 */

         border-left: none; color: #fff; display: block; font-family: 'Exo', sans-serif; font-size: 22px; padding: 10px 0; text-align: center; text-shadow: 0 1px 0 #fff; box-sizing: border-box; text-transform: uppercase; font-weight: 300;
    }

   .mobile-nav a:hover { color: #f5f5f5; text-decoration: none;
	background: #ff0000;
    }


#main-slider {position: relative; min-height: 120px; background: #e93434;}
#main-slider .widget {background: none; padding: 0; margin: 0; overflow: hidden;}
#main-slider .flexslider {margin: 0;}
#main-slider .metaslider .caption-wrap {bottom: 200px; background: none; text-align: center; opacity: 1;}
#main-slider .metaslider .caption-wrap .caption {color: #FFDD00; text-shadow: 0px 0px 10px #595959; display: block; width: 100%; max-width: 900px; text-transform: uppercase; font-size: 22px; line-height: 1.6em; font-weight: 700; margin: 0 auto;}
#main-slider .metaslider .flex-control-nav {z-index: 1000; bottom: 160px;}
#main-slider .metaslider .caption-wrap .caption span {color: #fff; font-size: 78px; line-height: .9em; display: block; clear: both; opacity: 1; text-shadow: -2px 0px 4px #000; letter-spacing: -2px;}
.home #main-slider img {max-height: 600px;}
#main-slider img {width: 100%; height: auto;}

#main-slider .flex-control-paging li a {
  background: none;
  box-shadow:#FFFFFF 0 0 3px inset;
  height:14px;
  width:14px;
}

#main-slider .flex-control-paging li a:hover {background: #e90404; box-shadow: none;}
#main-slider .flex-control-paging li a.flex-active {background: #fff;}


#logo-container {width: 100%; max-width: 1365px; margin: 0 auto; position: absolute; top: 15px; left: 0; right: 0; padding: 0 2%;}
#logo {width: 100%; max-width: 375px;}
#logo #header-phone {width: 100%; text-align: center; color: #fff; font-size: 30px; font-weight: 700; text-shadow: 2px 2px 3px #000;}
#logo #header-phone a {color: #fff;}
#decal-effect {position: absolute; top: 0; right: 0; width: 10%;}

#funnel-container {background: #363636; position: relative; width: 100%; overflow: visible; clear: both;}
#funnel {width: 100%; max-width: 1200px; margin: 0 auto; position: relative; top: -130px; display: table; padding-bottom: -80px;}
.funnel-section {display: table-cell; float: left; width: 33%; padding: 0 2%; color: #fff; margin-bottom: -60px;}
.funnel-section video {width: 100%; display: block;}
.funnel-section h2 {color: #fff; font-size: 36px; letter-spacing: 3px; text-transform: uppercase; margin-top: 0; margin-bottom: 5px; font-weight: 400;}
.funnel-section p {margin-top: 0; min-height: 4.5em;}
.read-more a {display: block; padding: 7px 12px; color: #fff; background-color: #ff0000; width: 100px; font-size: 19px; text-align: center; text-transform: uppercase; font-weight: 700; text-decoration: none;}

.entry-header, .entry-content, .entry-summary, .entry-meta {max-width: initial;}
#content-container {width: 100%; position: relative; clear: both; top: -80px; overflow: hidden; margin-bottom: -80px;}
#content-container.secondary, #content-container.blog {top: initial; margin-bottom: 20px;}
#home-content, #secondary-content {width: 100%; max-width: 1250px; margin: 0 auto; padding: 0 2%;}
#home-content, #secondary-content {color: #363636;font-weight: 600; font-size: 17px;}
#secondary-content {font-weight: 300; overflow: hidden;}
#secondary-content #main-sidebar {float: left; width: 30%; margin-top: 40px; padding-left: 2%;}
.widget_recent_entries, .widget_categories {width: 100%; display: block; margin-bottom: 15px;}
.widget_recent_entries .widget-title, .widget_categories .widget-title {display: block; color: #fff; background: #363636; width: 100%; padding: 10px; font-family: 'Open Sans', sans-serif; font-weight: 700; font-style:normal; font-size: 20px; margin: 0;}
.blog h1.entry-title {margin-top: 40px; font-weight: 700;}
#secondary-content #main-sidebar ul li {padding: 3px 10px;}
#secondary-content #main-sidebar ul li a {color: #fe4e4f; font-size: 18px; text-decoration: none;}
#secondary-content #main-sidebar ul li a:hover {color: #545454;}

#home-content #content {width: 100%; max-width: 600px; padding-top: 90px;}
.blog #secondary-content #content{width: 70%; float: left;}
#secondary-content #content {max-width: initial; color: #545454;}
#content article {padding: 0; margin: 0;}
#content .entry-header {margin-bottom: 0;}
#content-background {width: 46%; position: absolute; top: 0; right:0; clear: both; display: block;}
#content-background:after {padding-bottom: 20%; display: block;}

#services-banner {width: 100%; position: relative; clear: both; overflow: hidden; background: #2c2c2c; padding: 5px 2%;}
#services-banner ul {display: block; color: #fff; width: 100%; max-width: 795px; margin: 0 auto; padding: 0; list-style-type: none; overflow: hidden;}
#services-banner ul li {float: left; font-size: 20px; padding: 0 5% 0 0; text-transform: uppercase;}

#home-post-section {width: 100%; position: relative; display: table; table-layout: fixed;}
#home-post-section .section {width: 50%; height: auto; display: table-cell; position: relative; padding: 10px 4% 10px 10%;}
#prestige-section {background: url(/wp-content/themes/tintmaster/images/bg-prestige.jpg) no-repeat; background-size: 100% 100%;}
#prestige-section .inner { width: 100%; max-width: 700px; text-align: center; display: block;}
#prestige-section .inner p {margin: 0 auto 10px auto; color: #fff; display: block; font-size: 26px; font-weight: 700; text-shadow: 1px 1px 3px #000;}
#prestige-section .inner .video {width: 100%; max-width: 400px; margin: 0 auto;}
#blog-section {background: url(/wp-content/themes/tintmaster/images/bg-blog-feed.jpg) no-repeat #363636; background-size: 100% 100%;}
#blog-section .inner {width: 100%; max-width: 700px;}
#blog-section .inner h2 {color: #f54445; font-size: 34px; letter-spacing: 1.7px; margin-bottom: 8px;}
#blog-section .inner ul {padding-left: 0;}
#blog-section .inner li {margin-bottom: 1em; color: #fff; font-size: 22px; font-weight: 600;}
#blog-section .inner li a {color: #fff; text-decoration: none;}
#home-post-container {overflow: hidden; margin-bottom: 25px;}
#home-post-image {float: left; width: 30%;}
#home-post-image img {padding-right: 12px;}
#home-post h3 {margin: 0px 0 5px 0; line-height: 1em;}    
#home-post h3 a {color: #fff; line-height: 1em;}
#home-post {color: #fff; float: left; width: 70%;}
.archive-header {background: none;}
.archive-title {padding: 0; background-color: none; font-weight: 700; font-style: normal; margin: 40px 0 10px 0; font-size: 32px;}

#content-bottom-container {position: relative; width: 100%; background:url(/wp-content/themes/tintmaster/images/bg-content-bottom.jpg) no-repeat #f6f6f7; background-size: 50% 100%; background-position: right; padding-bottom: 45px;}
#content-bottom {width: 100%; max-width: 1400px; margin: 0 auto; padding: 0 2%;}
#content-bottom .content {width: 100%; max-width: 700px; padding-top: 30px; font-weight: 600; color: #363636; font-size: 18px;}
#content-bottom .content p{width: 100%; max-width: 500px;}
#content-bottom .content h2{color: #fe4e4f; margin-top:0; margin-bottom: 12px;}
#content-bottom-background {width: 59%; position: absolute; bottom: -38px; right:0; clear: both; display: block; padding-top: 30px; max-width: 815px; overflow: hidden;}

#form-container {background: #e93434; overflow: hidden; margin-bottom: 0px;}
#contact-form {width: 100%; max-width: 1150px; padding: 0 2% 15px 0; margin: 0 auto; overflow: hidden;}
#contact-form .widget {background: none; padding: 0; margin: 0;}
#contact-form-inner {width: 100%;}
#contact-form-inner p{margin: 0;}
#contact-form .top, #contact-form .bottom {overflow: hidden; margin-bottom: 10px;}
#contact-form h2 {margin-top: 0; color: #fff; padding-top: 30px; font-size: 38px; letter-spacing: .3px; text-shadow: 2px 0px 8px #000;}
#contact-form .wpcf7-form-control-wrap {display: block; padding: 0 5px; float: left;}
#contact-form input, #contact-form textarea {display: block; width: 100%; border: none; font-size: 18px; font-weight: 300; text-transform: uppercase;}
#contact-form textarea {max-height: 175px; width: 100%;}
#contact-form .name {width: 22.5%;}
#contact-form .subject {width: 22.5%;}
#contact-form .email {width: 33%;}
#contact-form .zip {width: 22%;}
#contact-form .message {width: 78%;}
#contact-form #service-box-container {width: 22%; float: left; display: block; padding: 0 5px;}
#contact-form .service-box {width: 100%; float: left; color: #fff; background: #545454; padding: 0 7%; min-height: 175px;}
#contact-form .service-box span.wpcf7-list-item {display: block; margin-left: 0;}
#contact-form .service-box .wpcf7-form-control-wrap {display: initial; padding: initial; float: none;}
#contact-form .service-box h3 {font-size: 23px; color: #fff; margin: 10px 0 5px 0;}
#contact-form .service-box input {width: initial; display: initial;}
#contact-form .service-box .wpcf7-list-item-label {text-transform: uppercase; font-size: 19px; font-weight: 300; margin-left: 5px;}
#contact-form input[type=submit] {width: 140px; float: right; background: #353535; margin-right: 5px; font-size: 24px; padding: 4px 0;}

#footer-container {width: 100%; background: url(/wp-content/themes/tintmaster/images/bg-tint-footer.jpg) #545454 no-repeat; background-position: bottom left; background-size: 7%; min-height: 300px; padding-top: 30px; padding-bottom: 30px; overflow: hidden;}
#footer {width: 100%; max-width: 1050px; margin: 0 auto; padding: 0 2%; font-weight: 300;}

#footer-top {overflow: hidden; padding-bottom: 10px;}
#footer-logo {width: 38%; float: left; padding-right: 30px;}
#address {width: 62%; float: left; padding-left: 20px; border-left: 1px solid #fff; color: #fff; font-size: 18px; font-weight: 400; letter-spacing: .6px;}
#address a {color: #fff;}

#footer-middle {overflow: hidden; padding: 15px 0;}
#map {float: left; width: 75%; padding-right: 20px;}
#locations {float: left; width: 25%; background: #fff; padding: 15px 10px 15px 10px; text-align: center;}
#locations h3 {color: #ff4e4f; margin-top: 0; font-size: 22.5px; margin-bottom: 0; font-weight: 600;}
#locations ul {list-style-type: none; padding: 0; margin: 0; font-size: 20px;}
#locations li {font-weight: 600; padding: 0 !important;}
#locations li a {color: #2c2c2c;}
#locations li a:hover {color: #ed1f24; text-decoration: none;}

#footer-bottom {color: #fff; font-size: 15px; text-align: center; color: #fff;}
#footer-bottom a {color: #fff; text-decoration: none;}
#footer-bottom a:hover {color: #ed1f24;}

@media screen and (max-width: 2500px) { 
	#content-background {bottom: -8%; top: initial;}
}

@media screen and (max-width: 1615px) { 
	#content-background {bottom: 0; top: initial;}
}

@media screen and (max-width: 1330px) { 
	.nav-menu li a {font-size: 20px;}
}

@media screen and (max-width: 1275px) { 
	.nav-menu li a {font-size: 18px;}
	#home-post-section .section {padding: 10px 9%;}
	#content-bottom-background {overflow: hidden;}
	#content-bottom-background img {right: -40px; position: relative;}
}

@media screen and (max-width: 1230px) { 
}

@media screen and (max-width: 1170px) { 
	.nav-menu li a {font-size: 16px;}
	#home-content {font-size: 16px;}
	#home-content #content {max-width: 500px;}
	#home-content #content h1 {font-size: 28px;}
	#prestige-section .inner p {font-size: 22px;}
	#blog-section .inner h2 {font-size: 28px;}
	#blog-section .inner li {font-size: 18px;}
	#content-bottom .content {font-size: 16px; max-width: 500px;}
	#content-bottom .content h2 {font-size: 22px;}
	#content-bottom-background {width: 50%;}
}

@media screen and (max-width: 1110px) { 
	#funnel {top: -80px;}
	.funnel-section {margin-bottom: -40px;}
	#main-slider .metaslider .caption-wrap {bottom: 150px;}
	#main-slider .metaslider .flex-control-nav {bottom: 110px;}
	#content-bottom-background img{position: relative; right: -70px;}
	#content-bottom-background {width: 59%;}
}

@media screen and (max-width: 1060px) { 
	#content-bottom-background img {right: -110px;}
}

@media screen and (max-width: 1040px) { 
	.nav-menu li a {padding: 10px 7px;}
}


@media screen and (max-width: 1000px) { 
	#main-slider .metaslider .caption-wrap {bottom: 130px;}
	#main-slider .metaslider .flex-control-nav {bottom: 100px;}
	#main-slider .metaslider .caption-wrap .caption span {font-size: 55px;}
	#main-slider .metaslider .caption-wrap .caption {font-size: 16px; max-width: 600px;}
	.video iframe {height: 200px;}
}

@media screen and (max-width: 983px) { 
	#blog-section .inner h2 {font-size: 24px;}
}

@media screen and (max-width: 975px) { 
	.nav-menu li a {font-size: 14px;}
}



@media screen and (max-width: 955px) { 
	#home-content #content {max-width: 400px}
	#home-content {font-size: 14px;}
	#home-content #content h1 {font-size: 24px;}
	#prestige-section .inner p {font-size: 20px;}
	#blog-section .inner li {font-size: 16px;}
	#content-bottom-background img {right: -90px;}
	#content-bottom .content {font-size: 14px; max-width: 400px;}
	#content-bottom .content h2 {font-size: 20px;}
}

@media screen and (max-width: 875px) { 
	#main-navigation {width: 88%;}
	#searchbar {display: none;}
	#social-icons {width: 12%;}
	.nav-menu li a {font-size: 15px;}
}

@media screen and (max-width: 855px) { 
	#blog-section .inner h2 {font-size: 20px;}
}


@media screen and (max-width: 850px) { 
	.funnel-section h2 {font-size: 28px;}
	#services-banner ul li {font-size: 20px; padding: 0 4% 0 0;}
	#address {font-size: 14px;}
}


@media screen and (max-width: 830px) { 
	#funnel {top: -40px;}
	.funnel-section {margin-bottom: -20px;}
	#main-slider .metaslider .caption-wrap {bottom: 80px;}
	#main-slider .metaslider .flex-control-nav {bottom: 60px;}
	#main-slider .metaslider .caption-wrap .caption span {font-size: 55px;}
	#main-slider .metaslider .caption-wrap .caption {font-size: 16px; max-width: 600px;}
	#contact-form .service-box .wpcf7-list-item-label {font-size: 17px;}
}

@media screen and (max-width: 767px) { 
	#text-2 {display: none;}
	#logo-container {position: relative; top: initial; background: #ff0000; padding: 15px 0; display: block;}
	#decal-effect {display: none;}
	#logo {margin: 0 auto;}
	#funnel-container {overflow: hidden; position: relative; padding-top: 25px;}
	#funnel {top: initial; position: relative; display: block;}
	#funnel .funnel-section {display: block; float: none; width: 100%; margin-bottom: 25px;} 
	.funnel-section h2 {font-size: 36px;}
	.funnel-section p {min-height: initial}
	.video iframe {height: 300px;}
	#home-content #content {max-width: 100%;}
	#home-content {font-size: 18px;}
	#home-content #content h1 {font-size: 32px;}
	#content-background {display: none;}
	#services-banner {display: none;}
	#home-post-section .section {width: 100%; display: block;}
	#blog-section {background: #363636; padding: 0 2%;}
	#blog-section .inner {margin: 0 auto;}
	#blog-section .inner h2 {font-size: 30px;}
	#blog-section .inner li {font-size: 18px;}
	#content-bottom-container {background: #fff;}
	#content-bottom .content {font-size: 18px; max-width: initial;}
	#content-bottom .content h2 {font-size: 30px;}
	#content-bottom .content p {max-width: initial;}
	#content-bottom-background {display: none;}
	#contact-form .service-box .wpcf7-list-item-label {font-size: 14px;}
	#header {display: none;}
	#mobile-header {display: block;}
}

@media screen and (max-width: 745px) { 
	#map {width: 100%; float: none; padding: 0; margin-bottom: 15px;}
	#locations {width: 100%; float: none; max-width: 200px; margin: 0 auto;}
}

@media screen and (max-width: 676px) { 
	#footer-logo {width: 100%; float: none; margin: 0 auto 15px auto; max-width: 350px;}
	#address {width: 100%; float: none; border-left: none; margin: 0 auto; text-align: center; font-size: 20px;}
}

@media screen and (max-width: 660px) { 
	#contact-form {padding: 0 2% 15px 2%;}
	#contact-form .wpcf7-form-control-wrap {width: 100% !important; float: none !important; margin-bottom: 10px; padding: 0 !important;}
	#contact-form #service-box-container {width: 100%;}
	#contact-form .service-box {padding: 0 2%;}
	#contact-form .service-box .wpcf7-list-item-label {font-size: 18px;}
	#contact-form .top {margin-bottom: 0;}
	#contact-form input[type=submit] {float: none; margin: 0 auto;}
}

@media screen and (max-width: 550px) { 
	#footer-bottom {font-size: 15px;}
}