/*
-- FindYourLogo General Style --
Description: CSS Stylesheet for layout and markup defenition of FindYourLogo
Author: Roy Berkeveld (royberkeveld@gmail.com, http://tnode.net)

-- Structural overview --
General Markup
Layout defenition
Special box defenitions
	In-screen image popup (lightbox)
	Logo Hover
	Specific Box overrides

-- Changelog --
2-8-2006 0:16:20 -Roy; Initial version released.
6-10-2006 - Joep: results box to 900 px
 darken bodytext and links, increased sizes of mini, added H3 (red,bold)
 17-02-2009 - Joep changed the colors from red to green.

*/

/* General markup */

body {
	font-family: Trebuchet, "Trebuchet MS", Arial, sans-serif;
	font-size: 9pt;
	font-style: normal;
	line-height: 12pt;
	color: #666;
	margin: 0px;
	padding: 0px;
}

h1, h2, h3, h4, h5, h6, h7 {
	padding: 0px;
	margin: 0px;
}
h1 {
	font-size: 10pt;
	font-weight: bold;
	line-height: 20px;
	color: #333333;
}
h2 {
	font-size: 9pt;
	font-weight: bold;
	line-height: 18px;
}

h3 {
	font-size: 9pt;
	font-weight: bold;
	color: #B4CC00;
}
p {
	margin: 10px 0px;
	padding: 0px;
}

acronym {
	font-size: 100%;
}

a:link {
	color: #333333;
}
a:visited {
	color: #B0B0B0;
}
a:hover {
	text-decoration: underline;
	color: #B4CC00;
}
a:active {
	text-decoration: none;
	color: #CCC;
}

a img {
	border: none;
}

strong {
	font-style: normal;
	font-weight: bold;
	color: #B4CC00;
}
em {
	font-weight: bold;
}
.mini {
	font-style: normal;
	font-size: 8pt;
	color: #666;
}
mini {
	font-style: normal;
	font-size: 7pt;
	color: #666;
}
.sideinfo {
	text-align: left;
}


ul#mainmenu li span, #footer ul span {
	font-weight: bold;
	color: #B4CC00;
	font-size: 10pt;
}
ul#mainmenu li, #footer ul li, #mainmenu .current, .current {
	color: #B4CC00;
}

#footer {
	color: #666666;

}
#footer p {
	font-size: 7pt;
}

/* List style defenition for the question list in the top faq page*/
.fylfaq 			{list-style-type:none; list-style-image: url(fyllist.gif); margin-left:15px; margin-top:0;margin-bottom:0;padding-left:0px; }

/* Layout defenition */

/* We have several layouts;
	- Without sidebars (no change)
	- With sidebars (190 px, 200px margins) - use class="sidebars" on body, divs sidebarone and sidebartwo define them (leave them out if you don't use them)
	- With only a left sidebar (190px, 200px left margin) - use class="leftsidebar" on body, div sidebarone defines it
	- With a single center column - use class="column" for main section
	- With dual center columns - use class="dualcolumn" containing 2 divs with class "column{one,two}"
	- With triple center columns - use class="triplecolumn" containing 3 divs with class "column{one,two,three}"

	Notes:
	Column layouts may be used and repeated in any combination.
	If you place content in a column, please make sure you do not overflow them as the content boxes will scale on Internet Explorer causing the boxes to be placed on top of each other rather than sideways
	Do not use floats in these boxes.
*/

#bodywrapper {
	width: 90%;
	margin: 0px auto;
	overflow: visible;
}

.column, .dualcolumn, .triplecolumn, #header, #footer, #mainmenu {
	text-align: center;
	margin-left: 0px;
	margin-right: 0px;
}
div.noidnt {
	padding-top: 0px;
	margin-top: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;	
}
.sidebars .column, .sidebars .dualcolumn, .sidebars .triplecolumn, .sidebars #header, .sidebars #footer, .sidebars #mainmenu {
	margin-left: 160px;
	margin-right: 160px;
}
.leftsidebar .column, .leftsidebar .dualcolumn, .leftsidebar .triplecolumn, .leftsidebar #header, .leftsidebar #footer, .leftsidebar #mainmenu {
	margin-left: 160px;
}
.column, .dualcolumn, .triplecolumn {
	text-align: left;
}
.column, .columnone .wrapper, .columntwo .wrapper, .columnthree .wrapper {
	padding: 10px 10px;
}
.dualcolumn .columnone, .dualcolumn .columntwo {
	float: left;
	width: 50%;
}
.dualcolumn .columnthree {
	display: none;
}
.triplecolumn .columnone, .triplecolumn .columntwo, .triplecolumn .columnthree {
	float: left;
	width: 33.3%;
}
#sidebarone, #sidebartwo {
	display: none;
}
.sidebars #sidebarone, .sidebars #sidebartwo, .leftsidebar #sidebarone {
	width: 150px;
	display: block;
	margin: 0px;
	padding: 10px 0px;
}
.sidebars #sidebarone, .leftsidebar #sidebarone {
	float: left;
	padding-right: 10px;
}
.sidebars #sidebartwo {
	float: right;
	padding-left: 10px;
}
ul#mainmenu, #footer ul {
	margin: 0px;
	padding: 0px;
}
ul#mainmenu li, #footer ul li {
	display: inline;
}
.clear {
	clear: both;
}

.middle {
	text-align: center;
}
.vspacer {
	height: 200px;
}

#stepinterface {
	z-index: 10;
	margin: 0px -50px 0px -50px;
}

/* In-screen image popup "lightbox" */
#lightbox {
	background-color:#fff;
	padding: 4px;
	border: 1px solid #999;
}
#lightboxDetails {
	padding-top: 0.4em;
}
#lightboxCaption {
	font-size: 10pt;
	font-weight: bold;
	line-height: 20px;
	color: #B4CC00;
	margin-top: -6px;
}
#lightbox img {
	clear: both;
}
#overlay {
	background-image: url(overlay.png);
}
#lightboxPurchase {
	margin: 0px auto;
	width: 435px;
}
#bigbackbutton {
	display: block;
	float: left;
	width: 125px;
	height: 38px;
	margin-right: 20px;
	background-repeat: no-repeat;
	background-image: url(langdepimg.php?button=back);
}
#bigbackbutton:hover {
	background-image: url(langdepimg.php?button=back_over);
}
#bigbackbutton:active {
	background-image: url(langdepimg.php?button=back_down);
}
#bigbuybutton {
	display: block;
	float: left;
	width: 125px;
	height: 38px;
	margin-right: 20px;
	background-repeat: no-repeat;
	background-image: url(langdepimg.php?button=buy);
}
#bigbuybutton:hover {
	background-image: url(langdepimg.php?button=buy_over);
}
#bigbuybutton:active {
	background-image: url(langdepimg.php?button=buy_down);
}
#bigtrybutton {
	display: block;
	float: left;
	width: 125px;
	height: 38px;
	margin-left: 20px;
	background-repeat: no-repeat;
	background-image: url(langdepimg.php?button=try);
}
#bigtrybutton:hover {
	background-image: url(langdepimg.php?button=try_over);
}
#bigtrybutton:active {
	background-image: url(langdepimg.php?button=try_down);
}


/* Logo hover */
#trailimageid {
	position: absolute;
	visibility: hidden;
	padding: 4px;
	background-color: #FFF;
	border: 1px solid #999;
}

#paymentimgline {
	text-align: center;
}
#paymentimgline img {
	display: inline;
}
#iteminfo {
	margin: 0px auto;
}

/* Specific box overrides */

.browselogobox {
	margin: 0px;
}

.customizeoptbox {
	float: left;
	text-align: center;
	margin-right: 40px;
	margin-bottom: 10px;
}
.customizeoptbox img {
	display: block;
}
.customizeoptbox select {
	width: 100px;
}
.customizedescription {
	width: 100%;
}

.inputfields {
	text-align: right;
}
.inputfields input {
	margin: 2px 0px;
}
.inputfields textarea {
	margin: 2px 0px;
}
label {
	display: block;
	float: left;
}
#customdesigndescription {
	width: 100%;
}

.searchbox {
	display: inline;
}
#resultslogobox {
	width: 900px;
	background-color: #DDD;
	margin: 10px auto;
	padding: 10px 0px;
}
#resultslogobox .logobox {
	float: left;
	display: block;
}
.logobox {
	display: inline;
	text-align: center;
	width: 180px;
	margin-bottom: 5px;
}