/* BASIC STYLESHEET for www.klopp-verlag.de */
/* author: ideenwerft GmbH */
/* copyright 2016 */

/* 
*	TO USE WITH BOOTSTRAP
*
*	MOBILE FIRST !!!
*
*   Farbe:
*   blau: #0075b0
*   grün: #009a82
*   rot: #de4d41
*/

/* open-sans-regular - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../Fonts/open-sans-v18-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../Fonts/open-sans-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../Fonts/open-sans-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../Fonts/open-sans-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../Fonts/open-sans-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../Fonts/open-sans-v18-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-v18-latin-600.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../Fonts/open-sans-v18-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../Fonts/open-sans-v18-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('../Fonts/open-sans-v18-latin-600.woff') format('woff'), /* Modern Browsers */
         url('../Fonts/open-sans-v18-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../Fonts/open-sans-v18-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-v18-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../Fonts/open-sans-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../Fonts/open-sans-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('../Fonts/open-sans-v18-latin-700.woff') format('woff'), /* Modern Browsers */
         url('../Fonts/open-sans-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../Fonts/open-sans-v18-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
  }

/* =LAYOUT ======================== */
body {font-size: 14px;color: #757b82;line-height: 25px;font-family: 'Open Sans', sans-serif;position: relative;}
.pagebg-container {background:url("../Img/background-480.jpg");background-position: top center;background-repeat: no-repeat;background-size: 100%;height: 100%;position: fixed;width: 100%;overflow: overlay;overflow-y: scroll;}

header {text-align: center;}
#logo {display: block;margin: 15px auto;}


main {padding:30px 0;background: #fff;overflow: hidden;position: relative;z-index: 20;}
content {padding-bottom: 30px;}
aside {margin-top: 60px;}
aside>div {padding: 15px 0;}
aside>div:last-child {padding-bottom: 0;}
footer {background: rgba(0, 0, 0, 0.3);overflow: hidden;padding: 0 15px;}

@media (min-width: 480px) {
    .pagebg-container {background:url("../Img/background-768.jpg");background-position: top center;background-repeat: no-repeat;background-size: cover;}
}
@media (min-width: 768px) {
    .pagebg-container {background:url("../Img/background.jpg");background-position: top center;background-repeat: no-repeat;background-size: cover;}
    .main {box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);}
    header {position: relative;}
    aside {margin-top: 0;}
    aside>div:first-child {padding-top: 0;}
}
@media (min-width: 992px) {
    header {padding-bottom: 0;}
    #logo {display: inline-block;margin-top: 30px;}
    main {padding: 60px 15px;}
    aside {padding-left: 30px;}
}





/* =GRADIENTS ======================== */

/* =transition ======================== */
ul.nav-tabs li,
.tx-powermail fieldset .powermail_submit.btn.btn-primary,
.navbar-default .navbar-toggle.collapsed,
.navbar-default .navbar-toggle,
.navbar-default .navbar-nav>li>a {
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;}

/* =BASIC STYLES ======================== */
.small {font-size: 0.9em;}
.xsmall {font-size: 0.8em;}
.red, .error {color:#c00;}
.grey {color:#999;}
.clear {clear:both;}
.italic {font-style:italic;}
.hide {display:none;}
.align-center {text-align:center;}
.align-right {text-align:right;}
.align-justify {text-align:justify;}
.align-left {text-align:left;}
.note {font-size:0.9em;font-style:italic;color:#999;}

/* links */

a:active, a:focus {outline:none;text-decoration: none;}

a {color:#0075b0;font-weight: 700;}
a:hover,
a:focus {color:#de4d41;text-decoration: none;}

/* TYPO3 : anker-tags für interne links nach oben setzen*/
a.anchor {position:absolute;margin-top:-35px;}
a>i {padding-right: 3px;}
a.tel {color:#757b82 !important;font-weight: 400;}


/* text */


h1 {margin:0px 0px 15px;font-size:25px;color: #0075b0;font-weight: 600;}
h2 {margin:15px 0px 15px;font-size:25px;color: #0075b0;}
h3 {margin:15px 0px 15px;font-size:18px;color: #0075b0;}
h4 {margin:0px 0px 15px;font-size:18px;color: #757b82;}
h5 {text-align: left;font-size: 16px;}


blockquote {padding:15px 40px;}
blockquote p {color:#0061a1;font-size:14px;font-style:italic;}
blockquote cite {color:#888;font-size:12px;font-style:italic;}
table {font-size: 1em;border-collapse:collapse;border-spacing:0;}
table th, table td {vertical-align:top;}
/* achtung: tabellen brauchen weiterhin 'cellspacing="0"' im markup! */

table p {padding:0;margin:0;}
hr, hr.linie-davor,  hr.linie-danach {clear:both;background-color:#adadad;color:#adadad;border:#adadad;height:1px;margin:10px 0;}
address, caption, cite, code, dfn, var {font-style:normal;font-weight:normal;}
caption, th {text-align:left;}
fieldset {border:none;}
input, textarea, select {border:0px solid #ccc;font-size:1em;padding:4px;}
input:focus, textarea:focus {background-color:rgba(255, 255, 255, 0.5);color: #798a7a;}
a i {cursor: pointer;}

.ce-gallery,
.ce-column,
img {max-width: 100%;height: auto;}

#cookie-consent {
  top: 0;
  bottom: auto !important;
}


/* =NAVIGATION ======================== */
.navbar {min-height: 1px;margin-bottom: 0;border: 0;}
.navbar-default {background: none;border:0;text-align: center;}

.navbar-header {background:none;border-bottom: 1px solid #fff;position: relative;z-index: 10;margin-bottom: -1px;box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);}

.navbar-default .navbar-toggle.collapsed {border: 0;padding: 15px;margin: 0;float: none;background: #fff;width: 100%;border-radius: 0;}
.navbar-default .navbar-toggle {border: 0;padding: 15px;margin: 0;float: none;background:rgba(255, 255, 255, 0.75);width: 100%;border-radius: 0;}
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {background: rgba(255, 255, 255, 0.8);}
.navbar-toggle .icon-bar {height: 3px;}
.navbar-default .navbar-toggle .icon-bar:nth-child(2) {background: #de4d41;}
.navbar-default .navbar-toggle .icon-bar:nth-child(3) {background: #009a82;}
.navbar-default .navbar-toggle .icon-bar:nth-child(4) {background: #0075b0;}



.navbar-default .navbar-collapse,
.navbar-default .navbar-form {border: none;padding:0;margin: 0 -5px;}
.navbar-nav {margin:5px 0;float:none;}

.navbar-nav li {width: 50%;padding: 5px;float: left;display: table;}

.navbar-default .navbar-nav>li>a {width: 100%;height: 60px;padding: 5px;display: table-cell;vertical-align: middle;}
.navbar-default .navbar-nav>li>a {color: #fff;box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.3);font-size: 14px;}
.navbar-default .verlag li a {background:rgba(0, 117, 176,0.7);}
.navbar-default .druckerei li a {background: rgba(0, 154, 130,0.7);}

.navbar-default .navbar-nav>li>a:hover {color: #fff;}
.navbar-default .verlag li a:hover,
.navbar-default .verlag li a:focus {background:rgba(0, 117, 176,0.9);color: #fff;}
.navbar-default .druckerei li a:hover,
.navbar-default .druckerei li a:focus {background: rgba(0, 154, 130,0.9);color: #fff;}
.navbar-default .verlag>.active>a,
.navbar-default .verlag>.active>a:focus,
.navbar-default .verlag>.active>a:hover {background: rgba(0, 117, 176, 0.5);color: #fff;font-weight: 600;padding:3px;border: 2px solid #0075b0;text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.6);}
.navbar-default .druckerei>.active>a,
.navbar-default .druckerei>.active>a:focus,
.navbar-default .druckerei>.active>a:hover {background: rgba(0, 154, 130,0.3);color: #fff;font-weight: 600;padding:3px;border: 2px solid #009a82;text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.6);}


@media (min-width: 768px) {
    .navbar-default {background: none;border:0;text-align: center;}
    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {border: none;padding:0;margin: 0 -15px;}

    .navbar-nav {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
    }
    .navbar-nav::before,
    .navbar-nav::after {
        display: none;
    }
    .navbar-nav li {width: 100%;padding: 15px;}

    .navbar-default .navbar-nav>li>a {font-size: 16px;}    

}

@media (min-width: 992px) {
    .navbar-default .navbar-nav>li>a {width: 100%;height: 100px;}
}



/* =CONTENT ELEMENTS ======================== */
.ce-bodytext {margin-bottom: 30px;}
.ce-bodytext:last-child {margin-bottom: 0px;}

#content .row .col-md-6 h2 {background: rgba(0, 0, 0, 0.1);padding: 5px 15px;font-size: 20px;}
#content .row .col-md-6 h3 {background: rgba(0, 0, 0, 0.1);padding: 5px 15px;font-size: 15px;margin-bottom: 0;}

@media(min-width:768px) {
#content {padding-right: 30px;}
}
@media(min-width:992px) {
#content {padding-right: 60px;}
}

/* Tab-Box T3ddy */

.tabbox {padding:0;border:none;font-size:inherit;font-family:inherit;color:inherit;}
#content  ul.nav-tabs {margin:0;padding:0;background:none;border:none;}

ul.nav-tabs li {margin:0 0 0;background:none;border:none;width: 100%;}
#content ul.nav-tabs li.active {border:none;}

#content ul.nav-tabs li a {color:#fff;background:#0075b0;border:none;border-radius:0;margin: 0;width: 100%;font-size: 13px;padding: 8px 8px;}
#content ul.nav-tabs li a:hover,
#content ul.nav-tabs li a:focus {background:rgba(0, 117, 176, 0.75);}
#content ul.nav-tabs li.active a {font-size:13px;font-weight: 700;margin: 2px 0;}
#content ul.nav-tabs li.active a:hover,
#content ul.nav-tabs li.active a:focus {color:#fff !important;background:rgba(0, 117, 176, 0.75);border-bottom-color:rgba(0, 117, 176, 0.75);}

.tabbox .tab-content {margin:0 -15px;padding:15px;overflow:hidden;}
.tab-content .row {margin:0;padding-left: 0;padding-right: 0;}
.tab-pane > div:first-child > h2 {margin-top:10px;}
.dce-tab .tab-content {
    padding: 2.5rem 3.5rem;
}

@media(min-width:480px) {
    ul.nav-tabs li {width: auto;}
    #content ul.nav-tabs li {padding:2px;}
    #content ul.nav-tabs li.active a {margin:-5px 0 0px;border-bottom: 5px solid #0075b0;}
}
@media(min-width:768px) {
	.tabbox .tab-content {margin:0 -15px;padding:15px;}
	
	
}
@media(min-width:992px) {
	.tab-content {margin:0 -30px;padding:30px;}
}



/*++++ statistik ++++*/
#content table {width: 100%;margin-bottom:30px;}
#content table tr {margin-bottom: 10px;}
#content table tr td {padding: 5px;}
#content table tr td:first-child {font-size: 18px;white-space: nowrap;width: 30%;}

@media(min-width:480px) {
    #content table tr td:first-child {width:20%;}
}

@media(min-width:992px) {
    #content table tr td:first-child {width:10%;}
}




/*++++ kontakt-button ++++*/
.kontakt-button {color: #fff;padding: 8px 15px;background:#009a82;text-align: center;}
.kontakt-button:hover,
.kontakt-button:focus {background: rgb(0, 117, 176);color: #fff;}


/* =OTHER ======================== */
/* +++ top-icon-navi Facebook & lang +++ */


/* +++ Iframewrap +++ */
.iframewrap {
    max-width: 85%;
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
    
}
.iframewrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
}

@media (min-width: 768px) {
    .iframewrap {max-width: 100%;margin: 0 auto;padding-bottom: 38%;}
}
@media (min-width: 992px) {
    .iframewrap {max-width: 85%;margin: 0 auto;padding-bottom: 38%;}
}
  
/* =FOOTER ======================== */

/* copy musthave */
footer {font-size: 12px;}
.musthave {display: block;margin: 0;padding:15px 0;overflow: hidden;text-shadow:2px 2px 1px rgba(0, 0, 0, 0.8);}
.musthave li {list-style: none;float: left;text-align: center; border-right: 2px solid rgba(255, 255, 255, 0.6);line-height: 16px;}
.musthave li a {color:rgba(255, 255, 255, 0.85);padding: 0px 15px;}
.musthave li:first-child a {padding: 0px 15px 0 0;}
.musthave li a:hover {color:rgba(255, 255, 255, 1);}
.musthave li:last-child {border:0;}
.musthave li:last-child a {padding-right: 0;}

.copy {text-shadow:2px 2px 1px rgba(0, 0, 0, 0.8);color: rgba(255, 255, 255, 0.85);line-height: 16px;}
.copy a {color: rgba(255, 255, 255, 0.85);}
.copy a:hover {color: rgba(255, 255, 255, 1);}

 @media (min-width: 700px) {
    footer {padding-bottom: 15px;}
    .musthave {float: left;padding:10px 0 10px;}
    .copy {float: right;padding:10px 0 10px;}
}    
 @media (min-width: 992px) {
     footer {font-size: 14px;}
    .musthavecopy {font-size: 13px;padding: 15px 0;}
    .musthave li a {padding: 0px 10px;}
    .musthave li:first-child a {padding: 0px 10px 0 0;}
}   

 @media (min-width: 1200px) {
    .musthavecopy {font-size: 14px;}
    .musthave li a {padding: 0px 15px;}
    .musthave li:first-child a {padding: 0px 15px 0 0;}
}

/* =EXTENSIONS ======================== */

/* POWERMAIL */
.tx-powermail {margin-top: 20px;line-height: 17px;}
.tx-powermail .container-fluid {padding-left: 0;padding-right: 0;}
.tx-powermail .powermail_form h3 {display: none;}

.tx-powermail .form-group {margin-bottom: 20px;}

div.tx-powermail legend {display: block;font-size: 18px;font-weight: 500;padding-bottom: 15px;margin-bottom: 30px; border-bottom:1px solid rgba(0, 0, 0, 0.2);}
div.tx-powermail .powermail_file  {border:0;}
div.tx-powermail fieldset + fieldset {margin: 20px 0;padding: 20px 0;}

.tx-powermail .form-control {border-radius: 2px;max-width: 700px;background: rgba(0, 0, 0, 0.1);}
.tx-powermail .form-control:focus {-webkit-box-shadow:none;box-shadow:none;}

div.tx-powermail fieldset .mandatory {color: #c00;padding-left: 3px;}

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox],
.radio input[type=radio], 
.radio-inline input[type=radio] {margin-top: 7px;}

.tx-powermail fieldset .powermail_submit.btn.btn-primary {border:0;border-radius: 3px;padding: 5px 15px;font-size: 14px;line-height: normal;margin-top: 15px;background: #009a82;}
.tx-powermail fieldset .powermail_submit.btn.btn-primary:hover {background:#108875;}





.tx-powermail p.note {margin-bottom: 5px;}

div.formError + input,
div.formError + textarea,
.tx-powermail .powermail_fieldset .powermail_field_error,
.tx-powermail .powermail_fieldset .parsley-error,
.tx-powermail .powermail_fieldset .powermail_form .parsley-error:focus,
.tx-powermail .powermail_fieldset div.error {border:1px solid #c00;background: none;}

.tx-powermail .powermail_fieldset .parsley-errors-list {border: 0;background: none;margin: 5px 0;}
.tx-powermail .powermail_fieldset .parsley-errors-list>li {background: none;font-size: 14px;padding: 0;}

@media (min-width: 768px) {
    .tx-powermail .form-horizontal .control-label {text-align: left;}
    .tx-powermail .col-sm-offset-2 {margin-left: 30%;}
    .tx-powermail .col-sm-2 {width: 30% !important;}
    .tx-powermail .col-sm-10 {width: 70%;}
}
@media (min-width: 992px) {
    .tx-powermail .col-sm-offset-2 {margin-left:25%;}
    .tx-powermail .col-sm-2 {width: 25% !important;}
    .tx-powermail .col-sm-10 {width: 75%;}
}


/* =JQUERY PLUGINS ======================== */