@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------------------------------------------------------
	1. Clean Base
	2. Base Typography
	3. Images
	4. Links
	5. Forms
	6. Tables
	7. Framework 
*/

/* 1. Clean Base
------------------------------------------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, 
legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, a, nav, section, summary, time, mark, audio, video 
{margin:0 auto; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none; list-style:none; outline:none; -webkit-font-smoothing: subpixel-antialiased; -webkit-tap-highlight-color:rgba(0,0,0,0);}
	
html,body { -webkit-text-size-adjust:none; -webkit-font-smoothing: antialiased;}
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block;}
img{border:none;}

input[type="text"], input[type="submit"], input[type="button"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea {-webkit-appearance: none; outline: none;}
textarea:focus, input:focus, a, div, img { outline: none; }
 
.cf:before, .cf:after { content: ""; display: table; }
.cf:after { clear: both; }
.cf { zoom: 1; }
.clear { clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block;}
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0;}

/* 2. Base Typography
------------------------------------------------------------------------------*/
@font-face {
    font-family: 'gotham_bookregular';
    src: url('../fonts/gotham-book.woff2') format('woff2'),
         url('../fonts/gotham-book.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

body{ color:#8f8f8f; font-size:13px; font-family: 'gotham_bookregular'; font-weight:400; line-height:22px;}

h1, h2, h3, h4, h5, h6{ margin-bottom:20px; font-weight:normal;}
h1{ font-size:35px; line-height:38px; color: #fff; margin: 0 0 40px;}
h2{ font-size:35px; line-height:38px; color: #6fbe44; margin: 0 0 20px;}
h3{ }
h4{ }
h5{ }
h6{ }

p{ color:#fff; font-size:16px; font-weight:400; line-height:32px; margin-bottom:70px; word-wrap: break-word;}

ul{ margin:0 0 20px; padding:0;}
ul li{ font-size:15px;  color:#8f8f8f; font-weight:400; line-height:20px; padding:0 0 0 22px; list-style:none; margin: 0 0 12px; background: url(../images/list-icon.png) no-repeat 0 6px;}

ol{ margin:20px 20px; padding:0;}
ol li{ font-size:13px;  color:#373d48; font-weight:400; line-height:18px; padding:0 0 5px 0; list-style: decimal; margin-left:20px;}

blockquote{ display:block; text-align:left; margin-bottom:20px; position:relative; background:#f3f3f3; padding:20px 20px 10px 20px; border-left:2px solid #1589cb;}
blockquote p{ font-size:13px; font-weight:400; line-height:17px; margin-bottom:15px; position:relative; }

hr {border:0 #000 solid; border-top-width:1px; clear:both; height:0;}

/* 3. Images
------------------------------------------------------------------------------*/
img{border:none; border-style: none; margin: 0; display: block; max-width: 100%;}

/* 4. Link
------------------------------------------------------------------------------*/
a{color:#6fbe44; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;}
a:hover{color:#fff;}
a:active, a.current {color: #e8941a;}
a:focus {outline: none;}

/* 5. Forms
------------------------------------------------------------------------------*/
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], input[type="date"]{ border:0; padding:14px 15px; color:#fff; font-size:16px; line-height:20px; width:100%; border-radius:0; background:rgba(255,255,255,0.13); font-family: 'gotham_bookregular';}
textarea{ border:0; padding:14px 15px; color:#fff; font-size:16px; height:170px; resize:none; line-height:20px; border-radius:0; background:rgba(255,255,255,0.13); width:100%; font-family: 'gotham_bookregular'; display: block;}

input[type="submit"], input[type="button"], input[type="reset"], button, .green-btn{ background:rgba(111,190,68,0.45); cursor:pointer; color:#fff; border:none; line-height:20px; display:block; font-size:16px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; width:100%; text-align:center; font-family: 'gotham_bookregular'; padding:14px 15px;}
input[type="submit"]:hover, input[type="button"]:hover, button:hover, .green-btn:hover{ background:rgba(111,190,68,1); color:#fff;}

::-webkit-input-placeholder{color:#fff; opacity: 1; position:relative; z-index:111;}
:-moz-placeholder { /* Firefox 18- */ color:#fff; opacity: 1;  position:relative; z-index:111;}
::-moz-placeholder {  /* Firefox 19+ */ color:#fff; opacity: 1;  position:relative; z-index:111;}
:-ms-input-placeholder { color:#fff; opacity: 1; position:relative; z-index:111;}


form ul{ padding: 0; margin: 0;}
form ul li{ padding: 0; margin: 20px 0 0; background:none; float: left; width: 100%;}
form ul li:first-child{ margin: 0;}
form ul li .input{ float: left; width:48%;}
form ul li .input+.input{ float: right;}
form ul li img{ display: block; margin: 0 0 20px;}

form .field-wrapper{ margin: 20px 0 0; position: relative;}
form .field-wrapper:first-child{ margin: 0;}
form .field-wrapper label{ display: none !important;}
form .button-wrapper{ margin: 20px 0 0;}
form .field-wrapper .g-recaptcha{ margin: 0;}
form .field-wrapper .g-recaptcha > div{ margin: 0;}

form select{ height: 100% !important;}
form .customSelect{ width: 100%;}
form .customSelect span{ border:0; padding:14px 15px; color:#fff; font-size:16px; line-height:20px; width:100% !important; border-radius:0; background:rgba(255,255,255,0.13) url(../images/down-arrow1.png) no-repeat right center; font-family: 'gotham_bookregular'; background-size: 40px;}

.file input{ width: 100%; height: 100%; opacity: 0; overflow: hidden; position: absolute;}
.file lable{ background:rgba(255,255,255,0.13) url(../images/file-pin.png) no-repeat right center; display: block; border:0; padding:14px 15px; color:#fff; font-size:16px; line-height:20px; width:100% !important; border-radius:0; font-family: 'gotham_bookregular'; cursor:pointer; background-size: 40px;}

/* 6. Tables
------------------------------------------------------------------------------*/
table {border-spacing: 0; border-collapse: collapse;}
td {text-align: left; font-weight: normal;}

/* 7. Layout Framework
------------------------------------------------------------------------------*/
/* main container */
#wrapper{ width:100%; min-height:100%;}
.container{ max-width:1200px; width:100%; padding-top:70px; padding-bottom:70px;}

p.center{ text-align:center; max-width:700px; font-size:18px; line-height:26px; margin-bottom:80px;}

/* header */
header{ width:100%; height:auto;}

/* nav */
nav{ width:100%; height:auto;}
nav ul{}
nav ul liv
nav ul li a{}
nav ul li a:hover, nav .active{}

#introduction { position: fixed; top: 50%; left: 50%; z-index: 999; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translate(-50%, -50%); background: #27272d; max-width:100%; z-index:111;}
.introduction{ background: #27272d; position: fixed; height: 100%; width: 100%; left: 0; top: 0; z-index:111; /*display: none ;*/ -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; opacity: 1; visibility: visible;}
.introduction.animate{ opacity: 0; visibility: hidden;}
/*.home-page .introduction{ display:block;}*/
.home-page .introduction a{ position: absolute; left: 0; top: 0; z-index: 111; width:auto; text-transform:uppercase;}
.home-page .introduction-mobile{ display:none;}
.home-page .introduction-mobile a{ position: absolute; left: 0; top: 0; z-index: 111; width:auto; text-transform:uppercase;}

.outer-area{ background: #fff; /*padding: 30px;*/ padding: 0; position: relative;}
.home-page .outer-area{  -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; visibility: hidden; opacity: 0;}
.home-page .outer-area.active{ visibility: visible; opacity: 1;}
/*.outer-area:before{ content: ''; background: #fff; height: 30px; width: 100%; left: 0; top: 0; position: fixed; z-index: 1;}
.outer-area:after{ content: ''; background: #fff; height: 30px; width: 100%; left: 0; bottom: 0; position: fixed; z-index: 1;}*/

.left-area{ background: #fff; position: fixed; left: 0; top: 0; width: 30%; /*padding: 30px 0 30px 30px;*/ padding:0; height: 100%;}
.left-area-inner{ padding: 40px 7% 70px; height: 100%; position: relative;}
.logo{ display: block;}
.logo img{ display: block; margin: 0; max-width: 100%;}

.navigation{ padding: 0; margin: 90px 0 40px 33%;}
.navigation li{ padding: 0; margin: 7px 0 0; background: none;}
.navigation li:first-child{ margin: 0;}
.navigation li a{ font-size: 23px; line-height: 26px; color: #333332; padding: 20px 0 20px 44px; display:block; position: relative;}
.navigation li.selected a:before, .navigation li a:hover:before{ content: "\63"; font-family: "fortis" !important; position: absolute; left: 0; top: 0; font-size: 28px; line-height: 22px; color: #6fbe44;}
.navigation li.selected a, .navigation li.selected a:before{ color:#333332;}
.navigation li a:hover{ color: #6fbe44;}

.social-icon{ margin: 0 0 0 33%; padding: 0 0 0 38px;}
.social-icon a{ color:#6fbe44; float: left; display: block; font-size: 26px; line-height: 20px; margin: 0 20px 0 0;}



/* .right-area{ background: #4f5055 url(../images/content-bg.jpg) no-repeat right center fixed; float: right; width: 70%; overflow:hidden; background-size: 70%;} */

.right-area{ background: #4f5055 url(../images/pdf-bg.jpg) no-repeat right center fixed; float: right; width: 70%; overflow:hidden; background-size: cover;}
.right-area:before{ content:''; background:rgba(43,45,50,0.83); position:absolute; right:0; top:0; height:100%; width:100%;}

/**/
@media screen and (min-width: 768px) {
	/*.right-area{ background: #4f5055 url(../images/pdf-bg.jpg) no-repeat right center fixed; float: right; width: 70%; overflow:hidden; background-size: auto;}*/
	.right-area:before{ content:''; background:rgba(43,45,50,0.83); position:absolute; right:0; top:0; height:100%; width:70%;}
}


#content-area{ padding: 160px 17% 100px; position: relative;}

/* .video-build{ position: fixed; right: 0; top: 0; background: #4f5055; width:70%; z-index: 1;} */
.video-build{ position: fixed; right: 0; top: 0; background: transparent; width:70%; z-index: 1;}
.video-build a.video-btn{ display: block; float: right; background: #6fbe44; color: #fff; padding: 32px 30px;}
.video-build a{display:inline; color: #fff;}
.video-build a strong{ font-weight: normal; background: url(../images/video-icon.png) no-repeat left center; font-size: 18px; line-height: 22px; text-transform: uppercase; display: block; padding: 0 0 0 30px;}
.video-build a:hover{ background: #333332;}
.video-build span{ display: block; float: right; font-size: 18px; line-height: 22px; text-transform: uppercase; background: #2b2d32; color: #fff; padding: 32px 30px;}
.video-build>.select-language {background: transparent;  font-weight: bolder; color:rgba(111,190,68,0.45);}
.video-build>.select-language>a {display:inline; padding: 0; float:none; clear: right; background-color: transparent; color:rgba(111,190,68,0.45);}

.contact{}
.contact-left{ float: left; width:40%;}
.contact-left .icon:before{ color:#fff; position:absolute; left:0; top:0; font-size:30px;}
.contact-left address, .contact-left a, .contact-left span{ font-size:16px; line-height:32px; font-style:normal; color:#fff; padding:0 0 0 60px; position:relative; display:block; margin:0 0 60px;}
.contact-left address a{ padding:0;}
.contact-left address a, .contact-left a{ color:#6fbe44;}
.contact-left address a:hover, .contact-left a:hover{ color:#fff;}
.contact-right{ float: right; width:57%;}


.footer{ position: absolute; left: 7%; bottom: 30px;}
.footer p{ padding: 0; margin: 0; font-size: 12px; line-height: 16px; color: #333332; background: url(../images/footer-logo.png) no-repeat left top; padding: 0 0 0 65px;}

.down-arrow{ background: url(../images/down-arrow.png) no-repeat; width: 20px; height: 32px; position: fixed; bottom: 80px; right: 5%; display: block; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; visibility: visible; opacity: 1;}
.down-arrow.active{ visibility: hidden; opacity: 0; bottom: -80px;}

#photos{ display: none; max-width: 100%; width: 100%;}
#photos ul{ padding: 0; margin: 0;}
#photos ul li{ padding: 0; margin: 0; background: none; float: left; width: 50%; position: relative; overflow: hidden;}
#photos ul li .image{ -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; transform: scale(0); visibility: hidden; opacity: 1;}
#photos ul li .image.animate{ transform: scale(1); visibility: visible; opacity: 1;}
#photos ul li .image img{ display: block; margin: 0; max-width: 100%;     height: inherit; width: 100%;}
#photos ul li .desc{ background: rgba(43,45,50,0.58); position: absolute; left: 0; top: 0; height: 100%; width: 100%; padding: 40px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; transform: rotate3d(0, 1, 0, 180deg); visibility: hidden; opacity: 0;}
#photos ul li:hover .desc{ visibility: visible; opacity: 1; transform: rotate3d(0, 1, 0, 0deg);}
#photos ul li .desc p{ line-height: 28px; margin: 0;}

.mobile-footer{ display: none;}

.right-area.pdf-page{ background: url(../images/pdf-bg.jpg) no-repeat center center; background-size:cover; position:relative;}
.right-area.pdf-page:before{ content:''; background:rgba(43,45,50,0.83); position:absolute; left:0; top:0; height:100%; width:100%;}
.right-area.pdf-page .video-build{ background:none;}
.pdf-list{ padding: 0; margin: 0;}
.pdf-list li{ padding: 50px 0; margin: 0; background:none; list-style:none; float: left; width: 41%; border-bottom:1px solid #fff;}
.pdf-list li:nth-child(2n+1){ float: right;}
.pdf-list li:nth-child(1),.pdf-list li:nth-child(2){ padding-top: 0; }
.pdf-list li a{ display: block; background:url(../images/pdf-icon.png) no-repeat left center; padding:20px 0 20px 70px;}

.outer-vertical-align {display:table; height: 100%;}
.vertical-align {display:table-cell; vertical-align: middle;}