@charset "iso-8859-1";
/* CSS Document */

@font-face{
  font-family: 'painted';
  src: url('../APPOPAIN.TTF');
}

*{margin:0; padding:0;}
body{background:#666; font-family:Arial, Helvetica, sans-serif; font-family: 'Indie Flower', arial; font-size:92%;}
div * {font-family:Arial, Helvetica, sans-serif; }

#whatido{display:none;}

#container{min-width:98%; width:98%; max-width:98%; margin:2px auto 10px; overflow:hidden; background:#FFFFFF; border:2px solid #FFF; border-radius:0.5em; box-shadow:1px 4px 5px #333;}

#container ul#top{display:block; padding:14px 0 0; margin:0; }
#container ul#top li{list-style:none; display:inline-block; font-size:1em; text-align:center; color:#000000; font-family:'Merienda One',arial; font-family:Arial, Helvetica, sans-serif;}
#container ul#top li, #container ul#top li a, #container ul#top li a:visited{}

#container ul#top li a:hover, #container ul#top li a:visited:hover{color:#E50300; border-bottom:1px dotted #E50300; text-decoration:none;}						
#container ul#top li#numbers a{color:#E50300; text-decoration:none; border:none; border-radius:16px 16px 0 0;}

#container #header{display:block; clear:both; position:relative; background:black; padding:4px 8px; background:url(../images/header-320.jpg) center center no-repeat; height:180px; border-radius:0.6em 0.6em 0 0; overflow:hidden;}

#container #header #logo {display:block; margin:0 auto; width:96%; max-height:120px; max-width:342px; position:absolute; top:6%; right:2%; z-index:890;}
#container #header #over{display:block; position:absolute; top:0; left:0px; width:100%; height:188px; background:#FFF; opacity:0.70;} 

#container #header h1{color:#00982F; font-weight:normal; font-size:42px; font-family: 'Merienda One', arial; font-family:Arial, Helvetica, sans-serif; text-shadow:2px 1px 2px #00E547; margin:5px 0 0 5px; text-align:center; display:block; text-indent:-8520px;}
#container #header ul {list-style:none; width:90%; margin:15px auto 0 auto; display:block; z-index:890; position:absolute; bottom:0;}
#container #header ul li{display:block; width:100%; text-align:center; font-size:1em; line-height:1.1em; margin:0 0 4px; font-family:'Merienda One',arial; font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#1685C9;}
#container #header ul li.haslink a {font-size:1em !important;}

#container #header:hover ul li, #container #header:hover ul li a{text-shadow:0 0 2px #FFF, 0px 1px 2px #FFF, 2px 1px 0px #FFF; text-align: center}
#container #header ul li, #container #header ul li a{text-shadow:0 0 2px #FFF, 0px 1px 2px #FFF, 2px 1px 0px #FFF;}




#container #content{display:block; clear:both; padding:0 8px 16px 16px; position:relative;}

#container #content h2{font-size:1.25em; line-height:1.6em; margin:12px 0 0; font-family: 'Merienda One', arial; font-family:painted, Arial, Helvetica, sans-serif; font-weight:normal; color:#1685C9; color:red;}
#container #content h3{color:red;}
#container #content p{font-family: 'Indie Flower', arial; font-size:0.85em; line-height:1.6em; margin:0 0 6px; color:#666; font-family:Arial, Helvetica, sans-serif;}
#container #content p.right{margin:6px 0; text-align:right; color:#333;}
#container #content p strong{font-family: 'Indie Flower', arial; color:#000; font-family:Arial, Helvetica, sans-serif; font-weight:normal;}


#container #content img#me{width:36%; border-radius:10%; float:left; overflow:hidden; margin:0.6em 1em 0.4em 0; box-shadow:1px 1px 8px #000;}

#container #content #mainPic{float:left; display:inline-block;}
#container #content #mainPic img {width:266px;}
#container #content #mainPic img#contactPic {width:296px;}

#container #content ul#points{list-style:circle; margin:0 0 0 29px; float:left; width:388px;}
#container #content ul#points li{color:#E50300; font-size:16px; line-height:1em; padding:3px 0 16px;}

#container #content #photos{margin:0 0 8px 0; display:block;}
#container #content #photos .photo{margin:0 6px 12px; display:inline-block; float:left; height:auto; width:210px; border:1px dashed #E50300; padding:4px 2px 4px 4px; position:relative; overflow:hidden;}
#container #content #photos .photo:hover{border:1px dotted #E50300;}
#container #content #photos .photo img {height:auto; width:100%;}

#container #content #photos .photo .over{display:block; position:absolute; top:0; left:0; height:100%; width:100%; background-image:url(https://www.janeshandywomanservice.co.uk/mediastore/images/over.png); background-position: center center; background-repeat:no-repeat;}
#container #content #photos .photo:hover .over{display:none; background-position:center bottom;}

#container #content #contactForm{width:382px; margin:0 0 8px 12px; display:inline-block;}
#container #content #contactForm div{display:inline-block;}

#container #content #contactForm .group{display:inline-block; width:49%; margin:0 1px 4px; float:left;}
#container #content #contactForm .group_full{width:100%;}
#container #content #contactForm .group_submit{width:100%; margin:4px 0 0;}

#container #content #contactForm .group .caption{display:block; font-size:12px; line-height:1.5em;}
#container #content #contactForm .group .field {display:block; position:relative;}

#container #content #contactForm .group .field input{border:1px solid #999; font-size:12px; line-height:1.4em; height:19px; padding:2px 4px; width:174px;}
#container #content #contactForm .group .field input#submit{background:#00982F; border-radius:8px; height:145px; height:30px; color:#FFFFFF; font-family:'Quando',serif; text-transform:uppercase; margin:0 7px; width:185px; float:right;}
#container #content #contactForm .group .field select{border:1px solid #999; font-size:11px; line-height:1.2em; height:75px; padding:1px 1px 1px 4px; width:182px;}
#container #content #contactForm .group .field textarea{border:1px solid #999; font-size:12px; line-height:1.2em; height:73px; min-width:182px; width:182px; max-width:182px;}

#container #content #contactForm .group #errorMessageBox{position:absolute; left:0; top:-40px; z-index:99999999999;}

#container #content #contactForm .group_submit div.info{display:inline-block; font-size:10px; color:#000; width:183px; float:left;}
#container #content #contactForm .group_submit div.field{display:inline-block;}

div#errorMessage{color:#E50300; font-size:11px; margin:0px 0px 0px 40px; padding:0px;}
div#errorMessage strong{color:#980200; font-size:11px; font-weight:bold;}
img.errorIcon{float:left; margin:0px; border-radius:6px; height:24px; width:24px;}
input.error, select.error, textarea.error{border:1px solid #FFFFFF; background:#E40000; color:#FFF;}
input.valid, select.valid, textarea.valid{border:1px solid #4CA20B; background:#4CA20B; color:#FFF;}
input.valid, select.valid, textarea.valid{border:1px solid #4CA20B; background:none; color:#FFF;}
select.valid, textarea.valid{border:1px solid #4CA20B; background:#4CA20B; color:#FFF;}
select.valid *, select.error *{background:none;}

.field input.valid, .field select.valid, .field textarea.valid{background:rgba(255,255,255,0.75); filter: alpha(opacity=75); -moz-opacity: 0.75; -khtml-opacity: 0.75; opacity: 0.75; color:#000;}
.field input:focus, .field select:focus, .field textarea:focus{background:#FFF !important; filter: alpha(opacity=100); -moz-opacity: 1;-khtml-opacity: 1; opacity: 1; color:#000 !important;}


#container #content #mapCanvas{width: 100%; height: 300px; border-radius:8px;} 

#container #content #joblist{width:98%; height:auto; margin:0; display:block; clear:both;}
#container #content #joblist p{font-size:1em; display:block; color:#000000; font-weight:normal; text-align:left; width:100%; font-family:'Merienda One',arial; font-family:Arial, Helvetica, sans-serif;}
#container #content #joblist p.bot{font-size:12px; margin:0 0 0 2px;}
#container #content #joblist ul {list-style:none; width:100%; margin:0 0 4px; display:block; clear:both;}
#container #content #joblist ul li{display:inline-block; width:100%; text-align:left; font-size:1em; line-height:1.25em; margin:0 0 0.52em 0.75em; font-family:'Indie Flower',arial; font-weight:normal; font-style:normal; color:#1685C9; letter-spacing:0; vertical-align:top; font-family:Arial, Helvetica, sans-serif;}

/** Contact FORM **/
#container #content #contactform{width:100%; background:none; padding:0; display:block; margin:20px 0 10px 0;}
#container #content #contactform h2 {margin:4px 0 0; line-height:1.2em;}
#container #content #contactform p {text-align:left; display:block;}
#container #content #contactform p br {display:none;}

#container #content #contactform div#frame div.form_row_spacer{height:8px; clear:both; display:block; width:100%;}
#container #content #contactform div#frame div.captionBlock{width:100%; float:left; font-size:14px; vertical-align:bottom; color:#333; font-style:italic; text-align:left; margin:4px 0 2px;}
#container #content #contactform div#frame div.topSpace{margin-top:20px;}

#container #content #contactform div#frame div.fieldBlock{width:100%; float:left;}
#container #content #contactform div#frame div.fieldBlock p{margin-left:15px; font-size:14px; text-align:left;}

#container #content #contactform div#frame div.fieldBlock *{border:1px solid #999; color:#000; margin:0; padding:2px 4px; border-radius:4px;}
#container #content #contactform div#frame div.fieldBlock input{width:93%;}
#container #content #contactform div#frame div.fieldBlock select{width:95%; color:#333; padding:4px;}
#container #content #contactform div#frame div.fieldBlock select option {border:none;}
#container #content #contactform div#frame div.fieldBlock textarea{min-width:92%; width:92%; max-width:92%; min-height:75px; height:75px; max-height:75px; color:#333; font-size:12px; padding:4px;}

#container #content #contactform div#frame div.captionBlock input{width:100%; padding:6px; color:#FFF; background:#2CA209; font-size:18px; border-radius:6px; border:none;}

#container #content #contactform div.field{min-width:100%; width:100%; max-width:100%; float:left; display:inline-block; margin:0 0 4px 10px;} 
#container #content #contactform div.field_submit{min-width:100%; width:100%; max-width:100%; clear:both; display:block; margin:0 0 10px;} 


/** Contact FORM - general **/
div.errorMessage{color:#FFF; font-size:11px; margin:0px 0px 0px 40px; padding:0px;}
div.errorMessage strong{color:#F00; font-size:11px; font-weight:bold;}
img.errorIcon{float:left; margin:0px; border-radius:6px; height:24px; width:24px;}
form#contact_form input.error, form#contact_form select.error, form#contact_form textarea.error{border:1px solid #FFFFFF; background:#E40000; color:#FFFFFF !important;}
form#contact_form input.valid, form#contact_form select.valid, form#contact_form textarea.valid{border:1px solid #4CA20B; background:#4CA20B; color:#FFFFFF !important;}
form#contact_form input.valid, form#contact_form select.valid, form#contact_form textarea.valid{border:1px solid #4CA20B; background:none; color:#FFFFFF !important;}
form#contact_form select.valid, form#contact_form textarea.valid{border:1px solid #4CA20B; background:#4CA20B; color:#FFFFFF !important;}
form#contact_form select.valid *, form#contact_form select.error *{background:none;}

form#contact_form input.valid, form#contact_form select.valid, form#contact_form textarea.valid{background:rgba(54,170,77,0.75); filter: alpha(opacity=75); -moz-opacity: 0.75; -khtml-opacity: 0.75; opacity: 0.75; color:#000;}
form#contact_form input:focus, form#contact_form select:focus, form#contact_form textarea:focus{background:#FFF; filter: alpha(opacity=100); -moz-opacity: 1;-khtml-opacity: 1; opacity: 1; color:#000 !important;}



#container #content #contactform div#frame div.fieldBlock input#submit{background:#666; color:#FFF; font-family:painted, arial; font-size:22px; width:98%; padding:8px 0; margin:0 auto; display:block;}




#container #content #areamap{clear:both; width:100%; background:none; display:block;}
#container #content #areamap h2 {margin:8px 0 2px;}
#container #content #areamap p {display:block; margin:0 10px 0 0; min-width:99%; width:99%; max-width:99%;}
#container #content #areamap p br {display:none;}
#container #content #areamap p.ins {display:none;}
#container #content #areamap img {border-radius:0.5em; display:block; margin:10px auto 0; width:90%; max-width:365px; display:block;}



#footbar {width:98%; display:block; margin:6px auto 8px; position:relative;}

#footbar p {font-size:14px; text-transform:uppercase; color:#FFFFFF; font-family:'Merienda One',arial; font-family:arial; display:block; text-align:center; clear:both;}
#footbar p a{font-size:14px; font-weight:bold; text-decoration:none; font-family:'Merienda One',arial; font-family:arial;}
#footbar p#left{margin:0; padding:4px 0 0; font-size:16px; color:#FFFFFF; }
#footbar p#left a{color:#000000; border-bottom:1px dashed #000000;}
#footbar p#left a:hover{border-bottom:1px dotted #000000;}

#footbar p#right{padding:6px 8px 6px 10px; margin:14px 0 0; color:#E0E0E0; font-size:11px;}
#footbar p#right a{color:#FFFFFF; border-bottom:1px dashed #FFFFFF; font-size:11px;}
#footbar p#right a:hover{border-bottom:1px dotted #FFFFFF;}

#footbar p#bottom{padding:0; margin:4px 0 8px 8px; color:#E0E0E0; font-size:11px; display:block; clear:both;}
#footbar p#bottom a{color:#FFFFFF; border-bottom:1px dashed #FFFFFF; font-size:11px;}
#footbar p#bottom a:hover{border-bottom:1px dotted #FFFFFF;}