/* 
Таблица стилей сайта www.booker.ru
Версия 0.0.2
Дата: 02.03.2026
Автор: Стародубоа Николай Алексеевич(stna)
*/


@font-face {
    font-family: Lazuric;
    src: url(../fonts/LazurAntiqTextC/Lazurantiqtextc\ bold.otf);
    font-display: swap;
}
@font-face {
    font-family: PreciozaV;
    src: url(../fonts/Preciosa/Preciosa\ Valeria.ttf);
    font-display: swap;
}
@font-face {
    font-family: Precioza;
    src: url(../fonts/Preciosa/Preciosa.ttf);
    font-display: swap;
}

@font-face {
    font-family: SamsungOne;
    src: url(../fonts/SamsungOne/SamsungOne-400.ttf);
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: Russish;
    src: url(../fonts/Russish/Russische\ Elsevier.ttf);
    font-display: swap;
}
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 100;
    }
}

* {
    margin: 0;
    padding: 0;
}



/* Header */ 
.mainheader {
    width: 100%;
    background-color: bisque;
    height: 120px;
}

.header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo img {
    height: 80px;
}


.logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 20px;
    margin-left: 30px;
    text-decoration: none;
    color: black;
}

.logo span {
    font-family: Lazuric;
    font-weight: 200;
    font-size: 28px;
}

.header nav {
    margin-top: 15px;
    margin-right: 100px;
    display: flex;
    gap: 20px;
}

.btn {
    color: black;
    font-size: 18px;
    text-decoration: none;
    background-color: rgb(248, 214, 173);
    padding: 10px;
    border-style: solid;
    border-radius: 20px;
    box-shadow: 6px 8px 14px -1px rgba(34, 60, 80, 0.44);
    font-family: Lazuric;

}

.btn:hover {
    background-color: rgb(250, 206, 153);
}

.btn:active {
    box-shadow: 5px 1px 14px 4px rgba(34, 60, 80, 0.42) inset;
}
/* Конец Header */




/* Главная */
.main {
    background-color: rgb(248, 212, 168);
    min-width: 100%;
    min-height: 90vh;
    box-shadow: 1px 5px 14px 3px rgba(34, 60, 80, 0.2) inset;
}

.hi {
    display: flex;
    justify-content: center;
    min-width: 100%;
}

.hello {
text-align: center;
margin-top: 50px;
}

h1 {
    font-family: PreciozaV;
    font-weight: 200;
    font-size: 72px;
    animation-name: fadein;
    animation-duration: 1s;
}

h2 {
    font-family: Precioza;
    font-weight: 100;
    font-size: 42px;
    animation-name: fadein;
    animation-duration: 1s;
}

.sections {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 200px;
    margin-top: 70px;
    width: auto;
}

.section1 {
    animation-name: fadein;
    animation-duration: 1s;
    background-image: url(../img/dXnFpZT-2qw.jpg);
    background-size: 400px;
    height: 300px;
    width: 400px;
    border-style: inset;
    border-width: 10px;
    border-color: bisque;
    box-shadow: 6px 8px 14px -1px rgba(34, 60, 80, 0.44);

}

.section2 {
    animation-name: fadein;
    animation-duration: 2s;
    background-image: url(../img/0JpV4snlqp0.jpg);
    background-size: 600px;
    height: 300px;
    width: 400px;
    border-style: inset;
    border-width: 10px;
    border-color: bisque;
    box-shadow: 6px 8px 14px -1px rgba(34, 60, 80, 0.44);
}

.section3 {
    animation-name: fadein;
    animation-duration: 3s;
    background-image: url(../img/I8eSn3fexuc.jpg);
    background-size: 500px;
    height: 300px;
    width: 400px;
    border-style: inset;
    border-width: 10px;
    border-color: bisque;
    box-shadow: 6px 8px 14px -1px rgba(34, 60, 80, 0.44);
}

.sectinfo {
    margin-top: 200px;
    margin-left: 10px;
}

.sectinfo p {
    margin-bottom: 20px;
    color: rgb(255, 204, 141);
    font-family: Precioza;
    font-weight: 500;
    font-size: 28px;
}

.search {
    width: 100%;
    text-align: center;
    margin-top: 50px;
    
}

h3 {
    font-family: Precioza;
    font-size: 36px;
    font-weight: 500;
}

.searchbox {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: bisque;
    margin-left: 600px;
    margin-right: 600px;
    border-style: inset;
}
.searchbox img {
    height: 60px;
}

.searchbox input {
    height: 70px;
    width: 700px;
    border-style: none;
    background-color: bisque;
    font-size: 28px;
}
/* Главная закончена */

/* Страница регистрации*/
.reg {
    width: 100%;
    height: 700px;
    display: flex;
    justify-content: center;
}

.form {
    margin-top: 20px;
    width: 700px;
    height: 550px;
    background-color: aliceblue;
    border-radius: 10%;
    box-shadow: 6px 8px 14px -1px rgba(34, 60, 80, 0.44);
    border-style: solid;
    border-width: 6px;
    border-color: rgb(250, 219, 181);
}
.form h3 {
    text-align: center;
    margin-top: 20px;
}

.inputbox {
    display: block;
    margin-left: 10%;
    margin-top: 30px;
}
.inputline {
    display: flex;
    gap: 25px;
}

.inputblock {
    font-size: 18px;
    margin-bottom: 20px;
    font-size: 24px;
}

.inputblock p {
    font-family: Russish;
    font-weight: 600;
    margin-bottom: 10px;
}
.inputblock input {
    height: 60px;
    width: 250px;
    border-radius: 10px;
    border-width: 1px;
    font-size: 16px;
    box-shadow: 6px 6px 19px 0px rgba(34, 60, 80, 0.2);
    padding-right: 20px;
}


/* Подвал */

.footer {
    width: 100%;
    height: 18vh;
    background-color: black;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18%;
    font-family: SamsungOne;
}



.footer1 {
    display: block;
    text-align: center;
    font-size: 16px;
}

.footer1 p {
    padding: 5px;
}

.footer3 {
    display: block;
    text-align: center;
    font-size: 16px;
}

.footer2 {
    display: flex;
    gap: 20px;
}
.footer2 a{
    text-decoration: none;
    color: white;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}
.footer2 a:hover {
    color: rgba(255, 255, 255, 0.459);
}
.footer3 p {
    color: white;
    padding: 5px;
    
}

/* Подвал закончен*/