@charset "UTF-8";

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

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

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

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

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

/*
-----------------------------------------------------------------------
    Start Typography CSS
-----------------------------------------------------------------------
*/
body {
    color: #36454C;    
    font-family: "Tajawal-Medium";
    font-weight: 500;
    font-size: 28px;
    line-height: 34px;
    margin: 0;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: #2E2E2E;
    font-family: "Tajawal-Bold";
    line-height: 1.25;
    margin-bottom: 0;
    margin-top: 0;
}

a {
    color: #595959;
    text-decoration: none;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
}
a:hover, a:active, a:focus {
    color: #FF6433;
    text-decoration: none;
}
a img {
    border: none;
}
img {
    height: auto;
    max-width: 100%;
}

input:focus, textarea:focus,
input:active, textarea:active{
    box-shadow: none !important;
    outline: none !important;
    border-color: #0F4C75 !important;
}

button{
    transition:all 0.3s ease-in-out !important; 
}

button:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
}

p {
    font-weight: 500;
    font-size: 28px;
    line-height: 34px;
    margin-bottom: 20px;
}
p:last-child {
    margin-bottom: 0;
}

:active,
:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none !important;
}

::selection {
    background: #FF764A;
    color: #fff;
    text-shadow: none;
}
::-moz-selection {
    background: #FF764A;
    color: #fff;
    text-shadow: none;
}
::-webkit-selection {
    background: #FF764A;
    color: #fff;
    text-shadow: none;
}

textarea:focus, textarea:active, input:focus, input:active {
    outline: none;
}

pre,
ul,
ol,
dl,
dd,
blockquote,
address,
table,
fieldset {
    margin-bottom: 30px;
}

ul {
    margin: 0;
    padding: 0;
}
ul li {
    list-style: none;
}

table p {
    margin-bottom: 0;
}
/*
-----------------------------------------------------------------------
    End Typography CSS
-----------------------------------------------------------------------
*/

/*
-----------------------------------------------------------------------
    Start Common CSS
-----------------------------------------------------------------------
*/
.container {
    max-width: 98%;
    padding-left: 15px;
    padding-right: 15px;
}
@media only screen and (min-width: 1200px) {
    .container {
        max-width: 1170px;
    }
}

@media only screen and (max-width: 768px) {
    .container {
        max-width: 100%;
    }
}

.row {
    margin-right: -15px;
    margin-left: -15px;
}
.row > [class*=col-] {
    padding-right: 15px;
    padding-left: 15px;
}

/* 1.2 text style */
.text-uppercase {
	text-transform:uppercase;
}

.text-primary{
    color: #FF6433 !important;
}

.text-white{
    color: #fff !important;
}

.text-black{
    color: #1B1A17 !important;
}

.text-gray{
    color: #7E7E7E !important;
}

.text-muted{
    color: #B6B6B6 !important;
}

.text-semibold{
    font-weight: 600;
}

.text-bold{
    font-weight: 700;
}

.text-light{
    font-weight: 300;
}

.space-nowrap{
    white-space: nowrap;
}

.flex-center{
    display: flex;
    justify-content: center;
    align-items: center;
}

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

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

.flex-space{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.flex-col-center{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.flex-space-evenly{
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.flex-column{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.flex-end{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
}

.no-col-gap [class*="col-xs-"],
.no-col-gap [class*="col-sm-"],
.no-col-gap [class*="col-md-"],
.no-col-gap [class*="col-lg-"] {
	padding-left:0;
	padding-right:0;
}	

.row.sm-col-gap{
    margin-right: -5px;
    margin-left: -5px;
}
.sm-col-gap [class*="col-xs-"],
.sm-col-gap [class*="col-sm-"],
.sm-col-gap [class*="col-md-"],
.sm-col-gap [class*="col-lg-"] {
	padding-left: 5px;
	padding-right: 5px;
}

.row.md-col-gap{
    margin-right: -7.5px;
    margin-left: -7.5px;
}
.md-col-gap [class*="col-xs-"],
.md-col-gap [class*="col-sm-"],
.md-col-gap [class*="col-md-"],
.md-col-gap [class*="col-lg-"] {
	padding-left: 7.5px;
	padding-right: 7.5px;
}

.row.lg-col-gap{
    margin-right: -15px;
    margin-left: -15px;
}
.lg-col-gap [class*="col-xs-"],
.lg-col-gap [class*="col-sm-"],
.lg-col-gap [class*="col-md-"],
.lg-col-gap [class*="col-lg-"] {
	padding-left: 15px;
	padding-right: 15px;
}

@media only screen and (min-width: 1200px){
    .col-lg-1-4 {
        width: 20%;
    }

    .col-lg-1-5 {
        width: 20%;
    }

    .col-lg-1-6 {
        width: 16.666%;
    }
}

@media only screen and (min-width: 1300px){
    .col-xl-1-6 {
        width: 16.666%;
    }
}

.fi, .fa{
    display: inline-flex;
}

.somth-effect:hover{
    opacity: 0.7;
}

.text-upercase{
    text-transform: uppercase;
}

.bg-gray{
    background-color: #f1f1f1 !important;
}

.bg-white{
    background-color: #fff !important;
}

.bg-image{
    z-index: 1;
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/*-------- Custom Margin Padding Style Css --------*/

.group-mt-0 > div {margin-top: 0 !important;}

.ma-0 {margin: 0px !important;}.ma-5 {margin: 5px !important;}
.ma-10 {margin: 10px !important;}.ma-15 {margin: 15px !important;}
.ma-20 {margin: 20px !important;}.ma-25 {margin: 25px !important;}
.ma-30 {margin: 30px !important;}.ma-35 {margin: 35px !important;}
.ma-40 {margin: 40px !important;}.ma-45 {margin: 45px !important;}
.ma-50 {margin: 50px !important;}.ma-55 {margin: 55px !important;}
.ma-60 {margin: 60px !important;}.ma-70 {margin: 70px !important;}
.ma-80 {margin: 80px !important;}.ma-90 {margin: 90px !important;}
.ma-100 {margin: 100px !important;}

/*-------- Margin Top Start --------*/
.mt-0 {margin-top: 0px !important;}.mt-5 {margin-top: 5px !important;}.mt-10 {margin-top: 10px;}
.mt-15 {margin-top: 15px;}.mt-20 {margin-top: 20px;}.mt-25 {margin-top: 25px;}
.mt-30 {margin-top: 30px;}.mt-35 {margin-top: 35px;}.mt-40 {margin-top: 40px;}
.mt-45 {margin-top: 45px;}.mt-50 {margin-top: 50px;}.mt-55 {margin-top: 55px;}
.mt-60 {margin-top: 60px;}.mt-65 {margin-top: 65px;}.mt-70 {margin-top: 70px;}
.mt-75 {margin-top: 75px;}.mt-80 {margin-top: 80px;}.mt-85 {margin-top: 85px;}
.mt-90 {margin-top: 90px;}.mt-95 {margin-top: 95px;}.mt-100 {margin-top: 100px;}

@media only screen and (max-width: 1190px) {
    .lg-mt-30 {margin-top: 30px !important;}
}

@media only screen and (max-width: 991px) {
    .md-mt-0 {margin-top: 0 !important;}.md-mt-10 {margin-top: 10px !important;}
    .md-mt-20 {margin-top: 20px !important;}.md-mt-30 {margin-top: 30px !important;}
    .md-mt-40 {margin-top: 40px !important;}.md-mt-50 {margin-top: 50px !important;}
    .md-mt-60 {margin-top: 60px !important;}.md-mt-70 {margin-top: 70px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-mt-0 {margin-top: 0 !important;}.sm-mt-10 {margin-top: 10px !important;}
    .sm-mt-20 {margin-top: 20px !important;}.sm-mt-30 {margin-top: 30px !important;}
    .sm-mt-40 {margin-top: 40px !important;}.sm-mt-50 {margin-top: 50px !important;}
    .sm-mt-60 {margin-top: 60px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-mt-0 {margin-top: 0px !important;}.xs-mt-10 {margin-top: 10px !important;}
    .xs-mt-20 {margin-top: 20px !important;}.xs-mt-30 {margin-top: 30px !important;}
}
/*-------- Margin Top End --------*/

/*-------- Margin Right Start --------*/
.mr-0 {margin-right: 0 !important;}.mr-5 {margin-right: 5px;}.mr-10 {margin-right: 10px;}
.mr-15 {margin-right: 15px;}.mr-20 {margin-right: 20px;}.mr-25 {margin-right: 25px;}
.mr-30 {margin-right: 30px;}.mr-35 {margin-right: 35px;}.mr-40 {margin-right: 40px;}
.mr-45 {margin-right: 45px;}.mr-50 {margin-right: 50px;}.mr-55 {margin-right: 55px;}
.mr-60 {margin-right: 60px;}.mr-65 {margin-right: 65px;}.mr-70 {margin-right: 70px;}
.mr-75 {margin-right: 75px;}.mr-80 {margin-right: 80px;}.mr-85 {margin-right: 85px;}
.mr-90 {margin-right: 90px;}.mr-100 {margin-right: 100px;}

@media only screen and (max-width: 991px) {
    .md-mr-0 {margin-right: 0 !important;}
}
@media only screen and (max-width: 575px) {
    .xs-mr-0 {margin-right: 0 !important;}
}
/*-------- Margin Right End --------*/

/*-------- Margin Bottom Start --------*/
.mb-0 {margin-bottom: 0px !important;}.mb-5 {margin-bottom: 5px !important;}
.mb-10 {margin-bottom: 10px !important;}.mb-15 {margin-bottom: 15px !important;}
.mb-20 {margin-bottom: 20px !important;}.mb-25 {margin-bottom: 25px !important;}
.mb-30 {margin-bottom: 30px !important;}.mb-35 {margin-bottom: 35px !important;}
.mb-40 {margin-bottom: 40px !important;}.mb-45 {margin-bottom: 45px !important;}
.mb-50 {margin-bottom: 50px !important;}.mb-55 {margin-bottom: 55px !important;}
.mb-60 {margin-bottom: 60px !important;}.mb-65 {margin-bottom: 65px !important;}
.mb-70 {margin-bottom: 70px !important;}.mb-75 {margin-bottom: 75px !important;}
.mb-80 {margin-bottom: 80px !important;}.mb-85 {margin-bottom: 85px !important;}
.mb-90 {margin-bottom: 90px !important;}.mb-95 {margin-bottom: 95px !important;}
.mb-100 {margin-bottom: 100px !important;}

@media only screen and (max-width: 1199px) {
    .lg-mb-0 {margin-bottom: 0 !important;}.lg-mb-30 {margin-bottom: 30px !important;}
    .lg-mb-40 {margin-bottom: 40px !important;}.lg-mb-50 {margin-bottom: 50px !important;}
    .lg-mb-70 {margin-bottom: 70px !important;}.lg-mb-80 {margin-bottom: 80px !important;}
    .lg-mb-90 {margin-bottom: 90px !important;}
}
@media only screen and (max-width: 991px) {
    .md-mb-0 {margin-bottom: 0 !important;}.md-mb-10 {margin-bottom: 10px !important;}
    .md-mb-20 {margin-bottom: 20px !important;}.md-mb-30 {margin-bottom: 30px !important;}
    .md-mb-40 {margin-bottom: 40px !important;}.md-mb-50 {margin-bottom: 50px !important;}
    .md-mb-60 {margin-bottom: 60px !important;}.md-mb-70 {margin-bottom: 70px !important;}
    .md-mb-80 {margin-bottom: 80px !important;}.md-mb-90 {margin-bottom: 90px !important;}
    .md-mb-15 {margin-bottom: 15px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-mb-0 {margin-bottom: 0 !important;}.sm-mb-10 {margin-bottom: 10px !important;}
    .sm-mb-15 {margin-bottom: 15px !important;}.sm-mb-20 {margin-bottom: 20px !important;}
    .sm-mb-25 {margin-bottom: 25px !important;}.sm-mb-30 {margin-bottom: 30px !important;}
    .sm-mb-40 {margin-bottom: 40px !important;}.sm-mb-50 {margin-bottom: 50px !important;}
    .sm-mb-60 {margin-bottom: 60px !important;}.sm-mb-70 {margin-bottom: 70px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-mb-0 {margin-bottom: 0 !important;}.xs-mb-5 {margin-bottom: 5px !important;}
    .xs-mb-10 {margin-bottom: 10px !important;}.xs-mb-20 {margin-bottom: 20px !important;}
    .xs-mb-30 {margin-bottom: 30px !important;}.xs-mb-40 {margin-bottom: 40px !important;}
    .xs-mb-50 {margin-bottom: 50px !important;}
}
/*-------- Margin Bottom End --------*/

/*-------- Margin Left Start --------*/
.ml-0 {margin-left: 0px !important;}.ml-5 {margin-left: 5px;}.ml-10 {margin-left: 10px;}
.ml-15 {margin-left: 15px;}.ml-20 {margin-left: 20px;}.ml-25 {margin-left: 25px;}
.ml-30 {margin-left: 30px;}.ml-35 {margin-left: 35px;}.ml-40 {margin-left: 40px;}
.ml-45 {margin-left: 45px;}.ml-50 {margin-left: 50px !important;}
.ml-60 {margin-left: 60px !important;}.ml-70 {margin-left: 70px !important;}
.ml-80 {margin-left: 80px !important;}

@media only screen and (max-width: 991px) {
    .md-ml-0 {margin-left: 0 !important;}
}
@media only screen and (max-width: 767px) {
    .sm-ml-0 {margin-left: 0 !important;}
}
/*-------- Margin Left End --------*/

/*-------- Padding Bottom Start --------*/
.pa-0 {padding: 0px !important;}.pa-5 {padding: 5px !important;}
.pa-10 {padding: 10px !important;}.pa-15 {padding: 15px !important;}
.pa-20 {padding: 20px !important;}.pa-25 {padding: 25px !important;}
.pa-30 {padding: 30px !important;}.pa-35 {padding: 35px !important;}
.pa-40 {padding: 40px !important;}.pa-45 {padding: 45px !important;}
.pa-50 {padding: 50px !important;}.pa-55 {padding: 55px !important;}
.pa-60 {padding: 60px !important;}.pa-70 {padding: 70px !important;}
.pa-80 {padding: 80px !important;}.pa-90 {padding: 90px !important;}
.pa-100 {padding: 100px !important;}

.pb-0 {padding-bottom: 0px !important;}.pb-5 {padding-bottom: 5px !important;}
.pb-10 {padding-bottom: 10px !important;}.pb-15 {padding-bottom: 15px !important;}
.pb-20 {padding-bottom: 20px !important;}.pb-25 {padding-bottom: 25px !important;}
.pb-30 {padding-bottom: 30px !important;}.pb-35 {padding-bottom: 35px !important;}
.pb-40 {padding-bottom: 40px !important;}.pb-45 {padding-bottom: 45px !important;}
.pb-50 {padding-bottom: 50px !important;}.pb-55 {padding-bottom: 55px !important;}
.pb-60 {padding-bottom: 60px !important;}.pb-70 {padding-bottom: 70px !important;}
.pb-80 {padding-bottom: 80px !important;}.pb-90 {padding-bottom: 90px !important;}
.pb-100 {padding-bottom: 100px !important;}

@media only screen and (max-width: 1199px) {
    .lg-pb-0 {padding-bottom: 0px !important;}.lg-pb-5 {padding-bottom: 5px !important;}
    .lg-pb-10 {padding-bottom: 10px !important;}.lg-pb-15 {padding-bottom: 15px !important;}
    .lg-pb-20 {padding-bottom: 20px !important;}.lg-pb-25 {padding-bottom: 25px !important;}
    .lg-pb-30 {padding-bottom: 30px !important;}.lg-pb-35 {padding-bottom: 35px !important;}
    .lg-pb-40 {padding-bottom: 40px !important;}.lg-pb-45 {padding-bottom: 45px !important;}
    .lg-pb-50 {padding-bottom: 50px !important;}
}
@media only screen and (max-width: 991px) {
    .md-pb-0 {padding-bottom: 0 !important;}.md-pb-5 {padding-bottom: 5px !important;}
    .md-pb-10 {padding-bottom: 10px !important;}.md-pb-15 {padding-bottom: 15px !important;}
    .md-pb-20 {padding-bottom: 20px !important;}.md-pb-25 {padding-bottom: 25px !important;}
    .md-pb-30 {padding-bottom: 30px !important;}.md-pb-35 {padding-bottom: 35px !important;}
    .md-pb-40 {padding-bottom: 40px !important;}.md-pb-45 {padding-bottom: 45px !important;}
    .md-pb-50 {padding-bottom: 50px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-pb-0 {padding-bottom: 0 !important;}.sm-pb-5 {padding-bottom: 5px !important;}
    .sm-pb-10 {padding-bottom: 10px !important;}.sm-pb-15 {padding-bottom: 15px !important;}
    .sm-pb-20 {padding-bottom: 20px !important;}.sm-pb-25 {padding-bottom: 25px !important;}
    .sm-pb-30 {padding-bottom: 30px !important;}.sm-pb-35 {padding-bottom: 35px !important;}
    .sm-pb-40 {padding-bottom: 40px !important;}.sm-pb-45 {padding-bottom: 45px !important;}
    .sm-pb-50 {padding-bottom: 50px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-pb-0 {padding-bottom: 0 !important;}.xs-pb-5 {padding-bottom: 5px !important;}
    .xs-pb-10 {padding-bottom: 10px !important;}.xs-pb-15 {padding-bottom: 15px !important;}
    .xs-pb-20 {padding-bottom: 20px !important;}.xs-pb-25 {padding-bottom: 25px !important;}
    .xs-pb-30 {padding-bottom: 30px !important;}.xs-pb-35 {padding-bottom: 35px !important;}
    .xs-pb-40 {padding-bottom: 40px !important;}.xs-pb-45 {padding-bottom: 45px !important;}
    .xs-pb-50 {padding-bottom: 50px !important;}
}
/*-------- Padding Bottom End --------*/

/*-------- Padding Left Start --------*/
.pl-0 {padding-left: 0px !important;}.pl-5 {padding-left: 5px !important;}
.pl-10 {padding-left: 10px !important;}.pl-15 {padding-left: 15px !important;}
.pl-20 {padding-left: 20px !important;}.pl-25 {padding-left: 25px !important;}
.pl-30 {padding-left: 30px !important;}.pl-35 {padding-left: 35px !important;}
.pl-40 {padding-left: 40px !important;}.pl-45 {padding-left: 45px !important;}
.pl-50 {padding-left: 50px !important;}.pl-55 {padding-left: 55px !important;}
.pl-60 {padding-left: 60px !important;}.pl-70 {padding-left: 70px !important;}
.pl-80 {padding-left: 80px !important;}.pl-90 {padding-left: 90px !important;}
.pl-100 {padding-left: 100px !important;}

@media only screen and (max-width: 1199px) {
    .lg-pl-0 {padding-left: 0px !important;}.lg-pl-5 {padding-left: 5px !important;}
    .lg-pl-10 {padding-left: 10px !important;}.lg-pl-15 {padding-left: 15px !important;}
    .lg-pl-20 {padding-left: 20px !important;}.lg-pl-25 {padding-left: 25px !important;}
    .lg-pl-30 {padding-left: 30px !important;}.lg-pl-35 {padding-left: 35px !important;}
    .lg-pl-40 {padding-left: 40px !important;}.lg-pl-45 {padding-left: 45px !important;}
    .lg-pl-50 {padding-left: 50px !important;}
}
@media only screen and (max-width: 991px) {
    .md-pl-0 {padding-left: 0 !important;}.md-pl-5 {padding-left: 5px !important;}
    .md-pl-10 {padding-left: 10px !important;}.md-pl-15 {padding-left: 15px !important;}
    .md-pl-20 {padding-left: 20px !important;}.md-pl-25 {padding-left: 25px !important;}
    .md-pl-30 {padding-left: 30px !important;}.md-pl-35 {padding-left: 35px !important;}
    .md-pl-40 {padding-left: 40px !important;}.md-pl-45 {padding-left: 45px !important;}
    .md-pl-50 {padding-left: 50px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-pl-0 {padding-left: 0 !important;}.sm-pl-5 {padding-left: 5px !important;}
    .sm-pl-10 {padding-left: 10px !important;}.sm-pl-15 {padding-left: 15px !important;}
    .sm-pl-20 {padding-left: 20px !important;}.sm-pl-25 {padding-left: 25px !important;}
    .sm-pl-30 {padding-left: 30px !important;}.sm-pl-35 {padding-left: 35px !important;}
    .sm-pl-40 {padding-left: 40px !important;}.sm-pl-45 {padding-left: 45px !important;}
    .sm-pl-50 {padding-left: 50px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-pl-0 {padding-left: 0 !important;}.xs-pl-5 {padding-left: 5px !important;}
    .xs-pl-10 {padding-left: 10px !important;}.xs-pl-15 {padding-left: 15px !important;}
    .xs-pl-20 {padding-left: 20px !important;}.xs-pl-25 {padding-left: 25px !important;}
    .xs-pl-30 {padding-left: 30px !important;}.xs-pl-35 {padding-left: 35px !important;}
    .xs-pl-40 {padding-left: 40px !important;}.xs-pl-45 {padding-left: 45px !important;}
    .xs-pl-50 {padding-left: 50px !important;}
}
/*-------- Padding Left End --------*/

/*-------- Padding Top Start --------*/
.pt-0 {padding-top: 0px !important;}.pt-5 {padding-top: 5px !important;}
.pt-10 {padding-top: 10px !important;}.pt-15 {padding-top: 15px !important;}
.pt-20 {padding-top: 20px !important;}.pt-25 {padding-top: 25px !important;}
.pt-30 {padding-top: 30px !important;}.pt-35 {padding-top: 35px !important;}
.pt-40 {padding-top: 40px !important;}.pt-45 {padding-top: 45px !important;}
.pt-50 {padding-top: 50px !important;}.pt-55 {padding-top: 55px !important;}
.pt-60 {padding-top: 60px !important;}.pt-70 {padding-top: 70px !important;}
.pt-80 {padding-top: 80px !important;}.pt-90 {padding-top: 90px !important;}
.pt-100 {padding-top: 100px !important;}

@media only screen and (max-width: 1199px) {
    .lg-pt-0 {padding-top: 0px !important;}.lg-pt-5 {padding-top: 5px !important;}
    .lg-pt-10 {padding-top: 10px !important;}.lg-pt-15 {padding-top: 15px !important;}
    .lg-pt-20 {padding-top: 20px !important;}.lg-pt-25 {padding-top: 25px !important;}
    .lg-pt-30 {padding-top: 30px !important;}.lg-pt-35 {padding-top: 35px !important;}
    .lg-pt-40 {padding-top: 40px !important;}.lg-pt-45 {padding-top: 45px !important;}
    .lg-pt-50 {padding-top: 50px !important;}
}
@media only screen and (max-width: 991px) {
    .md-pt-0 {padding-top: 0 !important;}.md-pt-5 {padding-top: 5px !important;}
    .md-pt-10 {padding-top: 10px !important;}.md-pt-15 {padding-top: 15px !important;}
    .md-pt-20 {padding-top: 20px !important;}.md-pt-25 {padding-top: 25px !important;}
    .md-pt-30 {padding-top: 30px !important;}.md-pt-35 {padding-top: 35px !important;}
    .md-pt-40 {padding-top: 40px !important;}.md-pt-45 {padding-top: 45px !important;}
    .md-pt-50 {padding-top: 50px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-pt-0 {padding-top: 0 !important;}.sm-pt-5 {padding-top: 5px !important;}
    .sm-pt-10 {padding-top: 10px !important;}.sm-pt-15 {padding-top: 15px !important;}
    .sm-pt-20 {padding-top: 20px !important;}.sm-pt-25 {padding-top: 25px !important;}
    .sm-pt-30 {padding-top: 30px !important;}.sm-pt-35 {padding-top: 35px !important;}
    .sm-pt-40 {padding-top: 40px !important;}.sm-pt-45 {padding-top: 45px !important;}
    .sm-pt-50 {padding-top: 50px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-pt-0 {padding-top: 0 !important;}.xs-pt-5 {padding-top: 5px !important;}
    .xs-pt-10 {padding-top: 10px !important;}.xs-pt-15 {padding-top: 15px !important;}
    .xs-pt-20 {padding-top: 20px !important;}.xs-pt-25 {padding-top: 25px !important;}
    .xs-pt-30 {padding-top: 30px !important;}.xs-pt-35 {padding-top: 35px !important;}
    .xs-pt-40 {padding-top: 40px !important;}.xs-pt-45 {padding-top: 45px !important;}
    .xs-pt-50 {padding-top: 50px !important;}
}
/*-------- Padding Top End --------*/

/*-------- Padding Right Start --------*/
.pr-0 {padding-right: 0px !important;}.pr-5 {padding-right: 5px !important;}
.pr-10 {padding-right: 10px !important;}.pr-15 {padding-right: 15px !important;}
.pr-20 {padding-right: 20px !important;}.pr-25 {padding-right: 25px !important;}
.pr-30 {padding-right: 30px !important;}.pr-35 {padding-right: 35px !important;}
.pr-40 {padding-right: 40px !important;}.pr-45 {padding-right: 45px !important;}
.pr-50 {padding-right: 50px !important;}.pr-55 {padding-right: 55px !important;}
.pr-60 {padding-right: 60px !important;}.pr-70 {padding-right: 70px !important;}
.pr-80 {padding-right: 80px !important;}.pr-90 {padding-right: 90px !important;}
.pr-100 {padding-right: 100px !important;}

@media only screen and (max-width: 1199px) {
    .lg-pr-0 {padding-right: 0px !important;}.lg-pr-5 {padding-right: 5px !important;}
    .lg-pr-10 {padding-right: 10px !important;}.lg-pr-15 {padding-right: 15px !important;}
    .lg-pr-20 {padding-right: 20px !important;}.lg-pr-25 {padding-right: 25px !important;}
    .lg-pr-30 {padding-right: 30px !important;}.lg-pr-35 {padding-right: 35px !important;}
    .lg-pr-40 {padding-right: 40px !important;}.lg-pr-45 {padding-right: 45px !important;}
    .lg-pr-50 {padding-right: 50px !important;}
}
@media only screen and (max-width: 991px) {
    .md-pr-0 {padding-right: 0 !important;}.md-pr-5 {padding-right: 5px !important;}
    .md-pr-10 {padding-right: 10px !important;}.md-pr-15 {padding-right: 15px !important;}
    .md-pr-20 {padding-right: 20px !important;}.md-pr-25 {padding-right: 25px !important;}
    .md-pr-30 {padding-right: 30px !important;}.md-pr-35 {padding-right: 35px !important;}
    .md-pr-40 {padding-right: 40px !important;}.md-pr-45 {padding-right: 45px !important;}
    .md-pr-50 {padding-right: 50px !important;}
}
@media only screen and (max-width: 767px) {
    .sm-pr-0 {padding-right: 0 !important;}.sm-pr-5 {padding-right: 5px !important;}
    .sm-pr-10 {padding-right: 10px !important;}.sm-pr-15 {padding-right: 15px !important;}
    .sm-pr-20 {padding-right: 20px !important;}.sm-pr-25 {padding-right: 25px !important;}
    .sm-pr-30 {padding-right: 30px !important;}.sm-pr-35 {padding-right: 35px !important;}
    .sm-pr-40 {padding-right: 40px !important;}.sm-pr-45 {padding-right: 45px !important;}
    .sm-pr-50 {padding-right: 50px !important;}
}
@media only screen and (max-width: 575px) {
    .xs-pr-0 {padding-right: 0 !important;}.xs-pr-5 {padding-right: 5px !important;}
    .xs-pr-10 {padding-right: 10px !important;}.xs-pr-15 {padding-right: 15px !important;}
    .xs-pr-20 {padding-right: 20px !important;}.xs-pr-25 {padding-right: 25px !important;}
    .xs-pr-30 {padding-right: 30px !important;}.xs-pr-35 {padding-right: 35px !important;}
    .xs-pr-40 {padding-right: 40px !important;}.xs-pr-45 {padding-right: 45px !important;}
    .xs-pr-50 {padding-right: 50px !important;}
}
/*-------- Padding Right End --------*/

.section-padding{
    padding: 50px 0;
}

/*
-----------------------------------------------------------------------
    End Common CSS
-----------------------------------------------------------------------
*/

/*
-----------------------------------------------------------------------
    !Start Header CSS
-----------------------------------------------------------------------
*/

/* Media For lg */
@media only screen and (max-width: 1199px) {} 
/* Media For md */
@media only screen and (max-width: 991px) {}
/* Media For sm */
@media only screen and (max-width: 767px) {}
/* Media For xs */
@media only screen and (max-width: 575px) {}
/* Media For xxs */
@media only screen and (max-width: 479.98px) {}
/* Media For xxxs */
@media only screen and (max-width: 359.98px) {}
/*
-----------------------------------------------------------------------
    !End Header CSS
-----------------------------------------------------------------------
*/

/*
-----------------------------------------------------------------------
    !Start Main CSS
-----------------------------------------------------------------------
*/
.hero-section{
    min-height: 100vh;
    background-color: #fefefe;
    position: relative;
}

.hero-svgs{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1;
}

.hero-notsh{
    position: relative;
    z-index: 10;
    padding: 30px 0 0;
}

.mockup-wrapper{
    position: relative;
}

.mockup.mockup-top{
    left: 0;
    top: 0;
    z-index: 2;
    filter: drop-shadow(12.4957px 12.4957px 20.8261px rgba(154, 151, 142, 0.15)) drop-shadow(20.8261px 37.4871px 49.9827px rgba(157, 149, 140, 0.2));
    transform: rotate(-9.77deg);
}

.mockup.mockup-bottom{
    right: 0;
    top: 0;
    z-index: 1;
    filter: drop-shadow(12.4957px 12.4957px 20.8261px rgba(154, 151, 142, 0.15)) drop-shadow(20.8261px 37.4871px 49.9827px rgba(157, 149, 140, 0.2));
    transform: rotate(12.15deg);
}

.mockup-wrapper{
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.mockup-wrapper .mockup{
    height: 758px;
    width: 381px;
}

.mockup-wrapper.mockups .mockup{
    height: 580px;
    width: 500px;
}

.mockup-wrapper.mockups.getapp .mockup{
    height: 735px;
    width: 630px;
}

.mockup-wrapper .mockup img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.phone-body{
    z-index: 1;
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 211.66px;
    height: 438.59px;
}

.phone-body.body-top{
    background-image: url("../images/iPhone-Body-left.png");
}

.phone-body.body-bottom{
    background-image: url("../images/iPhone-Body-right.png");
}

.phone-body img{
    width: 211px;
    height: 457px;
    object-fit: contain;
}

.section-content-wrapper{
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: center;
}

.section-content-wrapper .section-content{
    margin-bottom: 150px;
}

.section-quote{
    background: rgba(54, 69, 76, 0.12);
    border-radius: 30px;
    padding: 65px 75px;
}

.quote-heading{
    margin-bottom: 33px;
}

.quote-heading h2{
    color: #FF6433;  
    font-size: 35px;
    line-height: 42px;
}

.section-quote p{
    margin-bottom: 35px;
}

.section-title{
    margin-bottom: 20px;
}

.section-title h1{
    font-size: 45px;
    line-height: 54px;
}

.section-title.primary h1{
    color: #FF764A;
}

.section-title.getapp h1{
    font-size: 60px;
    line-height: 88px;
}

.section-btns{
    display: flex;
    align-items: center;
    margin: 0 -5px;
}

.section-btns a{
    display: inline-block;
    padding: 0 5px;
}

@media only screen and (max-width: 991px) {
    .row.md-reverse{
        flex-direction: column-reverse;
    }

    .section-padding{
        padding: 30px 0;
    }

    .section-content-wrapper .section-content{
        margin-bottom: 30px;
    }

    .hero-notsh {
        padding: 15px 0 0;
    }

    .hero-section{
        min-height: unset;
    }

    body, p{
        font-size: 22px;
    }

    .section-quote {
        padding: 25px 35px;
    }

    .quote-heading h2 {
        font-size: 26px;
        line-height: 28px;
    }

    .section-title h1 {
        font-size: 35px;
        line-height: 38px;
    }

    .section-title.getapp h1 {
        font-size: 35px;
        line-height: 38px;
    }

    footer p {
        font-size: 18px;
        line-height: 24px;
    }

    .mockup-wrapper .mockup{
        margin-left: 30px;
        overflow: hidden;
    }
}

.account-form-wrapper{
    max-width: 535px;
    min-height: 100vh;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.account-form{
    padding: 25px 30px;
    border: 1px solid #ececec;
    border-radius: 30px;
    box-shadow: 20.8261px 37.4871px 49.9827px rgba(157, 149, 140, 0.2);
    width: 100%;
}

@media only screen and (max-width: 575px) {
    .account-form-wrapper{
        max-width: unset;
        width: 100%;
        margin: 0;
    }

    .account-form{
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
}

.form-title{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}

.form-title h1{
    font-size: 32px;
}

.form-title p{
    font-size: 20px;
    margin-bottom: 0;
}

.input-group{
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.input-group label{
    font-size: 18px;
    margin-bottom: 10px;
    display: block;
}

.input-group input.form-control{
    display: block;
    width: 100% !important;
    border-radius: 3px !important;
    padding: 10px 15px;
    height: 50px;
}

.input-group input.form-control:focus{
    border-color: #FF764A !important;
}

.btn-primary{
    background-color: #FF764A;
    border-color: #FF764A;
}

.btn-primary:hover{
    background-color: #FF6433;
    border-color: #FF6433;
}

.btn.flex-full{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    width: 100%;
}

.action-group{
    margin-bottom: 15px;
}
/*
-----------------------------------------------------------------------
    !End Main CSS
-----------------------------------------------------------------------
*/

/*
-----------------------------------------------------------------------
    !Start Footer CSS
-----------------------------------------------------------------------
*/
footer{
    background: #F3F3F3;
    border-radius: 15px 15px 0px 0px;   
    padding: 50px 0 70px;
}

footer p{
    font-size: 20px;
    line-height: 24px;
}

.footer-links li{
    margin-bottom: 25px;
}

.footer-links li:last-child{
    margin-bottom: 0;
}

.footer-main{
    padding-left: 40px;
}

.social-row a{
    display: inline-block;
    margin-left: 20px;
}

.social-row a:last-child{
    margin-left: 0;
}

.footer-social li{
    margin-bottom: 25px;
}

.footer-social li:last-child{
    margin-bottom: 0;
}

@media only screen and (max-width: 991px) {
    footer p {
        font-size: 18px;
        line-height: 24px;
    }
}

/*
-----------------------------------------------------------------------
    !End Footer CSS
-----------------------------------------------------------------------
*/