/******************** WELCOME SECTION *********************/                                                                                                                                         
                                                                        
/********* 850px *********/
@media (max-width: 850px) { 
#WelcomeSection {
	height: 600px;
}

/* content */
#WelcomeSection #WelcomeContent {
    width: 350px; 
    top: calc(50% - 50px); 
    left: calc(50% - 175px);  
}

/* h1 */
#WelcomeSection #WelcomeContent h1 {
	word-spacing: 3px;
    font-size: 32px;
}  

/* p */
#WelcomeSection #WelcomeContent p {
    font-size: 13px; 
    margin-top: 20px; 
}  
 
/* btns */
#WelcomeSection #WelcomeContent a {
	width: 140px;
}

#WelcomeSection #WelcomeContent a.two {
	margin-left: 15px;
}
}
 
 






/******************** MISSION SECTION *********************/                                 
          
/********* 1250px *********/ 
@media (max-width: 1250px) {    
#MissionSection {           
     height: 500px;  
}

/****************/
/*** stats ***/
/****************/

#MissionSection .col.stats {
	width: 70%;
}

/* row */
#MissionSection .col.stats .statrow {
    width: 500px;     
    top: calc(50% - 185px);   
    left: calc(50% - 250px);    
}

/* opening p */
#MissionSection p {
    font-size: 13px;
} 

/* inner col */
#MissionSection .col.stats .innercol {
	padding: 18px 0px 18px 18px; 
}    

/* header */
#MissionSection .col.stats .innercol h2 { 
	font-size: 20px;  
}   

/* par */ 
#MissionSection .col.stats .innercol h3 {
	margin-top: 10px;  
	word-spacing: 0px;  
	font-size: 8px;   
}

/* divider */
#MissionSection .col.stats .statdivider {
    margin: 30px auto; 
}

/****************/
/*** image col ***/
/****************/

#MissionSection .col.img {
	width: 30%;
}
}

/********* 850px *********/   
@media (max-width: 850px) {         
#MissionSection {
     width: calc(100% - 30px); 
     height: auto; 
     margin: 0px auto 50px;    
}        

#MissionSection .col {
     display: block;
     width: 100% !important;
     float: none;
}
  
#MissionSection .col.img {
	 height: 300px;
	 bottom: 0px;
}

#MissionSection .col.img.desktop {
	display: none;
}

#MissionSection .col.img.mobile {
	display: block; 
}
 
#MissionSection .col.stats {
     height: auto;  
     top: 0px;
     padding: 100px 0px;     
}

/****************/
/*** stats ***/
/****************/

/* row */
#MissionSection .col.stats .statrow {
    width: 350px;
    position: relative;
    top: 0px;
    left: 0px; 
}

/* opening p */
#MissionSection p {
    font-size: 12px; 
}

/* inner col */
#MissionSection .col.stats .innercol { 
	padding: 20px 0px 20px 15px; 
}    

/* header */
#MissionSection .col.stats .innercol h2 { 
	font-size: 15px;  
}   

/* par */ 
#MissionSection .col.stats .innercol h3 { 
	margin-top: 8px;
	font-size: 7px;    
}

#MissionSection .col.stats .innercol h3 span {
	display: none; 
}

/* divider */
#MissionSection .col.stats .statdivider {
    margin: 25px auto; 
}
}




 



/******************** RESOURCE SECTION ********************/       
      
/********* 1300px *********/
@media (max-width: 1300px) {                                                                  
#ResourceSection {                                                                                  
	width: 800px; 
}  

/* col */
#ResourceSection .col { 
    width: calc(33.33% - 4px);
}

#ResourceSection .col.c2,
#ResourceSection .col.c3,
#ResourceSection .col.c4 {
	margin-top: 0px;
}

#ResourceSection .col.d2 {
	margin-top: 50px;
}

#ResourceSection .col.d3 {
	margin-top: 100px;
}

/* overlay */
#ResourceSection .col .overlay { 
   padding-top: 30px;
   padding-left: 30px;
   padding-right: 30px;
}

/* h1 */
#ResourceSection .col .overlay h1 {
   font-size: 18px;  
}

/* h2 */
#ResourceSection .col .overlay h2 { 
   font-size: 13px; 
}

/* btn */
#ResourceSection .col .overlay p {
   bottom: 60px;
   left: 30px;
}                                          
}

/********* 850px *********/
@media (max-width: 850px) {       
#ResourceSection {                                                                                  
	width: 100%;   
}  

/* col */
#ResourceSection .col {
    display: block; 
    width: 300px;  
    height: 250px;   
    margin: 50px 0px 0px !important;
}

#ResourceSection .col.d2,
#ResourceSection .col.d3 {
	margin-top: 0px;
}

#ResourceSection .col.e2 {
	float: right; 
}

/* h1 */
#ResourceSection .col .overlay h1 {
   font-size: 16px;    
}

/* h2 */
#ResourceSection .col .overlay h2 {
   font-size: 12px; 
}

/* btn */
#ResourceSection .col .overlay p {
   width: 60px;
   padding: 10px 0px;
   bottom: 55px;   
   font-size: 10px;
}                                              
}
  
 
  




            
/******************** PRODUCTS MODAL *********************/             
                                   
/********* max-height *********/
@media (max-height: 700px) and (min-width: 851px) {  
/* inner */     
#FSModalInner {
	height: 700px !important;  
}   
}

@media (max-height: 1200px) and (max-width: 950px) { 
/* inner */      
#FSModalInner {
	height: 1200px !important;    
}   
}  
 
/********* 950px *********/   
@media (max-width: 950px) {       
/* col */  
#FSModal .col { 
	display: block;   
	width: 100% !important;
	float: none;	    
}   

#FSModal .col.one {  
    height: 20%;
}

#FSModal .col.two {
    height: 80%;  
}

/* close */
#FSModal .col.one #FSModalOverlay #FSModalClose {
    width: 50px;
    height: 50px;
    top: 20px;
    left: 20px;
    padding-top: 16px;  
    font-size: 16px; 
} 

/* prod cont */
#FSModal .col.two .prodcont {
    width: 100%;
    top: 20px !important; 
    left: 0px;
    padding-left: 20px;  
    padding-right: 20px;   
}     

/* header */
#FSModal .col.two p .header {
    font-size: 25px; 
}

/* overview & subhead */
#FSModal .col.two p span.subheader,
#FSModal .col.two p span.overview { 
    font-size: 13px;  
}
}








/******************** PRODUCT VIDEO SECTION ********************/    

/********* 850px *********/
@media (max-width: 850px) {                              
#VideoSection {                                  
	margin-top: 100px;
	padding-top: 100px; 
}

/* inner */ 
#VideoSection #VideoInner {
	width: calc(100% - 30px) !important;
}

/* header */
#VideoSection h2 {
	top: -60px;
	font-size: 20px;
}

#VideoSection h2 .one {
	padding-right: 10px; 
}

#VideoSection h2 strong {
	word-spacing: 2px;
}
}

/********* 550px *********/
@media (max-width: 550px) {    
#VideoInner, #VideoWrapper, #video {
	height: 350px;       
}
}








/******************** TESTIMONIALS SECTION ********************/
                 
/********* 1250px *********/
@media (max-width: 1250px) {   
/* cont */
#TestContInner {
	width: 350px;
	left: calc(50% - 185px);
}

#TestCont h1 {
	font-size: 17px; 
}

#TestCont h2 {
	font-size: 22px; 
}

#TestCont h3 {
	font-size: 15px;
}
}

/********* 850px *********/
@media (max-width: 850px) {  
#TestimonialsSection {                    
	height: 530px;  
}

/* layout */
#TestimonialsSection .layout {
	height: 330px;
	width: calc(100% - 30px);
	top: 100px;
	left: 15px;
}
 
/* cont */
#TestCont {
	width: 330px !important;
	height: 330px !important;
	right: auto;
	left: 15px;
	top: 100px;
	border-left: 0px solid rgba(0,0,0,0.1);
}

#TestContInner {
	width: calc(100% - 30px);   
	left: 30px;  
}

#TestCont img {
	top: -35px;
	left: -15px;
}

#TestCont h1 {
	font-size: 13px; 
}

#TestCont h2 {
	margin-top: 25px; 
}

#TestCont h3 {
	font-size: 13px;
}

#TestCont #Bar {
	margin: 30px 0px 0px;
}

/* controls */
#TestimonialsSection #Controls {
	width: 330px;
	height: 330px;
    top: calc(50% - 290px);
    left: auto;
    right: 30px;
	transform: rotate(-90deg);
}

#TestimonialsSection .control { 
	top: auto;
	bottom: -3px;
	left: -120px;
}

#TestimonialsSection #Controls h1 {
	top: auto;
	bottom: 15px;
	left: -70px;
}
}








/******************** PRODUCTS CAROUSEL SECTION ********************/   
          
/********* 1300px *********/
@media (max-width: 1300px) {                                
/* text */
#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod .text {
	font-size: 13px;  
}

#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod h2 {
	left: 20px;
}

#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod h3 {
	right: 20px;
}
} 

/********* 1150px *********/
@media (max-width: 1150px) {                                  
/* header col */
#ProductsCarouselSection #Header {  
	width: 40%; 
}
 
/* header inner */
#ProductsCarouselSection #Header #HeaderInner { 
	width: 300px; 
	left: calc(50% - 150px);
}

/* controls */
#ProductsCarouselSection #Header .controls .control {
	margin: 0px 5px;   	 
}

#ProductsCarouselSection #Header .controls .control.mobile {
	display: inline-block; 
}
 
/* btn */
#ProductsCarouselSection #Header h2 {
	left: 178px;
}
 
/* carousel */
#ProductsCarouselSection #ProductsCarousel {  
	width: 60%;   
} 
}

/********* 850px *********/
@media (max-width: 850px) {                                 
#ProductsCarouselSection {                         
	height: 550px;     
}

/* col */
#ProductsCarouselSection .col {
	display: block;
	float: none;
}

/* header col */
#ProductsCarouselSection #Header {  
	width: 100%;
	height: 150px; 
}
 
/* header inner */
#ProductsCarouselSection #Header #HeaderInner {   
	top: -15px; 
	left: 15px;     
}

/* controls */
#ProductsCarouselSection #Header .controls { 
	margin-top: 20px;     
}

/* btns */
#ProductsCarouselSection #Header h2 { 
	width: 100px; 
	height: 40px;   	 
	padding-top: 13px;    
	bottom: -6px; 
	font-size: 10px;      
}

/* carousel */
#ProductsCarouselSection #ProductsCarousel {  
	width: 100%;
	height: 300px; 
}

/* img */
#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod .imgouter {
	height: 250px; 
}

/* text */
#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod .text {
	font-size: 12px;   
	word-spacing: 2px;
}

#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod h2 {
	left: 15px;
}

#ProductsCarouselSection #ProductsCarousel #ProductsCarouselInner .prod h3 {
	right: 15px;
}
}








/******************** FOOTER SECTION ********************/   
        
/********* 1000px *********/   
@media (max-width: 1000px) {     
#FooterSection {                         
	height: 600px;
}  
}
 
/********* 850px *********/ 
@media (max-width: 850px) {
#FooterSection {     
	height: 800px;     
}

/* col */
#FooterSection .col {
	display: block;
	width: 100%; 
	height: 400px !important;
	float: none;
} 

/* info inner */
#FooterSection #InfoInner {
	top: calc(50% - 65px);  
}
}







