@font-face {font-family:"ei-reg"; src: url("EisenbahnGroteskBeta-Regular.otf") format('opentype');}
@font-face {font-family:"eic-bold"; src: url("EisenbahnGroteskBeta-EstreitaNegrito.otf") format('opentype');}
@font-face {font-family:"eic-preta"; src: url("EisenbahnGroteskBeta-EstreitaPreta.otf") format('opentype');}
@font-face {font-family:"eic-thin"; src: url("EisenbahnGroteskBeta-EstreitaMagra.otf") format('opentype');}


.container {position:relative; width:98%; max-width:1400px; margin:0 auto; padding:0 20px; box-sizing:border-box; }
.container-fluid {position:relative; width:100%; margin:0 auto; padding: 0; box-sizing:border-box; }
.column,.columns { width: 100%; float: left; box-sizing: border-box; }
.pad2{padding:20px 0}.pad3{padding:30px 0}.pad4{padding:40px 0}.pad5{padding:50px 0}.pad6{padding:70px 0}
.padd{padding:80px 0; min-height:60px}.pad{padding:20px}
.br{color:#fff}
.verd{color:#7ba805}
.ama{color:#f9df4e}
.bgama{background-color:#f9df4e; padding:40px 15px; color:#000}
.bgred a{color:#eca900}
.brbg{background-color:#fff}
.bkbg{background-color:#000}
.czbbg{background-color:#131313}
.ouro{color:#eca900}
.ourobg{background-color:#eca900}
.red{color:#d22630}
.redbg{background-color:#d22630}
.orange{color:#f7921c}
.bk{color:#000}
.cz{color:#333}
.czbg{background-color:#c6c6c6}
.blubg{background-color:#1c487f}
.som{text-shadow:1px 1px 19px rgba(0, 0, 0, 0.4);}
.somd{-webkit-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5); -moz-box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5); box-shadow:0px 0px 50px 0px rgba(0,0,0,0.5);}
.somlados{box-shadow:0 9px 0px 0px #052a41, 0 0 0px 0px #052a41, 12px 0 15px -4px rgba(0,40,60, 0.97), -12px 0 15px -4px rgba(0,40,60, 0.97);}
.over{position:absolute; float:left;z-index:100;}
.trans{background-color: cornflowerblue;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";filter:alpha(opacity=50);opacity:0.5}
.oki{text-transform: uppercase}
.img-circle {border-radius: 50%;}
.round{border-radius:14px}
.zoom{transition: transform 0.2s;}
.zoom:hover{transform: scale(1.1)}

.row {padding:0 20px}

.modal-window {position:fixed; background-color: rgba(5, 5, 5, 0.5); top:0; right:0; bottom:0; left:0; z-index:999999; visibility: hidden; opacity: 0; pointer-events:none; -webkit-transition: all 0.3s; transition: all 0.2s}
.modal-window:target { visibility: visible; opacity: 1; pointer-events: auto;}
.modal-window > div {max-width:280px; width:100%; padding:25px; position:absolute; top:50%; left:50%; -webkit-transform:translate(-50%, -50%);transform: translate(-50%, -50%); padding:2em; background:#ffffff; -webkit-box-shadow: 0px 0px 80px 0px rgba(0,0,0,0.46); -moz-box-shadow: 0px 0px 80px 0px rgba(0,0,0,0.46); box-shadow: 0px 0px 80px 0px rgba(0,0,0,0.46); border-radius:8px}

.modal-close {line-height:50px; font-size:80%; font-weight:bolder; position:absolute; right:12px; text-align:center; top:0; width:80px; text-decoration:none}
.modal-close:hover {color: black;}
.modal-window div:not(:last-of-type) { margin-bottom: 15px;}


@media (min-width:640px) {
.container {width:80%;}
}
@media (min-width: 980px) {
  .column, .columns { margin-left: 4%; }
  .column:first-child, .columns:first-child { margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; }
  .two-thirds.column              { width: 65.3333333333%; }

  .one-half.column                { width: 48%; }

  .offset-by-one.column, .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,  .offset-by-one-half.columns     { margin-left: 52%; }
}



html {font-size: 62.5%; scroll-behavior:smooth; margin: 0; padding:0; }
body {font-size:1.4em; font-family:"ei-reg", sans-serif; line-height:1.3; color:#222; overflow-x:hidden}


/* Typography ––––––– */
h1, h2, h3, h4, h5, h6 {margin-top:1rem; margin-bottom:1.2rem; color:#000; line-height:1.2; text-transform:uppercase; font-family:"eic-bold", sans-serif; letter-spacing:0.04em}
h1 { font-size: 5rem; }
h2 { font-size: 3.5rem; }
h3 { font-size: 2.4rem; margin-bottom:40px}
h4 { font-size: 2.0rem; }
h5 { font-size: 1.4rem; font-family:"eic-thin", sans-serif;}
h6 { font-size: 1.2rem; }

/* Larger than phablet */
@media (min-width: 650px) {
  h1 { font-size: 5.8rem; }
  h2 { font-size: 3.6rem; }
  h3 { font-size: 3.0rem; }
  h4 { font-size: 2.4rem; }
  h5 { font-size: 1.9rem; }
  h6 { font-size: 1.4rem; }
}

p {margin:0; font-size:1.2em; font-weight:300}
small{font-size:0.96rem}


a {color:#af2127; text-decoration:none;-webkit-transition:color 0.2s ease-in; -moz-transition:color 0.2s ease-in; -o-transition:color 0.2s ease-in}
a:hover { color:#fff}





.button,button,input[type="submit"],input[type="reset"],
input[type="button"] {display:inline-block; height:55px; padding:0 55px; color:#fff; text-align:center; font-size:2rem; font-family:"eic-bold", sans-serif; line-height:55px; text-decoration: none; white-space: nowrap; background-color:#000; cursor: pointer; box-sizing: border-box; letter-spacing:0.18em; border:none}
.button:hover,button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover,.button:focus,button:focus,input[type="submit"]:focus,input[type="reset"]:focus,input[type="button"]:focus {color:#f9df4e; outline: 0; background-color:#222}
.button.button-primary,button.button-primary,input[type="submit"].button-primary,input[type="reset"].button-primary,
input[type="button"].button-primary {background-color:#f9df4e; color:#000; height:58px; line-height:58px}
.button.button-primary:hover,button.button-primary:hover,input[type="submit"].button-primary:hover,input[type="reset"].button-primary:hover,input[type="button"].button-primary:hover,.button.button-primary:focus,button.button-primary:focus,input[type="submit"].button-primary:focus,input[type="reset"].button-primary:focus,input[type="button"].button-primary:focus {color:#f9df4e; background-color:#000}

button.out{border:1px solid #000; background:#fff; color:#000}

input[type="email"],input[type="number"],input[type="search"],input[type="text"],input[type="tel"],input[type="url"],input[type="password"],input[type="date"],textarea,select {height:42px; padding:9px 10px; background-color:#fff; border:1px solid #bbb; border-radius:4px; box-shadow:none; box-sizing:border-box; font-size:1.24em; color:#000}
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],input[type="number"],input[type="search"],input[type="text"],input[type="tel"],input[type="url"],input[type="password"],
textarea {-webkit-appearance: none; -moz-appearance: none;appearance: none; }
textarea {min-height: 65px; padding-top: 6px; padding-bottom: 6px; }
input[type="email"]:focus,input[type="number"]:focus,input[type="search"]:focus,input[type="text"]:focus,input[type="tel"]:focus,input[type="url"]:focus,input[type="password"]:focus,textarea:focus,select:focus {border:2px solid red; outline: 0; }
label,legend {display: block; margin-bottom: .5rem; font-weight: 600; }
fieldset { padding: 0; border-width: 0; }
input[type="checkbox"],input[type="radio"] { display:inline; padding:5px}
label > .label-body { display: inline-block; margin-left: .5rem; font-weight: normal; }



ul {list-style:disc}
ol {list-style:decimal inside; }
ol, ul {padding-left: 0; margin-top: 0; }
ul ul,ul ol,ol ol,ol ul {margin: 1.5rem 0 1.5rem 3rem;}
li {margin-bottom: 1rem; }



table {border-collapse: collapse; margin:0; padding:0; width:100%; table-layout:fixed}
table caption {font-size:1.5em; margin:.5em 0 .75em 0}
table tr {padding:2em 0}
table th,table td { padding:.625em 0; text-align: center; border-bottom: 1px solid #E1E1E1}
table th, thead {font-size: .8em; text-transform: uppercase; font-weight: bold}
.padr{font-size:22px}
.ttd {font-size:15px}

@media screen and (max-width: 600px) {
  table thead {border:none; clip: rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
  table tr {background-color:#fff; display:block; padding:0 10px; border-bottom:12px solid #e7eff3}
  table td {border-bottom: 1px solid #ddd; display:block; font-size:11px; text-align:right}
  table td:before {content: attr(data-label); float: left; }
  .ttd {font-size:12px}
}



button,.button {margin-bottom: 1rem; }
input,textarea,select,fieldset {margin-bottom: 1.5rem; }
pre,blockquote,dl,figure,table,p,ul,ol,form {margin-bottom: 2.5rem; }


.u-full-width {width:100%; box-sizing: border-box}
.u-half-width {width:49.7%; box-sizing: border-box}
.u-max-full-width {max-width: 100%;  box-sizing: border-box}
.u-pull-right {float:right}
.u-pull-left {float:left}
.text-center{text-align: center}
.text-just{text-align: justify}
.it{font-style: italic}
.esp{letter-spacing:0.07em}
.leve{font-weight:300}


hr {margin-top:2rem; margin-bottom:2.5rem; border-width:0; border-top: 1px solid #E1E1E1}

.container:after,.row:after,.u-cf { content:""; display:table; clear:both}


@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bounce {
  0%, 100% { transform: scale(0.0);-webkit-transform: scale(0.0);
  } 50% { transform: scale(1.0); -webkit-transform: scale(1.0); }
}





.modal-window {position:fixed; background-color: rgba(45, 0, 0, 0.55); top:0; right:0; bottom:0; left:0; z-index:999999; visibility:hidden; opacity: 0; pointer-events:none; -webkit-transition: all 0.3s; transition: all 0.3s}
.modal-window:target { visibility: visible; opacity: 1; pointer-events: auto;}
.modal-window > div {max-width:280px; width:100%; padding:20px 18px 0 18px; position:absolute; top:42%; left:50%; -webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%); padding:2em; background:#ffffff; -webkit-box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); -moz-box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); box-shadow:0px 0px 80px 0px rgba(0,0,0,0.46); border-radius:10px}

.modal-close {line-height:50px; font-size:80%; font-weight:bolder; position:absolute; right:20px; text-align:center; top:0; width:80px; text-decoration:none}
.modal-close:hover {color: black;}
.modal-window div:not(:last-of-type) { margin-bottom: 15px;}







@media (min-width: 320px) {
#hero{height:300px; background-image: url(../img/eisen-cg-1.jpg); background-position:top center; background-size:150% auto; background-attachment:fixed}
#wood{height:auto; background-image: url(../img/eisen-cg-5-base.png); background-position:top center; background-size:150% auto; background-repeat: no-repeat; padding-top:120px; padding-bottom:50px}
.atividades{display:none}
.atividades-mob{display:block;width:100%}
#produtos{height:240px; background-image: url(../img/eisen-cg-6.png); background-position:top center; background-size:cover; margin:0 auto; background-repeat: no-repeat}
.rs{width:27px; height:auto; margin:4px}
.simbol{float:left;max-width:102%}
.craftxt{padding:0 10%; text-align:justify}
.mob{position:absolute;z-index:999; padding:0; top:0}
.mob img{width:65px;height:auto}
.logo{background-color:#f9df4e; padding:20px; margin-bottom:30px}
.logo img{width:120px; margin-top:0}
.bloco{display:inline-block; width:130px;height:130px; float:left; margin:5px 10px 12px 0; background-size:cover}
.bloco #dia{width:20px;height:20px; margin:5px}

.aprecie{position:fixed; z-index:5; top:40%; left:-77px; text-align:left; font-size:11px; transform:rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); background:#fff; padding:3px 8px 5px 8px}

#pe a{color:#000}#pe h5{font-family:"eic-bold"; font-size:2.1rem; line-height:98%}

.ingresso{padding:30px 14px; border-radius:14px; border:4px solid #333; width:320px; height:auto; margin:5% auto}
.qr{width:100%;height:auto;max-width:360px; image-rendering: -moz-crisp-edges;image-rendering: -moz-crisp-edges;image-rendering: -o-crisp-edges;image-rendering: -webkit-optimize-contrast;-ms-interpolation-mode: nearest-neighbor;}
    
.menu{display:none}
#nav-icon4 {width:36px; height:20px; position:fixed; top:7px; right:10px; -webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out; transition:.5s ease-in-out; cursor:pointer; z-index:99999; background:none; padding:20px; border-radius:0 0 0 12px}
#nav-icon4 span {display:block; position:absolute; height:5px; width:60%; margin:13px auto 10px 21.4%; background:#fff; border-radius:2px; opacity: 1; left: 0; -webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);transform: rotate(0deg); -webkit-transition: .25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;}
#nav-icon4 {}
#nav-icon4 span:nth-child(1) {top:0px;-webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center;}
#nav-icon4 span:nth-child(2) {top:10px; -webkit-transform-origin:left center;-moz-transform-origin:left center;-o-transform-origin:left center;transform-origin:left center;}
#nav-icon4 span:nth-child(3) {top:20px;-webkit-transform-origin:left center;-moz-transform-origin:left center; -o-transform-origin:left center; transform-origin:left center;}
#nav-icon4.open span:nth-child(1) {-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg); transform: rotate(45deg); top:-11px; left:7px; background-color:#ffbc0d}
#nav-icon4.open span:nth-child(2) { width: 0%; opacity: 0;}
#nav-icon4.open span:nth-child(3) {-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform: rotate(-45deg); top:20px; left:7px; background-color:#ffbc0d}
.menum{color:#fff; font-size:1.7rem; position:fixed; top:36px; letter-spacing:0; right:13px}

.overlay {position:fixed; background:#fff; top:0; left:0; width:100%; height:0%; opacity:0; visibility:hidden; -webkit-transition: opacity .35s, visibility .35s, height .35s; transition:opacity .35s, visibility .35s, height .35s; overflow: hidden; z-index:250}
.overlay.open {opacity:1; visibility:visible; height:100%;}
.overlay.open li {-webkit-animation:fadeInRight .5s ease forwards; animation:fadeInRight .5s ease forwards; -webkit-animation-delay:.35s; animation-delay:.35s;}
.overlay.open li:nth-of-type(2) {-webkit-animation-delay:.4s; animation-delay:.4s;}
.overlay.open li:nth-of-type(3) {-webkit-animation-delay:.45s; animation-delay:.45s;}
.overlay.open li:nth-of-type(4) {-webkit-animation-delay:.50s; animation-delay:.50s;}
.overlay nav {position:relative; height:70%; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); font-size:24px; text-align:center; letter-spacing:-0.01em}
.overlay ul {list-style:none; padding:0; margin:0 auto; display:inline-block; position:relative; height:100%}
.overlay ul li {display:block; height:15%; height: calc(100%/5); min-height:30px; position:relative; opacity:100; text-align:center}
.overlay ul li a {display:block; position:relative; font-family:"eic-bold", sans-serif; letter-spacing:0.2em; font-size:2.5rem; color:#444; text-decoration:none; z-index:99999}
.overlay ul li a:hover {color:#ffb615}

#loader {display:none; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; background:rgba(0,0,0,0.85); z-index:10000}
.lds-ripple {display:inline-block; position:relative; width:96px; height:96px; margin:42% 0 0 39%}
.lds-ripple div {position:absolute; border:8px solid #fff; opacity:1; border-radius:50%;animation:lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;}
.lds-ripple div:nth-child(2) {animation-delay:-0.5s;}
@keyframes lds-ripple {0% {top:48px; left:48px; width:0; height:0; opacity:1} 100% {top:0px; left:0px; width:96px; height:96px; opacity:0} }
}

@media (min-width: 410px) {
#hero{height:360px; background-position:top center; background-size:150% auto}
.mob img{width:74px}
}

@media (min-width: 500px) {
#hero{height:420px}
#produtos{height:360px}
#wood{padding-top:170px}
}


@media (min-width: 800px) {
#hero{height:550px; background-size:120% auto}
#produtos{height:500px}
#wood{background-size:100% auto; padding-top:140px; padding-bottom:50px}
.simbol{float:left;max-width:80%}
.mob img{width:90px}
}


@media (min-width: 1000px) {
.ico{width:70px;height:auto}
.lds-ripple {width:152px; height:152px; margin:20% 0 0 45%}
#como{background-size:cover; background-attachment:inherit;}
#hero{height:680px; background-size:100% -60px}
#wood{height:auto; background-size:contain; padding-top:200px; padding-bottom:70px}
.atividades{display:block}
.atividades-mob{display:none}
#produtos{height:650px}
.simbol{float:left;max-width:50%}
.craftxt{padding:0 12% 0 0}
}



@media (min-width: 1280px) {
.container.cat{width:60%}
.logo{width:120px; margin-top:0}
.ingresso{padding:30px 20px; border-radius:14px; border:4px solid #333; width:400px; margin:5% auto}
.mob{display:none}
.button_containe {display: none}
.menum {display: none}
#top{display:block;position:absolute;z-index:999; width:70%;left:14%;top:0; padding:2px 10px}
#in{display:block;position:relative;z-index:999; width:71.5%;left:0;margin:180px auto 130px auto; padding:2px 10px}
.menu{display:block;}.menu ul{margin-bottom:0}
.menu li{display:inline-block; margin:26px 6px; margin-bottom:0; font-family:"eic-bold", sans-serif; letter-spacing:0.12em; font-size:2rem}
.menu li a{color:#000}
.menu li a:hover{color:#fff}
.menu img{width:70px;height:auto;float:left; margin:3px 70px 8px 0}
.menu .rs{width:20px;height:auto; margin:25px 3px}
#hero{height:620px; background-size:100%; background-position:center -20px}
.bloco{width:150px;height:150px; float:left; margin:5px 22px 25px 0}
.bloco #dia{width:20px;height:20px; margin:5px}
}

@media (min-width: 1360px) {
#hero{height:680px; background-position:center -30px}
#wood{padding-top:250px}
#produtos{height:750px}
}


@media (min-width: 1600px) {
#hero{height:780px; background-position:center -30px}
#top{width:70%;left:15%; padding:2px 14px}
.menu li{margin:28px 10px; font-size:2.4rem}
.menu img{width:80px; margin:3px 70px 8px 0}
.menu .rs{width:24px; margin:30px 3px}
#pe{height:520px}
#wood{padding-top:280px}
#produtos{height:800px}
}

@media (min-width: 1900px) {
#hero{height:930px}
#wood{padding-top:330px}
#produtos{height:900px}
}





#return-to-top {position:fixed; bottom:18px; right:20px;background:rgb(0, 0, 0); background:rgba(0, 0, 0, 0.5); width:48px; height:48px; display: block; text-decoration:none; -webkit-border-radius:34px; -moz-border-radius:34px; border-radius:34px; display:none; -webkit-transition:all 0.3s linear; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease;}
#return-to-top i{color:#fff; margin:0; position:relative; left:18px; top:16px; font-size:19px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease;  transition:all 0.3s ease;}
#return-to-top:hover {background:rgba(0, 0, 0, 0.7)}
#return-to-top:hover i {color:#fff; top:14px}
.arrow {border:solid #fff; border-width:0 4px 4px 0; display:inline-block; padding:4px; transform: rotate(-135deg);-webkit-transform: rotate(-135deg);}



.fadeout { webkit-animation: fadeout 0.5s; -ms-animation: fadeout 0.5s; animation: fadeout 0.5s;}
.fadein { webkit-animation: fadein 0.5s; -ms-animation: fadein 0.5s; animation: fadein 0.5s;}
@keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@-webkit-keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@-ms-keyframes fadein { from { opacity: 0; }  to   { opacity: 1; }}
@keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}
@-webkit-keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}
@-ms-keyframes fadeout { from { opacity: 1; }  to   { opacity: 0; }}