/* social media css - start */
.social-media {
    position: fixed;
    z-index: 9999;
    top: 28%;
    right: 0%;
    width: 48px;
    height: fit-content;
    padding: 2px;
    border-radius: 6px;
    background-color: #e6e6e6;
}

.social-media:hover {
    border: 0.12em solid #018888;
    box-shadow: 0px 0px 10px #018888;
}

.social-media>div {
    max-width: 45px;
    max-height: 42px;
    margin: 2px;
    border-radius: 6px;
}

.social-media>div:hover {
    /* cursor: pointer; */
    transform: scale(1.0) translateX(-0.6em);
}

.social-media>div i {
    font-size: 45px;
    margin: -1px auto;
}

/* facebook */
.social-media .facebook {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px #3b5998;
}

.social-media .facebook i {
    color: #3b5998;
}

.social-media .facebook:hover {
    background-color: #3b5998;
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .facebook i:hover {
    color: #ffffff;
}

/* instagram */
.social-media .instagram {
    background-color: #d6249f;
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .instagram i {
    color: #ffffff;
}

/* whatsapp */
.social-media .whatsapp {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px #4fce5d;
}

.social-media .whatsapp i {
    color: #4fce5d;
}

.social-media .whatsapp:hover {
    background-color: #4fce5d;
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .whatsapp i:hover {
    color: #ffffff;
}

/* twitter */
.social-media .twitter {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px #00acee;
}

.social-media .twitter i {
    color: #00acee;
}

.social-media .twitter:hover {
    background-color: #00acee;
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .twitter i:hover {
    color: #ffffff;
}

/* linkedin */
.social-media .linkedin {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px #0072b1;
}

.social-media .linkedin i {
    color: #0072b1;
}

.social-media .linkedin:hover {
    background-color: #0072b1;
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .linkedin i:hover {
    color: #ffffff;
}

/* youtube */
.social-media .youtube {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px #c4302b;
}

.social-media .youtube i {
    color: #c4302b;
}

.social-media .youtube:hover {
    background-color: #c4302b;
    box-shadow: 0px 0px 3px #ffffff;
}

.social-media .youtube i:hover {
    color: #ffffff;
}

/* social media css - end */