/* ********************************************* */
/* customer: Carol Taylor                        */

/* website: caroltaylotwatercolors.com           */
/* email: caroltaylor@earthlink.net              */
/* phone: xxx.xx.xxx                             */
/* host provider: lowesthosting.com              */
/* filename: default.css                         */
/* version 2.1                                   */
/* updated: DLR 2012/12/09                       */
/* ********************************************* */

/* *********************************** */
/* DESCRIPTION                         */
/* 1-column, fixed layout              */
/* min-width: 800px                    */
/* max-width: 1000px                   */
/* *********************************** */

/* *********************************** */
/* COLOR SCHEME                        */
/* semi neutral browns                 */
/* base font: white                    */
/* other font: #524c44 (gray-brown)    */
/*                                     */
/* *********************************** */

/* *********************************** */
/* SECTIONS                            */
/* =reset                              */
/* =layout and positioning             */
/* =global                             */
/* =typography (including font colors) */
/* =colors (background colors/images)  */
/* =art                                */
/* =nav styling                        */
/* =hacks                              */
/* =late additions (relocate)          */
/* =new stuff (CSS3 & HTML5)           */
/* *********************************** */

/* =reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, cite, code,
del, dfn, em, font, img, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 font-size: 100%;
 vertical-align: baseline;
/*	background: transparent; */
 }
body {
 line-height: 1;
 }
ol, ul {
 list-style: none;
 }
blockquote, q {
 quotes: none;
 }
/* remember to define focus styles! */
:focus {
 outline: 0;
 }
/* remove underline from links (replaced with bottom-borders as desired) */
a {
 text-decoration: none;
 }
del {
 text-decoration: line-through;
 }

/* =layout */
body {
 text-align: center;
 background: #999 url("../images-pres/body-BG.png") repeat-x;
 background: #8f5509 url("../images-pres/body-BG.png") repeat-x;
 margin-top: 30px;
 margin-bottom: 30px;
 }

#wrap-all {
/* min-width: 780px;
 max-width: 1150px; */
 width: 1000px;
 text-align: left;
 margin: 0 auto;
 background: #fff url("../images-pres/body-BG-01-C.jpg") no-repeat;
 }
.clear {
 clear: both;
 }
#col-wrap {
 
 }
#heading {
	position: relative;
	margin: 0px;
	padding-bottom: 3em;
	border-bottom: 1px solid #fff;
	position: relative;
	}
#heading p.facebook {
	position: relative;
/*	width: 30%;
	float: right; */
	top: 10px;
	right: -50%;
	
/*	right: -6px; */ 
	 
}
#heading p.facebook span {
	line-height: 60px;
	color: #3d61b0;
	border-bottom: 1px solid #3d61b0;
}
#heading p.facebook a:link,
#heading p.facebook a:visited {
	width: 60%;
	display: inline;
	float: right;
	text-decoration: none !important;
	padding-right: 60px;
	background: url(../images-pres/FaceBook_48x48.png) no-repeat right;
}
#heading p.facebook a:hover,
#heading p.facebook a:focus, 
#heading p.facebook a:active {
	color: #f70 !important; /* color change on hover not working */
}
#heading h2 {
 width: 18em;
 float: right;
 font-size: 3em;
 color: #524c44;
 text-align: right;
 margin-right: 40px;
 margin-top: -80px;
 }
#home #heading p {
 width: 20em;
 float: right;
 margin-right: 30px;
 margin-top: -8em;
 padding: .5em 1em;
 }
img.fblogo {
 display: inline;
 width: 40px;
 float: right;
 margin-left: 10px;
 margin-top: -12px;
 }
#heading img.fblogo a:hover { /* want to show that the FB logo is a link; it isn't working */
 background-color: #f00;
 }
#content-wrap {
 margin-top: 5em;
 margin-left: 20px;
 margin-right: 20px;
 }
#bio #content-wrap {
 margin: 30px;
 }
#bio #content {
 margin-left: 0;
 }
/* #home ul {
 text-indent: 5em;
 } */
#bio #content p {
 
 }
#bio p.pullquote {
 
 }
#home #col-wrap {
 position: relative;
 }
#home #col-1 {
 width: 340px;
 float: left;
 margin: 2px 30px 30px 30px;
 }
#home #col-2 {
 width: 480px;
 float: right;
 margin-top: 230px;
 margin-right: 30px; 
 }
#col-1 p.second {
 margin-top: 2em;
 }
#home #h3
 {
 width: 600px;
 float: right;
 margin: -260px 30px 0 0;
 text-align: right;
 }
#col-1 ul {
 margin-top: 90px;
 }
#bio #col-1 ul {
 margin-top: 1em;
 margin-bottom: 2em;
 }
#col-1 li.caption {
 padding-bottom: .8em;
 }
#col-2 img {
 margin-top: -230px;
/* padding-bottom: 30px; */
 }
#bio #col-1 {
 width: 360px;
 float: left;
 }
#bio #col-3 {
 padding-top: 3em;
 }
#bio #line {
 margin-left: 420px;
 width: 58%;
 float: right;
 margin-top: -840px; 
 }
#content h1 {
 text-align: left;
 }
#bio #col-1 ul, #bio #col-3 ul {
 list-style: disc;
 margin-left: 1.6em;
 margin-bottom: .7em;
 }
ul.nav {
 float: right;
 margin-top: -20px;
 margin-right: 40px;
 }
ul.nav li {
 padding: .6em;
 font-size: 2em;
 }
.art {
 margin-right: 20px;
 }

.row-1 ul,
 .row-2 ul,
 .row-3 ul,
 .row-4 ul,
 .row-5 ul,
 .row-6 ul {
 display: inline;
 width: 300px;
 text-align: center;
 float: left;
 margin-bottom: 20px;
 margin-right: 20px; 
 }

.row-1 ul.art-info-last,
 .row-2 ul.art-info-last,
 .row-3 ul.art-info-last,
 .row-4 ul.art-info-last,
 .row-5 ul.art-info-last,
 .row-6 ul.art-info-last {
 margin-right: 0px;
 }

/*
.row-1 ul li.title, .row-2 ul li.title, .row-3 ul li.title, .row-4 ul li.title, .row-5 ul li.title, .row-6 ul li.title {
 margin-top: 20px;
 }
*/
 
li.title {
	margin-top: 20px;
	color: #333 !important;
	font-size: 1.8em !important;
	
	-moz-text-shadow: #e4aa57 0 1px 0px;
	-o-text-shadow: #e4aa57 0 1px 0px;
	-webkit-text-shadow: #e4aa57 0 1px 0px;
	text-shadow: #e4aa57 0 1px 0px;	
	}
div.row-1, div.row-2, div.row-3, div.row-4, div.row-5, div.row-6 {
 display: inline;
 clear: both;
 float: left;
 padding: 10px 0px;
 margin-bottom: 0px;
 }
div.row-1 {
 padding-top: 40px;
 }
dd {
 text-align: center;
 }
#gal-nav {
 clear: both;
 margin-top: 0px;
 margin-bottom: 20px;
 }
#gal-nav  ul li {
 padding-top: .5em;
 padding-bottom: .5em;
 }
#footer {
 clear: both;
 color: #505050;
 background: #777 url("../images-pres/footer-BG.png") repeat-x;
 padding: 6px 0;
 text-align: center;
 border-top: 1px dotted #fff;
 }
#home #footer {
 margin-top: 30px;
 clear: both;
 }
#bio #footer {
 font-size: .9em;
 font-weight: normal;
 }
.artist-pic {
 width: 340px;
 float: left;
 margin: 0 30px 30px 0;
 }

/* =typography */
body {
 font-size: 62.5%;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 color: #fff;
 }
#home #heading p {
 color: #524c44;
 font-size: 1.3em;
 font-weight: bold;
 text-align: right;
 }
#home #heading p a:link, #home #heading p a:visited {
 color: #00f;
 }
#home #heading p a:hover, #home #heading p a:focus { 
 color: #f70;
 }
#home #heading p a {
 text-decoration: underline;
 }

#home #content h2 {
 text-transform: uppercase;
 margin-bottom: .8em;;
 }

#bio #col-2 {
 margin-left: 400px;
 }
#bio p {
 font-size: 1.4em;
 font-weight: bold;
 color: #524c44;
 line-height: 1.2;
 margin-bottom: 1.5em;
 }
#bio #col-1, #bio #col-2, #bio #col-3 {
 color: #524c44;
 }
#bio #col-2 span.Carol-name {
 color: #fff;
 }
#bio #col-1 h3.first {
 margin-top: 2em;
 }
#bio #col-3 h3 {
 color: #524c44;
 font-size: 1.5em;
 }
#bio #col-1 ul li, #bio #col-3 ul li {
 font-size: 1.25em;
 padding-bottom: .3em;
 line-height: 1.2;
 color: #524c44;
 }
#bio #col-3 ul li {
/* font-size: 1.5em; */
 color: #524c44;
 }
#bio #col-3 {
 clear: both;
 }
p.second, p.news {
 font-size: 1.5em;
 line-height: 1.2;
/* -moz-text-shadow: .05em .05em rgba(0, 0, 0, .9);
 -o-text-shadow: .05em .05em rgba(0, 0, 0, .9);
 -webkit-text-shadow: .05em .05em rgba(0, 0, 0, .9);
 text-shadow: .05em .05em rgba(0, 0, 0, .9); */
 padding-bottom: 1em;
 }
#col-1 p.news, #col-1 p.second {
 line-height: 1.2;
 }
#col-1 p.news {
 font-weight: bold;
 color: #e7ae09;
 color: #e78609;
 color: #171410;
 color: #ffffff;
 }
#col-1 p.second {
 font-weight: bold;
 color: #e7ae09;
 color: #e78609;
 color: #171410;
 }
#col-1 li.caption  {
 line-height: 1.0;
 font-size: 1.3em;
 color: #524c44;
 text-align: right;
 }
li.caption span {
 font-weight: bold;
 }
p {
 
 }
li.title {
/* color: #524c44;
 font-size: 1.8em;
 font-weight: bold; */
 }
.row-1 li, .row-2 li, .row-3 li, .row-4 li, .row-5 li, .row-6 li {
 color: #524c44;
 font-size: 1.5em;
 line-height: 1.5;
 }
h1#site-title {
	width: 50%;
 padding: 20px 0 0 20px;
 font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 font-size: 3.5em;
 color: #fff;
 color: #faf2e7;
 text-shadow: .1em .1em .3em #000;
 text-shadow: .1em .1em .3em #fde3cc;
 text-shadow: .1em .1em .3em #f70;
 text-shadow: .03em .03em .1em #000, .065em .075em .25em #ffb370;
 }

h1#site-title span {
	font-style: italic;
	display: block;
/* margin-top: -.2em;
 margin-left: 2.3em; */
	}
h2 {
 font-size: 2.5em;
 margin-bottom: 1.5em;
 }
h3 {
 font-size: 2.0em;
 }
#bio #col-1 h3, #bio #col-3 h3 {
 margin-top: 0;
 margin-bottom: .5em;
 font-size: 2.0em;
 }
h4 {
 font-size: 1.5em;
 }
/*
dd {
 font-size: 1.5em;
 line-height: 1.3em;
 color: #504a42;
 }
dd.status {
 color: #CCFFCC;
 font-weight: bold;
 font-style: italic;
 }
*/

#gal-nav {
 text-align: center;
 font-size: 2em;
 }
#footer {
 font-size: 1.2em;
 }
/* =colors */

 
/* =nav styling */
ul.nav {
 padding-bottom: .5em;
 padding-top: .3em;
 background: #dcd0b6 url(../images-pres/top-nav-BG-3.jpg) right bottom;
 }
ul.nav li {
 display: inline; /* fixes IE/Win double-margin bug */
 font-size: 1.7em;
 }
ul.nav li.not-link {
 color: #211d16;
 
/* background-color: #777; */
 }
ul.nav li a:link, ul.nav li a:visited {
 color: #fff;
 }
ul.nav li a:hover, ul.nav li a:focus, ul.nav li a:active {
 color: #fc0;
 }

#gal-nav ul li a:link, #gal-nav ul li a :visited {
 color: #f70;
 }
#gal-nav ul li a:hover, #gal-nav ul li a:focus, #gal-nav ul li a:active {
 color: #f70;
 }
#gal-nav ul li {
 margin-bottom: .6em;
 }
 
/* =art image styling */
.art {
 border: 18px solid #fff;
 -webkit-box-shadow: 4px 4px 19px 2px #333;
 -moz-box-shadow: 4px 4px 19px 2px #333;
 box-shadow: 4px 4px 19px 2px #333;
 }
.home-image {
 border: 25px solid #fff;
 -webkit-box-shadow: 4px 4px 19px 2px #333;
 -moz-box-shadow: 4px 4px 19px 2px #333;
 box-shadow: 4px 4px 19px 2px #333;
 }

/* =new stuff (CSS3 & HTML5) */
#home ul.caption { /* adds borders and rounds them */
 text-align: left;
 margin-top: 139px;
 margin-left: 150px;
 width: 18em;;
 padding-right: 3.5em;
 padding-top: 1.3em;
 -moz-box-shadow: -.1em -.1em .15em #ffffff, .1em .1em .15em #5b4d46;
 -webkit-box-shadow: .2em .2em .2em #888;
 box-shadow: .2em .2em .2em #888;
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 }
.art-info span {
 -moz-box-shadow: -.1em -.1em .15em #ffffff, .1em .1em .15em #5b4d46;
 -webkit-box-shadow: .2em .2em .2em #888;
 box-shadow: .2em .2em .2em #888;
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 }
ul.nav {
 -moz-box-shadow: -.1em -.1em .2em #fff, .1em .1em .2em #412504;
/* -webkit-box-shadow: -.1em -.1em .2em #fff, .1em .1em .2em #5b4d46; */
 -webkit-box-shadow: -.1em -.1em .2em #fff, .1em .1em .2em #412504;
 box-shadow: -.1em -.1em .2em #fff, .1em .1em .2em #412504;
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 }
#gal-nav ul {
 width: 10em;
 margin: 0 auto;
 -moz-box-shadow: -.05em -.05em .15em #fff, .1em .1em .15em #5b4d46;
 -webkit-box-shadow: -.05em -.05em .15em #fff, .1em .1em .15em #5b4d46;
 box-shadow: -.05em -.05em .15em #fff, .1em .1em .15em #5b4d46;
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 }

#wrap-all {
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 border: 1px solid #e7ae09;
 }
/*
img.fblogo {
 -moz-border-radius: .1em;
 -webkit-border-radius: .1em;
 border-radius: .1em;
 border: 1px solid #e7ae09;
 -moz-box-shadow: -.05em -.05em .15em #fff, .1em .1em .15em #5b4d46;
 -webkit-box-shadow: -.05em -.05em .15em #fff, .1em .1em .15em #5b4d46;
 }
*/
/* trying for color transition on hover - NOT WORKING! */ 
/*
#gal-nav ul li:hover {
 background-color: #fdc;
 }
#gal-nav ul li a {
 background-color: #fff;
 -webkit-transition: background-color;
 -webkit-transition-duration: 1s;
 }
*/

/*
#bio span p{
 -moz-box-shadow: -.1em -.1em .15em #ffffff, .1em .1em .15em #5b4d46;
 -webkit-box-shadow: .2em .2em .2em #888;
 box-shadow: .2em .2em .2em #888;
 -moz-border-radius: 1em;
 -webkit-border-radius: 1em;
 border-radius: 1em;
 }
*/

/* LATE ADDITIONS/EXPERIMENTS */