/* General Blueprint Style */
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&family=Margarine&display=swap');

@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?6y9lb8');
  src:  url('fonts/icomoon.eot?6y9lb8#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?6y9lb8') format('truetype'),
    url('fonts/icomoon.woff?6y9lb8') format('woff'),
    url('fonts/icomoon.svg?6y9lb8#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-facebook-square:before {
  content: "\f082";
  vertical-align: middle;
  font-size: 28pt;
  margin: 0 5px 0 0;
  line-height: 35pt;
}
.icon-google-plus:before {
  content: "\f0d5";
  vertical-align: middle;
  font-size: 28pt;
  margin: 0;
  line-height: 35pt;
}
.icon-instagram:before {
  content: "\f16d";
  vertical-align: middle;
  font-size: 28pt;
  line-height: 35pt;
  margin: 0 4px 0 0;
}
.icon-chevron-left:before {
  content: "\e900";
}
.icon-chevron-right:before {
  content: "\e901";
}
.icon-controller-paus:before {
  content: "\e902";
}
.icon-controller-play:before {
  content: "\e903";
}
.icon-download:before {
  content: "\e904";
}
.icon-resize-100:before {
  content: "\e905";
}
.icon-resize-full-screen:before {
  content: "\e906";
}
.icon-clock:before {
  content: "\e90c";
  vertical-align: middle;
  color:#ff7820;
}
.icon-cross:before {
  content: "\e907";
}
.icon-grid:before {
  content: "\e908";
}
.icon-location-pin:before {
  content: "\e90d";
  vertical-align: middle;
  color:#ff7820;
  font-size: 20pt;
  margin: 0;
}
.icon-minus:before {
  content: "\e909";
}
.icon-mobile:before {
  content: "\e90e";
  vertical-align: middle;
  color:#ff7820;
}
.icon-plus:before {
  content: "\e90a";
}
.icon-popup:before {
  content: "\e90b";
}

a:link { color: #fff; text-decoration:none; }
a:visited { color: #fff }
a:active { color: #cf3381; }

.whi { color: #fff;}
.red { color: #a5301b;}
.bl { color: #15a5aa;}
.ora { color: #ff7820;}
.bla { color: #000;}
b { font-weight: 500;}
.md { font-weight: 400;}
.lig { font-weight:300;}

/*ICON CONTACT*/
.contact .icon-location-pin:before, .contact .icon-mobile:before, .contact .icon-clock:before { color:#a5301b; }
.icon-instagram, .icon-google-plus, .icon-facebook-square { color: #ff7820; margin: 0; font-size: 35pt; line-height: 37pt;}

.contact .icon-instagram:hover, .contact .icon-google-plus:hover, .contact .icon-facebook-square:hover { color:#a5301b; transition: 0.5s ease;}
.icon-instagram:hover, .icon-google-plus:hover, .icon-facebook-square:hover { color:#fff; transition: 0.5s ease;}

h1 { font-family: 'Margarine', sans-serif; font-size: 38pt; line-height: 42pt; margin: 0;}
h2 { font-family: 'Lexend Deca', sans-serif; font-size: 32pt;font-weight: 100; margin: 0; line-height: 32pt;}
h3 { font-family: 'Lexend Deca', sans-serif; font-size: 20pt; line-height:24pt;font-weight: 200; margin: 0;}
h4 { font-family: 'Margarine', sans-serif; font-size: 41pt; line-height:37pt; font-weight: 700; margin: 0;} 
h5 { font-family: 'Lexend Deca', sans-serif; text-transform: uppercase; letter-spacing: 1.5pt; font-weight: 600; font-size: 12pt; line-height: 20pt; margin: 0;}
p { font-family: 'Lexend Deca', sans-serif; font-size: 20pt; line-height: 24pt;font-weight: 200; margin: 0;}

/*MENU*/
section.menu h2 { font-size: 13pt; font-weight: 700; display: block; width: 70%; clear: none; float: left; line-height: 16pt; margin: 2.5% 5% 0 0;}
section.menu h3 { font-size: 13pt; font-weight: 700; display: block; width: 25%; clear: none; float: left; text-align: right; line-height: 16pt; margin: 2.5% 0 0;}
section.menu p { font-size: 11pt; display: block; width: 90%; float: left; line-height: 16pt; font-weight: 300;}
section.menu h4, .info h4 { font-family: 'Lexend Deca', sans-serif; font-size: 16pt; font-weight: 200; line-height: 19pt; }
section.menu .opt { display: block; margin-left: 5%; font-weight: 500;}
#title p { text-transform: uppercase; letter-spacing: 1.5pt; font-weight: 600; font-size: 12pt; line-height: 20pt; width: 100%;}
.draft h1 { font-size: 17pt; line-height: 20pt;}
.draft #title h2 { font-size: 34pt; width: 100%; margin: 0; line-height: 32pt; font-weight: 300;}

.menu a { font-family: 'Lexend Deca', sans-serif; font-size: 12pt; line-height:35pt;font-weight: 400; margin-left: 12px;letter-spacing: 0.9px; transition: 0.5s ease; text-transform: uppercase; color: #000;}
.menu a:hover { color:#a5301b; border-bottom: 1px solid #a5301b; transition: 0.5s ease;}
.menu a.act { font-weight: 700;}

/* SLIDE */
.slide-txt h1, .head-txt h1 { color: #fff; font-size: 50pt; line-height: 30pt; text-shadow: 1px 0px 25px rgb(0,0,0,0.8);}
.slide-txt h2 { color: #fff; font-size: 30pt; line-height: 30pt; font-weight: 200; text-shadow: 1px 1px 25px rgb(0,0,0,0.8);}

/*TYPEWRITER*/
.type h2 { font-weight: 500; color: #a5301b;}
.type h1, .type h1 a { color:#ac9b77; text-transform: uppercase; font-size: 82pt; line-height: 84pt;}
.type p { width: 70%; margin: 4% 15% 0;}
.typewriter {
  font-family: monospace;
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .15em solid orange; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .15em; /* Adjust as needed */
  animation: 
    typing 3.5s steps(30, end),
    blink-caret .5s step-end infinite;
}

/*FOOTER*/
footer p { font-size: 10pt; line-height: 14pt; color: #fff;}
footer p a { font-size: 9pt; color: #fff;}
footer p a.act { border-bottom: 1px solid #ff7820;}
footer a:hover { color:#ff7820;}

#copy, #copy a { font-size: 7pt; text-transform: uppercase; letter-spacing: 1pt; font-weight: 500; color: #838e91;}
#copy a:hover { color: #fff;}


/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange }
}

@media screen and (max-width: 769px) {   
h1 { font-size: 40pt; line-height: 35pt;}
h2 { font-size: 26pt; line-height: 30pt;}
h3 { font-size: 17pt; line-height:20pt;}
p { font-size: 17pt; line-height: 21pt;}
.type h1, .type h1 a { font-size: 70pt;}
    
/*NAV MENU*/
.menu a { font-size: 13pt; margin-left: 0 4px; letter-spacing: 2px; }
    
/**SLIDE**/
.slide-txt h1 { font-size: 38pt; line-height: 34pt; text-transform: uppercase;}
}

@media screen and (max-width: 581px) {
.type h1, .type h1 a { font-size: 42pt;}
h1 { font-size: 42pt; line-height: 42pt;}
h2 { font-size: 26pt; line-height: 25pt;}
h3 { font-size: 15pt; line-height:18pt;}
p { font-size: 18pt; line-height: 22pt;}

.type h1 a { font-size: 50pt; text-transform: capitalize; line-height: 20pt;}
    
/*NAV MENU*/
.menu a { font-size: 13pt; margin-left: 0 4px; letter-spacing: 1px; }

/**MENU**/
#title p, h5 { font-size: 14pt;}
.menu h1 { font-size: 38pt;}
section.menu h2, section.menu h3 { font-size: 13pt; font-weight: 600;}
.menu h4 { font-size: 18pt; line-height: 18pt;}
section.menu p { font-size: 12pt; line-height: 18pt;}
.draft h1 { font-size: 17pt; line-height: 22pt;}

    
/**SLIDE**/
.slide-txt h1 { font-size: 45pt; line-height: 35pt; text-transform: uppercase;}
.head-txt h1 { font-size: 40pt; line-height: 20pt; text-shadow: none;}
    
footer p { font-size: 11pt; line-height: 17pt;}
#copy, #copy a { font-size: 7pt; line-height: 8pt;}

}



