/*  

Theme Name: Nautica-magazine

Theme URI: http://max.limpag.com/

Description: WordPress theme based on Nautica 5 for webzines.

Version: 1.0

Author: OpenSourceTemplates, ported by Max Limpag

Author URI: http://max.limpag.com/



	Nautica-magazine is based on the excellent Nautica 5 open source template at www.opensourcetemplates.org. This is not a blogging template. You need to edit index.php to make the template work for your site. For instructions, read the included README.TXT file.

	

*/



/*********************************************************

   HTML Elements

 *********************************************************/



html,

body {

  height: 100%;

}



body {

  margin: 0;

  padding: 0;

  text-align: center;

  background: url(./images/light_body.jpg) repeat-y top center;

  font-size: 80%;

  font-family:  verdana, arial, sans-serif;

  line-height: 170%;

  

  color: #555;

}





/* Headers */

h1, h2, h3, h4, h5, h6 {

  margin: 0 0 10px 0;

  padding: 0;

}





h1 {

  padding-bottom: 0.2em;

  font: 400 1.6em arial, sans-serif;

  color: #536C71;

  border-bottom: 12px solid #ddd;

}



h2 {

  font-size: 2em;

  color: #586B7A;

  line-height: 1.2em;

}



h3 {

  font-variant:small-caps;

  font-size: 1em;

  color: #5D6F73;

}



h4 {

  font-size: 0.85em;

}



h5 {

  font-size: 0.8em;

}





/* Needed to horizontally pad in a coloured container */

.horzPad h1,

.horzPad h2,

.horzPad h3,

.horzPad h4,

.horzPad h5,

.horzPad p {

  padding-left: 5px;

  padding-right: 5px;

}



/* Links */

a {

  text-decoration: none;

  color: #3B5D77;

}



a:hover {

  color: #668FA3;

}



a img {

  border: 0;

}



a img.border {  

  border: 1px solid #FC3307;

}



a:hover img.border {  

  /* Fixes IE bug - IE doesn't correctly apply the style on a:hover so need to mask it */

  border: 1px solid #668FA3 !important;

  border: 1px solid #FC3307;

}







/* Images */

img.floatRight {

  margin: 5px 0 10px 10px;

}



img.floatLeft {

  margin: 5px 10px 10px 0;

}



img.logo {
	text-align:center;
	margin:0 auto 10px auto;
	padding-top:10px;
	border-top:1px solid #ccc;
}



/* Lists */

ul li {

  list-style-image: url(./images/submenu1.gif);

line-height: 1.4em;

}



ol li {

  font-weight: bold;

  color: #668FA3;

}



ol li span {

  font-weight: normal;

  color: #444;

}







/* Blockquote */

blockquote {

  margin: 0;

  padding: 0 20px;

  background: #E7F1F3;

  border-top: 1px solid #AAD3DB;

  border-bottom: 1px solid #AAD3DB;

}







/**************************************************************

   Form Elements

 **************************************************************/



form {

  padding: 0;

  margin: 0;

}



/* If you're finding the input elements get pushed down, increase the width */

label {

  width: 25%;

  vertical-align: top;

}



input,

textarea,

select {

  padding: 1px;

  font: 400 1em verdana, sans-serif;

  color: #999;

  background: #EEE;

  border: 1px solid #CCC;

}



input:focus,

input:hover,

textarea:focus,

textarea:hover,

select:focus,

select:hover {

  color: #000;

  background: #E7F1F3;

  border: 1px solid #888;

}



input.noBorder,

input:focus.noBorder,

input:hover.noBorder {

  padding: 0;

  border: 0;

}



input.button {

  padding: 2px 5px;



  font: 400 0.9em verdana, serif;

  cursor: pointer;



  color: #fff;

  background: #FC3307;

  border-width: 1px;

  border-style: solid;

  border-color: #FF7800 #691300 #691300 #FF7800;

}



input.radio {

  background: none;

  border: 0px;

}







 

/**************************************************************

   All page content except for footer

 **************************************************************/



#content {

  position: relative;

  height: auto !important;

  height: 100%;

  min-height: 100%;
  
}







/**************************************************************

   Topbar with newsletter form and theme change buttons

 **************************************************************/



#topbar {

  float: left;

  width: 100%;

  padding: 0.6em 0;



  font-size: 0.9em;

  text-transform: uppercase;



  color: #CFD9DB;

  background: #FFF url(./images/topbar.gif) repeat-x bottom left;

}







/**************************************************************

   Top menu and logo

 **************************************************************/



#header {

	clear: both;

	position: relative;

	height: 5em;

	margin: 0 auto;

	background: #48525B url(./images/header.png) repeat-x bottom left;

	border-bottom: 2px solid #48525B;

	background-color: #48525B;

}


#header h1 {
	float:left;
	padding:0;
	margin:10px 0 0 10px;
	color:#fff;
	border:0;
	font-weight:bold;
	font-size:30px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-variant:small-caps;
}

#header h2 {
	float:right;
	padding:0;
	margin:5px 0 0 0;
	color:#eff;
	border:0;
	font-weight:normal;
	font-size:15px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}


#header img {

  position: absolute;

  top: 5%;

  left: 10px;

}



#header ul {

  margin: 3.5em 1em 0 0 !important;

  margin: 3.5em 0.5em 0 0;

  padding: 0;

  float: right;

}



#header ul li {

  display: inline;

  list-style: none;

}



#header ul li a {

  float: left;

  padding: 0 1em;

  font: 400 1.1em arial, sans-serif;

  letter-spacing: 0.1em;

  line-height: 0.8em !important;

  line-height: 1em;



  color: #cccccc;

  border-right: 1px solid #4D5760;

}



#header ul li a.last {

  padding-right: 0;

  border-right: 0;

}



#header ul li a:hover {

  color: #3B5D77;

}

#header ul li img {
	display:inline;
	position:relative;
}





/**************************************************************

   Header Image/Flash Movie

 **************************************************************/



#headerImg {

  margin: 0 auto;

  height: 111px;

  background: url(./images/header_image.jpg) no-repeat top left;
  
  border-bottom: 2px solid #48525B;
  margin-bottom:10px;

}


/**************************************************************

   Top Block Menu

 **************************************************************/



#menu {

  margin: 0 auto;

}



#menu ul {

  width: 100%;

  float: left;

  margin: 0;

  padding: 0;



  text-align: left;

  background: #3B5D77 url(./images/menu.png) repeat-x top left;

}



#menu ul li {

  display: inline;

  margin: 0;

  padding: 0;

  list-style: none;

}



#menu ul li a {

  float: left;

  width: 25%;

  height: 4.5em;

  font: 400 1.2em arial, sans-serif;

  letter-spacing: 0.1em;

  color: #fff;

  border-top: 7px solid #41637D;

  border-bottom: 15px solid #FFF;

  overflow: hidden;

}



#menu ul li a span {

  display: block;

  padding: 2px 7px;

}





#menu ul li a span.desc {

  font-size: 0.8em;

  color: #aCaDb4;

}





#menu ul li a:hover,

#menu ul li a.here {

  background: #4A5C6A;

  border-top: 7px solid #455660;

}



#menu ul li a:hover span.desc,

#menu ul li a.here span.desc {

  color: #FFF;

}




#bottomcontent {
	clear:left;
	width:73%;
	}

#bottomleft {
	float:left;
	width:48%;
	}
	
#bottomright {
	float:left;
	width:48%;
	}	

/**************************************************************

   Page Content

 **************************************************************/



#page {

  clear: both;

  float: left;

  width: 100%;

  margin-bottom: 1em;

  text-align: left;


}



#columns {

  margin: 0 auto;

}





/* Column widths */

.width {

  width: 776px;

}



.widthPad {

  width: 746px;

}

.width15 {width:14%;}

.width20 {width:19%;}

.width25 {

  width: 24%;

}

.width37 {
	width:37%;
}

.width50 {

  width: 48%;
}

.width55 {width:54%;}

.width60 {width:59%;}




.width73 {

  width: 73%;

}



.width75 {

  width: 75%;

}



.width100 {

  width: 100%;

}



/**************************************************************

   Footer

 **************************************************************/





#footer {

  clear: both;

  float: left;

  width: 100%;

  height: 50px;
  
  color:#fff;

}

#footer a {color:#fff;text-align:right;}



#footer #bg {

  position: relative;

  height: 40px;

  margin: 0 auto;
  
    padding-top:10px;


  background: #49525B url(./images/header.png) repeat-x top left;

}



#footer #bg ul {

  float: right;

  margin: 3em 1em 0 0 !important;

  margin: 3em 0.5em 0 0;

  padding: 0;

}



#footer #bg ul li {

  display: inline;

  list-style: none;

}



#footer #bg ul li a {

  float: left;

  padding: .5em 1em;



  font: 400 1em arial, sans-serif;

  letter-spacing: 0.1em;

  line-height: 0.8em !important;

  line-height: 1em;



  color: #4D5760;

  border-right: 1px solid #4D5760;

}



#footer #bg ul li a.last {

  padding-right: 0;

  border-right: 0;

}



#footer #bg ul li a:hover {

  color: #ddd;

}



#footer #bg img {

  position: absolute;

  top: 6%;

  left: 10px;

}

/**************************************************************

   Sidebar

 **************************************************************/

#sidebar {
border-bottom:1px solid #ccc;
}

#sidebar h3 {
margin-bottom:0;
padding-bottom:0;
}

#sidebar p {
margin-top:0;
margin-bottom:5px;
line-height:1.2em;
padding:10px;
background:#eee;
border:1px solid #4D5760;
}


/**************************************************************

   Posts

 **************************************************************/



.post {

  float: left;

  width: 100% !important;

  width: 99%;

  position: relative;

  margin-bottom: 1.5em;

  border-bottom: 1px solid #CCCCCC;
  
}



.banner {

  float: left;

  width: 100% !important;

  width: 99%;

  position: relative;

  padding-bottom: 0px;

  border-bottom: 2px solid #ddd;

  margin-bottom:5px;
}



.post .date {

  position: absolute;

  top: 0;

  left: 5px;

  width: 2.3em;

  text-align: right;

}



.post .date .month {

  text-transform: uppercase;

  font: 700 1.0em arial, sans-serif;

  color: #888;

}



.post .date .day {

  display: block;

  margin-top: -5px;

  font: 700 2.1em arial, sans-serif;

  color: #888;

}



.post .title {

  display: block;

  padding: 0 0 5px 0;



  font-size: 1.8em;

  font-weight: normal;

  color: #586B7A;

}



.post p {

  margin:0;

  padding:  0 0 1em 1em;

  border-left: 1px solid #CCCCCC;

}



/**************************************************************

   Thumbnail Lists

 **************************************************************/



ul.thumbs,

ul.thumbs li {
  margin: 0;
  padding: 0;
}

ul.thumbs li {
  margin: 0 0 10px 0 !important;
  padding: 0px;
  list-style: none;
}

ul.thumbs li img {
  border: 2px solid #ccc;
  text-align:center;
  padding:2px;
}

/**************************************************************

   Submenu Styles

 **************************************************************/



ul.submenu1, ul.ec3_events {

  margin: 0 0 10px 0;

  padding: 0;

}



ul.submenu1 li, ul.ec3_events li {

  margin: 0;

  padding: 0;

  list-style: none;

  list-style-image: url(foo.gif); /* because IE is balls */
  
}



ul.submenu1 li a, ul.ec3_events li a {

  display: block;

  height: auto !important;



  /* Start hide from IE Mac \*/

  height: 1%;

  /* End hide from IE Mac */



  padding: 1px 5px 1px 30px;
  
}



ul.submenu1 li a, ul.ec3_events li a {

  background: url(./images/submenu1.gif) no-repeat 15px 50%;

}



ul.submenu1 a:hover, ul.ec3_events a:hover {

  color: #426F85;

  background: #B3C6C4 url(./images/submenu1.gif) no-repeat 15px 50%;

}

ul.submenu1 li.current_page_item a {
	border-top:1px solid #536c71;
	border-bottom:1px solid #536c71;
	}

ul.submenu1 li.current_page_item  ul li a {
	border:0;
	}


ul.newsletters a {
text-decoration:underline;
}

/**************************************************************

   Photo captions

 **************************************************************/



.largecaptionleft {

  float: left;

  width: 500px;

  margin: 5px;

  padding: 5px;

  border: solid 1px #ddd;

  background: #E5F2FF;

  font-size:90%;

  line-height: 100%;

  font-style: italic;

  color: black;

  }



.largecaptionright {

  float: left;

  width: 500px;

  margin: 5px;

  padding: 5px;

  border: solid 1px #ddd;

  background: #E5F2FF;

  font-size:80%;

  line-height: 100%;

  font-style: italic;

  color: black;

  }



.smallcaptionleft {

  float: left;

  width: 250px;

  margin: 5px;

  padding: 5px;

  border: solid 1px #ddd;

  background: #E5F2FF;

  font-size:80%;

  line-height: 100%;

  font-style: italic;

  color: black;

  }



.smallcaptionright {

  float: right;

  margin: 5px;

  padding: 5px;

  width: 250px;

  border: solid 1px #ddd;

  background: #E5F2FF;

  font-size:80%;

  line-height: 100%;

  font-style: italic;

  color: black;

  }



/**************************************************************

   Generic Display 

 **************************************************************/





.block {

  display: block;

}



.clear {

  clear: both;

}

.clearLeft {
	clear:left;
}

.clearRight {
	clear:right;
}


.marginRight {

  margin-right: 15px;

}



.paddingLeft {

  padding-left: 5px;

}



.paddingRight {

  padding-right: 5px;

}

.paddingTop {
	padding-top:5px;
}

.paddingBottom {
	padding-bottom:5px;
}

.floatLeft {

  float: left;

}



.floatRight {

  float: right;

}



.alignLeft {

  text-align: left;

}



.alignRight {

  text-align: right;

}



.alignTop {

  vertical-align: top;

}



.alignMiddle {

  vertical-align: middle;

}



.alignBottom {

  vertical-align: bottom;

}



.lightBlueBg {

  background-color: #EAF2F5;

}



.dark {

  color: #353E47;

}

#eventstoggle {
	font-size:80%;
	font-style:italic;
	cursor:pointer;
	margin-left:15px;
	margin-top:0;
	}

/* Directors etc. Table Styles */
table.stripes {
	margin:0px auto 10px 0;
	width:100%;
	}
	
	table.stripes thead {
		color:#fff;
		background:#567;
		}

	table.stripes th {
		padding:3px;
		}
	
	table.stripes td {
		border-bottom:1px solid #666;
		margin:0;
		padding:3px;
		}
		
	table.stripes tr.alt td {
		background:#def;
		}
		
	table.stripes tr.over td {
		background:#bcd;
		}
		
/* Trading dock styles */
#navlist
{
padding: 3px;
margin-left: 0;
border: 1px solid #778;
background:#48525B;
font: bold 12px Verdana, sans-serif;
}

#navlist li
{
list-style: none;
margin: 0;
display: inline;
cursor:pointer;
}

#navlist li a
{
padding: 3px 0.5em;
margin-left: 3px;
border: 1px solid #778;
background: #DDE;
text-decoration: none;
}

#navlist li a:link { color: #448; }
#navlist li a:visited { color: #667; }

#navlist li a:hover
{
color: #000;
background: #ddd;
border-color: #227;
}

#navlist li a#current
{
background: white;
}

div.t1, div.t2, div.t3, div.t4 {
border:2px solid #ccc;
background:#eee;
padding:10px;
}


div.t1 img, div.t2 img, div.t3 img, div.t4 img {
float:right;
clear:right;
padding:3px;
border:1px solid #555;
margin:0 0 5px 5px;
}

/* Gallery styles */
.gallery {
width:480px;
padding:5px;
border:1px solid #666;
}

.gallery dl {
margin-bottom:0;
}

.gallery img, .gallery a img {
border: solid 1px #D9D9D9;
background: #ffffff;
padding: 4px;
}
.gallery a:hover img {
border-color: #666666;
background: #fff;
}

.album-link-box {
margin:5px 100px 15px;
padding:5px;
border:1px solid #666;
}

.album-link-box img {
padding:3px;
border:1px solid #999;
}