/* general */
body { margin: 0; padding: 0 }
h1, h2, h3, h4, h5 { font-weight: bold; }

/* section */
section { width: 100%; display: table; margin: 0; max-width: none; height: 100vh; }
.intro { height: 85vh; background: url('../img/bgintro.png') right center no-repeat; }
.content { display: table-cell; vertical-align: middle; }

/* height */
.h1048 { height: 1048px; }
.h590 { height: 590px; }
.mh14 { max-height: 16px; }
.mh32 { max-height: 32px; }
.mh40 { max-height: 40px; }
.mh80 { max-height: 80px; }
.lh05 { line-height: 0.7; }
.lh14 { line-height: 14px; }
.lh18 { line-height: 18px; }
.lh32 { line-height: 32px; }
.h11438 { height: 11438px; }

/* width */
.w35 { width: 35px; }
.w325 { max-width: 325px; }
.w350 { max-width: 370px; }
.w500 { width: 500px; }
.mw103 { max-width: 123px; }
.w500 { width: 500px; }
.w1048 { width: 1048px; }
.w1080 { width: 1080px; }

/* margin */
.m0auto { margin: 0 auto; }
.mt3 { margin-top: 3px; }
.mt60 { margin-top: 60px; }
.mtneg40 { margin-top: -40px; }
.mtneg46 { margin-top: -46px; }
.mtneg60 { margin-top: -60px; }
.mb60 { margin-bottom: 60px; }
.ml40 { margin-left: 40px; }
.mr10 { margin-right: 10px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }

/* padding */
.ptb20 { padding-top: 20px; padding-bottom: 20px; }
.ptb40 { padding-top: 40px; padding-bottom: 40px; }
.plr05 { padding-left: 5px; padding-right: 5px; }
.plr20 { padding-left: 20px; padding-right: 20px; }
.plr40 { padding-left: 40px; padding-right: 40px; }
.plr80 { padding-left: 80px; padding-right: 80px; }
.pb60 { padding-bottom: 60px; }

/* border */
.brad50 { border-radius: 50px; }
.bleftgreen { border-left: 3px solid #28a745 !important; }
.bbot3 { border-bottom: 3px solid #dee2e6 !important; }
.breddash { border: 1px dashed red !important; }
.bdarkblue { border: 1px solid #1e4c7d; }

/* background */
.bgwhite { background: #ffffff; }
.bgblack { background: #000000; }
.bggray { background: #949494; }
.bglightgray { background: #faf9f9; }
.bgdarkgray { background: #6d6c6c; }
.bgorange { background: #d79354; }
.bggreen { background: #567330; }
.bgphone { background: url('../img/phone.png') right center no-repeat; background-size: contain; }
.bgtemplate_01 { background: url('../img/bgservicevideos.jpg') top center no-repeat; }
.bgtemplate_02 { background: url('../img/bgservicevideos_red.jpg') top center no-repeat; }
.bgtemplate_03 { background: url('../img/bgservicevideos_blue.jpg') top center no-repeat; }
.bgpopup { background: url('../img/bgpopup.jpg') center center; background-repeat: no-repeat; background-size: cover; }
.bgmobile { background: url('../img/bgmobile.png') top center no-repeat; }
.bgservicevideos { background: url('../img/bgservicevideos.jpg') top center no-repeat; background-size: contain; }
.bgvideoindex { background: url('../img/bgvideoindex.png') top right no-repeat; background-size: contain; }

.servicemenu_block { width: 1080px; height: 590px; }
/*.bgserv_black  { background: url('../img/servicemenu_black.jpg') no-repeat; background-size: cover; }
.bgserv_red { background: url('../img/servicemenu_red.jpg') no-repeat; background-size: cover; }
.bgserv_blue { background: url('../img/servicemenu_blue.jpg') no-repeat; background-size: cover; }*/

.bgserv_black  { background: #2d2c34; }
.bgserv_red { background: #b31701; }
.bgserv_blue { background: #034a7e; }
.bgserv_gray { background: #5e5e5e; }
.bgserv_purple { background: #541b91; }
.bgserv_tire { background: url('../img/bgtire.jpg') top right no-repeat; background-size: cover; }

.borserv_black  { border-bottom: 1px solid #0f0e11; border-top: 1px solid #4f4556; }
.borserv_red { border-bottom: 1px solid #8e1200; border-top: 1px solid #db1d03; }
.borserv_blue { border-bottom: 1px solid #023356; border-top: 1px solid #0567af; }
.borserv_gray { border-bottom: 1px solid #323131; border-top: 1px solid #8f8e8e; }
.borserv_purple { border-bottom: 1px solid #3b1266; border-top: 1px solid #7225c5; }
.borserv_tire { border-bottom: 1px solid #000000; border-top: 1px solid #000000; }

.sm_bgblack { display: inline-block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgblack_selected { display: inline-block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgred { display: inline-block; width: 18px; height: 18px; background: #8f3221; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgred_selected { display: inline-block; width: 18px; height: 18px; background: #8f3221 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgblue { display: inline-block; width: 18px; height: 18px; background: #274a70; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgblue_selected { display: inline-block; width: 18px; height: 18px; background: #274a70 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bggray { display: inline-block; width: 18px; height: 18px; background: #5e5e5e; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bggray_selected { display: inline-block; width: 18px; height: 18px; background: #5e5e5e url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgpurple { display: inline-block; width: 18px; height: 18px; background: #541b91; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgpurple_selected { display: inline-block; width: 18px; height: 18px; background: #541b91 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_buttons, .sm_disclaimer { display: inline-block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_buttons_selected, .sm_disclaimer_selected { display: inline-block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }

.sm_bgtire { display: inline-block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.sm_bgtire_selected { display: inline-block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }

.sm_floatl { float: left; }
.sm_floatl50 { float: left; width: 50%; }
.sm_140 { width: 140px; }
.sm_360 { width: 360px; }
.sm_500 { width: 480px; }

.sm_h400 { height: 378px; }

.sm_mt20n { margin-top: -20px; }
.sm_mt20 { margin-top: 5px; }
/*.sm_mt08 { margin-top: 10px; }
.sm_mt11 { margin-top: 18px; }
.sm_mt20 { margin-top: 20px; }
.sm_ml20 { margin-left: 20px; }
.sm_ml40 { margin-left: 40px; }
.sm_mr20 { margin-right: 20px; }
.sm_mr40 { margin-right: 40px; }*/

.sm_service_input .form-control { border: 1px solid red; }
.sm_titlebox { margin: 20px 0 0 10px; }
.sm_subtitle { font-size: 20px; font-weight: bold; color: #6f7170; }
.sm_title { font-size: 32px; font-weight: bold; color: #6f7170; }
.sm_service { font-size: 20px; font-weight: bold; color: #ffffff; }
.img-responsive-16by9 {
    display: block;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
}

.bgvigray { background-color: #414141; }
.bgvired { background-color: #8f3221; }
.bgviblue { background-color: #274a70; }
.bgvipink { background-color: #d64b8e; }

.warranty { float: left; display: block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.warranty_selected { float: left; display: block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.wintertires { float: left; display: block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.wintertires_selected { float: left; display: block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.appointment { float: left; display: block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.appointment_selected { float: left; display: block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.red_template { float: left; display: block; width: 18px; height: 18px; background: #8f3221; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.red_selected { float: left; display: block; width: 18px; height: 18px; background: #8f3221 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.blue_template { float: left; display: block; width: 18px; height: 18px; background: #274a70; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.blue_selected { float: left; display: block; width: 18px; height: 18px; background: #274a70 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.pink_template { float: left; display: block; width: 18px; height: 18px; background: #d64b8e; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.pink_selected { float: left; display: block; width: 18px; height: 18px; background: #d64b8e url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.playlist { float: left; display: block; width: 18px; height: 18px; background: #000000; margin: 3px 10px 0 0; border: 1px solid #ffffff; }
.playlist_selected { float: left; display: block; width: 18px; height: 18px; background: #000000 url('../img/check.png'); margin: 3px 10px 0 0; border: 1px solid #ffffff; }


div#preloaded-images { position: absolute; overflow: hidden; left: -9999px; top: -9999px; height: 1px; width: 1px; }

/* alignment */
.img-left { float: left; }
.fright { float: right; }
.iblock { display: inline-block; }

/* font */
.font12 { font-size: 12px; }
.font14 { font-size: 14px; }
.font18 { font-size: 18px; }
.font20 { font-size: 20px; }
.font24 { font-size: 24px; }
.font28 { font-size: 28px; }
.font32 { font-size: 32px; }
.font40 { font-size: 40px; }
.font48 { font-size: 48px; }
.font64 { font-size: 64px; }

.fontnormal { font-weight: normal; }
.fontbold { font-weight: bold; }

.fontwhite, .fontwhite:hover { color: #ffffff; }
.fontblack { color: #000000; }
.fontorange { color: #b1662d; }
.fontviolet { color: #7669d5; }
.fontgray { color: #5e5e5e; }
.fontdarkblue { color: #1e4c7d; }

.fontlato { font-family: 'Lato', sans-serif; }

.fontshadow { text-shadow: 2px 1px 2px rgba(119, 119, 119, 1); }
.fontshadowsmall { text-shadow: 2px 1px 2px rgba(150, 150, 150); }

/* buttons */
.btn-violet { color: #ffffff; background: #7669d5; }
.btn-violet:hover { color: #ffffff; background: #8173e5; }
.btn-blue { color: #ffffff; background: #025fc3; }
.btn-blue:hover { color: #ffffff; background: #007bff; }
.btn-gray { color: #000000; background: #e1e1e1; border: 1px solid #000000; border-radius: 50px; }
.btn-gray:hover { color: #000000; background: #cbcaca; }
.btn-darkgray { color: #ffffff; background: #999999; border: 0; }
.btn-darkgray:hover { color: #ffffff; background: #666666; }

/* bootstrap mod */
.dropdown-toggle:after { content: none }

/* extra */
.mobile { display: none; }
.cleaning_icon { display: inline-block; width: 20px; height: 15px; background: url('../img/cleaning_icon.png'); background-size: cover; }
.window_tinting_icon { display: inline-block; width: 14px; height: 14px; background: url('../img/window_tinting.png'); background-size: cover; }
.popup_icon { display: inline-block; width: 17px; height: 17px;  background: url('../img/popup_icon.png'); background-size: cover; }
.warranty_icon { display: inline-block; width: 17px; height: 17px;  background: url('../img/warranty_icon.png'); background-size: cover; }

.companylogo { width: 150px; height: 150px !important;  overflow: hidden; position: absolute; left: 5%; top: 15px; }
.heading { width: 90%; margin: 0 auto; text-align: center !important; position: absolute; top: 130px; left: 5%; }
.headingtop { width: 90%; margin: 0 auto; text-align: center !important; position: absolute; top: 30px; left: 5%; }
.headingbottom { width: 90%; margin: 0 auto; text-align: center !important; position: absolute; top: 250px; left: 5%; }
.headingbuilder { width: 90%; margin: 0 auto 0; text-align: center !important; }
.headingmob { width: 548px; margin: 20px auto 0; text-align: center !important; }
.questions { width: 548px; height: 85px; margin: 0 auto; text-align: center !important; overflow: hidden !important; }
.servicevideos_name { width: 548px; margin: 0 auto; text-align: center !important; overflow: hidden !important; }
.thankyou { width: 700px; margin: 0 auto; overflow: hidden !important; }
.heading_1, .heading_2, .heading_3, .popup_text { text-align: center !important; }
.arrowindex { position: absolute; top: -15px; right: -10px; width: 30px; }

.showpopup_01, .showpopup_02 { display: none; }

#scroll::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5; }
#scroll::-webkit-scrollbar { width: 10px; background-color: #F5F5F5; }
#scroll::-webkit-scrollbar-thumb { background-color: #000000; border: 2px solid #555555; }

.vitable td { padding-top: 15px; }
.videolink, .videolink:focus { cursor: pointer; font-weight: bold; color: #ffffff; background: transparent; border: none; outline: none; }

.newtooltip { position: relative; display: inline-block; }
.newtooltip .tooltiptext { visibility: hidden; width: 140px; background-color: #555; color: #fff; text-align: center; border-radius: 6px; padding: 5px; position: absolute; z-index: 1; bottom: 100%; left: 50%; margin-left: -75px; opacity: 0; transition: opacity 0.3s; }
.newtooltip .tooltiptext::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #555 transparent transparent transparent; }
.newtooltip:hover .tooltiptext { visibility: visible; opacity: 1; }

.modal { padding: 0 !important; }
.modal-full { min-width: 100%; margin: 0; }
.modal-full .modal-content { min-height: 100vh; border-radius: 0; border: 0; }
.pointer { cursor: pointer; }

@media only screen and (max-width: 600px) {
	.desktop, .bigscreen { display: none; }
	.mobile { display: block; }

	section { height: auto; }
	.intro { height: auto; background: url('../img/bgintro.png') right bottom no-repeat; }
	.content { padding-top: 20px; padding-bottom: 20px; }

	h1 { font-size: 28px; }
	h2 { font-size: 24px; }
	h3 { font-size: 20px; }
	h4 { font-size: 18px; }

	/* width */
	.w325 { max-width: 265px; }
	.w350 { max-width: 295px; }

	.mh32 { max-height: 24px; }

	/* margin */
	.mt60 { margin-top: 20px; }
	.mtneg40 { margin-top: 0; }
	.mtneg60 { margin-top: 0; }
	.ml40 { margin-left: 0; }

	/* padding */
	.mobptb20 { padding-top: 20px; padding-bottom: 20px; }
	.plr80 { padding-left: 40px; padding-right: 40px; }

	/* font */
	.font18 { font-size: 14px; }
	.font24 { font-size: 16px; }
	.font32 { font-size: 18px; }
	.font48 { font-size: 24px; }
	.font64 { font-size: 28px; }

	/* alignment */
	.mobtextcenter { text-align: center !important; }
	.mobtextleft { text-align: left !important; }

	/* border */
	.mobnoborder { border: 0 !important; }

	.companylogo { width: 100px; height: 100px !important;  overflow: hidden; }

	.bgserv_tire { background: url('../img/bgtiremobile.jpg') top right no-repeat; background-size: cover; }
}