@charset "utf-8";

@font-face { font-family: "Roboto"; src: url("roboto_r.woff2") format("woff2"); font-style: normal; font-weight: 400; }
@font-face { font-family: "Roboto"; src: url("roboto_rb.woff2") format("woff2"); font-style: normal; font-weight: 700; }
@font-face { font-family: "Roboto"; src: url("roboto_ri.woff2") format("woff2"); font-style: italic; font-weight: 400; }
@font-face { font-family: "Roboto"; src: url("roboto_rib.woff2") format("woff2"); font-style: italic; font-weight: 700; }

@font-face { font-family: "RobotoCondensed"; src: url("roboto_c.woff2") format("woff2"); font-style: normal; font-weight: 400; }
@font-face { font-family: "RobotoCondensed"; src: url("roboto_cb.woff2") format("woff2"); font-style: normal; font-weight: 700; }
@font-face { font-family: "RobotoCondensed"; src: url("roboto_ci.woff2") format("woff2"); font-style: italic; font-weight: 400; }
@font-face { font-family: "RobotoCondensed"; src: url("roboto_cib.woff2") format("woff2"); font-style: italic; font-weight: 700; }

:root {
--limitador: 320px;
--cor-azul-logo: #248;
}

*, *::before, *::after  { margin: 0; border: 0; padding: 0; outline: 0; box-sizing: border-box; }

html { font: 18px "Roboto",sans-serif; color: #333; }

body { min-width: 320px; background-color: #EEE; }
body { background: url("../img/bg_marca.webp") no-repeat center -100px, url("../img/bg.png") repeat center top; }

img { vertical-align: middle; }

h1 { display: none; }

a { text-decoration: none; color: #039; }
a:hover { color: #37C; }

header { position: relative; overflow: hidden; box-shadow: 0 8px 21px #0004; }

main { position: relative; overflow: hidden; min-height: 100px; }

footer { position: relative; overflow: hidden; margin-top: 10px; }
footer { background: linear-gradient(115deg, 
#06B 40%, 
#FFF 40.1%, #FFF 40.7%, 
#17C 40.8%, #17C 42%, 
#FFF 42.1%, #FFF 42.9%, 
#28D 43%, #28D 44.3%, 
#FFF 44.4%, #FFF 45.2%, 
#39E 45.3%, #39E 45.9%, 
#FFF 46%); }

#backdrop { z-index: 21000; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; }
#backdrop { overflow: hidden; display: none; justify-content: center; align-items: center; }
#backdrop { backdrop-filter: blur(0px); transition: backdrop-filter 0.5s ease; }

#minitela { z-index: 1000; display: block; position: fixed; bottom: 0; left: 0; width: 100%; }
#minitela { padding: 20px 10px; text-align: center; background: #900; color: #FFF; }

#top_bar { width: 100%; box-shadow: 0 2px 12px #0008; background: var(--cor-azul-logo); }

#top_bar_icos { text-align: center; font-size: 0; }

#top_bar_icos img { display: inline-block; width: 28px; margin: 6px; border-radius: 50%; background: #FFF0; }
#top_bar_icos img { filter: grayscale(100%) brightness(900%); transition: background-color 0.3s ease, filter 0.3s ease; }

#top_bar_icos a:hover img, #top_bar_icos a:focus img { background: #FFFF; filter: grayscale(0%) brightness(100%); }

#top_bar_icos span { display: none; margin-right: 21px; vertical-align: middle; font-size: 0.8rem; color: #FFF; }

#top_box { display: block; width: var(--limitador); max-width: 1111px; margin: 0 auto; }

#logo_ori { display: flex; justify-content: center; align-items: center; width: 100%; }

#logo { position: relative; display: block; width: 200px; margin: 33px auto; }

#logo::before { content: ""; position: absolute; z-index: -5; top: -45%; left: -35%; width: 180%; height: 180%; }
#logo::before { background-image: url("../img/logo_rabisco.webp"); background-size: cover; }
#logo::before { opacity: 0; transform: scale(0.9); transition: opacity 0.4s ease, transform 0.4s ease; }

#logo:hover::before, #logo:focus-within::before  { opacity: 1; transform: scale(1); }

#logo img { display: block; width: 100%; filter: drop-shadow(0px 0px 4px #0008); transition: filter 0.3s ease; }

#logo:hover img, #logo:focus-within img { filter: 
drop-shadow(1.4px 1.4px 0.4px #FFF)
drop-shadow(1.4px -1.4px 0.4px #FFF)
drop-shadow(-1.4px 1.4px 0.4px #FFF)
drop-shadow(-1.4px -1.4px 0.4px #FFF); }

#login_ori { display: flex; justify-content: center; align-items: center; width: 100%; }

#login { display: none; position: relative; }

#login_box { display: block; overflow: hidden; width: 270px; min-height: 210px; border: 1px solid var(--cor-azul-logo); }
#login_box { border-radius: 10px; box-shadow: 0 0 21px #0009; background: #FFF; text-align: center; }

#login_box h6 { padding: 5px; background: var(--cor-azul-logo); font-size: 0.9rem; font-weight: bold; color: #FFF; }

#login_form fieldset { overflow: hidden; width: 85%; margin: 10px auto; border: 1px solid var(--cor-azul-logo); border-radius: 8px; }
#login_form fieldset { --ico_u: none; --ico_x: 18px; --ico_w: 18px; --bg_x: 0%;
background-image: var(--ico_u), linear-gradient(115deg, 
#FFF 67%, var(--cor-azul-logo) 67.5%,
var(--cor-azul-logo) 68%, #FFF 68.5%,
#FFF 69%, var(--cor-azul-logo) 69.5%);
background-repeat: no-repeat;
background-position: right var(--ico_x) center, var(--bg_x) center;
background-size: var(--ico_w), 110% 100%;
}
#login_form fieldset { transition: background-position 0.3s ease, background-size 0.3s ease; }

#login_form fieldset:nth-child(1) { --ico_u: url("../img/login_m.png"); }
#login_form fieldset:nth-child(2) { --ico_u: url("../img/login_s.png"); }

#login_form fieldset:focus-within { --bg_x: 100%; --ico_x: 26px; --ico_w: 20px; }

#login_form fieldset legend { margin-left: 12px; padding: 0 5px; text-align: left; font-size: 0.8rem; color: var(--cor-azul-logo); }

#login_form fieldset input { width: 90%; margin-bottom: 8px; background: transparent; font-size: 0.9rem; color: #777; }

#login_form button { cursor: pointer; padding: 10px 20px; border-radius: 10px; box-shadow: inset 0 -20px 10px #0007; }
#login_form button { background: var(--cor-azul-logo); font-weight: bold; font-size: 0.8rem; color: #FFF; }
#login_form button { transition: box-shadow 0.3s ease, background-color 0.3s ease; }

#login_form button:hover, #login_form button:focus { box-shadow: inset 0 -10px 10px #0005; background: #37B; }

#login_form button i { display: inline-block; width: 15px; height: 15px; margin-right: 5px; border-radius: 50%; }
#login_form button i { background: #FFF; text-align: center; color: var(--cor-azul-logo); }

#menu_bar { position: relative; overflow: hidden; width: 100%; height: 40px; box-shadow: 0 0 10px #0004; }
#menu_bar { background: linear-gradient(to bottom, #4AF, #159); }

#menu { display: none; position: relative; }

#menu ul { padding: 8px 0; border: 1px solid var(--cor-azul-logo); border-radius: 10px; list-style: none; }
#menu ul { box-shadow: 0 0 21px #0009; background: #FFF; font-size: 0; }

#menu ul li { border-bottom: 1px solid #FFF; font-size: 1rem; }

#menu ul li:first-child { border-top: 1px solid #FFF; }

#menu ul li a { display: block; width: 280px; padding: 8px 16px; background: #EEE; }
#menu ul li a { transition: background-color 0.21s ease-out, color 0.21s ease-out; }

#menu ul li a:hover { background: var(--cor-azul-logo); color: #FFF; }

#menu ul li span { display: block; width: 280px; padding: 8px 8px 8px 24px; background: var(--cor-azul-logo); color: #FFF; }

.x320 { display: block; position: absolute; top: -10px; right: -10px; }

.x320 a { display: flex; justify-content: center; align-items: center; width: 26px; height: 26px; }
.x320 a { border: 2px solid #FFF; border-radius: 50%; box-shadow: 0 0 10px #000C; }
.x320 a { background: #900; font-weight: bold; font-size: 1.3rem; color: #FFF; }
.x320 a { transition: background-color 0.21s ease-out;  }

.x320 a:hover { background: #F00; }

#menu_320 { top: 0; left: 3%; }

#login_320 { top: 0; right: 3%; }

.s320 { display: block; position: absolute; border-left: 1px solid #37B; border-right: 1px solid #37B; }
.s320 { background-image: linear-gradient(to bottom, #1151, #1152 50%, #1158 50%, #115F); }
.s320 { background-size: 100% 200%; background-position: 0% 0%; }
.s320 { transform: skewX(-25deg); transition: background-position 0.2s ease-out; }

.s320:hover { background-position: 0% 100%; }

.s320 a { display: flex; align-items: center; padding: 3px 10px 4px 10px; text-align: center; }
.s320 a { text-shadow: 1px 1px 0 #115; font-family: "RobotoCondensed"; font-size: 1rem; color: #FFF; }
.s320 a { transform: skewX(25deg); }

.s320 a span { display: inline-block; width: 80px; padding: 0 8px; }

.s320 a img { display: inline-block; width: 33px; border: 1px solid #37B; border-radius: 50%; transition: border 0.2s ease-out; }

.s320:hover a img { border: 1px solid #FFF9; }

.limpa { display: block; clear: both; font-size: 0; }



#home_destaque { width: 100%; height: 400px; background: linear-gradient(to bottom, #017 21%, #039 100%); }





#tit_geral { display: block; overflow: hidden; background-color: #028; background-size: cover; background-position: center center; }

#tit_geral h2 { margin: 50px 0 40px 0; text-shadow: 1px 1px 2px #000; text-align: center; font-size: 1.6rem; color: #FFF; }

#tit_geral div { display: flex; justify-content: center; align-items: center; height: 40px; }
#tit_geral div { background: linear-gradient(to bottom, transparent 50%, #FFF 50%); }

#tit_geral div span { flex-shrink: 0; display: inline-block; height: 40px; transform: skewX(-25deg); }

#tit_geral div span:nth-child(1) { width: 70%; background: linear-gradient(to bottom, transparent 50%, var(--cor-azul-logo) 50%); }
#tit_geral div span:nth-child(2) { width: 40%; background: linear-gradient(to bottom, #06DC 50%, #FFF 50%); }




#cont_geral { position: relative; overflow: hidden; background: linear-gradient(115deg, #FFF 75%, transparent 75.1%); }



.cont_txt { padding: 21px 5%; padding-left: clamp(15px, 5%, 30px); padding-right: clamp(15px, 5%, 30px); }
.cont_txt { line-height: 1.5rem; text-align: justify; text-align-last: left; }
.cont_txt { hyphens: auto; hyphenate-limit-chars: 8 4 4; font-size: 0.9rem; color: #555; }


.cont_bar_foto { display: block; overflow: hidden; margin: 10px 0; }
.cont_bar_foto { background: linear-gradient(115deg, #FFF 33%, #028 33.1%); }

.cont_bar_foto img { display: block; width: 90%; max-width: 600px; margin: 20px auto; }
.cont_bar_foto img { border: 5px solid #37B; border-radius: 21px; }


.cont_end_gal { display: grid; max-width: var(--limitador); margin: 0 auto 21px auto; padding: 21px 10px; }
.cont_end_gal { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; flex-wrap: wrap; }

.cont_end_gal img { display: block; width: 90%; margin: 10px auto; border: 5px solid #06D; border-radius: 33% 5%; box-shadow: 5px 8px 0 #039; }


#cont_barra_end { display: flex; justify-content: center; align-items: center; height: 20px; }
#cont_barra_end { background: linear-gradient(to bottom, #FFF 50%, transparent 50%); }

#cont_barra_end span { flex-shrink: 0; display: inline-block; height: 20px; transform: skewX(-25deg); }

#cont_barra_end span:nth-child(1) { width: 70%; background: linear-gradient(to bottom, transparent 50%, var(--cor-azul-logo) 50%); }
#cont_barra_end span:nth-child(2) { width: 40%; background: linear-gradient(to bottom, #06D 50%, transparent 50%); }


#historico_destaque { background-image: linear-gradient(115deg, 
transparent 10%, #028 10.1%, #028 10.4%, transparent 10.5%, transparent 10.9%, #028 11%);
background-repeat: no-repeat; background-size: 100% 80%; background-position: 0 70%; }

#historico_destaque p { width: 90%; margin: 20px auto; padding: 30px 15%; }
#historico_destaque p { background: linear-gradient(115deg, transparent 15%, #06D 15.1%, #06D 85%, transparent 85.1%); }
#historico_destaque p { text-align: center; text-wrap: balance; text-shadow: 2px 2px 0 #039; font-weight: bold; color: #FFF; }



#historico_mis_val { display: flex; flex-direction: column; width: var(--limitador); margin: 0 auto; }

.historico_mis_val { position: relative; flex: 1; margin: 100px 5px 20px 5px; border: 1px solid #028; }
.historico_mis_val { border-radius: 21px; padding: 40px 5% 5% 5%; background: linear-gradient(115deg, #FFF 70%,#F1F3F9 100%); }

.historico_mis_val::after { content: ""; position: absolute; top: -5px; right: -1px; bottom: -5px; left: -1px; }
.historico_mis_val::after { border-top: 2px solid #06D; border-bottom: 2px solid #06D; border-radius: 21px; }

.historico_mis_val span { display: flex; overflow: hidden; position: absolute; z-index: 2; width: 140px; height: 110px; top: -88px; left: 50%; }
.historico_mis_val span { flex-direction: column; justify-content: center; align-items: center; box-shadow: inset 0 0 21px #06D; }
.historico_mis_val span { transform: translateX(-50%); border: 1px solid #028; border-radius: 50% 10px; }
.historico_mis_val span { background: linear-gradient(135deg, #FFF 5%, #DDD 55%, #F9F3F1 100%); }

.historico_mis_val:nth-child(2) span { border-radius: 10px 50%; }

.historico_mis_val span img { display: block; margin: 0 auto; filter: 
drop-shadow(2px 2px 0 #FFF) drop-shadow(-2px -2px 0 #FFF) 
drop-shadow(-2px 2px 0 #FFF) drop-shadow(2px -2px 0 #FFF); }

.historico_mis_val span b { display: block; margin: -6px auto 0 auto; color: #028; }
.historico_mis_val span b { text-shadow: 2px 2px 0 #FFF, -2px -2px 0 #FFF, -2px 2px 0 #FFF, 2px -2px 0 #FFF; }

.historico_mis_val p { line-height: 1.5rem; text-align: justify; text-align-last: left; hyphens: auto; hyphenate-limit-chars: 8 4 4; font-size: 0.9rem; }

.historico_mis_val p img { display: block; width: 250px; margin: 10px auto 0 auto; }

.historico_mis_val ul { margin: 10px 0; list-style: none; }

.historico_mis_val ul li { display: flex; align-items: center; gap: 10px; padding: 10px 0; font-style: italic; font-size: 0.9rem; }

.historico_mis_val ul li:nth-child(odd) { color: #028; }
.historico_mis_val ul li:nth-child(even) { color: #06D; }

.historico_mis_val ul li::before { content: "\2726"; line-height: 0; font-size: 1.2rem; }

.historico_mis_val ul li::before:nth-child(odd) { color: #028; }
.historico_mis_val ul li::before:nth-child(even) { color: #06D; }


#historico_ponto { display: block; width: 100%; margin: 21px auto 70px auto; padding: 40px 0; text-align: center; }
#historico_ponto { background: transparent url("../img/historico_ponto.webp") no-repeat center / auto 100%; }

#historico_ponto i { display: inline-block; margin: 0 10px 10px 0; text-shadow: 2px 2px 3px #000; font-family: "RobotoCondensed"; }
#historico_ponto i { font-weight: bold; font-size: 1.4rem; color: #FFF; transform: rotate(-7deg) skewX(-10deg); }



#ensino_medio_etapa { display: block; padding: 21px 12px; border-radius: 21px; background: #EEE; }

#ensino_medio_etapa img { display: block; margin: 0 auto 10px auto; border-radius: 21px; }



.projetos_tit { overflow: hidden; width: 100%; margin: 10px 0; background: 
linear-gradient(to bottom, transparent 70%, #FFF 80.1%, #FFF 83%, transparent 83.1%), 
linear-gradient(115deg, transparent 21%, #06D 21.1%); }

.projetos_tit p { width: var(--limitador); margin: 12px auto 21px auto; padding-right: 5%; }
.projetos_tit p { text-align: right; font-weight: bold; font-size: 1.1rem; color: #FFF; }


#estrutura_galeria { display: grid; max-width: var(--limitador); margin: 0 auto; padding: 21px 10px; }
#estrutura_galeria { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 10px; }

#estrutura_galeria figure { display: block; position: relative; overflow: hidden; }
#estrutura_galeria figure { background: linear-gradient(115deg, transparent 20%, #039 20.1%, #039 92%, transparent 92.1%); }

#estrutura_galeria figure img { display: block; width: 96%; margin: 10px auto; border: 5px solid #06D; border-radius: 12px; }

#estrutura_galeria figure figcaption { display: block; position: absolute; z-index: 21; width: 260px; bottom: 0; padding: 7px 30px; }
#estrutura_galeria figure figcaption { text-align: center; font-weight: bold; font-size: 0.9rem; color: #FFF; }
#estrutura_galeria figure figcaption { background: linear-gradient(115deg, transparent 8%, #06D 8.1%, #06D 92%, transparent 92.1%); }







#box_404 { display: block; width: 90%; max-width: 500px; margin: 75px auto; text-align: center; text-wrap: balance; }
#box_404 img { display: block; width: 90%; max-width: 400px; margin: 0 auto; }
#box_404 b { font-size: 1.5rem; color: #06D;}


#rodape { margin: 35px 0 15px 0; }

#rodape address { display: flex; align-items: center; justify-content: space-evenly; flex-direction: column; }
#rodape address { width: var(--limitador); max-width: 1300px; margin: 0 auto; }

#end_mapa { display: block; overflow: hidden; width: 99%; border: 1px solid #CCC; border-radius: 10px 10px 0 0; }
#end_mapa { transition: border-color 0.3s ease; }
#end_mapa:has(a:hover) { border-color: #248; }
#end_mapa:has(a:hover) + #end_endereco { border-color: #248; }

#end_mapa a { display: flex; align-items: center; justify-content: center;  }
#end_mapa a { width: 100%; height: 280px; background-image: url("../img/mapa.jpg"); background-size: cover; }

#end_mapa a span { display: flex; align-items: center; justify-content: center; flex-direction: column; }
#end_mapa a span { width: 100%; height: 100%; background: radial-gradient(circle, #FFFF 21%, #2486 100%); }
#end_mapa a span { opacity: 0; transition: opacity 0.4s ease; }

#end_mapa a:hover span { opacity: 1; }

#end_mapa a span img { display: block; width: 40px; margin-right: -15px; }

#end_mapa a span b { display: block; margin-top: 10px; font-style: normal; color: #12345D; }

#end_endereco { display: block; overflow: hidden; width: 99%; border: 1px solid #CCC; border-top: 0; border-radius: 0 0 10px 10px; }
#end_endereco { padding: 20px 0; text-align: center; font-family: "RobotoCondensed"; font-style: normal; font-size: 0.85rem; }
#end_endereco { background: #FFF; transition: border-color 0.3s ease; }

#end_redes { display: block; margin-top: 20px; }

#end_redes a { display: inline-block; overflow: hidden; width: 40px; height: 40px; margin: 0 3px; }
#end_redes a { border-radius: 50%; background: #2480; transition: background-color 0.4s ease; }
#end_redes a:hover { background: #248F; }

#end_redes a img { width: 100%; filter: grayscale(0%) brightness(100%); transition: filter 0.3s ease; }
#end_redes a:hover img { filter: grayscale(100%) brightness(900%); }

#end_menu { overflow: hidden; width: 100%; border-bottom: 15px solid #137; padding: 10px; }

#end_menu ul { list-style: none; text-align: center; font-size: 0; }

#end_menu ul li { display: block; width: 250px; margin: 5px auto; font-size: 0.8rem; }

#end_menu ul li span { display: block; border-radius: 15px; padding: 8px; background: #137; color: #FFF; }

#end_menu ul li a { display: block; border-radius: 15px; padding: 8px; }
#end_menu ul li a { background-image: linear-gradient(to bottom, #F3F3F6, #E3E3E6 50%, #137 50%); }
#end_menu ul li a { text-shadow: 1px 1px 0 #BCD; color: #137 }
#end_menu ul li a { background-size: 100% 200%; background-position: 0% 0%; }
#end_menu ul li a { transition: background-position 0.2s ease-out, text-shadow 0.21s ease-out, color 0.21s ease-out; }

#end_menu ul li a:hover { background-position: 0% 100%; text-shadow: 1px 1px 0 #115; color: #FFF; }

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (320px) ------------- */
@media (min-width: 320px){

#minitela { display: none; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (480px) ------------- */
@media (min-width: 480px){

:root {
--limitador: 480px;
}


#menu_320 { left: 10%; }

#login_320 { right: 10%; }








#end_menu ul li { display: inline-block; width: 220px; margin: 5px; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (640px) ------------- */
@media (min-width: 640px){

:root {
--limitador: 640px;
}

#top_bar_icos a:nth-of-type(1) span { display: inline-block; }

#top_box { display: flex; justify-content: center; align-items: center; }

#logo_ori { width: 50%; float: left; }

#login_ori { width: 50%; float: left; }

#login { display: block; }




.cont_end_gal { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }






#menu { display: block; }

#menu ul { padding: 0; border: 0; border-radius: 0; box-shadow: none; text-align: center; background: transparent; }

#menu ul li { display: inline-block; border: 0; border-right: 1px solid #37B;  }
#menu ul li { background-image: linear-gradient(to bottom, #1151, #1152 50%, #1158 50%, #115F); }
#menu ul li { background-size: 100% 200%; background-position: 0% 0%; }
#menu ul li { text-shadow: 1px 1px 0 #115; font-family: "RobotoCondensed"; font-size: 0.8rem; }
#menu ul li { transform: skewX(-25deg); transition: background-position 0.2s ease-out; }

#menu ul li:first-child { border: 0; border-left: 1px solid #37B; border-right: 1px solid #37B; }

#menu ul li:hover { background-position: 0% 100%; }




#menu ul li:has(span) { background: #115; }

#menu ul li a { display: block; width: auto; padding: 12px; background: transparent; color: #FFF; }
#menu ul li a { transform: skewX(25deg); }

#menu ul li a:hover { background: transparent; }

#menu ul li span { display: block; width: auto; padding: 12px; background: transparent; color: #FFF; }
#menu ul li span { transform: skewX(25deg); }



.x320 { display: none; }



#menu_320 { display: none; }

#login_320 { display: none; }



#tit_geral h2 { margin: 70px 0 55px 0; font-size: 1.8rem; }





#historico_ponto { padding: 60px 0; }

#historico_ponto i { margin: 0 20px 10px 0; font-size: 2rem; }




#end_menu ul li { width: 190px; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (800px) ------------- */
@media (min-width: 800px){

:root {
--limitador: 800px;
}

#top_bar_icos a:nth-of-type(5) span { display: inline-block; }





.cont_end_gal { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }



#rodape address { justify-content: space-evenly; flex-direction: row; }

#end_mapa { width: 49%; border-radius: 10px; }

#end_endereco { width: 49%; border: none; background: transparent; font-size: 0.9rem; }

#end_redes a { margin: 0 4px; }



#end_menu ul li { width: 240px; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (960px) ------------- */
@media (min-width: 960px){

:root {
--limitador: 960px;
}





.cont_txt_box { float: left; width: 50%; }

.cont_txt { width: calc(var(--limitador)/2); margin: 10px 0 0 auto; }


.cont_bar_foto { float: right; width: 50%; }

.cont_bar_foto img { width: calc((var(--limitador)/2) - 30px); margin: 20px; border: 8px solid #37B; }


#historico_mis_val { flex-direction: row; }

.historico_mis_val p img { width: 280px; margin-top: 20px; }



#rodape { margin: 35px 0 25px 0; }




#end_menu { padding: 10px 0 0 0; }

#end_menu ul li { width: auto; margin: 0 2px; font-family: "RobotoCondensed"; }

#end_menu ul li span { border-radius: 10px 10px 0 0; }

#end_menu ul li a { border-radius: 10px 10px 0 0; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (1120px) ------------- */
@media (min-width: 1120px){

:root {
--limitador: 1120px;
}


#top_bar_icos a:nth-of-type(6) span { display: inline-block; }


#menu_bar { height: 53px; }

#menu ul li { font-size: 1rem; }

#menu ul li a { padding: 16px; }

#menu ul li span { padding: 16px; }





#tit_geral h2 { margin: 80px 0 70px 0; font-size: 2.1rem; }




.cont_txt { line-height: 1.65rem; font-size: 1rem; }


#historico_destaque p { max-width: var(--limitador); line-height: 1.5rem; font-size: 1.1rem; }


.historico_mis_val p { line-height: 1.65rem; font-size: 1rem; }

.historico_mis_val ul li { font-size: 1rem; }



#historico_ponto { padding: 69px 0; }

#historico_ponto i { margin: 0 20px 10px 0; font-size: 2.5rem; }





#rodape { margin: 35px 0 30px 0; }



#end_endereco { font-size: 1rem; }

#end_redes a { width: 45px; height: 45px; margin: 0 5px; }


#end_menu { border-bottom: 18px solid #137; }

#end_menu ul li { margin: 0 3px; font-size: 0.9rem; }

#end_menu ul li span { padding: 10px; }

#end_menu ul li a { padding: 10px; }

}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (1280px) ------------- */
@media (min-width: 1280px){

:root {
--limitador: 1280px;
}

#top_bar_icos img { width: 32px; margin: 8px; }

#top_bar_icos span { font-size: 0.88rem; }



#menu_bar { height: 55px; }

#menu ul li { font-size: 1.07rem; }



.cont_txt { margin: 10px 0 0 auto; line-height: 1.8rem; font-size: 1.05rem; }


#historico_destaque p { line-height: 1.6rem; font-size: 1.2rem; }


.historico_mis_val p { line-height: 1.8rem; font-size: 1.05rem; }

.historico_mis_val ul li { font-size: 1.05rem; }

.historico_mis_val p img { width: 300px; margin-top: 20px; }




#estrutura_galeria { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); }



#end_menu { border-bottom: 21px solid #137; }

#end_menu ul li { margin: 0 5px; font-size: 1rem; }

#end_menu ul li span { padding: 12px; }

#end_menu ul li a { padding: 12px; }


}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (1440px) ------------- */
@media (min-width: 1440px){
/*
:root {
--limitador: 1440px;
}
*/
}

/* ------------------------------------------------------------------------------------------------ MOBILE FIRST (1600px) ------------- */
@media (min-width: 1600px){
/*
:root {
--limitador: 1600px;
}
*/
}