@font-face {
    font-family: 'Wingdings3';
    src: url('../../fonts/Wingdings3.eot');
    src: url('../../fonts/Wingdings3.eot?#iefix') format('embedded-opentype'),
        url('../../fonts/Wingdings3.woff') format('woff'),
        url('../../fonts/Wingdings_3.ttf') format('truetype'),
        url('../../fonts/Wingdings3.svg#Wingdings3') format('svg');
    font-style: normal;
}

@font-face {
font-family:"century-gothic";
src:url("https://use.typekit.net/af/471ad1/00000000000000003b9b1f20/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/471ad1/00000000000000003b9b1f20/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/471ad1/00000000000000003b9b1f20/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-style:normal;font-weight:700;
}

@font-face {
font-family:"century-gothic";
src:url("https://use.typekit.net/af/afc5c6/00000000000000003b9b1f23/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/afc5c6/00000000000000003b9b1f23/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/afc5c6/00000000000000003b9b1f23/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-style:normal;font-weight:400;
}

@import url("https://p.typekit.net/p.css?s=1&k=nyl2agu&ht=tk&f=39200.39203&a=9842108&app=typekit&e=css");

@font-face {
    font-family: 'avenir-med';
    src: url('../../fonts/Avenir-Medium.eot');
    src: url('../../fonts/Avenir-Medium.eot?#iefix') format('embedded-opentype'),
    url('../../fonts/Avenir-Medium.woff') format('woff'),
    url('../../fonts/Avenir-Medium.ttf') format('truetype'),
    url('../../fonts/Avenir-Medium.svg#avenir-med') format('svg');
    font-style: normal;
}

@font-face {
    font-family: 'avenir-bold';
    src: url('../../fonts/Avenir-Heavy.eot');
    src: url('../../fonts/Avenir-Heavy.eot?#iefix') format('embedded-opentype'),
    url('../../fonts/Avenir-Heavy.woff') format('woff'),
    url('../../fonts/Avenir-Heavy.ttf') format('truetype'),
    url('../../fonts/Avenir-Heavy.svg#avenir-bold') format('svg');
    font-style: normal;
}

@font-face {
    font-family: 'avenir-reg';
    src: url('../../fonts/Avenir-Roman.eot');
    src: url('../../fonts/Avenir-Roman.eot?#iefix') format('embedded-opentype'),
    url('../../fonts/Avenir-Roman.woff') format('woff'),
    url('../../fonts/Avenir-Roman.ttf') format('truetype'),
    url('../../fonts/Avenir-Roman.svg#avenir-reg') format('svg');
    font-style: normal;
}



/*------------------------------------------------------------------------
General
------------------------------------------------------------------------*/

#coatmasterflex *,
*::before,
*::after {
    box-sizing: border-box;
}

#coatmasterflexpage a {
  color: #000;
}

#coatmasterflexpage .pfeil {
    font-family: "Wingdings3", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
}

#coatmasterflex {
    background-color: #ffd100;
    position: relative;
    min-height: 100vh;
}


.white_area {
    height: 100%;
  background:#fff;
}

#coatmasterflex .liste ul {
      font-family: 'avenir-reg';
    line-height: 32px;
    color: #000000;
    margin-left: 27px;
  font-size: 24px

}

#coatmasterflex .liste {
    position: relative;
    margin-top: 100px;

}

/* Scroll down */
.scrolldownflex {
    position: absolute;
    bottom: 50px;
    height: 40px;
    width: 40px;
    left: 50%;
    transform: translate(-50%, 0);
    cursor: pointer;
    z-index: 2;
}
}

/*------------------------------------------------------------------------
Headings / Fonts
------------------------------------------------------------------------*/

/* Font-Smoothing */
*,
p,
h1,
h2,
h3,
h5,
h6 {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
}

/* General Font Styling */
#coatmasterflexpage  {
   font-family: century-gothic, sans-serif;
   font-weight: 400;
   font-style: normal;
}

/* Heading 1 */
#coatmasterflexpage h1, .productspage h1 {
    font-weight: 700;
    font-style: normal;
    color: #000000;
    font-size: 68px;
    line-height: 68px;
    display: block;
}

/* Heading 1 - White */
#coatmasterflexpage h1 .white, .productspage  h1 .white {

    display: block;
}

/* Heading 2 */
#coatmasterflexpage h2, .productspage h2 {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    color: #000000;
    display: block;
    margin-top: 0;
    margin-bottom: 50px;
  
}

#coatmasterflexpage .startpage h2 , .productspage h2 {
    font-weight: normal;
  font-family: 'avenir-reg';
  }



/* Flex Bold */
h4 .second {
    font-weight: 700;
}

h4 .second,
h4 .first,
#c735 span {
    font-size: 16px;
}

#c735 span,
#c781 span,
#coatflexdetailinfos .col-sm-6 span.first, #coatflexdetailinfos .col-sm-6 span.second{
  padding: 0;
  color:#000;
}

#c735 .first,
#c781 .first, #coatflexdetailinfos .col-sm-6 .first{
  margin-right: 5px;
   font-family: 'avenir-reg';
}

/*------------------------------------------------------------------------
Container / Columns
------------------------------------------------------------------------*/

#coatmasterflexpage .container {
    max-width: 1180px;
    padding: 150px 0 100px 0;
}

#coatflexdetailinfos .container {

    padding: 50px 0 100px 0;
}

#coatflexdetailinfos .col-sm-6 .frame-type-dce_dceuid19 .container {
  padding: 0;
  padding-bottom:0;
}

#coatflexdetailinfos .col-sm-6 .frame-type-dce_dceuid19 .container .videobutton {
  float:left;
  margin-bottom:0;
  margin-top:20px;
  max-width:555px;
}

#coatflexdetailinfos .praxis {
  padding-top:0;
}

#coatflexdetailinfos .praxis .container h2 {
  display:none;
}

#coatflexdetailinfos .praxis .mediaelement-video video {
  width:100%;
}

#coatmasterflex .container h2 {
    max-width: 500px;
}

#coatmasterflexpage .startpage .container {
    padding-top: 218px;
}

#coatmasterflexpage .white_area .container , .productspage .white_area .container{
    padding: 65px 0;
}

#coatmasterflexpage .col-sm-6:first-child, #coatflexdetailinfos .col-sm-6:first-child {
    padding-left: 15px;
    padding-right: 30px;
}

#coatmasterflexpage .col-sm-6:last-child, #coatflexdetailinfos  .col-sm-6:last-child{
    padding-left: 30px;
    padding-right: 15px;
}

/*------------------------------------------------------------------------
Header / Menu
------------------------------------------------------------------------*/

/*------------------- Header -------------------*/

#coatmasterflexpage #header {
    top: 54px;
    position: initial;
}

#coatmasterflexpage #header div {
    top: inherit;
}

#coatmasterflexpage #header div a {
    height: 54px;
    vertical-align: middle;
    display: table-cell;
}

#coatmasterflexpage #header > .contact {
    left: 65px;
    background: #000;
    color: #fff;
    width: auto;
    display: table;
    position: absolute;
}

/*#coatmasterflexpage #header > .contact:hover {
    border-left: 1px transparent solid;
    border-top: 1px transparent solid;
    border-bottom: 1px transparent solid;
}*/

#coatmasterflexpage #header > .contact:hover a {
    background: transparent;
    color: #ffd100;

}


#coatmasterflexpage header a:hover:before,
#coatmasterflexpage header li:hover a:before,
#coatmasterflexpage header li.active a:before,
#coatmasterflexpage header .lang:hover span:before {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    transition: all 130ms cubic-bezier(.165, .84, .44, 1);
    visibility: hidden;
}

#coatmasterflexpage #header > .contact a {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    padding: 15px 25px;
}

#coatmasterflexpage .coatmasterlink a,
#coatmasterflexpage #header > .lang a,
#coatmasterflexpage #header > .lang span {
    font-size: 16px;
    padding-left: 20px;
    padding-right: 20px;

}


#coatmasterflexpage .lang .current,
#coatmasterflexpage .lang .active {
    display: none;
}


#coatmasterflexpage .coatmasterlink a {
    background-color: #000;
    background: #000 url(../../images/Icon_world_white.svg) no-repeat center;
    background-size: 30px;
    width: 52px;
}

#coatmasterflexpage .coatmasterlink a:hover {
    background: #000 url(../../images/Icon_world_yellow.svg) no-repeat center;
    background-size: 30px;
}

#coatmasterflexpage .coatmasterlink {
    width: 52px;
    right: 0;
    top: 377px!important;
    position: fixed;
    display: block !important;
    z-index: 14;
    border-top: 2px solid white;

}

#coatmasterflexpage #header > .lang {
    right: 0;
    left: initial;
    top: 218px;
    background: none;
    height: auto;
    width: 52px;
    border: none;
}

#coatmasterflexpage #header > .lang a {
    padding-left: 0;
    padding-right: 0;
    padding-top: 15px;
    display: block;
    text-transform: uppercase;
    font-family: 'avenir-reg';
    font-weight: normal;
}


#coatmasterflexpage #header .lang:hover {
    height: auto;

}

#coatmasterflexpage header .lang:hover a {
    color: #cbab39;
}


#coatmasterflexpage #header > .nav {
    display: none;
}

#coatmasterflexpage .fixednav {
    display: none;
}


#coatmasterflexpage .coatflexlogo {
    top: 44px;
    right: 66px;
    position: absolute;
    z-index: 2;
}


#coatmasterflexpage .coatflexlogo img {
    width: 200px;
    height: auto;
}

#coatmasterflexpage .coatflexlogo img:nth-child(2){
    width: 40px;
    height: auto;
    display: none;
     right: 10px;
    top: 10px;
}

#c782,
#c783{
    display: none!important;
}

.productspage .contentwrapper.bgyellow .coatflexlogo {
  display: none !important;   
}


/*------------------- Onepager Navigation -------------------*/

#coatmasterflexpage .onepagenav {
    display: block !important;
    top: 35%;
    
}

#coatmasterflexpage .onepagenav li {
    height: 50px;
    
}


#coatmasterflexpage .onepagenav span.nr {
    color: #000;
    background: none;
  font-family: century-gothic, sans-serif;
   font-weight: 700;
   font-style: normal;
}

#coatmasterflexpage .onepagenav .active span.nr {
    color: #fff;
    background: none;
}

#coatmasterflexpage .onepagenav .active span.nr.orange {
    color: #ffd100;
    background: none;
}

#coatmasterflexpage .onepagenav .active span.navtitle.orange {
    color: #ffd100;
    background: none;
}

#coatmasterflexpage .onepagenav .navline.orange {
    color: #ffd100;
    background: none;
}

#coatmasterflexpage .onepagenav .navtitle {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    cursor: vertical-text;
    width: auto;
    position: absolute;
    top: 100%;
    left: 16px;
  font-family: 'avenir-reg';
    color: #fff;
  
  
  font-family: century-gothic, sans-serif;
   font-weight: 400;
   font-style: normal;
  text-transform: none;
  font-size: 16px;
}

#coatmasterflexpage .onepagenav .navline {
    border-right: 1px solid;
    height: 62px;
    width: 25px;
    display: inline-block;
    margin-bottom: 15px;
    color: #fff;
}

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

#coatmasterflexpage footer {
    background: #000;
}


#coatmasterflexpage footer .container {
    padding: 0;
    color: white!important;
}

#coatmasterflexpage footer a {
    text-decoration: none;
    border-bottom: 1px solid white;
  color: white;
}

#coatmasterflexpage footer .footernav a {
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    border: none;
}

#coatmasterflexpage footer a:hover {
    color: #ffd100;
}

#coatmasterflexpage footer .section-gap-tiny {
    display: none;
}

#coatmasterflexpage footer #c558 strong {
    font-size: 14px;
    font-weight: 400;
}

#coatmasterflexpage footer #c558 strong br {
    display: none;
}

#coatmasterflexpage footer #c24 h3,
#coatmasterflexpage footer #c24 p
{
    font-size: 16px;
    margin-bottom: 5px;
}

footer .socialfooter a {
  margin-right: 30px;
}

footer .socialfooter a:first-child {
  margin-left: -5px;
}

#coatmasterflexpage footer .socialfooter a img{
   -webkit-filter: invert(1);
   filter: invert(1);
  }

#coatmasterflexpage footer .partnerfooter img {
  max-width: 120px!important;
}

/*------------------------------------------------------------------------
Content
------------------------------------------------------------------------*/

/*------------------- Startcontent -------------------*/

#coatmasterflex .starticon {
    background: url(../../images/icon_patented_technology_new.svg) no-repeat;
    position: absolute;
    top: 275px;
    left: calc(35% + 650px);
    width: 100%;
    height: 150px;
    display: none;
}

#coatmasterflex .startimage img {
    position: absolute;
    top: 150px;
    left: 45%;
    max-height: 110vh;
    width: auto;

}

/*------------------- Zitat Slider -------------------*/

#coatflexref {
    max-width: 50%;
}

#coatflexref .zitat {
    font-size: 24px;
    font-style: normal;
   font-family: 'avenir-bold';
    max-width: 90%;
    margin-bottom: 30px;
}

#coatflexref .name {
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
   font-family: 'avenir-reg';
    max-width: 320px;
}

#coatflexref .slick-prev:before {
    background-image: url(../../images/Icon_slider_links.svg);
    content: "";
    width: 28px;
    height: 74px;
    opacity: 1;
}

#coatflexref .slick-next:before {
    background-image: url(../../images/Icon_slider_rechts.svg);
    content: "";
    width: 28px;
    height: 74px;
    opacity: 1;
}

#coatflexref .slick-prev {
    left: -100px;
    width: 28px;
    height: 74px;
}

#coatflexref .slick-next {
    right: 0px;
    width: 28px;
    height: 74px;
}

.fleximageslider .slick-slide img {
    position: relative;
    top: inherit;
    transform: none;
    left: inherit;
}

.fleximageslider .slick-prev:before {
    background-image: url(../../images/Icon_slider_links_white.svg);
    content: "";
    width: 28px;
    height: 74px;
    opacity: 1;
}

.fleximageslider .slick-next:before {
    background-image: url(../../images/Icon_slider_rechts_white.svg);
    content: "";
    width: 28px;
    height: 74px;
    opacity: 1;
}

.fleximageslider .slick-prev {
    left: 3px;
    width: 28px;
    height: 74px;
}

.fleximageslider .slick-next {
    right: 3px;
    width: 28px;
    height: 74px;
}


/*-------------------- Row - Detailinfos --------------------*/
#coatflexdetailinfos {
    padding: 0;
    /*background-image: radial-gradient(circle, #fff4d5, #ffeebf, #ffe9a8, #ffe392, #ffdd7b, #ffd96d, #fed65f, #fed250, #fed047, #fecd3e, #fecb34, #ffd100);*/
    background-color: #ffd100;
    position: relative;

}

#coatflexdetailinfos h4,
#coatflexmiete h4,
#order h4 {
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    margin-top: 0;
}


#coatflexdetailinfos h2,
#order h2{
    margin: 0px 0 50px 0;
    font-size: 2.563em;
    width: 100%;
  font-weight: 700;
  font-family: century-gothic, sans-serif !important;
}

#coatflexdetailinfos p {
    margin-bottom: 30px;
  font-family: 'avenir-reg';
}


#coatflexdetailinfos .titleacc h3 {
    background: url(../../images/Icon_plus.svg) no-repeat right 15px center #fff;
    background-size: 25px 25px;

    padding: 20px 15px 18px 15px;
    font-size: 16px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    cursor: pointer;
    margin-bottom: 0;
  font-family: 'avenir-reg';
}

#coatflexdetailinfos .titleacc.open h3 {
    background: url(../../images/Icon_minus.svg) no-repeat right 15px center #fff;
    background-size: 25px 25px;
}

#coatflexdetailinfos #c756 .titleacc h3 {
    background: url(../../images/Icon_testimonials_black.svg) no-repeat right 15px center #fff;
    background-size: 25px 25px;

}

#coatflexdetailinfos .titleacc h3.open {
    background: url(../../images/Icon_minus.svg) no-repeat right 15px center #fff;
    background-size: 25px 25px;
}

#coatflexdetailinfos .titleacc h3:hover,
.coatflexdownload:hover {
    background-color: #f5f5f5!important;
}

#coatflexdetailinfos .accdetail {
    background: #fff;
    padding: 0 15px 13px 15px;
    display: none;
}

#coatflexdetailinfos .accdetail.open {
    display: block;
}

#coatflexdetailinfos .accdetail p {
    margin-bottom: 0px;
}

#coatflexdetailinfos .accdetail table {
    width: 100%;
    border-top: 1px solid;

}

#coatflexdetailinfos .accdetail table td {
    border-bottom: 1px solid;
}


#coatflexdetailinfos td,
#coatflexdetailinfos th {
    padding: 5px 0;
}


#coatflexdetailinfos .accdetail table tr td:first-child {
    border-right: none;
}


/*Open Content Button*/
.collapsedContentBox {
    background: #000;
    padding: 30px;
    margin-bottom: 20px;
    display: flex;
    cursor: pointer;
}

.collapsedContentBox h2 {
    font-weight: normal!Important;
  font-family: 'avenir-med';
    font-size: 28px!Important;
    margin: 0!important;
    width: 100%;
    color: #fff!important;
}

.collapsedContentBox.opened {
    background: #fff;
    padding: 30px;
    margin-bottom: 20px;
    display: flex;
}

.collapsedContentBox.opened:hover {
    background: #f5f5f5;
}

.collapsedContentBox.opened h2 {
    color: #000!important;
}


.collapsedContentBox span {
    height: auto;
    width: 40px;
    background: url(../../images/Icon_plus_white.svg) no-repeat center;
    background-size: 40px;
}

.collapsedContentBox.opened span {
    background: url(../../images/Icon_minus.svg) no-repeat center;
    background-size: 40px;
}

/*--------------------- Row – Coatflex Miete ---------------------*/
#coatflexmiete {
    padding: 0;
    background-color: #ffd100;
    padding-bottom: 210px;
}

#coatflexmiete h2 {
font-family: century-gothic, sans-serif;
    font-size: 40px;
        font-weight: 700;
   
}

#coatflexmiete .first{
  font-family: 'avenir-reg';
  }


#coatflexmiete .greyboxwrapper .box h4 {

    font-size: 16px;
    font-style: normal;
    font-weight: bold;
    color: #000;
    marign-top: 0;
    border-bottom: 1px solid;
    padding: 0 5px 15px 5px;
}

#coatflexmiete .greyboxwrapper .box ul {
    margin-left: 20px;
    margin-bottom: 30px;
}

#coatflexmiete .greyboxwrapper .box ul p {
font-family: 'avenir-reg';
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    margin-bottom: 5px;
}

.coatflexdownload {
    background: url(../../images/Icon_download.svg) no-repeat right 15px center #fff;
    background-size: 25px 25px;
    padding: 16px 15px 13px 15px;
    font-size: 16px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    cursor: pointer;
    margin-bottom: 0;
    display: block;
    width: 100%;
    margin-top: 20px;
    color: #000 !important;
  font-family: 'avenir-reg';
}

.wrapperobox {
    margin: 20px 0;
}

.wrapperobox p{
  font-family: 'avenir-reg';
  }

.wrapperobox > .box {
    float: left;
    width: 49%;
    background: #fff;
   padding: 30px 30px 20px 30px;
}

.wrapperobox #infomiete{
    display: inline-block;
  margin-top: 20px;
}

.wrapperobox #infomiete p {
  font-family: 'avenir-reg';
  }


.oboxleft {
    margin-right: 2%;
}

.wrapperobox h3 {
    color: #000;
    font-size: 28px;
    font-style: normal;
    font-weight: normal;
    margin-top: 0;
  font-family: 'avenir-med';
    margin-bottom: 20px;
}

.wrapperobox table {
    width: 100%;
}

.wrapperobox th {
    color: #000;

    width: 191px;
    border-top: 1px solid;
}

.wrapperobox table p {
  font-family: 'avenir-reg';
  
  }

.wrapperobox th p {
font-family: 'avenir-med';
    font-size: 28px;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    margin: 0;
}

.wrapperobox td {
    border-top: 1px #fff dotted;


}

.wrapperobox td p {
    margin: 0;
font-family: 'avenir-reg';
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
    text-align: right;
}

.wrapperobox tr {
    border-top: 1px solid;
    display: table-row;
    height: 65px;
}

.wrapperobox tr:last-child {
    border-bottom: 1px solid;

}


.wrapperobox table {
    border-bottom: 1px #fff dotted;
    margin-bottom: 20px;
}




.wrapperobox.preis .box {
    height: auto !important;
}

.wrapperobox.preis .box span {
    display: inline-block;
    padding-top: 11px;
      font-family: 'avenir-reg';
    float: right;
}

.wrapperobox.preis h3 {
    float: left;
}

.greyboxwrapper .box {
    background: #fff;
    width: 50%;
    float: left;
    padding: 30px 30px 20px 30px;
}

#coatmasterflexpage .greyboxwrapper , .productspage .greyboxwrapper {
    display: flex;
}


.greyboxwrapper .box.second {
    margin: 0;
    margin-left: 20px;
}

.greyboxwrapper .box.last {
    display: none;
}

.oboxleft h3 span,
.oboxright h3 span {
    font-size: 16px;
    text-align: right;
    float: right;
    padding-top: 10px;
}


/*------------------- Special Letter -------------------*/

#coatmasterflexpage span.specialletter {
    display: inline;
    font-size: 1em;
    font-family: sans-serif;
}


/*----------------------- Button Divider Line -----------------------*/
.gotoorder .buttonline .button {
    color: #fff!important;
    font-size: 1em;
    font-weight: 700;
    width: auto;
    background: #000;
    text-align: center;
    border: 1px black solid;
    padding: 11px 35px;
    display: inline-block;
    text-transform: none;
}

.gotoorder .buttonline .button:hover {
    border: 1px #000 solid !important;
    color: #ffd100!important;
}

#coatmasterflexpage .buttonline, .productspage .buttonline {
    text-align: center;
    background: none;
    margin-bottom: 0;
    transform: translateY(calc(-100% - 55px));
}

 .productspage  .gotoorder .buttonline .button {
    margin-bottom: 55px;
}

/*------------------------------------------------------------------------
Contact Box
------------------------------------------------------------------------*/

/* Contactbox */
#coatmasterflexpage #kontaktbox, .fixednav #kontaktbox {
    position: fixed;
    height: 100vh;
    right: 0;
    top: 0;
    width: 33.5%;
    background: #fff;
    z-index: 20;
    box-sizing: border-box;
    padding: 50px;
    transform: translateX(100%);
    overflow: auto;
    overflow-y: scroll;

}

/* Transition */
#coatmasterflexpage #kontaktbox, .fixednav #kontaktbox {
    transition-duration: 0.5s;
}

/* Open Contactbox Button */
#coatmasterflexpage .opencontactbox, .fixednav .opencontactbox {
    writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
     transform: rotate(180deg) translateX(-100%);
    /* transform: rotate(180deg) translateX(-22px);
    -moz-transform: rotate(180deg) translateX(-54px);
    -ms-transform: rotate(180deg) translateX(-46px); */
    cursor: vertical-text;
    position: fixed;
    z-index: 14;
    top: 272px;
    /* right:-4px; */
    right: 0;
    padding: 25px 13px;
    background: black;
    color: white;
    transform-origin: left;
    font-family: 'avenir-reg';
    cursor: pointer;
}

.fixednav .opencontactbox {
    /* right: -28px; */
    right: 0;
    padding: 25px 12px;
  top: 268px;
}

/* .safari .fixednav .opencontactbox {
    right: 24px;
} */

.safari-14 .fixednav .opencontactbox {
    right: 24px;
}


@supports (-ms-ime-align:auto) {
  .fixednav .opencontactbox {
    right: 4px;
}
}


.fixednav #kontaktbox  h2 {
    font-size: 40px;
    font-weight: 700;
    line-height: 48px;
    color: #000000;
    display: block;
    margin-top: 0;
    margin-bottom: 50px;
}

#coatmasterflexpage .opencontactbox:hover {
    color: #ffd100;
}

/* Close Crossmark */
.closecontactbox{
    width: 30px;
    height: 30px;
    background: url(../../images/icon_crossmark_close.svg) no-repeat;
    right: 50px;
    top: 45px;
    position: absolute;

    cursor: pointer;
}

/* Container Kontakt */
.kontakt-container{
    margin-bottom: 50px;
}

/* Kontakt Telefon */
#kontakt-telefon div {
    width: 100%;
    border-top: 1px solid;
    padding: 20px 0;
}

#kontakt-telefon h3 {
    margin-top: 0;
  font-family: 'avenir-reg';
}
#kontakt-telefon a{
font-family: 'avenir-reg';
}
 #kontakt-telefon div:last-child {
    border-bottom: 1px solid;
}

/* Kontaktformular */
#kontaktformular {
    border-bottom: 1px solid;
    padding-bottom: 50px;
}

 #kontaktformular .container-fluid {
    padding: 50px 0;
}

/* Hide Powermail Title & Legend */
#kontaktformular form h3,
 #kontaktformular form .powermail_legend {
    display: none;
}

/* Hide contact form */
 #kontaktbox #c751 {
    display: none;
}

/* Button open / close form */
#kontaktbox .openform {
    width: 100%;
    background: #000;
    padding: 15px 20px 15px 20px;

    cursor: pointer;
    display: table;
}

#kontaktbox .openform h3:hover {
    color: #fff;
}

#kontaktbox .openform h3 {
    margin: 0;
    color: #fff;
    width: 95%;
    display: table-cell;
  font-family: 'avenir-reg';
    vertical-align: middle;

}

#kontakt-hauptsitz {
  font-family: 'avenir-reg';
}

#kontaktbox .openform div {

    background-repeat: no-repeat;
    width: 40px;
    height: 30px;
    background-size: 30px;
}

#kontaktbox .opened div {
    
    background-repeat: no-repeat;
    background-size: 27px;
    background-position: 7px 1px;
}

#kontakt-hauptsitz a {
    color: #000;
    font-weight: normal;
}

/* Kontakt Termin Buchen */

#kontakt-termin {
    width: 100%;
    background: #FFD100;
    padding: 5px 15px 5px 15px;
  font-family: 'avenir-reg';
    cursor: pointer;
    display: table;
}

/*------------------------------------------------------------------------
Form
------------------------------------------------------------------------*/

#order form .powermail_field input,
#order form .powermail_field textarea,
#c751 form .powermail_field input,
#c751 form .powermail_field textarea {
    color: #000000;
    font-size: 14px;

    font-family: 'avenir-reg';
    line-height: 12px;
    padding-left: 20px;
    height: 45px;
    width: 100%;
    padding-left: 10px;
    background-color: #ffffff;
    border: 1px solid #000000;
    margin-bottom: 30px;
}

#order .tx-powermail h3 {
    display: none;
}

#order .container-fluid {
    padding: 0;
}

#order form .powermail_field select {
    background-color: transparent;
    border: 1px solid #000000;
    border-radius: 0;
    height: 55px;
    padding: 20px;
}

#order .powermail_label,
#c751 .powermail_label {
    display: none;
}
  
#order .powermail_fieldwrap {
    width: calc(33% - 9.6px);
    float: left;
}

#order .powermail_fieldset_9 .powermail_fieldwrap_bemerkungen_01 {
  width: calc(50% - 10px);
}

#order .powermail_fieldwrap_firmenname,
#order .powermail_fieldwrap_stra,
#order .powermail_fieldwrap_ort,
#order .powermail_fieldwrap_ansprechpartner,
#order .powermail_fieldwrap_telefon,
#order .powermail_fieldwrap_referenznummer,
#order .powermail_fieldwrap_ustidnr,
#order .powermail_fieldwrap_firmenname_01,
#order .powermail_fieldwrap_strasse,
#order .powermail_fieldwrap_ort_01,
#order .powermail_fieldwrap_land_01,
#order .powermail_fieldwrap_telefon_01,
#order .powermail_fieldwrap_rechnungsstrasse,
#order .powermail_fieldwrap_ansprechspartner_01,
#order .powermail_fieldwrap_firmennamerechung,
#order .powermail_fieldwrap_rechnungsstrasse,
#order .powermail_fieldwrap_rechnungsort {
    margin-right: 20px;
}

#order .powermail_fieldwrap_firmennamerechung {
  clear: both;
  margin-top:0px;
  }

#order .powermail_fieldwrap_rechnungsstrasse {
   margin-top:0px;
  }

#order .powermail_fieldwrap_abweichenderechnungsadresse {
  height:58px;

  }

#order .powermail_fieldwrap_abweichenderechnungsadresse label{
    margin-bottom:34px !important;
  }


#order .powermail_fieldwrap_land,
#order .powermail_fieldwrap_land_01 {
    margin-right: 0;
}

#order .powermail_fieldwrap_firmenname_01,
#order .powermail_fieldwrap_strasse,
#order .powermail_fieldwrap_plz_01,
#order .powermail_fieldwrap_ort_01,
#order .powermail_fieldwrap_land_01,
#order .powermail_fieldwrap_ansprechspartner_01,
#order .powermail_fieldwrap_telefon_01,
#order .powermail_fieldwrap_e_mail_01,
#order .powermail_fieldwrap_rechnungsort,
#order .powermail_fieldwrap_plzrechnung,
#order .powermail_fieldwrap_rechnungsstrasse,
#order .powermail_fieldwrap_firmennamerechung,
.powermail_fieldwrap_rechungsland {
    display: none;
}

#order .powermail_fieldwrap_plz,
#order .powermail_fieldwrap_plz_01,
#order .powermail_fieldwrap_plzrechnung {
    clear: both;
    margin-right: 20px;
}


#order ::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #000;
}

#order::-moz-placeholder {
    /* Firefox 19+ */
    color: #000;
}

#order :-ms-input-placeholder {
    /* IE 10+ */
    color: #000;
}

#order :-moz-placeholder {
    /* Firefox 18- */
    color: #000;
}

#order .btn-group {
    width: 100%;
}

#order .btn-group .first {
    font-weight: 700;
}


#order .btn-group .btn-default {
    color: #000;
    background-color: #fff;
    border: none;
    width: 25%;
    text-align: left;
    padding: 5px 0;
    cursor: default;
    box-shadow: none;
    text-indent: 14px;
}

#order .btn-group .btn-default:after {
    display: block;
    border-bottom: 1px black dotted;
    width: 100%;
    content: ' ';
    height: 5px;
    margin-top: 5px;
}


#order .btn-group .btn-primary {
    color: #000;
    background-color: #fff;
    border: none;
}


#order .btn-group .activebutton:after {
    display: block;
    border: none;
    width: 100%;
    content: ' ';
    height: 10px;
    background: #ffd100;
}

#order .btn-group .btn-primary:after {
    display: block;
    border: none;
    width: 100%;
    content: ' ';
    height: 10px;
    background: #ffd100;
}


#order .powermail_fieldwrap.powermail_tab_navigation {
    width: 100%;
}

#order .powermail_fieldwrap.powermail_tab_navigation .btn-primary {
    background: #000;
    color: #fff;
    border-radius: 0px;
    border: none;
    position: absolute;
    right: 0;
    height: 45px;
    line-height: 45px;
     font-family: 'avenir-reg';
    bottom: 0;
    width: 160px;
    text-align: center;
    padding: 0;
  z-index: 10;
}

#order .powermail_fieldwrap.powermail_tab_navigation .btn-primary:hover,
#order .invalid:hover {
    color: #ffd100;
}

#order .invalid {


    position: absolute;
    right: 0;
    height: 45px;
    line-height: 45px;
    bottom: 0;
    width: 160px;
    cursor: pointer;
    padding: 0;
    z-index:500;

}

#order .powermail_fieldset_10 .invalid {
    display: none;
}

#order * {
    outline: none;
}

#order span.first {
  font-family: 'avenir-reg';
  }

#order .powermail_fieldwrap_type_radio, #order .powermail_fieldwrap_abweichenderechnungsadresse, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker  {
    float: none;
    width: 60%;
    margin-right: 40%;
    display: block;
    height: 92px;
    cursor: pointer;
}


#order .powermail_fieldwrap_type_radio .radio label, #order .powermail_fieldwrap_abweichenderechnungsadresse label, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker label{
    position: relative;
    margin-top: 3px;
    margin-bottom: 10px;
    width: 50%;
    display: inline-block;
    float: left;

    padding: 0px;
    background-color: #f0f0f0;
    font-size: 16px;
    font-family: 'avenir-reg';
    line-height: 55px;
    display: block;
    text-align: left;
    padding-left: 50px;
    color: #000000;
    cursor: pointer;
    position: relative;
    z-index: 2;
    transition: color 200ms ease-in;
    overflow: hidden;
    margin-bottom: 0;
}

#order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker .powermail_label, #order .powermail_fieldwrap_abweichenderechnungsadresse .powermail_label {
  display: none;
  }


#order .powermail_fieldwrap_type_radio .radio.checked label {
    color: #000;
}


#order .powermail_fieldset_7 .radio {

    margin-top: 0px;
    margin-bottom: 0px;
}

#order .powermail_fieldwrap_type_radio .radio label:before, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker label:before, #order .powermail_fieldwrap_abweichenderechnungsadresse label:before{
    width: 10px;
    height: 10px;
    border-radius: 50%;
    content: '';
    /*background-image: linear-gradient(to right, #fec728, #ffb81f, #ffa81b, #ff981a, #ff881d);*/
    background-color: #ffd100;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale3d(1, 1, 1);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    z-index: -1;
}

#order .powermail_fieldwrap_type_radio .radio label:after, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker label:after , #order .powermail_fieldwrap_abweichenderechnungsadresse label:after {
    width: 32px;
    height: 32px;
    content: '';
    border: 2px solid #000;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 4px 4px;
    border-radius: 50%;
    z-index: 2;
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    transition: all 200ms ease-in;
}


#order .powermail_fieldwrap_type_radio .radio.checked label:after, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker .checked label:after, #order .powermail_fieldwrap_abweichenderechnungsadresse .checked label:after {
    background-color: transparent;
    border-color: #000;
    background-image: url(../../images/ok_black.svg);
}

#order .powermail_fieldwrap_type_radio .radio.checked label:before, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker .checked label:before, #order .powermail_fieldwrap_abweichenderechnungsadresse .checked label:before{
    transform: translate(-50%, -50%) scale3d(58, 56, 1);
    opacity: 1;
}

#order .radio input[type="radio"] {
  opacity:0;
position:absolute;
left:0px;
margin:0;
}



#order .radio label {
    line-height: 20px;
}

#order .btn.btn-warning {
    background: #000;
    color: #fff;
    border-radius: 0px;
    border: none;
    position: absolute;
    left: 0;
    height: 45px;
    line-height: 45px;
  font-family: 'avenir-reg';
    bottom: 0;
    width: 160px;
    text-align: center;
    padding: 0;
}

#order .btn.btn-warning:hover {
    color: #ffd100;

}

#order .powermail_confirmation .btn.btn-danger {
    background: #000;
    color: #fff;
    border-radius: 0px;
    border: none;

    height: 45px;
    line-height: 45px;

    width: 160px;
    text-align: center;
    padding: 0;
    position: absolute;
    left: 0;
    bottom: -45px;
}

#order .powermail_confirmation .btn.btn-primary {
    background: #000;
    color: #fff;
    border-radius: 0px;
    border: none;
    position: absolute;
    right: 0;
    bottom: -20px;

    height: 45px;
    line-height: 45px;

    width: 160px;
    text-align: center;
    padding: 0;
}

#order .powermail_fieldset_9 .radio {
    float: none;
    width: 100%;
}


#order .powermail_fieldset_9 .powermail_fieldwrap_mietkonditionen_01,
#order .powermail_fieldset_9 .powermail_fieldwrap_mietkonditionen {
    float: left;
    width: calc(50% - 10px);
    margin-right: 20px;
    display: inline;
    height: auto;
}

#order .powermail_fieldwrap_kaufkonditionen {
    float: left;
    width: calc(50% - 10px);
    display: inline;
    height: auto;
    margin-right: 0;
}


#order .powermail_fieldset_9 .powermail_fieldwrap_mietkonditionen .powermail_label,
#order .powermail_fieldset_9 .powermail_fieldwrap_mietkonditionen_01 .powermail_label,
#order .powermail_fieldwrap_kaufkonditionen .powermail_label {
    display: block;
}

#order .powermail_fieldset_9 .radio label {
    width: 100%;
    margin-bottom: 8px;
}

#order .powermail_fieldwrap_gewuenschteslieferdatum {
    margin-top: 25px;
}

#order .powermail_all_marker_abweichenderechnungsadresse, .powermail_all_marker_marker {
  display: none;
  }

#order legend {
    display: block;
    width: 100%;
    padding: 30px 0 0 0;
    margin: 0 0 20px 0;
    font-size: 21px;
    line-height: inherit;
    color: #000;
    border: 0;
    border-bottom: none;
  font-family: 'avenir-med';
}

#order .powermail_fieldwrap_anzahl {
    float: left;
       width: calc(50% - 10px);
    margin-top: 30px;
    
}

#order .powermail_fieldwrap_anzahl input {
    margin-bottom: 25px !important;
  }


#order form .powermail_field textarea {
    height: 89px;
    padding-top: 20px;
}

#order .powermail_fieldwrap_bemerkungen_01 .powermail_label {
    display: block;
}

#order .powermail_fieldset.powermail_fieldset_10 .powermail_fieldwrap_bemerkungen {
    float: left;
    width: calc(50% - 10px);
    margin-right: 20px;
    display: inline;
    height: auto;
}

#order .powermail_fieldset.powermail_fieldset_10 .powermail_fieldwrap_datenschutz {
    float: left;
    width: calc(50% - 10px);
    display: inline;
    height: auto;
    margin-right: 0;
}

#order .tx-powermail {
    position: relative;
    /* height: 660px; */
    padding-bottom: 50px;
}

#order .powermail_submit,
#c751 .powermail_submit {
    position: absolute;
    bottom: 0;
    width: 160px !important;
    right: 0;
    background-color: #000 !important;
    color: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: center;
font-family: 'avenir-reg';
}

#order .powermail_submit:hover,
#c751 .powermail_submit:hover {
    color: #ffd100!important;
}

#order .powermail_fieldwrap_datenschutz .checkbox a {
    color: #000;
    text-decoration: underline;
  position: relative; 
  z-index:100;
}

#order .powermail_fieldwrap_datenschutz .checkbox {
    font-size: 14px;
}

#order .powermail_fieldwrap_type_check.powermail_fieldwrap_datenschutz .checkbox label:after {
    width: 32px;
    height: 32px;
    content: '';
    border: 1px solid #000;
    background-color: #fff;
    border-radius: 0;
    z-index: 2;
    position: absolute;
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

#order .powermail_fieldwrap_type_check.powermail_fieldwrap_datenschutz .checkbox.checked label:after {

    background-color: #fff;
    background-image: url(../../images/ok_black.svg);
    background-repeat: no-repeat;
    background-position: 4px 4px;

}

#order .powermail_fieldwrap_type_check label {
    padding-left: 55px;
  font-family: 'avenir-reg';
}

#order .powermail_fieldwrap_type_check input {
    height: 55px !important;
    opacity: 0;
  margin:0;
  width:100% !important;
  position:absolute !important;
left:0px;
}
#order .powermail_fieldwrap_abweichenderechnungsadresse label, #order .powermail_fieldwrap_type_check.powermail_fieldwrap_marker label {
  height:55px;
  padding-left: 55px !important;
  }


#order .powermail_fieldwrap_pflichtfelder {
    font-size: 12px;
    margin-top: 60px;
}


#order #powermail_field_land,
#order #powermail_field_land_01,
#order #powermail_field_rechungsland {
    color: #000000;
    font-size: 14px;
    font-weight: 400;
    line-height: 12px;
    padding-left: 20px;
    height: 45px;
    width: 100%;
    padding-left: 10px;
    background-color: #ffffff;
    border: 1px solid #000000;
    margin-bottom: 30px;
    padding-top: 0;
    padding-bottom: 0;
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    background-image: url(../../images/Icon_dropdown.svg);
    background-position: 96% 50%;
    background-repeat: no-repeat;
    background-size: 25px;
}

#order input.error, #order select.error{

    border-color: #ffd100 !important;
}

/* Confirmation Page */
#order .powermail_confirmation .table > thead > tr > th,
#order .powermail_confirmation .table > tbody > tr > th,
#order .powermail_confirmation .table > tfoot > tr > th,
#order .powermail_confirmation .table > thead > tr > td,
#order .powermail_confirmation .table > tbody > tr > td,
#order .powermail_confirmation .table > tfoot > tr > td {
    padding: 0;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: none;
}

#order .powermail_confirmation td strong {
    font-weight: normal;
}

#order .powermail_confirmation table {
    border-top: 1px black dotted;
    border-bottom: 1px black dotted;
    max-width: 600px;
}

.powermail_confirmation form {
    width: 600px;
    position: relative;
}

#order .powermail_confirmation .powermail_all_marker_ustidnr {
    border-bottom: 1px black dotted !important;
}


#order .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #fff;
}


#order .powermail_confirmation .titletrenner {
    border-top: 1px black dotted !important;

}


#order .powermail_confirmation .titletrenner td {

    padding-top: 10px !important;

}

#order .powermail_confirmation .yellowbox {
    background: #ffd100;
}

#order .pflichtinfo {
  font-family: 'avenir-reg';
    font-size: 12px;
}

#order .powermail_fieldwrap_infotext {
font-family: 'avenir-reg';
margin-bottom:10px;
font-size: 14px;
    line-height: 1.5em;
  }
  
#order .powermail_fieldwrap_infotext ul {
      margin-left: 16px;
}

#order .powermail_fieldwrap_infotext li p {
  margin-bottom:5px;  
}

#order .btn-group:after {
  height:40px;
  width:100%;
  display: block;
   content: '';
  z-index: 10;
    position: absolute;
  }

#order .btn-group .second{
  font-family: 'avenir-med';
  }

.praxis .container .news-list-view.row .article.col-sm-4 {
  width:50%;
}

@media screen and (max-width: 400px) {
  .praxis .container .news-list-view.row .article.col-sm-4 {
  width:100%;
  }

.praxis .container .frame-type-list {
  margin-top:30px;
  }
}

@media screen and (min-width: 375px) and (max-width: 769px) {
#coatflexdetailinfos .col-sm-6 .frame-type-dce_dceuid19 .container .videobutton {
  max-width: 330px;
}
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
#coatflexdetailinfos .col-sm-6 .frame-type-dce_dceuid19 .prozess {
  padding-top:0;
}

#coatflexdetailinfos .col-sm-6 .frame-type-dce_dceuid19 .container .videobutton {
  max-width:440px;
}
}