.cartTitle{
    width: 100%;
    margin-left: -25px;
}

.emptyCart{
    display: flex;
    flex-direction: column;
    margin-left: -25px;
}

.emptyCart>*{
    margin-top: 20px;
}

.emptyCart .loginFormSubmitButtonItem{
    margin-left: -10px
}

/*Cart when it's not empty :c*/

.cartLayout{
    width: 100%;
    display: flex;
    flex-direction: row;
    /*border: var(--border);*/
    margin-left: -25px;
}

.cartLayout>*{
    margin-top: 20px;
    margin-right: 20px;
}

.cartItemsText{
    margin-bottom: 15px;
}

.cartItem{
    height: 140px;
    width: 650px;
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
}

.cartItemImage{
    height: 140px;
    min-width: 200px;
    max-width: 200px;
    display: flex;
    overflow: hidden;
}

.cartItemImageItem{
    margin: auto;
    overflow: hidden;
    width: 100%;
}

.cartItemInfo{
    display: flex;
    flex-direction: column;
    margin-left: 20px;
    height: 100%;
    width: 100%;
    /*border: var(--border);*/
}

.cartItemInfo>*{
    margin-top: 5px;
    margin-top: auto;
    margin-bottom: auto;
    display: flex;
}

.cartItemInfoAmmount{
    font-size: smaller;
    color: var(--graydark);
}

.cartItemInfoName{
    display: flex;
    font-size: larger;
    color: var(--graydarkdark);
    height: 100%;
}

.cartItemInfoName>*{
    margin-bottom: auto;
}

.cartItemInfoPriceDelete{
    display: flex;
    flex-direction: row;
    max-height: 50px;
}

.cartItemInfoPrice{
    width: 70px;
    padding: 5px 20px !important;
    display: flex;
    text-align: center !important;
    background-color: var(--blue);
}

.cartItemInfoPrice>*{
    display: flex;
    margin: auto;
    font-weight: bold;
}

.cartItemInfoDelete{
    margin-left: 15px;
}

.cartItemInfoDeleteButton{
    display: flex;
    flex-direction: row;
    height: 100%;
}

.cartItemInfoDeleteButton>*{
    display: flex;
    margin: auto;
    color: var(--graylight);
    margin-left: 15px;
    font-weight: bold;
}

.cartInfoPanelTextItem{
    font-size: 15px;
}

.cartInfoPanelPrice{
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.cartInfoPanelPriceItem{
    font-size: larger;
}

.cartInfoPanelText{
    max-width: 500px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.cartInfoPanelTextItem{
    width: 500px;
    margin-bottom: 5px;
}

.cartInfoPanelTextShipping, .cartInfoPanelTextStorePickup{
    display: flex;
    flex-direction: row;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 40px;
}

.cartInfoPanelTextShippingItem{
    margin: auto;
    margin-left: 15px;
}

.cartInfoPanelCheckoutButton{
    margin-top: 15px;
}

.deliveryCheckboxShipping, .deliveryCheckboxPickup{
    opacity: 0;
    position: fixed;
    transform: translateX(0px) translateY(0px);
    scale: 3;
}

.deliveryCheckboxShipping:checked + .deliveryCheckboxShippingCustom{
    background-image: url('source/checkmark.svg');
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.deliveryCheckboxShippingCustom{
    display: flex;
    margin: auto;
    width: 17px;
    height: 17px;
    border: rgba(224, 224, 224, 255) 4px solid;
    display: flex;
    padding: 3px;
}

/* When selected, show the checkmark */
.deliveryCheckboxShippingCustom.selected,
.deliveryCheckboxPickupCustom.selected {
    background-image: url('source/checkmark.svg');
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.deliveryCheckboxPickup{
    opacity: 0;
    position: fixed;
    transform: translateX(0px) translateY(0px);
    scale: 3;
}

.deliveryCheckboxPickup:checked + .deliveryCheckboxPickupCustom{
    background-image: url('source/checkmark.svg');
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
}

.deliveryCheckboxPickupCustom{
    display: flex;
    margin: auto;
    width: 17px;
    height: 17px;
    border: rgba(224, 224, 224, 255) 4px solid;
    display: flex;
    padding: 3px;
}

.cartInfoPanelTextShippingItem{
    font-size: smaller;
}

/*I hate these corners so much*/
.cornersCheckout{
    transition: all .3s ease;
    background: var(--orange);
    border: 3px solid var(--orange);
    font-size: 20px;
    color: white;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    position: relative;
}

/*
.upperLeftCheckout{
    background: var(--graylight);
    z-index: 10;
    width: 7px;
    height: 5px;
    position: absolute;
    top: -3px;
    left: -3px;
    border-bottom: 3px solid var(--orange);
    border-right: 3px solid var(--orange);
}

.upperRightCheckout {
    background: var(--graylight);
    z-index: 10;
    width: 7px;
    height: 5px;
    position: absolute;
    top: -3px;
    right: -3px;
    border-bottom: 3px solid var(--orange);
    border-left: 3px solid var(--orange);
}

.lowerRightCheckout {
    background: var(--graylight);
    z-index: 10;
    width: 7px;
    height: 5px;
    position: absolute;
    bottom: -3px;
    right: -3px;
    border-top: 3px solid var(--orange);
    border-left: 3px solid var(--orange);
}

.lowerLeftCheckout {
    background: var(--graylight);
    z-index: 10;
    width: 7px;
    height: 5px;
    position: absolute;
    bottom: -3px;
    left: -3px;
    border-top: 3px solid var(--orange);
    border-right: 3px solid var(--orange);
}