/*CORES: cor principal = #34c4c4 (verde agua)
azul escuro
azul clarnho
cinza
roxo: #592ab8
cor das fontes ori inicialmente preta, quando aproximar o cursor ficará branca.*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lilita+One&display=swap');

.site {

    width: 100%;

    max-width: 1200px;

    margin: 0 auto;

}



.carousel-inner{


position: relative;
width: 100%;
overflow: hidden;
}



.media-body {
    -webkit-box-flex: 1;
    flex: 1
}

.carousel {
    position: relative
}

.carousel-item active {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform .6s ease-in-out;
    transition: -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out;
    transition: transform .6s ease-in-out,-webkit-transform .6s ease-in-out
}
/*menu home*/

header {

    background: #000000;
    padding: 10px;

}

.sociaistopo {
    background: #000000;
    padding: 6px 0;
}

.sociaistopo ul {
    display: flex;
    align-items: center;
}

.sociaistopo ul li {
    margin: 6px;
}

.sociaistopo ul li a {
    width: 40px;
    height: 40px;
    display: block;
}

.sociaistopo ul li:nth-child(1) {
    background: url(../img/insta.png);
    background-size: cover;
}

.sociaistopo ul li:nth-child(2) {
    background: url(../img/face.png);
    background-size: cover;
}

.sociaistopo ul li:nth-child(2) {
    margin-right: 5px;
}

.topoMenu {

    background: #000000;
    padding: 6px 0;

}

.topoMenu div {


    display: flex;
    justify-content: space-between;


}

.topoMenu h1 {

    background-image: url(../img/logo2.png);
    width: 300px;
    height: 110px;
    text-indent: -9999px;
    margin-left: 10px;

}

.topoMenu ul {

    display: flex;
    /*deixei alinhado lado a lado o menu cardapio etc*/

}

.topoMenu ul li {

    margin: 5px;
    padding: 5px;
    text-align: center;

}

/*home cardapio etc visual*/
.topoMenu ul li a {

    color: #34c4c4;
    font-family: 'Open Sans', sans-serif;
    text-decoration: none !important;
    /*tirei a linha de marc*/
    text-transform: uppercase;
    text-align: left;
    margin-left: 5px;
    font-size: 17px;
    display: flex;

}

/*home cardapio etc quando passa o mouse*/
.topoMenu ul li a:hover {

    color: rgb(255, 255, 255);
    font-family: 'Open Sans', sans-serif;
    ;

}

/*Banner roratório*/
.banner img {

    width: 100%;

}

.banner .slick-dots {
    bottom: 25px;

}

.slick-dots li button:before {
    font-family: 'slick';
    font-size: 30px;
    line-height: 20px;
    content: '•';
    text-align: center;
    opacity: .25;
    color: rgb(0, 226, 200);

}


.slick-dots li.slick-active button:before {
    opacity: .75;
    color: rgb(3, 230, 207);
}

.banner .slick-prev:before,
.slick-next:before {
    font-size: 40px;
    color: #00e5da;
}

.banner .slick-prev {
    left: 25px;
    z-index: 1;
}

.banner .slick-next {
    right: 40px;
}

/*//////////////////////////////////////////////////*/


/*Cardápio*/

.FundoCardapio {

    background: url(../img/backgroundnossorestaurante.png);
    padding: 150px;
    background-attachment: fixed;


}

.FundoCardapio h1 {

    font-family: 'Lilita One', cursive;
    color: #ffffff;
    font-size: 70px;
    text-transform: uppercase;
    text-align: center;
    margin-top: -70px;

}



.infoCardapio {

    background: #030303;
    padding: 150px;
    text-align: center;
    margin-top: -30px;

}

.infoCardapio h1 {

    font-family: 'Lilita One', cursive;
    color: #ffffff;
    text-align: center;
    font-size: 55px;
    margin-bottom: 8%;
    margin-top: -35px;

    /*falta terminar */

}

/*imgs posicionadas*/
.infoCardapio div div {
    display: flex;
    justify-content: center;
    margin-right: 4%;
    margin-left: 4%;
    /*deixando lado a lado*/
}

/*bordas img*/
.cards img {
    border-radius: 10%;
    display: flex;

}

.cards h1 {
    font-family: 'Lilita One', cursive;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    position: absolute;
    margin: 0 auto;
}

.cards {

transition: .5s;

}

.cards a:hover {

    background: #00c4c4;
    padding: 20px;
    border-radius: 10%;
    transition: .5s;
    padding-bottom: 55px;
    cursor:pointer;

}


/*faz parte do cardapio*/

/*BEBIDAS*/
.fundobebidas {

    background: rgb(0, 0, 0);
    padding: 200px;
    margin: 0 auto;


}

.FundoBebidas {

    background: url(../img/backgroundnossorestaurante.png);
    padding: 150px;
    background-attachment: fixed;


}

.FundoBebidas h2 {


    font-family: 'Lilita One', cursive;
    color: #ffffff;
    font-size: 70px;
    text-transform: uppercase;
    text-align: center;
    margin-top: -70px;
}

.cardsbebidas {


    display: flex;
    justify-content: center;
    margin-right: 4%;
    margin-left: 4%;
}

.cardsbebidas h1 {
    font-family: 'Lilita One', cursive;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    position: absolute;
    margin-left: 95px;
}


/*HAMBURGERS*/
.fundohamburgers {

    background: rgb(0, 0, 0);
    padding: 200px;
    margin: 0 auto;


}

.Fundohamburgers {

    background: url(../img/backgroundnossorestaurante.png);
    padding: 150px;
    background-attachment: fixed;


}

.Fundohamburgers h2 {

    font-family: 'Lilita One', cursive;
    color: #ffffff;
    font-size: 70px;
    text-transform: uppercase;
    text-align: center;
    margin-top: -70px;

}

.cardshamburgers {

    display: flex;
    justify-content: center;
    margin-right: 4%;
    margin-left: 4%;

}

.cardshamburgers h1 {
    font-family: 'Lilita One', cursive;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    position: absolute;
    margin-left: 95px;
    font-size: 25px;
}

/*SOBREMESAS*/
.fundosobremesas {

    background: rgb(0, 0, 0);
    padding: 200px;
    margin: 0 auto;


}

.Fundosobremesas {

    background: url(../img/backgroundnossorestaurante.png);
    padding: 150px;
    background-attachment: fixed;


}

.Fundosobremesas h2 {


    font-family: 'Lilita One', cursive;
    color: #ffffff;
    font-size: 70px;
    text-transform: uppercase;
    text-align: center;
    margin-top: -70px;


}

.cardssobremesas h1 {
    font-family: 'Lilita One', cursive;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    position: absolute;
    margin-left: 95px;
    font-size: 25px;
}

.cardssobremesas {


    display: flex;
    justify-content: center;
    margin-right: 4%;
    margin-left: 4%;

}


/*///////////////////////////////////////////////*/

/*Rodapé*/
.rodape {
    background: #000000;
    color: #fff;
    padding: 200px 0;
}

.rodape .logo-savatore {
    background: url(../img/rodapelogo.png) no-repeat center;
    width: 100%;
    height: 100px;
    margin-top: -80px;
    padding-bottom: 10px;
    z-index: 1;
}

.rodape div {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rodape div div {
    width: 25% 0;
}

.rodape .rodapeEndereco {
    background: url(../img/localizacaorodape.png) no-repeat left top 4px;
    padding-left: 40px;
    padding-top: 22px;

}

.rodape .rodapeWhatzapp {
    background: url(../img/wpprodape.png) no-repeat left 4px;
    padding-left: 40px;
    padding-top: 15px;
    font-size: 20px;
}

.rodape .rodapeTelefone {
    background: url(../img/telefonerodape.png) no-repeat left 4px;
    padding-left: 40px;
    padding-top: 15px;
    font-size: 19px;
}

.rodapeRedes {
    text-align: center;
    display: flex;
    justify-content: space-around;
}

.rodapeRedes ul {
    display: flex;
    justify-content: space-around;
}

.rodapeRedes ul li {
    width: 20%;
}

.rodapeRedes img {
    width: 50;
}

/*//////////////////////////////////////////////////////*/


/*Quem Somos*/
.bannerquemsomos {

    background: url(../img/quemsomosbanner.png);
    padding: 350px
}

.bannerquemsomos img {

    background-size: cover;


}

.nossorestaurante {

    padding: 400px;

    background: url(../img/backgroundnossorestaurante.png);

    background-attachment: fixed;

}

.boxdetextos {

    width: calc(60% - 30px);
    /*DEI CTRL C CTRL V ESTUDAR P QUE SERVE*/

}

.nossorestaurantetext {
    /*TUDO RELACIONADO AO FUNDO DO "NOSSORESTAURANTE"*/
    background: url(../img/nossorestaurantefundo.png);
    padding: 120px;
    margin-left: -400px;
    margin-right: -400px;
    margin-top: -100px;


}

.nossorestaurantetext h1 {

    font-family: 'Lilita One', cursive;
    font-size: 48px;
    color: aliceblue;
    display: table-caption;
    /*QUEBROU A LINHA*/
    margin-top: -50px;
    text-shadow: 0.1em 0.2em rgb(6, 143, 153)
}

.nossorestaurantetext p {

    font-family: 'Lilita One', cursive;
    color: aliceblue;
    font-size: 30px;
    margin-top: 50px;
    width: calc(80% - 30px);


}

/*imagens*/

.imagensrestaurante {

    margin-left: 1000px;

}

.imagensrestaurante img {

    margin-top: -900px;
    border-radius: 20px;

}

.botaoloc {
    border: 2px solid #ffffff;
    border-radius: 15px;
    padding: 20px;
    margin-top: 40px;
    cursor: pointer;
    padding: 10px 30px;
    text-decoration: none;
    font-family: 'Lilita One', cursive;
    background: #34C4C4;
    font-size: 27px;

}

.botaoloc:hover {

    background: #ffffff;

    border: 2px solid #16c5b6;

}

/*/////////////////////////////////////////////*/




/*Fundo login section Login*/

.FundoLogin {


    background: url(../img/backgroundnossorestaurante.png);
    padding: 150px;
    background-attachment: fixed;
    text-align: center;

}

.FundoLogin h2 {

    font-family: 'Lilita One', cursive;
    color: #ffffff;
    font-size: 70px;
    text-transform: uppercase;
    text-align: center;
    margin-top: -70px;

}



.btnLogin {

    color: #000000;
    font-family: 'Lilita One', cursive;
    background: #00c4c4;
    border-radius: 5em;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: 1.2ms;
    margin-top: 1.5em;
}


.btnLogin:hover {

    color: #000000;
    font-family: 'Lilita One', cursive;
    background: #95ffff;
    border-radius: 5em;
    cursor: pointer;
    text-decoration: none;
    border: none;
    transition: 1.2ms;

}




/*section3*/

/*Estilos para despositivos móveís*/


/*

901 a 1200 - desktop

601 a 900 - tablets

0 a 600 - celulares

*/
@media not all and (max-width:600px) {

    .abrirMenu,
    .fecharMenu {
        display: none;

    }

}


@media(max-width:900px) {

    .topoMenu ul li a {

        text-align: center;
    }


    .topoMenu ul li {
        margin: none;

    }



}






@media(max-width: 600px) {

    .sociaistopo div {

        flex-direction: column;


    }


    .topoMenu ul {

        flex-direction: column;
        align-items: baseline;

    }

    .topoMenu nav {
        background: rgb(17, 17, 17);
        height: 100%;
        position: fixed;
        z-index: 1;
        margin: 0;
        top: 0;
        max-width: 400px;
        width: 60%;
        right: -360px;
        transition: right 0.5s ease-out;
    }

    .topoMenu div {

        display: flex;
        flex-direction: row;

    }

    .menuAtivo .topoMenu nav {
        right: 0px;

    }

    .fecharMenu {
        background: url(../img/fechar.png);
        background-size: cover;
        margin: 5%;
        padding: 30px;
        border: 0;
        display: block;
    }

    .abrirMenu {
        background: url(../img/menu.png);
        background-size: cover;
        margin: 5%;
        padding: 30px;
        border: 0;
        display: block;
    }

    /*cardapiooooo*/

    .cards {

        flex-direction: column;


    }

    .cards a:hover {
        background: #20aeae;
        padding: 20px;
        border-radius: 10%;
        transition: 500ms;
        padding-bottom: 10px;
    }

    /*Mudei agr 23/05*/
    .cardssobremesas {
        display: block;
        justify-content: center;
        margin-right: 4%;
        margin-left: 4%;
    }

    .cardshamburgers {
        display: block;
        justify-content: center;
        margin-right: 4%;
        margin-left: 4%;
    }

    .cardsbebidas {
        display: block;
        justify-content: center;
        margin-right: 4%;
        margin-left: 4%;
    }

    .cards img {


        margin-bottom: 100px;

    }


    .infoCardapio h1 {

        margin-bottom: 10%;
        margin-top: -80px;

    }




    .banner {

        display: none;

    }


    /*n funcionou*/


    /*mapa*/

    .rodape div {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
        padding-bottom: 15px;
    }

    /*quem somos*/

    .banner {
        background: url(../img/quemsomosbanner.png);
        padding: 400px;
        width: 100%;
    }

    .nossorestaurante {
        padding: 650px;
        background: url(../img/backgroundnossorestaurante.png);
        background-attachment: fixed;
    }


    .bannerquemsomos {
        display: none;
    }

    .nossorestaurantetext {
        margin-top: -600px;
        margin-left: -650px;
    }

    .nossorestaurantetext p {

        width: 90%;
        text-align: center;
        margin-left: -30px;
    }

    .botaoloc {

        margin-left: 80px;
    }


    .imagensrestaurante img {
        margin-top: 70px;

        margin-left: -1050px;
    }

    .rodape div {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
    }

    .nossorestaurantetext h1 {


        text-align: center;


    }



}