/* Hero */

.section.hero {
    position: relative; 
	background-color: #009e97;
	height: 90vh !important;
	overflow: hidden;
}  

.slide {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
	height: 90vh;
}

.slide article {
    display: block;
    width: 100%;
    height: 100%;
	height: 90vh;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    position: relative;
}
    
@media (min-width: 800px) { 
	.section.hero,	
	.slide,
	.slide article {
		height: 100vh !important;
	}	
}
/* -------- Quick Links -------- */

.quick-links {
	background: #009e97;
	background: rgba(0,158,151,.8);
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1000;
	padding: 1.2em;
	text-transform: uppercase;
	opacity: 0;
	-moz-transform:    translateY(100%);
	-ms-transform:     translateY(100%);
	-webkit-transform: translateY(100%);
	transform:         translateY(100%); 		
}
.animate .quick-links {
	opacity: 1;
	-moz-transform:    translateY(0%);
	-ms-transform:     translateY(0%);
	-webkit-transform: translateY(0%);
	transform:         translateY(0%); 		
}
.hide-links .quick-links {
	visibility: none;
	opacity: 0;
	-moz-transform:    translateY(100%);
	-ms-transform:     translateY(100%);
	-webkit-transform: translateY(100%);
	transform:         translateY(100%); 
}

.quick-links > div,
.quick-links a {
	display: inline-block;
	vertical-align: middle;
}

.quick-links .links .label {
	font-size: .8em;
	color: #fff;
	display: block;
	padding: 0 0 .5em;
}

.quick-links .links a {
	color: #fdb810;
	font-size: 1em;
	font-weight: 700;
	padding: 0 .5em;
}
.quick-links .links a:hover {
	color: #fed778;	
	-moz-transform:    scale(1.05);
	-ms-transform:     scale(1.05);
	-webkit-transform: scale(1.05);
	transform:         scale(1.05); 		
}
.quick-links .logos {
	display: none;
}
.quick-links .logos a {
	display: inline-block;
}
.quick-links .logos a:hover {
	-moz-transform:    scale(1.05);
	-ms-transform:     scale(1.05);
	-webkit-transform: scale(1.05);
	transform:         scale(1.05); 
}
.quick-links .logos a:first-of-type {
	margin-right: 1em;
}
.quick-links .close {
	display: none;
}

.hero .scroll {
	opacity: 0;
	visibility: hidden;
}
.hero.hide-links .scroll {
	opacity: 1;
	visibility: visible;
}

@media (min-width: 800px) { 
	.quick-links {
		padding: .8em;
	}	
	.quick-links > div,
	.quick-links a,
	.quick-links .label {
		display: inline-block;
		vertical-align: middle;
	}	
	.quick-links .links .label {
		font-size: 1.1em;
		padding: 0;
		display: inline-block;
	}	
	.quick-links .links a {
		font-size: 1.1em;
		padding: 0 .8em;
	}	
	.quick-links .logos {
		display: inline-block;
		padding: 0 0 0 1.5em;
		margin: 0 0 0 1em;
		border-left: 1px solid #fff;
	}	
	.quick-links .close {
		cursor: pointer;
		display: inline-block;
		color: #fff;	
		font-size: 1.5em;
		position: absolute;
		right: 1em;
		top: 50%;	
		-moz-transform:    translateY(-50%);
		-ms-transform:     translateY(-50%);
		-webkit-transform: translateY(-50%);
		transform:         translateY(-50%); 	
	}
	.quick-links .close:hover {
		color: #fdb810;		
		-moz-transform:    translateY(-50%) scale(1.05);
		-ms-transform:     translateY(-50%) scale(1.05);
		-webkit-transform: translateY(-50%) scale(1.05);
		transform:         translateY(-50%) scale(1.05); 	
	}	
} 
@media (min-width: 1000px) { 
	.quick-links .links a {
		font-size: 1.2em;
	}		
}
@media (min-width: 1200px) { 
	.quick-links .links a {
		font-size: 1.4em;
	}		
}
@media (min-width: 1400px) { 
	.quick-links .links a {
		font-size: 1.6em;
	}		
}
/* -------- Slide Controls -------- */

.slide-controls {
	background: #000;
	background: rgba(0,0,0,.4);
	cursor: pointer;
	width: 2em;
	line-height: 2em;
	font-size: 1.3em;
	position: absolute; 
	z-index: 100;
	color: #fff;
	color: rgba(255,255,255,.7);	
    -webkit-border-radius:  50%;
    -moz-border-radius:     50%;
    border-radius:          50%;	
	-webkit-transition: all .2s ease-in-out;
	-moz-transition:    all .2s ease-in-out;
	-o-transition:      all .2s ease-in-out;
	-ms-transition:     all .2s ease-in-out;
	transition:         all .2s ease-in-out;   
	-moz-transform:    translateY(-50%);
	-ms-transform:     translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform:         translateY(-50%); 
}  
.slide-controls:hover {
	background: rgba(0,0,0,.7);
	color: rgba(255,255,255,1);	
	-moz-transform:    translateY(-50%) scale(1.05);
	-ms-transform:     translateY(-50%) scale(1.05);
	-webkit-transform: translateY(-50%) scale(1.05);
	transform:         translateY(-50%) scale(1.05); 	
}
.slide-controls:active {
	-moz-transform:    translateY(-50%) scale(.9);
	-ms-transform:     translateY(-50%) scale(.9);
	-webkit-transform: translateY(-50%) scale(.9);
	transform:         translateY(-50%) scale(.9);		
}
.slide-controls.slick-disabled {
	opacity: .2;
	cursor: auto;
}
.prev-slide,
.next-slide { 
	top: 50%; 
}
.prev-slide { left: .5em; }
.next-slide { right: .5em; }

@media only screen and (min-width: 740px) {
.slide-controls { font-size: 2em; }
.prev-slide { left: .7em; }
.next-slide { right: .7em; }
}

/* Section Scroll */

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale(1.0);
    opacity: 0.5;
  }
  50% {
    -webkit-transform: scale(1.2);
    opacity: .75;
  }
  to { 
    -webkit-transform: scale(1.0);
    opacity: 0.5;
  }
}

@keyframes pulse {
  from {
    transform: translateY(-50%) scale(1.0);
    opacity: 0.5;
  }
  50% {
    transform: translateY(-50%) scale(1.2);
    opacity: .75;
  }
  to { 
    transform: translateY(-50%) scale(1.0);
    opacity: 0.5;
  }
}

.scroll {
	font-size: 1.1em;
    left: 50%;
    bottom: .5em;
}
.scroll.pulse { 
  -webkit-animation-name: pulse; 
  animation-name: pulse; 
  -webkit-animation-duration: 0.5s; 
  animation-duration: 0.5s;   
  -webkit-animation-iteration-count: 5; 
  animation-iteration-count: 5;   
}     

/* Panels */

.section {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: relative;
	text-align: center;
	height: 100vh;
}
    
.section.single {
	padding: 0 1.5em;
}

@media (max-width: 500px)   { 
	#footer.section { 
		height: auto;
		padding: 2em 2em;
	}
} 
@media (min-width: 800px)   { 
	.section {
		height: 100vh;
	}
	.section.single { 
		padding: 0 3.5em; 
	} 
} 
@media (min-width: 1400px)  { .section.single { padding: 0 7em;  } } 
 
/* Intro */

.intro {
    position: absolute;
    bottom: 1.5em;
    left: 0;
    right: 0;
    width: 85%;
    text-align: left;
    -webkit-border-radius:  0 0 1em 1em;
    -moz-border-radius:     0 0 1em 1em;
    border-radius:          0 0 1em 1em;
    }


@media (max-width : 800px) { 
	.hero .intro {
		bottom: 6em;
	}
	.hp-visit-section .intro { 
		bottom: 5em;
	}	
}
.intro a { 
      padding: 1em;
      display: block; }
        
    @media (min-width : 800px) { 
      .intro {
          position: absolute;
          width: 35%;
          text-align: left;
          bottom: 10%;
          }
      .intro a {
          padding: 1.5em;
          }          
          
      .intro.left {
          left: 3.5em;
          right: auto;
          } 
          
      .intro.right {
          right: 3.5em;
          left: auto;
          } 
          
      .intro.top {
          top: 25%;
          bottom: auto;
          }
          
      .intro.left.top {
          -webkit-border-radius:  1em 1em 0 1em;
          -moz-border-radius:     1em 1em 0 1em;
          border-radius:          1em 1em 0 1em;
          } 
          
      .intro.right.top {
          -webkit-border-radius:  1em 1em 1em 0;
          -moz-border-radius:     1em 1em 1em 0;
          border-radius:          1em 1em 1em 0;
          } 
          
      .intro.left.bottom {
          -webkit-border-radius:  1em 0 1em 1em;
          -moz-border-radius:     1em 0 1em 1em;
          border-radius:          1em 0 1em 1em;
          }
          
      .intro.right.bottom {
          -webkit-border-radius:  0 1em 1em 1em;
          -moz-border-radius:     0 1em 1em 1em;
          border-radius:          0 1em 1em 1em;
          } 
    }
    
    @media (min-width : 1400px) {   
      .intro { bottom: 15%; }
      .intro.left  { left: 7em; }    
      .intro.right { right: 7em; }             
    }
     
.intro.blue         { background: rgba(37,76,90,.8); }        
.intro.gold         { background: rgba(253,184,19,.9); }     
.intro.green        { background: rgba(135,152,62,.8); }     
.intro.orange       { background: rgba(220,77,40,.85); }     
.intro.black        { background: rgba(0,0,0,.7); } 
.intro.light-green  { background: #b9bf33; }


    
.intro.blue:hover         { background: rgba(37,76,90,.9); }        
.intro.gold:hover         { background: rgba(253,184,19,1); }     
.intro.green:hover        { background: rgba(135,152,62,.9); }     
.intro.orange:hover       { background: rgba(220,77,40,.95); }     
.intro.black:hover        { background: rgba(0,0,0,.8); }  
.intro.light-green:hover  { background: #c8cf27; }

.intro h1 {
    font-size: 1.25em;
    color: #fff;
    margin: 0 0 .25em 0;
    }
    
    @media (min-width : 330px) { .intro h1 { font-size: 1.5em; } }
    @media (min-width : 800px) { .intro h1 { font-size: 2.25em; } }
    
.intro h2 {
    font-size: 1.25em;
    color: #fff;
    margin: 0 0 .5em 0;
    }
    
    @media (min-width : 800px) { .intro h2 { font-size: 2em; } }
    
.intro h1 a { color: #fff; }
  
.intro p {
    color: #fff;
    margin: 0;
    font-size: .9em; 
    }
    
    @media (min-width : 800px) { .intro p { font-size: 1em; } }
    
.intro.gold p { font-weight: 400; }

.intro button,
.intro .button { 
    margin: 1em 0 0 0;
    display: block;
    padding: .5em 1em .6em; 
    font-size: .8em;
    font-weight: 400;
    line-height: 1;  
    color: white; 
    text-transform: uppercase; 
    -webkit-border-radius:  1em;
    -moz-border-radius:     1em;
    border-radius:          1em;
    }
    
.intro button a { color: white; display: block; width: 100%; height: 100%; }     
    
.intro a:hover button,
.intro a:hover .button{ 
    padding: .5em 1.5em .6em; 
    color: white; 
    cursor: pointer;
    }

.intro.blue button         { background: #dc4d28; }
.intro.blue a:hover button { background: #ff5c32; }

.intro.gold button         { background: #477a7c; }
.intro.gold a:hover button { background: #254c5a; }  

.intro.green button         { background: #dc4d28; }
.intro.green a:hover button { background: #ff5c32; }

.intro.orange button         { background: #477a7c; }
.intro.orange a:hover button { background: #254c5a; } 

.intro.black button         { background: #dc4d28; }
.intro.black a:hover button { background: #ff5c32; }

.intro.light-green button         { background: #dc4d28; }
.intro.light-green a:hover button { background: #ff5c32; }




/* Events */

#july {
    background-color: #87983e;
    }



/* Map */

.hp-visit-section {
    background-color: #497c7e;
    }
 
    @media (min-width : 800px) { .hp-visit-section .intro { width: 40%; } }
 
 
 
 

/* Instagram Wall */

.hp-instagram-section { background-color: #254c5a; }
    
.hp-instagram-section .intro { text-align: center;  }

@media (min-width : 800px) { .hp-instagram-section .intro { width: 60%; } } 

/* Photos
------------------------------------ */

@media (max-width: 740px) { 
	.section.hp-instagram-section {
		height: auto !important;
		padding-top: 1.5em;
	}
}
.instagram-photos {
    margin: 0;
    line-height: 0; 
	position: relative;

    }
@media (min-width : 1000px) { 
	.instagram-photos {
		top: 50%;
		-moz-transform:    translateY(-50%);
		-ms-transform:     translateY(-50%);
		-webkit-transform: translateY(-50%);
		transform:         translateY(-50%);			
	}
}
.instagram-photos article {
  position: relative; 
  height: 0; 
  overflow: hidden; 
  width: 33.33%; 
  padding-bottom: 33.33%; 
  float: left; 
  perspective: 1000;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style:    preserve-3d;
  -o-transform-style:      preserve-3d;
  transform-style:         preserve-3d; }
    
.instagram-photos article a { color: white; }

.instagram-photos article figure { background: #009e97;  }
.instagram-photos article figcaption { display: none; }

.instagram-photos figure img { 
	width: 100%; 
	height: auto; }
.instagram-photos article:hover figure img { opacity: .5; }  

@media (max-width : 740px) and (orientation: landscape) { 
	.instagram-photos #sbi_images .sbi_item {
	  width: 20%; 
	  padding-bottom: 20%; 
	}     
	#sbi_images > .sbi_item:nth-of-type(11),
	#sbi_images > .sbi_item:nth-of-type(12),
	#sbi_images > .sbi_item:last-of-type { 
		display: none; 
	}
}

@media (max-width: 480px) and (orientation: portrait) {
#sbi_images > div:nth-child(5),
#sbi_images > div:nth-child(6),	
#sbi_images > div:nth-child(7),
#sbi_images > div:nth-child(8),
#sbi_images > div:nth-child(9),
#sbi_images > div:nth-child(10),	
#sbi_images > div:nth-child(11),
#sbi_images > div:nth-child(10),
#sbi_images > div:last-of-type { display: none !important; }
}
	

@media (min-width: 740px)   { 
  
.instagram-photos article {
    width: 25%; 
    padding-bottom: 25%; }   
    
.instagram-photos article figure,
.instagram-photos article figcaption { 
  width: 100%; 
  height: 100%;  
  position: absolute; 
  top: 0; 
  left: 0; 
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility:    hidden;
  -o-backface-visibility:      hidden;
  backface-visibility:         hidden; }

.instagram-photos figure {
  -webkit-transform: rotateY( 0deg );
  -moz-transform:    rotateY( 0deg );
  -o-transform:      rotateY( 0deg );
  transform:         rotateY( 0deg );
  z-index: 1; }

.instagram-photos article:hover figure img { opacity: .15; }  

.instagram-photos figcaption { 
  padding: 1em;
  font-size: .7em;
  line-height: 1;
  font-weight: 400;   
  display: flex !important;
  align-items: center;
  opacity: 0;
  z-index: 100;
  -webkit-transform: rotateY( 180deg );
  -moz-transform:    rotateY( 180deg );
  -o-transform:      rotateY( 180deg );
  transform:         rotateY( 180deg ); }
  
.instagram-photos article:hover figure {
  -webkit-backface-visibility: visible;
  -moz-backface-visibility:    visible;
  -o-backface-visibility:      visible;
  backface-visibility:         visible;    
  -webkit-transform: rotateY( 180deg );
  -moz-transform:    rotateY( 180deg );
  -o-transform:      rotateY( 180deg );
  transform:         rotateY( 180deg );  }

.instagram-photos article:hover figcaption { 
  opacity: 1;
  -webkit-transform: rotateY( 0deg );
  -moz-transform:    rotateY( 0deg );
  -o-transform:      rotateY( 0deg );
  transform:         rotateY( 0deg ); }     
.instagram-photos figcaption { font-size: .8em; }

} 

@media (min-width: 960px)  { 
.instagram-photos { 
    width: 90%;
    margin: 0 auto; } 
.instagram-photos article {
    width: 16.666%; 
    padding-bottom: 16.666%; }   
.instagram-photos figcaption { font-size: .8em; }
} 

@media (min-width: 1100px)   {    
.instagram-photos figcaption { font-size: .9em; }
} 

.hp-instagram-section .share {
  background: #dc4d28;
  padding: .5em .7em;
  -webkit-border-radius:  0 1em 1em 1em;
  -moz-border-radius:     0 1em 1em 1em;
  border-radius:          0 1em 1em 1em;  
  display: inline-block;
  position: relative;
  top: -1em;
  z-index: 1000;
  color: #fff; 
  font-size: .9em;
  font-weight: 600;
  line-height: 1; 
  text-transform: uppercase;
  -moz-box-shadow:    0 0 6px rgba(1,1,1,.2), inset 0 0 10px rgba(251,98,58,.75);
  -webkit-box-shadow: 0 0 6px rgba(1,1,1,.2), inset 0 0 10px rgba(251,98,58,.75); 
  box-shadow:         0 0 6px rgba(1,1,1,.2), inset 0 0 10px rgba(251,98,58,.75); }
    
.hp-instagram-section .share:hover { 
  background: #ff5c32; 
  -moz-box-shadow:    0 0 6px rgba(1,1,1,.3), inset 0 0 20px rgba(255,131,99,.75);
  -webkit-box-shadow: 0 0 6px rgba(1,1,1,.3), inset 0 0 20px rgba(255,131,99,.75);
  box-shadow:         0 0 6px rgba(1,1,1,.3), inset 0 0 20px rgba(255,131,99,.75); }  

@media (min-width: 960px)   { 
.hp-instagram-section .share { font-size: 1.3em; }
} 


/* About */  

.hp-about-section {
    background-color: #b9bf33;
    position: relative;
    }
  
.hp-about-section .intro { 
    -moz-box-shadow: inset 0 0 20px rgba(84,96,26,.6); /* inner shadow */
    -webkit-box-shadow: inset 0 0 20px rgba(84,96,26,.6); /* inner shadow */
    box-shadow: inset 0 0 20px rgba(84,96,26,.6); /* inner shadow */
    width: 90%;
      bottom: auto;
    } 
	
@media (max-width : 360px) and (orientation:portrait) { 
	.hp-about-section .intro { top: 17.5%; } 
	} 
    
    @media (min-width : 360px) { 
        .hp-about-section .intro {
          top: 12.5%;
          }
        }
		
	@media (max-width : 500px) and (orientation:landscape) { 
		.hp-about-section .intro { top: auto; bottom: 17.5%; } 
		}  
		
	@media (min-width : 500px) and (orientation:landscape) { 
        .hp-about-section .intro {
          top: 17.5%;
          }
        }
    
    @media (min-width : 740px) { 
        .hp-about-section .intro {
          width: 85%;
          top: 10%;
          }
        }
        
    @media (min-width : 960px) { 
        .hp-about-section .intro {
          top: 17.5%;
          }
        }
        
    @media (min-width : 1200px) and (orientation: landscape) { 
        .hp-about-section .intro {
          width: 20%;
          top: auto;
          bottom: 30%;
          }
        }
        
.hp-about-section .facts {
    line-height: 0; 
    width: 100%;
    left: 1em;  
    position: absolute; 
    top: 65%; 
    }
    
    @media (min-width : 360px) { 
        .hp-about-section .facts {
          top: 45%;  
          }
        }
		
	@media (min-width : 500px) and (orientation:landscape) { 
        .hp-about-section .facts {
          width: 50%;
          top: 60%;
          left: 25%;  
          }
        }
        
    @media (min-width : 740px) { 
        .hp-about-section .facts {
          width: 85%;
          top: 35%;
          left: 3.5em;  
          }
        }
        
    @media (min-width : 1200px) and (orientation: landscape) { 
        .hp-about-section .facts { 
            width: 62.5%;
            bottom: 30%;
            top: auto;
            left: auto;
            right: 7em;
            } 
        }

.hp-about-section .facts .fact {
    position: relative; 
    height: auto; 
    width: 100%; 
    margin-bottom: 1em;
    }
    
.hp-about-section .facts .fact:last-child { margin-bottom: 0; }
    
    @media (min-width: 740px) { .hp-about-section .facts .fact { margin-bottom: 2em; } }
    
    @media (min-width: 800px) { .hp-about-section .facts .fact { margin-bottom: 3em; } }

    @media (min-width: 960px) { 
        .hp-about-section .facts .fact {
            height: 0; 
            overflow: hidden; 
            width: 32%; 
            padding-bottom: 37%;
            margin: 0 2% 1em 0;
            float: left;
            }
        .hp-about-section .facts .fact:last-child { margin-right: 0; }
        } 
  
    @media (min-width : 1200px) and (orientation: landscape) { 
        .hp-about-section .facts .fact {
            margin-bottom: 0;
            padding-bottom: 37%;
            }
        }
        
@media (orientation:portrait) { 
	.hp-about-section .facts .fact:first-child, 
	.hp-about-section .facts .fact:last-child { display: none; }  
	}     
	
	@media (min-width: 360px) and (orientation:portrait) { 
		.hp-about-section .facts .fact:first-child, 
		.hp-about-section .facts .fact:last-child { display: block; } 
		} 

@media (orientation:landscape) { 
	.hp-about-section .facts .fact { display: none; } 
	} 

	@media (min-width: 500px) and (orientation:landscape) { 
		.hp-about-section .facts .fact { display: block; } 
		.hp-about-section .facts .fact:first-child, 
		.hp-about-section .facts .fact:last-child { display: none; }  
		}
		
	@media (min-width: 740px) and (orientation:landscape) { 
		.hp-about-section .facts .fact:first-child, 
		.hp-about-section .facts .fact:last-child { display: block; }  
		}
		
    
.hp-about-section .facts .fact a { 
    color: white;
    }
    
.hp-about-section .facts .fact figure { 
    position: relative;
    width: 30%; 
    float: left;
    }   
    
    @media (min-width : 740px) and (orientation: landscape) { 
        .hp-about-section .facts .fact figure { 
            width: 42.5%;
            }   
        }
        
    @media (min-width : 960px) and (orientation: landscape) { 
        .hp-about-section .facts .fact figure { 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 70%;
            }   
        }
    
.hp-about-section .facts .fact figure a { 
    color: white;
    }
    
.hp-about-section .facts .fact figure img {  
    width: 80%;
	height: auto;	
    }
    
    @media (min-width: 960px)   { 
        .hp-about-section .facts .fact figure img { 
            position: absolute; 
            left: 25%; 
            bottom: 0;
            width: 50%; 
            }
            
        .hp-about-section .facts .fact:hover figure img { 
            left: 23%; 
            width: 54%; 
            }  
    } 
    
    @media (min-width : 1200px) and (orientation: landscape) { 
        .hp-about-section .facts .fact figure img { 
            left: 20%; 
            width: 60%; 
            height: auto;
            }
            
        .hp-about-section .facts .fact:hover figure img { 
            left: 18%; 
            width: 64%; 
            }  
        }



.hp-about-section .facts .fact figcaption {
    width: 70%;
    position: absolute;
    bottom: 0;
    right: 0;
    text-align: left;
    line-height: 1;
    text-transform: uppercase;
    font-size: 1em;
    }
    
    @media (min-width : 740px) and (orientation: landscape) { 
        .hp-about-section .facts .fact figcaption {
            width: 57.5%;
            font-size: 1.8em;
            }  
        }
        

    @media (min-width: 960px)   { 
        .hp-about-section .facts .fact figcaption {
            font-size: 1.5em;
            position: absolute;
            bottom: 0;
            text-align: center;
            width: 100%;
            }
    } 

.hp-about-section .facts .fact figcaption .number {
    font-size: 3em;
    font-weight: 800;
    }
    
    @media (min-width : 960px) and (orientation: landscape) { 
        .hp-about-section .facts .fact figcaption .number {
            display: block;
            font-size: 3em;
            }
        }


/* Footer */
#footer .intro {
    position: relative;
    top: 100%;
    left: 0;
    right: 0;
	bottom: auto;
    width: 90%;
}
@media (min-width : 640px) { 
#footer .intro {
    bottom: auto;
    top: 15%;
    left: 0;
    right: 0;
    width: 90%;
    }
}
@media (min-width : 800px) { 
	#footer .intro  { top: 20%; } 
}

      

/* Join  */

#footer .join {
    width: 100%;
    text-align: center;
    }
    
    @media (min-width : 470px) { 
      #footer .join {
          padding: 1.5em;
          -webkit-border-radius:  1em 1em 0 1em;
          -moz-border-radius:     1em 1em 0 1em;
          border-radius:          1em 1em 0 1em;
          background: rgba(37,76,90,.8);
          } 
    }
    
    @media (min-width : 960px) { 
      #footer .join {
          position: absolute;
          width: 40%;
          left: 3.5em;
          right: auto;
          top: 25%;
          bottom: auto;
          } 
    }
    
    @media (min-width : 1400px) { #footer .join  { left: 7em; } }
        
#footer .join button { background: #477a7c; }  
#footer .join button:hover { background: #5d9ea1; }  

/* Connect  */

.support {
    width: 100%;
    text-align: center;
    display: none;
    padding-top: 2em;
    }
    
    @media (min-width : 380px) { .support  { } }
    
    @media (min-width : 470px) { 
      .support {

          } 
      }   
      
    @media (min-width : 960px) { 
      .support {
          padding: 1.5em;
          -webkit-border-radius:  1em 1em 0 1em;
          -moz-border-radius:     1em 1em 0 1em;
          border-radius:          1em 1em 0 1em;
          background: rgba(37,76,90,.8);
		  display: block;
          position: absolute;
          width: 40%;
          text-align: center;
          right: 3.5em;
          left: auto;
          top: 25%;
          bottom: auto;
          } 
    }
    
    @media (min-width : 1400px) { .support  { right: 7em; } }
        

.support p { 
    font-size: 1.2em;
    margin-bottom: 1.2em;
    }

.support .button { 
    display: inline-block;
    margin: 0; 
    text-align: right; 
    background: #477a7c;
    margin: .5em auto auto;
    border: 0; 
    font-family:'Open Sans',Arial, Helvetica, sans-serif;
    font-weight: 600;
    cursor: pointer;
    -webkit-border-radius:  1em 1em 1em 0;
    -moz-border-radius:     1em 1em 1em 0;
    border-radius:          1em 1em 1em 0;
    }  

.support .button:hover {
    background: #5d9ea1;
    }
	
	
/* Footer  */

@media (max-width : 400px) and (orientation:portrait) { 
	}

@media (max-width : 480px) and (orientation:landscape) { 
	}

@media (max-width : 740px) and (orientation:landscape) { 
	footer { padding: 1em 0; } 
	}

.print-description { display: none; }

/* Survey Nag  */

.survey-nag { 
	background: #fdb812;
	width: 100%;
	position: fixed;
	bottom: 0;
	right: 0;
	z-index: 10000;
	-webkit-border-radius:  1em 1em 0 0;
	-moz-border-radius:     1em 1em 0 0;
	border-radius:          1em 1em 0 0;   
	-moz-transform:    translateY(100%);
	-ms-transform:     translateY(100%);
	-webkit-transform: translateY(100%);
	transform:         translateY(100%); }
	
@media only screen and (min-width: 740px) { 
.survey-nag { 
	width: 12em;
	-webkit-border-radius:  2em 2em 0 2em;
	-moz-border-radius:     2em 2em 0 2em;
	border-radius:          2em 2em 0 2em; }
}

.survey-nag:hover { background: #009e97; }

.survey-nag.reveal { 
	-moz-transform:    translateY(0%);
	-ms-transform:     translateY(0%);
	-webkit-transform: translateY(0%);
	transform:         translateY(0%); }

.survey-nag a { 
	display: block;
	font-size: 1em;
	padding: .5em;      
	color: #254c5a; }
@media only screen and (min-width: 740px) { 
.survey-nag a { 
	font-size: 1.1em;
	padding: 1em;
	line-height: 1.1;
	font-weight: 600; }
}      
.survey-nag:hover a { color: #fff; }

.survey-nag strong {
	background: #009e97;
	color: #fff;
	padding: .4em .6em;
	display: table;
	font-size: .8em;
	margin-top: .3em;
	text-transform: uppercase;
	-webkit-border-radius: 1em;
	-moz-border-radius:    1em;
	border-radius:         1em; }
.survey-nag:hover strong {
	background: #fff;
	color: #009e97;
	-webkit-transform: scale(1.05); 
	-moz-transform:    scale(1.05); 
	-o-transform:      scale(1.05); 
	-ms-transform:     scale(1.05); 
	transform:         scale(1.05); }       

.survey-nag .close {
	position: absolute;
	right: .6em;
	bottom: .6em;
	color: #fff;
	opacity: .5;
	font-size: .7em; 
	display: inline-block;
	cursor: pointer; }
.survey-nag .close:hover {
	opacity: .8; 
	-webkit-transform: scale(1.05); 
	-moz-transform:    scale(1.05); 
	-o-transform:      scale(1.05); 
	-ms-transform:     scale(1.05); 
	transform:         scale(1.05); }