PIbd-21_Makarov_DV_InternetProgramming/css/style.css

main, body {
    min-height: 100%;
}

form {
    height: 100%;
}

.form-horizontal{
    display:block;
    height:50%;
    margin:0 auto;
}

@media only screen and (max-width: 768px) {
    .picmin.box {
        display: none;
    }
    .picture-preview.box {
        max-width: 100%;
        width: 450px;
    }
    .product-menu.box{
        display: none;
    }
    .pr-menu-btn.btn {
        display: none;
    }
    #innerbox.xl-only, .catalog-menu.xl-only {
        display: none !important; 
    }
    .xl-only {
        display: none !important; 
    }
}
#cart-pic.picmin.box {
    display: block !important;
}

.registerbox {
    max-width: 725px;
    width: 100%;
    background: #D1D9FF;
    box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.25); 
    border-radius: 20px;
}

.inputbox {
    height: 52px;
    background: white; 
    border-radius: 12px;
    border: 0px;
    font-size: 24px;
}

.btn.btn-primary {
    border-radius: 12px;
    border: 0px;
    color: #FFFFFF;
    font-size: 24px;
    cursor: pointer;

    filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.25));
}

.btn.btn-main {
    border-radius: 12px;
    border: 0px;
    color: #FFFFFF;
    font-size: 24px;
    cursor: pointer;

    filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.25));
}

.btn.btn-light {
    width: 197px;
    height: 62px;
    border-radius: 12px;
    border: 0px;
    color: #000000;
    font-size: 20px;
    cursor: pointer;
    text-align: left; 
    padding-left: 5%;

    filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.25));
}

.box {
    background: #D1D9FF; 
    box-shadow: 0px 5px 6px rgba(0, 0, 0, 0.25); 
    border-radius: 20px
}

.inputbox {
    background: white; 
    border-radius: 12px;
}

#menu.box {
    width: 250px; 
    max-height: 250px; 
}

#settings-menu.box {
    max-width: 250px; 
    height: 550px; 
}

.catalog-menu.box {
    width: 250px; 
}

#catalog.box {
    width: 1250px; 
}

#innerbox.catalog.box {
    background: #6376D7; 
}

#item.catalog.box {
    background: white; 
    height: 365px; 
    width: 215px;
}

.item-img {
    height: 180px; 
    width: 180px;
}

#product-box.box {
    max-width: 925px; 
    width: 100%;
}

#product-menu.box {
    max-width: 250px;
    width: 100%; 
}

.picture-preview.box {
    background-color: white;
    width: 450px; 
    max-height: 450px;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25); 
}

.picmin.box {
    background-color: white;
    width: 100px !important; 
    height: 100px !important;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25); 
}

#order-box.box {
    background-color: white;
    max-width: 300px; 
    height: 450px;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.25); 
}

#cart.box {
    width: 970px; 
    min-height: 725px; 
}

#orders.box {
    width: 970px; 
    height: 725px; 
}

#favorite.box {
    width: 970px; 
    height: 725px; 
}

#personal-info.box {
    max-width: 970px; 
    min-height: 550px; 
    height: 100%;
}

.innerbox {
    background: #ffffff; 
    border-radius: 20px
}

#cart-box.innerbox {
    max-width: 550px; 
    height: 600px; 
}

#order-cart-box.innerbox {
    height: 300px; 
}


.btn-main {
    --bs-btn-bg: #4156C2 !important;
    --bs-btn-border-color: #33449d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #2c3c8a;
    --bs-btn-hover-border-color: #1a2350;
    --bs-btn-focus-shadow-rgb: 51, 68, 157;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #1a2350;
    --bs-btn-active-border-color: #fff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #4156C2;
    --bs-btn-disabled-border-color: #33449d;
  }
  
  .btn-quit {
    --bs-btn-color: #fff !important;
    --bs-btn-bg: #152683 !important;
    --bs-btn-border-color: rgba(0, 0, 0, 0);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #12206f;
    --bs-btn-hover-border-color: rgba(0, 0, 0, 0.2);
    --bs-btn-focus-shadow-rgb: 255, 255, 255;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #111e69;
    --bs-btn-active-border-color: rgba(0, 0, 0, 0.25);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #152683;
    --bs-btn-disabled-border-color: rgba(0, 0, 0, 0);
  }