:root {
    --brand-light-blue: #29a9e1;
    --brand-dark-blue: #005db9;
    --brand-gray: #242424;


}

#banner {
    padding: 0em 0 4.75em 0;
}
video {
  display: block;
  width: auto;
  height: auto;
  min-width: 100%;
}
.hasvideo video {
    margin: auto;
    display: block;
    width: auto;
  min-width: 100%;
  height: auto;
}
.hasVideo .inner {
    position: absolute;
    top: -10vh;
    left: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 75vh;

}
#banner.hasVideo {
        width: 100%;
  height: 65vh;
  overflow: hidden;
  top: 0;
  right: 0;
  z-index: -100;
}
#banner.hasVideo .inner {
    width: 100%;
    background: #00000060;
}

.home #banner.hasVideo .inner {
    padding-top: 0h;
}

#wrapper > header p {
    font-size: .9em;
    font-weight: bold;
}

#logo {
    max-height: 150px;
    margin-top: 0;
}
#banner.hasVideo .inner p {
    max-width: 60vw;
    font-size: .9em;
    font-weight: bold;
   
}

.logo img {max-height: 150px;}

#banner h2 {
    letter-spacing: auto;
    font-size: 2em;
    line-height: initial;
    text-align: center !important;
    
}

.spotlight p {
    font-size: 1.5rem;
}

#header h1 img {
    max-height: 70px;
}

.wrapper {
    background-color: #005db9;
}
.wrapper:before {
    box-shadow: inset 0 -1px 0 0 #005db9, 0 1px 0 0 #005db9;
}

.wrapper:before, .wrapper.spotlight:after {
    background-image: url(images/dark-blue.svg);
    box-shadow: none;
}
#four:after {
    background-image: url(images/dark-blue.svg);
    box-shadow: none;
}
.wrapper.spotlight {
    background-color: #29a9e1;
}
.wrapper.spotlight:before {
    box-shadow: inset 0 -1px 0 0 #29a9e1, 0 1px 0 0 #29a9e1;
   
}
.wrapper.spotlight:before, .wrapper.spotlight:after {
    background-image: url(images/light-blue.svg);
}

.wrapper.spotlight.style2 {
				background-color: #005db9;
			}

.wrapper.spotlight.style2:before, .wrapper.spotlight.style2:after {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23005db9' /%3E%3C/svg%3E");
	    box-shadow: none;
}

.wrapper.spotlight.style2:before {
	box-shadow: inset 0 -1px 0 0 #005db9, 0 1px 0 0 #005db9;
	    box-shadow: none;
}

.wrapper.spotlight.style2:after {
	box-shadow: inset 0 -1px 0 0 #005db9, 0 1px 0 0 #005db9;
	    box-shadow: none;
}


.wrapper.spotlight.odd {
    background-color: #29a9e1 !important;
}

.wrapper.spotlight.even {
    background-color: #005db9 !important;
}

.wrapper.spotlight.even:after, .wrapper.spotlight.even:before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpolygon points='0,100 100,0 100,100' style='fill:%23005db9' /%3E%3C/svg%3E") !important;
    box-shadow:inset 0 -1px 0 0 #005db9, 0 1px 0 0 #005db9!important;
}

.wrapper.spotlight.odd:before, .wrapper.spotlight.odd:after {
    background-image: url(images/light-blue.svg) !important;
}

section#map {
    /*background-image: url('../../images/maps/BSB Corridor Website Map 051622_Home All.jpg');
    
    min-height: 863px;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    */
    object-fit: fill;
    width: 100vw;
}
#map img {
    width: 100%;
}
#three {
    margin-bottom: 0;
}
#three:after {display:none;}

#footer .small {
    max-height: 45px;
}

ul.contact li {
    margin-top: 1.5em;
}

.single::after {
    background-image: url(images/dark-blue.svg);
    transform: scaleY(-1);
    box-shadow:none;
}

.single article {
    padding-bottom: 5vh; 
}
#wrapper .has-image .image {
    border-radius: 100%;
    margin: 0 30px 20px 0;
    width: 15em;
    overflow: hidden;
    max-width: 225px;
    max-height: 225px;
    
    
}
#wrapper .has-image img {
    border-radius: 100%;
    width: 100%;
    
}

#wrapper
.has-image .inner {
    padding: 3em 0 1em 0;
    margin: 0 auto;
    /*width: 55em;*/
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-align-items: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -moz-flex-direction: row;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}
#wrapper
.has-image .content {
    max-width: 40em;
}

.is-style-light-blue-section{
    background-color: #29a9e1;
    margin: 6.5em 0;
    position: relative;
}

.is-style-light-blue-section:before, .is-style-light-blue-section:after {
    background-image: url(images/light-blue.svg);
}

.is-style-light-blue-section:before {
    left: 0;
    top: -6.5em;
}

.is-style-light-blue-section:after {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
    bottom: -6.5em;
    left: 0;
}

.is-style-light-blue-section:before, .is-style-light-blue-section:after {
    background-repeat: no-repeat;
    background-size: 100% 101%;
    content: '';
    display: block;
    height: 6.5em;
    position: absolute;
    width: 100%;
}

.is-style-light-blue-section,
.inner .spotlight {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
}
.is-style-light-blue-section > .wp-block-group__inner-container,
.inner .spotlight > .wp-block-group__inner-container {
    padding: 3em 0 1em 0;
    margin: 0 auto;
    width: 55em;
}

@media screen and (max-width: 1280px){
    #wrapper > header.has-image {
        padding: 4em 0 6.25em 0;
    }
}
@media screen and (max-width: 736px){
    #header nav {
        justify-content: flex-start;
        flex-direction: row-reverse;
    }
    #header.alt h1,
    #header h1{
    visibility: visible;
    opacity: 1;
    max-width: 42%;
}
}
@media screen and (max-width: 599px) {
    img#logo {margin-top: 0px;}
    
    #banner h2 {font-size: 1em;}
    
    #banner.hasVideo .inner {top: -25vh;}
    .sgpb-popup-dialog-main-div-theme-wrapper-5{
        top:50px !important;
    }
    .single .image.left{
        display: block;
        margin: 0 0 2em 0;
        width: 100%;
        max-width:100%;
    }
    .single .image.right img{
    width: 100%;
    }
        .single .image.right{
        display: block;
        margin: 0 0 2em 0;
        width: 100%;
        max-width:100%;
    }
    .single .image.left img{
    width: 100%;
    }
    #footer .inner .footer-half{
        width:100%;
    }
}



#footer .gfield_required {
    display:none;
}
#footer .gform_wrapper.gravity-theme .gfield_label {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 8px;
    text-transform:uppercase;
}

.addresses {
    list-style-type: none;
    text-align:center;
    margin:0 auto;
}

h3{
    margin-bottom: 0.5em;
}

figure a {
    border-bottom: none;
}

/* DMS */

@media screen and (max-width: 1375px) {
	#banner.hasVideo {
		width: 100%;
		height: 65vh;
		overflow: hidden;
		max-height: 450px;
	}
	
	.home #banner.hasVideo {
		height: 65vh;
		max-height: 650px;
	}
	.home #banner.hasVideo .inner {
		top: -5vh;
		height: 52vh;
	}
	.home #wrapper {
		margin-top: -22vh;
	}
	
}

@media screen and (max-width: 880px) {
	.is-style-light-blue-section > .wp-block-group__inner-container, .inner .spotlight > .wp-block-group__inner-container {
	  padding: 3em 2.5em 1em 2.5em;
	  margin: 0 auto;
	  width: 100%;
	}
}

@media screen and (max-width: 830px) {
	#banner.hasVideo {
		width: 100%;
		height: 65vh;
		overflow: hidden;
		max-height: 450px;
	}	
	.home video {
		width: auto;
		height: 100%;
	}
}

@media screen and (max-width: 599px) {
	.home video {
		width: auto;
		height: 100%;
	}
	.home #banner.hasVideo {
		height: 65vh;
		max-height: 650px;
	}
	.home #banner.hasVideo .inner {
		top: -5vh;
		height: 52vh;
	}
	.home #wrapper {
		margin-top: -22vh;
	}
	#wrapper > header {
	  background-size: auto, 200%;
	}
	#wrapper .has-image .inner {
		flex-flow: column-reverse
	}
	#wrapper .has-image .content {
	  padding: 0 1.5em;
	}	
	#wrapper .has-image .image {
		max-width: 175px;
		max-height: 175px;
	}
}	

@media screen and (max-width: 736px) {
	.wrapper {
		margin: 0;
	}
	.home .wrapper {
  		margin: 2.5em 0;
	}
	.home .wrapper.spotlight, .wrapper.alt {
		margin: 0;
		padding: 3em 1em;
	}
	#wrapper > header {
	  background-size: auto, 200%;
	}
	#wrapper .has-image .inner {
		flex-flow: column-reverse
	}
	#wrapper .has-image .content {
	  padding: 0 1.5em;
	}	
	#wrapper .has-image .image {
		max-width: 175px;
		max-height: 175px;
	}	
}

@media screen and (max-width: 599px)    
	  and (min-device-width: 375px) 
	  and (max-device-width: 812px) 
	  and (-webkit-min-device-pixel-ratio: 3) {
		#banner.hasVideo .inner {
		  top: -15vh;
		}
		.home #banner.hasVideo .inner {
		  top: 0;
		  height: 52vh;
		}
		#banner.hasVideo {
			height: 45vh;
		}
		.home #banner.hasvideo {
			height: 65vh!important;
		}
		.home #wrapper {
			margin-top: -20vh;
		}
		.home .wrapper {
			margin: 2em 0;
		}
		#wrapper > header {
		  	background-size: auto, 225%;
		}		
		#wrapper .has-image .inner {
			flex-flow: column-reverse
		}
		#wrapper .has-image .content {
		  padding: 0 1.5em;
		}	
		#wrapper .has-image .image {
			max-width: 175px;
			max-height: 175px;
		}
}			  
