/* Global */

.content {
  margin: 5px;
}

/* Global Navi and Footer Font Settings */

nav {
  height: 4rem;
  font-size: 1rem;
  box-shadow: 0px 0px 1.5px 0px #80808050;
  padding-left: 6%;
  padding-right: 6%;
  font-family: "Inter", "Helvetica", sans-serif;
}

.dropdown-menu-nav {
  font-size: 1rem!important;
  font-family: "Inter", "Helvetica", sans-serif;
}

.accordion-nav {
  font-size: 1rem!important;
  font-family: "Inter", "Helvetica", sans-serif;
}

accordion-item-nav {
  font-size: 1rem!important;
  font-family: "Inter", "Helvetica", sans-serif;
}

@media screen and (max-width: 991px){
.navbar-collapse {
  width: 300px !important;
  }
}

/* Custom Mobile Navbar Styles */

.accordion-button:not(.collapsed) {
  color: #41464b!important;
  box-shadow: #ffffff;
}

.accordion-button:hover {
  background: #FFFFFF;
}

:focus {
  outline: 0 !important;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}

.accordion-button:not(.collapsed) {
  background-color: #FFFFFF;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")!important;
}

a.dropdown-item {
  padding: 0rem 1rem .35rem 0rem;
}

a.dropdown-item:hover {
  background: #F5F5F5;
}

#div.accordion-body.dropdown-item {
  padding: 4px 0  4px 0;
}

.accordion-button-nav {
 /* padding: .25rem 1rem .25rem 1rem!important;*/
  font-size: 14px;
}

.accordion-item {
  border: 1px solid rgb(255, 255, 255);
}

.mobile-brand-centered {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}

.mobile-navbar-brand {
  display: flex;
  align-items: center;
  margin-top: 1.25%;
}

.mobile-language-selector-right {
  position: absolute;
  top: 28%;
  bottom: 0;
  right: 7%;
  vertical-align: middle;
}

.dropdown-menu[data-bs-popper] {
    top: 100%;
    left: 0;
    margin-left: 1%;
    width: auto;
    padding: 20px;
    border-radius: 10px !important;
}

.dropdown-menu th {
  border-bottom: 1px solid #ddd;
  padding: 0rem 1rem .35rem 0rem;
}

.transBox {
    font-size: 16px;
    background-color: rgb(255 255 255 / 50%);
    width: max-content;
    padding: 5px 15px 6px 15px;
    border-radius: 25px;
}

#greyBox {
 background-color: #F5F5F5;
 color: #1b1b1b;
 font-size: 10px;
 font-weight: bold;
 text-align: center;
 padding: 10px;
 border-radius: 10px;
}

.btn {
    padding: 0px;
    border: 0px;
}

.btn:hover {
    background-color: white;
}

/* Custom Hamburger Button Styles */
.navbar-toggler {
    padding: 0;
    border: 0;
}

#wrapper {
    background: white;
    display: inline-block;
    position: relative;
    cursor: pointer;
    margin-top: 16.5%;
}

.circle.icon {
    width: 30px;
    height: 30px;
    position: relative;
}

.line {
    position: absolute;
    height: 2.5px;
    width: 100%;
    background: black;
    border-radius: 0px;
    transition: all cubic-bezier(0.26, 0.1, 0.27, 1.55) 0.35s;
}

.top {
    top: 18%;
    left: 0%;
}

.middle {
    top: 48%;
    left: 0%;
}

.bottom {
    top: 78%;
    left: 0%;
}

.icon.close .top {
    transform: rotate(45deg);
    top: 48%;
    height: 1.5px;
}

.icon.close .middle,
.icon.close .bottom {
    transform: rotate(-45deg);
    top: 48%;
    height: 1.5px;
}

.navbar-light .navbar-toggler {
    color: #ffffff;
    /*border-color: #ffffff;*/
}


/* Custom Desktop Navbar Styles */

a.nav-link:hover {
  background: #F5F5F5;
}

.transBubble {
    font-size: 16px;
    background-color: rgb(255 255 255 / 50%);
    width: max-content;
    padding: 5px 15px 6px 15px;
    border-radius: 25px;
}

.nav-item {
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 1.75%;
}

@media (max-width: 989px) {
  .nav-item {
      margin-left: 8%;
  }
}

.navbar-light .navbar-nav .nav-link {
    color: black;
}

.desktop-language-selector {
  vertical-align: middle;
  margin-top: .75%;
}

.language-selector-icon {
  height: 30px;
  width: 30px;
}

.navbar-nav {
  width: 100%;
  padding-right: 0 !important;
  /*overflow: scroll;*/
}


.dropdown-item {
  margin-bottom: 2.5%;
  font-size: 14px !important;
}

/* Footer */

#page-container {
  position: relative;
  min-height: 100vh;
}

.content {
  padding-bottom: 2.5rem;
}


#newsletter-icon {
  margin-left: 3%;
  margin-top: 3%;
}

@media only screen and (max-width: 1024px) {
    .footer-brand {
      margin-top: 7% !important;
    }

    #newsletter-icon {
      display: none;
    }
  }


@media only screen and (max-width: 1085px) {
    #button-newsletter-symbol {
      display: none;
    }
  }

@media only screen and (max-width: 1435px) {
    .footer-brand {
      margin-top: 6%;
    }
  }

#newsletter-form {
  margin-bottom: 3%;
}

#newsletter-form-box {
  max-width: 400px;
}

#page-container {
  position: relative;
  min-height: 100vh;
}

.content {
  padding-bottom: 2.5rem;
}


#button-newsletter {

  background: none;
  border-radius: 1px;
  border-color: white;
}

.transparent_btn {
	display: inline-block;
	padding: 10px 14px;
	color: #FFF;
	border: 1px solid #FFF;
	text-decoration: none;
	font-size: 16px;
	line-height: 120%;
	background-color: rgba(255,255,255, 0);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: background-color 300ms ease;
	-moz-transition: background-color 300ms ease;
	transition: background-color 300ms ease;
	cursor: pointer;
  margin-top: 1%;
  text-align: center;
  box-sizing: content-box;
}

.transparent_btn:hover {
	background-color: orange;
	color: #FFF;
}



.footer_newsletter_btn {
display: flex;
width: 242px;
height: 44px;
padding: 16px 42px;
justify-content: center;
align-items: center;
flex-shrink: 0;
border-radius: 10px;
background-color: #FFC524;
color: #1B1B1B;
text-align: center;
 leading-trim: both;
 text-edge: cap alphabetic;

font-family: "Inter", "Helvetica", sans-serif;
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
letter-spacing: 0.1px;

}

.footer_newsletter_btn:hover {
	background-color: #DFA914;
	color: #FFF;
}

#newsletter-button {
  font-size: 1rem;
}

#newsletter-text {
  color: #F0A739;
  font-size: 18px;
  font-weight: bold;
}

#newsletter-text-2 {
  color: white;
  font-size: 18px;
}

#newsletter-new-text {
  color: #FFC524;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin-top: 17px;
leading-trim: both;
text-edge: cap;
/*font-family: Noto Sans;*/
font-size: 24px;
font-style: normal;
line-height: 140%;
letter-spacing: 0.1px;
}

#newsletter-new-text-2 {
color: #FFF;
leading-trim: both;
text-edge: cap;
/*font-family: Noto Sans;*/
font-size: 12px;
font-style: normal;
line-height: 150%;
letter-spacing: 0.1px;
width: 126px;
margin-left: 6px;
}

#newsletter-new-icon {
width: 108px;
height: 116px;
flex-shrink: 0;
background-image: url(/nero-com-wAssets/img/icons/footer_newslettersubscribe.svg);
display: block;
}

#newsletter-form-new {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 4px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(27, 27, 27, 0.12) 100%);
    width: 288px;
    /*height: 295px;*/
    flex-shrink: 0;
}

.newsletter-text-wrapper {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: 23px;
    margin-top: 13px;
}

#newsletter-new-button-wrapper {
    margin-bottom: 32px;
}


#social {
    padding-right: 1.2rem;
    padding-top: 1.2rem;
    max-width: 55px;
}

footer {
  background: #1B1B1B;
  width: 100%;
  align-items: center;
  position: relative;
  bottom: 0;
  display: block;
  font-family: "Inter", "Helvetica", sans-serif;
  font-size: 0.875rem;
  overflow-x: hidden;
  }

footer > div.footer-content {
  /*padding-left: 4.3%;*/
  margin: 0;
  width: 100%;
  box-sizing: border-box;
}

.footer-item {
  color: white;
  padding-top: 1.35rem;
  cursor: pointer;
  text-decoration: none;
}

.footer-item:hover {
  color: grey;
}


#social-heading:hover {
  color: white;
}

.footer-brand {
  padding-top: 1.5%;
  padding-bottom: 1%;
  margin-top: 3%;
  padding-right: 0;
}

.footer-recom {
  padding-bottom: 1%;
  padding-right: 0;
  color: #3F98DE;
  font-size: 18px;
  font-weight: bold;
}

.checked {
 color: #3F98DE;
}

.checked:hover {
  color: #3380BC;
}

.stars {
 margin-right: 3px;
 fill: white;
}

.footer-main-row {
  align-content: center;
}

.footer-misc {
  width: 100%;
  color: white;
  text-align: center;
  padding-top: 1.5%;
  padding-bottom: 2.0%;
  margin-top: 1.5%;
}

.lessfooter-misc {
  width: 100%;
  color: white;
  text-align: center;
  padding-top: 0.5%;
  padding-bottom: 0.5%;
  margin-top: 0;
}


.modal-header {
  border-bottom:unset;

}

  .col-centered {
    margin: 0 auto;
    float: none;
  }

.smallFont {font-size: 14px; }
.tinyFont {font-size: 10px; }

/* Button Coloring */
.btn-green {
    background-color: #2bad70;
    color: #ffffff;
    border-color: transparent;
}

.btn-green:hover {
    background-color: #238E5C;
    border-color: transparent;
}

a.btn-green:hover {
	color: #FFFFFF;
}

.btn-green-outline {
    background-color: transparent;
    border: 1px solid #2bad70;
    color: #2bad70;
}

.btn-green-outline:hover {
    background-color: #DFEEE7;
    border: 1px solid #2bad70;
    color: #2bad70;
}

a..btn-green-outline:hover {
	color: #FFFFFF;
}

.btn-black-outline {
    border: 1px solid #1B1B1B;
    background-color: transparent;
    color: #1B1B1B;
}

.btn-black-outline:hover {
    background: rgba(148, 148, 148, 0.4);
    border: 1px solid black;
}

.btn-white-outline {
    background-color: transparent;
    border: 1px solid #FFFFFF;
    color: #FFFFFF!important;
}

.btn-white-outline:hover {
    background: rgba(255, 255, 255, 0.4);
    border: 1px solid white;
}

.btn-white {
    background-color: #FFFFFF;
    color: #1b1b1b;
    border: 1px solid #1b1b1b;
}

.btn-white:hover {
    background-color: #E8E8E8;
    color: #1b1b1b;

}

.btn-yellow {
    background-color: #FDB03B;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}

.btn-yellow:hover {
    background-color: #CF8D29;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}

.btn-spring {
 background-color: #FF4E39!important;
 color: #FFFFFF !important;
 border-radius: 10px !important;
}

.btn-spring:hover {
 background-color: #FFD94F!important;
 color: #FF4E39!important;
}

.btn-orange {
    background-color: #FDB03B;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}

.btn-orange:hover {
    background-color: #FDB03B;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}


.btn-blue {
    background-color: #00BAFF;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}

.btn-blue:hover {
    background-color: #0094CB;
    color: #ffffff;
    border-color: transparent;
}

.btn-blue-outline {
    background-color: transparent;
    border: 1px solid #0094CB;
    color: #00BAFF;
}

.btn-blue-outline:hover {
    background-color: #324A62;
    border: 1px solid #0094CB;
    color: #00BAFF;
}

.btn-darkblue {
    background-color: #0968FF;
    color: #ffffff;
    border-color: transparent;
    width: 260px;
    height: 70px;
}

.btn-darkblue:hover {
    background-color: #0053D6;
    color: #ffffff;
    border-color: transparent;
}

.btn-darkblue-outline {
    background-color: transparent;
    border: 1px solid #0968FF;
    color: #0968FF;
}

.btn-darkblue-outline:hover {
    background-color: #transparent;
    border: 1px solid #0053D6;
    color: #0053D6;
}



#header_trial_button {
    color: #ffffff!important;
}




/* Button Classes */

.btn-small {
    width: 200px;
    padding-left: 20px;
    padding-right: 20px;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    text-decoration: none;
    font-family: "Inter", "Helvetica", sans-serif;
	display: flex;
    /*flex-direction: column;*/
    justify-content: center;
  	margin: 5px;
}

.btn-medium {
    min-width: 240px!important;
    max-width: 260px;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    text-decoration: none;
    font-family: "Inter", "Helvetica", sans-serif;
  	display: flex;
    /*flex-direction: column;*/
    justify-content: center;
    padding-left: 30px;
    padding-right: 30px;
}

.btn-big {
    min-width: 300px!important;
    height: 80px;
    line-height: 80px;
    font-size: 1.5rem;
    text-transform: uppercase;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    display: inline-block;
    text-decoration: none;
    font-family: "Inter", "Helvetica", sans-serif;
  	display: flex;
    /*flex-direction: column;*/
    justify-content: center;

}

.btn-flex {
    width: max-content;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    text-align: center;
    border-radius: 10px;
    font-weight: bold;
    text-decoration: none;
    font-family: "Inter", "Helvetica", sans-serif;
  	display: flex;
    /*flex-direction: column;*/
    justify-content: center;
    padding-left: 30px;
    padding-right: 30px;
}



.btn-neroGruen {
    background-color: #2BAD70;
    color: #FFFFFF;
    margin-top: 10px;
    margin-bottom: 10px;
}

.btn-neroGruen:hover {
    background-color: #1C945C;
    color: #FFFFFF;
}


.inner-addon {
  position: relative;
}

.btn-small-dload {
    width: 90%;
    margin: 8px 0px 10px 16px;
    height: 50px;
    line-height: 50px;
    font-size: 1rem;
    text-transform: uppercase;
    text-align: center;
    border-radius: 4px;
    font-weight: bold;
    text-decoration: none;
    font-family: "Inter", "Helvetica", sans-serif;
	display: flex;
    /*flex-direction: column;*/
    justify-content: center;
}

@media screen and (min-device-width: 768px) and (max-device-width: 1199px) {
.btn-small-dload {
    max-width: 175px;
}}


/* Crossprices */

.redCrossprice, .yellowCrossprice, .purpleCrossprice,  .blackCrossprice, .whiteCrossprice {
  position: relative;
  font-size: 22px;
  height: fit-content;
}

.redCrossprice:before, .yellowCrossprice:before, .purpleCrossprice:before {
  position: absolute;
  content: "";
  left: 0;
  top: 50%;
  right: 0;
  border-top: 3px solid;
  -webkit-transform:rotate(-20deg);
  -moz-transform:rotate(-20deg);
  -ms-transform:rotate(-20deg);
  -o-transform:rotate(-20deg);
  transform:rotate(-20deg);
}

.redCrossprice:before {
  border-color: #ED1C24;
}

.yellowCrossprice:before {
  border-color: #FFE288;
}

.purpleCrossprice:before {
  border-color: #740D96;
}


.whiteCrossprice, .blackCrossprice {
 text-decoration: line-through;
}

.smallCrossprice {
  position: relative;
  font-size: 17px;
  height: fit-content;
}

.smallCrossprice:before {
  position: absolute;
  content: "";
  left: 0;
  top: 50%;
  right: 0;
  border-color: #ED1C24 !important;
  border-top: 2px solid;
  -webkit-transform:rotate(-10deg);
  -moz-transform:rotate(-10deg);
  -ms-transform:rotate(-10deg);
  -o-transform:rotate(-10deg);
  transform:rotate(-10deg);
}



/* Bootstrap accordion */

button.accordion-button-page.collapsed, button.accordion-button-page {
  font-size: 20px;
  padding: 2rem 1rem 2rem 2rem;
  line-height: 28px;
}

.accordion-button-page {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: $accordion-button-padding-y $accordion-button-padding-x;
  @include font-size($font-size-base);
  color: $accordion-button-color;
  /* Reset button style*/
  text-align: left;
  background-color: $accordion-button-bg;
  border: 0;
  @include border-radius(0);
  overflow-anchor: none;
  @include transition($accordion-transition);


  &:not(.collapsed) {
    color: $accordion-button-active-color;
    background-color: $accordion-button-active-bg;
    box-shadow: inset 0 ($accordion-border-width * -1) 0 $accordion-border-color;

    &::after {
      background-image: escape-svg($accordion-button-active-icon);
      transform: $accordion-icon-transform;
    }
  }

  /* Accordion icon */
  &::after {
    flex-shrink: 0;
    width: $accordion-icon-width;
    height: $accordion-icon-width;
    margin-left: auto;
    content: "";
    background-image: escape-svg($accordion-button-icon);
    background-repeat: no-repeat;
    background-size: $accordion-icon-width;
    @include transition($accordion-icon-transition);
  }

  &:hover {
    z-index: 2;
  }

  &:focus {
    z-index: 3;
    border-color: $accordion-button-focus-border-color;
    outline: 0;
    box-shadow: $accordion-button-focus-box-shadow;
  }
}

.accordion-header-page {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 20px !important;
}

.accordion-item-page {
  border: 1px solid rgba(0,0,0,.125) !important;

  &:first-of-type {
    @include border-top-radius($accordion-border-radius);

    .accordion-button {
      @include border-top-radius($accordion-inner-border-radius);
    }
  }

  &:not(:first-of-type) {
    border-top: 0;
  }

  /* Only set a border-radius on the last item if the accordion is collapsed*/
  &:last-of-type {
    @include border-bottom-radius($accordion-border-radius);

    .accordion-button-page {
      &.collapsed {
        @include border-bottom-radius($accordion-inner-border-radius);
      }
    }

    .accordion-collapse-page {
      @include border-bottom-radius($accordion-border-radius);
    }
  }
}


.accordion-body-page {
 background-color: #F2F2F2;
 padding: 2rem 2rem !important;
}

.akkImage {
 max-width: 100%;
}

/* Additional Akkordeon changes */

button, .button {
  white-space: normal !important;
}

@media screen and (max-width: 670px){
 button, .button {
  height: auto !important;
 }
}


.accordion-page {
 font-size: 16px !important;
}



/* Shadow */

.nero-shadow {
	box-shadow: 0 0 25px rgba(27,27,27,0.2)!important;
}

.nero-shadow:hover {
	box-shadow: 0 0 25px rgba(27,27,27,0.4)!important;
}

/*.nero-shadow {
	box-shadow: 5px 5px 15px 10px lightgrey!important;
}

.nero-shadow:hover {
	box-shadow: 5px 5px 15px 10px lightgrey!important;
}*/

/* style icon */

/*.inner-addon {
position: absolute;
padding: 10px;
pointer-events: none;
display: none;
right:10px;
color:red;
}
*/

.fa-exclamation-triangle {
  position: absolute;
  padding: 10px;
  pointer-events: none;
  display: none;
  right: 10px;
  color: red;
}

/*
.inner-addon {
  position: absolute;
  padding: 10px;
  pointer-events: none;
  display: none;
  right: 10px;
  color:green;
}
*/

.fa-check {
  position: absolute;
  padding: 10px;
  pointer-events: none;
  display: none;
  right: 10px;
  color: green;
}

.custom-checkbox, .custom-control-input:checked~, .custom-control-label::after{
  color: green;
}

#customCheck1 {
  color:green;
}

.form-control:focus {
  box-shadow: none;
}

/* align icon */
.left-addon {
  left:  0px;
}

.right-addon {
  right: 0px;
}


/* add padding  */
.left-addon input  {
  padding-left:  30px;
}

.right-addon input {
  padding-right: 30px;
}

/* Modal Download */
.modal-backdrop.in {
  opacity: 0.7 !important;
}

/* SALES ELEMENT */
.alert-red {
  color: #FFFFFF;
  background-color: #ED1C24;
  /*border-color: #707070;*/
  border-color: transparent;
}

.alert-black {
  color: #FFFFFF;
  background-color: #1B1B1B;
  /*border-color: #707070;*/
  border-color: transparent;
}

.alert-yorange {
  color: #1B1B1B;
  background-color: #FDB03B;
  /*border-color: #707070;*/
  border-color: transparent;
}

.alert-3percent {
  padding-left: 3%;
  padding-right: 3%
}

.alert-6percent {
  padding-left: 6%;
  padding-right: 6%;
}

.dflex_jcenter {
  display: flex;
  justify-content: center;
  align-items: center;
}


.dflex_jcenter_mob {
  display: flex;
  align-items: center;
 }

@media screen and (max-width: 992px){
.dflex_jcenter_mob {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1rem;
 }

.iconmargin {
  margin-bottom: 1rem;
 }
}

/* close */
.alert-btn-close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.5em 0.5em;
  color: #000;
  background-color: unset;
  background-image: url("/nero-com-wAssets/img/banners/2022/overlay_campaigns/closeX.svg");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  /*background-size: cover;*/
  border: 0;
  border-radius: 0.25rem;
  opacity: 1;
}

.alert-btn-close:hover {
  background-color: unset;
  background-image: url("/nero-com-wAssets/img/banners/2022/overlay_campaigns/closeX_light.svg");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
	/*background-size: cover; */
}

/* alert timer */

#countdown2 .timer {
    margin: 5px;
    padding: 5px;
    font-size: 16px;
    border-radius: 10%;
    cursor: pointer;
    color: black;
    font-weight: 700;
}

/* alert 1rem */
.timermargin {
  margin-top: 14px;
  margin-bottom: 6px;
}


 }

@media screen and (max-width: 992px){
  .timermargin {
  margin-top: 2rem;
 }
}

.bg-black {
  background-color: #1B1B1B;
  color: white !important;
}

.black-font {
  color: #1B1B1B !important;
  font-weight: 700;
  font-size: 16px;
}