/* All CSS Coding by Steven Hugo for sabboika.be */
/* Do not steal this code, learn to code yourself */
/* All images, works and other content are © 2005 Sabboika.be unless stated otherwise */
/* Check my personal website http://www.stevenhugo.be for my other work */


/* ----- BASIC ----- */
    body { background-color: #FFFFFF; font-family: "Trebuchet MS", verdana,serif; font-size: 13px; color: #58595B; text-align:center; height:100%; margin-top:0; margin-bottom:0; }
    table { font-family: "Trebuchet MS", verdana,serif; font-size: 13px; color: #58595B; }
    img { border: 0px; }
    a:link, a:visited, a:active { color:#356AA0;text-decoration:none; }
    a:hover	{ text-decoration: underline; color:#356AA0;}
    .maincontainer { position:absolute; left:50% ; margin-left: -375px;text-align:center; }
    #container { width: 711px; line-height: 130%; text-align:left;}

/* ----- ELEMENTS ----- */
    img 	{ border: 0px; }
    h1	{ font-size: 18px; color:#356AA0; padding: 20px 0px 0px 20px; }
    h2	{ font-size: 16px; color:#FF7400; padding: 0px 0px 0px 0px;}
    h3	{ font-size: 14px; color:#FF7400; padding: 0px 0px 0px 0px; }
    h4	{  }
    h5	{ padding: 0px 0px 0px 20px;font-size:11px;font-weight:normal; color:#919396;}
    strong	{  }
    p	{ padding: 0px 10px 20px 20px;  }
    hr	{ border: solid 1px #FF7400; }
    ul	{ list-style-image: url(../images/calendar.gif);list-style-type: circle;}

/* ----- LINKS ----- */
    #topmenu a:link, #topmenu a:visited, #topmenu a:active { color:#58595B;text-decoration:none; }
    #topmenu a:hover	{ text-decoration: none; color:#FF7400;	}
    #menu a:link, #menu a:visited, #menu a:active { color:#58595B;text-decoration:none; }
    #menu a:hover	{ text-decoration: none; color:#FF7400;	}


/* ----- HEADER ----- */
    #header{width:711px;}
    #topmenu {height:20px;margin-top:10px;text-align:right;padding-right:20px;color:#58595B;}
    #menu	{ text-align:left; padding-left:20px; }


/* ----- NOG NODIG?????? ----- */
    h5 img {padding-right:5px;}
    .clear{clear:both;margin:0px;}


/* ----- ALGEMEEN ----- */
    .comment {margin-left:20px;padding-left:0px;border: solid 0px #356AA0; border-bottom-width: 1px;}
    ul .date { font-size:11px; padding-right:5px;} 
    .clearboth {clear:both;height:10px;}   
    #register{width:700px;text-align:center;}
    
/* ----- AGENDA.ASPX ----- */
    #agenda .item {padding: 20px 0px 0px 20px; }
    #agenda .item img {float:left;padding: 10px 15px 10px 10px;}
    #agenda .item h1 { font-size: 18px; color:#356AA0; padding: 5px 0px 0px 0px; margin-bottom: 0px;  }
    #agenda .item p {padding: 3px 0px 0px 0px; margin-top: 0px; }

/* ----- BIVAK.ASPX ----- */
    #bivak ul {list-style-type: disc;list-style-image: url('');}

/* ----- INDEX.ASPX ----- */
    #containerleft { float: left; width: 550px; margin: 0; padding: 0;}
    #containerright { float: right; width: 139px; margin: 0; padding: 0;}
    #containerright h1 { padding: 0px; padding-top:20px;}
    #contentcontainer {width: 550px; line-height: 130%;}
    #content { float: left; width: 544px; margin: 0; padding: 0;}
    #article {width:544px;float:left;}
    #news { width:544px;height:172px;clear:both;}
    #calendar { float: right; width: 220px; height:280px; margin: 0; padding: 0;}
    #guestbook { width:550px;height:200px;clear:both;}
    #smoel { padding-bottom:20px;}
    #news ul { list-style-image: url(../images/article.gif);list-style-type: circle; }
    #calendar ul { list-style-image: url(../images/calendar.gif);list-style-type: circle }
    #calendar {width:220px;height:280px;float:right;}

    #flickr script, #smoel img {border: solid 0px #FF7400;}
    #flickr img {width:60px; height:60px;padding:3px; }
	
/* ----- INFO.ASPX ----- */
    #info p {padding: 0px 10px 0px 20px;}

/* ----- LEIDING.ASPX ----- */
    #containerleiding .row1 {width: 690px;}
    .profileleft {float: left; width: 345px; margin: 0; padding: 0;}
    .profileright {float: right; width: 345px; margin: 0; padding: 0;}
    .speelclub {padding: 0px 0px 0px 20px;}
    #containerleiding img {float:left;padding:10px;}
    #containerleiding .info {font-size: 11px;color:#919396;padding-top:0px;}

/* ----- ADMIN/ALGEMEEN ----- */

/* ----- ADMIN/AGENDA.ASPX ----- */
    table th {background-color:#FF7400;color:#FFFFFF;padding-left:10px;}
    table .delcol {text-align:center;}
    #agenda textarea {height:160px; width:500px;}
    #successmessage{width:450px;padding:15px;text-align:center;background-color:#D1FF9F;border:solid 1px #488E00;color:#488E00;font-weight:bold;}
    .messagecontainer{width:700px;text-align:center;}
    .icons{text-align:center;}
    
/* ----- ADMIN/AGENDA_ADD.ASPX ----- */
    .tblagenda {margin: 20px 0px 0px 50px; width: 600px; }
    #agenda .left {  vertical-align: top; text-align: left; width: 75px; }
    #agenda .right { vertical-align: top; text-align: left; }
    #agenda .txtinput {width:250px;}
    .btn{ font-weight:normal; color:#333333; border:1px #c6c7ca solid; background: url(../images/btn_bg.gif) #e4e4e4 top repeat-x; }
    .txtinput {width:250px;}
    
/* ----- ADMIN/USER_EDIT.ASPX ----- */
    .tbluser {margin: 0px 0px 0px 20px; width: 600px; }
    #user .left {  vertical-align: top; text-align: left; width: 150px; }
    #user .right { vertical-align: top; text-align: left; }
    #user .txtinput {width:250px;}
    #user h2 {margin: 0px 0px 0px 20px;}
    
    td.adminborderimg a {border-style:solid;border-width:1px;border-color:#DDDDDD;height:100px;width:120px;display: block;	padding: 0px 1px 1px 0px;}
td.adminborderimg a:hover   { border-style:solid;border-width:1px;border-color:#FFCC99;	padding: 1px 0px 0px 1px; }
     
/* ----- BUTTONS ----- */
.buttons {text-align:right;}
.buttons a, .buttons button{
    display:block;
    float:left;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Trebuchet MS", Tahoma, Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px; /* IE6 */
}
.buttons button[type]{
    padding:5px 10px 5px 7px; /* Firefox */
    line-height:17px; /* Safari */
}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px; /* IE7 */
}
.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}


/* STANDARD */

button:hover, .buttons a:hover{
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
.buttons a:active{
    background-color:#6299c5;
    border:1px solid #6299c5;
    color:#fff;
}

/* POSITIVE */

button.positive, .buttons a.positive{
    color:#529214;
}
.buttons a.positive:hover, button.positive:hover{
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}
.buttons a.positive:active{
    background-color:#529214;
    border:1px solid #529214;
    color:#fff;
}

/* NEGATIVE */

.buttons a.negative, button.negative{
    color:#d12f19;
}
.buttons a.negative:hover, button.negative:hover{
    background:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;
}
.buttons a.negative:active{
    background-color:#d12f19;
    border:1px solid #d12f19;
    color:#fff;
}


#guestbook .buttons {}   
    
.tblprofile label {font-weight:bold;}
.tblprofile {width: 600px; padding-left:20px;}
#algemenegegevens {padding-left:20px;}

.newsimg {float:left; padding-right:5px;padding-bottom:5px;max-width:300px;}