@import url('body.css');
@import url('content.css');

/**/
#container{ max-width: 100%;; width:100%; margin-right: auto; margin-left: auto; text-align: left;}
#content{ float:left; width:100%;}
#top{float:left; width:100%; height:auto; padding:30px 0px;  }
#topinside{float: left;
    width: 100%;
    height: auto;
    padding: 0px 0px;
    background-image: url(../img/img_02.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;}
#nav{float:left; width:100%;  background-color:#4E4546;}
#slide{float:left; width:100%; height:auto; background-color:#ccc; position:relative;  }
#footer{float:left; width:100%;  padding:20px 0px; color:#000; font-size:11px; bottom:0px; z-index:2; }

.center{ max-width: 1200px; width:100%; margin-right: auto; margin-left: auto; }


@media only screen and (max-width: 1234px) {
.center{ width:96%; padding:0% 3%; box-sizing:border-box;  }	
}

@media only screen and (max-width: 768px) {
#footer{ padding:20px; box-sizing:border-box;}

}

/*LINKS*/
.links{ text-decoration:none; color:#09F;}
.links:hover{ text-decoration:underline;}

/*TOP*/
.logo{ width:200px; margin:auto; display:block; }
.logo2{width: 300px; }
.logo a { display: block; text-indent: -100px; overflow: hidden;}
.top_box1{float:left;  width:100%;}
.top_box2{float:left; width:100%;}



@media only screen and (max-width: 768px) {
.logo2{ width:100%; margin:auto; float:none; margin-top:10px; }

}


/*CONTENT*/
.module_1{float:left;  width:100%; padding:0px 0px;}
.module_2{float:left; width:100%; padding:30px 0px;}
.module_3{float:left;  width:100%; padding:30px 0px;}
.module_4{float:left;  width:100%; padding:30px 0px;}

/*FOOTER*/
#foooter{ display:table;}
.footer_box{float:none;  width:20%; display: table-cell; vertical-align: top;}
.footer_box1{float:left;  width:100%;}
.footer_box2{float:left;  width:100%;}
.footer_box3{float:left;  width:100%;}
.footer_box4{float:left;  width:100%;}
.footer_box .title{ font-size:14px; margin-bottom:15px;}

@media screen and (max-width: 780px) {
.footer_box{float:left;  width:100%; margin-bottom:25px;}
}



/* /////////   GRALS  //////// */

.title{float:left; width:100%;}
.subtitle{float:left; width:100%;}
.data{float:left; width:100%;}
.tex_center{ text-align:center !Important;}

/*CENTER DIVS*/
.center_divs {
	float:left;
	width:100%;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
	    justify-content: space-evenly;
		
}

.gallery{ width:33.1%;}
.gallery img{ width:100%; }

@media screen and (max-width: 768px) {
 .gallery{ width:49.5%; margin:1px;}
}



/* //////////   MENUS  //////// */

/*MENU VERTICAL*/
#menuv { }
#menuv ul, li { list-style-type: none; }
#menuv ul { margin: 0; padding: 0;  list-style-type: none;}
#menuv li { border-bottom: 1px solid #ACCFE8; }
#menuv a { text-decoration: none; color: #000; display: block; padding: 3px 6px; width: 148px; }
#menuv a:hover { background: #DBEBF6; }


/*MENU HORIZONTAL*/
#menuh { }
#menuh ul, li { list-style-type: none; }
#menuh ul { margin: 0; padding: 0; }
#menuh li { float: left; }
#menuh a { text-decoration: none; color: #000; display: block; padding: 3px 10px; text-align: center; }
#menuh a#primero { border-left: 1px solid #ACCFE8; }
#menuh a:hover { background: #DBEBF6; }


/*MENU CENTRADO*/
#menuc { }
#menuc ul { list-style-type: none; margin: 0 auto; padding: 0; text-align: center; }
#menuc li { display: inline; padding: 5px; margin: 1px; }
#menuc a { }
#menuc a:hover { background: #DBEBF6; }



/*CONTACTO*/

#contact-area * { margin: 0; padding: 0; }
#contact-area p { font-size: 1.3em; margin-bottom: 15px; }
#contact-area { width: 100%; }
.input {
    padding: 20px;
    width: 100%;
    font-size: 25px;
    border: none;
    color: #000;   
    margin-bottom: 20px;
    border-radius: 5px;
    text-align: center;
	box-sizing:border-box;
	background-color: #D9D9D9;
	}
.input2 {
    padding: 20px;
    width: 100%;
    font-size: 20px;
    border: none;
    color: #000;   
    margin-bottom: 20px;
    border-radius: 5px;
    text-align: center;
	box-sizing:border-box;
	text-align:left;
	background-color:#f2f2f2;
	}

	
#contact-area textarea { padding: 5px; width: 100%; font-family: Helvetica, sans-serif; font-size: 12px; border: 1px solid #ccc; color: #000; float: left; margin-top: 0px; margin-right: 0px; margin-bottom: 10px; margin-left: 0px; }
#contact-area textarea { height: 90px; }
#contact-area textarea:focus, #contact-area input:focus { border: 1px solid #900; }
.submit-button {
	width: auto;
    /* float: right; */
    background-color: #2C54A0;
    color: #fff;
    padding: 15px;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    margin: auto;
    display: block;	
}
#contact-area label { float: left; text-align: left; margin-top: 15px; width: 100px;   }

@media screen and (max-width: 768px) {
	.input {
		font-size: 20px;
		}
}

/*LISTADO*/
.list { list-style-type: none; margin: 0; padding: 0;  }
.list li { margin: 0; padding: 0;  list-style-type: none; padding-bottom:5px; padding-left:30px;  width: 100%; float: left; }

.list li:nth-child(1) { background-image: url(../img/icos/03.png); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.list li:nth-child(2) { background-image: url(../img/icos/03.png); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.list li:nth-child(3) { background-image: url(../img/icos/03.png); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.list li:nth-child(4) { background-image: url(../img/icos/04.png); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.list li:nth-child(5) { background-image: url(../img/icos/05.png); background-position:center left; background-repeat:no-repeat; background-size:contain;}

/**/
.background_main{background-image: url(../img/fondo.jpg);
    background-position: center left;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #24388E;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}
.position_top{ z-index: 1; position:relative; }
.box_home{ width:500px; margin:40px auto; display:block; padding-top: 10%; }
.box_home_01{float:left; width:100%; }
h1{
	text-transform: uppercase !important;
    font-style: italic !important;
    color: #000000 !important;
    letter-spacing: -1px !important;
    font-weight: 900 !important;
    margin: 0 0 20px 20px !important;
    font-size: 3.6rem !important;
}
.black { color:#000 !important;}
.mb{ margin-bottom: 30px;}


/**/
@media screen and (max-width: 1024px), screen and (max-height: 700px) {
  .box_home{ width:300px; }
  #top{ padding:10px 0px;  }
	h1{
		margin: 0 0 20px 0px !important;
		font-size: 3rem !important;
	}
}

@media screen and (max-width: 1024px) {
.box_home{ width:500px; margin:0px auto; display:block; }
}


@media screen and (max-width: 768px) {
.box_home{ width:400px; margin:0px auto; display:block; }
}

@media screen and (max-width: 768px), screen and (max-height: 700px) {
  .box_home{ width:300px; }
  #top{ padding:10px 0px;  }
}

@media screen and (max-width: 568px) {
.box_home{ width:360px; margin:0px auto; display:block; }
}

@media screen and (max-width: 468px) {
.box_home{ width:280px; margin:0px auto; display:block; }
}

/**/
.cargar_but{background-image: url(../img/ico_06.png); background-position:center left; background-repeat:no-repeat; background-size:contain; padding-left:50px; height:40px; line-height:40px; display: block; color:#000; text-decoration:none;  }


/**/

.menu_options{ 
    width: 350px;
    float: left;
    background-color: #000000;
    padding: 30px;
    position: absolute;
    bottom: -20px;
    z-index: 10;
    border-radius: 20px 20px 0 0;
	box-sizing:border-box;
}

.menu_options ul{ margin: 0; padding: 0;  list-style-type: none;}
.menu_options ul li{ margin:10px 0; padding: 0;  list-style-type: none; line-height:30px; padding-left:40px; display:block:}
.menu_options ul li a{ color:#fff !important; font-size:15px; text-decoration:none; text-transform:uppercase; }
.menu_options ul li:nth-child(1) { background-image: url(../img/ico_01.jpg); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.menu_options ul li:nth-child(2) { background-image: url(../img/ico_02.jpg); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.menu_options ul li:nth-child(3) { background-image: url(../img/ico_03.jpg); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.menu_options ul li:nth-child(4) { background-image: url(../img/ico_04.jpg); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.menu_options ul li:nth-child(5) { background-image: url(../img/ico_05.jpg); background-position:center left; background-repeat:no-repeat; background-size:contain;}
.menu_options ul li:nth-child(6) { background-image: url(../img/ico_07.png); background-position:center left; background-repeat:no-repeat; background-size:contain; margin-top:50px;}

@media screen and (max-width: 768px) {
	.menu_options{ 
		width: 350px;
		bottom: -18px;
	}
	.menu_options ul li a{ color:#fff; font-size:12px; text-decoration:none; text-transform:uppercase; }
}

/* Button used to open the chat form - fixed at the bottom of the page */
.open-button {
    position: fixed;
    width: 350px;
    height: 60px;
    bottom: 0px;
	right: 28px;
    background-color: #000000;
    color: #FFF;
    border-radius: 20px 20px 0 0;
    font-size: 30px;
	z-index: 9999;
	border: none;
	}



/* The popup chat - hidden by default */
.chat-popup {
    width: 350px;
  display: none;
  position: fixed;
  bottom: 0;
  right: 31px;
  border: 3px solid #f1f1f1;
  z-index: 9;
  bottom: 60px;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  background-color: #EDEDED;
}

/* Full-width textarea */
.form-container textarea {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: none;
  background: #f1f1f1;
  resize: none;
  min-height: 200px;
}

/* When the textarea gets focus, do something */
.form-container textarea:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit/send button */
.form-container .btn {
	background-color: transparent;
    border: none;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}


.col_central{ width:70%;  padding:0 15%; }
@media screen and (max-width: 768px) {
	.col_central{ width:100%;  padding:0; }
}

.custom-file-input {
  color: transparent;
  width: 100%;
  background-color: #f2f2f2;
  padding: 20px;
  box-sizing: border-box;
}
.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input::before {
  content: 'Seleccione una fotografia';
  color: black;
  display: inline-block;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
}
.custom-file-input:hover::before {
  border-color: black;
}
.custom-file-input:active {
  outline: 0;
}
.custom-file-input:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9); 
}
.fancybox-close {
    top: -1px !important;
    right: -4px !important;
    width: 46px !important;
    height: 38px !important;
}