@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400');
*,
*:after,
*:before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
.tabla{
    border-collapse: collapse;
      border-spacing: 0;
    border-style: solid;
    border-width: thin;
    width: 100%;
    font-weight: bold;
    text-align: center;
}
.tabla tr > td {
    border: 1px solid black;
    padding: 2px;
}
.tabla th {
    border: 1px solid black;
    padding: 2px;
}
#sortable {
	list-style-type: none;
	margin: 5px 0px 0px 16px;
	padding: 0;
}
#sortable li {
	margin: 3px 3px 3px 0;
	padding: 1px;
	float: left;
	width: 35px;
	height: 35px;
	font-size: 20px;
	text-align: center;
	line-height:35px;
	cursor:pointer;
	-moz-border-radius:5px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	background:#638D7D;
	color:#fff;
	font-weight:normal;
}
.captcha_wrap{
	border:1px solid #fff;
	-moz-border-radius:5px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	
	height:150px;
	overflow:auto;
	width:150px;
	overflow:hidden;
	margin:0 auto;
	background-color:#dbdbdb;
}
.captcha{
	-moz-border-radius:3px;
	border-radius:3px;
	-webkit-border-radius:3px;
	font-size:12px;
	color:#BBBBBB;
	text-align: center;
	border-bottom:1px solid #CCC;
	padding:0.5em;
	background-color:#fff;
}

img {
    max-width: 100% !important;
    border: 0;
}

html,
body {
    font-family: 'Roboto', sans-serif;
    font: 400 1em/1.4em sans-serif;
    background-color: #FFF;
    border: 0;
    margin: 0;
    margin: 0px;
    padding: 0;
    padding: 0px;
}

.container {
    background-color: #FFF;
    height: 100%;
    margin: 0px auto;
    max-width: 1170px;
    overflow: hidden;
    position: relative;
    width: 100%;
    padding: 0;
    color: rgb(51, 51, 51);
}

#Header {
    background-color: #F8F8F8;
    display: table;
    height: auto;
    margin-bottom: 1em;
    overflow: hidden;
    padding: 0px;
    width: 100%;
    border: #000 solid 1px;
    border-color: #e7e7e7;
}

.equalH {
    height: 70px;
}

.logoheader {
    border-bottom: solid 5px rgb(195, 195, 195);
    background-color: rgb(237, 239, 238);
    text-align: center;
}

.logoheader img {
    padding: 1px;
    height: 60px;
}

.nameDep {
    border-bottom: #9F2240 5px solid;
    padding-right: 15px;
	padding-left: 15px;
	padding-top: 16px;
    margin-right: auto;
    margin-left: auto;
    color: #5A6523;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

.nameDep>h1 {
    font-size: 30px;
    line-height: 31px;
    color: #9F2240; 
}

.leyendatop {
    background-color: #F8F8F8;
     color: #9F2240;
    border: #e7e7e7 1px solid;
    min-height: 33px;
    font-size: 1.4rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}

.leyendatop p {

    padding-top: 3px;
    width: 75%;
    margin-left: 25%;
    padding-left: 15px;
}


#respuesta2>p {
    margin-bottom: 10px;
    font-size: 0.8em;
    line-height: 1.2em;
    text-align: justify;
}

#respuesta1 {
    width: 100%;
    height: 100%;
    display: block;
}



#anima {
    display: none;
    border-radius: 4px;
    border: 1px #999 solid;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 6em;
    text-align: center;
}

#anima-carga {
    font-size: 11px;
    position: relative;
    padding: 0 4px 4px 0;
    left: 50%;
    margin-left: -25px;
    width: 56px;
    height: 55px;
    border-radius: 4px;
    background-color: #FFF;
    background-image: url(../img/ajax-loader.gif);
    background-repeat: no-repeat;
    box-shadow: 0 2px 32px rgba(0, 0, 0, 0.6);
}

#btnenviar {
    display: none;
}

.texRight-left {
    text-align: right;
}

.clearfix {
    color: green;
    height: 50px;
}

ol,
ul {
    list-style: none;
    margin-bottom: 50px;
}



/* SECTIONS=============================================================================*/ 
.section {
    clear: both;
    padding: 0px;
    margin: 0px;
}

/*  GROUPING  ============================================================================= */

.group:before,
.group:after {
    content: "";
    display: table;
}

.group:after {
    clear: both;
}

.group {
    zoom: 1;
}

.col {
    display: block;
    float: left;
    margin: 0;
}

.col:first-child {
    margin-left: 0;
}

.span_4_of_4 {
    width: 100%;
}

.span_3_of_4 {
    width: 75%;
}

.span_2_of_4 {
    width: 50%;
}

.span_1_of_4 {
    width: 25%;
}



#footer{
	
}

#plecafooter {
    clear: both;
    padding: 0;
    padding-top: 10px;
    padding-bottom: 5px;
    background-color: #8a2036;
    color: #ffffff;
    text-align: center;
}

.bgFooter {
    background-color: #56212f;
	padding: 0 0.5rem 0 0.5rem ;
	height: 210px;
}

.footerList {
    font-size: 11px;
    line-height: 16px;
    padding: 0px 10px;
    color: #FFF;
}
.footerTitulo {
   margin: 1rem 0;
}
.footerList .footerTitulo {
    font-size: 18px;
    color: #d9cdad;
}

.footerList ul {
   list-style-type: disc;
    margin-left: 0;
    padding-left: 12px;

}

.footerList ul li {
    margin-bottom: 4px;
    line-height: 14px;
}

.footerList ul li a {
    color: #FFF;
    text-decoration: none;
}

.footerList ul li a:hover {
    color: #ccc;
    text-decoration: underline;
}

.identidad {
    background-color: #efe1ca;
	text-align: center;
	height: 210px;
}

.identidad img {
    padding: 8px;
    text-align: center;
    margin-top: 20px;
}

/*  formularios  ==================================================================== */

.forma_izq {
    padding: .8em;
    font-size: 1em;
    font-weight: bold;
    color: #000;
    text-align: right;
    border-bottom: #999 1px dotted;
}

.forma_der {
    padding: .8em;
    font: bold 1em;
    color: #000;
    text-align: left;
    border-bottom: #999 1px dotted;
}

input[type="text"],
input[type="number"],
input[type="tel"],
input[type="email"],
textarea {
    -webkit-appearance: textfield;
    padding: 0.5em 0 0.5em 0.5em;
    border: 1px solid #CCC;
    border-radius: 0.3em;
    font-size: 1em;
    width: 100%;
    box-shadow: 0 0 8px #EEE inset;
    background-color: #FFF;
}

textarea {
    padding: 0.5em;
    line-height: 1.4em;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
    border: 1px #999 solid;
    outline: solid 1px #999;
    box-shadow: 0 0 5px rgba(203, 203, 203, 1);
}

select {
   
	border: 1px #CCC solid;
    border-radius: 0.3em;
    font-size: 1em;
    width: 100%;
    box-shadow: 0 0 8px #EEE inset;
	background-color: #f8f8f8;
	
	padding: 0.5em;


	
	-webkit-appearance: none;
	-moz-appearance: none;
	background: #f8f8f8 url(../img/select-arrow4.png) no-repeat 97% center;
	text-indent: 0.01px;
	text-overflow: "";
}

input[type="text"].autow,
input[type="number"].autow,
input[type="tel"].autow,
input[type="email"].autow,
textarea.autow,
select.autow {
    width: auto;
}



.noborde {
    border: none;
}

fieldset {
    margin: 8px;
    border-radius: 2px;
    padding: 1.5rem 5rem;
    border: #CCC 1px solid;
	background-color: #F4F4F4;
	display: block;
	margin-bottom: 40px;
	
	clear: both;
}

fieldset > legend {
    border: #ccc 1px solid;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    height: auto;
    outline: none;
    background-color: white;
    color: #333;
    font-weight: bold;
    padding: 0.5em 1rem;
    margin: 0 0 1em 5px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
}



fieldset div >label {
    width: 30%;
	float: left;
	height: 3rem;
    padding: .8rem;
    font-size: 1rem;
    font-weight: bold;
    color: #333;
    text-align: right;
}

fieldset div.form_der {
	height: 3rem;
    width: 70%;
    float: right;
    padding: .6rem .8rem;
    font-size: 0.9rem;
    font-weight: bold;
    color: #000;
    text-align: left;
}



.sinpadding {
    padding: 0px;
}

#ficha {
    display: none;
    border-radius: 4px;
    border: 1px #999 solid;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 6em;
    text-align: justify;
}

#ficha p {
    text-align: center;
}

/*  boton regresar  ==================================================================== */



a.button {
    border: 1px solid #CCC;
	-webkit-box-shadow: -8px 11px 34px -18px rgba(51,51,51,1);
	-moz-box-shadow: -8px 11px 34px -18px rgba(51,51,51,1);
	box-shadow: -8px 11px 34px -18px rgba(51,51,51,1);

    border-radius: 4px;
    padding: 12px 20px;
    text-decoration: none;
    margin-right: 15px;
    margin-bottom: 15px;
	 
	text-shadow: #fff 0 1px 0; 
	width:auto; 
	display:inline;

	color: #333; 
	line-height: 2em; 
	font-size:1em; 
	font-weight:bold;

}

a.button:hover {
    color: #000;
}


#botonesprint {
    text-align: center;
    margin: 0 auto;
    margin-top: 3em;
   
}

@media screen and (max-width: 940px) {
    .container {
        padding: 10px;
    }
   
    #ficha {
        padding: 2em;
    }
    fieldset>div>label {
        text-align: right;
        width: 100%;
        float: none;
        margin: 0 0 0.5em 0;
        border: 0px;
    }
    fieldset div.form_der {
        width: 100%;
        float: none;
        margin: 0 0 0.1em 0;
        padding-bottom: 0.5em;
        padding-top: 0.3em;
        height: auto;
    }
}

@media screen and (max-width: 640px) {
    .tabla{
        font-size: 10px;
        line-height: 100%;
    }
    fieldset {
        padding: 1.5rem 1rem;
    }
    fieldset>div {
        margin: 0 0 0.1em 0;
    }
    fieldset>div>label {
        width: 100%;
        float: none;
        margin: 0 0 0.5em 0;
        border: 0px;
    }
    fieldset div.form_der {
        width: 100%;
        float: none;
        margin: 0 0 0.1em 0;
        padding-bottom: 0.5em;
        padding-top: 0.3em;
        height: auto;
    }
    input[type="text"],
    input[type="number"],
    input[type="tel"],
    input[type="email"],
    textarea,
    select {
        width: 100%;
        font-size: 1em;
        padding: 0.8em;
    }
    .novisible {
        display: none;
        visibility: hidden;
    }
  
}

@media screen and (max-width: 400px) and (max-width: 600px) {
   
    fieldset {
        padding: 1.5rem 1rem;
    }
    fieldset>div {
        margin: 0 0 0.1em 0;
    }
    fieldset>div>label {
        width: 100%;
        float: none;
        margin: 0 0 0.5em 0;
        border: 0px;
    }
    fieldset div.form_der {
        width: 100%;
        float: none;
        margin: 0 0 0.1em 0;
        padding-bottom: 0.5em;
        padding-top: 0.3em;
        height: auto;
    }
    input[type="text"],
    input[type="number"],
    input[type="tel"],
    input[type="email"],
    textarea,
    select {
        width: 100%;
        font-size: 1em;
        padding: 0.8em;
    }
   
}

@media screen and (max-width: 320px) and (max-width: 399px) {
    /*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
    .col {
        margin: 1% 0 2% 0%;
    }
    .span_2_of_2 {
        width: 100%;
    }
    .span_1_of_2 {
        width: 100%;
    }
    fieldset>div {
        margin: 0 0 0.1em 0;
    }
    fieldset>div>label {
        width: 100%;
        float: none;
        margin: 0 0 0.5em 0;
        border: 0px;
    }
    fieldset div.form_der {
        width: 100%;
        float: none;
        margin: 0 0 0.1em 0;
        padding-bottom: 0.5em;
        padding-top: 0.3em;
        height: auto;
    }
    input[type="text"],
    input[type="number"],
    input[type="tel"],
    input[type="email"],
    textarea,
    select {
        width: 100%;
        font-size: 1em;
        padding: 0.8em;
    }
    .H_dos {
        font-size: 55%;
    }
    a.button {
        font-size: 1.2em;
    }
    #namePag {
        font-size: 1.4em;
    }
}

@media print {
    .container {
		margin: 0 auto;
		width: 90%;
		font-size: 90%;
		
    }
    #footer {
        display: none;
        visibility: hidden;
    }
    
    #botonesprint {
        display: none;
        visibility: hidden;
    }
    #ficha {
        padding: 4em;
    }
    #contenidoform,
    form,
    #respuesta1 {
        display: none;
        visibility: hidden;
        height: 0px;
    }
}

@media screen and (max-width: 940px) {	
	
	.nameDep{
		border-bottom: #879E0F 5px solid;
		height: auto;
		padding: 0.5rem;
	}

	.nameDep > h1 {
		text-align: center;
		font-size: 24px;
		line-height: 24px;
	}
	.logoheader{
		text-align: center;
		height: auto;
	}

	.logoheader img{
		height: 70px;
		width: auto;
	}
	.leyendatop {
		min-height: 0%;
		height: 40px;
		
	}
	.leyendatop p{
		text-align: center;
		width: 100%;
		margin-left: 0%;
		font-size: 1rem;
		line-height: 0.8rem;
		padding-top: 10px;
	}
	
	h2.titulo{
		text-align: center;
	}
	.col {
		margin: 0;
	}
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { 
		width: 100%; 
	}
	.bgFooter, .footerList {
		
		height: auto;
	}
}
@media screen and (max-width: 720px) {	
	.nameDep > h1 {
		text-align: center;
		font-size: 1.2rem;
		line-height: 1rem;
    }
    #respuesta1 {
       font-size: 80%;
    }
}