/*----------------- FONT -----------------*/
/*----------------- FONT -----------------*/


/*----------------- STANDARDS -----------------*/
body { background-color: #666666; font-family: 'Verdana', 'Arial', 'sans-serif'; font-size: 100%; margin: 0; color: #ffffff; }

header,nav,section,article,aside,footer,hgroup { display: block; }

a { text-decoration: underline; color: #343434; }
a:hover { text-decoration: none; color:#343434;}
a img { border: none; }
h1,h2,h3,h4,h5,h6 { font-weight: normal; }
.upper { text-transform: uppercase; }
.lFloat { float: left; }
.rFloat { float: right; }
div { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }


.bgColor01 { background-color: #FF62B0; }
.bgColor02 { background-color: #FF4848; }
.bgColor03 { background-color: #9669FE; }
.bgColor04 { background-color: #BF00BF; }
.bgColor05 { background-color: #3923D6; }
.bgColor06 { background-color: #23819C; }
.bgColor07 { background-color: #62A9FF; }
.bgColor08 { background-color: #23819C; /*#03EBA6;*/ }
.bgColor09 { background-color: #23819C; /*#27DE55;*/ }
.bgColor10 { background-color: #23819C; }

.color01 { color: #FFC8E3; }
.color02 { color: #FFCECE; }
.color03 { color: #E6DBFF; }
.color04 { color: #FFCEFF; }
.color05 { color: #D7D1F8; }
.color06 { color: #B8E2EF; }
.color07 { color: #D0E6FF; }
.color08 { color: #B8E2EF; /*#BDFFEA;*/ }
.color09 { color: #B8E2EF; /*#E3FBE9;*/ }
.color10 { color: #B8E2EF; }
/*----------------- STANDARDS -----------------*/

#drawer { position: fixed; z-index: 0; }

/*----------------- CONTAINER -----------------*/
#container { width: 100%; /*min-height: 1000px;*/ overflow: hidden; }
/*----------------- CONTAINER -----------------*/


/*----------------- HEADER -----------------*/
#header { background-color: #ffffff; border-bottom: 1px solid #aaaaaa; }
#header .inside { width: 100%; margin: 0 auto; }
/*----------------- HEADER -----------------*/


/*----------------- LOGO -----------------*/
#logo { /*min-height: 80px;*/ background-color: #ffffff; width: 100%; text-align: center; padding: 10px 0 10px 0; }
#logo a { background-image: url('../images/logo.png'); background-repeat: no-repeat; display: inline-block; height: 50px; width: 510px; margin: 0 auto; }
/*----------------- LOGO -----------------*/


/*----------------- LANG -----------------*/
.mod_changelanguage { margin-right: 20px; }
.mod_changelanguage ul { margin: 0; padding: 0; text-align: right; }
.mod_changelanguage li { margin: 0; padding: 5px 0; list-style: none; display: inline-block; font-size: 0.8em; }
.mod_changelanguage li:before { display: inline; content: '| '; color: #cdcdcd; font-size: 0.8em; }
.mod_changelanguage li.first:before { content: ''; }
.mod_changelanguage li a { text-decoration: none; }
.mod_changelanguage li span { color: #aaaaaa; }
/*----------------- LANG -----------------*/


/*----------------- MAIN NAVIGATION -----------------*/
#nav-main { width: 100%; width: 960px; margin: 0 auto; text-align: center; }
#nav-main ul { margin: 0; padding: 0; }
#nav-main li { margin: 0; padding: 0; list-style: none; display: inline-block; /*width: 14%; min-width: 120px;*/ padding: 10px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#nav-main span,
#nav-main a { white-space: nowrap; text-transform: uppercase; font-size: 14px; text-decoration: none; color: #686868; border-bottom: 2px solid #ffffff; display: inline-block; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 0 0 2px 0; }
#nav-main a:hover { text-decoration: none; border-bottom: 2px solid #333333; }
#nav-main span { border-bottom: 2px solid #333333; }
#nav-icon-mobile { display: none; height: 110px; text-align: center; padding: 30px 0; }
#nav-icon-mobile .line { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; height: 6px; width: 40px; margin: 5px 25%; border: 1px solid #333333; background-color: #686868; }
#nav-icon-mobile img { /*padding: 10px 0; height: 50%; display: inline-block;*/ }
/*----------------- MAIN NAVIGATION -----------------*/


/*----------------- MAIN -----------------*/
#main { padding: 0; width: 100%; }
/* #container { min-height: calc(100vh - 145px - 50px); } */
#main .inside { padding: 0; width: 960px; margin: 0 auto; margin-bottom: 50px;}
#main h1.ce_headline { font-size: 42px; text-transform: uppercase; }
.mod_article { width: 100%; margin: 20px auto; position: relative; z-index: 900; /*column-count: 2; column-gap: 40px;*/ }
.mod_article .ce_text { /*column-count: 2; column-gap: 40px; -moz-column-count: 2; -moz-column-gap: 40px; -webkit-column-count: 2; -webkit-column-gap: 40px;*/ margin-bottom: 20px; }
.mod_article .ce_text.no-column { /*column-count: 1; -moz-column-count: 1; -webkit-column-count: 1;*/ }
.mod_article .ce_text h1:first-child,
.mod_article .ce_text h2:first-child,
.mod_article .ce_text h3:first-child,
.mod_article .ce_text h4:first-child,
.mod_article .ce_text h5:first-child,
.mod_article .ce_text h6:first-child { margin-top: 0; /*column-span: all; -moz-column-span: all; -webkit-column-span: all;*/ }
.mod_article .ce_text p:first-child { margin-top: 0; }
.mod_article .ce_image { margin-bottom: 20px; }
.mod_article .ce_image .image_container { margin: 0; }
/*----------------- MAIN -----------------*/


/*----------------- FOOTER -----------------*/
#footer { background-color: #ffffff; border-top: 1px solid #aaaaaa; /*position: fixed; bottom: 0;*/ }
#footer .inside { width: 100%; margin: 0 auto; min-height: 50px; }
#footer .footer-box { width: 350px; margin: 0 auto; }
/*----------------- FOOTER -----------------*/


/*----------------- MAIN NAVIGATION -----------------*/
#nav-footer { /*width: 100%; width: 960px; margin: 0 auto; text-align: center;*/ float: left; margin-right: 10px; }
#nav-footer ul { margin: 0; padding: 0; }
#nav-footer li { margin: 0; padding: 0; list-style: none; display: inline-block; padding: 5px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#nav-footer span,
#nav-footer a { font-size: 12px; text-decoration: none; color: #686868; }
#nav-footer span { color: #000000; }
/*----------------- MAIN NAVIGATION -----------------*/


/*----------------- COPYRIGHT -----------------*/
#copyright { /*width: 100%; width: 960px; margin: 0 auto; padding-bottom: 10px; text-align: center;*/ padding: 5px; }
#copyright span { font-size: 12px; text-decoration: none; color: #686868; }
/*----------------- COPYRIGHT -----------------*/


.circle { width: 40px; height: 40px; border-radius: 20px; background-color: #333333; }
.shadow { -moz-box-shadow: 1px 2px 6px #666666; -webkit-box-shadow: 1px 2px 6px #666666; box-shadow: 1px 2px 6px #666666; }
.border { border: 1px solid #999999; }
.border-white { border: 4px solid #ffffff; }
.icon { position: absolute; z-index: 100; width: 40px; height: 40px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.icon.lt { left: 10px; top: 10px; }
.icon.lb { left: 10px; bottom: 10px; }
.icon.rt { right: 10px; top: 10px; }
.icon.rb { right: 10px; bottom: 10px; }
.icon.lt.half { left: -20px; top: -20px; }
.icon.open,
.icon.close { width: 30px; height: 30px; text-align: center; }
.icon.open .circle,
.icon.close .circle { cursor: pointer; width: 30px; height: 30px; border-radius: 15px; padding: 3px; background-color: #ffffff; color: #666666; }
.icon.close { display: none; }
.icon .shadow { -moz-box-shadow: 1px 1px 2px #666666; -webkit-box-shadow: 1px 1px 2px #666666; box-shadow: 1px 1px 2px #666666; }


/*----------------- QUICKFINDER -----------------*/
.quickfinder { width: 100%; margin: 0 auto; text-align: center; }
.quickfinder .box {}
.quickfinder ul { margin: 10px 0; padding: 0; }
.quickfinder li { list-style: none; display: inline-block; padding: 5px 10px; margin-bottom: 5px; background-color: #ffffff; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; opacity: 0.5; filter: alpha(opacity=50); }
.quickfinder li.active { opacity: 1; filter: alpha(opacity=100); }
.quickfinder li a { text-decoration: none; }
/*----------------- QUICKFINDER -----------------*/


/*----------------- WORKVIEWER -----------------*/
.work { cursor: pointer; position: relative; margin: 0; width: 18%; min-width: 150px; min-height: 150px; max-height: 150px; overflow: hidden; background-color: #ffffff; float: left; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.work { margin: 1% 1% 1% 1%; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; }
.work .content { color: #666666; width: 100%; min-height: 150px; max-height: 150px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.work .content .box { overflow: hidden; height: 115px; padding: 15px 20px 20px 20px; }
.work .content h1 { color: #666666; margin: 0; padding: 5px 0; text-transform: uppercase; font-size: 18px; }
.work .content p { color: #666666; margin: 0; padding: 5px 0; font-size: 12px; }
.work .content h1 + p { padding-top: 0; }
#viewer { background-color: #ffffff; width: 97.3333333333333%; color: #666666; margin: 1% 1% 1% 1%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; }
#viewer .box { min-height: 0; height: 0; overflow: hidden; /*position: relative;*/ }
#viewer .box .gallery { width: 100%; }
#viewer .box .gallery-box { }
#viewer .box .text { width: 100%; }
#viewer .box .text-box { padding: 0 20px 20px 40px; }
#viewer .box .left { float: left; width: 40%; line-height: 0; }
#viewer .box .right { float: right; width: 60%; }
#viewer .box .mask { overflow: hidden; }
#viewer .icon { position: relative; }
#viewer .icon.close { display: block; position: absolute; }
#viewer .icon.close .circle { /*position: absolute;*/ }
#viewer .box .text .icon.lt.half { left: -5px; top: -23px; }
#viewer .box .right .icon.lt.half { left: -5px;/*5.6666666666667%;*/ }

#viewer.show .box { min-height: 200px; height: auto; }
.mod_workviewer { margin-bottom: 20px; }
.mod_workviewer.start { width: 500px; margin: 0 auto; }
/*.work.Seminare { background-color: rgba(200, 200, 250, 0.8); }
.work.Jugendaustausch { background-color: rgba(200, 250, 200, 0.8); }
.work.Workshops { background-color: rgba(250, 200, 200, 0.8); }
.work.Events { background-color: rgba(200, 250, 250, 0.8); }*/
/*----------------- WORKVIEWER -----------------*/


/*----------------- PARALLAX -----------------*/
#layer-box { margin: 0; width: 100%; }
.layer { position: absolute; width: 100%; }
.layer .image_container { margin: 0; padding: 0; width: 100%; }
.layer img { margin: 0; padding: 0; border: 0; width: 100%; }
.layer.l0 { top: 0; left: 0; z-index: -9000; }
.layer.l1 { top: 0; left: 0; z-index: -8000; }
.layer.l2 { top: 0; left: 0; z-index: -7000; }
.layer.l3 { top: 0; left: 0; z-index: -6000; }
.layer.l4 { top: 0; left: 0; z-index: -5000; }
.layer.l5 { top: 0; left: 0; z-index: -4000; }
.layer.l6 { top: 0; left: 0; z-index: -3000; }
.layer.l7 { top: 0; left: 0; z-index: -2000; }
.layer.l8 { top: 0; left: 0; z-index: -1000; }
.layer.l9 { top: 0; left: 0; z-index: -1; }
.layer.y100 { top: 100px; }
.layer.y200 { top: 200px; }
.layer.y300 { top: 300px; }
.layer.y400 { top: 400px; }
.layer.y500 { top: 500px; }
.layer.y600 { top: 600px; }
.layer.y700 { top: 700px; }
.layer.y800 { top: 800px; }
.layer.y900 { top: 900px; }
.layer.y10p { top: 10%; }
.layer.y20p { top: 20%; }
.layer.y30p { top: 30%; }
.layer.y40p { top: 40%; }
.layer.y50p { top: 50%; }
.layer.y60p { top: 60%; }
.layer.y70p { top: 70%; }
.layer.y80p { top: 80%; }
.layer.y90p { top: 90%; }
.layer.x100 { left: 100px; }
.layer.x200 { left: 200px; }
.layer.x300 { left: 300px; }
.layer.x400 { left: 400px; }
.layer.x500 { left: 500px; }
.layer.x600 { left: 600px; }
.layer.x700 { left: 700px; }
.layer.x800 { left: 800px; }
.layer.x900 { left: 900px; }
.layer.x10p { left: 10%; }
.layer.x20p { left: 20%; }
.layer.x30p { left: 30%; }
.layer.x40p { left: 40%; }
.layer.x50p { left: 50%; }
.layer.x60p { left: 60%; }
.layer.x70p { left: 70%; }
.layer.x80p { left: 80%; }
.layer.x90p { left: 90%; }
/*----------------- PARALLAX -----------------*/


/*----------------- FOOTER -----------------*/
/*----------------- FOOTER -----------------*/


/*----------------- MEDIA QUERYS -----------------*/
@media screen and (max-width: 960px) {
	#container { width: 100%; }
	#main .inside { width: 100%; }
    #nav-main { width: 100%; margin: 0; }
	#nav-main li { /*padding: 5px 10px;*/ }
	/*#nav-footer { width: 100%; margin: 0; }
	#copyright { width: 100%; margin: 0; }*/
	.mod_article { width: 100%; }
	.mod_article .ce_text,
	.mod_article .ce_image,
	.mod_article .ce_headline { padding: 0 40px 0 20px; }
}
@media screen and (max-width: 860px) {
	.work { width: 23%; min-width: 150px; min-height: 150px; max-height: 150px; }
	#main h1.ce_headline { font-size: 34px; }
	.mod_article .ce_text h1,
	.mod_article .ce_text h2,
	.mod_article .ce_text h3,
	.mod_article .ce_text h4,
	.mod_article .ce_text h5,
	.mod_article .ce_text h6 { font-size: 26px; }
}
@media screen and (max-width: 660px) {
	.mod_workviewer.start { width: 100%; }
	.work { width: 31.3333333333333%; min-width: 150px; min-height: 150px; max-height: 150px; }
	#main h1.ce_headline { font-size: 26px; }
	.mod_article .ce_text h1,
	.mod_article .ce_text h2,
	.mod_article .ce_text h3,
	.mod_article .ce_text h4,
	.mod_article .ce_text h5,
	.mod_article .ce_text h6 { font-size: 22px; }
.mod_article .ce_text { /*column-count: 1; column-gap: 40px; -moz-column-count: 1; -moz-column-gap: 40px; -webkit-column-count: 1; -webkit-column-gap: 40px;*/ }
	#logo a { width: 80%; background-size: 100%; }
}
@media screen and (max-width: 480px) {
	.mod_workviewer.start { width: 100%; }
	.work { width: 48%; min-width: 150px; min-height: 150px; max-height: 150px; }
	#logo a { width: 100%; }
}
@media screen and (max-width: 320px) {
    #container { width: 100%; clear: both; }
    #header { height: auto; min-height: 110px; }
    #header .inside { width: 100%; }
    #logo { width: 100%; }
    #nav-main { float: none; width: 100%; background-color: #f9f9f9; border-top: 1px solid #efefef; border-bottom: 1px solid #dfdfdf;}
    #nav-main li { float: none; width: 100%; padding: 10px 0; }
    #nav-main span,
	#nav-main a { width: auto; padding: 0; }
	#nav-main a { border-bottom: 2px solid #f9f9f9; }

	#nav-main { display: none; }
    #nav-icon-mobile { display: block; width: 100%; margin: 0; height: 30px; padding: 2px 0; margin-bottom: 10px; }
	#nav-icon-mobile .line { height: 5px; width: 10%; margin: 2px 45% 0 45%; }

	/*#nav-footer { float: none; width: 100%; margin: 0; }
	#nav-footer li { float: none; width: 100%; padding: 0; margin: 0; }*/
    .mod_article { width: auto; }
    #layer-box { width: 100%; }
	.mod_workviewer.start { width: 100%; }
	.work { width: 98%; min-width: 150px; min-height: 150px; max-height: 150px; }
	.quickfinder li { width: 90%; }
	#logo { padding: 5px 0 0 0; }
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	#logo a { background-image: url('../images/logo@2.png'); background-repeat: no-repeat; }
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {}
@media (-webkit-min-device-pixel-ratio: 1.3), (min-resolution: 124.8dpi) {}
@media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {}
/*----------------- MEDIA QUERYS -----------------*/


.none { display: none; }
.clear { clear: both; }