/* FARBEN
  violett: #66547c
  hellblau: #d0d7e1
  fließtext: #333333
  grau: #8b919d 
 */


* {margin:0; padding:0; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;}

body {font-size:14px; font-family:'Roboto',arial,verdana,sans-serif; color:#0c4361; counter-reset:section; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
html.ie6, .ie6 body, html.ie7, .ie7 body {overflow:hidden;}                               


/* ALLGEMEIN ---------------------------------------------------------------- */

a {outline:none; color:#0c4361; text-decoration:underline;}
:focus {outline:none;}
p {line-height:150%; margin-bottom:15px; text-align:justify;}
p b {font-size:16px;}
img {border:none; display:block; max-width:100%; height:auto;}
input, select, textarea, label {font-size:100%; font-family:inherit; color:inherit;}
h1 {}
h2 {}
h3 {}
nav ul {list-style:none;}

.clear, .wrapper:after, nav ul:after, #content ol:after {float:none; clear:both; height:0; display:block; font-size:0; content:"."; visibility:hidden;}

/* SCHRIFTEN ---------------------------------------------------------------- */

h1, h2, h3 {font-family: 'Cinzel', serif; font-weight:normal; line-height:100%;}
h1 {font-size:250%; color:#a68905; margin-bottom:20px; text-align:center;}
h2 {font-size:200%; color:#a68905; margin-bottom:15px; text-align:center;}
h3 {font-size:150%; color:#a68905; margin-bottom:15px;}

/* BEREICHE ----------------------------------------------------------------- */

.wrapper {margin:0 auto; width:90%; max-width:1000px; position:relative;}

/* HEADER ------------------------------------------------------------------- */

header {padding-top:1.5em;} 
header .dotted_line {margin:0.5em 0 1.5em 0;}
#logo img {margin:0 auto 20px; display:block;}
#sujet {position:relative; font-family:'Cinzel', serif; text-align:center;}
  #sujet #claim {position:absolute; width:55%; left:5%; top:20%;}
    #sujet blockquote {border-top:1px solid #a68905; border-bottom:1px solid #a68905; padding:10px 0; font-size:21px; color:#fff;}
      #sujet blockquote small {font-size:14px;}
    #sujet h1 {border:1px solid #a68905; padding:10px; font-size:21px; color:#fff; display:inline-block; margin-bottom:21px;}

/* NAV ---------------------------------------------------------------------- */

#nav-container {background-color:#0f3e5b; position:relative; }
#nav-container nav {background-color:#fff; bottom:-1px;}
#nav-container nav ul {list-style:none; /*display:table;*/ width:100%;}
#nav-container nav ul li {/*display:table-cell;*/ float:left; width:20%;}
#nav-container nav a {font-size:14px; font-weight:bold; text-transform:uppercase; text-decoration:none; display:block; padding:10px 20px; text-align:center; border:none;}
#nav-container nav li.active a, #nav-container nav a:hover {color:#a68905; } 

#xing {position:absolute; left:0; bottom:40px;}
#xing a {margin-bottom:10px; background-color:#a68905; padding:5px; display:block;}

/* CONTENT ------------------------------------------------------------------ */

#content-container {background:#fff;}
#content {line-height:1.5; padding:40px 0;}
#content p, #content ul, #content ol {margin-bottom:1em;}
#content p:last-child, #content ul:last-child, #content ol:last-child {margin-bottom:0;}

#content ol {list-style:none; padding-top:30px; margin-bottom:30px;}
#content ol li {position:relative; width:32%; float:left; margin-right:2%; font-family:'Cinzel',serif; font-size:16px; padding:20px 0; border-top:1px solid #a68905; border-bottom:1px solid #a68905; text-align:center;}
.page-2 #content ol li {width:23%; margin-right:2.66%;}
#content ol li:last-child {margin-right:0;}
#content ol li:before {counter-increment:section; content:counter(section); position:absolute; width:60px; height:60px; top:-40px; left:50%; margin-left:-30px; background:url(../img/counter.png) no-repeat; color:#fff; font-size:21px; padding:15px 0; text-align:center;}


#content ul {margin-bottom:15px; padding-left:25px;}
#content ul li {/*background-image:url(../img/list-item.gif); background-repeat:no-repeat; background-position:1px 5px;*/}

#content .csc-textpic-image, #content .news-list-image img, .news-single-item img {/*-moz-box-shadow: 0 0 5px 2px #d0d7e1; -webkit-box-shadow: 0 0 5px 2px #d0d7e1; box-shadow: 0 0 5px 2px #d0d7e1;*/ margin:0 10px 10px 0px;}
#content .related img {/*box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;*/ margin:0 5px 0 0;}
.news-single-files {margin-bottom:15px;}
.news-single-files img {float:left; margin-right:5px;}
.news-single-files dd a {margin-right:5px;}

.flexslider {border:none!important; width:100%;}

#social-bookmarks {margin-bottom:1.5em;}

/* VEROEFFENTLICHUNGEN ------------------------------------------------------ */

#content ul.csc-uploads {padding-left:0;}
.csc-uploads-fileName {margin-bottom:0.5em;}
.csc-uploads-element {border-bottom:1px dotted #d0d7e1; padding-bottom:0.5em;} 
.csc-uploads-description {margin-bottom:0.5em;}
#content .csc-uploads-element img {-moz-box-shadow: 0 0 5px 2px #d0d7e1; -webkit-box-shadow: 0 0 5px 2px #d0d7e1; box-shadow: 0 0 5px 2px #d0d7e1; margin:5px 10px 5px 5px; padding:0;}

/* PRESSE ------------------------------------------------------------------- */

.news-header-list-date {padding-left:0.5em; font-size:80%;}
.news-list-container .news-list-item {width:48%;}
.news-list-container .news-list-item-left {float:left;}
.news-list-container .news-list-item-right {float:right;}
.news-list-title {margin-top:3px; font-size:21px; text-align:left;}
.news-list-title .news-list-date {font-size:80%;}
.news-list-image {float:left; margin-right:5px;}
.news-list-morelink {margin-left:0.3em;}
.news-list-container .dotted_line {margin-top:1.5em;}
.news-single-img {float:right; margin:0 0 20px 20px;}

/* MULTIPLE CONTENT  -------------------------------------------------------- */

.subcolumns {overflow: hidden; width: 100%;}
#content .subcolumns .csc-default {background:none; margin-bottom:0; padding-bottom:0;}
.subcl {padding: 0 10px 0 0; margin-bottom:1.5em;}
.subcr {padding: 0 0 0 10px; margin-bottom:1.5em;}
.c33l,.c33r {width: 33.333%;}
.c40l,.c40r {width: 40%;}
.c50l,.c50r {width: 50%;}
.c60l,.c60r {width: 60%;}
.c66l,.c66r {width: 66.666%;}
.c33l,.c40l,.c50l,.c66l,.c60l {float: left;}
.c33r,.c40r,.c50r,.c66r,.c60r {float: right; margin-left: -5px;}

/* PROJECTS ----------------------------------------------------------------- */

#projects-container {background-color:#e5e7ec; padding:20px 0;}
  #projects-container ul {list-style:none;}
    #projects-container ul li {width:25%; padding:0 20px; float:left;} 
      #projects-container ul li img {margin:20px auto;}
      #projects-container ul li span {display:block; text-align:center;}
  

/* FOOTER ------------------------------------------------------------------- */

#footer-container {background-color:#0F3E5B;}

footer {padding:10px;}

footer nav {float:right;}
footer nav ul {list-style:none;}
footer nav ul li {float:left; margin-left:5px;}
footer nav ul li a {color:#fff; text-decoration:none; text-transform:uppercase; font-weight:bold;}
footer nav ul li.first {padding-right:5px;}

/* HOME ------------------------------------------------------------------- */

.home .col-md-6 {margin-bottom:80px;}
.home .col-md-6:first-child .inner {background-color:#e5e7ec;}
.home .col-md-6 .inner {height:100%; border-top:1px solid #a68905; border-bottom:1px solid #a68905; padding:20px; text-align:center; display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-end;}
.home .col-md-6 img {margin:10px auto; max-height:40px;}
.home .col-md-6 p {margin-bottom:0!important; text-align:center;}
.home .col-md-6 a.more {font-family:'Cinzel', serif; font-weight:500; display:inline-block; font-size:16px; text-transform:uppercase; margin-top:20px; background-color:#fff; border:1px solid #a68905; padding:7.5px 10px; text-decoration:none;}
.home h2.line {position:relative; z-index:1;}
.home h2.line:before {border-top:1px solid #a68905; content:""; margin:0 auto; position: absolute; top:50%; left:0; right:0; bottom:0; width:100%; z-index:-1;}
.home h2.line span {background: #fff; padding: 0 15px;}

.home .col-md-4 {text-align:center; margin-bottom:15px;}
.home .icon {display:inline-block; margin:0 2px;}
.home .icon img {max-height:40px; background-color:#a68905; padding:5px}
.home #sujet h1 {border:none; margin-bottom:0;}
.home #sujet blockquote {border:none;}

/*----------------------------- FANCYBOX -------------------------------------*/

/*! fancyBox v2.1.3 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image,
.fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp
{padding: 0; margin: 0; border: 0; outline: none; vertical-align: top;}

.fancybox-wrap {position: absolute; top: 0; left: 0; z-index: 8020;}

.fancybox-skin {position: relative; background: #ffffff; color: #333333; text-shadow: none;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}

.fancybox-opened {z-index: 8030;}

.fancybox-opened .fancybox-skin {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {position: relative;}
.fancybox-inner {overflow: hidden;}
.fancybox-type-iframe .fancybox-inner {-webkit-overflow-scrolling: touch;}
.fancybox-error {color: #333333; font: 14px/20px Arial,sans-serif; margin: 0; padding: 5px; white-space: nowrap;}
.fancybox-image, .fancybox-iframe {display: block; width: 100%; height: 100%;}
.fancybox-image {max-width: 100%; max-height: 100%;}
#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {background-image: url('../img/fancy_img/fancybox_sprite.png');}
#fancybox-loading {position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: 0.8; cursor: pointer; z-index: 8060;}
#fancybox-loading div {width: 44px; height: 44px; background: url('../img/fancy_img/fancybox_loading.gif') center center no-repeat;}
.fancybox-close {position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040;}

.fancybox-nav {position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('../img/fancy_img/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040;}

.fancybox-prev {left: 0;}
.fancybox-next {right: 0;}
.fancybox-nav span {position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden;}
.fancybox-prev span {left: 10px; background-position: 0 -36px;}
.fancybox-next span {right: 10px; background-position: 0 -72px;}
.fancybox-nav:hover span {visibility: visible;}
.fancybox-tmp {position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important;}

/* Overlay helper */
.fancybox-lock {overflow: hidden;}
.fancybox-overlay {position: absolute; top: 0;	left: 0; overflow: hidden; display: none; z-index: 8010; background: url('../img/fancy_img/fancybox_overlay.png');}
.fancybox-overlay-fixed {position: fixed; bottom: 0; right: 0;}
.fancybox-lock .fancybox-overlay {overflow: auto; overflow-y: scroll;}

/* Title helper */
.fancybox-title {visibility: hidden; font: normal 13px/20px Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050;}
.fancybox-opened .fancybox-title {visibility: visible;}
.fancybox-title-float-wrap {position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center;}

.fancybox-title-float-wrap .child {
	display: inline-block;
	margin-right: -100%;
	padding: 2px 20px;
	background: url(../img/fancy_img/fancybox_title.png); /* Fallback for web browsers that doesn't support RGBa */
	background: rgba(0, 0, 0, 0.8);
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
	        border-radius: 15px;
	text-shadow: 0 1px 2px #222;
	color: #FFF;
	font-weight: bold;
	line-height: 24px;
	white-space: nowrap;
}

.fancybox-title-outside-wrap {position: relative; margin-top: 10px; color: #fff;}
.fancybox-title-inside-wrap {padding-top: 10px;}
.fancybox-title-over-wrap {position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8);}

/*-------------------------- MEDIA QUERIES -----------------------------------*/

/* Does the same thing as <meta name="viewport" content="width=device-width">,
 * but in the future W3C standard way. -ms- prefix is required for IE10+ to
 * render responsive styling in Windows 8 "snapped" views; IE10+ does not honor
 * the meta tag. See http://core.trac.wordpress.org/ticket/25888.
 */
@-ms-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}

@media screen and (min-width:1260px){

}


@media screen and (max-width:1023px){
  .news-list-container .news-list-item {float:none; width:100%; margin-bottom:20px;}
}


@media only screen and (max-width: 768px){
  #nav-container nav ul li {width:100%; float:none;}
  #sujet {padding-top:10px; overflow:hidden;}
    #sujet #claim {width:100%; position:relative; left:auto; top:auto;}
      #sujet #claim h1, #sujet #claim blockquote {font-size:17.5px;}
    
    #xing {bottom:190px;}
  #projects-container ul li {float:none; width:100%; padding:10px 0;}
  footer nav {float:left;}
  
  #content ol li {width:100%!important; margin:0 0 50px!important; min-height:0!important;}
  #content ol li:last-child {margin-bottom:0!important}
  
  div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {float:none;}
  .csc-textpic-intext-left-nowrap .csc-textpic-text {margin-left:0!important;}
  
  .news-list-image {float:none;}
  
  .news-list-title {font-size:17.5px!important; line-height:125%;}
  
  .news-single-img {float:none; margin:0 0 20px;}
  
  h1 {font-size:21px; -webkit-hyphens:auto; -moz-hyphens:auto; -ms-hyphens:auto; hyphens:auto;}
  p {text-align:left;}  
  
    #xing {bottom:0;}
}


@media all and (max-width: 480px) {
  #sujet img {/*max-width:none; float:right; width:auto;*/ height:200px; object-fit:cover; object-position:75% 0;} 
}



   
   
   
