/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\ 
for details on configuring this project to bundle and minify static web assets. */
body {
/*    padding-top: 50px;
    padding-bottom: 20px;*/
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
/*.body-content {
    padding-left: 10px;
    padding-right: 10px;
}*/

.no-margin {
    margin: 0 !important;
}

.no-padding {
    padding: 0 !important;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

#cookieConsent {
    padding: 15px 20px 20px 20px;
}

#cookieConsent button {
    float: right;
    padding-right: 15px;
}

/* Stub's page style */
.bg-1 {
    background-color: #52566d; /* Green */
    color: #ffffff;
    background-image: url(/pics/bg-header-352.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center;
    background-size: cover;
}

footer {
    margin-left: 15px;
}

span.etsy, span.amazon, span.insta, span.youtube, span.fb {
    padding: 3px 0px 3px 50px;
    list-style: none;
    margin: 10px;
    display: inline-block;
    line-height: 36px;
    width: 250px;
    text-align: left;
}

div.social {
    margin-bottom: 30px;
}

#dropdownAmazonLink:hover {
    text-decoration:none;
}

div.social img, img.amazon {
    width: 36px;
    height: 36px;
    border: 0;
}

span.etsy {
    background: url(/pics/icon_etsy.png) no-repeat left top;
    background-size: 36px;
}

span.amazon {
    background: url(/pics/icon_amazon.png) no-repeat left top;
    background-size: 36px;
}

span.insta {
    background: url(/pics/icon_instagram.png) no-repeat left top;
    background-size: 36px;
}

span.youtube {
    background: url(/pics/icon_youtube.png) no-repeat left top;
    background-size: 36px;
}

span.fb {
    background: url(/pics/icon_facebook.png) no-repeat left top;
    background-size: 36px;
}

.navbar-nav img {
    width: 24px;
    height: 24px;
    margin-right: 5px;
}

.cursor-zoom-in {
    cursor: zoom-in;
}

.card-pic {
    max-width: 400px;
    width: 100%;
    background-color: #343a40;
}

    .card-pic .carousel {
        max-width: 400px;
    }

    .card-pic .carousel-indicators {
        position: relative;
        height: 50px;
        margin-left: 0;
        margin-right: 0;
    }

    .card-pic .carousel-indicators li {
        width: 50px;
    }

    .card-pic .carousel-inner {
        width: inherit;
        height: 400px;
        border: solid #a0a0a063 1px;
        background-color: whitesmoke;
    }

    .card-pic .carousel-item {
        height: 400px;
        position: relative;
    }

    .card-pic .carousel-img {
        max-height: 100%;
        max-width: 100%;
        width: auto;
        height: auto;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }

    .card-pic .carousel .carousel-control-prev-icon {
        /* change fill="currentColor" to %23fff to make it white  */
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8" fill="%23aaa"><path d="M4 0c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 1v2h3v2h-3v2l-3-3 3-3z" /></svg>');
    }

    .card-pic .carousel .carousel-control-next-icon {
        /* change fill="currentColor" to %23fff to make it white  */
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8" fill="%23aaa"><path d="M4 0c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm0 1l3 3-3 3v-2h-3v-2h3v-2z" /></svg>');
    }

    .card-pic .carousel-control-next-icon, .carousel-control-prev-icon {
        /* Use to adjust size of icons */
        width: 2rem;
        height: 2rem;
    }

.card-body {
    max-width: 526px;
}

.card-sub {
    font-style: italic; 
}

.card-price {
    font-size: x-large;
}

.card-price-num {
    font-weight:bold;
}

.card-price .sold {
    color: red;
    font-weight: 900;
}

.closebtn {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8"><path d="M4 0c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm-1.5 1.78l1.5 1.5 1.5-1.5.72.72-1.5 1.5 1.5 1.5-.72.72-1.5-1.5-1.5 1.5-.72-.72 1.5-1.5-1.5-1.5.72-.72z" /></svg>');
    height: 16px;
    width: 16px;
    position: absolute;
    top: 2px;
    right: 2px;
}

    .closebtn:hover {
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 8 8" fill="%23777"><path d="M4 0c-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4-1.79-4-4-4zm-1.5 1.78l1.5 1.5 1.5-1.5.72.72-1.5 1.5 1.5 1.5-.72.72-1.5-1.5-1.5 1.5-.72-.72 1.5-1.5-1.5-1.5.72-.72z" /></svg>');
        cursor: pointer;
    }


.btn-primary {
    color: #fff;
    background-color: #1abc9c;
    border-color: #1abc9c;
}

    .btn-primary:hover {
        color: #fff;
        background-color: #009376;
        border-color: #00896b;
    }


.btn-outline-success {
    color: #1abc9c;
    border-color: #1abc9c;
}

    .btn-outline-success:hover {
        color: #fff;
        background-color: #1abc9c;
        border-color: #1abc9c;
    }

.pic-cell .sold {
    position: absolute;
    bottom: 40px;
    color: red;
    -webkit-text-stroke: 1px white;
    -webkit-text-fill-color: red;    
    font-weight: 900;
    width: 100%;
    font-size: clamp(1rem, -0.875rem + 8.333vw, 3.5rem);
    padding-right: 20px;
}

.homepage-header {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, sans-serif;
    color: white;
    -webkit-text-stroke: 1px black;
    -webkit-text-fill-color: white;
}

    .homepage-header h1, .homepage-header h3, .homepage-header h4 {
        font-weight: 900;
    }

.pagination > li > a {
    background-color: white;
    color: #5a626a;
    font-size: small;
}

    .pagination > li > a:focus,
    .pagination > li > a:hover,
    .pagination > li > span:focus,
    .pagination > li > span:hover {
        color: #5a5a5a;
        background-color: #eee;
        border-color: #ddd;
    }

.pagination > .active > a {
    color: white;
    background-color: #5a626a !Important;
    border: solid 1px #5a626a !Important;
}

    .pagination > .active > a:hover {
        background-color: #5a626a !Important;
        border: solid 1px #5a626a;
    }

.about img {
    display: block;
    width: 300px;
}

.redir {
    unicode-bidi: bidi-override;
    direction: rtl;
}

.map {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}

    .map iframe {
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        position: absolute;
    }