/* CSS Document */
body{padding:0px; margin:0px; background:#000000; color:#6f6f6f; font:14px/18px Tahoma, sans-serif;}
div, p, ul, h2, h3, h4, img{padding:0px; margin:0px;}
ul{list-style-type:none;}

.clear {clear: both; margin: 0px}

/* HEADER */

#header{width:775px; height:290px; position:center; background:url(../images/b_top.jpg) 0 0 repeat-x ; margin: 0 auto; padding-bottom:2px;}

#header #logo{width:520px; height:200px; position:absolute; top:26px; left:95px }
#header #logo2{width:850px; height:110px; position:absolute; top:26px; left:95px }
#header #slogan{width:200px; height:50px; position:absolute; top:200px; left:330px; }

.button {
  background-color: #4CAF50; /* Green */
  margin: 13px 12px 2px 0px; 
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  width: 170px
  }
  .button1 {border-radius: 2px;}
  .button2 {border-radius: 2px;}
  .button3 {border-radius: 2px; width: 321px;}
  .button4 {border-radius: 2px; width: 321px;}
  
ul.menu {width:133px; position:absolute; top:50px; left:697px;}
ul.menu li{padding-bottom: 3px}

ul.menu li.home a{width:133px; height:30px; display:block; background:url(../images/btn_home.jpg) 0 0 no-repeat; text-indent:-20000px;}
ul.menu li.home a:hover{width:133px; height:30px; background:url(../images/btn_home_over.jpg) 0 0 no-repeat;}

ul.menu li.about a{width:133px; height:30px; display:block; background:url(../images/btn_about.jpg) 0 0 no-repeat; text-indent:-20000px;}
ul.menu li.about a:hover{width:133px; height:30px; background:url(../images/btn_about_over.jpg) 0 0 no-repeat;}

ul.menu li.programs a{width:133px; height:30px; display:block; background:url(../images/btn_programs.jpg) 0 0 no-repeat; text-indent:-20000px;}
ul.menu li.programs a:hover{width:133px; height:30px; background:url(../images/btn_programs_over.jpg) 0 0 no-repeat;}

ul.menu li.contacts a{width:133px; height:30px; display:block; background:url(../images/contactos.jpg) 0 0 no-repeat; text-indent:-20000px;}
ul.menu li.contacts a:hover{width:133px; height:30px; background:url(../images/contactos2.jpg) 0 0 no-repeat;}

ul.buttons {position:absolute; top:307px; left:260px;}
ul.buttons li{float:left;}

ul.buttons li.contest a{width:500px; height:50px; display:block; background:url(../images/whatsapp.png) 50px 0 no-repeat;}
a:active{
  color: blue;
}
a{color: white;
}

/* CONTENT */

#content{width:727px; position:relative; background:#00 0 0 no-repeat; margin: 0 auto 10px auto; clear:both; padding:28px 20px 0 28px; }
#content p a{font:12px/16px Tahoma, sans-serif; color:#026fe3; text-decoration:none;}
#content p a:hover{color:#000;}

#leftPan{width:150px; float:left; padding-right:43px;}
#leftPan2{width:150px; float:left; padding-right:43px;}

#programs{width:150px; height:400px; position: relative; padding-top: 15px;}
#programs h2{width:107px; height:18px; background:url(../images/h_programs.gif) 0 0 no-repeat; =""; padding-bottom:10px}
#programs p{width:131px; position:relative; padding: 0 0 10px 0; }
#programs p span{width:128px; height:16px; display: block; position:relative; padding: 0 0 0 3px; background:#efefef; font:12px/14px Tahoma, sans-serif; color:#000000;}

#middlePan{width:342px; float:left; padding-right:1px; }

#welcome{position: relative; padding: 0px 0px 0px 0px;  }
#welcome h2{width:337px; height:45px; position:relative;}
#welcome p{width:196px; position:relative; padding: 19px 2px 25px 144px; }
#welcome p span{font:12px/14px Tahoma, sans-serif; color:#F;}

ul.links{width:339px; border-top: #cfd8d9 1px solid; position:relative; padding: 0px 0 0 0; margin-left:3px; }
ul.links li a{width:311px; height:16px; display:block; font:10px/16px Tahoma, sans-serif; color:#026fe3; text-decoration:none; background:url(../images/arrow.jpg) 17px 6px no-repeat; padding: 0 0 0 28px; }
ul.links li a:hover{color:#000;}

#rightPan{width:180px; float:left; }
#rightPan h3{width:180px; height:8px; position:relative; padding: 0 0 20px 0}
#rightPan p a{font:14px/16px Tahoma, sans-serif; color:#026fe3; text-decoration: underline;}

#rightPan p.news1{width:150px; position:relative; padding: 4px 2px 25px 52px; background:url(../images/foto2.png) 2px 0 no-repeat; font:12px/14px Tahoma, sans-serif;}
#rightPan p.news2{width:150px; position:relative; padding: 4px 2px 25px 52px; background:url(../images/foto5.png) 2px 0 no-repeat; font:12px/14px Tahoma, sans-serif;}
#rightPan p.news3{width:150px; position:relative; padding: 4px 2px 25px 52px; background:url(../images/foto6.png) 2px 0 no-repeat; font:12px/14px Tahoma, sans-serif;}
#rightPan p.news4{width:150px; position:relative; padding: 4px 2px 25px 52px; background:url(../images/foto15.png) 2px 0 no-repeat; font:12px/14px Tahoma, sans-serif;}

/* ADS */

#ads{width:775px; position:relative; margin: 600px auto auto auto; clear:both; padding:0 0 0 0px;}

#contacts{width:95px; float:left; }
#contacts h2{width:79px; height:18px; font:12px/14px Tahoma, sans-serif; color:#ffffff;; background:url(../images/contactos2.jpg) 0 0 no-repeat; position:relative; padding-bottom:10px}
#contacts p{font:12px/14px Tahoma, sans-serif; color:#fafafa; padding-bottom:5px; padding-left:5px;}
#contacts p a{font:10px/12px Tahoma, sans-serif; color:#ffffff;}
#contacts p a:hover{color:#ffffff; text-decoration:underline;}

#ad1{width:160px; height:250px; position:relative; float:left; padding-right:15px; }
#ad1 h2{width:128px; height:35px; position:absolute; top:10px; left:5px;}
#ad1 p{width:118px; padding: 20px 0 0 75px; font:10px/12px Tahoma, sans-serif; }

#ad2{width:160px; height:250x; float:left; position:relative; padding-right:15px; }
#ad2 h2{width:200px; height:35px; position:absolute; top:10px; left:5px;}
#ad2 p{width:196px; padding: 20px 0 0 85px; font:10px/12px Tahoma, sans-serif; }

#ads p span{font:11px/12px Tahoma, sans-serif;  color:#000; }

/* FOOTER */

#footer{width:727px; height:64px; position:relative; background:url(../images/line_footer.jpg) 0 0 no-repeat; margin: 0 auto; clear:both;}
#footer p{padding:20px 0 0 10px; font:10px/14px Tahoma, Arial, Helvetica, sans-serif; font-weight:normal; text-align:center; color:#737474; display:block; }
#footer a{font:10px/14px Tahoma, Arial, Helvetica, sans-serif; font-weight:normal;  color:#737474; text-decoration:none; padding: 0 5px}
#footer a:hover{color:#FFF; text-decoration:none; background:#000;}
.sponsor {
	margin: auto;
	width: 728px;
	padding-top: 5px;
	padding-bottom: 15px;
	text-align: center;
}
.sponsor img {
	margin-top: 5px;
	background: #555
}


.galeria {
  height: calc( 600px + 3em);
  width: 860px;
  margin:1em auto;
  border: 1px solid #555;
  position: relative;  
}

.galeria img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 3s;
}

.galeria input[type=radio] {
  position: relative;
  bottom: calc(-600px - 1.5em);
  left: .5em;
}

.galeria input[type=radio]:nth-of-type(1):checked ~ img:nth-of-type(1) {
  opacity: 1;
}

.galeria input[type=radio]:nth-of-type(2):checked ~ img:nth-of-type(2) {
  opacity: 1;
}

.galeria input[type=radio]:nth-of-type(3):checked ~ img:nth-of-type(3) {
  opacity: 1;
}

.galeria input[type=radio]:nth-of-type(4):checked ~ img:nth-of-type(4) {
  opacity: 1;
}
.galeria2 {
  height: calc( 600px + 3em);
  width: 520px;
  margin:1em auto;
  border: 1px solid #555;
  position: relative;  
}
 .galeria2 img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 3s;
}

.galeria2 input[type=radio] {
  position: relative;
  bottom: calc(-600px - 1.5em);
  left: .5em;
}

.galeria2 input[type=radio]:nth-of-type(1):checked ~ img:nth-of-type(1) {
  opacity: 1;
}

.galeria2 input[type=radio]:nth-of-type(2):checked ~ img:nth-of-type(2) {
  opacity: 1;
}

.galeria2 input[type=radio]:nth-of-type(3):checked ~ img:nth-of-type(3) {
  opacity: 1;
}

.galeria2 input[type=radio]:nth-of-type(4):checked ~ img:nth-of-type(4) {
  opacity: 1;
}
.galeria3 {
  height: calc( 500px + 3em);
  width: 860px;
  margin:1em auto;
  border: 1px solid #555;
  position: relative;  
}
 .galeria3 img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 3s;
}

.galeria3 input[type=radio] {
  position: relative;
  bottom: calc(-500px - 1.5em);
  left: .5em;
}

.galeria3 input[type=radio]:nth-of-type(1):checked ~ img:nth-of-type(1) {
  opacity: 1;
}

.galeria3 input[type=radio]:nth-of-type(2):checked ~ img:nth-of-type(2) {
  opacity: 1;
}

.galeria3 input[type=radio]:nth-of-type(3):checked ~ img:nth-of-type(3) {
  opacity: 1;
}

.galeria3 input[type=radio]:nth-of-type(4):checked ~ img:nth-of-type(4) {
  opacity: 1;
}