/* -----------------------------------------------------------------------
    Responsive
-------------------------------------------------------------------------- */

@media only screen and (min-width: 2000px) {

	#slides li, #hero-header { height: 620px; }

}
@media only screen and (min-width: 1800px) and (max-width: 1999px) {

	#slides li, #hero-header { height: 560px; }
	
}
@media only screen and (min-width: 1600px) and (max-width: 1799px) {
	
	#slides li, #hero-header { height: 500px; }
	
}
	
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
	
	#slides li, #hero-header { height: 440px; }
	
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
	
	#slides li, #hero-header { height: 380px; }

}

@media only screen and (min-width: 980px) and (max-width: 1199px) {	
	
	#slides li, #hero-header { height: 320px; }
		
}
	
/* Tablet Portrait size to Tablet Landscape (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 979px) {
	
	h1 { font-size: 32px; line-height: 36px; }
	h2 { font-size: 26px; line-height: 30px; }
	h3 { font-size: 22px; line-height: 26px; }
	h4 { font-size: 18px; line-height: 22px; }
	h5 { font-size: 16px; line-height: 20px; }
	h6 { font-size: 14px; line-height: 18px; }
	
	.container { width: 720px; }
	
	#slides li, #hero-header { height: 285px; }
	#slider .bx-controls-direction a { font-size: 34px; line-height: 40px; text-align: center; width: 37px; height: 40px; }
	#slider .bx-prev { left: 15px; padding-right: 3px; }
	#slider .bx-next { right: 15px; }

	#map-wrapper { display: none; }	
	
	.project-section h2 { line-height: 36px; }
	.project-teaser { height: 158px; }
	
	.comment p { font-size: 22px; line-height: 26px; margin-bottom: 20px; }
	
	#icon-key h4 { padding: 8px 0 8px 45px; }
	
	#wdc-logo-footer { width: 100px; }
	#love-it-here-logo { width: 130px; }
	#footer-meta.col-four-fifth { width: 77.2%; }
	#footer-social.col-one-fifth { width: 18%; }

}

@media only screen and (max-width: 767px) {

    .col-full,
    .col-half,
    .col-one-third,
    .col-two-third,
    .col-one-fourth,
    .col-three-fourth,
    .col-one-fifth,
    .col-two-fifth,
    .col-three-fifth,
    .col-four-fifth,
    .col-one-sixth,
    .col-five-sixth { width: 100%; }

    .col-full,
    .col-half,
    .col-one-third,
    .col-two-third,
    .col-three-fourth,
    .col-one-fourth,
    .col-one-fifth,
    .col-two-fifth,
    .col-three-fifth,
    .col-four-fifth,
    .col-one-sixth,
    .col-five-sixth { margin-right: 0; float: none; }
    
    .col-full,
    .col-half,
    .col-one-third,
    .col-two-third,
    .col-three-fourth,
    .col-one-fourth,
    .col-one-fifth,
    .col-two-fifth,
    .col-three-fifth,
    .col-four-fifth,
    .col-one-sixth,
    .col-five-sixth { margin-bottom: 40px !important; }
    
	.modal-dialog { width: 80%; }
	body.modal-open { overflow: hidden; position: fixed; }
	body.viewport-lg { position: absolute; }
	body { overflow-x: hidden; overflow-y: scroll !important; }
	
	.more a { display: inline; }
	
	#logo a { padding: 18px 0; }
	#logo { width: 78%; }
	.slicknav_nav li { font-size: 16px; } 
	
	#slider .bx-controls-direction { top: 40%; }
	#slider .bx-controls-direction a { border-width: 2px; }
	#slider .bx-prev { padding-right: 3px; }
	#slider .bx-next { padding-left: 3px; }
	
	#map-wrapper { display: none; }
	
	#icon-key  { padding: 40px 0; }
	#icon-key .col-half { margin-bottom: 0 !important; }
	#icon-key h4 { padding: 8px 0 8px 45px; }
	
	#sub-footer { padding: 40px 0; }
	#supporting-info li { float: left; width: 48%; margin-right: 4%; margin-bottom: 6% !important; }
	#supporting-info li.tablet-last { margin-right: 0; }
	#supporting-info img { width: 85%; }
	
	#footer-meta { overflow: hidden; margin-bottom: 25px !important; }
	#footer-contact { clear: both; margin-top: 25px; }
	#social-icons li { float: left; margin: 0 15px 25px 0; }
	#footer-social a { clear: both; }
	#footer-social a br { display: none; }
	#footer-social a#disclaimer { float: left; text-align: left; }
    
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	body { font-size: 15px; line-height: 21px; }
	h1 { font-size: 32px; line-height: 36px; }
	h2 { font-size: 28px; line-height: 32px; }
	h3 { font-size: 24px; line-height: 28px; }
	h4 { font-size: 20px; line-height: 24px; }
	h5 { font-size: 18px; line-height: 22px; }
    
    .kicker { font-size: 19px; line-height: 24px; }
	
    .container { width: 440px; }
    
	.slicknav_icon { padding:  35px 0 35px 10px; }
	
	#page-title { padding: 25px 0; }
	
	#slides li { height: 220px; }
	#slider .bx-controls-direction a { font-size: 25px; line-height: 36px; text-align: center; width: 32px; height: 35px; }
	#slider .bx-prev { left: 10px; }
	#slider .bx-next { right: 10px; }
	
	.project-section h2 { line-height: 38px; }
	
	.project-list li.col-one-fourth { float: left; width: 48%; margin-right: 4%; margin-bottom: 4% !important; }
	.project-list li.tablet-last { margin-right: 0; }
	.project-teaser { height: 211px; }
    
    #comments { padding-top: 50px; }
    .comment p { font-size: 18px; line-height: 22px; margin-bottom: 20px; }
    .comment cite { font-size: 16px; line-height: 20px; }
    
    #love-it-here-logo { width: 140px; }
    
    #back-to-top { right: 15px; bottom: 15px; }
	
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
    
	body { font-size: 14px; line-height: 20px; }
	h1 { font-size: 28px; line-height: 32px; }
	h2 { font-size: 24px; line-height: 28px; }
	h3 { font-size: 20px; line-height: 24px; }
	h4 { font-size: 18px; line-height: 22px; }
	h5 { font-size: 16px; line-height: 20px; }

    .kicker { font-size: 17px; line-height: 22px; }
	
	.modal-content .close { right: -30px; }
	.modal-body { padding: 5px 20px 20px 20px; }
	
    .container { width: 280px; }

	.slicknav_icon { padding:  30px 0 30px 10px; }
	
	#page-title { padding: 20px 0; }
	
	#slides li { height: 170px; }
	#slider .bx-controls-direction a { font-size: 20px; line-height: 32px; text-align: center; width: 27px; height: 30px; }
	#slider .bx-prev { left: 6px; }
	#slider .bx-next { right: 6px; }
	
	.project-section h2 { line-height: 34px; }
	
	.project-list { width: 180px; margin: 0 auto; }
	.project-list li.col-one-fourth { float: left; width: 180px; margin-bottom: 20px !important; }
	.project-teaser { height: 180px; }
	
	.project-feature-image span { font-size: 12px; line-height: 16px; }
	
	.counter { margin-right: 10px; }
    
    #comments { padding-top: 40px; }
    .comment p { font-size: 16px; line-height: 22px; margin-bottom: 20px; }
    .comment cite { font-size: 14px; line-height: 20px; }
    
    #wdc-logo-footer { width: 100px; margin-top: 0 !important; }
    #love-it-here-logo { margin-top: 6px; width: 120px; margin-right: 0 !important; }
    
    #back-to-top { right: 10px; bottom: 10px; }

}

.visible-phone { display: none !important; }
.visible-tablet { display: none !important; }
.hidden-desktop { display: none !important; }
.visible-desktop { display: inherit !important; }

@media (min-width: 768px) and (max-width: 979px) {
  .hidden-desktop { display: inherit !important; }
  .visible-desktop { display: none !important ; }
  .visible-tablet { display: inherit !important; }
  .hidden-tablet { display: none !important; }
}

@media (max-width: 767px) {
  .hidden-desktop { display: inherit !important; }
  .visible-desktop { display: none !important; }
  .visible-phone { display: inherit !important; }
  .hidden-phone { display: none !important; }
}