@import url('https://fonts.googleapis.com/css?family=Exo:400,700,800');
html,
body {margin: 0;padding: 0;font-family: 'Exo', sans-serif;}

/*	------------------------	CONTAINER OF ALL DATA	--------------------	*/
.l-site {margin: 0 auto;position: relative;z-index: 1;background: #fff;}
.l-site:before {content: "";position: fixed;top: 0;left: 0;bottom: 0;width: 100%;display: block;z-index: 1;}
.l-page {position: relative;z-index: 2;-webkit-transition: 0.35s;-moz-transition: 0.35s;transition: 0.35s;background:#f7f7f7;}
.l-nav {position: absolute;top: 0;left: 0;width: 100%;margin:0 auto;display: none;background: #000;z-index: 3;}

.l-site.is-open {overflow: hidden;}
.l-site.is-open .l-page {
    -webkit-transform: translateY(105px);
    -moz-transform: translateY(105px);
    -ms-transform: translateY(105px);
    -o-transform: translateY(105px);
    transform: translateY(105px);}
.l-page {margin-left: 0;z-index: 3;}
.l-nav {z-index: 2;display:block;}
.nav li{float:left;width:100%;text-align: center;}



/*	-----------------	nav bar	-----------------------------------------------------	*/
.nav {width: 90%;margin:0 auto;padding: 30px;overflow: auto;}
.nav ul {margin: 0;padding: 0;list-style: none;}
.nav li {margin: 0;padding: 0;-webkit-transition: 0.25s;-moz-transition: 0.25s;transition: 0.25s;width:20%;}
.nav a {color: #fff;text-decoration: none;font-size: 20px;font-weight: 800; display: block;padding: 10px 0;}
.nav .nav-primary {opacity: 1;}
.nav .nav-primary:hover {opacity: 0.7;}
.menu {position: absolute;/*top: 25px;left: 1.5em;*/top:80px;left:80px;width: 24px;height: 24px;cursor: pointer;z-index: 10;}
.menu:after{content:'Menú';position:absolute;top:0px;left:60px;font-size:20px;font-weight:800;color:#fff;}
.menu:before{content:'';
position:absolute;
top:-18px;left:-18px;
width: 60px;
  height: 60px;
  background: #fbde20;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border-radius: 50px;

  -webkit-box-shadow: 0px 11px 14px 0px rgba(0,0,0,0.31);
-moz-box-shadow: 0px 11px 14px 0px rgba(0,0,0,0.31);
box-shadow: 0px 11px 14px 0px rgba(0,0,0,0.31);
  }
.menu:hover .menu-hamburger:before,
.menu:hover .menu-hamburger:after {width: 24px;}
.menu.is-active .menu-hamburger {background: none;}
.menu.is-active .menu-hamburger:before,
.menu.is-active .menu-hamburger:after {top: 0;width: 24px;
  -webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}
.menu.is-active .menu-hamburger:after {-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);}
.menu.is-active .menu-hamburger:hover {-webkit-transform: scale(1.2);-ms-transform: scale(1.2);transform: scale(1.2);}
.menu-hamburger {position: relative;width: 24px;height: 4px;margin: 10px 0;background: #000;border-radius: 4px;transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
.menu-hamburger:before, .menu-hamburger:after {content: '';display: block;width: 24px;height: 4px;background: #000;position: absolute;border-radius: 4px;transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
.menu-hamburger:before {top: -8px;left: 0;width: 22px;}
.menu-hamburger:after {top: 8px;width: 16px;left: 0;}
#indexhambu{background-color:#000;}
#indexhambu:after,#indexhambu:before{background-color:#000;}
.menu.is-active #indexhambu{background:none;}


/*	FOOTER		*/
.contact{padding:120px 0;text-align: center;}
.contact img{margin:0 0 30px 0;}
.contact p{font-size:20px;}
.contact .columns{text-align: left;}
.contact form{text-align: center;}
.contact label{text-align: left;font-size:22px;font-weight: 400;position: relative;}
.contact input[type="text"],
.contact input[type="email"],
.contact input[type="tel"],
.contact textarea{width:100%;border-radius: 0;}
.contact textarea{resize:none;}
.contact input[type="submit"]{
    background-color:#fbde20;border:none;color:#000 !important;font-weight: 700;margin:0 auto;letter-spacing: 0;font-size:16px;font-family: 'Exo',sans-serif;
    border-top:2px solid #ccb31a;border-left:1px solid #ccb31a;;border-bottom:none;border-right:1px solid #ccb31a;;width:245px;
height:55px;font-weight: 800;text-shadow:0px 2px #ddc41c;
    -webkit-box-shadow: 0px 6px 6px 0px rgba(99,74,54,0.5);
-moz-box-shadow: 0px 6px 6px 0px rgba(99,74,54,0.5);
box-shadow: 0px 6px 6px 0px rgba(99,74,54,0.5);
    
}
.contact input[type="submit"]:hover{border:;}
.contact .columns:nth-child(2){border-left:1px solid rgba(251,222,32,0.5);padding:0 0 0 20px;}
.contact .columns:nth-child(2) p{color:rgba(0,0,0,0.5);}
.contact .columns:nth-child(2) a{color:rgba(0,0,0,0.5);}

.contact .appendText{position: absolute;background:red;border-radius: 5px;color:#fff;top:0px;right:0px;text-align: center;width:300px;transition: all 1s ease;}
.contact .appendText p{margin:0;}
.contact .error{text-align: center;}
.contact .error p{font-size:20px;color:#000;}


@media screen and (max-width: 980px) {
	/*	-------------- RESPONSIVE SETTINGS		----------*/
  .l-site.is-open {overflow: hidden;}
  .l-site.is-open .l-page {
    -webkit-transform: translateY(285px);
    -moz-transform: translateY(285px);
    -ms-transform: translateY(285px);
    -o-transform: translateY(285px);
    transform: translateY(285px);}
  .l-nav {z-index: 2;display:block;}
  .menu {top: 25px;left: 1.5em;}
  .menu:after{content:'';}
  .nav{width:80%;}
  .nav li{float:left;width:100%;text-align: center;}
  .band-container {padding: 0 1.5em;}
  .contact img{width:90%;}
  .appendText{width:150px !important;}
  .appendText p{font-size:15px;}
  
  
  
  .contact input[type="submit"],.contact p,.contact label,.contact .appendText,.contact .error p{font-size:16px;}
  
}