@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;900&family=Libre+Baskerville&display=swap');
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    scroll-behavior:smooth;
}
html{
    width:100%;
    overflow-x:hidden;
}
body {
 
    padding-bottom: 20px;
    width: 100vw;
}
p{
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    font-size: 2.5rem;
}
h1 {
    font-family: 'Libre Baskerville', serif;
    font-weight: 400;
    font-size: 90px;
    margin-top: 10rem;
    margin-bottom: 10rem;
}

.body-content {
    padding-left: 15px;
    padding-right: 15px;
}
.layout_title {
    color: #B61E03;
    opacity:.4;
    transition: ease-in-out 0.6s;
}
.layout_title:hover{
    opacity:1;
}
footer{
    display:flex;
    flex-direction:row;
    opacity: .8;
    align-items:flex-start;
    justify-content:flex-end;
}
footer > div:nth-child(1){
    flex:50%;
}
footer > div:nth-child(2) {
    flex: 50%;
}

.flex_items{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
   
}
.flex_items i{
    font-size:1.5rem;
}
.flex_items span{
    font-size:1.2rem;
}
    .flex_items span a {
        color: #B61E03;
        
        transition: ease-in-out .3s;
    }
    .flex_items span a:hover {
        color: black;
        text-decoration:none;
    }
.flex_items_col{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    margin-top:2rem;
    gap:15px;
}

.flex_items2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}
.flex_items2 i {
    font-size: 2rem;
}

.flex_items2 span {
    font-size: 1.7rem;
}
.flex_items2 span a {
    color: #B61E03;
    transition: ease-in-out .3s;
}

    .flex_items2 span a:hover {
        color: black;
        text-decoration: none;
    }

.parent-link {
    transition: ease-in-out .7s;
    list-style: none;
    margin-right: 50px;
    position:relative;
    
    
}
    .parent-link a {
        color: #B61E03;
        position: relative;
        text-decoration: none;
        transition: ease-in-out 0.5s;
        font-size: 1.9rem;
        font-weight: 800;
    }
.language_style > li{
    list-style:none;
}
    .language_style > li > a {
        font-size: 1.6rem;
        text-decoration: none;
        color: #B61E03;
        transition:ease-in-out .3s;
    }
    .language_style > li > a:hover {
        
        
        color: black;
    }


.sub-links {
    display: none;
    background-color: rgba(255,255,255,1);
    width: 100%;
    position: absolute;
    border-radius: 5px 5px 10px 10px;
    padding: 10px;
    font-size: 16px !important;
    font-weight: 200 !important;
}
.parent-link:hover .sub-links {
    display: flex;
    flex-direction:column;
    text-align:left;
    gap:10px;
    padding:5px;   
    
}
.sub-links a{
    font-size:16px;
    font-weight:200;
    
}
.sub-links a:hover{
   color:black !important;
   
 }

.bg-nav{
    opacity:1;
     border-radius: 20px;
     transition:ease-in .9s;
     z-index:9999999;
 }
.github_hover a{
    color:black;
    text-decoration:none;
}
.github_hover a:hover {
    color: #B61E03 !important;
}
/* extra*/
svg {
    width: 100%;
}

.filled-heading {
    text-transform: uppercase;
    text-align:center;
    font-family: 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 60px;
    line-height: .9;
}

#background path {
    animation: pulse 7s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite;
    transform-origin: 50% 50%;
    transform-box: fill-box;
}

@keyframes pulse {
    
    0%, 100% {
        transform: scale(0) rotate(275deg);
    }

    35%, 65% {
        transform: scale(3) rotate(0deg);
    }
}