@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto:900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500');

body{ background:url(img/fondo.jpg) 50% 50% fixed; background-size: cover; margin:0;}

h1{font-family: 'Roboto', sans-serif; color:rgb(0,0,0); font-size:2.5em; text-align:left;}
h2{font-family: 'Roboto', sans-serif; color:rgba(0,0,0,1.00); font-size:1.5em; font-weight:300; text-align:left; }
h3{font-family:'Montserrat', sans-serif; color:rgb(0,0,0); font-size:1.2em; letter-spacing:0px; text-align:left; }
p{font-family: 'Montserrat', sans-serif; color: rgb(0,0,0); font-size:1.0em; font-weight: 400; line-height: 165%; }

legend{font-family:'Montserrat', sans-serif;; color:rgba(255,255,255,1.00); font-size:1.2em; font-weight:500; margin-top:50px;  }
fieldset{background:rgba(255,255,255,1.00); box-shadow:rgba(0,0,0,0.5) 0px 0px 15px; border: none; padding: 20px 50px;}

ul li{font-family: 'Montserrat', sans-serif; color: rgb(0,0,0); font-size:1.0em; line-height: 165%; }
ol li{font-family: 'Montserrat', sans-serif; color: rgb(0,0,0); font-size:1.0em; line-height: 165%; }

a:link, a:active, a:visited{font-family: 'Montserrat', sans-serif; font-weight: bolder; color:rgba(53,131,255,1.00);}

a.footer:link, a.footer:active, a.footer:visited{font-family: 'Montserrat', sans-serif; color:rgba(255,255,255,0.65); font-size: 0.8em;}

input, textarea, select{background:rgba(235,235,235,1.00); color: rgba(0,0,0,1.00); font-family: 'Montserrat', sans-serif; font-size:1.3em; font-weight:300; padding:15px; margin:5px 0px; border:none; width:90%; max-width:500px; }
input:hover, textarea:hover{background:rgba(255,255,255,1.00); box-shadow:rgba(100,100,100,0.5) 0px 0px 5px;}
input.boton{background:rgba(53,131,255,1.00); border: none; color: rgb(255,255,255); font-family:'Montserrat', sans-serif; font-size:1.5em; font-weight:500; text-transform:uppercase; padding:10px 25px; boder:none; margin:5px 0px; width:100%;}
input.boton:hover{background:rgba(255,255,255,1.00); color:rgba(38,37,158,1.00);}

button{background:rgba(8,62,157,1.00); color:rgb(255,255,255,1.00); border: none; font-family:'Roboto', sans-serif; font-size:1.2em; font-weight:400; text-transform:uppercase; padding:10px 25px; boder:none; margin:5px auto; width: 100%;}
button:hover{background:rgba(255,255,255,1.00); color:rgba(38,37,158,1.00);}

/* TABLAS */
table{overflow-x:auto; width:100%;}
table thead th{font-family:'Montserrat', sans-serif; font-size:1.2em; font-weight:400; color:#FFF; background:rgba(25,75,200,1.00); border:none; padding:10px 20px; text-align:center; }
table tr td{font-family:'Montserrat', sans-serif; font-size:1.2em; font-weight:400; color:rgba(0,0,0,1.00); border:none; vertical-align:top; padding:10px; text-align:left; }
table tfoot td{font-family:'Montserrat', sans-serif; background:rgba(25,75,200,1.00); border:none; color:rgba(255,255,255,1.00); font-weight:300; font-size:1em; padding:5px; }
tr:nth-child(even) {background:rgba(51,51,51,0.20);}
tr:nth-child(odd) {background:rgba(51,51,51,0.10);}

/* LISTADOS */
.tabs {
      display: flex;
      margin-bottom: 1rem;
      cursor: pointer;
    }

    .tab {
      padding: 10px 20px;
      border: 1px solid #FFF;
      background: rgb(24,37,106);
      margin-right: 5px;
      border-radius: 5px 5px 0 0;
      font-family: 'Roboto', sans-serif; color:rgba(255,255,255,1.00); font-size:1.5em; font-weight:300; text-align:left;
    }

    .tab.active {
      background: rgb(24,37,106);
      border-bottom: 1px solid white;
      font-weight: bold;
    }

    .tab-content {
      display: none;
      padding: 20px;
      border: 1px solid #ccc;
      border-top: none;
      background: none;
      border-radius: 0 0 5px 5px;
    }

    .tab-content.active {
      display: block;
    }


/* MENÚ RESPONSIVO */
ul.topnav li {float:left; font-family: 'Montserrat', sans-serif; font-weight:300;  }
ul.topnav li.icon {display: none;}
ul.topnav li a {display:inline-block; padding:10px; font-size:0.9em; text-align:center; text-decoration:none;}
ul.topnav li a:hover {padding:10px;}

/* MENÚ DESPLEGABLE */
ul.menu{padding:0px; list-style: none; margin-top:10px; text-align:right;}
ul li.menu{display:inline-block; margin:17px 0px; position:relative; font-family: 'Montserrat', sans-serif; font-weight:bolder; font-size:0.8em; text-align:left; }
ul li.menu a{display:block; text-decoration:none; margin:0px; padding:5px 20px; transition: all 0.5s ease-in 0s; color:rgba(0,0,0,1.00); text-transform: uppercase; }
ul li.menu a:hover{color:rgba(255,255,255,1.00); background:rgba(24,37,106,1.00); }

ul li.menu ul.dropdown{min-width:185px; /*Set width of the dropdown*/ margin:0px; padding:0px; display:none; position: absolute; z-index: 999; left: 0; text-align:left; color:rgba(1,1,1,1.00); background:rgba(255,255,255,1.00); box-shadow:rgba(0,0,0,0.45) 1px 1px 3px;}
ul li.menu:hover ul.dropdown{display: block; /* Display the dropdown */ border:rgba(100,100,100,0.35);}
ul li.menu ul.dropdown li{display: block; color:rgba(1,1,1,1.00); border:rgba(255,255,255,1.00) solid 1px; font-size: 1.0em; padding:0px; margin:5px; }
ul li.menu ul.dropdown li a {padding:5px; text-align:left; background:rgba(255,255,255,1.00);} 
ul li.menu ul.dropdown li a:hover{display: block; color:rgba(1,1,1,1.00); background:rgba(255,255,255,1.00); }

ul.list li.list{font-family: 'Montserrat', sans-serif; }
ol.list li.list{font-family: 'Montserrat', sans-serif; list-style:inside; list-style-type:square; display:inherit;}

/* HEADER CHANGING */
header{width:100%; position:fixed; z-index:10; margin:0px;}

header.large{height:80px; background:rgba(255,255,255,1); box-shadow: rgba(100,100,100,0.5) 0px 0px 5px; transition:1.2s;}
header.large img.logo{margin:0px; float: left; height:60px; transition:1.2s;}
header.large ul.topnav{list-style-type:none; padding:5px; margin-top:0px; overflow:hidden; z-index:1000; float:left; transition:1.2s;}
header.large ul.topnav li a {color:rgba(1,1,1,0.85); border:rgba(1,1,1,0.0) solid 1px; transition:1.2s;}
header.large ul.topnav li a:hover {color:rgba(1,1,1,1.00); background:rgba(255,255,255,1.00); border:rgba(1,1,1,1.00) solid 1px; transition:1.2s;}

header.small{height:60px; background:rgba(255,255,255,1); transition:1.2s; box-shadow:rgba(0,0,0,0.5) 0px 0px 5px; }
header.small img.logo{margin:7px 15px; float: left; height:35px; transition:1.2s;}
header.small ul.topnav{list-style-type:none; padding:5px; margin-top:5px; overflow:hidden; z-index:1000; float:left; transition:1.2s;}
header.small ul.topnav li a {color:rgba(1,1,1,0.85); border:rgba(1,1,1,0.0) solid 1px; transition:1.2s;}
header.small ul.topnav li a:hover {color:rgba(1,1,1,1.00); background:rgba(255,255,255,1.00); border:rgba(1,1,1,1.00) solid 1px; transition:1.2s;}

.lineamientos{background:rgba(250,250,250,0.15); border:rgba(150,150,150,0.5) solid 1px;; float:left; font-family: 'Montserrat', sans-serif; color: rgba(126,126,126,1.00); padding:5px; margin:5px; width:90%; max-width:240px;}
.focalizada{width:265px; min-height:185px; float:left; background:rgba(243,243,243,1.0); border:none; color:rgb(100,100,100); margin:10px; padding:0px 15px; font-family: 'Montserrat', sans-serif; font-size:0.8em;}
.fraccion{width:297px; float:left; display:block; margin:10px;}
.fraccion:hover{box-shadow:rgba(55,182,244,1.00) 0px 0px 3px;}
.faccion_txt_1{width:250px; height:25px; float: left; background:rgba(230,230,230,1.0); color:rgb(100,100,100); padding:10px 5px 2px; font-family: 'Montserrat', sans-serif; font-size:0.8em;}
.faccion_txt_2{width:250px; height:32px; float: left; background:rgba(230,230,230,1.0); color:rgb(100,100,100); padding:3px 5px 2px; font-family: 'Montserrat', sans-serif; font-size:0.8em;}
.faccion_txt_3{width:250px; height:35px; float: left; background:rgba(230,230,230,1.0); color:rgb(100,100,100); padding:0px 5px 2px; font-family: 'Montserrat', sans-serif; font-size:0.6em;}
.trimestre{width:197px; float:left; display:block; margin:10px;}
.trimestre:hover{box-shadow:rgba(55,182,244,1.00) 0px 0px 3px;}


#slider1_container{display: none; position:absolute; margin:auto; top:0px; /*left: 0px;*/ width:960px; height:390px; overflow:hidden;}
#slides_size{cursor: move; width: 960px; height: 390px; overflow: hidden;}

.slider_txt{font-family: 'Roboto', sans-serif; font-size:1.5em; background:rgba(0, 50, 160, 0.72); padding:15px 15px 15px 15px; height:50px; width:450px; color:rgb(255,255,255); margin:290px 0px 0px 500px;  }

#contenido{margin-top:0px; padding-top:100px; width:90%; max-width:980px; text-align:justify;}
#banner{background:url(http://najeramontiel.com.mx/images/teaser.jpg) 50% 50%; background-size:cover; padding:110px 28px 1px; text-align: left;}
#texto{width:90%; max-width:960px; text-align: justify;}
#footer{width:90%; padding:30px 5%; margin-top:50px; background:rgb(24,37,106); text-align:left;}

#responsive{ display:none; }
#scrolldown{ display:block; width: 100%; max-width: 1400px; }

@media screen and (max-width:1265px) {
	#responsive{ display:block; }
	#scrolldown{ display:none; }

	ul.topnav li:not(:first-child) {display: none;}
	ul.topnav li{display: none;}
	ul.topnav li.icon {float:right; display: inline-block;}
	
	header.large{height:70px;}
	header.large ul.topnav{list-style-type:none; padding:0px; margin-top:0px; overflow:hidden; z-index:1000; float: right; width:230px;}
	
	header.small{height:60px;}
	header.small ul.topnav{list-style-type:none; padding:0px; margin-top:0px; overflow:hidden; z-index:1000; float: right; width:230px;}
		
	ul.topnav.responsive{position:relative; background:#FFF;}
	ul.topnav.responsive li.icon{position: absolute; right:0; top:0;}
	ul.topnav.responsive li{float: none; display: inline; font-size:1em;}
	ul.topnav.responsive li a{display: block; text-align:left; background:rgba(255,255,255,1.00); margin:5px; }	
	ul.topnav.responsive li a:hover{background:rgba(255,255,255,1.00); border:#000 solid 1px; }
}

@media screen and (max-width:900px) {
	.lineamientos{width:30%; max-width:450px;}
}

@media screen and (max-width:670px) {
	#contenido{padding-top:70px;}
	.lineamientos{width:45%; max-width:450px;}
	
	header.large img.logo{margin:17px 5px 10px; float: left; height:40px; transition:1.2s;}
	header.small img.logo{margin:17px 5px 20px 15px; float: left; height:35px; transition:1.2s;}
}