
:root {
    --orange: #ff7800;
    --black: #130f40;
    --light-color: #a4a4a4;
    --box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .1);
    --border: .2rem solid rgba(0, 0, 0, .1);
    --outline: .1rem solid rgba(0, 0, 0, .1);
    --outline-hover: .1rem solid var(--black);
}
.main{
    padding: 50px;
    display: flex;
}
.main .info .adress{
    text-align: right ;
    border: 1px solid var(--light-color);
    padding: 30px 25px;
    text-align: center;
    border-radius: 25px 1px;
    width: 100%;
    border-radius: 25px 25px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.main .info .adress p , h3{
    margin-bottom: 15px;
}
.main .info .adress p{
    font-size: 16px;
}
h3{
    font-size: 20px;
}
.main .info .adress a.btn{
    position: relative;
    right: 0;
}
.info{
    width: 80%;
    display: flex;
    flex-direction: column;
}
.info .order{
    border: 1px solid var(--light-color);
    padding: 30px 25px;
    text-align: center;
    border-radius: 25px 1px;
    width: 100%;
    border-radius: 0 0 25px 25px;
    border-top: none;
}
.info .order .boxs{
    display: flex; 
    justify-content: center;
    column-gap: 15px;
}
.info .order .box{
    width: 220px;
    height: 420px;
    padding: 10px 5px; 
    border-radius: 10px;
    background-color: #fff;
    box-shadow: var(--box-shadow);
}
.info .order .box img{
    width: 180px;
    height: 210px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--light-color);
}
.info .order .box p{
    text-align: center;
    font-size: 16px;
    margin: 5px 0;
}
.factor{
    width: 20%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    row-gap: 15px;
}
.factor p{
    font-size: 18px;
}