@charset "utf-8";
/* CSS Document */
/* Clearfix */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

html {
    height:100%;
    width:100%;
    }
body {
    height:100%;
    width:100%;
	
	display:table;
	border-collapse: collapse;
    border-spacing: 0;
    table-layout:fixed;
    margin:0 auto;
   
    }
.tr {
	margin-bottom:0;
    display:table-row;
    background:#8F8A88;
    }

	

/* mainmenu navigation menu styling */


nav.mainmenu {
	position: relative;
	height: 40px;
	width: 100%;
	background:#8F8A88;
	font-size: 11pt;
	font-family: 'PT Sans', Arial, sans-serif;
	font-weight: bold;
	position: relative;
}
nav.mainmenu ul {
	padding: 0;
	margin: 0 auto;
	width: 600px;
	height: 40px;
}
nav.mainmenu li {
	display: inline;
	float: left;
}
nav.mainmenu a {
	color: #fff;
	display: inline-block;
	width: 100px;
	text-align: center;
	text-decoration: none;
	line-height: 40px;
}
nav.mainmenu li a {

	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}
nav.mainmenu li:last-child a {
	border-right: 0;
}
nav.mainmenu a:hover {
	color: #FFFF63; text-decoration: none
}

nav.mainmenu a:active {
	color: #CCFFCC; text-decoration: none
}

nav.mainmenu a.activetab {
	background:#E8E1DD;
	color:#A63A00;
	padding-left:5px;padding-right:5px;
	-moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0; /* future proofing */
    -khtml-border-radius: 10px 10px 0 0; /* for old Konqueror browsers */
}

nav.mainmenu a.contacttab {
	background:#329000;
	color:#99EE6B;
	padding-left:5px;padding-right:5px;
	-moz-border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0; /* future proofing */
    -khtml-border-radius: 10px 10px 0 0; /* for old Konqueror browsers */
}

nav.mainmenu a.contacttab:hover {
	color:#55A62A;
}




nav.mainmenu a#pull {
	display: none;
}

/*Styles for screen 600px and lower*/
@media screen and (max-width: 600px) {
	nav.mainmenu { 
  		height: auto;
  	}
  	nav.mainmenu ul {
  		width: 100%;
  		display: block;
  		height: auto;
  	}
  	nav.mainmenu li {
  		width: 50%;
  		float: left;
  		position: relative;
  	}
  	nav.mainmenu li a {

	}
  	nav.mainmenu a {
	  	text-align: left;
	  	width: 100%;
	  	text-indent: 25px;
  	}
	nav.mainmenu a.tabbed {
		background:#FFA473;
		border: 1px solid white;
	}
	nav.mainmenu a.activetab {
	-moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0; /* future proofing */
    -khtml-border-radius: 0; /* for old Konqueror browsers */
   }

   nav.mainmenu a.contacttab {
	   -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0; /* future proofing */
    -khtml-border-radius: 0; /* for old Konqueror browsers */
	border-right:1px solid white;
   }
   
   .nav.mainmenu .nav-button-home a{ background:url("http://www.cheesetoast.co.uk/cheesepress/wp-content/uploads/2012/08/home.gif") no-repeat 0px -2px transparent; }
}

/*Styles for screen 515px and lower*/
@media only screen and (max-width : 480px) {
	nav.mainmenu {
		border-bottom: 0;
	}
	nav.mainmenu ul {
		display: none;
		height: auto;
	}
	nav.mainmenu a#pull {
		display: block;
		background-color: #FF8240; /* #283744*/
		width: 100%;
		position: relative;
	}
	nav.mainmenu a#pull:after {
		content:"";
		background: url('../icons/nav-icon.png') no-repeat;
		width: 30px;
		height: 30px;
		display: inline-block;
		position: absolute;
		right: 15px;
		top: 10px;
	}
	
}

/*Smartphone*/
@media only screen and (max-width : 320px) {
	nav.mainmenu li {
		display: block;
		float: none;
		width: 100%;
	}
	nav.mainmenu li a {
		border-bottom: 1px solid #FFA473; /* #576979 */
	}
}

div.imgbox {
	 
	 border-top-style:dotted;
	 border-top-width:3px;
	 border-top-color:black;
	 padding-top:5px;
	 padding-bottom:5px;
	 width: 75%;
  
	
}
div.imgbox
   {
   margin:2px;
   margin-top:0;
   margin-bottom:15px;
   padding-top: 3px;
   border:1px solid #FF8240;
   height:auto;
   width:120px;
   text-align:center;
   }
 div.imgbox img
   {
   display:inline;
   margin:5px;
   border:1px solid #ffffff;
   }
 div.imgbox a:hover img
   {
   border:1px solid #FF9933;
   }
	

/* Vertical sub menu left justified */
/* vertical menu with the items justified to the left */
nav.verticalleftjustified {
	/* width: 200px; */
	width:75%;
	border-top-style:solid;
	 border-top-width:1px;
	 border-top-color:black;
}

nav.verticalleftjustified a {
	/* width:180px;  container width -left margin,-right margin -right padding -left padding */
	display:block;
	width: 95%;
	
	/* margin:0px 5px 0px 5px;  */
	/*  padding:10px 10px 10px 10px;  */
	padding: 10px 0 10px 10px;
	
	text-decoration:none;
	font-family: 'Montserrat', sans-serif; /* Montserrat  Ubuntu*/
	font-size:12px;
    text-transform:uppercase;
    color:#0D56A6;
	
	/* background:#E8E1DD; */
	border-bottom-style:dotted;
	border-bottom-width:2px;
	border-bottom-color:black;
}

nav.verticalleftjustified a:hover {
	background:#E6DEDA;
	color:#689AD3;
}

nav.verticalleftjustified a.verticalactive {
	background:#99EE6B;
}

nav.verticalleftjustified a.activeitem {
	color:#689AD3;
	background:#04356C;
}

/* Header formatting */
table {
  border-spacing: 0.5rem;
}


.headercontents {
}

.headercontents > ul {
	list-style-type: none; 
    width: 100%;
	display: table; 
    
    margin-top: 1em;  
}

.headercontents > ul > li {
    display: table-cell;
    text-align: center;
	vertical-align:middle;
}

.headercontents > ul > li:nth-child(1) {
	 display: table-cell;  
     width: 200px; 
}

.headercontents > ul > li:nth-child(2) {
	
	display: table-cell;
}

.headercontents > ul > li:nth-child(3) {
	 display: table-cell;  
     width: 100px; 
}

.contact_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #FFA473;
	-webkit-box-shadow:inset 0px 1px 0px 0px #FFA473;
	box-shadow:inset 0px 1px 0px 0px #FFA473;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #FFA473), color-stop(1, #FF5900) );
	background:-moz-linear-gradient( center top, #FFA473 5%, #FF5900 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFA473', endColorstr='#FF5900');
	background-color:#FF5900; /* #b8e356; */
	-webkit-border-top-left-radius:6px;
	-moz-border-radius-topleft:6px;
	border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
	-moz-border-radius-topright:6px;
	border-top-right-radius:6px;
	-webkit-border-bottom-right-radius:6px;
	-moz-border-radius-bottomright:6px;
	border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	-moz-border-radius-bottomleft:6px;
	border-bottom-left-radius:6px;
	text-indent:0;
	border:1px solid #FFA473;
	display:inline-block;
	color:#ffffff;
	font-family:Ubuntu;
	font-size:15px;
	font-weight:bold;
	font-style:normal;
	height:50px;
	line-height:50px;
	width:119px;
	text-decoration:none;
	text-align:center;
	text-shadow:1px 1px 0px #86ae47;
}
.contact_button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #FFA473), color-stop(1, #FFA473) );
	background:-moz-linear-gradient( center top, #4ede00 5%, #FFA473 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4ede00', endColorstr='#FFA473');
	background-color:#FFA473;
}.contact_button:active {
	position:relative;
	top:1px;
}

.phonenumber {
	font-family: 'Montserrat', sans-serif;
	color:#FFA473;
	
}

.headertitle {
	font-family: 'Montserrat', sans-serif;
	color:#4DDE00;
	font-size:2.0em;
	color:#FF5900; text-align:left;	
}
.headersubtitle {
	font-family: 'Montserrat', sans-serif;
	font-size:.7em;
	color:#FFA473;
}

footer .tlogo .LogoMainTitle {
	 vertical-align:bottom;
	 font-size:28px;
	 color:#A63A00;
	 padding-left:10px;
 }
 footer .tlogo .LogoSubTitle {
	 vertical-align:top;
	 font-size:16px;
	 color:#BF6230;
 }
 

 
 /* Main content styling */
 section.tr {	
/*	border-collapse: collapse;
    border-spacing: 0;
    margin-top:0;
	padding-top:0;*/
    height:100%; 
	/*background:#E8E1DD;*/
    }

section {
	/*background:#E8E1DD; */
   position:relative;
}

article {
	padding:0 2% 2% 2%; /*2%*/
	font-size: 16px;
	/* background:#E8E1DD;  */
}

article  h1 {
	font-family: 'Ubuntu', sans-serif;
	font-size:20px;
	color:#320000;
}

article  h2{
	font-family:'Ubuntu', sans-serif;
	font-size:18px;
	color:#320000;
}

article h3{
	font-family:'Ubuntu', sans-serif;
	font-size:16px;
	color:#320000;
}
	
article  p{
	font-family: 'Montserrat', sans-serif;
	color:#666666;
}

article ol {
	font-family: 'Montserrat', sans-serif;
	color:#666666;
}

article ul {
	font-family: 'Montserrat', sans-serif;
	color:#6666660;
}

article ul li {
	padding-bottom:12px;
}

article table {
	ont-family: 'Montserrat', sans-serif;
	color:#666666;
}
	


/* If there is a bug it will be below here */

/*  Panel content layouts */

#youPanel {
	/* position:relative;*/
	border-top-style:dotted;
	 border-top-width:3px;
	 border-top-color:black;
}

#youPanel h1 {
	padding-top:5px;
	position: absolute;
	  top:-50px;  
}

.dotted_top {
	border-top:2px solid #666666; padding-top:10px;
}



/* Responsive columns from http://www.responsivegridsystem.com/ */

/*  Column SECTIONS  */
.sectionC {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	 margin: 1% 0 1% 1.6%; 
}
.col:first-child { margin-left: 0; }


/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}

/*  GRID OF THREE  */
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	 width: 66.1%; 
}
.span_1_of_3 {
	width: 32.2%;
}

/* GRID of seven */
.span_1_of_7 {
  	width: 12.91%;
}

.span_small_of_7 {
	padding-top:5%;
	width: 6.67%;
	margin:0;
}

.span_lrg_of_7 {
	width: 17%;
	
}

.span_1_of_2 {
	width: 49.2%;
}

.fixedrndbuttons-container{
	margin-bottom:10px;
	margin-right:10px;
  position: fixed;
  bottom: 0;
  width: 100%;
  text-align: center;
  z-index:4;
  background:#7f7f7f;
  background:rgba(255, 89, 0, 0.5);
}


.fixedrndbuttons {
    max-width:600px;
	z-index:5;
	margin:0 auto;
}
	

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%; 
	}
}


/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 480px) {
	.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%; 
	}
	.span_1_of_3 {
		width: 100%;
	}
	.span_1_fixed {
	   width:100%;
    }
	#youPanel {
		margin-top:0; /* 30px */
	}
	nav.verticalleftjustified {
		width:100%;
		padding-top:5px;
	}
	nav.verticalleftjustified a {color:#689AD3;
		width:95%;
		background:#04356C; /*888381 */
		
		margin-bottom:2px;
		border-bottom-style:none;

	}
	
	nav.mainmenu a.tabbed {
		background:#FFA473;
		border: 1px solid white;
	
	}
		
	
	nav.mainmenu a.activetab {
	background:#E8E1DD;
	color:#A63A00;
	padding-left:5px;padding-right:5px;
	-moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0; /* future proofing */
    -khtml-border-radius: 0; /* for old Konqueror browsers */
   }

   nav.mainmenu a.contacttab {
	background:#329000;
	color:#99EE6B;
	padding-left:5px;padding-right:5px;
	-moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius:0; /* future proofing */
    -khtml-border-radius: 0; /* for old Konqueror browsers */
   }
}
/* end of responsive columns styling */


/* round buttons and bubble contents */
.round-button {
   width: 100%;  
   height: 0;
   padding-bottom: 100%;  /* width and padding-bottom must be the same and set the size of the button */
		
    border-radius: 50%;
    overflow: hidden;
    background: #FF8240;
	
	box-shadow: 
        inset 0 0 0 10px rgba(255,255,255,0.6),
        0 1px 2px rgba(0,0,0,0.1);
    transition: all 0.4s ease-in-out;
	
}

.active-round {
	background: #689AD3;
}
	
.round-button:hover {
    background: #689AD3;
}
.round-button img {
    display: block; 
    width: 60%;
    padding: 19%;
    height:auto;  
}


.bubble /* responsive bubbles.? fonts http://css-tricks.com/viewport-sized-typography/ 
           use ems for font size and resize using media queries */
{
	margin-top:  18px;  
	padding-bottom:  18px;
	margin-bottom:  0px;
	
    position: relative;
    /* width: 15%;  match the circle widths */
    height: 45px; /* height of the bubbles */
    padding: 0px;
	padding-left:5px;
	padding-right:5px;
    background: #FFFFFF;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: #689AD3 solid 2px;
	
}

.bubble .button {
	
	top:0;
	right:0;
	background-color:#C63;
	width:50px;
	height:30px;
	text-align:center;
}

.row > .button {
	top:0;
	right:0;
	background-color:#C63;
	width:50px;
	height:30px;
	text-align:center;
}

.bubble:after 
{
	top: -15px;  
	border-width: 0 15px 15px;  
	
   content: '';
   position: absolute;
   border-style: solid;

   border-color: #FFFFFF transparent;
   display: block;
   width: 0;
   z-index: 1;
   margin-left: -15px;

   left: 50%;
}

.bubble:before 
{
	top: -18px;  
	
   content: '';
   position: absolute;
   border-style: solid;
   border-width: 0 16px 16px;
   border-color: #689AD3 transparent;
   display: block;
   width: 0;
   z-index: 0;
   margin-left: -16px;
   left: 50%;
}
 
.bubble > h2 {
	padding:0px;
    margin:0px;
	margin-top: 2%;
	padding-bottom: 2%;
	font-size: 10px;
	text-align:center;
	line-height: 10px;
	overflow:hidden;
	color:#0D56A6;
}


/* need to set the height to the total height - the top bubble margin height - the more button height as a
percentage */ 
.bubble .textbox {
	height:80%;  
	width:100%;
	overflow:hidden;
	padding:0px;
    margin:0px;
	
	color: #BF6230;
}

.bubble a {
}



.button-list {
	background:white;
    margin-left: auto; /* center the buttons and make sure they don't get too big */
    margin-right: auto;
	max-width:750px;
	min-width:240px; /* smart phone compromise */
	
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-content: center;
    align-items: center;
}


.circle-text {
	position:absolute;
	bottom:-5px;
    right:-5px;
	font-size:.75em;
	 
    width:25%;
}
.circle-text:after {
    content: "";
    display: block;
    width: 100%;
    height:0;
    padding-bottom: 100%;
    background: #0D56A6; 
    -moz-border-radius: 50%; 
    -webkit-border-radius: 50%; 
    border-radius: 50%;
	
	border: 4px solid #0D56A6;
    border-radius: 50%;  
    color:#4679BD;   
     
    box-shadow: 0 0 3px gray;

}
.circle-text div {
    float:left;
    width:100%;
    padding-top:50%;
    line-height:1em;
    margin-top:-0.5em;
    text-align:center;
    color:white;
	text-decoration:none;
}

.circle-text  a {
	float:left;
    width:100%;
    padding-top:50%;
    line-height:1em;
    margin-top:-0.5em;
    text-align:center;
    color:white;
	text-decoration:none;
}


.circle-text:hover:after {
    background: #689AD3;
	
}

.math-symbol {
   
}
 
.math-symbol img {
	display: block; 
    width: 40%;
    padding: 30%;
	height:auto;
  
}

/* Styling for the content box layout */
.flex-container-items {
	
	margin-top:10px;
	
	max-width: 1382px; /* set this higher up so that everything has this width */
	margin-left: auto; /* center the buttons and make sure they don't get too big */
    margin-right: auto;
	/* background-color:#E8E1DD;*/
	 	
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
    align-content: space-around;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    }

.flex-content-item {
	
	
	padding-bottom:100px;
	
	 margin: 0 auto;
	
    position: relative;
    width: 90%; /* match the circle widths */
    /* height: 185px; */
	height: 100%;
	
    padding: 0px;
	padding-left:5px;
	padding-right:5px;
    background: #FFFFFF;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: #C77E47 solid 2px;
	
    }

.centeredimg {
	
	min-width:20px;
}

.centeredimg img {
	display:block;
	margin-left:auto;
	margin-right:auto;
}

.wrapper {
	padding-bottom:35px;
}
	
.flex-content-item h2 {
	color:#A63A00;
	margin: 0 0 1% 0;
	padding:0;
}

.flex-content-item p {
	color:#BF6230;
}

.flex-content-item li {
	color:#BF6230;
}

.flex-content-item a {
	position:absolute;
	bottom:3px;
	left:3px;
	
  -moz-border-radius: 25px;
  -moz-box-shadow: #494c78 0px 0px 10px;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -webkit-border-radius: 25px;
  -webkit-box-shadow: #6E7849 0 0 10px;
  -webkit-transition: all 0.5s ease;
  background-color: #784960;
  background-image: -moz-linear-gradient(90deg, #274F7D, #04356C);
  background-image: -ms-linear-gradient(90deg, #274F7D, #04356C);
  background-image: -o-linear-gradient(90deg, #274F7D, #04356C);
  background-image: -webkit-linear-gradient(90deg, #274F7D, #04356C);
  background-image: linear-gradient(90deg, #274F7D, #04356C);
  border-radius: 25px;
  border: 2px solid #689AD3;
  box-shadow: #494c78 0px 0px 10px;
  color: #ffffff;
  display: inline-block;
  font-size: 1em;
  margin: auto;
  padding: 1%;
  text-decoration: none;
  text-shadow: #000000 5px 5px 15px;
  transition: all 0.5s ease;
}
.flex-content-item a:hover {
  padding: 1%;
  background-color: #689AD3;
  border: 2px solid #99EE6B;
  color: #689AD3;
  cursor:help;
}

.tform {
	margin-top:20px;
	padding:2%;
	width:75%;
	background-color:#99EE6B;
	color:#329000;
}

.newboxes {
	position:relative;
	padding-top:0px; /*10px */
	  margin-top:0px;  /*25px */
	  
	  
}

@media all and (max-width: 480px) {
    .smallhide {
        display:none;
    }
	
}

.footeraddress {
 
}

.footeraddress h2 {
	font-size:1.3em;
	color:white;
	/* color:#FF8240; */
}
.footeraddress ul {
	list-style-type: none;
	font-size: 1.0em;
	/*color:#FFA473;*/
	color:white;
	padding:5px;
}


.footeraddress ul li a {
    /* color: #0060B6; */
	color:white;
    text-decoration: none;
	padding:15px;
}

.footeraddress ul li a:hover 
{
     color:#00A0C6; 
     text-decoration:none; 
     cursor:pointer;  
}

tr.spaceUnder > td
{
  padding-bottom: .9em;
}

/* printing related markup */
#printcopyright {
	COLOR: #FFA473; font-size: 12px; font-weight: normal;
}

/* test stuff */
.fixedlist {
	background:red;
    margin-left: auto; /* center the buttons and make sure they don't get too big */
    margin-right: auto;
	max-width:750px;
	min-width:240px; /* smart phone compromise */
	
	 
}

.fixedlist li {
	 display:inline-block;
}

.fixedlist li div {
	display:inline-block;
}

.floatlist {
	background:red;
}

.floatlist wrapper {
	float:left;
}

.mywrap {
	float:right;
}

.jlist {
	background:blue;
	width:600px;
}

/* an unholy hack. has to be last to have an effect */
div#itemToWatch.headercontents.fixedloc{
	background:red;
	color:green;
	position:fixed;
	top:0;
	z-index:16;
}
	
