@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;700&display=swap');
:root{
    --color-body:#ffffff;
    --color-heading:#FFFFFF;
    --font-para:'Bai Jamjuree';
    --color-gold:rgb(246, 255, 0);
    --font-nav:'Tangerine', sans-serif;
}
#heading{
    font-family: var(--font-para);
    font-family: 'Delius', cursive;
    font-family: 'Great Vibes', cursive;
}
.fonty{
    font-family: var(--font-para);
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(0, 229, 255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }
.main{
    background: linear-gradient(rgba(0, 0, 0, 0.9),rgba(24, 23, 23, 0.9)),url("./Assets/background.avif");
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
    min-height: 100vh;
    min-width: 100%;
}
.foliohead{
    /* font-size: 60px; */
    font-family: var(--font-para);
}
.navi:hover{
    border-bottom: 1px solid skyblue;
    transition: 0.5s all;
}
/* .navi{
    border-bottom: 1px solid black;
} */
#home:hover{
    color: red;
    border-bottom: 1px solid bl;
}
.subheading{
    border-bottom: 1px solid black;
}
#achievments{
    background-color: rgb(236, 236, 236);
}
.bton{
    color: #FFFFFF;
    border-color: #FFFFFF;
    border-radius: 0%;
}
.bton:hover{
    color: white;
    background-color: rgb(0, 157, 157);
    border-color: aqua;
}
.btn:hover{
    transition: 0.5s all;
}
@media(max-width:768px)
{
    .navi{
        /* margin-left: 30px; */
        background-color: rgb(0, 0, 0,0.5);
        color: #FFFFFF;
        padding-top: 3px;
    }
    /* .navbar-nav{
        width: 10px;
    } */
}
@media (min-width:768px)
{
    .navi{
        margin-left: 50px;
    }
    /* .navbar-nav{
        width: 10px;
    } */
}
@media (min-width:850px)
{
    .navi{
        margin-left: 65px;
    }
    .navbar-nav{
        width: 10px;
    }
}
@media (min-width:992px)
{
    .navi{
        margin-left: 80px;
    }
    html{
        scroll-padding: 40px;
    }
    .navbar{
        background-color: black;
        opacity: 0.8;
    }
}
@media (min-width:1020px)
{
    .navi{
        margin-left: 100px;
    }
    html{
        scroll-padding: 40px;
    }
}
@media(min-width:1200px)
{
    .navi{
        margin-left: 120px;
    }
}
@media(min-width:1300px)
{
    .navi{
        margin-left: 150px;
    }
}
@media(min-width:1500px)
{
    .navi{
        margin-left: 180px;
    }
}
.navi{
    font-family: var(--font-nav);
    font-weight: bolder;
    text-transform: uppercase;
}
.fa-brands:hover{
    color: rgb(0, 217, 255);
}
a .fa:hover{
    color: #00fffb;
    transition: 1s all;
}
a .fa {
    color: #ffffff;
}
.ico img{
    transition: 1s all;
}
.card-img-top:hover{
    transition: 0.5s all;
    scale: 1.3;
    padding: 0%;
    overflow: hidden;
}
.card{
    overflow: hidden;
}