@font-face {
  font-family: streamline-small;
  src: url(css/streamline-small.woff);
}
body {
  line-height: 1.2;
}

body a:focus-visible { outline:none !important; }

.card,
.nav-tabs .nav-link,
.btn {
  border-radius: 0 !important;
}

.nav-tabs .nav-link {
  border: none !important;
}

.card {
  border: none;
}

#headerContainer {
  z-index: 1001;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.4);
  position: fixed;
  top: 0;
  width: 100%;
}
#headerContainer a.navbar-brand {
  position: relative;
  top: -38px;
  height: 104px;
  transition: all 0.4s;
}
#headerContainer a.navbar-brand img {
  transition: all 0.4s;
  width: 303px;
}
#headerContainer.sticky a.navbar-brand {
  overflow: visible;
}
@media (min-width: 992px) {
  #headerContainer.sticky a.navbar-brand {
    top: -28px !important;
    height: 50px;
  }
  #headerContainer.sticky a.navbar-brand img {
    width: 212px;
  }
}

.dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0;
}

#navbarSupportedContent a.nav-link:hover,
.topMenu a.nav-link:hover {
  color: #C22622 !important;
}
#navbarSupportedContent .configuratorAcoperis a.nav-link:hover,
.topMenu .configuratorAcoperis a.nav-link:hover {
  color: white !important;
}

.topMenu li.configuratorAcoperis a.nav-link {
  color: white !important;
}

.form-control[type=checkbox] {
  margin-top: 0.5em !important;
  height: 1.2em !important;
}

.headerContainer {
  background-color: #fff;
}
.headerContainer .navbar.navbarMainMenu {
  padding: 0 !important;
}
.headerContainer .navbar.navbarMainMenu > .row {
  display: grid;
}
.headerContainer .navbar.navbarMainMenu > .row > * {
  grid-row: 1;
}

.topMenu {
  background: #c3e1f9 url(../images/topMenuBg.png) repeat-y top left;
  height: 42px;
}
.topMenu .topMenuInner {
  max-width: 1700px;
  margin: 0 auto;
  width: 100%;
  display: flex;
}
.topMenu .topMenuInner nav.navbar {
  padding-top: 0px;
}
.topMenu .topMenuInner a.nav-link {
  color: #0E2C56;
}

.pagesMenu {
  float: right;
}
.pagesMenu .nav-link {
  padding-top: 0.7rem;
}

.teSunamNoiText {
  color: #0E2C56;
  font-family: "Exo 2", sans-serif;
  font-weight: normal;
  margin-right: 3px;
  align-items: center;
  display: flex;
  font-size: 17px;
  padding-top: 6px;
}
.teSunamNoiText a {
  color: #C22622 !important;
  font-size: 24px;
  font-weight: bold;
  font-family: "Exo 2", sans-serif;
  margin: 0 0 0 10px;
}
.teSunamNoiText span.comma {
    color: #C22622 !important;
    font-size: 24px;
    font-weight: bold;
    font-family: "Exo 2", sans-serif;
}
.teSunamNoiText a:hover {
  text-decoration: none;
}

#tel_sunane2 { margin-right:10px;}

.teSunamNoiInput {
  width: 160px !important;
  background: white url(../images/inputRightArrow.png) no-repeat center right !important;
  padding-right: 30px !important;
  border: none;
  margin-top: 2px;
  font-size:16px !important;
}

li.configuratorAcoperis {
  background: url(../images/configuratorAcoperisBG.png) no-repeat top;
  width: 123px;
  height: 44px;
  padding-left: 35px !important;
  padding-top: 5px;
}
li.configuratorAcoperis:hover {
  background: url(../images/configuratorAcoperisBG.png) no-repeat bottom;
}
li.configuratorAcoperis a.nav-link {
  color: white !important;
  text-align: left;
  font-size: 12px !important;
  padding-top: 2px !important;
}

.navbarMainMenu {
  max-width: 1700px;
  margin: 0 auto;
}
.navbarMainMenu .row {
  width: 100%;
}
.navbarMainMenu li.nav-item a {
  font-weight: bold;
  font-size: 18px;
  text-transform: uppercase;
  color: #2B2B2B !important;
  font-family: "Nunito Sans", sans-serif;
}

.mainSlide {
  background: url(../images/banner-tectum.jpg) no-repeat center center;
  background-size: cover;
  height: 650px;
  padding-top: 150px;
  padding-bottom: 150px;
  box-sizing: border-box;
}
.mainSlide .card  {
  background-color: rgba(14, 44, 86, 0.8);
  background-blend-mode: multiply;
  padding: 55px;
  text-align: center;
  max-width: 840px;
  margin: 0 auto;
}
.mainSlide .card h1 {
  color: white;
  font-size: 54px;
  font-weight: 700;
  margin-bottom: 20px;
  font-family: "Exo 2", sans-serif;
}
.mainSlide .card h1 span {
  color: #C22622;
}
.box-home-mesaj-promo .cardWrapper {
    max-width: 1700px !important;
    margin: 40px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

.box-home-mesaj-promo .cardWrapper .card {
   /* background: url(../images/tigla-metalica-bilka-clasic-promo-banner.jpg) no-repeat;*/
    background-size:cover;
    background-color:transparent !important;
    width: 100%;
    height: 500px;
}

.box-home-mesaj-promo-details .card {
    background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-clasic-promo-details.jpg") no-repeat center center;
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .cardWrapper .card {
        /*background: url('../images/01-11-22-WTB-campanie-folie-NOV-2022-360x600-MOBILE.jpg') !important;*/
        background-size: auto;
        background-size: cover !important;
    }

    .box-home-mesaj-promo-details .card {
        background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-clasic-promo-details-mobile.jpg") no-repeat center left;
    }
}



.box-home-mesaj-promo-details2 .card {
    background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-balcanic-promo-details.jpg") no-repeat center center;
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .cardWrapper .card {
        /*background: url('../images/01-11-22-WTB-campanie-folie-NOV-2022-360x600-MOBILE.jpg') !important;*/
        background-size: auto;
        background-size: cover !important;
    }

    .box-home-mesaj-promo-details2 .card {
        background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-balcanic-promo-details-mobile.jpg") no-repeat center left;
    }
}



.box-home-mesaj-promo-details3 .card {
    background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-britanic-promo-details.jpg") no-repeat center center;
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .cardWrapper .card {
        /*background: url('../images/01-11-22-WTB-campanie-folie-NOV-2022-360x600-MOBILE.jpg') !important;*/
        background-size: auto;
        background-size: cover !important;
    }

.box-home-mesaj-promo-details3 .card {
        background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-britanic-promo-details-mobile.jpg") no-repeat center left;
    }
}



.box-home-mesaj-promo-details4 .card {
    background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-gotic-promo-details.jpg") no-repeat center center;
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .cardWrapper .card {
        /*background: url('../images/01-11-22-WTB-campanie-folie-NOV-2022-360x600-MOBILE.jpg') !important;*/
        background-size: auto;
        background-size: cover !important;
    }

.box-home-mesaj-promo-details4 .card {
        background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-gotic-promo-details-mobile.jpg") no-repeat center left;
    }
}



.box-home-mesaj-promo-details5 .card {
    background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-hellenic-promo-details.jpg") no-repeat center center;
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .cardWrapper .card {
        /*background: url('../images/01-11-22-WTB-campanie-folie-NOV-2022-360x600-MOBILE.jpg') !important;*/
        background-size: auto;
        background-size: cover !important;
    }

.box-home-mesaj-promo-details5 .card {
        background: url("https://www.tectumsteel.ro/images/tigla-metalica-bilka-hellenic-promo-details-mobile.jpg") no-repeat center left;
    }
}



.box-home-mesaj-promo .card a {
    background: #EC1B23 !important;
    padding: 15px 25px;
    text-align: center;
    max-width: 220px;
    margin: 20px auto;
    margin-bottom:10px !important;
    text-shadow: none;
    border: none !important;
    color: #fff !important;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    font-size:16px !Important;
}

.box-home-mesaj-promo a:hover {
    text-decoration: none !important;
}
.box-home-mesaj-promo a .card h1 {
    color: #EC1B23 !important;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 0px;
    font-family: "Exo 2", sans-serif;
    text-decoration: none !important;

}

.box-home-mesaj-promo .monthlyPromo {
    color: #ee7916 !important;
    font-size:28px !Important;
}
.box-home-mesaj-promo .monthlyPromo2 {
    color:#fff !important;
    font-size:35px !Important;
}


.supplierCardsWrapper {
  background-color: #EEEEEE;
  width: 100%;
}
.supplierCardsWrapper .supplierCards {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  position: relative;
  top: -55px;
  /*height: 0px;*/
  max-width: 1420px !important;
  margin: 0 auto;
}
.supplierCardsWrapper .supplierCards .card {
  width: 240px;
  height: 105px;
  border: none !important;
  z-index: 10;
  margin: 0px 10px 20px 10px;
}

.productCards {
  background-color: #EEEEEE;
  padding-top: 0px;
  padding-bottom: 75px;
}
.productCards .cardWrapper {
  max-width: 1700px !important;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
.productCards .cardWrapper .card {
  width: 265px;
  height: 356px;
  overflow: hidden;
  margin-bottom: 20px;
}
.productCards .cardWrapper .card .imageContainer {
  height: 185px;
  /*position:relative;*/
  width: 100%;
}
.productCards .cardWrapper .card .imageContainer img {
  width: 100%;
}
.productCards .cardWrapper .card .copyContainer {
  background-color: white;
  color: #0E2C56;
  text-align: center;
  height: 190px;
  padding-top: 20px;
  position: relative;
  width: 100%;
}
.productCards .cardWrapper .card .copyContainer h2 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  font-size: 28px;
  margin-bottom: 0px;
}
.productCards .cardWrapper .card .copyContainer p {
  line-height: 1.1em;
  font-size: 14px;
  margin: 0px 10px 15px 10px;
}
.productCards .cardWrapper .card .copyContainer p span {
  font-size: 24px;
}
.productCards .cardWrapper .card .copyContainer p.priceLine {
  color: #2B2B2B !important;
}
.productCards .cardWrapper .card .copyContainer:before {
  position: absolute;
  content: "";
  width: 51%;
  height: 28px;
  top: -15px;
  left: -1px;
  background: white;
  transform: skewY(10deg);
}
.productCards .cardWrapper .card .copyContainer:after {
  position: absolute;
  content: "";
  width: 51%;
  height: 28px;
  top: -15px;
  right: -1px;
  background: white;
  transform: skewY(-10deg);
}
.productCards .cardWrapper .card .copyContainer:hover, .productCards .cardWrapper .card .copyContainer:hover:before, .productCards .cardWrapper .card .copyContainer:hover:after {
  background-color: #C3E1F9;
}
.productCards .cardWrapper .card .copyContainer .bubbleModelsWrapper {
  height: 0px;
  overflow: visible;
}
.productCards .cardWrapper .card .copyContainer .bubbleModels {
  background-color: #C22622;
  border-radius: 50%;
  text-align: center;
  position: relative;
  top: -70px;
  left: 185px;
  margin-right: 15px;
  color: white;
  font-family: "Exo 2", sans-serif;
  font-size: 12px;
  z-index: 12;
  width: 60px;
  height: 60px;
  line-height: 1em;
  padding-top: 14px;
}
.productCards .cardWrapper .card .copyContainer .bubbleModels span {
  font-size: 32px;
  font-weight: 700;
}
.productCards .cardWrapper .card.mainProduct .copyContainer:before, .productCards .cardWrapper .card.mainProduct .copyContainer:after {
  background-color: #0E2C56;
}
.productCards .cardWrapper .card.mainProduct .copyContainer {
  background-color: #0E2C56;
  color: white;
}
.productCards .cardWrapper .card.mainProduct .copyContainer:hover, .productCards .cardWrapper .card.mainProduct .copyContainer:hover:before, .productCards .cardWrapper .card.mainProduct .copyContainer:hover:after {
  background-color: #C3E1F9;
  color: #0E2C56;
}

/* color box tooltips */
.tooltipWrapper {
  position: relative;
}

.tooltipWrapper:hover {
  z-index: 999999;
  cursor: pointer;
}

.tooltipWrapper .tooltip-span {
  display: none;
}

.tooltipWrapper:hover .tooltip-span {
  display: flex;
  justify-content: center;
  background-color: white;
  position: fixed;
  overflow: hidden;
  width: 350px;
  height: 350px;
  border: 1px solid #000;
  border-radius: 5px;
}

.tooltip-span img {
  max-width: 350px;
  position: relative;
}

.homeContent .productCards .copyContainer h2 {
  height: 60px;
  line-height: 1em;
}
.homeContent .productCards .copyContainer p {
  height: 45px;
}

.whyPick h2 {
  text-align: center;
  font-family: "Exo 2", sans-serif;
  color: #0E2C56;
  font-size: 38px;
  margin: 50px auto;
}
.whyPick .row {
  max-width: 1700px;
  margin: 0px auto;
  padding-bottom: 30px;
}
.whyPick .row .card {
  border: 1px solid #282828;
  overflow: hidden;
  text-align: left;
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  padding: 5px 15px 15px 15px;
  max-width: 380px;
  width: 100%;
  height: 270px;
  position: relative;
  margin: 0 auto 20px auto;
  display: block;
}
.whyPick .row .card .whyPickContent {
  display: flex;
  /*width: 260px;*/
  /*padding-left:10px;*/
}
.whyPick .row .card .whyPickContent .whyPickContentBody {
  flex: 1;
}
.whyPick .row .card .whyPickContent h3 {
  font-size: 22px;
  font-weight: 400;
  margin: 15px 0;
  color: #0E2C56;
}
.whyPick .row .card .whyPickContent p {
  font-size: 16px;
  color: #0E2C56;
  line-height: 20px;
  font-family: "Nunito Sans", sans-serif;
}
.whyPick .row .card .whyPickContent .btn {
  padding: 0 !important;
}
@media (min-width: 992px) {
  .whyPick .row .card .whyPickContent .btn {
    cursor: default !important;
  }
}
.whyPick .row .card .whyPickContent .btn.focus, .whyPick .row .card .whyPickContent .btn:focus, .whyPick .row .card .whyPickContent .btn:hover {
  outline: 0;
  box-shadow: none !important;
  text-decoration: none !important;
}
.whyPick .row .card .cardIcon {
  width: 100px;
  height: 85px;
  /*border-radius: 50%;
  border: 1px solid #0E2C56;*/
  margin: 25px auto 150px auto;
  text-align: center;
  padding-top: 8px;
  overflow: hidden;
  /*background-size:75% !important;*/
}
.whyPick .row .card .cardIcon.cardGamaCompleta {
  background: url(../icons/produse.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardCalitate {
  background: url(../icons/calitate.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardMasuratoriGratuite {
  background: url(../icons/masuratori.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardConsultantaGratuita {
  background: url(../icons/consultanta.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardTransportGratuit {
  background: url(../icons/transport.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardMontaj {
  background: url(../icons/montaj.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardGarantie {
  background: url(../icons/garantie.svg) no-repeat center center;
}
.whyPick .row .card .cardIcon.cardAcoperisuriSpeciale {
  background: url(../icons/acoperisuri.svg) no-repeat center center;
}
.whyPick .row .card .bubblePlusWrapper {
  height: 0px;
  overflow: visible;
  position: absolute;
  bottom: 0px;
  right: 0px;
}
.whyPick .row .card .bubblePlusWrapper .bubblePlus {
  transition: all 0.2s ease-in;
  position: relative;
  right: -25px;
  color: white;
  background-color: #C3E1F9;
  width: 60px;
  height: 60px;
  top: -35px;
  text-align: left;
  padding-left: 20px;
  border-radius: 50%;
  font-size: 16px;
  font-family: "Exo 2", sans-serif;
  font-weight: 700;
  padding-top: 5px;
}
.whyPick .row .card:hover .bubblePlus {
  transform: scale(1.7);
}

.companyMessageWrapper {
  background-color: #C3E1F9;
}

.companyMessage {
  max-width: 1700px;
  margin: 0 auto;
  padding: 30px 20px;
}
.companyMessage .col-6 {
  padding: 30px;
}
.companyMessage h2 {
  margin-top: 6% !important;
  font-size: 36px;
  font-weight: 400;
  margin: 15px 0;
  color: #0E2C56;
  font-family: "Exo 2", sans-serif;
}
.companyMessage p {
  font-size: 18px;
  color: #0E2C56;
  font-family: "Nunito Sans", sans-serif;
}

#testimonialsCarousel {
  max-width: 850px;
  height: 100%;
  min-height: 613px;
  float: right;
  display: flex;
  align-items: center;
}
#testimonialsCarousel h2 {
  margin-bottom: 50px;
}
#testimonialsCarousel .carousel-control-next {
  right: -67px;
  top: 470px;
  width: 52px !important;
  opacity: 1 !important;
}
#testimonialsCarousel .carousel-control-next .carousel-control-next-icon {
  background-image: url("/images/redarrow.png");
  width: 52px;
  height: 85px;
}
@media (max-width: 560px) {
  #testimonialsCarousel {
    float: none !important;
  }
}

.testimonials {
  /*max-width: 1700px;*/
  margin: 0 auto;
  /* min-height:614px;*/
  background-color: #fff;
  /*padding-right:0px !Important;
  padding-left:0px !Important;*/
}
.testimonials .row {
  height: 100%;
}
.testimonials .col-6 {
  padding: 0 30px;
}
.testimonials .col-6:last-of-type {
  padding-right: 0 !important;
}
.testimonials h2 {
  /*margin-top:14% !important;*/
  font-size: 36px;
  font-weight: 400;
  margin: 15px 0;
  color: #0E2C56;
  font-family: "Exo 2", sans-serif;
}
.testimonials p {
  font-size: 18px;
  color: #0E2C56;
  font-family: "Nunito Sans", sans-serif;
}

footer {
  background-color: #0E2C56;
  color: white;
  padding: 55px;
}
footer h2 {
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}
footer p, footer ul, footer li, footer a {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  line-height: 1.8em;
}
footer a {
  color: white !important;
}
footer ul {
  padding-left: 0px;
}
footer ul li {
  list-style: none;
  margin-bottom: 14px;
}

.subFooter {
  background-color: #585857 !important;
  padding: 20px 55px;
}
.subFooter p, .subFooter a {
  color: white;
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
}
.subFooter a {
  color: white !important;
  margin: 0 20px;
}
.subFooter a:hover {
  color: #ccc;
}

.googleMaps {
  /*padding: 0 !important;*/
  max-height: 490px;
}

.contactBoxes, .aboutusBoxes {
  background-color: #EEEEEE;
  margin-left: -15px;
  margin-right: -15px;
}
.contactBoxes .innerDiv, .aboutusBoxes .innerDiv {
  max-width: 1700px;
  margin: 0 auto;
}
.contactBoxes .innerDiv h1, .aboutusBoxes .innerDiv h1 {
  text-align: center;
  font-family: "Exo 2", sans-serif;
  color: #0E2C56;
  font-size: 44px;
  margin: 50px auto;
}
.contactBoxes .innerDiv h3, .aboutusBoxes .innerDiv h3 {
  font-size: 24px;
  font-family: "Nunito Sans", sans-serif;
}
.contactBoxes .innerDiv p, .aboutusBoxes .innerDiv p {
  font-size: 16px;
}
.contactBoxes .innerDiv .card, .aboutusBoxes .innerDiv .card {
  min-height: 220px;
  padding-left: 15px;
  padding-right: 15px;
}
.contactBoxes .innerDiv .card p, .aboutusBoxes .innerDiv .card p {
  line-height: 1.2em;
  color: #353535;
}
.contactBoxes .innerDiv .card h3, .aboutusBoxes .innerDiv .card h3 {
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 24px;
}
.contactBoxes .innerDiv .card a, .aboutusBoxes .innerDiv .card a {
  color: #353535;
}
.contactBoxes .innerDiv .card .cardImage, .aboutusBoxes .innerDiv .card .cardImage {
  width: 85px;
  height: 85px;
  min-height: 85px;
  min-width: 85px;
  /*border-radius: 50%;*/
  /*border:1px solid #0E2C56;*/
  margin: 25px auto;
  text-align: center;
  padding-top: 8px;
  overflow: hidden;
}
.contactBoxes .innerDiv .contactCopy, .aboutusBoxes .innerDiv .contactCopy {
  padding-top: 25px;
}
.contactBoxes .innerDiv .contactCopy p, .aboutusBoxes .innerDiv .contactCopy p {
  font-size: 22px;
  text-align: center;
  font-family: "Nunito Sans", sans-serif;
}
.contactBoxes .innerDiv .contactCopy h3, .aboutusBoxes .innerDiv .contactCopy h3 {
  text-align: center;
  font-family: "Exo 2", sans-serif;
  color: #0E2C56;
  font-size: 36px;
  margin: 65px auto;
  margin-bottom: 20px;
}

.aboutusBoxes {
  padding-bottom: 65px;
}
.aboutusBoxes .innerDiv .card {
  min-height: 290px !important;
}
.aboutusBoxes .innerDiv .col-12 {
  margin-bottom: 15px;
}

.contactBoxes .innerDiv .col-12 {
  margin-bottom: 15px;
}

.contactBanner {
  height: 500px;
  width: 100%;
  background: url(/images/contactBanner.jpg) no-repeat top center;
  background-size: cover;
}

.aboutusBanner {
  height: 500px;
  width: 100%;
  background: url(/images/despre-noi-tectum-steel-cluj-napoca.jpg) no-repeat top center;
  background-size: cover;
}

.wetterbestBanner {
    background: url(/images/WTB-campanie-folie.jpg) no-repeat top center;
    background-size: cover !important;
    position:relative;
}

.productJumbo,
.projectJumbo,
.simulatorJumbo,
.configuratorJumbo,
.pageJumbo,
.articleJumbo {
  padding: 60px;
  background-color: #C3E1F9 !important;
  /*&:not(.projectJumbo) {
      background-color:#C3E1F9 !important;
  }
  &.projectJumbo {
      background-color:#fff !Important;
      padding:20px 0;
  }*/
  margin-bottom: 0px !important;
  /* Hover style */
  /* Focus style */
  /* Set options to normal weight */
}
.productJumbo h1,
.projectJumbo h1,
.simulatorJumbo h1,
.configuratorJumbo h1,
.pageJumbo h1,
.articleJumbo h1 {
  font-family: "Exo 2", sans-serif;
  font-size: 42px;
  margin-bottom: 45px;
  color: #0E2C56;
}
.productJumbo p,
.projectJumbo p,
.simulatorJumbo p,
.configuratorJumbo p,
.pageJumbo p,
.articleJumbo p {
  font-family: "Nunito Sans", sans-serif;
  font-size: 24px;
  color: #282828;
}
.productJumbo label,
.projectJumbo label,
.simulatorJumbo label,
.configuratorJumbo label,
.pageJumbo label,
.articleJumbo label {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  height: 32px;
}
.productJumbo .container,
.projectJumbo .container,
.simulatorJumbo .container,
.configuratorJumbo .container,
.pageJumbo .container,
.articleJumbo .container {
  max-width: 1700px !important;
}
.productJumbo select,
.projectJumbo select,
.simulatorJumbo select,
.configuratorJumbo select,
.pageJumbo select,
.articleJumbo select {
  height: 60px;
  padding-left: 22px;
  text-align: left;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 21px;
  color: #585857;
  display: block;
  line-height: 1.3;
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient.
      for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference

  */
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat, repeat;
  background-position: right 0.7em top 50%, 0 0;
  background-size: 0.65em auto, 100%;
}
.productJumbo select[type=text]:-moz-read-only, .projectJumbo select[type=text]:-moz-read-only, .simulatorJumbo select[type=text]:-moz-read-only, .configuratorJumbo select[type=text]:-moz-read-only, .pageJumbo select[type=text]:-moz-read-only, .articleJumbo select[type=text]:-moz-read-only {
  background-color: #e9ecef;
}
.productJumbo select[type=text]:disabled, .productJumbo select[type=text]:read-only,
.projectJumbo select[type=text]:disabled,
.projectJumbo select[type=text]:read-only,
.simulatorJumbo select[type=text]:disabled,
.simulatorJumbo select[type=text]:read-only,
.configuratorJumbo select[type=text]:disabled,
.configuratorJumbo select[type=text]:read-only,
.pageJumbo select[type=text]:disabled,
.pageJumbo select[type=text]:read-only,
.articleJumbo select[type=text]:disabled,
.articleJumbo select[type=text]:read-only {
  background-color: #e9ecef;
}
.productJumbo select::-ms-expand,
.projectJumbo select::-ms-expand,
.simulatorJumbo select::-ms-expand,
.configuratorJumbo select::-ms-expand,
.pageJumbo select::-ms-expand,
.articleJumbo select::-ms-expand {
  display: none;
}
.productJumbo select:hover,
.projectJumbo select:hover,
.simulatorJumbo select:hover,
.configuratorJumbo select:hover,
.pageJumbo select:hover,
.articleJumbo select:hover {
  border-color: #888;
}
.productJumbo select:focus,
.projectJumbo select:focus,
.simulatorJumbo select:focus,
.configuratorJumbo select:focus,
.pageJumbo select:focus,
.articleJumbo select:focus {
  border-color: #aaa;
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.5);
  color: #222;
  outline: none;
}
.productJumbo select option,
.projectJumbo select option,
.simulatorJumbo select option,
.configuratorJumbo select option,
.pageJumbo select option,
.articleJumbo select option {
  font-weight: normal;
}
.productJumbo .myToolTip,
.projectJumbo .myToolTip,
.simulatorJumbo .myToolTip,
.configuratorJumbo .myToolTip,
.pageJumbo .myToolTip,
.articleJumbo .myToolTip {
  border-radius: 50%;
  width: 24px;
  height: 24px;
  text-align: center;
  color: white;
  background-color: #868686;
  display: inline-block;
  font-family: "Trebuchet MS", serif;
  font-size: 18px;
}
.productJumbo .filterButton,
.projectJumbo .filterButton,
.simulatorJumbo .filterButton,
.configuratorJumbo .filterButton,
.pageJumbo .filterButton,
.articleJumbo .filterButton {
  background-color: #081A34 !important;
  color: white;
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  height: 60px;
  padding-left: 22px;
  margin-top: 40px;
  border-radius: 0;
}
.productJumbo .filterButton:hover,
.projectJumbo .filterButton:hover,
.simulatorJumbo .filterButton:hover,
.configuratorJumbo .filterButton:hover,
.pageJumbo .filterButton:hover,
.articleJumbo .filterButton:hover {
  background-color: #c22622 !important;
  border-color: #c22622 !important;
}

.pageJumbo h1 {
  margin-bottom: 0px !important;
}

.productListWrapper {
  background-color: #EEEEEE;
  padding-top: 50px;
  padding-bottom: 50px;
}

.remainingDescriptionBtn {
  color: #0E2C56;
  border: none;
  border-radius: 0;
}

.description.modal .modal-footer button {
  background: #0E2C56;
}

.articleJumbo {
  height: 20vmax;
  background-size: cover;
  background-position: center;
}

.articleWrapper .titleWrapper {
  padding-bottom: 3rem;
}
.articleWrapper .titleWrapper h1 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  margin: 10px auto;
  position: relative;
  z-index: 5;
}
.articleWrapper .titleWrapper small {
  color: darkgray;
}

.articleFooter {
  width: 100%;
  padding: 2rem;
  background: #eee;
}
.articleFooter h1 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  margin: 10px auto;
  position: relative;
  z-index: 5;
}
.articleFooter .projectList {
  margin: 0 auto !important;
}

.projectList {
  max-width: 1700px;
  margin: 60px auto;
}
.projectList .projectCardWrapper {
  display: flex;
  justify-content: space-between;
}
.projectList .projectCardWrapper .card {
  width: 409px;
  height: 420px;
  margin: 20px auto;
  margin-bottom: 18px;
  overflow: hidden;
}
.projectList .projectCardWrapper .card .imageContainer {
  height: 275px;
  position: relative;
  width: 100%;
  display: flex;
  flex-basis: 275px;
  flex-grow: 0;
  flex-shrink: 0;
  overflow: hidden;
}
.projectList .projectCardWrapper .card .imageContainer img {
  width: 100%;
}
.projectList .projectCardWrapper .card .copyContainer {
  background-color: white;
  color: #282828;
  text-align: center;
  height: 65px;
  padding: 0px 15px;
  position: relative;
  width: 100%;
}
.projectList .projectCardWrapper .card .copyContainer h2 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  font-size: 20px;
  margin: 5px auto;
  position: relative;
  line-height: 1.1em;
  height: 65px;
  z-index: 5;
}
.projectList .projectCardWrapper .card .copyContainer p {
  line-height: 1.1em;
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
  margin: 0px 10px 5px 10px;
  z-index: 5;
  position: relative;
}
.projectList .projectCardWrapper .card .projectButtons {
  width: 92%;
  margin: 10px auto;
}
.projectList .projectCardWrapper .card .projectButtons .btn {
  border-radius: 0px;
}
.projectList .projectCardWrapper .card .projectButtons .btnDetalii {
  background-color: #C3E1F9 !important;
  width: 122px;
  /* height:50px;*/
  padding: 6px !important;
  margin: 0 auto;
  border: 1px solid #C3E1F9;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: #0E2C56;
  transition: all 0.5s ease;
}
.projectList .projectCardWrapper .card .projectButtons .btnDetalii:hover {
  background-color: #0E2C56 !important;
  border: 1px solid #0E2C56;
  color: white;
}

.componentList .productCardWrapper {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: repeat(auto-fill, 135px);
  justify-content: center;
}
.componentList .productCardWrapper .card {
  justify-self: center;
  width: 120px;
  height: 120px;
  margin: 0 5px 10px 5px;
  overflow: hidden;
}
.componentList .productCardWrapper .card .imageContainer {
  height: 120px;
  position: relative;
  width: 100%;
  text-align: center;
  overflow: hidden;
  margin-bottom: 0 !important;
}
.componentList .productCardWrapper .card .imageContainer img {
  width: 100%;
  transition: all 1s ease;
  overflow: hidden;
}
.componentList .productCardWrapper .card .imageContainer img:hover {
  transform: scale(1.1);
}
.componentList .productCardWrapper .card .subProductCopy h2 {
  font-size: 16px;
}
.componentList .productCardWrapper .card .subProductIndex span {
  margin-top: 10px;
  display: block;
  background-color: #C3E1F9;
  width: 38px;
  height: 30px;
  font-family: "Exo 2", sans-serif;
  font-size: 22px;
  text-align: right;
  padding-right: 10px;
  color: #0E2C56;
}

.productList {
  max-width: 1700px;
  margin: 0 auto !important;
}
.productList .productCount {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  text-align: left;
}
.productList .productCardWrapper {
  display: grid;
  grid-template-rows: auto;
  grid-template-columns: repeat(auto-fill, 419px);
  justify-content: center;
  /*&::after {
      content: "";
      flex: auto;
  }*/
}
.productList .productCardWrapper .card {
  justify-self: center;
  width: 409px;
  height: 635px;
  margin: 0 5px 18px 5px;
  /*margin-bottom:18px;*/
  overflow: hidden;
}
.productList .productCardWrapper .card .imageContainer {
  height: 200px;
  position: relative;
  width: 100%;
  text-align: center;
  overflow: hidden;
}
.productList .productCardWrapper .card .imageContainer img {
  width: 100%;
  transition: all 1s ease;
  overflow: hidden;
}
.productList .productCardWrapper .card .imageContainer img:hover {
  transform: scale(1.1);
}
.productList .productCardWrapper .card .copyContainer {
  background-color: white;
  color: #282828;
  text-align: center;
  height: 340px;
  padding-top: 0px;
  position: relative;
  width: 100%;
}
.productList .productCardWrapper .card .copyContainer h2 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  font-size: 30px;
  margin-bottom: 0px;
  position: relative;
  z-index: 5;
}
.productList .productCardWrapper .card .copyContainer p {
  line-height: 1.1em;
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
  margin: 0px 10px 15px 10px;
  z-index: 5;
  position: relative;
}
.productList .productCardWrapper .card .copyContainer p.description {
  min-height: 60px;
}
.productList .productCardWrapper .card .copyContainer:before {
  position: absolute;
  content: "";
  width: 51%;
  height: 56px;
  top: -30px;
  left: -1px;
  background: white;
  transform: skewY(10deg);
  z-index: 1;
}
.productList .productCardWrapper .card .copyContainer:after {
  position: absolute;
  content: "";
  width: 51%;
  height: 56px;
  top: -30px;
  right: -1px;
  background: white;
  transform: skewY(-10deg);
  z-index: 1;
}
.productList .productCardWrapper .card .copyContainer h2 {
  min-height: 85px;
}
.productList .productCardWrapper .card .copyContainer .pricingTableWrapper {
  min-height: 265px;
}
.productList .productCardWrapper .card .copyContainer .pricingTable {
  width: 92%;
  padding: 2px;
  border: 0px;
  margin: 0 auto;
  text-align: left;
  font-size: 15px;
  line-height: 22px;
  font-family: "Nunito Sans", sans-serif;
}
.productList .productCardWrapper .card .copyContainer .pricingTable th {
  font-weight: bold;
}
.productList .productCardWrapper .card .copyContainer .pricingTable tr:nth-child(even) {
  background: #FFF;
}
.productList .productCardWrapper .card .copyContainer .pricingTable tr:nth-child(odd) {
  background: #EEE;
}
.productList .productCardWrapper .card .productButtons {
  width: 92%;
  margin: 20px auto;
}
.productList .productCardWrapper .card .productButtons .col-6:first-of-type {
  padding-left: 0px !important;
}
.productList .productCardWrapper .card .productButtons .col-6:last-of-type {
  padding-right: 0px !important;
}
.productList .productCardWrapper .card .productButtons .btn {
  border-radius: 0px;
}
.productList .productCardWrapper .card .productButtons .btnDetalii {
  background-color: #C3E1F9;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: #0E2C56;
}
.productList .productCardWrapper .card .productButtons .btnDetalii:hover {
  background-color: #0E2C56 !important;
  border-color: #0E2C56 !important;
  color: white !important;
}
@media (max-width: 576px) {
  .productList .productCardWrapper .card .productButtons .btnDetalii {
    font-size: 16px;
  }
}
.productList .productCardWrapper .card .productButtons .btnOferta {
  background-color: #0E2C56;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: white;
}
.productList .productCardWrapper .card .productButtons .btnOferta:hover {
  background-color: #c22622 !important;
  border-color: #c22622 !important;
}
@media (max-width: 576px) {
  .productList .productCardWrapper .card .productButtons .btnOferta {
    font-size: 16px;
  }
}
.newProduct {
    display: inline-block;
    text-align: left;
    height: 0;
    position: relative;
    top:-4px;
    z-index: 999;
}
.newDetailsPage {margin-right:5px;}
.newProduct span,
.newDetailsPage span
{
    display:block;
    font-family: "Exo 2", sans-serif;
    border-radius:50%;
    background-color:#EE231F;
    color:white;
    font-weight:bold;
    font-size:14px;
    text-align:center;
    padding:12px 4px;
    width:40px;
    height:40px;
    rotate: 330deg;
}
.newDetailsPage span {
    display:inline-block;
    margin-left:0px !important;
    position:relative;
    top:-10px !important;
}

.productList .productCardWrapper .card .brandImage {
  text-align: right;
  height: 0px;
  position: relative;
  z-index: 999;
}
.productList .productCardWrapper .card .brandImage img {
  position: relative;
  top: 20px;
}
.productList .productCardWrapper.subProduct {
  text-align: center;
}
.productList .productCardWrapper.subProduct .imageContainer img {
  height: 210px;
  width: auto !important;
  max-width: 100%;
}
.productList .productCardWrapper.subProduct h2 {
  font-family: "Exo 2", sans-serif;
  font-size: 30px;
  height: 50px !important;
  color: #0E2C56;
}
@media (max-width: 576px) {
  .productList .productCardWrapper.subProduct h2 {
    font-size: 22px;
  }
}
.productList .productCardWrapper.subProduct p {
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
  height: 80px !important;
}
.productList .productCardWrapper.subProduct .card {
  height: 550px !important;
}
.productList .productCardWrapper.subProduct .card .subProductCopy {
  padding: 0 15px;
}

.subProductIndex {
  height: 0px;
  overflow: visible;
  position: relative;
  z-index: 10;
}
.subProductIndex span {
  margin-top: 20px;
  display: block;
  background-color: #C3E1F9;
  width: 75px;
  height: 45px;
  font-family: "Exo 2", sans-serif;
  font-size: 30px;
  text-align: right;
  padding-right: 10px;
  color: #0E2C56;
}

.productDetailsSection {
  background-color: #eeeeee;
}

.productDetails.containerWrapper {
  overflow: visible;
  /*height:440px;*/
  background: linear-gradient(180deg, #C3E1F9 440px, #EEE 0px);
  padding-top: 75px;
}
.productDetails > .container-fluid > .row {
  max-width: 1700px;
  margin: 0 auto;
}
.productDetails > .container-fluid > .row h1 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  font-size: 42px;
  margin-bottom: 15px;

}
.productDetails > .container-fluid > .row p {
  line-height: 1.4em;
  font-size: 18px;
  font-family: "Nunito Sans", sans-serif;
}
.productDetails > .container-fluid > .row .descriere h3 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  color: #0E2C56;
  font-size: 21px;
  margin-bottom: 25px;
}
.productDetails > .container-fluid > .row .descriere p {
  line-height: 1.4em;
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
}
.productDetails > .container-fluid > .row .pricingTable {
  max-width: 406px;
  width: 100%;
  margin-right: auto;
  padding: 2px;
  border: 0px;
  text-align: left;
}
.productDetails > .container-fluid > .row .pricingTable th {
  font-weight: bold;
  font-family: "Exo 2", sans-serif;
  font-size: 16px;
}
.productDetails > .container-fluid > .row .pricingTable td {
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
}
.productDetails > .container-fluid > .row .pricingTable tr:nth-child(odd) {
  background: #DBEEFC;
}
.productDetails > .container-fluid > .row .brandImage {
  text-align: right;
  height: 0px;
  position: relative;
  z-index: 999;
}
.productDetails > .container-fluid > .row .brandImage img {
  position: relative;
  right: 0px;
  top: 0px;
}
.productDetails > .container-fluid > .row .imageContainer {
  text-align: center;
  padding: 15px;
  background-color: white;
  margin-bottom: 30px;
}
.productDetails .productWrapperFirstCol {
  min-height: 400px;
}

.remainingDescriptionBtn {
  cursor: pointer;
}

.modal-title {
  text-align: center;
  margin: 0 auto;
  width: 100%;
}

.btnResetFilter {
  background-color: #0E2C56;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: white;
}
.btnResetFilter:hover {
  background-color: #c22622 !important;
  border-color: #c22622 !important;
  color: white !important;
}
@media (max-width: 576px) {
  .btnResetFilter {
    font-size: 16px;
  }
}

.divRate p a {
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: #0E2C56;
}

.rate {
  text-align: right;
  position: relative;
  top: -25px;
}
.rate a {
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: #0E2C56;
}

#avantaje {
  background-color: #fff;
  padding: 20px 10px 10px 10px;
  margin-bottom: 30px;
}
#avantaje .col-4 {
  display: flex;
  align-items: center;
}
#avantaje img {
  width: 85px;
  height: 85px;
  position: relative;
  top: -8px;
}
#avantaje h4 {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  float: left;
  color: #0E2C56 !important;
  padding-left: 0px;
  padding-top: 12px;
  /*display:contents;*/
}
#avantaje .cardIcon {
  width: 80px;
  height: 60px;
  min-width: 60px;
  min-height: 60px;
  float: left;
  /*border-radius: 50%;
  border: 1px solid #0E2C56;*/
  margin: 0 10px 0 0;
  text-align: center;
  padding-top: 8px;
  overflow: hidden;
  /*background-size:75% !important;*/
  background-size: 80% !important;
}
#avantaje .cardIcon.cardGamaCompleta {
  background: url(../icons/produse.svg) no-repeat center center;
}
#avantaje .cardIcon.cardCalitate {
  background: url(../icons/calitate.svg) no-repeat center center;
}
#avantaje .cardIcon.cardMasuratoriGratuite {
  background: url(../icons/masuratori.svg) no-repeat center center;
}
#avantaje .cardIcon.cardConsultantaGratuita {
  background: url(../icons/consultanta.svg) no-repeat center center;
}
#avantaje .cardIcon.cardTransportGratuit {
  background: url(../icons/transport.svg) no-repeat center center;
}
#avantaje .cardIcon.cardMontaj {
  background: url(../icons/montaj.svg) no-repeat center center;
}
#avantaje .cardIcon.cardGarantie {
  background: url(../icons/garantie.svg) no-repeat center left;
}
#avantaje .cardIcon.cardAcoperisuriSpeciale {
  background: url(../icons/acoperisuri.svg) no-repeat center center;
}
#avantaje .cardIcon.cardGarantie {
  width: 65px !important;
}

#simulator {
  background: #EEEEEE url(../images/simulator-banner.jpg) no-repeat top center;
  background-size: cover;
  color: white;
  text-align: center;
  padding: 50px 90px;
  margin-bottom: 30px;
}
#simulator h2 {
  font-family: "Exo 2", sans-serif;
  font-size: 32px;
}
#simulator p {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
}

#paletaCulori .nav-item {
  margin-left: 5px;
  margin-right: 5px;
}
#paletaCulori .nav-item:first-of-type {
  margin-left: 0px !important;
}
#paletaCulori .nav-item:last-of-type {
  margin-right: 0px !important;
}
#paletaCulori .nav-item a {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  padding: 10px 20px;
  background-color: #ddd;
}
#paletaCulori .nav-item a.active {
  color: #174381;
  background-color: #FFFFFF;
}

#paletaCuloriContent {
  padding: 20px;
  background-color: #fff;
  margin-bottom: 40px;
}

#cereOferta {
  background-color: #E0E0E0;
  margin-bottom: 30px;
  padding: 20px;
  /* Hover style */
  /* Focus style */
  /* Set options to normal weight */
}
#cereOferta .col-6 {
  margin-bottom: 10px;
}
#cereOferta input[type=text] {
  height: 60px;
  padding-left: 22px;
  text-align: left;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  color: #585857;
  display: block;
  line-height: 1.3;
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  border: none !important;
}
#cereOferta input[type=text][type=text]:-moz-read-only {
  background-color: #e9ecef;
}
#cereOferta input[type=text][type=text]:disabled, #cereOferta input[type=text][type=text]:read-only {
  background-color: #e9ecef;
}
#cereOferta input[type=checkbox] {
  max-width: 50px;
  float: left;
  margin-top: 3px;
  margin-right: 7px;
}
#cereOferta label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #868686;
  padding-top: 5px;
}
#cereOferta .alert {
  margin-left: 15px;
}
#cereOferta select {
  height: 60px;
  padding-left: 22px;
  text-align: left;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  color: #585857;
  display: block;
  line-height: 1.3;
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient.
      for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference

  */
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat, repeat;
  background-position: right 0.7em top 50%, 0 0;
  background-size: 0.65em auto, 100%;
}
#cereOferta select[type=text]:-moz-read-only {
  background-color: #e9ecef;
}
#cereOferta select[type=text]:disabled, #cereOferta select[type=text]:read-only {
  background-color: #e9ecef;
}
#cereOferta select::-ms-expand {
  display: none;
}
#cereOferta select:hover {
  border-color: #888;
}
#cereOferta select:focus {
  border-color: #aaa;
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.5);
  color: #222;
  outline: none;
}
#cereOferta select option {
  font-weight: normal;
}
#cereOferta select {
  border: none !important;
}
#cereOferta h2 {
  font-family: "Exo 2", sans-serif;
  font-size: 32px;
  color: #0E2C56;
  margin-bottom: 30px;
}
#cereOferta .btn, .bluBtn {
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: white;
  border-radius: 0px;
  padding: 10px 30px;
}
#cereOferta .btn.btnCereOfertaMetal, .bluBtn {
  background-color: #0E2C56;
  display: inline-block;
  margin-top: 4px;
}
#cereOferta .btn.btnCereOfertaMetal:hover, .bluBtn:hover {
  background-color: #C3E1F9 !important;
  border-color: #C3E1F9 !important;
  color: #0E2C56 !important;
}
#cereOferta .btn.btnCereOferta {
  background-color: #0E2C56;
  display: inline-block;
  margin-top: 4px;
}
#cereOferta .btn.btnCereOferta:hover {
  background-color: #C22622 !important;
  border-color: #C22622 !important;
  color: #fff !important;
}
#cereOferta .btn.btnConfigureaza {
  background-color: #C22622;
  color: white;
  display: inline-block;
  margin-top: 4px;
}
#cereOferta .btn.btnConfigureaza:hover {
  background-color: #0E2C56 !important;
  border-color: #0E2C56 !important;
}
#cereOferta .alert.alert-success {
  width: 100%;
  text-align: center;
  font-size: 22px;
}

#elementeComponente {
  margin-bottom: 30px;
}
#elementeComponente h3 {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  margin-bottom: 10px;
  margin-top: 30px;
}

#caracteristiciTehnice {
  margin-bottom: 30px;
}
#caracteristiciTehnice h3 {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  margin-bottom: 10px;
  margin-top: 30px;
}
#caracteristiciTehnice .rowStriped {
  padding: 8px;
}
#caracteristiciTehnice .rowStriped:nth-child(even) {
  background: #FFF;
}
#caracteristiciTehnice .rowStriped:nth-child(odd) {
  background: #EEE;
}
#caracteristiciTehnice .specName,
#caracteristiciTehnice .specValue {
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  color:#555;
}
#caracteristiciTehnice .specName {
  font-weight: 400;
}
#caracteristiciTehnice .btnFisa {
  background-color: #FFF;
  width: 200px;
  height: 50px;
  margin: 0 auto;
  border: 1px solid #0E2C56;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: #0E2C56;
  transition: none !important;
}
#caracteristiciTehnice .btnFisa img.hoverIcon {
  display: none;
}
#caracteristiciTehnice .btnFisa:hover {
  color: white !important;
  background-color: #0E2C56 !important;
}
#caracteristiciTehnice .btnFisa:hover img.main {
  display: none;
}
#caracteristiciTehnice .btnFisa:hover img.hoverIcon {
  display: inline-block;
}
#caracteristiciTehnice .btnFisa .fisaIcon {
  width: 42px;
  height: 42px;
  background: url("../images/fisatehnica.png") no-repeat;
  display: inline-block;
  margin-right: 10px;
}

.productGallery {
  background-color: #EEEEEE;
}
.productGallery h3 {
  font-family: "Exo 2", sans-serif;
  font-size: 21px;
  color: #0E2C56;
  margin-bottom: 30px;
}
.productGallery .container {
  max-width: 1700px !important;
  margin: 0 auto;
}
.productGallery .container-fluid .col-12 {
  padding: 0 !important;
}

.palleteBox {
  width: 115px;
  float: left;
  margin: 5px;
  line-height: 1.1em;
  text-align: center;
}
.palleteBox .colorOption {
  height: 30px;
  width: 100%;
  margin-bottom: 10px;
}
.palleteBox .colorName {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #282828;
  font-weight: bold;
}
.palleteBox .colorDescription {
  font-family: "Nunito Sans", sans-serif;
  font-size: 13px;
  color: #868686;
  font-weight: normal;
}

.projectWrapper {
  max-width: 1072px;
  margin: 0 auto;
}
.projectWrapper .imageContainer,
.projectWrapper .productGallery {
  margin: 30px auto;
}
.projectWrapper .imageContainer img {
  width: 100%;
}

#cereOferta a[name=cere-oferta] {
  top: -110px;
  left: 0;
}
@media (max-width: 991px) {
  #cereOferta a[name=cere-oferta] {
    top: -175px;
  }
}

#te-sunam-btn {
  position: absolute;
  right: 1px;
  top: 3px;
  width: 35px;
  background: white url(../images/inputRightArrow.png) no-repeat center right;
  height: calc(1.5em + .75rem);
  border: 1px solid white;
  border-radius: 0.25rem;
}
@media (max-width: 991px) {
  #te-sunam-btn {
    right: 25px;
  }
}
#te-sunam-btn:hover {
  border: 1px solid gray;
}

.simulatorJumbo {
  padding-bottom: 15% !important;
}

@-webkit-keyframes bounce {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.animated {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: 2;
  -webkit-animation-iteration-count: 2;
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

.toast {
  background-color: rgba(255, 255, 255, 0.9);
  position: fixed;
  top: 2rem;
  right: 0;
  left: 0;
  margin: 0 auto;
  z-index: 1005;
}

.toast-body-success {
  font-weight: bold;
  color: #2B6A37;
  text-align: center;
}

.navbar-toggler {
  z-index: 1005 !important;
}
.navbar-toggler.collapsed {
  scale: 1.3;
}

.navbar-toggler.collapsed .close-icon {
  display: none;
}

.navbar-toggler:not(.collapsed) .navbar-toggler-icon {
  display: inline;
}

.navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2814, 44, 86, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.simulatorContainer {
  max-width: 1400px !important;
  margin-top: -13%;
}
.simulatorContainer img {
  width: 95%;
  vertical-align: middle;
}
.simulatorContainer #main-img {
  margin-top: -7.1%;
}

#simulatorWrapper {
  margin-top: -70px;
}
#simulatorWrapper #paletaCuloriAcoperisContent {
  border-width: 0 1px 1px 1px;
  border-color: #dee2e6;
  border-style: solid;
  padding: 20px;
  background-color: #fff;
  margin-bottom: 40px;
  text-align: center;
}
#simulatorWrapper .tab-pane .palleteBox {
  cursor: pointer;
  transition: all 0.2s;
}
#simulatorWrapper .tab-pane .palleteBox:hover {
  box-shadow: 0 0 10px gray;
}

#configuratorWrapper {
  background: #eee;
  /* Hover style */
  /* Focus style */
  /* Set options to normal weight */
}
#configuratorWrapper h5 {
  font-family: "Exo 2", sans-serif;
  font-size: 24px;
  color: #0E2C56;
  margin-bottom: 1rem;
}
#configuratorWrapper label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #868686;
}
#configuratorWrapper small, #configuratorWrapper p {
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #3A3A3A;
}
#configuratorWrapper input[type=text],
#configuratorWrapper input[type=email] {
  height: 60px;
  padding-left: 22px;
  text-align: left;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #585857;
  display: block;
  line-height: 1.3;
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  border: #eee;
  margin: 0 0 1rem 0;
}
#configuratorWrapper input[type=text][type=text]:-moz-read-only, #configuratorWrapper input[type=email][type=text]:-moz-read-only {
  background-color: #e9ecef;
}
#configuratorWrapper input[type=text][type=text]:disabled, #configuratorWrapper input[type=text][type=text]:read-only,
#configuratorWrapper input[type=email][type=text]:disabled,
#configuratorWrapper input[type=email][type=text]:read-only {
  background-color: #e9ecef;
}
#configuratorWrapper select {
  height: 60px;
  padding-left: 22px;
  text-align: left;
  border-radius: 0;
  font-family: "Nunito Sans", sans-serif;
  font-size: 16px;
  color: #585857;
  display: block;
  line-height: 1.3;
  width: 100%;
  max-width: 100%;
  border: none;
  box-shadow: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: #fff;
  /* note: bg image below uses 2 urls. The first is an svg data uri for the arrow icon, and the second is the gradient.
      for the icon, if you want to change the color, be sure to use `%23` instead of `#`, since it's a url. You can also swap in a different svg icon or an external image reference

  */
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat, repeat;
  background-position: right 0.7em top 50%, 0 0;
  background-size: 0.65em auto, 100%;
}
#configuratorWrapper select[type=text]:-moz-read-only {
  background-color: #e9ecef;
}
#configuratorWrapper select[type=text]:disabled, #configuratorWrapper select[type=text]:read-only {
  background-color: #e9ecef;
}
#configuratorWrapper select::-ms-expand {
  display: none;
}
#configuratorWrapper select:hover {
  border-color: #888;
}
#configuratorWrapper select:focus {
  border-color: #aaa;
  box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.5);
  color: #222;
  outline: none;
}
#configuratorWrapper select option {
  font-weight: normal;
}
#configuratorWrapper select {
  padding-right: 2rem;
  border: #eee;
  margin: 0 0 1rem 0;
  padding-left: 10px !important;
}
#configuratorWrapper > h5 {
  margin-top: 2rem;
  margin-bottom: 1rem;
  color: #0e2c56;
}
#configuratorWrapper > .container {
  max-width: 1500px;
  padding: 2rem;
  margin: 0 auto;
}
#configuratorWrapper .typeConfig {
  padding: 2rem 0;
}
#configuratorWrapper .typeConfig img {
  max-width: 100%;
}
#configuratorWrapper .typeConfig .col-md-3:nth-of-type(2n) {
  padding: 0;
}
#configuratorWrapper .typeConfig .inputWrapper {
  display: flex;
  align-items: center;
}
#configuratorWrapper .typeConfig .inputWrapper label {
  font-size: 16px;
  vertical-align: sub;
}
#configuratorWrapper .typeConfig .inputWrapper .form-group {
  margin: 0;
}
#configuratorWrapper .typeConfig .inputWrapper .form-group.row > div {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
#configuratorWrapper .typeConfig .inputWrapper .form-group.row > div:nth-of-type(2n) {
  display: flex;
  align-items: center;
}
#configuratorWrapper .fullSizeInput {
  margin: 0 15px;
  cursor: pointer;
  width: 90%;
  height: 100%;
  position: absolute;
  opacity: 0;
  left: 0;
  top: 0;
  z-index: 1000;
}

#configuratorWrapper .fullSizeInput ~ img,
#configuratorWrapper .fullSizeInput ~ .imgWrapper {
  width: 100%;
  opacity: 50%;
}
#configuratorWrapper .fullSizeInput:hover ~ img, #configuratorWrapper .fullSizeInput:hover ~ .imgWrapper {
  opacity: 75%;
}
#configuratorWrapper .fullSizeInput:checked ~ label {
  color: #3A3A3A;
}
.grosimeWrapper input:checked ~ label,
.finisajWrapper input:checked ~ label
{
    color: #3A3A3A !important;
}
#configuratorWrapper .fullSizeInput:checked ~ img, #configuratorWrapper .fullSizeInput:checked ~ .imgWrapper {
  opacity: 100%;
}
#typeContainer label {
    font-size:18px !important;
}
#configuratorWrapper .fullSizeInputWithRadio:checked ~ label {
    color: #3A3A3A;
}
#configuratorWrapper .imgWrapper {
  border: 1px solid gray;
  border-radius: 50%;
  background-repeat: no-repeat !important;
  background-size: auto 100% !important;
  background-position: center !important;
}
#configuratorWrapper #brandContainer > div {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
#configuratorWrapper #brandContainer .brand-img-container {
  width: 100px;
  height: 100px;
}
#configuratorWrapper #selectiaTaWrapper h5, #configuratorWrapper #selectiaTaWrapper label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  color: #868686;
  padding-top: 5px;
}
#configuratorWrapper #acceptTcWrapper label {
  font-family: "Nunito Sans", sans-serif;
  font-size: 18px;
  color: #868686;
  padding-top: 5px;
}
#configuratorWrapper #acceptTcWrapper input {
  float: left;
  /*max-width: 40px;*/
  margin-top: 8px;
  margin-right: 2px;
}
#configuratorWrapper #colorContainer .palleteBox {
  position: relative;
}
#configuratorWrapper #colorContainer .fullSizeInput:hover ~ .colorName, #configuratorWrapper #colorContainer .fullSizeInput:hover ~ .colorDescription {
  text-shadow: 0 0 5px gray;
  font-weight: bold;
  color: black;
}
#configuratorWrapper #colorContainer .fullSizeInput:checked ~ .colorName, #configuratorWrapper #colorContainer .fullSizeInput:checked ~ .colorDescription {
  text-shadow: 0 0 10px black;
  font-weight: bold;
  color: black;
}
#configuratorWrapper .btnOferta {
  background-color: #0E2C56;
  text-align: center;
  font-family: "Exo 2", sans-serif;
  font-size: 18px;
  color: white;
  margin: 1rem;
  padding: 1rem 2rem;
  border-radius: 0;
  transition: all 0.2s;
}
#configuratorWrapper .btnOferta:hover {
  background-color: #C22622;
}
#configuratorWrapper hr {
  border: none;
  border-top: 1px solid gray;
}

.socialButtonContainer {
  border-right: 1px solid #ccc;
  padding: 10px 20px;
  width: 100px;
}

.socialButtonWrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid gray;
  border-radius: 50%;
  height: 45px;
  width: 45px;
  margin: 5px auto;
  line-height: 0 !important;
  transition: 0.1s all;
  text-decoration: none !important;
}
.socialButtonWrapper:hover {
  background: #dbdbdb;
}
.socialButtonWrapper i {
  color: #282828;
  font-size: 20px;
}

.overlapChildren {
  display: grid;
}
.overlapChildren > * {
  grid-column-start: 1;
  grid-row-start: 1;
}
.overlapChildren > div:not(.show) {
  pointer-events: none;
}
.overlapChildren .show {
  position: relative;
  z-index: 1000;
}

.contentPage {
  padding-bottom: 25px;
}
.contentPage h2 {
  font-family: "Exo 2", sans-serif;
  font-weight: 400;
  font-size: 22px;
  color: #0E2C56;
  margin-bottom: 15px;
  margin-top: 20px;
  text-align: left;
}
.contentPage p {
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
  text-align: justify;
  margin-top: 10px;
  margin-bottom: 10px;
}

#navbarSupportContentWrapper {
  justify-content: flex-end;
}

.teSunamNoiInput {
  position: relative;
  display: inline-block;
  float: right;
}

.slick-slide {
  max-height: 366px;
  overflow: hidden;
}

.slick-arrow {
  z-index: 1;
}

.slick-next {
  right: 25px !important;
}

.slick-prev {
  left: 25px !important;
}

.multiImages .slick-prev::before,
.multiImages .slick-next::before {
    color:#0E2C56 !important;
    font-size: 28px !important;
}

#callUsForm {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-evenly;
}

.projectDate,
.projectViews {
  text-align: center !important;
  font-family: "Nunito Sans", sans-serif;
  font-size: 14px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 20px;
  width: 100px;
}
.projectDate .projectDay,
.projectViews .projectDay {
  font-size: 32px;
  font-weight: bold;
}

.spanSau {
  display: inline-block;
  margin: 0 5px;
}

.brandDiv {
  float: left;
  position: relative;
  width: 250px;
  margin-right: 25px;
}

.navbar-brand {
    padding-left:15px;
}

.readMore, .readLess { font-weight: bold; color:#0E2C56; cursor: pointer;  }
.minimalView, .readLess { display:none;}

@media (min-width: 992px) {
  .collapse {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
  }

  .collapsing {
    position: relative;
    height: unset !important;
    overflow: hidden;
  }

  #callUsForm {
    display: block;
    height: 100%;
  }
}
@media (min-width: 577px) and (max-width: 768px) {
  footer {
    padding: 20px !important;
  }
}
@media (max-width: 991px) {
  .productDetails.containerWrapper {
    padding-top: 75px !important;
  }

  .productJumbo, .configuratorJumbo {
    padding-top: 32px !important;
  }

    .productJumbo h1, .projectJumbo h1, .simulatorJumbo h1, .configuratorJumbo h1, .pageJumbo h1, .articleJumbo h1 {
        margin-bottom: 15px
    }

    .productJumbo, .projectJumbo, .simulatorJumbo, .configuratorJumbo, .pageJumbo, .articleJumbo {
        padding: 20px 20px 5px 20px;
    }

  #cereOferta h2 {
    font-size: 24px;
  }

  #avantaje {
    padding: 5px 10px 5px 10px;
  }
  #avantaje .col-12 {
    display: flex;
    align-items: center;
  }
  #avantaje h4 {
    font-size: 16px;
    display: contents;
  }
  #avantaje .cardIcon {
    width: 50px;
  }

  #simulatorWrapper {
    margin-top: -50px;
  }

  .headerContainer {
    height: 66px;
  }
  .headerContainer .teSunamNoiText {
    display: inline-block !important;
    text-align: left;
  }
  .headerContainer .teSunamNoiText a {
    margin: 0 !important;
    font-size: 24px;
  }
  .headerContainer .teSunamNoiText a:hover {
    color: #C22622 !important;
  }
  .headerContainer .teSunamNoiInputWrapper {
    position: relative;
    display: inline-block;
    width: 185px;
    text-align: left;
  }

  a.navbar-brand {
    height: 75px !important;
    top: -33px !important;
  }
  a.navbar-brand img {
    max-width: 165px;
    height: auto;
    position: relative;
    top: 10px;
  }

  .topMenu {
    height: 30px !important;
  }

  .navbar-toggler.collapsed {
    scale: 1 !important;
  }

  .navbarMainMenu {
    height: 35px;
  }
  .navbarMainMenu .row {
    display: flex !important;
    justify-content: space-between;
    margin: 0 auto;
  }
  .navbarMainMenu li.nav-item a {
    font-size: 16px;
  }

  .navbar-toggler {
    width: 45px;
    height: 45px;
    padding: 0 !important;
    border-radius: 50% !important;
    border: none !important;
    color: #0E2C56 !important;
    background-color: #fff !important;
    position: relative;
    top: -23px;
    z-index: 100;
  }
  .navbar-toggler:focus {
    outline: none;
  }

  .navbar-nav {
    align-items: center !important;
  }
  .navbar-nav .dropdown-menu {
    border: none !important;
  }

  .pagesMenuMobile hr {
    border-color: #000;
    border-top: 1px solid #000;
    border-bottom: none;
  }
  .pagesMenuMobile li.nav-item a {
    color: #0E2C56 !important;
  }
  .pagesMenuMobile li.configuratorAcoperis {
    background-image: none !important;
    background-color: #C22622 !important;
    width: 240px !important;
    height: 45px !important;
    padding: 10px !important;
    margin: 0 auto;
    color: white !important;
  }
  .pagesMenuMobile li.configuratorAcoperis a.nav-link {
    font-size: 16px !important;
    font-family: "Nunito Sans", sans-serif;
    color: white !important;
    text-align: center;
    padding: 0 !important;
    margin-top: 4px;
  }

  .collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.01s ease;
  }

  #navbarSupportContentWrapper.show {
    position: fixed;
    z-index: 1000;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: white;
    /*padding-top: 30px;*/
    padding-bottom: 125px;
    min-height: 830px;
  }

  #navbarSupportedContent {
    width: 100%;
    /*position: fixed;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;*/
    height: 100%;
    background: #fff;
    z-index: 1001;
    padding-top: 20px;
  }

  #callUs {
    background-color: #C3E1F9;
    padding: 5px 0;
    position: relative;
    z-index: 10;
    top: 66px;
    height: 100%;
    box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.4);
  }

  .jumbotron h1,
.aboutusBoxes .innerDiv h1 {
    font-size: 30px;
  }
  .jumbotron h3,
.aboutusBoxes .innerDiv h3 {
    font-size: 18px;
  }
  .jumbotron p,
.aboutusBoxes .innerDiv p {
    font-size: 16px;
  }
  .jumbotron .col-12,
.aboutusBoxes .innerDiv .col-12 {
    margin-bottom: 15px;
  }

  .aboutUsPage {
    padding-left: 15px;
    padding-right: 15px;
  }

  /*    main {
          margin-top:20px;
      }*/
  .whyPick h2 {
    font-size: 24px !important;
  }
  .whyPick .row .card {
    border: 1px solid #cccccc;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    height: unset !important;
    max-width: 90% !important;
    margin: 0 auto;
  }
  .whyPick .row .card .cardIcon {
    width: 60px;
    height: 40px;
    margin: 15px 0 0 15px;
    /*background-size: 75% !important;*/
  }
  .whyPick .row .card:last-of-type {
    border-bottom: 1px solid #cccccc !important;
  }

  .companyMessage,
.testimonials {
    text-align: center;
  }
  .companyMessage h2,
.testimonials h2 {
    font-size: 24px !important;
  }
  .companyMessage p,
.testimonials p {
    font-size: 16px !important;
  }

  .subFooter {
    text-align: center;
    padding: 10px !important;
  }
  .subFooter p {
    margin: 0px !important;
  }

  footer {
    text-align: center !important;
    padding: 15px !important;
  }
  footer a {
    font-size: 15px !important;
    line-height: 1.4em !important;
  }


    #te-sunam-btn {
        height: 24px !important;
        border: 1px solid transparent;
    }
    .teSunamNoiInput {
        height: 25px !important;
    }
    .teSunamNoiText {
        padding-top:0px !important;
    }
    #callUs {
        height: 55px !important;
    }

    .headerContainer.sticky #callUs {
        top:32px !important;
    }

    .headerContainer.sticky .teSunamNoiText,
    .headerContainer.sticky .teSunamNoiInputWrapper > span {
        font-size:13px !important;
    }
}
@media (max-width: 1200px) {
  .btnCereOferta, .btnCereOfertaMetal {
    width: 100%;
    display: block !important;
    margin: 0 0 10px 0 !important;
  }

  .btnConfigureaza {
    width: 100%;
    display: block !important;
    margin: 0 !important;
  }

  .spanSau {
    display: none;
  }
}
.attachLabel {
  display: inline-block;
}
.attachLabel .btn {
  font-size: 16px !important;
  padding: 2px 10px !important;
  background-color: #fff !important;
  border-color: #0E2C56 !important;
  color: #0E2C56 !important;
}
.attachLabel .btn:hover {
  color: white !important;
  background-color: #0E2C56 !important;
}

@media (max-width: 576px) {
  .productDetails.containerWrapper {
    background: linear-gradient(180deg, #C3E1F9 495px, #EEE 0px);
    padding-top: 75px;
  }

  .productDetails > .container-fluid > .row h1 {
    font-size: 30px !important;
    display: inline-block !important;
  }

  #simulatorWrapper {
    margin-top: -30px;
  }

  .productCardWrapper {
    display: flex !important;
    flex-wrap: wrap;
    flex-flow: row wrap;
  }

  /*.productDetails.containerWrapper {
      padding-top: 15px;
  }*/
  .productDetails > .container-fluid > .row h1 {
    font-size: 24px;
  }
  .productDetails > .container-fluid > .row p {
    font-size: 16px;
  }
  .productDetails > .container-fluid > .row .brandImage img {
    top: 0px;
  }
  .productDetails.productTablaCutata > .container-fluid > .row .brandImage img {
    top: -35px !important;
  }


  .rate {
    top: 0px;
  }

  #cereOferta .btn {
    font-size: 14px;
    padding: 10px 5px;
  }
  #cereOferta .btn label {
    font-size: 14px;
  }

  .mainSlide {
    height: 520px;
    padding-top: 16px;
    padding-bottom: 0px;
    box-sizing: border-box;
  }
  .mainSlide .card {
    background-color: rgba(14, 44, 86, 0.8);
    background-blend-mode: multiply;
    padding: 40px 0;
    text-align: center;
    max-width: 330px;
    margin: 0 auto;
  }
  .mainSlide .card h1 {
    color: white;
    font-size: 24px;
    margin-bottom: 5px;
    font-family: "Exo 2", sans-serif;
    font-weight: 700;
  }
  .mainSlide .card h1 span {
    color: #C22622;
  }

  .projectWrapper {
    padding: 0 40px !important;
  }

  #cereOferta {
    padding: 15px !important;
  }
  #cereOferta input[type=text], #cereOferta input[type=email] {
    height: auto !important;
    padding-left: 10px;
    font-size: 14px;
    line-height: 1.2;
  }
  #cereOferta select {
    height: auto !important;
    font-size: 14px;
    padding: 6px 2rem 7px 10px !important;
  }
  #cereOferta h2 {
    font-size: 20px;
    margin-bottom: 15px;
  }

  #avantaje .cardIcon {
    width: 30px;
  }

  #avantaje .cardIcon {
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    margin: 0 !important;
  }

    #avantaje .cardIcon.cardGarantie {
        width: 40px !important;
    }

    .navbar-brand {
        padding-left:0px;
    }

    .fullView { display: none; }
    .minimalView { display: block; }

    .productJumbo label, .projectJumbo label, .simulatorJumbo label, .configuratorJumbo label, .pageJumbo label, .articleJumbo label {
        font-size: 16px;
        height: 20px;
    }

    .productJumbo select, .projectJumbo select, .simulatorJumbo select, .configuratorJumbo select, .pageJumbo select, .articleJumbo select {
        height: 34px;
        padding-left: 16px;
        font-size: 15px;
    }

    .productJumbo .filterButton, .projectJumbo .filterButton, .simulatorJumbo .filterButton, .configuratorJumbo .filterButton, .pageJumbo .filterButton, .articleJumbo .filterButton {
        font-size: 16px;
        height: 40px;
        margin-top: 15px;
    }

    .productList .productCardWrapper .card {
        margin-bottom: 55px;
    }

    .productList .productCardWrapper .card {
        min-height: 650px;
        height: auto;
    }

    #caracteristiciTehnice .btnFisa {
        width:100% !important;
    }

    #simulator {
        padding: 50px 20px !important;
    }

    .readLess { display:inline-block !important;}

    .productList .productCardWrapper .card .copyContainer h2 {
        font-size: 27px !important;
    }

    .productList .productCardWrapper .card .imageContainer {
        height: 165px;
    }

    .teSunamNoiInput {
        width: 100% !important;
    }
    #te-sunam-btn {
        right: 0px !important;
    }

    #callUsForm {
        justify-content: space-between !important;
        padding:0 15px !important;
    }
    .headerContainer .teSunamNoiText a {
        font-size: 22px !important;
    }

    .palleteBox {
        width: 95px !important;
    }

    .productDetails .productWrapperFirstCol h1 img {
        position:relative;
        top:-90px !important;
    }
    .newDetailsPage span {
        top:-5px !important;
    }
}
@media (min-width: 577px) and (max-width: 991px) {

    .navbar-brand {
        padding-left:0px;
    }

  /*.whyPickContent {
      width: 255px !important;
  }*/
  #callUs {
    padding: 5px 0 !important;
    top: 66px !important;
    /*height: 70px !important;*/
  }

  .productDetails > .container-fluid > .row h1 {
    font-size: 30px !important;
  }

  .jumbotron h1,
.aboutusBoxes .innerDiv h1 {
    font-size: 30px;
  }
  .jumbotron h3,
.aboutusBoxes .innerDiv h3 {
    font-size: 18px;
  }
  .jumbotron p,
.aboutusBoxes .innerDiv p {
    font-size: 16px;
  }
  .jumbotron .col-12,
.aboutusBoxes .innerDiv .col-12 {
    margin-bottom: 15px;
  }

  .aboutUsPage {
    padding-left: 15px;
    padding-right: 15px;
  }

  .mainSlide {
    height: 550px;
    padding-top: 100px;
    padding-bottom: 100px;
    box-sizing: border-box;
  }
  .mainSlide .card {
    background-color: rgba(14, 44, 86, 0.8);
    background-blend-mode: multiply;
    padding: 45px;
    text-align: center;
    max-width: 640px;
    margin: 0 auto;
  }
  .mainSlide .card h1 {
    color: white;
    font-size: 36px;
    margin-bottom: 10px;
    font-family: "Exo 2", sans-serif;
    font-weight: 700;
  }
  .mainSlide .card h1 span {
    color: #C22622;
  }

  .companyMessage,
.testimonials {
    text-align: center;
  }
  .companyMessage h2,
.testimonials h2 {
    font-size: 36px !important;
  }
  .companyMessage p,
.testimonials p {
    font-size: 18px !important;
  }

  .aboutusBoxes .innerDiv .card h3 {
    font-size: 20px;
  }

  .aboutusBoxes .innerDiv p {
    font-size: 15px;
  }
}
@media (max-width: 1200px) {
  .pagesMenu .nav-link {
    line-height: 1.1em;
  }

  .nav-link {
    font-size: 14px !important;
    padding-right: 0.3rem !important;
    padding-left: 0.3rem !important;
  }

    #paletaCulori .nav-item a.nav-link {
        font-size: 15px !important;
    }
}
@media (max-width: 1400px) {
  .projectList .projectCardWrapper .card .copyContainer h2 {
    font-size: 20px;
  }
}
.invalid-feedback {
  font-size: 100% !important;
  margin-bottom: 12px;
}

.toast {
  z-index: 10000 !important;
}

@media (min-width: 768px) and (max-width: 992px) {
  .navbarMainMenu {
    height: 35px !important;
  }

  .headerContainer {
    height: 66px !important;
  }

  #callUs {
    padding: 5px 0 !important;
    top: 66px !important;
    /*height: 70px !important;*/
  }

  .productDetails > .container-fluid > .row h1 {
    font-size: 30px !important;
  }

  .navbarMainMenu li.nav-item a {
    font-size: 14px !important;
  }

  .supplierCardsWrapper .supplierCards .card {
    width: 180px !important;
    height: 86px !important;
  }
  .supplierCardsWrapper .supplierCards .card img {
    width: 180px !important;
    height: 86px !important;
  }

  .aboutusBoxes .innerDiv h3 {
    font-size: 22px;
  }

  .whyPick .row .card .cardIcon {
    width: 80px;
    height: 60px;
  }

  .testimonialImg {
    min-height: 375px;
  }

  #testimonialsCarousel {
    min-height: auto;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .productJumbo label, .projectJumbo label, .simulatorJumbo label, .configuratorJumbo label, .pageJumbo label, .articleJumbo label {
    font-size: 18px;
  }

  .productJumbo select, .projectJumbo select, .simulatorJumbo select, .configuratorJumbo select, .pageJumbo select, .articleJumbo select {
    padding-left: 5px;
    font-size: 16px;
    height: 40px;
  }

  .productJumbo .filterButton, .projectJumbo .filterButton, .simulatorJumbo .filterButton, .configuratorJumbo .filterButton, .pageJumbo .filterButton, .articleJumbo .filterButton {
    font-size: 18px;
    height: 40px;
  }

  /*    main {
          padding-top:30px;
      }*/
  .productDetails > .container-fluid > .row .brandImage img {
    top: 0px !important;
  }

  #avantaje h4 {
    font-size: 16px !important;
  }
  #avantaje .cardIcon {
    width: 60px !important;
  }

  .contactCopy p {
    font-size: 15px !important;
  }
  .contactCopy h3 {
    font-size: 30px !important;
  }

  .brandDiv {
    width: 150px;
    margin-right: 15px;
  }

  .fullSizeInput, .sameHeightAsWidth {
    max-width: 120px !important;
    margin: 0 auto !important;
  }

  .tiglaWrapper label {
    margin-top: 10px;
  }

  #configuratorWrapper select {
    height: 40px !important;
    padding-left: 5px !important;
  }

  #configuratorWrapper input[type=text],
#configuratorWrapper input[type=email] {
    height: 40px !important;
    padding-left: 5px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #headerContainer a.navbar-brand {
    top: -28px;
    height: 104px;
  }
  #headerContainer a.navbar-brand img {
    width: 212px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (min-width: 992px) {
  #headerContainer.sticky a.navbar-brand {
    top: -22px !important;
    height: 50px;
  }
  #headerContainer.sticky a.navbar-brand img {
    width: 170px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  nav.pagesMenu ul li.nav-item {
    padding: 0 5px;
  }
  nav.pagesMenu ul li.nav-item a.nav-link {
    text-align: center;
    padding-top: 6px !important;
    /*display:inline-grid !important;*/
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .navbarMainMenu li.nav-item a {
    font-size: 14px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .companyMessage > div:first-of-type {
    display: flex;
    align-items: center;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .productDetails > .container-fluid > .row h1 {
    font-size: 30px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #avantaje {
    padding: 5px !important;
  }
  #avantaje h4 {
    font-size: 16px !important;
  }
  #avantaje .cardIcon {
    width: 60px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #cereOferta h2 {
    font-size: 24px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .palleteBox {
    width: 95px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .contactCopy p {
    font-size: 15px !important;
  }
  .contactCopy h3 {
    font-size: 30px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .brandDiv {
    width: 150px;
    margin-right: 15px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .fullSizeInput, .sameHeightAsWidth {
    max-width: 120px !important;
    margin: 0 auto !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .tiglaWrapper label {
    margin-top: 10px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #configuratorWrapper select {
    height: 40px !important;
    padding-left: 5px !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #configuratorWrapper input[type=text],
#configuratorWrapper input[type=email] {
    height: 40px !important;
    padding-left: 5px !important;
  }
}

.text-hero-folie {
    font-family: 'Roboto', sans-serif;
    position: absolute;
    top: 50%;
    left: 10%;
    color: #fff;
    text-shadow: 1px 1px #000;
}
.text-hero-folie h3 {
    font-size: 3em;
}
.text-hero-folie span {
    color: #00a94f;
}
.text-hero-folie p {
    font-size: 1.5em;
}


.folieContent p { margin-bottom:2em;}

/*.box-home-mesaj-promo .caption span {
    color: #00A94F;
}*/

.box-promo-title .caption {
    font-weight: bold;
    font-size: 45px;
    line-height: 45px;
}
.box-home-mesaj-promo .caption {

    text-shadow: 2px 2px #333;
    background-color:rgba(0,0,0,0.4) !important;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s;
    transition: all 0.7s cubic-bezier(0.32, 0.34, 0, 1.62) 0.6s;
    position: relative;
    display: block;
    width:60%;
    top: 20%;
    left: auto;
    right:auto;
    margin:0 auto;
    text-align: left;
    padding: 5px 25px;
    font-style: normal;
    font-weight: bold;
    font-size: 45px;
    line-height: 45px;
    color: #fff;

    opacity: 1;
    z-index: 1;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
}
.box-home-mesaj-promo-details .caption {
    top: 10% !important;
    width:85%;
}
.box-home-mesaj-promo-details .cardWrapper .card {
    height:350px;
}
.box-home-mesaj-promo-details .monthlyPromo {
    color: #ee7916 !important;
    font-size:24px !Important;
}
.box-home-mesaj-promo-details .monthlyPromo2 {
    color:#fff !important;
    font-size:27px !Important;
}

@media (max-width: 1199px) {
    .box-home-mesaj-promo .caption {
        width:90%;
        top: 5%;
        font-size:32px;
        line-height: 32px;
    }
    .box-home-mesaj-promo .monthlyPromo {
        font-size:24px !Important;
    }
    .box-home-mesaj-promo .monthlyPromo2 {
        font-size:28px !Important;
    }
}

@media (max-width: 991px) {
    .box-home-mesaj-promo .caption {
        width:95%;
        top: 5%;
        font-size:32px;
        line-height: 32px;
    }
    .box-home-mesaj-promo .monthlyPromo {
        font-size:22px !Important;
    }
    .box-home-mesaj-promo .monthlyPromo2 {
        font-size:26px !Important;
    }
}

@media (max-width: 767px) {
    .box-home-mesaj-promo .caption {
        width:95%;
        top: 5%;
        font-size:32px;
        line-height: 32px;
    }
    .box-home-mesaj-promo .monthlyPromo {
        font-size:18px !Important;
    }
    .box-home-mesaj-promo .monthlyPromo2 {
        font-size:22px !Important;
    }

    .box-home-mesaj-promo-details .caption {
        top: 0% !important;
        width: 95% !important;
        line-height: 30px;
    }
    .box-home-mesaj-promo-details .monthlyPromo2 {
        font-size:18px !Important;
        line-height:16px !important;
    }
}

a > span.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    content: "";
    border-bottom: 4px solid #0E2C56;
    border-right: 4px solid transparent;
    border-top: 0 dotted;
    border-left: 4px solid transparent;
}

a.collapsed > span.caret {
    border-top: 4px solid #0E2C56;
    border-right: 4px solid transparent;
    border-bottom: 0 dotted;
    border-left: 4px solid transparent;
}

.toast-body {
    padding: 3rem 1.75rem !important;
    font-size: 1.125rem !important;
    line-height: 1.75rem !important;
}


#filtrare {
    display:none;
}
#filtrare.show {
    display:flex;
}
.filterToggler a {
    font-size:16px !important;
}
@media (min-width: 767px) {
    #filtrare {
        display:flex !important;
    }
    .filterToggler {
        display:none;
    }

}

.cardPayment {
    background:url(/images/Banner-footer-02-final-x.jpg) no-repeat top center;
    background-size: cover;
    min-height:300px;
    padding:60px;
}
.cardPayment h2 {
    font-family: "Exo 2", sans-serif;
    font-size: 40px;
    color:white;
    text-align:left;
    font-weight: bold;
    text-transform: uppercase;
}

.cardPayment p {
    font-family: "Nunito Sans", sans-serif;
    font-size: 16px;
    color:white;
    text-align:left;
}

@media (max-width: 576px) {
    .teSunamNoiText {
        line-height: 1.0em;
    }
    .teSunamNoiInput {
        height: 30px !important;
        margin-top:0px !important;
    }
    #callUs {
        padding:0 !important;
    }
}

.termsfeed-com---nb .cc-nb-main-container {
    padding: 1rem !important;
}

.termsfeed-com---nb .cc-nb-text {
    font-size: 14px !important;
}

.termsfeed-com---palette-dark.termsfeed-com---nb {
    background-color: rgba(20, 20, 20, 0.85) !important;
 }

.valid-feedback {
    font-size:100% !important;
    font-weight:bold !important;
}
#reset-upload.btn {
    font-size: 0.7875rem !important;
    color: #3490dc !important;
    padding: 0px !important;
}
.googleMaps { margin-top:75px !important; margin-bottom:10px !important;}
.googleMaps h3 { height:0; position:relative; top:-50px; }