@charset "UTF-8";

/*------------------------------------------------

marmeladenbrot.de | 2011 |

-------------------------------------------------- */

@import url("reset.css");

body {
font-family:Arial, Helvetica, sans-serif;
margin:14px 0 10px 10px;
padding:0;
color: #c0c0c0;
background:#1b1a1a url(../images/bg.png) repeat-x;
overflow-x:hidden;
}

img {
border:#000 solid 0px;
}

::selection { background:#faa8f9; color:#fff;}
::-moz-selection { background:#faa8f9; color:#fff;}
::-webkit-selection {background:#faa8f9; color:#fff;}

#logo {
float:left;
margin: 0 0 10px 0;
}

sup {
position: relative;
bottom:5px;
left:1px;
font-size:0.75em;
}

/* ---------------------

NAVIGATION

------------------------ */

#filtering-nav {
margin:0;
padding:0;
width:960px;
overflow:auto;
list-style-type:none;
font-family: 'Raleway', arial, sans-serif;
}

#filtering-nav a {
padding:0 0 0 18px;
text-decoration:none;
color:#c0c0c0;
font-size:21px;
line-height:26px;
}

#filtering-nav .unselect {
-moz-opacity:0.3  !important;
-webkit-opacity:0.3 !important;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)" !important;
filter: alpha(opacity=30) !important;
opacity:0.3 !important;
}

#filtering-nav a:hover {
color: #676767;
}

#filtering-nav a:focus {
outline:none;
}

#filtering-nav li {
float:left;
width:190px;
margin: 0 10px 0 0;
}

#filtering-nav li:first-child a {
padding:0;
}

#filtering-nav #lastchild {
width:90px;
}

#filtering-nav a span {
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
}

.one {
background: url(../images/one.png) transparent no-repeat 0px 6px;
}

.two {
background: url(../images/two.png) transparent no-repeat 0px 6px;
}

.three {
background: url(../images/three.png) transparent no-repeat 0px 6px;
}

.all {
background: url(../images/all.png) transparent no-repeat 0px 6px;
}


/* ----------------------

GALLERY HOME

------------------------- */

.wrap {
overflow: hidden;
clear:both;
margin: 0 0 0 -5px;
}

.box {
margin: 5px;
background: #D8D5D2;
font-size: 11px;
line-height:14px;
float: left;
position:relative;
overflow:hidden;
}

.col1 { width: 190px; height:190px; }
.col2 { width: 190px; height:190px; }
.col3 { width: 190px; height:190px; }
.col4 { width: 390px; height:390px; }
.col5 { width: 390px; height:190px; }


/* - - - - -
  BOX ONE
- - - - - - */

.col1 > span {
width:10px;
height:10px;
position:absolute;
top:0;
left:10px;
z-index:20;
background:url(../images/one.png) transparent top left no-repeat;
}

.one_i_link {
color:#ef06b6;
display:block;
margin-top:-9px;
}

.one_i_link:hover {
color:#fe78dd;
}

/* - - - - -
  BOX TWO
- - - - - - */

.col2 > span {
width:10px;
height:10px;
position:absolute;
top:0;
left:10px;
z-index:20;
background:url(../images/two.png) transparent top left no-repeat;
}

.two_i_link {
color:#912aff;
display:block;
margin-top:-9px;
}

.two_i_link:hover {
color:#bb7dfe;
}

/* - - - - -
  BOX THREE
- - - - - - */

.col3 > span {
width:10px;
height:10px;
position:absolute;
top:0;
left:10px;
z-index:20;
background:url(../images/three.png) transparent top left no-repeat;
}

.three_i_link {
color:#00d2ff;
}

.three_i_link:hover {
color:#9deeff;
}

/* ------------ */

.col1 h1, .col2 h1, .col3 h1, .col4 h1, .col5 h1  {
font-size:11px;
font-weight:normal;
text-transform:uppercase;
margin:10px 0 0 0;
}

/* ------------ */


.caption {
position: absolute;
top:190px;
width:170px;
height:190px;
color:#CCC;
background:url(../images/bg_thumbs.png) transparent;
}

.caption_m {
position: absolute;
top:190px;
width:390px;
height:190px;
color:#CCC;
background:url(../images/bg_thumbs.png) transparent;
}

.caption_xl {
position: absolute;
top:390px;
width:390px;
height:390px;
color:#CCC;
background:url(../images/bg_thumbs.png) transparent;
}

.front h2 {
font-size:12px;
}

.front p {
font-size:11px;
line-height:14px;
margin:12px 0 0 0;
}

.front {
position:absolute;
z-index:10;
left: 0px;
padding: 10px;
outline: none;
text-decoration:none;
}

.back {
position:absolute;
top:0px;
left:0px;
z-index:5;
}


/* ----------------------

GALLERY

------------------------- */


#wrapper {
clear:both;
margin:0;
padding:0;
width:1100px;
text-align: left;
}

#info_txt, #info_txt_one, #info_txt_three {
float:left;
margin: 0 10px 0 0;
}

#wrapper a {
color:#c0c0c0;
}

#wrapper a:hover {
color:#676767;
}

#wrapper h1 {
font-weight:normal;
font-family: 'Raleway', arial, serif;
font-size:20px;
line-height:26px;
text-transform:uppercase;
margin: 0 0 10px 0;
max-width:190px;
overflow:hidden;
}

#info_txt h2, #info_txt_one h2, #info_txt_three h2 {
font-weight:normal;
font-size:10px;
line-height:14px;
text-transform:uppercase;
margin: 0 0 10px 0;
max-width:190px;
text-indent:15px;
}

#info_txt h2 {
background:url(../images/two.png) transparent 0px 1px no-repeat;
}

#info_txt_one h2 {
background:url(../images/one.png) transparent 0px 1px no-repeat;
}

#info_txt_three h2 {
background:url(../images/three.png) transparent 0px 1px no-repeat;
}

#wrapper p {
width:190px;
font-size:12px;
line-height:16px;
margin-bottom: 10px; 
}


/* ----------------------

CONTENT
(Contact, Imprint etc.)

------------------------- */


#content {
clear:both;
margin:0;
padding:0;
width:1100px;
text-align:left;
}

#spalte_01 {
float:left;
width:390px;
margin: 0 0 100px 0; 
padding: 0 10px 0 0;
}

#spalte_02 {
float:left;
width:391px;
margin: 0 0 100px 0; 
padding: 0 10px 0 0; 
}

#content a {
color:#c0c0c0;
}

#content a:hover {
color:#676767;
}

#content h1 {
margin: 0 0 8px 0;
font-weight:normal;
font-family:'Raleway', arial, serif;
font-size:21px;
line-height:26px;
text-transform:uppercase;
}

#content p {
margin-top:12px;
font-size:12px;
line-height:16px;
}

#content img+p{
margin: 8px 0 8px 0;
}

/* Video */
.content iframe {
margin-bottom:50px; 
}


/* ----------------------

FOOTER

------------------------- */

#footer {
clear:both;
margin:40px 0 0 0;
padding:0;
width:1800px;
height:50px;
list-style-type:none;
background:url(../images/bg.png) transparent -10px 20px repeat-x;
}

#footer a {
text-decoration:none;
color:#c0c0c0;
font-size:10px;
}

#footer a:hover {
color:#676767;
}

#footer a:focus {
outline:none;
}

#footer li {
float:left;
display:block;
margin:0 10px 0 0;
padding:0;
width:190px;
}

/* ----------------------

Award Logo

------------------------- */

#css_award {
	position:absolute;
	top:-7px;
	right:0px;
	z-index:1500;
}