/* 
    Colors
   
    Fonts :
    - font-family: 'Crimson Text', serif;
    - font-family: 'gt_walsheim', serif;
    - font-family: 'gt_walsheim_thin', serif;
    - font-family: 'sanchez_regular', serif;
*/

html, body {
	margin: 0;
    padding: 0;
    color: #1b1b1b;
}

body {
    overflow-y: scroll;
}

.clear {
    clear: both;
}

.tablet {
    display: none;
}

.mobile {
    display: none;
}

.no_desktop {
    display: none;
}

a {
   outline: 0;
}

/* ========================
         STRUCTURE            
========================= */
#content {
    min-width: 1060px;
    background-color: #216da2;
    height: 100%;

    -webkit-transition: background-color 0.4s ease-in-out;
    -moz-transition: background-color 0.4s ease-in-out;
    -o-transition: background-color 0.4s ease-in-out;
    transition: background-color 0.4s ease-in-out;
}

.vertical_align {
    display: table;
    width: 100%;
    height: 100%;
}

.vertical_align_inner {
    position: relative;
    display: table-cell;
    vertical-align: middle;
}

#content_page {
    position: relative;
    height: 0;
    overflow: hidden;

    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.loaded #content_page {
    height: auto;
}

.animation_init .image_anime {
    opacity: 0;

    -webkit-transform: translateY(80px);
    -moz-transform: translateY(80px);
    transform: translateY(80px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

.animation .image_anime {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

.animation_init .image_small_anime {
    opacity: 0;

    -webkit-transform: translateY(80px);
    -moz-transform: translateY(80px);
    transform: translateY(80px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;

    transition-delay: 0.4s;
    -webkit-transition-delay: 0.4s; /* Safari */
}

.animation .image_small_anime {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

.animation_init .anime_text {
    opacity: 0;

    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    transform: translateY(40px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;

    transition-delay: 0.4s;
    -webkit-transition-delay: 0.4s; /* Safari */
}

.animation .anime_text {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY();
    transform: translateY(0px);
}

.animation_init .anime_story_text {
    opacity: 0;

    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    transform: translateY(40px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;

    transition-delay: 0.7s;
    -webkit-transition-delay: 0.7s; /* Safari */
}

.animation .anime_story_text {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY();
    transform: translateY(0px);
}



/*Brock - Mobile Menu*/

#menu_mobile {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:50px;
    padding-top:25px;
    z-index:99;
    -webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out
}

.menu_white {
    background-color:rgba(255,255,255,.9)
}

.menu_black {
    background-color:rgba(0,0,0,.9);
    border-bottom:1px solid #000
}

.menu_white #menu_white_border {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:1px;
    background-color:#eaeaea
}

#menu_top {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:50px;
    padding-top:25px;
    z-index:99
}

#menu_title {
    display:block;
    float:left;
    background:url(../img/logo_white.png);
    width:60px;
    height:14px;
    -webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out
}

/*.menu_white #menu_title {
    background:url(../img/logo_black.png)
}*/

/*.isOpen #menu_title {
    background:url(../img/logo_white.png)!important
}*/

#menu_btn {
    float:right;
    background:url(../img/menu_btn_white.png) no-repeat;
    width:21px;
    min-height:12px;
    cursor:pointer;
    -webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out
}

.isOpen #menu_btn {
    background:url(../img/menu_btn_open.png) no-repeat!important
}

.menu_white #menu_btn {
    background:url(../img/menu_btn_black.png) no-repeat
}

#menu_open {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    background-color:#000;
    height:100%;
    display:none;
    z-index:70
}

#menu_open .menu_open_elt {
    display:block;
    text-decoration:none;
    text-align:center;
    font-size:20px;
    line-height:70px;
    color:#fff;
    font-family:"gt_walsheim_thin";
    -webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out
}

#menu_open .menu_open_elt:hover .menu_open_elt_text {
    border-bottom:1px solid #fff
}

.menu_open_elt {
    opacity:0;
    -webkit-transform:translateY(-20px);
    -moz-transform:translateY(-20px);
    transform:translateY(-20px);
    -webkit-transition:all 1s ease-in-out;
    -moz-transition:all 1s ease-in-out;
    -o-transition:all 1s ease-in-out;
    transition:all 1s ease-in-out
}

.isOpen #menu_open_elt_1 {
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.2s;
    -webkit-transition-delay:.2s
}

.isOpen #menu_open_elt_2 {
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.4s;
    -webkit-transition-delay:.4s
}

.isOpen #why_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.2s;
    -webkit-transition-delay:.2s
}
.isOpen #products_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.4s;
    -webkit-transition-delay:.4s
}
.isOpen #marketing_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.6s;
    -webkit-transition-delay:.6s
}
.isOpen #partners_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay:.8s;
    -webkit-transition-delay:.8s
}
.isOpen #contact_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay: 1s;
    -webkit-transition-delay:1s
}
.isOpen #login_link {
    cursor:pointer;
    opacity:1;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    transform:translateY(0);
    transition-delay: 1.2s;
    -webkit-transition-delay:1.2s
}

/* ========================
           Desktop MENU            
========================= */
#menu {
    position: absolute;
    top: 140px;
    left: 80px;
    z-index: 99;
}

.menu_fixed {
    position: fixed!important;
}

#menu_list {
    margin-top: 135px;
    font-family: 'gt_walsheim', serif;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 3px;
}
/*Brock changed menu color to white*/
.menu_link {
    position: relative;
    display: block;
    margin-top: 88px;
    text-decoration: none;
    color: #fff; /*#918662;*/
    opacity: 0;
}

.menu_link:first-child {
    margin-top: 0;
}

.menu_link_content {
    display: inline-block;
    position: relative;
    padding: 0 10px;
}

.animation_init .menu_link {
    opacity: 0;
    
    -webkit-transform: translateX(-80px);
    -moz-transform: translateX(-80px);
    transform: translateX(-80px);

    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;

}

.animation .menu_link, .menu_fixed .menu_link {
    opacity: 1;
    
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}

#story {
    transition-delay: 0s;
    -webkit-transition-delay: 0s; /* Safari */
}

#price {
    transition-delay: 0.1s;
    -webkit-transition-delay: 0.1s; /* Safari */
}

#marketing {
    transition-delay: 0.2s;
    -webkit-transition-delay: 0.2s; /* Safari */
}

/* Brock added partner section and changed timing on contact
#contact {
    transition-delay: 0.3s;
    -webkit-transition-delay: 0.3s; /* Safari */
/*}*/

#partners {
    transition-delay: 0.3s;
    -webkit-transition-delay: 0.3s; /* Safari */
}

#contact {
    transition-delay: 0.4s;
    -webkit-transition-delay: 0.4s; /* Safari */
}
#login {
    transition-delay: 0.5s;
    -webkit-transition-delay: 0.5s; /* Safari */
}

/*Brock changed line color in menu to electric green*/
.menu_link_trait {
    position: absolute;
    top: 4px;
    left: 0;
    width: 0;
    height: 1px;
    background-color: #00e7cb; /*#928664;*/
	-webkit-transition: width 0.5s ease-in-out;
    -moz-transition: width 0.5s ease-in-out;
    -o-transition: width 0.5s ease-in-out;
    transition: width 0.5s ease-in-out;
}

.menu_link_clickable:hover .menu_link_trait {
    width: 100%;
}

.menu_active .menu_link_trait {
    width: 100%;
}

.menu_active_tmp .menu_link_trait {
    width: 100%;
}

/* ========================
            PRE-HOME            
========================= */
#pre_home {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color:#216da2; /*#e9dac9;*/
}

#pre_home_anime {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 60px;
    margin-left: -161px;
    margin-top: -63px;
    background-color:#216da2; /*#928664;*/
}

#pre_home_title, #pre_home_title_hover {
    position: absolute;
    top: 0;
    left: 0;
 	/*Brock this is c9. Quest below height: 30px;
    width: 325px;*/
	height: 39px;
    width: 325px;
}

#pre_home_anime_hover {
    position: absolute;
    top: 0;
    left: 0;
    height: 60px;
    width: 0;
    overflow: hidden;
}

/* ========================
            HOME            
========================= */
#home_section {
    position: relative;
    width: 100%;
    min-height: 600px; 
    background-color: #216da2;

    /*background: url(../img/home_background.jpg) center 0 no-repeat fixed; */
	background: url(../img/sky1.jpg) center 0 no-repeat fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x: hidden;
	overflow-y: hidden;

}
/*Brock matches part of cloud from sky1 with cloud from sky2*/
img.cbottomright {
	width: 370px;
	height: 184px;
    position: absolute;
    bottom: 0;
    right: 0px;
	
}

img.ctopright {
	width: 131px;
	height: 86px;
    position: absolute;
    top: 0;
    right: 0px;
}
/*Clouds for opening sequence*/
/*Cloud Transformation is jerky when it repeats but takes 3 minutes to run so probably OK for now*/
img.movingclouds {
	width: 2600px;
	height: 100%;
    position: absolute;
    top: 0;
    left: 0px;
	overflow-x:hidden;

    
	
	-webkit-animation:cloudAnim 120s linear infinite;
	-moz-animation:cloudAnim 120s linear infinite;
	animation:cloudAnim 120s linear infinite;
	-webkit-transform: translate3d(0,0,0); /* Performance */
}
/* Chrome, Safari, Opera */
@-webkit-keyframes cloudAnim {
        0%   { 
            -webkit-transform: translateX(0); 
            -moz-transform:    translateX(0); 
            -ms-transform:     translateX(0); 
            -o-transform:      translateX(0); 
            transform:         translateX(0); 
        }    
        100% { 
             -webkit-transform: translateX(-973px); /*width of the image. Repeat without any jerkiness as repeating from the beginning of the image*/
            -moz-transform:    translateX(-973px); 
            -ms-transform:     translateX(-973px); 
            -o-transform:      translateX(-973px); 
            transform:         translateX(-973px); 
        }
    }
    @-moz-keyframes cloudAnim {
        0%   { 
            -webkit-transform: translateX(0); 
            -moz-transform:    translateX(0); 
            -ms-transform:     translateX(0); 
            -o-transform:      translateX(0); 
            transform:         translateX(0); 
        }    
        100% { 
            -webkit-transform: translateX(-973px); 
            -moz-transform:    translateX(-973px); 
            -ms-transform:     translateX(-973px); 
            -o-transform:      translateX(-973px); 
            transform:         translateX(-973px); 
        }
    }
/* IE */	
@keyframes cloudAnim {
		0%   { 
             transform:translateX(0); 
        }    
        100% { 
             transform:translateX(-973px); 
        }
	}
/*img.Sky1lgclouds {
	position: absolute;
	width: 100%;
	height: 1000px;
	top: 35%;
    left: 0%;
}*/

img.largecloud {
	/*make div same size of actual image*/
	width: 248px;
    height: 247px;
	position: absolute;
	top: 7%;
    left: 10%;
	max-width:20%; 
	-webkit-animation: lgCloud 60s infinite; 
   -webkit-animation-direction: alternate; 
   
   animation: lgCloud 60s infinite;
   animation-direction: alternate;
   
   -webkit-transform: translate3d(0,0,0); /* Performance */
}

@-webkit-keyframes lgCloud {
     0%  {width:248px; height:247px;}
    25%  {width:295px; height:247px;}
    50%  {left: 5%; top: 4%;}
    75%  {width:350px; height:247px;}
    100% {width:248px; height:247px;}
}

@keyframes lgCloud {
    0%  {width:248px; height:247px;}
    25%  {width:295px; height:247px;}
    50%  {left: 5%; top: 4%;}
    75%  {width:350px; height:247px;}
    100% {width:248px; height:247px;}

 }

img.cbottom {
	/*make div same size of actual image*/
	width: 182px;
    height: 150px;
	
	position: absolute;
	top: 70%;
    left: 3%;
	max-width:20%; 

   -webkit-animation: bottomCloud 30s infinite; 
   -webkit-animation-direction: alternate; 
   animation: bottomCloud 30s infinite;
   animation-direction: alternate;
	/*animation-delay:10s;*/
}


 /* Chrome, Safari, Opera */
 @-webkit-keyframes bottomCloud {
    0%   {left: 3%; top: 70%;}
    25%  {left: 4%; top: 70%;}
    50%  {left: 5%; top: 71%;}
    75%  {left: 3%; top: 72%;}
    100% {left: 3%; top: 70%;}
}
/* Standard syntax IE and Firefox */
@keyframes bottomCloud {
    0%   {left: 3%; top: 70%;}
    25%  {left: 4%; top: 70%;}
    50%  {left: 5%; top: 71%;}
    75%  {left: 3%; top: 72%;}
    100% {left: 3%; top: 70%;}
}


#home_background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#home_background_image {
    position: absolute;
    top: 0;
    left: 0;
    width: 1600px;
    height: 1011px;
}

#home_picto {
    position: relative;
}

/* -- home content -- */
#home_content {
    text-align: center;
    color:#FFF; /*#928664;*/
}

.loaded #home_picto {
    opacity: 1;

    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

#home_picto {
    display: block;
    margin: 0 auto;
    width: 48px;
    height: 35px;

    -webkit-transform: translateY(220px);
    -moz-transform: translateY(220px);
    transform: translateY(220px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}
/*Brock logo for calculators*/

#calc_section {
    position: relative;
    width: 100%;
    min-height: 1200px; 
    background-color: #216da2;

    
	background: url(../img/sky1.jpg) center 0 no-repeat fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x: hidden;
	overflow-y: hidden;

}
label {
    display:block;
    padding-bottom:.25em;
    font-weight:700
}

#calc_logo {
    width: 211px;
    height: 219px;
	margin: 0 auto;
    margin-top: 25px;

    opacity: 1;

    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    transform: translateY(40px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

#calc_title {
    opacity: 1;

    -webkit-transform: translateX(150px);
    -moz-transform: translateX(150px);
    transform: translate<X(150px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}
/*Brock text setup for calc inputs*/

#clage{
 width:50px;   
}

#cappage{
 width:50px;   
}

#calc_wrap {
    float: left;
    position: relative;
    left: 50%;
}

#calc_content {
    float: left;
    position: relative;
    left: -50%;
	text-align: justify;
	font-size: 24px;
	font-family: 'gt_walsheim_thin', serif;
}
input[type="text"]
{
    font-size:18px;
	color: #000;
}
select {
  font-size: 18px;
  color: #000;
}

#buttoncalc {
    background:#79699c;
    border:0;
    color:#fff;
    cursor:pointer;
    font:600 15px/1em 'gt_walsheim_thin', serif;
    letter-spacing:1px;
    outline:0;
    padding:18px 36px;
    text-transform:uppercase;
    -webkit-appearance:none;
    -moz-transition:background-color .2s linear;
    -o-transition:background-color .2s linear;
    -webkit-transition:background-color .2s linear;
    transition:background-color .2s linear
}
#buttoncalc:hover {
    background-color:#959699
}


/*Brock logo in opening sequence*/
#home_text_1 {
    /* Logo size for C9 vs Quest below width: 211px;
    height: 156px;*/
    width: 211px;
    height: 219px;
	margin: 0 auto;
    margin-top: 185px;

    opacity: 0;

    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    transform: translateY(40px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

.loaded #home_text_1 {
    opacity: 1;

    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

#home_title {
    font-family: 'gt_walsheim_thin', serif;
    font-size: 45px;
    text-transform: uppercase;
    line-height: 75px; 
    letter-spacing: 8px;
    margin: 0 auto;
    margin-top: 40px;
    width: 60%;
}

#home_title_1 {
    opacity: 0;

    -webkit-transform: translateX(150px);
    -moz-transform: translateX(150px);
    transform: translate<X(150px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

.loaded #home_title_1 {
    opacity: 1;

    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translate<X(0px);
}

#home_title_2 {
    opacity: 0;

    -webkit-transform: translateX(-150px);
    -moz-transform: translateX(-150px);
    transform: translate<X(-150px);

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

.loaded #home_title_2 {
    opacity: 1;

    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translate<X(0px);
}

/*Brock the little block on the openeing page*/
#home_liseret {
    opacity: 0;
    width: 170px;
    height: 4px;
    margin: 0 auto;
    background-color:#fff; /*#928664;*/
    margin-top: 80px;

    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

.loaded #home_liseret {
    opacity: 1;
    width: 10px;
}

#home_enter_link {
    opacity: 0;
    display: block;
    position: relative;
    width: 120px;/*Brock made wider 60px;*/
    height: 60px;
    line-height: 60px;
    text-align: center;
    margin: 0 auto;
    margin-top: 130px;
    font-family: 'gt_walsheim', serif;
    font-size: 13px;
    text-decoration: none;
    color:#FFF; /*#928664;*/
    cursor: pointer;

    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: all 1s ease-in-out;

    transition-delay: 1s;
    -webkit-transition-delay: 1s; /* Safari */
}

.loaded #home_enter_link {
    opacity: 1;
}

.home_enter_link_line {
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #fff; /*#928664;*/
    transform:rotate(-45deg);
    -ms-transform:rotate(-45deg); /* IE 9 */
    -webkit-transform:rotate(-45deg); /* Opera, Chrome, and Safari */

    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

#line_top {
    top: 5px;
    left: -40px; /*Brock made wider -20px;*/
}

#line_bottom {
    bottom: 5px;
    right: -40px; /*Brock made wider -20px;*/
}

#home_enter_link:hover #line_top {
    width: 10px;
    top: 30px
}

#home_enter_link:hover #line_bottom {
    width: 10px;
    right: -25px;
    bottom: 30px;
}

/* ========================
          SECTIONS            
========================= */
/*Brock added font colour for white for both title and subtitle*/
.section_title {
    position: relative;
    font-family: 'gt_walsheim_thin', serif;
    font-size: 41px;
    line-height: 55px;
    letter-spacing: 22px;
    text-transform: uppercase;
    text-align: center;
    padding-top: 150px;
	color: #fff;
}

.section_subtitle {
    position: relative;
    /* font-family:"newtypo"; */
    font-family: 'Droid Sans', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    line-height: 28px;
    letter-spacing: 3px;
    margin-top: 50px;
    text-align: center;
	color: #fff;
}

.section_subtitle_bottom {
    position: relative;
    /* font-family:"newtypo"; */
    font-family: 'Droid Sans', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    /* text-transform: uppercase; */
    line-height: 28px;
    letter-spacing: 3px;
    margin-top: 100px;
    text-align: center;
}

.section_subtitle2 {
    position: relative;
    /* font-family:"newtypo"; */
    font-family: 'Droid Sans', sans-serif;
    font-size: 13px;
    text-transform: uppercase;
    line-height: 15px;
    letter-spacing: 3px;
    margin-top: 5px;
    text-align: center;
}
/*Brock changed from black to white background-color*/
.section_liseret {
    position: relative;
    width: 10px;
    height: 4px;
    background-color: #fff;/*#000000;*/
    margin: 0 auto;
    margin-top: 30px;
}

/* ========================
            STORY            
========================= */
#story_section {
   position: relative;
    width: 100%;
    min-height: 1200px;
    padding-bottom: 350px;
 
}
img.sky2 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}
img.sky2smallcloud {
	position: absolute;
	width: 182px;
	height: 150px;	
	top: 5%;
	left: 15%;
	-webkit-animation: s2smallCloud 120s infinite; 
   -webkit-animation-direction: alternate; 
   animation:  s2smallCloud 120s infinite;
   animation-direction: alternate;
   -webkit-transform: translate3d(0,0,0); /* Performance */
}

@-webkit-keyframes  s2smallCloud {
     0%  {width:182px; height:150px;}
    25%  {width:295px; height:170px;}
    50%  {left: 18%; top: 4%;}
    75%  {width:350px; height:247px;}
    100% {width:182px; height:150px;}
}

@keyframes  s2smallCloud {
    0%  {width:182px; height:150px;}
    25%  {width:295px; height:170px;}
    50%  {left: 18%; top: 4%;}
    75%  {width:350px; height:247px;}
    100% {width:182px; height:150px;}

 }



/*Brock line in first section*/
.story_middle_extrem {
    position: absolute;
    left: 50%;
    width: 1px;
    height: 175px;
    background-color: #fff; 
    z-index: 11;
}

#story_middle_top {
    top: -175px;
}

#story_middle_bottom {
    bottom: -175px;
}

.story_content_elt_separation {
    width: 100%;
    height: 250px;
}

.story_middle_separation {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background-color: #fff;
    z-index: 11;
}

#story_content {
    position: relative;
    width: 935px;
    margin: 0 auto;
    margin-top: 300px;
}

.story_content_elt {
    position: relative;
    min-height: 580px;
}

.story_content_elt_bloc_1 {
    position: relative;
    width: 417px;
    height: 500px;
}

.story_content_left .story_content_elt_bloc_1 {
    float: left;
}

.story_content_right .story_content_elt_bloc_1 {
    float: right;
    margin-left: 101px;
}

.story_content_elt_bloc_2 {
    width: 417px;
}

.story_content_left .story_content_elt_bloc_2 {
    float: left;
    margin-left: 101px;
}

.story_content_right .story_content_elt_bloc_2 {
    float: right;
}

.story_middle {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    background-color: #fff;
}

.story_content_elt_date {
    position: absolute;
    font-family: 'gt_walsheim_thin', serif;
    font-size: 29px;
    height: 30px;
    line-height: 30px;
    text-transform: uppercase;
    letter-spacing: 8px;
    top: -10px;
    z-index: 10;
}

.story_content_left .story_content_elt_date {
    right: 52px;
}

.story_content_right .story_content_elt_date {
    left: 52px;
}
/*Brock added - changed order and had to add padding play with left as left: doesn't work*/

.story_content_left .screen_rotate {
    right: 0;
}

.story_content_right .screen_rotate {
    left: 0;
}


.screen_rotate {
    position: absolute;
    top: 16px;
	/*padding-left: 15px;*/
	margin-left: 3%;
    /*width: 390px;
	width: 93%;*/
	width: 93%;
    height: auto;
}



.story_content_elt_big_pic {
    position: absolute;
    top: 0;
    /*width: 417px;*/
	width: 100%;
    height: auto;
}



.story_content_left .story_content_elt_big_pic {
    right: 0;
}

.story_content_right .story_content_elt_big_pic {
    left: 0;
}

.story_content_elt_small_pic {
    width: 322px;
    height: 322px;
}

.story_content_left .story_content_elt_small_pic {
    float: left;
}

.story_content_right .story_content_elt_small_pic {
    float: right;
}



.story_content_left .story_content_elt_number {
    float: left;
}

.story_content_right .story_content_elt_number {
    float: right;
}

.story_content_left .story_content_elt_text {
    float: left;
}

.story_content_right .story_content_elt_text {
    float: right;
}

.story_content_elt_text {
    font-family: "franklin_gothic_medium_condensed",sans-serif; /* Brock looks too much like Rockwell'sanchez_regular', serif;*/
    font-size: 24px; /*Brock also added color. 12px;*/
    color:#fff;
	line-height: 32px;
    margin-top: 35px;
    width: 322px;
}

.story_content_left .story_content_elt_text {
    text-align: left;
}

.story_content_right .story_content_elt_text {
    text-align: right;
}

/* ========================
            PRODUCTS            
========================= */
#price_section {
    position: relative;
    min-height: 700px;
    overflow: hidden;
    padding-bottom: 175px;
}

img.sky3 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}


/* ========================
         MARKETING           
========================= */
#marketing_section {
    position: relative;
    min-height: 700px;
    overflow: hidden;
    padding-bottom: 175px;
}

img.sky4 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}

/* ========================
            PARTNERS            
========================= */
#partners_section {
	position: relative;
    /* background-color: #f2f2f2; */
    min-height: 700px;
    overflow: hidden;
    padding-bottom: 175px;
    background-color: #216da2;
  
}
img.sky5 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}

/* ========================
            CONTACT            
========================= */
#contact_section {
    position: relative;
    /* background-color: #f2f2f2; */
    min-height: 700px;
    overflow: hidden;
    padding-bottom: 175px;
}


img.sky6 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}



.center_area_small {
    position:relative;
    width:950px;
    margin:0 auto
}


#contact_title {
    font-family:'gt_walsheim',serif;
    font-size:31px;
	color: #fff;
    padding-top:185px;
    text-align:center
}

#contact_content {
    margin-top:0px /*100px*/
}

.contact_content_content a {
    text-decoration:none;
    color:#fff;
}

#contact_content_left,#contact_content_middle,#contact_content_right {
    float:left;
    width:316px;
    font-size:18px;
    line-height:25px;
    font-family:"franklin_gothic_medium_condensed";
	color:#fff;
}

#contact_content_middle {
    text-align:center;
}

#contact_content_right {
    text-align:right;
}

.contact_content_title {
    color:#fff; /*#818181;*/
}

#footer_instagram {
    margin-top:30px;
}

#contact_liseret {
    width:134px;
    height:1px;
    margin:0 auto;
    margin-top:125px;
    margin-bottom:80px;
    background-color: #fff;/*#333;*/
}

#contact_text {
    text-align:center;
    font-size:24px;
	color: #fff;
    font-family:"franklin_gothic_medium_condensed";
}

#contact_copyright {
    font-size:11px;
    color: #fff;/*#818181;*/
    text-align:center;
    margin-top:15px;
    padding-bottom:40px;
    font-family:"franklin_gothic_medium_condensed";
}
#contact_logo {
margin-left: 42%;
/*Brock logo size for c9 quest belowwidth: 150px;
height:111px;	*/
width: 150px;
height:156px;	
}

@media screen and (max-height:800px) {
#contact_title {
    padding-top:80px;
}
}


.back_to_top {
	/*brock added img*/
	position: relative;
	background:url(../../assets/img/scroll-to-top.png) no-repeat;
	left:48%;
	width:73px;
	height: 71px;
	cursor: pointer;
	
	padding-right: 1em;
	
	z-index: 999;

}

/* ========================
            FOOTER            
========================= */
#footer {
    position: relative;
    height: 70px;
    background-color: #FFFFFF;
}

#copyright {
    float: left;
    padding-left: 95px;
}

#powered {
    float: right;
    padding-right: 95px;
}

#powered a {
    text-decoration: none;
    color: #1b1b1b;

    webkit-transition: color 0.2s ease-in-out;
    -moz-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}

#powered a:hover {
    color: #404040;
}

#copyright, #powered {
    font-family: "Rockwell";
    line-height: 70px;
    font-size: 11px;
    letter-spacing: 1px;
}

#social {
    position: absolute;
    top: 25px;
    left: 50%;
    margin-left: -200px;
    height: 20px;
    width: 400px;
    text-align: center;
}

#social a {
    text-decoration: none;
    color: #000000;
    padding: 0 25px;
}

#social a:hover {
    color: #949494;
}

.social_elt {
    width: 20px;
    height: 20px;
}

/* ========================
            PRIVACY            
========================= */
#privacy_section {
    position: relative;
    min-height: 700px;
    overflow: hidden;
    padding-bottom: 175px;
}


img.sky7 {
	width: 100%;
    height: 100%;
	
	position: absolute;
	 -webkit-background-size: cover;
    -moz-background-size: cover; 
    -o-background-size: cover;
    background-size: cover; 
	overflow-x:hidden;
	max-width:100%; 

}
#privacy_body {
    font-family:'gt_walsheim',serif;
    font-size:14px;
	color: #fff;
    padding-top:85px;
    text-align:left
}

.privacy_content_title {
    color:#fff; 
	font-size:18px;
}

/*Brock Button to send you Back To Top */

.privacy-back {
	position: fixed;
	background:url(../../assets/img/privacy-back.png) no-repeat;
	cursor: pointer;
	top:6em;
	/*bottom: 1em;*/
	right: 25px;
	width:73px;
	height: 71px;
	padding-right: 1em;
	display: none;
	z-index: 999;
}


.scroll-to-top:hover {
    border-bottom-width:0
}

/* ========================
    RESPONSIVE VERTICAL
========================== */
@media screen and (max-height: 800px) {
    #home_text_1 {
        margin-top: 120px;
    }

    #home_enter_link {
        margin-top: 100px;
    }

    #home_liseret {
        margin-top: 60px;
    }

    #home_picto {
        -webkit-transform: translateY(170px);
        -moz-transform: translateY(170px);
        transform: translateY(170px);
    }

    #menu {
        position: absolute;
        top: 80px;
    }

    .menu_link {
        margin-top: 50px;
    }

}

/* ========================
    RESPONSIVE horizontal
========================== */


/** BROCK Google Nexus7 (Landscape) - also seems to be handling ipad landscape**/
@media screen and (min-device-width : 601px) and (max-device-width :970px) {
	
#menu_list {
    margin-top: 35px;

}

/*move up intro so button to continue appears*/
#home_text_1 {
 
    margin-top: 5px;

}

#home_title {
    
    margin-top: 10px;
}
	
}

@media screen and (max-width: 1310px) {
    /*Brock played with size so when you open favourites in ie it resizes appropriately*/
	.screen_rotate {
        position: absolute;
        top: 10px;
		margin-left: 3%;
        width: 225px;
        height: auto;
    }
	.story_content_elt_big_pic {
        position: absolute;
        top: 0;
        right: 0;
        width: 250px;
        height: auto;
    }

    .story_content_elt_small_pic {
        width: 225px;
        height: 225px;
    }

    .story_content_elt_separation {
        width: 100%;
        height: 150px;
    }

    .story_content_elt_text {
        font-family: 'sanchez_regular', serif;
        font-size: 12px;
        line-height: 25px;
        margin-top: 35px;
        width: 300px;
    }

    .contact_elt_pic {
        position: relative;
        width: 336px;
        height: 236px;
    }

    .contact_elt_pic_image {
        position: absolute;
        top: 0;
        left: 0;
        width: 336px;
        height: 236px;
    }

}

/*Brock Image Rotatation for Why We Are Page.  Uses screen_rotate for positioning of screens*/


@-webkit-keyframes mainpicFadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-moz-keyframes mainpicFadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@-o-keyframes mainpicFadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}

@keyframes mainpicFadeInOut {
 0% {
   opacity:1;
 }
 17% {
   opacity:1;
 }
 25% {
   opacity:0;
 }
 92% {
   opacity:0;
 }
 100% {
   opacity:1;
 }
}
#mainpic img {
  position:absolute;
  left:0;
}

#mainpic img {
  -webkit-animation-name: mainpicFadeInOut;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 26s;

  -moz-animation-name: mainpicFadeInOut;
  -moz-animation-timing-function: ease-in-out;
  -moz-animation-iteration-count: infinite;
  -moz-animation-duration: 26s;

  -o-animation-name: mainpicFadeInOut;
  -o-animation-timing-function: ease-in-out;
  -o-animation-iteration-count: infinite;
  -o-animation-duration: 26s;

  animation-name: mainpicFadeInOut;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-duration: 26s;
}
#mainpic img:nth-of-type(1) {
  -webkit-animation-delay: 20s;
  -moz-animation-delay: 20s;
  -o-animation-delay: 20s;
  animation-delay: 20s;
}
#mainpic img:nth-of-type(2) {
  -webkit-animation-delay: 16s;
  -moz-animation-delay: 16s;
  -o-animation-delay: 16s;
  animation-delay: 16s;
}
#mainpic img:nth-of-type(3) {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}
#mainpic img:nth-of-type(4) {
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  -o-animation-delay: 8s;
  animation-delay: 8s;
}
#mainpic img:nth-of-type(5) {
  -webkit-animation-delay: 4s;
  -moz-animation-delay: 4s;
  -o-animation-delay: 4s;
  animation-delay: 4s;
}
#mainpic img:nth-of-type(6) {
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -o-animation-delay: 0;
  animation-delay: 0;
}

/*Brock added so href to link to SSQ and RMA is white*/
a {
    text-decoration:none;
    color:#fff
}

a:visited {
    color:#fff
}

/*Brock for product section tick marks*/

.icon-list {
    font-family:"franklin_gothic_medium_condensed",sans-serif;
    text-transform:uppercase;
    font-weight:700;
    font-size:1.15em;
    letter-spacing:.1em;
    display:table;
    border-spacing:0 .5em
}

.icon-list li {
    position:relative;
    display:table-row;
    margin:1.25em 0;
    line-height:1.25
}

.icon-list li:before {
    font-size:2.5em;
    margin-right:.25em
}

.icon-list a,.icon-list span {
    display:table-cell;
    vertical-align:middle;
    border-bottom:none!important
}
/*Handles copy beside the tick icon*/
.icon-list--small {
    font-size:.8em;
    margin-top:1em
}
/*Handles size of tick icon*/
.icon-list--small li:before {
    font-size:27px;
    margin-right:.5em
}


.icon:before,[class^="icon--"]:before,[class*=" icon--"]:before {
    font-family:"webicon";
    font-weight:400;
    font-style:normal;
    speak:none;
    display:inline-block;
    text-decoration:inherit;
    margin-right:.2em;
    position:relative;
    line-height:1em;
    top:1px
}

.icon--large:before {
    vertical-align:middle;
    font-size:1.35em;
    line-height:1.2em;
    padding-right:.2em
}

.icon--pad:before {
    padding-right:.3em
}

.icon--tick:before {
    content:"\e00a";
    -moz-border-radius:100%;
    -webkit-border-radius:100%;
    border-radius:100%;
    -moz-background-clip:padding;
    -webkit-background-clip:padding-box;
    background-clip:padding-box;
    border:2px solid #252525;
    height:1em;
    width:1em
}

/* Brock  Only used in pages on mortgage, auto and asset protect*/
button,.btn:link,input[type=submit] {
    display:inline-block;
    font-family:"franklin_gothic_medium_condensed",sans-serif;
    font-size:.6em;
	font-weight:400;
    text-transform:uppercase;
    letter-spacing:.2em;
    text-align:center;
	color:#fff;
    margin-bottom:1em;
    border-bottom:3px solid #fff;
    padding-bottom:2px
}

button:hover,.btn:link:hover,input[type=submit]:hover {
    border-width:5px;
    padding-bottom:0
}
/* Brock  Used for privacy and legal*/
button,.btnprivacy:link,input[type=submit] {
    display:inline-block;
    font-family:"franklin_gothic_medium_condensed";
    font-size:11px;
    text-align:center;
	color:#fff;
    margin-bottom:1em;
    border-bottom:2px solid #fff;
    padding-bottom:2px
}

button:hover,.btnprivacy:link:hover,input[type=submit]:hover {
    border-width:3px;
    padding-bottom:0
}