/*! normalize.css v1.1.0 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}

.txtc {text-align:center;}
.txtdanger {color:rgba(254,57,66,.9);}
.hide {display:none;}

nav#menu {display:block;margin:30px auto 20px;width:90%;}
#logo {background:url(../img/alberto-jauregui-logo.png) no-repeat;display:block;float:left;height:109px;text-indent:-9999px;opacity:.8;width:109px;}
nav#menu ul {float:right;margin:0;padding:0;}
nav#menu li {display:inline-block;height:70px;line-height:70px;}
nav#menu li a {color:rgba(255,255,255,.7);font-family:'Quicksand', sans-serif;font-size:22px;padding:0 20px;text-decoration:none;}
nav#menu li a:hover {color:rgba(255,255,255,1);text-shadow:0 0 3px rgba(255,255,255,.7);}

#cover {clear:both;padding-top:15%;text-align:center;}
#cover h1 {color:#fff;font-family:'Montserrat', sans-serif;font-size:50px;margin:0 0 10px;}
#cover h2 {color:rgba(254,57,66,.9);font-family:'Quicksand', sans-serif;font-size:28px;margin:0 0 30px;}
#cover a {color:#fff;font-size:32px;padding:0 10px;}

#contact {display:none;background:rgba(255,255,255,.9);font-family:'Quicksand', sans-serif;left:50%;margin-left:-300px;padding:10px;position:absolute;top:100px;width:600px;z-index:999999;border-radius: 10px;background-clip: padding-box;}
#contact h3 {border-bottom:1px solid #bbb;font-size:34px;padding:0 30px 10px;text-align:center;}
#contact label {display:block;margin:0 0 5px;}
#contact input[type=text], #contact textarea {display: block;width: 95%;margin:0 0 10px;padding: 6px 12px;color: #555;background-color: #fff;background-image: none;border: 1px solid #ccc;border-radius: 4px;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);box-shadow: inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;font-family:'Quicksand', sans-serif;}
#contact textarea {height:75px;}
#contact input[type=submit] {background: rgba(254,57,66,.9);color: #fff;padding: 15px 25px;-ms-border-radius: 5px;-o-border-radius: 5px;border-radius: 5px;border: 1px solid rgba(254,57,66,.9);-webkit-transition: .5s;transition: .5s;display: block;cursor: pointer;margin:0 auto;width:35%;font-family:'Quicksand', sans-serif;}
#contact input[type=submit]:hover {background: rgba(165, 24, 30, .9);border:1px solid rgba(165, 24, 30, .9);}
#contact a {color:rgba(254,57,66,.9);text-decoration:none;}

#overlay {background:rgba(0,0,0,.7);display:none;height:100%;left:0;position:absolute;top:0;width:100%;z-index:99999;}
#modal {background:rgba(255,255,255,.9);font-family:'Quicksand', sans-serif;left:50%;margin-left:-300px;padding:10px;position:absolute;top:-520px;width:600px;z-index:999999;border-radius: 10px;background-clip: padding-box;}
#modal h3 {border-bottom:1px solid #bbb;font-size:34px;padding:0 30px 10px;text-align:center;}
#modal p {font-size:18px;padding:0 30px;text-align:justify;}
#modal p.txtc {text-align:center;}
#modal a {color:rgba(254,57,66,.9);text-decoration:none;}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  12.5% {
    -webkit-transform: translateX(-6px) rotateY(-5deg);
    transform: translateX(-6px) rotateY(-5deg);
  }

  37.5% {
    -webkit-transform: translateX(5px) rotateY(4deg);
    transform: translateX(5px) rotateY(4deg);
  }

  62.5% {
    -webkit-transform: translateX(-3px) rotateY(-2deg);
    transform: translateX(-3px) rotateY(-2deg);
  }

  87.5% {
    -webkit-transform: translateX(2px) rotateY(1deg);
    transform: translateX(2px) rotateY(1deg);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes shake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  12.5% {
    -webkit-transform: translateX(-6px) rotateY(-5deg);
    transform: translateX(-6px) rotateY(-5deg);
  }

  37.5% {
    -webkit-transform: translateX(5px) rotateY(4deg);
    transform: translateX(5px) rotateY(4deg);
  }

  62.5% {
    -webkit-transform: translateX(-3px) rotateY(-2deg);
    transform: translateX(-3px) rotateY(-2deg);
  }

  87.5% {
    -webkit-transform: translateX(2px) rotateY(1deg);
    transform: translateX(2px) rotateY(1deg);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.shake {
    -webkit-animation: shake 400ms ease-in-out;
    animation: shake 400ms ease-in-out;
}

/*MEDIAQUERIES
  ------------*/
@media (max-width: 400px) {
    body {background:url(../img/macbookbg.jpg) no-repeat;background-size:cover;min-width: 100%;width:100%;}

    #logo {float:none;margin:0 auto;}

    nav#menu ul {float:none;text-align:center;}
    nav#menu li a {font-size:16px;padding:0 10px;text-align:center;}

    #overlay {position:fixed;}

    #modal {margin-left:-40%;width:80%;}
    #modal h3 {font-size:16px;margin:0 0 10px;padding:0 10px 10px;}
    #modal p {font-size:14px;margin:0 0 5px;padding:0 10px;}

    #contact {top:30px;margin-left:-40%;width:80%;}
    #contact h3 {font-size:16px;margin:0 0 10px;padding:0 10px 10px;}
    #contact input[type="text"], #contact textarea {width:90%;}

    #cover {padding-top:0;padding-bottom:10px;}
    #cover h2 {font-size:22px;}
    #cover a {font-size:28px;padding:0 5px;}

    .backstretch {display:none;}
}

@media (max-width: 500px) and (min-width:401px) {
    body {min-width: 100%;width:100%;}

    #logo {float:none;margin:0 auto;}

    nav#menu ul {float:none;text-align:center;}
    nav#menu li a {font-size:16px;padding:0 10px;text-align:center;}

    #overlay {position:fixed;}

    #modal {margin-left:-40%;width:80%;}
    #modal h3 {font-size:16px;margin:0 0 10px;padding:0 10px 10px;}
    #modal p {font-size:14px;margin:0 0 5px;padding:0 10px;}

    #contact {top:30px;margin-left:-40%;width:80%;}
    #contact h3 {font-size:16px;margin:0 0 10px;padding:0 10px 10px;}
    #contact input[type="text"], #contact textarea {width:90%;}

    #cover {padding-top:0;padding-bottom:10px;}
    #cover h2 {font-size:22px;}
    #cover a {font-size:28px;padding:0 5px;}
}

@media (max-width: 660px) and (min-width:501px) {
    #modal {margin-left:-40%;width:80%;}
    #modal p {font-size:14px;margin:0 0 5px;padding:0 10px;}

    #contact {top:80px;margin-left:-40%;width:80%;}
    #contact input[type="text"], #contact textarea {width:90%;}
}
