/* CSS Document */
html {
background: url(../images/abolinaart-butterflies.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-color: #36405b;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}
body {width: 100%; height: 100%; font-family: 65% Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-weight: normal; padding:0; margin:0;}
/* ----------------HEADINGS - fonts, colours and styling--------------------- */
h1 {font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 140%; color: #485579; font-weight: bold; letter-spacing: 3px; padding-left: 30px;}
h2 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 95%; font-weight: bold; letter-spacing: 1px; color: #0F77B4; padding-left: 8px; padding-top: 5px;}
h3 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 90%; color: #485579; font-weight: bold; padding-left: 8px; padding-top: 5px; margin: 3px;}
h4 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 75%; color: #485579; font-weight: bold; padding-left: 8px; padding-top: 5px; margin: 3px;}
h5 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 75%; color: #595a5b; font-weight: bold; padding-left: 10px; margin: 3px 0px;}
p {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 75%; font-weight: normal; color: #595A5B; padding: 5px 10px; margin:0px; line-height:1.5em;}
hr{margin: 0; height: 2px; border-top: 0px; border-left: 0px; border-right: 0px; border-bottom: 2px; border-bottom-color: #edf5f9; border-bottom-style: solid; border-collapse: collapse;}
.small {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 60%; font-weight: normal; color: #b3b3b4; padding: 1px 10px; margin: 3px 0px;}
.small2 {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 60%; font-weight: normal; color: #848485; padding: 5px 10px; margin: 0px;}
.pagenav{font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 75%; color: #bebfbd; font-weight: bold; padding: 0px 5px; margin: 3px 0px;}
.bioline {height: 1px; width: 90%; margin-left:10px; border-top: 0px; border-left: 0px; border-right: 0px; border-bottom: 1px; border-bottom-color: #e0e0e0; border-bottom-style: solid; border-collapse: collapse;}
/* ----------CONTAINER, CONT AND CCONT are used to add the dropshadow and to center the layout---------- */
#cont {background: #ffffff url(images/border.png) repeat-y; width: 926px; height: 100%; margin:0px; padding: 0px; margin-left: auto; margin-right: auto;}
#ccont {background: #ffffff url(images/border.png) repeat-y; width: 926px; margin:0px; padding: 0px; margin-left: auto; margin-right: auto;}
#container { position: relative; width: 900px; padding:0px; margin: 0 auto;}
/* ----------BANNER for logo-------------- */
#banner {width: 900px; height: 180px; padding: 0px; margin: 0;}
#banner img {padding: 0px, 0px;}
/* -----------------TOPMENU styles--------------------- */
#topmenu {width: 900px; position: relative; height: 23px; background-color: #1a1d27; padding-bottom: 2px;}
#topmenu p {margin-left: -10px; font-size: 11px;}
#topmenu a {font-family: Tahoma, Arial, Helvetica, sans-serif; text-decoration: none; letter-spacing: 2px; font-weight: bold; padding-top:7px; padding-left:10px; padding-right:10px; padding-bottom:4px;}
#topmenu a:link{color:#f4f5f8;}
#topmenu a:visited{color:#f4f5f8;}
#topmenu a:hover{color:#8df803;background:#4b587d;}
/*TOP MENU CONTACT PAGE this is to enable IE rule on contact page - code is same as top menu rules, but different in all-ie-only.css file... bit of a messy one and frustrated with IE to say the least 240211*/
#topmenuc {width: 900px; position: relative; height: 23px; background-color: #1a1d27; padding-bottom: 2px;}
#topmenuc p {margin-left: -10px; font-size: 11px;}
#topmenuc a {font-family: Tahoma, Arial, Helvetica, sans-serif; text-decoration: none; letter-spacing: 2px; font-weight: bold; padding-top:7px; padding-left:10px; padding-right:10px; padding-bottom:4px;}
#topmenuc a:link{color:#f4f5f8;}
#topmenuc a:visited{color:#f4f5f8;}
#topmenuc a:hover{color:#8df803; background:#4b587d;}
/* -----------------CONTENT - backdrop on all pages and link behaviour--------------------- */
#content{position: relative; margin: 0 14px;}
#content a {text-decoration: none; font-weight: bold;}
#content a:link{color:#515356;}
#content a:visited{color: #515356;}
#content a:hover{color: #B71309;}
#content a:active{color: #B71309;}
/* -----------------content - backdrop on gallery page + link behaviour--------------------- */
#contentg{margin-top: 0px; margin-bottom: 0px; border-top: 2px solid #33394d; background: #11151f;}
#contentg a {text-decoration: none;}
#contentg p {color: #a0a0a0;}
#contentg a:link{color:#c5c5c7;}
#contentg a:visited{color: #c5c5c7;}
#contentg a:hover{color: #B71309; font-weight: bold;}
.leftmenutop {position: relative; height: 60px; margin-left:-14px; margin-top: 10px; background: url(images/leftmenutop.png) transparent top left no-repeat;}
#leftmenu {background:#ffffff url(images/leftbg.png) top left repeat-x; margin-left:-14px; margin-top:0; width:173px;}
.left {font-family:Tahoma,Arial,Helvetica,sans-serif; color: #f4f5f8; background-color: #7bd902; font-weight: bold; font-size: 70%; margin: 0px; padding-top: 8px;}
/* -----------------left menu link behaviour - changed 021111--------------------- */
#leftmenu p {padding-left: 20px;}
#leftmenu a {font-family:Tahoma,Arial,Helvetica,sans-serif; padding-left: 20px;font-weight: bold;font-size: 70%;text-decoration: none;display: block;line-height: 2.5em;}
#leftmenu a:link {background: url(../images/left-arrow.png) 90% 50% no-repeat; color: #4b587d;}
#leftmenu a:visited {background: url(../images/left-arrow.png) 90% 50% no-repeat; color: #4b587d;}
#leftmenu a:hover {background: url(../images/left-arrow-over.png) 90% 50% no-repeat; background-color: #ffffff; color:#444444;}
#leftmenu a:active {background: url(../images/left-arrow-over.png) 90% 50% no-repeat; background-color: #ffffff; color: #444444;}
/* ----------------- classes used for the smaller links in the bottom section of the left side menu - including the arrow image --------------------- */
#lefts {position: relative; margin-left: 15px;}
#lefts p { font-family:Tahoma,Arial,Helvetica,sans-serif; font-weight: bold; font-size: 10px; letter-spacing: 2px; color: #444444; margin-left: -15px;}
#lefts a {font-family:Tahoma,Arial,Helvetica,sans-serif; font-weight: bold; font-size: 10px; display: block; line-height: 1.8em;}
#lefts a:link, #lefts a:visited{background: url(../images/small-arrow.png) 2% 50% no-repeat; color: #999d9d;}
#lefts a:hover, #lefts a:active {background: url(../images/small-arrow-over.png) 2% 50% no-repeat; background-color: transparent; color: #444545;}
/* ----------------- null is used to hold the share this box and prevent it from inheriting styles above --------------------- */
#null a:link, #null a:visited, #null a:hover, #null a:active{background: transparent; background-image: none; background-color: transparent;}
/* -----------------left menu - contact page - same as above but allows separate ie classes on contact page--------------------- */
.leftmenutopc {position: relative; height: 60px; margin-left:-14px; margin-top: 10px; background: url(../images/leftmenutop.png) transparent top left no-repeat;}
#leftmenuc {background:#ffffff url(../images/leftbg.png) top left repeat-x; margin-top:0; margin-left: -14px; width:173px;}
#leftmenuc p {padding-left: 20px;}
#leftmenuc a {font-family:Tahoma,Arial,Helvetica,sans-serif; padding-left: 20px; font-weight: bold; font-size: 70%; text-decoration: none; display: block; line-height: 2.5em;}
#leftmenuc a:link { background: url(../images/left-arrow.png) 90% 50% no-repeat; color: #4b587d;}
#leftmenuc a:visited {background: url(../images/left-arrow.png) 90% 50% no-repeat; color: #4b587d;}
#leftmenuc a:hover {background: url(../images/left-arrow-over.png) 90% 50% no-repeat; background-color: #ffffff; color:#444444;}
#leftmenuc a:active {background: url(../images/left-arrow-over.png) 90% 50% no-repeat; background-color: #ffffff; color: #444444;}
/* -----------------right side page content - pages with left menu--------------------- */
#rightcontent {height: 100%; margin: 12px 20px 0 190px; position: absolute; padding: 0;}
/* -----------------right side page content - contact page--------------------- */
#rightc {height: 100%; margin: 12px 20px 0 190px; position: absolute; padding: 0; top: 0px;}
/*darker font colour and list style in class below*/
.dark {font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif; font-size: 70%; font-weight: normal; color: #595a5b; padding: 5px 0px; margin:0px;}
li.dark {list-style-type: square; margin-left: 10px;}
/*CSS Slideshow on gallery page */
#slideshow {position:relative; background-color: #1a1d27; width:750px; height:530px; margin:10px auto 0 auto; border:1px solid #383636; padding-top: 10px;}
#slideshow ul {margin:10px 20px 5px 5px; padding: 0px; width: 235px; height: 500px; float:right; list-style-type:none;}
#slideshow li {float:left;}
#slideshow p {text-align:left; margin:10px 200px 0 0px; font-family: Tahoma,Arial,Helvetica,sans-serif; font-size:65%; color: #a0a0a0;}
#slideshow a.gallery span {position:absolute; width:1px; height:1px; top:5px; left:5px; overflow:hidden; background:#000000;}
#slideshow a.gallery {border: #383636 1px solid; display: block; margin: 1px 2px; cursor: pointer; color: #000; text-align: left; text-decoration: none}
#slideshow a.gallery:visited {border: #383636 1px solid; display: block; margin: 1px, 2px; cursor: pointer; color: #000; text-align: left; text-decoration: none;}
#slideshow a.gallery, #slideshow a.gallery:visited {display:block; color:#000; text-decoration:none; border:1px solid #383636; margin:1px 2px 1px 2px; text-align:left; cursor:pointer;}
/* thumbnail images - gallery*/
#slideshow a.slidea1 {background:url(images/amanda09-s.jpg); height:72px; width:52px;}
#slideshow a.slidea2 {background:url(images/ben09-s.jpg); height:72px; width:52px;}
#slideshow a.slidea3 {background:url(images/janine09-s.jpg); height:72px; width:52px;}
#slideshow a.slidea4 {background:url(images/stevie-s.jpg); height:72px; width:52px;}
#slideshow a.slidea5 {background:url(images/bo09-s.jpg); height:72px; width:52px;}
#slideshow a.slidea6 {background:url(images/paul09-s.jpg); height:72px; width:52px;}
#slideshow a.slidea7 {background:url(images/insane-s.jpg); height:72px; width:52px;}
#slideshow a.slidea8 {background:url(images/MotherEarthsmall.jpg); height:72px; width:52px;}
#slideshow a.slidea9 {background:url(images/butterflysmall.jpg); height:72px; width:52px;}
#slideshow a.slidea10 {background:url(images/levelssmall.jpg); height:72px; width:52px;}
#slideshow a.slidea11 {background:url(images/noeysmall.jpg); height:72px; width:52px;}
#slideshow a.slidea12 {background:url(images/torsmall.jpg); height:72px; width:52px;}
#slideshow a.slidea13 {background:url(images/lousmall.jpg); height:72px; width:52px;}
#slideshow a.slidea14 {background:url(images/unease-small.jpg); height:72px; width:52px;}
#slideshow a.slidea15 {background:url(images/hairman-small.jpg); height:72px; width:52px;}
#slideshow a.slided16 {background:url(images/ledasmall.jpg); height:72px; width:52px;}
#slideshow a.slided17 {background:url(images/charonsmall.jpg); height:72px; width:52px;}
#slideshow a.slided18 {background:url(images/carav-small.jpg); height:72px; width:52px;}
#slideshow a.slided19 {background:url(images/Biondinasmall.jpg); height:72px; width:52px;}
#slideshow a.slided20 {background:url(images/Hopkins-small.jpg); height:72px; width:52px;}
#slideshow a.gallery:hover {border:1px solid #383636;}
#slideshow a.gallery:hover span {position:absolute; width:420px; height:520px; top:20px; left:40px; background:#1a1d26; text-align:left; margin:0px 200px 0 0px; font-family: Tahoma,Arial,Helvetica,sans-serif; font-size:65%; color: #a0a0a0;}
#slideshow A.gallery:hover img {border: 1px solid #383636; border-top: 1px solid #383636; float: left; border-left: 1px solid #383636; margin-right: 5px; border-bottom: 1px solid #383636;}
/* ----------------footer---------------------- */
#footer {width: 900px; clear: both; height: 35px; background: url(images/footer.png) no-repeat; background-color: #36405b; text-align: center; margin-left: auto; margin-right: auto;}
#footer p {color: #b3b3b4; font-size: 50%; letter-spacing: 2px;}
#footer a {text-decoration: none; font-weight: normal;}
#footer a:link{color:#bcbcbc;}
#footer a:visited{color:#bcbcbc;}
#footer a:hover{color:#54618b;}
/* ----------------footer on GALLERY page---------------------- */
#footerg {width: 900px; clear: both; height: 35px; background: url(images/footerg.png) no-repeat; background-color: #36405b; text-align: center; margin-left: auto; margin-right: auto;}
#footerg p {color: #b3b3b4; font-size: 50%; letter-spacing: 2px;}
#footerg a {text-decoration: none; font-weight: normal;}
#footerg a:link{color:#bcbcbc;}
#footerg a:visited{color:#bcbcbc;}
#footerg a:hover{color:#54618b;}