/* 
SHAPE ~ Sportcentrum
======================================================================================
URL:				http://www.shapefraneker.nl/
Auteur: 			Stefan Efde [http://www.addnoise.nl]
======================================================================================
*/

/* 
ACHTERGROND:	: #E9820C
ROOD:			: #77092E
GRIJS:			: #7B7B7B
L.GRIJS:		: #EEF0EF
ORANJE:			: #E9820C
*/


body
{
	margin: 0;
	padding: 0;
	height: 100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 18px;
	color: #555555; 
	background: #E9820C url(../images/bg.gif) repeat-x top left;
}

		
html
{
	height: 100%;
}

a:link, a:visited { 
	color: #77092E;
	text-decoration: none;
	outline-color: invert;
	outline-style: none;
	outline-width: 0pt; 	
	}

a:hover, a:active { 
	color: #77092E;
	text-decoration: underline;
	}

#container_top {
	width: 100%;
	height: 79px;
	background: url(../images/glow_top.png) no-repeat 50% 0px;
}
/* Fix voor IE */
			* html #container_top
			{
				width: 1010px;
				margin: auto;
				background-image:none;
				filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='http://www.shapefraneker.nl/addsite/data/sites/shape/www/images/glow_top.png', sizingMethod='scale');
			}


#container_mid {
	width: 100%;
	background: url(../images/glow_mid.png) repeat-y 50% 0px;
}
/* Fix voor IE */
			* html #container_mid
			{
				width: 1010px;
				margin: auto;
				background-image:none;
				filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='http://www.shapefraneker.nl/addsite/data/sites/shape/www/images/glow_mid.png', sizingMethod='scale');
			}
#container_btm {
	width: 100%;
	height: 40px;
	background: url(../images/glow_btm.png) no-repeat 50% 0px;
	font-size: 0px;
	line-height: 0px;
	font-weight: normal;
}
/* Fix voor IE */
			* html #container_btm
			{
				width: 1010px;
				margin: auto;
				background-image:none;
				filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='http://www.shapefraneker.nl/addsite/data/sites/shape/www/images/glow_btm.png', sizingMethod='scale');
			}

#mainbox {
	width: 982px;
	min-height: 500px;
	margin: 0 auto;
	position: relative;
}
/* Fix voor IE */
			* html #mainbox
			{
				height: 500px;
			}

#leftbox {
	float: left;
	width: 194px;
	min-height: 400px;
	padding: 0px 0px 0px 15px;
	position: relative;
}
/* Fix voor IE */
			* html #leftbox
			{
				height: 400px;
			}

#logo {
	width: 185px;
	height: 60px;
	float: left;
}

#logo img {
	float: left;
	border: 0px;
}

.oranjebox {
	float: left;
	width: 172px;
	background: #E9820C url(../images/oranjebox_top.gif) no-repeat top left;
	color: #FFF;
}
.oranjebox .oranjebox_btm {
	float: left;
	width: 132px;
	min-height: 85px;
	background: url(../images/oranjebox_btm.gif) no-repeat bottom left; 
	padding: 17px 20px 10px 20px;
	position: relative;
}
.oranjebox .oranjebox_btm ul {
	margin: 0px;
	padding: 3px 0px 0px 0px;
}
.oranjebox .oranjebox_btm ul li { 
	margin: 0px;
	padding: 0px 0px 0px 0px;
	list-style-type: none;
}
.oranjebox .oranjebox_btm ul li a:link, .oranjebox .oranjebox_btm ul li a:visited {
	color: #FFF;
	padding: 0px 0px 0px 15px;
	margin: 0px 0px 0px 0px;
	background: url(../images/bullet.gif) no-repeat 0px 4px;
	text-decoration: underline;
}
.oranjebox .oranjebox_btm ul li a:hover {
	text-decoration: none;
}

.openbox {
	float: left;
	width: 174px;
	background: url(../images/openbox_top.gif) no-repeat top left;
}
.openbox .openbox_btm {
	float: left;
	width: 164px;
	min-height: 90px;
	background: url(../images/openbox_btm.gif) no-repeat bottom left; 
	padding: 17px 10px 10px 20px;
	position: relative;
}


#rightbox {
	float: left;
	width: 771px;
	min-height: 400px;
}
/* Fix voor IE */
			* html #rightbox
			{
				height: 400px;
			}



#headerbox {
	width: 771px;
	height: 320px;
}
#header_left {
	float: left;
	width: 479px;
	height: 320px;
	position: relative;
}

#overlay{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 479px;
	height: 320px;
	background: url(../images/wm_header01.png) no-repeat top left; 	
	z-index: 98;
}

/* Fix voor IE */
			* html #overlay
			{
				background-image:none;
				filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='http://www.shapefraneker.nl/addsite/data/sites/shape/www/images/wm_header01.png', sizingMethod='scale');
			}

#overlay2{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 479px;
	height: 320px;
	background: url(../images/wm_header01.gif) no-repeat top left; 	
	z-index: 99;
}


ul#flashfotos {
	margin: 0px;
	padding: 0px;
	list-style-type: none
}
ul#flashfotos ul li{
	margin: 0px;
	padding: 0px;
	display: inline;
	list-style-type: none;
}

ul#flashfotos ul li img{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 479px;
	height: 320px;
}


#header_right {
	float: left;
	width: 292px;
	height: 320px;
	background: url(../images/header_right.gif) no-repeat 0px 0px;
}
#header_right02 {
	float: left;
	width: 292px;
	height: 320px;
	background: url(../images/header_right02.gif) no-repeat top left;
}

.specialbox {
	color: #FFF;
	padding: 25px 35px 30px 30px;
	font-size: 11px;
}
.specialbox .kopje {
	font-size: 18px;
	font-weight: bold;
	line-height: 22px;
	display: block;
	padding: 0px 0px 20px 0px;
}
.specialbox .tekst_oranje {
	color: #E9820C;
}
.specialbox a:link, .specialbox a:visited {
	color: #E9820C;
	text-decoration: underline;
}
.specialbox a:hover {
	text-decoration: none;
}

.kop {
	color: #77092E;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	display: block;
	padding: 0px;
	margin: 0px;
}

#contentbox {
	width: 771px;
}
/* Fix voor IE */
			* html #contentbox
			{
				margin: -2px 0px 0px 0px;
			}

#contentbox_vervolg {
	width: 766px;
	background: #EEF0EF;
}
/* Fix voor IE */
			* html #contentbox_vervolg
			{
				margin: -2px 0px 0px 0px;
			}

.contentlinks{
	float: left;
	width: 409px;
}

.contentrechts{
	float: right;
	width: 228px;
}

.content_left {
	float: left;
	width: 479px;
	min-height: 380px;
	margin: 0px 0px 0px 0px;
	background: #EEF0EF url(../images/content_btmleft.gif) no-repeat bottom left; 
}

.content_left .btm_right {
	float: left;
	width: 409px; /* 479px */
	min-height: 320px;
	background: url(../images/content_btm_right.gif) no-repeat bottom right;
	padding: 30px 30px 30px 40px;
}
.content_left_vervolg {
	float: left;
	width: 766px;
	min-height: 380px;
	background: #EEF0EF url(../images/content_btmleft.gif) no-repeat bottom left; 
}

.content_left_vervolg .btm_right {
	float: left;
	width: 696px; /* 766px */
	min-height: 320px;
	background: url(../images/content_btm_right.gif) no-repeat bottom right;
	padding: 30px 30px 30px 40px;
}

.content_right {
	float: left;
	width: 265px;
	min-height: 360px;
	padding: 22px 0px 0px 25px;
}



.box {
	float: left;
	width: 247px;
	background: #EEF0EF url(../images/box_top.gif) no-repeat top left; 
}
.box .boxbtm {
	float: left;
	width: 207px;
	height: 220px;
	background: url(../images/box_btm.gif) no-repeat bottom left; 
	padding: 20px 20px 20px 20px;
	position: relative;
}
.box .boxbtm .fotogalerij {
	position: absolute;
	bottom: -28px;
	left: 0px;
	/* 247 x 198 */
	border: 0px;
	width: 247px;
	height: 198px;
	background: url(../images/fotogalerij.png) no-repeat top left; 
}
/* Fix voor IE */
			* html .box .boxbtm .fotogalerij
			{
				background-image:none;
				filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src='http://www.shapefraneker.nl/addsite/data/sites/shape/www/images/fotogalerij.png', sizingMethod='crop');
			}


.box .boxbtm img.fotogalerij:hover {
	bottom: -30px;
}

.box2 {
	float: left;
	width: 247px;
	background: #EEF0EF url(../images/box_top.gif) no-repeat top left; 
}
.box2 .boxbtm2 {
	float: left;
	width: 227px;
	min-height: 140px;
	background: url(../images/box_btm.gif) no-repeat bottom left; 
	padding: 17px 0px 20px 20px;
	position: relative;
}
.box2 .boxbtm2 img.actie {
	float: right;
	/* 247 x 198 */
	border: 0px;
}




h1 { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin: 0px 0px 15px 0px;
	font-size: 26px;
	line-height: 28px;
	font-weight: bold;
	color: #77092E;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
	letter-spacing: 0px;
	}

h2 { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin: 0px 0px 3px 0px;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	color: #77092E;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
	letter-spacing: 0px;
	}

h3 { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin: 0px 0px 2px 0px;
	font-size: 11px;
	line-height: 12px;
	font-weight: bold;
	color: #77092E;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
	letter-spacing: 0px;
	}
h4 { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin: 0px 0px 15px 0px;
	font-size: 20px;
	line-height: 28px;
	font-weight: bold;
	color: #77092E;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
	letter-spacing: 0px;
	}

h5 { 
	font-family: Arial, Verdana, Helvetica, sans-serif;
	margin: 0px 0px 0px 0px;
	font-size: 12px;
	line-height: 14px;
	font-weight: bold;
	color: #77092E;
	padding: 0px 0px 0px 0px;
	text-transform: uppercase;
	}


.intro {
	font-weight: bold;
}

.copyright {
	width: 100%;
	height: 30px;
	text-align: center;
	color: #FFF;
	font-size: 9px;
}


/* TOP NAVIGATIE
------------------------------------------------------------------------------------------------- */
#topnav {
	width: 945px;
	height: 40px;
	margin: auto;
}
/* Fix voor IE */
			* html #topnav
			{
				width: 965px;
			}

#topnavigatie {
	float: right;
	margin: 23px 0px 0px 0px;
	font-size: 11px;
}

#topnavigatie ul {
	margin: 0px;
	padding: 0px;
	}
	
#topnavigatie ul li { 
	margin: 0px;
	padding: 6px 0px 6px 0px;
	list-style-type: none;
	display: inline;
	line-height: 24px;
	position: relative;
	}



#topnavigatie ul li a:link, #topnavigatie ul li a:visited  { 
	padding: 5px 20px 5px 18px;
	text-decoration: none;
	color: #FFF;
	font-size: 11px;
	text-transform: uppercase;
	border-right: 1px solid #E9820C;
	position: relative;
}
#topnavigatie ul li a:hover {
	color: #E9820C;
}

#topnavigatie ul li a.last:link, #topnavigatie ul li a.last:visited  { 
	padding: 5px 20px 5px 18px;
	text-decoration: none;
	color: #FFF;
	font-size: 11px;
	text-transform: uppercase;
	border-right: 0px solid #E9820C;
	position: relative;
}
#topnavigatie ul li a.last:hover {
	color: #E9820C;
}


/* NAVIGATIE LINKS
------------------------------------------------------------------------------------------------- */

#nav {
	float: left;
	text-transform: uppercase;
	letter-spacing: -1px;
	padding: 0px 0px 8px 0px;
	margin: -15px 0px 0px 0px;
}

#nav ul
{
	margin: 0px;
	padding: 0px 0px 0px 0px;
	font-size: 11px;
	line-height: 14px;
}



#nav ul li
{
	list-style-type: none;
	color: #77092E;
	font-weight: bold;
	padding: 14px 10px 4px 38px;
	margin: 0px;
	text-decoration: none;
	background: url(../images/kronkelplusline.gif) 5px 0px no-repeat;
}

#nav ul li.first
{
	list-style-type: none;
	color: #77092E;
	font-weight: bold;
	padding: 14px 10px 4px 38px;
	margin: 0px;
	text-decoration: none;
	background: url(../images/kronkel.gif) 5px 17px no-repeat;
}

#nav ul li#subactief
{
	
	list-style-type: none;
	color: #E9820C;
	font-weight: bold;
	padding: 4px 10px 4px 38px;
	margin: 0px;
	text-decoration: none;
	background: url(../images/kronkel.gif) 5px 5px no-repeat;
	
}


#nav li a:link, #nav li a:visited
{
	color: #77092E;
	font-weight: bold;
	padding: 0px;
	margin: 0px;
	text-decoration: none;
}

#nav li a:hover
{
	color: #E9820C;
}



/* Tweede niveau
-------------------------------------------------------- */

#nav ul ul
{
	margin: 0px;
	padding: 0px 0px 10px 0px;
	font-size: 11px;
	line-height: 14px;
}

#nav ul ul li
{
	padding: 0px;
	margin: 0px;
	list-style-type: none;
	display: block;
	background: none;
}

#nav ul ul li#subactief
{
	padding: 0px;
	margin: 0px;
	list-style-type: none;
	display: block;
	background: none;
	color: #E9820C;
}

#nav ul ul li a:link, #nav ul ul li a:visited
{
	color: #7B7B7B;
	font-weight: normal;
	padding: 3px 10px 3px 0px;
	margin: 0px;
	text-decoration: none;
	background: none;
	font-size: 10px;
}

#nav ul ul li a:hover
{
	color: #E9820C;
}


/* Foto overzicht
------------------------------------------------------------------------------------------ */

.fotosrechts { 
	float: right;
	width: 200px;
	padding: 0px 0px 0px 20px;
	margin: 0px 30px 0px 0px;
	}
	
.fotosrechts img {
	border: 0px;
	width: 200px;
	margin: 0px 0px 20px 0px;
	cursor: pointer;
	border: 1px solid #EEF0EF;
	}
.fotosrechts img:hover {
	border: 1px solid #77092E;
}

			
.fotosoverzicht { 
	width: 600px;
	padding: 10px 0px 0px 0px;
	margin: 10px 0px 0px 0px;
	}		

	
.fotosoverzicht img
{
	width: 70px;
	height: 60px;
	border: 0px;
	padding: 0px;
	margin: 0px 15px 0px 0px;
	float: left;
	cursor: pointer;
	border: 1px solid #EEF0EF;
}
.fotosoverzicht img:hover {
	border: 1px solid #77092E;
}

/* Sitemap
-------------------------------------------- */

#sitemap {
	width: 490px;
	padding: 0px 30px 35px 15px;
	background: url(../images/contentblok_bg.jpg) -4px -2px no-repeat;
	}
#sitemap ul {
	margin: 5px 5px 5px 0px;
	padding: 0px;
	list-style-type: none;
	line-height: 11px;
}
#sitemap ul li {
	list-style-type: none;
	font-weight: bold;
	padding: 4px 10px 4px 38px;
	margin: 0px;
	text-decoration: none;
	background: url(../images/kronkel_2.gif) 5px 5px no-repeat;
}
#sitemap ul li a:link, #sitemap ul li a:visited {
	text-decoration: none;
	background: none;
	color: #77092E;
}
#sitemap ul li a:hover {
	text-decoration: underline;
}
#sitemap ul li ul li {
	padding: 0px 0px 3px 0px;
	margin: 0px;
	font-weight: normal;
	background: none;
}

#sitemap ul li ul li a:link, #sitemap ul li ul li a:visited {
	text-decoration: none;
	background: none;
	color: #797979;
}
#sitemap ul li ul li a:hover {
	text-decoration: underline;
}


/* Formulieren
---------------------------------------------------------------------------------------------- */
form {
	font-size: 10px;
}


.invulNormaal { 
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 300px;
		height: 20px;
		border: 1px #C8C9CB solid;
		}
.invulNormaal2 { 
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 200px;
		border: 1px #C8C9CB solid;
		height: 20px;
		}
		
.invulArea {  
		font-family: Verdana, Arial Helvetica, sans-serif; 
		font-size: 11px; color: #555555; 
		margin-top: 0px; 
		width: 652px;
		height: 70px;
		border: 1px #C8C9CB solid;
		}
		
.invulArea2 {  
		font-family: Verdana, Arial Helvetica, sans-serif; 
		font-size: 11px; color: #999999; 
		margin-top: 0px; 
		width: 250px;
		height: 60px;
		border: 1px #C8C9CB solid;
		}		
 
.invulPulldown {
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 552px;
		border: 1px #C8C9CB solid;
		height: 25px;
		background: #FFF;
		margin-left: 3px;
	}

.invulPulldown2 {
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 200px;
		border: 1px #C8C9CB solid;
	}

.invulww {
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 200px;
		border: 1px #C8C9CB solid;
		width: 80px;
		height: 20px;
	}
	
.invulnr {
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #555555; 
		width: 200px;
		border: 1px #C8C9CB solid;
		width: 50px;
	}	


.frmcheckbox
{
	border: 1px solid #C8C9CB;
}

.frmseparator
{
	
	height: 2px;
}

.frmseparatora
{
	height: 10px;
}

input.button { 
	background: #77092E; 
	border-bottom: 1px solid #77092E; 
	border-left: 1px solid #77092E; 
	border-right: 1px solid #77092E; 
	border-top: 1px solid #77092E; 
	color: #ffffff; 
	margin: 0px; 
	padding: 3px 5px 3px 5px; 
	font-size: 12px;
	}
input.button2 { 
	background: #77092E; 
	border-bottom: 1px solid #77092E; 
	border-left: 1px solid #77092E; 
	border-right: 1px solid #77092E; 
	border-top: 1px solid #77092E; 
	color: #ffffff; 
	margin: 0px; 
	padding: 3px 5px 3px 5px; 
	font-size: 12px;
	}
	
.kopform { 
	font-weight: normal;
	font-size: 14px;
	color: #f80404;
	margin: 0px;
	padding: 0px;
}




.clearer {
	height: 0px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}


.clearer10 {
	height: 10px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}

.clearer15 {
	height: 15px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.clearer20 {
	height: 20px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}

.clearer25 {
	height: 25px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.clearer30 {
	height: 30px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.clearer35 {
	height: 35px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.clearer50 {
	height: 50px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.clearer100 {
	height: 100px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	clear: both;
}
.spacer5 {
	height: 5px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
.spacer15 {
	height: 15px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
.spacer25 {
	height: 25px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
.spacer35 {
	height: 35px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
.spacer50 {
	height: 50px;
	font-size: 0px;
	line-height: 0px;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}