/* 
    Created on : 12.8.2019, 17:51:45
    Author     : Jakub
*/

#slider-first-item .over, #slider-last-item .over {
    background: transparent;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    cursor: default;
    z-index:100;
}

#homepage-filter {
    margin-bottom: 10rem;
    float:right;
}

#homepage-filter-top-link {
    background:url('/images/backgrounds/01-top-hp.jpg') no-repeat;
    background-size: auto 920px;
    background-position: center -60px;
}

    .homepage-claim {
        color: #fff;
        font-weight: 400;
        line-height: 2.5rem;
        font-size: 3.4rem;
    }
    
        .homepage-claim small {
            font-weight: 300;
            font-size:2.2rem;
            display: inline-block;
            padding-left:5rem;
        }

        .homepage-claim span:last-child {
            font-weight: 600;
            display: inline-block;
            padding-left:8rem;
            padding-top: 0.7rem;
        }
        
#top-links {

}    

    #top-links a {
        color: #fff;
        font-size: 1.4rem;
    }

        #top-links a:hover {
            text-decoration: none;
            background:#d3481f;
        }
        
        #top-links a span {
            padding: 0 1rem;
            display: table;
            line-height: 1.7rem;
            height: 4.8rem;
            width: 100%;
        }
        
            #top-links a span em {
                display: table-cell;
                vertical-align: middle;
                font-style: normal;
                text-align: center;
            }
    
#bottom-links {

}            

    #bottom-links a {
        color: #296cb3;
        font-size: 1rem;
        font-weight: 600;
    }

        #bottom-links a:hover {
            text-decoration: none;
            color:#d3481f;
            background:#f5d7ce;
        }
        
        #bottom-links a span {
            padding: 0 1rem;
            display: table;
            line-height: 1.3rem;
            height: 4rem;
            width: 100%;
        }
        
            #bottom-links a span em {
                display: table-cell;
                vertical-align: middle;
                font-style: normal;
                text-align: center;
            }
            
#articles {

}            

    #articles .media {
        position: relative;
    }
    
        #articles .media .img {
            width:182px;
            height:134px;
            background-size:cover;
            background-position: center center;
        }
        
        #articles .media .show-more {
            position: absolute;
            right:1rem;
            bottom:1rem;
            background:url('/images/next.png');
            width:50px;
            height:50px;
            display: inline-block;
        }
        
            #articles .media .show-more:hover {
                background:url('/images/next_active.png');
            }
    
        #articles .media h3 {
            padding: 0;
            font-size: 1.3rem;
        }
        
            #articles .media h3 a {
                color:#d3481f;
                font-weight: 600;
            }
        
        #articles .media p {
            font-size:0.9rem;
            margin: 0;
            padding-right: 4rem;
            
        }    
        
        

#bg-snow-homepage {
    background: url(/images/backgrounds/08-stripe-dark.png) no-repeat;
    background-size: auto 1300px;
    background-position: center top 50rem; /* 67rem */
}
 
#bg-footer {
    margin-top:10rem;
}

#favorite {
    overflow: hidden;
    height: 36rem;
}

    #favorite h2 {
        color:#fff;
        text-align: center;
    }

        #favorite h2 a {
            color:#fff;
        }

            #favorite h2 a:hover {
                text-decoration: none;
            }


#simple-gifts {
    height:26rem;
    position: relative;
}

    #slider-first-item, #slider-last-item {
        position: absolute;
    }

        #slider-first-item {
            -webkit-mask-image: -webkit-gradient(linear, right top, left top, from(rgba(0,0,0,0.5)), to(rgba(0,0,0,0)));
            mask-image: linear-gradient(to left, rgba(0,0,0,0.5), rgba(0,0,0,0));
        }

        #slider-last-item {
            -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,0.5)), to(rgba(0,0,0,0)));
            mask-image: linear-gradient(to right, rgba(0,0,0,0.5), rgba(0,0,0,0));
        }        

        #simple-gifts-arrow-left, #simple-gifts-arrow-right {
            position: absolute;
            top:10rem;
            cursor:pointer;
        }
        
            #simple-gifts-arrow-left {
                background:url('/images/left_arrow.png') no-repeat center center;
                width:26px;
                height:44px;
                left:-3rem;
            }        

            #simple-gifts-arrow-right {
                background:url('/images/right_arrow.png') no-repeat center center;
                width:26px;
                height:44px;
                right:-3rem;
            }

.homepage-four-items #favorite h2 a {
    color: #fff;
}

.homepage-four-items #perex-zarex h1 {
    color:#fff;
}

/* xl */
@media (min-width: 1200px) {
    #homepage-filter-top-link {
        background-image:url('/images/backgrounds/01-top-hp.jpg'), url(/images/backgrounds/05-flakes.png);
        background-repeat: no-repeat;
        background-size: auto 920px;
        background-position: center -60px, center 800px;
    }
    
    #bg-snow {
        background-image: url('/images/backgrounds/06-stripe-light.png'), 
                          url('/images/backgrounds/07-flakes_mirror.png'), 
                          url('/images/backgrounds/09-flakes-2.png'), 
                          url('/images/backgrounds/05-flakes.png'), 
                          url('/images/backgrounds/06-stripe-light.png'), 
                          url('/images/backgrounds/07-flakes_mirror.png'), 
                          url('/images/backgrounds/09-flakes-2.png');
        
        background-repeat: no-repeat;
        background-position-x: center;
        background-position-y: 0, 540px, 1210px, 3200px, 4800px, 5340px, 6110px;
    }
    
    #bg-footer {
        background: url('/images/backgrounds/02-footer-village-height.png') no-repeat center top -65px;
    }
}

@media (max-width: 1200px) {
    #simple-gifts .gift .price {
        font-size: 1.6rem;
    }
}

@media (min-width: 992px) {
    .homepage-empty-items #favorite h2 a {
        color:#296cb3;
    }

    .homepage-empty-items #perex-zarex h1 {
        color:#fff;
    }

    .homepage-four-items #favorite {
        margin-top: 6rem;
    }

    .homepage-four-items #bg-footer {
        margin-top:2rem;
    }

    #top-links .break-line {
        flex: 0 0 100%;
        height: 0;
    }
}

@media (max-width: 992px) {
    #articles .media {
        display:block;
    }
    
    #articles .media .img {
        width:100%;
    }
    
    #homepage-filter {
        float:none;
        width:100%;
        margin-bottom: 0;
    }
    
    .homepage-claim {
        padding-left: 65%;
    }
    
        .homepage-claim small, .homepage-claim span {
            font-weight: 500;
        }

        .homepage-claim small, .homepage-claim span:last-child {
            padding-left:0;
        }
    
    #bg-snow-homepage {
        background-position: center bottom 48rem;
    }
    
    #homepage-filter-top-link {
        background-size: auto 510px;
    }

    .homepage-four-items #favorite h2 a {
        color: #fff;
    }

    .homepage-four-items #perex-zarex h1 {
        color:#296cb3;
    }
}

@media (max-width: 960px) {
    #simple-gifts .gift .price {
        font-size: 1.4rem;
    }
}

/* md */
@media (max-width: 767px) {
    
    #homepage-filter .h2 {
        padding-left:5rem;
    }
    
    #simple-gifts .gift .price {
        font-size: 1.1rem;
    }
    
    .homepage-claim {
        padding-top: 0rem !important;
        font-size: 38px;
        padding: 0 0 0 64%;
        line-height: 2rem;
    }
    
        .homepage-claim small {
            font-size:24px;
        }

    .homepage-empty-items #bg-snow-homepage {
        background: none;
    }

    .homepage-four-items #inspire-category .h1 {
        color:#fff;
    }
}

@media (max-width: 575px) {
    #articles .media {
        display:flex;
    }
    
    #articles .media .img {
        width:180px;
    }
}

@media (max-width: 540px) {
    #homepage-filter-top-link {
        background-size: auto 400px;
        background-position: left -126px top -10px;
    }
    
    .homepage-claim {
        padding: 0 0 0 3rem;
        position: relative;
        top: -2rem;
    }
    
        .homepage-claim small {
            padding-left:2rem;
        }
        
        .homepage-claim span:last-child {
            padding-left:4rem;
        }
}                    

@media (max-width: 420px) {
    #top-links a span {
        height:4rem;
        line-height: 1.5rem;
    }
    
    #bottom-links a span {
        height: 3rem;
    }
    
    #articles .media .img {
        width:120px;
    }

    .homepage-four-items #inspire-category .h1 {
        color:#296cb3;
    }
}                 