/* Theme Name: Servicentro Automotriz Theme URI: https://servicentroautomotriz.com.co/ Author: Luis Espitaleta Author URL: https://jmteamconsulting.com/ Version: 1.0 Description: Plantilla personalizada para Servicentro Automotriz License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: theme-private Text Domain: https://jmteamconsulting.com/ Domain Path: /languages/ */ @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap'); @media screen and (min-width:0px){ :root{ --main-color-primary:#FFC513; --main-color-secundary:#000; --main-color-text:#161616; --video-ratio: calc(16 / 9); --video-container-max-width: 640px; --video-container-x-padding-sum: 2rem; } ::selection{background:rgba(0, 0, 0, 0.3);} /*=============== GENERAL ===============*/ .rojo{color:#F0555A;} .movil{display:block;} .fullpc{display:none;} /*========== SCROLL TOP ==========*/ #scrollto__top{bottom:7rem;} #scrollto__top a#scrolltop__btn{display:flex; justify-content:center; align-items:center; color:#FFC513; background:#fff; border:3px solid #FFC513;} #scrollto__top a#scrolltop__btn:hover{color:#fff; background:#FFC513;} /*========== OFFCANVAS ==========*/ #offcanvas{background:#161616; position:fixed; width:100%; height:100%; top:0%; left:-100%; padding:5rem 2rem 2rem; z-index:999999999; transition:all .6s ease; overflow:auto;} #offcanvas.active{left:0;} #offcanvas *{color:#ffffff; transition: all .5s;} #offcanvas #btn-close-offcanvas{padding:0; position:absolute; right:2rem; top:2rem; background:transparent;} #offcanvas #btn-close-offcanvas ul{width:3rem; aspect-ratio:1 / 1; list-style:none; position: relative;} #offcanvas #btn-close-offcanvas ul li{width:100%; background:#fff; height:.2rem; position:absolute; left:50%; top:50%;} #offcanvas #btn-close-offcanvas ul li:nth-child(1){transform: translate(-50%, -50%) rotate(45deg);} #offcanvas #btn-close-offcanvas ul li:nth-child(2){transform: translate(-50%, -50%) rotate(135deg);} #offcanvas #logo-link-offcanvas img{margin:auto; max-width:20rem; display:block;} #offcanvas #nav__offcanvas ul.menu{display:flex; flex-wrap:wrap; padding:3rem 0rem 1.5rem; border-top:.1rem solid #0d0d0d21; border-bottom:.1rem solid #0d0d0d21;} #offcanvas #nav__offcanvas ul.menu li{display:flex; flex-wrap:wrap; padding-bottom:1.5rem; width:100%;} #offcanvas #nav__offcanvas ul.menu li.menu-item-has-children{flex-direction:column;} #offcanvas #nav__offcanvas ul.menu li a{display:flex; align-items:center; font-size:1.6rem; line-height:2.4rem; letter-spacing:0.16px; font-weight:400; font-family:'Manrope', sans-serif; } #offcanvas #nav__offcanvas ul.menu li > a > span{transform:rotate(0deg); transition:all .5s;} #offcanvas #nav__offcanvas ul.menu li.active > a > span.wcicon{transform:rotate(180deg); transition:all .5s;} #offcanvas #nav__offcanvas ul.menu li.current-menu-item a{font-weight:700;} #offcanvas #nav__offcanvas ul.menu li ul.sub-menu{background:#FFF; padding:1rem 2rem 0; border-radius: 2px; flex-direction:column; height:0; visibility:hidden; opacity:0; transition:all .4s ease; z-index:9;} #offcanvas #nav__offcanvas ul.menu li:hover ul.sub-menu{height:auto; width:100%; max-width:100%; visibility:visible; opacity:1;} #offcanvas #nav__offcanvas ul.menu li ul.sub-menu li{padding-bottom:2.2rem;} #offcanvas .menu-bottom{padding:3.7rem 0rem 0rem;} #offcanvas .menu-bottom h2{margin-bottom:1.5rem; font-size:1.5rem; line-height:2.4rem; font-weight:400; letter-spacing:-0.225px;} #offcanvas .menu-bottom #widget__social-offcanvas {display:flex;} #offcanvas .menu-bottom #widget__social-offcanvas .widget figure{display:flex; justify-content:center; align-items:center; width:3.2rem; height:3.2rem; padding:0; background:#0D0D0D; margin-right:1.2rem; border-radius:50rem;} #offcanvas .menu-bottom #widget__social-offcanvas .widget figure.social1 img{width:1.8rem;} #offcanvas .menu-bottom #widget__social-offcanvas .widget figure img{width:2.8rem;} /*========== HEADER ==========*/ #header{width:100%; position:sticky; top:0rem; left:0; padding:0; z-index:9999999; background:#fff; transition:all .4s ease;} #header *{font-family: "Montserrat", sans-serif;} /* #header p, #header a{font-size:1.8rem; line-height:2.2rem; font-weight:500;} */ #header .row{display:flex; width:100%; max-width:120rem; margin:auto;} #header .top{width:100%; max-width:unset; background: linear-gradient(115deg, #161616 35%, #ffc513 35%); padding:1rem;} #header .top .top-left #logo-link{display:flex;} #header .top .top-left #logo-link img{width:100%; max-width:8.6rem;} #header .top .top-right .widget:nth-child(2){padding-top:2rem;} #header .top .top-right .box{width:max-content; margin:0 0 0 auto;} #header .top .top-right .follow .uagb-ifb-content{display:flex; justify-content:end;} #header .top .top-right .follow .uagb-ifb-title-wrap{display:none;} #header .top .top-right .info .wp-block-uagb-info-box{display:flex; align-items:center; justify-content:center;} #header .top .top-right .info .uagb-ifb-image-content{margin:auto 1rem auto 0;} #header .top .top-right .info .uagb-ifb-content{width:max-content; flex-grow:unset;} #header .top .top-right .info .uagb-ifb-desc, #header .top .top-right .info .uagb-ifb-desc a{font-weight:700; color:#fff; min-height:4.5rem;} #header .top #icons-menu-movil{margin:auto 1rem auto auto ; padding:0; width:max-content; height:max-content; background:transparent;} #header .top #icons-menu-movil ul{width:2.5rem; aspect-ratio:5/4; list-style:none; display:flex; flex-direction:column; justify-content:space-between;} #header .top #icons-menu-movil ul li{width:100%; height:.4rem; background:#FFF; border-radius:5rem;} #header .bottom .row{justify-content:space-between;} #header .bottom .row #container__logo-bottom img{display:none;} #header .bottom #nav__main .menu{display:flex; list-style:none;} #header .bottom #nav__main .menu li:not(:last-child){margin-right:2rem;} #header .bottom #nav__main .menu li a{font-weight:700; color:#161616; transition:all .5s;} #header.fixed .bottom #nav__main .menu li a{color:#fff;} #header .bottom #nav__main .menu li a:hover{color:#ffc513;} #header .bottom #container_location a{text-transform:uppercase; background:transparent; padding:0; color:#161616; font-weight:700; position:relative;} #header .bottom #container_location a::before{content:""; position:absolute; left:-3rem; top:50%; transform:translateY(-50%); width:2.8rem; aspect-ratio:1/1; background:url(images/icono-ubicacion.svg) no-repeat center/100%;} /*========== ERROR 404 - MAINTENANCE ==========*/ #error404, #maintenance{padding:5rem 1rem;} #error404 .wccol-md-4, #maintenance .wccol-md-4{order:2;} #error404 .wccol-md-8, #maintenance .wccol-md-8{order:1;} #error404 h2{font-size:12rem; color:var(--main-color-primary); line-height:1;} #maintenance h2{font-size:4rem; color:var(--main-color-primary); line-height:1;} #error404 h4, #maintenance h4{font-size:5rem; line-height:1;} #error404 p, #maintenance p{margin:1rem 0; font-size:1.4rem;} #error404 a.wcbtn, #maintenance a.wcbtn{background:#000; color:#fff; padding:1rem 4rem;} /*========== HOME ==========*/ #main__wrapper .section-home > div{max-width:120rem;} .wp-block-uagb-container{gap:0 !important;} a.wp-block-button__link{transition:all .5s; transform:scale(1);} a.wp-block-button__link:hover{transform:scale(1.1); transition:all .5s;} #main__wrapper .box{width:100%; max-width:120rem !important; margin:auto;} #main__wrapper .section-banner{margin:0;} #main__wrapper .section-banner .content-box{display:flex; align-items:center;} #main__wrapper .section-banner .content-box .box{transform: translateX(10%) translateY(20%);opacity: 0; transition: transform 0.5s ease, opacity 1s ease;} #main__wrapper .section-banner .slick-active .content-box .box{transform: translateX(0%) translateY(0%); opacity:1; transition: transform 0.5s ease, opacity 0s ease;} #main__wrapper .section-banner .content-box .box > *{max-width:80rem; margin-right:auto;} #main__wrapper .section-banner .content-box .box .title{text-wrap:balance;} #main__wrapper .section-banner .content-box .box .title .uagb-heading-text{text-wrap:balance;} #main__wrapper .section-banner .slick-list{display:block;} #main__wrapper .section-banner .slick-dots{position:absolute; margin:auto; left:0; right:0rem; bottom:1rem; width:max-content; display:flex; justify-content:center; flex-direction:row;} #main__wrapper .section-banner .slick-dots li{width:3rem; height:3rem;} #main__wrapper .section-banner .slick-dots li button{display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:#fff; background:transparent; aspect-ratio:1/1; border:2px solid #fff; border-radius:5rem; font-size:1.6rem; transition:all .5s;} #main__wrapper .section-banner .slick-dots li.slick-active button{background:#fff; color:#000;} #main__wrapper .section-banner .slick-dots li button::before{display:none;} #main__wrapper .section-services .title .uagb-heading-text{max-width:25rem; display:inline-block; position:relative; text-wrap:balance;} #main__wrapper .section-services .title .uagb-heading-text::before{content:""; width:3rem; background:url("images/line-titlte-left.svg") no-repeat center/100%; position:absolute; left:-3rem; top:50%; transform:translateY(-50%); aspect-ratio:4/2;} #main__wrapper .section-services .title .uagb-heading-text::after{content:""; width:3rem; background:url("images/line-titlte-right.svg") no-repeat center/100%; position:absolute; right:-3rem; top:50%; transform:translateY(-50%); aspect-ratio:4/2;} #main__wrapper .section-services .sub-title .uagb-heading-text{max-width:38.7rem; margin:auto;} #main__wrapper .section-services .content-slider .slick-slide{margin:0 1rem;} #main__wrapper .section-services .content-slider .slick-slide .wp-block-uagb-image, #main__wrapper .section-services .content-slider .slick-slide .wp-block-uagb-info-box{padding-inline:2rem;} #main__wrapper .section-services .content-slider .slick-slide .wp-block-uagb-info-box{padding-bottom:4rem; background:rgba(0, 0, 0, 0.04);} #main__wrapper .section-services .content-slider .slick-slide .uagb-ifb-content{display:flex; flex-direction:column;} #main__wrapper .section-services .content-slider .slick-slide .uagb-ifb-content .wp-block-button{margin:auto 0 0 0;} #main__wrapper .section-services .content-slider .slick-arrow{position:absolute; top:4rem; width:4rem; height:auto; border-radius:5rem; aspect-ratio:1 / 1;} #main__wrapper .section-services .content-slider .slick-arrow:before{display:none;} #main__wrapper .section-services .content-slider .slick-arrow.slick-next{left:7rem; background:url(images/arrow-next.svg) no-repeat center/60%, #FFC700;} #main__wrapper .section-services .content-slider .slick-arrow.slick-prev{left:0rem; background:url(images/arrow-prev.svg) no-repeat center/60%, #FFC700;} #main__wrapper .section-choose .box-text .uagb-ifb-content .uagb-ifb-icon-wrap{width:5.5rem; aspect-ratio:1/1; display:flex; align-items:center; justify-content: center; background:#C0C0C0; color:#333333; border-radius:5rem;} #main__wrapper .section-about .content-text{background-color:transparent;} #main__wrapper .section-ally{background:#333333;} #main__wrapper .section-ally .title .uagb-heading-text{max-width:101rem;} #main__wrapper .section-ally .title .uagb-heading-text span{font-weight:700; display:block; color:#FFC700; padding-top:20px;} #main__wrapper .section-ally .logo-aliado{position:absolute; left:50px; bottom:30px;} #main__wrapper .section-brans{overflow:hidden;} /* #main__wrapper .section-brans .spectra-image-gallery__media-wrapper:hover{transform:scale(1.2); transition:all .5s;} */ #main__wrapper .section-brans .spectra-image-gallery__media-wrapper img{max-width:80%; margin:auto; transition:all .5s;} #main__wrapper .section-brans .spectra-image-gallery__media-wrapper:hover img{transform:scale(1) !important;} #main__wrapper .section-testimonials .slick-slide{padding:3rem !important; margin:0 2rem !important; background:#fff !important;} #main__wrapper .section-testimonials .uagb-post__inner-wrap{margin:0rem !important;} #main__wrapper .section-testimonials .uagb-post__inner-wrap > *{background:#fff; text-align:start;} #main__wrapper .section-testimonials .info-top{display:flex; align-items:center;} #main__wrapper .section-testimonials .uagb-post__image{max-width:7rem; margin-right:3rem;} #main__wrapper .section-testimonials .uagb-post__image a{display:flex; border-radius:5rem; overflow: hidden;} #main__wrapper .section-testimonials .title-content .uagb-post__title{padding:0;} /*========== FOOTER ==========*/ #footer{padding:5rem 2rem 1rem; background:#161616; overflow: hidden;} #footer *{color:#fff;} #footer ul{list-style:none;} #footer .title-footer{position:relative;} #footer .title-footer::before{content:""; width:3rem; height:.2rem; background:#FFC513; position:absolute; left:0; bottom:-.5rem;} #footer .top .wcrow > div{padding-bottom:2rem;} #footer .footer2 li:not(:last-child){margin-bottom:2rem;} #footer .footer2 li a{font-size:1.8rem; line-height:2.4rem;} #footer .footer2 li a:hover{color:#ffc700;} #footer .footer2 li.contact{display:none;} #footer .footer3 .uagb-container-inner-blocks-wrap{gap:0;} #footer .footer3 .uagb-ifb-content{display:flex; align-items:center; padding-bottom:2rem;} #footer .footer3 .uagb-ifb-content .uagb-ifb-image-content{display:flex; margin-right:1rem;} #footer .footer3 .uagb-ifb-content .uagb-ifb-title-wrap{display:none;} #footer .footer3 .uagb-ifb-content .uagb-ifb-desc{margin:0;} #footer .footer3 .content-email .uagb-ifb-content .uagb-ifb-desc a{display:block; max-width:25rem;} #footer .footer4 .content > div{ display: flex; flex-wrap: nowrap; width: 100%; flex-direction: row; justify-content: start;} #footer .footer4 .content > div .wp-block-uagb-image{width:max-content;} #footer .footer4 .content > div .wp-block-uagb-image img{width:100%; max-width:40px;} #footer .bottom{text-align:center; position:relative; padding-top:1rem;} #footer .bottom::before{content:""; width:100vw; height:.1rem; background:#ffffff40; position:absolute; top:0; left:50%; transform:translateX(-50%);} #footer .bottom #design, #footer .bottom #design a{font-size:1.4rem; } #footer .bottom #design a{font-weight:700;} } @media screen and (min-width:768px){ /*========== ERROR 404 - MAINTENANCE ==========*/ #error404, #maintenance{background:url("images/404-background.png") no-repeat center 0; background-size:cover;} #error404 .wccol-md-4, #maintenance .wccol-md-4{order:1;} #error404 .wccol-md-4 img, #maintenance .wccol-md-4 img{margin:0 auto;} #error404 .wccol-md-8, #maintenance .wccol-md-8{order:2;} #error404 h2{font-size:15rem;} #maintenance h2{font-size:9rem;} #error404 h4, #maintenance h4{font-size:7rem;} #error404 p, #maintenance p{font-size:1.8rem;} /*========== OFFCANVAS ==========*/ #offcanvas .content-close{top:2.5em;} #offcanvas .content-logo{padding: 0rem 7.5rem;} #offcanvas img.logo__offcanvas{max-width:24.7rem;} #offcanvas #nav__offcanvas ul.menu li a{font-size:3rem; line-height:3.6rem;} #offcanvas .menu-bottom{flex-direction: unset; align-items:center; margin-top:2.8rem; padding:0;} #offcanvas .menu-bottom #widget__social-offcanvas .icon{display:flex; margin-bottom:unset; flex-direction:column; right:12.7rem; bottom:16.4rem;} #offcanvas .menu-bottom #widget__social-offcanvas .widget{margin:0 1rem;} #offcanvas .menu-bottom #widget__social-offcanvas .icon figure{ width:4.1rem; height:4.1rem;} #offcanvas .menu-bottom #widget__idiomas-offcanvas{position:absolute; right:8.2rem; top:4rem;} /*========== HEADER ==========*/ #header.fixed .top .top-left #logo-link img {max-width:12.6rem;} #header .top .top-left #logo-link img{width:100%; max-width:14.6rem;} #header .top #icons-menu-movil ul{width:3rem;} /*========== HOME ==========*/ #main__wrapper .box{width:95%; max-width:120rem !important; margin:auto;} #main__wrapper .section-banner .content-box{display:flex; align-items:center; /* aspect-ratio:17/6; */} #main__wrapper .section-banner .slick-dots{right:2rem; left:unset; top:0; bottom:0; flex-direction:column;} #main__wrapper .section-banner .slick-dots li{width:3.5rem; height:3.5rem;} #main__wrapper .section-banner .slick-dots li:not(:last-child){margin-bottom:2rem;} #main__wrapper .section-banner .slick-dots li button{font-size:2rem;} #main__wrapper .section-services .title .uagb-heading-text{max-width:45rem;} #main__wrapper .section-services .title .uagb-heading-text::before{width:6rem; left:-7rem;} #main__wrapper .section-services .title .uagb-heading-text::after{width:6rem; right:-7rem;} #main__wrapper .section-services .sub-title .uagb-heading-text{max-width:77rem;} #main__wrapper .section-services .content-slider .slick-arrow{width:5rem; top:50%; transform:translateY(-50%);} #main__wrapper .section-services .content-slider .slick-arrow.slick-prev{left:-3rem;} #main__wrapper .section-services .content-slider .slick-arrow.slick-next{right:-3rem; left:unset;} #main__wrapper .section-choose .box-text{max-width:53rem; margin:auto;} #main__wrapper .section-choose .box-text .uagb-ifb-content{position:relative; padding:0 0 0 8rem;} #main__wrapper .section-choose .box-text .uagb-ifb-content .uagb-ifb-icon-wrap{position:absolute; top:50%; left:0; transform:translatey(-50%);} #main__wrapper .section-about .content-text{background-color:#ededed;} #main__wrapper .section-about .bloq-img .wp-block-uagb-image{margin: 0 0 -50% 0;} #main__wrapper .section-ally{background:linear-gradient(132deg,#333333 59.9%,rgba(51,51,51,0) 60%);} /*========== FOOTER ==========*/ #footer{padding:5rem 2rem 1rem;} #footer .container__row .wcrow.row-1{padding:0rem 0rem 3.5rem;} #footer .top .wcrow > div{padding-bottom:0rem;} #footer .top .wcrow > div:nth-child(1){order:1;} #footer .top .wcrow > div:nth-child(2){order:2;} #footer .top .wcrow > div:nth-child(3){order:4;} #footer .top .wcrow > div:nth-child(4){order:3;} #footer .footer3 .uagb-container-inner-blocks-wrap{justify-content:space-between;} #footer .footer3 .content-email .uagb-ifb-content .uagb-ifb-desc a{max-width:18.5rem;} } @media screen and (min-width:840px){ #main__wrapper .section4-trabaja .bloq .titulo .wp-block-uagb-advanced-heading{width:75%; top:60%;} #main__wrapper .section4-trabaja .bloq .titulo .wp-block-uagb-advanced-heading .uagb-heading-text{font-size:3rem;} } @media screen and (min-width:1025px){ /*========== GENERAL ==========*/ .fullpc{display:block;} .movil{display:none;} /*========== SCROLL TOP ==========*/ #scrollto__top{bottom:8rem;} /*========== SCROLL ANIMATION ==========*/ #main__wrapper .page > section{opacity: 0; transition: opacity 0.7s ease;} #main__wrapper .page > section.visible{opacity:1;} /*========== OFFCANVAS ==========*/ #offcanvas{padding:5.6rem 0rem 0rem; display:none;} #offcanvas .content-close{top:3em; right:10rem;} #offcanvas .content-close a{display:flex;} #offcanvas .content-close a#nav-responsive-close span{font-size:6.6rem;} #offcanvas .content-logo{padding: 0rem 10.1rem;} #offcanvas img.logo__offcanvas{max-width:27.8rem;} #offcanvas #nav__offcanvas{padding:0rem 9.1rem;} #offcanvas #nav__offcanvas ul.menu{padding:5.6rem 1rem 2.5rem;} #offcanvas .menu-bottom{border-top:unset;} #offcanvas .menu-bottom #widget__idiomas-offcanvas{right:21.2rem; top:6.5rem;} #offcanvas .menu-bottom #widget__social-offcanvas{right:10rem;} /*========== HEADER ==========*/ #header{border-bottom:1px solid #ffc51300; transition:all .5s;} #header.fixed{border-bottom:1px solid #ffc513; top:-13.9rem; background:#161616;} #header .container__row.bottom{padding:2rem 1rem; transition:all .5s;} #header.fixed .container__row.bottom{padding:1rem 1rem;} #header .top{opacity:1; visibility:visible; transition:all .5s; background: linear-gradient(90deg, #161616 50%, #ffc513 50%); padding:0rem;} #header.fixed .top{opacity:0; visibility:hidden;} #header .top .top-left{width:30%; background:#161616; padding:1rem;} #header .top .top-left #logo-link img{width:100%; max-width:18.6rem;} #header .top .top-right{display:flex; flex-direction:column; justify-content:center; width:70%; background:#ffc513; position:relative; padding:1rem 1rem 1rem 4rem; } #header .top .top-right *{color:#161616;} #header .top .top-right::before{content:""; display:flex; position:absolute; left:-4.9rem; top:0; width:5rem; height:100%; background: linear-gradient(110deg, transparent 50%, #ffc513 51%);} #header .top .top-right .content-email .uagb-ifb-content .uagb-ifb-desc a{display: block; max-width: 29rem;} #header .bottom .row{justify-content:start; align-items:center; transition:all .5s;} #header.fixed .bottom .row{justify-content:space-between;} #header .bottom .row #container__logo-bottom img{display:block; max-width:0rem; width:100%; margin-right:0rem; opacity:0; visibility:hidden; transition:all .5s;} #header.fixed .bottom .row #container__logo-bottom img{max-width:10rem; opacity:1; visibility:visible; margin-right:2rem;} /*========== HOME ==========*/ #main__wrapper .section-banner .slick-dots li{width:5rem; height:5rem;} #main__wrapper .section-banner .slick-dots li button{font-size:2.5rem;} #main__wrapper .section-services .title .uagb-heading-text{max-width:65rem;} #main__wrapper .section-services .content-slider .slick-arrow.slick-prev{left:-5rem;} #main__wrapper .section-services .content-slider .slick-arrow.slick-next{right:-5rem;} #main__wrapper .section-ally{background:linear-gradient(45deg,#333333 59.9%,rgba(51,51,51,0) 60%);} #main__wrapper .section-ally .logo-aliado{right:100px; left:unset; top:50px; bottom:unset;} /*========== FOOTER ==========*/ #footer .top .wcrow > div:nth-child(1){order:1;} #footer .top .wcrow > div:nth-child(2){order:2;} #footer .top .wcrow > div:nth-child(3){order:3;} #footer .top .wcrow > div:nth-child(4){order:4;} #footer .footer2{width:max-content; margin:auto;} #footer .footer3 .content-email .uagb-ifb-content .uagb-ifb-desc a{max-width:29rem;} } @media screen and (min-width:1400px){ #main__wrapper .section-services .content-slider .slick-arrow{width:6rem;} #main__wrapper .section-services .content-slider .slick-arrow.slick-prev{left:-7rem;} #main__wrapper .section-services .content-slider .slick-arrow.slick-next{right:-7rem;} }