/* 

Print style for zog.nl
Million Pieces - November 2006

*/


/* =Structure                   */
/* default structure and layout */

#container {
  /*margin-left:auto;
  margin-right: auto;*/
  margin-top: 0;
  /*max-width: 1400px;
  min-width: 770px; *//*was: 790*/
  /*width: 1000px;*/
  color: black;
  width: 100%;
}

/* some magic, see for more information: http://www.positioniseverything.net/easyclearing.html */
#mainContainer:after {
  content: '[DO NOT LEAVE IT IS NOT REAL]'; 
  clear: both; 
  display: block; 
  height: 0; 
  visibility: hidden;
}
/* inline block is not a valid css attribute, it's only used to trick IE/Mac */
/* maybe this can go away since Microsoft tells mac users to stop using IE */
#mainContainer {
  display: inline-block;
}

/*\*/
* html #mainContainer {
  height: 1%;
}

#mainContainer {
  display: block;
}

/* */
#mainContainer {
  margin-top: 1%;
}

#contentBlock_wrapper {
  float: left;
  width: 100%;
}

#contentBlock {
  margin: 0 50px 0 20px;
  padding-top: 0px;
}


/* maybe merge these two extracontentblocks and set width with a class?*/
#extraContentBlock, #vote {
  background-color: #ffd643;
  float: right;
  margin-left: -100%;
  width: 150px;
  text-align: center;
  display: none;
}

#extraContentBlockSponsor {
  background-color: #ffd643;
  float: right;
  margin-left: -100%;
  width: 170px;
  text-align: left;
  display:none;
} 

* html #extraContentBlock {
  margin-left: -150px;
}

* html #extraContentBlockSponsor {
  margin-left: -170px;
}
  
/* =Header */
#header {
  background-color: #ffd643;
  background-image: url(../images/headerbackground.png);
  background-position: left top;
  background-repeat: repeat-y;
  height: 100px;
  overflow: hidden;
}

#headerLogo {
  float: left;
  margin: 0;
  padding: 0;
  display: none;
}

#headerText {
  color: black;
  font-family: "Times New Roman", Times, serif;
  font-size: 1.3em;
  float: left;
  margin-top: 0;
  margin-left: 1em;/*40px;*/
  padding-top: 1.0em;/*40px;*/
}

#headerPhoto {
  float: right;
  margin: 0;
  display: none;
}

/* =Header =Navigation */

#headerNavContainer {
  clear: right;
  margin: 0;
  padding: 0;
  display: none;
}

/* =Navigation */
#navlist {

  display: none;
}


/* =Structure =Logos */
#logos {
  display: none;
}

#google {
  display: none;
}

#taf {
  display: none;
}

#rss {
  display: none;
}

/* =Structure =Content */
#mainArticle {
  margin: 0px;
  padding: 0; 
  color: black;
}

#mainArticle p {
  margin-right: 2em;
}

#mainArticlebla {
  margin: 0px;
  padding: 0;
  margin-left: -100px;
}

#headlines {
  margin-top: 10px;
}

#highlights {
  padding: 0;
  width: 100%;
  clear: both;
}

#highlightLeft {
  float: left;
  margin-left: 0;
  margin-right: 5px;
  width: 55%;
  padding: 0 0 0 0;
  min-height: 10em;
}

#highlightRight {
  float: right;
  margin: 0;
  width: 40%;
}

img.highlight {
  float: left;
  margin-right: 5px;
  height: 106px;
  display: inline-block;
}

/* =Structure =ExtraBlock */
div.extra {
  text-align: center;
}

div.extra img {
  border: 1px solid #0d51a6;
}

/* =Error */
#errorpage {
  margin-left: 30%;
  margin-right: 30%;
  margin-top: 1em;
  width: 40%;
}

/* =Generic */

body {
  font-family:Arial,Helvetica,sans-serif;
  margin:2px;
  padding:0;
  color: black;
  font-size: 14pt;
}

h1, h2 {
  font-weight: bold;
  margin-top: 0px;
  padding: 0px;
  margin-bottom: 0.3em;
}

h1.article,
#mainArticle h1 {
  color: black;
  font-size: 1em;
  margin: 0 0 0.3em 0;
}

h2.article,
h2.faq,
#mainArticle h2 {
  color: black;
  font-size: 0.8em;/*12px;*/
  margin: 1px;
}

h2.faq {
  margin-top: 15px;
}

h3 {
  font-size: 0.75em;
  margin: 0;
}

h1.extra {
  color: black;
  font-size: 0.9em;/*14px;*/
  /*font-style: italic;*/
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 3px;
}

h2.extra {
  color: black; 
  font-size: 0.85em;/*14px;*/
  /*font-style: italic;*/
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 3px;
}

#extraContentBlock h3 a:hover {
  text-decoration: underline;
}

p.extra a:link,
p.extra a:visited {
  font-weight: bold;

  text-decoration: none;
  border: 0;
}

p.extra a:hover {
  font-weight: bold;

  text-decoration: underline;
}

div.article {
  display: inline;
  float:right;
  margin:24px 5px 5px 5px;
  padding: 0;
  text-align:center;
  width:210px;
}



div.form {
  display: inline;
  float:right;
  margin:0;
  padding: 0;
  text-align:center;
}

div.articleRight {
  display: inline;
  float:right;
  margin:23px 5px 5px 5px;
  padding: 0;
  width:210px;
}

div#europe {
  width:310px;
}

div#country {
  width:290px;
}

div.sponsorphoto {
  float:right;
  margin:0px 5px 50px 5px;
  padding: 0;
  text-align:center;
  width:240px;
  height: 300px;
}

img.article {
  border:1px solid #0d51a6;
}

img.icon {
  border:1px solid #0d51a6;
  clear: left;
  float: left;
  margin-top: 0px;
  margin-right: 5px;
  margin-bottom: 10px;
}

img.plattegrond {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

p, form {

  font-size: 0.75em;
  margin: 0 10px 10px 0;
  padding: 0;
}

form#sponsorInfoform {
  margin: 0 20px 10px 0;
}

.mainpage {
 
  font-size: 0.75em;
}

ul.route {

  font-size: 0.75em;
  list-style-type: none; 
  margin-top: 0.5em;
}

div.vcard {

  font-size: 0.75em;
  margin-bottom: 1.5em;
}

div.adr {
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}

div.tel {
  margin-bottom: 0em;
}

abbr.type {
  border: 0;
}

div.formcontainersubmit {
  padding-left: 0.5em;
}

div.special {
  margin-bottom: 0.5em;
}

#amountmessage {
  font-size: 0.9em;
  vertical-align: middle;
  padding: 0 0 8px 4px;
}

div.specialFormText {
  border: 1px solid #0d51a6;
  margin: 0.5em;
  padding: 0.5em;
  font-size: 1em;

}

div.specialFormTextNoJavascript {
  margin-right: 18em;
}

div.specialFormTextJavascript {
  
}

div.specialFormText p {
  font-size: 1em;
  padding: 0em;
  margin: 0;
} 

div.specialFormText p.telephone {
  font-size: 1em;
  padding: 0em;
  margin: 0;
  margin-bottom: 0.5em;
}


div.formmessage p {
  text-align: center;
  font-weight: bold;
}

p.formcontainer {
  font-size: 1em;
}

label, span.label {
	margin: 0;
	padding: 0 0 0 4px;
	width: 156px;
	float: left;
}

label.radiobutton {
	float: none;
	margin-right: 1em;
	padding: 0 0 0 0.2em;
}

label.paymentoption {
  display: block;
  padding: 0;

}
div.paymentoptions {
  float: left;
}

label.checkbox {
  width: 90%;
  margin-bottom: 0.2em;
}

label.checkbox input {
  padding: 0;
}

label.checkbox input {
  margin: 0 0.5em 0 0;
}

label.message {
  margin-bottom: 1em;
  width:30em;
}

textarea {
  clear: left;
  display: block;
  max-width: 30em;
}

legend {
  font-weight: bold;
}

fieldset {
  border:1px solid #0d51a6;
  margin: 0.5em;
  padding: 1em;
}

fieldset.radiobutton {
  padding: 0.2em 0 0.2em 0.5em;
}

fieldset.gender {
  border: 0;
  padding-left: 0;
  margin-left: 0.1em;
}

input, textarea, select, option {

  font-size: 0.9em;
  margin-bottom: 0.5em;
}

input, textarea, select {
  border:1px solid #0d51a6;
}

#subject {
  width: 14em;
}

#creditcardbrands {
  width: 12em;
}

input.error {
  border:1px solid red;
}

label.error, span.error, span.reserved, span.reserveddetail, legend.error{

}

ul#imagegallery li span.reserved {
  display: block;
  font-size: 0.9em;
  text-align: center;
}

span.nameOfChild {
  font-weight: bold;
}

span.reserved {
  color: black;
  display: block;
  font-size: 0.9em;
  text-align: center;
}
span.reserveddetail {
  color: black;
  display: block;
  font-size: 1.2em;
  text-align: center;
}

span.error {
  vertical-align: middle;
  padding: 0 0 4px 4px;
}

input.radiobutton, input.checkbox {
  margin: 0;
  border: 0;
}

input.checkboxtext {
  clear: both;
  float: left;
  margin-left: 5px;
}

fieldset.radiobutton input#peraltie {
  margin-bottom: 0.2em;
}

.smallinput {
  width: 6em;
}

.middleinput {
  width: 10em;
}

.largeinput {
  width: 15em;
}

.requiredinfo {
 
}

#mainArticle ul,
ul.articleList {
  list-style-type: circle;
  margin-top: 0;
  padding-bottom: 1em;

}

#mainArticle ul,
ul.articleList li,
ol.articleList li,
ul.extra,ol.extra {
  color: black;
  font-size: 0.75em; 
  line-height:1.4em;
  margin-bottom: 0px;
  margin-top: 0;
}

ul.articleList li,
ol.articleList li {
  font-size: 1em;
}

/* misschien???
ul.articleList li:before {
	content: "\00BB \0020";
	}*/

ul.mainpage {
  position: relative;
  margin-top: 0;
  margin-left: 0;
  margin-bottom: 0;
  padding-left: 15px;
}

ul.mainpage + p {
  margin-top: 0;
  margin-left: 0.4em;
}

ul.mainpage li {
  line-height:1.4em;
  margin-bottom: 0px;
  margin-left: 0px;
  padding-left: 0px;
}

ul#imagegallery {
  display: inline;
  float: right;
  list-style-type: none;
  margin-right: 15px;
  width: 97%;  
}

ul#imagegallery li { 
  display: inline; 
  float: left;
  height: 200px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 5px;
  width: 101px; 
  padding: 0;
}

ul#childrenList {
  display: inline;
  float: right;
  
  list-style-type: none;
  margin-right: 15px;
  margin-top: 20px;
  width: 97%;  
}

ul#imagegallery li { 
  display: inline; 
  float: left;
  height: 200px;
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 5px;
  width: 101px; 
  padding: 0;
}

ul#imagegallery li.family {
  margin-right: 110px;
  height: 240px;
}


ul#imagegallery li a { 
  display: block; 
  height: 190px;
  text-decoration: none;
  width: 101px;
  margin: 0;
  padding: 0;
}

ul#imagegallery li a:hover span { 

}

ul#imagegallery li img {
  border:1px solid #0d51a6;
  display: inline;
  margin: 0;
  padding: 0;
}

ul#imagegallery li img:hover {
  border:1px solid red;
}

ul#imagegallery li a:hover span { 

}

ul#imagegallery li p {
  text-align: center;
  width: 101px;
  margin: 0;
  padding: 0;
}

ul#imagegallery li a:hover p { 

}

ul#imagegallery li p.familytext {
  font-size: 1em;
  text-align: left;
  margin-bottom: 0.4em;
}

ul#imagegallery li h3 {
  text-align: center;
}

span.familytext {
  display:inline;
  font-size: 0.75em;
  margin-left: 5px;
  margin-right: 5px;
  position: absolute;
  width: 100px;
}

dl {

  margin-top: 0;
  font-size: 0.75em;
}

dt {
  font-size: 1.3em;
  font-weight: bold;
}

dl.articleList dt {
  font-size: 1em;
  display: inline;
}

dl.articleList dd {
  margin-left: 0;
}

p a,
p a:visited {
  color: black;
  text-decoration: underline;
  /*border-bottom: 1px dashed;*/
  

}
  
a {

  text-decoration: none;
}

h2.article a:hover,
h1.article a:hover,
ul.mainpage a:hover,
a.faq:hover {
  text-decoration: underline;
}

a.faq:hover {
  }

a.faq:visited {
  color: black;
}

a.faq {

  font-size: 0.55em;
}
p a:hover,
ul.articleList li a:hover {
    /*border-bottom: 1px solid;*/

    text-decoration: underline;
}

p.paging {
  margin-top: 1em;
}

#ideallogo {
  margin-left: 1em;
}

/* otherwise ie will get two lines!!*/
p.extra a:hover {
  border-bottom: 0;

}

a:visited {
  color: black;
}

h1 a,h1 a:hover,h1 a:link,h1 a:visited {
  color: black;
  font-size: 1em;
}

a.moreinfo,a.moverinfo:hover,a.moreinfo:link,a.moreinfo:visited {
color: black;
  font-size: 0.75em;
}

a.moreinfo:hover {
color: black;
}

p.extra {
  /*font-style: italic;*/
  margin-right: 5px;
  margin-left: 5px;
  margin-bottom: 10px;
  margin-top: 5px;
}

p.sponsor {
  margin-top: 5px; 
  margin-bottom: 0px; 
}

p.sponsor span {
  display: block;
  margin-bottom: 10px;
}

/* move to other area?*/
div#mailoptions, div#noscriptmailoptions {
  margin-top: 0.5em;
  margin-left: 1.2em;
}

div.anonymous {
  clear: both;
}

div#donorsubmit {
  clear: both;
  margin-top: 2.5em;
}

/* footer */
.footer p,
.footerSponsor p,
.footerHomepage p {

  font-size: 0.6em;
  margin: 0;
  margin-top: 3px;
  padding: 0 0.75em 0.5em 0;
  text-align: center;  
}

div#extraimages {
  margin-bottom: 10px;
  clear: right;
  width: 100%;
}

.footer { 
  border-top: solid 0.1em #c7c7c7;
  margin: 20px 55px 0 0.5em;
}

.footerSponsor { 
  border-top: solid 0.1em #c7c7c7;
  margin: 20px 75px 0 3.5em;
}

.printfooter { 
  display: inline;
}

.footerHomepage { 
  display: block;
  border-top: solid 0.1em #c7c7c7;
  margin: 20px 75px 0 3.5em;
}

#currencyconverter {
  width: 250px;
  display: inline;
}

p, ul, li, ol, a, h1, h2, h3, h4, h5, h6 {
  color: black;
}