@import './fonts/fonts.css';
@import './media.css';

:root {
    --mouse-glow: rgba(82, 94, 136, 0.4);
    --selection-color: rgb(82, 94, 136);
    --brand-color: #7A86B0;
    --secondary-brand-color: #6470A0;
    --secondary-brand-color-rgba: rgba(100, 112, 160, 0.2);
}

* {
    padding: 0;
    margin: 0;
}

*::selection {
    background-color: var(--selection-color);
}

*::-moz-selection {
    background-color: var(--selection-color);
}

*::-webkit-selection {
    background-color: var(--selection-color);
}

html {
    background: url('../img/bg.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
}

#mouse-glow {
    width: 80px;
    height: 80px;
    background: var(--mouse-glow);
    border-radius: 50%;
    z-index: 9999;
}

a {
    text-decoration: none;
}

a:visited {
    color: none;
}

.container {
    text-align: center;
    align-content: center;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

.logo {
    width: 250px;
    height: 250px;
    border-radius: 50%;
    border: 4px solid #333;
    margin-top: 0;
}

.main-title {
    font-family: 'BungeeHairline';
    font-size: 65px;
    color: var(--secondary-brand-color);
    padding: 0;
}

.site-nav {
    padding-top: 0;
    margin-bottom: 0;
}

.nav-link {
    color: var(--brand-color);
    font-size: 35px;
}

#nav-insta {
    padding-right: 12px;
}

.links {
    margin-left: auto;
    margin-right: auto;
    width: 550px;
    padding-top: 18px;
}

.link-block {
    background-color: var(--secondary-brand-color-rgba);
    height: 60px;
    border-radius: 40px;
    cursor: pointer;
    border: 2px solid var(--secondary-brand-color);
    margin: 0px 10px 15px 0px;
}

.link-title {
    display: block;
    text-align: center;
    font-family: 'BungeeHairline';
    font-size: 28px;
    color: white;
}

.copyright {
    font-family: 'BungeeHairline';
    color: white;
    font-size: 15px;
}

.share-btn-wrapper {
    text-align: right;
    width: 60px;
    height: 60px;
    border: 0.2 solid white;
    border-radius: 50%;
    background: rgba(0.0, 0.0, 0.0, 0.2);
    margin-top: 1%;
    margin-left: 1%;
}

.share-btn {
    text-align: center;
    padding-top: 20px;
    color: white;
}