﻿div#pageBanner.image{
	position: relative;
	overflow: hidden;
	background-color:var(--CoB-Dark-Blue);
	padding-top: calc(70%);
}
div#pageBanner img {
	position:absolute;
	width: auto;
	height:100%;
	top:0;
	left:50%;
	transform:translateX(-50%)
}
div#pageBanner #webName{
	color: #fff;
	display: none;
	font-size: 16px;
	line-height: 1.2;
}
div#pageBanner #webName span{
	display:block;
	background: var(--CoB-Dark-Blue-Semitransparent);
	padding: 6px 12px 8px;
	margin-top: 26px;
}
div#pageBanner.image #webName span{
	background: var(--CoB-Blue-Semitransparent)
}
div#pageBanner #webPageTitle {background-color:var(--CoB-Dark-Blue)}
div#pageBanner #webPageTitle h1{
    font-family:"Segoe UI","Segoe",Tahoma,Helvetica,Arial,sans-serif;
    color: #fff;
    font-weight: 400;
    font-size: 36px;
    padding-top: 12px;
    padding-bottom: 20px;
    margin: 0;
}
div#pageBanner.image #webPageTitle{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--CoB-Dark-Blue);
    background: var(--CoB-linear-background);
    z-index: 1;
    padding-top: 2rem;
}
@media(min-width:576px){
	div#pageBanner.image{
		height:0px;
		padding-top: calc(50%);
	}
}
@media(min-width:992px){
	div#pageBanner #webName{
		display: inline-block;
	}
	div#pageBanner.image{
		height:0px;
		padding-top:calc(36%)
	}
	div#pageBanner img {
		position:absolute;
	    width: 100%;
		height:auto;
		top:0;
	}
	div#pageBanner #webPageTitle h1{
		padding-top:5px;
	}
}
@media(min-width: 1400px){
	div#pageBanner.image{
		padding-top:calc(28%)
	}
	div#pageBanner #webPageTitle h1{
		font-size: 42px;}
}
@media(min-width:1680px){
	div#pageBanner #webPageTitle h1{
	font-size: 48px;
	}
}
/***row background colors***/
#bodyWebparts #secondRow{
	background-color:var(--bs-gray-200);
}

#bodyWebparts #bottomRow{
	background-color: var(--bs-gray-400);
}
#bodyWebparts #secondRow a:not(.btn),
#bodyWebparts #bottomRow a:not(.btn){color:#000}

/**** page layout spacing ***/
/**margin added to the body content area**/
#bodyContent {margin-top:30px;}
#bodyContent .ms-rtestate-field > *:last-child {
     margin-bottom: 40px;
}
#bodyWebparts #secondRow .ms-webpart-zone,
#bodyWebparts #bottomRow .ms-webpart-zone,
#bodyWebparts #thirdRow .ms-webpart-zone,
#bodyWebparts #fourthRow .ms-webpart-zone{
	padding-top:30px
}
#bodyWebparts #secondRow div.ms-webpart-cell-vertical-inline-table,
#bodyWebparts #bottomRow div.ms-webpart-cell-vertical-inline-table,
#bodyWebparts #fourthRow div.ms-webpart-cell-vertical-inline-table{
    margin-bottom: 40px;
}


/***ShortPoint margin/padding overrides******/
#ShortPointWrapper .ms-rtestate-field > .shortpoint-container > .shortpoint-row{
	padding-left: 20px;
	padding-right: 20px;
}
@media(max-width:768px){
#ShortPointWrapper .shortpoint-commons-no-padding-mobile{padding: 0px!important;}
}
@media(min-width:992px){
#ShortPointWrapper .ms-rtestate-field > .shortpoint-container > .shortpoint-row{
	padding-left: 60px;
	padding-right: 60px;
}
}
@media(min-width:1680px){
#ShortPointWrapper .ms-rtestate-field > .shortpoint-container > .shortpoint-row{
	padding-left: calc((100% - 1200px)/2);
	padding-right: calc((100% - 1200px)/2);
}

}

/****featured tiles*****/
#featuredLinksSection{margin-bottom:30px}
#featuredLinks .shortpoint-tile-content{
    top: 45%!important;
    font-size: 100%!important;}
#featuredLinks .shortpoint-icon {font-size:42px!important; position:absolute; top:15px; left:50%; transform:translate(-50%,0)}
#featuredLinks .shortpoint-tile-title {
    font-weight: 600;
    padding: 0 5px;
}
@media(min-width:992px){
    #featuredLinks .shortpoint-tile-title {
        font-size: 115%;
    }  
}
@media(min-width:1250px){
    #featuredLinks .shortpoint-tile-title {
        font-size: 130%;
    }  
}
#featuredLinks .shortpoint-tile-description{
    font-size:80%;
    padding: 0 5px;
}
/**shortpoint overrides**/
#pageLayout ol {
    list-style-position: initial;
}
/******************************************core15.css overrides******/
span.form-label {
    display: inline-block;
}
#s4-bodyContainer{
	padding-bottom:0px;
}
input[type=button], input[type=reset], input[type=submit], button {
    min-width: 1em;
}
