/**
* Grafeneck Gedenkstaette
**/

/**
* CSS Basis
 */
 
/*** Allgemeines ***/ 
.slicknav_menu {display:none; } 
#quickLink1 { background-color: #212121;}
#quickLink1 ul {margin: 0px auto; max-width: 1024px; }
html { box-sizing: border-box; font-size: 100%; } 

/* Silbentrennung lange Woerter koennen Boxen sprenegen 

html {
    box-sizing: border-box;
    font-size: 100%;
	-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
} 
*/

 
body {
    font-family: 'Courier New', 'Open Sans';
    font-weight: normal;
    background-color: #ffffff;
    background: #ffffff none repeat scroll 0 0;
    color: #0a0a0a;
    font-weight: 300;
    line-height: 1.5;
    margin: 0;
    padding: 0;
}

#ergebnisseRumpf li a:hover {
    color: #353535;
}


 
.ym-wrapper { margin-left: auto; margin-right: auto; max-width: 1024px; } 

.top-1 { max-width: 100%;}
.top-1 .ym-wrapper {width: 100%; }
.top-1 .ym-wrapper .links {float: right; }
.top-1 .ym-wrapper .links li{float: left; }


#nav {  font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans serif; font-size: 120%;top: 555px; position: absolute; background-color: #373737; width: 100%; height: 70px;  }
.nav { margin: 0px auto; width: 1024px;}
#nav ul { margin-top: 20px; }
#nav li { float: left; list-style-type: none;  margin: 0px;}
#nav li + li { background: url(http://www.gedenkstaette-grafeneck.de/site/Grafeneck-Gedenkstaette/resourceCached/9.2.1/img/trenner.png) 0px 7px no-repeat; padding-left: 20px;}
#nav li a { color: #ffffff; text-transform: uppercase; text-decoration: none; }


#main {}
.home #main {background: #d0d0d0; padding-bottom: 20px;}
.home #main .wayhome-outer {display: none;}
.home .clear {display: none;} 
.home .sitefunctions {display: none;}

/* CONTENT Inhalt */
#content {  margin-top: 3px; background-color: #ffffff; min-height: 370px; z-index: 1010; }
#content h1 { background-color: #787878; color: #ffffff; padding: 60px 0px 15px 0px; margin-bottom: 10px; }

/* Matrix Startseite Boxen */
.home #content { margin: 30px 0px; background-color: transparent; }
.home #content .subcl {padding: 0px; margin-right: 0px;}
.home .subcl, .subc, .subcr{
	height: 100%;
	padding: 0px;
        margin: 0px;
}
.home #content .basecontent-image {margin: 0px;}

.subcl, .subc, .subcr{
	height: 100%;
	padding:0px;
}



.home .ym-g33 {background-color: #ffffff;}
.home h2 {font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans serif; color: #353535; font-size: 180%; border: none; text-align: center; margin: 0 0 10px 0;font-weight: normal;text-transform: uppercase;line-height: 130%;}
.home h3 {font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans serif; color: #353535; font-size: 120%; margin: 0 0 10px 0; text-transform: uppercase;}
.home p {font-size: 80%;}
.home p.link { text-align: right; text-transform: uppercase; font-size: 100%;}
.home .basecontent-dvv-kontaktdaten {font-size: 80%;}
.basecontent-dvv-kontaktdaten .mail .bez { display:none;}
.basecontent-dvv-kontaktdaten .cityline {margin-bottom: 3px;}
.basecontent-dvv-kontaktdaten .efaLink {margin-bottom: 3px;}

.home .ym-g33 img { width: 333px; height: 200px;}
.home .zeile3 .ym-g33 img { width: 333px; height: 250px;}
.home .zeile4 .ym-g33 img { width: 333px; height: 250px;}
.home .ym-g33 .vCard img {width: 30px; height: 30px; float: right;}

.zeile1 .ym-g33, .zeile2 .ym-g33 { width: 333px; height: 200px; margin-bottom: 10px;}
.zeile1 .ym-gl { margin-right: 10px; }
.zeile2 .ym-gl { margin-right: 10px; }

.zeile3 .ym-g33, .zeile4 .ym-g33{ width: 333px; height: 250px; margin-bottom: 10px;}
.zeile3 .ym-gl { margin-right: 10px; }
.zeile4 .ym-gl { margin-right: 10px; }
.ym-gr {margin: 0px;}

.zeile1 .subc {padding: 20px 20px 0px 20px; height: auto;}
.zeile2 .subcl, .zeile2 .subcr { padding: 20px 20px 20px 20px!important; height: auto;}
.zeile3 .subcl, .zeile3 .subc, .zeile3 .subcr {padding: 20px!important;}
.zeile4 .subcl, .zeile4 .subcr {padding: 20px!important;}
.zeile4 .subcl, .zeile4 .subcr  p { line-height: 120%;}
.zeile3 .ym-g33 {background: #272727; color: #ffffff; }
.zeile3 .ym-g33 + .ym-g33 {background: #ffffff; color: #272727; }
.zeile3 .ym-g33 + .ym-g33 + .ym-g33 {background: #272727; color: #ffffff; }

.zeile3 .ym-g33 h3 {color: #ffffff; letter-spacing: 0.1em; font-weight: normal;}
.zeile3 .ym-g33 + .ym-g33 h3 { color: #272727; letter-spacing: 0.1em;font-weight: normal;}
.zeile3 .ym-g33 + .ym-g33 + .ym-g33 h3 { color: #ffffff; letter-spacing: 0.1em;font-weight: normal;}

/* VK */
.zeile3 .linkweiss p {text-align: left; font-size: 80%; }
.zeile3 .linkweiss a, .linkweiss a:hover, .linkweiss a:focus { color: #ffffff; }

/* header Bereich */
.home #header { height: 625px;}
#header { height: 260px;}

header  .top-1 { top: 0; left: 0; height: 50px; width: 100%; z-index: 1001; }

header #links { height: 40px;  }
header #language { width: 500px; float: left; margin-top: 10px; font-family: 'New Courier';}

header #language a[lang*=de] { padding-right: 15px; text-transform: uppercase; text-decoration: none; color:#373737; }
header #language a[lang*=de]:hover { text-decoration: underline; color:#000000;}
header #language a[lang*=de]::after{ content: "Deutsch"; padding-left: 5px;}
header #language a[lang*=fr] { padding-right: 15px; text-transform: uppercase; text-decoration: none; color:#373737; }
header #language a[lang*=fr]:hover { text-decoration: underline; color:#000000;}
header #language a[lang*=fr]::after{ content: "Franzoesisch"; padding-left: 5px; }
header #language a[lang*=en] { padding-right: 15px; text-transform: uppercase; text-decoration: none; color:#373737;}
header #language a[lang*=en]:hover { text-decoration: underline; color:#000000;}
header #language a[lang*=en]::after{ content: "Englisch"; padding-left: 5px;}
header #language a[lang*=tr] { padding-right: 15px; text-transform: uppercase; text-decoration: none; color:#373737; font-family: 'New Courier'; }
header #language a[lang*=tr]:hover { text-decoration: none; color:#000000; font-family: 'Open Sans'; font-size: 99%;}
header #language a[lang*=tr]::after{ content: "Leichte Sprache"; padding-left: 5px;}
body [lang*=tr]{ font-family: 'Open Sans';}

header #sb-search { float: right; }
#qs_query {background-color:#cccccc; padding: 9px 5px 2px 15px; width: 240px; border: 1px solid #787878; box-shadow: 3px 2px 11px hsla(300,5%,15%,0.1) inset; }
#sb-search .quicksearchimg { padding-top: 10px; margin-top: 3px}

header .top-2 { height: 230px; }
header .logo { position: absolute; z-index: 10; top: 75px; max-height: 240px; }

header .top-3 { height: 275px; background-color: #787878; }

.top-text { border: none!important; padding: 20px 0px; text-align: left; width: 100%; }
.top-text .composedcontent-preset_module {width: 340px; }

.top-bild .bx-wrapper { width: 595px; height: 400px;  padding-bottom: 10px; margin-bottom: 0px; }
.top-bild .bx-viewport {width: 595px; height: 395px!important; -moz-box-shadow: 0 0 5px #373737; -webkit-box-shadow: 0 0 5px #373737; box-shadow: 0 0 5px #373737; left: 0px; background: transparent; border: 5px solid #373737;}
.top-bild .bx-viewport img {width: 595px; height: 395px;  }

.top-bild .bx-pager .bx-pager-item  { margin-bottom: 20px;}
.top-bild .bx-controls-direction {z-index: 96; top: 200px; }


.top-bild .basecontent-image { float: none; margin: 0;  height: 80px;}
.top-bild { position: absolute; top: 80px; margin-left: 375px; width: 620px; height: 420px; 
  z-index: 25; 
  overflow: hidden;
}

.bx-wrapper { background:transparent; border: none; box-shadow: 0 0 0px transparent; }
.bx-wrapper .bx-pager {  display: none; }
/*-webkit-transform: translateX(-76%) translateY(-50%);
  transform: translateX(-76%) translateY(-50%);*/

/* footer Bereich */
#footer li{ list-style-type: none; }
#footer .sitemap { padding: 15px 0px;}
.home #footer .sitemap { padding: 5px 0px;}
#footer .sitemap a + a { background: url(http://www.gedenkstaette-grafeneck.de/site/Grafeneck-Gedenkstaette/resourceCached/9.2.1/img/trenner.png) 0px 3px no-repeat; padding-left: 25px;}
#footer .sitemap a {text-decoration: none;}
#footer .sitemap a:hover {text-decoration: underline;}
#footer .copyright { padding: 5px 0px;}
#footer .ym-gl {margin-left: 10px;}
#footer .ym-gr {margin-right: 10px;}


/* Inhalt Sitemap */
ul.sitemap { margin: 0px; padding-top: 20px; background-color: #272727; list-style-type: none;}
ul.sitemap a {margin: 0px; color: #ffffff; list-style-type: none;}
ul.sitemap li { list-style-type: none; border: none;  }


/* Wenn Service-Spalte col2 und col3 nicht vorhanden */
#main .maxbreite { margin: auto;}
#main .ym-col1 {width: 1024px; }
#main .ym-col1 .ym-cbox { padding: 0px;}

/* hervorgehobene Suchtreffer */
.highlight {color:#003;background-color:#ffd}


/* Formulare */
.basecontent-form-editor .formTitle /* Ueberschrifts-Element (ohne Eingabefelder) */
{ padding: 0.3em 0em; margin-bottom: 0.5em;}

.basecontent-form-editor fieldset + div.formElement:first-child /* Ueberschrifts-Element (ohne Eingabefelder) */
{ padding: 0.3em 0em; margin-bottom: 0.5em;}
.basecontent-form-editor fieldset + div.formElement:first-of-type /* Ueberschrifts-Element (ohne Eingabefelder) */
{ padding: 0.3em 0em; margin-bottom: 0.5em;}
.basecontent-form-editor .ym-fbox-check label:first-child
{ width: 30%; float: left;}
.basecontent-form-editor .ym-columnar .ym-fbox-check input
{ margin-left:0;}

/* CMSVII-931 */
.basecontent-form-editor .formElement span.right {
  display: block;
  float: left;
  width: 67.2%;
}
.basecontent-form-editor .formElement img.captcha {
    display: inline-block;
    /* float: right; */
    height: 50px;
    width: 180px;
}
.basecontent-form-editor .formElement img.captchaReload {
    display: inline-block;
    height: 16px;
    width: 16px;
    float: right;
    margin-left: 1ex;
}
.basecontent-form-editor div.captcha { display:none;}

/*** Login Form ***/
#loginForm fieldset {  z-index: 1010; }
#loginForm  		{ width: 422px; padding: 40px; z-index: 2000;  }
#loginForm legend	{ font-size: 2em; text-transform: lowercase; padding: 0px 8px 0px; margin-left: 5px; }
#loginForm .type-text 	{ margin: 10px; }
#loginForm fieldset   	{ border: 1px solid #373736; border-radius: 6px 6px 6px 6px; color: #373736; padding: 10px; width: 400px; }
#loginForm label         { font-size: 18px;}
#loginForm .ym-fbox-text { margin-bottom: 20px; }
#loginForm .type-button { text-align: right; width: 402px;  }
#loginForm .button 	{ background: #ffffff; 	border: 1px solid #373736; cursor: pointer; border-radius: 4px 4px 4px 4px; color: #373736; font-size: 120%; 	font-weight: normal; 	margin-top: 15px; margin-left: 10px; padding: 4px 20px 1px; 	text-transform: lowercase; }
#j_username 		{ border: 1px solid #373736; padding: 7px 5px 5px 10px; border-radius: 4px; color: #373736; font-size: 18px; }
#j_password 		{ border: 1px solid #373736; padding: 7px 5px 5px 10px; border-radius: 4px; color: #373736; font-size: 18px;}

/* Suche Search */
.body_search .top-bild { background: transparent!important;}
.body_search #content { background: #ffffff;}
.body_search #content h1 { padding: 20px;}
.body_search #content .searchDiv { padding: 20px;}
.ergebnisseRumpf { margin-top: 30px;}


/*** responsive Anpassungen ***/
@media screen and ( max-width: 1023px )  {

#sb-search { margin-right: 20px;}
.nav { margin: 0px auto; width: 950px;}
#main .ym-col1 {width: 950px; }
.ym-wrapper { margin-left: auto; margin-right: auto; max-width: 920px; } 

#header .ym-wrapper { padding-left: 10px;}
.top-bild { width: 400px; }
.top-bild .bx-wrapper { width: 370px; height: 250px;  padding-bottom: 10px; margin-bottom: 0px; }
.top-bild .bx-viewport {width: 595px; height: 250px!important; -moz-box-shadow: 0 0 5px #373737; -webkit-box-shadow: 0 0 5px #373737; box-shadow: 0 0 5px #373737; left: 0px; background: transparent; border: 5px solid #373737;}
.top-bild .bxSlider { width: 386px; }

#header .top-text .ym-wrapper { padding-left: 0px;}
#content .ym-g33.ym-gl { margin-left: 10px;}
#content .ym-g33.ym-gr { float:left; margin: 0px 10px 10px 10px; }
#content .ym-g33 { width: 45%; }
#content .ym-g33 img { width: 100%;}

#content .vCard img { width: 30px;}


}


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

#sb-search { width: 300px; }
#header .top-1 {height: 70px;}
#header .top-bild .bx-wrapper {margin-left: 0px; }
#content .ym-g33 { width: 38%; }
#content .ym-g33.ym-gl { margin-right: 0px; }
#content .ym-g33.ym-gr { margin-right: 0px; }
}


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

#links #sb-search { position: absolute;  top: 25px; left: 10px;}
#qs_query {padding-top: 1px!important;}

#content .ym-g33 { width: 33%; }
}

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

#quickLink1 { display: none; }
#content { width: 65%;}
#content .ym-g33 img { width: 100% !important;}
#content .ym-g100 { float: none !important; margin-right: 0%; position: relative; width: 100% !important; margin-left: 0 !important; margin-bottom: 40px;}
#content .ui-tabs .ym-g100 { float: none !important; margin-right: 0%; position: relative; width: auto !important; margin-left: 0 !important; margin-bottom: 40px;}
#content .ym-g50 { float: none !important; margin-right: 0%; position: relative; width: 100% !important; margin-left: 0 !important; margin-bottom: 40px;}
#content .ym-g33 { float: none !important; margin-right: 0%; position: relative; width: 100% !important; margin-left: 0 !important; margin-bottom: 40px;}

#footer .sitemap a + a { background: url(http://www.gedenkstaette-grafeneck.de/site/Grafeneck-Gedenkstaette/resourceCached/9.2.1/img/trenner.png) -9px 3px no-repeat; padding-left: 10px;}
}


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

.logo img {  width: 80%;}

}