/*!
Plugin Name: Probiocell Added To Cart Notification
Plugin URI: https://eeriee.com/
Author: Eeriee
Author URI: https://eeriee.com/
Version: 0.9


Main CSS file: /style.css
*/


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

STYLES

# Generic rules for mobile and tablet
# Mobile
# Tablet
# Desktop
    ## Tall displays
# Large desktop

--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Generic rules for mobile and tablet
--------------------------------------------------------------*/

@media screen and (max-width: 1024px) {}

@media screen and (max-width: 1024px) and (orientation: landscape) {}


/*--------------------------------------------------------------
# Mobile
--------------------------------------------------------------*/

@media screen and (max-width: 768px) {
    .added-to-cart {
        width: 95vw;
        height: 150vw;
        padding: 4vw 8vw;
    }
    .added-to-cart__section--left,
    .added-to-cart__section--right {
        width: 100%;
        height: 25vh;
    }
    .added-to-cart__product-image img {
        max-width: 330px !important;
        max-height: 40vw !important;
    }
    .added-to-cart__product-title {
        width: 55%;
        font-size: 4.3vw;
        padding-left: 20px;
        margin-bottom: 8vw;
    }
    .added-to-cart__message {
        width: 73vw;
        font-size: 7.5vw;
    }
    .added-to-cart__button {
        width: 100%;
        top: 9vw;
        padding-top: 2vw;
        margin: 0;
        font-size: 6vw;
        text-align: center;
        display: block;
    }
    .added-to-cart__button--main {
        width: 100%;
        padding: 2vw 0;
        margin-bottom: 5vw;
        display: block;
    }
}


/*--------------------------------------------------------------
# Tablet
--------------------------------------------------------------*/

@media screen and (min-width: 768px) and (max-width: 1024px) {}


/*--------------------------------------------------------------
# Desktop
--------------------------------------------------------------*/

@media screen (max-width: 1650px) {
    .added-to-cart__product-image img {
        height: 100% !important;
    }
}


/*--------------------------------------------------------------
# Large desktop
--------------------------------------------------------------*/

@media screen and (min-width: 1920px) {}

@media screen and (min-width: 2560px) {}