/*	daylily.art Style Sheet

	Author: 	Pamela Brooks
	Date: 		2020
	Filename:       daylily-navigation.css
*/

@import url('https://fonts.googleapis.com/css2?family=Manjari:wght@100;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Niconne&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Questrial&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

/* Navigation styles. */
/* link color: #3b8ede */

html {
    /* This prevents the scrollbar from pushing centered elements to the left of the screen's center'. */
    /* "scrollbar-gutter: stable both-edges" is supposed to work, but doesn't. */
    /* SEE the page-navigation and button-container classes, below. */
    width: 100vw;
}

ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* SEE "Mobile", below. */

.logo {
    /* "Daylily Art" and "Daylily Art Store" */
    font-family: 'Manjari', sans-serif;
    font-size: 36px;
    font-weight: 400;
    color: #000000;
    letter-spacing: .05em;
}

    .logo a:hover {
        color: #000000;
        text-decoration: none;
    }

.logo .cursive {
    /* The capital "A" in "Daylily Art". */
    font-family: 'Niconne', cursive;
    font-size: 48px;
}

.website-daylily, .store-daylily {
    /* gallery and store menu daylily */
    width: 100%;
    padding: 0;
}

.daylily {
    /* form, cart, and checkout daylily */
    width: fit-content;
    padding-top: 18px;
}
 
.daylily1a {
    /* website daylily */
    width: 108px;
}

.daylily1b {
    /* form and cart daylily */
    width: 72px;
}

.daylily2 {
    /* store daylily */
    width: 102px;
}

.daylily-form, .daylily-cart, .daylily-checkout {
    /* SEE manager-sign-in.php, new-account.php, newsletter-emailer.php, password.php, sign-in.php, subscribe.php, unsubscribe.php, webmaster-sign-in.php, and cart.php. */
    width: fit-content;
    -webkit-filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
    filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
    padding-top: 18px;
}

.daylily-form:hover, .daylily-cart:hover, .daylily-checkout:hover {
    -webkit-filter: none;
    filter: none;
}

.mobile-daylily {
    display: none;
}


/* Left-column menu */
/* SEE about.php, contact.php, gallery.php, store.php. */

.header {
    /* Left column header, which includes the menu. */
    width: 256px; /* for Safari */
    position: fixed;
    top: 0;
    bottom: 0;
    text-align: right;
    padding-right: 36px;
    z-index: 9;
}

.table {
    /* Left column format. */
    display: table;
    width: 100%;
    max-width: 100%;
    height: 100%;
}

.table-cell {
    /* Left column format. */
    display: table-cell;
    width: 100%;
    vertical-align: middle;
}

.menu {
    /* SEE subroutines/navigation.php, subroutines/navigation-store.php. */
    /* ALSO SEE subroutines/navigation-dropdown.php, subroutines/navigation-dropdown-store.php. */
    font-family: 'Questrial', sans-serif;
    font-size: 17px;
    color: #3b8ede;
    letter-spacing: .025em;
    line-height: normal;
    margin: 0;
    display: block;
}

.menu-list-item {
    padding-top: 9px;
}

.menu li {
    list-style: none;
}

.menu li a {
    color: #3b8ede;
    text-decoration: none;
}

.menu li a:hover {
    color: #3b8ede;
    text-decoration: underline;
}

.menu .current {
    text-decoration: underline;
}

.menu .lines {
    font-size: 18px;
    color: #000000;
}

.menu .lines-caps {
    font-size: 24px;
    padding-right: 1px;
}

.hide-menu {
    /* Hamburger button activated menu. */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 998;
    background-color: rgba(0, 0, 0, 0.7);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility 0.3s ease, opacity 0.3s ease;
    -moz-transition: visibility 0.3s ease, opacity 0.3s ease;
    -ms-transition: visibility 0.3s ease, opacity 0.3s ease;
    -o-transition: visibility 0.3s ease, opacity 0.3s ease;
    transition: visibility 0.3s ease, opacity 0.3s ease;
}

.menu-item a {
    /* A menu item that is not in a list. */
    /* SEE blog.php. */
    color: #3b8ede;
    text-decoration: none;
}

.menu-item a:hover {
    color: #3b8ede;
    text-decoration: underline;
}

.topics-menu {
    /* SEE topic.php */
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    font-weight: 300;
    color: #000000;
    letter-spacing: .025em;
    line-height: 30px;
    margin: 0;
}


/* Links */

a {
    color: #ababab;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

    a:hover {
        text-decoration: underline;
    }

.link a {
    /* Text links: login link (cart.php) and save cart link (subroutines/display-cart.php). */
    color: #3b8ede;;
    font-weight: 500;
    text-decoration: none;
}

.link a:hover {
    color: #3b8ede;;
    font-weight: 500;
    text-decoration: underline;
}

.text-link a {
    color: #000000;
    text-decoration: underline;
}

.text-link a:hover {
    color: #808080;
    text-decoration: none;
}

.current-text-link {
    color: #808080;
    text-decoration: none;
}

.topic-link {
    /* SEE topic.php, subroutines/display-artwork.php, subroutines-store, display-item.php. */
    font-size: 16px;
    font-weight: 500;
}

.topic-link a {
    color: #000000;
    text-decoration: underline;
}

.topic-link a:hover {
    color: #808080;
    text-decoration: none;
}

.current-topic-link {
    color: #808080;
    text-decoration: none;
}

.cursive-link {
    /* SEE subroutines/display-artwork.php, subroutines-store/display-item.php. */
    font-family: 'Niconne', cursive;
    font-size: 26px;
    color: #000000 !important;
    letter-spacing: .05em;
    text-decoration: none;
}

    .cursive-link a:hover {
        color: #000000;
        text-decoration: underline;
    }

.cart-link a {
    color: #000000;
    text-decoration: underline;
}
.cart-link a:hover {
    color: #000000;
    text-decoration: none;
}


/* Icon buttons */

.artwork-buttons, .item-buttons {
    /* Container for the enlarge, slider, and information buttons. */
    /* SEE subroutines/display-gallery.php, subroutines/display-artwork.php, subroutines-store/display-item.php. */
    width: 600px;
    padding-top: 12px;
}

.enlarge-button, .slider-button {
    padding-right: 18px;
}

.image-return {
    /* SEE image.php, enlargement.php */
    width: 1024px;
    height: 36px;
    position: absolute;
    top: 30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 100;
}

.slider-return {
    /* SEE slider.php */
    position: fixed;
    top: 30px;
    left: 30px;
}

.back-to-top {
    /* up arrow */
    /* SEE gallery.php, store.php. */
    width: 30px;
    position: fixed;
    bottom: 48px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    margin-left: 470px; /* 1024 (page width) / 2 = 512 - 42 (36 right margin + 6 right shadow = 42) = 470 */
    z-index: 100;
}

.return-button-container {
    /* SEE login.php, new-account.php, password.php, subscribe.php, unsubscribe.php. */
    position: absolute;
    width: 100%;
}

.return-button {
    width: 30px;
    height: 30px;
    padding-top: 42px;
    padding-left: 28px;
}

.checkout-return-arrow-container {
    width: 1024px;
    position: absolute;
    top: 0;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
}

.checkout-return-arrow {
    position: absolute;
    top: 48px;
    left: 36px;
}


/* Icon button filters */

.icon {
    /* .svg buttons; filter color: #3b8ede (blue)) */
    -webkit-filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%); /* Safari 6.0 - 9.0 */
    filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
}

    .icon:hover {
        filter: none;
    }

.green-icon {
    /* .svg button; filter color: #4caf50 (green)) */
    -webkit-filter: invert(55%) sepia(72%) saturate(377%) hue-rotate(73deg) brightness(93%) contrast(87%);
    filter: invert(55%) sepia(72%) saturate(377%) hue-rotate(73deg) brightness(93%) contrast(87%);
}

    .green-icon:hover {
        filter: none;
    }

.orange-icon {
    /* .svg button; filter color: #ff9900 (orange)) */
    -webkit-filter: invert(69%) sepia(99%) saturate(2583%) hue-rotate(357deg) brightness(98%) contrast(107%);
    filter: invert(69%) sepia(99%) saturate(2583%) hue-rotate(357deg) brightness(98%) contrast(107%);
}

   .orange-icon:hover {
        filter: none;
    }

.current-icon {
    /* .svg button; filter color: #eaeaea (very light gray)) */
    -webkit-filter: invert(84%) sepia(38%) saturate(0%) hue-rotate(7deg) brightness(103%) contrast(97%);
    filter: invert(84%) sepia(38%) saturate(0%) hue-rotate(7deg) brightness(103%) contrast(97%);
}


/* Round buttons */

.button {
    /* This style constructs a round button with a border radius that is half the button's height. */
    /* SEE subroutines/navigation.php (main menu store button)), subroutines-cart/add-to-cart1.php (add-to-cart button on item pages), subroutines-cart/display-cart.php (log in, checkout, and guest checkout buttons). */
    border: none;
    border-radius: 20px; /* half of the height of the button */
    font-family: 'Comfortaa', sans-serif;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    flex-direction: column;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
}

    .button:hover {
        -webkit-box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
        -moz-box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
        box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
        text-decoration: underline;
    }

.store {
    /* store ("shop") button */
    /* SEE subroutines/display-artwork.php. */
    width: auto;
    height: 40px;
    font-size: 18px; /* menu font size */
    padding: 0 12px 0 12px;
    background-color: #ff9900; /* orange */
}

.add-to-cart {
    /* add-to-cart button */
    /* SEE subroutines-cart/add-to-cart1a.php, subroutines-cart/add-to-cart1b.php. */
    width: auto;
    height: 40px;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    background-color: #4caf50; /* Green */
}

.added-to-cart {
    /* The add-to-cart button turns light gray when an item is submitted to notify the user that the item is in the cart.
    /* SEE subroutines/add-to-cart1.php, subroutines/add-to-cart1.php. */
    width: auto;
    height: 40px;
    font-size: 16px;
    color: #000000 !important;
    padding-left: 12px;
    padding-right: 12px;
    background-color: #f0f0f0; /* very light gray */
}

.cart-buttons {
    /* Containers for sign-in, guest, and checkout buttons (SEE cart discount subroutines). */
    padding: 0;
}

.sign-in {
    /* log in button at the bottom of the cart page */
    /* SEE SEE cart discount subroutines. */
    width: auto;
    height: 40px;
    font-size: 16px;
    white-space: nowrap;
    padding-left: 12px;
    padding-right: 12px;
    background-color: #4caf50; /* green */
}

.guest {
    /* guest checkout button on the cart page */
    /* SEE SEE cart discount subroutines. */
    width: auto;
    height: 40px;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    background-color: #4caf50; /* green */
}

.checkout {
    /* checkout button on the cart page (for customers who are logged in) */
    /* SEE SEE cart discount subroutines. */
    width: auto;
    height: 40px;
    font-size: 16px;
    padding-left: 12px;
    padding-right: 12px;
    background-color: #4caf50; /* green */
}


/* Navigation for pages that do not have the main menu - artwork.php, item.php, cart-item.php, cart.php. */
/* Page width = 1024px. */
/* Includes a return arrow and a dropdown menu. */

.page-navigation { 
    /* The page-navigation class is removed in devices with screen widths <= 1024px and replaced with the mobile device menu. */
    /* SEE subroutines/navigation-page.php, subroutines/navigation-store-page.php */
    width: auto !important;
    white-space: nowrap;
    height: 30px;
    position: fixed;
    top: 48px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    margin-left: -476px; /* 1024 (page width) / 2 = 512 - 36 (left margin) = 476 */
    z-index: 100; 
}

.page-menu-arrow {
    height: 30px;
    width: 30px;
    -webkit-filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
    filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
}

.page-navigation:hover .page-menu-arrow {
    filter: none;
}

.page-return-arrow {
    height: 30px;
    width: 30px;
    -webkit-filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
    filter: invert(46%) sepia(71%) saturate(1203%) hue-rotate(187deg) brightness(93%) contrast(85%);
    padding-bottom: 12px;
}

.page-navigation:hover .page-return-arrow {
    filter: none;
}

.dropdown-menu {
    position: fixed;
    top: 0;
    left: 0;
}

.dropdown-menu-content {
    display: none;
    padding-top: 12px;
}

.dropdown-menu-content a {
    display: block;
    color: #3b8ede;
}

.dropdown-menu:hover .dropdown-menu-content {
    display: block;
}


/* Customer account drop-down menu  */
/* SEE subroutines-store/navigation-store-customer.php. */

.button-container {
    width: 30px;
    position: fixed;
    top: 48px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap;
    margin-left: 476px; /* 1024 (page width) / 2 = 512 - 36 (right margin) = 476 */
}

.cart-button {
    /* shopping cart icon */
    width: 30px;
    min-width: 30px;
    height: 36px;
    min-height: 36px;
}

.cart-count {
    /* The number of items in the cart. */
    /* SEE cart-item.php, item.php, store.php */
    font-size: 12px;
    margin-top: -44px;
    margin-left: 4px;
    text-align: center;
}

.person-button {
    /* The customer dropdown menu button. */
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
}

.customer-account {
    display: block;
    position: fixed;
    top: 48px;
}

.customer-account-menu {
    /* The customer account menu opens from the left. */
    /* SEE store.php. */
    display: none;
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    z-index: 100;
}

.customer-account-menu-page {
    /* The customer account menu opens from the right. */
    /* SEE item.php. */
    display: none;
    padding-top: 12px;
    width: 144px;
    margin-left: -114px;
    text-align: right;
}

.customer-account-menu a, customer-account-menu-page a {
    display: block;
    color: #3b8ede;
}

.customer-account:hover .customer-account-menu, .customer-account:hover .customer-account-menu-page {
    display: block;
}


/* Responsive */

/* Mobile */

.mobile, .mobile-header, .mobile-navigation, .mobile-button, .mobile-person-button, .mobile-customer-account, .mobile-customer-account-menu {
    display: none;
}

.mobile .menu-mobile {
    /* hamburger button */
    width: 60px;
    height: 60px;
    display: inline-block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}

.mobile .menu-mobile .bar {
    /* hamburger button bar */
    display: block;
    width: 24px;
    height: 2px;
    background-color: #000000;
    position: relative;
}

.mobile .menu-mobile .bar-1 {
    top: 24px;
}

.mobile .menu-mobile .bar-2 {
    top: 30px;
}

.mobile .menu-mobile .bar-3 {
    top: 36px;
}


/* Desktops */
@media screen and (min-width: 1024px) {
    /* All computers with screens wide enough to display the left (menu)) and right (content) columns. */
}

/* Tablets Portrait or Landscape */
@media screen and (max-device-width: 1024px) {

    /* Mobile header */
    .mobile {
        display: block;
    }
    .mobile-navigation {
        display: block;
    }
    .mobile-daylily {
        display: block !important; /* Safari needs !important. */
        padding-bottom: 12px;
        -webkit-filter: brightness(0) invert(1);
        filter: brightness(0) invert(1);
    }

    /* Mobile device menu */
    .header {
        width: auto;
        left: 0;
        text-align: left;
        padding-left: 48px;
        opacity: 1;
        background-color: #000000, .5;
        z-index: 9999;
        -webkit-transform: translateX(-101%);
        -moz-transform: translateX(-101%);
        transform: translateX(-101%);
        -webkit-transition: transform 0.3s ease;
        -moz-transition: transform 0.3s ease;
        -ms-transition: transform 0.3s ease;
        -o-transition: transform 0.3s ease;
        transition: transform 0.3s ease;
    }
    .header.active {
        text-align: left;
        padding-left: 48px;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        transform: translateX(0);
    }

    .header .logo, .header.active .logo {
        /* Hides "Daylily Art" in a tablet with a hamburger menu. */
        display: none;
    }
    .website-daylily, .store-daylily {
        /* Hides the left column daylily. */
        /* See subroutines/navigation.php for the mobile menu daylily (class="phone_daylily"). */
        display: none;
    }
    .menu li a {
        color: #ffffff;
    }
    .menu li a:hover {
         color: #ffffff;
    }
    .menu .current {
        color: #ffffff;
    }
    .menu .lines {
        color: #3b8ede;
    }
    .hide-menu.active {
        visibility: visible;
        opacity: 1;
    }
    .daylily-form {
        padding-top: 12px;
    }

    /* Icon buttons */
    .mobile-button {
        display: block;
    }
    .image-return  {
        /* The return button container for image.php. */
        width: 48px;
        position: absolute;
        top: 18px;
        left: 0;
        -webkit-transform: none;
        transform: none;
        padding-left: 12px;
        z-index: 100;
    }
    .slider-button {
        display: none;
    }
    .back-to-top {
        display: none;
    }
    .return-button-container {
        top: 0; left: 0;
    }
    .return-button {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 0;
        left: 0;
        padding: 24px 0 0 18px;
    }
    .button-container {
        /* The button container class, which contains the cart and person buttons, is removed in store.php and item.php. */
        display: none;
    }
    .cart-button {
        position: fixed;
        top: 18px;
        right: 18px;
        z-index: 100;
    }
    .cart-count {
        width: 30px;
        height: 28px;
        position: fixed;
        top: 27px;
        right: 18px;
        margin: 0;
    }
    .person-button {
        display: none;
    }
    .mobile-person-button {
        width: 30px;
        position: fixed;
        top: 72px;
        right: 18px;
        z-index: 99;
    }
    .archive-button {
        /* SEE blog/subroutines/navigation-blog.php. */
        position: absolute;
        top: 192px;
        right: 18px;
    }
    .subjects-button {
        /* SEE blog/subroutines/navigation-blog.php. */
        position: absolute;
        top: 252px;
        right: 18px;
    }
    .page-navigation {
        /* A drop-down menu replaces the main menu on pages that are 1024px wide - artwork.php, item.php, cart-item.php, cart.php. */
        /* The page-navigation class is removed in devices with screen widths <= 1024px and replaced with the mobile device menu. */
        /* SEE subroutines/navigation-page.php, subroutines/navigation-store-page.php */
        display: none;
    }
    .page-menu-arrow {
        display: none;
    }
    .times {
        /* The "X" that closes a mobile menu. */
        text-align: center;
    }

    /* Customer account menu */
    .customer-account {
        display: none;
    }
    .mobile-customer-account {
        display: block;
        width: 0;
        height: 100%;
        position: fixed;
        top: 0;
        right: 0;
        z-index: 1;
        background-color: rgba(0,0,0, .5);
        overflow-x: hidden;
        transition: 0.5s;
    }
        .mobile-customer-account a {
            font-size: 17px;
            line-height: 24px;
            color: #ffffff;
            transition: 0.3s;
            text-decoration: none;
        }
        .mobile-customer-account a:hover, .mobile-customer-account a:focus {
            color: #ffffff;
        }
    .mobile-customer-account-menu {
        display: block;
        width: 100%;
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        right: 18px;
        margin-top: -48px;
        text-align: right;
    }

    /* Blog menu */
    .subjects {
        display: block;
        width: 0;
        height: 100%;
        position: fixed;
        z-index: 1;
        top: 0;
        right: 0;
        background-color: rgba(0,0,0, .5);
        overflow-x: hidden;
        transition: 0.5s;
    }
        .subjects a {
            display: block;
            font-size: 18px;
            color: #ffffff;
            transition: 0.3s;
            text-decoration: none;
        }
        .subjects a:hover, .subjects a:focus {
            color: #ffffff;
        }
    .subjects-menu {
        padding-top: 264px;
        padding-right: 18px;
        text-align: right;
    }
    .subjects-heading {
        font-family: 'Questrial', sans-serif;
        font-size: 24px;
        font-weight: 400;
        color: #ffffff;
        letter-spacing: .05em;
        word-spacing: .05em;
        line-height: 24px;
        padding-bottom: 6px;
    }

}

/* Tablets Portrait or Landscape */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px){
}

/* iPhone 6 and 6 plus Portrait or Landscape */
@media (min-device-height: 667px) and (min-device-width: 375px) and (-webkit-min-device-pixel-ratio: 3) {
}

/* iPhone 5 Portrait or Landscape */
@media (device-height: 568px) and (device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
}

/* iPhone 4+ Portrait or Landscape */
@media screen and (min-device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
}

/* Mobile Phones Portrait or Landscape */
@media screen and (max-device-width: 640px) {

    /* Mobile header */
    .mobile-header {
        min-height: 60px;
    }
    .mobile-header .logo {
        padding-top: 24px;
    }
    .logo {
        font-size: 27px;
    }
    .logo .cursive {
        font-size: 36px;
    }

    /* Mobile device menu */
    .header {
        width: auto;
        left: 0;
        text-align: left;
        padding-left: 24px;
        opacity: 1;
        background-color: #000000, .5;
        z-index: 9999;
        -webkit-transform: translateX(-101%);
        -moz-transform: translateX(-101%);
        transform: translateX(-101%);
        -webkit-transition: transform 0.3s ease;
        -moz-transition: transform 0.3s ease;
        -ms-transition: transform 0.3s ease;
        -o-transition: transform 0.3s ease;
        transition: transform 0.3s ease;
    }
    .header.active {
        text-align: left;
        padding-left: 24px;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        transform: translateX(0);
    }
    .menu {
        line-height: 18px;
    }
    .daylily1b {
        width: 60px;
    }
    .daylily-form {
        padding-top: 6px;
    }
    .daylily-checkout {
        margin-top: -6px;
    }

    /* Icon buttons */
    .artwork-buttons, .item-buttons {
        width: 100%;
        padding-top: 6px;
        padding-bottom: 12px;
    }
    .enlarge-button {
        padding-right: 0;
    }
    .return-button-container {
        top: 0; left: 0;
    }
    .return-button {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 0;
        left: 0;
        padding: 24px 0 0 18px;
    }
    .archive-button {
        position: absolute;
        top: 108px;
        right: 18px;
    }
    .subjects-button {
        position: absolute;
        top: 162px;
        right: 18px;
    }

    /* Round buttons */
    .store {
        padding: 0;
    }
    .add-to-cart-form {
        /* On phone item pages, the container for the add-to-cart button. */
        /* SEE subroutines-cart/add-to-cart1b.php. */
        position: relative;
        top: 12px;
        bottom: 12px;
    }
    .sign-in {
        font-size: 16px;
    }
    .guest {
        font-size: 16px;
    }
    .checkout {
        font-size: 16px;
    }
    .submit {
    }

    .times {
        padding-top: 12px;
        padding-right: 18px;
        text-align: center;
    }

    /* Blog */
   .subjects-menu {
        padding-top: 180px;
        padding-bottom: 72px;
    }
    .subjects-heading {
        font-size: 22px;
        line-height: 22px;
    }

}

/* Mobile Phones Portrait */
@media screen and (max-device-width: 480px) and (orientation: portrait) {
}

/* Mobile Phones Landscape */
@media screen and (max-device-width: 640px) and (orientation: landscape) {
}