*{
    /* Default Font */
    font-family: 'Roboto', sans-serif;
}

html{
    scroll-behavior: smooth;
    /*padding: 5% 15%; */
}

.navbar-brand{
    font-weight: bold;
}

#title{
    opacity: 50%;
}

.nav-link{
    opacity: 75%;
}

.nav-social{
    opacity: 70%;
}

/* navbar animation */

/* Remove border from toggler */
.navbar-toggler {
    border: 0 !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* Lines of the Toggler */
.toggler-icon{
    width: 30px;
    height: 3px;
    background-color: #e74c3c;
    display: block;
    transition: all 0.2s;
}

/* Adds Space between the lines */
.middle-bar{
    margin: 5px auto;
}

/* State when navbar is opened (START) */
.navbar-toggler .top-bar {
    transform: rotate(45deg);
    transform-origin: 10% 10%;
}

.navbar-toggler .middle-bar {
    opacity: 0;
    filter: alpha(opacity=0);
}

.navbar-toggler .bottom-bar {
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
}
/* State when navbar is opened (END) */

/* State when navbar is collapsed (START) */
.navbar-toggler.collapsed .top-bar {
    transform: rotate(0);
}

.navbar-toggler.collapsed .middle-bar {
    opacity: 1;
    filter: alpha(opacity=100);
}

.navbar-toggler.collapsed .bottom-bar {
    transform: rotate(0);
}
/* State when navbar is collapsed (END) */

/* Color of Toggler when collapsed */
.navbar-toggler.collapsed .toggler-icon {
    background-color: #777777;
}

/* LANDING */

.landing-row{
    height: 700px;
}

#landing-title{
    font-size: 2.5em;
    font-family: 'Roboto', sans-serif;
    font-weight: bolder;
}

.landing-text{
    font-size: 20px;
}

#landing-dp{
    height: auto;
    max-width: 100%;
    max-height: 500px;
    border-radius: 5%;
}

.btn:focus,.btn:active {
    outline: none !important;
    box-shadow: none;
}

#download-a{
    margin: 0;
}

.landing-btn{
    width: 150px;
}

#about{
    margin-top: 100px;
}

.section-heading{
    font-size: 2em;
    font-family: 'Roboto', sans-serif;
    font-weight: bolder;
}

.work-card{
    width: 300px;
    height: 450px;
    border-radius: 10px;
}

#projects{
    margin-top: 100px;
}

.skill-card:hover{
    transform: scale(1.08);
    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
}

#carousel-container{
    width: 1200px;
    height: 500px;
    background-color: #777777;
}

.project-container{
    width: auto;
    height: auto    ;
    background-color: #777777;
}

.project-img-container{
    width: 600px;
    height: 100%;
    border: 2px solid black;
}

.test-div{
    /* border: 2px solid black; */
}

#footer{
    margin-top: 200px;
}