@font-face {
    font-family: "HomepageBaukasten-Book";
    src: local("HomepageBaukasten-Book"), url(../fonts/HomepageBaukasten-Book.ttf) format("truetype");
}

@font-face {
    font-family: "Humanist521BT-Roman";
    src: local("Humanist521BT-Roman"), url(../fonts/Humanist521BT-Roman.otf) format("opentype");
}

@font-face {
    font-family: "Humanist777BT-RomanB";
    src: local("Humanist777BT-RomanB"), url(../fonts/Humanist777BT-RomanB.otf) format("opentype");
}

@font-face {
    font-family: "Humanist777BT-BoldCondensedB";
    src: local("Humanist777BT-BoldCondensedB"), url(../fonts/Humanist777BT-BoldCondensedB.otf) format("opentype");
}

@font-face {
    font-family: "Humanist777BT-RomanCondensedB";
    src: local("Humanist777BT-RomanCondensedB"), url(../fonts/Humanist777BT-RomanCondensedB.otf) format("opentype");
}

@font-face {
    font-family: "Humanist777BT-BlackCondensedB";
    src: local("Humanist777BT-BlackCondensedB"), url(../fonts/Humanist777BT-BlackCondensed.ttf) format("truetype");
}

@font-face {
    font-family: "Humanist777LightBT";
    src: local("Humanist777LightBT"), url(../fonts/Humanist777LightBT.ttf) format("truetype");
}

@font-face {
    font-family: "HelveticaNeue-Regular";
    src: local("HelveticaNeue-Regular"), url(../fonts/HelveticaNeue-Regular.ttf) format("truetype");
}

// Import Tajawal font
@font-face {
    font-family: "Tajawal-Black";
    src: local("Tajawal-Black"), url(../fonts/Tajawal-Black.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-Bold";
    src: local("Tajawal-Bold"), url(../fonts/Tajawal-Bold.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-ExtraBold";
    src: local("Tajawal-ExtraBold"), url(../fonts/Tajawal-ExtraBold.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-ExtraLight";
    src: local("Tajawal-ExtraLight"), url(../fonts/Tajawal-ExtraLight.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-Light";
    src: local("Tajawal-Light"), url(../fonts/Tajawal-Light.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-Medium";
    src: local("Tajawal-Medium"), url(../fonts/Tajawal-Medium.ttf) format("truetype");
}

@font-face {
    font-family: "Tajawal-Regular";
    src: local("Tajawal-Regular"), url(../fonts/Tajawal-Regular.ttf) format("truetype");
}

// Font class
.font-HomepageBaukasten-Book {
    font-family: 'HomepageBaukasten-Book';
}
.font-Humanist521BT-Roman {
    font-family: 'Humanist521BT-Roman';
}
.font-Humanist777BT-RomanB {
    font-family: 'Humanist777BT-RomanB';
}
.font-Humanist777BT-BoldCondensedB {
    font-family: 'Humanist777BT-BoldCondensedB';
}
.font-Humanist777BT-RomanCondensedB {
    font-family: 'Humanist777BT-RomanCondensedB';
}
.font-Humanist777BT-BlackCondensedB {
    font-family: 'Humanist777BT-BlackCondensedB';
}
.font-Humanist777LightBT {
    font-family: 'Humanist777LightBT' !important;
}
.font-HelveticaNeue-Regular {
    font-family: 'HelveticaNeue-Regular';
}
.font-Tajawal-Black {
    font-family: 'Tajawal-Black';
}
.font-Tajawal-Bold{
    font-family: 'Tajawal-Bold';
}
.font-Tajawal-ExtraBold {
    font-family: 'Tajawal-ExtraBold';
}
.font-Tajawal-ExtraLight {
    font-family: 'Tajawal-ExtraLight';
}
.font-Tajawal-Light {
    font-family: 'Tajawal-Light';
}
.font-Tajawal-Medium {
    font-family: 'Tajawal-Medium';
}
.font-Tajawal-Regular {
    font-family: 'Tajawal-Regular';
}

$primary-color: #ebc850;
$secondary-color:#1fb82e;
a:hover {
    color: initial;
    text-decoration: none;
}

.border-color {
    border-color: #dedede !important;
}

.container-fluid {
    width: 100%;
    padding-right: 25px;
    padding-left: 25px;
    margin-right: auto;
    margin-left: auto;
}

.full-width,
.aboutUsPage,
.humanKnowCoffee,
.benefitsAndHarms,
.preparationPage,
.galleryPage,
.productPage {
    max-width: 100%;
    margin: 0 auto;
}

a {
    color: initial;
    text-decoration: none;
    background-color: transparent;
}

.br-1px {
    border-right: 1px solid;
}

.ngx-gallery-icon {
    color: red;
    background: blue;
}

gallery-item {
    padding: 2em;
    border: 2px solid $primary-color !important;
}

.ml-1em {
    margin-left: 1em;
}

.border {
    border: 1px solid;
}

.roundedCorner {
    border-radius: 30px;
}

.mt-1em {
    margin-top: 1em;
}

.mt-2em {
    margin-top: 2em;
}

.pr-0 {
    padding-right: 0;
}

.pl-0 {
    padding-left: 0;
}

.section {
    padding: 2em 0;
}

.d-flex {
    display: flex;
}

.justify-center {
    justify-content: center;
}

.align-center {
    align-items: center;
}

// .g-backdrop {
//     background-color: #1d1d1b !important;
// }

gallery-thumbs {
    display: none !important;
}

.select-gender{
    // width: 80px;
    overflow: hidden;
}
.select-gender select{
    text-indent: 15px;
    text-overflow: '';
    width: 90%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 2px 2px 2px 2px;
    border: none;
    background: transparent url("http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png") no-repeat 230px !important ;
}
// .preparationPage .active:after {
//     content: ' \25B4';
//     position: absolute;
//     font-family: font-awesome;
//     top: 1.65em;
//     left: 5.7em;
// }
 .modal-open .modal {
    display: flex !important;
    align-items: center !important;
    .modal-dialog {
      flex-grow: 1;
    }
  }
.our-branch-address {
    .accordion>.card>.card-header {
        padding: 0;
        background-color: $primary-color !important;
    }
    .panelTitle {
        font-size: 1.25rem;
        line-height: 1.25rem;
    }
    .btn.btn-link {
        font-weight: 500;
        color: #1d1d1b;
        font-size: 1.5rem;
        line-height: 2.5rem;
    }
    .btn.btn-link:focus {
        box-shadow: none !important;
        text-decoration: none;
    }
}

.g-btn-close {
    display: none;
}

path {
    fill: #bc8033;
}
@media(min-width:767px){
    .navbar-expand-md .navbar-nav .nav-link {
        padding-right: 0.3rem !important;
        padding-left: 0.3rem !important;
        font-size: 16px !important;
    }
}
@media(max-width:2560px){
    .webView{
       background-size: cover !important;
    }
}

.direction_ltr {
    direction: ltr !important;
}

.iti {
    width: 100%
}

button.close {
    padding: 0.5em !important;
    border: none !important;
}

.btn_primary {
    background: #432919;
    color: #ebc850;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.text-primary {
    color: $primary-color !important;
}

.min-height-10 {
    min-height: 10em;
}

// google autocomplete dropdown
.pac-container {
    background-color: #fff;
    position: absolute!important;
    z-index: 9999999999;
    border-radius: 2px;
    border-top: 0;
    font-family: Roboto, "Helvetica Neue", sans-serif;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
    font-size: 16px;
    color: $primary-color
}

.pac-logo:after {
    content: "";
    padding: 1px 1px 1px 0;
    height: 16px;
    text-align: right;
    display: block;
    background-image: url(https://maps.gstatic.com/mapfiles/api-3/images/powered-by-google-on-white3.png);
    background-position: right;
    background-repeat: no-repeat;
    background-size: 120px 14px
}

.hdpi.pac-logo:after {
    background-image: url(https://maps.gstatic.com/mapfiles/api-3/images/powered-by-google-on-white3_hdpi.png)
}

.pac-item {
    cursor: default;
    padding: 4px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 30px;
    text-align: left;
    border-top: 0;
    font-size: 13px;
    color: #999;
    font-family: Roboto, "Helvetica Neue", sans-serif;
}

.pac-item:hover {
    background-color: #fafafa
}

.pac-item-selected,
.pac-item-selected:hover {
    background-color: #ebf2fe
}

.pac-matched {
    font-weight: 700
}

.pac-item-query {
    font-size: 16px;
    padding-right: 3px;
    color: $primary-color
}

.pac-icon {
    width: 15px;
    height: 20px;
    margin-right: 7px;
    margin-top: 6px;
    display: inline-block;
    vertical-align: top;
    background-image: url(https://maps.gstatic.com/mapfiles/api-3/images/autocomplete-icons.png);
    background-size: 34px
}

.hdpi .pac-icon {
    background-image: url(https://maps.gstatic.com/mapfiles/api-3/images/autocomplete-icons_hdpi.png)
}

.pac-icon-search {
    background-position: -1px -1px
}

.pac-item-selected .pac-icon-search {
    background-position: -18px -1px
}

.pac-icon-marker {
    background-position: -1px -161px
}

.pac-item-selected .pac-icon-marker {
    background-position: -18px -161px
}

.pac-placeholder {
    color: gray
}

.form-control:focus {
    box-shadow: 0 0 0 0.05rem #9f9f9f;
}

//Pagination
.page-link {
    border-color: #432919 !important;
    color: #432919 !important;
}
.page-item.active .page-link {
    background-color: #432919 !important;
    border-color: #432919 !important;
    color: #ebc850 !important;
}

.b-0 {
    bottom: 0px;
}

.loader_section {
    display: flex;
    height: 100vh;
    align-items: center;
}

.loader,
.loader:before,
.loader:after {
  background: $primary-color;
  -webkit-animation: load1 1s infinite ease-in-out;
  animation: load1 1s infinite ease-in-out;
  width: 1em;
  height: 4em;
}
.loader {
  color: $primary-color;
  text-indent: -9999em;
  margin: 88px auto;
  position: relative;
  font-size: 11px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.loader:before,
.loader:after {
  position: absolute;
  top: 0;
  content: '';
}
.loader:before {
  left: -1.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 1.5em;
}
@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
