:root{
  --yellow-f : #fc0;
  --red-f : #E71020;	
  --blue-g : #2381ff;
  --green-f : #00704A;
  --violet-f: #612889;  
}

.bg-yellow-food{
	background-color: var(--yellow-f) !important;
}
.bg-red-food{
	background-color: var(--red-f) !important;
}
.bg-blue-gas{
	background-color: var(--blue-g) !important;
}
.bg-green-food{
	background-color: var(--green-f) !important;
}
.bg-voilet-food{
	background-color: var(--violet-f) !important;
}

 #section-1 .full-width > .h2-bottom-heading-h5{
	max-width:750px; 
 }
 
 .position-relative{
	position: relative;
 }
 .position-absolute{
	position: absolute;
 }
 .margin-t-p5 {
	margin-top: .5rem !important;
 }
 
 .margin-t-1P75{
	margin-top: 1.75rem !important;
 }
 
 .section-bg-6{
    background-size: cover;
    background-position: center top;
 }
 #section-1 .full-width > .h2-heading{  
	max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

#section-2 .container > .section-bg-7{
	min-height:666px;
	border-radius:30px;
}

 #section-2 .full-width > .h2-bottom-heading-h5{
	 max-width:775px;
 }
  #section-2 .full-width {
    padding-left: 10px;
    padding-right: 10px;
}
 .btn{
	width:100%; 
	background: #00CB17;
    box-shadow: 0px 2.375px 3.16667px rgba(15, 46, 89, 0.14);
    padding: 14px 14px 14px 14px;
	color:#fff;
	display:inline-block;
 }
 .btn-success{
	background: #00CB17 !important;
	color:#fff !important;
 }
  .btn-orange{
	background: #E98C00 !important;
	color:#fff !important;
 }
 .btn-c{
	max-width: 200px;
    height: 50px;
    border-radius: 60px;
	font-size:15px;
 }
 
 #section-3 .grid-1 {
    grid-template-columns: 1fr 1fr 1fr;
}
#section-3 .g-cards {
    border: 1px solid #ffffff24;
    border-radius: 16px;
    padding: 35px  20px;
}

#section-3 .h2-bottom-heading-h5{
	margin-bottom:0px !important;
	font-weight:600 !important;
}
.c-hr-ugc ,.c-hr-ugc-2 {
    border: none;
    border-bottom: 6px solid #2A4B7B;
    max-width: 85px;
    margin: auto;
    border-radius: 6px;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.c-hr-ugc-2{
    border-bottom: 3px solid #FFFFFF;   
}
#section-3 .last-section > p{
	max-width:860px;
}
#section-6.section-bg-9{
	min-height: calc(100vh + 120px);
}
#section-6 .h2-heading.lh-45 {
  line-height:45px;
}
.section-bg-10{
    background-image: url('/assets/newdesign/img/ugc/ugc-sec-7.png');
	background-size: cover;
    background-position: center bottom;
	min-height:100vh;
}
 #section-3 .grid-1,#section-7 .grid-1 {
    grid-template-columns: 1fr 1fr 1fr;
}
#section-7 .content p{
	max-width: 340px;
    text-align: center;
    line-height: 32px;
}
#section-7 .content .h2-d {
    font-size: 60px;
}

.ml-1{
    margin-left:1rem	
}
.mr-1{
    margin-right:1rem	
}
.mb-n5p{
	margin-bottom: -5px;
}
#section-5 .position-absolute{
    left: calc(50% - 100px);
    top: 65%;
}
.hat,.bottom{
	width:100%;
	max-width:680px;
}
#section-3 img{
  width:100%;
  max-width:120px;   
}
#section-4 .grid-1.top-area{
    grid-template-columns: 1fr 3fr 1fr;
}
#section-4 .grid-1.col-5{
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	gap: 11px;
    margin-top: 14px;
}

#section-4 .content-box{
	background-color:var(--blue-dark);
	border-radius: 24px;
    padding: 38px;
}
#section-4 .h5-d-20{
    font-weight: 400;
}

.video-box{
	width: 100%;
    height: 100%;
    max-height: 160px;
}
.video-box video,.video-box .video{
	width: 100%;
    height: 100%;
	max-height: 130px;
	background-color: #000;
	cursor:pointer;
}
.video-box a{
    display: block;
    width: 100%;
    float: left;
    margin-top: 0px;
    padding: 5px;
    border-radius: 0px 0px 4px 4px;
    color: #000;
	font-size:14px;
}
.video-box .video img{
	width: 100%;
    height: 100%;
	max-height: 130px;
	margin-left:auto;
	margin-right:auto;
	object-fit: contain;
}
.video-box .video{
	display: grid;
    grid-auto-flow: row;
    gap: 15px;
}
.video-container-md{
    width: 100%;
    display: grid;
    gap: 12px;
}	

.section-bg-10 {
	background-position: center bottom;
	min-height: 80vh;
}

@media screen and (min-width: 1140px) and (max-width:1400) {
	#section-6.section-bg-9 {
		min-height: calc(100vh + 120px);
	}
}	

@media only screen and (max-width: 1140px){

	#section-6.section-bg-9 {
		min-height: 48vh;
	}
	.section-bg-10 {
		background-position: center bottom;
		min-height: 44vh;
	}
	#section-7 .content .h2-d {
		font-size: 50px;
	}
	#section-6 .h2-heading.lh-45 {
		line-height: 22px;
	}
	#section-2 .margin-t-5 {
		margin-top: calc(100% - 64%) !important;
	}
	#section-7 .content p {
		line-height: 24px;
	}
	.video-box video {
		max-height: 120px;
	}
	#section-1 .full-width > .h2-bottom-heading-h5 {
		max-width: 598px;
	}
	#section-3 .last-section > p {
		max-width: 700px;
	}
	#section-1.padding-b-7 {
		padding-bottom: 4rem !important;
   }
   #section-4 .content-box {
		padding: 28px;
	}
	
}
@media only screen and (max-width: 1085px){

	#section-6.section-bg-9 {
		min-height: 70vh;
	}
}	
@media only screen and (max-width: 991px){
 .content-box .h5-d-20 {
    font-size: 16px !important;
 }
 .btn-c {
    max-width: 220px;
    height: 54px;
    border-radius: 60px;
	font-size: 17px;
 }
 .btn{   
        padding: 15px 14px 15px 15px;
}
 
 #section-4 .content-box {
    padding: 26px;
}
#section-7 .full-width .margin-b-5{
	margin-bottom:0px;
}
#section-5 .btn-c {
    left: calc(50% - 110px);
    top: 65%;
}

.btn-icon-phone {
    left: 38px;
}
#section-2 .margin-t-5 {
    margin-top: calc(100% - 52%) !important;
}
#section-3 img {
    width: 100%;
    max-width: 100px;
}
#section-7 .content .h2-d {
    font-size: 40px;
    line-height: 40px;
}
}

@media only screen and (max-width: 767px){

#section-3 .grid-1, #section-7 .grid-1 {
    grid-template-columns: 1fr !important;
}

#section-4 .content-box {
    border-radius: 24px;
}
.btn {
    padding: 12px 14px 12px 10px;
 }
 .btn-c {
    max-width: 220px;
    height: 48.33px;
	border-radius: 50px;
 }
 #section-5 .btn-c {
    left: calc(50% - 110px);
    top: 65%;
}
.h1-heading, .h1-d {
    font-size: 29px !important;
}
#section-6 .h2-heading.lh-45 {
    line-height: 24px;
}
#section-3 img {
    width: 100%;
    max-width: 100px;
}
#section-3 .g-cards {
    padding: 35px 35px;
}
#section-6.section-bg-9 {
    min-height: 54vh;
}
#section-7 .margin-b-5{
    margin-bottom: 2rem !important;
}
#section-7 .margin-t-7{
    margin-top: 1rem !important;
}
#section-7 .content .h2-d {
    font-size: 48px;
    line-height: 48px;
}
#section-7 .content p {
    line-height: 22px;
}
#section-7 .content .h5-d-20 {
    font-size: 20px !important;
}
#section-7 .content .full-width {
    width: 100%;
    margin-top: 14px;
}
#section-2 .container > .section-bg-7 {
    min-height: 550px;
    border-radius: 30px;
}
#section-2 .container .h2-heading {
    font-size: 20px !important;
}

#section-1.padding-t-7 {
    padding-top: 3rem !important;
}
#section-1.padding-b-7 {
    padding-bottom: 3rem !important;
}
#section-1 .h2-bottom-heading-h5 {
    margin-bottom: 2rem !important;
}
#section-2 .margin-t-5 {
    margin-top: calc(100% - 35%) !important;
}
.video-container-md{
	display:none;
}
#section-4 .grid-1.top-area {
    grid-template-columns: 1fr;
}
.btn-c {
    max-width: 170px;
    height: 48px;
    border-radius: 50px;
    font-size: 14px;
}
.btn {
    padding: 13px 14px 12px 14px;
}

.btn-icon-phone {
    max-width: 16px;
    left: 28px;
    top: 16px;
}
#section-5 .btn-c {
    left: calc(50% - 85px);
    top: 65%;
}
#section-3 img {
    width: 100%;
    max-width: 85px;
}
/*
.img-slider-2 {
	grid-template-columns: repeat(2, 1fr) !important;
    display: grid !important;
}*/
#section-4 .grid-mb{
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
}
.video-box .video img {
    width: 100%;
    height: 100%;
	max-height: 110px;
    object-fit: contain;
}
.video-box video, .video-box .video {
  max-height:110px;	
}
}
@media only screen and (max-width: 575px){
	#section-8 .mr-1{
		margin-right:0px;
	}
	#section-8 .ml-1{
		margin-left:0px;
	}
	#section-6.section-bg-9 {
		min-height: 67vh;
	}
}
@media only screen and (max-width: 380px){
	#section-6.section-bg-9 {
		min-height: 65vh;
	}
	#section-2 .full-width{
		padding-left:10px;
		padding-right:10px;
	}
	
	.btn-icon-phone {
		top: 11px;
		left:18px;
		max-width: 17px;
	}
	#section-8 .mr-1{
		margin-right:0px;
	}
	#section-8 .ml-1{
		margin-left:0px;
	}

	#section-2 .margin-t-5 {
		margin-top: calc(100% - 24%) !important;
	}
	.btn-c {
		max-width: 140px;
		height: 40px;
		border-radius: 50px;
		font-size: 12px;
	}
	.btn {
		padding: 10px 14px 10px 14px;
	}
	#section-5 .btn-c {
		left: calc(50% - 70px);
		top: 65%;
	}
	#section-2 .h2-bottom-heading-h5 {
	
		margin-bottom: 1.75rem !important;
	}
	#section-3 img {
		width: 100%;
		max-width: 80px;
	}
	
	
	#section-6.section-bg-9 {
		min-height: 80vh;
	}

}
@media only screen and (max-width: 360px){
	
	
	
}


@media screen and (max-width: 991px) and (max-height:500px) {
	#section-6.section-bg-9 {
		min-height: 130vh;
	}
	#section-2 .margin-t-5 {
		margin-top: calc(100% - 50%) !important;
	}
}
@media screen and (max-width: 740px) and (max-height:360px) {

	#section-2 .margin-t-5 {
		margin-top: calc(100% - 62%) !important;
	}
}