@charset "utf-8";

.imgMobile {
    display: none;
}

body{
	/*font-family: Bariol, sans-serif;*/
	font-family: "Nunito Sans", sans-serif;
	color: #292929;
	background-color: #eaedf2;
}

#articleResultados {
    position: absolute;
    z-index: 1;
    left: 0%;
    right: 0%;
    margin: auto;
    padding: 3% 0%;
    width: 100%;
    max-width: 960px;
    background-color: #4cbdc4;
}

/* Ícone fechar Resultados */
#iconeFecharResultados {
    position: absolute;
    max-width: 27px;
    margin-left: 3%;
}

.h2Resultados {
    margin: 0%;
    padding: 0%;
    font-size: 1.5rem;
    color: #ffffff;
}

.formulariosResultados {
    text-align: center;
}

#email, #senha, #doc_user, #senha_user {
    margin: 1.5% 0% 0% 0%;
    padding: 1% 2%;
    width: 50%;
    border: none;
    border-radius: 5px;
    font-family: "Nunito Sans", sans-serif;
    font-size: 1rem;
    color: #292929;
}

#button4 {
    margin: 1.5% 0% 0% 0%;
    padding: 1% 2%;
    width: 25%;
    border: none;
    border-radius: 5px;
    font-family: "Nunito Sans", sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: #ffffff;
    background-color: #5198e2;
}

.spansEsqueci {
    display: block;
    margin-top: 1.5%;
    color: #ffffff;
    text-decoration: underline;
    font-size: 1rem;
}

#formDentista {
    margin-top: 3%;
}

#tudo {
	position: relative;
    top: -8px;
	right: 0px;
	left: 0px;
	margin: auto;
	width: 100%;
	max-width: 960px;
	height: 800px;
	background-image: url('../Imagens/Geral/Fundo-principal.png');
	background-repeat: no-repeat;
	background-position: top left;
	/*background-color: green;*/
}

a {
	color: inherit;
	text-decoration: none;
	border: none;
}

/* Aviso */
#avisoTopo {
    position: relative;
    left: 0%;
    right: 0%;
    margin: 0% auto;
    text-align: center;
}

#imgAvisoTopoDesktop {
    width: 100%;
    max-width: 900px;
}

/* Header */

header {
	position: relative;
	top: 4%;
	left: 0%;
	right: 0%;
	margin: auto;
	width: 100%;
	min-width: 960px;
	/*background-color: #979797;*/
}

#img_logo {
	position: relative;
	display: inline-block;
	margin: 0px 0px 0px 10%;
	padding: 0px;
	width: 16%;
	font-size: 0px;
	border: none;
}

nav {
	position: relative;
	display: inline-block;
	vertical-align: top;
	margin: 2.5% 10% 0px 4%;
	padding: 0px;
	width: 59%; /*60%*/
	font-size: 0px;
	
	/*background-color: brown;*/
}

ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
	font-size: 0px;
}

li{
	display: inline-block;
	padding: 0% 1%;
	color: #5198e2;
	font-size: 0.9rem;
	
	/*background-color: white;*/
}

#liResultados {
	margin-left: 5%;
	padding: 1% 3.5%;
	border-radius: 6px;
	background-color: #4cbdc4;
}

#aResultados {
	position: relative;
	margin: 0px;
	text-decoration: none;
	color: #ffffff;
}

/* Banner principal */

#articleBannerPrincipal, #articleBannersSecundarios {
	position: relative;
	top: 7%;
	left: 0%;
	right: 0%;
	margin: auto;
	width: 100%;
	max-width: 900px;
	font-size: 0px;
	-moz-box-shadow: 3px 3px 20px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 3px 3px 20px 0px rgba(0,0,0,0.2);
	-o-box-shadow: 3px 3px 20px 0px rgba(0,0,0,0.2);
	-ms-box-shadow: 3px 3px 20px 0px rgba(0,0,0,0.1);
	box-shadow: 3px 3px 20px 0px rgba(0,0,0,0.2);
	/*background-color: gray;*/
}

#imgBannerPrincipalDesk, .imgBannerSecundarioDesk {
	position: relative;
	width: 100%;
	max-width: 900px;
}

.imgBannerSecundarioDesk {
    margin: 3% 0% 0% 0%;
}

/* Botões do carrossel */

#articleBotoesCarrossel {
    position: relative;
    top: 9%;
    left: 0%;
    right: 0%;
    margin: auto auto 2% auto;
    width: 100%;
    max-width: 900px;
    text-align: center;
}

.spanBotoesCarrossel {
    position: relative;
    display: inline-block;
    padding: 0.8% 0%;
    border-radius: 5px;
    width: 49%;color: #5198e2;
}

#botaoCarrossel1 {
    margin: 0% 0.5% 0% 0%;
    background-color: #5198e2;
    color: #ffffff;
}

#botaoCarrossel2 {
    margin: 0% 0% 0% 0.5%;
    background-color: #ffffff;
}

/* Unidades */

.divsQuebrasUnidades {
    display: inline;
}

#articleUnidades {
	position: relative;
	top: 10%;
	width: 100%;
	text-align: center;
}

.sectionsUnidades {
	position: relative;
	display: inline-block;
	margin: 0px;
	width: 17%;
	text-align: center;
	border: 5px solid rgba(76, 189, 196, 0);
	font-size: 0px;
}

.sectionsUnidades:hover {
	border: 5px solid rgba(76, 189, 196, 1);
}

.imgsFachadas {
	margin-top: 5%;
	width: 90%;
	font-size: 0px;
}

.spansUnidades, .spansComoChegar, .spansMaisInformacoes {
	display: block;
}

.spansUnidades {
	margin-top: 2.5%;
	padding-top: 0%;
	font-size: 1.5rem;
}

.spansComoChegar {
	margin: 2.5% 5% 5% 5%;
	padding: 3% 0%;
	width: 90%;
	font-size: 1rem;
	color: #ffffff;
	border-radius: 6px;
	background-color: #4cbdc4;
}

.spansMaisInformacoes {
	margin: 7.5% 5% 5% 5%;
	padding: 3% 0%;
	width: 90%;
	font-size: 1rem;
	color: #5198e2;
	border-radius: 6px;
	background-color: #ffffff;
}

/* Serviços e redes sociais */

#articleServicosRedesSociais {
	position: relative;
	top: 13%;
	left: 0%;
	right: 0%;
	margin: auto;
	width: 100%;
	max-width: 900px;
	text-align: center;
}

#sectionServicos {
	display: inline-block;
	margin-right: 1.5%;
	width: 48%;
	max-width: 440px;
}

#sectionRedesSociais {
	display: inline-block;
	margin-left: 1.5%;
	width: 48%;
	max-width: 440px;
}

#imgServicos, #imgRedesSociais {
	width: 100%;
	display: block;
}

#spanServicos, #spanRedesSociais {
	display: block;
	margin-top: 2.5%;
	font-size: 1.5rem;
}

#video1, #source1 {
    display: block;
    width: 100%;
    max-height: 220px;
}

.saibaMais {
	display: block;
	margin: 2.5% auto 0% auto;
	padding: 1.5% 0%;
	width: 35%;
	font-size: 1rem;
	color: #ffffff;
	border-radius: 6px;
	background-color: #4cbdc4;
}

#articleConteudoExtraUnico {
    position: relative;
    top: 14%;
    left: 0%;
    right: 0%;
    margin: 4% auto 0% auto;
    width: 100%;
    max-width: 900px;
    text-align: center;
}

#sectionConteudoExtraUnico {
    width: 100%;
}

#video2, #source2 {
    display: block;
    width: 100%;
    max-height: 352px;
}

/* Footer */

footer {
	position: relative;
	top: 19%;
	padding: 5% 0%;
	width: 100%;
	background-color: #ffffff;
}

#divPaginasFooter {
	position: relative;
	margin: 0% auto;
	left: 0%;
	right: 0%;
	column-count: 2;
	width: 40%;
	font-size: 0.9rem;
	text-align: left;
	/*background-color: gray;*/
	
}

#divRedesSociaisFooter {
	width: 100%;
	padding: 5% 0% 0% 0%;
	text-align: center;
	font-size: 0px;
}

.imgsRedesSociais {
	margin: 0px;
	padding: 0px;
	font-size: 0px;
}

#spanCopyright {
	display: block;
	padding: 5% 0% 0% 0%;
	width: 100%;
	text-align: center;
}



/* Mobile */

@media (max-device-width: 750px), (max-width: 750px) {

    /* Unidades */
    .divsQuebrasUnidades {
        display: block;
    }
    
    .sectionsUnidades {
        width: 40%;
    }
    
    #divQuebraUnidade1 {
        
    }
    
    #divQuebraUnidade2, #divQuebraUnidade3 {
        margin-top: 3%;
    }
    
    /* Serviços e redes sociais */
    #sectionServicos {
        display: block;
        position: relative;
        left: 0%;
        right: 0%;
        margin:  6% auto 0% auto;
        width: 100%;
        max-width: none;
    }
    
    #sectionRedesSociais {
        display: block;
        position: relative;
        left: 0%;
        right: 0%;
        margin: 10% auto 0% auto;
        width: 100%;
        max-width: none;
    }
    
    #imgServicos {
        width: 100%;
    }
    
    #imgRedesSociais {
        width: 100%;
    }
    
    #articleConteudoExtraUnico {
        top: 7.5%;
    }
    
}

@media (max-device-width: 500px), (max-width: 500px) {
    
    #tudo {
        background-image: url('../Imagens/Geral/Fundo-principal-mobile.png');
        background-size: cover;
        min-width: none;
        max-width: none;
    }

    /* Imagens desk e mobile  */
    .imgDesktop {
        display: none;
    }
    
    .imgMobile {
        display: block;
    }
    
    /* Aviso */
    
    #imgAvisoTopoMobile {
        width: 100%;
    }
    
    /* Header */
    header {
        min-width: inherit;
        top: 0%;
    }
    
    /* Ícone do menu mobile */
    #iconeMenuMobile {
        float: left;
        width: 10%;
        margin:12% 0% 0% 5%;
    }
    
    /* Menu mobile */
    #menuMobile {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 1;
        width: 100%;
        color:#ffffff;
        background-color: rgba(81,152,226,0.9);
    }
    
    /* Ícone fechar menu mobile */
    #iconeFecharMenu {
        width: 6%;
        margin: 12% 0% 0% 8%;
    }
    
    .opcoesMenuMobile {
        margin: 3% 0% 0% 8%;
    }
    
    #aResultadosDeExamesMobile {
        margin-bottom: 12%;
        padding: 2%;
        width: 50%;
        border-radius: 10px;
        text-align: center;
        background-color: #4cbdc4;
    }
    
    /* Logo */
    #img_logo {
        margin: 6% 0% 5% 20%;
        width: 40%;
        max-width: none;
    }
    
    /* Menu desktop */
    nav {
        display: none;
    }
    
    /* Banner principal mobile */
    #articleBannerPrincipal, #articleBannersSecundarios {
        top: 0%;
        max-width: none;
    }
    
    #imgBannerPrincipalMobile, .imgBannerSecundarioMobile {
        width: 100%;
        max-width: none;
    }
    
    .imgBannerSecundarioMobile {
        margin: 6% 0% 0% 0%;
    }
    
    /* Botões */
    
    #articleBotoesCarrossel {
        top: 2%;
    }
    
    .spanBotoesCarrossel {
        padding: 2% 0%;
    }
    
    /* Unidades */
    #articleUnidades {
        top: 4%;
    }
    
    /* Serviços e redes sociais */
    #articleServicosRedesSociais {
        top: 4%;
    }
    
}


@media (max-device-width: 500px) {
    
    /* Resultados de exames */
    #articleResultados {
        padding: 3% 0% 15% 0%;
    }
    
    #iconeFecharResultados {
        margin: 6% 0% 0% 6%;
        width: 6%;
        max-width: none;
}
    
    #email, #senha, #doc_user, #senha_user {
        font-size: 2.5rem;
        width: 70%;
    }
    
    #button4 {
        font-size: 2.5rem;
        width: 74%;
    }
    
    .spansEsqueci {
        font-size: 2.5rem;
    }
    
    .h2Resultados {
        font-size: 3.5rem;
    }
    
    #formPaciente, #formDentista {
        margin-top: 9%;
    }
    
    /* Menu mobile */
    .opcoesMenuMobile {
        font-size: 2.5rem;
    }
    
    /* Unidades */
    #articleUnidades {
        top: 8%;
    }
    
    .spansUnidades, #spanServicos, #spanRedesSociais {
        font-size: 3.5rem;
    }
    
    .spansComoChegar, .spansMaisInformacoes, .saibaMais {
        font-size: 2.5rem;
    }
    
    /* Serviços e redes sociais */
    #articleServicosRedesSociais {
        top: 8%;
    }
    
    #articleConteudoExtraUnico {
        top: 14%;
        max-width: none;
    }
    
    #video1, #source1, #video2, #source2 {
        max-height: none;
    }
    
    /* Footer */
    #divPaginasFooter {
        font-size: 2.5rem;
        width: 90%;
    }
    
    .imgsRedesSociais {
        width: 6%;
    }
    
}