/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############   TABLET STYLES     ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

html {
width: 100%;
height: 100%;
background: #e5e2da;
background:#faf8f4;
background:#ff000a;
color: #111;
font-size: 100px;

}


body {
width: 100%;
height: 100%;
margin: 0;
font-family: 'corbeau_bold', Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 0px;
font-style: normal;
color: #111;
overflow: auto;
position: relative;
overflow-y: scroll;
overflow-x: hidden;
text-align: left;


}




#top_over_fade {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background:#080b14;
float: left;
display: block;
z-index: 999;

opacity: 1;


-moz-transition-duration: 1.3s;
-o-transition-duration: 1.3s;
-webkit-transition-duration: 1.3s;
transition-duration: 1.3s;

}


#top_over_fade.fade {
opacity: 0;
background: #0238dc;

}

#top_over_fade.fade.none {
opacity: 0;
display: none;

}

#home_introline {
width: 100%;
height: 100%;
position: fixed;
top: 0%;
left: 0;
background:#0d152c;
float: left;
display: none;
z-index: 998;

opacity: 1;


-moz-transition-duration: 1.3s;
-o-transition-duration: 1.3s;
-webkit-transition-duration: 1.3s;
transition-duration: 1.3s;



}

#home_introline.on {
display:block;

}

#home_introline.on.fade {
opacity: 0;
background: #0238dc;

}

#home_introline.on.fade.none {
opacity: 0;
display: none;

}

#introline {
font-size: 45px;
color:#fff;

-moz-transition-duration: 1.3s;
-o-transition-duration: 1.3s;
-webkit-transition-duration: 1.3s;
transition-duration: 1.3s;

opacity:0;

}

#introline.on {
opacity:1;

}

.mobile_only {
display: none;

}

.tablet_only {
display: inline;

}


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############        FONTS        ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

@font-face {
font-family: 'jenevers';
src: url('../fonts/jenevers_regular.eot');
src: url('../fonts/jenevers_regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/jenevers_regular.woff') format('woff'),
url('../fonts/jenevers_regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}


@font-face {
font-family: 'corbeau_medium';
src: url('../fonts/c_medium.eot');
src: url('../fonts/c_medium.eot?#iefix') format('embedded-opentype'),
url('../fonts/c_medium.woff') format('woff'),
url('../fonts/c_medium.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}


@font-face {
font-family: 'imperial';
src: url('../fonts/imperial.eot');
src: url('../fonts/imperial.eot?#iefix') format('embedded-opentype'),
url('../fonts/imperial.woff') format('woff'),
url('../fonts/imperial.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}

@font-face {
font-family: 'corbeau_thin';
src: url('../fonts/c_thin.eot');
src: url('../fonts/c_thin.eot?#iefix') format('embedded-opentype'),
url('../fonts/c_thin.woff') format('woff'),
url('../fonts/c_thin.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}

@font-face {
font-family: 'fakt_medium';
src: url('../fonts/f_medium.eot');
src: url('../fonts/f_medium.eot?#iefix') format('embedded-opentype'),
url('../fonts/f_medium.woff') format('woff'),
url('../fonts/f_medium.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}

@font-face {
font-family: 'corbeau_bold';
src: url('../fonts/c_bold.eot');
src: url('../fonts/c_bold.eot?#iefix') format('embedded-opentype'),
url('../fonts/c_bold.woff') format('woff'),
url('../fonts/c_bold.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}


@font-face {
font-family: 'symbols';
src: url('../fonts/symbols.eot');
src: url('../fonts/symbols.eot?#iefix') format('embedded-opentype'),
url('../fonts/symbols.woff') format('woff'),
url('../fonts/symbols.ttf') format('truetype');
font-weight: normal;
font-style: normal;

}




/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############        BASICS       ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */



table {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
border-spacing: 0px;
	
}

tr  {
width: 100%;
height: 100%;
padding: 0;
margin: 0;
border-spacing: 0px;
    
}


td {
width: 100%;
height: 100%;
text-align: center;
vertical-align: middle;
margin: 0;
padding: 0;
border-spacing: 0px;

-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;

}


div {
font-size: 100%;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;


 vertical-align: top;

}



a,a:visited,a:hover,a:active{
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
text-decoration:none;
color: inherit;
width: auto;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */



 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;
   
}

a:hover {
text-decoration:none;

}


button {
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
cursor: pointer;

-webkit-box-shadow: none;
box-shadow: none;
line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 0;
border-radius: 0px;

-webkit-appearance: none;
border: 0px;
outline: none;
box-shadow: none;
outline-width: 0px;
}

button:hover {
-webkit-appearance: none;
border: 0px;
outline: none;
box-shadow: none;
outline-width: 0px;

cursor: pointer;

}

button:focus {
-webkit-appearance: none;
border: 0px;
outline: none;
box-shadow: none;
outline-width: 0px;
cursor: auto;

cursor: pointer;

}



input[type=submit] {
 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;

}


h1, h2, h3, h4, h5, h6 {
font-family: 'corbeau_bold', Impact, 'HelveticaNeue-CondensedBlack', sans-serif;
margin: 0px 0 4px 0px;
font-weight: 100;

 vertical-align: top;

  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

}


#thin {
font-family: 'corbeau_thin', "Courier New", Courier, monospace;
}


strong {
font-family: 'corbeau_bold', Arial, Helvetica, sans-serif;
font-weight: 100;
}


sup {
font-size: 60%;
font-family: 'corbeau_medium', Tahoma, Geneva, sans-serif;
font-weight: 100;
color:#111;

}

p {
word-break: break-word;	

 vertical-align: top;

 -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;


}


span {

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */


 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;

}




/* #############   IMAGES AND VIDEO   ###############  */


img {
margin: 0;
padding: 0;
display: block;
border: none;
width: auto;
max-width: 100%;
height: auto;


 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;

}




video {
margin: 0;
padding: 0;
display: block;
border: none;
width: auto;
height: auto;


}

.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */ 
padding-top: 0px;
height: 0;

}

.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;

}




/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############       HEADER        ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

#header_title {
position: absolute;
display: inline-block;
width:auto;
height: auto; 
float: left;
z-index:77;
top:0px;
left: 25px;
padding: 11px 15px;
background:#e2d4ca;
color:#fff;
font-size:44px;
font-family: 'corbeau_bold';
line-height: 1;

}

.home #header_title {
background:#e2d4ca;
background:#0093D2;
color:#fff;
display:none;

}

.about #header_title {
background:#1f7b20;
background:#7db0fc;
background:#acc6f9;
background:#2e651c;
background:#265317;
color:#fff;
color:#509739;

}


.contact #header_title {
background:#d39f00;
color:#fff;

}

.offsetting #header_title,
.land #header_title {
background:#6eb402;
color:#fff;

}

.imageo_home #header_title {
background:#0047FF;
background:#FF0700;
color:#fff;


}


#menu_btn {
padding: 0px;
font-size:0px;

}

#menu_btn button {
position: absolute;
display:inline-block;
width:auto;
height: auto;


float: left;
z-index:777;

top:15px;
right:0px;

background:#fff;

padding: 12px 12px 12px 12px;

font-size:0px;
font-family:'corbeau_bold';
color:#111;


opacity:1;

 -moz-transition-duration: 0.5s;
 -o-transition-duration: 0.5s;
 -webkit-transition-duration: 0.5s;
 transition-duration: 0.5s;

}


#menu_btn_over button {
position: fixed;
display:none;
width:auto;
height: auto;


float: left;
z-index:783;

top:15px;
right:0px;



padding: 12px 12px 12px 12px;

font-size:0px;
font-family:'corbeau_bold';
color:#111;

background:#fff;

opacity:1;

 -moz-transition-duration: 0.5s;
 -o-transition-duration: 0.5s;
 -webkit-transition-duration: 0.5s;
 transition-duration: 0.5s;


}

#menu_btn_over.on button {
display:inline-block;

}


#menu_btn.fade button {
display:none;

right: 0px;


}

#menu_btn.show button {
opacity:1;
right:0px;

}

#menu_btn.off button {
display:none;


}


.menu_bar_holder {
position: relative;
display:inline-block;

width:27px;
height: 21px;

margin: 2px 0 0 0px;

}


.menu_bar_a,
.menu_bar_b,
.menu_bar_c {
position: absolute;
display:inline-block;
width:100%;
height: 3px;
float: left;
background:#111;
margin:0px 0 0 0px;
}

#menu_btn_over .menu_bar_a,
#menu_btn_over .menu_bar_b,
#menu_btn_over .menu_bar_c {
background:#fff;

}


.menu_bar_a {
z-index:778;
top:0px;
right:0px;

}

.menu_bar_b {
z-index:779;
top:8px;
right:0px;
height: 4px;

}


.menu_bar_c {
z-index:778;
right:0px;
bottom:1px;

}




#close_menu_btn button {
position: fixed;
display:none;
width:auto;
height: auto;


float: left;
z-index:877;

top:17px;
right:4px;



padding: 9px 9px 9px 9px;

font-size:0px;
font-family:'corbeau_bold';
color:#111;
background:#fff;
text-align: center;

opacity:1;

 -moz-transition-duration: 0.5s;
 -o-transition-duration: 0.5s;
 -webkit-transition-duration: 0.5s;
 transition-duration: 0.5s;

}




#close_menu_btn.on button {
display:inline-block;

}




#close_menu_bar_holder {
position: relative;
display:inline-block;

width:24px;
height: 24px;

margin: 0px 0 0 0px;

transform: rotate(45deg);

}


#close_menu_bar_a  {
position: absolute;
display:inline-block;
width:100%;
height: 4px;
float: left;
background:#111;
margin:0px 0 0 0px;

z-index:778;
top:10px;
right:0px;
}

#close_menu_bar_b {
position: absolute;
display:inline-block;
height:100%;
width: 4px;
float: left;
background:#111;
margin:0px 0 0 0px;

z-index:779;
top:0px;
right:10px;

}


#under_menu_btns {
position: absolute;
display:none;
width:55px;
height: 52px;


float: left;
z-index:725;

top:14px;
right:0px;

background:#fff;


}


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############       MENU          ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

#site_menu {
position: fixed;
display:none;
float: left;
z-index:333;
top:0px;
left:0px;
width:100%;
height: 100%;

background:#ebc617;
background:#c1eb17;
background:#2c903a;
background:#111;
color:#000;

font-size:35px;


}

#site_menu.on {
display:inline-block;


}

#site_menu_under { 
display:none;
}

#site_menu div {
display:inline-block;
width: auto;
text-align: left;
line-height:1;

}

#site_menu a,
#site_menu a:visited {
display:inline-block;
margin: 0 0 0.7em 0;
color:#fff;
font-weight: 900;

}

#site_menu a:hover {
color: #25ff25;
color:#FFC519;

}

#site_menu a span,
#site_menu a:visited span {
display:inline;
color:#fff;
 -moz-transition-duration: 0.3s;
 -o-transition-duration: 0.3s;
 -webkit-transition-duration: 0.3s;
 transition-duration: 0.3s;

}

#site_menu a:hover span {
color: #25ff25;

}

/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############        BGS          ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

.home #intro_screen {
background: #c8532a;
background: url(../images/bg_home_001.jpg);
background-size: cover;
background-position: center center;


}


.about #intro_screen {
background: #c8532a;
background:url(../images/bg_about.jpg);
background-size:cover;
background-position: top center;


}


.offsetting #intro_screen {
background:#c1eb17;

background:url(../images/bg_green_d.jpg);
background-size:cover;
background-position: center center;

}


.land #intro_screen {
background:#c1eb17;

background:url(../images/bg_green_004.jpg);
background-size:cover;
background-position: left center;

}


/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ##############################                             ################################ */
/* ##############################                             ################################ */
/* ##############################      HOMEPAGE STYLES        ################################ */
/* ##############################                             ################################ */
/* ##############################                             ################################ */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */





#intro_screen {
position:relative;
display:block;
width:100%;
height:100%;

}

.home #intro_screen {
position:relative;
display:none;
width:100%;
height:100%;

}


.pad-line {
position: absolute;
display:inline-block;
float: left;
z-index:4;
line-height: 1.2; 
padding: 2px 0;
font-size:  100%;
margin:  0px;

}

.home .pad-line {
bottom: 21%;
right: 7%;

}

.pad-line-inner {
background:#ddd;
display: inline;
padding: 0.15em 11px;
color: #fff;
font-size:  55px;
font-family:  'corbeau_bold', Arial;  
/* Needs prefixing */
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
white-space: nowrap;

}

.home .pad-line-inner {
background:#ff2525;

}

#intro_arrow,
#intro_screen button {
display:inline;
background:none;    

}

#triangle {
position:absolute;
display:inline-block;
float: left;
z-index:2;   
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;


}

.home #triangle {
bottom: 55px;
right: 12%;
right: calc(7% + 245px);
border-top: 50px solid #fff;

}

#arrow_stem {
position:absolute;
display:inline-block;
float: left;
z-index:2;
bottom: 97px;
right: 12%;
right: calc(7% + 245px + 17.5px);
width: 15px;
height:45px;
height:calc(21% - 25px - 67px);



}

.home #arrow_stem {
bottom: 97px;
right: 12%;
right: calc(7% + 245px + 17.5px);
height:calc(21% - 25px - 97px);
background:#fff;

}

.home_main_text {
position: relative;
display:block;
width:100%;
height: auto;
padding: 135px 45px 90px 45px;
text-align: center;
background:#04b3e6;
color:#fff;
font-size: 35px;

}

#home_main_text_left {
display:inline-block;
width:47%;
max-width:345px;
height:auto;
margin:0 90px 0 0;
padding: 9px 0 0 0;
vertical-align: top; 
font-size: 19px;
line-height:1.3; 
text-align: left;


}

#portfolio_btn {
display:inline-block;
color:#fff;
margin: 1em 0 0 0;
padding: 9px 11px;
background:#36d2ff;
border-radius:4px;
font-family:'corbeau_bold';
font-size: 21px;


}

#portfolio_btn span {
font-family:'symbols';
margin: 0 0 0 7px;

}

#portfolio_btn:hover {
background:#23c6f5;

}

#home_main_text_right {
display:inline-block;
width:auto;
height:auto;
margin:0 0px 0 0;
vertical-align: top; 
font-size: 32px;
text-align: left;
line-height:1.2;


}

#portfolio_pre {
display:none;
width:100%;
height: 5px;
background:#fff;

}

#home_portfolio {
position:relative;
display:block;
width:100%;
height:auto;
background:none;
color:#111;


}

.portfolio_piece {
display:inline-block;
background:red;
font-size:22px;
color:#fff;
line-height: 1.5;
width:100%;
height:500px;
border-bottom: 22px solid #111;



}

.portfolio_piece h2 {
display:block;
width:100%;
text-align:center;
margin: 0 0 2px 0px;
padding:0px;
font-size: 23px;
line-height: 1;

}

.portfolio_piece td {
background-color: rgba(0,0,0,0.13);

}

.portfolio_piece td:hover {
background-color: rgba(0,0,0,0);

}

.portfolio_piece span {
font-family:'corbeau_medium';

}

#portfolio_a {
background:url(../images/work_preview_9.jpg);
background-size:cover;
background-position:center center;
}

#portfolio_b {

background:url(../images/work_preview_44.jpg);
background-size:cover;
background-position:center center;

}

#portfolio_c {

background:url(../images/work_preview_41.jpg);
background-size:cover;
background-position:center center;

}

#portfolio_d {
background:url(../images/work_preview_43.jpg);
background-size:cover;
background-position:top right;

}

#wide_portfolio_piece {
position:relative;
display:inline-block;
width:100%;
height:auto;
font-size:22px;
color:#fff;
line-height: 1.5;


}

#wide_portfolio_piece img {
display:block;
width:100%;
height:auto;

}

#over_img_div {
position: absolute;
display:inline-block;
float:left;
z-index:3;
top:0px;
left:0px;
width:100%;
height:100%;

}

#over_img_div td {
background-color: rgba(0,0,0,0.2);

}

#over_img_div td:hover {
background-color: rgba(0,0,0,0.1);

}

#over_img_div span {
font-family:'corbeau_medium';

}


#acknowledgement_home {
display:none;

}



/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ##############################          PAGES STYLES          ############################# */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############     ABOUT PAGE      ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

.about #intro_screen {

background:#1e4212;

}


#about_intro_word {
position:relative;
display:inline-block;
width:90%;
max-width:447px;
font-size: 52px;
color:#63d33f;
text-align:left;

}

#about_intro_word span {
display:block;
width:100%;
color:#52d627;

}

#about_intro_button {
position:absolute;
display:block;
width:100%;
text-align:center;
float: left;
top:100%;
left:0px;
z-index:4;

}

#about_intro_button button {
display:inline-block; 
padding: 5px;
font-size:55px;
color:#35801d;
font-family:'symbols';
margin:25px 25px 0 0;

}

.about_skills {
display:block;
width:100%;
height:auto;
padding: 135px 22px 91px 22px;
background: #265317;

}

#about_skills_holder {
display:inline-block;
width:100%;
max-width: 1345px;
text-align: center;

}

#skills_title {
display:block;
width:100%;
text-align: center;
font-size: 27px;
color:#48c62d;
font-family:'corbeau_bold';
font-weight: 900;

}

#skills {
display:block;
width:100%;
text-align:center;

margin: 45px 0 0 0;
font-size: 0px;

}

.skill {
display:inline-block;
vertical-align: top;
width: 175px;
height: auto;
padding: 0 22px 44px 22px;


}

.skill img {
display:inline-block;
width:100%;
height: auto;
border-radius: 955px;
margin: 0 0 25px 0;

}


.skill span {
display: block;
width:100%;
padding: 0 11px;
font-size: 15px;
font-family:'corbeau_bold';
font-weight: 900;
color:#48c62d;
text-align: center;


}



.about_main_text {
display:block;
width:100%;
height:auto;
padding: 135px 22px;
color:#fff;
font-size: 35px;

background:#2e651c;
text-align:center;


}

#bios_holder {
display:inline-block;
width:100%;
max-width: 1225px;
text-align:center;


}

.bio {
display:inline-block;
width: 275px;
margin: 0 35px;

}

.bio img {
display:inline-block;
width:100%;
height:auto;
border-radius:375px;
margin: 0 0 25px 0;


}

span.person_name {
display:block;
width:100%;
text-align:center;
font-family:'corbeau_bold';
font-size: 35px;
font-weight:900;
color:#9bd825;
margin: 0 0 25px 0;

}

.bio_text {
display:block;
width:100%;
text-align:left;
font-family:'corbeau_medium';
font-size: 19px;
font-weight:400;
color:#8bc333;


}


#about_call_to_action {
display:block;
width:100%;
height: auto;
text-align:center;
background:#92a81d;
color:#fff;
padding: 135px 45px;

}

#about_call_to_action_text {
display:inline-block;
width:100%;
max-width: 555px;

text-align:left;
font-size: 35px;
font-family:'corbeau_bold';

color:#46511d;


}




/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############    CARBON PAGE      ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

.offsetting #intro_screen {
position:relative;
display:block;
width:100%;
height:65%;
height: calc(70% - 45px);

}

.offsetting .pad-line {
bottom: 21%;
left: 70px;

}

.offsetting .pad-line-inner {
background:#6eb402;
font-size: 45px;

}

.offsetting #triangle {
bottom: 25px;
right: 12%;
right: calc(5% + 115px);
border-top: 50px solid #fff;
display:none;

}


.offsetting #arrow_stem {
bottom: 67px;
right: 12%;
right: calc(5% + 115px + 17.5px);
background:#fff;
display:none;

}

.carbon_main {
display:block;
width:100%;
height:auto;
padding: 135px 90px;
background:#c1eb17;
color:#000;



}



.carbon_main div {
display:inline-block;
width: 70%;
text-align:left;
font-size: 25px;
font-family:'corbeau_medium';

}


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############    IMAGEO PAGE       ############## */
/* ################################################# */
/* ################################################# */
/* ################################################# */

#imageo_intro_body_holder {
position:absolute;
display:block;
width:100%;
height:100%;
float:left;
top:0%;
left:0px;
z-index:0;
font-size:0px;
overflow:hidden;

opacity:1;

-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
-webkit-transition-duration: 0.9s;
transition-duration: 0.9s;

}

#imageo_intro_body_holder.fade {


}


#intro_screen_imageo {
position: absolute;	
display: block;


width: 100%;
height: 100%;

float: left;

z-index: 3;

top: 0px;
left: 0px;

opacity:1;

-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
-webkit-transition-duration: 0.9s;
transition-duration: 0.9s;

}




#intro_screen_imageo.fade {
opacity:0;


}


#intro_screen_bg {
position: absolute;
display: block;

width: 100%;

width: calc(100% + 5px);

height: 100%;

overflow: hidden;

float: left;

z-index: 1;

top: 0px;
left: 0px;

font-size: 0px;



}

#intro_screen_bg img {
position:relative;
display: inline-block;
width: 19.98%;
width: calc(20% - 1px);

height: auto;
float:left;

}

#intro_screen_bg_over {
position: absolute;
display: block; 

width: 100%;
height: 100%;

top: 0px;
left: 0px;

float: left;

z-index: 2;

background: #000;

opacity: 0.6;


-moz-transition-duration: 1.9s;
-o-transition-duration: 1.9s;
-webkit-transition-duration: 1.9s;
transition-duration: 1.9s;



}

#intro_screen_bg_over.fade {
background:#cdcdcd;
background: #B50700;
opacity: 1;

}


#intro_screen_bg_over.fade.d {
background:#C1EB17;
background: #22C4FF;
background:#eee;
opacity: 1;

}

table,
tr {
width: 100%;
height: 100%;


}


td {
width: 100%;
height: 100%;

text-align: center;
vertical-align: middle;


}




#intro_screen_imageo h2 {
color: #fff;

font-family: 'corbeau_bold';

font-size: 77px;

text-transform: uppercase;

margin: 0 auto 11px auto;
	
}



button#host_code,
button#host_code:visited {

display: inline-block;

font-family:'corbeau_bold';
margin: 5px 18px;

padding: 15px;

border-radius: 7px;

border: 2px solid #fff;
background: none;

font-size: 22px;
color: #fff;

letter-spacing: 0.5px;

-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;


}


button#submit_code_start,
button#submit_code_start:visited {

display: inline-block;

margin: 5px 18px;

padding: 15px;

border-radius: 7px;

font-family:'corbeau_bold';

background: #fff;

font-size: 22px;
color: #111;



letter-spacing: 0.5px;


border: 2px solid #fff;


-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;


}




button#submit_code_start span,
button#submit_code_start:visited span {
font-family: 'symbols';
color: #111;


}


button#submit_code_start_mobile {
display: none;


}





button#submit_code_start:hover,
button#begin_two:hover,
button#host_code:hover {
background: #fff;

color: #111;

}

button#submit_code_start:hover span {
color: #111;

}

button#submit_code_start:hover {
background: #FF0700;
border: 2px solid #FF0700;

}



#over_imageo_btns {
position:absolute;
display:none;
float: left;
z-index:4;
top:0px;
left:0px;

width:100%;
height: 100%;

}


#over_imageo_btns.on {
display:block;

}



#tour {
position:absolute;
display:none;
float:left:;
z-index:5;

width:100%;
height:100%;

top:0px;
left:0%;

background:#cdcdcd;

opacity:0;

-moz-transition-duration: 1.9s;
-o-transition-duration: 1.9s;
-webkit-transition-duration: 1.9s;
transition-duration: 1.9s;

}


#tour.on {
display:block;

}

#tour.on.fadeIn {
opacity:1;

}

#tour.on.fadeIn.over {
left:-101%;


}



#tour_a {
display:inline-block;
width: 521px;
text-align:left;
margin: auto auto auto 45px;


}


h2#tour_a_title {
display:block;
font-size: 72px;
color:#000;


-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;

}

span#tour_a_text {
display:block;
font-size: 23px;
color:#777;

-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;



}

span#tour_a_text span {
display:inline;
font-size:inherit;
color:#FF0700;


}


#tour_btns {
display:block;
width:100%;
text-align: center;

padding: 0 75px 0 0;


}


#tour_a_text button {
display: inline-block;

font-family:'corbeau_bold';
margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

background: #FF0700;
border: 2px solid #FF0700;
color: #fff;
font-size: 22px;
color: #fff;

letter-spacing: 0.5px;

-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;


}

#tour_a_text a,
#tour_a_text a:visited {
display: inline-block;

margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

font-family:'corbeau_bold';

background: #fff;

font-size: 22px;
color: #111;



letter-spacing: 0.5px;


border: 2px solid #fff;


-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;
	
}

#tour_a_text button span {
font-family: 'symbols';
color: #fff;
font-size: 19px;

}

#tour_a_text button:hover {
background: #C70700;
border: 2px solid #C70700;
	
}

#tour_a_text a:hover {
background: #FF0700;
border: 2px solid #FF0700;

}




















#demo {
position:absolute;
display:none;
float:left:;
z-index:7;

width:100%;
height:100%;

top:0px;
left:101%;

background:#eee;

opacity:1;

-moz-transition-duration: 1.9s;
-o-transition-duration: 1.9s;
-webkit-transition-duration: 1.9s;
transition-duration: 1.9s;

}


#demo.on {
display:block;

}

#demo.on.fadeIn {
left:0%;

}


#demo_a {
display:inline-block;
width: 521px;
text-align:left;
margin: auto auto 45px 45px;


}


h2#demo_a_title {
display:block;
font-size: 72px;
color:#888;


-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;

}

span#demo_a_text {
display:block;
font-size: 23px;
color:#ababab;

-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;



}

span#demo_a_text span {
display:inline;
font-size:inherit;
color:#888;


}


#demo_btns {
display:block;
width:100%;
text-align: center;

padding: 0 75px 0 0;


}


#demo_a_text button {
display: inline-block;

font-family:'corbeau_bold';
margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

background: #FF0700;
border: 2px solid #FF0700;
color: #fff;
font-size: 22px;
color: #fff;

letter-spacing: 0.5px;

-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;


}

#demo_a_text a,
#demo_a_text a:visited {
display: inline-block;

margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

font-family:'corbeau_bold';

background: #eee;

font-size: 22px;
color: #FF0700;



letter-spacing: 0.5px;


border: 2px solid #FF0700;


-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;
	
}

#demo_a_text button span {
font-family: 'symbols';
color: #fff;
font-size: 19px;

}

#demo_a_text button:hover {
background: #C70700;
border: 2px solid #C70700;
	
}

#demo_a_text a:hover {
background: #FF0700;
border: 2px solid #FF0700;
color:#fff;

}


button#quick_BTN {
position:absolute;
display:inline-block;
width:auto;
background:#ccc;
color:#fff;


float: left;
z-index: 32;
bottom: 45px; 
right:45px;


padding: 12px;

border-radius: 7px;

font-family:'corbeau_bold';

background: #dcdcdc;

font-size: 19px;
color: #fff;



letter-spacing: 0.5px;


border: 0px solid #FF0700;


-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;

margin: 0 15px 0 0;

opacity: 0;

-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;


}

button#quick_BTN.on {
margin: 0 0px 0 0;
opacity: 1;

}


button#quick_BTN.on.fade {
opacity: 0;

}

button#quick_BTN.on.fade.off {
display:none;

}

button#quick_BTN span {
display:inline; 
margin: 0 0 0 7px;
font-family:'symbols';

}


button#quick_BTN:hover {
background: #FF0700;

}


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############       QUICK         ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */



#quick {
position:absolute;
display:none;
float:left:;
z-index:33;

width:100%;
height:100%;

top:0px;
left:0%;

background:#eee;

opacity:1;

-moz-transition-duration: 1.9s;
-o-transition-duration: 1.9s;
-webkit-transition-duration: 1.9s;
transition-duration: 1.9s;

}


#quick.on {
display:block;

}




#quick_a {
display:inline-block;
width: 521px;
text-align:left;
margin: auto auto 45px 45px;


}


h2#quick_a_title {
display:block;
font-size: 72px;
color:#888;


-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;

}

span#quick_a_text {
display:block;
font-size: 23px;
color:#ababab;

-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
-webkit-transition-duration: 0.7s;
transition-duration: 0.7s;



}

span#quick_a_text span {
display:inline;
font-size:inherit;
color:#888;


}

#quick_btns {
display:block;
width:100%;
text-align: center;

padding: 0 75px 0 0;


}


#quick_a_text button {
display: inline-block;

font-family:'corbeau_bold';
margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

background: #FF0700;
border: 2px solid #FF0700;
color: #fff;
font-size: 22px;
color: #fff;

letter-spacing: 0.5px;

-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;


}

#quick_a_text a,
#quick_a_text a:visited {
display: inline-block;

margin: 5px 18px 5px 18px;

padding: 15px;

border-radius: 7px;

font-family:'corbeau_bold';

background: #eee;

font-size: 22px;
color: #FF0700;



letter-spacing: 0.5px;


border: 2px solid #FF0700;


-webkit-box-shadow: none;
box-shadow: none;

cursor: pointer;

line-height: 1;
text-shadow: none;

-webkit-appearance: none;
-webkit-border-radius: 7;
	
}

#quick_a_text button span {
font-family: 'symbols';
color: #fff;
font-size: 19px;

}

#quick_a_text button:hover {
background: #C70700;
border: 2px solid #C70700;
	
}

#quick_a_text a:hover {
background: #FF0700;
border: 2px solid #FF0700;
color:#fff;

}



/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############     ANIMATION       ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */


#animation_holder {
position:absolute;
display:none;
width:100%;
height: 378px;
float:left;
z-index: 9;
top:40%;
top:calc(50% - 189px);
left:0px;
text-align:center;


}

#animation_holder.on {
display:block;

}



#animation {
position:relative;
display:inline-block;
width:547px;
height:255px;
margin:auto;
overflow:hidden;


}


#animation img {
position:absolute;
display:inline-block;
width:100%;
height:100%;
float:left;
top:0px;
left:0px;


}

#animation img#anim_z {
z-index:10;

}


#animation img#anim_a {
z-index:11;

}

#animation img#anim_b {
z-index:12;

}

#animation img#anim_c {
z-index:13;

}

#animation img#anim_d {
z-index:14;

}

#animation img#anim_e {
z-index:15;

}

#animation img#anim_f {
z-index:16;

}

#animation img#anim_g {
z-index:17;

}

#animation img#anim_h {
z-index:18;

}

#animation img#anim_i {
z-index:19;

}

#animation img#anim_j {
z-index:20;

}

#animation img#anim_k {
z-index:21;

}


#animation img#anim_l {
z-index:22;

}

#animation img#anim_m {
z-index:23;

}

#animation img#anim_n {
z-index:24;

}

#animation img#anim_o {
z-index:25;

}

#animation img#anim_p {
z-index:26;

}

#animation img#anim_q {
z-index:27;

}

#animation img#anim_r {
z-index:28;

}

#animation img#anim_s {
z-index:29;

}

#animation img#anim_t {
z-index:30;

}

#animation img#anim_u {
z-index:31;

}

#animation img#anim_v {
z-index:32;

}

#animation img#anim_w {
z-index:33;

}

#animation img#anim_x {
z-index:34;

}


#animation img#anim_a.off,
#animation img#anim_b.off,
#animation img#anim_c.off,
#animation img#anim_d.off,
#animation img#anim_e.off,
#animation img#anim_f.off,
#animation img#anim_g.off,
#animation img#anim_h.off,
#animation img#anim_i.off,
#animation img#anim_j.off,
#animation img#anim_k.off,
#animation img#anim_l.off,
#animation img#anim_m.off,
#animation img#anim_n.off,
#animation img#anim_o.off,
#animation img#anim_p.off,
#animation img#anim_q.off,
#animation img#anim_r.off,
#animation img#anim_s.off,
#animation img#anim_t.off,
#animation img#anim_u.off,
#animation img#anim_v.off,
#animation img#anim_w.off,
#animation img#anim_x.off,
#animation img#anim_z.off {
display:none;

}


/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############     LAND PAGE       ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

.land #intro_screen {
position:relative;
display:block;
width:100%;
height:65%;
height: calc(75% - 45px);

}

.land .pad-line {
bottom: 55px;
left: 55px;

}

.land .pad-line-inner {
background:#6eb402;
font-size: 40px;

}

.land #triangle {
bottom: 25px;
right: 7%;
right: calc(70px + 255px);
border-top: 50px solid #fff;
display:none;
}


.land #arrow_stem {
bottom: 67px;
right: 8%;
right: calc(70px + 255px + 17.5px);
background:#fff;
display:none;
}


.land_main {
display:block;
width:100%;
height:auto;
padding: 135px 45px;
background:#c1eb17;
color:#000;
font-size: 19px;
font-family:'corbeau_medium';


}

.land_main div {
display:inline-block;
width: 100%;
max-width: 900px;
text-align:left;
font-weight: 900;
font-size: 29px;
font-family:'corbeau_bold';
color:#1A390B;


}



/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############    CONTACT PAGE     ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */

body.contact {
background:#ebc617;

}




/* ################################################# */
/* ################################################# */
/* ################################################# */
/* #############      FOOTER         ############### */
/* ################################################# */
/* ################################################# */
/* ################################################# */




#footer {
display:block;
width:100%;
height: auto;
background:#ebc617;
color:#000;
padding:90px 45px;


}

.contact #footer {
padding:180px 45px;


}



#footer_main_text {
display:inline-block;
width:100%;
max-width:855px;
font-size: 48px;
font-weight: 900;
text-align: left;
line-height:1.1;

}

.contact #footer_main_text{
max-width:805px;
font-size:44px;

}

#footer_main_email {
display:inline-block;
width:100%;
text-align:left;
margin: 48px 0 0 0;
font-size: 39px;
color:#000;


}

#footer_profiles {
display:inline-block;
width:100%;
text-align:left;
margin: 48px 0 0 0;
opacity: 0.67;


}

.profile {
display: inline-block;
width: auto;
vertical-align: top;
font-size: 22px;
font-weight:900;
text-align: left;
line-height: 1.2;
margin: 0 35px 0 0;


}

.profile span {
display: inline;
vertical-align: top;
font-size: 27px;
font-weight:900;
text-align: left;
line-height: 1.2;


}


/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ##############################                             ################################ */
/* ##############################                             ################################ */
/* ##############################     RESPONSIVE  STYLES      ################################ */
/* ##############################                             ################################ */
/* ##############################                             ################################ */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */
/* ########################################################################################### */


/* Small */
@media (min-width: 10px) {




}






/* ##########################################  LAPTOP BEGINS ##################################################  */



@media (min-width: 1250px) {




}


/* ############################################   DESKTOP VERSION   ################################################# */




@media (min-width: 1445px) {



}



@media (min-width: 1535px) {




}



@media (min-height: 100px) {




}



@media (min-height: 400px) {



}



@media (min-height: 450px) {



}





@media (min-height: 500px) {



}



@media (min-height: 550px) {





}






@media (min-height: 600px) {




}


@media (min-height: 650px) {




}










@media (min-height: 700px) {



}



@media (min-height: 750px) {



}









@media (min-height: 800px) {


}





@media (min-height: 900px) {



}













@media (min-height: 1000px) {




}



@media (min-height: 1200px) {




}

@media (min-height: 1300px) {





}




@media (min-height: 1400px) {




}



@media (min-height: 1600px) {




}


@media (min-height: 1800px) {




}

@media (min-height: 2000px) {




}


@media (min-height: 2300px) {



}


@media (min-height: 2500px) {




}


@media (min-height: 3200px) {






}




/* 
#############################################################

	Site Theme by Joel C. Anderson
	Version: 2.2.1
	Created: 2023
	Little Brother Media

#############################################################
*/