@charset "utf-8";
/* CSS Document */

/*
Theme Name: Proband Sein
Theme URI: https://www.probandsein.de
Description: PAREXEL International GmbH 
Author: Tim Ohler (powerMedia GmbH)
Author URI: http://www.powermedia.de
*/

/*------------------------------------------------------- BASIC ---------------------------------------------*/ 

html {
    font-size: 15px;
}

body {
    font-family: 'Lato', sans-serif;
    color: #53565a;
    font-size: 1rem;
} 

/*------------------------------------------------------- Colors ---------------------------------------------*/

/* lato-100 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/lato/lato-v23-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-100.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-100.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-100italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 100;
  src: url('fonts/lato/lato-v23-latin-100italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-100italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-100italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-100italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-100italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/lato/lato-v23-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-300italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/lato/lato-v23-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-300italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/lato/lato-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/lato/lato-v23-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/lato/lato-v23-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-700.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-700italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/lato/lato-v23-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-700italic.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-900 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/lato/lato-v23-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-900.svg#Lato') format('svg'); /* Legacy iOS */
}
/* lato-900italic - latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 900;
  src: url('fonts/lato/lato-v23-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato/lato-v23-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato/lato-v23-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato/lato-v23-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato/lato-v23-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato/lato-v23-latin-900italic.svg#Lato') format('svg'); /* Legacy iOS */
}


.bg-graphite {
    background-color: #4E565B !important;
    color: #fff;
}
.bg-graphite strong {
    color: #fff;
}

.bg-lime {
    background-color: #D3D800 !important;
    color: #fff;
}
.bg-graphite strong {
    color: #fff;
}

.bg-berry {
    background-color: #8A0050 !important;
    color: #fff;
}
.bg-graphite strong {
    color: #fff;
}

.bg-graphite-darker {
    background-color: #53565a !important;
    color: #fff;    
}

.bg-lightgrey {
    background-color: #eeedef !important;
}

.bg-lightergrey {
    background-color: #fafafa !important;
}

.bg-white {
    background-color: #fff !important;
}

/*------------------------------------------------------- Typo ---------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
    overflow-wrap: normal;
}


h1 {
    font-size: 2.7rem;
    font-weight: 300;
}
/*
h2 {
    font-weight: 700;
    font-size: 2.28rem;
    margin: 0 0 0.33em 0;
    line-height: 1.1em;
}
*/

h2, h3 {
    font-weight: 700;
    font-size: 1.6rem;
    margin: 0 0 0.33em 0;
}

h4 {
    font-weight: 900;
    font-size: 1.2rem;
}

h5 {
    font-weight: 900;
    margin-bottom: 0.5rem;
}

p, ul {
    font-size: 1.07rem;
}


p {
    line-height: 1.6em;
    margin: 0 0 1.2em;
}

ul + p {
    margin-top: 1rem;
    
}

a {
    color:inherit;
    cursor: pointer;
    text-decoration: underline;
}

.link {
    color: #2d97a9;
    font-weight: 700;
    font-style: italic;
}

input.link {
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
}

button.link {
    border: 0;
    background: no-repeat;
    font-size: 1rem;
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
    width: 100%;
    
    margin-top: 1rem;
}

.link:after {
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    padding-left: 10px;
    font-style: normal;
}

.btn {
    font-weight: 900;
    font-style: italic;
    color: white;
    font-size: 0.95em;
    border-radius: 25px;
    border-style: solid;
    border-width: 1px;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    min-width: 115px;
    padding: 15px 30px;    
    -moz-transition: background-color 0.1s ease-out;
    -webkit-transition: background-color 0.1s ease-out;
    -o-transition-property: background-color 0.1s ease-out;
    -ms-transition-property: background-color 0.1s ease-out;
    transition-property: background-color 0.1s ease-out;
    text-decoration: none;
    max-width: 235px;    
    white-space: nowrap;    
}

.btn.berry {
    background-color: #840b55;
    border-color: #840b55;
}

.btn.blue {
    background-color: #04a9c7;
    border-color: #04a9c7;
}

.btn.is-primary {
    border: 0;
    text-decoration: none;
    border-radius: 20px;
    height: auto;
    padding: 1rem 2rem;
    font-style: italic;
    transition: .25s ease-in-out;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    justify-content: center;
    display: inline-flex;
    font-size: 1rem;    
    position: relative;
    background: #840b55;
    color: #fff; 
    max-width: none;
    -moz-transition: all 0.1s ease-out;
    -webkit-transition: all 0.1s ease-out;
    -o-transition-property: all 0.1s ease-out;
    -ms-transition-property: all 0.1s ease-out;
    transition-property: all 0.1s ease-out;    
}


.btn.is-primary:before {
    content: "";
    height: 100%;
    width: 4px;
    background: #fff;
    position: absolute;
    right: 54px;
    top: 0;
    -moz-transition: all 0.1s ease-out;
    -webkit-transition: all 0.1s ease-out;
    -o-transition-property: all 0.1s ease-out;
    -ms-transition-property: all 0.1s ease-out;
    transition-property: all 0.1s ease-out;       
}
.btn.is-primary:after {
    position: absolute;
    right: 23px;
    top: 17px;
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: .8rem;
    font-style: normal;
}

.btn.is-primary span {
    min-width: 200px;
    text-align: center;
    padding-right: 54px;
}

.btn.is-primary:hover {
   padding: 1rem 2.5rem 1rem 2rem; 
}
.btn.is-primary:hover:before {
    width: 12px;  
}

.btn.berry:hover, .searchandfilter input[type="submit"]:hover {
    background: transparent;
    text-decoration: none;
    color: #840b55;
    border: 1px solid #840b55;
}

.btn.blue:hover {
    background: transparent;
    text-decoration: none;
    color: #04a9c7;
    border: 1px solid #04a9c7;    
}

.bg-berry .btn {
    background-color: transparent;
    border: 1px solid #fff;
}


.bg-berry .btn:hover {
    background-color: #fff;
    border: 1px solid #fff;
    color: #8a0050;
}

input[type="submit"]:focus, button[type="submit"]:focus {

    outline: 0;
}

.content ul {
    list-style: none;
    margin-left: 0;
    font-size: 1rem;    
}

.content ul li {
    position: relative;
    padding-left: 2rem; 
}

.content ul li:before {
    content: "\f054";
    position: absolute;
    left: 0;
    top: 0;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #cedc00;
    font-size: 1rem;   
}

.content fieldset ul li:before {
    display:none;
}

.content fieldset ul.checkbox {
    margin: 0 0 .4rem 0;
}

.content fieldset ul.checkbox li {
    padding: 0 2rem 0 0;
}

.content fieldset ul.checkbox li + li {
    margin-top: 0;
}

/*------------------------------------------------------- General Layout ---------------------------------------------*/

.section.is-small {
    padding: 1rem 1.5rem;
}

.section.is-tieless {
    padding: 3rem 0rem;
}

.is-tieless .columns {
    margin: 0;
}

.has-text-centered	{
    text-align: center;
}

.info-hidden {
    display: none;
}

hr {
    background-color: whitesmoke;
    border: none;
    display: block;
    height: 2px;
    margin: 1.5rem 0;
    width: 100%;
}

main > .container.hr:first-child{
    display: none;
}

section.section.bg-white + section.section.bg-white {
    padding-top: 0;
}

section.section section.section {
    padding: 0 !important;
}

/*------------------------------------------------------- Header & Menu ---------------------------------------------*/

header {
    border-top: 16px solid #cedc00;
    border-bottom: 2px solid #d9d9d9;
}

header section.section .container{
    position: static;
}
header section.section .container .column {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

header img.logo {
    max-width: 200px;
    width: 100%;
}

.menu a {
    text-decoration: none;
}

/* MENU */ 

.menu-btn {
    display: inline-block;
    cursor: pointer;
    float: right;
}

.bar1, .bar2, .bar3 {
    width: 25px;
    height: 3px;
    background-color: #333;
    margin: 5px 0;
    transition: 0.4s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-6px, 6px);
}

.change .bar2 {
    opacity: 0;
}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-6px, -7px);
    transform: rotate(45deg) translate(-5px,-6px)
}

nav.main-menu a {
    cursor: pointer;
    text-decoration: none;
}

nav.main-menu ul.menu-main a {
    font-weight: bold;
    color: #fff;
}
.menu-main-container, .search-form-container {
    position: absolute;
    top: 96px;
    left: 0;
    background: #53565a;
    width: 100%;
    padding: 10px 0;
    display: none;
    z-index: 1;
}

.menu-main-container ul {
    padding-bottom: 20px;
        list-style-type: none;
}


.menu-main-container ul li a  {
    padding-right: 5% !important;
    padding-left: 5% !important;
    width: auto;    
}

ul.menu-main > li > a, ul.menu-main > li > ul.sub-menu > li > a {
    padding: 15px 0;  
    border-bottom: 1px solid #66696c;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/*
ul.menu-main > li > a > i {
    font-size: 1.5em;
}*/


ul.menu-main > li.menu-item-has-children > a:after {
    content: "\f054";
    display: block;
font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: .6rem;
    color: #a8aaac;
}



ul.menu-main > li.menu-item-has-children > ul.sub-menu > li.menu-item-has-children > a:after {
    content: "\f078";
    display: block;
font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: .6rem;
    color: #a8aaac;    
}

/* Main Menu Thrid Level */

ul.sub-menu > li > ul.sub-menu {
    background: #cdcfd2;
    padding: 20px 0;
}

nav.main-menu ul.menu-main ul.sub-menu > li > ul.sub-menu a {
   color:#53565a;
    padding:10px 15px ;
    font-weight: normal;
}



/* Extra Menu: Main Menu Second Level */

ul.menu-main-second-level {
    border-bottom: 1px solid #66696c; 
}

ul.menu-main-second-level a {
    color: #a8aaac;
    text-transform: uppercase;
    font-weight: bold;
    font-style: italic;
    padding: 8px 0;
}

ul.menu-impressum {
    margin-top: 20px;
}

ul.menu-impressum, ul.social {
    display: flex;
    justify-content: center;
    font-size: .9rem;
        flex-wrap: wrap;
    list-style-type: none;
}

ul.menu-impressum > li {
    padding: 0 10px;
}

ul.menu-impressum a {
    color: #a8aaac;
    white-space: nowrap;
    padding: 0 !important;    
}


img.menu-logo {
    max-width: 200px;
    width: 100%;
    margin: 0px auto 20px auto;
    display: block;    
}

img.menu-logo.mobile {
    display: block;
}       
img.menu-logo.desktop {
    display: none;
}  

.menu-main-footer p {
    color: #a8aaac;
    text-align: center;
    font-size: .9rem;
    margin: 0 0 20px 0;    
}

.social i {
    background: #cedc00;
    height: 35px;
    width: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #53565a;
    font-size: 1rem;
}

/* Menu Styles for JS*/

ul.menu-main ul.sub-menu {
    display: none;
}

ul.menu-main ul.sub-menu.active {
    display: block;
    visibility: visible;
        background: #53565a;
}


.menu-main.hidden {
    visibility: hidden;
    display: block!important;
}

.menu-main.hidden > li:not(.active) {
    display: none;
}  
.menu-main.hidden > li.active > a {
    display: flex;
    visibility: visible;
    text-transform: uppercase;
    justify-content: center;    
    color: #a8aaac;
    font-size: .95em;
    position: relative;
}

.menu-main.hidden > li.active > a:after {
    content: "\f053";
    display: block;
    position: absolute;
    left: 5%;
    top: 19px;

}



/*------------------------------------------------------- Hero Area ---------------------------------------------*/

.hero {
    background: #eeedef;
    position: relative;
    padding: 0 !important;
}

.hero > .container{
    padding: 3rem 1.5rem;
}

            
.hero h1 {
    line-height: 1em;
}

.hero h1 + .content {
    margin: 2.5rem 0px;
}


.hero ul.menu {
    min-width: 301px;
}

.hero ul.menu > li:nth-of-type(1) {
    display: none;
}

.hero ul.menu > li:nth-of-type(n+2) {
    color: #840b55;
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    border-top: 1px solid #53565a;
}

.hero ul.menu  > li a {
    color: #840b55;
}

.hero ul.menu > li a:after {
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    padding-left: 10px;
}

.hero ul.menu > li:last-child {
    border-bottom: 1px solid #53565a;
}


/*------------------------------------------------------- Sidebar ---------------------------------------------*/

.sidebar > aside {
    background-color: #f0f1f1;
    border-bottom: 0;
    padding: 1.5em 40px;
    margin-bottom: 1.5rem;
}

.sidebar h3 {
    border-bottom: 1px solid #53565a;
    padding-bottom: 0.5em;
    font-size: 1.5rem;
    margin-bottom: 1em;
    font-weight: 400;    
}

.sidebar-item {
    background-color: #f0f1f1;
    border-bottom: 0;
    padding: 1.5em 40px;
}

.sidebar-item h3 {
    border-bottom: 1px solid #53565a;
    padding-bottom: 0.5em;
    font-size: 1.4rem;
    margin-bottom: 1em;
    font-weight: 400;    
}

/*------------------------------------------------------- Footer ---------------------------------------------*/

footer .footer-brand-info img {
    max-width: 200px;
    width: 100%;
    margin: 0px 0 20px 0;
    display: block;
}

footer ul {
    text-transform: uppercase;
    list-style: none;
    font-weight: normal;
}

ul.social {
    justify-content: left;
}

ul.social a{
    text-decoration: none;
}

ul.menu-impressum, ul.social {
    display: flex;
    justify-content: center;
    font-size: .9rem;
    flex-wrap: wrap;
    list-style-type: none;
}
.social i {
    background: #cedc00;
    height: 35px;
    width: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #53565a;
    font-size: 1rem;
    margin-right: 10px;
}

/* Footer MENU Startseite */

.menu-bg {
    background-size: cover;
    min-height: 150px;    
}

.column.footer-menu-ties {
    background-color: #eeedef;
}

.footer-menu-ties ul.menu {
    min-width: 301px;
}
.footer-menu-ties ul.menu > li a {
    color: #840b55; 
}

.footer-menu-ties ul.menu > li a:after {
    content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    padding-left: 10px;
}

.footer-menu-ties ul.menu > li:first-child {
    margin-bottom: 1.5rem;
}

.footer-menu-ties ul.menu > li:first-child a{
    font-weight: 300;
    font-size: 35px;
    margin-top: 0;
    color: #53565a;
    cursor: default;
}
.footer-menu-ties ul.menu > li:first-child a:after {
    content: "";
}

.footer-menu-ties ul.menu > li:nth-of-type(n+2) {
    color: #840b55;
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    border-top: 1px solid #53565a;
}

.footer-menu-ties ul.menu > li:last-child {
    border-bottom: 1px solid #53565a;
}

section.is-tieless:nth-of-type(odd) > .columns {
    display: flex;
    flex-direction: column-reverse;
}
    
.footer-menu-ties > div {
    padding: 1.5rem 0;
}
    
    
/* Footer Menu */

footer .menu + .menu {
    margin-top: 2rem;
}

footer .menu li:first-child {
    margin-bottom: .5rem;
}

footer .menu li:nth-of-type(n+2){
margin-bottom: .2rem;
}

footer .menu li:first-child a {
    font-weight: 900;
    cursor: default;
    text-transform: uppercase;
    margin-bottom: 1.5rem;
}

footer .menu li:first-child a:hover {
    text-decoration: none;
}


footer .menu li a, ul.footer-menu-impressum li a {
    text-transform: none;
}

footer .menu li a:hover, ul.footer-menu-impressum li a {
    color: #fff;
    text-decoration: underline;
}

footer ul.social {
    justify-content: left;
}


/* Form Layout Styles
-------------------------------------------------------------- */

button + .loader {
    animation: none !important;
    border: none;
    border-radius: 0;
}

form {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

fieldset {
    border: 0;
    margin: 5px 0;
    width: 100%;
}
fieldset > label {
    font-weight: bold;
    width: 100%;
    display: block;
}

input:focus, select:focus, textarea:focus  {
    border: 1px solid #a8aaac;
}
input:focus, select:focus, textarea:focus {
    outline: 0;
}

input, textarea, select {
    width: 100%;
    padding: 13px;
    margin: 7px 0px;
    color: #4f4f4f;
    background-image: none;
    background-color: #fff;
    border: 1px solid #cecfd3;
    font-size: 1em;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    border-radius: 4px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


ul.checkbox li {
    position: relative;
}

input[type='checkbox']:checked, input[type='checkbox']:not(:checked), input[type='radio']:checked, input[type='radio']:not(:checked) {
    background: transparent;
    margin: 0;
    padding: 0;
    height: 15px;
    width: 15px;
    opacity: 0;
    position: absolute;
}
input[type='checkbox']+label, input[type='radio']+label {
    cursor: pointer;
    position: relative;
    align-items: baseline;
    display: flex;
    font-size: 1rem;    
}

input[type='checkbox']:checked+label::before, input[type='checkbox']:not(:checked)+label::before, input[type='radio']:checked+label::before, input[type='radio']:not(:checked)+label::before {
    content: ' ';
    display: inline-block;
    flex: 0 0 22px;
    height: 22px;
    position: relative;
    top: 6px;
    border-radius: 3px;
    margin-right: 15px;
    min-width: 22px;
    border: 1px solid #cecfd3;
}

input[type='checkbox']:checked+label:hover:before, input[type='checkbox']:not(:checked)+label:hover:before, input[type='radio']:checked+label:hover:before, input[type='radio']:not(:checked)+label:hover:before {
    border: 1px solid #a8aaac;
}

input[type='checkbox']:checked+label::after {
    content: "";
    left: 8px;
    top: 11px;
    width: 4.6px;
    height: 7.92px;
    border: solid #840b55;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
}

input + label {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
        position: relative;
    cursor: pointer;
}
.birthday-wrap {
    display: flex;
}
div.birthday-wrap > div:nth-of-type(1){
    width: 100%;
    max-width: 100px;
    margin-right: 12px;    
}
div.birthday-wrap > div:nth-of-type(2){
    width: 100%;
    max-width: 100px;
    margin-right: 12px;    
}
div.birthday-wrap > div:nth-of-type(3){
    width: 100%;
    max-width: 160px;
    margin-right: 12px;    
}

label.error {
    cursor: default;
    font-weight: 400;
    color: #e41010;
    font-size: .8rem;
}

form .title {
    margin: .5rem 0 .8rem 0 !important;
}

#form_send {
    margin: 1.5rem 0;
}

fieldset + button {
    margin-top: 1rem;
}


/* Search & Filter Form
-------------------------------------------------------------- */
form.searchandfilter {
    margin: 2rem 0;
    display: block;    
}

.searchandfilter ul {
    display: flex;
    flex-wrap: wrap;
}

.searchandfilter ul > li{
    flex: 100%;
    margin: .25rem 0px    
}

.searchandfilter h4 {
    margin: 0;
    font-size: 1rem;
}

.searchandfilter input[type="submit"] {
    font-weight: 900;
    font-style: italic;
    color: white;
    font-size: 0.95em;
    border-radius: 25px;
    border-style: solid;
    border-width: 1px;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    min-width: 115px;
    padding: 15px 30px;    
    -moz-transition: background-color 0.1s ease-out;
    -webkit-transition: background-color 0.1s ease-out;
    -o-transition-property: background-color 0.1s ease-out;
    -ms-transition-property: background-color 0.1s ease-out;
    transition-property: background-color 0.1s ease-out;
    background-color: #840b55;
    border-color: #840b55;    
    max-width: 235px;
}

.searchresultstudyname {
    font-size: .85rem;
    text-align: right;
    padding: 5px 15px;
    background: #f7f7f7;
    color: #383838;
    margin: 0 0 10px 0;
    display: inline-block;
    border-radius: 55px;
}
/* Cards
-------------------------------------------------------------- */


.card {
    background-color: white;
    -webkit-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.25);
    -moz-transition: box-shadow 0.15s ease-out;
    -webkit-transition: box-shadow 0.15s ease-out;
    -o-transition-property: box-shadow 0.15s ease-out;
    -ms-transition-property: box-shadow 0.15s ease-out;
    transition-property: box-shadow 0.15s ease-out;
    height: 100%;
    display: block;
    text-decoration: none;
}

.card:hover {
    -webkit-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.35);
    -moz-box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.35);
    box-shadow: 0px 0px 15px 3px rgba(0,0,0,0.35);
}

.card .card-content {
    padding: .2rem 2.5rem 2rem;
    text-align: center;
    position: relative;   
}

.card .card-content h2 {
    color: #4b4c4e;
    font-size: 1.4rem;
    line-height: 1.3em;
    font-weight: 900;
    font-style: italic;
    margin: 1rem 0;
}

.card .card-content h5 {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    color: #53565a;
    font-weight: 400;    
    font-style: italic;
}

.card .card-content a {
    margin-bottom: 1rem;
    display: inline-block;
}

.card .card-img {
    height: 225px;
    background-size: cover;
    background-position: 50% 50%;
}

.shielda {
    background-color: white;
    height: 15px;
    width: calc(50% - 16px);
    position: absolute;
    top: -15px;
    left: 0;  
}
.shielda:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 0 15px;
    border-color: transparent transparent transparent #ffffff;
}

.shieldb {
    background-color: white;
    height: 15px;
    width: calc(50% - 16px);
    position: absolute;
    top: -15px;
    right: 0;
}

.shieldb:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 15px 15px;
    border-color: transparent transparent #ffffff transparent;
}

.loading {
  display: flex;
  justify-content: center;
}
.loading div {
    width: 1rem;
    height: 1rem;
    margin: 2rem 0.3rem;
    background: #840b55;
    border-radius: 50%;
    animation: 0.9s bounce infinite alternate;
}

.loading div:nth-of-type(1) {
    background: #840b55;
}
.loading div:nth-of-type(2) {
    background: #53565a;
}
.loading div:nth-of-type(3) {
    background: #cedc00;
}


.loading div:nth-child(2) {
  animation-delay: 0.3s;
}
.loading div:nth-child(3) {
  animation-delay: 0.6s;
}
@keyframes bounce {
  to {
    opacity: 0.3;
    transform: translate3d(0, -1rem, 0);
  }
}

.loading {
    display: flex;
    justify-content: center;
    margin: 20px 0 0 0;
}

.loader {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    justify-content: center;
    align-items: center;
    background: #ffffffe6;
    z-index: 5;
}

.is-loading .loader {
    display: flex;
}

/* Studienübersicht & Anmeldung
-------------------------------------------------------------- */

article.study-post {
    margin: 1rem 0;
}

article.study-post .info-title{
    display: flex;
    justify-content: flex-end;
}

article.study-post .post-content {
    padding: 1.5rem;
}

article.study-post .post-content + .column.is-5 {
    display: none;
}



/* Pagination */

.wp-pagenavi .pages {
    padding: 8px;
    background: #f0f1f1;
    margin: 10px 0 0 0;
    display: inline-block;
    color: #53565a;  
    
}

a.page, .last, .first {
    padding: 10px;
    background: #f0f1f1;
    margin: 2px;
    color: #53565a;
text-decoration: none;    
}

.wp-pagenavi .current {
    padding: 10px;
    background: #840b55;
    margin: 3px;
    color: #fff;
}

.nextpostslink, .previouspostslink {
    display: none;
}



.study-form h3 {
    font-size: 1.2rem;
}

.page-template-anmeldung-studien .display-posts-listing h5, .page-template-anmeldung-studien .display-posts-listing p strong, .study-post h5, .study-post p strong  {
   font-size: 1.2rem;
    margin: 0 0 1em; 
font-weight: 600;    
}

.page-template-anmeldung-studien .display-posts-listing h2 {
    font-size: 2.1rem;
    font-weight: 300;
    line-height: 1.2em;
    margin-bottom: 0.5em;
}


.page-template-anmeldung-studien .display-posts-listing ul + h5, .study-post ul + h5 {
    margin-top: 1rem;
}


/* Accordion Styles
-------------------------------------------------------------- */


.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  margin: .5rem 0;
  transition: 0.4s;
}

.accordion.active, .accordion:hover {
  background-color: #ccc;
}

.accordion:after {
  content: '\002B';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.accordion.active:after {
  content: "\2212";
}

.panel {
  padding: 0 1.2rem;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel > .content {
    margin: 1rem 0;
}

h2 + .accordion {
    margin-top: 1.5rem;
}


/* Newsletter
-------------------------------------------------------------- */

section.newsletter {
    background-image: url(img/pxl-people.jpg);
    background-size: cover;
    padding:8rem 1.5rem;    
}

.newsletter .column {
    background: rgba(255, 255, 255, 0.90);
}



/* Glossar
-------------------------------------------------------------- */

.glossary-menu-atoz li {
    padding: 0 !important;
    margin: 2px !important;
    height: auto !important;
}


.glossary-atoz-wrapper br {
    display: none;
}
.glossary-menu-atoz li.atozmenu-on a {
    background: #840b55;
    color: #fff;
    text-decoration: none !important;
}

.glossary-menu-atoz li a {
    padding: 11px 18px;
    background: #f0f1f1;
    display: block;
}

.glossary-atoz-wrapper > .glossary-atoz-wrapper {
    margin: 1.5rem 0;
}

.glossary-atoz-wrapper ul {
    list-style-type: none;
    border: none;
    padding: 0; 
}

.glossary-atoz-wrapper ul li.glossary-item {
    padding: 1.5rem;
    width: 100%;
    background-color: #fafafa;
    margin: .5rem 0;
}

.atoz-term-title {
    border-bottom: 1px solid #53565a;
    padding-bottom: 0.5em;
    font-size: 1.3em;
display: inline-block;
}

span.glossary-item-desc {
    display: block;
    padding-top: 1rem;
}

.custombox-content>* {
    max-width: 800px !important;
    margin: 20px;
    background: #fff;
    padding: 25px;
}

button#close-custombox {
    -webkit-appearance: none;
    border: none;
    background: none;
    box-shadow: none;
    font-size: 2em;
    float: right;
    line-height: 1em;
    cursor: pointer;
    position: relative;
    top: -5px;
    color: #545454;
}

#modal {
    overflow-y: scroll;
}

#modal h4 {
    border-bottom: 1px solid #e2e2e2;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

#modal ol {
    padding-left: 15px;
}

#modal ol > li {
    padding-bottom: 15px;
}

#modal ul {
    list-style: inside;
}

#modal span.red {
    color: #ca4242;
}

@media only screen and (min-width: 769px) {
    
    section.is-tieless .columns {
        display: flex;
    }
    
    section.is-tieless .column.is-6 {
        width: 50%;
    }

    .column.footer-menu-ties {
        min-height: 415px;
        display: flex;
        align-items: center;
        background-color: #eeedef;
    }
    
    .column.footer-menu-ties:nth-of-type(odd) {
        justify-content: flex-end;
    }

    .footer-menu-ties ul.menu {
        margin: 0 4rem;
    }

    section.is-tieless:nth-of-type(odd) > .columns {
        flex-direction: row;
    }
    
    .searchandfilter ul {
        justify-content: space-between;
    }
    
    .searchandfilter ul > li{
        width: 100%;
        max-width: 49%;
    }    

    
    .container-footer-menu-impressum {
    display: flex;
    align-items: center;    
    }

    ul.footer-menu-impressum {
        display: flex;
    }

    ul.footer-menu-impressum li {
        padding-left: .5rem;
    }
    ul.footer-menu-impressum li:before {
        content: "\2022";
        margin: 10px;
        font-size: .8rem;
    }  
    
}
        
@media only screen and (min-width: 1024px) {


.card .card-content {
    padding: .2rem 3.5rem 2rem;
}    
    
article.study-post .post-content + .column.is-5 {
    display: block;
}

    
    
.page-template-anmeldung-studien .display-posts-listing h2 {
    font-size: 2.7rem;
}    
    

.study-form {
    padding: 1.5rem 2.5rem;
    background: #fff;
}
    
/* MENU */

header section.section .container .column {
       padding: 0 .75rem;
}    
    
.menu-btn {
    display: none;
}

nav.main-menu {
    width: 100%;
}
    
.menu-main-container, .search-form-container {
    position: static;
    display: flex!important;
    background: #fff;
    padding: 0;
    justify-content: flex-end;
}
    
.menu-main-footer, ul.menu-main > li.menu-item-has-children > a:after {
    display: none;
}
    
.menu-main-container ul {
    display: flex;
    align-items: center;    
    padding: 0
}    
    

nav.main-menu ul.menu-main a {
    color: #840b55;
    padding: 0 40px 0 0!important;
    border-bottom: none;
    width: 100%;
    white-space: nowrap;    
}
    nav.main-menu ul.menu-main > li {
        position: relative;
        padding: 35px 0;
    }
    nav.main-menu ul.menu-main > li:last-child {
        padding: 0;
    }
    
    nav.main-menu ul.menu-main > li:last-child a {
       
    padding: 15px 20px !important;
    background-color: #840b55;
    color: #fff;
    border-radius: 50px;  
    border: 1px solid #840b55;    
    }      
    
    nav.main-menu ul.menu-main > li:last-child a:hover {
    background: transparent;
    text-decoration: none;
    color: #840b55;
    border: 1px solid #840b55;
    }  


ul.menu-main ul.sub-menu {
    display: none;
    position: absolute;
    background: #53565a;
    z-index: 2;
    padding: 0;
    margin: 0;
    left: 0;
    top: 83px;    
}
    
    ul.menu-main > li:hover > ul.sub-menu {
        display: block;
    } 
    
    ul.menu-main > li > ul.sub-menu > li > a {
    padding: 10px !important;
    color: #fff;
    border: 0;
            font-weight: 400;
    min-width: 200px;
}
    
ul.menu-main ul.sub-menu > li:hover a{
    background: #fff;
    color: #840b55;
}
    
    
.glossary-atoz-wrapper ul li.glossary-item {
    margin: 1rem 0;
}    
    
.glossary-atoz-wrapper ul li.glossary-item {
    width: 32%;
    margin-right: 2%;
}
    
.glossary-atoz-wrapper ul li.glossary-item:nth-of-type(3n) {
    margin-right: 0;
}
ul.glossary-atoz.atozitems-on {
display: flex;
flex-wrap: wrap;
}
    
fieldset.is-50 {
width: 49%;
}   
    
fieldset.is-25 {
width: 24%;
}    
    
fieldset.is-75 {
width: 74%;
}   
    
.inner-fieldset.is-25 {
max-width: 24%;
}      
    
    .section, .section.is-medium, .section.is-large {
    padding: 4rem 1.5rem;
}
   
    
section.hero .column.is-8:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 40vw;
    display: block;
    top: 0;
    left: 69%;
    background-size: cover;
    background-position: 50% 50%;    
       
}
    
section.hero.slideshow div.slider{
    position: absolute;
    height: 100%;
    width: 40vw;
    display: block;
    top: 0;
    left: 69%;  
}    

section.hero.slideshow div.slider > div.slide {
    background-size: cover;
    background-position: 50% 50%;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;    
    display: none;    
}    
      

section.hero .column.is-8{
    padding: 0.75rem 4.5rem 0.75rem 0.75rem;
}    
        
    
.hero > .container{
    padding: 3rem 0;
       /* min-height: 320px;*/
}    
    
    
    
main .column {
    padding: 1.5rem;
}    
    
ul.menu-impressum, ul.social {
    justify-content: flex-start;
} 
    
}


@media only screen and (min-width: 2600px) {
    
 section.hero .column.is-8:after{
    width: 100%;
    background-position: top; 
}   
    
}


@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

 section.hero .column.is-8:after{
   width: 70% !important;
}
    

}

@keyframes opacitim {
    0%   {opacity: 0;}
    10%    {opacity: 1;}
    100% {opacity: 1;}
}
    
