/* CSS design by Pixelman.be | V1.1 14/10/2011/ */


/************** basics **************/

body {
	margin: 0;
	padding: 0;
	font-family: Verdana, Geneva, sans-serif;
	font-weight: normal;
	font-size: 11px;
	color: #FFF;
	background: #000 repeat-x top left;
}

body#offline {
	margin: 0;
	padding: 0;
	font-family: Verdana, Geneva, sans-serif;
	font-weight: normal;
	font-size: 11px;
	color: #FFF;
	background: #000 repeat-x top left;
}


html, dl, div, img, swf, form {
	margin: 0;
	padding: 0;
}

a img {
	border: none;
}

a {
	text-decoration: none;
	color: #B3BBBD;
}

a:hover {
	text-decoration: underline;
	color: #000;
}

#site { /* whole site */
	position: relative;
	margin: 0 auto;
	/*width: 880px;*/
	width: 100%;
	/*border: solid 1px red;*/
}

#wrapper {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 100%;
	float: left;
	/*border: solid 1px yellow;*/
	/*background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/dummy_home.jpg) no-repeat -68px -62px;*/
	/*background: #000 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_contentleft.jpg) repeat-y -68px 0;*/
}


body#offline wrapper {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 100%;
	float: left;
	border: solid 1px yellow;
	/*background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/dummy_home.jpg) no-repeat -68px -62px;*/
	background: #000 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_contentleft.jpg) repeat-y -68px 0;
}


*:focus {
	outline: none; /*remove blue border in safari & firefox */
}

.whitespace {
	 position: relative;
	 float: left;
	 width: 100%;
	 clear: both;
	 height: 50px;
	 display: block;
	 /*border: solid 1px black;*/
 }
 

/************** header elements **************/

#headerbg {
	position: absolute;
	top: 115px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: #5e686a url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_ruler.jpg) no-repeat 0 0;
	height: 10px;
	width: 100%;
	display: none;
}

#headerbg2 {
	position: absolute;
	top: 115px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: #5e686a url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_ruler.jpg) no-repeat 110px 0;
	height: 10px;
	width: 100%;
	z-index: 0;
}

#headerbg3 {
	position: absolute;
	top: 110px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: #5e686a url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_ruler.jpg) repeat-y 0 0;
	height: 20px;
	width: 50%;
	z-index: 0;
	display: none;
}

#headerbg4 {
	position: relative;
	top: 110px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background: #000;
	height: 20px;
	width: 110px;
	z-index: 0;
	display: block;
}


#logo {
	position: absolute;
	position: fixed;
	top: 60px;
	margin: 0 0 0 0;
	width: 110px;
	height: 155px;
	z-index: 10;
}


#logo:hover {
	filter:alpha(opacity=75);
	-moz-opacity:.75;
	opacity:.75;
}

#headerwrapper {
	position: relative;
	margin: 0 0 0 0;
	width: 100%;
	height: 115px;
	padding: 0;
}

#header {
	position: relative;
	margin: 0 auto;
	width: 880px;
	height: 115px;
	padding: 0;
}


#header h1 {
	position: absolute;
	bottom: 10px;
	margin: 0 0 0 0;
	width: 500px;
	left: 255px;
	padding: 0;
	font-size: 24px;
	font-family: Helvetica, Arial, sans-serif;
	line-height: 28px;
	font-weight: normal;
	text-transform: uppercase;
}


#baseline {
	position: absolute;
	/*top: 55px;*/
	top: 0;
	left: 200px;
	margin: 0;
	height: 54px;
	width: 465px;
	/*border: solid 1px red;*/
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_baseline.jpg) top left no-repeat;
}

#baseline p {
	position: absolute;
	margin: 0;
	padding: 0;
	font-style: italic;
	font-weight: bold;
	color: #B4B9BC;
	bottom: 10px;
}

#langnav {
	position: absolute;
	top: 40px;
	right: 0;
	display: none;
}

#langnav ul {
	position: relative;
	margin: 0 0 0 0;
	list-style: none;
	display: block;
}

#langnav ul li {
	position: relative;
	margin: 0 0 0 0;
	display: block;
}

#langnav ul li a {
	position: relative;
	margin: 0 0 0 0;
	display: block;
	text-transform: uppercase;
	font-size: 9px;
	line-height: 15px;
	font-weight: bold;
	color: #9BA5A8;
}

#langnav ul li a:hover {
	color: #FFF;
	text-decoration: none;
}


#langnav ul .current a {
	color: #FFF;
	text-decoration: none;
}

/************** content elements **************/

#contentwrapper {
	position: relative;
	margin: 0 0 0 0;
	width: 100%;
}

#content {
	position: relative;
	margin: 10px 0 0 0;
	width: 100%;
}

#contentleft {
	position: fixed;
	margin: 0 0 0 0;
	width: 210px;
	float: left;
	z-index: 10;
	display: block;
	top: 120px;
}

#contentright {
	position: relative;
	margin: 0 0 0 0;
	left: 10px;
	width: 635px;
	/*border-bottom: solid 1px red;*/
	float: right;
}

/************** nav elements **************/

#nav {
	position: relative;
	margin: 0 0 0 0;
	padding: 0;
	float: left;
	clear: both;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 20px;
	font-weight: normal;
	text-transform: uppercase;
	width: 200px;
}


#nav ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	float: left;
	/*width: 110px;*/
}

#nav li {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
}

#nav li a {
	position: relative;
	margin: 0 0 2px 0;
	padding: 1px 3px;
	color: #6A7375;
	display: block;
	/*background-color: #273032;*/
}

#nav li a:hover {
	color: #FFFFFF;
	display: block;
	/*background: #D6C97A url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_nav.jpg) repeat-y top right;*/
	text-decoration: none;
}

#nav .current a {
	color: #FFF;
	display: block;
	/*background: #D6C97A url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_nav.jpg) repeat-y top right;*/
	text-decoration: none;
}

/************** nav2 elements **************/



#nav2 {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 20px 0;
	float: left;
	clear: both;
	border-bottom: solid 1px #4869AF;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 17px;
	line-height: 20px;
	font-weight: normal;
	text-transform: uppercase;
}


#nav2 ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	float: left;
	width: 150px;
}

#nav2 li {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
}

#nav2 li a {
	position: relative;
	margin: 0 0 2px 0;
	padding: 1px 3px;
	color: #6A7375;
	display: block;
	/*background-color: #273032;*/
}

#nav2 li a:hover {
	color: #FFFFFF;
	display: block;
	/*background: #D6C97A url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_nav.jpg) repeat-y top right;*/
	text-decoration: none;
}

#nav2 .current a {
	color: #FFF;
	display: block;
	/*background: #D6C97A url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_nav.jpg) repeat-y top right;*/
	text-decoration: none;
}

/************** nav3 elements **************/

#nav3 {
	position: relative;
	margin: 0;
	padding: 0;
	width: 110px;
	float: left;
	clear: both;
	left: 0;
}

#nav3 h3 {
	position: relative;
	margin: 0 0 5px 0;
	padding: 0;
	color: #4869AF;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 10px;
	line-height: 12px;
	
}

#nav3 ul {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	float: left;
}

#nav3 li {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
}

#nav3 li a {
	position: relative;
	margin: 0 0 5px 0;
	padding: 0 0 2px 0;
	color: #67767B;
	display: block;
	text-transform: uppercase;
	border-bottom: solid 8px #67767B;
}

#nav3 li a:hover {
	text-decoration: none;
	color: #FFF;
	border-bottom: solid 8px #FFF;
}

/************** footer elements **************/

#footer {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
	clear: both;
	color: #8D999C;
	font-size: 10px;
	font-style: italic;
}

#footer a {
	color: #8D999C;
}


/************** item elements **************/

.itemwrapper {
	position: relative;
	margin: 0;
	padding: 35px 0 25px 0;
	border-bottom: solid 1px #172133;
	display: block;
	clear: both;
	float: left;
	width: 100%;
	background: none;
}

.itemwrapper:hover {
	background: url(http://www.daniellegoffa.be/images/offline/bg_offline.jpg) repeat-x 0 0;
}

.itemwrapper2 {
	position: relative;
	margin: 0 auto;
	display: block;
	clear: both;
	width: 880px;
}

.itemwrapper3 {
	position: relative;
	margin: 0;
	display: block;
	clear: both;
	width: 100%;
	float: left;
}

.item {
	position: relative;
	margin: 0 0 10px 0;
	width: 680px;
	display: block;
	clear: both;
	float: right;
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_itemright_fade.png) bottom right no-repeat;
}




.itemleft {
	position: relative;
	margin: 0 0 0 0;
	width: 465px;
	float: left;
	display: block;
}

.itemright {
	position: relative;
	margin: 0 0 0 20px;
	padding: 0 0 0 0;
	width: 195px;
	min-height: 217px;
	/*border: solid 1px red;*/
	float: left;
	text-align: right;
}

.itemimage {
	position: relative;
	padding: 0;
	margin: 0;
	clear: both;
	po
}

.caption {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 10px 15px 10px 15px;
	background-color: #000;
	color: #FFF;
	font-size: 10px;
	line-height: 13px;
	display: block;
	filter:alpha(opacity=75);
	-moz-opacity:.75;
	opacity:.75;	
}

.itemtxt {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	float: left;
	text-align: left;
	display: block;
}

.item p {
	position: relative;
	margin: 0 0 15px 0;
	padding: 0 15px 0 0;
	font-size: 11px;
	line-height: 14px;
	font-weight: normal;
	color: #939799;
}

.item h1 {
	position: relative;
	margin: 0 0 15px 0;
	padding: 0 0 0 0;
	font-size: 30px;
	line-height: 33px;
	font-weight: normal;
	color: #939799;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
}

.item h1 a {
	color: #939799;
	text-decoration: none;
}

.item h1 a:hover {
	color: #FFF;
	text-decoration: none;
}

.itemright h3 {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 13px;
	font-weight: normal;
}

.item h3 a {
	color: #B3BBBD;
}

.item h3 a:hover {
	color: #FFF;
}

.item h4 {
	position: relative;
	margin: 0 0 5px 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 13px;
	font-weight: normal;
	color: #4869AF;
}

.itemleft strong {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: 20px;
	line-height: 23px;
	font-weight: normal;
	/*color: #939799;*/
	color: #4869AF;
	display: block;
	clear: both;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
}


/************** quote elements **************/

.quote {
	position: relative;
	margin: 0 0 0 0;
	width: 465px;
	display: block;
	clear: both;
	float: right;
	background: #2b5fa2 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_quote.jpg) bottom left repeat-x;
}

.quote blockquote {
	position: relative;
	width: 365px;
	margin: 25px;
	padding: 25px;
	display: block;
	float: left;
	background-color: #000;
	font-size: 24px;
	line-height: 27px;
	font-family: Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	color: #2b5fa2;
	clear: both;
}

.quote cite {
	position: absolute;
	bottom: 0;
	right: 0;
	display: block;
	background: #2b5fa2 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_quote.jpg) bottom left repeat-x;
	font-size: 10px;
	padding: 8px 8px 8px 8px;
	font-style: italic;
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	clear: both;
}

.bigquote {
	position: relative;
	margin: 0 0 0 0;
	width: 680px;
	display: block;
	clear: both;
	float: right;
	background: #2b5fa2 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_quote.jpg) bottom left repeat-x;
}

.bigquote blockquote {
	position: relative;
	width: 560px;
	margin: 30px;
	padding: 30px;
	display: block;
	float: left;
	background-color: #000;
	font-size: 35px;
	line-height: 38px;
	font-family: Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	color: #2b5fa2;
	clear: both;
}

.bigquote cite {
	position: absolute;
	bottom: 0;
	right: 0;
	display: block;
	background: #2b5fa2 url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_quote.jpg) bottom left repeat-x;
	font-size: 10px;
	padding: 8px 8px 8px 8px;
	font-style: italic;
	font-family: Helvetica, Arial, sans-serif;
	color: #000;
	clear: both;
}



/************** item2 elements **************/

.items {
	position: relative;
	margin: 0 0 10px 0;
	width: 680px;
	display: block;
	clear: both;
	float: right;
	/*border: solid 1px red;*/
}

.items h1 {
	position: relative;
	margin: 0 0 15px 0;
	padding: 0 0 0 0;
	font-size: 30px;
	line-height: 33px;
	font-weight: normal;
	color: #939799;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
	clear: both;
}


.item2 {
	position: relative;
	margin: 0 20px 20px 0;
	width: 150px;
	height: 150px;
	display: block;
	float: left;
}

.item2text {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	width: 150px;
	height: 150px;
	display: block;
	float: left;
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_juwelen.jpg) no-repeat 0 0 ;
}

.item2text h2 {
	position: absolute;
	top: 10px;
	left: 10px;
	margin: 0 0 0 0;
	padding: 0 0 20px 0;
	display: block;
	float: left;
	color: #b7bcbe;
	font-size: 18px;
	font-weight: normal;
	text-transform: uppercase;
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_juwelen_line2.jpg) no-repeat bottom left;
}

.item2image a {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	display: block;
	float: left;
	display: block;
	width: 150px;
	height: 150px;
	z-index: 10;
}

.item2image a img {
	display: none;
}

.item2image a:hover img {
	display: block;
}

.item2 .current a img {
	display: block;
}

/************** item3 elements **************/

.item3 {
	position: relative;
	margin: 0 20px 20px 0;
	width: 150px;
	height: 150px;
	display: block;
	float: left;
}

.item3text {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	width: 150px;
	height: 150px;
	display: block;
	float: left;
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_juwelen.jpg) no-repeat 0 0 ;
}

.item3text h2 {
	position: relative;
	margin: 10px 0 0 10px;
	padding: 0 0 20px 0;
	display: block;
	width: 130px;
	float: left;
	color: #939799;
	font-size: 20px;
	font-weight: normal;
	background: url(http://www.daniellegoffa.be/admin/expressionengine/templates/default_site/images/bg_juwelen_line2.jpg) no-repeat bottom left;
	clear: both;
}

.item3text:hover h2 {
	color: #FFFFFF;
}

.item3text p {
	position: relative;
	margin: 10px 0 0 10px;
	padding: 0 0 20px 0;
	display: block;
	width: 130px;
	float: left;
	color: #fff;
	font-size: 11px;
	line-height: 14px;
	clear: both;
}

.item3image a {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	display: block;
	float: left;
	display: block;
	width: 150px;
	height: 150px;
	z-index: 10;
}

.item3image a img {
	display: block;
}

.item3image a:hover img {
	display: none;
}

.item3 .current a img {
	display: block;
}


/************** itemsnav elements **************/

#itemsnav {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	clear: both;
	float: left;
	font-family: Helvetica, Arial, sans-serif;
}

#itemsnav ul {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
}


#itemsnav li {
	position: relative;
	margin: 0 10px 0 0;
	padding: 0;
	float: left;
	display: block;
	list-style: none;
	font-size: 12px;
	text-transform: uppercase; 
}

#itemsnav li a {
	position: relative;
	margin: 0;
	padding: 10px;
	float: left;
	display: block;
	list-style: none;
	color: #4869AF;
	border: solid 1px #4869AF;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
    -webkit-transition-property : all;
    -webkit-transition-duration : .4s;
    -webkit-timing-function : ease-in-out; 
}

#itemsnav li a:hover {
	text-decoration: none;
	color: #EEE;
	border: solid 1px #EEE;
}

/************** item4 elements **************/

.itemwrapper4 {
	position: relative;
	margin: 0;
	padding: 35px 0 25px 0;
	border: none;
	display: block;
	clear: both;
	float: left;
	width: 100%;
	background: none;
}

.item4 {
	position: relative;
	margin: 0 0 10px 0;
	width: 680px;
	display: block;
	clear: both;
	float: right;
}

/************** button elements **************/

.btn {
	position: absolute;
	bottom: 15px;
	right: 15px;
	padding: 8px 10px 8px 10px;
	margin: 0;
	float: left;
	display: block;
	font-size: 12px;
	color: #4869AF;
	text-transform: uppercase;
	border: none;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
    -webkit-transition-property : all;
    -webkit-transition-duration : .4s;
    -webkit-timing-function : ease-in-out; 
	background-color: #000;
	font-family: Helvetica, Arial, sans-serif;
}

.btn:hover {
	color: #FFFFFF;
	cursor: pointer;
}

#backbutton {
	position: absolute;
	top: 0;
	right: 10px;
}


.btn2 {
	font-size: 12px;
	text-transform: uppercase;
	background: none;
	position: relative;
	margin: 0;
	padding: 10px;
	float: left;
	display: block;
	list-style: none;
	color: #4869AF;
	border: solid 1px #4869AF;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
    -webkit-transition-property : all;
    -webkit-transition-duration : .4s;
    -webkit-timing-function : ease-in-out; 
}

.btn2:hover {
	text-decoration: none;
	color: #EEE;
	border: solid 1px #EEE;
	cursor: pointer;
}

/************** form elements **************/

input {
	position: relative;
	font-size: 14px;
	margin: 0 0 10px 0;
	padding: 10px;
	display: block;
	background-color: #273032;
	border: 0;
	width: 460px;
	color: #939799;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;

}

textarea {
	position: relative;
	font-size: 14px;
	margin: 0 0 10px 0;
	padding: 10px;
	display: block;
	background-color: #273032;
	border: 0;
	width: 460px;
	color: #939799;
	min-height: 50px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;

}