@charset "utf-8";
/* CSS Document */

* {
margin: 0;
padding: 0;}

body {
	font-family:Verdana, Geneva, sans-serif;
	font-size:13px;
	color:#555;
	margin:0px;
    padding:0px;
	background-image:url(../img/bg.jpg);
	line-height:1.5}
	
img{
	width:100%;
	vertical-align:central;}

header {
	height:200px;
	background-image:url(../img/header.jpg);
	background-position:top;}
	
.contheader {
	margin:auto;
	padding-top:37px;
	max-width:960px;
/*	background:#CCCCCC;*/}
	
.headerizq {
	width:306px;
	margin-left:2.5%;
	float:left;}
	
.headerder {
	width:306px;
	margin-right:2.5%;
	float:right;}
	
nav {
	height:40px;
	background-color:#333;
	margin:auto;
	border-bottom:4px solid #0968AE;}
	
.contmenu {
	margin:auto;
	max-width:960px;
	height:40px;}
	
#MenuBar1 {
	visibility:visible;
	display:block;}	
	
#CollapsiblePanel1 {
	visibility:hidden;
	display:none;}
	
.contenedorpanel {
	visibility:hidden;
	display:none;
	clear:both;}
		
main {
	padding-top:50px;
	min-height:600px;}

.contmain {
	margin:auto;
	max-width:960px;
	min-height:600px;}
	
.mainizq {
	margin-left:2.5%;
	width:52%;
	float:left;}
	
.fotomainizq {
	visibility:hidden;
	display:none;}
	
.mainizq li {
	margin-left:30px;}
	
.mainder {
	width:42%;
	float:right;
	background-color:white;
	border:2px solid #B2B2B2;
	margin-bottom:50px;}
	
.mapa1 {
	width:42%;
	float:right;
	min-height:500px;
	background-color:white;
	border:2px solid #B2B2B2;
	overflow:hidden;}
	
.mapa2 {
	width:100%;
	float:left;
	max-height:400px;
	background-color:white;
	border:2px solid #B2B2B2;
	overflow:hidden;
	margin-bottom:50px;
	visibility:hidden;
	display:none;}
	
iframe {
	width:93%;
	margin-left:3.5%;
	margin-right:3.5%;
	margin-top:3.5%;}
		
h1 {
	margin-top:5px;
	font-family:'Oswald', sans-serif;
	color:#0968AE;
	font-size:40px;
	letter-spacing:1px;}

h2 {
	font-family:'Oswald', sans-serif;
	color:#555;
	font-size:20px;
	letter-spacing:1.4px;}
	
.punteado {
	border-bottom:2px dotted #0968AE;
	clear:both;
	margin-bottom:50px;}

footer {
	height:110px;
	border-top:4px solid #0968AE;
	border-bottom:5px solid #0968AE;
	background-image:url(../img/footer.jpg);
	clear:both;}
	
footer a {
	text-decoration:none;
	color:white;}
	
footer a:hover {
	color:#1DA3EB;}	
	
a {
	text-decoration:none;
	color:#333;}
	
a:hover {
	color:#1DA3EB;}

.contfooter {
	margin:auto;
	max-width:420px;}
	
.footerder {
	width:59.5%;
	height:20px;
	float:right;
	color:white;
	font-size:11px;
	line-height:1.6;}
	
.footerizq {
	margin-top:8px;
	height:90px;
	width:35.7%;
	float:left;}

strong {
	color:#1DA3EB;}
	
	
#back-top {
	position: fixed;
	bottom: 0px;
	left: 83%;}

#back-top a {
	width: 43px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	text-align:center;
	color: #555;

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	transition: 1s;
}

/* arrow icon (span tag) */
#back-top span {
	width: 100px;
	height: 100px;
	display: block;
	margin-bottom: 0px;
	background: url(../img/menu1.png) no-repeat center center;

	/* rounded corners 
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;*/

	/* transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover span {
	background: url(../img/menu2.png) no-repeat center center;
}

	
@media only screen and (max-width : 768px) {
#back-top {
	left: 83%;}

/*	nav {background-color:blue;}*/}
@media only screen and (max-width : 688px) {
/*nav {background-color:red;}*/

header {
	height:170px;}
	
.contheader {
	padding-top:42px;
	margin:auto;
	max-width:670px;}
	
.headerizq {
	width:230px;
	margin-left:2,5%;
	float:left;}
	
.headerder {
	width:235px;
	float:right;}
	
.contmain {
	margin:auto;
	max-width:670px;}
	
.mainizq {
	margin-left:4%;
	margin-right:4%;
	width:89%;}
	
.mainder {
	visibility:hidden;
	display:none;}
	
.fotomainizq {
	visibility:visible;
	display:block;}
	
.mapa1 {
	visibility:hidden;
	display:none;}
	
.mapa2 {
	visibility:visible;
	display:block;}
	
#back-top {
	left: 83%;}
	
REDUCIR ANCHO BOTONES}

@media only screen and (max-width : 505px) {
/*nav {background-color:yellow;}*/
		
/*nav {background-color:red;}
*/		
.headerizq {
	width:100%;
	margin-left:0%;
	float:none;}
	
.headerder {visibility:hidden;
	display:none;}
	
.contheader {
	padding-top:35px;
	max-width:255px;}
	
body {
	font-size:11.5px;}
	
h1 {
	font-size:33px;}

h2 {
	font-size:18px;}
	
.contfooter {max-width:310px;}

.footerder {
	width:100%;
	text-align:center;}
	
.footerizq {
	visibility:hidden;
	display:none;}	

#back-top {
	left: 74%;}	

AGRANDAR ALTO DE NAV}

@media only screen and (max-width : 410px) {
	
/*nav {background-color:orange;}	*/

#CollapsiblePanel1 {
	visibility:visible;
	display:block;}
	
.contenedorpanel {
	visibility:visible;
	display:block;
	width:210px;
	float:left;}

.contenedorpanel li {
	font-family: 'Oswald', sans-serif;
	font-size:12px;
	text-align:center;
	letter-spacing:1px;
	list-style-type:none;
/*	margin-left:20px;*/
	background-color:#333;}
	
.contenedorpanel li a{
	display: block;
	padding-top:7px;
	padding-bottom:7px;
	color:#1DA3EB;
	text-decoration:none;
	width:150px;}
	
.contenedorpanel li a:hover{
	color:white;
	background-color:#222;
	width:auto;}

#MenuBar1 {
	visibility:hidden;
	display:none;}	

DESAPARECE MENU HORIZONTAL
APARECE MENU VERTICAL}

@media only screen and (max-width : 320px) {
/*nav {background-color:green;}*/

.mainizq {
	margin-left:3%;
	margin-right:3%;
	width:95%;}
	
footer {
	height:180px;}
	
#back-top {
	left: 32%;}}