
body {
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.6em;
	margin: 0; 
	padding: 0;
	text-align: center; 
	color: #000;
	background-color: #F8F9FA;
}

p {
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	font-size: 17px;
}

img {max-width: 100%; }

ol {
	margin-left:50px;
	list-style-type:decimal;
	}

ol li {
	line-height:1.5em;
	}




h1 {font-size:36px; padding: .6em 0; line-height: 1.6em;}
h2 {font-size:26px; padding: 0 0 .2em 0; line-height: 1.6em}
h3 {font-size:14px; padding: .8em 0 .3em 0; line-height:1.3em; font-weight:600;}
h4 {font-size:90%; padding: .8em 0 .3em 0; line-height:1.3em; font-weight:600;}

 h1, h2 {
	margin: 0; 
	padding: 0;
}

h3 {margin-bottom:3px;}

#taglines_book h3 {font-size:2.5vw;margin-bottom: -66px;}



.cf:before,
.cf:after {
    content: " "; 
    display: table; 
}

.cf:after {
    clear: both;
}


/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
    *zoom: 1;
}

#mainContent, #header,  #footer {
	max-width:100%;
	margin: auto;
	/* padding: 0 2% 2em; */
	text-align:center;
	padding-left: 10px;
	padding-right: 10px;
}



#menu {
    max-width: 600px;
    float:right;
    margin-top: 0px;
}


/* ------- HEADER ------- */

#address {
    position:absolute;
    bottom:10px;right:36px;
    color:black;font-family: 'Open Sans', sans-serif;
    font-weight:600;
    text-align: right;
	}
	
#address img {
	width: 17px;
	    float: right;
    margin-left: 8px;
}



#header { 
	height: 150px; 
	padding: 0 2%;
} 
#header img {
	padding-top:2px;
	padding-left:0px;
	display:inline; 
	float:left;
	/* min-width:200px;*/
}

#header h1 {
	padding-top:10px;
	font: 100% Helvetica, sans-serif;
	font-size: 42px;
	font-weight: 700;
  color:BLACK;
}

#header h2 {
	margin-top:5px;
	font: 100% Helvetica, sans-serif;
	font-size: 35px;
	font-weight: 700;
  color:BLACK;
  margin-top:10px;
}


#mylogo {
 max-width: 200px;
     text-align: center;
 
 }
 

#mylogo img {
 max-width:100%;
 }


#home-bookit {
	   position: absolute;
	   bottom: 14%;
	   margin-left:15%;	
}

.myButton {
	background-color:#90E4C1;
	border-radius:26px;
	border:3px solid #C00;
	display:inline-block;
	cursor:pointer;
	color:#000000;
	font-family:Arial;
	font-size:22px;
	font-weight:bold;
	padding:3px 11px;
	text-decoration:none;
	text-shadow:0px 1px 0px #2f6627;
}
.myButton:hover {
	background-color:#f5c249;
}
.myButton:active {
	position:relative;
	top:1px;
}


#bridge {
  font-size:.8em; 
  text-align:center;
}

#bridge_officer {
  text-align:center;
  display: inline-block; 
  margin-bottom:15px;
  width: 170px;
  line-height:normal;
}

#bridge_officer img {
  width:150px;
}

#welcome {width:98%;}
#welcome p {width:70%;}

 

.BUTTON_BSPS {
   background: #B31217;
   background-image: -webkit-linear-gradient(top, #B31217, #F00000);
   background-image: -moz-linear-gradient(top, #B31217, #F00000);
   background-image: -ms-linear-gradient(top, #B31217, #F00000);
   background-image: -o-linear-gradient(top, #B31217, #F00000);
   background-image: -webkit-gradient(to bottom, #B31217, #F00000);
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 5px;
   color: #FFFFFF;
/* font-family: Brush Script MT; */
   font-size: 14px;
   font-weight: 300;
   padding: 10px;
   text-shadow: 1px 1px 20px #000000;
   border: solid #F00000 1px;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
}

.BUTTON_BSPS:hover {
   border: solid #B31217 1px;
   background: #CCCCCC;
   background-image: -webkit-linear-gradient(top, #CCCCCC, #888888);
   background-image: -moz-linear-gradient(top, #CCCCCC, #888888);
   background-image: -ms-linear-gradient(top, #CCCCCC, #888888);
   background-image: -o-linear-gradient(top, #CCCCCC, #888888);
   background-image: -webkit-gradient(to bottom, #CCCCCC, #888888);
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 5px;
   text-decoration: none;
}


.BUTTON_JOIN {
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   color: #FFFFFF;
   /* font-family: Brush Script MT; */
   font-size: 14px;
   font-weight: 300;
   padding-left: 38px;
   padding-right: 38px;
   padding-top:5px;
   padding-bottom:5px;
   background-color: #012169;
   text-shadow: 1px 1px 20px #000000;
   border: solid #F00000 1px;
   text-decoration: none;
   display: inline-block;
   cursor: pointer;
   text-align: center;
}


.BUTTON_JOIN:hover {
   border: solid #012169 1px;
   background: #CCCCCC;
   background-image: -webkit-linear-gradient(top, #CCCCCC, #888888);
   background-image: -moz-linear-gradient(top, #CCCCCC, #888888);
   background-image: -ms-linear-gradient(top, #CCCCCC, #888888);
   background-image: -o-linear-gradient(top, #CCCCCC, #888888);
   background-image: -webkit-gradient(to bottom, #CCCCCC, #888888);
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 5px;
   text-decoration: none;
}



.dot {
  height: 8px;
  width: 8px;
  background-color: black;
  border-radius: 50%;
  display: inline-block;
  margin-left: 10px;
  margin-right: 10px;
  vertical-align: middle;
}

#sliders {
	margin-top:-17px;
}




#headerWrapper { 
	max-height: 110px;
	margin-top: 10px;
	margin-left: 20px;	
	background-image: url("../img/bsps_logo2025.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 30px, 10px;
}

	
#header {position:relative;}



#home1 {
	background-image: url("/img/home1.jpg");
	background-repeat: no-repeat;
	background-size: contain;
	    margin: 0 auto;
    display: inline-block;
    max-width:80%;
    min-width:100%;
		/* max-height:80%;
	  min-height:500px; */
		
}


#taglines_contact {
	font-size: 2vw;
	margin-top: 10px;
	font-weight: 900;
	
}


#taglines_home {
	font-size: 2.4vw;
	margin-top: 10px;
	font-weight: 900;
	
}


#home-quote {
	float:right;
 		background-color: #90E4C1;
 		/* background-image: linear-gradient( #6aafa3, #a3d9cf); */
 		border-radius: .6em; 
 		border: none; 
 		margin: 3em;      	           	        		
 		height: 240px; 
 		width: 299px; 
 		color: black; 
 		/* font-size: 1.1em; */
 		outline: none;
 		padding-left: 1.0em;
 		padding-right: 1.0em;
 		padding-top: 1.0em;
 		padding-bottom: 1.0em;
 		box-shadow: 0 4px 16px 6px hsl(0, 0%, 20%), inset 0px 4px 6px -5px hsl(0, 0%, 2%);
}

#lani-quote {
    font-size: 20px;
    line-height: 1.6em;
    font-weight: 600;
    margin: auto 0;
    font-style: italic;
}


#contactForm {
	
}

label {
  font-size: 0.875rem;
  color: #4d4d4d;
  cursor: pointer;
  display: block;
  font-weight: normal;
  margin-bottom: 0.5rem;
  /* Styles for required inputs */ }
  label.right {
    float: none;
    text-align: right; }
  label.inline {
    margin: 0 0 1rem 0;
    padding: 0.625rem 0; }
  label small {
    text-transform: capitalize;
    color: #666666; }


table.mainfont td {
		  padding: 5px 5px 5px 5px;
}

table.mainfont tr {
		  padding-bottom: 1em;
}

table.mainfont {
   border-collapse:separate;
    border-spacing:0 5px;
}

table.contactForm {margin: 1em 0 0; border: 0;}
table.contactForm th {text-align:right; font-weight: normal; padding-right: 3%;}
table.contactForm input,
table.contactForm textarea {width: 100%; border: 1px solid #ccc; font-size:14px;}
input#contactFormsubmit {
	clear:left;
	padding: 10px 50px;
	border-radius: 3px;
	border: 2px solid #863;
	font-size: 1em;
	background:#6aafa3;
	font-weight:600;
	}

input#contactFormsubmit:hover {background:#90e4c1;}
.smalltxt {font-size: 10px;}

.slidearea {overflow:hidden;}

/* ------- Signup Box -------*/
#mc_embed_signup {
	background:#fff; 
	clear:left; 
	font:14px 
	Helvetica,Arial,
	sans-serif; 
}

#mailchimpsignup {
	border-radius: 5px; 
	background: #488B9B; 
	padding: 15px;  
	width: 80%; 
	margin-bottom:20px;
	margin-top:20px;
}

#mailchimpinputbox {
	position: absolute; 
	left: -5000px;
}

/* ------- End Signup Box -------*/

/* ------- quiz related -------*/
#quizbox {
	margin: 0 auto;
	margin-bottom: 10px;
	width:200px;
	border:2px solid;
	background: #488B9B; 
	border-radius:25px;
	-moz-border-radius:25px; /* Firefox 3.6 and earlier */
}

#quizlink {
	margin-left: 25px;
	text-decoration: none;
	outline: none;
	letter-spacing: normal;
	word-spacing: normal;
}

#quizlink a {color:#FFF; text-decoration:none; font-weight: bolder;}
/* ------- end quiz related -------*/

#quicklinks {
	margin-top:7px;
	line-height:1.8em;
}

#quicklinks a {
	margin-top:7px;
	line-height:1.8em;
	font-size: .9em;
	text-decoration:none; 
	margin-left:25px;
}

#quicklinks a:hover {
    text-decoration: underline;
}

#subMainContentLeft { 
	text-align: left; 
	padding: 0px;
	width: 49%;
	float: left;

} 

#subMainContentRight { 
	text-align: left; 
	padding: 0px;
	width: 49%;
	float: right;

} 

#highlightbox {
	margin: 0 auto;
	text-align: center; 
	margin-bottom: 10px;
	background: #B4CCD3;
}




/* ----- MAIN WRAPPER & MAINCONTENT STYLES ----- */

#mainWrapper { 
	/* border-top: 1px solid #ddd; */
	border-top: 4px solid #C00;
	border-bottom: 1px solid #ddd;
	
	
}

#mainWrapper p {
	margin: .8em 0; 
	line-height: 1.4em;
	}

#DC_Award {
    max-width: 100px;
    float: right;
    margin-right: 20px;
	}

#theDotsOn h2 {display:block;}
#theDotsOff h2 {display:none;}

#mainContent {
	padding-top: 2em;
	padding-bottom: 2em;
	min-height:600px;
	/* background: rgb(244,244,244); */
	/* background-image: url("../img/banner1.jpg"); */
	background-size: contain;
	background-repeat: no-repeat;
}

#mainContent ul.bulleted {
	padding-left: 6%;
}

#mainContent ul.bulleted li {
	list-style:disc;
	padding-bottom: 0.5em;
}



ul.practicelinks {
	margin: 20px 0;
	}
ul.practicelinks li {
	border-top: 1px solid #ccc;
	}
ul.practicelinks li a {
	padding: 10px; 
	text-decoration:none; 
	display:block;
	}
ul.practicelinks li a:hover {
	background:#fcfcfc;
	}

ul.bio-certs {
	margin-left: 2%;
	list-style:none;
}

ul.bio-certs li {
	margin-bottom: 12px;
	list-style:none;
	}

img.profile {width:300px;}



/* ----- FOOTER STYLES ----- */
#footerWrapper {
	 /* background:#488B9B; */
	 background: #a3d9cf;
	 background-image: linear-gradient( #90E4C1, #008080);
	 
	 }
#footer { 
	/* padding: 0 2%; */
	text-align:center;
	font-size: .9em;
  font-weight: 600;
} 

#footer p {
	margin: 0; 
	padding: 5px 0;
	color: #000;
	text-align: center;
	font-weight:bold;
	font-size:.9em;
}

#footermenu {
		border-top: 4px solid #C00;
		background:#444;
		margin: auto;
		font-weight:bolder;
}
#footermenu a {color:#fff; text-decoration:none; padding:15px;}
#footermenu a:hover {color:#89BDE6;}



.nobreak {whitespace:nowrap; display:block;}

.designlink a, .designlink a:visited {coxlor:#999; text-decoration:none;}

.small {font-size: .8em;}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}


.mygrid {
	margin:20px;
	padding: 5px;
	border-style:solid;
	border-color:black;
	border-width: 2px;
	background: white;
	border-radius:5px;
	height:265px;
	width:236px;
	display:inline-table;
	opacity: 0.7;
}

.mygrid p {font-size:15px;}

.mygrid h3 {color:#012169;}


/* ----- SLIM MENU OVERRIDE STYLES ------ */

.menu-collapser {
    position: relative;
	/* background-color: #aaa; */
	background: rgb(244, 244, 244);
	font-weight: 600;
}
ul.slimmenu li.nested ul { 
	width: 122%; 
}
ul.slimmenu li ul li a {
	padding-right:16px;
	width:auto;
	}
ul.slimmenu li.nested ul li { 
	width: 100%; 
	background-color: #ddd;
	}
ul.slimmenu li.nested ul li:last-child,
ul.slimmenu li.nested ul li:last-child a:hover {
	-webkit-border-bottom-right-radius: 7px;
	-webkit-border-bottom-left-radius: 7px;
	-moz-border-radius-bottomright: 7px;
	-moz-border-radius-bottomleft: 7px;
	border-bottom-right-radius: 7px;
	border-bottom-left-radius: 7px;
	}
ul.slimmenu li.nested ul li a {
	padding: 10px 10px 10px 26px;
	}
ul.slimmenu li.nested:hover {
	background:#c0c0c0;
	}
ul.slimmenu li a:hover {
	background:#c0c0c0;
	}


.aside {color:#888; font-style:italic; font-size: .9em;}

@media (max-width: 800px) {
	#taglines_home {margin-right:-117px;font-size:3.0vw;}	
	.menu-collapser {height: 39px;line-height: 42px;width: 152px;}
	#headerWrapper {margin-left: -10px;}
		#theDotsOn h2 {display:none;}
  #theDotsOff h2 {display:block;}
  #DC_Award {max-width: 80px;margin-right: 0px;}
  #welcome p {width:98%;}
  .mygrid {width:185px;}
}


@media (max-width: 724px) {
.left60, .right40 {
	width: 100%!important;
	float: none!important;
	margin: 20px 0!important;
  }
/* #headerWrapper {background-position: 0 -50px;} */
ul.slimmenu > li { border-left:none;}
ul.slimmenu {position: absolute; z-index: 3;background: #ddd;}
ul.slimmenu li a:hover { background: #aaa;}
#mainContent {margin-top: 0;}
/* #footerWrapper {background-position: fixed;} */
#header h1 {font-size:34px;}
#header h2 {font-size:22px;}
#taglines_home {margin-right:-29px;font-size:3.0vw;}
#home-quote {height:169px;width:215px;}
#lani-quote {font-size: 15px;line-height: 1.4em;font-style: italic;}
#home-bookit {bottom: 31%;}

}


@media (max-width: 700px) {
	#taglines_home {margin-right:-117px;}	
	#taglines_book h3 {margin-bottom:0px;}
	#home-bookit {bottom: 37%;margin-left: 5%;} 
}	

@media (max-width: 590px) {
/* #footerWrapper {background-position: 0 -30px;} */
/* #headerWrapper { background-position: 0 -70px;} */
#header h2 {font-size:18px;}
#header img {margin-top: 0px;}
.slidearea {margin-bottom: 20px;}
#footer p.designlink {display:none;}
input#intakeFormISubmit.intakeFormISubmit {margin:30px auto!important;}
#taglines_home {margin-right:-94px;font-size:3.3vw;}
#taglines_contact {font-size:3.3vw;}
#home-bookit {bottom: 47%;margin-left: 5%;}
}

@media (max-width: 542px) {
#address {text-align:right;font-size:10px;line-height:1.2em;font-weight:bold;right:5px;}
#menu {margin-right: -10px;}
#taglines_home {margin-right:-90px;font-size:3.3vw;margin-top: 15px;} 
#taglines_book h3 {font-size:5.2vw;}
#home-quote {margin-right: 2px; margin-top: 3px;height:115px;width:179px;}
#lani-quote {font-size: 12px;}
}

@media (max-width: 430px) {
	#taglines_home {margin-right:-117px;}	
	#header h1 {font-size:24px;Margin-top:10px;}
  #header h2 {font-size:16px;}
}	

@media (max-width: 340px) {
	#taglines_home {margin-right:-117px;}	
	#header h1 {font-size:24px;Margin-top:10px;}
#header h2 {font-size:16px;}
#header {height: 201px; }
}	


@media (max-width: 290px) {
	#taglines_home {margin-right:-117px;}	
	#header h1 {font-size:24px;Margin-top:10px;}
#header h2 {font-size:16px;}
#header {height: 206px; }
}	
