/*
Theme Name: Kessler2
Theme URI: https://codednetsolutions.de
Author: skurrilewelt new media
Author URI: http://skurrilewelt.de
Description: Kessler Redesign 2015 / 2023 - php8 ready
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: 
Text Domain: kessler

*/


/* Überschriften */
@font-face {
    font-family: 'asap';
    src: url('./fonts/Asap-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asap-bold';
    src: url('./fonts/Asap-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asap-italic';
    src: url('./fonts/Asap-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'asap-bold-italic';
    src: url('./fonts/Asap-BoldItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    color: #000;
    font-family: asap;
    font-size: 14px;
    line-height: 22px;
}

h1, h2, h3, h4, h5, h6 {
    text-transform: uppercase;

}


/*  CUSTOM STYLES MOBILE */

a, a:visited, a:hover {
    outline: none;
    text-decoration: none;
}

.next-button {
    color: #b0cb52;
}

.right {
    text-align: right;
}

img {
    width: auto;
    max-width: 100%
}

/* =====================================================================*/
/*  Navbar  */
/* =====================================================================*/

.navbar-default .navbar-nav > li > a {
    color: #b0cb52;
}

.navbar li a {
    color: #b0cb52;
    text-transform: uppercase;
}

.navbar li.active > a, li.current-menu-item > a, .navbar-default .navbar-nav > li.current-menu-item > a {
    color: #003871;
}

.navbar-brand {
    padding: 2px 0px 0px 18px;
}

.navbar-default {
    background-color: #fff;
    border: none;
}

.navbar-static-top {
    border-width: 0px;
}

.navbar-nav {
    background: #efefef
}

ul.sub-menu {
    list-style: none;
}

ul.sub-menu li {
    font: normal 13px/20px asap;
    text-align: left;
    display: block;
}

.main-menu-lg li ul {
    display: none;
    visibility: hidden
}

.main-menu-lg li.current_page_item > ul, .main-menu-lg li.current-menu-item > ul {
    display: block;
    opacity: 1;
    visibility: visible
}

/* =====================================================================*/
/*  CONTENT  */
/* =====================================================================*/

.project-thumb {
    position: relative;
    margin-bottom: 35px;
}

.project-desc {
    position: relative;
    margin-top: 20px;
}

.content-row {
    margin-bottom: 50px;
}

.overlay {
    position: absolute;
    background: rgba(176, 203, 82, 0.7);
    width: 100%;
    height: auto;
    padding: 10px 10px 30px 10px;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    font-size: 12px;
    text-transform: uppercase;
    pointer-events: none;
}

.overlay-holder {
    position: absolute;
    overflow: hidden;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.top-padding-70 {
    padding-top: 0;
}

.bottom-padding-30 {
    padding-top: 0;
}

/* Column clear fix */
.col-lg-1:nth-child(12n+1),
.col-lg-2:nth-child(6n+1),
.col-lg-3:nth-child(4n+1),
.col-lg-4:nth-child(3n+1),
.col-lg-6:nth-child(2n+1),
.col-md-1:nth-child(12n+1),
.col-md-2:nth-child(6n+1),
.col-md-3:nth-child(4n+1),
.col-md-4:nth-child(3n+1),
.col-md-6:nth-child(2n+1) {
    clear: none;
}

.col-sm-1:nth-child(12n+1),
.col-sm-2:nth-child(6n+1),
.col-sm-3:nth-child(4n+1),
.col-sm-4:nth-child(3n+1),
.col-sm-6:nth-child(2n+1) {
    clear: left;
}

/* =====================================================================*/
/*  SMALL TAB  */
/* =====================================================================*/

@media (min-width: 768px) {

    .main-menu-lg > li {
        display: inline;
        list-style: none;
        font: normal 14px/60px asap;
        padding: 0px 10px 0 10px;
        border-right: 2px solid #003871;
    }

    .main-menu-lg > li:last-child {
        padding-right: 0px;
        border: none;
    }

    .winkel {
        position: absolute;
        left: 7px;
        top: -9px;
        background: url(./css/images/winkel-sm.png);
        width: 15px;
        height: 15px;
    }

    .winkel-desc {
        position: absolute;
        left: 0px;
        top: 10px;
        background: url(./css/images/winkel-bg-lg.png);
        width: 30px;
        height: 30px;
    }

    .project-desc {
        margin-top: 30px;
    }

    .overlay {
        font-size: 15px;
    }

    .top-padding-70 {
        padding-top: 70px;
    }

    .bottom-padding-30 {
        padding-top: 30px;
    }

    .navbar-nav {
        background: #fff
    }

    .logo-md {
        padding-left: 7px;
    }


}


/* ==================================================================================*/
/* =======   MD     =================================================================*/
/* ==================================================================================*/

@media (min-width: 993px) {
    body {
        font-size: 16px;
    }

    .navbar-default {
        background: #fff;
        border: none;
    }

    .main-menu-lg > li {
        display: inline;
        list-style: none;
        font: normal 16px/100px asap;
        padding: 0px 20px 0 20px;
        border-right: 2px solid #003871;
    }

    .main-menu-lg > li:last-child {
        padding-right: 0px;
        border: none;
    }

    .winkel {
        left: 5px;
        top: -11px;
        background: url(./css/images/winkel.png);
        width: 20px;
        height: 20px;
    }

    .winkel-desc {
        left: -7px;
        top: 0px;
        background: url(./css/images/winkel-bg-lg.png);
        width: 30px;
        height: 30px;
    }

    .overlay {
        font: normal 19px/28px asap;
        bottom: -200px;
    }

    .top-padding-70 {
        padding-top: 70px;
    }

    .bottom-padding-30 {
        padding-top: 30px;
    }

    .logo-md {
        margin-top: 22px;
        padding-left: 7px;
    }

    ul.sub-menu {
        list-style: none;
        position: absolute;
        top: 65px;
        left: 138px;
    }

    ul.sub-menu li {
        font: normal 14px/20px asap;
        text-align: left;
        display: block;
    }

    .main-container {
        margin-top: 60px;
    }

    .content {
        padding-left: 30px;
    }

    /* Column clear fix */
    .col-lg-1:nth-child(12n+1),
    .col-lg-2:nth-child(6n+1),
    .col-lg-3:nth-child(4n+1),
    .col-lg-4:nth-child(3n+1),
    .col-lg-6:nth-child(2n+1),
    .col-sm-1:nth-child(12n+1),
    .col-sm-2:nth-child(6n+1),
    .col-sm-3:nth-child(4n+1),
    .col-sm-4:nth-child(3n+1),
    .col-sm-6:nth-child(2n+1) {
        clear: none;
    }

    .col-md-1:nth-child(12n+1),
    .col-md-2:nth-child(6n+1),
    .col-md-3:nth-child(4n+1),
    .col-md-4:nth-child(3n+1),
    .col-md-6:nth-child(2n+1) {
        clear: left;
    }
}

@media (min-width: 1120px) {
    .main-menu-lg > li {
        font: normal 24px/100px asap;
    }

    ul.sub-menu {
        top: 75px;
        left: 109px;
    }

    ul.sub-menu li {
        font: normal 16px/20px asap;
    }
}

/* ==================================================================================*/
/* =======   DESKTOP     ============================================================*/
/* ==================================================================================*/

@media (min-width: 1430px) {
    /* Column clear fix */
    .col-md-1:nth-child(12n+1),
    .col-md-2:nth-child(6n+1),
    .col-md-3:nth-child(4n+1),
    .col-md-4:nth-child(3n+1),
    .col-md-6:nth-child(2n+1),
    .col-sm-1:nth-child(12n+1),
    .col-sm-2:nth-child(6n+1),
    .col-sm-3:nth-child(4n+1),
    .col-sm-4:nth-child(3n+1),
    .col-sm-6:nth-child(2n+1) {
        clear: none;
    }

    .col-lg-1:nth-child(12n+1),
    .col-lg-2:nth-child(6n+1),
    .col-lg-3:nth-child(4n+1),
    .col-lg-4:nth-child(3n+1),
    .col-lg-6:nth-child(2n+1) {
        clear: left;
    }

}

/**  // ende dt  */

/* =====================================================================*/
/*  Bootstrap Carousel													*/
/* =====================================================================*/
/*
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

.carousel-caption {
	left:0;
	width:100%;
	padding-right:20px;
}
*/
/*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
/*
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}*/