/*This is the CSS file for the meesterweek.nl website */

/* GENERAL */
body {
margin: 0px;
background:#ffffff;
background-image:url(../images/bg.jpg);
background-repeat:repeat-x;
background-position:top;
background-attachment:fixed;
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;

}
A {
color:#FF9500;
text-decoration:none;
}
A:hover {
color:#444444;
text-decoration:none;
}
#header {
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
}
#header A {
color:#FF9500;
text-decoration:none;
}
#header A:hover {
color:#444444;
text-decoration:none;
}
#content td{
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
}

/* BOXES */
.box {
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
box-shadow: 1px 3px 5px #999999;
-webkit-box-shadow: 1px 3px 5px #999999;
-moz-box-shadow: 1px 3px 5px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
}
.box p {
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
box-shadow: 0px 0px 0px #ffffff;
-webkit-box-shadow: 0px 0px 0px #ffffff;
-moz-box-shadow: 0px 0px 0px #ffffff;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#ffffff, offX=0, offY=0, positive=true);

}
.ad { 
box-shadow: 1px 3px 5px #999999;
-webkit-box-shadow: 1px 3px 5px #999999;
-moz-box-shadow: 1px 3px 5px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
}
/* sIFR FLASHHEADER CLASS (DO NOT EDIT */
h1 {
font-size:28px;
font-weight:bold;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
color:#FF9500;
}
h2 {
font-size:22px;
font-weight:bold;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
color:#FF9500;
}
h3 {
font-size:16px;
font-weight:bold;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
color:#FF9500;
}
h4 {
font-size:12px;
font-weight:bold;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
color:#FF9500;
}
/* SPECIAL ELEMENTS */
#inschrijving input {
border: 1px;
border-color:#ff9500;
background: #ffffff;
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:12px;
width:150px;
border:solid 1px #ff9500;
}
.invisi-text {
font-size: 1px;
color: #ffffff;
opacity: 0.00;
filter: alpha(opacity=00);
-moz-opacity: 0.00;
z-index:0;
}
.arrowbutton {
font-size:11px;
color:#fff;
background:url(../images/arrowbutton%5Bdefault%5D.gif);
padding-left: 10px;
}
.arrowbutton a{
color:#fff;
text-decoration:none;
}
.arrowbutton a:hover{
color:#FFF;
text-decoration:underline;
}

/* ToolTip */
.tool-tip {
	color: #fff;
	width: 300px;
	z-index: 25;
}
 
.tool-title {
	font-weight: bold;
	font-size: 12px;
	margin: 0;
	color: #ff9500;
	padding: 8px 8px 4px;
	background: #000000;
}
 
.tool-text {
	font-size: 11px;
	padding: 4px 8px 8px;
	background: #000000;
	text-align:justify;
}

/* AddThis toolbox */
.addthis_toolbox .hover_effect
{
    width: 310px;
    padding-left: 10px;
    padding-right: 10px;
}

.addthis_toolbox .hover_effect div
{
    float: right;
}

.addthis_toolbox .hover_effect a
{
    border: 2px solid #fff;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    padding: 4px 4px 4px 20px;
    position: relative;
    text-decoration: none;
}

.addthis_toolbox .hover_effect a:hover
{
    border: 2px solid #ff9500;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
	background: #ffe0b5;
    text-decoration: none;
}

.addthis_toolbox .hover_effect span
{
    position: absolute;
    width: 16px;
    height: 16px;
    top: 4px;
    left: 4px;
}

/* DROPDOWN CSS */
/*********************************************************
I TRIED TO MAKE THIS EASY TO STYLE! SEE NOTES BELOW
**********************************************************/
#dropdown-holder {
	/*
		This is just the holder and how you want what is behind the
		main menu links too look like
	*/
	width: 800px;
	background-color: #ff9500;
	box-shadow: 1px 3px 5px #999999;
	-webkit-box-shadow: 1px 3px 5px #999999;
	-moz-box-shadow: 1px 3px 5px #999999;
	filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
	z-index:10;
}
.dropdown {
	/* OVER ALL LINE HEIGHT */
	line-height:18px;
}
.dropdown a {
	/* The minimum width of the "MAIN" links on top */
	min-width: 140px;
	font-size: 11px;
	display:block;
	padding:3px 10px 3px 10px;
	color:#ffffff;
	text-decoration:none;
	text-align:left;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: bold;
	background-color: #ff9500;
	box-shadow: 1px 3px 5px #999999;
	-webkit-box-shadow: 1px 3px 5px #999999;
	-moz-box-shadow: 1px 3px 5px #999999;
	filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
	z-index:10;
}
.dropdown a:hover{
	color: #ffffff;
	text-decoration:underline;
	background-color: #000000;
}
.dropdown ul {
	top:24px;
	z-index:11;
}
.dropdown li ul a{
	/* The width of the dropdown and popout menu */
	width:160px;
	color: #000000;
	background-color:#ffffff;
	/*
		Optional thought i'd make the drop down and popout transparent
		This line is also what is killing the CSS validation

	filter:alpha(opacity=90);-moz-opacity:.90;opacity:.90;	*/
}
.dropdown li ul a:hover{
	color: #000000;
	background-color:#dedede;
}
.dropdown li ul {
	/* time for some math  {a}:width + {a}:padding + {a}:border */
	width:160px;
	z-index:12;
}
.dropdown li ul li{
	/* time for some math  {a}:width + {a}:padding + {a}:border */
	width:160px;
}


/************************************************************
ONLY EDIT BELOW IF YOU REALLY KNOW WHAT YOUR DOING!
************************************************************/
.dropdown {
	margin:0;
	padding:0;
	list-style-type:none;
}
.dropdown ul{
	margin:0;
	padding:0;
	list-style-type:none;
}
.dropdown a {
	display:block;
}
.dropdown li{
	float:left;
	position:relative;
	display: block;
}
.dropdown ul {
	position:absolute;
	display:none;
}
.dropdown li ul a{
	float:left;
}
.dropdown li ul {
	float:left;
}
.dropdown li ul li{
	float:left;
	position:relative;
}
.dropdown ul ul{
	top:0;
	left:100%;
}
.dropdown li ul ul {
	width:auto;
	margin: -1px 0px 0px 0px;
	float:left;
}
.dropdown li:hover ul ul, .dropdown li:hover ul ul ul, .dropdown li:hover ul ul ul ul{
	display:none;
}
.dropdown li:hover ul, .dropdown li li:hover ul, .dropdown li li li:hover ul, .dropdown li li li li:hover ul{
	display:block;
}

/* DROPDOWN PANEL

/* This is the CSS markup for the dropdown panels on Meesterweek.nl */

/* ################################################### */
/* DROPDOWN PANEL 'infopanel' associated with top */
/* ################################################### */

.ddpanel .ddpanelcontent{ /*CSS for "content" DIV of Drop Down Panel*/
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
text-align:justify;
background: #ff9500; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
box-shadow: 1px 3px 5px #999999;
-webkit-box-shadow: 1px 3px 5px #999999;
-moz-box-shadow: 1px 3px 5px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
z-index: 2;
}

.ddpanel .ddpaneltab{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
	margin-right: 0px;
	color:#ffffff;
	z-index: 2;
}

.ddpanel .ddpaneltab a{ /*"toggle" tab related CSS*/
float: right;
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight: bold;
background: #ff9500; /*background of toggle tab*/
text-decoration: none;
box-shadow: 1px 3px 5px #999999;
-webkit-box-shadow: 1px 3px 5px #999999;
-moz-box-shadow: 1px 3px 5px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=3, positive=true);
}

.ddpanel .ddpaneltab a span{ /*"toggle" tab related CSS*/
float: left;
display: block;
padding: 1px 12px 4px 13px;
cursor: pointer;
}

.ddpanel .ddpaneltab a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel .ddpaneltab a:hover{ /*"toggle" tab related CSS*/
background-color: #000000; /*background of toggle tab onMouseover*/
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
font-weight: bold;
text-decoration: none;
}

.ddpanel .ddpaneltab a:active, .ddpanel .ddpaneltab a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}

.ddpanel .ddpaneltab a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}

/* ################################################### */
/* DROPDOWN PANEL 'contentpanel' associated with middle */
/* ################################################### */

.ddpanel2 .ddpanelcontent2{ /*CSS for "content" DIV of Drop Down Panel*/
color:#000000;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
text-align:justify;
background: #ffffff; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
}

.ddpanel2 .ddpaneltab2{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
	margin-right: 0px;
	color:#ffffff;
	z-index: 2;
}

.ddpanel2 .ddpaneltab2 a{ /*"toggle" tab related CSS*/
float: right;
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight: bold;
background: #ff9500; /*background of toggle tab*/
text-decoration: none;
}

.ddpanel2 .ddpaneltab2 a span{ /*"toggle" tab related CSS*/
float: left;
display: block;
padding: 1px 12px 4px 13px;
cursor: pointer;
}

.ddpanel2 .ddpaneltab2 a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel2 .ddpaneltab2 a:hover{ /*"toggle" tab related CSS*/
background-color: #000000; /*background of toggle tab onMouseover*/
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight: bold;
text-decoration: none;
}

.ddpanel2 .ddpaneltab2 a:active, .ddpanel2 .ddpaneltab2 a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}

.ddpanel2 .ddpaneltab2 a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}

/* ################################################### */
/* DROPDOWN PANEL 'footerpanel' associated with bottom */
/* ################################################### */

.ddpanel3 .ddpanelcontent3{ /*CSS for "content" DIV of Drop Down Panel*/
color:#ff9500;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:9px;
text-align:justify;
vertical-align:top;
background: #000000; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
box-shadow: 1px -2px 4px #999999;
-webkit-box-shadow: 1px -2px 4px #999999;
-moz-box-shadow: 1px -2px 4px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=1, offY=-2, positive=true);
z-index: 2;
}

.ddpanel3 .ddpanelcontent3 a{
color:#FFF;
}
.ddpanel3 .ddpanelcontent3 a:hover{
color:#FFF;
text-decoration:underline;
}

.ddpanel3 .ddpaneltab3{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
	margin-left: 0px;
	color:#ffffff;
	z-index: 2;
}

.ddpanel3 .ddpaneltab3 a{ /*"toggle" tab related CSS*/
float: left;
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight: bold;
background: #000000; /*background of toggle tab*/
text-decoration: none;
box-shadow: -2px -2px 4px #999999;
-webkit-box-shadow: -2px -2px 4px #999999;
-moz-box-shadow: -2px -2px 4px #999999;
filter: progid:DXImageTransform.Microsoft.dropShadow(color=#999999, offX=-2, offY=-2, positive=true);
}

.ddpanel3 .ddpaneltab3 a span{ /*"toggle" tab related CSS*/
float: right;
display: block;
padding: 1px 12px 4px 13px;
cursor: pointer;
}

.ddpanel3 .ddpaneltab3 a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel3 .ddpaneltab3 a:hover{ /*"toggle" tab related CSS*/
background-color: #ff9500; /*background of toggle tab onMouseover*/
color:#ffffff;
font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:10px;
font-weight: bold;
text-decoration: none;
}

.ddpanel3 .ddpaneltab3 a:active, .ddpanel3 .ddpaneltab3 a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}

.ddpanel3 .ddpaneltab3 a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}
