/***
 * Reset styles 
 ***/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ul, ol {
	margin:0;
	padding:0;
}
body {
	line-height: 1;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/***
 * main page layout elements
 ***/
 body {
    font: 12px Verdana, Arial, Helvetica, sans-serif;
    background: url(background-gradient.jpg) repeat-x #FFFFFF;
 }
 .container {
    width:960px;
    margin-right:auto;
    margin-left:auto;
    background-color:#fff;
 }
 .footer {
     background-color:#036;
     padding: 10px 10px 6px 10px;
     color:#fff;
 }
a, a:visited {color:#36c;}

 
/****
 * styles for header area
 ***/
 .nav {
      background-color:#036;
      padding-left:22px;
 }
 .nav .homelink {float:left;}
.menu {float:right;}
ul.menu {list-style-type:none; padding:0; margin:0;}
.menu .navitem {float:left;}
.nav:after {
       content: ".";
       display: block;
       height: 0;
       clear: both;
       visibility: hidden;
   }
 .nav {
      %zoom:1;
 }

 .nav a, .nav a:visited {
    color:#fff;
    text-decoration:none;
 }
 .nav a:hover {text-decoration:underline;}
.nav .navlink  { 
   padding:10px 15px 6px 15px;
   display:block;
   font-size:14px;
}
.menu .selected, .menu .selected:visited {  
   background:#fff; 
   color: #09247E; 
}
.menu a.navlink:hover {
   background: #945800;
   color:#fff;
}

.l3 {  
    border-bottom: 15px solid #999; 
 }

/* ================================================================ 
Menus - inspired by:
This copyright notice must be kept untouched in the stylesheet at all times.
Copyright (c) 2010 Stu Nicholls. All rights reserved.
=================================================================== */
.menu .holder {
   height:0; 
   top:30px; 
   position:absolute; 
   overflow:hidden; 
   z-index:100;
}
.menu .slide {
   background:#945800; 
   color:#fff;
   padding:17px 20px; 
   position:relative; 
   top:-300px;
}
.menu :hover .chal {height:75px; width: 520px;} 
.menu :hover .serve {height:120px; right:130px;}
.menu :hover .about {height:130px; right:200px;}
.menu :hover .slide {top:0px;}

.slide ul { list-style-type:none; }
.slide .col {float:left; padding-right:30px;}
.slide .col-end {padding-right:0;}
.menu .clear {clear:both;}
.slide a:hover {text-decoration: underline;}
.slide .col-title {font-weight:bold;}
.slide ul ul li {padding-left:10px;}

/*** 
 * landing page banner
 ***/

  .banner h2 {
      font-size:24px;
      color:#fff;
      font-weight:bold;
      font-family: "Times New Roman", Georgia, Times, serif;
     }
  .banner .serv, .banner .chal {
        width:760px;
  }
  .banner .serv {
     background:url(../images/services-banner.jpg) no-repeat;
     text-align: right;
     padding-top:100px;
	 margin-top: 10px;
	 padding-right: 50px;
     height:100px;
	 width:940px; 
  }  
  .banner .pub {
    background:url(../images/publications-banner.jpg) no-repeat;	
    text-align:right;
    padding-top:80px;
	padding-right: 60px;
	margin-top: 10px;
    width:940px; 
    height:100px;
  }
  .banner .chal {
       background:url(../images/challenges-banner.jpg) no-repeat;
       height:100px;
	   width:960px;
       padding: 80px 0 0 5px;
	   margin-top: 10px;
  }
  .banner .about {
       background:url(../images/about-banner.jpg) no-repeat;
       height:100px;
	   width:950px;
       padding-top:130px;
	   padding-right: 120px;
	   margin-top: 10px;
	   text-align:right; 
  }
  
  .banner .contact {
       background:url(../images/contact-banner.jpg) no-repeat;
       height:100px;
	   width:950px;
       padding-top:130px;
	   padding-left: 40px;
	   margin-top: 10px;
  }
  
  .banner .events {
       background:url(../images/events-banner.jpg) no-repeat;
       height:100px;
	   width:960px;
       padding: 80px 0 0 5px;
	   margin-top: 10px;
	   padding-right: 60px;
	   /*text-align:right;*/ 
  }
  
  /* Banners for the secondary pages */
    .banner .serv-blue {
     background:url(../images/services-blue-banner.jpg) no-repeat;
     text-align: right;
     padding-top:100px;
	 margin-top: 10px;
	 padding-right: 50px;
     height:80px;
	 width:940px; 
  }  
  .banner .chal-blue {
       background:url(../images/challenges-blue-banner.jpg) no-repeat;
       height:100px;
	   width:960px;
       padding: 80px 0 0 5px;
	   margin-top: 10px;
  }
  .banner .about-blue {
       background:url(../images/about-blue-banner.jpg) no-repeat;
       height:100px;
	   width:950px;
       padding-top:130px;
	   padding-right: 120px;
	   margin-top: 10px;
	   text-align:right; 
  }
  
  .banner .quote {
     background-color:#036;
     color:#fff;
     min-height:180px;
     %height:180px;
     width:192px;
     margin: -180px 0 0 768px;
     font-size:18px;
     font-style:italic;
     position:relative;
  }
.banner .quote div {
   position:absolute;
   bottom:0;
   padding:40px 20px;
}


/***
 * homepage styles
 ***/
 .content {
 	position:relative;
}
 .column1 {
 	float: left;
 	width: 315px;
	padding-left: 20px;
	padding-right: 5px;
 }

 .column1 img {
 	margin-top: 50px;
	border: none;
 }
 
 .ifont {
 font-style:italic;
 }
  
 .column2 {
 	float: right;
 	width: 620px;
 }
 
 .column2 h2 {
 	font-size: 24px;
	padding: 0px 0px 10px 0px;
 }
 
.superscript{font-size: 70%; vertical-align:top;}
.superscript2{font-size: x-small; vertical-align:top;} 
	
 .panel h3 {
	width:270px;
	font-size:20px;
	text-align:center;
	padding: 20px 0px 20px 0px;
	margin: 10px 0px 10px 0px;
	background-color:#036;
	color:#FFFFFF;
	border: 1px  #CCCCCC;
	border-style: solid;
	-webkit-border-top-right-radius:8px;
	-webkit-border-top-left-radius:8px;
	-moz-border-radius-topright:8px;
	-moz-border-radius-topleft:8px;
	border-top-right-radius:8px;
	border-top-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
	-webkit-border-bottom-left-radius:8px;
	-moz-border-radius-bottomright:8px;
	-moz-border-radius-bottomleft:8px;
	border-bottom-right-radius:8px;
	border-bottom-left-radius:8px;
  }
  .panel div {
     font-size:14px;
	 width: 270px;	 
	 position: absolute;
	 left: 620px; 
	 padding: 20px 30px; 
	 border: 1px  #CCCCCC;
	border-style: solid;
	-webkit-border-top-right-radius:8px;
	-webkit-border-top-left-radius:8px;
	-moz-border-radius-topright:8px;
	-moz-border-radius-topleft:8px;
	border-top-right-radius:8px;
	border-top-left-radius:8px;
	-webkit-border-bottom-right-radius:8px;
	-webkit-border-bottom-left-radius:8px;
	-moz-border-radius-bottomright:8px;
	-moz-border-radius-bottomleft:8px;
	border-bottom-right-radius:8px;
	border-bottom-left-radius:8px;
	background-color: #945800;
	color:#FFFFFF;
  }
  
.upper {  top: 50px;  }
.lower {  top: 200px;  }
  
  .shadow {
  	border:1px solid black;
	background:#FFFFFF;
  	-o-box-shadow: 5px 5px 2px #888;
	-icab-box-shadow: 5px 5px 2px #888;
	-khtml-box-shadow: 5px 5px 2px #888;
	-moz-box-shadow: 5px 5px 2px #888;
	-webkit-box-shadow: 5px 5px 2px #888;
	box-shadow: 5px 5px 2px #888;
	}
	
	.frame {
	display:none;
}

  
 /***
  * basic formatting styles for content 
  ***/
 .copy h2 {font-size:22px; font-weight:bold; padding-bottom:25px;}
 .copy p, .copy ul { padding-bottom:15px;}
 .copy ul {padding-left:15px;}
 .copy h3 { font-size:14px; }
 .copy a {text-decoration:none;}
 .copy a:hover {text-decoration:underline;}
 .copy .para-list {padding-left:30px;margin-top:-12px; %padding-bottom:0;} /* use for bulleted lists that are part of a paragraph */
 .copy .mini {font-size:75%;}
 .copy h4 {padding-top:15px;}
 .copy .textfield { margin: 10px 20px 10px 10px;}
 .callout {font-weight: bold; font-style: italic;}
 
 .copy #logo {
 	position:absolute;
	left: 650px;
	top: -20px;
 }
 
 /* LEMON Colours */
 .blue { color:#6699cc;}
 .green { color:#99cc66;}
 .yellow { color:#ffcc00}
 .orange {color:#ff9933}
 .red {color:#ff6633;}
 
 /***
  * landing pages
  ***/
  .landing {padding:20px;}
  
/***
 * L3 pages. left nav + content
 ***/

 .content {
    margin: 30px 0 20px 0;
/*    background: url(leftnav-border.JPG) repeat-y #fff;*/
 }
    
 .leftnav, .content .copy { float: left; }
 .content:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
  }
  .content {
     %zoom:1;
 }
 .leftnav {
    width: 210px;   
  }
 .leftnav ul { list-style-type:none;}
 .leftnav .navhead { padding:2px 0; margin-bottom:13px;}
 .leftnav .navhead span {
    font-weight:bold;
    color:#000;
    display:block;
  }
 .leftnav ul ul a, .leftnav ul span { padding:0 20px; }
 .leftnav ul ul a {margin-left:10px;}
 .leftnav li {padding:2px;}
 .leftnav .selected { background-color:#ccf; }
 .leftnav .selected a, .leftnav .selected a:visited {color:#000;}
 .leftnav a {display:block; text-decoration:none;}
 .leftnav a:hover {text-decoration:underline;}
 
 .content .nojs {display:none;}
 .content .copy {
    padding: 0 20px;   
    width: 710px;
 }
 
.bookLink {
	float:right;
	padding: 20px 20px;
}
 
 /***
  * publications page 
  ***/
  .content-pub .col {
     float:left; 
     margin:0 10px; 
     %margin:0 8px;
     width:460px;
  }
  
 .item:after, .item-short:after {
      content: ".";
      display: block;
      height: 0;
      clear: both;
      visibility: hidden;
  }
  .item, .item-short {
     %zoom:1;
 }
 
 .content-pub h3 {
    font-size:18px;
    padding: 17px;
 }
   .content-pub .item, .content-pub .item-short {
      padding:15px;
      margin-bottom:20px;
      background-color:#ccc;
   }
   .content-pub .item { height:300px; }
   .content-put .item-short {padding-bottom:30px;}
   .content-pub .pubhead {
      font-size:14px;
      padding:11px 10px 12px 10px;  
      background: url(pub-header-gradient.jpg) no-repeat;
   }
   .item .inset, .item-short .inset {
         float:left;
         padding-right:30px;
   }
   .item .inset img, .item .inset a, .item-short .inset img, .item-short .inset a {display:block;}
   .item .inset a { margin-top:50px; }
   .item-short .inset a {margin-top:20px;}
   .item p, .item-short p {padding-bottom:10px;}

/***
 * buy page
 ***/
 .content-pub .checkout {
    text-align:right;
    font-size:14px; 
    padding:0 20px 15px 15px;
  }
 .content-pub .item-container {
    float:left; 
    width:300px; 
    margin-left:10px;
    %width:299px;
  }
  .row:after, .book:after, .booklet:after {
       content: ".";
       display: block;
       height: 0;
       clear: both;
       visibility: hidden;
   }
   .row, .book, .booklet {
      %zoom:1;
  }
  .row {
     margin: 0 20px 10px 2px;
  }   

 .book {
    background-color:#ccc;
    padding: 10px 10px 17px 10px;
    font-size:14px;
 }

.book img {float:left;padding-right:40px;}
.book span {display:block;padding-top:35px; font-weight:bold;}
.item-container .cart {padding: 20px 0 0 70px;}
.content-pub .intro {font-weight:bold; padding:0 10px 10px 20px}

 .booklet {
    background-color:#ccc;
    padding: 10px 10px 17px 10px;
    font-size:12px;
 }

.booklet img {float:left;padding-right:10px;}
.booklet label {display:block; padding-bottom:5px;}

/*** 
 * Community page 
 ***/
#community {
   background-color:#CCCCCC;
   border: 1px solid black;
   text-align: center;
   padding: 10px 10px 10px 10px;
   height: 400px;
   width: 560px;
}
   
.board {
    width:390px;
	height: 370px;
	position: absolute;
	left: 320px;
	top: 60px;
	background-color:#086ca2;
	text-align:center;
	padding-top: 6px;
	padding-left: 3px;
}
.communityboard {
	width: 380px;
	height: 350px;
	margin-top: 10px;
}
.communityboard a{ cursor:pointer;}
#left {float:left; width:85px; cursor:pointer; margin-top: 20px;}
#right { position:relative; left: 465px; top: -330px; margin-left:5px;  width:90px; cursor:pointer; margin-top:20px;}

.communityboard td{ height:105px; width:80px; }

.popupimage { float:left; margin-right: 20px;}
 #maxpage {  display:none;}
 
#backgroundPopup{  
  display:none;  
  position:fixed;  
  _position:absolute; /* hack for internet explorer 6*/  
  height:100%;  
  width:100%;  
  top:0;  
  left:0;  
  background: #CCCCCC;  
  border:1px solid #cecece;  
  z-index:1;  
  }  
.popupContact{  
  display:none;  
  position:fixed;  
  _position:absolute; /* hack for internet explorer 6*/  
  height:384px;  
  width:408px;  
  background:#FFFFFF;  
  border:2px solid #cecece;  
  z-index:2;  
  padding:12px;  
  font-size:13px;  
  }  
.popupContact  h1{  
  text-align:left;  
  color:#6FA5FD;  
  font-size:22px;  
  font-weight:700;  
  border-bottom:1px dotted #D3D3D3;  
  padding-bottom:2px;  
  margin-bottom:20px;  
  }  
.popupContactClose{  
  font-size:14px;  
  line-height:14px;  
  right:6px;  
  top:4px;  
  position:absolute;  
  color:#6fa5fd;  
  font-weight:700;  
  display:block; 
  cursor:pointer; 
  }  
  
  /* Events Pages */
.infoblock {background-color:#ccc; padding:10px 10px;}
.lemonbkgrnd { background: url(../images/sidelemon.jpg) no-repeat right;}
.lemons {text-align:center;}