/* Style Sheets for winvestment website
TOC
	1. Defaults
	2. Structure
	3. Links and Navigation 
	4. Fonts
	5.

Notes
*/
 
/* -------------- 1. Defaults --------------------------- */
*{margin:0; padding:0;}
html, body
{
    height: 100%;
    padding: 0px;
    margin: 0px;
}

a img{border:0;}
ul{list-style-type:none; }

.left{float:left;}
.right{float:right;}
fieldset{border:none;}

header, section, footer,
aside, nav, article, figure {
	display: block;
}

/*
@font-face
{
font-family: 'calibrib';
src: url(calibrib.ttf);
}

@font-face
{
font-family: 'calibrii';
src: url(calibrii.ttf);

@font-face
{
font-family: 'calibriz';
src: url(calibriz.ttf);
}
}*/
@font-face
{
font-family: 'calibril';
src: url(calibril.ttf);
}
@font-face
{
font-family: 'custom';
src: url(calibri.ttf);
}



/* -------------- 2. Structure -------------------------- */
body{  background-color:#404040; letter-spacing:.5px; font:16px/22px 'calibril', Arial, Helvetica, sans-serif}

.wrapper {width:835px; margin:0 auto; position:relative; box-shadow: 29px -6px 20px #222222;}

.logo { position:fixed; text-indent:-10000px; display:block; margin-left:-151px; width:313px; height:54px; background: url(../images/winvestment_logo.gif) no-repeat left top; z-index:3}

.masterhead {}

.content{ background-color:#999/*#999*/}

.col_left, .col_right, .col_middle{ z-index:0;}


		.col_left {width:167px; position:fixed; background: url(../images/side-banner.png) -96px 54px; z-index:2;  min-height:719px}
	
		.col_left  div{ color: #FBC702;
    				float: left;
					font: bold 13px/24px Georgia,"Times New Roman",Times,serif;
					letter-spacing: 0.9px;
					top:70px;
					position:relative;
					left:-247px;
					width:300px;
					text-align:right;
					text-shadow: 4px 2px 4px #222222;}
					
	.col_left  img{position:relative; top:90px}
					
	.col_middle {float:left; position:relative; margin:54px 0 0 0; min-height:772px}
		.col_middle p{padding:10px 0 0 52px; width:145px; display:block; font-size:13px}
		
		
		
	.col_right {float:left; color: #FFF; padding: 77px 0 0;}
		.col_right ul{ list-style:disc outside; position:relative; padding-right:111px; left:37px}
		.col_right ul li{margin:10px 0; line-height:21px}
		
		
		.leadership .col_middle{background-color:#e4e1cd;  border-radius: 10px;  min-height:613px; padding:36px 15px 20px 85px;}
		.leadership .col_right{padding-left: 30px; width: 460px;}
		.leadership  .col_middle p {line-height:17px}
		
		.manufacturing .content{background:#999 url(../images/manufacturing1.jpg) no-repeat -144px 54px; }
		.manufacturing .col_right{ width: 400px; padding-left:415px}
		
		.port_operations .content{background:#999 url(../images/port_operations1.jpg) no-repeat 13px 54px; }
		.port_operations .col_right{ width: 340px; padding-left:475px;}
		
		.hospitality .content{background:#999 url(../images/hospitality1.jpg) no-repeat -71px 54px;}
		.hospitality .col_right{ width: 400px; padding-left:415px}
		
		.wholesaling .col_middle{ margin:0 20px 0 0;}
		.wholesaling .col_right{ width: 400px; padding-left:415px;}
		.wholesaling .content{ background:#999 url(../images/wholesale1.jpg) no-repeat 67px 54px;}
		
		.home .col_right{ text-align:center; width:694px; margin-left:140px}
		.home .col_right div{ float: right; background-color:#fff; margin-left:10px; padding: 37px; position: relative;  top: -21px;}
		.home p{font-size:14px; margin-bottom:19px; line-height:22px;width: 326px;}
		.home h1{font-size:38px}
		
		.retailing .col_right{width:660px; margin-left:140px;}
		.retailing .col_right ul{ padding-left:0px; padding-right: 0px;  left:-7px; list-style-position:outside;}
		.retailing .col_right div{left: -53px; overflow: hidden; position: relative; width: 740px; top:-23px}
		.retailing .col_right div img{float:left}
		
		.recreation .col_right{ width:600px; margin-left:140px}
		.recreation .col_right div.main_image{left: -53px; overflow: hidden; position: relative; width: 740px; top:-23px}
		.recreation .col_right div.sub_image{left:636px;  position: absolute; top: 183px; width: 190px; z-index:4}
		.recreation .col_right div.sub_image img{ margin-bottom:30px; box-shadow:11px 6px 16px #222222}
		
		.black_text, .white_text{ position:absolute;  z-index:5; opacity:.8; padding:15px}
		 .white_text{color:#fff; width:191px; left:141px; top:321px; background-color:#666; }
		 .black_text{color:#000; width:200px; left:384px; top:377px; background-color:#fff; }
		 
		 .black_text ul, .white_text ul{ position:relative; left:10px; list-style:disc outside;}


/* -------------- 3. Links and Navigation --------------- */
a {color:#fff; outline:none;}
a:hover{ text-decoration:none;}
/*top nav */
ul.navigation { 
background:#222 none;
padding:0;
list-style:none;
position:absolute;
top:0;
min-width: 749px;
right:0;
z-index:1
}

ul.navigation li{
float:left;
position:relative
}
ul.navigation li a{
    display: block;
	float:left;
	padding: 20px 15px;
	text-decoration:none;
	font:12px  Arial, Helvetica, sans-serif;
	overflow:hidden;
	color:#fff;
	letter-spacing:normal
}
ul.navigation li.first a{	padding: 20px 17px 20px 23px;}

ul.navigation ul{
position:absolute;
top:26px;
left:-100000px;
width:100px;
}
ul.navigation li:hover ul{left:0;}
ul.navigation ul li{background:#222 none; width:100px}
ul.navigation li.on a{ background-color:#666}
ul.navigation li a:hover{ background:#999 none;}


/* -------------- 4. Fonts ------------------------------ */

h1{ font: normal 24px  'custom', Verdana, Arial, Helvetica, sans-serif; text-shadow:4px 2px 4px #222222; margin-bottom:20px}
h2{ font: normal 24px  'custom', Verdana, Arial, Helvetica, sans-serif; text-shadow:4px 2px 4px #222222; margin-bottom:7px}
h3{font: normal 16px  'custom', Verdana, Arial, Helvetica, sans-serif; text-shadow:2px 1px 2px #222222; margin-bottom:7px}
p{}

/* -------------- 5.  ----------------------------- */



		
/* -------------- Hacks --------------------------------- */
.clearfix:before,
.clearfix:after {
    content:"";
    display:table;
}

.clearfix:after {
    clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.clearfix {
    *zoom:1;
}