/**
 * screen.css
 *
 * Style and class Definition file.
 * All the style defined in this file are used
 * for displaying on screen.
 *
 * @version 	1.0
 * @author 	A.J. de Vries
 * @package	www.floramarkt.nl
 *
 *
 * #HEX colors used for development:
 *
 * blue_bg		#009bce
 * 
 * diveka_bg		#7586c6
 *
 * green_title		#0c4b36
 *
 * green_bg		#54b94a
 * green_even_dark	#bcdeaf
 * green_odd_light 	#dcedd5
 *
 * green_cont_bg	#9db339
 * green_cont_even_dark	#d4daa8
 * green_cont_odd_light	#e7e9cf
 *
 * orange_bg		#df8227
 * orange_even_dark	#f1c69c
 * orange_odd_light	#f6dfc9
 *
 * red			#ee3224
 *
 * purple_bg		#a07bb7
 * purple_even_dark	#d1c2e0
 * purple_odd_light	#d1c2e0
 *
 * grey_bg		#a1a0a4
 * grey_even_dark	#d7d7d9
 * grey_odd_light	#e9e9ea		
 *
 */ 
html, body {
	margin: 0;
	width: 100%;
	height: 100%;
	overflow: yes;	
	background: #fff;
}

body, th, td, p, div {
	border: 0px;
	font-size: 10pt;
	font-family: Helvetica;
}

.red {
	color:#ee3224;
	text-align: justify;
}

b.black-b {
	color:#0f3a21; 
	font-size:14px;
}


a, a:link, a:visited, a:active {
	color: #fff;
	text-decoration: none;
}

a:hover {
	color: #fff;
	text-decoration: underline;
}

a.pageindex, a.pageindex:link, a.pageindex:visited, a.pageindex:active, a.pageindex:hover {
	color: #fff;
	font-weight:bold;	
	text-decoration: underline;
}

.pageindex b {
	text-decoration:none;
}


a.darklink, a.darklink:link, a.darklink:visited, a.darklink:active {
	color: #0f3a21;
	text-decoration: underline;
}

a.darklink:hover {
	color: #0f3a21;
	text-decoration: underline;
}


b.headtitle, a.sort, a.sort:link, a.sort:visited, a.sort:active, a.sort:hover {
	color: #0f3a21;
	font-size:14px;
	font-weight:bold;
	line-height:35px;
	padding:4px 0px 4px 0px;
	/*text-transform:uppercase;*/
	text-decoration: underline;
}

a.clicked-asc, a.clicked-asc:link, a.clicked-asc:visited, a.clicked-asc:active, a.clicked-asc:hover {
	color: #0f3a21;
	font-size:14px;
	font-weight:bold;
	line-height:35px;
	padding:4px 25px 4px 0px;
	/*text-transform:uppercase;*/
	text-decoration: underline;
	background: url('/pics/asc.gif') 95% center no-repeat;
}


a.clicked-desc, a.clicked-desc:link, a.clicked-desc:visited, a.clicked-desc:active, a.clicked-desc:hover {
	color: #0f3a21;
	font-size:14px;
	font-weight:bold;
	line-height:35px;
	padding:4px 25px 4px 0px;
	/*text-transform:uppercase;*/
	text-decoration: underline;
	background: url('/pics/desc.gif') 95% center no-repeat;
}

td#zoekDiv {
	height:220px;
}



h4, h5 {
	margin: 0px;
	color: #0f3a21;	
	font-size: 14pt;	
	font-family: Helvetica;
	text-transform: lowercase;	
}

h6 {
	margin: 0px;
	color: #0f3a21;	
	font-size: 10pt;	
	font-family: Helvetica;
	text-transform: lowercase;
}

form {
	margin:0px;
	width: auto;
	height:100%;
}

ul {
	margin:0px;
	padding-left:22px;
}

input, textarea, select, option {
	font-size: 10pt;
	font-family: Arial, Helvetica, Sans-serif;
}

select {
	width: 180px;
}

option.defaultoption {
	color: #fff;
	background: #ee3224;
}

input.redbutton {
	color: #fff;
	border: 0px;
	width: 25px;
	height: 20px;
	font-size: 8pt;
	background: #ee3224;
	font-weight: bold;
	text-transform: uppercase;
}

input.bigredbutton {
	color: #fff;
	border: 0px;
	height: 20px;
	font-size: 8pt;
	background: #ee3224;
	font-weight: bold;
}

input.greenbutton {
	border: 0px;
	width: 60px;
	color: #fff;
	background: #0c4b36;
}


img {
	border: 0px;
}

img.hide {
	display: none;
}

img.greenborder {
	border: 1px solid #0f3a21;
}

img.thumbnail {
	cursor: hand;
	border: 1px solid #0f3a21;	
}


td#header b {
	right:250px;
	position:relative;
}

td#header h4#visitors_online {
	right:20px;
	float:right;
	font-size:13px;
	position:absolute;
	/*text-transform:uppercase;*/
}

html>body td#header h4#visitors_online {
	top:15px;
}


/**
 * Tables styles and classes
 * These styles and classes define
 * the layout of the different parts 
 * in www.floramarkt.nl
 */
table.floramarkt {
	width: 100%;
	height: 100%;
	background: #fff;
}

table.bgblue, tr.bgblue, td.bgblue {
	background: #009bce;
}

body.bgblue {
	width:100%;
	height:100%;
	background: #d6ebf6;
}

tr.bgblue-odd {
	height: 25px;
	background: #d6ebf6;
}

tr.bgblue-even {
	height: 25px;
	background: #a1d0ea;
}


/*** diveka classes ***/
table.diveka {
	width: 92%;
	height: 450px;	
	margin-left: auto;
	margin-right: auto;
	background: #7586c6;	
	border: 1px solid #7586c6;
}

table.bgdiveka, tr.bgdiveka, td.bgdiveka {
	background: #7586c6;
}

body.bgdiveka {
	width:100%;
	height:100%;
	background: #7586c6;
}

tr.bgdiveka-odd {
	height: 25px;
	background: #c9ceec;
}

tr.bgdiveka-even {
	height: 25px;
	background: #899dd2;
}


table.bgpurple, tr.bgpurple, td.bgpurple {
	background: #a07bb7;
}

body.bgpurple {
	width:100%;
	height:100%;
	background: #eae3ed;
}

tr.bgpurple-odd {
	height: 25px;
	background: #d1c2e0;
}

tr.bgpurple-even {
	height: 25px;
	background: #eae3ed;
}

table.bgorange, tr.bgorange, td.bgorange {
	background: #df8227; 
}

body.bgorange {
	width:100%;
	height:100%;
	background: #f1c69c;
}

tr.bgorange-odd {
	height: 25px;
	background: #f6dfc9;
}

tr.bgorange-even {
	height: 25px;
	background: #f1c69c;
}

table.bgdarkgreen, tr.bgdarkgreen, td.bgdarkgreen {
	background: #0f3a21;
}

td.bgdarkgreen-odd {
	color: #fff;
	font-weight: bold;
	background: #0f3a21;
	padding-left: 5px;
}

td.bgdarkgreen-even {
	color: #fff;
	font-weight: bold;
	background: #045e5c;
	padding-left: 5px;
}

table.bggreen, tr.bggreen, td.bggreen {
	background: #54b94a;
}

body.bggreen {
	width:100%;
	height:100%;
	background: #bcdeaf;
}

tr.bggreen-odd {
	height:25px;
	background: #dcedd5;
}

tr.bggreen-even {
	height:25px;
	background: #bcdeaf;
}

table.bghellgreen, tr.bghellgreen, td.bghellgreen {
	background: #9db339;
}

table.bgwhite, tr.bgwhite, td.bgwhite {
	background: #fff;
}

body.bggrey, table.bggrey, tr.bggrey, td.bggrey {
	background: #a1a0a4;
}

tr.bggrey-even {
	height:25px;
	background: #d7d7d9;
}

tr.bggrey-odd {
	height:25px;
	background: #e9e9ea;
}

table.banner, tr.banner, td.banner {
	background: #a1a0a4;
}

td.txtbanner {
	color: #000;	
	background: yellow;
}

b.txtbanner-small {
	font-size: 14pt;
}

b.txtbanner-large {
	font-size: 10pt;
}

tr.imgbanner, td.imgbanner {
	background: #fff;
}

table.introduction {
	width: 92%;
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	background: #fff;	
	border: 1px solid #009bce;
}

table.links {
	width: 92%;
	height: 450px;	
	margin-left: auto;
	margin-right: auto;
	background: #009bce;	
	border: 1px solid #009bce;
}

html>body table.links {
	height:auto;
}

table.tailers {
	width: 92%;
	height: 450px;	
	margin-left: auto;
	margin-right: auto;
	background: #009bce;	
	border: 1px solid #009bce;
}

html>body table.tailers {
	height:auto;
}

table.activities {
	width: 92%;
	height: 450px;	
	margin-left: auto;
	margin-right: auto;
	background: #a07bb7;	
	border: 1px solid #a07bb7;
}

html>body table.activities {
	height:auto;
}

table.bookmarks {
	width: 92%;
	height: 450px;
	margin-left: auto;
	margin-right: auto;
	background: #a07bb7;	
	border: 1px solid #a07bb7;
}

html>body table.bookmarks {
	height:auto;
}


table.extendedsearch {
	width: 183px;
	/*width: 200px;*/
	/*height:455px;*/
	height:auto;
	background: #e9e9ea;
}

html>body table.extendedsearch {
	width:100%;	
}


table.asked {
	width: 92%;
	height:expression((document.body.offsetHeight) + 30);
	background: #fff;
	margin-top: 0px;	
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	border: 1px solid #df8227;	
}
html>body table.asked {
	height:auto;
}


div#banners {
	width: 92%;
	height:80px;
	text-align:left;
	background: #fff;
	margin-top:20px;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #0f3a21;
}
html>body div#banners {
}

table.offered {
	width: 92%;
	height:expression((document.body.offsetHeight) + 30);
	background: #fff;	
	margin-left: auto;
	margin-right: auto;	
	border: 1px solid #54b94a;
}
html>body table.offered {
	height:auto;
}


table.products {
	width: 100%;
}

td.imageframe {
	background: #a1a0a4;
}

div#previewimage {
	top: 0px;
	right: 100px;
	width: 200px;
	height: 220px;	
	position: absolute;
}

div#thumbnails {
	top: 52px;
	right: 8px;
	width: 70px;
	height: 152px;	
	position: absolute;
}

div#thanks {
	width: 80%;
	height: 50px;	
	margin-top: 100px;	
	margin-left: auto;
	margin-right: auto;
	background: #fff;
	border: 1px solid #0f3a21;
}

table.contact {
	width: 92%;
	height: 200px;
	background: #fff;	
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #9db339;
}

.contact tr.bghellgreen-even {
	background: #d4daa8
}

.contact tr.bghellgreen-odd {
	background: #e7e9cf
}	

table.help {
	width: 92%;
	height: 100px;
	background: #a1a0a4;	
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #a1a0a4;
}

table.logintable {
	width: 300px;
	height: 120px;
	background: #e9e9ea;
}

td.login {
	color: #fff;
	cursor: hand;
	padding-left: 10px;	
	background:#ee3224;	
}

div#loginscreen {
	top: 74px;
	right: 0px;
	width: 300px;
	height: 120px;	
	display: none;
	overflow: hidden;
	position: absolute;
	border: solid #0f3a21 1px;	
}


td.justify, p.justify {
	text-align: justify;	
}


/**
 * Padding and margin
 * classes
 */
td.padding-left5 {
 	padding-left: 5px;
}

td.padding-left10 {
	padding-left: 10px;
}

td.padding-right10 {
	padding-right: 10px;
}

td.padding-right30 {
	padding-right: 30px;
}

td.padding-lr10 {
	padding-left: 10px;
	padding-right: 10px;
}

td.padding-top10 {
	padding-top: 10px;
}


/**
 * Frameless popup styles and classes
 */
.popup {
	z-index: 10;
	position:absolute;
	border:1px solid black;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#777777,Direction=135,Strength=3);
}

.popupCaption {
	width:100%;
	cursor: move;
	background-color:#0c2e82;	
}

/*
.popupCaption td {
	color: #fff;
	font-size: 15pt;
	text-align: left;
	font-weight: 600;
	line-height: 120%;	
	letter-spacing: -1px;
	text-transform: lowercase;
	font-family:"Arial Narrow";
}
*/

.ptr {
	cursor: hand;
	cursor: pointer;	
}

/**
 * Form validation classes
 */
.fv-req {
	background-color: #f6dfc9;
}

.fv-forget {
	background-color: #f6dfc9;
	border: 2px solid #ee3224;
}

.fv-syntax {
	background-color: #f6dfc9;
	border: 2px solid #ee3224;
} 

td#zoekDiv select, td#zoekDiv input {
	font-size: 8pt;
}