/* NOTES: */
html, body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
font: 14px Arial, Helvetica, sans-serif;
font-size-adjust: 0.50;
color: #666;
background: #D3D6D5 url(../images/bgPattern.jpg) 0 0 repeat;
text-align:center;
}
.clear-both { clear:both; }
p { font-size:14px; font-family: Arial, Helvetica, sans-serif; color: #000000; line-height: 1.4em; }
a { color: #666; text-decoration:underline; }
a:hover { color:#CCCCCC; text-decoration:underline; }
/*____________________________________ MAIN CONTAINER ____________________________________*/
#mainContainer { width: 750px; padding: 0; background:#FFFFFF; margin-left: auto; margin-right: auto; text-align: left; }
/*____________________________________ HEADER ____________________________________*/
#right_container{ width: 400px; height: 102px; float:right; padding: 0; margin: 0;}
/*#header { height: 131px; width: 750px; background: url(../images/header_bg.gif) repeat-x; position:relative; } */
#header { height: 116px; width: 750px; padding: 0; background:url(../images/header_bg.gif) 0 0 no-repeat; margin-left: auto; margin-right: auto; text-align: left; }
#header div.right { display:block; height: 112px; width: 118px; padding: 0; float:right; text-align: right; }
#leftLogo { height:131px; width:130px; margin: 0 0 0 0; padding: 0; float:left; background: url(../images/left_logo.gif) no-repeat; }
#left_logo_type { height:65px; width:254px; margin: 0 0 0 0; padding: 0; float:left; background: url(../images/left_logo_type.gif) no-repeat; }
#top_right { height:20px; width:100px; margin: 8px 10px 0 0; padding: 0; float:right; font-size: 11px; color: #FFF; text-align:right }
#right_header_container { width: 620px; height: 131px; float:right; padding: 0; margin: 0; }
/*____________________________________ BANNER ____________________________________*/
#banner { width: 750px; margin: 0px;}
/*____________________________________ NAV ____________________________________*/
#nav {height:25px; width:750px; text-align:center; margin: 0 0 0 0; padding: 0; background-color:#999999; float:right;}
#nav ul { margin: 0; padding: 0; list-style: none;}
#nav li { display:inline; }
#nav li a { font-size: 11px; padding-left: 8px; padding-right: 8px; border-right: 1px solid #CCCCCC; line-height: 25px; color:#ffffff; font-weight: normal; text-decoration: none; }
#nav li a:hover, #nav li .active_link { text-decoration: none; color:#000000; }
#nav li.last a { padding-right: 0; border-right: none; }
#nav li.first a { padding-left: 0; }
/*____________________________________ BELOW NAV ____________________________________*/
#below_navNew { width: 750px; margin: 0px; height: 12px; background: #FFF url(../images/below_nav_bg.gif) repeat-x; }
/*____________________________________ SUB NAV ____________________________________*/
#sub_nav { width: 660px; text-align:center; margin: 5px 20px 4px 20px; padding: 0; float:left;}
#sub_nav ul { margin: 0; padding: 0; list-style: none;}
#sub_nav li { display:inline; }
#sub_nav li a { font-size: 11px; padding-left: 11px; padding-right: 12px; border-right: 1px solid #000; line-height: 18px; color:#000; font-weight: normal; text-decoration: none; }
#sub_nav li a:hover, #sub_nav li .active { text-decoration: none; color:#666666; }
#sub_nav li.last a { padding-right: 0; border-right: none; }
/*____________________________________ RIGHT COLUMN ____________________________________*/
#topRight { width: 478px; float: right; padding:0; margin:0 0 0 0; }
#topRight div.pbox, #topRight div.pbox_linebot { margin: 40px 25px 0 25px; padding: 0; }
#topRight div.pbox a, #topRight div.pbox_linebot a { color: #666666; text-decoration: none; }
#topRight div.pbox a:hover, #topRight div.pbox_linebot a:hover { color:#FFFFFF; text-decoration: none; }
#Ri { width: 200px; float: right; padding:20px 0 0 0; margin:0 35px 0 0; }
#Ri div.pbox, #Ri div.pbox_linebot { margin: 20px 15px 0 15px; padding: 0; }
#Le { width: 460px; float: left; padding:0; margin:0 0 0 0; }
#Le div.pbox, #Le div.pbox_linebot { margin: 20px 0 0 40px; padding: 0; }
/*____________________________________ SIDE MENU ____________________________________*/
#left_nav { width: 197px; float: left; padding:0 0 0 0; margin:0 0 25px 32px; line-height: 13px; background:#eaeeF1 url(../images/nav_top.gif) 0 0 no-repeat; }
#left_nav_bot { background: url(../images/nav_bot.gif) 0 100% no-repeat; }
a.sideLink:link, a.sideLink:visited { display: block; font-size:11px; border-bottom: 1px solid #fff; text-decoration: none; color: #4F7697; padding: 5px; }
a.sideLink:hover { background-color:#CCD4D9; color:#4F7697; }
a.sideLink.active { background-color:#CCD4D9; color:#4F7697; }
/*____________________________________ LEFT COLUMN ____________________________________*/
#left { width: 197px; float: left; padding:0 0 15px 0; margin:42px 0 25px 32px; line-height: 13px; }
#left_no_top { width: 197px; float: left; padding:0 0 0 0; margin:0 0 25px 32px; line-height: 13px; border: 1px solid #000000; }
#left_no_top .holder { width: 197px; float: left; padding:0 0 10px 0; margin:0; background:url(../images/column_bot_shade.gif) left top no-repeat; }
#left_no_top .holderNobg { width: 197px; float: left; padding:0 0 10px 0; margin:0; }
#left_no_top .image { float: left; margin: 10px 0 0 7px; padding: 0; }
#left_no_top .pbox { margin: 0 8px 0 8px; padding: 0; }
#left_no_top .pbox2 { width: 92px; float: right; margin: 10px 8px 0 0; padding: 0; }
#left_no_top .pbox .title { color:#56b41c; font-size:13px; }
#left_no_top .image_small { float: left; margin: 10px 0 0 7px; padding: 0; }
#left_no_top .pbox_small { width: 92px; float: right; margin: 10px 8px 0 0; padding: 0; font-size:11px; }
#flashHolder { margin: 0 0 20px 32px; padding: 0; width: 195px; height: 48px; text-align:center; color:#FFFFFF; float: left; }
/* #Right .pbox p { font-size:11px; padding:0; line-height:13px; } */
#left_no_top .pbox a { color:#999999; text-decoration: none; }
#left_no_top .pbox a:hover { color:#000; text-decoration: none; }
#tabProducts { margin: 0 0 0 0; padding: 0; width: 197px; height: 40px; background: url(../images/products_tab.gif) no-repeat; text-align:center; color:#FFFFFF; }
#tabProducts .title { padding: 8px 0 0 0; color:ffffff; }
#column_top_shade { margin: 0 0 0 0; padding: 0; width: 197px; height: 37px; background: url(../images/column_top_shade.gif) no-repeat; }
#column_bot_shade { margin: 0 0 0 0; padding: 0; width: 197px; height: 37px; background: url(../images/column_bot_shade.gif) no-repeat; }
#noteMore { width: 60px; padding:0 3px 0 0; margin: 5px 8px 0 0; float:left; font-size:9px; background:url(../images/arrow_gallery.gif) no-repeat right center; }
#noteMore a { color:#F35D1A; text-decoration:none; }
#noteMore a:hover { color:#000000; text-decoration:none; }
/*____________________________________ WIDE COLUMN ____________________________________*/
#wide { width: 750px; float: left; padding:0; margin:0 0 20px 0; }
#wide .nospace { margin:0; }
#wide .pbox { margin: 15px 40px 0 40px; padding: 0 0 5px 0;}
#wide .flash { margin: 15px 35px 0 35px; padding: 0 0 5px 0;}
#wide .title { margin: 40px 40px 20px 40px; padding: 0 0 15px 0; }
#wide .pbox a { color: #666666; text-decoration: none; }
#wide .pbox a:hover { color:#CCCCCC; text-decoration: none; }
#wide .pbox p.nospace { margin-bottom: 4px; }
#wide .pbox_linebot { margin: 15px 40px 0 40px; padding: 0 0 5px 0; border-bottom: 1px solid #ccc; }
#wide .pbox_linebot a { color: #666666; text-decoration: none; }
#wide .pbox_linebot a:hover { color:#CCCCCC; text-decoration: none; }
#wide .title_linebot { margin: 15px 40px 20px 40px; padding: 0 0 15px 25px; border-bottom: 1px solid #cccccc; background:url(../images/arrow_generic.gif) no-repeat left top; }
/*** Infobox ***/
#wide .infobox .title { width: 200px; float:left; padding:0 20px 0 0; margin: 0 0 12PX 0; color: #0A5385; text-decoration: none; font-size:15px; font-weight:bold; }
#wide .infoboxTopCurve { margin: 0 40px 0 40px; background-color:#e7e9EC; padding: 0; background: #e7e9EC url(../images/generic/infobox_top.gif) top left no-repeat; }
#wide .infobox { margin: 0; padding: 0; background: url(../images/generic/infobox_bot.gif) bottom left no-repeat;}
#wide .inner { margin: 15px 8px 15px 8px; border-right: 1px solid #ccc; border-left: 1px solid #ccc; position:relative; }
#infobox_sml_tips { width:320px; height:137px; margin: 10px 15px 10px 0; padding: 0; background:url(../images/salon/infobox_tips.gif) top left no-repeat; float:left; color:#CCCCCC;}
#infobox_sml_contact { width:320px; height:137px; margin: 10px 0 10px 0; padding: 0; background:url(../images/salon/infobox_contact.gif) top left no-repeat; float:right; color:#CCCCCC;}
#infobox_sml_tips .pbox, #infobox_sml_contact .pbox { width: 200px; margin: 25px 0 0 10px; float:left; }
/*** SMALL INNER COLUMNS ***/
div.inner_left { width:320px; margin: 0 15px 0 0; padding: 0; float:left; color:#000; }
div.inner_right { width:320px; margin: 0 0 0 0; padding: 0; float:right; color:#000; }
div.inner_left .pabox, div .inner_right .pabox { margin: 0 10px 0 10px; position:relative; }
div.inner_left .teambox, div .inner_right .teambox { margin: 0 10px 0 10px; float:right; width:200px; }
/*____________________________________ CONTENT AREA ____________________________________*/
#content { margin: 0; width:750px; padding:0; }
#bot_bg { margin: 0; width:750px; padding:0; background-color:#FFFFFF; background: #fff url(../images/bg_bot.gif) repeat-x bottom left; }
.bullet { font-size:12px; width:400px; margin: 0 0 10px 20px; padding: 0 0 0 15px; line-height: 12px; font-weight:normal; color:#F35D1A; background:url(../images/arrow_gallery.gif) no-repeat left center; }
/*____________________________________ PRE SET MARGINS ____________________________________*/
#wide .toplarge { margin-top: 41px; }
#wide .topmid { margin-top: 20px; }
#wide .topsml { margin-top: 10px; }
#wide .botlarge { margin-bottom: 40px; }
#wide .botmid { margin-bottom: 20px; }
#wide .botsml { margin-bottom: 10px; }
/*____________________________________ CURVED CORNERS ____________________________________*/
.curvetitle { width: 200px; float:left; padding:0 20px 0 0; margin: 0 0 0 0; color: #0A5385; text-decoration: none; font-size:15px; font-weight:bold; }
.t { background: #e7e9EC url(../images/generic/dot.gif) 0 0 repeat-x; margin: 15px 40px 0 40px; }
.b { background: url(../images/generic/dot.gif) 0 100% repeat-x; }
.l { background: url(../images/generic/dot.gif) 0 0 repeat-y; }
.r { background: url(../images/generic/dot.gif) 100% 0 repeat-y; }
.bl { background: #e7e9EC url(../images/generic/bl.gif) 0 100% no-repeat; margin: 15px 40px 0 40px; }
.br { background: url(../images/generic/br.gif) 100% 100% no-repeat; }
.tl { background: url(../images/generic/tl.gif) 0 0 no-repeat; }
.tr { background: url(../images/generic/tr.gif) 100% 0 no-repeat; padding:12px; }
.place { font-size: 1px; height: 1px; }
/*____________________________________ GALLERY ____________________________________*/
.qtvr_holder { margin: 15px 60px 15px 60px; padding: 0; text-align:center; position:relative;}
#qtvr { margin: 0; width: 550px; padding: 0;}
.gallery_holder { margin: 15px 115px 15px 115px; padding: 0; text-align:center; position:relative;}
.gallery_holderV { margin: 15px 0 15px 0; padding: 0; text-align:center; position:relative;}
#gallery { margin: 0; width: 440px; padding: 0;}
#gallery ul { margin:0; padding:0; list-style: none; }
#gallery ul li { float:left; margin:5px 10px 10px 0; }
.thumbGallery_holder { margin: 15px 0 15px 0; padding: 0; text-align:left; position:relative;}
#thumbGallery { margin: 0; width: 400px; padding: 0;}
#thumbGallery ul { margin:0; padding:0; list-style: none; }
#thumbGallery ul li { float:left; margin:5px 10px 10px 0; }
/*____________________________________ MISC ____________________________________*/
#more_plain a { font-size:9px; padding:0; margin: 5px 0 0 0; float:left; color: #666666; text-decoration: none; }
#more_plain a:hover { font-size:9px; padding:0; margin: 5px 0 0 0; float:left; color: #FFFFFF; text-decoration: none; }
.image { float: left; margin: 0 0 0 7px; padding: 0; }
div .more { width: 40px; padding:0; margin:0 0 0 0; float:left; color:#999999; line-height:6px; font-size:11px; background:url(../images/arrowNote.gif) no-repeat right center;}
div .more_link { width: 100px; height: 9px; line-height:9px; padding: 3px 0 3px 0; margin:0 0 15px 0; float:left; color:#999999; font-size:10px; background:url(../images/arrowNote.gif) no-repeat right center;}
#moreInfo { width: 40px; padding:0 0 0 0; margin: 0 0 0 0; float:left; color:#999999; line-height:12px; text-decoration: none; font-size:11px; background:url(../images/generic/arrowNoteInfo.gif) no-repeat right center;}
.note { font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#000000; line-height: 1.4em; }
.float_left { float:left;}
/*____________________________________ COLOURS ____________________________________*/
.melpo { color:#56b41c; }
.about { color:#55a73D; }
.services { color:#3C7C2B; }
.services_light { color:#3649C3; }
.orange { color:#F35D1A; font-weight:bold; }
.clients { color:#575757; }
.location { color:#f02821; }
.contact { color:#00b2FC; }
.fix { color:#000000; }
/*____________________________________ TITLES ____________________________________*/
.title_generic { font-size:14px; margin: 0 0 4px 0; height:20px; padding: 0 0 0 26px; line-height: 20px; font-weight:normal; color:#000000; background:url(../images/arrow_generic.gif) no-repeat left center; }
.title_home { font-size:14px; margin: 0 0 4px 0; height:20px; padding: 0 0 0 12px; line-height: 20px; font-weight:normal; color:#F35D1A; background:url(../images/arrow_gallery.gif) no-repeat left center; }
.title_about { font-size:14px; margin: 0 0 4px 0; padding: 0 0 0 15px; line-height: 12px; font-weight:normal; color:#3C762B; background:url(../images/arrow_note_about.gif) no-repeat left center; }
.title_gallery { font-size:14px; margin: 0 0 4px 0; padding: 0 0 0 15px; line-height: 12px; font-weight:normal; color:#E66F31; background:url(../images/arrow_gallery.gif) no-repeat left center; }
.title_quicktime { font-size:14px; margin: 0 0 4px 0; padding: 0 0 0 15px; line-height: 12px; font-weight:normal; color:#E66F31; }
.title_services { font-size:14px; margin: 40px 25px 0 25px; padding: 0 0 0 26px; line-height: 12px; font-weight:normal; color:#3649C3; background:url(../images/arrow_generic.gif) no-repeat left center; }
.title_services_no_top { font-size:14px; margin: 0 25px 0 25px; padding: 0 0 0 26px; line-height: 12px; font-weight:normal; color:#3649C3; background:url(../images/arrow_generic.gif) no-repeat left center; }
.subtitle_services { font-size:14px; margin: 40px 25px 0 0; padding: 0 0 0 0; line-height: 12px; font-weight:normal; color:#3649C3;}
.subtitle_services_no_top { font-size:14px; margin: 0 25px 0 0; padding: 0 0 0 0; line-height: 12px; font-weight:normal; color:#3649C3; }
/*____________________________________ BORDERS AND DIVIDERS ____________________________________*/
div .divider { display:block; height:1px; margin: 0 40px 0 40px; padding:0; border-bottom: 1px solid #CCC; border-bottom-width:1px; position:relative; }
/*____________________________________ HEADERS ____________________________________*/
/***H1***/
h1 {font-size:20px; margin: 0 0 25px 0; padding: 0; line-height: 18px; font-weight: bold; color:#000; }
h1.about { color:#56b41c; }
h1.services { color:#56b41c; }
/***H2***/
h2 { font-size:18px; margin: 0 0 0 0; padding: 0; line-height: 18px; font-weight: bold; color:#56b41c; }
/***H3***/
h3 {font-size:14px; margin: 0 0 4px 0; padding: 0; line-height: 12px; font-weight:bold; color:#F35D1A; }
h3.about { color:#56b41c; }
h3.services { color:#56b41c; }
/***NO SPACE***/
h1.nospace, h2.nospace, h3.nospace { margin-bottom:4px; }
.no_top_space { margin-top:0;}
/*____________________________________ FOOTER ____________________________________*/
#footer_wrapper { margin: 30px 0 0 0; width:750px; padding:0; background-color:#FFFFFF; position:relative; }
#botContainer { width: 750px; padding: 0 ; height: 48px; background:#4d4d4d; margin-left: auto; margin-right: auto; margin-bottom:80px; }
#footerContent { margin: 12px 0 0 10px; float: left; width: 300px; text-align: left; position:relative; font: 10px Arial, Helvetica, sans-serif; color:#999999; line-height: 1.4em; }
#footerRight { margin: 0 0 0 0; float: right; width: 401px; position:relative;}
#footer { width: 730px; height: 30px; margin: 0 10px 0 10px; font-size: 11px; color: #FFF; padding: 0; line-height: 30px; border-top: 1px solid #ccc; color: #CCCCCC; position:relative; }
#footer a { color: #CCCCCC; text-decoration: none; margin-right: 6px; margin-left: 6px; }
#footer a:hover { text-decoration: underline; }
#webtheoria { float: right; width: 150px; height:22px; color:#CCCCCC; margin: 10px 0 0 0; background: url(../images/webtheoria1.gif) 0 0 no-repeat; }
/*____________________________________ AJAX LIGHTBOX GALLERY RULES ____________________________________*/
#lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#lightbox a img{ border: none; }
#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }
#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%;width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{ width: 49%; height: 100%; background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto;width: 100% }
#imageData{ padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; }
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
#imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; }
#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
/*____________________________________ JOTFORM ____________________________________*/
.tbmain{
/* Changes on the form */
background: white !important;
}
.left{
/* Changes on the form */
color: black !important;
font-family: arial !important;
font-size: 12px !important;
}
.head{
color:#000000;
font-size:20px;;
text-decoration:underline;
font-family:"Verdana";
}
td.left {
font-family:"Verdana";
font-size:12px;
color:black;
}
.pagebreak{
font-family:"Verdana";
font-size:12px;
color:black;
}
.tbmain{
height:100%;
background:white;
}
span.required{
font-size: 13px !important;
color: red !important;
}
div.backButton{
background: transparent url("http://jotform.com//images/btn_back.gif") no-repeat scroll 0 0;
height:16px;
width:53px;
float:left;
margin-bottom:15px;
padding-right:5px;
}
div.backButton:hover{
background: transparent url("http://jotform.com//images/btn_back_over.gif") no-repeat scroll 0 0;
}
div.backButton:active{
background: transparent url("http://jotform.com//images/btn_back_down.gif") no-repeat scroll 0 0;
}
div.nextButton{
background: transparent url("http://jotform.com//images/btn_next.gif") no-repeat scroll 0 0;
height:16px;
width:53px;
float: left;
margin-bottom:15px;
padding-right:5px;
}
div.nextButton:hover{
background: transparent url("http://jotform.com//images/btn_next_over.gif") no-repeat scroll 0 0;
}
div.nextButton:active{
background: transparent url("http://jotform.com//images/btn_next_down.gif") no-repeat scroll 0 0;
}
.pageinfo{
padding-right:5px;
margin-bottom:15px;
float:left;
}