@import url("reset.css");
@import url("fonts.css");
body{ padding:0px; margin:0px; font-size:12px; font-family: 'GothamRounded-Book'; color:#f5f5f5; }
html, .h100 {height: 100%;}

/* Anchors
---------------------------------------------------*/
h1 {font-family: 'amaticbold'; font-weight:normal; font-size:55px; margin:0 0 25px 0; display:block; color:#3D3D3D; line-height:55px;}
h2 {font-family: 'amaticbold'; font-weight:normal; font-size:43px; margin:0 0 25px 0; display:block; color:#FFF; line-height: 43px;}
h3 {}
p { line-height:17px; margin:0 0 15px 0;}
p.lead {color:#EAB63D; font-family: 'GothamRounded-Book'; font-size:18px;}
a:focus { outline:none;}
a{ text-decoration:none; color:#fff; }
a:hover { text-decoration:none;}
.trans {-webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}

/* Font Hacks
---------------------------------------------------*/
.font-09{ font-size:9px; } .font-10{ font-size:10px; } .font-11{ font-size:11px; } .font-12{ font-size:12px; } .font-14{ font-size:14px; } .font-16{ font-size:16px; } .font-18{ font-size:18px; } .font-19{ font-size:19px; } .font-20{ font-size:20px; } .font-21{ font-size:21px; } .font-22{ font-size:22px; } .font-24{ font-size:24px; } .font-25 { font-size:25px;} .font-26{ font-size:26px; } .font-27{ font-size:27px;} .font-28{ font-size:28px; } .font-30{ font-size:30px; } .font-31{ font-size:31px; } .font-32{ font-size:32px; } .font-34{ font-size:34px; } .font-36{ font-size:36px; } .font-48{ font-size:48px; } .font-72{ font-size:72px; } .font-80{ font-size:80px; } .font-48{ font-size:48px;}
.flota-50{ width:50%; float:right; height:200px;}
.flota-49{ width:49%; float:left; }
.text-left { text-align:left;}
.text-center { text-align:center;}
.text-rigt { text-align:right;}
.text-justify { text-align:justify;}

/* Button
---------------------------------------------------*/

/* Wrapper
--------------------------------------------------*/
.header { width:100%; height:130px; float:left; background:#3c3c3c; position:relative; }
.head-line{ width:100%; height:10px; background:url(../images/bg-header.jpg) center center repeat; position:absolute; left:0px; bottom:-10px;}
.content { width:980px; margin:auto; position:relative; }
.logo{ background:url(../images/logo-retto-koru.png); width:160px; height:130px; float:left; }
.logo a{ display:block; width:160px; height:130px; }
.head-cont{ width:650px; height:130px; float:right; }
.networks{ width:144px; height:29px; float:right; margin-top:10px; margin-bottom:20px; background:url(../images/bg-networks.png); margin-right:10px; }
.networks a{ display:block; width:36px; height:29px; float:left; }
.menu{ width:650px; height:55px; float:right; font-family: 'brush_upregular'; font-size:17px; color:#fff; }
.menu a{ display:block; width:auto; height:45px; padding-top:10px; padding-left:12px; padding-right:12px; float:left; }
.menu a:hover, .current{ color:#f2cf03 !important; }
.separa{ width:3px; height:53px; float:left; background:url(../images/bg-separa.png); }

#home { margin:60px auto 30px auto;}
#bx-home-pager { display:block; margin:15px 0 0 0; width:100%; text-align:center;}
#bx-home-pager a { margin:0 10px; display:inline-block;}

#nosotros {margin:60px auto 30px; background:url(../images/piensa.jpg) no-repeat center top; height:2910px; position:relative;}
#nosotros .content {height:2910px;}
#nosotros p {color:#6D6C6C; font-size:14px;}
.block1 { width:510px; position:absolute; top:213px; text-align:center; left: 50%; margin-left: -255px;}
.block2 { width:400px; position:absolute; top:570px; text-align:center; left: 50%; margin-left: -200px;}
.block2 p, .block3 p, .block4 p, .block5 p {color:#FFF!important;}
.block3 { width:340px; position:absolute; top:1380px; text-align:center; right:60px;}
.block4 { width:370px; position:absolute; top:1448px; text-align:center; left:60px;}
.block5 { width:340px; position:absolute; top:2528px; text-align:center; left:80px;}
.gotop { display:block; position:absolute; background:url(../images/gotop.jpg) no-repeat left top; width:194px; height:47px; left:50%; margin-left:-97px; bottom:-52px;}


#slider { position:relative;}
#slider .img { width:480px; float:left;}
#slider .info { width:500px; height:350px; float:left; background-color:#3a3a3a; font-size:14px; line-height:18px;}
#slider .info > div { padding:20px;}
#slider > a { font-size:35px; color:#FFF; position:absolute; bottom:15px; z-index:100;}
#slider a#home-prev { right:60px;} #slider a#home-next { right:15px;}
#slider .close { top:-21px; right:-22px;}

#slider-us { position:relative; margin:20px 0; color:#000;}
#slider-us img { display:block; margin:0 0 5px 0;}
#slider-us .tl { font-size:43px; display:block; color:#3D3D3D; font-family: 'amaticbold'; margin:0 0 5px 0; text-align:center; line-height:35px;}
#slider-us .inf { display:block; text-align:center;}

#eventos { margin:70px 0 25px 0;}
.evento { float:left; width:245px; height:245px; position:relative;}
.evento .ovr {position:absolute; top:0; left:0; display:block; width:100%; height:100%; text-align:center; background-color:#c210a2; color:#FFF; font-size:50px; font-family: 'amaticbold'; vertical-align:central;
opacity:0;
-moz-opacity:0;
filter:alpha(opacity=0);
-webkit-transition: all 0.3s ease 0s; 
-o-transition: all 0.3s ease 0s; 	
transition: all 0.3s ease 0s;
}
.evento:hover .ovr {
opacity:1;
-moz-opacity:1;
filter:alpha(opacity=100);
}

.secccion-eventos { background:url(../images/evento-bg.png) no-repeat center center; margin:100px 0;}
.secccion-eventos .content { width:850px; margin:0 auto; position:relative;}
.pal-feis { background:url(../images/pos-la-foto.png) no-repeat left top; width:429px; height:429px; padding:54px 27px 99px 24px; float:left; position:relative;}
.pal-feis > a { font-size:35px; color:#000; position:absolute; bottom:40px; z-index:100;}
.pal-feis a#evento-prev { left:30px;} .pal-feis a#evento-next { right:30px;}
.pal-feis h1 { margin:10px 0 0 0; display:block; text-align:center;}
.detalles { float:left; margin:180px 0 0 20px; width:330px;}
.secccion-eventos .content .close { position:absolute; top:115px; right:0; z-index:200;}
.close { width:44px; height:43px; background:url(../images/icons/close.png) no-repeat left top; cursor:pointer;}



#donde { background-color:#3a3a3a; position:relative; padding:18px; width:725px; margin:30px auto 20px;}
.bx-donde > div { background-color:#FFF; padding:15px;}
.bx-donde .bx-controls-direction { position:absolute; width: 100%; z-index: 400;  top: 50%;}
.bx-donde .bx-controls-direction .bx-prev, .bx-donde .bx-controls-direction .bx-next {width:21px; height:34px; top:0; position:absolute; text-indent:-99999px;}
.bx-donde .bx-controls-direction .bx-prev { left:0px; background:url(../images/icons/gale-prev.png) no-repeat left top;}
.bx-donde .bx-controls-direction .bx-next { right:0px; background:url(../images/icons/gale-next.png) no-repeat left top;}
.gale-donde ul {}
.gale-donde ul li { float:left; width:150px; height:150px; margin:0 11px 11px;}
#donde span.pikito { background:url(../images/pikito-donde.png) no-repeat left top; width:45px; height:42px; position:absolute; bottom:-42px; left:200px;}
#bx-donde-pager { margin:8px 0 0 0;}
#bx-donde-pager a {font-family: 'amaticbold'; color:#FFF; font-size:32px; display:inline-block; margin:0 10px 0;}
#bx-donde-pager a:last-child { margin:0;}
#bx-donde-pager a:hover, #bx-donde-pager a:hover i, #bx-donde-pager a.active {color:#F2CF03;}
#bx-donde-pager a i { margin:0 3px 0 0;}


#fundaciones { margin:30px 0;}
.funda { text-align:center; color:#000; float:left; width:200px;}
.funda img { margin:0 auto 10px;}
.funda a.more { display:inline-block; color:#6e6c6c; padding:3px; width:20px; height:20px; line-height:20px; border:solid 2px #3a3a3a; margin:10px 0 0 0; font-size:20px;
-webkit-border-radius:25px;
-moz-border-radius:25px;
border-radius:25px;
}
.funda a.more i {color:#6e6c6c; line-height:20px;}
.bwWrapper {
    display: block;
    position: relative;
}
.bwWrapper canvas {
    width: 170px;
}

#contacto { background:url(../images/contacto.png) no-repeat left top; width:985px; height:487px; margin:60px auto 30px;}
#contacto form { width:406px; padding:125px 0 0; margin:0 auto;}
#contacto form input[type="text"] {height:30px; width:406px; border:none; background:url(../images/input-text.png) no-repeat center bottom; color:#B2B1B1; font-family: 'GothamRounded-Book'; font-size:17px; margin:0 0 15px 0;}
#contacto form textarea { width:406px; border:none; background:url(../images/input-text.png) no-repeat center bottom; color:#B2B1B1; font-family: 'GothamRounded-Book'; font-size:17px; margin:0 0 15px 0;}
#contacto form input[type="text"]:focus, #contacto form textarea:focus {color:#F2CF03;}
#contacto form button { float:right; margin:0 0 0 10px; border:none; font-size:33px; color:#FFF; font-family: 'amaticbold'; background-color:transparent; cursor:pointer;}
h2.send { display:block; padding:250px 0 0 0; text-align:center;}
label.error { font-size:11px; color:#F00; margin-top:-8px; position:relative;}

#footer { background:url(../images/footer.png) repeat-x center top; height:176px; margin:50px 0 0 0; padding:20px 0 0 0;}
.col-f-1, .col-f-2, .col-f-3, .col-f-4 { float:left;}
.col-f-1 { width:255px; text-align:center;}
.col-f-2 { width:240px; text-align:center;}
.col-f-3 { width:245px;}
.col-f-4 { width:220px; padding:0 0 0 20px; font-size:13px;}
.direccion { background:url(../images/footer-icons.png) no-repeat left top; padding:5px 0 25px 25px; margin:0 0 0 15px;}
.direccion ul li { font-size:13px; margin:0 0 10px 0;}


/* start hover effect
---------------------------------------------------*/
.trans {
-webkit-transition: all 0.3s ease 0s; 
-o-transition: all 0.3s ease 0s; 	
transition: all 0.3s ease 0s;
}

/*rotate*/
.rotate{
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
.rotate:hover {
  -webkit-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
          transform: rotate(360deg);
}
li.active a img.rotate {
  -webkit-transform: rotate(90deg);
     -moz-transform: rotate(90deg);
       -o-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}
/*rotate*/

/*expand*/
.expand
{
	-webkit-transition:all 100ms;
	-o-transition:all 100ms;
	transition:all 100ms;
}

.expand:hover, .circle.active
{
	-webkit-transform:scale(1.05, 1.05);
	-o-transform:scale(1.05, 1.05);
	transform:scale(1.05, 1.05);
}
/*expand*/

/*opacity*/
.opacity{
opacity: 1;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 250ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 250ms;
}
.opacity:hover{
opacity: 0.8;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 250ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 250ms;
}
/*opacity*/
/*end hover effect*/

/* CLEARING
---------------------------------------------------*/
.clear5px{clear:both;height:5px;}
.clear7px{clear:both;height:7px;}
.clear10px{clear:both;height:10px;}
.clear15px{clear:both;height:15px;}

.clear { clear:both;}
.clearfix:after {content: "."; display:block; height: 0; clear: both; visibility: hidden;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

