/* 
Clickcool Landing page
*/


/* -- CSS Reset -- */
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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	/* font-size: 100%; *
	/* font: inherit; */
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* -- End Reset -- */

/* -- General Styles -- */
h1, h2, h3, h4 {
	font-family: 'Raleway', sans-serif;
}
h3, h4, h5 {
	color: #494949;
}
h5, h6, p, form {
	font-family: 'Open Sans', sans-serif;
}
h2 {
	font-size: 30px;
	color:#f32821;
	font-weight: 700;
	line-height: 30px;
}
h3 {
	font-size: 26px;
	color: #494949;
}
h4 {
	font-size: 23px;
	font-weight: 700;
	line-height: 33px;
	padding: 8px 0;
}
h5 {
	font-size: 20px;
	line-height: 30px;
	font-weight: 300;
	padding: 4px 0;
}
h6 {
	font-size: 18px;
	line-height: 26px;
}
p {
	font-size: 15px;
	color: #777777;
	line-height: 26px;
}
.btn-primary, .services-list .list {
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.text-white{color:#fff !important;}
.text-dark{color:#000 !important;}

.no-pad{padding:0 !important;}
.mt-30{margin-top:30px;}
.mb-30{margin-bottom:30px;}
.pt-30{padding-top:30px;}
.pb-30{padding-bottom:30px;}
.img-responsive-full {
	width:100%
}
.btn-big {
	width:100%;
	height:50px;
	line-height:50px;
	padding:0;
	max-width:100%;
	display:block;
	overflow:hidden;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	-o-border-radius:0;
	border-radius:0;
	background-color:#961915;
	color:#fff;
	font-size:17px;
	font-weight:700;
	text-align:center;
	font-family:'Open Sans', sans-serif;
	border:0
}
/* Link Style */
a:link {
	color: #e60d0d;
	text-decoration: none;
}
.main-wrap {
	background: #f0f0f0;
	margin: 0;
	padding: 30px 70px;
}
/* -- Logo Holder Styles -- */
.logo-holder {
	background-color: #fff;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
}
.logo {
	max-width:250px;
}
.logo-holder h4 span {
	color: #961915;
}
.logo-holder h4 {
	font-family: 'Open Sans', sans-serif;
	color: #121212;
    float: right;
    font-weight:600;
    line-height: 50px;
    padding: 0;
}
/* -- Header Section Styles -- */
.hero {
	background: linear-gradient(rgba(255, 251, 251, 0.4), rgba(12, 12, 12, 0.3)), url(../images/header.jpg) no-repeat center;
    background-size: cover;
    background-attachment: fixed;
    color: #fff;
    min-height: 740px;
}
/* -- Header Section Styles ClickThrough -- */
.click-through {
	min-height: 600px;
}
/* -- Hero Section -leadgen- Styles -- */
.hero {
	position:relative;
	right:0;
	left:0;
	top:40%;
}
.hero-text {
	margin-top:60px;
	margin-bottom:15px;
}
.hero-text h1 {
	font-size: 66px;
	font-weight: 700;
	color: #fff;
	line-height:1;
}
.hero-text {
	margin-top: 160px;
}
.hero-text h1 .big-title {
	font-size:68px;
	color:#f32821;
	font-weight: 900;
	display:block;
}
.hero-text h2 {
	color: #fff;
	padding-top: 20px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.5;
}
.hero-text h6 {
	color: #ffc600;
	margin-top: 10px;
	letter-spacing: 0.1px;
}
/* -- Hero Section -clickthrough- Styles -- */
.click-through .hero {
	position:relative;
	right:0;
	left:0;
	top:40%;
	transform:translateY(-30%);
}
.click-through .hero-text {
	margin-top: 0;
	text-align: center;
}
.click-through .hero-text h1 {
	font-size: 66px;
	font-weight: 300;
	color: #fff;
	line-height: 70px;
}
.click-through .hero-text h1 .big-title {
	font-size: 86px;
	color: #961915;
	font-weight: 900;
}
.click-through .hero-text h2 {
	color: #fff;
	font-size: 66px;
	font-weight: 300;
	line-height: 60px;
}
.click-through .hero-text h6 {
	color: #fff;
	margin-top: 10px;
	letter-spacing: 0.6px;
}
.click-through .btn-primary {
	font-size: 26px;
	padding: 14px 40px;
	border: none;
	color: #202020;
	margin-top: 20px;
	background-image: -webkit-linear-gradient(top, #961915, #F2B900);
	background-image: -moz-linear-gradient(top, #961915, #F2B900);
	background-image: -ms-linear-gradient(top, #961915, #F2B900);
	background-image: -o-linear-gradient(top, #961915, #F2B900);
	background-image: linear-gradient(to bottom, #961915, #F2B900);
}
.click-through .btn-primary:hover, .click-through .btn-primary:active {
	color: #202020;
	background-image: -webkit-linear-gradient(top, #fff, #c4c4c4);
	background-image: -moz-linear-gradient(top, #fff, #c4c4c4);
	background-image: -ms-linear-gradient(top, #fff, #c4c4c4);
	background-image: -o-linear-gradient(top, #fff, #c4c4c4);
	background-image: linear-gradient(to bottom, #fff, #c4c4c4);
}
/* -- Hero Section -clickthrough- Styles End-- */

.arrow {
	text-align: center;
	margin-top: 230px;
}
.form-content {
    position: relative;
    background-color: rgb(51, 50, 50);
    padding:15px;
}
.cc-info-wrap {
	 padding-top:30px;
	 padding-bottom:10px;
	 position: relative;
 }
.cc-info-box {
    margin-top:15px;
}
.cc-info-list {
    margin-bottom: 15px;
    display: block;
}
.cc-info-list i {
    float: left;
    margin-right: 10px;
    font-size: 24px;
    color: #961915;
}
.cc-info-list p {
    font-size: 14px;
    color: #212221;
    line-height: 22px;
    font-weight:600;
}

.hero-form {
	background-color: rgba(233, 233, 233, 0.8);
    box-shadow:0px 5px 10px rgba(0,0,0,.5);
	padding:15px;
	border-radius: 0px;
	margin-top:60px;
}
.hero-form h2 {
	 font-size: 36px;
    font-weight: 500;
}
.hero-form h1 {
	 font-size:50px;
    font-weight: 500;
	    padding-bottom: 12px;
}
.hero-form form {
	margin-top:15px;
	font-weight: 300;
}
.hero-form .form-control {
	border: 1px solid #fff;
	border-radius: 0;
	color: #202020;
}
.hero-form form input:hover, .hero-form form input:focus {
	border: 1px solid #202020;
}
.form-control::-webkit-input-placeholder {
 color: #333333;
 opacity: 1;
}
.form-control:-moz-placeholder {
 color: #333333;
}
.form-control::-moz-placeholder {
 color: #333333;
}
.form-control:-ms-input-placeholder {
 color: #333333;
}
.btn-primary {
	text-transform:uppercase;
	font-size:24px;
	font-weight:600;
	font-family: 'Raleway', sans-serif;
	border-color: #fff;
	background-image: -webkit-linear-gradient(top, #961915, #bd2924);
	background-image: -moz-linear-gradient(top, #961915, #bd2924);
	background-image: -ms-linear-gradient(top, #961915, #bd2924);
	background-image: -o-linear-gradient(top, #961915, #bd2924);
	background-image: linear-gradient(to bottom, #961915, #bd2924);
}
.btn-primary:hover, .btn-primary:active {
	border-color: #fff;
	background-image: -webkit-linear-gradient(top, #bd2924, #961915);
	background-image: -moz-linear-gradient(top, #bd2924, #961915);
	background-image: -ms-linear-gradient(top, #bd2924, #961915);
	background-image: -o-linear-gradient(top, #bd2924, #961915);
	background-image: linear-gradient(to bottom, #bd2924, #961915);
}
.hero-form > p {
	color: #101010;
    font-weight: 600;
    padding-top: 10px;
    font-size: 12px;
}
.form-message {
	color: white;
	display: none;
}
.form-msg {
	color: #202020;
}
.form-msg-error {
	color: red;
}
/* -- Clients Styles -- */

.clients {
	background-color: #202020;
	width: 100%;
	padding: 20px 0;
}
.clients h6 {
	color: #fff;
	padding-top: 8px;
	font-weight:500;
}
.clients-logos {
	float: right;
}
.clients img {
	padding-top: 6px;
	opacity: 0.8;
	padding-bottom: 8px;
	float: left;
	margin-right: 15px;
}
.clients img:hover {
	opacity: 1;
}
/* new */
.automobile-contents {
	padding:60px 0px;
}
.automobile-contents h3 {
	font-size:36px;
	}

.car-list-wrap {
    position: relative;
    z-index: 1;
    background-color: #fff;
	margin-bottom:30px;
}
.car-list-wrap h4 {
	    padding-bottom: 8px;
    font-size: 16px;
    color: #333;
    line-height: 20px;
    border-bottom: 1px #efdede solid;
	font-weight:500;
		}
.car-list-wrap strong{font-weight:600;}	
.car-img-box {
    overflow: hidden;
    -webkit-border-radius: 4px;
    border-radius: 4px;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
}
.text-box {
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
	background:#f5f5f5;
	padding:15px;
	}
	
	
/* -- Seo Styles -- */
.seo-wrap {
    padding: 60px 0px;
}
.seo-wrap h3 {
    font-size: 46px;
	font-weight:600;
}
.seo-wrapper {
    float: left;
    margin-bottom: 30px;
    border: 2px #f5f5f5 solid;
    padding: 15px;
}
.seo-image {
    position: relative;
    overflow: hidden;
    display: block;
    cursor: pointer;
    border-radius: 0;
    max-width: 100px;
    margin: 0px auto;
}

.seo-containt {
    position: relative;
    float: left;
    width: 100%;
    text-align: center;
    padding: 0;
	margin-top: 30px;
}
.seo-containt .price {
    font-size: 18px;
	font-family: 'Raleway', sans-serif;
	font-weight:600;
}
.seo-containt p {
    margin:15px 0;
	font-family: 'Raleway', sans-serif;
	color: #2e2e35;
	line-height:22px;
}

a.btn-green {
	font-family: 'Raleway', sans-serif;
	background-color:transparent;
	border:2px #ae231e solid;
	color:#ae231e !important;
	border-radius:0px;
	font-size:12px;
	text-transform:uppercase;
	font-weight:600;
}
a.btn-green:hover {
    background:#ae231e;
	border:2px #ae231e solid;
	color:#fff;
	    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}




/* -- Offer Styles -- */

.offer {
	text-align: center;
	margin-bottom: 100px;
}
.offer h2 {
	font-size: 46px;
	line-height: 40px;
	padding: 8px 0;
}
.offer .btn-primary {
	font-size: 32px;
	font-weight: 800;
	border: none;
	color: #202020;
	line-height: 18px;
	padding-top: 30px;
	padding-bottom: 24px;
	margin-top: 20px;
	font-family: 'Raleway', sans-serif;
	background-image: -webkit-linear-gradient(top, #ffc600, #F2B900);
	background-image: -moz-linear-gradient(top, #ffc600, #F2B900);
	background-image: -ms-linear-gradient(top, #ffc600, #F2B900);
	background-image: -o-linear-gradient(top, #ffc600, #F2B900);
	background-image: linear-gradient(to bottom, #ffc600, #F2B900);
}
.offer .btn-primary:hover, .offer .btn-primary:active {
	color: #F2B900;
	background-image: -webkit-linear-gradient(top, #000, #202020);
	background-image: -moz-linear-gradient(top, #000, #202020);
	background-image: -ms-linear-gradient(top, #000, #202020);
	background-image: -o-linear-gradient(top, #000, #202020);
	background-image: linear-gradient(to bottom, #000, #202020);
}
.offer a span {
	font-size: 16px;
	font-weight: 300;
}
/* -- Reviews Styles -- */

.reviews {
	text-align: center;
	padding:60px 0px;
	background-color: #f0f0f0;
}
.reviews-title {
	margin-bottom:30px;
}
.reviews-title h2 {
	padding: 8px 0;
}
.reviews-list {
	margin-top: 40px;
}
.reviews-list-img {
	margin-right: 45px;
    margin-bottom: 30px;
    width: 100%;
    max-width: 160px;
    display: inline-block;
	}
.last-child{
	margin-right:0px;
	}	

.reviews-list-row {
	padding: 30px;
    background: #fff;
    position: relative;
    border: 3px #e8e4e4 solid;
    box-shadow: 5px 5px 20px rgba(0,0,0,.1);
}
.reviews-list p {
	margin-top: 10px;
	color: #494949;
}
.fa-star {
	color: #ffc600;
	font-size: 20px;
}
.notch {
    position: absolute;
    top: -20px;
    left: 35px;
    margin: 0;
    border-top: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 20px solid #ffffff;
    padding: 0;
    width: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
    _border-right-color: pink;
    _border-left-color: pink;
    _filter: chroma(color=pink);
}

/* click infon*/
.click-info{
    text-align: center;
    padding: 60px 0px;
    background-color: #ddd;
}
.click-info-box {
    text-align: center;
    padding: 15px;
    border: 10px #d4d1d1 dashed;
}


/* -- Footer Hero Styles -- */

.footer-hero {
	background-image: linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.6)),url(/landing-pages/advertising/images/footer.jpg);
	background-size: cover;
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-position:center;
	text-align:center;
	color: #fff;
	padding-top:100px;
	padding-bottom: 110px;
}
.footer-hero h2 {
	font-size: 40px;
	line-height: 60px;
	color: #fff;
}
.footer-hero .btn-primary {
	font-size: 24px;
	font-weight: 600;
	border: none;
	color: #202020;
	line-height: 18px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-top: 30px;
	font-family: 'Raleway', sans-serif;
	background-image: -webkit-linear-gradient(top, #ffc600, #F2B900);
	background-image: -moz-linear-gradient(top, #ffc600, #F2B900);
	background-image: -ms-linear-gradient(top, #ffc600, #F2B900);
	background-image: -o-linear-gradient(top, #ffc600, #F2B900);
	background-image: linear-gradient(to bottom, #ffc600, #F2B900);
}
.footer-hero .btn-primary:hover, .footer-hero .btn-primary:active {
	color: #F2B900;
	background-image: -webkit-linear-gradient(top, #000, #202020);
	background-image: -moz-linear-gradient(top, #000, #202020);
	background-image: -ms-linear-gradient(top, #000, #202020);
	background-image: -o-linear-gradient(top, #000, #202020);
	background-image: linear-gradient(to bottom, #000, #202020);
}

/* -- Parallax Styles -- */

.parallax {
	background:#f32821;
	background-size: cover;
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-position:center;
	color: #fff;
	padding-top:40px;
	padding-bottom:40px;
}
.parallax h2 {
	font-size: 40px;
	line-height: 60px;
	color: #fff;
}
.parallax .btn-primary {
	font-size: 24px;
	font-weight: 600;
	border: none;
	color: #202020;
	line-height: 18px;
	padding-top: 30px;
	padding-bottom: 30px;
	margin-top: 30px;
	font-family: 'Raleway', sans-serif;
	background-image: -webkit-linear-gradient(top, #ffc600, #F2B900);
	background-image: -moz-linear-gradient(top, #ffc600, #F2B900);
	background-image: -ms-linear-gradient(top, #ffc600, #F2B900);
	background-image: -o-linear-gradient(top, #ffc600, #F2B900);
	background-image: linear-gradient(to bottom, #ffc600, #F2B900);
}
.parallax .btn-primary:hover, .parallax .btn-primary:active {
	color: #F2B900;
	background-image: -webkit-linear-gradient(top, #000, #202020);
	background-image: -moz-linear-gradient(top, #000, #202020);
	background-image: -ms-linear-gradient(top, #000, #202020);
	background-image: -o-linear-gradient(top, #000, #202020);
	background-image: linear-gradient(to bottom, #000, #202020);
}
/* -- Footer Styles -- */

.footer {
	padding-top: 30px;
	padding-bottom: 30px;
}
.footer .fa-heart {
	color: #F2B900;
}
.social {
	float: right;
	line-height: 24px;
}
.social i {
	color: #202020;
	display: inline-block;
	text-decoration: none;
	padding-left: 6px;
	padding-right: 6px;
	font-size: 16px;
}
.social i:hover {
	color: #F2B900;
}



/*------------------------------
--------Responsive Styles-------
------------------------------*/

@media only screen and (min-width: 992px) and (max-width:1200px) {
 .hero-text h1 {
 font-size: 54px;
}
 .hero-text h1 .big-title {
 font-size: 95px;
}
 .hero-text h2 {
 font-size: 34px;
}
 .clients h6 {
 padding-top: 0;
}
}
 @media only screen and (max-width: 991px) {
 .logo-holder {
 text-align: center;
}
 .logo-holder h4 {
 float: none;
 padding: 0;
}
 header {
 min-height: 1140px;
}
 .hero {
 top: 0px;
 transform: translateY(0);
}
 .arrow {
 display: none;
}
 .hero-text {
 text-align: center;
 margin-top: 110px;
}
 .hero-form {
 margin-top: 40px;
}
 .clients {
 text-align: center;
}
 .clients .img-responsive {
 display: inline-block;
}
 .clients h6 {
 padding-bottom: 14px;
}
 .footer-hero h2 {
 font-size: 36px;
 line-height: 40px;
 padding-bottom: 20px;
}
}
 @media only screen and (max-width: 767px) {
 .click-through .hero-text h1 {
 font-size: 44px;
 line-height: 50px;
}
 .click-through .hero-text h1 .big-title {
 font-size: 66px;
 font-weight: 900;
}
 .click-through .hero-text h2 {
 font-size: 44px;
 line-height: 40px;
}
 .footer {
 text-align: center;
}
 .social {
 float: none;
}
 .offer h2 {
 font-size: 42px;
}
}
 @media only screen and (max-width: 500px) {
 header {
 min-height:1000px;
}
.why-content {
    padding-left: 0px;
}
 .logo-holder h2 a {
 font-size: 22px;
}
 .logo-holder h4 {
 font-size: 18px;
 line-height: 30px;
}
 .hero-text h1 {
 font-size: 46px;
}
 .hero-text h1 .big-title {
 font-size: 88px;
 line-height: 36px;
}
 .hero-text h2 {
 font-size: 32px;
}
 .hero-text {
 margin-top: 80px;
}
 .click-through .hero-text h1 {
 font-size: 30px;
 line-height: 40px;
}
 .click-through .hero-text h1 .big-title {
 font-size: 46px;
 font-weight: 900;
}
 .click-through .hero-text h2 {
 font-size: 30px;
 line-height: 30px;
}
 .click-through .btn-primary {
 font-size: 20px;
 width: 100%;
 padding: 10px 10px;
}
 .offer h2 {
 font-size: 38px;
}
}
 @media only screen and (max-width: 400px) {
 .logo-holder h4 {
}
 .hero-text h1 {
 font-size: 34px;
 line-height: 60px;
}
 .hero-text h1 .big-title {
 font-size: 64px;
}
 .hero-text h2 {
 font-size: 22px;
 line-height: 1;
 padding: 0;
}
 .hero-text {
 margin-top: 60px;
}
 .hero-text h6 {
 font-size: 15px;
 line-height: 20px;
}
 .hero-form {
 padding: 30px 20px;
}
 .btn-primary {
 font-size: 24px;
}
 .footer-hero .btn-primary, .offer .btn-primary {
 font-size: 30px;
}
 .offer h2 {
 font-size: 34px;
}
}