:root {
    font-family: 'Almarai', sans-serif;

    --thm-gray: #737373;
    --thm-gray-rgb: 115, 115, 115;
    --thm-primary: #9d9482;
    --thm-primary-rgb: 157, 148, 130;
    --thm-black: #000000;
    --thm-black-rgb: 0, 0, 0;
}

body {
    text-align: right;
}

.form-control::placeholder {
    text-align: right;
}

.row {
    --bs-gutter-x: 30px;
}

.gutter-y-30 {
    --bs-gutter-y: 30px;
}

body {
    font-family: 'Almarai', sans-serif;

    color: var(--thm-gray);
    font-size: 18px;
    line-height: 34px;
    font-weight: 400;
}

body.locked {
    overflow: hidden;
}

a {
    color: var(--thm-gray);
}

a,
a:hover,
a:focus,
a:visited {
    text-decoration: none;
}

::placeholder {
    color: inherit;
    opacity: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--thm-black);
    margin: 0;
}

dl,
ol,
ul {
    margin-top: 0;
    margin-bottom: 0;
}

::placeholder {
    color: inherit;
    opacity: 1;
}


.page-wrapper {
    position: relative;
    margin: 0 auto;
    width: 100%;
    min-width: 300px;
    overflow: hidden;
}

.container {
    padding-left: 15px;
    padding-right: 15px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {

    .page-title {
        position: relative;
        padding: 80px 0;
        background-size: contain;
        background-position: center center;
        background-repeat: no-repeat;
    }



}


@media (min-width: 1200px) {

  
    .container {
        max-width: 1200px;
    }
}

::placeholder {
    color: inherit;
    opacity: 1;
}

/*** 

====================================================================
			Page Title
====================================================================

***/

.page-title {
    position: relative;
    padding: 110px 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.page-title:before {
    content: '';
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: #000000;
    opacity: .70;
    position: absolute;
}

.page-title .inner-container {
    position: relative;
}

.page-title .title-box {
    position: relative;
    float: left;
    margin-top: 40px;
}

.page-title h1 {
    position: relative;
    display: block;
    font-size: 48px;
    color: #ffffff;
    line-height: 50px;
    font-weight: 500;
    margin-bottom: 35px;
}

.page-title .title {
    position: relative;
    display: block;
    font-size: 24px;
    line-height: 40px;
    color: #ffffff;
    font-weight: 400;
}

.page-title .bread-crumb {
    position: relative;
    float: right;
    padding-top: 0px;
}

.page-title .bread-crumb li {
    position: relative;
    float: left;
    font-size: 18px;
    line-height: 30px;
    color: #cfd0d2;
    font-weight: 700;
    text-transform: capitalize;
    cursor: default;
    padding-right: 10px;
    margin-right: 10px;
    list-style-type: none;

}

.page-title .bread-crumb li:before {
    position: absolute;
    right: -2px;
    font-size: 16px;
    line-height: 30px;
    color: #ffffff;
    content: "-";
}

.page-title .bread-crumb li:last-child:before {
    display: none;
}

.page-title .bread-crumb li a {
    color: #ffffff;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.page-title .bread-crumb li a:hover {
    color: #cfd0d2
}

.page-title .title-box {
    position: relative;
    float: right;
    margin-top: 40px;
}

/*req qoute*/
.request-quote-section {
    background-image: linear-gradient(to right bottom, grey, rgb(48 48 48));
    background-size: cover;
    background-position: top;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-top-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    border: none;



    color: white;
}

.request-quote-section label {
    color: white;
    font-weight: bold;
}

.request-quote-section h2 {
    color: white;
}

.card {
    box-shadow: 0px 0px 16px 4px #000000a8;
    order: 2;
}



.appointment-sec2 {
    order: 1;
}

.card img {
    border-radius: 10px;
}

.map iframe {
    border-radius: 20px;
}

.left {
    order: 2;
}

.right {
    order: 1;
}

.two-section-bg::before {
    background-color: white !important;
}

.section-title__title {
    margin: 0;
    font-weight: 500;
    color: #f9fafb !important; 
    font-size: 50px;
    position: relative;
    line-height: 60px;
    text-transform: uppercase;
}