/*GENERALES*/

*{margin: 0;padding: 0;border: 0;text-decoration: none; box-sizing: border-box;}

@font-face {
    font-family: 'robotoregular';
    src: url('../font/roboto-Regular-webfont.eot');
    src: url('../font/roboto-Regular-webfont.eot') format('embedded-opentype'),
         url('../font/roboto-Regular-webfont.woff2') format('woff2'),
         url('../font/roboto-Regular-webfont.woff') format('woff'),
         url('../font/roboto-Regular-webfont.ttf') format('truetype'),
         url('../font/roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;}

@font-face {
	font-family: 'robotobold_condensed';
    src: url('../font/roboto-boldcondensed-webfont.eot');
    src: url('../font/roboto-boldcondensed-webfont.eot') format('embedded-opentype'),
         url('../font/roboto-boldcondensed-webfont.woff2') format('woff2'),
         url('../font/roboto-boldcondensed-webfont.woff') format('woff'),
         url('../font/roboto-boldcondensed-webfont.ttf') format('truetype'),
         url('../font/roboto-boldcondensed-webfont.svg#robotobold_condensed') format('svg');
    font-weight: normal;
    font-style: normal;
	}

html{font-family: robotoregular, robotobold_condensed, calibri; font-size: 16px;}

h1{color: #c1272d; font-size: 6em; font-family: robotobold_condensed; text-shadow: 3px 3px 3px #333;}
h2{font-size: 2.5em; line-height: 2em;}
h3{font-size: 2.2em; font-family: robotobold_condensed; color: #fff; text-shadow: 3px 3px 3px #333;}
p {font-size: 1.1em;}
.destacado{font-size: 1.3em;}

/*COLOR*/

.cesd{color: #c1272d;}
.dis{color: #e86b00;}


/*TOP REDES*/

.top{width: 100%; background: #333; height: 30px; padding: 5px 3%; color: #fff; font-size: 0.8em;}

.contacto ul, .redes ul{list-style: none;}
    .contacto ul li{display: inline-block;}
    .contacto ul a{color: #fff;}
    	.contacto ul a:hover{color: #ddd;}
    	.contacto ul a:visited{color: #fff;}

    .contacto span{color:#fff; border-radius: 50%; background: #c1272d; padding: 5px; margin: 0 5px 0 10px;}
    .redes span{color:#fff; border-radius: 50%; background: #c1272d; padding: 5px; margin: 0 0 0 5px; transition: all 0.5s ease;}
    .redes span:hover{background: #bbb;}

    .contacto{float:left;}
    .redes{float: right;}

    .sinmargen{margin-left: 0 !important;}

/*LOGO*/

.logo{float: left; background: #333; height: 70px;}

/*MENU*/

nav.menu{float: right; background: #555; height: 70px;}
	nav.menu ul{list-style: none;}
	nav.menu ul li{display: inline-block;}

/*PORTADA*/

.portada{background-image: url(../img/portada.jpg); background-position: center; background-size: cover; height: 100%; min-height: 720px; background-attachment: fixed;}

.portada img{margin-top: 6%;}

	.portada > div{float: right; width: 50%; z-index: 500; margin-right: 3%;}

		.portada h1{line-height: 0.7em; text-transform: uppercase;}
		.portada h1 span{font-size: 0.25em; color: #fff;}

		div.inscribite{background: #c1272d; padding: 20px; text-align: center; margin-top: 30px; cursor: pointer; transition: all 0.5s ease; font-size: 1.5em; color: #fff; width: 250px; font-family: robotobold_condensed;}

        div.inscribite span{font-size: 0.85em; margin-right: 7px; display: none;}

        div.inscribite:hover{background: #e86b00; border-radius: 10px; transition: all 0.5s ease;}
            div.inscribite:hover span{display: inline;}

        .kids{width: 130px; height: auto; position: absolute; top:140px; left:1070px; }

/*COLUMNA IZQUIERDA*/

    .izq{width: 65%; padding: 4% 3% 4% 3%; float: left; background: #c1272d; color: #fff; height: 1400px;}
        .izq h2{font-family: robotobold_condensed; color: #fff;}
            h2 span{font-size: 0.6em; margin-right: 6px; color: #333;}

        .izq ul{list-style: none;}

    .izq article {border-bottom: 1px solid #fff; padding: 0 0 4% 0;}

    #informacion ul span{margin-right: 5px; color: #333;}

    #contenido ul li span{margin-right: 4px; font-size: 0.8em; color: #333;}

    
/*COLUMNA DERECHA*/

    .der{width: 35%; padding: 3% 3%; float: right; background: #333; z-index: 1; color: #fff; height: 1400px;}
        .der h2{font-family: robotobold_condensed;}
        .der ul{list-style: none;}

/*DISERTANTES*/

.disertantes{background: blue; height: 500px; padding: 50px;}
	.disertantes img{width: 200px; height: 200px; border-radius: 50%; float: left;}

/*FORMULARIO*/

.formulario{border-bottom: 1px solid #fff; padding-bottom: 2%; margin-bottom: 2%;}

    form input[type=text], input[type=email]{width: 100%; height: 35px; margin-bottom: 10px; padding: 5px; border: 1 solid #c1272d; font-family: robotoregular;}
        
        form .numero input:first-of-type{float:left; width: 30%; margin-right: 2%;}
        form .numero input:last-of-type{float:left; width: 68%;}

    form textarea{width: 100%; height: 250px; padding: 5px; margin-bottom: 5px; font-family: robotoregular;}

    form input[type=submit]{width: 100%; padding: 15px; background: #c1272d; transition: all 0.5s ease; color: #fff; font-size: 1.3em; font-family: robotobold_condensed; margin-bottom: 5px; cursor: pointer;}
    form input[type=submit]:hover{background: #e86b00;}

    form span{font-size: 0.8em;}

/*MAPA DE GOOGLE*/

.mapa {padding-bottom: 2%;}
.map{border:0; width: 100%; height: 500px; padding: 2% 0;}
    .mapa p{font-size: 1em;}

/*COPY*/

.copy{float: left; width: 100%; background: #ccc; font-size: 0.7em; color: #333; text-align: center; padding: 7px; font-family: robotobold_condensed;}

/*:::FOOTER:::*/

.footer{background-color: #c1272d; width: 100%;	float: left; padding:14px 0; margin-top: 15px; display: none;}
	.footer p{color:#ffffff; text-align: center; line-height: 1.5em; font-size: 1em; }
	.footer p span{font-size: 0.8em; margin-right: 6px;}
	.footer p a {color: #fff;}
		.footer p a:hover{color: #ccc;}



/*MEDIA QUERIES*/

@media screen and (max-width: 1000px) {
    .izq{width: 100%; height: auto;}
    .der{width: 100%; padding: 3%; float: left; height: auto;}
    .map{height: 400px;}

    h3{font-size: 2em;}
    .kids{width: 120px; top:170px; left:760px; }
}

@media screen and (max-width: 900px) {
    
    h1{font-size: 6em;}
    h3{font-size: 1.8em;}
        .portada h1 span{font-size: 0.2em;}
    .kids{left:710px; width: 100px; top: 150px;}
    .top{display:none;}
    .footer{display: block;}
}

@media screen and (max-width: 700px) {
	h1{font-size: 5em;}
    .map{height: 350px;}
    .portada > div{width: 90%; float: left; margin-left: 3%;}
    .portada{height: 100%; min-height: auto; padding-bottom: 15%; }
    .kids{top:150px; left:300px; }

    .portada{background-image: url(../img/portada700.jpg); min-height: 680px;}
}

@media screen and (max-width: 560px) {
    
    h1{font-size: 5em;}
    h2{font-size: 2em;}
    h3{font-size: 1.6em;}
    .kids{width: 80px; top:150px; left:280px;}
}


@media screen and (max-width: 480px) {
    
    .portada > div{width: 94%;}
    h1{font-size: 5em;}
    h2{font-size: 2em;}
    h3{font-size: 1.6em;}
    .kids{width: 80px; top:150px; left:280px;}
    .portada{background-image: url(../img/portada480.jpg); min-height: 600px;}
}

@media screen and (max-width: 360px) {
    form .numero input:first-of-type{width: 100%; margin-right: 0;}
    form .numero input:last-of-type{width: 100%;}
    h1{font-size: 4em;}
        .portada h1 span{font-size: 0.3em;}
    h2{font-size: 1.8em;}
    h3{font-size: 1.5em;}
    .portada img{width: 260px;}
    .kids{display: none;}
    p {font-size: 1em;}
    form textarea{height: 200px;}
}