/* 
Author: Christina Reeser
Date Created: 1/15/2011
Last Updated: 1/21/24 */


/* ---------->>> GLOBAL <<<-----------*/


* { margin: 0; padding: 0;}

html, body { margin: 0; padding: 0; }

body { 
	background: #333 url(bkg.png) top left repeat-x;
	font-family: "Open Sans", sans-serif;
	font-size: 16px; line-height: 1.4;
	color: #111;
	}
	
h1, h2, h3, h4, h5, h6, pre, blockquote, label, ul, ol, li, dl, fieldset, address { 
	padding:0;
	margin:0; 
	}

fieldset { padding: .5em; }

.nav-toggle { display: none;}
/* ---------->>> DIVS <<<-----------*/

#wrapper { 
	width: 1200px;
	margin: 0 auto;
	background-color: #fff;
	}
	
	#home #wrapper { background: #4b2463 url(home_bg2.jpg) center center no-repeat; min-height: 600px; background-size: cover;}
	#artists { margin: 0px 0px 0 0; width: 400px; float: right; text-align: right; }
	
#header { background: url(home_bg2.jpg) center no-repeat; background-size: cover;}

.logo img { display: block; margin: 0 auto; width: 50%;}

.tagline { display: block; margin: 0 auto; width: 70%;height: auto; margin-bottom: 0px; margin-top: 40px; padding-bottom: 30px;}

.header-contact { 
	display: block;
	font-weight:bold; 
	text-align: center;
}

.header-contact a { 
	color: #fff !important;
	text-transform: uppercase;
	font-weight: bold !important;
	letter-spacing: 2px;
}
.header-contact a:hover { 
	color: #E7D8C7 !important;
}

#content { padding: 40px; }
#home #content {  padding: 20px 30px; min-height: 578px; }

#leftcol { width: 200px; float: left; }
#rightcol { margin-left: 240px;}

#slideshowcontainer {
	width: 417px;
	height: 321px;
	float: left;
	background: url(dropshadow.png) no-repeat;
	}
#slideshow {
	width: 400px;
	height: 300px;
	}


.clearfix {
  overflow: auto;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

	
.one_third, .home-full { 
width: 30%;
float: left;
margin: 1%;
color: #fff;
}

.one_third:after, .home-full, .one_third-text {
  content: "";
  display: table;
  clear: both;
}

.one_third-text, .retirement {
background: url(trans.png) repeat;
}

.retirement {
	color: #fff; 
	font-weight: bold; 
	background: url(trans.png) repeat; 
	border: 2px solid #fff; 
	margin: 20px 53px 0 45px; 
	overflow:visible; 
	clear: both; 
	padding: 20px;
	}

.home-full {
width: 880px; padding: 20px;
background: url(trans.png) repeat;
}

.slider, .slider_mp, .slider_bb, .slider_sloane { border: 2px solid #fff; margin-bottom: 20px;}
.slider img,
.slider_mp img,
.slider_bb img,
.slider_sloane img {
	width: 100%; height: auto;}


#footer {
	margin-top: 10px;
	color: #CDC4BC;
	padding-bottom: 10px;
	font-size: .9em;
}


/* ---------->>> HEADER ITEMS <<<-----------*/

h1, h2, h3 { font-family: "Merriweather", serif;
	line-height: 1.2em; }

h1 { }

	#header h1 {

	}
	
	#home #logo {
	height:100px; /* height of logo */
	width:434px; /* width of logo */
	background: url(logo_home.png) top right no-repeat;
	text-indent:-9000px;
	float: right;
	}

	#content h1 {
	color: #303;
	margin-bottom: 20px;
	font-weight: normal;
	font-size: 36px;
	}
	
	
.one_third h1 { 
	text-align: center; 
	font-size: smaller;
	margin-bottom: 0 !important; padding: 0;
}
	
h2 { }

	#content h2 {
	color: #663366;
	margin: 60px 0 40px 0;
	font-weight: normal;
	font-size: 32px;
	}
	


h3 { }

	#content h3 {
	font-family: "Open Sans", "Arial", sans-serif;
	color: #000;
	margin-bottom:10px;
	font-weight: normal;
	font-size: 14px;
	}		


p { }
	#content p { padding-bottom: 20px; }
	#header p { float: right; margin: 30px 10px 0 0; }
	.caption { font-style: italic; font-size: .9em;}
	
	.one_third p { color: #fff; text-align:center; font-size: 14px; padding: 0 20px;}
  
ul { }
 	#content ul { padding-left: 20px; padding-bottom: 20px; }

li { }

 	#artists li { list-style-type: none; padding-bottom: 5px; }
 
 img { }
 	.imgright { margin: 10px 0px 10px 20px; float: right;}
 	.imgleft { margin: 10px 20px 10px 0px; float: left;}
 

/* ---------->>> ANCHOR TAGS <<<-----------*/
a {  text-decoration: none; }
a:focus { border: 0; outline: 0;}
#home a, #footer a { color: #E7D8C7; text-decoration: none; }
#home a:hover, #footer a:hover { color: #fff;}

#rightcol a { color: #998455;}
#rightcol a:hover { color: #998455; text-decoration: underline;}


/* ---------->>> GLOBAL NAV <<<-----------*/
#nav, #footer { 
	background: #735515;
	font-size: 16px;
	padding: 7px;
	text-align: center;
	}
	
#footer { font-size: 16px;}	

#nav a { padding:18px; text-decoration: none; color: #E7D8C7; font-family: open sans; font-weight: bold;}
#nav a:hover { color: #fff; }

#home .home, #sloane .sloane, #about .about, #project .project, #contact .contact, #artistsrep .artistsrep { 
	color: #fff; }
	
.fb { 

text-indent: -9999;
}	
	
/* ---------->>> SECONDARY NAVIGATION <<<-----------*/


#subnav { width: 200px; float: left; }

#subnav ul {margin: 0; padding: 20px 0 16px 0; border-top: 14px solid #663366; border-bottom: 14px solid #996699; margin-bottom: 30px; }

#subnav li { list-style:none; display: block; margin-bottom: 7px; }

#subnav li a {
	text-decoration: none;
	font-size: 14px;
	color: #666;
	    font-family: 'Open Sans', sans-serif;
}
#subnav li a:hover, #subnav li .on { 
	color: #000;
}
	

/* ---------->>> FORMS AND BUTTONS <<<-----------*/	

.sm_button { 
	display: inline-block;
	border: 2px solid #663366;
	color:  #663366 !important;
	text-align: center;
	padding: 10px 20px;
	text-decoration: none !important;
}

.sm_button:hover { 
background-color: #996699;
color: #fff !important;
}


#formmatted { color: #000; width: 370px; }

#formmatted label, input {
			display: block;
			float: left;
			margin-bottom: 3px;
			background-color: transparent;
			color: #000;
		}

#formmatted input, textarea { border: 1px solid #666; width: 230px; color: #000; padding: 1px; }
#formmatted select { border: 1px solid #ccc; margin-bottom: 3px; width: 230px; color: #000;}
#formmatted input.radio { border: 0px; margin-right: 5px; margin-bottom: 0;}

#formmatted label {
	text-align: right;
	width: 105px;
	padding-right: 10px;
}

.check, .radio { width: 2em !important; border: 0 !important;}

.ratecol { padding-left: 10px; width: 30px; float: left; text-align: center !important; }

.smcols { padding-left: 10px; width: 80px; float: left; }
.smcols label { display: inline !important; width: 60px !important; padding-left: 10px !important;}

.cols { padding-left: 10px; width: 180px; float: left; }
.cols label { display: inline !important; width: 105px !important; padding-right: 10px !important; }

.lgcols { padding-left: 10px; width: 280px; float: left; }
.lgcols label { display: inline !important; width: 120px !important; padding: 3px 10px 0px 3px !important; }
.medium { width: 100px !important; }
.long { width: 200px;}

a.button span {
	background: transparent url(btn_left.png) no-repeat 0 0;
	display: block;
	line-height: 22px;
	padding: 7px 0 6px 18px;
	color: #fff;
	font-family: "Open Sans", sans-serif;
}

.submit { 
	letter-spacing: 1px;
	width: 150px !important;
	text-transform: uppercase;
 	text-align: center;
 	padding: 5px !important; margin-bottom: 10px; margin-right: 3px;
 	border: 1px solid #000 !important; 
 	color: #fff !important;
	background-color: #636;
	float: left; }

a.button {
	background: transparent url(btn_right.png) no-repeat top right;
	display: block;
	float: left;
	height: 35px;
	margin-right: 6px;
	padding-right: 20px;
	text-decoration: none;
	font-size:12px;
	font-weight: 500;
}

a.button:hover span{
	background-position: 0 -35px; color: #fff;
}

a.button:hover {
	background-position: right -35px;
}

/* ---------->>> MISC <<<-----------*/	

.date {
    color: #998455;
}

.newsblurb { 
	margin-bottom: 20px; padding: 20px;
	border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    height: 1%; overflow: hidden;
    background-color: #e8dfd5;
}

.newsblurb h2 { 
text-align: center; color: #7b6349 !important;
}

.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}


.thumb { float: left;}

.thumb img { 
	background-color: #f5f5f5;
    background: -moz-linear-gradient(bottom, #F2F2F2 0px, #fff 100%);
    background: -webkit-gradient(linear,left bottom,left top, color-stop(0, #f2f2f2),color-stop(1, #fff));
    border: 1px solid #dddddd;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    padding: 4px;
    display: block;
    margin-right: 20px;
    }
 
 .quote {
	font-style: italic;
	padding: 10px 40px 0 20px;
	margin: 0px;
	line-height: 16px;
	margin-bottom: 20px;
	color: #775A1B;
	border-bottom: 1px solid #BD994C;
	overflow: hidden;
  	}
  
 .quote span {
     display: block;
     color: #957E4E; font-weight: bold; font-style: normal; margin-left: 7px;
   	}  
#home .quote { 
	    font-family: 'Merriweather', serif; font-size: 22px !important;border: 0; color: #fcf; font-size: 24px; text-align: center; line-height: 26px; float: none; clear: both; width: 100%;
	
	}

#home .quote span { color: #fcf;font-size: 12px; }
		

.clear { clear: both; background: none; }	

.pretty, .frame, .gallery img {
    background-color: #f5f5f5;
    background: -moz-linear-gradient(bottom, #F2F2F2 0px, #fff 100%);
    background: -webkit-gradient(linear,left bottom,left top, color-stop(0, #f2f2f2),color-stop(1, #fff));
    border: 1px solid #dddddd;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    padding: 4px;
    display: block;
}

.frame img {
    display: block;
}

.frame {
    margin-bottom: 20px;
}

a[href $='.pdf'] { 
   padding-left: 18px;
   background: transparent url(icon_pdf.gif) no-repeat top left;
}

a[href $='.doc'] { 
   padding-left: 18px;
   background: transparent url(icon_doc.gif) no-repeat top left;
}

.toolkit_common { background-color: #E9E6DC; list-style-type: none; margin-bottom: 20px; padding: 10px !important;}
.toolkit_other { background-color: #E6DCE9; list-style-type: none; margin-bottom: 20px; padding: 10px !important;}
	
.special { 
	margin: 20px 0; padding: 10px;
	background-color: #E6DCE9;
	font-weight: bold;
	font-style: italic;
}

.montimg {
float: left; width: 170px; border: 2px solid #fff; margin-right: 20px;
}

.bb-slide {
width: 170px; float: left; margin-right: 20px;
}
	
@media screen and (max-width: 1250px) {
	#wrapper {
	width: 100%
	}
	
	#leftcol {
    width: 25%;
    float: left;
    margin-right: 5%;
	}
	#rightcol {
    width: 70%; 
    float:left;
    margin: 0;
	}

	.home-full {
	width: 90%; padding: 20px;
	display:block;
	}
}


@media screen and (max-width: 860px) {
	#nav a {
    padding: 15px 7px;
    }
    
    .tagline { width: 100%; }

} 

@media screen and (max-width: 790px) {
	#wrapper {
	width: 100%
	}
	
	#leftcol {
    width: 35%;
    float: left;
    margin-right: 0;
	}
	#rightcol {
    width: 63%; 
    float:left;
    margin: 0;
	}
}


@media screen and (max-width: 690px) {
	#wrapper {
	width: 100%
	}
	
	#content { padding: 20px; line-height: 1.2em; }
	
	.one_third {
    width: 100%;
    float: none;
    margin: 0;
	}
	
	.one_third-text {
	margin-bottom: 40px;
	}
	
	img, iframe { max-width: 100%; height auto;}
	
	#leftcol {
	display: block;
    width: 100%;
    float: none;
    margin-right: 0;
    margin-bottom: 40px;
	}
	#subnav {
    width: 100%;
    float: none;
	}

	#rightcol {
    width: 100%; 
    float:none;
    margin: 0;
	}
	
	#rightcol li, #leftcol li { margin-bottom: 10px; }
	
	.nav-toggle { display: block; color: #fff;}
	
	.nav-items { display: none; }
	#nav a { display: block; width: 95%;}
	.nav-items a { 
	text-transform: uppercase;
	background-color: #92763b;
	margin-bottom: 5px; 
	}
	
	.logo img { width: 80%;}
	
	.montimg {
	float: none; width: 100%; border: 2px solid #fff; margin-right: 0px; margin-bottom: 40px;
	}
	
	.bb-slide {
	width: 100%; height:auto; float: none; margin-right: 0px margin-bottom:40px;
	}
	
	#subnav li a,
	#content {
   
    line-height: 1.2em;
	}
	
	.menutoggle { width: 35px; height: 35px;}
	
	
}


@media screen and (max-width: 490px) {
	#rightcol img, #leftcol img, .pretty, .imgleft { 
	display: block;
	width: 100%;
	float: none !important;
	margin: 0 auto !important;
	margin-bottom: 30px !important; 
	}
	body {font-size: 1em; } 
	#footer {
	font-size: 14px;
}
}