@media (max-width:767px) {
    .modal-body .btn-close {
        color: #fff !important
    }
}



@media (max-width: 576px) {

    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        width: 90% !important;
    }

    p {
        font-size: 12px !important;
    }

    header .menu li {
        list-style-type: none;
        display: inline-block;
        margin: 3px 5px;
    }

    header .menu li a {
        font-size: 24px;
    }

    .fs100 {
        font-size: 5em;
    }

    .fs-50 {
        font-size: 2em;
    }

    .fs-5em {
        font-size: 3em;
    }

    .fs-5emResp {
        font-size: 2em;
    }

    .bubbleParent .bubble6 {
        position: absolute;
        top: -140px;
        right: 130px;
        width: 70px;
        height: 70px;
        border-radius: 100%;
        /* background-color: rgb(11, 255, 113); */
        background: url('../img/decor/l6.png') no-repeat;
        background-size: contain;
        margin: 50px;
        animation: 1.5s float2 infinite alternate-reverse;
    }

    .main {
        background-position: bottom right;
    }

    .overlap {
        position: relative;
        background: #00000094;
        color: #fff;
        padding: 45px 15px;
        backdrop-filter: blur(25px);
    }

    .backCard {
        /* content: ''; */
        position: absolute;
        top: -30px;
        right: -20px;
        /* background: url(../img/decor/fl-1.png); */
        background: url(../img/decor/texture.jpg);
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .bg-blog {
        min-height: 480px;
    }


    .bg-branding {
        background: url('../img/decor/branding.png') no-repeat;
        background-position: top;
        background-size: cover;
        min-height: 600px;
        /* padding: 50px 0 50px 0; */
        display: flex;
        align-items: center;
        position: relative;
        z-index: 0;
    }

    .bg-devop {
        background: url('../img/decor/development.png') no-repeat;
        background-position: top;
        background-size: cover;
        min-height: 600px;
        display: flex;
        align-items: center;
        position: relative;
        z-index: 0;
    }

    .bg-marketing {
        background: url('../img/decor/marketing.png') no-repeat;
        background-position: top;
        background-size: cover;
        min-height: 600px;
        /* padding: 50px 0 50px 0; */
        display: flex;
        align-items: center;
        position: relative;
        z-index: 0;
    }

    .cardBadge h4 {
        font-size: 15px;
    }
}

@media (min-width: 992px) {}

@media (max-width:992px) {
    .portfolioResp .cardPortfolio .cardImg {
        height: 100% !important;
        overflow: hidden;
    }
    /* .cardPortfolio .cardImg {
        height: 250px !important;
        overflow: hidden;
    } */

    .cardProjects .cardImg {
        height: 330px;
        overflow: hidden;
    }

    .cardProjects .cardImg img{
        object-fit: contain;
        height: 330px;
    }

    .cardPortfolio .cardImg img{
        object-fit: contain;
    }

    .upperBan {
        position: relative;
        top: 0;
    }

    .about2 {
        background: none;
    }

    .mainAbout {
        background: url(../img/bg/main-about.png);
        background-position: 20%;
    }

    .bgService {
        background-size: cover;
    }

    /* FONTS */
    .h3,
    h3 {
        font-size: calc(1.2rem + .2vw) !important;
    }

    .display-4 {
        font-size: calc(1.2rem + 2.2vw) !important;
    }

    .nav__list-item {
        font-size: 3vh !important;
        line-height: 1.4 !important;
    }

    .h-sm-130 {
        height: 130px;
    }

    .cardArticle .cardImg {
        height: 350px;
        overflow: hidden;
    }

  

    .fs-sm-7 {
        font-size: calc(0.7rem + 1vw) !important;
    }

    .orbit {
        width: 150%;
        height: 450px;
        right: -110px;
        bottom: 200px;
        z-index: -1;
    }

    .burger {
        right: 25px !important;
        top: 50px;
    }

    .imgBehind {
        position: relative;
        top: 20px;
        z-index: -1;
    }

    .cardbasic2Resp{
        position: relative;
        top: -40px;
    }

    .cardbasic2 h4 {
        font-size: 16px;
    }

    .devProjects{
        background: url('../img/decor/dr1.png');
        min-height: 250px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        position: relative;
    }

    
.innerContact {
	background: url('../img/bg/bg-contact.png') no-repeat;
	background-position: center;
	min-height: 100vh;
	padding: 200px 0 50px 0;
	display: flex;
	align-items: center;
	position: relative;
	z-index: 0;
}


}

@media (max-width:1200px) {
    .burger {
        right: 80px;
    }
}

@media (max-width:1400px) {}

@media (max-width:1600px) {
    .burger {
        right: 200px;
    }

}

/* RESPONSIVE START */
.banGreenResp {
    background: #E1E9DE;
    padding: 50px 0;
    color: #000;
}

.banGreenResp .number {
    font-size: 7em;
    color: #E1E9DE;
    text-shadow:
        -1px -1px 0 #71784B,
        1px -1px 0 #71784B,
        -1px 1px 0 #71784B,
        1px 1px 0 #71784B;
}

.banDpurpleResp {
    background: #10110B;
    padding: 50px 0;
    color: #fff;
}

.banDpurpleResp .number {
    font-size: 7em;
    color: #10110B;
    text-shadow:
        -1px -1px 0 #71784B,
        1px -1px 0 #71784B,
        -1px 1px 0 #71784B,
        1px 1px 0 #71784B;
}

.banWhiteResp {
    background: #fff;
    padding: 50px 0;
    color: #000;
}

.banWhiteResp .number {
    font-size: 7em;
    color: #fff;
    text-shadow:
        -1px -1px 0 #71784B,
        1px -1px 0 #71784B,
        -1px 1px 0 #71784B,
        1px 1px 0 #71784B;
}

.banGrayResp {
    background: #E9E9E9;
    padding: 50px 0;
    color: #000;
}

.banGrayResp .number {
    font-size: 7em;
    color: #E9E9E9;
    text-shadow:
        -1px -1px 0 #71784B,
        1px -1px 0 #71784B,
        -1px 1px 0 #71784B,
        1px 1px 0 #71784B;
}

.banYellowResp {
    background: #F1EDDC;
    padding: 50px 0;
    color: #000;
}

.banYellowResp .number {
    font-size: 7em;
    color: #F1EDDC;
    text-shadow:
        -1px -1px 0 #71784B,
        1px -1px 0 #71784B,
        -1px 1px 0 #71784B,
        1px 1px 0 #71784B;
}


/* RESPONSIVE END */
/* OlivX: giant outlined section words sized to fit DM Serif Display */
.fs100 {
	font-size: clamp(2rem, 9vw, 200px);
	overflow-wrap: break-word;
}

/* OlivX: headings in narrow desktop columns scale down so long words fit in DM Serif Display */
@media (min-width: 992px) {
	.col-lg-4 > .display-1,
	.col-lg-4 > .display-2 {
		font-size: min(3.9vw, 60px);
	}

	.col-lg-2 > .display-1 {
		font-size: min(5rem, 5.5vw);
	}

	.overlap h2,
	.overlap .h2 {
		font-size: clamp(1.5rem, 2.1vw, 2rem);
	}
}
