@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');
body {
    font-family: 'Rajdhani', sans-serif;
    color: #384766;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: normal;
}
a {
    color:#384766;
    text-decoration: none;
    font-weight: 500;
}
a:hover {
    color: #384766;
    text-decoration: underline;
}

address { margin: 0}

.bg-amarelo {background-color: #ffde00}
header .fx {font-size: 1.1rem;font-weight: 600;height: 60px;}
header address,header .fone {/* line-height: 60px; */font-weight: 600;}
.vcenter {display: flex;align-items: center;justify-content: center;}
header i{font-size: 1.6rem;vertical-align: middle;}
header .fone i {margin-right: 8px;}
header .fb {margin-right: 20px;}
.container { max-width: 85%;}
#logo-menu {z-index: 100;background: #fcfcfc;position: relative;}
header #logo {margin: 50px 0;display: inline-block;}
#logo img {width:100%;}
#menu { padding: 0}
.navbar-light .navbar-nav .nav-link {color: #384766;}
.navbar-light .navbar-toggler {background: #ffde00;position: relative;z-index: 110;border-radius: 50% 50%;padding: 10px;border: solid 1px #384766;outline: none;}
.navbar-light .navbar-toggler-icon {color: #ffde00;background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(56, 71, 102, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {color:#384766;}

.nav-link {font-size: 1.5rem;font-weight: 500;background: transparent;/* padding: 0 !important; */}
.nav-link:hover, .nav-item.active .nav-link {font-weight: 800;}
.bg-nav, .bg-h1 {background: #ffde00;width: calc(100% - 15px);height: 17px;position: absolute;z-index: -1;right: 14px;top: 11px;display: none;}
.nav-item {margin: 0 20px;position: relative;z-index: 0;}
.nav-item:hover .bg-nav,.nav-item.active .bg-nav {display: block}
.navbar-nav .nav-item:last-child {margin-right: 0;}
.dropdown:hover>.dropdown-menu {display: block;}
.dropdown-menu {margin: 0;background-color: #384766;padding: 8px;border-radius: initial;border: none;width: 420px;}
.dropdown-item {color: #FFF;padding: 8px 12px;line-height: normal;font-weight: 400;letter-spacing: 2px;font-size: 1.1rem;white-space: normal;}
.dropdown-item:hover, .dropdown-item.active {background-color:#ffde00;color:#384766;font-weight: 800;}

section {padding: 60px 0}
h1, .h1 {letter-spacing: 4px;font-weight: 600;position: relative;display: inline-block;margin-bottom: 1rem;line-height: 170%;}
h2 {letter-spacing: 5px;font-weight: 800;margin-bottom: 3rem;font-size: 2.4rem;}
.bg-h1 {display: block;height: 36px;top: 1px;width: 107%;}

section h1 {text-align: center;text-transform: uppercase;}
.semi-bold {font-weight: 500;}
#index p {line-height: 200%;font-size: 1.5rem;}
.vantagens li { vertical-align: top}
.vantagens img {display: inline-block;vertical-align: bottom;margin-bottom: 20px;}
.vantagens .list-inline-item {margin: 1.5rem !important;font-size: 1.5rem;vertical-align: top;}
.vantagens .list-inline-item span {display: block;}
/*OUTROS SERVICOS*/
.outros-servicos {font-size: 0;max-width: 1000px;margin: 0 auto;}
.outros-servicos li.list-inline-item{
    position: relative;
    margin: 4px;
}
.outros-servicos img {
    height: auto;
}
.outros-servicos span{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    letter-spacing: 5px;
    font-size: 1.8rem;
    padding: 85px;
    background: #2323236e;
}
.outros-servicos span.bg-op {/* background: #232323; *//* opacity: 0.5; */}

/*CLIENTES*/
.clientes {font-size: 3rem;border: solid 1px;border-left: 0;border-right: 0;padding: 50px 0;margin: 0;}
#clientes .list-inline-item {margin: 40px;width: 300px;height: 200px;line-height: 200px;}

/*ORÇAMENTO*/
.border-blue {border:solid 1px #384766;font-size: 0;}
#map {width: 100%;border-right: solid 1px #384766 !important;margin: 0;padding: 0;}
#orcamento .form-group {padding: 20px;padding-bottom: 10px;}
#mensagem {min-height: 297px;}

/* FORMULARIOS  */
input, select, textarea,.form-control, .form-control:focus {border: none;box-shadow:none;padding: 0;font-size: 1.4rem;}
.form-group {margin: 0;border-bottom: solid 1px #384766;/* border-left: solid 1px #384766; */}
.form-group label {font-size: 1.4rem;font-weight: 600;letter-spacing: 2px;}
.btn-default,.btn:hover {background: #384766;color:#fff;border-radius: initial;font-size: 1.3rem;}

/* RODAPE */
footer {
    background: #384766;
    color: #FFF;
    padding: 75px 0;
    font-weight: 400;
    font-size: 1.5rem;
}
footer a {color:#fff;font-size: 1.7rem;text-decoration: none !important;font-weight: 600;}
footer a:hover { color:#ffde00 }
#menu-footer .list-inline-item {margin-right: 4rem;}
#menu-footer .list-inline-item:last-child, .list-inline-item:last-child { margin: 0}
.border-yellow {border-left: solid 1px #ffde00;/* padding: 30px 0 30px 40px; */padding-left: 30px;margin: 15px 0;}
.border-yellow, #menu-footer, footer .contatos {width: 100%;/* text-align: right; *//* float: right; *//* padding-left: 0; */max-width: 775px;display: inline-block;}
.border-yellow address {/* margin-bottom: 20px */}
footer .contatos {text-align:left;margin-top: 20px;}
footer .fone a {font-size: 1.8rem;}
footer i{font-size: 2.4rem;vertical-align: middle;}
footer .fone i {margin-right: 15px;}
footer .fb i {margin-right: 65px;padding: 0;margin-left: -10px;}
.yellow a {color: #ffde00}
#menu-footer .list-inline {margin-bottom: 2rem;}
.logop { display:none}

/** SERVICOS **/
#servicos .text {    
text-align: justify;    
font-size: 1.8rem;    
font-weight: normal;    
line-height: 175%;
}
#servicos .row {margin-bottom: 50px;}
#servicos h1 {padding-bottom:20px}
#servicos h2 {font-size: 2.2rem;font-weight: 600;padding: 15px 0;}
.antes {text-align: right}
.depois{text-align: left}

@media (max-width: 1520px) {
    .container { max-width: 95%;}
    #logo {width:400px;}
    .nav-link { font-size: 1.2rem; }
    .bg-nav {height: 11px;}
    footer .logog img{width: 200px;margin-top: 44px;}
    #menu-footer {/* min-width: initial; *//* width: 100%; */text-align: left;}
    #menu-footer a {font-size: 1.4rem}
}
@media (max-width: 1250px) {
    footer .logog img{/* margin-right: 188px; */}
    .antes,.depois {text-align: center;flex: 100%; max-width: 100%;margin-bottom: 20px}
}
@media (max-width: 1120px) {
    .nav-item {/* margin: 0 10px !important; */}    
    #logo {width:350px}
    footer .logog{display: none}
    .border-yellow {border:none;min-width: initial;width: 100%;text-align: center !important;float: none;padding: 0;}
    #menu-footer {width: 100%;min-width: initial;text-align: center;}
    footer .row > div {width: 100% !important;max-width: initial;flex: none;text-align: center !important;}
    footer .text-md-center {display: none}
    .logop {display:block;margin-top: 50px;}
    footer a {color:#ffde00}
    footer .contatos {min-width: initial;text-align: center;}
}

@media (max-width: 992px) {
    .navbar-collapse {position: absolute;right: 0;top: 89px;z-index: 100;background: #263044e0;/* padding-right: 10px; */border: solid 1px;text-align: center;}
    .nav-item:hover .bg-nav, .nav-item.active .bg-nav { background: transparent; }
    .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {color:#FFF}
    .nav-item, .dropdown {margin:0;padding: 5px 20px;}
    .dropdown-menu {margin:0;padding: 0;text-align: center;}
    .dropdown-menu .dropdown-item {margin: 0;font-size: small;}
    #logo {width:350px}
    .outros-servicos .list-inline-item img,.clientes .list-inline-item img {width: 200px}
    #clientes .list-inline-item {margin: 20px;/* width:200px; */height: 200px;}
    .outros-servicos span {font-size: 1rem}
    footer {padding:50px 0}
    footer,footer .fone a {font-size: 1rem}
    footer a, footer i {font-size: 1.2rem}
    footer .fb i {margin-right: 20px}
    
}
@media (max-width: 768px) {
    .container {max-width: none}
    header .fx {font-size: 0.8rem}
    /*#logo {width:300px}*/
    h1,.h1 {font-size: 1.6rem;}
    .bg-h1 {height: 25px}
    h2 {font-size: 1.4rem}
    #index p {font-size: 1.4rem;line-height: 150%}
    .vantagens img {width: 100px;margin-bottom: 10px}
    .vantagens .list-inline-item {font-size: 1rem;text-align: center;width: 145px;}
    #map {height: 300px;border-right: none !important;border-bottom: solid 1px #384766 !important;}
    .form-group label {font-size: 1rem;margin: 0;}
    input, select, textarea, .form-control, .form-control:focus {font-size: 1rem}
    #orcamento .form-group { padding: 10px; padding-bottom: 5px;}
    #mensagem {min-height: 150px}
    footer,footer .fone a {font-size: 0.8rem}
    footer a, footer i {font-size: 1rem}
    #menu-footer .list-inline-item {margin-right: 1.5rem;}
    .clientes .list-inline-item img {width: 130px;}
    #clientes .list-inline-item {margin: 15px;width: 190px;height: 160px;line-height: 160px;}
    .clientes {padding: 0;padding-bottom: 30px;}
    #servicos .text {font-size: 1.2rem; line-height: 150%}    
}

@media (max-width: 450px) {
    .navbar {position: initial}
    .navbar-collapse {position: absolute;right: 0;top: 159px;width: 100%;}
    #logo {width: 250px;}
    .dropdown-menu {width: 100%}
    #servicos img {width: 100%}
}