body, header, section, footer, p, nav,div, h4, img, span{
  display: block;
  padding: 0px;
  margin: 0px;
  position:relative;
}

body{
  //min-height: 100%;
  max-width: 100%;
  position:relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;

}

h1, h2, h3, h4, h5, h6{
  color:rgb(75,75,75);
  font-family:  khmer ui;
}

ol, ul, li{
  color:rgb(95,95,95);
  font-family:  khmer ui;
  font-size: 13pt;
}

span{
  display: inline;
  font-family:  khmer ui;
  //vertical-align: baseline;
  //outline: 0;
}

span.link{
  color:yellowgreen;
  cursor:pointer;
  font-weight:bold;
}

span.resalte{
  color:yellowgreen;
  //cursor:pointer;
  font-weight:bold;
}

#minimenu{
  position: relative;
  top:0px;
  min-width: 100%;
  min-height: 35px;
  max-height: 35px;
  background-color: #001022;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: row nowrap;
  -webkit-flex-flow: row nowrap;
  display: none;
}

#minimenu div{
  position: relative;
  float:left;
  //flex-grow: 1;
  display: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;

  align-items:center;
  align-content:center;
  align-items:center;
  margin-left: 20px;
  cursor: pointer;
  z-index: 2;
  min-height: 35px;
}

#imagenmenu{
  cursor: pointer;
  max-height: 100%;
}

#minimenu p{
  font-family: arial;
  font-size: 18px;
  font-weight: bolder;
  color:orange;
}

#minimenu p:hover{
  font-family: arial;
  font-size: 18px;
  font-weight: bolder;
  color:white;
}

#minimenuextendido{
  position:absolute;
  background-color: rgb(225,225,225);
  min-width: 80%;
  max-width: 80%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;
  z-index: 10;
  min-height: 100%;
  box-shadow: 20px 0px 50px black;
  left:0px;
  display: none;
}

#minimenuextendido .submenu{
  position: relative;
  //flex-grow: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;
}

.seccionlateral{
  padding-left: 15px;
  cursor: pointer;
}

#minimenuextendido .submenu div{
  padding-left: 40px;
}

body{
  background-color: white;
  height:100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;

}

header{
  display: block;
  position: fixed;
  background-color: rgba(0,95,171,1);
  // background: red; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(-45deg, green, white, blue); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(-45deg, green, white, blue); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(-45deg, green, white, blue); /* For Firefox 3.6 to 15 */
  background: linear-gradient(-45deg, green, white, blue); /* Standard syntax */
  clear: both;
  height: 130px;
  text-align: center;
  min-width: 100%;
  max-width: 100%;
  z-index: 5;
}

#logo-header{
  display: block;
  position: relative;
  max-width:935px;
  width:100%;
  //min-width:100%;
  //background-color: rgba(72,138,190,0.8);
  min-height: 120px;
  max-height: 120px;
  margin: 0px  auto;
  bottom: 0px;
  // background-color: transparent;
  //background: radial-gradient(circle,rgba(255,255,255,1) , rgba(0,95,171,1));


  padding-left: 0px;
  text-align: center;
}

#header-contactanos{
  max-width:210px;
  position: absolute;
  top: 0px;
  right: 0px;
  min-height: 100%;
  padding:0px;
  padding-top: 20px;
  //display: -webkit-box;
  //display: -moz-box;
  //display: -ms-flexbox;
  //display: -webkit-flex;
  //display: flex;
  //flex-flow: row wrap;
  //-webkit-flex-flow: row wrap;
  //align-items:flex-start;
  //align-content:flex-start;
  //justify-content:flex-start;
  box-sizing: border-box;
}

#header-contactanos div{
  min-width: 100%;
  max-width: 100%;
  //height: 20px;
  clear: both;
  //border:solid 2px red;
  box-sizing: border-box;
}

#header-contactanos div p{
  color:white;
  text-align: left;
   max-width: 100%;
}

#header-contactanos div:nth-child(1) p{
  font-family: 'Droid Sans', arial, sans-serif;
  font-style: oblique;
  font-size: 13.5pt;
}

#header-contactanos div:nth-child(2) p{
  font-family: 'Droid Sans', arial, sans-serif;
  font-weight: 800;
  font-size: 16pt;
  text-shadow: 0px 0px 1px white;
}

header #logo-header img{
  display: block;
  //float: left;
  position: absolute;
  max-height: 60%;
  max-width: 90%;
  bottom:40px;
  cursor: pointer;
  //left: 0px;
  left: calc(50% - 60px);
  left: -webkit-calc(50% - 60px);
  margin:0 auto;
  
}

nav{
  position: absolute;
  width: 100%;
  min-height: 45px;
  bottom: -25px;
  z-index: 2;
  background-color: rgb(245,245,245);
  border: solid 1px rgb(200,200,200);
  padding: 0px;
}

.secciones{
  min-height: 55px;;
  min-width: 100%;
  flex-grow:1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;

  align-items:stretch;
  align-content:stretch;
  -webkit-align-items:stretch;
  -webkit-align-content:stretch;
}

.secciones .seccion{
  position: relative;
  flex-grow: 1;
  -webkit-flex-grow: 1;
  min-height: 100%;
  min-width: 20%;
  border-right: solid 1px rgb(200,200,200);

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;

  align-items:center;
  align-content:flex-start;
  justify-content: flex-start;
  -webkit-align-items:center;
  -webkit-align-content:flex-start;
  -webkit-justify-content: flex-start;
  padding-left: 5px;
  padding-right: 5px;
  cursor: pointer;
  
  box-sizing: border-box;
}

#partners-click{
  position:absolute;
  top: 0px;
  left: 0px;
  min-height: 55px;
  min-width: 100%;
}

.seccionlateral:hover{
  // box-shadow: inset 0px 0px 10px gray;
  background-color: rgba(150,150,150,.5);
}

/*.seccion:last-child:hover{
box-shadow: inset 0px 0px 0px gray;
background-color: rgba(150,150,150,0);
cursor: default;
}*/

nav .seccion:hover p{
  //background: black;
  z-index: 10;
}

.secciones .seccion-texto{
  position: absolute;
  top:10px;
  //margin-top: 10px;
  //margin-bottom: 10px;
  color: rgb(245,245,245);
  //color: rgba(0,95,171,1);
  font-size: 13pt;
  font-family: sans-serif;
  font-weight: bold;
  //text-shadow: 0px 0px 2px black;
  background-color: rgba(0,75,171,.7);
  padding: 0px;
  padding-left: 25px;
  padding-top: 8px;
  //left:20px;
  right: 5px;
  z-index: 3;
  border-radius: 0 10px 10px 0;
  width: calc(100% - 59px);
  min-width:60px;
  min-height: 27px;
  margin-right: 0px;
  text-align: left;
  box-shadow: inset 0px 0px 10px black;
  transition: background .6s;
}

.seccionlateral .seccion-texto{
  position: relative;
  margin-top: 10px;
  margin-bottom: 10px;
  color: rgb(245,245,245);
  //color: rgba(0,95,171,1);
  font-size: 14pt;
  font-family: sans-serif;
  //font-weight: bold;
  //text-shadow: 0px 0px 2px black;
  background-color: rgba(0,75,171,.7);
  padding: 5px;
  padding-left: 20px;
  left:-20px;
  z-index: 3;
  border-radius: 0 10px 10px 0;
  min-width: 90px;
  margin-right: 0px;
  text-align: left;
}

.seccion .submenu{
  display: none;
  position: absolute;
  min-height:10px;
  min-width: 100%;
  top:55px;
  left: 0px;
  background-color: rgb(245,245,245);
  border: solid 1px rgb(200,200,200);
  z-index: 10;
}

.submenu p{
  font-size: 10pt;
  text-align: left;
  margin-top: 10px;
  margin-bottom: 10px;
  color: rgba(0,95,171,1);
  font-family: sans-serif;
  //font-weight: bold;
  //text-shadow: 0px 0px 2px black;
  transition: color 2s;
  -webkit-transition: color 2s;
  /*animation: colores 1s linear reverse;
  -webkit-animation: colores 1s linear reverse;*/
}

.submenu div{
  margin: 0px;
  cursor: pointer;
  z-index: 10;
}

.seccion .submenu div:hover{
  padding-left: 15px;
  z-index: 10;
}

.seccion .submenu div:hover p{
  color:rgb(213, 100, 0);
  /*
  transition: all .2s;
  -webkit-transition: all .2s;
  */
  animation: colores .5s linear normal;
  -webkit-animation: colores .5s linear normal;
}

@keyframes colores{
  0%{    color: green;}
  60%{    color: rgb(213, 100, 0);}
}

@-webkit-keyframes colores{
  0%{    color: green;}
  60%{    color: rgb(213, 100, 0);}
}

@-moz-keyframes colores{
  0%{    color: green;}
  60%{    color: rgb(213, 100, 0);}
}

@keyframes coloresReverse{

  /*  0%{    color: rgb(213, 100, 0);}*/
  to{    color: rgba(0,95,171,1);}
}

@-webkit-keyframes coloresReverse{
  /*  0%{    color: rgb(213, 100, 0);}*/
  to{    color: rgba(0,95,171,1);}
}

@-moz-keyframes coloresReverse{
  /*  0%{    color: rgb(213, 100, 0);}*/
  to{    color: rgba(0,95,171,1);}
}

.submenu div:hover{
  text-align: left;
  box-shadow: inset 0px 0px 5px gray;
  z-index: 10;
}

.seccion:hover .submenu, .submenu:hover{
  display: block;
  display: -webkit-flex;
  display: flex;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;
  z-index: 10;
}
.secciones .seccion:hover .icono-boton {
  box-shadow: 0px 0px 0px 5px rgb(213, 100, 0),0px 0px 10px 1px gray, inset 0px 0px 10px 1px gray;
  transition: all .6s;
}

.secciones .seccion:hover .seccion-texto {
  background:rgb(213, 100, 0);
  transition: all .6s;
}

.icono-boton{
  position: relative;
  min-width: 35px;
  max-width: 35px;
  min-height: 35px;
  max-height: 35px;
  box-shadow: 0px 0px 0px 5px rgba(0,95,171,.9),0px 0px 10px 1px gray, inset 0px 0px 10px 1px gray;
  border-radius: 50px;
  background-color: rgb(245,245,245);
  padding: 0px;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;

  align-content: center;
  align-items: center;
  justify-content:center;
  transition: box-shadow 1s;
  margin-right: 5px;
  margin-left: 5px;
  z-index: 11;
}

.icono-boton .icono-interno{
  flex-grow: 1;
  position: relative;
  margin: 0 auto;
  padding: 0px;
  // background: pink;
  min-width: 70%;
  max-width: 70%;
  min-height: 70%;
  max-height: 70%;
  text-align: center;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;

  align-content: center;
  align-items: center;
  justify-content:center;
}

.icono-boton .icono-interno .icono-svg{
  position: relative;
  //top:0px;
  //left:0px;
  /*
  min-width: 100%;
  max-width: 100%;
  min-height: 100%;
  max-height: 100%;
  */
  min-width: 25px;
  max-width: 25px;
  min-height: 25px;
  max-height: 25px;
  //margin: 5px;
  cursor: default;
  padding: 0px;
}

#slider{
  position: relative;
  padding: 0px;
  width: 92%;
  max-width: 935px;
  width: 100%;
  //max-height: 350px;
  //min-height: 50px;
  margin: 0px auto;
  margin-top: 150px;
  overflow: hidden;
  border-radius: 0px;
  //z-index: 5;
}

.informacion-banner{
  z-index: 1;

  position: absolute;
  top: 0px;
  right:0px;
  min-height: 100%;
  max-width: 70%;
  width: 70%;
  //background-color: rgba(200,200,200, .4);
  //padding-right: 25px;

}

.titulo-banner, .subtitulo-banner, .boton-banner{
  position: relative;
  float: right;
  margin:5px;
  margin-right:20px;
  min-height: 25px;

  clear: both;
}

.titulo-banner{
  margin-top: 15px;
  //background: green;
  font-family: arial;
  font-size: 24pt;
  font-weight: bold;
  color: rgba(0,95,171,1);
  max-width: 80%;
  text-align: right;
  text-shadow: 0px -1px 1px black;
}

.subtitulo-banner{
  font-family: arial;
  font-size: 18pt;
  //font-weight: bold;
  color:rgb(213, 117, 0);
  text-shadow: 0px -1px 1px rgba(200,200,200,1);
  font-style: italic;
  text-align: right;
}

.boton-banner, .submit{
  background-color: rgb(213, 100, 0);
  width:130px;
  min-width:130px;
  height:30px;
  max-height:30px;
  border-radius: 100px;

  box-shadow: inset 0px 1px 2px -1px white;
  border-top: solid 1px rgb(213, 100, 0);

  display: -webkit-flex;
  display: flex;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;

  justify-content: center;
  align-content: center;
  align-items: center;

  cursor: pointer;
}

.boton-banner p{
  font-family: sans-serif;
  color: white;
  font-size: 10pt;
  text-shadow: 0px -1px 0px  rgba(100,100,100,.8);
}

.boton-banner:hover{
  background-color: white,rgba(213, 117, 0,1);
  opacity: .9;
}

#slider ul{
  position: relative;
  display: flex;
  padding: 0px;
  margin: 0px;
  width: 300%;
  // max-height: 300px;
  //min-height: 300px;
  animation: cambio 10s infinite alternate;
  -ms-animation: cambio 10s infinite alternate;
  -moz-animation: cambio 10s infinite alternate;
  -webkit-animation: cambio 10s infinite alternate;
  //border-radius: 10px;
}

#slider ul li{
  position: relative;
  list-style: none;
  min-width: 33.34%;
  //max-height: 300px;
  max-width: 33%;
  border-radius: 10px;
}

#slider ul li .banner1{
  position: relative;
  //max-height: 100%;
  min-width: 100%;
  max-width: 100%;
}

#slider ul li .banner1 img{
  position: relative;
  max-height: 100%;
  max-width: 100%;
  //height: 100%;
  //max-height: 100%;
}

@keyframes cambio{
  0%{margin-left: 0;}
  30%{margin-left: 0;}

  35%{margin-left: -100%;}
  65%{margin-left: -100%;}

  70%{margin-left: -200%;}
  100%{margin-left: -200%;}
}

@-webkit-keyframes cambio{
  0%{margin-left: 0;}
  30%{margin-left: 0;}

  35%{margin-left: -100%;}
  65%{margin-left: -100%;}

  70%{margin-left: -200%;}
  100%{margin-left: -200%;}
}

#partners, #contenedor{
  margin-left:4px;
  margin-right:4px;
}

#lateral{
  flex-grow:1;
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;
  flex: 1 1 30%;
  //width: 35%;
  min-width: 150px;
  //max-width: 300px;
  //padding:1%;

  padding-left: 2%;
  padding-right: 2%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;

  //justify-content: space-between;
  //align-content: space-between;
}


#lateral #logotipo-marca, #lateral #adicional-marca{
  flex-grow: 1;
  position: relative;
  //min-height: 100%;
  //min-width: 100%;

  max-height: 90px;
  max-width: 100%;
  padding: 1px;
  border-radius: 10px;
  margin: 1px;

  flex-grow:1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  //flex: 1 1 30%;
  //min-width: 150px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  align-content: center;
  align-items: flex-start;
  justify-content:center;

}

#lateral #adicional-marca{
  display: none;
}

#lateral #logotipo-marca div,#lateral #adicional-marca div{

  position:relative;
  /* min-height: 100%;
  min-width: 100%;*/
  max-height: 100%;
  max-width: 100%;
}

#lateral #logotipo-marca img,#lateral #adicional-marca img{
  flex-grow: 1;
  position:relative;
  /* min-height: 100%;
  min-width: 100%;*/
  max-height: 90px;
  max-width: 100%;
}

#partners{
  flex-grow:1;
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;
  max-width: 100%;
}

#encabezado{
  flex-grow:1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-flow: row nowrap;
  -webkit-flex-flow: row nowrap;
  align-content: center;
  align-items: center;
  justify-content:center;
  min-height: 50px;
  border-bottom: solid 1px rgba(220,220,220,0.9);
  margin-bottom: 20px;
}

.leyenda{
  flex-grow:1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: row nowrap;
  -webkit-flex-flow: row nowrap;

  align-content: center;
  align-items: center;
  justify-content:center;

  margin:0px auto;
  min-height: 10px;
}

.leyenda p{
  position: relative;
  bottom: 0px;
  clear: both;
  color: rgb(255,185,15);
  font-size: 14pt;
  font-family: arial;
  font-weight: bold;
  text-shadow: 1px 1px 1px black;
  text-align: center;
}

#partners #catalogo{
  flex-grow:1;
  position:relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  max-width: 100%;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  align-items: stretch;
  justify-content:space-around;
}


.partner{
  flex-grow:1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex:1 1 50%;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  align-content: center;
  align-items: center;
  justify-content:center;

  border-top: solid 2px rgba(255,185,15,0);
  border-bottom: solid 2px rgba(255,185,15,0);
  min-width: 80px;
  min-height: 90px;

  cursor: pointer;
}

.partner:nth-child(odd){
  align-content: center;
  align-items: flex-start;
  justify-content:center;
}

.partner:nth-child(even){
  align-content: center;
  align-items: flex-end;
  justify-content:center;
}

.partner div{
  max-width: 100%;
}

.partner:hover{
  /*
  border-top: solid 2px rgba(255,185,15,0.5);
  border-bottom: solid 2px rgba(255,185,15,0.5);
  background-color: gold;
  */
}

.imagenes{
  max-width: 80px;
  max-height: 70px;
}


#contenido{
  min-height: 30px;
  align-items:center;
}

#div-contacto{
  flex-grow: 1;
  //border: 1px solid #93afa2;
  margin: auto;
  width:100%;
  border-top: solid 1px rgba(220,220,220,0.9);
  border-bottom: solid 1px rgba(220,220,220,0.9);
}

.contact_form label{
  display:inline-block;
  float: left;
  min-width: 65px;
  color: rgba(90,90,90,1);
  padding: 3px;
  font-weight: bold;
}

.contact_form input{
  color:rgb(90,90,90);
  height: 20px;
  padding: 5px 8px;
  width: calc(100% - 65px);
  border-radius: 20px;

}

.contact_form textarea{
  color:rgb(90,90,90);
  padding:8px;
  width: calc(100% - 65px);
  border-radius: 10px;
}

.contact_form button{
  padding:8px;
  width: 120px;
  color: white;
  font-weight: bold;
}

.contact_form ul{
  list-style: none;
  width: 100%;
  margin:0;
  padding: 0px;
}

.contact_form li{
  padding: 12px;
  border-bottom: 1 solid #929a0;
  position: relative;
}

.contact_form input:focus,.contact_form textarea:focus{
  //border-color: aquamarine;
}

.contact_form input:required,.contact_form textarea:required{
  // border-color:yellow;

}

.contact_form input:required:valid,.contact_form textarea:required:valid{
  //border-color: green;

}

.contact_form input:focus.invalid,.contact_form textarea:focus.invalid{
  //border-color: red;

}



footer{
  background-color: rgba(72,138,190,.3);
  background-color: whitesmoke;
  background-color: rgba(0,95,171,1);
  min-height: 90px;
  position: relative;
  bottom: 0px;
  clear: both;

  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  flex-flow: column nowrap;
  -webkit-flex-flow: column nowrap;

  align-content: space-between;
  align-items: center;
  justify-content:center;

  padding: 10px;
  box-sizing: border-box;
  border-top: solid 2px rgb(180,180,180);

  margin-top: 1px;
}

footer div:nth-child(1):hover p{
  //font-style: italic;
  color:darkorange;
  font-weight: bold;
}

#logo{
  opacity: .3;
}