@import url(/css/font-awesome-4.3.0.min.css);

body {
	background: url(/images/webcard/urban/bg.jpg) #000 no-repeat top left;
	-moz-background-size: cover;
	  -o-background-size: cover;
	     background-size: cover;
	background-attachment: fixed;
	font-family: Arial, sans-serif;
	font-size: 0.9em;
}

img { max-width: 100%; }

* { padding:0; margin:0; }
#wrapper {
	width: 800px;
	max-width: 100%;
	margin: 0 auto;
}
a { color: #7db0e5; text-decoration: none; }
a:hover { text-decoration: underline; }
.clearTop { clear: none; }


#nav-toggle { 
	position: absolute;
	right: 20px;
	top: 50%;
	display: none;
	vertical-align: middle;
 	font-size: 30px;
 	line-height: 40px;
 	height: 40px;
 	width: 40px;
 	margin: -20px 0 0 0;
 	border: 3px solid #eee;
 	text-shadow: 1px 1px 2px #000;
 	-webkit-border-radius: 4px;
 	   -moz-border-radius: 4px;
 	        border-radius: 4px;
 	padding: 0;
 	text-align: center;
 	color: #eee;
 	text-decoration: none;
 	-webkit-transition: color .5s;
 	   -moz-transition: color .5s;
 	     -o-transition: color .5s;
 	        transition: color .5s;
}
#nav-toggle:hover { color: #fff; }


#menu { background: url(/images/webcard/urban/contentBg.png); margin-bottom: 4px; }
#menu ul {
    padding:0;
    border: 0 none;
    height: 44px;
    list-style: none ;
}
#menu ul li {
    float:left; position: relative; z-index: 97;
    color: #fff;
}
#menu ul li:hover { z-index: 99; }
#menu ul li a {
    text-decoration: none;
    font-size: 1.1em;
    display:block;
    float:left;
    text-align: center;
    border-right: 0;
    color: #666;
    margin: 0;
    padding:0;
}

#menu ul li a span.left, #menu ul li a span.right { display: none; }
#menu ul li a span.text { color: #fff; display: block; line-height: 44px; padding: 0 15px; text-decoration: none; }
#menu ul li a:hover, #menu ul li a.active, #menu ul li:hover a {
    display: block;
    text-decoration: underline;
}

/* Submenu */
#menu div.sub {
    display:none;
    position:absolute; top:44px; left: 0; z-index: 98;
    background: #000;
    color: #fff;
    -webkit-box-shadow: 1px 1px 2px #000;
       -moz-box-shadow: 1px 1px 2px #000;
            box-shadow: 1px 1px 2px #000;
    white-space:nowrap;
}
#menu div.sub ul { height: auto; margin: 0; background:none; padding: 0; border: none; }
#menu div.sub li, #menu div.sub li:hover { text-align: left; float: none; height: auto; color: #fff; }
* html #menu div.sub li { margin: -3px 0; }
*+html #menu div.sub li { margin: -3px 0; }
#menu div.sub li a { float: none; color: #fff; padding: 10px 15px; background: none; text-align: left; height: auto; border: none; text-decoration: none; }
#menu div.sub li a span.text { color: #fff; border: none; padding:0; line-height: normal; }
#menu div.sub li a:hover, #menu div.sub li a.active { color: #666; text-decoration: underline; }
#menu div.sub li a:hover span, #menu div.sub li a.active span { background: none; border: none; }
#menu div.sub .left, #menu div.sub .right { display: none; }
#menu li:hover div.sub { display: block; }

#header { position: relative; margin: 0 auto; padding: 0; font-size: 1.3em; height: auto; margin-bottom: 4px; }
#logo { font-size: 2.2em; color: #fff; font-weight: bold; text-align: center; padding: 38px 0; text-shadow: 1px 1px 2px #000; }
#slogan { font-size: 0.3em; color: #fff; }
div#logo a { display: block; }
div#logo a img { display: inline-block; }

.efeu1, .efeu2, .efeu3, .efeu_loch { display: none; }

/* Banner */
#banner_wrapper {
    margin-bottom: 4px;
}

/* ################# CONTENT ###################### */
#content_wrapper { background: url(/images/webcard/urban/contentBg.png); padding: 20px; }
#content .sidebar { float:right; width: 200px; margin-left: 26px; background:none; }
#content h1 {  }
#content h2 { font-family: Helvetica, sans-serif; font-size: 1.5em; font-weight: normal; margin: 1em 0; }
#content { color: #fff; text-align: justify; font-size: inherit; }
#content .banner {
	margin-top: -20px;
}
#content p { margin: 1em 0; }
#content p, #content span { line-height: 1.5em; }

#footer { text-shadow: 1px 1px 1px #000; width: 800px; max-width: 100%; color: #fff; height: 29px; text-align: center; padding-top: 10px; margin: 4px auto; }
#footer a { color: #fff; }

/* ################# FORMS ########################## */
dl { margin: 1em 0; }
dt { margin-bottom: 6px; }
dt label { padding: 2px; font-size: 1.2em; }
dd { margin-left: 0; margin-bottom: 1.5em; }
dd input, dd textarea, input[type="text"], input[type="password"], textarea {
    margin-bottom: 2px;
    background-color: #262626;
    border: 1px solid #333;
    padding: 2px;
    color: #fff;
    opacity: 0.9;
}
dd input.text, dd textarea {
    width: 320px;
}
.addr, .addr input, .chk { display: none; }
dd input[type=text]:focus, dd input[type=password]:focus, dd textarea:focus, textarea:focus {
    background-color: #313131;
}
.error { padding: 4px; }

.ed-hover { background-color: #383838; border-color: #666; }
.message { color: #333; }
#content li.inactive { background-color: #53616A; border-color: inherit; }
.editDummy { color: #dfdfdf; }

#lang { width: 790px; }
#lang #label { color: #fff; text-shadow: 1px 1px 2px #000; }





@media screen and (max-width: 800px) {

	#nav-toggle { display: block; }
	#menu { display: none; }
	#menu ul { height: auto; }
	#menu ul li {
		float: none;
		width: 100%;
	}
	#menu ul li a {
		float: none;
		text-align: left;
	}
	#menu ul li a span.text { display: inline-block; }
	#menu ul li a.active span.text { text-decoration: underline; }

	#menu div.sub {
		position: relative;
		display: block;
		top: auto;
		left: auto;
		padding-left: 20px;
	}
	#menu ul li a.sub-trigger:after {
		content: '\f0d7';
		font-family: FontAwesome;
		display: inline-block;
		margin: 0;
		color: #fff;
	}
	
	
	#header { height: auto; }
	div#logo { text-align: left; padding: 15px 0; font-size: 2em; }
	div#logo a img { max-width: 70%; }

	#header_content { padding: 0 20px; }


}

@media screen and (max-width: 767px) {
	
	/* Grid */
	.ed-grid [class*="span"] {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

}


@media screen and (max-width: 568px) {

	#logo { font-size: 1.9em; }
	#logo h1 { font-size: .8em; }


	#nav-toggle { 
	 	font-size: 22px;
	 	line-height: 34px;
	 	height: 34px;
	 	width: 34px;
	 	margin: -17px 0 0 0;
	 	border: 2px solid #eee;
	}

}

@media screen and (max-width: 400px) {

	#logo h1 { font-size: .6em; }

}