:root {
  --global-font: 14px;
  --black-color: #000;
  --white-color: #ffffff;
  --link-color: #0011ff;
  --brand-primary-color: #2a86c7;
  --brand-second-color: #3c4856;
  --brand-tertiary-color: #f0f9fd;
  --brand-quaternary-color: #ebfaff;
  --lightgray-color: #e7e7e7;
  --darkgray-color: #1d1d1d;
  --primary-font: "Poppins", sans-serif;
}
html > body {
  padding: 0px;
  margin: 0px;
  font-family: var(--primary-font);
  font-weight: 400;
  letter-spacing: 0.03em;
  font-size: 14px;
}
.mainwrapper {
  width: 100%;
  padding: 0px;
  margin: 0px auto;
}
.header-top {
  background: #2f353a;
  padding: 5px 0;
  position: relative;
  z-index: 1;
  border-bottom: 2px solid #2b88c8;
}
.header-top-bg-shape, .header-top-bg-shape:after {
  -webkit-clip-path: polygon(18px 0, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(18px 0, 100% 0, 100% 100%, 0 100%);
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
}
.header-top-bg-shape {
  background: #fff;
  background: var(--white-color);
  width: 26%;
  z-index: -1;
}
.header-top-bg-shape:after {
  background: #3c4856;
  content: "";
  width: 99%;
}
.header-top a {
  color: #fff;
  text-decoration: none;
  font-size: 13px;
}
.social-links a {
  color: #3c4856;
  border: 0px solid #fff;
  border-radius: 50%;
  padding: 3px 8px;
  font-size: 16px;
  background-color: #fff;
  display: inline-block;
  width: 29px;
  margin-left: 5px;
  text-align: center;
  justify-items: center;
  height: 28px;
  line-height: 21px;
  vertical-align: middle;
}
header {
  width: 100%;
  background-color: #fff;
}
.topband {
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10000;
  transition: all 0.2s ease-in-out;
}
.topband.active {
  position: fixed;
  top: -40px;
  left: 0;
  width: 100%;
  z-index: 10000;
  background: rgb(255, 255, 255);
  -webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
}
.header .item-left {
  flex: 0 0 20%
}
.header .item-center {
  flex: 0 0 69%
}
.header .item-right {
  flex: 0 0 10%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.collage{
  background: url(../../img/col1.webp) no-repeat center center;
  
  height: 580px;
  background-size: cover;
  padding: 80px 0px;
}
.tagline{
  font-size: 35px;
  color: #fff;
  font-weight: 500;
  line-height: 40px;
  margin-top: 80px;
}
.tagline span{
  font-size: 20px;
  color: #fff;
  font-weight: 300;
  line-height: 22px;
}
.grouppointers{
  text-align: center;
  margin-top: -140px;
}
.grouppointers h2{
  font-size: 30px;
  color: #fff;
  font-weight: 500;
  padding: 0px 0px 15px 0px;
  margin: 0px;
}
.greenbox{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
}
.greenbox a{
  background-color: #60b675;
  border-radius: 14px;
  padding: 16px;
  color: #fff;
  font-size: 20px;
  line-height: 22px;
  text-align: center;
  font-weight: 400;
  min-height: 130px;
  text-decoration: none;
  width: 100%;
  display: block;
  box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
  
}
.greenbox a:hover{
  background-color: #4da463;
}
.greenheading{
  color: #60b675 !important;
}


.pinkbox{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
}
.pinkbox a{
  background-color: #e75272;
  border-radius: 14px;
  padding: 16px;
  color: #fff;
  font-size: 20px;
  line-height: 22px;
  text-align: center;
  font-weight: 400;
  min-height: 130px;
  text-decoration: none;
  width: 100%;
  display: block;
  box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
  
}
.pinkbox a:hover{
  background-color: #dc4163;
}
.pinkheading{
  color: #e75272 !important;
}


.brownbox{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
}
.brownbox a{
  background-color: #986842;
  border-radius: 14px;
  padding: 16px;
  color: #fff;
  font-size: 20px;
  line-height: 22px;
  text-align: center;
  font-weight: 400;
  min-height: 130px;
  text-decoration: none;
  width: 100%;
  display: block;
  box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
  
}
.brownbox a:hover{
  background-color: #7c502d;
}
.brownheading{
  color: #986842 !important;
}

.orangebox{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 30px;
}
.orangebox a{
  background-color: #e2572b;
  border-radius: 14px;
  padding: 16px;
  color: #fff;
  font-size: 20px;
  line-height: 22px;
  text-align: center;
  font-weight: 400;
  min-height: 130px;
  text-decoration: none;
  width: 100%;
  display: block;
  box-shadow: 0px 6px 13px 0px rgba(0, 0, 0, 0.2);
  transition: 0.3s;
  
}
.orangebox a:hover{
  background-color: #d54a20;
}
.orangeheading{
  color: #e2572b !important;
}

.b2c{
  background-color: #2b88c8;
  font-size: 18px;
  color: #fff;
  text-align: center;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}
.b2b{
  background-color: #47a0de;
  font-size: 18px;
  color: #fff;
  text-align: center;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}
.cms{
  background-color: #62b6f0;
  font-size: 18px;
  color: #fff;
  text-align: center;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}
.b2c a{
  text-decoration: none;
  color: #fff;
}
.b2b a{
  text-decoration: none;
  color: #fff;
}
.cms a{
  text-decoration: none;
  color: #fff;
}
.implementseries{
  padding: 60px 0px;
  background-color: #fff;
}
.implementseries h2{
  font-size: 26px;
  color: #000;
  line-height: 30px;
  font-weight: 300;
}
.implementseries h3{
  font-size: 26px;
  color: #2b88c8;
  line-height: 30px;
  font-weight: 300;
}
.implementseries h3 span{
  font-size: 26px;
  color: #2b88c8;
  line-height: 30px;
  font-weight: 600;
}
.softwarepointer{
  font-size: 15px;
  color: #2b88c8;
  line-height: 18px;
  font-weight: 400;
  background: #fff;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 30px;
  box-shadow: 2px 6px 13px 0px rgba(0, 0, 0, 0.1);
  min-height: 102px;
      display: flex;
    align-items: center;
}
.softwarepointer img{
  margin-right: 20px;
}
.sftimg{
  width: 100%;
  height: 395px;
  position: relative;
  overflow: hidden;
  border-radius: 15px;
}
.sftimg img{
  width: 100%;
  height: 395px;
  object-position: 50% 50%;
  object-fit: cover;
  border-radius: 15px;
}
.effortcoach{
  background-color: #e6f5ff;
  padding: 60px 0px;
}
.seriesscrn{
  width: 100%;
  height: 355px;
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  border: solid 1px #d1d1d1;
}
.seriesscrn img{
  width: 100%;
  height: 355px;
  object-position: top center;
  object-fit: cover;
  border-radius: 10px;
}
.whybg{
  background: url(../../img/whybg.jpg) no-repeat center center;
  background-size: cover;
  padding: 80px 0px;
}
.whybg h2{
  color: #fff;
  font-size: 28px;
  line-height: 32px;
  padding: 0px 0px 15px 0px;
  margin: 0px;
}



.awardtagcont {
  position: relative;
  z-index: 99;
}
.awardtag {
  text-align: right;
  position: absolute;
  width: 100%;
}
.primary-btn {
  font-size: 14px;
}
.primary-btn a {
  background-color: var(--brand-primary-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
}
.primary-btn a:hover {
  background-color: var(--brand-second-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  color: var(--white-color) !important;
}
.button {
  background-color: var(--brand-primary-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.button:hover {
  background-color: var(--brand-second-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  color: var(--white-color) !important;
}
.primary-btn-line {
  font-size: 14px;
}
.primary-btn-line a {
  color: var(--brand-primary-color);
  border: 1px solid var(--brand-primary-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}
.primary-btn-line a:hover {
  background-color: var(--brand-primary-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  color: var(--white-color) !important;
}
.secondry-btn-line {
  font-size: 14px;
}
.secondry-btn-line a {
  color: var(--brand-second-color);
  border: 1px solid var(--brand-second-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}
.secondry-btn-line a:hover {
  background-color: var(--brand-second-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  color: var(--white-color) !important;
}
.secondry-btn {
  font-size: 14px;
}
.secondry-btn a {
  color: var(--white-color) !important;
  border: 1px solid var(--brand-second-color);
  font-size: 14px;
	background-color: var(--brand-second-color);
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
}
.secondry-btn a:hover {
  background-color: var(--white-color) !important;
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  text-decoration: none;
  color: var(--brand-second-color) !important;
}
.submit-btn {
  background-color: var(--brand-primary-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.submit-btn:hover {
  background-color: var(--brand-second-color);
  color: var(--white-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  text-decoration: none;
  color: var(--white-color) !important;
}
.submit-btn-line {
  background-color: none;
  color: var(--brand-primary-color);
  font-size: 14px;
  border-radius: 6px;
  padding: 7px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease-in-out;
  border: 1px solid var(--brand-primary-color);
}
.submit-btn-line:hover {
  background-color: var(--brand-primary-color);
  color: var(--white-color);
  text-decoration: none;
}
.series-btn {
  background-color: #2c88c4;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.series-btn:hover {
  background-color: #1A77B3;
  color: var(--white-color);
}
.website-btn {
  background-color: #9c282f;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.website-btn:hover {
  background-color: #73171d;
  color: var(--white-color);
}
.fit-btn {
  background-color: #1f3c43;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.fit-btn:hover {
  background-color: #162E33;
  color: var(--white-color);
}
.dynamic-btn {
  background-color: #9c282f;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 14px;
  width: 100%;
  display: block;
  text-align: center;
  text-decoration: none;
  color: var(--white-color);
  transition: all 0.3s ease-in-out;
  border: 0 solid #000;
}
.dynamic-btn:hover {
  background-color: #73171d;
  color: var(--white-color);
}
.carousel-caption {
  position: absolute;
  right: 12%;
  top: 8rem;
  left: 12%;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  color: #fff;
  text-align: center;
}
.col-products {
  bottom: 160px;
  width: 35%;
  position: absolute;
  z-index: 99;
}
.col-products a {
  text-decoration: none;
}
.ColCaptions {
  text-align: left;
}
.ColCaptions h5 {
  text-align: left;
  font-size: 21px;
  color: #fff;
  font-weight: 300;
}
.ColCaptions h5 span {
  text-align: left;
  color: #fff;
  font-weight: 500;
  font-size: 35px;
}
.protxt {
  font-size: 14px;
}
.ProductBox {
  margin-bottom: 10px;
}
.GroupProductBox {
  background: rgba(44, 136, 196, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #fff;
  min-height: 116px;
}
.WebProductBox {
  background: rgba(52, 92, 102, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #fff;
  min-height: 75px;
}
.FITProductBox {
  background: rgba(223, 158, 73, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #fff;
  min-height: 75px;
}
.DynamicProductBox {
  background: rgba(157, 41, 45, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #fff;
  min-height: 75px;
}
.SubscriptionBox {
  background: rgba(255, 255, 255, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #2c88c4;
  min-height: 77px;
}
.SubscriptionBox h3{
  color: #2c88c4 !important;
}
.SubscriptionBox div{
  font-size: 12px;
  font-weight: 400;
  font-style: italic;
	letter-spacing: -0.02em;
}
.EnterpriseBox {
  background: rgba(255, 255, 255, 0.8);
  padding: 16px 20px;
  border-radius: 10px;
  color: #000;
  min-height: 77px;
}
.EnterpriseBox h3{
  color: #000 !important;
}
.EnterpriseBox div{
  font-size: 12px;
  font-weight: 400;
  font-style: italic;
	letter-spacing: -0.02em;
}
.ProductBox h3 {
  font-size: 17px;
  color: #fff;
  font-weight: 600;
  margin: 0;
  padding: 0;
}
.ProductBox ul {
  padding: 0px 0px 0px 16px;
  margin: 0px;
}
.ProductBox li {
  padding: 0px;
  margin: 0px;
}
.right-mob-left {
  text-align: right !important;
}
.right-mob-center {
  text-align: right;
}
.left-mob-center {
  text-align: left;
}
.left-mob-right {
  text-align: left;
}
.center-mob-left {
  text-align: center;
}
.center-mob-right {
  text-align: center;
}
.right-mobtab-left {
  text-align: right;
}
.topmargin5 {
  margin-top: 5px;
}
.topmargin10 {
  margin-top: 10px;
}
.topmargin15 {
  margin-top: 15px;
}
.topmargin20 {
  margin-top: 20px;
}
.topmargin25 {
  margin-top: 25px;
}
.topmargin30 {
  margin-top: 30px;
}
.topmargin35 {
  margin-top: 35px;
}
.topmargin40 {
  margin-top: 40px;
}
.topmargin50 {
  margin-top: 50px;
}
.topmargin60 {
  margin-top: 60px;
}
.topmargin70 {
  margin-top: 70px;
}
.rowmargindesk70 {
  margin-top: 70px;
}
.rowmargindesk30 {
  margin-top: 30px;
}
.rowmargindesk20 {
  margin-top: 20px;
}
.rowmargindesk10 {
  margin-top: 10px;
}
.nopaddingarea {
  padding: 0px 15px;
}
.nopadding {
  padding: 0px;
}
.nopaddingarea1 {
  padding: 0px 14px;
}
.nopadding1 {
  padding: 1px;
}
.nopadding2 {
  padding: 0px 2px 4px 2px;
}
.padding5pxarea {
  padding: 0px 10px;
}
.padding5px {
  padding: 0px 5px;
}
.space10 {
  height: 10px;
}
.space20 {
  height: 20px;
}
.space30 {
  height: 30px;
}
.space40 {
  height: 40px;
}
.space50 {
  height: 50px;
}
.space60 {
  height: 60px;
}
.ribbon {
  position: relative;
  color: white;
}
.ribbon2 {
    position: relative;
    color: white;
    right: -18px;
    top: -10px;
}
.headings {
  font-family: var(--primary-font);
}
.headings h2 {
  font-size: 38px;
  font-weight: 200;
  padding: 0px;
  margin: 0px;
}
.headings h2 span {
  font-weight: 300;
}
.headings h3 {
  font-size: 32px;
  font-weight: 400;
  padding: 0px;
  margin: 0px;
}
.headings h4 {
  font-size: 26px;
  font-weight: 500;
  padding: 0px;
  margin: 0px;
}
.headings h5 {
  font-size: 20px;
  font-weight: 500;
  padding: 0px;
  margin: 0px;
}
.headings h6 {
  font-size: 15px;
  font-weight: 500;
  padding: 0px;
  margin: 0px;
}
.headinggreen {
  color: var(--brand-primary-color);
}
.headinggold {
  color: var(--brand-second-color);
}
.subheading {
  font-size: 22px;
	line-height: 24px;
  font-weight: 300;
  color: #000 !important;
}
.subheading2 {
  font-size: 18px;
	line-height: 20px;
  font-weight: 300;
  color: #000 !important;
}
.subheading3 {
  font-size: 28px;
	line-height: 32px;
  font-weight: 400;
  color: var(--brand-second-color) !important;
}
.subheading3 span{
   font-weight: 600;
}
.wrap {
  width: 100%;
  height: 95px;
  position: absolute;
  top: -5px;
  left: 4px;
  overflow: hidden;
}
.wrap:before, .wrap:after {
  content: "";
  position: absolute;
}
.wrap:before {
  width: 6px;
  height: 5px;
  right: 64px;
  background: #392e0a;
  border-radius: 8px 8px 0px 0px;
}
.wrap:after {
  width: 6px;
  height: 5px;
  right: 0px;
  top: 64px;
  background: #392e0a;
  border-radius: 0px 8px 8px 0px;
}
.ribbon6 {
  width: 263px;
  height: 16px;
  line-height: 16px;
  position: absolute;
  top: 19px;
  right: -105px;
  z-index: 2;
  overflow: hidden;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  box-shadow: 0 0 0 3px #c8a143, 0px 21px 5px -18px rgba(0, 0, 0, 0.6);
  background: #c8a143;
  text-align: center;
  font-size: 11px;
}
.streamlinebox {
  background-color: var(--brand-tertiary-color);
  border-radius: 26px;
  padding: 40px 45px;
}
.content {
  font-size: 15px;
  color: #000;
  line-height: 22px;
  font-weight: 300;
}
.content ul {
  padding: 0px 0px 0px 0px;
}
.content li {
  padding: 0px 0px 0px 25px;
  margin: 0px 0px 10px 0px;
  list-style: none;
  background: url(../../img/list_bullet.png) no-repeat 0px 2px;
}
.content strong {
  font-weight: 500;
}
.content span {
  color: var(--brand-primary-color);
  font-weight: 400;
}
.content h3 {
  font-size: 21px;
  color: var(--brand-primary-color);
  line-height: 22px;
  font-weight: 400;
}
.content2 {
  font-size: 15px;
  color: #000;
  line-height: 22px;
  font-weight: 300;
}
.content2 ul {
  padding: 10px 0px 0px 18px;
}
.content2 li {
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 8px 0px;
  line-height: 18px;
}
.content2 h3 {
  font-size: 21px;
  color: var(--brand-primary-color);
  line-height: 28px;
  font-weight: 500;
  letter-spacing: 0px;
}
.content2 strong {
  font-weight: 500;
}
.content2 span {
  color: var(--brand-primary-color);
  font-weight: 400;
}
.cont-right-padd {
  padding-right: 50px;
}
.cont-left-padd {
  padding-left: 50px;
}
.cloudbox {
  background-color: var(--brand-second-color);
  border-radius: 15px;
  padding: 25px;
  color: #fff;
  font-size: 15px;
  line-height: 20px;
  min-height: 195px;
  margin-bottom: 10px;
}
.hundred {
  font-size: 60px;
  line-height: 40px;
  font-weight: 200;
  padding: 0px 0px 10px 0px;
  margin: 0;
}
.cloudtxt {
  font-size: 24px;
  padding: 0px 0px 15px 0px;
  font-weight: 200;
}
.kaaba {
  min-height: 195px;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.kaaba img {
  min-height: 195px;
  width: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: 15px;
}
.clocktower {
  min-height: 398px;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.clocktower img {
  min-height: 398px;
  width: 100%;
  object-fit: cover;
  object-position: center center;
  border-radius: 15px;
}
.blogbox {
  background-color: #fff;
  border: 0px solid #cbcbcb;
  margin-bottom: 30px;
}
.blogimg {
  width: 100%;
  height: 230px;
  position: relative;
  overflow: hidden;
  border-radius: 15px;
}
.blogimg img {
  width: 100%;
  height: 230px;
  object-fit: cover;
  object-position: center center;
  border-radius: 15px;
  transition: 0.3s;
}
.blogbox:hover .blogimg img {
  transform: scale(1.1);
}
.blogcont {
  padding: 20px 0px 30px 0px;
  font-size: 14px;
}
.bloghead h3 {
  font-size: 18px;
  color: var(--brand-primary-color);
  font-weight: 500;
  padding: 0px 0px 10px 0px;
  margin: 0px;
  min-height: 58px;
}
.bloghead h3 a {
  color: var(--brand-primary-color);
  text-decoration: none;
  transition: 0.3s;
}
.bloghead h3 a:hover {
  color: var(--brand-second-color);
  text-decoration: none;
}
.dividergold {
  width: 36px;
  height: 3px;
  background-color: #3B98DB;
  margin: 4px 0px 14px 0px;
}
.blogpara {
  min-height: 85px;
}
.list ul {
  padding: 0px 0px 0px 18px;
  margin: 0px;
}
.list li {
  padding: 0px 0px 10px 0px;
  margin: 0px;
}
.list li::marker {
  color: var(--brand-primary-color);
}
.umrahvdobox {
  background-color: #DAEBF8;
  padding: 16px;
  border-radius: 15px;
}
.umrahvdobox img {
  width: 100%;
}
.newsletter {
  background-color: #2f353a;
  padding: 16px;
  color: #fff;
  font-size: 13px;
}
.newsletter h4 {
  color: #fff;
  font-size: 18px;
  padding: 0;
  margin: 0;
}
.newsltrbox {
  background-color: #212529;
  border-radius: 5px;
  padding: 5px;
  display: inline-block;
}
.newsltrfield {
  background-color: #212529;
  color: #fff;
  border: 0px;
}
.newsltrfield::placeholder {
  color: #fff;
}
.newsltrfield:focus {
  outline: none;
}
.newsltrbtn {
  background-color: #71787e;
  color: #eff0f0;
  border: 0px;
  padding: 8px;
  border-radius: 4px;
}
.footer {
  background-color: #2b88c8;
  padding-top: 40px;
  padding-bottom: 15px;
  width: 100%;
  color: #fff;
  font-size: 13px;
}
.footer h5 {
  font-size: 16px;
  font-weight: 500;
  padding: 0px 0px 10px 0px;
  margin: 0px;
  color: #fff;
}
.footer li {
  padding: 0px 0px 10px 0px;
  list-style: none;
}
.footer li a {
  font-size: 13px;
  font-weight: 300;
  color: #fff;
  text-decoration: none;
}
.footer li a i {
  font-size: 13px;
  font-weight: 300;
  color: #fff;
  text-decoration: none;
}
.footercont {
  font-size: 13px;
  color: #fff;
  line-height: 19px;
  margin-top: 30px;
  margin-bottom: 20px;
  font-weight: 300;
}
.f-social-links a {
  color: #2a86c7;
  background-color: #fff;
  border-radius: 50%;
  padding: 3px 8px;
  font-size: 16px;
  display: inline-block;
  width: 29px;
  margin-right: 5px;
  text-align: center;
  justify-items: center;
  height: 28px;
  line-height: 21px;
  vertical-align: middle;
  transition: 0.3s;
}
.f-social-links a:hover {
  color: #fff;
  background-color: var(--brand-second-color);
}
.footer hr {
  background-color: #3B98DB;
  opacity: 1;
}
.breadcrumb {
  background: #ffffff;
background: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 1) 0%, rgba(227, 248, 255, 1) 100%);
background: -o-linear-gradient(bottom, rgba(255, 255, 255, 1) 0%, rgba(227, 248, 255, 1) 100%);
background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(227, 248, 255, 1) 100%);
  color: var(--brand-primary-color);
  font-size: 13px;
  padding: 20px 0px;
  overflow-x: auto;
  white-space: nowrap;
}
.breadcrumb i {
  padding: 0px 10px;
  font-size: 10px;
}
.breadcrumb a {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.middlecontarea {
  width: 100%;
  padding: 0px 0px 80px 0px;
}
.featurebox {
  background: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 25px;
    border: 1px solid #ccc;
}
.featureboxpadd {
  padding: 40px 40px 0px 40px;
  margin-bottom: 30px;
}
.featurebox h4 {
  font-size: 25px;
  font-weight: 400;
	color: var(--brand-primary-color);
}
.featuremainbox{
  display: flex;
  gap: 20px;
  flex-direction: row;
}
.grfeaturebox {
  background: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 25px;
    border: 1px solid #d4d4d4;
    /* min-height: 380px; */
    width: 25%;
}
.grfeaturebox ul {
  margin: 0px;
  padding: 6px 0px 0px 18px;
}
.grfeaturebox li {
  margin: 0px;
  padding: 0px;
      line-height: 18px;
    margin-bottom: 6px;
}
.grfeatureboxpadd {
  padding: 40px 40px 0px 40px;
  margin-bottom: 30px;
}
.grfeaturebox h4 {
  font-size: 25px;
  font-weight: 400;
	color: #434242;
}
.pinkfeaturebox {
  background: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 25px;
    border: 1px solid #e75272;
}
.pinkfeatureboxpadd {
  padding: 40px 40px 0px 40px;
  margin-bottom: 30px;
}
.pinkfeaturebox h4 {
  font-size: 25px;
  font-weight: 400;
	color: #e75272;
}
.brownfeaturebox {
  background: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 25px;
    border: 1px solid #986842;
}
.brownfeatureboxpadd {
  padding: 40px 40px 0px 40px;
  margin-bottom: 30px;
}
.brownfeaturebox h4 {
  font-size: 25px;
  font-weight: 400;
	color: #986842;
}
.orangefeaturebox {
  background: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    padding: 15px;
    margin-bottom: 25px;
    border: 1px solid #e2572b;
}
.orangefeatureboxpadd {
  padding: 40px 40px 0px 40px;
  margin-bottom: 30px;
}
.orangefeaturebox h4 {
  font-size: 25px;
  font-weight: 400;
	color: #e2572b;
}
.link {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.link:hover {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.link a {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.link a:hover {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.featcont {
  min-height: 110px;
}
.txt20 {
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
}
.ribbon-2 {
  --f: 10px;
  /* control the folded part*/
  --r: 15px;
  /* control the ribbon shape */
  --t: 10px;
  /* the top offset */
  position: absolute;
  inset: var(--t) calc(-1*var(--f)) auto auto;
  padding: 0 10px var(--f) calc(10px + var(--r));
  clip-path:
    polygon(0 0, 100% 0, 100% calc(100% - var(--f)), calc(100% - var(--f)) 100%, calc(100% - var(--f)) calc(100% - var(--f)), 0 calc(100% - var(--f)), var(--r) calc(50% - var(--f)/2));
  background: #216106;
  box-shadow: 0 calc(-1*var(--f)) 0 inset #0005;
  font-size: 13px;
  color: #fff;
}
.vdoholder1 {
  background-color: var(--brand-tertiary-color);
  border-radius: 10px;
  padding: 10px;
  height: 320px;
}
.vdoholder1 img {
  width: 100%;
  height: 320px;
  object-fit: cover;
  object-position: center center;
  border-radius: 7px;
}
.vdoholder2 {
  background-color: var(--brand-quaternary-color);
  border-radius: 10px;
  padding: 10px;
	height: 420px;
}
.vdoholder2 img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: center center;
  border-radius: 7px;
}
.hajjumrahservicesbox {
  border-radius: 7px;
  margin-bottom: 30px;
  min-height: 332px;
  padding: 20px;
}
.hajjumrahservicesbox h4 {
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  line-height: 22px;
  margin-bottom: 5px;
  margin-top: 0;
}
.textwhite15 {
  color: #fff;
  font-size: 15px;
  line-height: 22px;
}
.hajjumrahservicesicon {
  margin-bottom: 15px;
}
.begiebox {
  background-color: #f0f9fd;
  border-radius: 20px;
  margin-bottom: 30px;
  padding: 22px 0px 22px 22px;
  min-height: 366px;
}
.begiebox img {
  float: right;
  margin-top: 60px;
}
.productsnav {
  width: 100%;
  margin-bottom: 30px;
}
.productsnav ul {
  padding: 0;
  margin: 0;
  text-align: center;
}
.productsnav li {
  display: inline-block;
  list-style: none;
  width: 222px;
  margin: 0px 2px;
  position: relative;
}
.productsnav li a {
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 400;
  display: block;
}
.productsnav li:nth-child(1) {
  background-color: #2a86c7;
  padding: 10px 20px;
  border-radius: 7px;
}
.active1 a::after {
  content: "";
  display: block;
  border-width: 10px 10px 0;
  border-style: solid;
  border-color: #2a86c7 transparent transparent;
  margin-left: -10px;
  position: absolute;
  bottom: -10px;
  left: 50%;
}
.productsnav li:nth-child(2) {
  background-color: #9d292d;
  padding: 10px 20px;
  border-radius: 7px;
}
.active2 a::after {
  content: "";
  display: block;
  border-width: 10px 10px 0;
  border-style: solid;
  border-color: #345c66 transparent transparent;
  margin-left: -10px;
  position: absolute;
  bottom: -10px;
  left: 50%;
}
.productsnav li:nth-child(3) {
  background-color: #345c66;
  padding: 10px 20px;
  border-radius: 7px;
}
.active3 a::after {
  content: "";
  display: block;
  border-width: 10px 10px 0;
  border-style: solid;
  border-color: #9d292d transparent transparent;
  margin-left: -10px;
  position: absolute;
  bottom: -10px;
  left: 50%;
}
.productsnav li:nth-child(4) {
  background-color: #df9e49;
  padding: 10px 20px;
  border-radius: 7px;
}
.active4 a::after {
  content: "";
  display: block;
  border-width: 10px 10px 0;
  border-style: solid;
  border-color: #df9e49 transparent transparent;
  margin-left: -10px;
  position: absolute;
  bottom: -10px;
  left: 50%;
}
.servicons {
  padding: 20px 0px;
}
.servicons ul {
  padding: 0px;
  margin: auto 33%;
  display: flex;
}
.servicons li {
  margin: 0px 12px;
  border-radius: 8px;
  list-style: none;
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  position: relative;
}
.servicons li:nth-child(1) {
  background-color: #1395f0;
  color: #fff;
}
.servicons li:nth-child(2) {
  background-color: #f9af41;
  color: #fff;
}
.servicons li:nth-child(3) {
  background-color: #f75356;
  color: #fff;
}
.servicons li:nth-child(4) {
  background-color: #1a8a54;
  color: #fff;
}
.servicons li::after {
  content: '+';
  font-size: 20px;
  color: #4c4c4c;
  background: #fff;
  display: block;
  width: 22px;
  height: 22px;
  position: absolute;
  right: -22px;
  top: 39px;
  z-index: 9;
  font-weight: 600;
}
.servicons li:last-child::after {
  content: '';
  font-size: 30px;
  color: #000;
  background: none;
  border: none;
}
.servbox {
  display: flex;
  width: 97px;
  height: 97px;
  justify-content: center;
  align-items: center;
}
.benefitsbox {
  background-color: var(--brand-tertiary-color);
  border-radius: 20px;
  padding: 30px 30px 0px 30px;
}
.whypointers {
  width: 100%;
  text-align: left;
}
.whypointers ul {
  margin: 0;
  padding: 0px;
}
.whypointers li {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  line-height: 21px;
  display: inline-block;
  width: 16.3%;
  padding: 15px;
  border-radius: 6px;
  list-style: none;
  /*background-color: var(--brand-tertiary-color);
  background: url(../img/green_bullet.png) no-repeat 2px 8px;*/
}
.whypointers li:nth-child(1) {
 	background-color: #73a6c1;
}
.whypointers li:nth-child(2) {
 	background-color: #6aad97;
}
.whypointers li:nth-child(3) {
 	background-color: #988bb7;
}
.whypointers li:nth-child(4) {
 	background-color: #dbc65c;
}
.whypointers li:nth-child(5) {
 	background-color: #60bac3;
}
.whypointers li:nth-child(6) {
 	background-color: #e98877;
}

.factors {
  background-color: #d8dde3;
  border-radius: 12px;
  padding: 18px;
  min-height: 132px;
  text-align: left;
  font-size: 14px;
	margin-bottom: 25px;
}
.factors h4 {
  font-size: 18px !important;
  font-weight: 500;
  padding: 0px 0px 10px 0px;
  margin: 0;
}
.form-group {
  margin-bottom: 30px;
}
.form-control {
  width: 100%;
  height: 46px;
  border: 1px solid #e3e3e3;
  padding: 8px 16px;
  border-radius: 4px;
  color: #000;
  font-size: 14px;
}
.custom-select {
  position: relative;
  display: inline-block;
  select {
    display: inline-block;
    border: 1px solid #bbb;
    padding: 4px 3px 3px 5px;
    margin: 0;
    width: 100%;
    height: 46px;
    border: 1px solid #e3e3e3;
    padding: 8px 16px;
    border-radius: 4px;
    font: inherit;
    outline: none;
    line-height: 1.2;
    background: #fff;
    -webkit-appearance: none; /* remove the strong OSX influence from Webkit */
    @include border-radius(6px);
    &:focus {
      @include box-shadow(#c00 0 0 3px 1px);
    }
    /* for Webkit's CSS-only solution */
    @media screen and (-webkit-min-device-pixel-ratio:0) {
      padding-right: 30px;
    }
  }
  &:after {
    content: "▼";
    position: absolute;
    top: 8px;
    right: 18px;
    bottom: 0;
    font-size: 0.7em;
    line-height: 2.9;
    padding: 0 4px;
    color: rgb(0, 0, 0);
    pointer-events: none;
    @include border-right-radius(6px);
  }
}
.textarea {
  width: 100%;
  border: 1px solid #e3e3e3;
  padding: 2px 14px;
  border-radius: 4px;
  color: #000;
  font-size: 13px;
}
.enquirybox {
  background-color: #d8dde3;
  padding: 12px;
  border-radius: 12px;
  font-size: 13px;
  color: #000;
}
.enquirybox a {
  text-decoration: none;
  font-size: 13px;
  color: #000;
}
.blogpostarea {
  margin-bottom: 20px;
  background-color: var(--brand-quaternary-color);
  border-radius: 25px;
}
.blogcontent {
  padding: 20px 20px 30px 20px;
}
.blogpostarea h3 {
  font-size: 18px;
  color: var(--brand-primary-color);
  line-height: 21px;
  font-weight: 600;
  margin-top: 0px;
  margin-bottom: 10px;
  padding: 0;
}
.blogpostarea h3 a {
  color: var(--brand-primary-color);
  text-decoration: none;
  transition: 0.3s;
}
.blogpostarea h3 a:hover {
  color: var(--brand-second-color);
  text-decoration: none !important;
}
.blogpostarea h3 span {
  color: #000;
  font-weight: 400;
  margin-top: 0px;
  margin-bottom: 15px;
}
.blogpostgraytext {
  font-size: 13px;
  color: #757575;
  line-height: 16px;
  font-style: italic;
	padding-bottom: 6px;
}
.blogpostgraytext i {
  font-size: 6px;
  color: #757575;
  padding-left: 5px;
  vertical-align: text-top;
  line-height: 20px;
}
.blogpostimg {
  background: url(../../img/noimage.webp) no-repeat center center #f9f9f9;
  width: 100%;
  margin-top: 0px;
  margin-bottom: 0px;
  border-radius: 20px 20px 0px 0px;
}
.blogpostimg img {
  width: 100%;
  border-radius: 20px 20px 0px 0px;
	height: auto;
	object-fit: cover;
	object-position: 50% 20%;
}
.blogpostimg2 {
  background: url(../../img/noimage.webp) no-repeat center center #f9f9f9;
  width: 100%;
  margin-top: 0px;
  margin-bottom: 0px;
  border-radius: 20px 20px 0px 0px;
}
.blogpostimg2 img {
  width: 100%;
  border-radius: 20px 20px 0px 0px;
	height: 350px;
	object-fit: cover;
	object-position: 50% 20%;
}
.bloguser{
	width: 60px;
	height: 60px;
	background: url("../../img/user.png") no-repeat top center;
	border-radius: 100%;
}
.blogpostcontent {
  font-size: 14px;
  color: #000;
  line-height: 20px;
}
.blog-thumb {
  margin-bottom: 30px;
	border-radius: 20px;
}
.blog-thumb img {
  border-radius: 20px;
	width: 100%;
	height: 300px;
	object-fit: cover;
	object-position: 50% 50%;
}
.authornamearea {
  margin-top: 30px;
  margin-bottom: 30px;
  border-top: solid 1px #d9d9d9;
  border-bottom: solid 1px #d9d9d9;
  padding: 20px 0px;
  font-size: 14px;
  color: #000;
  line-height: 20px;
  font-style: italic;
}
.authornamearea h6 {
  font-size: 16px;
  color: #000;
  line-height: 22px;
  font-weight: 600;
  margin-top: 5px;
  margin-bottom: 10px;
}
.postcommentbox {
  background: #e2f7fd;
  border-radius: 10px;
  padding: 30px 30px;
}
.postcommentbox h3 {
  font-size: 28px;
  color: #000;
  line-height: 30px;
  font-weight: 500;
  margin-top: 0px;
  margin-bottom: 20px;
}
.moretopicbox {
  border: solid 1px #d9d9d9;
  border-radius: 15px;
  padding: 20px 15px 15px 15px;
  margin-bottom: 30px;
}
.moretopicbox ul {
  margin: 10px 0px 0px 0px;
  padding: 0px 0px;
}
.moretopicbox ul li {
  background: url(../../img/green_bullet.png) no-repeat left top;
  background-position: 0px 9px;
  list-style-type: none;
  margin: 0px 0px;
  padding: 4px 0px 5px 12px;
  font-size: 15px;
  color: #000;
  line-height: 20px;
}
.moretopicbox ul li a {
  color: #000;
  text-decoration: none;
}
.moretopicbox ul li a:hover {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.tagbox {
  border: solid 1px #d9d9d9;
  border-radius: 15px;
  padding: 20px 15px 15px 15px;
  margin-bottom: 30px;
}
.tagbox ul {
  margin: 10px 0px 0px 0px;
  padding: 0px 0px;
}
.tagbox ul li {
  background: #ebfaff;
  list-style-type: none;
  margin: 0px 4px 4px 0px;
  padding: 2px 5px;
  font-size: 12px;
  color: #000;
  line-height: 20px;
	display: inline-block;
	border-radius: 4px;
	white-space: nowrap;
}
.tagbox ul li a {
  color: #000;
  text-decoration: none;
}
.tagbox ul li a:hover {
  color: var(--brand-primary-color);
  text-decoration: none;
}
.sociallinks {}
.sociallinks > li {
  display: inline-block;
  padding-left: 15px;
}
.similarpostsbox {
  margin: 0px;
}
.similarpostsbox ul {
  margin: 0px 0px;
  padding: 0px 0px;
}
.similarpostsbox ul li {
  list-style-type: none;
  margin: 0px 0px 10px 0px;
  padding: 0px 10px 0px 0px;
  font-size: 13px;
  color: #000;
  line-height: 18px;
  font-weight: 500;
}
.similarpostsbox ul li img {
  width: 100%;
  height: 80px;
  object-fit: cover;
  object-position: 50% 50%;
}
.similarpostsbox ul li a {
  border: solid 1px #d9d9d9;
  border-radius: 6px;
  display: block;
  color: #000;
  text-decoration: none;
  transition: all 0.5s;
  padding: 7px 7px;
}
.similarpostsbox ul li a:hover {
  color: #000;
  text-decoration: none;
  border: solid 1px var(--brand-second-color);
  border-radius: 6px;
  display: block;
}
.similarpostscont {
  padding-left: 10px;
}
.similarpostscont h6 {
  font-size: 13px;
  color: #000;
  line-height: 18px;
  font-weight: 500;
  margin-top: 0px;
  margin-bottom: 10px;
}
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 0px 0;
  border-radius: 0px;
}
.pagination > li {
  display: inline;
}
.pagination > li > a, .pagination > li > span {
  position: relative;
  float: left;
  margin-right: 5px;
  line-height: 32px;
  color: #4e4e4e;
  text-align: center;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #dcdcdc;
  width: 32px;
  border-radius: 100%;
  height: 32px;
}
/*.pagination > li:first-child > a, .pagination > li:first-child > span {
	margin-left: 0;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
  }
  .pagination > li:last-child > a, .pagination > li:last-child > span {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
  }*/
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
  z-index: 3;
  background-color: #dcdcdc;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  z-index: 2;
  color: #fff;
  cursor: default;
  background-color: var(--brand-primary-color);
  border-color: var(--brand-primary-color);
}
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
  color: #777;
  cursor: not-allowed;
  background-color: #fff;
  border-color: #ddd;
}
.pagination-lg > li > a, .pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.3333333;
}
.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.pagination-sm > li > a, .pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
}
.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.input-group-addon3, .input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}
.search-form {
  display: flex;
  position: relative;
}
.search-form input {
  background: #fff;
  background: #fff;
  border: 1px solid #e3e3e3;
  border-radius: 4px;
  flex: 1 1;
  font-size: 14px;
  font-weight: 400;
  height: 45px;
  padding: 0 20px;
}
.search-form button {
  background-color: #FFF;
  border: none;
  color: #000;
  font-size: 18px;
  position: absolute;
  right: 10px;
  top: 8px;
}
blockquote {
  background-color: #d1e7ef;
  border: 0;
  border-radius: 10px;
  display: block;
  font-style: italic;
  margin: 20px 0 0;
    padding: 6px 10px;
}
blockquote p {
  color: #212121;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.55;
  position: relative;
}
.quote {
  color: #2a86c7;
    font-size: 19px;
    font-style: normal;
    font-weight: 700;
    padding: 0px;
    margin: 0px;
}
blockquote .h4 {
    font-size: 18px;
    margin: 0px 0 6px;
}
blockquote cite {
  border-color: inherit;
  color: #212121;
  color: var(--body-color);
  display: block;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 5px;
  margin-top: 0;
  position: relative;
}
blockquote cite:before {
  background: #2a86c7;
  content: "";
  display: inline-block;
  height: 2px;
  margin-right: 10px;
  position: relative;
  top: -4px;
  width: 20px;
}
.widget {
  background: #d8dde3;
  border-radius: 15px;
  margin-bottom: 40px;
  padding: 22px;
  position: relative;
}
.widget_title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1em;
  margin: -.12em 0 30px;
  padding-bottom: 17px;
  position: relative;
}
.widget_title:before {
  background-color: #243f371a;
  bottom: 0;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  width: 100%;
}
.widget_title:after {
  background-color: #2a86c7;
  background-color: var(--theme-color);
  width: 135px;
}
.recent-post {
  margin-bottom: 20px;
  transition: .4s;
}
.recent-post .recent-post-meta {
  margin-bottom: 5px;
}
.recent-post .recent-post-meta a {
  color: #212121;
  display: block;
  font-size: 13px;
  font-weight: 400;
  margin-bottom: 0;
  text-decoration: none;
}
.recent-post .post-title {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: -.4rem;
  color: #000;
}
.recent-post .post-title a {
  font-size: 15px;
  font-weight: 500;
  margin-bottom: -.4rem;
  color: var(--brand-primary-color);
  text-decoration: none;
}
.pricingbox {
  background: #f0f9fd;
  border-radius: 15px;
  padding: 12px 16px;
  color: #000;
  font-size: 14px;
  line-height: 18px;
	text-align: left !important;
      min-height: 268px;
}
.pricingbox2 {
  background: #f0f9fd;
  border-radius: 15px 15px 0px 0px;
  padding: 12px 16px 28px 16px;
  color: #000;
  font-size: 14px;
  line-height: 18px;
	text-align: left !important;
	border: 1px solid #2c88c4;
    border-bottom: 0px;
}
.serieshead {
  color: #2c88c4;
  font-size: 24px;
  line-height: 27px;
  font-weight: 400;
  min-height: 75px;
}
.webhead {
  color: #9c282f;
  font-size: 24px;
  line-height: 27px;
  font-weight: 400;
  min-height: 75px;
}
.fithead {
  color: #355c65;
  font-size: 24px;
  line-height: 27px;
  font-weight: 400;
  min-height: 75px;
}
.enterphead {
  color: #9c282f;
  font-size: 24px;
  line-height: 27px;
  font-weight: 400;
  min-height: 75px;
}
.pricecont {
  min-height: 105px;
}
.photoheading {
  display: inline-block;
  margin-bottom: 20px;
  border-bottom: 2px solid #3c4855;
  width: 100%;
}
.photoheading h3 {
  background-color: #3c4855;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 25px;
  display: inline-block;
  margin-bottom: 0;
}
.photogallerynew {
  position: relative;
  transition: 0.4s;
  background: #232525;
  border-radius: 0px;
  padding: 0px;
  margin-bottom: 25px;
}
.photogallerynew a {
  text-decoration: none;
}
.photogallerynewimg {
  width: 100%;
  height: 380px;
  border-radius: 0px;
}
.photogallerynewimg img {
  width: 100%;
  height: 380px;
  border-radius: 0px;
  object-fit: cover;
  object-position: 50% 50%;
}
.photogallerynewimg2 {
  width: 100%;
  height: 120px;
  border-radius: 0px;
}
.photogallerynewimg2 img {
  width: 100%;
  height: 120px;
  border-radius: 0px;
  object-fit: cover;
  object-position: 50% 50%;
}
.photothumbs {
  width: 100%;
  height: 188px;
  position: relative;
  overflow: hidden;
}
.photothumbs img {
  width: 100%;
  height: 188px;
  object-fit: cover;
  object-position: 50% 50%;
}
.photothumbs2 {
  width: 100%;
  height: 58px;
  position: relative;
  overflow: hidden;
}
.photothumbs2 img {
  width: 100%;
  height: 58px;
  object-fit: cover;
  object-position: 50% 50%;
}
.seeallphotostext {
  font-size: 13px;
  color: #fff;
  line-height: 18px;
  font-weight: 400;
  background-color: #212121;
  border-radius: 3px;
  position: absolute;
  margin-top: -60px;
  margin-left: 15px;
  padding: 2px 6px;
  display: inline-block;
}
.seeallphotostext a {
  color: #fff;
  text-decoration: none;
}
.seeallphotostext a:hover {
  color: #fff;
  text-decoration: none;
}
.awardbox {
  background-color: var(--brand-tertiary-color);
  border-radius: 2px;
}
.awardbox img {
  width: 100%;
  height: 366px;
  object-fit: cover;
  object-position: center center;
  border-radius: 7px;
}
.seeallphotostext {
  font-size: 13px;
  color: #000;
  line-height: 18px;
  font-weight: 400;
  background-color: #fff;
  border-radius: 8px;
  position: absolute;
  margin-top: -35px;
  margin-left: 15px;
  padding: 2px 6px;
}
.seeallphotostext a {
  color: #000;
  text-decoration: none;
}
.seeallphotostext a:hover {
  color: #000;
  text-decoration: none;
}
.subnav {}
.subnav ul {
  padding: 10px;
  margin: 10px;
  overflow-x: auto;
  white-space: nowrap;
  text-align: center;
}
.subnav li {
  padding: 0px;
  margin: 0px;
  list-style: none;
  display: inline-block;
}
.subnav li a {
  padding: 0px;
  margin: 0px;
  background-color: var(--brand-primary-color);
  color: #fff;
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 5px;
  transition: 0.3s;
}
.subnav li a:hover {
  background-color: var(--brand-second-color);
  color: #fff;
}
.ctablock{
	border: 1px solid;
	border-color: var(--brand-second-color);
	padding: 16px 36px 30px 36px;
	border-radius: 15px;
	display: inline-block;
}
.ctablocknew{
	border: 1px solid;
	border-color: var(--brand-second-color);
	padding: 16px 36px 30px 20px;
	border-radius: 15px;
	display: inline-block;
}
.ctablocknew h4{
	font-size: 20px;
	padding: 0px;
	margin: 0px 0px 10px 0px;
}
.ctablock2{
	border-color: var(--brand-second-color);
	display: inline-block;
}
.ctablock2 h4{
	font-size: 20px;
	padding: 0px;
	margin: 0px 0px 10px 0px;
  
}
.ctablock2 h4 a{
	font-size: 20px;
	padding: 0px;
	margin: 0px 0px 10px 0px;
  color: var(--brand-primary-color);
  text-decoration: none;
}

.textwhite12{
	color: #fff;
	font-size: 12px;
}
.textwhite12 a{
	color: #fff;
	font-size: 12px;
	text-decoration: none;
}
.etosftrborder{
	border-top: 1px solid #3B98DB;
	padding-top: 5px;
	margin-top: 7px;
}
.etosftrlogo{
	
	padding-top: 5px;
	margin-top: 7px;
}
.etosftrlogo img{
	width: 132px;
}
.whyumrah360{
	display: flex;
	width: 100%;
	flex-direction: row;
	column-gap: 30px;
	grid-row-gap: 20px;
	flex-wrap: wrap;
	justify-content: center;
}
.whyumrahbox{
	width: 200px;
	height: 200px;
	border-radius: 100%;
	display: flex;
	flex-direction: column;
	text-align: center;
	justify-content: center;
	border: 3px solid #CDCDCD;
	font-size: 16px;
	line-height: 18px;
}


.whyumrah360new{
	width: 100%;	
}
.whyumrah360new li{
	width: 216px;
	height: 200px;
	display: inline-table;
	margin: 0px 10px 20px 10px;
}
.whyumrahcircle{
	width: 200px;
	height: 200px;
	border-radius: 100%;
	text-align: center;
	align-content: center;
	justify-content: center;
	font-size: 16px;
	line-height: 18px;
  margin: -10px 10px;
}
.fill1{
	background-color: #e6f5ff;
	color: #fff;
	font-weight: 500;
}
.fill2{
	background-color: #7fc467;
	color: #fff;
	font-weight: 500;
}
.fill3{
	background-color: #5abeb6;
	color: #fff;
	font-weight: 500;
}
.fill4{
	background-color: #4ba1cb;
	color: #fff;
	font-weight: 500;
}
.fill5{
	background-color: #745393;
	color: #fff;
	font-weight: 500;
}
.flextop1 {
  height: 75px;
    font-size: 15px;
    width: 75px;
}
.flexcontbox{
	min-height: 292px;
}
.flextop1box {
  background-color: rgb(255, 254, 246, 0.1);
    border-radius: 10px;
    padding: 20px;
    width: 100%;
    color: #fff;
    min-height: 310px;
}
.flexcontbox ul {
  padding: 10px 0px 0px 0px !important;
	margin: 0px !important;
}
.flexcontbox li {
  padding: 0px 0px 6px 12px !important;
	margin: 0px 0px 0px 0px !important;
	line-height: 16px !important;
	height: auto !important;
	text-align: left;
	background: url("../../img/whitebullet.png") no-repeat left top 5px;
	font-size: 13px;
}
.flextop1box h4{
  font-size: 18px;
  font-weight: 500;
    color: #fff;
    padding: 0px;
    margin: 0px;
}
.flexbottom2 {
  border-top: 4px solid #7fc467;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
	height: 140px;
    font-size: 15px;
    width: 140px;
}
.flexbottom2box {
  background-color: #F5F8F4;
    border-radius: 60px 60px 10px 10px;
    padding: 10px;
    margin-top: -35px;
    width: 100%;
	border: 2px solid #7fc467;
}
.flextop3 {
  border-top: 4px solid #5abeb6;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
	height: 140px;
    font-size: 15px;
    width: 140px;
}
.flextop3box {
  background-color: #EBF4F3;
    border-radius: 60px 60px 10px 10px;
    padding: 10px;
    margin-top: -35px;
    width: 100%;
	border: 2px solid #5abeb6;
}
.flexbottom4 {
  border-top: 4px solid #4ba1cb;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
	height: 140px;
    font-size: 15px;
    width: 140px;
}
.flexbottom4box {
  background-color: #F3F8FB;
    border-radius: 60px 60px 10px 10px;
    padding: 10px;
    margin-top: -35px;
    width: 100%;
	border: 2px solid #4ba1cb;
}
.flextop5 {
  border-top: 4px solid #745393;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
	height: 140px;
    font-size: 15px;
    width: 140px;
}
.flextop5box {
  background-color: #F3F0F5;
    border-radius: 60px 60px 10px 10px;
    padding: 10px;
    margin-top: -35px;
    width: 100%;
	border: 2px solid #745393;
}
.flexbottom6 {
  border-top: 4px solid #db3a39;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
	height: 140px;
    font-size: 14px;
    width: 140px;
}
.flexbottom6box {
  background-color: #F9F2F2;
    border-radius: 60px 60px 10px 10px;
    padding: 10px;
    margin-top: -35px;
    width: 100%;
	border: 2px solid #db3a39;
}
.subscriptionbox{
	background-color: #f5fbf8;
	border-radius: 20px;
	padding: 25px 25px 35px 25px;
	text-align: left;
}
.subscriptionbox h4{
	color: #2c88c4;
	font-size: 20px;
	font-weight: 500;
	padding: 0px 0px 16px 0px;
	margin: 0px;
}
.subscriptionbox ul{
	padding: 0px 0px 0px 18px;
	margin: 0px;
}
.subscriptionbox li{
	color: #093b24;
	font-size: 14px;
	line-height: 18px;
	font-weight: 300;
	padding: 0px 0px 8px 0px;
	margin: 0px;
}

.enterprisebox{
	background-color: #faf8f1;
	border-radius: 20px;
	padding: 25px 25px 35px 25px;
	text-align: left;
}
.enterprisebox h4{
	color: #c8a143;
	font-size: 20px;
	font-weight: 500;
	padding: 0px 0px 16px 0px;
	margin: 0px;
}
.enterprisebox ul{
	padding: 0px 0px 0px 18px;
	margin: 0px;
}
.enterprisebox li{
	color: #594619;
	font-size: 14px;
	line-height: 18px;
	font-weight: 300;
	padding: 0px 0px 8px 0px;
	margin: 0px;
}
.getdemotxt{
	font-size: 13px;
	line-height: 16px;
	color: #fff;
	text-align: left;
}
.requestlink{
	color: #fff;
}
.requestlink a{
	color: #fff;
	text-decoration: none;
}
/* lineup class and keyframes */
.text1 {
  animation: 2s anim-text1 ease-out;
}
@keyframes anim-text1 {
  0% {
    opacity: 0;
    transform: translateY(40%);
  }
  35% {
    opacity: 1;
    transform: translateY(0%);
  }
  100% {
    opacity: 1;
    transform: translateY(0%);
  }
}
/* lineup class and keyframes */
.text2 {
  animation: 2s anim-text2 ease-out;
}
@keyframes anim-text2 {
  0% {
    opacity: 0;
    transform: translateY(40%);
  }
  35% {
    opacity: 1;
    transform: translateY(0%);
  }
  100% {
    opacity: 1;
    transform: translateY(0%);
  }
}
.umrahpricebox1 {
    background: #fff;
    border: solid 1px #97cbeb;
    border-radius: 12px;
    position: relative;
    z-index: 1;
}
.umrahpricebox1head {
    background: #fff;
    border-radius: 12px 12px 0px 0px;
    padding: 0px 10px;
    text-align: center;
	height: 50px;
	width: 100%;
	display: table;
}
.umrahpricebox1head h3 {
    font-size: 19px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 400;
    margin-top: 0px;
    margin-bottom: 0px;
	display: table-cell;
	vertical-align: middle;
}
.umrahpricebox1head h3 span {
    font-size: 14px;
    color: #000;
    font-weight: 500;
}
.umrahpricebox1head h3 span span {
    color: #585858;
    font-weight: 400;
}
.umrahpricebox1contbg {
    background: #D8F0FF;
    width: 100%;
    height: 60px;
    display: table;
}
.umrahpricebox1cont {
    display: table-cell;
    vertical-align: middle;
    padding: 0px 15px;
    font-size: 12px;
    color: #4b5259;
    line-height: 18px;
    text-align: center;
}
.umrah1highlightsbox {
    background: #D8F0FF;
    border: solid 1px #97cbeb;
    border-top: none;
    margin-top: -12px;
    padding: 27px 15px 15px 15px;
    border-radius: 0px 0px 12px 12px;
}
.umrah1highlightsbox h4 {
    font-size: 17px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
}
.umrah1highlightsboxarrow {
    text-align: right;
    font-size: 15px;
    color: #2c88c4;
    line-height: 15px;
}
.umrah1highlightsbox ul {
    margin: 10px 0px 0px 0px;
    padding: 0px 0px;
}
.umrah1highlightsbox ul li {
    background: url(../../img/check.png) no-repeat left top;
    background-position: 0px 12px;
    list-style-type: none;
    margin: 0px 0px;
    padding: 10px 0px 10px 22px;
    border-bottom: solid 1px #b9e4d0;
    font-size: 13px;
    color: #000;
    line-height: 15px;
}
.umrah1highlightsbox ul li span {
    font-size: 11px;
    color: #0d5dd4;
}
.umrah1highlightsbox ul li:last-child {
    border-bottom: solid 0px #b9e4d0;
}


.umrahpricebox2 {
    background: #fff;
    border: solid 1px #97cbeb;
    border-radius: 12px;
    position: relative;
    z-index: 1;
}
.umrahpricebox2head {
    background: #fff;
    border-radius: 12px 12px 0px 0px;
    padding: 0px 10px;
    text-align: center;
	height: 50px;
	width: 100%;
	display: table;
}
.umrahpricebox2head h3 {
    font-size: 19px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 400;
    margin-top: 0px;
    margin-bottom: 0px;
	display: table-cell;
	vertical-align: middle;
}
.umrahpricebox2head h3 span {
    font-size: 14px;
    color: #000;
    font-weight: 500;
}
.umrahpricebox2head h3 span span {
    color: #585858;
    font-weight: 400;
}
.umrahpricebox2contbg {
    background: #D8F0FF;
    width: 100%;
    height: 60px;
    display: table;
}
.umrahpricebox2cont {
    display: table-cell;
    vertical-align: middle;
    padding: 0px 15px;
    font-size: 12px;
    color: #4b5259;
    line-height: 18px;
    text-align: center;
}
.umrah2highlightsbox {
    background: #D8F0FF;
    border: solid 1px #97cbeb;
    border-top: none;
    margin-top: -12px;
    padding: 27px 15px 15px 15px;
    border-radius: 0px 0px 12px 12px;
}
.umrah2highlightsbox h4 {
    font-size: 17px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
}
.umrah2highlightsboxarrow {
    text-align: right;
    font-size: 15px;
    color: #2c88c4;
    line-height: 15px;
}
.umrah2highlightsbox ul {
    margin: 10px 0px 0px 0px;
    padding: 0px 0px;
}
.umrah2highlightsbox ul li {
    background: url(../../img/check.png) no-repeat left top;
    background-position: 0px 12px;
    list-style-type: none;
    margin: 0px 0px;
    padding: 10px 0px 10px 22px;
    border-bottom: solid 1px #97cbeb;
    font-size: 13px;
    color: #000;
    line-height: 15px;
}
.umrah2highlightsbox ul li span {
    font-size: 11px;
    color: #0d5dd4;
}
.umrah2highlightsbox ul li:last-child {
    border-bottom: solid 0px #97cbeb;
}


.umrahpricebox3 {
    background: #fff;
    border: solid 1px #97cbeb;
    border-radius: 12px;
    position: relative;
    z-index: 1;
}
.umrahpricebox3head {
    background: #fff;
    border-radius: 12px 12px 0px 0px;
    padding: 0px 10px;
    text-align: center;
	height: 50px;
	width: 100%;
	display: table;
}
.umrahpricebox3head h3 {
    font-size: 19px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 400;
    margin-top: 0px;
    margin-bottom: 0px;
	display: table-cell;
	vertical-align: middle;
}
.umrahpricebox3head h3 span {
    font-size: 14px;
    color: #000;
    font-weight: 500;
}
.umrahpricebox3head h3 span span {
    color: #585858;
    font-weight: 400;
}
.umrahpricebox3contbg {
    background: #D8F0FF;
    width: 100%;
    height: 60px;
    display: table;
}
.umrahpricebox3cont {
    display: table-cell;
    vertical-align: middle;
    padding: 0px 15px;
    font-size: 12px;
    color: #4b5259;
    line-height: 18px;
    text-align: center;
}
.umrah3highlightsbox {
    background: #D8F0FF;
    border: solid 1px #97cbeb;
    border-top: none;
    margin-top: -12px;
    padding: 27px 15px 15px 15px;
    border-radius: 0px 0px 12px 12px;
}
.umrah3highlightsbox h4 {
    font-size: 17px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
}
.umrah3highlightsboxarrow {
    text-align: right;
    font-size: 15px;
    color: #2c88c4;
    line-height: 15px;
}
.umrah3highlightsbox ul {
    margin: 10px 0px 0px 0px;
    padding: 0px 0px;
}
.umrah3highlightsbox ul li {
    background: url(../../img/check.png) no-repeat left top;
    background-position: 0px 12px;
    list-style-type: none;
    margin: 0px 0px;
    padding: 10px 0px 10px 22px;
    border-bottom: solid 1px #b9e4d0;
    font-size: 13px;
    color: #000;
    line-height: 15px;
}
.umrah3highlightsbox ul li span {
    font-size: 11px;
    color: #0d5dd4;
}
.umrah3highlightsbox ul li:last-child {
    border-bottom: solid 0px #b9e4d0;
}


.umrahpricebox4 {
    background: #fff;
    border: solid 1px #b1e8d1;
    border-radius: 12px;
    position: relative;
    z-index: 1;
}
.umrahpricebox4head {
    background: #fff;
    border-radius: 12px 12px 0px 0px;
    padding: 0px 10px;
    text-align: center;
	height: 60px;
	width: 100%;
	display: table;
}
.umrahpricebox4head h3 {
    font-size: 17px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 400;
    margin-top: 0px;
    margin-bottom: 0px;
	display: table-cell;
	vertical-align: middle;
}
.umrahpricebox4head h3 span {
	font-size: 14px;
    color: #000;
    font-weight: 500;
}
.umrahpricebox4head h3 span span {
    color: #585858;
    font-weight: 400;
}
.umrahpricebox4contbg {
    background: #d0f8e7;
    width: 100%;
    height: 100px;
    display: table;
}
.umrahpricebox4cont {
    display: table-cell;
    vertical-align: middle;
    padding: 0px 15px;
    font-size: 12px;
    color: #4b5259;
    line-height: 18px;
    text-align: center;
}
.umrah4highlightsbox {
    background: #d0f8e7;
    border: solid 1px #b9efd6;
    border-top: none;
    margin-top: -12px;
    padding: 27px 15px 15px 15px;
    border-radius: 0px 0px 12px 12px;
}
.umrah4highlightsbox h4 {
    font-size: 17px;
    color: #2c88c4;
    line-height: 20px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
}
.umrah4highlightsboxarrow {
    text-align: right;
    font-size: 15px;
    color: #2c88c4;
    line-height: 15px;
}
.umrah4highlightsbox ul {
    margin: 10px 0px 0px 0px;
    padding: 0px 0px;
}
.umrah4highlightsbox ul li {
    background: url(../../img/pricecheck_icon.webp) no-repeat left top;
    background-position: 0px 14px;
    list-style-type: none;
    margin: 0px 0px;
    padding: 10px 0px 10px 15px;
    border-bottom: solid 1px #b9e4d0;
    font-size: 13px;
    color: #000;
    line-height: 15px;
}
.umrah4highlightsbox ul li span {
    font-size: 11px;
    color: #0d5dd4;
}
.umrah4highlightsbox ul li:last-child {
    border-bottom: solid 0px #b9e4d0;
}
.umrahpricehigltheight {
    min-height: 290px;
}


.pricetext {
    font-size: 18px;
    color: #000;
    line-height: 22px;
    font-weight: 500;
}
.priceboxcontarea {
    padding: 10px 10px 20px 10px;
    text-align: center;
}
/****************************************************************************************************
Toggle css start here
****************************************************************************************************/
.slider {
  display: none;
}
.slider2 {
  display: none;
}
.collapseSlider {
  display: none;
}
.sliderExpanded .collapseSlider {
  display: block;
  clear: both;
}
.sliderExpanded .expandSlider {
  display: none;
}
.slideropen {
  display: block;
}
.slideropen2 {
  display: block;
}
.blog-inner-title{
	font-size: 18px;
	letter-spacing: 0;
}
.blogfield{
    display: block;
    width: 100%;
    padding: 7px 10px;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.servicons-sm {
  padding: 0px 0px;
  margin-bottom: 5px;
}
.servicons-sm ul {
  padding: 0px;
  margin: auto 0%;
  display: flex;
}
.servicons-sm li {
  margin: 0px 10px 0px 0px;
  border-radius: 4px;
  list-style: none;
  display: inline-block;
  font-size: 12px;
  font-weight: 400;
  position: relative;
}
.servicons-sm li:nth-child(1) {
  background-color: #1395f0;
  color: #fff;
}
.servicons-sm li:nth-child(2) {
  background-color: #f9af41;
  color: #fff;
}
.servicons-sm li:nth-child(3) {
  background-color: #f75356;
  color: #fff;
}
.servicons-sm li:nth-child(4) {
  background-color: #1a8a54;
  color: #fff;
}
.servicons-sm li::after {
  content: '+';
    font-size: 14px;
    color: #4c4c4c;
    background: #fff;
    display: block;
    width: 17px;
    height: 18px;
    position: absolute;
    right: -13px;
    top: 6px;
    z-index: 9;
    font-weight: 600;
    border-radius: 100%;
    text-align: center;
}
.servicons-sm li:last-child::after {
  content: '';
  font-size: 15px;
  color: #000;
  background: none;
  border: none;
}
.servbox2 {
    display: flex;
    padding: 6px 10px;
    width: auto;
    justify-content: center;
    align-items: center;
}
.enterprise-text{
  background-color: #e5dcc9;
  padding: 5px;
  border-radius: 4px;
  font-size: 12px;
  line-height: 14px;
}
.whitetxt{
	font-size: 14px;
	line-height: 20px;
	color: #fff;
	margin-top: 15px;
}
.pos{
	min-height: 230px;
}
.pos h4{
	font-size: 23px;
}
.screensliderarea {
  border: solid 1px #d1d1d1;
  border-radius: 10px;
}
.screensliderimg {
  background: #ebfaff;
  width: 100%;
  height: 350px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.screensliderimg img {
  width: 100%;
  height: 350px;
  border-radius: 10px;
}
.screensliderinnerimg {
  background: #ebfaff;
  width: 100%;
  height: 450px;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}
.screensliderinnerimg img {
  width: 100%;
  height: 450px;
  border-radius: 10px;
}


@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
  .featuremainbox{
  display: flex;
  gap: 30px;
  flex-direction: column;
}
.grfeaturebox {
    margin-bottom: 0px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

.eazydmcbtn {
  padding: 9px 20px;
  font-size: 13px;
  color: #fff;
  text-align: center;
  font-weight: 400;
  border: solid 0px #c6c6c6;
  background: #2c88c4;
  border-radius: 30px;
  transition: 0.4s;
}
.eazydmcbtn:hover, .eazydmcbtn:focus, .eazydmcbtn.focus {
  background: #1B71A8;
  text-decoration: none;
}


@media (max-width: 1920px) {}
@media (min-width: 1600px) {}
.carousel-caption {
  right: 12.5%;
  top: 6rem;
  left: 12.5%;
}
.col-products {
  bottom: 110px;
  width: 35%;
  position: absolute;
  z-index: 99;
}
@media (max-width: 1540px) {
  .carousel-caption {
    right: 1%;
    top: 1rem;
    left: 1.5%;
  }
  .col-products {
    bottom: 87px;
    width: 45%;
    position: absolute;
    z-index: 99;
    left: 2%;
  }
  .ColCaptions h5 {
    font-size: 27px;
  }
  .ProductBox h3 {
    font-size: 14px;
    font-weight: 500;
  }
  .protxt {
    font-size: 12px;
  }
  .GroupProductBox {
    min-height: 101px;
  }
  .WebProductBox {
    min-height: 101px;
  }
  .FITProductBox {
    min-height: 65px;
  }
  .DynamicProductBox {
    min-height: 65px;
  }
}
@media (max-width: 1366px) {
  .header .item-left {
    flex: 0 0 15%
  }
  .header .item-center {
    flex: 0 0 61%
  }
  .header .item-right {
    flex: 0 0 13%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .featcont {
    min-height: 145px;
  }
  .whypointers li {
    font-size: 12px;
    line-height: 16px;
  }
  .whyumrah360new li {
    width: 158px;
}
.flextop1box {
    min-height: 356px;
}
.grfeaturebox {
    width: 25%;
}
}
@media (max-width: 1280px) {

  .header .item-left {
    flex: 0 0 15%
  }
  .header .item-center {
    flex: 0 0 61%
  }
  .header .item-right {
    flex: 0 0 13%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .carousel-caption {
    right: 6.5%;
    top: 1.5rem;
    left: 6.9%;
  }
  .ColCaptions h5 {
    font-size: 24px;
  }
  .ProductBox h3 {
    font-size: 13px;
    font-weight: 500;
  }
  .protxt {
    font-size: 12px;
  }
  .GroupProductBox {
	min-height: 95px;
	padding: 12px 14px;
  }
  .WebProductBox {
    min-height: 95px;
	padding: 12px 14px;
  }
  .FITProductBox {
    min-height: 56px;
	padding: 12px 14px;
  }
  .DynamicProductBox {
    min-height: 56px;
	  padding: 12px 14px;
  }
	.SubscriptionBox {
    padding: 12px 14px;
    min-height: 68px;
    background-color: #f5fbf8;
}
	.EnterpriseBox {
    padding: 12px 14px;
    min-height: 68px;
    background-color: #faf8f1;
}
  .col-products {
    bottom: 60px;
    left: 7.5%;
  }
  .headings h2 {
    font-size: 34px;
    font-weight: 300;
    padding: 0px;
    margin: 0px;
  }
  .headings h3 {
    font-size: 29px;
    font-weight: 300;
    padding: 0px;
    margin: 0px;
  }
  .headings h4 {
    font-size: 22px;
    font-weight: 500;
    padding: 0px;
    margin: 0px;
  }
  .headings h5 {
    font-size: 15px;
    font-weight: 500;
    padding: 0px;
    margin: 0px;
  }
  .cloudbox {
    font-size: 13px;
    line-height: 17px;
    min-height: 200px;
  }
  .clocktower {
    min-height: 403px;
  }
  .clocktower img {
    min-height: 403px;
  }
  .blogcont h3 {
    font-size: 16px;
    min-height: 68px;
  }
  .blogpara {
    min-height: 105px;
  }
  .featcont {
    min-height: 145px;
  }
  .begiebox {
    min-height: 399px;
  }
  .servicons ul {
    padding: 0px;
    margin: auto 29%;
    display: flex;
  }
  .whypointers li {
    font-size: 13px;
    line-height: 15px;
    font-weight: 400;
    width: 16.3%;
    padding-right: 10px;
  }
  .accordion3bg {
    padding: 12px 10px;
    font-size: 16px;
  }
  .factors {
    padding: 15px;
    min-height: 139px;
    font-size: 13px;
  }
  .factors h4 {
    font-size: 16px !important;
    font-weight: 500;
    padding: 0px 0px 10px 0px;
    margin: 0;
  }
  .pricingbox {
    font-size: 13px;
    line-height: 18px;
  }
	.pricingbox2 {
    font-size: 13px;
    line-height: 18px;
  }
  .serieshead {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    min-height: 60px;
  }
  .webhead {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    min-height: 60px;
  }
  .fithead {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    min-height: 60px;
  }
  .enterphead {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    min-height: 60px;
  }
  .pricecont {
    min-height: 90px;
  }
  .submit-btn {
    font-size: 13px;
    padding: 8px 12px;
  }
  .submit-btn:hover {
    font-size: 13px;
    padding: 8px 12px;
  }
  .submit-btn-line {
    font-size: 13px;
    padding: 7px 12px;
  }
  .series-btn {
    font-size: 13px;
    padding: 8px 6px;
  }
  .website-btn {
    font-size: 13px;
    padding: 8px 6px;
  }
  .fit-btn {
    font-size: 13px;
    padding: 8px 6px;
  }
  .dynamic-btn {
    font-size: 13px;
    padding: 8px 6px;
  }
  .awardbox img {
    width: 100%;
    height: 281px;
  }
.whyumrah360new li {
    width: 170px;
    margin: 0px 4px 20px 4px;
	font-size: 13px;
}
	.flexcontbox {
    min-height: 350px;
}
.content {
  font-size: 14px;
  line-height: 20px;
}
.content li {
  padding: 0px 0px 0px 25px;
  margin: 0px 0px 8px 0px;
  list-style: none;
  background: url(../../img/list_bullet.png) no-repeat 0px 2px;
}
.ctablock {
    padding: 10px 20px 20px 15px;
}	
.txt20 {
    font-size: 17px;
    font-weight: 300;
    line-height: 20px;
}	
.subheading3 {
  font-size: 17px;
}
.ctablocknew{
	padding: 8px 15px 18px 12px;
	border-radius: 15px;
	display: inline-block;
	font-size: 13px;
}
.ctablocknew h4{
	font-size: 16px;
	margin: 0px 0px 5px 0px;
}	
.servbox2 {
    display: flex
;
    padding: 2px 5px;
    width: auto;
    justify-content: center;
    align-items: center;
}
.servicons-sm li::after {
    content: '+';
    font-size: 12px;
    color: #4c4c4c;
    background: #fff;
    display: block;
    width: 15px;
    height: 16px;
    position: absolute;
    right: -14px;
    top: 2px;
    z-index: 9;
    font-weight: 600;
    border-radius: 100%;
    text-align: center;
}
.pricingbox2 {
    min-height: 280px;
}
.b2c {
    font-size: 14px;
}
.b2b {
    font-size: 14px;
}
.cms {
    font-size: 14px;
}
.featuremainbox {
    gap: 20px;
}
.grfeaturebox {
    width: 33.333% !important;
}
.grfeaturebox h4 {
    font-size: 19px;
    font-weight: 400;
}

}
@media (max-width: 1024px) {
  .header .item-left {
    flex: 0 0 10%
  }
  .header .item-center {
    flex: 0 0 55%
  }
  .header .item-right {
    flex: 0 0 15%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .col-products {
    bottom: 40px;
    width: 60%;
    position: absolute;
    z-index: 99;
  }
  .carousel-caption {
    top: 2rem;
  }
  .carousel-item img {
    height: 420px;
    object-fit: cover;
  }
  .logo img {
    width: auto;
    height: 38px !important;
  }
  .WebProductBox {
    min-height: 125px;
  }
  .GroupProductBox {
    min-height: 125px;
  }
  .cloudbox {
    font-size: 13px;
    line-height: 17px;
    min-height: 145px;
    padding: 15px;
  }
  .hundred {
    font-size: 45px;
  }
  .cloudtxt {
    font-size: 20px;
    line-height: 22px;
  }
  .kaaba {
    min-height: 170px;
  }
  .kaaba img {
    min-height: 170px;
  }
  .clocktower {
    min-height: 363px;
  }
  .clocktower img {
    min-height: 363px;
  }
  .content {
    font-size: 14px;
    line-height: 19px;
  }
  .blogcont h3 {
    font-size: 15px;
    min-height: 82px;
  }
  .blogpara {
    min-height: 142px;
  }
  .headings h2 {
    font-size: 34px;
  }
  .featcont {
    min-height: 165px;
  }
  .begiebox img {
    margin-top: 20px;
  }
  .servicons ul {
    margin: auto 25%;
  }
  .factors {
    min-height: 176px;
  }
  .pricecont {
    min-height: 105px;
  }
  .pricingbox {
    min-height: 318px;
  }
	.pricingbox2 {
    min-height: 330px;
  }
	  .whypointers li {
    font-size: 11px;
    width: 16.2%;
		  padding-right: 5px;
  }
      .whyumrah360new li {
        width: 260px;
        margin: 0px 4px 20px 4px;
}
.greenbox a {
    font-size: 16px;
}
.pinkbox a {
    font-size: 16px;
}
.brownbox a {
    font-size: 16px;
}
.orangebox a {
    font-size: 16px;
}

.flexcontbox {
        min-height: 300px;
    }
}
@media (max-width: 992px) {
  .rowmargintabmob40 {
    margin-top: 40px;
  }
  .rowmargintabmob30 {
    margin-top: 30px;
  }
  .rowmargintabmob20 {
    margin-top: 20px;
  }
  .rowmargintabmob10 {
    margin-top: 10px;
  }
  .rowmargindesk70 {
    margin-top: 0px;
  }
  .rowmargindesk30 {
    margin-top: 0px;
  }
  .rowmargindesk20 {
    margin-top: 0px;
  }
  .rowmargindesk10 {
    margin-top: 0px;
  }
  .whypointers li {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    width: 30.6%;
    padding-right: 10px;
    margin-bottom: 8px;
    vertical-align: top;
  }
  .factors {
    min-height: 120px;
    margin-bottom: 30px;
  }
}
@media (max-width: 768px) {
  .rowmargin40 {
    margin-top: 40px;
  }
  .rowmargin30 {
    margin-top: 30px;
  }
  .rowmargin20 {
    margin-top: 20px;
  }
  .rowmargin10 {
    margin-top: 10px;
  }
  .rowmargin5 {
    margin-top: 5px;
  }
  .right-mob-left {
    text-align: left !important;
  }
  .right-mob-center {
    text-align: center;
  }
  .left-mob-center {
    text-align: center;
  }
  .left-mob-right {
    text-align: right;
  }
  .center-mob-left {
    text-align: left;
  }
  .center-mob-right {
    text-align: right;
  }
  .blogimg {
    height: 170px;
  }
  .blogimg img {
    height: 170px;
  }
  .blogcont {
    padding: 15px 15px 25px 15px;
    font-size: 13px;
    line-height: 18px;
  }
  .blogpara {
    min-height: auto;
    margin-bottom: 20px;
  }
  .headings h2 {
    font-size: 28px;
  }
  .featcont {
    min-height: 215px;
  }
  .cont-right-padd {
    padding-right: 15px;
  }
.cont-left-padd {
  padding-left: 15px;
}
  .vdoholder1 img {
    height: 175px;
  }
  .vdoholder2 img {
    height: 175px;
  }
  .begiebox img {
    margin-top: 20px;
  }
      .productsnav ul {
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 10px;
        padding: 10px;
    }
  .productsnav li {
    display: inline-block;
    list-style: none;
    width: auto;
    margin: 0px 2px;
  }
  .servicons ul {
    margin: auto 15%;
  }
  .pricecont {
    min-height: auto;
	  padding-bottom: 15px;
  }
  .pricingbox {
    min-height: auto;
    margin-top: 30px;
	  width: 100%;
  }
	.pricingbox2 {
    min-height: auto;
    margin-bottom: 0px;
	width: 100%;
	border: 0px;
  }
	 .whypointers li {
    font-size: 13px;
    width: 32.3%;
		  padding-right: 10px;
		 min-height: 106px;
  }
  .greenbox a {
    font-size: 14px;
    line-height: 16px;
}
.pinkbox a {
    font-size: 14px;
    line-height: 16px;
}
.brownbox a {
    font-size: 14px;
    line-height: 16px;
}
.orangebox a {
    font-size: 14px;
    line-height: 16px;
}
	
	  
}
@media screen and (max-width : 767px) {
  .header .item-left {
    flex: 0 0 34% !important;
  }
  .header .item-center {
    flex: 0 0 1%;
  }
  .header .item-right {
    flex: 0 0 49% !important;
  }
  .carousel-item img {
    height: 220px;
    object-fit: cover;
  }
  .col-products {
    bottom: auto;
    width: 85%;
    position: relative !important;
    z-index: 99;
    margin-top: 30px;
  }
  .hidden-xs {
    display: none;
  }
  .logo img {
    width: auto;
    height: 26px !important;
  }
  .primary-btn a {
    font-size: 13px;
    padding: 6px 10px;
  }
  .GroupProductBox {
    min-height: auto;
  }
  .WebProductBox {
    min-height: auto;
  }
  .FITProductBox {
    min-height: auto;
  }
  .DynamicProductBox {
    min-height: auto;
  }
  .ColCaptions h5 {
    font-size: 21px;
    width: 60%;
  }
  .carousel-caption {
    top: 1.1rem;
  }
  .streamlinebox {
    padding: 20px 25px;
  }
  .subheading {
    font-size: 18px;
  }
  .headings h2 {
    font-size: 30px;
    font-weight: 300;
    padding: 0px;
    margin: 0px;
  }
  .headings h3 {
    font-size: 24px;
    font-weight: 300;
    padding: 0px;
    margin: 0px;
  }
  .headings h4 {
    font-size: 18px;
    font-weight: 500;
    padding: 0px;
    margin: 0px;
  }
  .headings h5 {
    font-size: 14px;
    font-weight: 500;
    padding: 0px;
    margin: 0px;
  }
  .content {
    font-size: 14px;
    line-height: 19px;
  }
  .blogcont h3 {
    font-size: 16px;
    min-height: auto;
  }
  .blogpara {
    min-height: auto;
    margin-bottom: 25px;
  }
  .featcont {
    min-height: auto;
  }
  .featureboxpadd {
    padding: 20px 20px 0px 20px;
  }
  .featurebox h3 {
    font-size: 24px;
    font-weight: 400;
  }
  .cont-right-padd {
    padding-right: 15px;
  }
  .cont-left-padd {
    padding-left: 15px;
  }
  .servicons ul {
    margin: auto auto;
    display: block;
  }
  .servbox {
    display: flex;
    width: auto;
    height: auto;
    justify-content: center;
    align-items: center;
  }
  .servicons li {
    padding: 12px 20px;
    border-radius: 6px;
    list-style: none;
    display: block;
    font-size: 16px;
    font-weight: 500;
    position: relative;
    width: 80%;
    margin: 10px auto;
  }
  .servicons li::after {
    content: '+';
    font-size: 18px;
    color: #4c4c4c;
    background: #fff;
    border-radius: 50%;
    display: block;
    width: 22px;
    height: 20px;
    left: 49%;
    transform: translateY(-50%);
    top: 49px;
    border: 1px solid #dddddd;
  }
  .servicons li:last-child::after {
    content: '';
    font-size: 30px;
    color: #000;
    background: none;
    border: none;
  }
  .whypointers li {
    width: 48.6%;
    min-height: 105px;
  }
  .factors {
    min-height: auto;
  }
  .serieshead {
    font-size: 20px;
    min-height: auto;
    padding-bottom: 12px;
  }
  .webhead {
    font-size: 20px;
    min-height: auto;
    padding-bottom: 12px;
  }
  .fithead {
    font-size: 20px;
    min-height: auto;
    padding-bottom: 12px;
  }
  .enterphead {
    font-size: 20px;
    min-height: auto;
    padding-bottom: 12px;
  }
  .awardtagcont {
    display: none;
  }
	.flexcontbox{
	min-height: auto;
}
	.whyumrah360new li {
    width: 90%;
    height: auto;
    display: inline-table;
    margin: 0px 10px 20px 10px;
}
	  .umrahpricehigltheight {
        min-height: auto;
    }
	
	.slideropen2 {
    display: none;
  }
	.priceboxarea {
    margin-bottom: 30px;
}
.tagline {
        font-size: 20px;
        color: #fff;
        font-weight: 500;
        line-height: 24px;
        margin-top: 0px;
        margin-bottom: 40px;
        text-align: center;
}
.tagline span {
    font-size: 14px;
    font-weight: 300;
    line-height: 22px;
}
.collage {
    height: 380px;
    padding: 80px 0px;
}
.grouppointers h2 {
    font-size: 20px;
}
.greenbox a {
    min-height: auto;
}
.pinkbox a {
    min-height: auto;
}
.brownbox a {
    min-height: auto;
}
.orangebox a {
    min-height: auto !important;
}
.seriesscrn {
    width: 100%;
    height: 255px;
}
.seriesscrn img {
    width: 100%;
    height: 255px;
}
}
@media (max-width: 575px) {
  .carousel-control-next {
    right: 0;
    height: 45%;
  }
  .carousel-control-prev {
    left: 0;
    height: 45%;
  }
  .kaaba {
    display: none;
  }
  .clocktower {
    display: none;
  }
  .cloudbox {
    margin-bottom: 0;
  }
  .headings h2 {
    font-size: 28px;
  }
  .headings h3 {
    font-size: 24px;
  }
  .list li {
    padding: 0px 0px 5px 0px;
    margin: 0px;
  }
  .DynamicProductBox {
    padding-right: 40px;
  }
	.whypointers li {
    width: 48.6%;
    min-height: 120px;
  }
	.topband.active {
    position: fixed;
    top: 0px;
    left: 0;
    width: 100%;
    z-index: 10000;
    background: rgb(255, 255, 255);
    -webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.15);
}
}








.grid-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto auto;
  gap: 20px;
}

/* First column spans 2 rows */
.tall {
  background: #000;
  border-radius: 12px;
  grid-row: span 2;
  height: 300px;
}

/* Normal top row columns */
.col {
  background: #000;
  border-radius: 12px;
  height: 100px;
}

/* Full-width second row block */
.row-wide {
  background: #000;
  border-radius: 12px;
  grid-column: 2 / 5; /* spans columns 2 to 4 */
  height: 150px;
}

/* Responsive stacking */
@media (max-width: 768px) {
  .grid-container {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
  .featuremainbox {
    flex-direction: column;
}
      .grfeaturebox {
        width: 100% !important;
    }

  .tall {
    grid-row: auto;
    height: 200px;
  }

  .row-wide {
    grid-column: auto;
  }

  .col {
    height: 80px;
  }
}