#archive {
    /*height: 100vh;*/
    position: relative;
}

    #archive span, #archive h5 {
        margin: 0;
        padding: 0;
        border: 0;
        vertical-align: baseline;
    }


    #archive .header {
        background: url(/National_Library/oe_/https://www.nli.org.il/src/assets/css/images/archive_header.png) no-repeat;
        background-position: 100% 0;
        background-size: 20% auto;
        padding: 4.7% 13%;
        margin: 1% 7% 0 0;
    }

        #archive .header h1 {
            font-size: 2.2em;
            line-height: 0.9em;
            font-family: "SouthBold";
            color: rgb( 59, 159, 215 );
            border-top: 6px rgb( 59, 159, 215 ) solid;
            width: 32%;
            padding-top: 3.7%;
        }
        /*style after scrolling*/
        #archive .header.scroll {
            padding: 18% 12% 2% 12%;
            background-position: 100% 84%;
        }

    #archive #subjects {
        height: 77vh; /*padding-bottom:7.3%*/
    }

        #archive #subjects .link {
            position: absolute;
            bottom: 2%;
            border-top: 1px #dadad9 solid;
            margin-right: 15px;
            width: 95%;
            color: rgb( 59, 159, 215 );
            text-align: left;
            float: left;
            padding-top: 10px
        }

            #archive #subjects .link a {
                color: rgb( 59, 159, 215 );
                padding: 0;
                margin: 0;
                margin-top: 6px;
                padding-bottom: 3%;
                font-family: "SouthLight";
                font-size: 1.2em;
            }

        #archive #subjects .link {
            width: 85%;
        }

    /* archive subjects
-----------------------------------------------------------------*/

    /*#archive .subjects {
        background-color: rgba( 223, 223, 222, 0.38 );
    }*/

        #archive .subjects ul {
            padding: 0;
            text-align: center;
            margin: 0 auto;
            width: 69%
        }

            #archive .subjects ul span {
                font-size: 25px;
                font-family: "SouthLight";
                color: rgb( 231, 75, 59 );
                padding-top: 17px;
                text-align: center;
                display: block;
                line-height: 1em;
            }

            #archive .subjects ul li a span:hover {
                text-decoration: NONE;
            }

            #archive .subjects ul li {
                list-style: none;
            }

@media (min-width: 1400px) {
    #archive .subjects ul span {
        font-size: 18px;
    }
}

/* Roll over effect over icons */


a.hi-icon {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    margin: 15px 30px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    text-align: center;
    position: relative;
    float: right;
    z-index: 1;
    color: rgb( 59, 159, 215 );
    margin-bottom: 45%;
}

.hi-icon:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.hi-icon:before {
    font-family: 'KitveyYad';
    speak: none;
    font-size: 95px;
    position: relative;
    top: 7px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
    line-height: 1;
}


.hi-icon-images.astronomy:before {
    content: "b";
}

.hi-icon-images.geometry:before {
    content: "t";
}

.hi-icon-images.astrology:before {
    content: "y";
}

.hi-icon-images.hebrewCalendar:before {
    content: "s";
}

.hi-icon-images.philosophy:before {
    content: "q";
}

.hi-icon-images.madaim:before {
    content: "u";
}

.hi-icon-images.shomronim:before {
    content: "1";
}

.hi-icon-images.kabala:before {
    content: "r";
}

.hi-icon-images.geography:before {
    content: "z";
}

.hi-icon-images.tanach:before {
    content: "v";
}

.hi-icon-images.kever:before {
    content: "x";
}

.hi-icon-images.kitvei_yad:before {
    content: "w";
}

.hi-icon-images.medicine:before {
    content: "G";
}










.hover-effect .hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

    .hover-effect .hi-icon:after {
        top: 0;
        left: 0;
        padding: 0;
        box-shadow: 0 0 0 5px rgb( 59, 159, 215 );
        -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
        -moz-transition: -moz-transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s;
    }

.hover-effect a .hi-icon:hover:after {
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
    opacity: 0.5;
}

.hover-effecta .hi-icon:hover, .hover-effecta .hi-icon:FOCUS {
    box-shadow: 0 0 0 10px rgba(162, 203, 226, 1);
    color: rgb( 231, 75, 59 );
    text-decoration: none !IMPORTANT;
}

a.hi-icon.hi-icon-images span:hover, a.hi-icon.hi-icon-images span:focus {
    COLOR: BLUE;
    text-decoration: none !IMPORTANT
}

/*#archive #archiveCarousel{margin:0 auto; text-align:center; width:95%}
#archive #archiveCarousel .carousel-inner{width:90%; right:5%}
#archive #archiveCarousel {padding-bottom:21%}
*/

#subjectsCarousel .carousel-control {
    padding-top: 25%;
    width: 5%;
    font-size: 30px;
    font-family: "SouthLight";
    z-index: 9999999;
}

    #subjectsCarousel .carousel-control.left,
    #subjectsCarousel .carousel-control.right {
        background: none !important;
        filter: progid: none !important;
        outline: 0;
    }


#subjectsCarousel.carousel .carousel-control {
    visibility: hidden;
}

#subjectsCarousel.carousel:hover .carousel-control {
    visibility: visible;
}

#subjectsCarousel .carousel-control.left,
#subjectsCarousel .carousel-control.right {
    color: rgb( 213, 213, 212 );
    text-shadow: none;
}


/**** media queries ****/
@media (max-width: 1680px) {
    #archive #subjects {
        padding-bottom: 7.9%
    }
}

@media (max-width: 1400px) {
    #archive .header h1 {
        width: 40%;
    }

    #archive .subjects ul {
        width: 70%;
    }

        #archive .subjects ul span {
            padding-top: 11px;
            font-size: 15px;
        }

    .hi-icon::before {
        font-size: 71px; /*top:15px*/
    }

    a.hi-icon {
        height: 80px;
        width: 80px;
    }

    #archive .header.blue {
        margin-top: 5%
    }

        #archive .header.blue h1 {
            font-size: 1.5em;
            width: 42%;
        }

    #archive #subjects {
        padding-bottom: 22%
    }

    #archive .header.blue {
        background-position: 100% -9px;
    }

    .hi-icon:before {
        top: 4px;
    }
}


@media (max-width: 1280px) {
    a.hi-icon {
        width: 83px;
        height: 83px;
    }

    .hi-icon::before {
        top: 6px;
    }
}

@media (max-width: 1024px) {

    #archive .header.scroll {
        padding-top: 25%
    }

    #archive #subjects { /*padding-bottom: 19%;*/
    }
}


@media (max-width: 998px) {
    #archive {
        height: 100%
    }

        #archive #subjects {
            height: 100%;
        }

        #archive .header.blue h1 {
            width: 68%;
        }

        #archive .header.blue {
            background-size: 33% auto;
            background-position: top right;
            margin: 0
        }

        #archive #subjects .link {
            border-top: none
        }

        #archive #subjects ul li {
            width: 50%;
            display: inline-block;
            float: right;
        }

        #archive #subjects { /*padding-bottom:172%*/
        }
}

@media (max-width: 480px) {
    #archive .header.blue h1 {
        width: 68%;
    }

    #archive .subjects ul {
        width: 90%;
        margin-right: 1%;
    }

    #archive #subjects .link a {
        position: absolute;
        width: 100%;
        right: 0;
        margin-top: 0;
        bottom: 1%
    }

    #archive #subjects {
        padding-bottom: 221%
    }
}