/*
	COPYRIGHT JOE HAINES / STONES OF SCOTLAND
	
	ALL RIGHTS RESERVED
	
	WRITTEN NOV 2013

*/

body {
	font-family: 'Vollkorn', Georgia, Times, serif;
	font-size:1em;
	background-image:url('../img/bk.png');
	background-color:#494949;
	overflow-y: scroll;
	margin:20px 0px 50px 0px;
}

.clearfix:before, .clearfix:after { content: " ";display: table; }
.clearfix:after { clear: both;}
.clearfix { *zoom: 1; }
	
a { outline: none; }
a img { border: none; }

a {
	color: #A95C84;
	text-decoration: none;}

a:hover {
	color: #E07BB1;}
	
p {
	margin-bottom:15px;}

h1 {
    font-family: 'Ubuntu', Helvetica, Arial, sans-serif;
    font-size: 1.7em;
	text-align:left;
	margin-top:10px;
	margin-bottom:30px;
	color:#000;
	text-shadow: 1px 1px 2px rgba(50, 50, 50, 0.35);
}
	
h2 {
	font-family: 'Ubuntu', Helvetica, Arial, sans-serif;
    font-size: 1.7em;
	text-align:left;
	margin-top:10px;
	margin-bottom:30px;
	color:#000;
	text-shadow: 1px 1px 2px rgba(50, 50, 50, 0.35);}

#wrapper {
	margin:0 auto;
	width:930px;
}

#main {
	width:100%;
	border-top: 10px solid #A95C84;
	background-color:#FFF;
	min-height:600px;
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	padding-left:25px;
	padding-right:25px;
}

#main:before, #main:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
#main:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
    -moz-transform:skew(8deg) rotate(3deg);     
    -ms-transform:skew(8deg) rotate(3deg);     
    -o-transform:skew(8deg) rotate(3deg); 
    transform:skew(8deg) rotate(3deg);
}

#top {
	width:100%;
	margin-top:35px;
}

#logo {
	float:left;
}

/*search input*/

.search_container {
	position:absolute;
	top:73px;
	right:27px;
	float:right;
	display:inline;
	height:34px;
	width:205px;
}

.search_input_container {
    background: url('../img/search.png') no-repeat;
    width:171px;
    height:34px;
	display:block;
	float:left;
}
.search_input_container input{
    height:34px;
    line-height:34px;
    border:none;
    background:transparent;
    padding:0 10px;
    width:150px;
}
.search_container a {
	display:block;
	float:left;
	height:34px;
	width:34px;
	background: url('../img/searchbtn.png') no-repeat;
	float:left;
	text-indent: -99999px;
}
.search_container a:hover {
	background-position: 0 -34px;
}

#image_area {
	background-color:green;
	width:920px;
	height:250px;
	margin:0 auto;
}

#content {
	min-height:200px;
	padding:10px;
}

#footer_main {
	position:relative;
	bottom:0px;
	left:0px;
	width:980px;
	margin-left:-25px;
	background-color:#A95C84;
	color:#FFF;
	border-top: 5px solid #D8D8D8;
}

#footer_text {
	padding:20px;
	height:130px;
	width:940px;
	background-color:#494949;
	margin-top:30px;
	font: normal normal 0.7em Helvetica, Arial, sans-serif;
}

#footer_text h1 {
	font: normal normal 1.5em Helvetica, Arial, sans-serif;
	text-align:left;
	margin-top:10px;
	margin-bottom:12px;
	color:#CECECE;
	text-shadow: 1px 1px 2px rgba(50, 50, 50, 0.35);
}

#footer_copy {
	position:asbolute;
	left:0px;
	bottom:0px;
	width:970px;
	height:50px;
	background-color:#000;
	font-size:0.6em;
	text-align:right;
	line-height:50px;
	padding-right:10px;
	color:#C0C0C0;
}

#footer_copy a {
	color:#C0C0C0;
	text-decoration:underline;
}

#footer_copy a:hover {
	color:#FFF;
}

.jump {
	position:absolute;
	top:8px;
	right:5px;
	width:18px;
	height:15px;
	text-indent: -99999px;
	background: url('../img/pagetop.png') 0 0;
}

.jump:hover {
	background-position: 0 15px;
}

/* MENU */

.sf-menu, .sf-menu * { margin: 0;padding: 0;list-style: none;}
.sf-menu li {position: relative;}
.sf-menu ul {position: absolute;display: none;top: 100%;left: 0;z-index: 99;}
.sf-menu > li {float: left;}
.sf-menu li:hover > ul,.sf-menu li.sfHover > ul {display: block;}
.sf-menu a {display: block;position: relative;}
.sf-menu ul ul {top: 0;left: 100%;}

#menu {
	position:relative;
	width:100%;
	margin-top:30px;
	background-image:url('../img/menu-bk.png');
	z-index:5000;
}

.sf-menu {
	float: left;
	margin-bottom: 1em;
	height:46px;
}
.sf-menu ul {
	box-shadow: 2px 2px 6px rgba(0,0,0,.2);
	min-width: 12em; /* allow long menu items to determine submenu width */
	*width: 12em; /* no auto sub width for IE7, see white-space comment below */
	height:46px;
}
.sf-menu a {
	text-decoration: none;
	zoom: 1; /* IE7 */
	font-family: 'Roboto', Helvetica, Arial, sans-serif;
	letter-spacing:2px;
	font-size:0.7em;
	height:46px;
	line-height: 46px;
	padding:0px 13px;
	text-shadow: 1px 1px 1px rgba(50, 50, 50, 0.8);
}
.sf-menu a {
	color: #FFF;
}
.sf-menu li {
	white-space: nowrap; /* no need for Supersubs plugin */
	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
	-webkit-transition: background .2s;
	transition: background .2s;
}
.sf-menu .current { background: rgba(211,101,158,0.7); }
.sf-menu ul li {
	background: #1E1E1E;
}
.sf-menu ul ul li {
	background: #3C3C3C;
}
.sf-menu li:hover,
.sf-menu li.sfHover {
	background: rgba(211,101,158,0.7);
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
}

/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {
	padding-right: 2.5em;
	*padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1em;
	margin-top: -3px;
	height: 0;
	width: 0;
	/* order of following 3 rules important for fallbacks to work */
	border: 5px solid transparent;
	border-top-color: #000; /* edit this to suit design (no rgba in IE8) */
	border-top-color: rgba(255,255,255,.5);
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
	border-top-color: white; /* IE8 fallback colour */
}
/* styling for right-facing arrows */
.sf-arrows ul .sf-with-ul:after {
	margin-top: -5px;
	margin-right: -3px;
	border-color: transparent;
	border-left-color: #000; /* edit this to suit design (no rgba in IE8) */
	border-left-color: rgba(255,255,255,.5);
}
.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul:after,
.sf-arrows ul .sfHover > .sf-with-ul:after {
	border-left-color: white;
}

/* top social links */

#social_area_top {
	position:absolute;
	top:40px;right:27px;
}

#social_link_top {
	display:block;
	float:left;
	width: 28px;
	height: 28px;
	text-indent: -99999px;
}
#social_link_top:hover {
	background-position: 0 28px;
}

.facebook_top { background: url('../img/social_small/facebook.png') 0 0; }
.twitter_top { background: url('../img/social_small/twitter.png') 0 0; }
.pintrest_top { background: url('../img/social_small/pintrest.png') 0 0; }

/* footer social links */

#social_area {
	position:relative;
}

#social_link {
	display:block;
	float:left;
	width: 56px;
	height: 56px;
	text-indent: -99999px;
}
#social_link:hover {
	background-position: 0 56px;
}

.facebook { background: url('../img/social/facebook.png') 0 0; }
.twitter { background: url('../img/social/twitter.png') 0 0; }
.pintrest { background: url('../img/social/pintrest.png') 0 0; }

/* 3 cols for content */
#cols > div {
    width: 33%;
    height: 100%;
    float: left;
	position:relative;
}
#cols div div {
    height:100%;
}
#cols div div.b {
    margin:0 15px;
}

.more{
	background-color:#A95C84;
	border:1px solid #A95C84;
	padding:5px;
	color:#FFF;
	position: absolute; bottom: 0; left:0;
}
.more:hover{
	background-color:#000;
}


/* twitter feed stuff */

#loading-container {
    padding:16px 0px 16px 0px;
    text-align:center;
}

#twitter-feed {
	margin-top:10px;
    width:260px;
    font-family: Arial, Helvetica, sans-serif;
    border-radius:12px;
    background-color:#FFF;
    color:#333;
	float:right;
	overflow:hidden;
}
 
#twitter-feed h1 {
    color:#5F5F5F;
    margin:0px;
    padding:9px 0px 9px 0px;
    font-size:18px;
    font-weight:lighter;    
}
 
.twitter-article, #loading-container {
    width:100%;
    border-top:1px dotted #CCC;
    float:left; 
    padding:8px 0px 8px 0px;
	position:relative;
} 
.twitter-pic {
    position:absolute;
}
 
.twitter-pic img {
    float:left;
    border-radius:7px;  
    border:none;
     
}
 
/* -------- TEXT STYLING ------*/
.twitter-text {
    width:100%;
    float:left;
    font-size:11px;
    padding-left:52px;
	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.twitter-text p {
    margin:0px;
    line-height:15px;   
}
.twitter-text a,  h1 a {
    color: #00acee;
    text-decoration: none;
}
.twitter-text a:hover,  h1 a:hover {
    text-decoration: underline;
    color: #00acee;
}
 
.tweet-time {
    font-size:10px;
    color:#878787;
    float:right;
}
.tweet-time a, .tweet-time a:hover {
    color:#878787;
}
 
.tweetprofilelink a {
    color:#444;
}
.tweetprofilelink a:hover {
    color:#444;
}
 
/* -------- FEED  ACTIONS ------*/
#twitter-actions {
    width:75px;
    float:right;
    margin-right:5px;   
    margin-top:3px;
        display:none;
}
.intent {
    width:25px;
    height:16px;
    float:left; 
}
.intent a{
    width:25px;
    height:16px;
    display:block;
    background-image:url(img/tweet-actions.png);
    float:left; 
} 
.intent a:hover{
    background-position:-25px 0px;
} 
 
#intent-retweet a{
    background-position:0px -17px;
} 
#intent-retweet a:hover{
    background-position:-25px -17px;
} 
#intent-fave a{
    background-position:0px -36px;
} 
#intent-fave a:hover{
    background-position:-25px -36px;
} 
 
/* -------- RETWEET INDICATOR ------*/
#retweet-indicator {
    width:14px;
    height:10px;
    background-image:url(img/tweet-actions.png);
    background-position:-5px -54px;
    margin-top:3px;
    float:left;
}

.backlink {
	font-size:11px;
	text-align:center;
}

.backlink a {
	color:#aaa;
}

/*artworks page*/
#artworks_list {
	position:relative;
	width:100%;
}

#artworks_list a img {
	border: 5px solid #A95C84;
	padding:2px;
}

#artworks_list a:hover img {
	border:5px solid #000;
}

.artwork_item {
	float: left;
	margin:20px;
}

/*contact form*/

#contact_form_main #input_area label.error {
	color:red;
	background: transparent url(../img/exclamation-red.png) no-repeat;
	padding:0 0 0 20px;
	font-weight: normal;
	font-size: 0.8em;
	float:right;
}

#contact_form_main #input_area label {
	color: #000;
	/*text-shadow: 2px 1px 2px rgba(150, 150, 150, 1);*/
	font-weight: bold;
	font-size: 0.8em;
	text-align:center;
	padding-top: 5px;
	margin-right: 15px;
	margin-left: 15px;
	clear: both;
	display: block;
}

#contact_form_main #input_area input, #contact_form_main #input_area textarea {
	border: 1px #cecece solid;
	background: #B8B9A9;
	/*text-shadow: 2px 1px 2px rgba(150, 150, 150, 1);*/
	margin-right: 15px;
	margin-left: 15px;
	margin-top: 1px;
	float: left;
	padding-left:3px;
	color: #000;
	font-weight:bold;
	font-size: 0.8em;
}

#contact_form_main #input_area input {
	width: 250px;
	height: 20px;
}

#contact_form_main #input_area textarea {
	width: 250px;
	height: 70px;
}

#contact_form_main #input_area input:focus , #contact_form_main #input_area textarea:focus {
	background: rgba(64,64,64, 1);
}

#contact_form_main input.main_form_submit {
	display: block;
	clear: left;
	height: 36px;
	text-align: center;
	cursor: pointer;
	border: none;
	font-weight: bold;
	margin: 2px 0;
	margin-left:45px;
	margin-bottom:15px;
	width: 200px;
	color: #000;
	background: transparent url(../img/main_form_send.png) no-repeat 0 0;
}

#contact_form_main input.main_form_submit:hover {
	background: transparent url(../img/main_form_send.png) no-repeat 0 -36px;
}

#main_form_loader {
	width:290px;
	display:none;
	text-align:center;
}

#loading_patient, #main_form_success, #main_form_fail {
	text-align:center;
	color: #fff;
	/*text-shadow: 2px 1px 2px rgba(150, 150, 150, 1);*/
	font-weight: normal;
	font-size:1em;
}

#main_form_loader a {
	font-weight:normal;
	font-size: 0.6em;
	text-decoration: underline;
}

#main_form_loader a:hover {
	font-weight:bold;
	text-decoration: none;
}

/*news items*/

.news_area {
	margin:10px;padding:10px;
	border:1px solid #CECECE;
}

.news_title a, .news_title a:hover, .news_title {
	font: normal normal 1.2em Helvetica, Arial, sans-serif;
	text-align:left;
	margin-top:10px;
	margin-bottom:30px;
	color:#000;
	text-shadow: 1px 1px 2px rgba(50, 50, 50, 0.35);
}

span.news_about {
	margin-left:10px;
	font-size:0.5em;
	text-shadow: none;
	color: #404040;
}

.news_item {
	font-size:0.9em;
	padding:5px;
	border:1px solid #CECECE;
}

.news_item img { margin:10px;}