/* DO NOT MODIFY THIS FILE
TO MODIFY YOUR LAYOUT, CREATE ANOTHER CSS FILE AND OVERWRITE THE CSS IN THAT OR MAKE A COPY OF THIS FILE AND MAKE CHANGES THERE.*/

/* Common styling starts */
body,
.business-template *{
    font-family: "Montserrat", Arial, sans-serif;
}
.business-template  h2,
.business-template  h2 *{
	font-family: "Montserrat" !important;
	font-weight: 400;
}
.business-template  h3,
.business-template  h3 *{
	font-family: "Montserrat" !important;
	font-weight: 500;
}
.business-template  h1, 
.business-template  .header h3,
.business-template .title,
.business-template .subtitle {
	font-family: "Montserrat" !important;
	font-weight: 400 !important;
	font-style: normal;
}
.business-template .center{
	text-align: center;
}
/********************TITLE FONT SIZES AND WEIGHTS********************/
.business-template strong, .business-template b {
	font-weight: 500;
}
.business-template .header .title{
	font-size: 50px;
    text-transform: uppercase;
    text-align: center;
}
.business-template .sub-title {
	font-size: 26px;
}
.business-template .caption {
	font-size: 18px;
	font-weight: 300;
}
.business-template .description{
	line-height: 28px;
	font-size: 18px;
}
.business-template .small{
	font-size: 12px;
}
.business-template .disclaimer{
	font-size: 12px;
	font-weight: 300;
}
/********************TITLE FONT SIZES AND WEIGHTS********************/



/********************BREADCRUMB STYLES********************/
#main-content .navBreadcrumb .container {
    padding: 2% 1%;
}
.business-template .navBreadcrumb .breadcrumb{
	background-color: transparent; 
}
/********************BREADCRUMB STYLES********************/
.business-template a.blue:HOVER{
	color: #28C2FE;
}
.business-template a.blue:visited{
	color: #28C2FE;
}
.business-template .button {
	text-transform: uppercase;
	text-align: center;
	display: inline-block;
	padding: 10px 35px;
	background-color: #28C2FE;
	color: #fff;
	border-radius: 2.75rem;
	cursor: pointer;
	font-weight: 600;
	transition: all .6s linear;
	border: 1px solid #28C2FE;
	font-size: 14px;
	min-width: 200px;
	text-transform: uppercase;
	margin: 10px 0;
	font-family:'Barlow Semi Condensed';
	
}
.business-template .button:HOVER {
	background-color: #fff;
	color: #28C2FE;
	border: 1px solid #28C2FE;
}

/********************BUTTON STYLES********************/

.business-template .blue {
	color: #28C2FE;
	transition: all .2s linear;
}

.business-template .container {
	max-width: 1400px;
	margin: 0 auto;
	padding: 3% 5%;
	position: relative;
    width: 100%;
}


.business-template .hide {
	display: none !important;
}
.business-template .hide-desktop{
	display: none;
}
/* Common styling ends */


/********************HUBSPOT FORM STYLING********************/
.business-template .hubspot-form{
	width: 100%;
}
.business-template .hubspot-form a{
	color: #28C2FE;
}
.business-template .hubspot-form fieldset{
	max-width: 100%;
}
.business-template .hubspot-form label span:FIRST-CHILD{
	color: #444;
    font-size: 14px;
    font-weight: 500;
}
.business-template .hubspot-form input[type="text"]
	, .business-template .hubspot-form input[type="email"]
	, .business-template .hubspot-form input[type="tel"]
	, .business-template .hubspot-form select
	, .business-template .hubspot-form textarea{
	padding: 10px;
	background-color: #F6F6F6;
	height: auto;
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100%;
}
.business-template .hubspot-form input[type="submit"]{
	text-transform: uppercase;
    text-align: center;
    display: inline-block;
    padding: 10px 35px;
    background: #28C2FE;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 400;
    transition: all .6s linear;
    border: 1px solid #28C2FE;
    font-size: 14px;
    min-width: 240px;
    text-transform: uppercase;
    margin: 10px 0;
    text-shadow: none;
    box-shadow: none;
    font-family: "Montserrat", Arial, sans-serif;
	margin: 0 0 0 auto;
    display: block;
    box-sizing: border-box;
    line-height: normal;
    -webkit-appearance: none;
}
.business-template .hubspot-form input[type="submit"]:HOVER{
	box-shadow: none;
	border: 1px solid #28C2FE;
	background-color: #fff;
    color: #28C2FE;
}
.business-template .hubspot-form .actions{
	margin-left: 0;
}
/********************HUBSPOT FORM STYLING********************/


/********************HEADER STYLING********************/
.business-template .header{
	background: #414141;
	color: #FFF;
	
}
.business-template .header .container{
	padding: 0;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.business-template .header .sub-title{
	text-align: center;
    margin-top: 20px;
    margin-bottom: 10px;
    text-transform: none;
}

/********************HEADER STYLING********************/


/********************CLASSIFICATION STYLING********************/
.business-template .classification{
	text-align: center;
}
.business-template .classification .container-wrapper{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.business-template .classification .container-wrapper > div{
	padding: 20px 2%;
	flex: 1;
}
.business-template .classification .container-wrapper > div a{
	display: inline-block;
	color: #28C2FE;
}
.business-template .classification .container-wrapper > div a:HOVER{
	color: #555;
}
.business-template .classification .container-wrapper > div img{
	min-width: 100px;
	/* override the base.css 100% so images don't "squish" */
	max-width: 100px;
}
.business-template .classification .container-wrapper > div .label{
	font-size: 18px;
	display: block;
	margin: 10px 0 0;
	text-align: center;
}
/********************CLASSIFICATION STYLING********************/


/********************MORE-INFO STYLING********************/
.business-template .more-info .sub-title{
	padding: 30px 0 0;
}
.business-template .more-info ul{
	padding: 0 0 0 50px;
	list-style: disc;
}
.business-template .more-info ul li{
	margin: 10px 0;
	font-size: 18px;
}
/********************MORE-INFO STYLING********************/


/********************CLASSIFICATION-DETAILS STYLING********************/
.business-template .classification-details{
	background-color: #414141;
	color: #fff;
}
.business-template .classification-details .block{
	display: flex;
	padding: 5% 0;
	border-bottom: 1px solid #fff;
}
.business-template .classification-details .block:LAST-CHILD{
	border: 0;
}
.business-template .classification-details .block .image{
    min-height: 150px;
    min-width: 150px;
    margin: 0 8% 0 3%;
    width: 100%;
    height: 100%;
    max-width: 150px;
    max-height: 150px;
}
.business-template .classification-details .block .sub-title{
	margin: 0 0 5px;
}
.business-template .classification-details .block .description{
	font-weight: 300;
}
/********************CLASSIFICATION-DETAILS STYLING********************/



/********************COL-GRID STYLING********************/
.business-template .col-grid .col-wrapper{
	display: flex;
	text-align: center;
	flex-wrap: wrap;
    justify-content: space-around;
}
.business-template .col-grid .col-wrapper > div{
	width: 335px;
	margin: 30px 2%;
}
.business-template .col-grid .icon{
	max-width: 120px;
	margin: 0 auto;
}
.business-template .col-grid .description{
	margin: 10px 0;
}
.business-template .col-grid iframe{
	width: 100%;
	height: 185px;
}
/********************COL-GRID STYLING********************/

.business-template .floating-btn {
	display: none;
}


@media ( max-width : 750px) {
	.business-template .title {
		font-size: 32px;
	}
	.business-template .caption {
		font-size: 16px;
	}
	.business-template .header .title{
		font-size: 30px;
		text-align: center;
	}
	.business-template .classification-details .block{
		display: block;
	}
	.business-template .classification-details .block .image{
		margin: 0 auto;
	}
	.business-template .classification-details .block .sub-title,
	.business-template .classification-detail .sub-title{
		text-align: center;
	}
	#main-content .header .container{
		height: 100%;
	}
}

@media ( max-width : 500px) {
	.business-template .caption {
		font-size: 14px;
	}
	.business-template  .button {
		font-size: 12px;
		padding: 10px 30px;
		display: block;
		max-width: 300px;
		margin: 10px auto;
	}
	.business-template .container {
		padding: 5%;
	}
	.business-template .title{
		font-size: 26px;
	}
	.business-template .sub-title {
		font-size: 20px;
	}
	.business-template .hubspot-form input[type="submit"]{
		margin: 0 auto;
	}
	.business-template .classification .container-wrapper > div .label{
		font-size: 16px;
	}
	.business-template .floating-btn {
		display: block;
		background-color: #0A3B7D;
		position: fixed;
		bottom: 0;
		left: 0;
	    right: 0;
	    text-align: center;
	}
	.business-template .floating-btn .button{
		max-width: 350px;
	    font-size: 18px;
	    font-weight: 500;
	}
	.footer-mobile {
		margin: 0 0 90px;
	}
}

/********************SLATE BRANDED STYLING********************/
.business-template .slate {
	background-color: #FFFFFF;
	background-size: cover;
	background-position: right top;
	background-repeat: no-repeat;
	margin: 20px 0;
	min-height: 540px;
	transition: 0.6s linear;
}

.business-template .slate .container {
	display: flex;
	align-items: center;
	height: 500px;
}

.business-template .slate .container-wrapper {
	width: 45vw;
}

.business-template .slate .blank {
	display: none;
}

.business-template .slate a.button {
    margin: 5% 0 0;
}

@media ( max-width : 1400px) {
	.business-template .slate {
		background-position-x: 90%;
	}
	.business-template .slate .container-wrapper {
		width: auto;
	}
	.business-template .slate h3, .business-template .slate p {
		width: 45vw;
	}
	.business-template .slate ul {
		width: 45vw;
	}
}

@media ( min-width : 2000px) {
	.business-template .slate .container-wrapper {
		width: 40vw;
	}
}

@media ( max-width : 1125px) {
	.business-template .slate {
		background-color: #F2F2F2;
		background-image:
			url(/resources/images/csb_2019/csb_home/test-image.png);
		background-size: cover;
		background-position-y: top;
		background-repeat: no-repeat;
		margin: 40px 0;
		background-position-x: 80%;
	}
	.business-template .slate .container-wrapper {
		width: 100%;
	}
	/* .business-template .slate h3, .business-template .slate p {
		width: 47vw;
	} */
}

@media ( max-width : 900px) {
	.business-template .slate {
		background-position-x: 75%;
	}
	.business-template .slate h3, .business-template .slate p {
		width: 40vw;
	}
}

@media ( max-width : 750px) {
	.business-template .slate {
		background-size: 950px;
		background-color: #FFFFFF;
		background-image: none; 
	}
	.business-template .slate .blank {
		display: block;
		max-height: 550px;
		height: 100%;
	}
	.business-template .slate .container {
		background-color: #F2F2F2;
		height: auto;
		padding: 60px 30px;
	}
	.business-template .slate h3, .business-template .slate p {
		width: auto;
	}
}
/********************SLATE BRANDED STYLING********************/

a.mission-link {color:#fff !important; text-decoration: underline;  animation: 3s;}
a.mission-link:hover {text-decoration: none;}

/********************ICON STYLING********************/

.icon-wrapper .icon-state .icon{
	height: 100px;
    width: 100px;
    background-size: contain !important;
    display: block;
    margin: auto;
  		transition: 0.6s linear;
}
/********************ICON STYLING********************/