@charset "utf-8";
/*	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~	*/
/*															*/
/*		CSS document for lucindacusdin.co.uk				*/
/*															*/
/*		~ Produced for: Lucinda Cusdin						*/
/*		~ Created: April 2010								*/
/*															*/
/*	~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~	*/

/* General Rules */
* {padding:0; border:0; margin:0; color:#000}
body {font-family:Arial, Helvetica, sans-serif; background:#FFF}
#imageCache {display:none}
#container {width:840px; margin:0 auto}

.floatLeft {float:left}
.floatRight {float:right}
.center {text-align:center}
.clearer {clear:both; height:0px; font-size:0px}
.clearRight {clear:right}
.inline {display:inline}
.italic {font-style:italic; color:#666}
.hidden {display:none}
#main .noBorder {border:none;}

a, a:hover, a:active, a:visited {border:none}
a:hover, label:hover, input:hover, textarea:hover {cursor:pointer}
p {padding:0; margin:20px}

/* Header */
#header {border-bottom:1px solid #000/*#6b0d1d*/; margin:40px 0 20px 0}
h1 {display:inline; float:left; margin:0; color:#333}
h1 a {color:#333; text-decoration:none;}
h1 a:hover {text-decoration:none;}
#header ul {display:inline; float:right; margin-top:15px}
#header li {display:inline-block; float:left}
#header li a {margin:0 0 0 15px; text-decoration:none; color:#000; font-size:0.8em}
#header li a:hover {text-decoration:none}
#linkedIn {width:840px; position:absolute; top:5px; margin:0; text-align:right}
#linkedIn a {display:inline-block; height:17px; padding:3px 22px 0 0; background:url(../images/linkedin_s.png) right no-repeat; color:#CCC; font-size:0.8em; text-decoration:none}
#linkedIn a:hover {color:#333}

/* topNav selected states */
#homePage #homeLink,
#bioPage #bioLink,
#portfolioPage #portfolioLink,
#exhibPage #exhibitionsLink,
#contactPage #contactLink {text-decoration:underline}

/* Main content area */
#main {min-height:350px; padding:10px 20px 20px 20px; border:1px solid #CCC; font-size:0.8em}
* html #content {background:url(../images/bg_content.gif)}/* ie6 png transparency workaround... */
#bioPage #main {background:url(../images/main/bg_bio_main.gif) no-repeat top center}
#portfolioPage #main {background:url(../images/main/bg_portfolio_main.gif) no-repeat top center}
#exhibPage #main {background:url(../images/main/bg_exhib_main.gif) no-repeat top center}
#contactPage #main {background:url(../images/main/bg_contact_main.gif) no-repeat top center}
#content {min-height:350px; background:url(../images/bg_content.png)}

hr {margin:10px 20px; border-top:1px solid #CCC}
h2 {margin:10px 0 10px 0; border-bottom: 1px solid #ccc; padding:0 0 5px 0; font-family:Georgia, "Times New Roman", Times, serif}
h3 {margin:15px 0; border-bottom: 1px solid #ccc; padding:0 0 5px 0; font-family:Georgia, "Times New Roman", Times, serif}
h4 {font-family:Georgia, "Times New Roman", Times, serif}

#bioPage h3 {color:#b78232}
#portfolioPage h3 {color:#444444}
#exhibPage h3 {color:#503726}
#contactPage h3 {color:#2f2e51}

a:active {border:0}
p {padding:0; margin:15px 0; color:#333;}

#main p {padding:10px 0; margin:0; overflow:hidden}
#main .success {padding:20px; margin:20px 0 20px 0; color:#090; border:1px solid #060; background:#FFF}
#main .error {padding:20px; margin:20px 0 20px 0; color:#F00; border:1px solid #F00; background:#FFF}
#main img {border:1px solid #ccc; background:#fff; padding:3px; margin:10px}
#main img#topImage {margin-top:2px}

/* Home Page */
#homePage #main {padding:8px 0 0 0; border:1px solid #FFF; background:url(../images/bg_home_main.gif) no-repeat top center}
#homePage #main a {display:block; text-indent:-9999px }

.thirdColumn {float:left; display:inline}

#homeOrb {width:120px; height:120px; margin-left:78px; margin-top:10px; background:url(../images/home/bg_home_home.gif) no-repeat}

#bioOrb {width:80px; height:80px; margin:31px 0 0 35px; background:url(../images/home/bg_home_bio_normal.gif) no-repeat}
#bioOrb:hover {background-image:url(../images/home/bg_home_bio_hover.gif)}

#portfolioOrb {width:196px; height:196px; margin:-3px 0 0 110px; background:url(../images/home/bg_home_portfolio_normal.gif) no-repeat}
#portfolioOrb:hover {background-image:url(../images/home/bg_home_portfolio_hover.gif)}

#exhibOrb {width:196px; height:135px; margin:31px 0 0 121px; background:url(../images/home/bg_home_exhib_normal.gif) no-repeat}
#exhibOrb:hover {background-image:url(../images/home/bg_home_exhib_hover.gif)}

#contactOrb {width:196px; height:100px; margin:-8px 0 0 60px; background:url(../images/home/bg_home_contact_normal.gif) no-repeat}
#contactOrb:hover {background-image:url(../images/home/bg_home_contact_hover.gif)}

/* jQuery-powered carousel */
#wrapper {width:650px; margin: 50px auto 0 auto}
#intro {padding-bottom:10px}
#slider {position:relative; width:650px; height:148px; margin:0 auto}
.scroll {position:relative; overflow:hidden; width:650px; margin:0 auto}
.scrollContainer {position:relative; padding:0}
.scrollContainer div.panel {width:120px; height:150px; padding:0 8px; }
.inside {height:120px; padding:10px}
.panel {display:none;}
/*.panel img {width:100px; margin:5px 15px 10px 5px; border:0}*/
.scrollButtons {position:absolute; top:-1px; cursor:pointer; }
.scrollButtons.left {left:-30px; top:40px}/*21*/
.scrollButtons.right {right:-30px; top:40px}


/* Portfolio Page */
#portfolioPage h3 {margin:20px;}
#portfolioPage h3 a {color:#000; text-decoration:none}
#portfolioCatagories { text-align:center; padding:10px 0; margin:20px 0; border-top: 1px solid #ccc;  border-bottom: 1px solid #ccc;}
#portfolioCatagories h3 {border:0}
#gallery {border:0; margin:0; padding:0}
.box {width:210px; min-height:210px; padding:10px; float:left; border:1px solid #CCC; margin-right:45px; margin-bottom:20px;background:#FFF}
.end {margin-right:0!important}
.box p {text-align:center}
#main .box a {color:#333}
#main .box img {margin:0!important}
#pageLinks, #pageLinks a {color:#666}

.lightBox {display:none; z-index:2; position:absolute; top:0px; left:0; padding:125px 0 420px; width:100%; height:100%; background:url(../images/bg_lightBox.png) repeat; border-top:2px solid #333; border-bottom:2px solid #333}
.lightBox div {width:800px; background:#FFF; border:1px solid #CCC; padding:10px; margin:0 auto; text-align:center}
.lightBox h4 {text-align:center; padding:10px; margin:0;}
#main .closeCont {text-align:right}
#main .box .closeButton {display:inline-block; height:16px; padding:0px 28px 4px 0; margin:10px 25px 0 0; background:url(../images/x2_r.png) right no-repeat; font-size:1.1em; color:#555; font-style:normal}
#main .box .closeButton:hover {text-decoration:none}
.lightBox div img {max-width:760px; overflow:scroll}
#main .lightBox .lightboxTitle {font-size:1.5em}
#main .lightBox .lightboxDescription {font-size:1.2em}

/* Exhibitions Page */
#exhibPage #main li {list-style:none; margin:20px; padding-top:20px; border-top:1px solid #CCC}
#exhibPage #main li h4 {font-size:1.2em; color:#600}

/* Contact Page */
#contactPage label {display:inline-block; width:60px; margin:0; padding:5px; vertical-align:middle}
#contactPage label#enqLabel {vertical-align:top}
#contactPage input {display:inline-block; margin:0; padding:5px}
#contactPage fieldset {padding:5px; border:0}
#contactPage input, textarea {width:200px; border:1px solid #CCC; padding:5px; font-weight:normal; font-style:italic}
#emailInput {margin-left:2px}
#contactPage #submitButton {margin:10px 0 20px 73px; width:110px; height:30px; padding:0 0 2px 0; background:url(../images/bgSubmitButton.png) center no-repeat; border:none; color:#FFF; font-style:normal; text-align:center}
#contactPage #formLightboxContainer {display:none; position:absolute; z-index:2; height:100%; width:100%; top:0%; left:0%; padding:125px 0 420px; background:url(../images/bg_lightBox.png)}
#contactPage #formLightboxInner {height:120px; width:720px; margin:0 auto; padding:40px; background:#FFFFFF; border:1px solid #CCCCCC}
#contactPage #loadingGraphic {height:60px; text-align:center; margin-top:40px; background:url(../images/loading.gif) no-repeat 15% 0%}

#footer {border-top:1px solid #666; margin-top:30px}
#footer p {margin:10px 0 0 0; font-size:0.8em; text-align:center}
#footer p a {text-decoration:underline; color:#000}
#w3c {margin-bottom:20px}
#w3c img {margin:10px 0 0 0; height:22px}

/* Content Management System (CMS) Page */
#cmsPage ul {padding:10px}
#cmsPage form {width:400px; margin:0 auto}
#cmsPage fieldset {width:400px; padding-bottom:10px; border-bottom:1px solid #CCC; margin:20px 10px 10px 10px;}
#cmsPage input, #cmsPage select, #cmsPage textarea {display:block; width:400px; border:1px solid #999; margin-top:5px}
#cmsPage #submitButton {width:100px}

#cmsPage #main a {text-decoration:underline}