#devis{
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    column-gap: 50px;
}

.title{
    font-size:21px;
    font-family: 'Roboto';
    font-weight:600;
}

#onglets{
    display: flex;
    gap:15px;
    flex-wrap: wrap;
}

.onglet{
    border:1px solid #1E73BC;
    color: #1E73BC;
    font-size:14px;
    font-family:'Roboto';
    font-weight: 600;
    border-radius: 99px;
    padding:5px 15px;
    cursor: pointer;
}

.onglet:hover, .onglet.selected{
    color:#fff;
    background-color: #1E73BC;
}

#boxs{
    margin-top:15px;
    display: flex;
}
#boxs input, #periodes input{
    visibility: hidden;
    position: absolute;
}

#boxs label, #periodes label{
    border:1px solid #1E73BC;
    color: #1E73BC;
    font-size:14px;
    font-family:'Roboto';
    font-weight: 600;
    border-radius: 99px;
    padding:5px 10px;
    cursor: pointer;
    margin-right: 10px;
}

#boxs label:hover{
    color:#fff;
    background-color: #1E73BC;
}

#boxs input:checked + label, #periodes input:checked + label{
    color:#fff;
    background-color: #1E73BC;
}

.boxlabel{
    visibility: hidden;
    position: absolute;
}

.petit.boxlabel{
    visibility: visible;
    position: initial;
}

#datepicker{
    font-family: 'Roboto';
}

.ui-datepicker{
    width: 19em;
    border: none  !important;
}

.ui-datepicker-header.ui-widget-header{
    background-color: #fff;
    border:0;
}

.ui-datepicker-month{
    text-transform: capitalize;
}

.table thead:first-child tr:first-child th{
    border-block-start: none;
}

.ui-datepicker-calendar .ui-state-default {
    background: #f6f6f6;
    font-weight: normal;
    color: #454545;
    border-radius: 99px;
    text-align: center;
    height: 35px;
    width: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
}

.ui-datepicker-calendar .ui-datepicker-today a {
    border: none;
    background: #333;
    color: #fff;
}

.ui-datepicker-calendar .ui-datepicker-today a.ui-state-active {
    border: none;
    background: #1E73BC;
    color: #fff;
}

.ui-datepicker-calendar .ui-state-active {
    background: #1E73BC;
    color: #fff;
 
}

table tbody>tr:nth-child(odd)>td{
    background-color: transparent;
}

.ui-datepicker-calendar{
    border: none;
}

#info,#choixTaille{
    
    margin: 30px 0;
    display: flex;
    row-gap: 30px;
    justify-content: space-between;
    
}
#choixTaille{
    flex-direction: column;
}
#info{
    flex-direction: column-reverse;
    align-items: flex-end;
}

#left,#right{
    flex: 0 0 50%;

}

#coordClient{
    background-color: #F7F7F7;
    padding:10px 25px;
    max-width: 520px;
}

#coordClient h2{
    margin-top:10px;
}
::placeholder{
    color :rgba(74, 74, 74, 0.44)
}
#coordClient input{
    border: 1px solid #D0D0D0;
    border-radius: 30px;
    color:rgba(74, 74, 74, 1);
    margin-top: 10px;
}

#adresseComplete{
display: flex;
gap: 10px;
}

#cp{
    flex: 0 0 30%;
}

#ville{
    flex: 0 0 70%;
}
input[type="submit"]{
    color: #fff !important;
    background-color: #1E73BC;
    border-radius: 99px;
    text-transform: uppercase;
    font-weight: 600;
    border:1px solid #1E73BC !important;
    margin-top:20px !important;
}

input[type="submit"]:hover, input[type="submit"]:focus{
    color: #1E73BC !important;
    background-color: #fff;
    border:1px solid #1E73BC !important;
}

#price{
    display:flex;
    font-family: 'Nunito';
    width: 375px;
    justify-content: space-evenly;
    background: #1E73BC;
    padding: 15px 10px;
    align-items: center;
    color: #fff;
}
#price img{
    width: 80px;
    object-fit: contain;
}

#price .taille{
    display: flex;
    flex-direction: column;
    font-size: 25px;
    font-weight: 700;
}

span.m3:before {
    content: '';
    border-top: 1px solid #fff;
}
span.m3 {
    font-size: 15px;
    display: flex;
    flex-direction: column;
}
.at-rate{
    font-weight: 700;
}

.m2{
    line-height: 1;
}

#choixTaille{
    justify-content: space-between;
}

#comments{
    gap: 25px;
    min-height: 495px;
}

#Gimg2{
    background-image: url(https://proxybox.atwio.space/wp-content/uploads/2023/04/pexels-artem-podrez-5025498-scaled-1.jpeg);
    background-position: center center;
    background-size: cover;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    margin: 80px 0px 0px 10px;
    --e-column-margin-right: 0px;
    --e-column-margin-left: 10px;
    align-content: center;
    align-items: center;
    display: flex;
    width:25%;
}

#Gimg1{
    align-content: center;
    align-items: center;
    background-image: url(https://proxybox.atwio.space/wp-content/uploads/2023/04/pexels-ketut-subiyanto-4247766-scaled-1.jpeg);
    background-position: center center;
    background-size: cover;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    margin: 0px 010px 80px 0px;
    --e-column-margin-right: 010px;
    --e-column-margin-left: 0px;
    width:25%;
}


#devisDownload{
    font-family: var(--e-global-typography-63c1bf7-font-family), Sans-serif;
    font-size: var(--e-global-typography-63c1bf7-font-size);
    font-weight: var(--e-global-typography-63c1bf7-font-weight);
    text-transform: var(--e-global-typography-63c1bf7-text-transform);
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: var(--e-global-color-735c3c4);
    border-radius: 30px;
    padding: 10px 25px;
    background: var(--e-global-color-735c3c4);
    text-decoration: none;
    color: #fff;
    width: fit-content;
}

#RDroite p{
    color: var(--e-global-color-d0f9192);
    font-family: var(--e-global-typography-4da8cd0-font-family), Sans-serif;
    font-size: var(--e-global-typography-4da8cd0-font-size);
    font-weight: var(--e-global-typography-4da8cd0-font-weight);
    line-height: var(--e-global-typography-4da8cd0-line-height);
}

#RDroite{
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

@media screen and (max-width: 640px) {
 #Gimg2{
    display: none;
 }

 #Gimg1{
    width: 50%;
 }
  }