/* Custom CSS */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap');

body {
    font-family: 'Open Sans', sans-serif;
    overflow-x: hidden;
}

h2 {
  font-family: 'Open Sans', sans-serif;
}

.accordion{
  border-radius: 0% !important;
}

.card-header {
  background-color: transparent !important;
  border: none !important;
}

.card {
  border: none !important;
}

.img-detail-product {
  width: 420px;
}

.btn-primary {
  background-color: #0049B7;
  color: #ffffff;
  border: #0049B7;
  border-radius: 0% !important;
}

.navbar.scrolled {
  -webkit-box-shadow: 0 8px 6px -6px #999;
  -moz-box-shadow: 0 8px 6px -6px #999;
  box-shadow: 0 8px 6px -6px #999;

  /* the rest of your styling */
}

.search-product {
  border-top: none;
  border-left: none;
  border-right: none;
}

.sticky-offset {
  top: 56px;
}

.custombold-text {
  font-family: 'Open Sans', sans-serif;
}

.cardsidebar {
  border: none;
}

.text-black {
  font-family: 'Open Sans', sans-serif;
  color: #000000;
}

img.logo {
    margin-top:3px;
    width: 100px !important;
    -webkit-filter: brightness(0) invert(1);
    filter: brightness(0) invert(1);
}

img.logoproduct {
  margin-top:3px;
  width: 100px !important;
}

img.logo.scrolled {
  -webkit-filter: brightness(0) invert(0);
  filter: brightness(0) invert(0);
}

.logo-customer {
  width: 150px !important;
}

.img-about {
  width: 100% !important;
}

.img-about2 {
  width: 96.3% !important;
}

#landing {
    background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url(../img/SBM-header.png);
    background-size : cover;
}

#aboutus {
  background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url(../img/about-header.png);
  background-size : cover;
  opacity: 1;
}

#gallery {
  background-image: linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) ), url(../img/gallery-header.png);
  background-size : cover;
  opacity: 1;
}

#contactus {
  background-image: linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) ), url(../img/contact-illustration.png);
  background-size : cover;
  opacity: 1;
}

#news {
  background-image: linear-gradient( rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) ), url(../img/news-illustration.png);
  background-size : cover;
  opacity: 1;
}

#aboutus-company {
  background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ), url(../img/ewige-header-aboutus2.png);
  background-size : cover;
  opacity: 1;
}

#value {
  background-image: url(../img/ewige-value.png);
  background-size : cover;
}

#customer {
  background-color: rgb(233, 233, 233);
  background-size : cover;
}

#contact {
  background-color: rgb(0, 0, 0);
  background-size : cover;
}

h1 {
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
}

.jumbo-text {
  font-size: 4em;
}

.title-news {
  font-size: 2.5em;
}

.medium-text {
  font-size: 3em;
  color: #ffffff;
  font-family: 'Montserrat Black', sans-serif;
}

.h-txt {
  padding: 10% 0 10% 0;
}

.h-txtabout {
  padding: 10% 0 0 0;
}

.aboutillustration {
  width: 100%;
}

.h-cust {
  padding: 8% 0 8% 0;
}

.small-text {
  font-size: 0.8em;
}

.btn-seeproduct {
  background-color:#CA191E;
  border : solid #CA191E;
  border-radius: 0%;
  width: 200px;
}

.btn-seeproduct:hover {
  background-color:rgb(177, 24, 29);
  border : solid rgb(177, 24, 29);
}

.btn-brand {
  background-color:#CA191E;
  border : 0.9px solid #CA191E;
  border-radius: 0%;
  width: 100%;
}

.btn-brand:hover {
  background-color:rgb(177, 24, 29);
  border : 0.9px solid rgb(177, 24, 29);
}

.btn-view {
  background-color: transparent !important;
  border: 0.9px solid #CA191E;
  color: #000000;
  border-radius: 0%;
  width: 100%;
}

.btn-view:hover {
  background-color: transparent !important;
  border: 0.9px solid #CA191E;
  color: #CA191E;
}

.btn-viewmore {
  background-color: transparent !important;
  border: 0.9px solid #CA191E;
  color: #000000;
  border-radius: 0%;
  width: 209px;
}

.btn-viewmore:hover {
  background-color: transparent !important;
  border: 0.9px solid #CA191E;
  color: #CA191E;
}

.btn-contact {
  background-color:#CA191E;
  border : solid #CA191E;
  border-radius: 0%;
  width: 100%;
}

.btn-contact:hover {
  background-color:rgb(177, 24, 29);
  border : solid rgb(177, 24, 29);
}


.mt-6{
  margin-top: 4.5rem !important;
}

.mt-7{
  margin-top: 6rem !important;
}

.mt-8{
  margin-top: 7.5rem !important;
}

.mt-9{
  margin-top: 9rem !important;
}

.mb-6{
  margin-bottom: 4.5rem !important;
}

.mb-7{
  margin-bottom: 6rem !important;
}

.mb-8{
  margin-bottom: 7.5rem !important;
}

.mb-9{
  margin-bottom: 9rem !important;
}

.pl-6 {
  padding-left: 4.5rem !important;
}

.pl-7 {
  padding-left: 6rem !important;
}

.ml-6 {
  margin-left: 4.5rem !important;
}

.ml-7 {
  margin-left: 6rem !important;
}

.ml-8 {
  margin-left: 7.5rem !important;
}

.ml-9 {
  margin-left: 9rem !important;
}

.ml-10 {
  margin-left: 10.5rem !important;
}

.ml-11 {
  margin-left: 12rem !important;
}

.ml-12 {
  margin-left: 13.5rem !important;
}

.ml-13 {
  margin-left: 15rem !important;
}

.highlight {
  color: #FFCF00;
  font-family: 'Montserrat Black', sans-serif;
}

.bg-navbarproduct {
  background-color: #ffffff !important;
  color: #000000 !important;
}

.bg-navbarproduct.scrolled {
  background-color: #ffffff !important;
  color: #000000 !important;
}

.bg-transparent.scrolled {
  background-color: #ffffff !important;
  color: #000000 !important;
}

a.nav-link.scrolled {
  color: #000000 !important;
}

i.fa-shopping-cart.scrolled {
  color: #000000 !important;
}

.navbar-toggler {
  background-color: #0049B7 !important;
}

.text-sbm {
  color: #0049B7;
}

.img-newsdetail {
  width: 600px;
  height: 500px;
}

.iconsize {
  width: 18px;
}

a {
  text-decoration: none !important;
}


.wrapper-line:before,.wrapper-line:after{
  content:" ";
  width: 38.7%;
  height: 0.5px;
  margin: 0 10px;
  vertical-align: auto;
  background-color:rgb(180, 180, 180);
  display:inline-block;
}

.form-control {
  border-radius: 0%;
  height: calc(1.6em + 1.75rem + 3px);
}

/* Button Outline Custom */
.btn-outline-secondary {
  color: #ffffff;;
  border-color: #ffffff;
  border-radius: 0%;
}

.btn-outline-secondary:hover {
  color: #ffffff;;
  background-color: #0049B7;
  border-color: #0049B7;
}

.btn-outline-secondary:focus, .btn-outline-secondary.focus {
  box-shadow: 0 0 0 0.2rem #ffffff;
}

/* Button Outline Custom 2 */
.btn-outline2-secondary {
  color: #000000;;
  border-color: #0049B7;
  border-radius: 0%;
}

.btn-outline2-secondary:hover {
  color: #ffffff;;
  background-color: #0049B7;
  border-color: #0049B7;
}

.btn-outline2-secondary:focus, .btn-outline-secondary.focus {
  box-shadow: 0 0 0 0.2rem #ffffff;
}

/* Search */


/*Footer custom*/
.footers a {color:#696969;}
.footers p {color:#696969;}
.footers ul {line-height:30px;}
.copyright, .border {
  background-color: #000000;
}
#social-fb:hover {
  color: #3B5998;
  transition:all .001s;
}
#social-tw:hover {
  color: #4099FF;
  transition:all .001s;
}
#social-gp:hover {
  color: #d34836;
  transition:all .001s;
}
#social-em:hover {
  color: #f39c12;
  transition:all .001s;
}

/*Button Secondary Custom*/
.btn-secondary {
  color: #fff;
  background-color: #0049B7;
  border-color: #0049B7;
  border-radius: 0%;
}

.btn-secondary:hover {
  color: #fff;
  background-color: #0041a1;
  border-color: #0041a1;
}

.btn-secondary:focus, .btn-secondary.focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 101, 189, 0.5);
  background-color: #0041a1;
  border-color: #0041a1;
}

.btn-secondary.disabled, .btn-secondary:disabled {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #545b62;
  border-color: #4e555b;
}

.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
}

.img-layer1 {
  z-index: -1;
  width: 200px;
}

.img-layer2 {
  display: flex;
  width: 180px;
  margin-top: -330px;
  margin-left: 20%;
}

.img-layer3 {
  display: flex;
  width: 220px;
  z-index: 1000;
  margin-top: -100px;
  margin-left: 45%;
}

@media only screen and (max-width: 600px) and (min-width: 300px)  {
  .jumbo-text {
    font-size: 2.5em;
  }
  .title-news {
    font-size: 1.5em;
  }
}

.container-news {
  width: 100%;
  padding-right: 20%;
  padding-left: 20%;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-news {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container-news {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container-news {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container-news {
    max-width: 1140px;
  }
}

.mobile-view{display: none;}

@media screen and (max-width: 768px) {

.mobile-view {display: block;}

}