@charset "utf-8";
/* ========================= PARA DESKTOPS (1400px ou mais) ========================= */
@media screen and (min-width:1401px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 18%; margin-left: 5%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; justify-items: flex-start; flex-direction: column; align-content: flex-start; padding-bottom: 10px;}
.link2{width: 80%; margin-left: 10%; text-decoration: none; background: #0645A1; color: #FFF; padding: 10px 0 10px 0; text-align: center; font-size: 18px; border-radius: 12px; margin-top: 10px; height: 22px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 58%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 40%;}
.video{width: 400px;}
.conteudo-direita-txt{width: 60%; font-size: 1.2em; padding-top: 10px;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;}
.link-mostrar{display: none;}
.link-ocultar{display: none;}
}
/* ========================= PARA DESKTOPS (1400px até 961px) ========================= */
@media screen and (max-width:1400px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 22%; margin-left: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; justify-items: flex-start; flex-direction: column; align-content: flex-start; padding-bottom: 10px;}
.link2{width: 90%; margin-left: 5%; text-decoration: none; background: #0645A1; color: #FFF; padding: 10px 0 10px 0; text-align: center; font-size: 18px; border-radius: 12px; margin-top: 10px; height: 22px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 58%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 40%;}
.video{width: 100%;}
.conteudo-direita-txt{width: 55%; font-size: 1em; padding-top: 10px; flex-grow: 1; margin-left: 1%;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;}  
.link-mostrar{display: none;}
.link-ocultar{display: none;}
}
/* ========================= PARA TABLET EM PAISAGEM (960px até 769px) ========================= */
@media screen and (max-width:960px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 26%; margin-left: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; justify-items: flex-start; flex-direction: column; align-content: flex-start; padding-bottom: 10px;}
.link2{width: 90%; margin-left: 5%; text-decoration: none; background: #0645A1; color: #FFF; padding: 10px 0 10px 0; text-align: center; font-size: 16px; border-radius: 12px; margin-top: 10px; height: 20px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 48%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 100%; text-align: center;}
.video{width: 50%;}
.conteudo-direita-txt{width: 100%; font-size: 1.2em; padding-top: 10px; flex-grow: 1; margin-left: 1%;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;}     
.link-mostrar{display: none;}
.link-ocultar{display: none;}
}
/* ========================= PARA TABLET EM RETRATO (768px até 481px) ========================= */
@media screen and (max-width:768px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 100%; margin-left: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; justify-items: flex-start; flex-direction: row; align-content: flex-start; padding-bottom: 10px;display: none;}
.link2{width: 30%; margin-left: 1%; text-decoration: none; background: #0645A1; color: #FFF; padding: 5px 0 10px 0; text-align: center; font-size: 14px; border-radius: 12px; margin-top: 5px; height: 10px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 48%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 100%; text-align: center;}
.video{width: 70%; margin-top: 10px;}
.conteudo-direita-txt{width: 100%; font-size: 1.2em; padding-top: 10px; flex-grow: 1; margin-left: 1%;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;} 
.link-mostrar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: flex;}
.link-mostrar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.link-ocultar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: none;}
.link-ocultar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu-nav{width: 100%;}
}
/* ========================= PARA SMARTPHONES EM PAISAGEM (480px até 321) ========================= */
@media screen and (max-width:480px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 100%; margin-left: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; justify-items: flex-start; flex-direction: row; align-content: flex-start; padding-bottom: 10px;display: none;}
.link2{width: 44%; margin-left: 1%; text-decoration: none; background: #0645A1; color: #FFF; padding: 5px 0 10px 0; text-align: center; font-size: 14px; border-radius: 12px; margin-top: 5px; height: 10px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 48%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 100%; text-align: center;}
.video{width: 98%; margin-top: 10px;}
.conteudo-direita-txt{width: 100%; font-size: 1em; padding-top: 10px; flex-grow: 1; margin-left: 1%; text-align: center;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;} 
.link-mostrar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: flex;}
.link-mostrar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.link-ocultar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: none;}
.link-ocultar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu-nav{width: 100%;}    
}
/* ========================= PARA SMARTPHONES EM RETRATO (320px ou menos) ========================= */
@media screen and (max-width:320px){
.conteudo{align-items: flex-start;}
.conteudo-esquerda{width: 100%; margin-left: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; justify-items: flex-start; flex-direction: row; align-content: flex-start; padding-bottom: 10px;display: none;}
.link2{width: 44%; margin-left: 1%; text-decoration: none; background: #0645A1; color: #FFF; padding: 5px 0 10px 0; text-align: center; font-size: 14px; border-radius: 12px; margin-top: 5px; height: 10px;}
.link2:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu_0{width: 100%;}
.conteudo-direita{width: 48%; flex-grow: 1; margin-left: 1%; margin-right: 1%; background: #FFF; border-radius: 12px; display: flex; flex-wrap: wrap; }
.conteudo-direita-video{width: 100%; text-align: center;}
.video{width: 98%; margin-top: 10px;}
.conteudo-direita-txt{width: 100%; font-size: 1em; padding-top: 10px; flex-grow: 1; margin-left: 1%; text-align: center;}
.conteudo-texto3{width: 100%; margin-bottom: 10px; padding: 10px 0px 10px 0px;  border-radius: 12px; text-align: center; font-size: 1em; border-top: 2px solid #f4f4ff;} 
.link-mostrar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: flex;}
.link-mostrar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.link-ocultar{text-decoration: none; width: 80%;  margin-left: 10%; margin-bottom: 10px; text-align: center; padding: 10px 0px 10px 0px; background: #FFF; display: none;}
.link-ocultar:hover{color:#FFF; background-color: #070661; box-shadow:#999 2px 3px 6px 2px;}
.menu-nav{width: 100%;}       
}