/* Created by http://freehtml5templates.com */
/* basics */
@font-face {
    font-family: "capture";
    src: url(capture.ttf) format("truetype");
}
/* reset */
* {
	margin: 0;
	padding: 0;
	}

/* render html5 elements as block */
header, footer, section, aside, nav, article {
	display: block;
	}
	
/* standard body */
body {
	margin: 0 auto;
	width: 960px;
	font: 14px/20px "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	background: #271408 url("images/fondo1.jpg") repeat;
	}

h1 {
	font-size: 48px;
	padding: 20px 0;
	text-shadow: 2px 2px 2px #000;
	color: #d6a965;
	}

h2 {
	font-size: 24px;
	padding: 20px 0;
	}

h3 {
	font-size: 18px;
	padding: 10px 0;
	}

p {
	padding-bottom: 20px;
	}

/* Menu */
.menudes {
position: relative;
overflow: hidden;
width: 970px;
height: 55px;
margin: 0px 0 0px;
border-radius: 8px;
background: #323232;
text-align:center;
}
.menudes a {
display: inline-block;
float: left;
width: 150px;
box-sizing: border-box;
padding: 10px 0px 10px 5px;
font-size: 18px;
font-weight: bold;
color: #fff;
text-decoration: none;
}

.inicio{
	margin-left: -13px;
}
.servicios{
	margin-right: 30px;
}
.menudes a p img{
	position:relative;
	margin-right: 4px;
}
.marca {
position: absolute;
bottom: 4px;
left: -120px; /* Al menos 1/2 del ancho de cada enlace */
width: 120px; /* 1/2 del ancho de cada enlace */
height: 4px;
border-radius: 8px;
background: #7592F6;
transition: 0.5s ease-in-out; 

}
.menudes a:nth-child(1):hover ~ .marca {
left: 5px; /* 1/4 Ancho del enlace */
}
.selected1 ~ .marca {
left: 5px; /* 1/4 Ancho del enlace */
}

.menudes .selected1{
	color: #7592F6;
}
.menudes .selected1 .icono{
	width: 20px;
	height: 20px;
	float: left;
	background-image: url("images/inicio2.png");
}

.menudes a:nth-child(2):hover ~ .marca {
left: 157px; /* 1/4 Ancho del enlace + 1 vez ancho enlace */
}
.selected2 ~ .marca {
left: 157px; /* 1/4 Ancho del enlace */
}
.menudes .selected2{
	color: #7592F6;
}
.menudes a:nth-child(3):hover ~ .marca {
left: 335px; /* 1/4 Ancho del enlace + 2 veces ancho enlace */
}
.selected3 ~ .marca {
left: 335px; /* 1/4 Ancho del enlace */
}
.menudes .selected3{
	color: #7592F6;
}

#eslogan {
    border-left: solid #d6a965;
	float: right;
	width: 470px;
	height: 100%;
}

#eslogan > img{
    float: left;
    margin-right:5px;
}

#eslogan > a {
    float: left;
    padding: 0;
}
#eslogan > a img{
	display: block;
}


/* logo */

#intro {
	position: relative;
	height: 230px;
	width: 962px;
	margin-top: 1px;
	border-radius: 10px;
	border: solid 4px;
	}
	
#intro img {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 10px;
	}

/* content and sidebar layout */

#content {
	position: relative;
	float: left; 
	width: 930px; 
	margin-bottom: 0px;
	padding:5px 20px 5px 20px;
	background-color: #f2ede7;
	border-radius: 10px;
}

/* Index */
#informacion{
	position: relative;
}

#quienes_somos {
width: 400px;
float: left;
padding: 0 10px;
}
#informacion h2{
font-family: "capture";	
text-align: center;
letter-spacing: 2px;
}

#quienes_somos img{
	float:left;
	margin-top: 7px;
	margin-right: 3px;
}

.separador{
float: left;
width: 4px; /* 1/2 del ancho de cada enlace */
height: 650px;
border-radius: 8px;
background: #d6a965;
}

#nuestros_servicios {
width: 400px;
float: right;
margin-right: 20px;
padding: 0px 0px;
}

#lista {
    counter-reset: li; 
    list-style: none; 
    *list-style: decimal; 
    font: 15px 'trebuchet MS', 'lucida sans';
	font-weight: bold;
    padding: 0;
    margin-bottom: 4em;
    text-shadow: 0 1px 0 rgba(255,255,255,.5);
}


#lista li{
    position: relative;
    display: block;
    padding: .4em .4em .4em 2em;
    margin: .5em 0;
    background: #ddd;
    color: #444;
    text-decoration: none;
    border-radius: .3em;
    transition: all .3s ease-out;   
}

#lista li:hover{
    background: #87ceeb;
}

#lista li:hover:before{
    transform: rotate(360deg);  
}

#lista li:before{
    content: counter(li);
    counter-increment: li;
    position: absolute; 
    left: -1.3em;
    top: 50%;
    margin-top: -1.3em;
    background: #87ceeb;
    height: 2em;
    width: 2em;
    line-height: 2em;
    border: .3em solid #fff;
    text-align: center;
    font-weight: bold;
    border-radius: 2em;
    transition: all .3s ease-out;
}

/* Servicios */

#content ul.column {
	width: 100%;
	padding: 0;
	margin: 10px 4px;
	list-style: none;
}

#content ul.column li {
	float: left;
	width: 184px; /*Set default width*/
	padding: 0;
	margin: 5px 0;
	display: inline;
	text-align: center;
}

#content .block h3{
	font-size: 17px;
}

#content .block {
	height: 200px;
	font-size: 1em;
	margin-right: 10px; /*Creates the 10px gap between each column*/
	padding: 5px;
	background: #B1C9F9;
	border-radius: 10px;
}

#content .block:hover {
	background:#5F8CE6;
}

#content .block a {
	color: black;
	}
	
#content .block a:hover {
	text-decoration: underline;
	}

#content .block img {
  /*Flexible image size with border*/
	width: 150px;  /*Took 1% off of the width to prevent IE6 bug*/
	height: 120px;
	background:#fff;
	margin: 0 auto;
	display: block;
	border-radius: 10px;
	border: solid;
	-ms-interpolation-mode: bicubic; /*prevents image pixelation IE 6/7 */
	}

/* Localización */

#content iframe{
	float: right;
	width:600px; 
	height:450px;
	border:0;
}

#content .horario{
	width: 300px;
	margin: 10px 0 10px 10px;
	float: left;
	
}

.horario table{
	margin-bottom: 20px;
}

td {
	background: #9A9A9A;
	text-align: center;
	margin: 8px;
	padding: 8px;
}

th{
	background: #4B4B4B;
	text-align: center;
	margin: 8px;
	padding: 8px;
	color: #fff;
}

.horario img{
	float:left;
	margin-top: 7px;
	margin-right: 3px;
}
.iframe{
	margin: 15px 0 15px 0;
	float: right;
	width: 600px; 
	height: 450px;
	border: double black 5px;
	border-radius: 8px;
}
	
/* footer */
footer {
	width: 970px;
	height: 200px;
	clear: both;
	color: #f2ede7;
	overflow: hidden;
	padding-top: 10px;
	background-color: #323232;
	border-radius: 10px;
	margin-bottom: 10px;
	}
	
footer section {
width: 300px;
float: left;
padding: 0 10px;
}

footer section ul{
	list-style:none;
}

footer section ol{
	margin-left: 13px;
}

footer #facebook ul{
	margin-left: 70px;
}
footer #facebook li{
	display: inline;
}

footer #facebook li a{
	float: left;
	padding: 2% 5%;
}

footer #facebook li a:hover{
	margin-top: -2%;
}

footer section h3 {
	font-size: 22px;
	font-weight: bold;
}

footer section p {
  font-size: 12px;
	}

footer section a {
	color: #999;
	}
	
footer section a:hover {
	color: #FFF;
	text-decoration: none;
	}

footer #rgpd {
width: 100%;
text-align: center;
padding: 0;
margin-top: 20px;
}

footer #rgpd a{
	padding: 0 10px;
	text-decoration: none;
}

	
/* for inner pages */

/* content and sidebar layout */

#innercontent {
	float: left; 
	width: 610px; 
	margin:10px 5px 10px 0; 
	padding:5px 20px 5px 20px;
	background-color: #d6a965;
	border-radius: 10px;
}

aside {
	float: right;
	text-align: left; 
	width: 300px; 
	margin:0; 
	padding:0;
	}


/* sidebar */
aside section {
	margin: 10px 0 0 10px;
	padding: 10px 15px;
	background-color: #d6a965;
	border-radius: 10px;
	}

aside section ul {
	margin: 0 0 0 20px;
	color: #FFF;
	}
	
aside section ul li a {
	display: block;
	text-decoration: none;
	color: #695e53;
	}
		
aside section ul li a:hover {
	text-decoration: underline;
	color: #fff;
	}
		#jssor_1{
			position: relative;
			margin: 10px auto -10px auto;
			width: 600px;
			height: 300px;
			overflow: hidden; 
			visibility: hidden;
		}
		
		.slider{
			cursor: default; 
			position: relative; 
			margin-left: 50px;
			top: 0px; 
			left: 0px; 
			width: 500px; 
			height: 250px; 
			overflow: hidden;
			border-radius: 8px;
		}
		
		.navigator{
			width:12px;
			height:12px;
			margin-top:250px;
			margin-left:215px
		}
        .jssorb01 {
            position: relative;
			bottom:16px;right:16px;
        }
        .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
            position: absolute;
            /* size of bullet elment */
            width: 12px;
            height: 12px;
            filter: alpha(opacity=70);
            opacity: .7;
            overflow: hidden;
            cursor: pointer;
            border: #000 1px solid;
        }
        .jssorb01 div { background-color: gray; }
        .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
        .jssorb01 .av { background-color: #fff; }
        .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

        .jssora02l{
			top:0px;
			left:8px;
			width:55px;
			height:55px;
			margin-top: 130px;
			margin-left: 50px;
		}
		
		.jssora02r{
			top:0px;
			right:8px;
			width:55px;
			height:55px;
			margin-top: 130px;
			margin-right: 50px;
		}
		

        .jssora02l, .jssora02r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            background: url('img/a02.png') no-repeat;
            overflow: hidden;
        }
        .jssora02l { background-position: -3px -33px; }
        .jssora02r { background-position: -63px -33px; }
        .jssora02l:hover { background-position: -123px -33px; }
        .jssora02r:hover { background-position: -183px -33px; }
        .jssora02l.jssora02ldn { background-position: -3px -33px; }
        .jssora02r.jssora02rdn { background-position: -63px -33px; }