/*-----------------------------------------------------------------------------
Website: Arne Quinze
Auteur: Webatvantage.be
Laatst gewijzigd: 02-12-09
-----------------------------------------------------------------------------*/

/*------------------------------- START HTML / BODY -------------------------------*/
/*html, body { background: #dcdcdc; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; color: #000; line-height: 16px; }*/
html, body { background: #fff url('../Graphics/Body_bg.gif') repeat-x top left; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; color: #000; line-height: 16px; }

html, body, #container { height: 100%; }
body > #container {height: auto; min-height: 100%; }
/*------------------------------- END HTML / BODY -------------------------------*/

/*------------------------------- START HEADINGS -------------------------------*/
h1 { margin: 0 0 18px 0; font-size: 14px; font-weight: bold; color: #000; text-transform: uppercase; }
	h1 a:link,
	h1 a:visited,
	h1 a:active { text-decoration: none; }
	h1 a:hover { text-decoration: underline; }
h2 { margin: 0 0 16px 0; font-size: 11px; font-weight: bold; color: #999; }
	h2 a:link,
	h2 a:visited,
	h2 a:active { color: #999; text-decoration: none; }
	h2 a:hover { color: #666; text-decoration: underline; }
/*------------------------------- END HEADINGS -------------------------------*/

/*------------------------------- START LINKS -------------------------------*/
a:link, a:visited, a:hover, a:active { color: #000 }
a:focus { outline: none; }
submit:focus { outline: none; }
/*------------------------------- END LINKS -------------------------------*/

/*------------------------------- START CONTAINER -------------------------------*/
#container { width: 960px; height: auto; margin: 0 auto 0 auto; background: #fff; }
/*------------------------------- END CONTAINER -------------------------------*/

/*------------------------------- START HEADER -------------------------------*/
#header { position: relative; width: 960px; height: 30px; padding: 70px 0 0 0; background: url('../Graphics/Body_bg.gif') repeat-x top left; }

/* Logo */
#header a#logo { position: absolute; bottom: 0; left: 0; display: block; width: 218px; height: 30px; background: url('../Graphics/Logo.gif') no-repeat top left; text-indent: -9999px; }
/*------------------------------- END HEADER -------------------------------*/

/*------------------------------- START MAIN -------------------------------*/
/*#main { overflow: hidden;  }*/
#main {padding-bottom: 30px; }
/*------------------------------- END MAIN -------------------------------*/

/*------------------------------- START SIDEBAR -------------------------------*/
#sidebar { float: left; width: 218px; height: auto; margin: 50px 0 0 0; }

/* Navigation */
#sidebar ul#navigation { width: 218px; height: auto; margin: 0 0 40px 0; }
#sidebar ul#navigation li { display: block; width: 218px; height: auto; }
#sidebar ul#navigation li a { display: block; width: 218px; height: auto; text-indent: -9999px; }
#sidebar ul#navigation li a.active { background-position: bottom left; }
#sidebar ul#navigation li a#nav_works { height: 17px; margin: 8px 0 13px 0; background-image: url('../Buttons/Works.gif'); }
#sidebar ul#navigation li a#nav_calendar { height: 29px; margin: 0 0 17px 0; background-image: url('../Buttons/Calendar.gif'); }
#sidebar ul#navigation li a#nav_biography { height: 45px; margin: 0 0 5px 0; background-image: url('../Buttons/Biography.gif'); }
#sidebar ul#navigation li a#nav_news { height: 17px; margin: 8px 0 13px 0; background-image: url('../Buttons/News.gif'); }
#sidebar ul#navigation li a#nav_contacts { height: 27px; margin: 0; background-image: url('../Buttons/Contacts.gif'); }

/* Arne Quinze URL */
#sidebar a#arne_quinze_url { display: block; width: 218px; height: 10px; margin: 56px 0; background: url('../Graphics/Url.gif') no-repeat top left; text-indent: -9999px; }

/* Login form */
#sidebar .login_form { width: 175px; margin: 0 0 10px 45px; padding: 10px; background: #dcdcdc; overflow: hidden; } 
#sidebar .login_form label { display: block; width: 175px; height: auto; margin: 0 0 8px 0; }
/*
#sidebar .login_form label#label_user { height: 23px; background: url('../Graphics/Label_email.gif') no-repeat top left; }
#sidebar .login_form label#label_password { height: 27px; margin: 0 0 8px 0; background: url('../Graphics/Label_password.gif') no-repeat top left; }
*/

#sidebar .login_form .input,
#sidebar .login_form .input_error { width: 165px; height: 14px; margin: 0 0 5px 0; padding: 4px; border: 1px solid #fff; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; color: #000; }
#sidebar .login_form .submit { width: 92px; height: 27px; margin: 10px 0 0 0; background: url('../Buttons/Submit_login.gif') no-repeat top left; border: none; cursor: pointer; }

#sidebar #login_succes  { width: 175px; margin: 0 0 10px 45px; overflow: hidden; }
#sidebar #login_succes .name { font-weight: bold; }
#sidebar #login_succes a { float: left; display: block; width: 86px; height: 36px; margin: 5px 0 0 0; background: url('../Buttons/Logout.gif'); border: none; color: #fff; text-transform: uppercase; text-indent: -9999px; }

#sidebar .feedback_message { display: none; }
#sidebar .error_message { margin: 0 0 10px 45px; color: #c00; }
/*------------------------------- END SIDEBAR -------------------------------*/

/*------------------------------- START CONTENT -------------------------------*/
/*#content { float: right; width: 708px; min-height: 550px; height: auto !important; height: 550px; margin: 50px 0 0 0; }*/
#content { float: right; width: 708px; margin: 50px 0 0 0; }

/* Home recent work */
#home_recent_work { position: relative; float: left; width: 435px; height: auto; margin: 0; }
#home_recent_work .work_container { overflow: hidden; }
#home_recent_work a#show_all_works { position: absolute; top:0; right: 0; color: #999; text-decoration: none; font-weight: bold; }
#home_recent_work a:hover#show_all_works { color: #666; }
#home_recent_work .item { float: left; width: 203px; min-height: 355px; height: auto !important; height: 355px; margin: 0 25px 25px 0; border: 1px solid #ccc; }
#home_recent_work .item:hover { border: 1px solid #999; }
#home_recent_work .last { margin-right: 0; }
#home_recent_work .item p { padding: 12px; text-align: center; }

/* Home calendar */
#home_calendar { position: relative; float: left; width: 188px; height: auto; margin: 0 0 0 70px; }
#home_calendar .item { height: auto; margin: 0 0 25px 0; padding: 0 0 0 10px; border-left: 4px solid #999; }

/* Home news */
#home_news { position: relative; float: left; width: 188px; height: auto; margin: 0px 0 0 70px; padding: 0; /*border-top: 1px solid #ddd*/ }
#home_news .item { height: auto; margin: 0 0 25px 0; padding: 0 0 0 10px; border-left: 4px solid #999;  }

/* Breadcrumbs */
ul#breadcrumbs { width: auto; height: 15px; line-height: 15px; margin: 0 0 30px 0; }
ul#breadcrumbs li { display: inline; }
ul#breadcrumbs li a:link,
ul#breadcrumbs li a:visited,
ul#breadcrumbs li a:active { float: left; display: block; width: auto; height: 15px; line-height: 15px; margin: 0 20px 0 0; padding: 0 0 0 35px; color: #999; font-weight: bold; background: url('../Graphics/Breadcrumbs_arrow.gif') no-repeat top left; text-decoration: none; }
ul#breadcrumbs li a:hover { text-decoration: underline; }

ul#breadcrumbs li a.active { color: #666; background-position: bottom left; }

/* Works */
#works { overflow: hidden; margin: 0 0 25px 0; }
#works .item { float: left; width: 203px; min-height: 365px; height: auto !important; height: 365px; margin: 0 25px 25px 0; border: 1px solid #ccc;}
#works .item:hover { border: 1px solid #999; }
#works .private { position: relative; }
#works .private span.private_sign { position: absolute; display: block; bottom: -1px; right: -1px; width: 104px; height: 61px; background: transparent url('../Graphics/Exclusive.png') no-repeat top left; text-indent: -9999px; z-index: 99; }
#works .last { margin-right: 0; }
#works .item p { padding: 12px; text-align: center; }

#works_detail { overflow: hidden; margin: 0 0 25px 0; }
#works_detail .thumb { float: left; width: 203px; min-height: 230px; height: auto !important; margin: 0 25px 25px 0; border: 1px solid #ccc; }

#works_detail .large { float: left; width: 435px; height: 230px; margin: 0; border: none; }

#works_detail div.back a { clear: both; display: block; height: 24px; line-height: 24px; padding: 0 0 0 30px; background: url('../Graphics/Arrow_back.gif') no-repeat center left; }

/* Biography */
#biography { margin: 0 0 20px 0; color: #666; line-height: 18px; overflow: hidden; }
#biography #text { float: left; width: 414px; }

#biography #photos { float: right; width: 254px; padding: 0 20px; }
#biography #photos .box { width: 254px; height: 300px; margin: 0 0 50px 0; overflow: hidden; }
#biography #photos .box p { margin: 5px 0 0 0; }

/* Calendar */
#calendar { overflow: hidden; margin: 0 0 25px 0; padding: 0 20px 0 0; }
#calendar .item { overflow: hidden; margin: 0; }
#calendar .item img { float: left; width: 105px; margin: 0 10px 4px 0; }
#calendar .item p { margin: 0 0 0 109px; padding: 10px 20px;  }
#calendar .item p.dark { padding: 20px; background: #dcdcdc; }
#calendar div.back a { clear: both; display: block; height: 24px; line-height: 24px; padding: 0 0 0 30px; background: url('../Graphics/Arrow_back.gif') no-repeat center left; }

#calendar img.large { float: left; margin: 0 15px 10px 0; padding: 1px; border: 1px solid #ddd; }

/* News */
#news { overflow: hidden; margin: 0 0 25px 0; padding: 0 20px 0 0; }
#news #news_overview { overflow: hidden; }
#news #news_overview .item { margin: 0 0 10px 0; padding: 0 0 10px 0; border-bottom: 1px dotted #ddd; }
#news #news_overview .item a.title { display: block; height: 24px; line-height: 24px; padding: 0 0 0 30px; background: url('../Graphics/Arrow.gif') no-repeat center left; font-weight: bold; }
#news #news_overview .item p.header { font-style: italic; }

#news div.header { font-style: italic; margin: 0 0 10px 0; background: #eee; padding: 10px; }
#news div.description { margin-bottom: 10px; }
#news div.description .photo { float: left; border: 1px solid #ddd; padding: 1px; margin: 0 10px 10px 0; }
#news div.back a { clear: both; display: block; height: 24px; line-height: 24px; padding: 0 0 0 30px; background: url('../Graphics/Arrow_back.gif') no-repeat center left; }
/*------------------------------- END CONTENT -------------------------------*/

/*------------------------------- START CONTACT -------------------------------*/
form#contact p { margin: 0 0 5px 0; overflow: hidden; }
form#contact p.info_message { margin: 0 0 15px 0; background: url('../Graphics/Arrow.gif') no-repeat center left; }
form#contact p.error_message { margin: 0 0 15px 0; color: #c00; background: url('../Graphics/Arrow_red.gif') no-repeat center left; }

form#contact label { float: left; width: 100px; height: 25px; line-height: 25px; margin: 0; }

form#contact .input,
form#contact .inputred { float: left; width: 242px; height: 17px; margin: 0; padding: 4px; border: 1px solid #fff; border-bottom: 1px solid #ddd; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; }
form#contact .input:focus,
form#contact .textarea:focus { border: 1px solid #fff; border-bottom: 1px solid #999; }
form#contact .inputred { border: 1px solid #fff; border-bottom: 1px dotted #c00; }

form#contact .textarea,
form#contact .textareared { float: left; width: 242px; height: 100px; margin: 0; padding: 4px; border: 1px solid #fff; border-bottom: 1px solid #ddd; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 11px; overflow: auto; }
form#contact .textareared { border: 1px solid #fff; border-bottom: 1px dotted #c00; }

form#contact .required,
form#contact .required_error  { float: left; display: block; width: 40px; height: 25px; background: url('../Graphics/Form_arrow.gif') no-repeat top left; margin: 0 10px 0 0; text-indent: -9999px;}
form#contact .required_error { background-position: bottom left; }

form#contact .error { color: #c00; }
form#contact .submit { float: left; width: auto; height: 25px; line-height: 25px; margin: 10px 5px 0 150px; background: #222; border: none; color: #fff; text-transform: uppercase; font-size: 11px; cursor: pointer; }
form#contact .send { float: left; width: 50px; height: 20px; margin: 0 0 0 145px; background: url('../Buttons/Send.gif') no-repeat top left; border: none; color: #fff; text-transform: uppercase; font-size: 11px; cursor: pointer; }
form#contact #btn_submit { float: left; width: 92px; height: 27px; margin: 20px 0 0 145px; background: url('../Buttons/Submit.gif') no-repeat top left; border: none; color: #fff; text-transform: uppercase; font-size: 11px; cursor: pointer; }
/*------------------------------- END CONTACT -------------------------------*/

/*------------------------------- START JQZOOM -------------------------------*/
div.zoomdiv { z-index: 100; position: absolute; top: -2px; left: 0px; width: 355px; height: 355px; background: #fff; border: 1px solid #ccc; display: none; text-align: center; overflow: hidden; }
img.jqzoom { cursor: crosshair; position: relative; }
/*------------------------------- END JQZOOM -------------------------------*/

/*------------------------------- START FOOTER -------------------------------*/
#footer {
	position: relative;
	margin-top: -30px;
	height: 30px;
	background: #dcdcdc;
	clear: both;
} 

#footer .content { width: 960px; height: 30px; line-height: 30px; margin: 0 auto; background: #dcdcdc; color: #666; text-align: left; font-size: 11px; }

#footer a:link,
#footer a:visited,
#footer a:active { color: #666; text-decoration: none; }
#footer a:hover { color: #333; text-decoration: underline; }
/*------------------------------- END FOOTER -------------------------------*/

/*------------------------------- START CLEARFIX -------------------------------*/
.clearfix:after {content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/*------------------------------- END CLEARFIX -------------------------------*/

/*------------------------------- START OTHER CLASSES -------------------------------*/
.clear { clear: both; }
.hide { display: none; }
.left { float: left; }
.right { float: right; }
.button { clear: both; float: left; width: auto; height: 25px; line-height: 25px; margin: 15px 0; padding: 0 10px; background: #000; color: #fff !important; text-decoration: none; text-transform: uppercase; font-size: 11px; }
/*------------------------------- END OTHER CLASSES -------------------------------*/