/* OH!CON */
/* Modified 09 June 2025 */

/* ============ Override VOICE styling ================= */

body {
	font-family: 'Encode Sans Semi Condensed', sans-serif;
	font-weight:500;
	background-color:#0B5295;
	font-size:100%;
	color:#d7ecfe;
}

body.mainnavpos-none {
	margin-top:0px;
}

h1, h2, h3 {
	font-family: 'Encode Sans Semi Condensed', sans-serif;
	font-weight: 700;
	letter-spacing:.05em;
}
	
h1 {
	font-size:3.25em;
	color:#d7ecfe;
}


h2 {
	font-size:2em;
	color:#d7ecfe;
}

h3 {
	font-size:1.5em;
	color:#d7ecfe;
}

h3.slider-title {
	font-size: 1.5em; 
	color: #25436b;
}

div.slider h2 {
	font-size:1.66em;
}

#mainContent {
    font-size: 1.75em;
	background-color: #0b5295;
	padding: 0px 15px;
}

main {
    margin:auto;
}

#footer {background-color:#25436b;}

a {
	color:#ffd270;
	transition: .2s;
	font-weight: 600;
}

a:hover, a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
	color:#222;
	background-color:#ffd270;
}

.panel-default {
	border: none;
}

.panel {
	-webkit-box-shadow: none;
	box-shadow: none;
}

.panel .content h2{
    font-size:32px;
}

.banner {
     margin-bottom:0;
}

.contactEmail .panel-heading {
	display:none;
}

/*div.contactEmail {
	border: 2px solid #4a3868; 
	border-radius: 8px; 
	padding-bottom: none;
	background-color: #a07cd0;
}

div.contactEmail .form-control {
	border: 2px solid #4a3868;
}

/*====================== NAVBAR STYLING =======================*/

.navbar {
	margin-bottom: 0;
	background-color:#202b47;
	border: 0;
	font-size: 1.5em;
	letter-spacing: .1em;
	border-radius:0; 
	padding-left:15px;
}

.navbar.navbar-default.navbar-static-top {
    background-color: #202b47;
    border-bottom: 1px solid #ccffa3;
    height: 60px;
    text-align: center;
    line-height: 60px; /* helps vertically center single line items, but might not work well with multi-line or larger content */
}

.navbar.navbar-default.navbar-static-top > .container {
    display: flex;
    align-items: center ; /* helps vertically center items within the container */
    justify-content: center ; /* center horizontally */
}

.navbar.navbar-default.navbar-static-top .navbar-nav > li > a {
    line-height: normal ; /* reset the line-height for nav links */
    height: auto ; /* ensure nav links adjust to their content */
}

/* Media query for mobile devices */
.nav.navbar-nav.nav-type-bar { /* Targets the navigation list */
    background-color: #202b47; /* Dark gray background */
}

.navbar-header .navbar-toggle { /* Targets the navbar toggle button */
    background-color: #202b47; /* Dark gray background */
}

.dropdown-menu > li > a {color:#25436b;} /* menu link text colour */

/* ======================= VOICE GRID INCLUDELET ======================== */

div.oh2colbox div.thumbnail {
	background-color: #40adee;
	padding:0px;
	border: 2px solid #4a3868; 
	border-radius: 0px;
}

div.oh2colbox div.thumbnail p{
	padding: 0px 10px 10px;
}

div.oh2colboxguest div.thumbnail {
	background-color: white;
	padding:0px;
	border: 2px solid #4a3868; 
	border-radius: 0px;
}

div.oh2colboxguest div.thumbnail p {
	padding: 0px 10px 10px;
}

div.oh2colboxguest div.thumbnail>*:first-child>*:first-child>*:first-child img {
    margin-top:10px;
}

div.oh2colboxguest .img-responsive,
div.oh2colboxguest .thumbnail > img,
div.oh2colboxguest .thumbnail a > img,
div.oh2colboxguest .carousel-inner > .item > img,
div.oh2colboxguest .carousel-inner > .item > a > img {
    border-radius: 50%;
    border: 5px solid #674794;
}  
  
.accordion-title {
	font-family: 'Encode Sans Condensed', sans-serif;
}

.slider.oh2colopen {border:0px;}
.oh2colopen .thumbnail {border:0px; background-color:inherit; color:#ddf;}
.oh2colopen .thumbnail .panelcol {padding:0px;}
.oh2colopen .thumbnail p {margin-left:0px; margin-right:0px;color:#d7ecfe;}
.thumbnail.ohleft p {text-align:left;color:#d7ecfe;}

/* ======================= FALSE BANNER ======================== */
  
div.customInclude.banner div.panel-heading {
display:none;
}

div.customInclude.banner div.panel-body {
padding:0px; margin:0px;
}

div.customInclude.panel.banner {
margin-bottom:0px;
}

div.customInclude.banner {
border:0px;
}

/* ======================== 2024 GRID BOXES ======================== */	

.thumbnail {
  padding: 0 0 15px 0;
  border: 2px solid #25436b;
  border-radius: 0;
  background-color:#40adee;
}

.thumbnail p {
  margin: 15px 15px 10px 15px;
  color: #25436b;
}

.thumbnail img{
  width:100%;
  height:200px;
  object-fit: cover;
}

.thumbnail img.ohguestpic {height:360px;}

/* ======================== 2024 ACCORDIONS ======================== */

div.ohaccordion div.panel-heading{background-color:#91d8f1;}
div.ohaccordion div.panel-body{background-color:#40adee;}

div.ohaccordion div.panel-heading a:hover span, div.ohaccordion div.panel-heading a:focus span {
	color:#333;
	background-color:#ffd270;
}

/* ============================================================ */
/* =================== OH!CON CUSTOM STYLES =================== */
/* ============================================================ */


/* ========================== Layout ========================== */

.ohnoshow {
	display:none;
	}
	
.ohmarginauto{
	margin:auto;
	}
	
.ohmargin0{
	margin:0px;
	}
	
.ohmargin5{
	margin:5px;
	}
	
.ohmargin10{
	margin:10px;
	}
	
.ohmargin20{
	margin:20px;
	}

.ohtopmargin0{
	margin-top:0px;
	}

.ohtopmargin5{
	margin-top:5px;
	}
	
.ohtopmargin10{
	margin-top:10px;
	}
	
.ohtopmargin20{
	margin-top:20px;
	}
	
.ohbottommargin0{
	margin-bottom:0px;
	}

.ohbottommargin5{
	margin-bottom:5px;
	}
	
.ohbottommargin10{
	margin-bottom:10px;
	}
	
.ohbottommargin20{
	margin-bottom:20px;
	}
	
.ohtoppadding0{
	padding-top:0px;
	}
	
.ohtoppadding5{
	padding-top:5px;
	}
	
.ohtoppadding10{
	padding-top:10px;
	}
	
.ohtoppadding20{
	padding-top:20px;
	}
	
.ohbottompadding0{
	padding-bottom:0px;
	}
	
.ohbottompadding5{
	padding-bottom:5px;
	}
	
.ohbottompadding10{
	padding-bottom:10px;
	}
	
.ohbottompadding20{
	padding-bottom:20px;
	}
	
.ohfullwidth{
	margin-left: -15px;
	margin-right: -15px;
	}
	
.ohpadding0{
	padding:0px;
	}

.ohpadding5{
	padding:5px;
	}
	
.ohpadding10{
	padding:10px;
	}
	
.ohpadding15{
	padding:15px;
	}

.ohpadding20{
	padding:20px;
	}
	
.ohremoveleftmargin{
	margin-left: -15px;
	}
	
.ohremoverightmargin{
	margin-right: -15px;
	}

.ohcalloutlight{
	border: 2px solid #4a3868;
	background-color: #a390bc;
	margin-top:10px;
	padding:15px;
	}

.ohcalloutbold{
	border: 10px solid #4a3868;
	background-color: #a390bc;
	margin-top:10px;
	padding:15px;
	}

.ohhomepagebanner{
	padding:10 0;
	max-height:300px;
	max-width:508px
	}
	
/* ========================== FLEX LAYOUT ========================== */
	
.ohflexrow {
	display:flex;
	flex-flow: row wrap;
	}
	
.ohflexcol{
	display:flex;
	flex-flow: column wrap;
	}
	
.ohflex{
	width:290px;
	}

.ohflexaround{
	justify-content:center;
	align-content:space-around;
	}

/* ========================== IMAGES ========================== */

.ohcircular{
	border-radius:50%;
	}
	
.ohcentered{
	display: block; 
	margin-left: auto; 
	margin-right: auto; 
	}
	
.ohguestpic { 
    background-color: #25436b;
    padding:5px; 
    border-radius:50%;  
    max-width: 360px;
	}

/* ========================== Text ========================== */

.ohcolor{
	color:#ddf;
	}
	
.ohcolorlight{
	color:#ccc;
	}

.ohcolordark{
	color: #25436b;
	}

.ohred{
	color:#C81010;
	}

.ohwhite{
	color:#fff;
	}

.ohyellow{
    color:#ffe066;
    }	
	
.ohorange{
    color:#ff9900;
    }
    
.ohlight{
	font-weight:100;
	}

.ohbold{
	font-weight:600;
	}

.ohbolder{
	font-weight:800;
	}

.ohsmall{
	font-size: .75em;
	}

.ohnormal{
	font-size: 1em;
	}

.ohnormalplus{
	font-size: 1.5em;
	}

.ohlarge{
	font-size: 2em;
	}
	
ohlarger{
	font-size: 2.5em;
	}

.ohlargest{
	font-size: 3.25em;
	}

.ohcenter{
	text-align:center;
	}
	
.ohleft{
	text-align:left;
}

.ohencode{
	font-family:'Encode Sans Semi Condensed', sans-serif;
}

/* ======================= Backgrounds ======================== */

.ohbglight{
	background-color: #2589c8;
	}

.ohbg{
	background-color: #0b5295;
	}

.ohbgdark{
	background-color: #25436b;
	}
	
.ohbgsubtle{
	background-color: #40adee;
	}
	
.ohbginherit{
	background-color: inherit;
	}
	
.ohbgnone{
	background-color: none;
	}
		
.ohhomepagebannerbg{
    background: rgb(0,86,147);
    background: linear-gradient(180deg, rgba(0,86,147,1) 0%, rgba(31,128,191,1) 32%, rgba(64,173,238,1) 100%);
    }
    
.ohbgorange{
	background-color: #ff9900;
	}    

.ohbgwhite{
	background-color:#fff;
}
/* ======================= Borders ======================== */

.ohthinborder{
	border: 2px solid #ff9900;
	}
	
.ohthickborder{
	border: 5px solid #ff9900;
	}
	
.ohthinwhiteborder{
	border: 2px solid #fff;
	}
	
.ohthickwhiteborder{
	border: 5px solid #fff;
	}
	
.ohorangehborders{
    border-top: 1px solid #ff9900;
    border-bottom: 1px solid #ff9900;
    }
    
.ohbluehborders{
    border-top: 1px solid #25436b;
    border-bottom: 1px solid #25436b;
    }   
	
.ohthin{
	border-style: solid;
	border-width: 1px;
	}

.ohthick{
	border-style: solid;
	border-width: 5px;
	}

.ohblueline{
	border-color: #25436b;
	}
	
.ohorangeline{
	border-color: #ff9900;
	}

.ohwhiteline{
	border-color: #fff;
	}

/* ================ Links and buttons =================== */

a.btn {
	padding: 10px 20px;
	background-color: #ffd270;
	color: #222;
	font-size:1em;
	margin-top:10px;
	border: 3px solid #4a3868;
	border-radius: 10px;
	transition: .2s;
	}

a.btn:hover, a.btn:focus {
	border: 3px solid #f90;
	background-color: #333;
	color: #fff;
	}

a.white {
	color:#a07cd0;
	transition: .2s;
	font-weight: 600;
	}

a.white:hover, a.white:focus {
	color:#fff;
	}


/*============== CORNERS ===============*/ 

.ohcorner0 {
    border-radius: 0px;
    }
    
.ohcorner4 {
    border-radius: 4px;
    }

.ohcorner10 {
    border-radius: 10px;
    }
    
.ohcorner15 {
    border-radius: 15px;
    }   

/*============== MEDIA QUERIES ===============*/ 

@media only screen and (min-width : 320px) {
    
    .ohwidth421{
    	width:290px;
    	padding:5px;
    	}
    	
	}


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

    .ohwidth421{
    	width:225px;
    	padding:5px;
    	}
    	
	}


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

	}


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

	}


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

	}


/*

.banner-image {
  padding:0px 0px 15px 10px;
  }
  

div.pic img { 
    background-color: #4a3868;
    padding:5px; 
    margin:10px auto;
    border-radius:50%;  
}

.ohboxheading{
  font-size:1.2em;
}