/* ----------------------------------BASICO-----------------------------------*/
:root{
    --main:#005386;
    --orange:#cd7b36;
    --dark:#bf5c0a;
}

@font-face{
	font-family: 'MyWebFont';
	src: url('IKAROS-REGULAR.OTF');
}

@font-face{
	font-family: 'logo';
	src: url('Arciform.otf');
}
*{
    padding: 0;
    margin: 0;
}
body{
    background-color: white;
}
.block{
    display: block;
    transition: all .5s;
}
.none{
    display: none;
}
.orange{
    background-color: var(--main);
}
.orange .bar1,.orange .bar2,.orange .bar3{
    background-color: white !important;
}
/*---------CABEÇALHO----------------------------------------------------------------*/
header{
    height: 9vh;
    width: 100%;
    top: 0;
    display: flex;
    align-items: center;
    background-color: white;
    position: sticky;
    z-index: 999999999;
    border-bottom: 9vh;
}
header .logo{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 75%;
    font-family: 'logo';
    color: var(--main);
    margin-left: 5vw;
    font-weight: 100;
}
header .logo img{
    width: 16vw;
    height: auto;
}
header .logo p{
    font-family: 'MyWebFont';
}
.menu{
    width: 15vw;
    height: 9vh;
    display: flex;
    justify-content: center;
    background-color: var(--main);
    align-items: center;
}
/*.orange .bar1,.orange .bar2,.orange .bar3{
    background-color: white !important;
}*/
.menu .bar1{
    width: 3vw;
    height: .3vw;
    background-color: white;
}
.menu .bar2{
    width: 3vw;
    height: .3vw;
    background-color: white;
    margin: .5vw 0;
}
.menu .bar3{
    width: 3vw;
    height: .3vw;
    background-color: white;
}
nav{
    width: 15vw;
    height: 91vh;
    background-color: var(--main);
    position: fixed;
    z-index: 99991;
    display: none;
    transition: all .5s;
}
nav li{
    text-align: center;
    color: white;
    font-family: 'MyWebFont';
    cursor: pointer;
    font-size: 1.3vmax;
    list-style: none;
}
.another{
    padding: 1.2vw 0;
}
nav li:hover{
    background-color: var(--dark);
}
nav .sub{
    display: none;
    overflow-y: scroll;
    height: 49vh;
}
.sub li a{
    padding: 1vw 0 !important;
}
nav a{
    text-decoration: none;
    color: white;
    padding: 1.2vw 0;
    display: block;
}
/*------------------------------------------------------------------------SLIDER--------------------*/
.slider div{
    height: 20vw;
}
.slider .um{
    background-image: url(../images/1\ \(2\).jpg);
    background-size: cover;
    background-position: center;
}
.slider .dois{
    background-image: url(../images/1-\(2\).jpg);
    background-size: cover;
    background-position: center;
}
.slider .panel{
    width: 50vw;
    height: 100%;
    background-color: rgba(0, 83, 134, 0.0);
}
.slider h1{
    font-family: 'MyWebFont';
    color: white;
    text-align: center;
    padding: 8vw 0;
}
/*-----------------------------------CONTEUDO-----------------------------------------------------------*/
/* -----------------------------------HAHAHAHHAHAHAHAHAHHAHAHAHAHAHHAHAHA--------------------------------*/
.haha{
    display: flex;
    justify-content: space-between;
}
.hehe{
    width: 70vw;
    margin: 0 auto;
    padding: 2vw;
    background-color: white;
}
.aaaa{
    font-family: 'MyWebFont';
    color: var(--main);
    text-align: left;
    padding: 3vw 0 6.5vw;
    font-size: 3vw;
    /*width: 27vw;*/
}
.haha div{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
}
.haha img{
    width: 13vmax;
    height: auto;
    border-radius: 50%;
}
.haha h1{
    font-family: 'MyWebFont';
    color: var(--main);
    padding: 2vw 0 0;
}
.haha a{
    text-decoration: none;
}
.cinza{
    background-color: #f7f7f7;
}
.content h1{
    font-family: 'MyWebFont';
    color: var(--main);
    text-align: left;
    padding: 3vw 0;
    font-size: 3vw;
  /*  width: 30vw;*/
}
.grid{
    width: 70vw;
    margin: 0 auto;
    padding: 0 2vw;
    background-color: white;
    box-shadow: .3vw .3vw .3vw #f7f7f7;

}
.grid div{
    display: block;
}
.grid .g{
    padding: 2vw;
}
.grid img{
    width: 12vw;
    border-radius: 3%;
}
.grid div .info{
    display: block;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.grid div h2{
    font-family: 'MyWebFont';
    text-align: right;
    color: var(--orange);
    font-size: 2vw;
    font-weight: 500;
}
.grid div p{
    text-align: right;
    font-family: 'Lato';
    font-size: 1.2vw;
    width: 30vw;
    font-weight: 600;
}
.grid div:nth-of-type(2) .info{
    flex-flow: row-reverse;
}
.grid div:nth-of-type(2) p,.grid div:nth-of-type(2) h2,.grid div:nth-of-type(4) p,.grid div:nth-of-type(4) h2{
    text-align: left;
}
.grid div:nth-of-type(4) .info{
    flex-flow: row-reverse;
}
/* ---------------------- QUASE LA --------------------------------------------------------------*/
.cinza{
    padding: 3vw 0 0 0;
}
.grade{
    width: 70vw;
    margin: 0 auto;
    padding: 0 2vw;
    background-color: white;
    box-shadow: .3vw .3vw .3vw #f7f7f7;
}
.gg{
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 3vw;
    justify-content: center;
}
.gg .gr{
    text-align: center;
    margin: 2vw 0;
}
.gg .gr img{
    border-radius: 50%;
}
.gg .gr h2{
    font-family: 'MyWebFont';
    color: var(--orange);
    padding: 1vw 0;
}
.gg .gr p{
    width: 30vw;
    margin: 0 auto;
    text-align: center;
    font-family: 'Lato';
    font-weight: 600;
}
/*------------------------------------------------FOOTER------------------------------------------------*/
.footer h1{
    text-align: center;
    font-family: 'MyWebFont';
    color: var(--main);
    font-size: 2.2vmax;
    padding: 3vw 0;
}
/* ---------------PAG ------------------------------CONTATOS---------------------------------------*/
.cont{
    width: 70vw;
    margin: 0 auto;
    background-color: white;
    padding: 2vw;
}
.cont h1{
    font-size: 2.5vmax;
    font-family: 'MyWebFont';
    color: var(--main);
    text-align: center;
}
.cont .numeros{
    font-family: 'Lato';
    font-weight: 600;
    font-size: 1.3vmax;
    display: flex;
    padding: 2vw 0;
    width: 20vw;
    justify-content: space-between;
    margin: 0 auto;
}
form input[type=text]{
    width: 50vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);

}
form input[type=tel]{
    width: 50vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);

}
form input[type=email]{
    width: 50vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);

}
form input[type=number]{
    width: 50vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);
}
form textarea{
    width: 50vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);
}
form input[type=submit]{
    width: 54.5vw;
    padding: 2vw 2vw;
    margin: 1vw 10vw;
    color: var(--main);
    font-family: 'MyWebFont';
    font-size: 1.3vmax;
    border: .2vw solid var(--orange);
    background-color: var(--orange);
}
/*---------------FOTOS-----------------*/
/*----------------PAG-------------------------------------CLIENTES----------------------------------*/
.dentro{
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
    grid-gap: 4vw;
}
.dentro .decido{
    display: flex;
    flex-flow: column;
    align-items: center;
}
.dentro .decido .pad_bot1{
    font-family: 'MyWebFont';
    font-size: 1.5vw;
    width: 30vw;
    text-align: center;
    color: var(--main);
}
.dentro .decido .pad_bot3{
    font-family: 'Lato';
    width: 30vw;
    text-align: center;
}
.dentro .decido img{
    width: auto;
    height: 7vw;
    margin: 1vw 0;
}
.insido .pad_top1{
    font-family: 'MyWebFont';
    color: var(--main);
    padding: 2vw 0;
    font-size: 2.3vw;
    font-weight: 600;
}
.insido .pad_bot1{
    font-family: 'MyWebFont';
    font-size: 1.8vw;
    color: var(--orange);
}
.insido p{
    font-family: 'Lato';
    font-size: 1.4vw;
    width: 50vw;
    margin: 2vw auto;
    text-align: center;
}
.fotos{
  display: grid;
  grid-template-columns: auto auto auto;
  justify-content: space-between;
  grid-gap: 3vw;
  padding: 2vw;
  margin-top: 3vw;
}
.fotos .arroz{
    text-align: center;
}
.fotos .arroz img{
    width: 15vw;
    height: auto;
}
.fotos .arroz p{
    font-family: 'MyWebFont';
    color: var(--main);
    font-size: 1.4vmax;
}
@media screen and (max-width:768px) {
  header .logo{
    justify-content: center;
    width: auto;
}
header .logo img{
    width: 50vw;
}
header .logo p{
    display: none;
}
.menu{
    width: 25vw;
}
.menu .bar1{
    width: 10vw;
    height: 1vw;
}
.menu .bar2{
    width: 10vw;
    height: 1vw;
    margin: 1vw 0;
}
.menu .bar3{
    width: 10vw;
    height: 1vw;
}
nav{
    width: 100%;
}
nav li{
    padding: 2vmax 0;
    font-size: 2.5vmax;
}
.sub li{
    padding: 2vmax 0;
}
/*--------------------Slider ---------------------*/
.slider div{
    height: 40vh;
}
.slider .panel{
    width: auto;
    height: 20vh;
    margin: 10vh 0 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.slider h1{
    width: 70vw;
}
/*-----------------------HAHAHAHAHAHHAHA ------------*/
.haha{
    flex-flow: column;
    justify-content: center;
    align-items: center;
}
.hehe{
    width: 95vw;
}
.aaaa{
    font-size: 4vmax;
    width: auto;
    text-align: center;
}
.haha div{
    margin: 2vmax 0;
}
.haha img{
    width: 25vmax;
}
.content h1{
    font-size: 4vmax;
    width: auto;
    text-align: center;
}
.grid{
    width: 95vw;
}
.grid img{
    width: 40vw;
}
.grid div h2{
    font-size: 2.5vmax;
}
.grid div p{
    font-size: 1.5vmax;
    width: 40vw;
}
/*------------------------QSE LÁ----------------*/
.grade{
    width: 95vw;
}
.gg .gr p{
    width: 40vw;
}
.footer h1{
    font-size: 4.2vmax;
}
/*--------------------DEICDO-**********/
.dentro{
    grid-template-columns: auto;
}
.dentro .decido .pad_bot1{
    font-size: 4vh;
    width: auto;
}
.dentro .decido .pad_bot3{
    width: auto;
    font-size: 2vh;
}
.dentro .decido img{
    height: 20vw;
    margin: 2vh 0;
}
.insido .pad_top1{
    font-size: 4vh;
    padding: 4vh 0;
}
.insido .pad_bot1{
    font-size: 3vh;
}
.insido p{
    font-size: 2vh;
    width: 80vw;
}
.fotos{
    padding: 0;
}
.fotos .arroz img{
    width: 30vw;
}
.fotos .arroz p{
    font-size: 4.4vw;
}
}