/*
Theme Name: WOT
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/* -----------------------------------------
 Text Links 
 -------------------------------------------*/


 p a {
    font-weight: 600;
    text-transform: uppercase;
    color: var(--pink);
    position: relative;
 }

 p a::after {
    position: absolute;
    content: url("/wp-content/uploads/2024/03/button_icon.svg");
    padding-left: 1rem;
    width: 40px;
 } 

 p a.link_none {
    /* border: none;
    font-weight: 400;
      font-size: 1.25rem;
      color: var(--blau); */
      &:after {
          display: none;
      } 
} 




/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

:root {
	--rosa: #fbe7f8;
	--hellgrau: #d7e6f5;
    --weiss: #ffffff;

    /* --lila:#161067; */
    --lila:#110a43;

    --hellblau:#50A8F0;
    --pink:#DC17BE;
  }

  /* --------------------------------------------------
# Fonts poppins Lokal 
-----------------------------------------------------*/
   /* poppins-200 - latin-ext */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 200;
	src: url('fonts/poppins-v20-latin-ext-200.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('fonts/poppins-v20-latin-ext-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/poppins-v20-latin-ext-200.woff2') format('woff2'), /* Super Modern Browsers */
		 url('v/fonts/poppins-v20-latin-ext-200.woff') format('woff'), /* Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-200.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/poppins-v20-latin-ext-200.svg#Poppins') format('svg'); /* Legacy iOS */
  }
  /* poppins-300 - latin-ext */
  @font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 300;
	src: url('fonts/poppins-v20-latin-ext-300.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('fonts/poppins-v20-latin-ext-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/poppins-v20-latin-ext-300.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-300.woff') format('woff'), /* Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-300.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/poppins-v20-latin-ext-300.svg#Poppins') format('svg'); /* Legacy iOS */
  }
  /* poppins-regular - latin-ext */
  @font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	src: url('fonts/poppins-v20-latin-ext-regular.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('fonts/poppins-v20-latin-ext-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/poppins-v20-latin-ext-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-regular.woff') format('woff'), /* Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/poppins-v20-latin-ext-regular.svg#Poppins') format('svg'); /* Legacy iOS */
  }
  /* poppins-500 - latin-ext */
  @font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	src: url('fonts/poppins-v20-latin-ext-500.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('fonts/poppins-v20-latin-ext-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('/fonts/poppins-v20-latin-ext-500.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-500.woff') format('woff'), /* Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-500.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/poppins-v20-latin-ext-500.svg#Poppins') format('svg'); /* Legacy iOS */
  }
  /* poppins-600 - latin-ext */
  @font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	src: url('https://www.kirchenmusik-hochschule.org/wp-content/themes/hfk/fonts/poppins-v20-latin-ext-600.eot'); /* IE9 Compat Modes */
	src: local(''),
		 url('fonts/poppins-v20-latin-ext-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/poppins-v20-latin-ext-600.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-600.woff') format('woff'), /* Modern Browsers */
		 url('fonts/poppins-v20-latin-ext-600.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/poppins-v20-latin-ext-600.svg#Poppins') format('svg'); /* Legacy iOS */
  }




  body,h1,h2,h3,h4,h5,h6, p, blockquote, body #error-404 h2, body #error-404 h1, p .s1, strong {
    font-family:'Poppins';
    color: var(--lila);
  }


  p, ul, ol, p .s1{
      font-weight: 400;
      font-size: 1.125rem;
      line-height: 1.5;
      padding-bottom: 0rem;
      word-break: normal;
  }

  p .s1, strong {
      color: var(--pink);
      font-weight: 600;
  }

  ul {
    /* li {
        list-style:circle;
    } */
    margin-left: 20px;
  }

  .page-submenu ul{
    font-size: 1rem;
  }

  h1 {
     font-size: 1.825rem;
     font-weight: 600;
     line-height: 1;
     margin-left: -30px;
  }

  h2 {
    font-size: 3rem;
    font-weight: 600;
    line-height: 1;
 }

h3, h3.toggle-title a {
    font-size: 1.313rem;
    font-weight: 600!important;
    line-height: 1!important;
}

h5 {
    font-weight: 500;
     display: inline-block;
     border: 8px solid var(--pink) ;
     border-radius: 30px;
     padding: 8px 70px 8px 15px;
 }

 h1 {
     display: inline-block!important;
     border: 12px solid var(--pink) ;
     border-radius: 70px;
     padding: 8px 100px 8px 15px!important;
     margin-bottom: 50px;
 }



 blockquote.wp-block-quote, blockquote p, blockquote {
     padding-left: 0rem;
 }

 blockquote p {
    font-size: 1.75rem;
     font-weight: 300;
 }
 
 blockquote {
     margin-bottom: 10px;
 }

 blockquote.wp-block-quote::before, blockquote::before {
     display: none;
 }

 .text_weiss {
     p, blockquote, h1, h2, h3, ul, li {
        color: var(--weiss);
     }
 } 

 .text_pink {
    p, blockquote, h1, h2, h3, ul, li {
       color: var(--pink)!important;
    }
} 

 
 
 /* h5 {
    font-weight: 500;
     display: inline;
     border: 10px solid;
  border-image-slice: 1;
  border-width: 10px;
  border-image-source: linear-gradient(to left, #743ad5, #d53a9d);
     padding: 8px 70px 8px 15px;
 }
 */

 /* h5 {
    font-size: 3rem;
     font-weight: 600;
     display: inline;
     white-space: pre;
 border-radius: 60px;
  border: solid 15px transparent;
  background-image: linear-gradient(white, white),
    linear-gradient(90deg,  var(--hellblau),  var(--pink));
  background-origin: border-box;
  background-clip: content-box, border-box;
  cursor: pointer;
 } */

 .Datum {
     width: 200px!important;
 }
 

 

 /* Links normaler Größe ohne Pfeil */
/* p a.link_none {
    border: none;
    font-weight: 400;
      font-size: 1.25rem;
      color: var(--blau);
} */

/* Links als blauer button */

 /* .blau p a {
   background-color: var(--blau) ;
      font-size: 1.25rem;
      color: var(--weiss);
      padding: 15px;
}

.blau p a:hover {
    color: var(--blauhover);
} */


/* Responsve Typografie */

@media only screen and (max-width: 600px) {
    blockquote p {
        font-size: 1.45rem;
     }

     h1 {
        font-size: 1.825rem;
        line-height: 1.2;
     }

     h2 {
        font-size: 1.5rem;
        line-height: 1.2;
     }

     p, p a, h3 {
        font-size: 1rem;
     }

  }

  @media only screen and (max-width: 999px) {
    /* #logo {
        width: 60px;
        height:60px;
    } */
    
   /*  #header-outer {
        top: 30px!important;
    } */

  }


  /* --------------------------------------------------
# Submenu
-----------------------------------------------------*/

  .page-submenu .mobile-menu-link {
    font-family:'Poppins';
    font-weight: 400;
    font-size: 1.25rem;
    color: var(--blau);

  }

  .page-submenu ul li a {
    color: var(--blau);
  }
      
    

/* --------------------------------------------------
# Slider
-----------------------------------------------------*/


/* .nectar-flickity:not(.masonry) .flickity-viewport {
    margin: 0px 0px!important;
}

.nectar-flickity[data-controls*=arrows_overlaid] .flickity-prev-next-button:before {
    border-radius: 0;
} */


/* --------------------------------------------------
# Header Styling 
-----------------------------------------------------*/


#header-outer:not([data-format=left-header]) #top nav>ul>li {
    -webkit-align-items: center;
    align-items: center;
    /* margin-bottom: 10px; */

    a {
        font-family:'Poppins';
        color: var(--weiss);
        font-weight: 500;
        font-size: 1.25rem;
    }
}

/* #header-space, #header-outer {
    background-color:var(--weiss)!important ;
} */

nav>ul>li:first-of-type{
    margin-left: 30px;
    /* background-color: crimson; */
} 



/* #header-secondary-outer { 
    background: none;

    nav>ul>li>a .menu-title-text {
        font-family:'Poppins';
            color: var(--blau);
            font-weight: 400;
            font-size: 1rem;
    }

    nav {
        min-height: 20px!important;
    }

    nav>.sf-menu {
        padding: 0!important;
    }
} */

/* .material #header-secondary-outer>.container {
    min-height: 20px;
}

.material #header-secondary-outer {
    min-height: 20px;
} */


 /* .page-speakerinnen  , .page-programm, .page-locations, .search, .page-kontakt, .page-impressum, .page-sponsoren {  */
    
    /* #header-outer {
        background-image: linear-gradient(-90deg, var(--hellblau),var(--pink));
    } */

/* } */


/* body #header-outer, body[data-header-color="dark"] #header-outer {
    
};

body #header-outer[data-transparent-header="true"][data-remove-border="true"] {}

.page-speakerinnen, .page-programm { 

    #header-space {
        background-color:var(--lila)!important ;
    }
}

 .page-locations, .search, .page-kontakt, .page-impressum, .page-sponsoren { 

    #header-space {
        background-color:var(--weiss)!important;
    }
} */

#header-space {
    background-color:var(--weiss)!important;
}


#header-outer:not(.transparent.entrance-animation), #header-outer.small-nav {
    background-color: none;
    background-image: linear-gradient(-90deg, var(--hellblau),var(--pink))!important;
}


/* Abstand Menu Items */
#header-outer #top nav > ul > li > a {
    margin-left: 0px;
    white-space: nowrap ;
    font-size: 1.1rem!important;
    /* margin-right: 15px; */
}


#search-btn {
    margin-bottom: 10px;
}

#top nav ul #search-btn a span  {
    color: var(--weiss);
}

#search-outer:before {
   background-color: var(--lila)!important; 
    
}
#search-box {
    p {
        color: var(--lila);
    }
}

/*Search Input*/
#search-outer #search input[type=text] {
    font-family:'Poppins';
}

body.material #header-outer:not([data-format=left-header]) #top nav>.buttons>li {
    margin: 14px 14px;
}

@media only screen and (max-width: 999px) {
#header-space {
    height: 70px!important;
    }
}


/* --------------------------------------------------------------------------------------
# Pages Background / Styling
-----------------------------------------------------------------------------------------*/

.page-speakerinnen , .page-programm, .page-sponsoren { 

    p, h1, h2, h3 , h5 , li {
        color: var(--weiss);
        }
    
        .container-wrap, .main-content {
            background-color: var(--lila)!important;
         }

            .speakerin p {
                color: var(--pink) ;
            }

            .speakerin p.programm_format {
                color: var(--weiss) ;
            }

            #header-space {
                background-color:var(--lila)!important ;
            }

}


.home .row .col img {
    margin-bottom: 0px!important;
}




#top .sf-menu > li:not([class*="menu-item-btn"]) > a .menu-title-text:before {
    background-color: var(--pink);
    filter: opacity(0.15);
}

/* #top .sf-menu > li:not([class*="current"]):not([class*="menu-item-btn"]) > a .menu-title-text:before {
    background-color: currentColor;
} */


/* Dropdown Menu */

/* body:not([data-header-format=left-header]) #top .sf-menu li ul {
    background-color: var(--blau);
    margin-top: 8px;
}


#header-outer:not([data-format="left-header"]) #top nav >ul >li:not(.megamenu) ul a {
    color:var(--hellgrau);
}

#header-outer:not([data-format="left-header"]) #top nav >ul >li:not(.megamenu) ul a:hover {
    color:var(--blauhover);
} */





/*------------------------------------------------------------------------------
Mobile Menu Items
-------------------------------------------------------------------------------*/

#mobile-menu .menu-item a {
    font-family:'Poppins';
    color: var(--lila);
    font-weight: 400;
    font-size: 1.25rem!important;
}

/*Menu Toggle Mobile*/
body.mobile.material[data-header-color=light] #header-outer .slide-out-widget-area-toggle a .close-line {
    background-color: var(--weiss)!important;
}

.slide-out-widget-area-toggle.mobile-icon .lines::after,
.slide-out-widget-area-toggle.mobile-icon .lines::before,
.slide-out-widget-area-toggle.mobile-icon .lines-button:after  {
    background-color: var(--weiss)!important;
}

.material .mobile-search .icon-salient-search {
    color: var(--weiss);
}

body[data-header-color=dark] #header-outer #mobile-menu:before {
    background-color: var(--lila)!important;
}

#search-outer .close-wrap .close-line {
    background-color: var(--weiss);
}


/* --------------------------------------------------
# Buttons
-----------------------------------------------------*/

.btn {
    border: 5px solid!important;
    font-family:'Poppins';
}

/* --------------------------------------------------
# Global Section
-----------------------------------------------------*/



.ticket_btn { 
    position: fixed;
    left: 0;
    top: 150px;
}

@media only screen and (max-width: 1000px) {
    .ticket_btn {
        top: 140px;
    }
}


@media only screen and (max-width: 480px) {
    .ticket_btn { 
        width: 60px;  
    }
}


@media only screen and (min-width: 480px) {
    .ticket_btn { 
    width: 100px;  
    }
}


.nectar-global-section.after-nav {
    z-index: 50;
}


#top nav>ul #menu-item-53 a:before, #top nav>ul #menu-item-53 a:before, #header-outer.transparent #top nav>ul>li[class*=button_bordered]>a:before, #top nav>ul>li[class*=button_bordered]>a:before  {
    border: 5px solid var(--weiss)!important;
}


/* --------------------------------------------------
# Footer
-----------------------------------------------------*/

#footer-outer {
    background-color:var(--lila) ;

    p a {
        color: var(--blau);
     }
    
    
     p a:after {
        display: none;
     }

     .menu-item {
         color:var(--weiss);
     }  
     
     @media only screen and (min-width: 1000px) {
        .menu-item {
            display: inline-block;
        margin-right: 20px;
        }
     }
    
}

#footer-outer #block-7.widget .wp-block-columns {
    width: 200px!important;
}


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

    .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column {
        flex-basis: 15%!important;
    }
    

  }



/* --------------------------------------------------
# Acordion
-----------------------------------------------------*/


div[data-style="minimal_small"] .toggle > .toggle-title::before, div[data-style="minimal_small"] .toggle.open > .toggle-title:after, div[data-style="minimal_small"] .toggle > .toggle-title:after {
    bottom: -10px;
}

.toggles.accordion .toggle>.toggle-title a {
    color: var(--blau);
}

/* --------------------------------------------------
# Referenzen Grid
-----------------------------------------------------*/

/* .cl-layout--equal-rows .cl-template {
    height: 200px!important;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    justify-content: left;
} 

.cltext {
    border: none;
    margin: 0px 30px 0px 0px!important;
    border: none!important;
   
    background-color: var(--blau);
}


.cl-layout__masonry-content .cl-template .cl-element-section {
    position: absolute!important;
    top: 175px;
    left: 25px;

    a{
        color: var(--weiss);
        padding: 5px 20px;
    }
}

.cl-template--id-156 .cl-element--instance-1001, .cl-template--id-156 .cl-element--instance-1001 .cl-element-title__anchor {
    font-family:'Poppins'!important;
}

.cl-layout__masonry-content .cl-template--id-156 .cl-element--instance-1002 {
    background-color: var(--weiss)!important;
}

.cl-layout__masonry-content .cl-template {
    background-color: var(--weiss)!important;
}
 */
/* --------------------------------------------------
# Search and Filter
-----------------------------------------------------*/


/* @media only screen and (min-width: 600px) {
    .sf-field-taxonomy-project-type {
        float: left;
    width: 50%;}    
}

.sf-field-reset {
    text-align: right;
}

.search-filter-reset {
    color: var(--weiss) ;
    background-color: var(--blau) ;
    padding: 10px;
    margin-right: 5px;
} */

 
/* --------------------------------------------------
# Single Portfolio
-----------------------------------------------------*/

/* body.single-portfolio {
    background-color: var(--blau)!important;
}

.single-portfolio {

    #header-outer, #header-space, .bottom_controls, .wpb_row .row-bg-wrap .inner-wrap, #footer-outer {
        background-color: var(--blau);
    }

    #top nav ul #search-btn a span  {
        color: var(--weiss);
    }

    #header-space {
        margin-bottom: 0px;
    }

    #header-outer #full_width_portfolio .container-wrap {
        background-color: var(--blau)!important;
    }

    .container-wrap, .main-content {
        background-color: var(--blau)!important;
    }


    body:not(.nectar-no-flex-height) #ajax-content-wrap {
        background-color: var(--blau);
    }

    #header-outer:not([data-format=left-header]) #top nav>ul>li {
        a {color: var(--weiss);}
    }

    #header-secondary-outer
    nav>ul>li>a .menu-title-text {
        color: var(--weiss);
    }

   p, h1, h3 , li {
    color: var(--weiss);
   }


    #top #logo .lackersvg   {

    .cls-1 {
            fill:var(--weiss);
        }
    }

   .st0 {
        fill:var(--weiss)!important;
    }

        .st1 {
        fill:var(--blau)!important;
    }

    .material .mobile-search .icon-salient-search {
        color: var(--weiss)!important;
    }

    body.mobile.material[data-header-color=light] #header-outer .slide-out-widget-area-toggle a .close-line {
        background-color: var(--weiss)!important;
    }
    
    .slide-out-widget-area-toggle.mobile-icon .lines::after,
    .slide-out-widget-area-toggle.mobile-icon .lines::before,
    .slide-out-widget-area-toggle.mobile-icon .lines-button:after  {
        background-color: var(--weiss)!important;
    }

    } */

    

/* --------------------------------------------------
# Karriere
-----------------------------------------------------*/

.grid_icon {
    width: 50px;
}


/* --------------------------------------------------
# wpforms
-----------------------------------------------------*/

/* Kontaktformular */

#wpforms-203 {

    input, textarea {
    background-color: var(--weiss);
    border: 2px solid var(--lila)!important;
    border-radius: 30px;
    color: var(--lila);
}

.wpforms-field-sublabel {
    color: var(--lila);
}

}

#wpforms-203 .wpforms-submit {
    background-color: var(--pink);
    border: none;
    padding: 10px 23px!important;
}


div.wpforms-container-full .wpforms-confirmation-container-full {
    background:var(--weiss)!important;
    border: none!important;
}



/* .products_hight {
    height: 420px;
}


 @media only screen and (max-width: 690px) {
    .products_hight {
        height: 650px;
    }
}  */


/* --------------------------------------------------
# Background Gradient
-----------------------------------------------------*/

.bg_gradient {
    background-image: linear-gradient(-90deg, var(--hellblau),var(--pink));

    .column-image-bg {
        background-size:contain!important;
        background-repeat:no-repeat!important;
    }

    a, h2 {
        color: var(--weiss);
    }
}

.bg_rosa {
    background-color: var(--rosa);

    .using-image.using-bg-color {
       background-size: contain;
    }
}

.bg_hellgrau .row-bg-wrap {
    background-color: var(--hellgrau);
}

/* --------------------------------------------------
# Images Styling
-----------------------------------------------------*/

img.img_rounded {
    border-radius: 20px 20px 20px 20px!important;
}

img.img_rounded_left {
    border-radius: 20px 0px 0px 20px!important;
}

img.img_rounded_right {
    border-radius: 0px 20px 20px 0px!important;
}

/* --------------------------------------------------
# Button to top
-----------------------------------------------------*/

#to-top {
    background-color: var(--hellblau)!important;
}