/* quicksand-300 - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/quicksand-v7-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Quicksand Light'), local('Quicksand-Light'),
       url('../fonts/quicksand-v7-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/quicksand-v7-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/quicksand-v7-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/quicksand-v7-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/quicksand-v7-latin-300.svg#Quicksand') format('svg'); /* Legacy iOS */
}

/* quicksand-regular - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/quicksand-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Quicksand Regular'), local('Quicksand-Regular'),
       url('../fonts/quicksand-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/quicksand-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/quicksand-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/quicksand-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/quicksand-v7-latin-regular.svg#Quicksand') format('svg'); /* Legacy iOS */
}

/* quicksand-500 - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/quicksand-v7-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Quicksand Medium'), local('Quicksand-Medium'),
       url('../fonts/quicksand-v7-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/quicksand-v7-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/quicksand-v7-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/quicksand-v7-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/quicksand-v7-latin-500.svg#Quicksand') format('svg'); /* Legacy iOS */
}

/* quicksand-700 - latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/quicksand-v7-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Quicksand Bold'), local('Quicksand-Bold'),
       url('../fonts/quicksand-v7-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/quicksand-v7-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/quicksand-v7-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/quicksand-v7-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/quicksand-v7-latin-700.svg#Quicksand') format('svg'); /* Legacy iOS */
}

/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/open-sans-v15-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('../fonts/open-sans-v15-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/open-sans-v15-latin-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../fonts/open-sans-v15-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/open-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('../fonts/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}

body {
	font-family: "Open Sans", sans-serif;
	background-color: #fffdf8;
}

figure {
	display:none;
}

strong {
	font-weight:700;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Quicksand",Roboto,Arial,sans-serif;
}

h1 {
	font-size: 2.5rem;
	line-height: 1;
	margin-bottom: 0;
	margin-top: 0;
	color: #fff;
	font-weight:400;
	letter-spacing:0.15rem;
			
}

h2 {
	font-size:1.5rem;
	color: #fff;
	font-weight:400;	
	margin-bottom: 5rem;
	margin-top: 0;
	line-height:1;	
}

.welcome {
	font-size:1.6rem;
	margin-top: 3.5rem;			
}

h3 {
	font-size:2rem;
	color: rgb(62,155,205);
		color: rgb(4,108,153);
	font-weight:400;
	margin-bottom: 0.2rem;
	margin-top: 3rem;			
}

h4 {
	font-size:1.5rem;
	color: rgb(62,155,205);
		color: rgb(4,108,153);
	font-weight:400;
	margin-bottom: 0.2rem;
	margin-top: 3rem;			
}


.title-bar {
	background-color:#d2d4cf;
}

.title-bar-title {
	color: #134b74;
}

.menu-icon::after, .menu-icon:hover::after {
    background: #134b74 none repeat scroll 0 0;
    box-shadow: 0 7px 0 #134b74, 0 14px 0 #134b74;
}


.bg1 {
	background-image:url(../img/welle-04.svg);
	background-size: contain;
	background-repeat:no-repeat;
	background-position:right;
	min-height:100%;
	padding-top:4vw;
	padding-left:2vw;
	z-index:100;
}


#main-menu {
	background-image:url(../img/bg1.jpg) !important;
	background-size:cover;
	background-position:right;
}

#main-menu.TrauernPage {
	background-image:url(../img/bg6.jpg) !important;
}

#main-menu.ErinnernPage {
	background-image:url(../img/bg7.jpg) !important;
}

#main-menu.BewahrenPage {
	background-image:url(../img/bg1.jpg) !important;
}

#main-menu.TrauerfeierPage {
	background-image:url(../img/bg2.jpg) !important;
}

#main-menu.ZumirPage {
	/*background-image:url(../img/bg8.jpg) !important;*/
	background-image:url(../img/bg11.jpg) !important;
}

#main-menu.Zu2mirPage {
	background-image:url(../img/bg12.jpg) !important;
}

#main-menu.KontaktPage {
	background-image:url(../img/bg1.jpg) !important;
}

#main-menu.DankPage {
	background-image:url(../img/bg10.jpg) !important;
}

#main-menu.DatenschutzPage {
	background-image:url(../img/bg1.jpg) !important;
}

#main-menu.ImpressumPage {
	background-image:url(../img/bg1.jpg) !important;
}

#main-menu:before {
    background: -moz-linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.1) 60%,rgba(0,0,0,.4) 100%);
    background: -webkit-linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(0,0,0,.1) 60%,rgba(0,0,0,.4) 1000%);
    background: linear-gradient(to left,rgba(0,0,0,0) 0%,rgba(0,0,0,.1) 60%,rgba(0,0,0,.4) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000",endColorstr="#4d000000",GradientType=0);
    bottom: 0;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    right: 200px;
    z-index: -1;
}


.position-left {
    height: 100%;
    transform: translateX(-500px);
    width: 500px;
}

p, ul {
	font-family:"Open Sans", sans-serif;	
	color: #000;
	margin-top:1.5rem;
	font-weight:400;
}

ul strong {
	font-weight:600;
}


a {
	color: rgb(4,108,153);
	font-weight:400;
}

#content a {
	border-bottom-style:solid;
	border-bottom-color:rgb(4,108,153);
	border-bottom-width:1px;		
}	

a:hover {
	color: #fff;
}

p a, p a:visited {
	color: rgb(4,108,153);
}

p a:hover {
	color:#f60;	
	border-bottom-color:#f60 !important;	
}

.button a, .button a:visited {
    color: #666;
}

.button a:hover {
    color: #FB9700;
}

.off-canvas-wrapper-inner {
}

.menu, .menu a {
	font-size:1.4rem;
	font-weight:400;
	padding-left:0;
	text-align:left;
}

.menu > li > a, .menu > li.active {
	color:#fff;
    display: block;
    line-height: 1;
    padding: 0.7rem 1rem;
}

.menu > li.active {
	font-weight:600;
	font-size:1.2rem;
}


.menu > li > a:hover {
	color:#f60;	
}

.fltrt {
	float:right;
}

.fltlt {
	float:left;
}

.name { display:none; }

.button {
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 0px;
    color: #666;
    cursor: pointer;
    display: inline-block;

    line-height: 1;
    margin-left: 0 !important;
	margin-right: 0 !important;
	margin-top:0;
	margin-bottom: 2rem;
	padding:1rem;

    text-align: right;
    transition: background-color 0.25s ease-out 0s, color 0.25s ease-out 0s;
    vertical-align: middle;
}

.button-group .button {
    font-size: 1rem;
}

.button:hover {
	background-color: #fbd184;
	color: #fff;
}

.button.is-checked {
	background-color: #f9b233;
	color: #fff;
}

.button-group {
	text-align:right;
    margin-top: 2rem;
}

.map {
	width:100%;
	height:600px;;
}

.contact {
	position:absolute;
	bottom:0;
	left:0;
	padding:0.9375rem;	
	margin:2rem;
	display:block;
}

.contact p, .contactsmall p {
	color:#000;
	text-align:right;
	margin-bottom:0;
	margin-top:0.9rem;
	margin-right:0rem;
}
.contact a, .contactsmall a {
	color:#333;
}

.contact a:hover, .contactsmall a:hover {
	color:#f60;
}

.contactsmall li.active {
	color:#333;
	font-weight:bold;
}


.contactsmall {
	margin-top:1rem;
	padding-top:0rem;
	display:none;
	padding:2rem;	
	background-image:url(../img/welle-06.svg);
	background-size: cover;
	background-repeat:no-repeat;
	background-position:top;
	min-width:100%;
    min-height: auto;
    bottom: 0;
    position: relative;
}

.contactsmall p {
	text-align:left;
}

.topnavigation {
	margin-top:0rem !important;	
	width:100%;
}

.sign {
	margin:0;
	padding:0;
}

.textsmaller {
	font-size:80%;
}

.position-left.is-transition-push:after {
    box-shadow: none;
}

span.pagelinks, a.pagelinks {
	font-size:2.5em;
	margin-right:0.6em;
	border-bottom-style:solid;
	border-bottom-color:rgb(186,186,184);
	border-bottom-width:1px;			
}

span.pagelinks {
	color:rgb(186,186,184);
	border-bottom-width:0px;		
}

.portrait {
    border-radius: 50%;
    width: 100%;
}

.marquee {
    width: 1200px;
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 1.7rem;
}

.marquee span {
	display: inline-block;
	padding-left: 100%;
	animation: marquee 45s linear infinite;
	-webkit-animation: marquee 45s linear infinite;
}

@-webkit-keyframes marquee {
0% { transform: translate(0, 0); }
100% { transform: translate(-100%, 0); }
}
@keyframes marquee {
0% { transform: translate(0, 0); }
100% { transform: translate(-100%, 0); }
}

@media only screen and (max-width: 30em) {

	.button {
		width:260px;
		text-align:center;
	}

}

@media only screen and (max-width: 40em) {
	
	#logo {
		position:absolute;
		top:15px;
		right:15px;
		width:60px;
		height:60px;
	}
	
	h1 {
		margin-top:3rem;
	}
	
	.contact {
		margin-bottom:0rem;
	}
	
	.contact {
		display:none;
	}
	
	.contactsmall {
		display:block;
	}
	
	span.pagelinks, a.pagelinks {
		font-size:1.5em;
	}
}

@media screen and (min-width: 40em) {
	
	#logo {
		position:absolute;
		top:15px;
		right:15px;
		width:60px;
		height:60px;
	}
	

}

@media screen and (min-width: 63em) {
	

}

@media screen and (min-width: 64em) {

	.menu {
		font-size:1.8rem;
		padding-right:0;
	}

	.menu a, .menu > li.active {
		font-size:1.8rem;
	}
	
	.menu > li > a, .menu > li.active {
		padding: 0.5rem 0;
	}	

	#logo {
		position:fixed;
		top:auto;
		bottom:100px;
		right:100px;
		width:200px;
		height:200px;
	}	

	.off-canvas {
		padding-top:0px;;
	}
		
	
	.position-left {
		transform: translateX(-600px);
		width: 600px;
	}
	.off-canvas-content {
		margin-left:625px;
	}	
	
	.off-canvas-wrapper-inner {
		padding-top:120px;
	}	

	span.pagelinks, a.pagelinks {
		font-size:1.8em;
	}	
}

@media screen and (min-width: 80em) {
	.menu {
		font-size:2rem;
	}
	
	.menu a, .menu > li.active {
		font-size:2rem;
	}
	
	.menu > li > a, .menu > li.active {
		padding: 0.7rem 0rem;
	}	
	
	#logo {
		bottom:125px;
		right:125px;
		width:250px;
		height:250px;
	}

	p, ul {
		font-size:1.2rem;
	}
	
	.position-left {
		transform: translateX(-700px);
		width: 700px;
	}
	
	.menu {
		font-size:1.6rem;
		font-weight:400;
		letter-spacing:0.05rem;
	}
	
	h1 {
		font-size: 3rem;
	}
	
	.welcome {
		font-size:2.1rem;	
	}
	
	.off-canvas-content {
		margin-left:725px;
	}	
	
	span.pagelinks, a.pagelinks {
		font-size:1.9em;
	}				
}

@media screen and (min-width: 100em) {
	#logo {
		bottom:150px;
		right:150px;
		width:300px;
		height:300px;
	}

	p, ul {
		font-size:1.4rem;
	}
	
	.menu {
		font-size:2.5rem;
		font-weight:400;
		letter-spacing:0.05rem;
	}
	
	h1 {
		font-size: 3.5rem;
	}
	
	.welcome {
		font-size:2.2rem;	
	}

	.button-group .button {
		font-size:1.3rem;
	}

	.position-left {
		transform: translateX(-800px);
		width: 800px;
	}	
	
	.off-canvas-content {
		margin-left:825px;
	}
	
	span.pagelinks, a.pagelinks {
		font-size:2em;
	}				
	
}

@media screen and (min-width: 120em) {
	.position-left {
		transform: translateX(-1000px);
		width: 1000px;
	}	
		
	.off-canvas-content {
		margin-left:1050px;
	}
	
	h1 {
		font-size: 4rem;
	}

	.welcome {
		font-size:2.5rem;	
	}
					
}