/* Start of djoo.com stylesheet */

/* Body */
body {font:77% Verdana, Arial, Helvetica, sans-serif; text-align:center;}
div#index {
	position:absolute; 
	left:50%; 
	width:760px; 
	margin-left:-380px; 
}

/* Background and text colours */
div.linebreak1, div.linebreak2, div.centercontent, div.introcontent, div.introimage, div.footer, div.validation {
	background-color:white;
	color:black;
}
#blue #navigation, #blue #nav a, #blue div.breadcrumb, #blue div.topbar, #blue #navigation, #blue div.rightheading {
	background-color:#369;
	color:white;
}
#blue, #blue div.header, #blue div.rightcontent, #blue div.rightmembers, #blue .browserstop, #blue .browserstopright {
	background-color:#69C;
	color:white;
}
#green #navigation, #green #nav a,  #green div.breadcrumb,#green div.topbar, #green #navigation, #green div.rightheading {
	background-color:#066;
	color:white;
}
#green, #green div.header, #green div.rightcontent, #green div.rightmembers, #green .browserstop, #green .browserstopright  {
	background-color:#099;
	color:white;
}
#red #navigation, #red #nav a,  #red div.breadcrumb, #red div.topbar,  #red #navigation, #red div.rightheading {
	background-color:#900;
	color:white;
}
#red, #red div.header, #red div.rightcontent, #red div.rightmembers, #red .browserstop, #red .browserstopright  {
	background-color:#c33;
	color:white;
}
#blue .left, #blue .left1, #blue .middle1 {border-right:1px dotted #369;}
#red .left, #red .left1, #red .middle1 {border-right:1px dotted #900;}
#green .left, #green .left1, #green .middle1 {border-right:1px dotted #066;}

/* Background Images */
#blue #navigation {background-image: url('images/blue_fade.jpg');}
#blue div.rightheading {background-image: url('images/corner_blue.gif');}
#red #navigation {background-image: url('images/red_fade.jpg');}
#red div.homeimage {background-image: url('images/left_prospectus.gif');}
#red div.rightheading {background-image: url('images/corner_red.gif');}
#green #navigation {background-image: url('images/green_fade.jpg');}
#green div.rightheading {background-image: url('images/corner_green.gif');}

/* Image borders */
.noborder   			{border:0px; vertical-align:middle;}
.border   			{border:1px solid white;}

/* Hyperlinks */
a:link 				{color:#369; background-color:white;}
#green a:link 			{color:#066; background-color:white;}
#red a:link 			{color:#900; background-color:white;}
a:visited 			{color:black; background-color:white;}
a:hover 			{color:black; text-decoration:none; background-color:white;}
a:active 			{color:black; background-color:white;}

/* Font styles */
h1 				{font-size:135%;}
h2 				{font-size:105%;}
.subheading 			{font-size:90%;}
p.bold, span.bold, .location 	{font-weight:bold;}
.subheading, .intro, .italic 	{font-style:italic;}
.capitalize 			{text-transform:capitalize;}
.warning			{font-weight:bold; color:#369;}
#green .warning			{font-weight:bold; color:#066;}
#red .warning			{font-weight:bold; color:#900;}
div.indent			{padding-left:7px; padding-right:7px;}

/* Horozontal rules */
div.hr {
	margin-left:-1px;
	margin-right:-1px;
	width:576px;
	height:5px;
}
#blue div.hr {color:white; background: #369 url(images/hr_blue.gif);}
#green div.hr {color:white; background: #066 url(images/hr_green.gif);}
#red div.hr {color:white; background: #900 url(images/hr_red.gif);}
div.hr hr {display: none;}
hr {color:white; background-color:white;}

/* Lists */
ul.columnlist {list-style:circle url(images/list_arrow.gif);}
ul.link, ul.linksection {list-style:circle url(images/list_blue.gif);}
#green ul.link, #green ul.linksection {list-style:circle url(images/list_green.gif);}
#red ul.link, #red ul.linksection {list-style:circle url(images/list_red.gif);}
ul.columnlist li {margin-left:-15px;}
ul.link li {line-height:150%;}
ul.linksection li {margin-left:-20px; line-height:25%;}

/* Form buttons */
.searchbutton, .memberbutton, .fieldterms, .fieldprivacy, .surveybutton {
	font-size:90%;
	border:outset white;
}
#blue .searchbutton, #blue .memberbutton, #blue .fieldterms, #blue .fieldprivacy, #blue .surveybutton, #blue .contactsend, #blue .contactreset {
	background-color:#369; 
	color:white;
}
#red .searchbutton, #red .memberbutton, #red .fieldterms, #red .fieldprivacy, #red .surveybutton, #red .contactsend, #red .contactreset {
	background-color:#900;
	color:white;
}
#green .searchbutton, #green .memberbutton, #green .fieldterms, #green .fieldprivacy, #green .surveybutton, #green .contactsend, #green .contactreset {
	background-color:#066; 
	color:white;
}
.searchbutton, .searchfield {margin-left:2px;}
.memberbutton {width:145px;}
.searchbutton {width:114px;}
.surveybutton {width:73px;}
.contactsend {width:140px;}
.contactreset {width:60px;}

/* Form fields */
.searchfield, .fieldemail, .fieldpassword, .fieldfname, .fieldlname, .fieldusername {
	font-size:90%;
	background-color:#dddddd;
	color:black;
}
.contactfield, .contactsection, .contactenquiry {
background-color:#dddddd;
color:black;
}
.searchfield {width:114px;}
.fieldpassword {width:74px;}
.fieldterms {width:69px;}
.fieldfname {width:67px;}
.fieldlname {width:68px;}
.fieldprivacy {width:72px;}
.fieldusername, .fieldemail {width:97px;}
.contactfield, .contactenquiry {width:200px;}
.contactsection {width:206px; background-color:#dddddd;}
.fieldfix {display:none;}

/* Misc settings */
.clear {clear:left;}

/* Page corners */
.topleftcorner {position:absolute; top:-2px; left:-2px; width:20px; height:20px;}
.toprightcorner {position:absolute; top:-2px; left:730px; width:20px; height:20px;}
#blue .topleftcorner {background: url(images/corner_topleft_blue.gif);}
#green .topleftcorner {background: url(images/corner_topleft_green.gif);}
#red .topleftcorner {background: url(images/corner_topleft_red.gif);}
#blue .toprightcorner {background: url(images/corner_topright_blue.gif);}
#green .toprightcorner {background: url(images/corner_topright_green.gif);}
#red .toprightcorner {background: url(images/corner_topright_red.gif);}

/* Logo and user buttons */
.topbar {	
	position:absolute;
	width:748px;
	height:50px;
	border:2px solid #000;
	border-bottom:none;
	left:10px;
	top:5px;
}
#blue #advert .topbar {
	background: url(images/banner_blue.jpg) right no-repeat;
	background-position:336px 0px;
}
.logo {position:relative; float:left; padding-top:5px; padding-left:7px;}
.advert {position:relative; float:right; padding-right:170px; padding-top:20px;}

/* Buttons enlarged */
/* Adapted version of the exploding images on www.cssplay.co.uk/menus/magnifier2.html */
#enlarge {margin:0.7em auto; list-style-type:none;}
#enlarge li {display:block; float:right; width:27px; position:relative;}
#enlarge li a {
	display:block; 
	width:20px; 
	height:20px; 
	background:transparent; 
	overflow:hidden; 
	position:relative;}
#enlarge li a img {width:100%; height:100%;}
#enlarge li a:hover {position:absolute; right:-5px; top:-7px; width:35px; height:35px;}

/* Navigation header */
#header	{			
	position:absolute; 
	top:55px;
	left:10px;
	width:748px;
	height:35px;
	border-right:2px solid #000;
	border-left:2px solid #000;
	background-repeat: no-repeat;
	background-position: top center;
}
#search {float:left; padding-top:10px; padding-left:6px;}

/* Navigation tab menu */
#navmenu {position:absolute; top:5px; left:7px;}
.menu {font-weight:bold;}
.menu dl {margin-top:0px;}
.menu dd {float:left; padding:0px; margin:0px;}
.menu dd span.aa, .menu dd span.cc {
	display:block; 
	width:25px; 
	height:30px; 
	float:left; 
	padding:7px 0;
}
.menu dd span.bb {height:30px; float:left; padding:7px 0;}
.menu a, .menu a:visited, #green .menu a, .menu a:visited,
#red .menu a, .menu a:visited {
	color:white;
	text-decoration:none; 
	cursor:pointer;
}
.menu a:hover, #green .menu a:hover, #red .menu a:hover {
	color:black; 	
	background:white;
}
span.bb {text-decoration:underline;}
.menu dd span.aa {background:#69C url(images/tab_left_blue.gif);}
#green .menu dd span.aa {background:#099 url(images/tab_left_green.gif);}
#red .menu dd span.aa {background:#c33 url(images/tab_left_red.gif);}
.menu dd span.bb {background:#69C url(images/tab_middle_blue.gif);}
#green .menu dd span.bb {background:#099 url(images/tab_middle_green.gif);}
#red .menu dd span.bb {background:#c33 url(images/tab_middle_red.gif);}
.menu dd span.cc {background:#69C url(images/tab_right_blue.gif);}
#green .menu dd span.cc {background:#099 url(images/tab_right_green.gif);}
#red .menu dd span.cc {background:#c33 url(images/tab_right_red.gif);}

/* Navigation search box */
#navigation {
	position:absolute;
	left:10px;
	top:90px;
	width:748px;
	height:45px;
	border-right:2px solid #000;
	border-left:2px solid #000;
	background-repeat: repeat-x;
	background-position: bottom;
}

/* Line Breaks */
.linebreak1 {
	position:absolute;
	top:135px;
	left:10px;
	width:748px;
	height:10px;
	border-right:2px solid #000;
	border-left:2px solid #000;		
}
.linebreak2 {
	position:absolute;
	padding:0px;
	top:145px;
	left:172px;
	width:588px;
	height:10px;
	border-right:2px solid #000;		
}

/* Breadcrumb trail */
.breadcrumb {
	position:absolute;
	padding-top:2px;
	padding-left:7px;
	top:155px;
	left:172px;
	width:581px;
	height:18px;
	text-align:left;
	border-right:2px solid #000
}

/* Center content */
.centercontent {
	position:absolute;
	padding:7px;
	top:173px;
	left:170px;
	width:574px;
	text-align:left;
	border:2px solid #000;
	border-top:0;
}

/* Introduction text */
.intro 	{height:70px; width:450px;}
/* Section image */
.centerimage {width:104px; float:right; margin-left:7px;}
.centerimage, .sectionimage {width:100px; height:100px;}
.sectionimagehome {width:100px; height:112px;}
.contentbottom {position:relative;}
/* Notice board */
.notice {position:absolute; left:437px; top:-44px; width:130px; height:150px; background:url(images/notice.gif) no-repeat;}
.announcement {position:relative; left:10px; top:45px; width:110px; text-align:center}
/* Center columns */
.left, .leftcolumn {margin-top:0px; float:left; width:270px;}
.left1, .middle1 {margin-top:0px; float:left; width:180px;}
.left, .left1, .middle1 {margin-right:7px; padding-right:7px;} 
.right, .rightcolumn, .righthome, .right1 {
	float:left;
	margin-right:7px;
	margin-bottom:14px;
	margin-top:0px;
	padding-left:7px;
}
.allscripts {height:100px;}
.middlescripts, .middledesigns {float:left; width:6px;}
.rightcolumn {text-align:left;}
.leftscripts, .leftcolumn, .rightcolumn, .leftdesigns {text-align:right;}
.dictionary {float:left; width:130px; height:30px; padding-bottom:5px; margin-left:10px;}
.dictionary1 {float:left; width:130px; height:30px; padding-bottom:5px; margin-right:10px; border-right:1px solid black;}
.contentscripts {margin-left:0px; width:284px; height:100px; border:1px solid black; float:left;}
.contentdesigns {float:left; width:286px; height:100px; border:1px solid black;}
.leftscripts, .rightscripts {float:left; width:139px; line-height:270%;}
.leftdesigns {float:left; width:85px; padding-top:10px;}
.middledesigns {float:left; width:1px; padding-top:10px;}
.rightdesigns {float:left; width:179px; padding-top:10px; padding-right:7px;}
.picturescripts {float:left;}
.imagescripts {
	float:left;
	width:95px;
	height:100px;
	border:1px solid black;
	border-right:none;
}
.imagedesigns {
	float:left;
	width:142px;
	height:100px;
	border:1px solid black;
	border-right:none;
}
.browserstop, .browsers, .browsersright, .browserstopright {float:left; padding:2px;}
.browserstop, .browserstopright {border-top:2px double black; border-bottom:4px double black; height:30px;}
.browsers, .browsersright {border-top:1px solid black;}
.browsers, .browserstop {width:117px;}
.browsersright, .browserstopright {width:202px;}
.jobsleft {height:290px; float:left; padding-right:7px; padding-bottom:7px;}

/* Section banners */
.banner1, .banner2, .banner3, .banner4 {
	width:574px;	
	height:161px; 
}
.banner1 {background:url(images/banner_1.jpg); background-position:bottom; background-repeat:no-repeat;}
.banner2 {background:url(images/banner_2.jpg); background-position:bottom; background-repeat:no-repeat;}
.banner3 {background:url(images/banner_3.jpg); background-position:bottom; background-repeat:no-repeat;}
.banner4 {background:url(images/banner_4.jpg); background-position:bottom; background-repeat:no-repeat;}
.jobs {float:left; height:290px; width:100px; padding-right:7px; padding-bottom:7px; background:url(images/jobs.jpg); background-position:bottom; background-repeat:no-repeat;}
.bannertext1, .bannertext2, .bannertext3, .bannertext4, .bannerjobs {font-size:85%; font-style:italic;}
.bannertext1 {position:relative; left:130px; top:37px; width:50px; line-height:135%;}
.bannertext2 {position:relative; left:334px; top:20px; width:160px;}
.bannertext3 {position:relative; left:200px; top:35px; width:60px;}
.bannertext4 {position:relative; left:267px; top:37px; width:58px; text-align:center;}
.bannerjobs {position:relative; left:10px; top:220px; width:80px; text-align:center;}

/* Side heading */
.rightheading {
	position:absolute;
	left:10px;
	top:142px;	
	padding-top:7px;
	height:24px;
	width:160px;
	border-left:2px solid #000;
	background-repeat: no-repeat;
	background-position: top right;
	font-weight:bold;
}

/* Side content */
.rightcontent {
	z-index:2;
	position:absolute;
	left:10px;
	top:173px;
	width:162px;
	text-align:left;
}
.rightborder {border-left:2px solid #000;}
.rightbottom, .rightbottomhome {position:relative; height:50px; text-align:left; margin-top:-20px;}
#blue .rightbottom {background: url(images/rc_bottom_blue.gif) no-repeat;}
#blue .rightbottomhome {background: url(images/rc_homebottom_blue.gif) no-repeat;}
#green .rightbottom {background: url(images/rc_bottom_green.gif) no-repeat;}
#green .rightbottomhome {background: url(images/rc_homebottom_green.gif) no-repeat;}
#red .rightbottom {background: url(images/rc_bottom_red.gif) no-repeat;}
#red .rightbottomhome {background: url(images/rc_homebottom_red.gif) no-repeat;}

/* Tab system */
.tabberlive .tabbertabhide, .tabber, .tabberlive .tabbertab h2 {display:none;}
.tabberlive {width:150px; padding-top:2px; padding-left:5px; margin-bottom:-30px;}
ul.tabbernav {
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #000;
 font-size:90%;
 font-weight:bold;
 text-align:center;
}
ul.tabbernav li {list-style: none; margin: 0; display: inline;}
ul.tabbernav li a
{
 padding: 3px 0.5em;
 margin-left: 3px;
 border: 1px solid #000;
 border-bottom: none;
 text-decoration: none;
}
#blue ul.tabbernav li a {color:white; background-color:#369;}
#green ul.tabbernav li a {color:white; background-color:#066;}
#red ul.tabbernav li a {color:white; background-color:#900;}
#blue ul.tabbernav li.tabberactive a {color:white; background-color: #69c; border-bottom:1px solid #69c;}
#green ul.tabbernav li.tabberactive a {color:white; background-color: #099; border-bottom:1px solid #099;}
#red ul.tabbernav li.tabberactive a {color:white; background-color: #c33; border-bottom:1px solid #c33;}
#blue ul.tabbernav li a:hover, #green ul.tabbernav li a:hover, #red ul.tabbernav li a:hover, #blue ul.tabbernav li.tabberactive a:hover, #green ul.tabbernav li.tabberactive a:hover, #red ul.tabbernav li.tabberactive a:hover {
 color: #000;
 background:white;
}
ul.tabbernav li a:link, ul.tabbernav li a:visited {color:white;}
.tabberlive .tabbertab {
 padding:1px;
 border:1px solid #000;
 border-top:0;
 border-bottom:0;
 font-size:90%;
 text-align:center;
}

/* Footer */
.footer {height:104px; width:577px; text-align:center;}

/* Validation and Sponsor Links */
.sponsors {		
	text-align:left;
	position:relative;
	float:left;
	width:450px;
	height:32px;
}
.validation {		
	position:relative;
	float:left;
	width:117px;
	height:32px;
}

/* Copyright information */
.copyright {
	position:relative;
	clear:left;
	float:left;
	width:100px;
	height:66px;
	border:2px dotted #000;
}

/* Banner advertisement */
.advertisement {
	position:relative;
   	float:left;
	width:468px;
	height:66px;
	border:2px dotted #000;
	border-left:none;
}


/* End of djoo.com stylesheet */