@font-face {
  font-family: "Almarai";
  src: url("fonts/ar/Almarai-Light.eot");
  src: url("fonts/ar/Almarai-Light.eot?#iefix") format("embedded-opentype"),
    url("fonts/ar/Almarai-Light.woff2") format("woff2"),
    url("fonts/ar/Almarai-Light.woff") format("woff"),
    url("fonts/ar/Almarai-Light.ttf") format("truetype"),
    url("fonts/ar/Almarai-Light.svg#Almarai-Light") format("svg");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Almarai";
  src: url("fonts/ar/Almarai-Regular.eot");
  src: url("fonts/ar/Almarai-Regular.eot?#iefix") format("embedded-opentype"),
    url("fonts/ar/Almarai-Regular.woff2") format("woff2"),
    url("fonts/ar/Almarai-Regular.woff") format("woff"),
    url("fonts/ar/Almarai-Regular.ttf") format("truetype"),
    url("fonts/ar/Almarai-Regular.svg#Almarai-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: "Almarai";
  background: #f9fafc;
  margin: 0;
  padding: 0;
  color: #333;
}

p {
  font-family: "Almarai";
}
.connection-types {
  justify-content: right;
}
.popup h3 {
  text-align: right;
}
.popup .close {
  left: 30px;
  right: auto;
}
.button {
  font-family: "Almarai";
  font-weight: bold;
}
.button1 {
  font-family: "Almarai";
  font-weight: normal;
}
h4 {
  font-family: "Almarai";
}
.connection-types input[type="radio"]:checked + .type-circle span {
  font-family: "Almarai";
}
.type-circle span {
  font-family: "Almarai";
}
.wtr {
  background-position: right;
  padding-left: 0;
  padding-right: 24px;
}
.elec {
  background-position: right;
  padding-left: 0;
  padding-right: 24px;
}
.request-btn {
  font-family: "Almarai";
  font-weight: bold;
}
.popup input {
  font-family: "Almarai";
}
.popup .submit {
  font-family: "Almarai";
  font-weight: bold;
}
.thank-you button {
  font-family: "Almarai";
  font-weight: bold;
}

/* ----------------------------
   New CSS
-----------------------------*/

.meter-value {
  text-align: right;
}

.section h3 span {
  margin-right: 0;
  margin-left: 8px;
}
.sersel {
  font-family: "Almarai";
}

.tooltipcost .tooltip-text {
    left: 18px!important;
}

.notes {
    margin-right: 53px!important;
}


@media (min-width: 1370px) {
    /* your styles here */
    .v2 .breadcrumb-links
    {
        margin-top: 9%;
    }
}

.sersel {
    width: 100%;
    padding: 15px 10px 15px 40px;
    border: 1px solid #dbdbdb;
    border-radius: 8px;
    font-size: 14px;
    color: #8f8f8f;
    background-color: #efefef;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url(data:image/svg+xml;utf8,<svg fill='black' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>);
    background-repeat: no-repeat;
    background-position: left 12px center;
    background-size: 18px;
    cursor: pointer;
    text-align: right;
}



    /*

@media (min-width: 1200px) and (max-width: 1370px) {

    .breadcrumb {
        margin-top: 12% !important;
    }
}

@media (min-width: 1000px) and (max-width: 1100px) {
    .breadcrumb {
        margin-top: 8% !important;
    }
}


@media (min-width: 1300px) {

    .breadcrumb {
        margin-top: 8% !important;
    }
}



*/