<!-- 
/*
	| liquidcorners.css; feel free to adapt the style!
	| ================================================
	| use: 4 corners with borderline outside a contentbox with class="inside"; 
	|      image  = upper half: top left corner, long borderline, top right corner
	|               under half: bottom left corner, long borderline, bottom right corner
	|      CHANGE = you have to change this for fitting to your image
	|      YCC    = You Can Change (or omit), if wanted
	|      DNC    = Do Not Change
	| credits: original by francky kleyneman, see article/tutorial in Francky's Developers Corner:
	|          http://home.tiscali.nl/developerscorner/liquidcorners/liquidcorners.htm
	| adapted by marc van laere for ideaaal.com
*/

/*####### LARGE BOX #######*/
/* We definiëren hier de verschillende classes voor alle bestaande kleuren van de hoeken*/
.darkblueNoFill .top-left, .darkblueNoFill .top-right, .darkblueNoFill .bottom-left, .darkblueNoFill .bottom-right{
	background-image: url(../gfx/corners/darkblueNoFill.gif); }
.darkblueNoFill .inside{
	background-image: url(../gfx/corners/darkblueNoFillline.gif); background-repeat:repeat-y; }

.darkblue .top-left, .darkblue .top-right, .darkblue .bottom-left, .darkblue .bottom-right{
	background-image: url(../gfx/corners/darkblue.gif); }
.darkblue .inside{
	background-image: url(../gfx/corners/darkblueline.gif); background-repeat:repeat-y; }

.green .top-left, .green .top-right, .green .bottom-left, .green .bottom-right{
	background-image: url(../gfx/corners/green.gif); }
.green .inside{
	background-image: url(../gfx/corners/greenline.gif); background-repeat:repeat-y; }
	
.orange .top-left, .orange .top-right, .orange .bottom-left, .orange .bottom-right{
	background-image: url(../gfx/corners/orange.gif); }
.orange .inside{
	background-image: url(../gfx/corners/orangeline.gif); background-repeat:repeat-y; }

.red .top-left, .red .top-right, .red .bottom-left, .red .bottom-right{
	background-image: url(../gfx/corners/red.gif); }
.red .inside{
	background-image: url(../gfx/corners/redline.gif); background-repeat:repeat-y; }

.purple .top-left, .purple .top-right, .purple .bottom-left, .purple .bottom-right{
	background-image: url(../gfx/corners/purple.gif); }
.purple .inside{
	background-image: url(../gfx/corners/purpleline.gif); background-repeat:repeat-y; }

.lightblue .top-left, .lightblue .top-right, .lightblue .bottom-left, .lightblue .bottom-right{
	background-image: url(../gfx/corners/lightblue.gif); }
.lightblue .inside{
	background-image: url(../gfx/corners/lightblueline.gif); background-repeat:repeat-y; }

.grey .top-left, .grey .top-right, .grey .bottom-left, .grey .bottom-right{
	background-image: url(../gfx/corners/grey.gif); }
.grey .inside{
	background-image: url(../gfx/corners/greyNoFillline.gif); background-repeat:repeat-y; }
/****/



.top-left, .top-right {
	height: 34px;
	font-size: 2px;
	}
.bottom-left, .bottom-right {
	height: 13px;
	font-size: 2px;
	}
.top-left, .bottom-left { 
	margin-right: 13px;
	}
.top-right { 
	margin-left: 13px; 
	margin-top: -34px;
	}
.top-right {
	background-position: 100% 0;
	}
.bottom-right { 
	margin-left: 13px; 
	margin-top: -13px;
	}
.bottom-left  { 
	background-position: 0 -34px;
	}
.bottom-right { 
	background-position: 100% -34px;
	}

.inside {
	background-repeat:repeat-y;
	}
.notopgap    { margin-top: 0; }    /* DNC: to avoid splitting of the box */
.nobottomgap { margin-bottom: -1px; padding-bottom: 1px; } /* DNC: to avoid splitting of the box */





/*####### SMALL BOX #######*/
		/* We definiëren hier de verschillende classes voor alle bestaande kleuren van de kleine ronde hoeken*/
.darkblue .smallbox .top-left, .darkblue .smallbox .top-right, .darkblue .smallbox .bottom-left, .darkblue .smallbox .bottom-right{
	background-image: url(../gfx/corners/darkblueSmall.gif); }
.darkblue .smallbox .inside{
	background-image:none !important; border-left:1px solid #1d466c; border-right:1px solid #1d466c}
	
.green .smallbox .top-left, .green .smallbox .top-right, .green .smallbox .bottom-left, .green .smallbox .bottom-right{
	background-image: url(../gfx/corners/greenSmall.gif); }
.green .smallbox .inside{
	background-image:none !important; border-left:1px solid #96bf0d; border-right:1px solid #96bf0d}
	
.orange .smallbox .top-left, .orange .smallbox .top-right, .orange .smallbox .bottom-left, .orange .smallbox .bottom-right{
	background-image: url(../gfx/corners/orangeSmall.gif); }
.orange .smallbox .inside{
	background-image:none !important; border-left:1px solid #f6a924; border-right:1px solid #f6a924}

.red .smallbox .top-left, .red .smallbox .top-right, .red .smallbox .bottom-left, .red .smallbox .bottom-right{
	background-image: url(../gfx/corners/redSmall.gif); }
.red .smallbox .inside{
	background-image:none !important; border-left:1px solid #b20e21; border-right:1px solid #b20e21;}

.purple .smallbox .top-left, .purple .smallbox .top-right, .purple .smallbox .bottom-left, .purple .smallbox .bottom-right{
	background-image: url(../gfx/corners/purpleSmall.gif); }
.purple .smallbox .inside{
	background-image:none !important; border-left:1px solid #622281; border-right:1px solid #622281}

.lightblue .smallbox .top-left, .lightblue .smallbox .top-right, .lightblue .smallbox .bottom-left, .lightblue .smallbox .bottom-right{
	background-image: url(../gfx/corners/lightblueSmall.gif); }
.lightblue .smallbox .inside{
	background-image:none !important; border-left:1px solid #00abc4; border-right:1px solid #00abc4}

.grey .smallbox .top-left, .grey .smallbox .top-right, .grey .smallbox .bottom-left, .grey .smallbox .bottom-right{
	background-image: url(../gfx/corners/greySmall.gif); }
.grey .smallbox .inside{
	background-image:none !important; border-left:1px solid #a8acb6; border-right:1px solid #a8acb6}
/****/


.smallbox .top-left, .smallbox .top-right {
	height: 5px;
	font-size: 2px;
	}
.smallbox .bottom-left, .smallbox .bottom-right {
	height: 5px;
	font-size: 2px;
	}
.smallbox .top-left, .smallbox .bottom-left { 
	margin-right: 5px;
	}
.smallbox .top-right { 
	margin-left: 5px; 
	margin-top: -5px;
	}
#IE6 #rightblock .smallbox .top-right, #IE7 #rightblock .smallbox .top-right { 
	margin-left: 5px; 
	margin-top: -8px;
	}
#IE6 #rightblock , #IE7 #rightblock  {  /* door voorgaande wordt gans de rechterboel 8mm immers naar onder geduwd*/
	margin-top: -8px;
	}
.smallbox .top-right {
	background-position: 100% 0;
	}
.smallbox .bottom-right { 
	margin-left: 5px; 
	margin-top: -5px;
	}
.smallbox .bottom-left  { 
	background-position: 0 -5px;
	}
.smallbox .bottom-right { 
	background-position: 100% -5px;
	}

	
/*####### SMALL BOX RIGHT BLOCK #######*/
/* We definiëren hier de verschillende classes voor alle bestaande kleuren van de kleine ronde hoeken*/

/** BOVENSTE KADER VAN DE BOX = with FILL **/
.darkblue #rightblock .smallbox .top-left, .darkblue #rightblock .smallbox .top-right, .darkblue #rightblock .smallbox .bottom-left, .darkblue #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/darkblueFilled.gif); }
.darkblue #rightblock .smallbox .inside{ 
	background-color:#1d466c;}

.green #rightblock .smallbox .top-left, .green #rightblock .smallbox .top-right, .green #rightblock .smallbox .bottom-left, .green #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/greenFilled.gif)}
.green #rightblock .smallbox .inside{
	background-color:#96bf0d;}
	
.orange #rightblock .smallbox .top-left, .orange #rightblock .smallbox .top-right, .orange #rightblock .smallbox .bottom-left, .orange #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/orangeFilled.gif); }
.orange #rightblock .smallbox .inside{
	background-color:#f6a924;}

.red #rightblock .smallbox .top-left, .red #rightblock .smallbox .top-right, .red #rightblock .smallbox .bottom-left, .red #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/redFilled.gif); }
.red #rightblock .smallbox .inside{
	background-color:#b20e21;}

.purple #rightblock .smallbox .top-left, .purple #rightblock .smallbox .top-right, .purple #rightblock .smallbox .bottom-left, .purple #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/purpleFilled.gif); }
.purple #rightblock .smallbox .inside{
	background-color:#622281;}

.lightblue #rightblock .smallbox .top-left, .lightblue #rightblock .smallbox .top-right, .lightblue #rightblock .smallbox .bottom-left, .lightblue #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/lightblueFilled.gif); }
.lightblue #rightblock .smallbox .inside{
	background-color:#00abc4;}

.grey #rightblock .smallbox .top-left, .grey #rightblock .smallbox .top-right, .grey #rightblock .smallbox .bottom-left, .grey #rightblock .smallbox .bottom-right{
	background-image: url(../gfx/corners/greyFilled.gif); }
.grey #rightblock .smallbox .inside{
	background-color:#a8acb6;}
/****/

/** ONDERSTE KADER VAN DE BOX = no FILL **/
.darkblue #rightblock .smallbox .smallbox .top-left, .darkblue #rightblock .smallbox .smallbox .top-right, .darkblue #rightblock .smallbox .smallbox .bottom-left, .darkblue #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/darkblueSmall.gif); }
.darkblue #rightblock .smallbox .smallbox .inside{ 
	border-left:1px solid #1d466c; border-right:1px solid #1d466c; background-color: #FFF;}

.green #rightblock .smallbox .smallbox .top-left, .green #rightblock .smallbox .smallbox .top-right, .green #rightblock .smallbox .smallbox .bottom-left, .green #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/greenSmall.gif)}
.green #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #96bf0d; border-right:1px solid #96bf0d; background-color: #FFF;}
	
.orange #rightblock .smallbox .smallbox .top-left, .orange #rightblock .smallbox .smallbox .top-right, .orange #rightblock .smallbox .smallbox .bottom-left, .orange #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/orangeSmall.gif); }
.orange #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #f6a924; border-right:1px solid #f6a924; background-color: #FFF;}

.red #rightblock .smallbox .smallbox .top-left, .red #rightblock .smallbox .smallbox .top-right, .red #rightblock .smallbox .smallbox .bottom-left, .red #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/redSmall.gif); }
.red #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #b20e21;	border-right:1px solid #b20e21;	background-color: #FFF;}

.purple #rightblock .smallbox .smallbox .top-left, .purple #rightblock .smallbox .smallbox .top-right, .purple #rightblock .smallbox .smallbox .bottom-left, .purple #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/purpleSmall.gif); }
.purple #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #622281; border-right:1px solid #622281; background-color: #FFF;}

.lightblue #rightblock .smallbox .smallbox .top-left, .lightblue #rightblock .smallbox .smallbox .top-right, .lightblue #rightblock .smallbox .smallbox .bottom-left, .lightblue #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/lightblueSmall.gif); }
.lightblue #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #00abc4; border-right:1px solid #00abc4; background-color: #FFF;}

.grey #rightblock .smallbox .smallbox .top-left, .grey #rightblock .smallbox .smallbox .top-right, .grey #rightblock .smallbox .smallbox .bottom-left, .grey #rightblock .smallbox .smallbox .bottom-right{ 
	background-image: url(../gfx/corners/greySmall.gif); }
.grey #rightblock .smallbox .smallbox .inside{
	border-left:1px solid #a8acb6; border-right:1px solid #a8acb6; background-color: #FFF;}
/****/

#rightblock .smallbox .inside { /* */
	padding:0 10px 0 10px;
	}	 
