body {
    width: 99%;
}

#logo {
    width: 80%;
    height: 80%;
}

#navbar {
   height: 50%;
    margin-left: auto;
    padding-top: 0;
    
}

#navlinks {
    color: aliceblue;
    margin-right: 20px;
    font-size: 20px;
}

#navlinks:hover {
    color: var(--cyan);
}

.logo-container {
    display: flex;
    
}
#team {
    padding-top: 42px;
    color: rgb(99, 209, 236);
    font-size: 50px;
}

#SCCRM {
    padding-top: 42px;
    padding-left: 2%;
    color: #ab41b4;
    font-size: 50px;
}

#navToggle {
    background: linear-gradient(#afefff, #ab41b4);
    height:50%;
    margin-left:8%;
}
@media screen and (max-width: 1100px){
    body{
        width: 96%;
        margin-left: 2%;
        margin-right:2%;
    }
}


@media screen and (max-width: 991px) {
    #navToggle {
    
       margin-left: 50%;

    }
    #navbar{
        text-align: right;
    }
    body{
        width: 96%;
        align-items: center;
    }
    
}

@media screen and (max-width: 800px) {
    #navBtn {
        width: 15px;
    }

    #navToggle {
     margin-left:40% ;
    }

}
@media screen and (max-width: 700px) {
    #navBtn {
        width: 15px;
    }

    #navToggle {
     margin-left:30% ;
    }

}
@media screen and (max-width:650px) {
    #navBtn {
        width: 15px;
    }

    #navToggle {
     margin-left:20% ;
    }

}
@media screen and (max-width: 590px) {
    #navBtn {
        width: 15px;
    }

    #navToggle {
     margin-left:13% ;
    }
    body{
        width:94%;
        
        padding-left: 3%;
    }
}
@media screen and (max-width: 450px) {
    #navBtn {
        width: 15px;
    }

    #navToggle {
     margin-left:8% ;
    }

}
.carousel-caption {
    background: rgba(7, 7, 7, 50%);
    text-shadow: 6px 6px 3px#000000;
    border-radius: 20px;
}

.carousel-inner {
    width: 98.9vw
}