* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: "Head-Turn";
    src: url("../assets/fonts/font2//HeadTurn.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "GT-Walsheim-Pro";
    src: url("../assets/fonts/font1/GT-Walsheim-Pro-Condensed-Medium.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "GT-Walsheim-Pro-Thin";
    src: url("../assets/fonts/font1/GTWalsheimPro-Thin.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

h1 {
    font-family: "Head-Turn";
    font-weight: 300;
    font-size: 70px;
    color: #1D1D1B;
}

h2 {
    font-family: "GT-Walsheim-Pro";
    font-weight: 700;
    font-size: 36px;
    letter-spacing: 8px;
}

h3 {
    font-family: "GT-Walsheim-Pro";
    font-weight: 700;
    font-size: 38px;
    color: #1D1D1B;
    letter-spacing: 5px;
}

h4 {
    font-family: "GT-Walsheim-Pro";
    font-weight: 500;
    font-size: 32px;
    letter-spacing: 1px;
}

h5 {
    font-family: "GT-Walsheim-Pro";
    font-weight: 700;
    font-size: 50.19px;
    color: #1D1D1B;
}

h6 {
    font-family: "GT-Walsheim-Pro";
    font-weight: 700;
    font-size: 32px;
}

p {
    font-family: "GT-Walsheim-Pro";
    font-weight: 400;
    color: #1D1D1B;
    font-size: 15.5965px;
    line-height: 24px;
}

p.second-type-size {
    font-size: 22.4153px;
}

p.third-type-size {
    font-size: 25.3647px;
    font-weight: bold;
}

h4.text-rows-total-title {
    font-weight: 700;
    letter-spacing: 3px;
}

h4.text-rows-total-price {
    font-weight: 700;
}

body {
    width: 1080px;
    height: 600px;
    background: transparent;
}

.body-container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    opacity: 0;
    background-color: #ffffff;
}

.top-container {
    width: 1080px;
    height: 225px;
    background-image: url(../assets/background-blur.jpg);
    z-index: 1;
    overflow: hidden;
}

.top-container-background-blur {
    display: flex;
    width: 1080px;
    height: 225px;
    flex-direction: column;
    align-items: center;
    padding: 0px 0 5px 0px;
}

.icon-check {
    width: 38.18px;
    height: 38.18px;
    background-image: url(../assets/Check\ mark.svg);
}

.middle-container {
    position: relative;
    width: 1024px;
    height: 370px;
    display: flex;
    justify-content: center;
    padding-top: 20px;
    margin-left: 31px;
}

table {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 964px;
    height: 278px;
}

table .title-row {
    width: 465px;
    height: 23px;
    background: #F1F1F1;
}

table td,
table th {
    padding: 0px;
    height: 4px;
}

table td:last-child,
table th:last-child {
    text-align: right;
}

table tfoot td {
    border-top: 1.8px solid #000000;
    height: 0px;
    padding-left: 33px;
}

table tfoot td:last-child {
    padding-top: 8px;
}

h1.confirmation-title-below {
    color: #ffffff;
}

h2.confirmation-title {
    color: #ffffff;
}

h4.text-rows-drive {
    font-size: 22px;
    font-weight: 700;
    color: #ffffff;
}

.orden-confirmation-title {
    margin-top: 104px;
}

.orden-confirmation-title-below {
    margin-top: -25px;
}

th.title-1 {
    width: 444px;
    text-align: left;
    padding-left: 34px;
    border-radius: 4px 0 0 4px;
}

th.title-2 {
    /* margin-left: 44px; */
    padding-right: 96px;
    width: 72px;
}

th.title-3 {
    width: 140px;
}

th.title-4 {
    width: 85px;
    padding-right: 28px;
    border-radius: 0 4px 4px 0;
}

td.item-1 {
    padding-left: 34px;
}

td.item-2 {
    padding-left: 33px;
}

td.item-3 {
    padding-left: 48px;
}

td.item-4 {
    padding-right: 33px;
}

td.price-total {
    padding-right: 32px;
}

.drive-forward {
    position: absolute;
    width: 230px;
    height: 30px;
    top: 325px;
    right: 10px;
}

img.drive {
    width: 100%;
    height: auto;
}

.table-container {
    width: 100%;
    height: 100%;
}

.row.title-row {
    display: flex;
    background: #F1F1F1;
    border-radius: 8px;
    width: 1011px;
    height: 60px;
}

.col.title-1 {
    padding-left: 60px;
    width: 452px;
    padding-top: 7px;
}

.col.title-2 {
    width: 163px;
    text-align: end;
    padding-top: 7px;
}

.col.title-3 {
    width: 169px;
    text-align: end;
    padding-top: 7px;
}

.col.title-4 {
    width: 174px;
    text-align: end;
    padding-top: 7px;
}

.row {
    display: flex;
}

.col.item-1 {
    width: 389px;
}

.col.item-2 {
    width: 140px;
    text-align: end;
}

.col.item-3 {
    width: 177px;
    text-align: end;
}

.col.item-4 {
    width: 175px;
    text-align: end;
}

.row.total-row {
    position: absolute;
    top: 282px;
}

.div-sep {
    position: absolute;
    width: 1024px;
    height: 0px;
    border: 2px solid #000000;
    top: 268px;
}

.container-rows {
    padding-left: 56px;
    margin: 20px 0 20px 0;
}

.col.total-title {
    padding-left: 56px;
}

.col.total-price {
    width: 144px;
    margin-left: 659px;
    text-align: end;
}

.fade-in {
    animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.fade-out {
    animation: fade-out 1s ease-out both;
}

@-webkit-keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}