/*
------------------------------------------------
Levis algemene stylesheet

Overview: * ~General
		  * ~Structure
		  * ~Links
		  * ~Headings
		  * ~Titles
		  * ~Text
		  * ~Images
		  * ~Lists
		  * ~Forms
		  * ~Error message
------------------------------------------------ */



/*  ~GENERAL
------------------------------------------------*/
body {
	margin: 0;
	padding: 0;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#666666;
	line-height:18px;
}

* {
	margin: 0;
	padding: 0;
}

html, body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}


#wrap {
	width: 776px;
	margin: 0 auto;                     /* auto centers the div */
	text-align: left;
}

#surround {
	width: 100%; 
	margin-left: 0;
	margin-right: 0;
	background-image: url(../_images/bottom_bg.gif);
	background-position: bottom;
	background-repeat: repeat-x;
}

/*  ~STRUCTURE
------------------------------------------------*/
#footer {
	clear: both;
	width: 776px;
	height: 38px;
}

#foot_center {
	width: 572px;
	height: 28px;
	background-image: url(../_images/bottom_bg_center.gif);
	float: left;
	background-repeat: no-repeat;
	text-align: left;
	padding: 10px 0 0 10px;
}

#foot_right {
	width: 193px;
	height: 28px;
	background-image: url(../_images/bottom_bg_right.gif);
	float: left;
	background-repeat: no-repeat;
	text-align: left;
	padding: 10px 0 0 0;
	font-size: 11px;
}

table.foot_table td{
	padding: 0 5px;
	}

#main, #navigation {
	padding-top: 0;
	padding-bottom: 0px;
}

#main { 
	float: left;
	width: 596px;
	margin: 0;
	padding: 0;
}

#menu {
	position: relative;
	width: 180px;
}

* html #navigation { /* addressing some IE bugs */
	width: 180px;
	margin-top: 0;
}

* html #navigation, * html #nav, * html #content {
	overflow:hidden;
}


* html #wrap, * html #middle {
	height: 100%;                       /* for IE because it doesn't do min-height */
}

#content {
	position: relative;
	float: right;
	width: 596px;
	margin: 0;
	padding: 0;
}

#navigation {
	position: relative;
	float: right;
	width: 180px;
	text-align:left;
	margin-right: -198px;
}

#middle {
	position: relative;
	width: 596px;
	height: auto;
	min-height: 100%;                   /* for modern browsers, to push the footer down */
	margin-bottom: 0px;                /* height of footer */
	border-color: #fff;
	border-left: 0px solid #999;        /* width and background of left column */
	background-image: url(/_images/bg_ratio.gif);
	background-position: left; 
	background-repeat:repeat-y;
}

* html #wrap, * html #middle {
	height: 100%;                       /* for IE because it doesn't do min-height */
}

#content #contentLeft {
    width: 139px;
    float: left;
	line-height: 15px;
}

#content #contentRight p {
	padding: 0 20px 0 20px;
}

#content #contentRightRatio {
    width: 447px;
    padding-left: 10px;
    float: left;
	overflow: hidden;
}

#contentLeft a.white:link, #contentLeft a.white, #contentLeft a.white:hover, #contentLeft a.white:visited, #contentLeft a.white:active {
	color:#FFF
}

#contentLeft table {
	margin: 25px 0 0 15px;
}

#ratioHome {
	width:89px;
	height:46px;
	background-color:#b2b2b2;
	padding: 25px 0 0 50px;
	border-bottom: 3px solid #FFF;
}

/*  ~LINKS
------------------------------------------------*/
a, a:link, a:active, a:visited	{color: #656565;}
a:hover	{color: #336699;}

a.smallmenu, a.smallmenu:link, a.smallmenu:visited {text-decoration: none;font-size: 11px;}
a.smallmenu:hover {text-decoration: underline;font-size: 11px;}

a.home, a.home:link, a.home:visited {text-decoration: none;font-weight:bold;color: #fff;}
a.home:hover {text-decoration: none;color: #fff;font-weight:bold;}

/*  ~TITLES
------------------------------------------------*/
#titleRegion  {		/* titels van de regio bij Colores del Mundo */
	width:100%;
	margin: 0;
	padding:0;
}

h4 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	font-weight: bold;
	color:#99A84B;
}

h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:normal;
	color:#666666;
	padding:0;
}
h2 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bold;
	color:#666666;
	padding:0;
}
h3 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#666666;
	padding:0 0 5px 0;
	margin:0;
}

h5 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	color:#336699;
	padding:0;
	margin:0;
}

/*  ~TEXT
------------------------------------------------*/
p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height:18px;
}

p.menusubtit{
	padding-top: 4px;
	padding-bottom: 7px;
}

.tipTitle  {
	font-size: 11px;
	font-weight: bold;
	color: #656565;
	margin-bottom: 0px;
	line-height:14px;
}

.tipText  {
	font-size: 10px;
	color: #656565;
	line-height: 12px;
	margin-bottom: 0px;
}

.subnavText  {
	margin-bottom: 0px;
	font-size: 10px;
	color: #fff;
}

.txtSmall {
	font-size: 11px;
	margin: 0;
	padding: 0;
}

.txtSmall_cursiv {
	font-size: 11px;
	font-style: italic;
	margin: 0;
	padding: 0;
}

.foottext{
	margin: 0;
	margin-top: 9px;
	font-size: 11px;
}

.center{
	text-align: center;
	width: 100%;
}

/*	~ERRORMESSAGE 
------------------------------------------------*/
#error {
	position:absolute;
	top:0px;
	z-index:200;
	visibility:hidden;
	width:177px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	display:none;
}

#errorbox {
	vertical-align:top;
	background-color:#336699;
	padding:4px;
	color:#FFFFFF;
}
#errortxt {
	line-height:15px;
	padding:5px 15px 5px 7px;
}
#errorbox img {
	margin: 0 0 0 5px;
}

#errorshadow {
	height:7px;
	background-image:URL(/_images/error_dropshadow.png);
	background-repeat:repeat-x;
}



/*  ~IMAGES
------------------------------------------------*/
img {
    border: 0;
}

.subnavImg {
	border-bottom: 1px solid #D7D7D8;
}

/*  ~OTHER
------------------------------------------------*/

#greyHead {
	background: top left no-repeat;
	width:558px;
	height:43px;
	position: relative;
	padding: 30px 0 0 23px;
}

.ddcalculator {
	font-size: 9px;
	width: 250px;
}

/*  ~SITEMAP
------------------------------------------------*/
ul,li {
	list-style-type: none;
	list-style-image:  url(/ratio/storelocator/_images/icoon-bullet1.gif);
	margin: 0px 0 0 15px;
	padding: 3px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #666666;
}
ul#emo {
	margin-top:10px;
	}
ul#ratio, ul#foot {
	margin-top:30px;
	}
	
li#title1 {
	font-size:12px;
	font-weight:bold;
	}

/*  ~FORMS
------------------------------------------------*/
input.field  {
	font-size:9px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid #CCCCCC;
}

input.contact {
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid #CCCCCC;
	width: 150px;
	padding: 2px;
}

/*    UL
------------------------------------------------ */
ul,li {
	list-style-type: none;
	list-style-image:  url(/ratio/storelocator/_images/icoon-bullet1.gif);
	padding: 6px 0 0px 0;
	margin: 0px 0 0 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #666666;
}
ul#bullet001, ul#bullet001 li {
	list-style-type: none;
	list-style-image:  url(/ratio/storelocator/_images/icoon-bullet1.gif);
	padding: 6px 0 0 0;
	margin: 0 0 0 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #666666;
}
input.txtfieldM, select.selfieldM {   /* velden medium */
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width:125px;
	color:#666666;
	padding:1px 1px 0px 3px;
}
input.txtfieldXS, select.selfieldXS {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	width:35px;
	color:#666666;
	padding:1px 1px 0px 3px;
}
input.txtFieldNoBorder {
	font-family:Arial, Helvetica, sans-serif;
	border:0px;
	font-size:10px;
	width:35px;
	color:#666666;
	background-color:Transparent;
	padding:1px 1px 0px 3px;
}
form {
	padding:0;
	margin:0;
}


/* LAST MODIFICATIONS
----------------------------------------------- */
.color-text{color:#4170a0;}
.date{color:#4170a0; font-size:11px; padding:0 0 0 15px;}
.arrow-title{background:url(../_images/arrow_title.gif) left 5px no-repeat; padding:0 0 0 15px;}
.float-left{float:left;}
.img-margin{margin:0 10px 10px 0;}
a.arrow-link{background: url(../_images/_icone/icon_002.gif) left top no-repeat; padding:0 0 0 35px;}