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

@media only screen and (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 1810px;
	}
	.modal-dialog {
		max-width: 690px;
		margin: 1.75rem auto;
	}
}

@media only screen and (max-width: 1199px) {
    .nav-btn {
        margin-left: 0;
    }
    .navbar-custom > li {
        background-image: url(../images/link-arrow.png);
		background-repeat: no-repeat;
		background-position:right;
		background-size: 20px;
    }
       
}

@media only screen and (min-width: 992px) {
    .main-nav .nav-link {
        padding:24px 40px!important;
    }
    
}

@media only screen and (max-width: 991px) {
    .dropdown-toggle::after {
        margin-top: 10px;
        margin-right: 6px;
        float: right;
    }
    .navbar-light .navbar-toggler {
        border: none;
        color: white;
        padding: 0;
        font-size: 25px;
    }
    .navbar-toggler:focus {
        border: none;
        outline: none;
    }
    .nav-btn,
    .navbar-custom > li > a:before {
        display: none;
    }
    .navbar-collapse > ul {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .main-nav {
        padding: 5px 15px;
	}
    /*.navbar-collapse.show{
		position: fixed;
		width:100%;
		height: 100%;
		background: var(--white);
		z-index: 3;
		align-items: flex-start;
		top: 63px;
		left:0;
		padding: 0 20px;
	}*/		
}


@media only screen and (max-width: 767px) {
	.for-desktop{
		display:none
	}	
	.for-mobile{
		display:block
	}	
	h1, heading1{
		font-size:var(--lg);
	}
	h2, heading2{
		font-size:var(--md);
	}
	h3, heading3{
		font-size:var(--sm);
	}
	h4, heading4{
		font-size:var(--xs);
	}
	.container{
		padding-left:15px;
		padding-right:15px;
	}
    .topber {
        display: none;
    }
	.banner-down-arrow{
		width: 36px;
	}
	.home-hero-banner {
		padding-bottom:0
	}
    .home-hero-banner .hero-content{
		padding:0;
		height:450px;
	}
	.home-hero-banner .hero-content .text-area .title-text {
		margin-top: 100px;
	}
	.home-hero-banner .hero-content .text-area h2 {
		font-size: 1.3rem
	}
	.home-hero-banner .hero-content .step1-content h2.title-text,
	.home-hero-banner .hero-content .step2-content h2.title-text,
	.home-hero-banner .hero-content .step3-content h2.title-text, 
	.home-hero-banner .hero-content .step4-content h2.title-text{
		    font-size: var(--xs);
	}
    .home-hero-banner .hero-content .circle{
		height: 80px;
		width: 80px;
		
	}
	.home-hero-banner .hero-content .circle.step1 {
		transform: translate(-135%, -40%);
	}
	.home-hero-banner .hero-content .circle.step2 {
		transform: translate(-70%, 9%);
	}
	.home-hero-banner .hero-content .circle.step3 {
		transform: translate(50%, 9%);
	}
	.home-hero-banner .hero-content .circle.step4 {
		transform: translate(135%, -40%);
	}
	.home-hero-banner .hero-content .step1-content{
		top: auto;
		transform: translate(3%, 33%);
	}
	.home-hero-banner .hero-content .step2-content{
		top: auto;
		transform: translate(48%, 67%);
	}
	.home-hero-banner .hero-content .step3-content{
		top: auto;
		right:0;
		transform: translate(-137%, 80%);
	}
	.home-hero-banner .hero-content .step4-content{
		top: auto;
		right:0;
		transform: translate(-54%, 53%);
	}
	.step1-content img, .step2-content img, .step3-content img, .step4-content img{
		height:100px
	}
	.home-lead-contr{
		border-top: 10px solid var(--darkenGreen);
		border-right: 10px solid var(--darkenGreen);
		border-bottom: 10px solid var(--darkenGreen);
		border-left: 10px solid var(--darkenGreen);
	}
	.home-lead-contr .content-area .title{
		width:auto
	}
	.home-lead-contr .cloud-content-area .cloud-area, .home-lead-contr .cloud-content-area .form-group{
		display:none
	}
	
	.home-lead-contr .content-area .text-area{
		display:none
	}
	.home-lead-contr .text-area{
		padding: 30px 30px 60px;
	}
	.showcase-slider .col-sm-12{
		margin-top:20px;
	}
	.showcase-slider .col-sm-12:first-child{
		margin-top:0px;
	}
	.home-lead-contr .current-value{
		font-size: 3rem;
		line-height:3rem;
	}
	.home-lead-contr .current-dollar-value{
		font-size: 3rem;
		line-height:3rem;
	}
	.visit-number{
		font-size: 1.7rem;
		line-height:1.7rem;
	}
	.home-lead-contr .content-area {
		padding-left: 35px;
	}
	.home-lead-contr .content-area .title{
		padding:20px;
		font-size: 1.2rem;
		margin-top: 20px;
		line-height: 1.7rem;
	}
	.home-lead-contr .cloud-content-area{
		margin-top: 50px;
		padding-left: 0;
		padding-right: 0;
	}
	.home-lead-contr .cloud-content-area .text-area{
		background-size: 75px;
		margin-top:0;
		margin-bottom:0;
		padding-top: 30px;
		padding-bottom: 80px;
	}
	.about-img{
		margin-left: 0px;
	}
	.about-part .text-area{
		padding-right: 0px;
	}	
	.arrow-link{
		width:100%
	}
	.btn-block-sm{
		width:100%
	}
	.impact-hero-banner{
		background: rgba(152,202,62,.5);
		padding-bottom:20px;
	}
	.impact-content .left-panel{
		padding-right:15px;
	}
	.activities-section .card{
		flex-direction: column;
	}
	.activities-section .card .card-body {
		width: 100%;
		order:2
	}
	.activities-section .card .card-img {
		width:100%;
		order:1
	}
	.collaborate-section .card{
	flex-direction:column;
	}

	.collaborate-section .card .card-body{
		width:100%
	}

	.collaborate-section .card .card-img{
		width:100%
	}
	.four-piller-section .card{
		flex-direction:column
	}
	.four-piller-section .card .card-body{
	width:100%
	}
	.four-piller-section .card .card-img{
		width:100%
	}
	.beyond-hcd-part .card{
	flex-direction:column;
	}

	.beyond-hcd-part .card .card-body{
		width:100%
	}

	.beyond-hcd-part .card .card-img{
		width:100%
	}
	.impact-container{
		max-width: 300px;
		height: 280px;
	}
	.impact-container .circle p{
		display:none
	}
	.impact-container .circle {
    width: 160px;
    height: 160px;
    padding: 0 10px;
	}
	.card-with-label .card{
		flex-direction: column;
	}
	.card-with-label .card .card-img, .card-with-label .card .card-body{
		width:100%
	}
	.card-with-label .card .card-body{
		border-left: none;
	}
	.piller-contr{
		margin-top:0px
	}
	.piller-contr .card-container + .card-container{
		margin-top:20px
	}
	.piller-contr .card-container .card, .piller-contr .card-container .heading-card-top {
		margin: 0;
	}
	.beyond-hcd-part .img-contr {
		padding-left: 15px;
		order:1
	}
	.beyond-hcd-part .text-contr {
		order:2
	}
	.fadeIn, .fadeIn img{
		height:330px;
		left: 0;
		margin-left: auto;
		margin-right: auto;
		margin-bottom:20px
	}
	.showcase-slider .card{
		margin:0
	}
	.value-text {
		white-space: inherit;
		left:0px;
	}
	.order-list-approach li.list-group-item {
		counter-increment: li;
		border: none;
		list-style-position: outside;
		width: 100%;
		margin: 0 0px 30px 45px;
	}
	.our-framework .section .row .img-contr {
		padding: 0 15px;
		order:1
	}
	.our-framework .section .row .text-contr {
		padding: 0 15px;
		order:2;
		margin-top:20px
	}
	.our-framework .section {
		margin: 0;
	}
	
	.result-contr h2{
		font-size:1.3rem;
		width:80%
	}
	.approach-hero-banner{
		padding:30px 0
	}
	.social-link li a{color:var(--black); margin-right:19px; font-size:1rem; font-weight:400; text-decoration:underline}
	.about-part .about-content{
		margin-top:20px
	}
}

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


@media screen and (max-width:420px) {
    .logo {
        width: 150px;
    }
    .navbar-custom li a:hover:before {
        bottom: 0px;
        width: 50px;
    }
    .nav-btn {
        margin-left: 0;
        font-size: 16px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

@media screen and (max-width:360px) {
    .logo {
        width: 150px;
    }

    .navbar-custom li a:hover:before {
        bottom: 0px;
        width: 50px;
    }

    .nav-btn {
        margin-left: 0;
        font-size: 16px;
        margin-top: 10px;
        margin-bottom: 10px;

    }

    
}
