/*
Theme Name: Skateskola
Version: 1.0
Made in exts
*/

/* Overwrites and Tag Declerations
----------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: top;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 1;
	background:#fff;
	color:#000;	
	background-position:center center!important;
	background-size: cover!important;
}
html, body {  width: 100%;height: 100%; }

ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
:focus {
	outline: 0;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a {
	color: #666;
	outline: none;
	text-decoration: none;
}
a:hover {
  color: #000;
}
a img {
	border: none;
}

ul li{ list-style-type:none; display:inline;}

p{font-size-adjust: none;font-stretch: normal;font-style: normal;font-variant: normal;font-weight: normal;letter-spacing: 0;line-height: normal;word-spacing: normal; }

.font1 {font-family: 'Roboto Condensed', sans-serif; text-transform:uppercase;}
.font2{ font-family: 'Permanent Marker', cursive; }
.font3 { font-family: 'Open Sans', sans-serif; }

.shadow {
	text-shadow: #000000 0 1px 1px;
	zoom:1;
	filter: progid:DXImageTransform.Microsoft.Glow(Color=#000000,Strength=1);
	-ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=-1, OffY=-1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=-1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=-1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=0, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=1, OffY=1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=-1, OffY=1, Color=#000000)progid:DXImageTransform.Microsoft.dropshadow(OffX=-1, OffY=0, Color=#000000)";
	
	}




/* menu
----------------------------------------------- */
a.menu_button{ width: auto; height: auto; padding:14px 30px; letter-spacing:.04em; font-size:18px; position:fixed; top:45px; right:5%; background:#000; color:#fff; z-index:10; cursor:pointer; text-transform:uppercase; border:1px dashed #fff;
-moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
 display: none;	}
a.menu_button:hover{ background:#fff; color:#000; border:1px dashed #000;   }

.destacada{ position: fixed; width:100%; height: auto; z-index:7;  }

.menu-container{ position: fixed; background: url(images/50.png)repeat center center; width:100%; height: auto; z-index:8; display:block; padding: 0; top:0;  border:1px dashed #666; border-left:none; border-right:none; }
.menu a{ text-decoration: none; display: inline-block; color: #fff;font-size: 16px; margin:0 20px; padding:0; width: auto; height: auto; text-align:center;line-height: 150px; letter-spacing:0.02em;  }

.menu a:hover, .menu .current_page_item a:hover, .menu .current-menu-item a{ color:#ffd200; }

.menu .children{ display: none; }
.menu .menu li:hover .children{ display: none; }

.menu { text-align:center; background: none;  }

.menu ul li { display:block }
.menu .menu { position: relative; top: 80px; border-bottom:40px solid #fff; display:none; }

		.menu-item-25 a{   background: url("images/la-kantera-skate-eskola-logo-3.png") no-repeat scroll center top; background-size: cover;
    display: inline-block;
    width: 150px;
    height: 150px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-indent: -200em;
    top: 0;
    z-index: 12;
		}
	
		.menu-item-25 a:hover{   background: url("images/la-kantera-skate-eskola-logo-3.png") no-repeat scroll center bottom;background-size: cover; }
		
		
.sticky .menu-item-25 a{  width: 80px; height: 80px;  }	
.sticky .menu a{ font-size: 14px; line-height:80px; }	
.sticky.menu-container{ margin:0; background:#000; }	

.menu a{ -webkit-transition: width 0.2s, height 0.2s; /* Safari */ transition: width 0.2s, height 0.2s; }		
		
/* contenidos
----------------------------------------------- */

.contents{ width: 100%; height:auto; margin:0 auto 0 auto; padding: 0; position:relative; top: 152px; background:#ffd200; }
.contents.sticky{ -webkit-transition: width 0.2s, height 0.2s; /* Safari */ transition: width 0.2s, height 0.2s; margin:82px auto 0 auto; }		
.contents.dos{ margin:0 auto;}
.capa{ color:#000; text-align:center; padding:20px 0; max-width:600px; margin:0 auto; position:relative; }
.columna{ width:274px; }
.titulos{ margin:18px 0 0 0; font-size:22px; position:absolute; right:10px; }
.blog .titulos{ margin:20px 0 10px 0; font-size:24px; }
.blog .titulos a{ color:#000; }
p{ margin:0 0 10px 0; }
.formulario{ text-align:left; margin:40px auto; width:85%; font-size: 13px; }
.texto{ margin:20px 0; }
.capa img{ width:100%; height:auto; }
.capa.contacto img{ width: auto; height:auto; }
.capa.contacto { font-size:18px }
.capa a { color:#000 }
.capa a:hover { border-bottom:1px dashed #000; }
.post{ margin:0 0 25px 0; border-bottom:1px dashed #333; }
.single .post{ border:none; }
.capa.blog{ color:#000; text-align:left; padding:20px;  }
.capa.blog.single{ color:#000; text-align:left; padding:20px; max-width:700px; }
.capa.blog.single .post{ float:left; width:70% }
.capa.blog .titulos{ margin:20px 0; font-size:22px; position:relative; right:0; }
.sidebar{ float:right; width:170px; line-height:1.1em; }
.sidebar.sticky .content{ position: fixed; top:100px;}
.sidebar .titulos{ font-size:18px; }
.sidebar a{ color:#000; font-size:13px; display:block; border-bottom: 1px dashed #ffd200; margin:0 0 3px 0; }
a.leermas { color: #000; display: block; float: none; font-size: 12px; height: 20px; margin: 0 0 10px; text-align: right; width: 100%; }
a.leermas:hover { border:none; }
.columna { display:inline-block; margin:0 0 0 0; padding:0 25px 0 0; border-right: 1px solid #333; text-align:left; }
.columna.dos { margin:0 0 0 20px; padding:0 0 0 0; border-right: none; text-align:left; }
.columna.total { margin:20px 0; padding:0 0 0 0; border-right: none; text-align:left; width:100%; border-right:5px solid #000; }
.columna.total li { display:block; margin:0 0 10px 0; list-style-type: circle!important;  }
.columna.total em { text-align:right; float:right; clear:left }
.galerias{ width:100%; height:auto; display:none;  }
.galerias img{ width:100%; height:auto; max-width:300px; }
.galerias br{ display:none; }
.interior{ width:400px; }
blockquote p{ font-style:italic; }

.interior em{ font-style:normal; font-size:19px }
.gallery .gallery-item{ width: 25%; height:auto; display:inline-block; margin:0; }
.blog .gallery .gallery-item{ width: 50%; height:auto; display:inline-block; }
.gallery br{  display: none; }
.texto img{ margin-bottom:10px; }
.gallery img{ margin:0 0 10px 0; }
.galerias{ margin-bottom:10px; float:left; text-align:center; }

.kirolak{ width: 90px; height:68px; background:url(images/getxo-kirolak.jpg) no-repeat; display:inline-block; overflow:hidden; text-indent:-200em; background-size: cover; margin:30px 0 0 0 }
.acero{ width: 120px; height:45px; background:url(images/acero-eskola.jpg) no-repeat; display:inline-block; overflow:hidden; text-indent:-200em; background-size: cover; margin:20px 0 0 0 }
.turismo{ width: 120px; height:200px; background:url(images/turismo_familia_cas.jpg) no-repeat; display:block; overflow:hidden; text-indent:-200em; background-size: 100% auto; margin:20px auto; }


.grecaptcha-badge { visibility: hidden; }
.wpcf7-form small{ font-size: 10px; font-weight: normal; color: #333; margin: 30px 0; display: block; }


/* footer
----------------------------------------------- */

.footer  { background:#000;   position: relative;
  top: 152px;
} }



.columna h2{ font-family: "Roboto Condensed",sans-serif; margin:0 0 20px 0; font-size:20px; font-weight:normal; text-transform:uppercase }

.columna strong{  }

.columnas{ width:100%; height: auto;  background:#ccc; color:#666; border-top: 1px dashed #666; padding: 0; text-align:center; }

.columnas.dos{ background:#000; color:#fff; padding:40px 0 40px 0; text-align:center; font-size:13px;  }


.footer .titulos.font2 { margin:20px 0 0 0; font-size:24px; }

.footer a { color:#fff!important; }
.footer a:hover { color:#ffd200 }

.columnas .content{ text-align:center; width:100%; line-height:25px; }
.footer ul { width: auto; height:auto;  text-align: center; display:inline-block; margin: 20px 0; }
.footer li { width:auto; height:auto;  text-align:left; display:inline-block; margin:5px 0 5px 0; }
.footer .thumb { width: auto; height:35px; overflow:hidden; display:inline-block;  }
.footer .thumb img { width: auto; height:100%;  }
.footer .content .titulos { width:auto; height:auto; display:inline-block; font-size:14px; margin:0 20px 0 10px; height: 35px; line-height:35px;  }
.footer .content li a { color:#888  }
.footer .content li a:hover { color:#333;  }

.footer a.facebook { width:24px; height:30px; background: url(images/redes/facebook.png) no-repeat 5px top; text-indent:-300em; overflow:hidden; display:inline-block; margin:0 10px 0 10px;border-bottom:1px dashed #444; }
.footer a.instagram { width:27px; height:30px; background: url(images/redes/instagram.png) no-repeat 2px top; text-indent:-300em; overflow:hidden; display:inline-block; border-bottom:1px dashed #444; }

.footer a.facebook:hover {  border-bottom:1px dashed #fff; }
.footer a.instagram:hover {  border-bottom:1px dashed #fff; }

.sep{ margin:0 15px; }


textarea, input{ max-width:290px; }



	a.menu_button{ width: 50px; height: 40px;text-indent:-200em; overflow:hidden; padding:0;  position:fixed; top:0; right:0; background: url(images/menu.png) no-repeat center left;border:none;
	}
	a.menu_button:hover{ width: 50px; height: 40px;text-indent:-200em; overflow:hidden; padding:0;  position:fixed; top:0; right:0; background: url(images/menu.png) no-repeat center left; border:none; }


.wpcf7-submit{ padding:20px; margin:30px 0 0 0; background:#fff06d; border:1px solid #ffc000; font-size:18px; text-transform:uppercase; cursor:pointer;  }

.wpcf7-submit:hover{ background:#fff; }

.wpcf7 p{ line-height:2em; }




/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

 #slider{ width: 100%; height:100%;   }
 
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {margin: 0; padding: 0; width: 100%; height:100%;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: visible; overflow: hidden ;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: auto; height:auto; display: block; margin:-10px 0 -10px -10px}
.flex-pauseplay span {text-transform: capitalize;}

.flexslider .slides > li.flex-active-slide {
-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s; 
	transition: all .5s; }

.flexslider .slides li {
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s; }

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > p:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {margin: 0 0 0; border: none; position: relative; zoom: 1; overflow:hidden; }
.flex-viewport {-webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; overflow: hidden;  }
.flex-viewport {position: fixed; width: 100%; height: 100%;  }
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}

.carousel li {margin-right: 5px}


.flexslider .slides,
.flexslider .slides > li
{
    height: 100%;
}

.flexslider .slides > li{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}


/* Direction Nav */
.flex-direction-nav {*height: 0; display:none;}
.flex-direction-nav a {width: 30px; height: 30px; margin: -30px 0 0; display: block; background: url(../images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;}

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: 15px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #fff; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; text-indent:200em;}
.flex-control-paging li a:hover { background: #ffd200;  }
.flex-control-paging li a.flex-active { background: #ffd200; cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {opacity: 1; left: 0;}
  .flex-direction-nav .flex-next {opacity: 1; right: 0;}
}




.post{ max-width:92%; }
iframe{ max-width:100%; margin:10px 0 0; }



/* Media queries
*********************************/

@media screen and (max-width: 760px) {
	.menu a{ margin:0 7px;  }
}


@media screen and (max-width: 620px) {

.columna.total {
    border-right: medium none;
    margin: 20px;
    padding: 0;
    text-align: left;
    width: auto;
}
.titulos {
    font-size: 22px;
    margin: 18px 20px;
    position: relative;
    right: 0;
    text-align: left;
}
.capa {
width: auto;
}

.capa.blog.single .post { width: auto; }
.capa.blog.single {  width: auto;
}

.sidebar {
    float: left;
    line-height: 1.1em;
    width: auto;
}
.sidebar.sticky .content {
    position: relative;
    top: 0;
}
.gallery .gallery-item{ width: 50%;  }

.menu a{ margin:0 3px;  }

}

@media screen and (max-width: 560px) {


a.menu_button{ display:block; }
	

	
.columna.total em {
   border: 1px solid #333;
    clear: left;
    display: block;
    float: none;
    font-size: 22px;
    margin: 10px 0;
    padding: 10px;
    text-align: center;
}

.interior {
    width: auto;
}

.menu a, .sticky .menu a {
    display: none;
    height: auto;
    letter-spacing: 0.02em;
    margin: 0;
    padding: 0;
    text-align: left;
    text-decoration: none;
    width: 100%;
	line-height:37.5px;
	text-indent:25px;
	font-size:16px;
}

.menu-item-25 a, .sticky .menu .menu-item-25 a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    display: inline-block;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-indent: 0;
    top: 0;
    z-index: 12;
	text-indent:25px;
	font-size:16px;
}

body{ background-position:center top!important; background-size: 100%!important; }

.sep {
    display: block;
    height: 10px;
    margin: 0 15px;
    visibility: hidden;
}

.clear{ display: block; height: 20px; width: 100%; }

}