@charset "utf-8";
/* CSS Document */

/* font-face */
@font-face {
    font-family: "Oswald Regular";
    src: url(../webfonts/Oswald-Regular.ttf) format('truetype');
}

@font-face {
    font-family: "Raleway Regular";
    src: url(../webfonts/Raleway-Regular.ttf) format('truetype');
}

@font-face {
    font-family: "Raleway Medium";
    src: url(../webfonts/Raleway-Medium.ttf) format('truetype');
}

@font-face {
    font-family: "Raleway SemiBold";
    src: url(../webfonts/Raleway-SemiBold.ttf) format('truetype');
}

@font-face {
    font-family: "Raleway Bold";
    src: url(../webfonts/Raleway-Bold.ttf) format('truetype');
}

@font-face {
    font-family: "Montserrat Light";
    src: url(../webfonts/Montserrat-Light.ttf)  format('truetype');
}

@font-face {
    font-family: "Montserrat Regular";
    src: url(../webfonts/Montserrat-Regular.ttf)  format('truetype');
}

@font-face {
    font-family: "Montserrat SemiBold";
    src: url(../webfonts/Montserrat-SemiBold.ttf)  format('truetype');
}

@font-face {
    font-family: "Montserrat Bold";
    src: url(../webfonts/Montserrat-Bold.ttf)  format('truetype');
}

@font-face {
    font-family: "Khand Regular";
    src: url(../webfonts/Khand-Regular.ttf) format('truetype');
}

@font-face {
    font-family: "Khand Medium";
    src: url(../webfonts/Khand-Medium.ttf) format('truetype');
}

@font-face {
    font-family: "Khand Semibold";
    src: url(../webfonts/Khand-Semibold.ttf) format('truetype');
}

@font-face {
    font-family:"SourceSansPro-Light";
    src: url(../webfonts/SourceSansPro-Light.ttf) format('truetype');
}

@font-face {
    font-family:"SourceSansPro-Regular";
    src: url(../webfonts/SourceSansPro-Regular.ttf) format('truetype');
}

@font-face {
    font-family:"SourceSansPro-Semibold";
    src: url(../webfonts/SourceSansPro-Semibold.ttf) format('truetype');
}

@font-face {
    font-family: "Coolvetica Rg";
    src: url(../webfonts/Coolvetica-rg.ttf) format('truetype');
}

/* body */
body {
	font: "SourceSansPro-Regular", sans-serif;
	font-size: 16px 1rem;
	background-color: #FFF;	
	margin: auto;
}

/* Scrollbar */
/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #61d101 #184153;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 12px; 
}

*::-webkit-scrollbar-track {
  background: #184153;
}

*::-webkit-scrollbar-thumb {
  background-color: #61d101;
  border-radius: 1rem;
  border: 2px solid #184153;  
}

/* format */
.fullframe {
	float: left;
	width: 100%;	
	height: auto;	
	display: inline-block;	
	text-align: center;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */
}

.frame {	
	width: 80%;
	height: auto;
	display: inline-block;
	text-align: center;	
	padding: 0 0 1rem 0;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */	
}

.frame-2 {	
	width: 80%;
	height: auto;
	display: inline-block;
	text-align: center;		
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */	
}

.halframe {	
    float: left;
	width: 50%;
	height: auto;
	display: inline-block;
	text-align: left;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */	
}

/* bar-header */
#soc-bar-block {	
	width: 80%;
	height: auto;
	background: #FFF;	
	text-align: right;
	display: inline-block;
	border-bottom: #184153 1px solid;	
	padding: 3.5rem 0 0 0;	
}

#soc-bar-left {
	float: left;
	width: 66%;
	line-height: 2.8rem;	
	color: #184153;	
	text-align: left;
	display: inline-block;
	font-family: "Coolvetica Rg";
	font-size: 1.4rem;	
	padding: 1% 1% 1% 2%;	
}

#soc-bar-right {
	float: left;
	width: 28%;
	height: auto;	
	text-align: right;
	display: inline-block;	
	padding: 1%;	
}

.soc-buttons {
	width: 2rem;
	height: auto;	
	background: #184153;
	display: inline-block;
	text-align: center;
	padding: 0.25rem;
	border-radius: 0.5rem;
	margin: 0 0.15rem 0 0.15rem;
}

.soc-buttons:hover {
	background: #61d101;	
}

#logo-block-holder {
	width: 78%;
	height: auto;
	background: #FFF;		
	display: inline-block;
	text-align: left;	
	padding: 1%;			
}

#logo-block {	
	width: 34%;
	height: auto;	
	display: inline-block;	
}

#eu-logo-block {
	float:right;	
	width: 7%;
	height: auto;	
	display: inline-block;
	padding: 0 1rem 0 1rem;		
}

.blank {
	width: 100%;
	height: auto;	
	display: inline-block;
	padding: 3rem 0 0 0;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */	
}

.titles {	
	width: 100%;
	height: auto;
	line-height: 100%;
	color: #184153;	
	display: inline-block;
	text-align: left;
	word-break: break-all;	
	font-family: "Coolvetica Rg";
	letter-spacing: .05rem;
	font-size: 1.5rem;
	padding: 1% 0 1% 0;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */
}

.titles-2 {	
	width: 98%;
	height: auto;
	line-height: 100%;
	color: #FFF;	
	display: inline-block;
	text-align: left;
	word-break: break-all;
	font-family: "Coolvetica Rg";
	font-size: 2.5rem;
	padding: 1% 1% 1% 1%;
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */
}

.booklogo {
	width: 20%;
	height: auto;
	display: inline-block;	
}

/* back buttons */
.back-button {
	float: right;
	width: auto;
	height: auto;
	color: #184153;	
	display: inline-block;	
	font-family: "Raleway Medium";
	font-size: 1.1rem;	
	padding: 0.25rem 0.5rem 0.4rem 0.5rem;
	border-radius: 0.5rem;
	cursor: pointer; 
}

.back-button:hover {
	color: #61d101;
}

.vid {	
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;	
	
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-webkit-transition: all 1s ease-in-out;
	-ms-trasition: all 1s ease-in-out;
	transition: all 1s ease-in-out;	format */	
}

/* videos */
.videoContainer {
	width: 100%;
	height: auto;
	display: inline-block;
	
}

.videoWrapper {
	position: relative;
	padding-bottom: 50%; /* 16:9 */	
	height: 0;
}

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: -3.5%;
	width: 107%;
	height: 100%;
}

.videothumb {	
	width: 40%;
	height: auto;
	color: #61d101;
	display: inline-block;	
	font-family: "Raleway Regular";
	font-size: 1.2rem;
	margin-top: 3rem;	
	overflow: hidden;	
}

#vidthmbimg-01 {
	width: 100%;
	height: auto;
	padding: 0 0 0.5rem 0;
}

/* paralax-imgs */
.paralax {	    
	background-size: 100% 100%;
	background-attachment: fixed;
	background-clip: border-box;
	background-repeat: no-repeat;
	background-position: left;	
}

# { background-image:; }

/* footer */
#footer {
	line-height: 150%;
	background: #184153;
	text-align: center;
	font-family: "SourceSansPro-Light";
	font-size: 1.04rem;
	padding: 1rem 0 1rem 0;
	border-top: #61d101 1px solid;    	
	
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-trasition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;	format */  
}

#footer-frame {
	display: inline-block;
	text-align: center;
}

#foot-logo-frame {
	width: 80%;
	height: auto;	
	display: inline-block;
	text-align: left;	
}

.foot-block {
	float: left;
	width: 25%;
	height: auto;
    color: #FFF;	
	display: inline-block;
	text-align: left;	
}

#foot-logo {	
	width: 31%;
	height: auto;
	margin: 0.5rem 0 1.5rem 0;	
}

.foot-link {
	color: #FFF;	
	text-decoration: none;
	margin-left: 0.5rem;			
}

.foot-link:hover {
	color: #61d101;
	transition: all 0.6s ease;
}

.foot-soc-buttons {
	width: 2rem;
	height: auto;
	background: #61d101;
	display: inline-block;
	text-align: center;
	padding: 0.25rem;
	border-radius: 0.5rem;
	margin: 0 0.15rem 0 0.15rem;
}

.foot-soc-buttons:hover {
	background: #acbed2;	
}

#foot-inner-frame {
	width: 100%;
	color: #61d101;	
	display: inline-block;
	text-align: left;
	font-family: "SourceSansPro-Light";
	font-size: 1rem;
	padding: 1rem 0 1rem 0;
}