@font-face {
  font-family:"Major Mono Display";
  src: url("../fonts/MajorMonoDisplay-Regular.eot"); /* IE9*/
  src: url("../fonts/MajorMonoDisplay-Regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/MajorMonoDisplay-Regular.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/MajorMonoDisplay-Regular.woff") format("woff"), /* chrome、firefox */
  url("../fonts/MajorMonoDisplay-Regular.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/MajorMonoDisplay-Regular.svg#Major Mono Display") format("svg"); /* iOS 4.1- */
  font-display: block; /* Fix flickering */
}





@font-face {
  font-family:"GT Walsheim Pro Ultra Light";
  src: url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.eot"); /* IE9*/
  src: url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.woff") format("woff"), /* chrome、firefox */
  url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/bbfe44cfa96f2acd5d84ae2f1111745d.svg#GT Walsheim Pro Ultra Light") format("svg"); /* iOS 4.1- */
}

@font-face {
  font-family: "GT Walsheim Pro Thin";
  src: url("../fonts/6eb423bcd4953053bb2671f139d18075.eot"); /* IE9*/
  src: url("../fonts/6eb423bcd4953053bb2671f139d18075.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/6eb423bcd4953053bb2671f139d18075.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/6eb423bcd4953053bb2671f139d18075.woff") format("woff"), /* chrome、firefox */
  url("../fonts/6eb423bcd4953053bb2671f139d18075.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/6eb423bcd4953053bb2671f139d18075.svg#GT Walsheim Pro Thin") format("svg"); /* iOS 4.1- */
}
 
@font-face {
  font-family: "GT Walsheim Pro Regular";
  src: url("../fonts/4417812509ea84242dcf790e829ca350.eot"); /* IE9*/
  src: url("../fonts/4417812509ea84242dcf790e829ca350.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/4417812509ea84242dcf790e829ca350.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/4417812509ea84242dcf790e829ca350.woff") format("woff"), /* chrome、firefox */
  url("../fonts/4417812509ea84242dcf790e829ca350.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/4417812509ea84242dcf790e829ca350.svg#GT Walsheim Pro Regular") format("svg"); /* iOS 4.1- */
}


@font-face {
    font-family: "GT Walsheim Pro Medium";
    src: url('../fonts/GTWalsheimProMedium.eot');
    src: url('../fonts/GTWalsheimProMedium.eot') format('embedded-opentype'),
         url('../fonts/GTWalsheimProMedium.woff2') format('woff2'),
         url('../fonts/GTWalsheimProMedium.woff') format('woff'),
         url('../fonts/GTWalsheimProMedium.ttf') format('truetype'),
         url('../fonts/GTWalsheimProMedium.svg#GTWalsheimProMedium') format('svg');
}

/* Setting fade transition and default settings */
body {
  overflow:auto;
  background-color: #2C2C2C;
  transition: background-color 1s ease;
  font-family:"GT Walsheim Pro Ultra Light" !important;
  font-size:0.8em;
  text-align:left;
  letter-spacing:0.02em;
  line-height:1.4em;
  color:#898989;
}

/* panel styles */
.panel {
  /* min height incase content is higher than window height */
  min-height: 100vh;
  display: flex;
  z-index:4;
  justify-content: space-around;
  align-items: center;
  /* outline: 10px solid hotpink; */
  /* turn above on to see the edge of panels */
}

/* colours */
.color-offwhite {
  background-color: #C5C5C5; 
}
.color-indigo {
  background-color: #4332CF;  
}
.color-blue {
  background-color: #2F8FED;
}
.color-green {
  background-color: #4DCF42;
}
.color-yellow {
  background-color: #FAEB33;
}
.color-orange {
  background-color: #F19031;
}
.color-red {
  background-color: #F2293A;
}
.color-darkgrey {
  background-color: #2C2C2C;
}
.color-offblack {
  background-color: #1F1F1F;
}
.color-nearblack {
  background-color: #181818;
}





/*-----typography---------------------------------------------------------------------*/

   
        
.quote {
  font-family:"GT Walsheim Pro Thin" !important;
  font-size:1.6em;
  text-align:left;
  letter-spacing:0em;
  line-height:1.3em;
  color:#898989;
}

.intro-hello3 {
        font-family: "GT Walsheim Pro Thin";
        font-size:2.4em;
	text-align:left;
        letter-spacing: -0.02em;
        line-height:1.1em;
        color:#898989;
        }        
 
.intro-hello {
        font-family: "GT Walsheim Pro Thin";
        font-size:1.8em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.3em;
        color:#898989;
        }        
        
 .intro-hello2 {
        font-family: "GT Walsheim Pro Ultra Light";
        font-size:2em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#898989;
        }        
        
        
         
        
        
.text1 {
        font-family:'GT Walsheim Pro-Thin';
        font-size:1.0em;
	text-align:left;
        letter-spacing: 0.03em;
        font-weight:300;
        line-height:1.7em;
        color:#FFFFFF;
        }       
        
.outbound:link {
        text-decoration:none;
	color:#2d2d2d;
        line-height:1.5em;
        font-family: 'GT Walsheim Pro-Thin';
        letter-spacing: 0;
        font-size:1.0em;
        font-weight:800;
	text-align: left;
        }
        
 .outbound:visited {
        text-decoration:none;
	color:#2d2d2d;
        line-height:1.5em;
        font-family: 'GT Walsheim Pro-Thin';
        letter-spacing: 0;
        font-size:1.0em;
        font-weight:800;
	text-align: left;
        }   
        
 .outbound:hover {
        color:#2d2d2d;
        }


class#dot {
	color:#2d2d2d;
        line-height:1.5em;
        font-family: 'GT Walsheim Pro-Thin';
        letter-spacing: 0;
        font-size:11px;
        font-weight:800;
	text-align:left;
        }
        
class#ux {
	color:#2d2d2d;
        line-height:1.5em;
        font-family: 'GT Walsheim Pro-Thin';
        letter-spacing: 0;
        font-size:8px;
        font-weight:bold;
        }
        
.credit {
        font-family: "GT Walsheim Pro Regular";
	color:#898989;
        line-height:1.5em;
        letter-spacing: 0;
        font-size:15px;
        letter-spacing:0.05em;
        } 

.strapline {
           text-decoration:none;		
           color:#FFFFFF;
	   line-height:40px;
	   font-family:'GT Walsheim Pro-Thin';
	   font-size:26px;
           letter-spacing:0em; 
	   font-weight:300;
	}

*{
margin: 0px;
padding:0px;
}
        
h1#quote {
	color:#E6E6E6;
	line-height:25px;
        font-family: 'GT Walsheim Pro Medium';
	font-size:12px;
        letter-spacing: 0.2em; 
	font-weight:500;
	text-transform:uppercase;  
        margin-left: 0px;
	}
        
h1#quote-job {
	color:#898989;
	line-height:25px;
        font-family: 'GT Walsheim Pro Medium';
	font-size:12px;
        letter-spacing: 0.2em; 
	font-weight:500;
	text-transform:uppercase;  
        margin-left: 0px;
	}
        
.h1 {
  		text-decoration:none;
		color:#E6E6E6;
                letter-spacing:0em; 
                font-weight:300;
		line-height:90px;
		font-family:'GT Walsheim Pro-Thin';
		font-size:8em;
                padding:0px;
                margin-left:-5px;
		}
.bigtype {
  		font-family: "GT Walsheim Pro Thin";
                text-decoration:none;
		color:#C1C1C1;
                letter-spacing:-0.03em; 
		line-height:110px;
		font-size:8em;
                padding:0px;
                margin-left:-5px;
		}
.bigtypetown {
                font-family:'Major Mono Display';
                text-decoration:none;
		color:#c1c1c1;
                letter-spacing:-0.03em; 
		line-height:105px;
		font-size:6em;
                padding:0px;
                margin-left:-5px;
		}
                
 .bigtype2 {
  		font-family: "GT Walsheim Pro Thin";
                text-decoration:none;
		color:#898989;
                letter-spacing:-0.03em; 
		line-height:110px;
		font-size:8em;
                padding:0px;
                margin-left:-5px;
		}  
                
.hello {
  		font-family: "GT Walsheim Pro Thin";
                text-decoration:none;
		color:#E6E6E6;
                letter-spacing:0em; 
                font-weight:300;
		line-height:1.1em;
		font-size:2em;
                padding:0px;
                margin-left:0px;
		}               
                
h2 {
    		text-decoration:none;
		color:#000000;
		font-family: 'GT Walsheim Pro';
		font-size:15px;
		font-weight:700;
                letter-spacing: 0em; 
		text-transform:uppercase;
                   }

h2#author {
    		text-decoration:none;
		color:#2d2d2d;
		line-height:25px;
		font-family: 'GT Walsheim Pro';
		font-size:13px;
		font-weight:700;
		text-transform:uppercase;
                text-align:center;
		}

h3 {
                text-decoration:none;		
                color:#2d2d2d;
		font-family:'GT Walsheim Pro';
		font-size:18px;
                letter-spacing:0em; 
		font-weight:100;
                }

                
.intro  {
    		text-decoration:none;
		color:#E6E6E6;
                letter-spacing:0em; 
                font-weight:300;
		line-height:90px;
		font-family:'GT Walsheim Pro-Thin';
		font-size:84px;
                margin-top:20px;
		}
                
.intro1  {
    		text-decoration:none;
		color:#E6E6E6;
                letter-spacing:0em; 
                font-weight:300;
		line-height:44px;
		font-family:'GT Walsheim Pro-Thin';
		font-size:38px;
                margin-top:20px;
		}
                
                
#sitetitle  {
    		text-decoration:none;
		color:#FFFFFF;
		font-family:'GT Walsheim Pro';
		font-size:80px;
                text-align:left;
		}               
                
#sitetitle2  {
    		text-decoration:none;
		color:#5D5CF8;
		font-family:'GT Walsheim Pro';
		font-size:80px;
                text-align: left;
                margin-top:-30px;
		} 
h3#subtitle  {
    		text-decoration:none;
		color:#FFFFFF;
		line-height:48px;
		font-family:'GT Walsheim Pro-Thin';
		font-size:38px;
                text-align: left;
                margin-top:20px;
		}
                
.module-title:link {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:38px;
		font-family:'GT Walsheim Pro';
		font-size:35px;
                letter-spacing:0em; 
		font-weight:800;
                }  
                
.module-title:visited {
                text-decoration:none;		
                color:#FFFFFF;               
		line-height:38px;
		font-family:'GT Walsheim Pro';
		font-size:35px;
                letter-spacing:0em; 
		font-weight:800;
                } 
                
.module-title:hover {	
                color:#2D2D2D;
		line-height:38px;
		font-family:'GT Walsheim Pro';
		font-size:35px;
                letter-spacing:0em; 
		font-weight:800;
                } 
                

.block1:link {
                text-decoration:none;		
                color:#FFFFFF;
                letter-spacing:0em; 
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                margin-top:20px;
                } 
                              

.block1:visited {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                letter-spacing:0em; 
		font-weight:100;       
                }
                
 .block1:hover {
                text-decoration:overline;
                color:#FFFFFF;
                }                
                
                
.block2:link {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                letter-spacing:0em; 
		font-weight:100;
                } 
                              

.block2:visited {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                letter-spacing:0em; 
		font-weight:100;       
                }  
.block2:hover {
                color:#ECBA67;
                opacity:0.0.5.0;
                } 
                
.block3:link {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                letter-spacing:0em; 
		font-weight:100;
                } 
                              

.block3:visited {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:46px;
		font-family:'GT Walsheim Pro';
		font-size:36px;
                letter-spacing:0em; 
		font-weight:100;       
                }                 
                
.block3:hover {
                color:#FFFFFF;
                }                 
                
.big:link  {
                text-decoration:none;
		color:#2d2d2d;
                letter-spacing: 0.1em; 
		line-height:50px;
		font-family:'GT Walsheim Pro';
		font-size:40px;
		font-weight:100;
		text-transform:uppercase;
		}
 .big:hover  {
		color:#2d2d2d;
		line-height:50px;
                letter-spacing: 0.1em; 
		font-family:'GT Walsheim Pro';
		font-size:40px;
		font-weight:100;
		text-transform:uppercase;
		}
                               
h4 {
        font-family:'GT Walsheim Pro';
        font-size:1.2em;
	text-align:left;
        letter-spacing: 0.03em;
        font-weight:100;
        line-height:1.7em;
        color:#FFFFFF;
        }
        
                
.white-body {
        font-family:'GT Walsheim Pro';
        font-size:1.2em;
	text-align:left;
        letter-spacing: 0.03em;
        font-weight:100;
        line-height:1.7em;
        color:#FFFFFF;
        } 
                
.big:link  {
                text-decoration:none;
		color:#2d2d2d;
                letter-spacing: 0.1em; 
		line-height:50px;
		font-family:'GT Walsheim Pro';
		font-size:40px;
		font-weight:100;
		text-transform:uppercase;
		}
.big:hover  {
                text-decoration:none;
		color:#878787;
                letter-spacing: 0.1em; 
		line-height:50px;
		font-family:'GT Walsheim Pro';
		font-size:40px;
		font-weight:100;
		text-transform:uppercase;
		}                
                
.module:link {
    		text-decoration:none;
		color:#2d2d2d;
		line-height:1em;
		font-family: 'GT Walsheim Pro';
                font-size:1.1em;
                font-weight:800;
                letter-spacing: 0px;
                }
                
.module:visited {
    		text-decoration:none;
		color:#000000;
		line-height:1em;
		font-family: 'GT Walsheim Pro';
                font-size:1.1em;
                font-weight:800;
                letter-spacing: 0px;
		}
                
.module:hover {    
                color:#000000;
                }
                
.subtitle {
    		text-decoration:none;
		color:#FFFFFF;
		font-family: 'GT Walsheim Pro';
		font-size:12px;
                letter-spacing: 0.2em; 
		font-weight:500;
              
                }
                


h4#text {
        font-family:'GT Walsheim Pro';
        font-size:1.2em;
	text-align:left;
        font-weight:100;
        line-height:1.7em;
        color:#FFFFFF;
        }

.navOn{
                text-decoration:none;
		color:#FFFFFF;
		line-height:15px;
		font-family:'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:bold;
                text-transform:uppercase;
                padding:25px;
                letter-spacing: 0.2em;
}               
 
.name-A{
                text-decoration:none;
		color:#0FCCCF;
		line-height:20px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:500;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                
}  
.name-B{
                text-decoration:none;
		color:#6A69FC;
		line-height:20px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:500;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                
} 
.name-C{
                text-decoration:none;
		color:#0FCCCF;
		line-height:20px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:500;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                
} 
.name-D{
                text-decoration:none;
		color:#25AF67;
		line-height:20px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:500;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                
} 
.name2{
                text-decoration:none;
		color:#FFFFFF;
		line-height:20px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:500;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                padding:5px;
                
}                
.nav:link {
                text-decoration:none;
                letter-spacing: 0.2em;
		color:#898989;
		line-height:25px;
		font-family:'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
                padding:25px;
                text-transform:uppercase;
}
.nav:visited {
                text-decoration:none;
		color:#898989;
		line-height:25px;
		font-family: 'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
		}
                
.nav:hover {    
                color:#FFFFFF; 
                }
 .nav2:link {
                text-decoration:none;
                letter-spacing: 0.2em;
		color:#8F8F8F;
		line-height:25px;
		font-family:'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
                padding:25px;
                text-transform:uppercase;
}
.nav2:visited {
                text-decoration:none;
		color:#8F8F8F;
		line-height:25px;
		font-family: 'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
		}
                
.nav2:hover {    
                color:#FFFFFF; 
                }               
.navon2:link {
                text-decoration:none;
                letter-spacing: 0.2em;
		color:#FFFFFF;
		line-height:25px;
		font-family:'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
                padding:25px;
                text-transform:uppercase;
                }
                
.navon2:visited {
                text-decoration:none;
		line-height:12px;
		font-family: 'GT Walsheim Pro Medium';
		font-size:12px;
		font-weight:500;
                color:#FFFFFF; 
                text-transform:uppercase;
		}
                
.navon2:hover {    
                color:#FFFFFF;           
		}		

                
.nextlink:link {
                text-decoration:none;
                letter-spacing: 0.1em;
		color:#cecece;
		line-height:25px;
		font-family:'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:700;
                padding:25px;
                text-transform:uppercase;
                 }
                 
.nextlink:visited {
                text-decoration:none;
		color:#cecece;
		line-height:25px;
		font-family: 'GT Walsheim Pro Medium';
		font-size:15px;
		font-weight:700;
		}
                
.nextlink:hover {    
                color:#FFFFFF;           
		}

                
.connect:link {
                text-decoration:none;
		color:#898989;
		line-height:22px;
		font-family: 'GT Walsheim Pro';
		font-size:12px;
		font-weight:400;
                letter-spacing: 0.2em;             
		text-transform:uppercase;
}
.connect:visited {
    		text-decoration:none;
		color:#898989;
		line-height:22px;
		font-family: 'GT Walsheim Pro';
		font-size:12px;
		font-weight:400;
                 letter-spacing: 0.2em;             
		text-transform:uppercase;
		}
                
.connect:hover {    
                color:#FFFFFF;
                line-height:22px;
                letter-spacing: 0.2em;              
                text-decoration:overline;
		}
                
.subnav:link {
                text-decoration:none;
                letter-spacing: 0.2em;
		color:#8F8F8F;
		line-height:15px;
		font-family:'GT Walsheim Pro';
		font-size:10px;
		font-weight:500;
                padding:10px;
                text-transform:uppercase;
}
.subnav:visited {
                text-decoration:none;
		color:#8F8F8F;
		line-height:15px;
		font-family: 'GT Walsheim Pro';
		font-size:10px;
		font-weight:500;
                padding:10px;
		}
                
.subnav:hover {    
                color:#FFFFFF;           
		}
                


                
.subnavOn {
                text-decoration:none;
                letter-spacing: 0.2em;
		color:#FFFFFF;
		line-height:15px;
		font-family:'GT Walsheim Pro';
		font-size:10px;
		font-weight:500;
                padding:10px;
                text-transform:uppercase;
		}
                
  
a:link {
                text-decoration:none;		
                color:#FFFFFF;
		line-height:30px;
		font-family:'GT Walsheim Pro Regular';
		font-size:20px;
		font-weight:300;
                }          
            
a:visited {
		color:#FFFFFF;
                }  
a:hover {
                color:#FFFFFF;
                text-decoration:underline;
                }                  
                
.email:link {
            font-family: "GT Walsheim Pro Regular";
            color:#898989;
            line-height:1.5em;
            letter-spacing: 0;
            font-size:15px;
            letter-spacing:0.05em;
                }
            
.email:visited {
            font-family: "GT Walsheim Pro Regular";
            color:#898989;
            line-height:1.5em;
            letter-spacing: 0;
            font-size:15px;
            letter-spacing:0.05em;
                }  
                
.email:hover {
                color:#FFFFFF;
                text-decoration:none;

                }              
              
.module1 {
        color: #FFFFFF;
        border: none;
        z-index: 1;
	background-color:#343434;	
        padding: 0px;
	display: inline-block;
	text-decoration: none;
        -webkit-transition: background 1s; /* For Safari 3.0 to 6.0 */
        transition: background 1s; /* For modern browsers */
                }
    
.module1:hover {
        background-color: #535353;
        text-decoration:none;
}
 



.page-title{
                text-decoration:none;
		color:#FFFFFF;
		line-height:15px;
		font-family:'GT Walsheim Pro Medium';
		font-size:14px;
		font-weight:bold;
                text-transform:uppercase;
                letter-spacing: 0.2em;
                z-index:1;
} 



.contact:link {
        font-family: "GT Walsheim Pro Thin";
        font-size:1em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#898989;
        text-decoration:none;
}
            
.contact:visited {
        font-family: "GT Walsheim Pro Thin";
        font-size:1em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#898989;
        text-decoration:none;
}
                
.contact:hover {
        font-family: "GT Walsheim Pro Thin";
        font-size:1em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#FFFFFF;
        text-decoration:none;
}  

.profile:active {
        font-family: "GT Walsheim Pro Thin";
        font-size:2em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#FFFFFF;
        text-decoration:none;
}   

.profile:focus {
        font-family: "GT Walsheim Pro Thin";
        font-size:2em;
	text-align:left;
        letter-spacing: -0.01em;
        line-height:1.1em;
        color:#FFFFFF;
        text-decoration:none;
}   


 .scroll {
        text-decoration:none;
	color:#898989;
	line-height:15px;
	font-family:'GT Walsheim Pro Thin';
	font-size:14px;
	font-weight:bold;
        letter-spacing: 0.2em;
        }   
        
/*-----layout---------------------------------------------------------------------*/











#name-area2 {
        text-align:right;
        top:60px;
        right:50px;
        z-index:1;
        display:inline-block; 
        float:right;
        width:auto;
        position:fixed;
}


#global-frame{
        height:100%;
        width:100%;
        z-index:10;
        position:fixed;
        display:inline-block;
}

#port {
        text-align:left;
        width:auto;
        margin-left:50px;
        z-index:200;
        margin-top:40px;
        position:fixed;
}
        
        
      

    

    
 
 



 #intro-module3 {
    border:0;
    vertical-align:middle;
    width:850px;
    text-align:center;
    height:100%;
    margin-top:100px;
    margin-bottom:0px;
    margin-right:auto;
    margin-left:auto;
    padding:20px;
    z-index:5;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    }    
    
#intro-module {
    border:0;
    vertical-align:middle;
    width:850px;
    text-align:center;
    height:100%;
    margin-top:0px;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    z-index:5;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    } 
    
#intro-module1 {
    width:525px;
    text-align:left;
    margin-top:auto;
    margin-bottom:auto;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    display:inline-block;
    position:relative;
    } 
    
 #intro-module4 {
    width:530px;
    text-align:left;
    margin-top:auto;
    margin-bottom:auto;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    display:inline-block;
    position:relative;
    } 
    
 #intro-module-center {
    width:100%;
    display:inline-block;
    position:relative;
    text-align:right;
    z-index:-2;
    right:7%;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    }   
    
 #intro-module-left {
    max-width:385px;
    text-align:left;
    top:550px;
    padding:0px;
    left:50px;
    display:inline-block;
    position:relative;
    }  
    
  #intro-module-righter {
    max-width:485px;
    text-align:left;
    padding:0px;
    display:inline-block;
    position:relative;
    }     
    
#intro-module-right {
    width:300px;
    text-align:left;
    top:400px;
    padding:0px;
    right:12%;
    z-index:10;
    display:inline-block;
    position:relative;
    background-color:#0FCCCF;
    } 
    
 #intro-module-dis {
    max-width:450px;
    text-align:left;
    background-color:#C5C5C5;
    opacity:.9;
    z-index:1;
    padding: 20px;
    } 
    
  #intro-module-def {
    width:580px;
    text-align:left;
    margin-top:45%;
    margin-bottom:auto;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    display:inline-block;
    position:relative;
    } 
    
#flex-container {
    border:0;
    vertical-align:middle;
    width:900px;
    text-align:center;
    height:100%;
    margin-top:auto;
    margin-bottom:auto;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    z-index:1;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    } 
    
    
    
#flex-container2 {
    border:0;
    vertical-align:middle;
    text-align:center;
    height:100%;
    margin-top:0px;
    margin-bottom:0px;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
     z-index:1;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    }  
      
#flex-container-left {
    border:0;
    vertical-align:middle;
    width:100%;
    text-align:center;
    height:100%;
    padding:0px;
    z-index:1;
    position:absolute;
    display:flex;
    }  
         
 #flex-container-right {
    display:flex;
    position:absolute;
    margin-left:22%;
    top:13%;
    width:1300px;
    z-index:1;
    }  
  
 #flex-head-container {
    border:0;
    width:100%;
    opacity: 1;
    text-align:center;
    height:100%;
    padding:0px;
    z-index:-1;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    } 
       
    
#flex-head-container-intro {
    max-width:200%;
    text-align:center;
    height:100%;
    margin-top:-15%;
    z-index:-1;
    position:absolute;
    display:flex;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    } 
    
    
    
    
#flex-head-container2 {
    border:0;
    vertical-align:middle;
    width:100%;
    text-align:center;
    height:100%;
    margin-top:auto;
    margin-bottom:auto;
    margin-right:auto;
    margin-left:auto;
    padding:0px;
    z-index:-1;
    align-items: center; /* Vertical center alignment */
    justify-content: center; /* Horizontal center alignment */
    } 
        
    
        
    
    
    
#intro-module2 {
    border:0;
    width:405px;
    text-align:left;
    padding:0px;
    margin-top:9%;
    left:0px;
    } 
    
#quote-module {
    border:0;
    width:650px;
    margin-left:0;
    margin-right:0px;  
    margin-top:0px;
    margin-bottom:0px;
    }
    
.quote-module{
    font-family: "GT Walsheim Pro Thin";
    font-size:2em;
    text-align:left;
    letter-spacing: -0.01em;
    line-height:1.1em;
    color:#898989;    
    }
   

        
       
#text-holder {
        margin-left:auto;
        margin-right:auto;
        height:auto;
        }
        
#scroll-holder{
        display:inline-block;
        position:absolute;
        width:100%;
        text-align:center;
        z-index:3;
        bottom:45px;
        align-items: center; /* Vertical center alignment */
        justify-content: center; /* Horizontal center alignment */
}


        
    
    
 /* backgrounds
	 * --------------------------------------- */
 

    

#intro-holder2 {
    padding:0px;
    border:0px;
    width:100%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    display:inline;
    position:absolute;
    z-index:10;
    } 
    
   
  /* * --------------------------------------- */   

    

    
img{
        border:0px;
        height:auto;
        }
        
#page-title-holder{
        text-align:center; 
        width:100%;
        height:auto;
        z-index:100; 
        top:61px; 
        display:inline-block;
        position:absolute;
        }

#promo-badge{
        text-align:center; 
        width:300px;;
        height:auto;
        z-index:300;
        right:10%;
        top:61px; 
        display:inline-block;
        position:absolute;
        }
        
#footer-right {
        width:auto;
        vertical-align:bottom;
        float:right;
        right:0;
        bottom:0;
        position:fixed;
        z-index:5; 
        padding:45px; 
        }       
        
        
#footer-left {
        width:auto;
        vertical-align:bottom;
        float:left;
        left:0;
        bottom:0;
        position:fixed;
        z-index:5; 
        padding:45px; 
        }
        

.quote-job {
	color:#898989;
	line-height:25px;
        font-family: 'GT Walsheim Pro Medium';
	font-size:12px;
        letter-spacing: 0.2em; 
	font-weight:500;
	text-transform:uppercase;  
        margin-left: 0px;
	}
            

        


.def-image-container1 {
  width: 50vmin;
  height: 29vmin;
  display:inline-block;
  position: absolute;
  right:6%;
  margin-top:45%;
  z-index:1;
}

.def-image-container1 img {
	max-width:520px;
	max-height:300px;
        z-index:1;
        box-shadow: 40px 40px 40px #A3A3A3;
}



  /* --------------------------------------------- IMAGE define 3 */



.def-image-container4 {
  width: 30vmin;
  height: 50vmin;
  display:inline-block;
  position: absolute;
  left:15%;
  margin-top:8%;
  z-index:1;
}

.def-image-container4 img {
	max-width:300px;
	max-height:680px;
        z-index:1;
        box-shadow: 40px 40px 40px #A3A3A3;
}

  /* --------------------------------------------- IMAGE define 3 */



.def-image-container5 {
  width: 40vmin;
  height: 50vmin;
  display:inline-block;
  position: absolute;
  left:7%;
  margin-top:0%;
  z-index:1;
}

.def-image-container5 img {
	max-width:280px;
	max-height:380px;
        z-index:1;
        box-shadow: 40px 40px 40px #A3A3A3;
}

 /* --------------------------------------------- IMAGE define 3 */



.def-image-container6 {
  width: 50vmin;
  height: 50vmin;
  display:inline-block;
  position: absolute;
  left:11%;
  margin-top:63%;
  z-index:1;
}

.def-image-container6 img {
	max-width:340px;
	max-height:380px;
        z-index:1;
        box-shadow: 40px 40px 40px #A3A3A3;
}



   /* --------------------------------------------- IMAGE define 3 */



.def-image-container3 {
  width: 60vmin;
  height: 50vmin;
  display:inline-block;
  position: absolute;
  left:2%;
  margin-top:44%;
  z-index:1;
}

.def-image-container3 img {
	max-width:400px;
	max-height:380px;
        z-index:1;
        box-shadow: 40px 40px 40px #A3A3A3;
}


 

  /* --------------------------------------------- IMAGE define 2 */
   

.def-image-container2 {
  width: 40vmin;
  height: 30vmin;
  display:inline-block;
  position: absolute;
  right:5%;
  z-index:1;
}

.def-image-container2 img {
    max-width:400px;
    max-height:300px;
    z-index:1;
    box-shadow: 40px 40px 40px #A3A3A3;
}


 /* --------------------------------------------- IMAGE des 1 */



.des-image-container1 {
  width: 50vmin;
  height: 40vmin;
  overflow: hidden;
  display:inline-block;
  position: absolute;
  left:56%;
  margin-top:38%;
  z-index:1;
}

.des-image-container1 img {
	width:580px;
	height:400px;
        z-index:1;
}



  /* --------------------------------------------- IMAGE des 3 */



.des-image-container3 {
  width: 45vmin;
  height: 35vmin;
  overflow: hidden;
  display:inline-block;
  position: absolute;
  left:15%;
  bottom:7%;
  z-index:1;
}

.des-image-container3 img {
	width:450px;
	height:310px;
        z-index:1;
}



   

  /* --------------------------------------------- IMAGE des 2 */
   


.des-image-container2 {
  width: 45vmin;
  height: 50vmin;
  overflow: hidden;
  display:inline-block;
  position: absolute;
  left:68%;
  margin-top:380px;
  z-index:1;
}

.des-image-container2 img {
	width:450px;
	height:450px;
        z-index:1;
}


  /* --------------------------------------------- IMAGE des 4 */



.des-image-container4 {
  width: 55vmin;
  height: 40vmin;
  overflow: hidden;
  display:inline-block;
  position: absolute;
  left:2%;
  margin-top:10%;
  z-index:1;
}

.des-image-container4 img {
	width:550px;
	height:400px;
        z-index:1;
}





/*-----carousel slider NEW --------------------------------------------------------------------*/


*, *:before, *:after {
  box-sizing: border-box;
}



.slider {
  height: 100%;
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.slider__nav {
  width: 15px;
  height: 15px;
  border-radius:50%;
  border-color:#898989;
  margin-right:25px;
  margin-left:25px;
  margin-bottom:100px;
  z-index:10;
  background-color:#343434;
  outline: none;
  display:inline-block;
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.slider__nav:checked {
      background-color:#898989;
  left: 0%;
}
.slider__nav:checked:nth-of-type(1) ~ .slider__inner {
  left: 0%;
}
.slider__nav:checked:nth-of-type(2) ~ .slider__inner {
  left: -100%;
}
.slider__nav:checked:nth-of-type(3) ~ .slider__inner {
  left: -200%;
}
.slider__nav:checked:nth-of-type(4) ~ .slider__inner {
  left: -300%;
}
.slider__nav:checked:nth-of-type(5) ~ .slider__inner {
  left: -400%;
}
.slider__nav:checked:nth-of-type(6) ~ .slider__inner {
  left: -500%;
}
.slider__nav:checked:nth-of-type(7) ~ .slider__inner {
  left: -600%;
}


.slider__inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 700%;
  height: 100%;
  -webkit-transition: left 1s;
  transition: left 1s;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
}



.slider__contents {
  height: 100%;
  padding: 2rem;
  text-align: left;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  -webkit-flex-flow: column nowrap;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}


@-webkit-keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 0 12px #333, 0 0 0 36px rgba(51, 51, 51, 0.2);
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0 0 #333, 0 0 0 0 rgba(51, 51, 51, 0);
  }
}

@keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 0 12px #333, 0 0 0 36px rgba(51, 51, 51, 0.2);
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0 0 #333, 0 0 0 0 rgba(51, 51, 51, 0);
  }
}




@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

/* Use a media query to add a break point at 800px: */
@media screen and (max-width:800px) {
  .left, .main, .right {
    width:100%; /* The width is 100%, when the viewport is 500px or smaller */
  }
}