* {
padding:0;
margin:0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
input[type=date]::-webkit-inner-spin-button,
input[type=date]::-webkit-calendar-picker-indicator
{
display: inline-block;
}
body {background:#FEFEFE;
}
.menu_bar {
display:none;
}
.color{
color:#ff0000;
}
.mappe{
font-weight: bold;
font-size: 20px;
}
.pquienessomos{
text-align: justify;
text-indent: 50px;
}
.pvision{
text-align: justify;
text-indent: 50px;
}
.galeriafix{
position: fixed;
}
#contenedor{
background: #ccc;
height: 1.8rem auto;
text-align: justify;
text-indent: 30px;
font-weight: bold;
color:#011826;
float:center;
}
#leer_mas{
list-style: none;
background: #ccc;
width:100%;
display: table-cell;
float:center;
text-indent: 30px;
text-align: justify;
margin: 0;
padding: 01rem;
position: absolute;
vertical-align: middle;
}
a
{
text-decoration: none;
}
#contenido
{
border-radius: .2em;
margin: 0 auto;
max-width: 95%;
text-align: center;
}
#oculto
{
/* Con esta instruccion hacemos q el texto a mostrar este oculto de manera predeterminada al ingresar a la pagina por primera ves*/
display: none;
background: #abb88e;
color:#023859;
}
.arreglar{
width: 600px;
height: 380px;
padding: 5px;
border-radius: 50px;
webkitshapeinside: rectangle(0,0,100%,100%,50px,50px);
fontsize: 0.8em;
float: right;
font-weight: bolder;
text-align: justify;
}
.arreglar1{
width: 600px;
height: 380px;
padding: 5px;
border-radius: 50px;
webkitshapeinside: rectangle(0,0,100%,100%,50px,50px);
fontsize: 0.8em;
float: right;
font-weight: bolder;
text-align: justify;
}
#oculto1
{
display: none;
background: #abb88e;
color:#023859;
}
section
{
border-radius: .2em;
margin: 0 auto;
max-width: 95%;
text-align: center;
}
header {
width:100%;
height: 100%;
/* padding-top: 0%;
padding-left: 0%;
padding-right: 20%;*/
}
header nav {
background:#023859;
height: 60px;
}
/*.sheader{
height: 50px;
}*/
}
header nav h1 {
color: #ff0000;
}
header nav ul {
list-style:none;
}
header nav ul li {
display:inline-block;
position: relative;
}
header nav ul li:hover {
background:#ff0000;
}
/*proceso que permite incluir otra opcion en el navegador*/
header nav ul li a {
color:#fff;
display:block;
text-decoration:none;
padding: 20px;
}
/**/
header nav ul li a span {
margin-right:15px;
color: white;
}
header nav ul li:hover .children {
display:block;
}
header nav ul li .children {
display: none;
background:#011826;
position: absolute;
width: 150%;
z-index:1000;
}
header nav ul li .children li {
display:block;
overflow: hidden;
border-bottom: 1px solid rgba(255,255,255,.5);
}
header nav ul li .children li a {
display: block;
}
header nav ul li .children li a span {
float: right;
position: relative;
top:3px;
margin-right:0;
margin-left:10px;
}
header nav ul li .caret {
position: relative;
top:3px;
margin-left:10px;
margin-right:0px;
padding-bottom: 30px;
}
form {
margin: 1em auto;
text-align: center;
}
span{
color: #F60;
font-size: 1.5 em;
}
section{
text-align: justify;
text-indent: 50px;
float:left;
}
footer {
color:#023859;
width:50%;
text-align: center;
}
/* footer{ width:100px; height:100px; text-align:center}
*/
@media screen and (max-width: 800px) {
body {
padding-top:80px;
}
.menu_bar {
display:block;
height: 5%;
width:100%;
position: fixed;
top:0;
background:#3837E6; /*se diseñó con el color rojo#E6344A;*/
}
.menu_bar .bt-menu {
display: block;
padding: 50px;
color: #fff;
overflow: hidden;
font-size: 20px;
font-weight: bold;
text-decoration: none;
max-width: 100px;
overflow: scroll;
}
.menu_bar span {
float: right;
font-size: 80px;
}
header nav {
width: 80%;
height: calc(100% - 80px);
position: fixed;
right:100%;
margin: 0;
overflow: scroll;
/* transition: 0.1s;
*/ }
header nav ul li {
display: block;
border-bottom:1px;
solid rgba(255,255,255,.5);
}
header nav ul li a {
display: block;
}
header nav ul li:hover .children {
display: none;
border-radius: 1px;
}
header nav ul li .children {
width: 100%;
position: relative;
}
header nav ul li .children li a {
margin-left:20px;
border-right-width: 2px;
}
header nav ul li .caret {
float: right;
}
}