/**
* Hoja de estilo
*Autor: MRSI. Fernando Acevedo Sánchez
*www.tendenciati.com.mx
*asfernando@tendenciati.com.mx
*/
@charset "utf-8";
html { height: 100%; }
*,
*:after,
*:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}
/*Elementos básicos de formato y orden de presentacion*/
@font-face {
   font-family: myFont;
   src: url(comfortaa-light.ttf);
}
body 
{
   font-family: myFont;
   font-size: 1em;
   margin: 0 auto;
   /*color: white;*/
   background-color: white;
}
h1{color: #810041; font-size: 2em;}
section{margin: 0px auto; padding: 0px; text-align: center;}
article{width: 80%;margin: 0 auto; padding: 0.5%;}
a{outline: none !important; color: #620031; text-decoration: none; border: 0px !important;}
a:visited{color: #620031 !important;}
a:hover{color: #dc99ba !important;}

/*Elementos secundarios y clases*/
img{border: 0px;}
.div2{width: 40%; float: left; margin-right: 18px;}
.justificado{text-align: justify;}
.centrado{text-align: center;}
.mayusculas{text-transform: uppercase;}
.limpiar{clear: both;}
.oculto{display: none;}
.adaptable{max-width: 100%;  height: auto;}
.redondosombra{
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.4);
-moz-box-shadow: rgba(0, 0, 0, 0.4) 2px 2px 6px;
box-shadow: rgba(0, 0, 0, 0.4) 2px 2px 6px;
border-radius: 1em;
padding: 1%;
}
.obligatorio{color: red;}
/*Forms*/

select {
width: auto;
background: #F3F3F3;
color: #585757;
padding: 5px;
font-size: 13px;
line-height: 100%;
border: 1px solid #C1C1C1;
border-radius: 0;
height: 30px;
/*-webkit-appearance: none;*/
}
option {
padding: 10px;
}
.send { 
color: white;
cursor: pointer;
padding: 5px 11px;
font-size: 1.2em;
border: solid 1px #cccccc;
border-radius: 5px;
background: #810041;
}
.txt 
{ 
display: inline-block; 
color: #676767;
width: 80%;
margin-bottom: 10px; 
border: 1px dotted #ccc; 
padding: 5px 9px;
font-size: 1.2em;
line-height: 1.4em;
text-align: justify;
}
.txtpke{
display: inline-block; 
color: #676767;
width: 30%;
margin-bottom: 10px; 
border: 1px dotted #ccc; 
padding: 5px 9px;
font-size: 1.2em;
line-height: 1.4em;
text-align: justify;
}
.txtarea { 
display: inline-block; 
resize: none;
width: 80%;
color: #676767;
margin-bottom: 10px;
border: 1px dotted #ccc;
padding: 5px 9px; 
font-size: 1.2em;
line-height: 1.4em;
}
button{padding: 4px 4px !important; background-color: #810041; color: white;}
.txt:focus, .txtarea:focus { border-style: solid; border-color: #810041; color: #444; }
input.error, textarea.error { border-color: #810041; background: #cccccc; color: #333333; }
input.error:focus, textarea.error:focus { border-color: #810041; color: #333333; }
label.error { float: none; color: #810041; padding-left: .5em; vertical-align: top; }
.oculto{display: none;}
footer {background-color: #810041; color: white; padding: 1%;}
#respuesta{padding: 10px;}

.ui-accordion-content{height: auto !important;}
/*Mediaqueries resolucion de pantalla pc, tablet y laptop*/
@media screen and (min-width:680px)
{
    .div2
    {
        min-width: 35%;
        cursor: pointer;
        margin: 10px 10px;
        padding: 10px 10px;
        text-align: center;
        border-color: #810041;
        border-style: solid;
        border-width: 1px; float: left;
    }
    .container{min-height: 155px;}
    .ui-dialog{width: 30% !important;}
}
/*Dispositivos mobiles*/
@media screen and (max-width:680px) 
{
    .div2
    {
        min-width: 95%;
        cursor: pointer;
        margin: 10px 10px;
        padding: 10px 10px;
        text-align: center;
        border-color: #810041;
        border-style: solid;
        border-width: 1px;
    }
    .ui-dialog{width: 90% !important;}
    .txt, .txtpke, .txtarea{width: 90%;}
    select{font-size: .6em !important;}
}