body{ font-family: "Encode Sans", sans-serif; color: #fff; font-size: 16px; background: #000; }

a{ color: #e2e31b; text-decoration: none; transition: all .3s; }

/*Generics*/
.content{ margin: 0 auto; max-width: 1160px; width: 100%; }
.clearfix:after{ content: ""; display: block; clear: both; }

.mobile{ display: none; }

/*Webkit Scrollbars*/
::-webkit-scrollbar { width: 12px; height: 12px; }  
::-webkit-scrollbar-track { background-color: #000; border-left: none; }
::-webkit-scrollbar-thumb { background-color: #e2e31b; border: 3px solid #000; }
::-webkit-scrollbar-thumb:hover { background-color: #e2e31b; }  

/*Placeholders*/
::-webkit-input-placeholder { color: #999; }
::-moz-placeholder { color: #999; }
:-ms-input-placeholder { color: #999; }
:-moz-placeholder { color: #999; }

/*Forms*/
input,
select,
textarea, 
button{ border: 1px solid #CCC; background: #FFF; padding: 15px; font-family: "Encode Sans", sans-serif; resize: none; border-radius: 5px; margin-bottom: 10px; width: 100%; }

button,
input[type="submit"]{ display: inline-block; border: 3px solid #000; background: #000; border-radius: 5px; padding: 15px 30px; color: #fff; font-weight: bold; text-transform: uppercase; transition: all .3s; cursor: pointer; width: auto; display: inline-block; }
input[type="submit"]:hover{ color: #000; background: none; }

input:focus,
select:focus,
textarea:focus, 
button:focus{ outline: none; }

.page-title{ text-transform: uppercase; font-size: 2.5em; font-weight: bold; margin-bottom: 10px; }

/*Button*/
.button{ display: inline-block; border: 3px solid #FFF; border-radius: 5px; padding: 15px 30px; color: #FFF; font-weight: bold; text-transform: uppercase; transition: all .3s; }
.button:hover{ color: #e2e31b; border-color: #e2e31b; }

.button.inverse{ border-color: #000; color: #000; }

/*Race Flag*/
.raceflag{ width: 100%; height: 20px; background: url("../img/raceflag.svg"); background-repeat: repeat; }

/*Main Header*/
.admin-bar .main-header{ top: 32px; }
.main-header { position: fixed; top: 0; left: 0; z-index: 99; width: 100%; background: #000; height: 120px; }
.main-header .content{ display: flex; align-items: center; height: 100%; justify-content: space-between; }

.main-header .left { display: flex; align-items: center; }
.main-header .left .logo{ display: flex; width: 200px; min-width: 200px; height: 65px; background: url("../img/black.svg"); background-size: 200px 65px; overflow: hidden; text-indent: -1000px; }
.main-header .left p{ text-transform: uppercase; color: #999; font-size: .8em; font-weight: 600; margin-left: 20px; }

.main-header .menu{ display: flex; }
.main-header .menu a{ font-weight: 600; text-transform: uppercase; padding: 10px 20px; }
.main-header .menu a:hover{ color: #fff; }

/*Hero*/
.hero{ height: 700px; overflow: hidden; margin-top: 120px; }
.hero .content{ max-width: 100%; height: 100%; position: relative; }
.hero .content figure{ width: 100%; height: 100%; }
.hero .content figure img{ width: 100%; height: 100%; object-fit: cover; object-position: center center; }

.hero .content figure.align-right img{ object-position: top right; }
.hero .content figure.align-left img{ object-position: top left; }

.hero.small{ height: 300px; }

/*Footer*/
.main-footer{ padding: 60px 0 50px; }
.main-footer .logo{ display: flex; width: 150px; height: 49px; background: url("../img/allwhite.svg"); background-size: 150px 49px; overflow: hidden; text-indent: -1000px; }
.main-footer .footer-wrapper{ display: flex; justify-content: space-between; }
.main-footer .footer-widget-title{ color: #FFF; display: inline-block; text-transform: uppercase; font-weight: 600; font-size: .9em; padding: 8px 0; }
.main-footer .menu{ display: flex; flex-direction: column; }
.main-footer .menu li{ display: block; }
.main-footer .menu li a{ color: #CCC; display: inline-block; font-size: .85em; padding: 8px 0; }
.main-footer .menu li a:hover{ color: #e2e31b; }


.main-footer #menu-social{ display: flex; flex-direction: row; margin-top: 25px; }
.main-footer #menu-social a{ display: block; width: 40px; height: 40px; overflow: hidden; text-indent: 500px; position: relative; }

.main-footer #menu-social .instagram a:before{ content: "\f16d"; font-family: "Font Awesome 6 Brands"; display: block; font-size: 38px; color: #e2e31b; text-indent: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; transition: all .3s; }
.main-footer #menu-social .instagram a:hover:before{ color: #FFF; }

.main-footer #menu-social .facebook{ margin-right: 10px;}
.main-footer #menu-social .facebook a:before{ content: "\f39e"; font-family: "Font Awesome 6 Brands"; display: block; font-size: 32px; color: #e2e31b; text-indent: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; transition: all .3s; }
.main-footer #menu-social .facebook a:hover:before{ color: #FFF; }

.main-footer #menu-social .linkedin{ margin-left: 10px;}
.main-footer #menu-social .linkedin a:before{ content: "\f0e1"; font-family: "Font Awesome 6 Brands"; display: block; font-size: 38px; color: #e2e31b; text-indent: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; transition: all .3s; }
.main-footer #menu-social .linkedin a:hover:before{ color: #FFF; }

.main-footer .address p{ margin-bottom: 10px; }

.legal{ background: #111; font-size: .8em; font-weight: 600; text-transform: uppercase; padding: 20px 0; color: #BBB; }
.legal .content{ display: flex; justify-content: space-between; align-items: center; }
.legal .ttc-logo{ display: block; width: 80px;}

/*Whatsapp Button*/
.whatsapp-logo{ position: fixed; width: 60px; height: 60px; background: #e2e31b; color: #000; right: 10px; bottom: 10px; border-radius: 100%; display: flex; align-items: center; justify-content: center; font-size: 38px; text-decoration: none; box-shadow: 0 0 10px rgba(0,0,0,0.3); }

/*Protection List*/
.protection-list{ display: flex; flex-wrap: wrap; }
.protection-list li{ display: flex; align-items: center; margin-right: 50px; margin-bottom: 15px; }
.protection-list li i{ width: 50px; min-width: 50px; height: 50px; border: 3px solid #FFF; border-radius: 100%; font-size: 28px; display: flex; align-items: center; justify-content: center; }
.protection-list li p{ font-weight: bold; text-transform: uppercase; font-size: 1.2em; margin-left: 10px; line-height: 1.1; }

/*PPF*/
.ppf{ padding: 0 0 80px; }
.ppf .content-box{ max-width: 900px; }
.ppf .content-box .small{ text-transform: uppercase; font-weight: bold; font-size: .9em; color: #eee; margin-top: 100px; margin-bottom: 10px; }
.ppf .content-box .section-title{ text-transform: uppercase; font-size: 2.5em; font-weight: bold; margin-bottom: 10px; line-height: 1.1; }
.ppf .content-box .protects-label{ margin-bottom: 40px; text-transform: uppercase; font-weight: 600; font-size: .9em; color: #666; }
.ppf .content-box .yellow-label{ text-transform: uppercase; font-size: 1.4em; font-weight: bold; color: #e2e31b; margin-top: 30px; line-height: 1.1; }
.ppf .content-box .description{ line-height: 1.3; font-size: 1.1em; max-width: 600px; color: #CCC; margin-bottom: 40px; }

.ppf .right{ justify-content: flex-end; width: 100%; display: flex; }
.ppf .right .button{ margin-top: 40px; }

/*Ceramicos*/
.ppf.ceramico{ background: #EEE; color: #000; }
.ppf.ceramico .content-box{ max-width: 900px; }
.ppf.ceramico .content-box .protects-label{ color: #333; }
.ppf.ceramico .content-box .protection-list li i{ border-color: #000; }
.ppf.ceramico .content-box .small{ color: #111; }
.ppf.ceramico .right{ justify-content: flex-end; width: 100%; display: flex; }
.ppf.ceramico .content-box .description{ color: #333; }

/*Big Image*/
.big-image{ overflow: hidden; height: 500px; width: 100%; }
.big-image figure{ height: 100%; }
.big-image img{ width: 100%; height: 100%; object-fit: cover; }
.big-image.align-right img{ object-position: right; }

/*Wash*/
.ppf.wash{ }

/*Contact*/
.contact{ background: #EEE; padding: 80px 0; color: #000; }
.contact .page-title{ margin: 0 auto; width: 100%; margin-bottom: 40px; }
.contact .content-box{ display: flex; justify-content: center; }
.contact .content-box .left{ width: 50%; }
.contact .content-box .right{ width: 50%; padding-left: 50px; line-height: 1.4; text-align: right; }
.contact .content-box .right h4{ font-weight: bold; text-transform: uppercase; margin-bottom: 10px; }
.contact .content-box .right .map{ width: 100%; height: 300px; margin-top: 40px; border: 1px solid #ccc; border-radius: 5px; overflow: hidden; }
.contact .content-box .right .map iframe{ width: 100%; height: 100%; }
.contact .wpcf7-not-valid-tip{ font-size: .85em; margin-bottom: 10px; }

/*Forms*/
.wpcf7 form .wpcf7-response-output { margin: 0; padding: 0; border: none; margin-top: 30px; }

/*reCAPTCHA*/
.grecaptcha-badge{ visibility: hidden; }
.recaptcha-message{ font-size: 14px; margin-top: 20px; line-height: 1.4; }
.recaptcha-message a{ color: #333; }
.recaptcha-message a:hover{ text-decoration: underline; }