@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,400i,500,700&display=swap');

*, *:after, *:before {-webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit;}
* {-moz-font-feature-settings: "liga" 0; font-feature-settings: "liga" 0; -webkit-font-feature-settings: "liga" 0;}
*{margin: 0;padding: 0;}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
  
html{
  font-size: 62.5%;
	color: #333;
  -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; height: 100%;
}

body {
  overflow-x:hidden;
  line-height: 1;  
  font-weight: 400;
  font-family: 'Roboto', sans-serif;
  text-rendering: optimizeLegibility;
  box-sizing: border-box;
  font-size: 10px;
}
h1 ,h2, h3, h4 {font-weight: bold;}

h2 {font-size: 3.7rem;}
h3 {font-size: 2.8rem; line-height: 1.1;}
h4 {font-size: 1.9rem; line-height: 1.1; color: #debb5c; font-weight: 100;}
ul, nav{list-style: none;}
a{
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}
img {display: block; width: 100%;}

section h2 {text-align: center;}

p, ul li {line-height: 1.5;}

button {overflow: visible;}
button, select {text-transform: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled] {cursor: default;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
input {line-height: normal;}

/* Generic */
.section__button {display: block; text-align: center; padding: 3rem 0 0;}
.btn {
  font-size: 2.7rem;
  padding: 1.5rem 2rem;
  background-color: #debb5c;
  text-transform: uppercase;
  font-weight: 700;
  min-width: 20rem;
  margin: 0 auto;
  color: #ffffff;
  display: inline-block;
  box-shadow: 4px 5px 4px -3px rgba(145,140,144,0.6);
  border: none;
}

.section__columns {
	display: -moz-flex;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
	flex-flow: row wrap;
	align-items: stretch;
  justify-content: space-between;
}

.col-item {flex: 1;}
.col-item img {width: 100%;}

.two_col .col-item {flex-basis: 50%;}
.three_col .col-item {flex-basis: 33.33333%;}
.four_col .col-item {flex-basis: 25%;}

.section {
  margin: 0 auto;
  max-width: 120rem;
  width: 70%;
  min-height: 20rem;
  padding: 4.5rem 0;
}
.section:after {visibility: hidden; display: block; content: ""; clear: both; height: 0;}
* html .section             {zoom: 1;} /* IE6 */
*:first-child+html .section {zoom: 1;} /* IE7 */

/*
.section__title, .space__lge-bot {margin: 0 0 3.5rem;}
.space__med-bot {margin: 0 0 2.5rem;}
*/

@media screen and (max-width: 980px) {
	.section {width: 90%; padding: 3rem 0;}
}


/*  Header  */

.header {position: relative;}
.header {
  background-repeat: no-repeat;
  background-position: top;
  background-attachment: fixed;
  -ms-background-size: cover;
  -o-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
}
@media only screen and (min-width: 1281px) {
  .no-webp .header {background-image: url("/img/hero.jpg");}
  .webp .header {background-image: url("/img/hero.webp");}
  .header {background-position: center;}
}
@media only screen and (max-width: 1280px) {
  .no-webp .header {background-image: url("/img/hero-1280.jpg");}
  .webp .header {background-image: url("/img/hero-1280.webp");}
  .header {background-position: center;}
}
@media only screen and (max-width: 1024px) {
  .no-webp .header {background-image: url("/img/hero-1024.jpg");}
  .webp .header {background-image: url("/img/hero-1024.jpg");}
}
@media only screen and (max-width: 640px) {
  .no-webp .header {background-image: url("/img/hero-640.jpg");}
  .webp .header {background-image: url("/img/hero-640.webp");}
}
@media only screen and (max-width: 440px) {
  .no-webp .header {background-image: url("/img/hero-420.jpg");}
  .webp .header {background-image: url("/img/hero-420.webp");}
}
@media only screen and (max-width: 320px) {
  .no-webp .header {background-image: url("/img/hero-300.jpg");}
  .webp .header {background-image: url("/img/hero-300.webp");}
}

.header::after {
  content: "";
  display: block;
  background: #333333;
  opacity: 0.6;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: 1;   
}

.header .section {
  min-height: 55rem;
  color: #ffffff;
  text-align: center;
  margin: 0 auto;
  position: relative;
  z-index: 2;
  padding: 8rem 0 8rem 0;
}
.header h1 {font-size: 3.9rem; font-weight: 700; text-transform: uppercase; line-height: 1; margin-bottom: 2.5rem;}
.header h2 {font-size: 2.1rem; font-weight: 200; line-height: 1; margin-bottom: 4rem;}
.header__title {padding: 0 0 0; max-width: 90%; margin: 0 auto;}
.header__title-logo {width: 60%; margin: 0 auto; margin-bottom: 3rem;}

@media screen and (max-width: 640px) {
  .header h1 {line-height: 1.25;}
  .header h2 {line-height: 1.3; font-size: 2.5rem;}
  .header__title-logo {width: 80%; display: block;}
  .header .section {min-height: 65vh;}
}

@media screen and (max-width: 450px) {
  .header {padding: 2rem 0px 0px;}
  .header .section {min-height: 70vh;}
  .header__title {display: block;}
  .header h2 {line-height: 1.3; font-size: 2.2rem;}
}



/*  CONTENT(Main Text) Section  */

.section__content .section__inner {text-align: center;}
.section__content p {font-size: 2.2rem; font-weight: 100; line-height: 3rem; margin-bottom: 6rem;}
.section__content ul li {font-size: 1.8rem; font-weight: 300; line-height: 2.5rem;}
.section__content h2 {margin-bottom: 4rem;}
.section__content h3 {margin-bottom: 2rem;}

.section__content .col-item {text-align: left;}
.section__content .two_col .col-item {padding: 0 2rem;}
.section__content .two_col .col-item img {margin-bottom: 4rem;}

.section__content .three_col .col-item {padding: 0 1rem;}
.section__content .three_col .col-item h4 {margin-bottom: 1.5rem;}
.section__content .three_col .col-item p {font-size: 1.65rem; font-weight: 300; line-height: 2.2rem;}
.section__content .three_col .col-item img {margin-bottom: 2.2rem;}

.section__inner {padding: 3rem 0 4.5rem 0;}
.section__columns {margin-top: 6rem;}

/*========== DOWNLAODS ========== */
.section__downloads {
	background-color: #f8f1de;
  max-width: 100%;
  width: 100%;
}
.section__downloads .section__inner {max-width: 120rem; width: 45%; margin: 0 auto;}

.section__downloads .section__inner a.btn {
	text-decoration: none;
  display: block;
  min-height: 40px;
  color: #333333;
  font-size: 2rem;
  padding: 12px 0 0 55px;
  text-align: left;
  text-transform: none;
  font-weight: 400;
  min-width: auto;
  width: 100%;
  margin: 0 auto 20px auto;
  box-shadow: none;
  border: none;
  margin-right: -20px;
	background: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='29' height='36' viewBox='0 0 171.9 210.9' style='enable-background:new 0 0 171.9 210.9;' xml:space='preserve'%3E%3Cg%3E%3Cpath class='dn-link' d='M85.5,211c-20.8,0-41.6,0-62.5,0c-13.3,0-22.7-8.5-22.8-21.8c-0.2-42.5-0.3-85,0-127.4c0.1-13.5,9.3-21.8,22.7-21.9c9.3,0,18.7,0,28,0c6.7,0,10.7,3.6,10.6,9.2C61.3,54.5,57.4,58,51,58c-8.8,0-17.7,0.2-26.5-0.1c-4.4-0.1-5.8,1.5-5.7,5.9c0.1,41,0.2,82,0,122.9c0,5.1,2,6.2,6.5,6.2c31.2-0.1,62.3-0.1,93.5-0.1c9.3,0,18.7-0.1,28,0.1c4.5,0.1,6.5-1.1,6.5-6.2c-0.2-41-0.2-82,0-122.9c0-4.3-1.4-6-5.7-5.8c-8.8,0.2-17.7,0.1-26.5,0.1c-6.3,0-10.3-3.5-10.5-8.9c-0.1-5.6,3.9-9.2,10.6-9.2c9-0.1,18,0,27,0c15.1,0,23.7,8.6,23.8,23.9c0.1,28,0,56,0,84c0,13-0.2,26,0.1,39c0.3,16.3-11.4,25-24.5,24.5C126.8,210.5,106.1,211,85.5,211z'/%3E%3Cpath class='dn-link' d='M76.8,120.1c0-1.2,0-2.9,0-4.7c0-34,0-67.9,0-101.9c0-2-0.1-4,0.2-6C77.7,3,81.7-0.1,86.2,0c4.3,0.1,8,3.2,8.7,7.5c0.3,2,0.2,4,0.2,6c0,34,0,67.9,0,101.9c0,1.8,0,3.6,0,6.3c4.5-4.4,8.3-8.2,12.1-12c2-2,3.8-4.2,5.9-6.1c4.1-3.6,9.5-3.5,13,0.2c3.6,3.7,3.7,8.7-0.3,13c-7.3,7.8-14.7,15.4-22.1,23.1c-3.6,3.7-7.1,7.4-10.8,11.1c-4.5,4.4-9.6,4.5-14,0c-10.8-11.1-21.6-22.2-32.3-33.4c-4.5-4.7-4.8-9.8-1-13.7c3.9-4,9.3-3.7,14.1,0.8C65.4,109.8,71.1,114.9,76.8,120.1z'/%3E%3C/g%3E%3C/svg%3E") no-repeat left top;
}
.section__downloads .section__inner .btn:hover {color: #666;}
/*
.section__downloads .section__inner .btn:hover > .dn-svg .dn-link {fill: #333 !important;}
.section__downloads .section__inner .btn:hover > span {border-bottom: 1px solid #333;}
*/

@media screen and (max-width: 640px) {
	.section__downloads .section__inner {max-width: 100%; width: 75%;}
}
@media screen and (max-width: 420px) {
	.section__downloads .section__inner {width: 93%;}
}



/*  Video  */
.vid-wrap {
	position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;
  width: 100%;
}
.vid-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* List */
ul {
  list-style: disc;
  margin: 0 0 0 1rem;
  padding-left: 1rem;
}

ul li {padding-left: 0;}


/* Form */
form {margin: 0 0 2rem 0;}
/*.section__contact .two_col .col-item {padding: 0 1rem; margin-top: 2rem;}*/

/* Making the label break the flow */
.floating-label{
  position: absolute;
  top: 0;
  left: 0;
  user-select: none;
  z-index: 1500;
}

/* Hide the browser-specific focus styles */
.floating-label-field{
  color: rgba(44, 62, 80, .75);
  border-width: 0;
  z-index: 2000;
}

.floating-label-field:focus{
  outline: 0;
  box-shadow: 0;
}

.floating-label-field::placeholder{color: rgba(0, 0, 0, .5);}

/* Make the label and field look identical on every browser */
.floating-label,
.floating-label-field{
  font: inherit;
  font-size: 1.7rem;
  line-height: 1.9rem; 
  display: block;
  width: 100%;
}

.floating-label-field, .section__contact .two_col .col-item {position: relative;}

/* Input Style */
.floating-label-field--s1{
    transition: border-color .25s ease-in-out;
    color: rgba(0, 0, 0, .75);
    border-bottom: 2px solid rgba(0, 0, 0, .3);
    background-color: transparent;
}

.floating-label-field--s1 + .floating-label{
    transition: transform .25s, opacity .25s ease-in-out;
    transform-origin: 0 0;
    opacity: .4;
}

.floating-label-field--s1:focus,
.floating-label-field--s1:not(:placeholder-shown) {border-color: rgba(0, 0, 0, .5);}

.floating-label-field--s1:focus + .floating-label,
.floating-label-field--s1:not(:placeholder-shown) + .floating-label{
    transform: translate(.25em, -30%) scale(.8);
    opacity: .65;
}

.floating-label-field--s1:valid:not(:placeholder-shown){border-color: rgba(0, 0, 0, .3);}

/*.floating-label-field--s1:invalid{border-color: rgba(255, 71, 87, .3);}*/

/* Identical inputs on all browsers */

/*.floating-label-field--s1:not(textarea){max-height: 4rem;}*/

.floating-label-field--s1,
.floating-label-field--s1 + .floating-label{padding: 2.5rem 2rem 1.2rem 2rem;}

.floating-label-field--s1{padding: 3rem 2rem 1.2rem 1.3rem;}

.floating-label-field--s1 + .floating-label{z-index: 1500;}
.floating-label-field--s1::placeholder{color: transparent;}

textarea {padding-bottom: 1rem;}

#form-messages {
  opacity:0;
  transition:1s;
  text-align: center;
  width: 100%;
  font-size: 2.2rem;
}
#contactform {opacity:1; transition:0.6s;}

.section__contact .col-item {padding: 0 1%;}


/*  Footer  */
footer {
    
}
footer .section {
  min-height: auto;
  text-align: center;
  background-color: #333333;
  padding: 3rem 0;
  width: 100%;
  max-width: 100%;
}
footer .footer__header {
  background-color: #debb5c;
  padding: 6rem 0;
}
footer .section__inner, footer .section__columns {max-width: 120rem; width: 70%; margin: 0 auto;}
footer .section__columns .col-item {flex: initial; max-width: 25%;font-size: 2.5rem; font-weight: 700; align-self: center;}
footer, footer p {text-align: center;}
footer p {
  color: #757575;
  font-size: 1.7rem;
  line-height: 1.4;
  font-weight: 300;
}
@media screen and (max-width: 640px) {
  .section__content .section__columns, footer .section__inner, footer .section__columns {width: 92%; margin: 0 auto;}
  footer .section__columns {flex-direction: column;}
	h2 {font-size: 3rem;}
  .section__content h3 {text-align: left;} 
	.section__content h2 {font-size: 2.6rem;}
	.section__title {font-size: 2.2rem;}
  
  footer .section__columns .col-item {flex: none; max-width: 100%; width: 60%;}
  footer .section__columns .col-item:nth-child(2) {margin: 4rem 0;}
  
  .section__content .two_col .col-item:first-child {margin-bottom: 4rem;}
  .three_col .col-item, .two_col .col-item, .section__content .two_col .col-item, .section__content .three_col .col-item {flex-basis: 100%; padding: 0; display: block;}
  .four_col .col-item {flex-basis: 50%;}
	.section__downloads .section__inner a.btn {font-size: 1.8rem; min-height: 37px;margin: 0 auto 15px auto;padding: 10px 0 0 45px;line-height: 1.2;background-size: 26px;}
}
@media screen and (max-width: 420px) {
  .four_col .col-item {flex-basis: 100%;}
	.section__inner h2 {font-size: 2.25rem;}
	.section__contact .section__title {margin: 0 0 0 0;}
	.section {min-height: 8rem;}
	.section__downloads .section__inner a.btn {font-size: 1.5rem;min-height: 30px;padding: 8px 0 0 40px;background-size: 22px;}
}

