@charset "UTF-8";
/* CSS Document */

.upper-alpha {
list-style-type:upper-alpha;
}
.decimal {
list-style-type:decimal;
}
.picture {
padding:5px;
border:1px solid #ccc;
margin: 0 auto;
text-align: center;
}


 @media (min-width: 55em) {
.picture {
    float:left;
margin-right:20px;
}
}




#top-container h2 {
font-weight:lighter;
color:#666;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:20px;
line-height: 1.2;
margin:0px 0px 10px 0px;
text-transform:uppercase;}

#top-container h3 {
font-weight:lighter;
color:#999;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:17px;
margin:0px 0px 15px 0;
}		

.footer p a {color: #fff;}

.skip-link {display:none;}

#top-container {
position:relative;
/*background-image: url(/web/20161024043638im_/http://jonathanspeare.com/wp-content/themes/johnathan/images/titlebar_1.jpg);*/
width:auto;
text-align: left;
background-color:white;
font-size: 10px;
min-height: 205px;
border-bottom:1px solid #333;
clear: both;
padding-bottom:20px;
padding-top: 20px;
background-repeat:repeat-x;
background-position:bottom;
}

#top-container h1 {
font-weight:lighter;
color:black;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:18px;
padding-top:15px;
text-transform:uppercase;
clear: both;
line-height: 1.3;
}

 @media (min-width: 55em) {
#top-container h1 {
    clear:none;
    font-size:28px;
    line-height: 0;
}
}






.top {
max-width:900px;
margin-left:auto;
margin-right:auto;

line-height: 12px;
text-align: center;
clear: both;
font-family: Arial, Helvetica, sans-serif;
font-size: 9px;
color: #666666;
}

 @media (min-width: 55em) {
.top {
    text-align: left;
}
}




#top-content1  {
width:auto;
min-height:40px;
}

.menu li#home a, .menu li#introduction a, 
.menu li#credentials a, .menu li#services a, 
.menu li#workshops a, .menu li#fees a, .menu li#confidentiality a     {
font-weight:bold;
}

		
.menu a {
border:none;
font-weight:normal;
	}

.menu a:hover {
text-decoration:underline;
	}


/* Actual menu CSS starts here */
	.menu,
	.menu ul {
		margin:0;
		padding:0;
		list-style:none;
	}
	.menu {width:170px;}
	.menu li {
		display:block;
		margin: 0 0 8px 0;
		padding:0;
font-weight:lighter;
color:black;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:15px;
text-transform:uppercase;
	}
	.menu a {
		display:block;
		padding:0px;
		color:#000;
		text-decoration:none;
	}
	.menu a:hover,
	.menu a:focus,
	.menu a:active {background:white;}
	.menu ul li {padding-left:0px;}
	.menu ul a {background:white;color:#000;}
		.menu ul li.current_page_item a {color:#999}
	.hidden {display:none;}



/*-------*/

body {margin:0px;padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	background: #fff;
}


@media (min-width: 55em) {
body {
    background: #42b6cd;
}
}




.mainContent {
	background: #fff;


}


	div#wrap {
		margin:0px auto;
		/*max-width:1000px;*/
		
	}
	div#header {
		/*max-width:1000px;*/
		min-height:15px;
		/*background: url(/web/20161024043638im_/http://jonathanspeare.com/wp-content/themes/johnathan/images/top.png) no-repeat -1px 0px;*/

	}
	div#content {
		margin:0px auto;
		padding-bottom:60px;
		/*max-width:1000px;*/
		/*background: url(/web/20161024043638im_/http://jonathanspeare.com/wp-content/themes/johnathan/images/mainsh.png) repeat-y;*/
	}
	div#footer {
		/*max-width:1000px;*/
		min-height:30px;
		/*background: url(/web/20161024043638im_/http://jonathanspeare.com/wp-content/themes/johnathan/images/footersh.png) no-repeat -1px 0px;*/
	}

div#bodywrap {
		max-width: 1000px;
	margin-top: 20px;
	margin-right: auto;
	margin-bottom:0px;
	margin-left: auto;

}



#content {
min-height:500px;
margin-top:30px;
padding-top:40px;}

#content p {
font-family:  Arial, Helvetica, sans-serif;
font-size:13px;
color:#333;
margin-top:30px;
line-height:20px;} 

.exhibition {
float:right;
padding: 0px 0px 20px 20px;}



#content-container2 {
	
	margin-bottom:20px;
	text-align:left;
	
	
}

#content-container2 ol li {
margin-bottom: 10px;
line-height: 1.5em;}

#content-container2 p, #content-container2 ol {
font-family:  Arial, Helvetica, sans-serif;
font-size:14px;
margin:0px 0px 15px 0px;}

.mainContent ul li  {
font-family:  Arial, Helvetica, sans-serif;
font-size:14px;

color:#333;
line-height:19px;
margin:0px 0px 10px 0px;}


#content-container2 h2 {
font-weight:lighter;
color:black;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:20px;
padding-bottom:5px;
border-bottom:1px solid #333;
margin:20px 0 15px 0px;
text-transform:uppercase;}	

#content-container2 h3 {
font-weight:lighter;
color:#642509;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
font-size:20px;
margin:10px 0px 15px 0px;
}		

#content-container2 h4 {
font-size:14px;
color:#666;
margin:10px 0px 15px 0px;
}

#content-container2 h5 {
font-weight:lighter;
font-family:"Century Gothic","Lucida Sans Unicode",Arial,sans-serif;
margin:10px 0px 15px 0px;
}		


#content-container1 {

padding-top:0px;
margin-right:30px;
margin-left:30px;
margin-top:-20px;

	text-align:left;
	float: right;
	background-color:none;
}


#clear {
clear:both;}

	

/* begin top navigation */

a {
border: none;
text-decoration:none;
}

img{
border: none;
text-decoration:none;
}

.footer p {
	color:white:
	font-size:12px;}
	
#footer-container {
position:relative;
border-top:1px solid black;
width:auto;
text-align: left;
background-color:#02353E;
font-size: 10px;
padding:0px 0px 20px 0px;
min-height: 100px;
clear: both;
margin-top:0px;
background-repeat: no-repeat;
}


.footer {
width:65%;
min-height:100px;
margin-left:auto;
margin-right:auto;
line-height: 12px;
text-align: left;
margin-bottom:50px;
margin-top: 30px;
padding-bottom:10px;
clear: both;
}

.footer ul {
margin-top:12px;
}

.footer li {
margin-left:-40px;
margin-top:0px;
list-style-type:none;
}

.footer li a {
text-decoration:none;
color:#999;
font-size:11px;
}

.footer li h5 a {
text-decoration:none;
color:#FF6600;
}

.footer li h5 a {
font-size:13px;
font-weight:lighter;
font-family: Arial, Helvetica, sans-serif;
}

.footer-links1,.footer-links2,.footer-links3, .footer-links4    {
min-width:130px;
float:left;}

.footer-links2    {
min-width:150px;
}
/*
.footer-address {

width:205px;
margin-top:12px;
padding:20px 20px 20px 35px;
float:right;
color:#999;
text-align:left;}*/
	
.footer-address a {
color:#666;
}



 .main {
    padding-bottom: 30px;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
}

@media (min-width: 55em) {
.main {
    width: 66.10169%;
    float: left;
    margin-right: 1.69492%;
    
}
}



.container {
    padding: 2%;
    max-width: 68em;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 55em) {
.container {
    max-width: 73em;
    background: #fff;

}
}



.container:after{content:" ";display:block;clear:both}




.secondary {
    position: relative;
    padding: 0;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
}

@media (min-width: 55em) {
.secondary {
    padding: 0 0 0 10px;
    width: 25%;
    float: right;
    margin-right: 0;
    margin-top: 40px;
}
}