/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates

orange #f07e04
grün   #c1c475
grau #575756
-----------------------------------------------------------------*/
/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/montserrat-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/montserrat-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/montserrat-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/montserrat-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/montserrat-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/montserrat-v23-latin-regular.svg#Montserrat') 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-v28-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/open-sans-v28-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans-v28-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans-v28-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans-v28-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans-v28-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}



body {
    font-size: 1rem;
    line-height: 1.5;
    color: #666;
    text-align: left;
	font-family: 'Open Sans', sans-serif;
	word-wrap: break-word;
	-moz-hyphens: auto;
    -o-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto; 
}

.font-body { font-family: 'Open Sans'; }
.font-primary { font-family: 'Open Sans'; }
.font-secondary { font-family: 'Open Sans';}

::selection {background: #c1c475;color: #FFF;	text-shadow: none;}
::-moz-selection {background: #c1c475; /* Firefox */color: #FFF;	text-shadow: none;}
::-webkit-selection {background: #c1c475; /* Safari */color: #FFF;text-shadow: none;}

a {  text-decoration: none !important; color: #f07e04;}


p, pre, ul, ol, dl, dd, blockquote, address, table, fieldset, form {
    margin-bottom: 20px;
}

b, strong { font-weight: 500; color: #333;}

h1, h2, h3, h4, h5, h6 {
	color: #f07e04;
	font-weight: 400;
	line-height: 1.5;
	margin: 0 0 30px 0;
	font-family: 'Montserrat', sans-serif; 
	text-transform: uppercase;
}
h1 {font-size: 36px;}
h2 { font-size: 30px; margin-bottom:20px;}
h3 { font-size: 26px; margin-bottom:20px;}
h4 { font-size: 24px; margin-bottom:10px;}

.heading-block h1 { font-size: 38px;}
.heading-block h2 { font-size: 34px;}
.heading-block h3 { font-size: 28px;}


.heading-block h1, .heading-block h2, .heading-block h3, .heading-block h4, .emphasis-title h1, .emphasis-title h2 {
    margin-bottom: 0;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0px;
    color: #f07e04;
}

.heading-block::after { display: none;}
.heading-block > span:not(.before-heading) {
    margin-top: 0px;
	margin-bottom: 10px;
    font-weight: 300;
    color: #f07e04;
	font-family: 'Open Sans', sans-serif; 
	letter-spacing: 0px;
	font-size: 30px;
}

.post-grid .entry-title h2 {
  font-size: 2rem;
  font-weight: 400;
}
.entry-meta li {
  font-size: 90%;
  margin: 0 15px 10px 0;
  color: #c1c475;
}

.entry-title h2 {
    font-size: 30px;
    margin-bottom: 20px;
    font-weight: 400;
}

.page-title-content h1, .page-title-content .h1 {
  font-weight: 400;
  color: #c1c475;
  font-size: var(--cnvs-page-title-font-size);
  letter-spacing:0px;
}

.gruen { color: #c1c475;}
.white { color: #fff;}

.bg-gruen { background-color: rgba(193,196,117,0.6);}
.bg-orange { background-color: rgba(240,126,4,0.6);}
.bg-weiss { background-color: rgba(255,255,255,0.9) !important;}
.bg-blatt {background: url('../images/krematorium-verden-blatt.svg') no-repeat left center; background-size: 100%; opacity: 0.75 }

.text-smaller {	font-size: 60% !important;}
.text-danger { color: #f07e04!important;}

blockquote {
  font-size: 2.5rem;
  border-left: 5px solid #EEE;
}
.quote::before { display: none;}

.mb-8 { margin-bottom: 8rem;}
.mt-8 { margin-top: 8rem;}

.content-wrap { background-color: #f3f3ed;}

.breadcrumb a { color: #f07e04; font-family: 'Open Sans', sans-serif; }
.breadcrumb a:hover { color: #c1c475; }
.breadcrumb-item + .breadcrumb-item::before { content: "|";}

table th {
    color: #c1c475!important;
	font-weight: 400;
	font-family: 'Montserrat', sans-serif; 
	text-transform: uppercase;
}

table tbody td { color: #666!important;}

.modal-dialog { max-width: 800px;}
  
  

/*****************************  navigation **************************/

#logo img { height: 65px!important; z-index: 1;}

.svg-trigger {
  width: 80px;
  height: 80px;
}

.svg-trigger path { stroke: #575757;}

.overlay-menu:not(.top-search-open) #primary-menu-trigger {
  width: 80px;
  height: 80px;
  line-height: 80px;
}

.menu-link {	
	line-height:1.2; 
	color: #333;
	font-weight: 400;
	font-family: 'Montserrat', sans-serif; 
	font-size: 1rem;
}

.menu-item:hover > .menu-link, .menu-item.current > .menu-link { color: #c1c475;}
.menu-item .menu-link .current { color: #f07e04;}

.menu-item:hover > .menu-link, .menu-item.current > .menu-link {  color: #c1c475;}

.sub-menu-container .menu-item > .menu-link {
  font-size: 1rem;
  font-weight: 400;
  color: #575757;
  letter-spacing: 0;
  font-family: 'Montserrat', sans-serif;
}
.sub-menu-container .menu-item:hover > .menu-link { font-weight: 400;}

/********************************  portfolio ***********************/

.portfolio-desc h3 a { color: #575757;}
.portfolio-desc h3 a:hover { color: #c1c475;}
.portfolio-desc h3 a{ font-size: 1.8rem;}


/**********************  block expanding cards  ******************************/

.block-expand-categories h1,
		.block-expand-categories h2,
		.block-expand-categories h4 {font-family: 'Barlow Condensed', sans-serif; background-color: rgba(255,255,255,0.8); font-size: 1.1em; }

		.block-expand-categories .expand-category {
			--height: 60vh;
			--responsive-height: 80px;
			--hover-flex: 10;

			position: relative;
			background-position: center center;
			background-size: cover;
			border-radius: 0px;
			margin: 10px 0;
			min-height: var(--responsive-height);
			cursor: pointer;
		}

		.block-expand-categories .expand-category h4 {
			position: absolute;
			top: 50%;
			left: 0;
			right: 0;
			text-align: center;
			margin: 0;
			transform: translateY(-50%);
		}

		/* Larger Device */
		@media (min-width: 992px) {

			.block-expand-categories .expand-category {
				height: var(--height);
				flex: 1;
				margin: 0 10px;
				transition: flex 1s ease;
				-webkit-backface-visibility: hidden;
				transform: translate3d(0,0,0);
			}

			.block-expand-categories:not(.on-click) .expand-category:hover,
			.block-expand-categories.on-click .expand-category.active { flex: var(--hover-flex); }

			.block-expand-categories .expand-category h4 {
				opacity: 1;
				top: auto;
				bottom: 10px;
				transform: none;
				transition: opacity .4s ease;
			}

			.block-expand-categories:hover .expand-category:not(.active):not(:hover) h4,
			.block-expand-categories.on-click .expand-category:not(.active) h4 { opacity: 0; }
            
            .categories {
                display: flex;
                flex-wrap: wrap;
                align-items: stretch;
            }

            .category {
                position: relative;
                overflow: hidden;
                flex: 0 0 calc(100% - 20px);
                max-width: calc(100% - 20px);
                transition: all 0.5s cubic-bezier(.02, .01, .5, 1);
            }
            .category-inner {
                position: absolute;
                display: flex;
                justify-content: center;
                align-items: center;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                padding: 10px;
                z-index: 2;
                text-transform: uppercase;
            }  

            .category-inner {
                    width: auto;
                    height: auto;
                    left: 0;
                    top: auto;
                    bottom: 0;
                    writing-mode: vertical-rl;
                    text-orientation: mixed;
                    transform: rotate(180deg);
                }

                .category:hover .category-inner {
                    writing-mode: horizontal-tb;
                    transform: rotate(0);
                }
            .category-info { font-size: 1.6rem; color:#f07e04; background-color: rgba(255,255,255,0.8); padding: 5px 5px 5px 5px;}

		}

/**************************  button *********************/

.button {
  margin: 5px;
  padding: 4px 10px;
  font-size: 1rem;
  background-color: #c1c475;
  color: #fff;
  font-weight: 400;
  text-shadow: 0px rgba(0,0,0,0);
  border: 1px solid #fff;
}

.button:hover { background-color: #f07e04; color: #fff; border: none;}

.more-link:hover {border-bottom-color: #333;}
.more-link {
  display: inline-block;
  border-bottom: 1px solid #777;
  font-family: 'Open Sans';
  font-style: italic;
}



/**********************  social und listen ***************/

.social-icon { font-size: 1.6rem;color: #f07e04!important;}
.social-icon i:last-child {
  color: #c1c475!important;
  background: #fff;
border: none!important;
}


.iconlist > li i:first-child, .iconlist > li img:first-child {
  color: #c1c475!important;
}



/***********************  footer *****************************/


#footer {
	position: relative;
	background-color: #c1c475;
	color: #fff;
	font-size: 1rem!important;
	border-top: 1px solid #c1c475;
}
#footer p, #footer a {font-size: 1rem;}
#footer a {color: #fff;}


#copyrights {
  padding: 30px 0;
  background-color: #c1c475;
  font-size: 1rem;
  line-height: 1.8;
}

#footer .icon-chevron-right:before { font-size: 0.75rem;}

#gotoTop {
    --cnvs-gotoTop-stroke-color: #f07e04;
    --cnvs-gotoTop-stroke-width: 4px;
    --cnvs-gotoTop-scroll: 260;
    color: #fff!important;   
    background-color: transparent !important;
   }

#gotoTop::before {
    /* font-icons.css */
    content: "\F286";
    font-family: 'bootstrap-icons';

    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(32px + calc(var(--cnvs-gotoTop-stroke-width) * .5));
    height: calc(32px + calc(var(--cnvs-gotoTop-stroke-width) * .5));
    line-height: calc(32px - 1px);
    font-size: 1rem;
    color: #fff!important;
    transform: translate(-50%, -50%);
    border: 2px solid rgba(0,0,0,0);
    border-radius: 50%;
    z-index: -1;
    background-color: #c1c475;
}

#gotoTop circle {
    stroke: var(--cnvs-gotoTop-stroke-color);
    stroke-width: var(--cnvs-gotoTop-stroke-width);
    transform: rotate(-90deg);
    transform-origin: center;
    stroke-dashoffset: var(--cnvs-gotoTop-scroll);
    stroke-dasharray: 255 255;
    z-index: 1;    
}