* {
 margin: 0;
 padding: 0;
}


@font-face {  font-family: Mistral; src: url("../fonts/mistral.ttf"); }
@font-face {  font-family: Biondi;  src: url("../fonts/biondi sans lt.otf"); }

body {
 margin:0 auto;
 padding:0;
 background-color: #fff;
 background-attachment:fixed;
 background-image: url('../images/background.png');
 background-repeat:repeat;
 font-family: 'Arsenal', sans-serif;
 overflow-x: hidden;
   -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
 }
 
div#loader {
 margin: 0 auto;
 padding:0;
 background-color:#fff;
 width:100vw;
 height:100vw;
 position:absolute;
 z-index:99999;
 top:0;
 left:0;
 opacity:1;
 transition: all 500ms ease-in-out;
}
 
div.header-section {
 margin:0 auto;
 padding:0;	
 background-image: url('../images/home10.png');
 background-attachment:fixed;
 background-repeat:no-repeat;
 background-size:100%;
 width:100%;
}
 

.slick-prev {
 float:left;	
 margin:0 auto;
 padding:0;	
 left:0;
 position:absolute;
 top:50%;
  line-height:1em;
}

button.slick-next, button.slick-next:hover {
  position: absolute;
  top: 21%;
  right: 54px;
  width: 47px;
  height: 75px;
  background-color:rgba(0,0,0,0);
  border:0;
  content:"";
  background-image: url("http://maggiesadler.com/wp-content/uploads/2015/10/left-right-arrow.png");
  background-size: 95px;
}
button.slick-prev, button.slick-prev:hover {
  position: absolute;
  top: 21%;
  left: 15px;
  z-index: 1;
  width: 47px;
  height: 75px;
  background-image: url("http://maggiesadler.com/wp-content/uploads/2015/10/left-right-arrow.png");
  background-size: 95px;
      background-position-x: right;
}
.slick-prev:before, .slick-next:before {
  font-size: 70px;
  color: #EA8496;
  line-height: inherit;
  font-weight: bold;
}

 

#telon {
	background-imagea: url('../images/historia/his1.jpg');
	background-size: 100%;
	background-repeat: no-repeat;
	background-color:rgba(0,0,0,0);
	opacity:1;
	position:relative;
	height:48vw;
}
 
nav {
	margin:0 auto;
	width:100%;
	background-color:rgba(0,0,0,0.5);
} 
 
nav ul.sticky_menu {
 background-color:rgba(0,0,0,0);
 background-image:url("../images/bg_menu.png");
 background-repeat:no-repeat;
 background-position: 16% 8%; 
 background-size:15%;
 -webkit-transition: all 600ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition:         all 600ms cubic-bezier(0.645, 0.045, 0.355, 1); 
 z-index:9999;
 margin: 0 auto;
 list-style-type:none;
 height:89px;
 width:80%;
}


nav ul div.logo {
  float:left;
  margin:0 auto;
  font-family: 'Mistral';
  color:rgba(218, 247, 166, 1); 
  color:rgba(255,255,255,1);
    font-size:28pt;
  text-decoration:none;
  padding-left:25px;
  padding-top:12px;
 }


 nav ul div.logo img {
  margin:0 auto;
  border:0;
  padding-left:-55px;
  padding-top:4px;
  width:120px;
 } 
 
nav ul li {
 list-style: none;
 margin: 0 auto;
 padding:19px;
 margin-right:20px;
 display: inline-block;
 color:#fff;
 border:0;
 line-height:49px;
 height:49px;
 text-transform: uppercase;
 -webkit-transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 400ms cubic-bezier(0.645, 0.045, 0.355, 1); 
  position:relative;
}

nav ul li a {
 color:#fff;
 text-decoration:none;
 }


nav ul li:hover {
 background-color:rgba(199, 0, 57,0.5);
}

#linea-menu {
	margin:0 auto;
	padding:0;
	height:2px;
	background-color:rgba(255,255,255,0.5);
	border:0;
	width:0;
	transition: all 5s ease-in-out;
}


 
.entre-parrafo {
	line-height:2em;
}
 
nav ul.stuck {
  background-color:rgba(144,12,63,0.9);
  background-color:rgba(75,3,15,0.9);
  position:fixed;
  top:0;
  left:0;
  right:0;
  -webkit-filter: drop-shadow(0px 7px 2px rgba(0,0,0,0.3));
   -ms-filter: drop-shadow(0px 7px 2px rgba(0,0,0,0.3));
   -o-filter: drop-shadow(0px 7px 2px rgba(0,0,0,0.3));
   -moz-filter: drop-shadow(0px 7px 2px rgba(0,0,0,0.3));
	filter: drop-shadow(0px 7px 2px rgba(0,0,0,0.3));
  z-index:9999;
}


.prueba {
 margin: 0 auto;
 padding: 10px 20px;
 background-color: #a00;
 height: 200px;
 color: #fff;
 opacity:0;
 transition: all 200ms ease-in;
}

.prueba-animation {
 opacity:1;
}

section {
 margin:0 auto;
 padding:0px;
 min-height:20px;
 
}

footer {
 margin:0 auto;
 padding:10vw;
 padding-top:2vw;
 padding-bottom:2vw;
 background-color:#555;
 color:#fff;
 text-align:center;
}

footer div.logofoot {
  float:left;
  margin:0 auto;
  font-family: 'Mistral';
  color:rgba(255,255,255,1);
  font-size:28pt;
  text-decoration:none;
  width:20%;
  padding:10px;
  text-align:left;
}

footer div.logofoot img {
	width:150px;
	
}

footer div.data {
   float:left;
   color:#fff;
   width:auto;
   text-align:left;
   padding:10px;
   padding-left:20px;
 
}

.instagram  {
	text-decoration:none;
	color:#fff;
	margin:5px;
	width:auto;
	height:auto;
	background:#f00;
	background-image: url('../images/insta_fondo.png');
	background-position: center; 
	background-position: -40px -20px; 
	padding:20px;
	text-align:center;
	float:right;
	font-weight:bold;
}

.facebook {
	text-decoration:none;
	color:#fff;
	margin:5px;
	width:auto;
	height:auto;
	background:#596e9a;
	padding:20px;
	text-align:center;
	float:right;
	font-weight:bold;
}

footer div.social a {
	border:2px solid rgba(255,255,255,0.1);
	transition: all 200ms ease-in;
}

footer div.social a:hover {
	border:2px solid rgba(255,255,255,0.8);
}



footer div.social {
	padding:10px;
	float:right;
	width:auto;
	text-align:right;
	padding-right:0;
}

footer div.p11 {
	margin:0 auto;
	margin-top:130px;
	padding-top:30px;
	padding-bottom:10px;
	color:#fff;
	font-size:10pt;
	border-top:1px solid rgba(255,255,255,0.5);
	text-align:right;
	width:100%;
}


.target {
  display: block;
  position: relative;
  top: -50px; 
  visibility: hidden;
}

.offset:before { 
 display: block; 
 content: " "; 
 height: 70px;      /* Give height of your fixed element */
 margin-top: 0; /* Give negative margin of your fixed element */   
 visibility: hidden; 
}

.box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
	 position:relative;
	 top:0;
	 left:0;
	 height:48vw;
	 background-color:rgba(0,0,0,0.5);
	 transition: background-color 600ms linear;
}

.box-content {
    color: #fff;
    padding: 20px;
    text-align:center;
    font-size:3vw;
	text-transform:uppercase;

}

.box-content span {
	background-color:rgba(144,12,63,0.8);
	background-color:rgba(75,3,15,0.8);
	padding-left:15px;
	padding-right:15px;
	
}

.box-sep {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 90px;
	background-color:rgba(218,247,166,0.8);
	background-image: url("../images/sep1_bg.jpg");
	background-attachment:fixed;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
	margin:0 auto;
	padding:0;
	width:100%;
	text-align:center;
}

.sep1 {
	font-size:22pt;
	}

.sep1 .text1 {
	color:rgba(0,0,0,0.8);
}

.sep1 .text2 {
	color:rgba(164,12,63,1);
	color:rgba(75,3,15,1);
	font-weight:bold;
}

hr {
	margin:0;
	padding:0;
	width:80vw;
	height:1px;
	color:rgba(0,0,0,0.3);
}

article {
	margin:0 auto;
	padding:10vw;
	padding-top:50px;
	padding-bottom:50px;
	text-align: center;
}

header {
	font-size:2vw;
	font-weight:bold;
	padding:1vw;
	
}

.clasico {
	margin:0;
	float:left;
	width:35vw;
}


img.s1_img1 {
	float:left;
	width:30vw;
	padding:20px;
	padding-top:10px;
}

img.s_img1:hover {
	-webkit-filter: drop-shadow(-15px -15px 3px rgba(164,12,63,0.8));
   -ms-filter: drop-shadow(-15px -15px 3px rgba(164,12,63,0.8));
   -o-filter: drop-shadow(-15px -15px 3px rgba(164,12,63,0.8));
   -moz-filter: drop-shadow(-15px -15px 3px rgba(164,12,63,0.8));
	filter: drop-shadow(-15px -15px 3px rgba(164,12,63,0.8));
  transform: translate(5px, 5px);
}

p {
  margin:0 auto;
  padding:10px;
  font-size:1.5vw;
  text-align:left;
  line-height:1.5em;
}

.titulo {
	font-size:14pt;
	font-weight:bold;
	
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.color1 {
	color: rgba(164,12,63,1);	
	color:rgba(75,3,15,1);
}
.color2 {
	color:rgba(115,0,30,1);
}

.cd-top{
	 display:block;
	 height:40px;
	 width:40px;
	 position:fixed;
	 bottom:40px;
	 right:10px;
	 -webkit-box-shadow:0 0 10px rgba(0,0,0,.05);
	 box-shadow:0 0 10px rgba(0,0,0,.05);
	 overflow:hidden;
	 text-indent:100%;
	 white-space:nowrap;
	 background:rgba(115,0,30,0.7) url(../images/cd-top-arrow.svg) no-repeat center 50%;
	 visibility:hidden;
	 opacity:0;
	 -webkit-transition:opacity .3s 0s,visibility 0s .3s,background-color .3s 0s;
	 transition:opacity .3s 0s,visibility 0s .3s,background-color .3s 0s
	 }
	 
.cd-top.cd-top--show,.cd-top.cd-top--fade-out,.cd-top:hover {
	-webkit-transition:opacity .3s 0s,visibility 0s 0s,background-color .3s 0s;
	transition:opacity .3s 0s,visibility 0s 0s,background-color .3s 0s
}

.cd-top.cd-top--show{
	 visibility:visible;opacity:1
}

.cd-top.cd-top--fade-out {
	opacity:.5
}

.cd-top:hover {
	background-color:#e86256;
    opacity:1
}

#map {
    width:50%;
}

#contacto {
    width:50%;
}

.header-celu {
   	    width:100%;
   	    margin:0;
   	    padding:0;
   	    padding-top:10px;
   	    padding-bottom:10px;
   	    height:30px;
   	    text-align:center;
   	    background-color:rgba(75,3,15,0.8);
   	    display:none;
   	    position:fixed;
   	    top:0;
   	    left:0;
   	    z-index:999999;
	}

.header-celu img {
     margin:0 auto;
     border:0;
     height:100%;
     
}

.eventos  {
    width:50%;
    float:left;
}


@media only screen and (min-width: 768px) {
    .cd-top {right:20px;bottom:20px}
}

@media only screen and (min-width: 1024px) {
    .cd-top{height:60px;width:60px;right:30px;bottom:30px}
    
}

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

   .cd-top {right:20px;bottom:20px}

   .sep1 {
	font-size:11pt;
	}
	
	#section0 {
	    margin-top:50px;
	}
	
	.box-sep {
	    height:50px;
	    background-image: none;
    
	}
	
	
	nav {
	     display: none;
	}
	
	article {
	    padding:2%;
	}
	
	header {
	    font-size:14pt;
	}
	
	p {
	    font-size:12pt;
	}
	
	.clasico {
	 width:90%;    
	 float:none;
	}
	
	img.s1_img1 {
	width:90%;
	}
	
	pclasico {
	    
	}
	
	.eventos {
	    width:100%;
	}
	
	.eventos p {
	    padding:0px;
	}
	
	.header-celu {
   	    display:block;
	}
	
	.wow {
	    visibility: visible !important;
	    -moz-animation-name: none !important;
	    -webkit-animation-name: none !important;
	    -o-animation-name: none !important;
	    animation-name: none !important;
	    
	}
	
	div#contacto {
	    width:100%;
	}
	
	div#map {
	    width:100%;
	}
	
    .logofoot, .data {
        width:100%;
    }

}
 
.cd-top.cd-top--show { 
 /* the button becomes visible */ 
 visibility: visible;
 opacity: 1;
} 

.cd-top.cd-top--fade-out { 
 /* if the user keeps scrolling down, the button is out of focus and becomes less visible */ 
 opacity: .5; 
}

.galeria {
 margin:0 auto;
 margin-bottom:20px;
 padding:0;
 padding-top:10px;
 padding-bottom:20px;
 border-bottom:1px solid rgba(100,100,100,0.5);
 width:100%;
 
}

.galeria.g1 div, .galeria.g2 div, .galeria.g3 div {
	padding: 0px;
	background-color:#fff;

}
.galeria.g1 img, .galeria.g2 img, .galeria.g3 img {
	height:220px;
}

.slick-prev:before, 
.slick-next:before {
    color: black;
}

.slick-slide img {
    margin:0 5px auto;
	
  }
  

 /* FORMULARIO */
 /* Style inputs, select elements and textareas */
input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 0px;
  box-sizing: border-box;
  resize: none;
  
}

input[type=text], input[type=date], input[type=email], select, textarea, input[type=number]{
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 0px;
  box-sizing: border-box;
  resize: none;
  color:rgba(164,12,63,0.5);
  color:rgba(75,3,15,0.8);
  
  margin-top:5px;
}
input[type=text]:focus, input[type=date]:focus, input[type=email]:focus,select:focus, textarea:focus, input[type=number]:focus
	{
	background-color: rgba(164,12,63,0.1);	
	background-color:rgba(75,3,15,0.3);
	color:rgba(255,255,255,1);
	}

input[type=number] {
	margin-top:5px;
	
}

input:valid {
 background-color:rgba(0,55,0,0.2);    
 color:rgba(255,255,255,1);
}

input:invalid {
 background-color:rgba(55,0,0,0.2);    
}


/* Style the label to display next to the inputs */
label {
  padding: 12px 12px 12px 0;
  display: inline-block;
}

/* Style the submit button */
input[type=submit] {
  background-color: rgba(164,12,63,1);
  background-color:rgba(75,3,15,1);
  color: #fff;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  float: right;
  border: 1px solid rgba(75,3,15,1);
  transition: all 200ms linear;
}

input[type=submit]:hover {
	background-color: #fff;
    color: rgba(164,12,63,1);
	color:rgba(75,3,15,1);
	
}


/* Style the container */
.form-container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

/* Floating column for labels: 25% width */
.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
  text-align:left;
}

.col-30 {
  float: left;
  width: 30%;
  margin-top: 6px;
  text-align:left;
}

.col-40 {
  float: left;
  width: 40%;
  margin-top: 6px;
  text-align:left;
}

.col-45 {
  float: left;
  width: 45%;
  margin-top: 6px;
  text-align:left;
}

.col-60 {
  float: left;
  width: 60%;
  margin-top: 6px;
  text-align:left;
}

.col-10 {
  float: left;
  width: 10%;
  margin-top: 6px;
  text-align:left;
}

.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
  text-align:left;
}

/* Floating column for inputs: 75% width */
.col-50 {
  float: left;
  width: 50%;
  margin-top: 6px;
  text-align:left;
}

/* Floating column for inputs: 75% width */
.col-100 {
  float: left;
  width: 100%;
  margin-top: 6px;
  text-align:left;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}
  
[type="date"] {
  background:#fff url(https://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/calendar_2.png)  97% 50% no-repeat ;
}
[type="date"]::-webkit-inner-spin-button {
  display: none;
}
[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}
  
  
::selection {
  background: rgba(164,12,63,1); /* WebKit/Blink Browsers */
  color:#fff;
}
::-moz-selection {
  background: rgba(164,12,63,1); /* Gecko Browsers */
  color:#fff;
}

::-webkit-input-placeholder { /* Chrome */
  color: rgba(164,12,63,0.5);
}
:-ms-input-placeholder { /* IE 10+ */
  color: rgba(164,12,63,0.5);
}
::-moz-placeholder { /* Firefox 19+ */
  color: rgba(164,12,63,0.5);
}

input:focus, textarea:focus {
    outline: none !important;
    border:1px solid rgba(164,12,63,0);
    box-shadow: 0 0 3px rgba(164,12,63,0.5);
}

#galeria {
	margin:0 auto;
	text-align:center;
	width:80%;
	}
	
#galeria .mix {
  display: none;
  margin:10px;
  padding:10px;
  border:0;
  width:200px;  
}

.galeria_momentos img {
	width:80vw;
}