*{
    margin:0;
    padding:0;
    font-family: 'Montserrat', sans-serif;
}
body{
    background-image:radial-gradient(#0a6774,#00d4ff);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    overflow-x: hidden;
    z-index:-1;
    
}
section{
    perspective: 1000px;
    max-width: 50%;
    min-width: 25rem;
}
.main{
    width: 26.3rem;
    height: 47rem;
    position:relative; 
    top: .8rem;
    /* bottom: 6rem; */
    /* margin:auto; */
    left: 66%;
    /* margin-bottom: 3rem; */
    padding: 1.2rem;
    background-color:whitesmoke;
    opacity:0.956;
    border-radius: 5px;
    cursor: default;
    user-select: none;
    box-shadow: 0 10px 20px -6px #000;
}
img{
    width: 20rem;
    border-radius:100rem;
    position:relative;
    top: 1rem;
    left:3.5rem;
    
}
.intro{
    letter-spacing:.4rem;
    font-size: 18px;
    font-weight: 900;
    text-transform: uppercase;
    position: relative;
    top: 2rem;
    display: flex;
    justify-content: center;
}
.secintro{
    letter-spacing:.1rem;
    font-size: 13px;
    font-weight: 600;
    position: relative;
    top: 5rem;
    display: flex;
    justify-content: center;
}
.line1{
    width: 20rem;
    margin: auto;
    position: relative;
    top: 6rem;

}
.ly{
    letter-spacing:.2rem;
    font-size: 14px;
    font-weight: 800;
    position: relative;
    top: 8rem;
    display: flex;
    justify-content: center;
}
.line2{
    width: 20rem;
    margin: auto;
    position: relative;
    top: 10rem;

}
.details{
    letter-spacing:.3rem;
    font-size: 15px;
    font-weight: 800;
    position: relative;
    top: 13.5rem;
    display: flex;
    justify-content: center;
}
.icons{
    position: relative;
    top: 14rem;
    left: 2rem;
    width:22rem;
    padding: inherit;
}
ul{
    list-style: none;
    padding: 2rem;
    width:24rem;
    position: relative;
    left:-1rem;
}
a{
   display: inline;
    color: inherit;
   text-decoration: none;
   width: inherit;
}
.diln{
    display: inline;
    width: 5rem;
}
a:hover{
    transition: .2s;
    color: red;
}
ul.icon li{
    /* padding: 0.4em 0.5em; */
    text-decoration: none;
    /* width:2em;
    height: 2em; */
}
.credit{
    height: 0rem;
    cursor: default;
}
.credit ul{
    /* width: inherit; */
    /* height: inherit; */
    position: relative;
    top: 1rem;
    left: 35%;
    font-weight:bolder;
    font-size: 1rem;
    bottom: 1rem;
    margin-bottom: 1rem;
}
.credita:hover{
    transition:2s;
    text-decoration: underline #00d4ff;
    color:rgba(165, 14, 14, 0.959);
}
#fb:hover{
    color: rgb(10, 152, 207);
}
#tt:hover{
    color: #00d4ff;
}
@media (max-width:767px){
    body{
        height: 100%;
        /* margin-bottom: 1rem; */
    }
    section{
        height:100%;
        margin: 0;
    }
    .main{
        max-height: 100vh;
        min-height: 0vh;
        /* margin-left: 0;
        margin-right: 0; */
        left: 17%;
    }
    .secintro{
        word-wrap: break-word;
    }
    .credit ul{
        width: -3rem;
    }
    .credit{
        margin-bottom: 0rem;
    }
    .credit ul{
        left: 23%;
    }
    .ly{
        top: 8rem;
    }
    .details{
        top: 12.5rem;
    }
}