@import url('https://fonts.googleapis.com/css2?family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700&display=swap');

::selection {
    background-color: #ffffff;
    color: #000000;
}

body {
    font-family: "Google Sans", Arial, sans-serif;

    /* Важно: браузер не успевает прогрузить картинку в первые миллисекунды и на мгновенье показывает background-color (по умолчанию белый цвет). Это очень неприятно. Поэтому мы задаёт цвет такой же как и цвет картинки. Сначала чёрный цвет, потом чёрная картинка со звёздами */
    background-color: #000000;

    color: #ffffff;
    text-align: center;
    background-image: url("../images/stars-good.png");
}

.square-link {
    /* Примечание: два в одном. И блок (делает отступ от текста) и не занимает 100% ширины. Ну красота же! */
    display: inline-block;
    border: 2px solid #ffffff;
    color: #ffffff;
    text-decoration: none;
    padding: 20px;
    transition: all .3s;
}

.square-link:hover {
    background-color: #ffffff;
    color: #000000;
    transition: all .3s;
}

hr {
    width: 75%;
}

.license-text {
    display: inline-block;
    border: 2px solid #ffffff;
    border-radius: 5px;
    padding: 10px;
}

nav {
    display: flex;
    justify-content: center;
    gap: 15px;
}

.nav-link {
    color: #ffffff;
    text-decoration: none;
}

.nav-link:hover {
    color: red;
}
