@media(max-width:450px)
{
	body{
		overflow-x: hidden !important
	}
    .service-m-div{
        display: none
    }
	.logo-div{
		width: 80%;
		padding: 0
	}
	.follow-div{
		display: none
	}
	.menu-div{
		display: none
	}
	.mob-menu{
		display: block;
		font-size: 30px;
		color: #fff
	}
	header{
		padding-left: 0;
		width: 100vw;
        overflow-x: hidden;
        box-sizing: border-box
	}
	.intro {
	margin-bottom: 10%;
    overflow-x: hidden
	}
	.intro-flex{
		padding-top: 25px
	}
	.intro-flex-img img{
		width: 100%
	}
	.intro-flex-text{
		width: 56%
	}
	.intro-flex-text h2{
		font-size: 13px
	}
	.intro-flex-img{
		width: 30%
	}
	.intro-flex-img img{
		width: 130%	
	}
	.intro-flex-text p{
		font-size: 10px;
		width: 80%
	}
	.outsource-btn{
		width: 80%;
  		margin-top: 20px;
  		padding: 7px;
  		font-size: 12px;
		margin-bottom: 20px;
		border: 1px solid #fff
	}
	.service-section h2{
		font-size: 15px
	}
	.service-flex{
		margin-top: 10%
	}
	.service-div{
		width: 30vw;
		margin-right: 0px;
		margin-bottom: 30px;
		height: 30vw
	}
	.service-div img{
		width: 70%;
		height: 70%;
	}
	.service-div p{
		font-size: 12px
	}
	h2 span {
  		padding: 0.9rem 2.5rem;
	}
	.footer-flex{
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0;
        overflow-x: hidden
	}
	.footer-about{
		width: 90%;
		padding: 5px;
		font-size: 1.2em
	}
	.footer{
		padding: 1.3rem;
        overflow-x: hidden
	}
	.footer img{
		width: 50%
	}
	.footer-contact{
		width: 90%
	}
	.footer-follow{
		width: 90%;
		margin: 25px 0 30px 0
	}
/*
	.icons:nth-child(2){
		display: block
	}
*/
	.follow-flex{
		display: flex;
		flex-direction: row;
	}
	.footer-copy{
		font-size: 1.2em
	}
	.footer-about p{
		font-size: 1em;
        color: #fff
	}
	.footer-contact h3, .footer-follow h3{
		font-size: 14px
	}
	.footer-contact p{
		font-size: 1.3em;
        color: #fff
	}
	.article-flex{
		display: block;
		margin: 25px 5%
	}
	.article-div-first {
	width: 100%;
	height: 25vh;
		margin-bottom: .8vw
	}
	.article-flex-item{
		display: flex
	}
	.article-div-rest{
		width: 50%;
		height: 20vh;
	}
	.articles{
		padding: 20px
	}
	.article-single-content h1{
		font-size: 12px;
		width: 100%
	}
	.articles-author {
	font-size: 10px;
	}
	.read-more{
		width: 56%
	}
	.article-single{
		height: auto;
		padding: 20px
	}
	.article-single-content{
		height: auto;
		width: 70%;
		margin-left: 20px
	}
	.article-image-div{
		width: 30%
	}
	.article-image-div img{
		width: 100%
	}
    .checkout-container {
	display: flex;
	gap: 40px;
	max-width: 100vw;
	/* margin: auto; */
	flex-wrap: wrap;
	/* padding: 50px; */
}
}
@media (max-width: 580px) and (min-width: 451px) 
{
	.logo-div{
		width: 80%;
		padding: 0
	}
	.menu-div{
		width: 65%
	}
	.menu-div{
		display: none
	}
    .follow-div{
        display: none
    }
	.mob-menu{
		display: block;
		font-size: 30px;
		color: #fff
	}
    .checkout-container {
	display: flex;
	gap: 40px;
	max-width: 100vw;
	/* margin: auto; */
	flex-wrap: wrap;
	/* padding: 50px; */
}
	header{
		padding-left: 0;
        overflow-x: hidden
	}
	.intro {
	margin-bottom: 5%;
	}
	.intro-flex{
		padding-top: 25px
	}
	.intro-flex-img img{
		width: 100%
	}
	.intro-flex-text{
		width: 56%
	}
	.intro-flex-text h2{
		font-size: 13px
	}
	.intro-flex-img{
		width: 30%
	}
	.intro-flex-img img{
		width: 130%	
	}
	.intro-flex-text p{
		font-size: 10px;
		width: 80%
	}
	.outsource-btn{
		width: 80%;
  		margin-top: 20px;
  		padding: 7px;
  		font-size: 12px;
		margin-bottom: 20px;
		border: 1px solid #fff
	}
	.service-section h2{
		font-size: 15px
	}
	.service-flex{
		margin-top: 10%
	}
	.service-div{
		width: 30vw;
		margin-right: 0px;
		margin-bottom: 30px;
		height: 30vw
	}
	.service-div img{
		width: 70%;
		height: 70%;
	}
	.service-div p{
		font-size: 12px
	}
	h2 span {
  padding: 0.9rem 2.5rem;
	}
	.menu-list a{
		font-size: 12px;
	}
	.menu-list li{
		margin-right: 10px
	}
	.footer-flex{
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 0
	}
	.footer-about{
		width: 90%;
		padding: 5px;
		font-size: 1.2em
	}
	.footer{
		padding: 1.3rem
	}
	.footer img{
		width: 50%
	}
	.footer-contact{
		width: 90%
	}
	.footer-follow{
		width: 90%;
		margin: 25px 0 30px 0
	}
/*
	.icons:nth-child(2){
		display: block
	}
*/
	.follow-flex{
		display: flex;
		flex-direction: row;
	}
	.footer-copy{
		font-size: 1.2em
	}
	.footer-about p{
		font-size: 1em
	}
	.footer-contact h3, .footer-follow h3{
		font-size: 14px
	}
	.footer-contact p{
		font-size: 1.3em;
        color: #fff
	}
	.article-flex{
		display: block;
		margin: 25px 5%
	}
	.article-div-first {
	width: 100%;
	height: 25vh;
		margin-bottom: .8vw
	}
	.article-flex-item{
		display: flex
	}
	.article-div-rest{
		width: 50%;
		height: 20vh;
	}
	.articles{
		padding: 20px
	}
	.article-single-content h1{
		font-size: 12px;
		width: 100%
	}
	.articles-author {
	font-size: 10px;
	}
	.read-more{
		width: 56%
	}
	.article-single{
		height: auto;
		padding: 20px
	}
	.article-single-content{
		height: auto;
		width: 70%;
		margin-left: 20px
	}
	.article-image-div{
		width: 30%
	}
	.article-image-div img{
		width: 100%
	}
}
@media (max-width: 767px) and (min-width: 580px) 
{
	.logo-div{
		width: 80%;
		padding: 0
	}
	.menu-div{
		width: 65%
	}
	.menu-div{
		display: none
	}
    .follow-div{
        display: none
    }
	.mob-menu{
		display: block;
		font-size: 30px;
		color: #fff
	}
	header{
		padding-left: 0
	}
	.intro {
	margin-bottom: 5%;
	}
	.intro-flex{
		padding-top: 25px
	}
	.intro-flex-img img{
		width: 100%
	}
	.intro-flex-text{
		width: 56%
	}
	.intro-flex-text h2{
		font-size: 20px
	}
	.intro-flex-img{
		width: 30%
	}
	.intro-flex-img img{
		width: 130%	
	}
	.intro-flex-text p{
		font-size: 14px;
		width: 80%
	}
	.outsource-btn{
		width: 80%;
  		margin-top: 25px;
  		padding: 7px;
  		font-size: 15px;
		margin-bottom: 20px;
		border: 1px solid #fff
	}
	.service-section h2{
		font-size: 15px
	}
	.service-flex{
		margin-top: 5%
	}
	.service-div{
		width: 30vw;
		margin-right: 0px;
		margin-bottom: 0px;
		height: 30vw;
		margin-top:15px
	}
	.service-div img{
		width: 70%;
		height: 70%;
	}
	.service-div p{
		font-size: 13px
	}
	h2 span {
  padding: 0.9rem 2.5rem;
	}
	.logo-div img{
		width: 155px
	}
	.menu-list a{
		font-size: 14px;
	}
	.menu-list li{
		margin-right: 18px
	}
	.footer-follow{
		display: none
	}
	.footer-about{
		width: 48%
	}
	.footer-contact{
		width: 38%
	}
	.article-flex{
		display: block;
		margin: 25px 5%
	}
	.article-div-first {
	width: 100%;
	height: 25vh;
		margin-bottom: .8vw
	}
	.article-flex-item{
		display: flex
	}
	.article-div-rest{
		width: 50%;
		height: 20vh;
	}
	.articles{
		padding: 20px
	}
	.article-single-content h1{
		font-size: 12px;
		width: 100%
	}
	.articles-author {
	font-size: 10px;
	}
	.read-more{
		width: 56%
	}
	.article-single{
		height: auto;
		padding: 20px
	}
	.article-single-content{
		height: auto;
		width: 70%;
		margin-left: 20px
	}
	.article-image-div{
		width: 30%
	}
	.article-image-div img{
		width: 100%
	}
    .footer{
		padding: 1.3rem;
        overflow-x: hidden
	}
}
@media (max-width: 1100px) and (min-width: 768px) 
{
	.menu-div{
		width: 100%
	}
    .menu-div ul li:first-child{
		display: none
	}
	.mob-menu{
		display: none
	}
	header{
		padding-left: 0
	}
	.intro {
	margin-bottom: 5%;
	}
	.intro-flex{
		padding-top: 25px
	}
	.intro-flex-img img{
		width: 100%
	}
	.intro-flex-text{
		width: 56%
	}
	.intro-flex-text h2{
		font-size: 20px
	}
	.intro-flex-img{
		width: 30%
	}
	.intro-flex-img img{
		width: 130%	
	}
	.intro-flex-text p{
		font-size: 14px;
		width: 80%
	}
	.outsource-btn{
		width: 80%;
  		margin-top: 25px;
  		padding: 7px;
  		font-size: 15px;
		margin-bottom: 20px;
		border: 1px solid #fff
	}
	.service-section h2{
		font-size: 15px
	}
	.service-flex{
		margin-top: 5%
	}
	.service-div{
		width: 20vw;
		margin-right: 0px;
		margin-bottom: 20px;
		height: 20vw
	}
	.service-div img{
		width: 70%;
		height: 70%;
	}
	.service-div p{
		font-size: 13px
	}
	h2 span {
  padding: 0.9rem 2.5rem;
	}
	.logo-div img{
		width: 140px
	}
	.menu-list a{
		font-size: 14px;
	}
	.menu-list li{
		margin-right: 25px
	}
    .follow-div{
        padding-right: 0
    }
	.footer-follow{
		display: none
	}
	.footer-about{
		width: 48%
	}
	.footer-contact{
		width: 38%
	}
    .logo-div{
        padding-left: 1%
    }
	.article-flex{
		display: block;
		margin: 25px 5%
	}
	.article-div-first {
	width: 100%;
	height: 25vh;
		margin-bottom: .8vw
	}
	.article-flex-item{
		display: flex
	}
	.article-div-rest{
		width: 50%;
		height: 20vh;
	}
	.articles{
		padding: 20px
	}
	.article-single-content h1{
		font-size: 12px;
		width: 100%
	}
	.articles-author {
	font-size: 10px;
	}
	.read-more{
		width: 56%
	}
	.article-single{
		height: auto;
		padding: 20px
	}
	.article-single-content{
		height: auto;
		width: 70%;
		margin-left: 0px
	}
	.article-image-div{
		width: 30%
	}
	.article-image-div img{
		width: 75%
	}
}
@media (max-width: 1200px) and (min-width: 1101px){
	.menu-div{
		width: 50%
	}
	.mob-menu{
		display: none
	}
	header{
		padding-left: 0
	}
	.intro {
	margin-bottom: 5%;
	}
	.intro-flex{
		padding-top: 25px
	}
	.intro-flex-img img{
		width: 100%
	}
	.intro-flex-text{
		width: 56%
	}
	.intro-flex-text h2{
		font-size: 25px
	}
	.intro-flex-img{
		width: 30%
	}
	.intro-flex-img img{
		width: 130%	
	}
	.intro-flex-text p{
		font-size: 16px;
		width: 80%
	}
	.outsource-btn{
		width: 80%;
  		margin-top: 25px;
  		padding: 10px;
  		font-size: 15px;
		margin-bottom: 20px;
		border: 1px solid #fff
	}
	.service-section h2{
		font-size: 15px
	}
	.service-flex{
		margin-top: 5%
	}
	.service-div{
		width: 18vw;
		margin-right: 0px;
		margin-bottom: 20px;
		height: 18vw
	}
	.service-div img{
		width: 80%;
		height: 80%;
	}
	.service-div p{
		font-size: 13px
	}
	h2 span {
  padding: 0.9rem 2.5rem;
	}
	.logo-div{
		width: 40%;
		padding-left: 5%
	}
	.logo-div img{
		width: 155px
	}
	.menu-list a{
		font-size: 14px;
	}
	.menu-list li{
		margin-right: 25px
	}
}