
/* Font Feature Icons */
@import url(fontfeatures.css);

.catalog .shadow-box-content { padding-left: 10px; padding-top: 10px; padding-right: 10px; }
    .catalog .shadow-box-content.image { padding: 0; }
.catalog .sampler-matrix { position: relative; z-index: 0; margin-bottom: 0; border-top: 0; padding-top: 0; }
.catalog .catalog-font-sampler { z-index: 0; margin-top: 5px; margin-bottom: 5px; }
    .catalog .catalog-font-sampler .web-fonts-preview { white-space: nowrap; overflow: hidden; }
.catalog-font-sampler.shadow-box-content { padding: 0 5px 0 0; background: transparent; }


/** SETTINGS ---------------------------------------------------------------------------------- **/
/*.catalog .sampler-settings-panel { margin:0px 0px; position:relative; z-index:1 }*/
.settings-panel .settings-option { height: 40px; float: left; padding-left: 20px; }
.catalog .sampler-settings-panel .settings-option { height: 22px; padding: 10px 2px; }
    /*
.catalog .sampler-settings-panel .settings-option + .settings-option { border: none; }
    */

    .catalog .sampler-settings-panel .settings-option.pdf-sample { padding: 10px 0px 10px 15px; border: 0; }

.settings-option.pdf-sample a { display: block; height: 20px; line-height: 20px; padding-left: 25px; background: url("images/content/catalog/pdf-icon.png") 0px 0px no-repeat; }

/** OPTION: COLOR-PICKER **/
.color-picker-bg { background: #3d3938; padding: 3px 3px 3px 0px; }
.color-picker-handle, .colorpick-waterfall { float: left; width: 12px; height: 12px; border: 1px solid #fff; margin: 0px 0px 0px 3px; }
.colorpick-waterfall { text-indent: -9999px; overflow: hidden; width: 12px; height: 12px; border: 1px solid #fff; line-height: 12px; padding: 0; }
    .colorpick-waterfall + .mColorPickerTrigger { display: block; height: 12px; width: 12px;float: left; background-color: transparent; position: relative; overflow: hidden; margin: 1px 0 0 -13px; line-height: 1; }
        .colorpick-waterfall + .mColorPickerTrigger img { display: none; }

/** OPTION: TEXT-TEMPLATE **/
.catalog .sampler-settings-panel .text-template .text-input-box { margin-right: 8px; }
.catalog .sampler-settings-panel .text-template .text-input-box-in { width: 160px; text-align: left; padding-left: 6px; }


/* catalog */
.catalog { z-index: 2; }

.catalog-title { font-family: FrutigerNeue,Helvetica,Arial,sans-serif; text-transform: uppercase; line-height: 16px; font-size: 16px; color: #3d3938; padding-bottom: 20px; margin: 0px 19px 20px 0px; border-bottom: #e7e6e4 2px solid; }

h2.catalog-title { font: bold 16px/16px FrutigerNeue,Helvetica,Arial,sans-serif; text-transform: uppercase; color: #3d3938; padding-bottom: 20px; margin: 0px 19px 30px 0px; border-bottom: #e7e6e4 2px solid; }
h2.catalog-title.hl-platinum { line-height: 34px; padding: 0; padding-left: 45px; background: url('images/content/highlighter/platinum.png') 0 center no-repeat; }
h1.webfont-sample-text { font-family: inherit; }

.catalog-title span { font-size: 12px; color: #888582; text-transform: none; }

.catalog-title-wide { width: 100%; }
.catalog-teaser-top-seperator { float: left; width: 30px; height: 128px; background: url(images/content/catalog-arrow-seperator.png) center center no-repeat; }

.catalog-teaser-bottom-seperator { /*float: left; width: 30px; height: 128px; background: url(images/content/dot-separator.png) center center no-repeat;*/  color: #d4d2cc;float: left;font-size: 38px;height: 128px;line-height: 128px;margin-left: -12px;margin-right: 12px;    width: 30px;}

.catalog-teasers .shadow-box-content { padding: 20px 0px 0px 20px; }
.catalog-teaser { position: relative; float: left; width: 132px; }

    .catalog-teaser img { width: 130px; height: 130px; }

.catalog-teaser-reduced { position: absolute; top: -10px; right: -10px; width: 34px; height: 34px; background: url(images/content/highlighter/discount.png) top right no-repeat; }

.catalog-teaser-award { position: absolute; top: -10px; right: -10px; width: 34px; height: 34px; background: url(images/content/highlighter/award.png) top right no-repeat; }

.catalog-teaser-text { margin: 5px 0px 20px 0px; padding-left: 3px; width: 90px; font-size: 10px; }
    .catalog-teaser-text img { width: auto; height: auto; margin-bottom: 10px; }

    .catalog-teaser-text span { display: block; padding-top: 4px; }

.catalog-meta-inf { float: left; font-size: 12px; color: #3d3938; }
    .catalog-meta-inf p, .catalog-meta-inf h1 { margin: 10px 0px 0px 20px; padding: 0px; border: 0; }
        .catalog-meta-inf p a { color: #871414; }
    .catalog-meta-inf h1 { font-size: 16px; color: #000; }

/* catalog-OVERVIEW */
.catalog-overview-teasers-top .shadow-box-content { padding: 20px 20px 20px 20px; }
.catalog-overview-teasers-bottom .shadow-box-content { padding: 20px 20px 0px 20px; }
.catalog-overview-teasers-bottom .shadow-box-content.trademark { padding: 20px; font-size: 12px; color: #888582; }

.catalog-overview-seperator { float: left; padding: 0px 30px 0px 20px; margin: 0px 20px 0px 30px; border-left: #e7e6e4 2px solid; border-right: #e7e6e4 2px solid; }

.catalog-overview-teasers-top { width: 982px; }
.catalog-overview-teaser-top { float: left; position: relative; width: 265px; }
.catalog-overview-teasers-bottom { width: 982px; z-index: 1; }
.catalog-overview-teaser-bottom { position: relative; float: left; width: 265px; }
#catalog-overview-teaser-top-1 { margin-bottom: 30px; border-top: 5px solid #000; }
#catalog-overview-teaser-top-2 { border-top: 5px solid #000; }
#catalog-overview-teaser-top-3 { border-top: 5px solid #000; margin-bottom: 30px; }
#catalog-overview-teaser-bottom-1 { border-top: 5px solid #000; margin-bottom: 30px; }
#catalog-overview-teaser-bottom-2 { border-top: 5px solid #000; }
#catalog-overview-teaser-bottom-3 { margin-bottom: 30px; border-top: 5px solid #000; }

.catalog-overview-teaser-icon { position: absolute; top: -12px; right: -8px; width: 40px; height: 40px; }

#catalog-overview-teaser-top-1-icon { background: url(images/content/highlighter/teaser-bottom-1-highlighter.png) top right no-repeat; }

.catalog-title-icon { position: absolute; top: 12px; right: 20px; width: 40px; height: 40px; background: url(images/content/highlighter/teaser-bottom-1-highlighter.png) top right no-repeat; }

.catalog-overview-teaser-head-link { display: block; }

.catalog-overview-teaser-title { display: block; height: 40px; width: 250px; padding: 14px 0px; font: italic 25px GenerisSerifComMedium,Georgia,Times,serif; color: #000; }

.catalog-overview-teaser-text { width: 265px; height: 60px; margin-top: 15px; font: italic 14px GenerisSerifComMedium,Georgia,Times,serif; color: #3d3938; }

.catalog-overview-teaser-links { width: 220px; height: 120px; padding: 0px 0px 40px 0px; }

.catalog-overview-teaser-link { display: block; height: 18px; padding: 10px 0px 0px 40px; margin-top: 3px; color: #3d3938; font-size: 12px; line-height: 12px; background: url(images/content/catalog/catalog-teaser-icons.png) 0px 0px no-repeat; }

.catalog-overview-teaser-link-dynamic { height: 32px; padding: 0px 0px 0px 0px; background: none; }

    .catalog-overview-teaser-link-dynamic span { display: block; float: left; padding: 10px 0 0 10px; }

    .catalog-overview-teaser-link-dynamic img { float: left; }

.catalog-overview-teasers-top .arrow-anchor-box { position: absolute; bottom: 5px; left: 0px; }

    .catalog-overview-teasers-top .arrow-anchor-box .txt { color: #fff; background-color: #000; }

    .catalog-overview-teasers-top .arrow-anchor-box .peak { background-position: 0px -48px; }
    .catalog-overview-teasers-top .arrow-anchor-box:hover .peak { background-position: -9px -48px; }
    .catalog-overview-teasers-top .arrow-anchor-box:hover .txt { background: #000; }
.catalog-overview-teasers-bottom .catalog-teaser { padding-bottom: 15px; }

.catalog-overview-teasers-bottom .arrow-anchor-box { float: right; padding: 0px 20px 25px 0px; }

    .catalog-overview-teasers-bottom .arrow-anchor-box .txt { white-space: nowrap; color: #fff; background-color: #afaaa7; }

    .catalog-overview-teasers-bottom .arrow-anchor-box .peak { background-position: 0px -16px; }

    .catalog-overview-teasers-bottom .arrow-anchor-box:hover .peak { background-position: -9px -16px; }

    .catalog-overview-teasers-bottom .arrow-anchor-box:hover .txt { background: #3d3938; }

.catalog-overview-teasers-bottom .catalog-teaser-text { margin: 0px 0px; }

.catalog-overview-info-box { height: 8px; padding: 13px 0px 16px 20px; font-size: 10px; line-height: 10px; color: #888582; }


/** PRODUCT CATALOG - FONT-FEATURES **/

.catalog-features { height: 32px; margin-left: 7px; }
    .catalog-features span { line-height: 12px; text-transform: uppercase; color: #888582; font-size: 10px; font-weight: bold; display: table-cell; float: left; vertical-align: middle; }

.world-selector { width: 215px; z-index: 3; }
    .world-selector .format { height: 72px; width: 200px; overflow: hidden; float: left; }
        .world-selector .format a { text-align: center; font-weight: bold; text-transform: uppercase; color: #000; font-size: 10px; float: left; margin-top: 2px; margin-right: 2px; padding-left: 1px; padding-top: 5px; position: relative; width: 47px; height: 64px; background: url(images/content/catalog/world-background-tab-map.png) 0px 0px no-repeat; }
            .world-selector .format a:first-child { margin-left: 0; }
            .world-selector .format a.active { background: url(images/content/catalog/world-background-tab-map.png) -48px 0px no-repeat; color: #fff; }

    .world-selector .slider-up,
    .world-selector .slider-down { float: left; width: 15px; height: 24px; margin-top: 2px; background: url(images/content/catalog/world-background-tab-map.png) -96px 0px no-repeat; }
    .world-selector .slider-down { background-position: -96px -26px; }

    .world-selector .format .inactive { background-image: none; color: #efeeed; }
    .world-selector .format div.world { margin-left: 6px; }
    .world-selector .format a.active div.world { background-position: -32px 0px; }
    .world-selector .format a.inactive div.world { background-position: -64px 0px; }
    .world-selector .format a div.world { background-position: -96px 0px; }
    .world-selector .text { padding: 10px 2px 8px 2px; font-size: 10px; font-weight: bold; }

.world-map { position: relative; height: 84px; width: 200px; margin: 0; padding: 0; line-height: 0px; background-color: #fff; }
    .world-map img.overlay { position: absolute; top: 0; left: 0; }

/* FONT LISTING */
.font-listing { font-family: FrutigerNeue,Helvetica,Arial,sans-serif; font-size: 12px; padding-bottom: 10px; }
    .font-listing .list { margin-left: 10px; }
    .font-listing .languageselect { font-weight: bold; font-size: 10px; text-transform: uppercase; padding-left: 30px; background: url(images/content/catalog/shadow-language-left.png) left top no-repeat; float: right; height: 57px; line-height: 36px; }
    .font-listing .product-tabs { margin-bottom: 30px; }
    .font-listing .catalog-title { width: 420px; float: left; border: none; padding-bottom: 20px; padding-top: 10px; }
.font-listing-head { height: 60px; margin-right: 10px; margin-left: 10px; margin-bottom: 20px; }
    .font-listing-head .fontcount { font-weight: bold; font-size: 13px; }
    .font-listing-head .fontname { font-weight: bold; font-size: 13px; }
    .font-listing-head a { color: #3d3938; }
    .font-listing-head .spacer { background-color: #e7e6e4; margin: 10px 30px; height: 15px; width: 2px; }
    .font-listing-head .format span.active { background-color: #3d3938; color: #fff; border-radius: 4px; border: 1px #3d3938 solid; }
    .font-listing-head .format span.inactive { color: #c4c4c3; border-radius: 4px; border: 1px #AFAAA7 solid; cursor: pointer; }

span.active_web { margin: 0 3px; padding: 3px; background-color: #374D74; color: #fff; border-radius: 4px; border: 1px #374D74 solid; font-size: 10px !important; font-weight: bold !important; }
span.inactive_web { margin: 0 3px; padding: 3px; background-color: #fff; color: #374D74; border-radius: 4px; border: 1px #374D74 solid; font-size: 10px !important; font-weight: bold !important; }
a:hover span.inactive_web { background-color: #374D74; color: #fff; }

.font-listing-head .font-format { margin-top: -6px; margin-left: 5px; display: block; width: 50px; height: 24px; float: right; }
.noline { border: 0px; }

.non-font-image { float: right; margin: 0px 10px 0px 10px; }

/* Technische details */
.font-tech-head { height: 32px; margin-top: 10px; margin-right: 10px; margin-left: 10px; }
    .font-tech-head .catalog-title { margin-bottom: 0px; width: 185px; margin-right: 10px; }

.font-tech-details { margin: 0 10px 20px 10px; color: #3D3938; line-height: 18px; }
.font-tech-label { float: left; width: 190px; }
.font-tech-value { float: left; }
.font-tech-quest { float: right; margin-top: -3px; }
.font-tech-line { clear: both; height: 2px; margin-bottom: 5px; font-size: 0px; padding-top: 10px; }

/* Font Compatible Icon */
.font-format { display: block; width: 50px; height: 24px; float: right; background: url(images/content/catalog/pc-mac-icon.png) no-repeat; }
    .font-format.pcmac { background-position: 0px 0px; }
    .font-format.pc { background-position: 0px -24px; }
    .font-format.mac { background-position: 0px -48px; }

.web-font-support { display: block; width: 24px; height: 24px; float: right; margin-top: -6px; background: url(images/content/catalog/browser-preview-icons_grayscale.png) no-repeat; }
    .web-font-support.firefox { background-position: 0px 0px; }
    .web-font-support.chrome { background-position: 0px -24px; }
    .web-font-support.safari { background-position: 0px -48px; }
    .web-font-support.internet-explorer { background-position: 0px -72px; }
    .web-font-support.opera { background-position: 0px -96px; }
    .web-font-support.mac-os-x { background-position: 0px -120px; }
    .web-font-support.windows-7 { background-position: 0px -144px; }
    .web-font-support.windows-xp { background-position: 0px -168px; }
    .web-font-support.ubuntu { background-position: 0px -192px; }

.font-tech-toggle-display, .font-tech-toggle-hide { text-transform: uppercase; float: left; margin-top: 5px; font: 10px/20px FrutigerNeue,Helvetica,Arial,sans-serif; height: 18px; line-height: 18px; padding-left: 26px; padding-right: 6px; padding-top: 2px; color: #fff; background: url(images/content/open-close_gray.png) 0 -20px no-repeat #afaaa7; }
.font-tech-toggle-display:hover, .font-tech-toggle-hide:hover { text-decoration: none; }
.font-tech-toggle-hide { background-position: 0 0; }


/* Style verkn�fte Fonts*/
.font-group { padding: 10px; }
    .font-group .catalog-title { width: 185px; float: left; padding-bottom: 10px; line-height: 12px; margin: 10px; font-size: 10px; font-weight: bold; color: #888582; text-transform: uppercase; border-bottom: none; }
    .font-group .notes { margin: 10px; padding-left: 2px; font-size: 10px; color: #3d3938; }

.fonts-linked { margin-left: 10px; margin-bottom: 0px; height: 52px; }
    .fonts-linked .selector { margin: 1px 1px 0 0; }
        .fonts-linked .selector .image { float: left; margin: 1px 1px 0 0; width: 50px; height: 50px; background-repeat: no-repeat; background-position: center center; }
            .fonts-linked .selector .image.black { display: block; background-color: #000; }
            .fonts-linked .selector .image.gray { display: block; background-color: #afaaa7; }
        .fonts-linked .selector.active .image.black { display: block; background-color: #000; }
        .fonts-linked .selector.active .image.gray { display: none; }
    .fonts-linked .arrow-anchor-box-shadow { margin-left: 40px; margin-top: 8px; }



/* Zweite Zeile im header  */
.font-listing-head-two { height: 50px; font-family: FrutigerNeue,Helvetica,Arial,sans-serif; font-size: 12px; margin: 20px 15px 5px 10px; }
    .font-listing-head-two div { float: left; }
        .font-listing-head-two div.license { height: 20px; line-height: 20px; padding: 10px 0px 10px 20px; }
    .font-listing-head-two .entries-per-page { padding: 0; }

/*Schatten unter ListItem */
.font-listing .shadow-box-shadow { margin: 0px 10px; height: 5px; }
.font-listing .shadow-box-shadow-left { left: -10px; width: 10px; background-position: -3px 0; }
.font-listing .shadow-box-shadow-right { right: -10px; width: 10px; background-position: -6px 0; }

.font-listing .world-selector { border-bottom: #e7e6e4 2px solid; }

.font-listing-tail { border-top: #e7e6e4 2px solid; width: 215px; padding-top: 10px; }

/* Font Detail Site */
.font-info-right { font-family: FrutigerNeue,Helvetica,Arial,sans-serif; font-size: 12px; }
    .font-info-right .line { border-bottom: #e7e6e4 solid 2px; padding: 12px 0px; line-height: 20px; }
    .font-info-right .fontcount { font-weight: bold; }
    .font-info-right .license { float: left; margin-right: 8px; }
    .font-info-right .font-format { margin-right: 50px; margin-top: -4px; }
    .font-info-right .line .help img { margin-top: 4px; margin-left: 4px; }
    .font-info-right .license .help { margin-top: -2px; }

    .font-info-right img.help.trigger { margin-top: 4px; margin-left: 4px; }
    .font-info-right .license img.help.trigger { margin-top: -2px; margin-left: 4px; }

.font-listing-head img.help.trigger { margin-left: 4px; }


/* SELECT BOXES */
#license { line-height: 15px; height: 20px; }
    #license .newListSelected { background: #afaaa7 url(images/content/select-box-handle.png) no-repeat scroll 30px 4px; border: 0px solid; color: #fff; line-height: 15px; height: 20px; margin-bottom: 10px; padding: 0; width: 45px; }
        #license .newListSelected div { display: block; font-size: 10px; padding: 2px 2px 2px 8px; text-align: left !important; width: 45px; }
    #license ul.newList { list-style: none; color: #000; width: 43px; background: #fff; border: 1px solid #afaaa7; top: 22px; left: 0; height: auto; overflow: auto; font-size: 0.85em; text-align: left!important; position: absolute; z-index: 9999; }
        #license ul.newList li { padding: 2px 5px!important; border-bottom: 0px solid #cccccc; }
            #license ul.newList li a { color: #000; }
    #license .hiLite { font-weight: bold!important; color: #000!important; }
    #license .newListHover { font-weight: bold!important; color: #000!important; }
    #license .newListSelHover { cursor: default; }
    #license .newListSelHover, #license .newListSelFocus { /*background-position:center;*/ }
        #license .newListSelHover div, #license .newListSelFocus div { font-weight: bold; }
#licence ul.newList li a { color: #000; }

#float-font-size { line-height: 15px; height: 20px; margin-top: 2px; }
    #float-font-size .newListSelected { background: #afaaa7 url(images/content/select-box-handle.png) no-repeat scroll 30px 4px; border: 0px solid; color: #fff; line-height: 15px; height: 20px; margin-bottom: 10px; padding: 0; width: 45px; }
        #float-font-size .newListSelected div { display: block; font-size: 10px; padding: 2px 2px 2px 8px; text-align: left !important; width: 45px; }
    #float-font-size ul.newList { list-style: none; color: #000; width: 43px; background: #fff; border: 1px solid #afaaa7; top: 22px; left: 0; height: 150px; overflow: auto; font-size: 0.85em; text-align: left!important; position: absolute; z-index: 9999; }
        #float-font-size ul.newList li { padding: 2px 5px!important; border-bottom: 0px solid #cccccc; }
            #float-font-size ul.newList li a { color: #000; }
    #float-font-size .hiLite { font-weight: bold!important; color: #000!important; }
    #float-font-size .newListHover { font-weight: bold!important; color: #000!important; }
    #float-font-size .newListSelHover { cursor: default; }
    #float-font-size .newListSelHover, #license .newListSelFocus { /*background-position:center;*/ }
        #float-font-size .newListSelHover div, #license .newListSelFocus div { font-weight: bold; }
    #float-font-size ul.newList li a { color: #000; }
/*
#format { line-height: 26px; height: 20px; }
    #format .formatSelector { margin-left: -3px; }
    #format .newListSelected { border: 0px solid; color: #fff; line-height: 15px; height: 18px; margin-bottom: 10px; padding: 0; width: 70px; margin-top: 3px; color: #000; }
        #format .newListSelected div { background: url(images/content/fake-select-indicator.png) no-repeat scroll 60px 4px; display: block; font-size: 10px; padding: 2px 2px 1px 8px; text-align: left !important; width: 60px; margin: 0; font-weight: bold; }
        #format .newListSelected .selectedTxt { border-radius: 4px; border: 1px #AFAAA7 solid; }
    #format ul.newList { border-width: 1px; border-style: solid; border-color: #afaaa7; list-style: none; color: #000; width: 70px; background: #fff; top: 22px; left: 0; height: auto; overflow: auto; font-size: 10px; text-align: left!important; position: absolute; z-index: 9999; }
        #format ul.newList li { padding: 2px 5px!important; border-bottom: 0px solid #cccccc; }
            #format ul.newList li a { color: #000; }
    #format .hiLite { font-weight: bold!important; color: #000!important; }
    #format .newListHover { font-weight: bold!important; color: #000!important; }
    #format .newListSelHover { cursor: default; }
    */
/*
    #format .newListSelHover div, #format .newListSelFocus div { font-weight: bold; }
#format ul.newList li a { color: #000; }
    */



#sort { line-height: 15px; height: 20px; float: left; padding: 10px 20px; width: 190px; border-right: 2px solid #E7E6E4; }
    #sort .newListSelected { background: #fff url(images/content/fake-select-indicator.png) no-repeat scroll 110px 4px; border: 0px solid; color: #fff; line-height: 15px; height: 20px; margin-bottom: 0px; padding: 0; width: 120px; margin-top: 2px; color: #3d3938; }
        #sort .newListSelected div { display: block; font-size: 14px; font-weight: bold; padding: 2px 2px 2px 8px; text-align: left !important; width: 50px; margin: 0; }
    #sort ul.newList { border-width: 1px; border-style: solid; border-color: #afaaa7; list-style: none; color: #000; width: 118px; background: #fff; top: 22px; left: 0; height: auto; overflow: auto; font-size: 10px; text-align: left!important; position: absolute; z-index: 9999; }
        #sort ul.newList li { padding: 2px 5px!important; border-bottom: 0px solid #cccccc; }
            #sort ul.newList li a { color: #000; }
    #sort .hiLite { font-weight: bold!important; color: #000!important; }
    #sort .newListHover { font-weight: bold!important; color: #000!important; }
    #sort .newListSelHover { cursor: default; }
    #sort .newListSelHover, #sort .newListSelFocus { }
        #sort .newListSelHover div, #sort .newListSelFocus div { font-weight: bold; }
    #sort ul.newList li a { color: #000; }


.font-listing .arrow-anchor-box { margin-top: 9px; }
    .font-listing .arrow-anchor-box .txt, .detail-search .arrow-anchor-box .txt { color: #fff; background-color: #afaaa7; }
    .font-listing .arrow-anchor-box .peak, .detail-search .arrow-anchor-box .peak { background-position: 0px -16px; }
    .font-listing .arrow-anchor-box:hover .peak, .detail-search .arrow-anchor-box:hover .peak { background-position: -9px -16px; }
    .font-listing .arrow-anchor-box:hover .txt, .detail-search .arrow-anchor-box:hover .txt { background: #3d3938; }

.font-listing .price { padding-top: 5px; font-size: 16px; color: #3d3938; }
    .font-listing .price span { font-size: 10px; }
        .font-listing .price span.price-container { font-size: 16px; font-weight: bold; }
.font-listing .price span.price-container span, .font-listing .price span.promotion-price span { font-size: 16px; font-weight: bold; }
.font-listing .arrow-anchor-box-shadow { padding: 10px 0 20px 0; position: relative; }

.font-listing .detail, .detail-search .detail { height: 32px; margin-bottom: 10px; }

/* WorldIcons with languagecount */
.world { float: left; margin: 5px 0px 0px 0px; width: 32px; height: 22px; text-align: center; background: url(images/content/catalog/world.png) center center no-repeat; }
    .world span { line-height: 22px; font-family: FrutigerNeue,Helvetica,Arial,sans-serif; font-weight: bold; font-size: 13px; color: #fff; }
    .world.wbgfff { background-position: 0px 0px; }
    .world.wbgdark { background-position: -32px 0px; }
    .world.wlight { background-position: -64px 0px; }
    .world.wgrey { background-position: -96px 0px; }

.ff-screen-quality { float: left; width: 32px; height: 22px; margin: 5px 10px 0px 0px; text-align: center; cursor: pointer; }
/* background: url(images/content/catalog/xsf-icon.png) center center no-repeat; */
.icon-XSF { background-color: #1764A0; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; height: 16px; font-size: 10px; line-height: 1.5em; padding-top: 2px; margin-top: 8px; }
.icon-ESQ { background-color: #55676c; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; height: 16px; font-size: 10px; line-height: 1.5em; padding-top: 2px; margin-top: 8px; }

.formatActive { background-color: #3d3938; color: #fff; border-radius: 4px !important; border: 1px #3d3938 solid !important; }

img#ajax-spinner { display: none; }

div.catalogue-sidebar div.tooltip.ff-screen-quality { margin-bottom: 20px; }
div.catalogue-sidebar div.tooltip.product-sq { float: left; clear: none; }
p.charcount-text { margin-bottom: 0px; }
/* FamilyGroup Banner */

#familygroup-banner { margin-bottom: 20px; }

.familygroup .product-tabs { margin-bottom: 0; }

#familygroup-textbox { background: url("images/content/home/stage-caption-bg.png") repeat scroll 0 0 transparent; top: 0; color: #FFFFFF; font: italic 30px/42px GenerisSerifCom,Georgia,Times,serif; height: 192px; right: 0; padding: 20px 0 0 25px; position: absolute; width: 475px; top: 10px; right: 12px; }

    #familygroup-textbox .catalog-title { margin: 0; color: #fff; }

#familygroup-textbox-image { float: left; }

#familygroup-textbox-text { font-size: 13px; line-height: 1.5em; padding-left: 30px; width: 270px; float: left; }

#familygroup-textbox .arrow-anchor-box { float: right; padding-right: 30px; }

    #familygroup-textbox .arrow-anchor-box .txt { color: #000; }

.pager { url("images/content/head-paging-left-shadow.png") no-repeat scroll left top transparent; }

.entries-per-page { background: none; }

.catalog-font-sampler-meta-info span { font-weight: bold; font-style: normal; }

.modalwindow { background: #fff; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; position: absolute; z-index: 100; width: 100%; height: auto; }

#ajax-spinner.onmodal { margin: auto; position: absolute; z-index: 200; }

.wishlist-button { position: relative; }

    .wishlist-button.left { float: left; }

textarea.sample-text-float,
.sample-text-float-options { display: none; margin: 10px 18px 15px 0; }

a.sample-text-float { height: 20px; }

textarea.sample-text-float { background-color: #e6e6e6; border: none; padding: 15px; float: left; }

.cart-loader-spinner { position: absolute; width: 47px; height: 38px; padding: 2px 0 0 7px; opacity: 0.6; background-color: #fff; display: none; }

.favourites-loader-spinner { position: absolute; top: 0; left: 8px; display: none; }

/* Web Font integration */

#webfontInfoWrapper { border: 0px solid #ccc; background: white; display: none; position: fixed; left: 50%; margin-left: -215px; margin-top: -200px; top: 50%; width: 340px; padding: 2em; z-index: 999; -webkit-box-shadow: 0px 0px 20px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 0px 20px rgba(50, 50, 50, 0.75); box-shadow: 0px 0px 20px rgba(50, 50, 50, 0.75); }
    #webfontInfoWrapper img.close { cursor: pointer; position: absolute; top: 12px; right: 12px; }
    #webfontInfoWrapper h4 { margin: 0; padding: 0 0 0.6em 0; line-height: 1.5em; border: 0; }
    #webfontInfoWrapper p { margin: 0 0 1em 0; }
    #webfontInfoWrapper div.column { float: left; width: 43%; color: #000; font-size: 13px; margin: 0; font-weight: normal; line-height: 1.5em; }
    #webfontInfoWrapper h4 a { color: #888582; }

.web-font-signup { margin-top: 1em; color: #747473; background-color: #e7e6e4; padding: 8px 8px 4px 8px; border-radius: 4px; font-size: 9px; font-weight: bold; text-align: center; text-transform: uppercase; }
    .web-font-signup a { color: #747473; }

.web-font-signup-button { background-color: #3d3938; border-radius: 4px; display: block; padding: 8px; color: #fff !important; font-size: 13px; }

#overview-header { position: relative; background-color: #871414; text-transform: none; color: #ffffff; height: 120px; }
#overview-header .header-description a { font-weight: normal; }
#overview-header h3 { margin: 0; padding-top: 20px; color: #ffffff; display: block; text-align: center; text-transform: none; font-size: 28px; font-weight: normal; width: 580px; margin: 0 auto; overflow: hidden; }
#overview-header .header-description { position: absolute; top: 15px; right: 0; z-index: 2; margin: 0; padding: 0 20px 3px 0; max-width: 280px; color: #fff; text-align: right; font-size: 12px; height: 120px; overflow: hidden; }
#overview-header .header-description h1 { display: inline; margin: 0; padding: 0; border: none; color: #fff; text-decoration: none; text-transform: none; font-weight: normal; font-style: italic; font-size: 12px; line-height: inherit; }
#overview-header span.right { background: transparent; }
#overview-header span.right { float: left; height: 28px; padding: 0; margin: 0 0 0 30px; padding-top: 0px; width: 28px; margin-top: 32px; }
#overview-menu { position: absolute; bottom: 0; margin: 0 0 0 40px; height: 58px; background: transparent; line-height: 58px; }
#overview-menu a { margin: 0; margin-left: 1px; background-color: rgba(255, 255, 255, 0.4); position: relative; background-image: none; line-height: 46px; height: 46px; display: block; float: left; padding: 0 25px; font-size: 10px; text-transform: uppercase; top: 10px; height: 48px; border: none; line-height: 48px; color: #ffffff; font-weight: normal; }
#overview-menu a:hover { cursor: pointer; }
#overview-menu a.active { font-weight: bold; height: 56px; line-height: 62px; background-color: #fff; color: #000; top: 0px; border-color: #e7e6e4; border-width: 2px 1px 0 1px; border-style: solid; }
.overview-tab-header { float: left; width: 806px; display: block; height: 25px; background-color: #e7e6e4; margin-right: 1px; }
.overview-tab-header.full-width { width: 100%; }
.overview-tab-header span { font-size: 10px; margin-left: 10px; text-transform: uppercase; font-weight: bold; }
.overview-tab a.view-all { display: block; height: 20px; float: left; color: #888582; text-align: right; font-size: 11px; text-transform: uppercase; font-weight: bold; }
.overview-tab a.view-all span { float: left; height: 20px; }
.overview-tab a.view-all span.txt { padding-top: 5px; float: left; width: 105px; background-color: #e7e6e4; padding-right: 15px; padding-top: 5px; }
.overview-tab a.view-all .peak { background: url(/css/images/overview/orw_peak.png) no-repeat 0 0; width: 15px; height: 25px; display: block; float: left; }
.overview-content { clear: both; height: 214px; }
.overview-content .overview-block { float: left; width: 158px; height: 170px; margin-top: 22px; margin-bottom: 22px; border-left: 1px solid #e7e6e4; padding-left: 10px; padding-right: 10px; overflow: hidden; }
.overview-content .overview-block:first-child { border: 0; }
.overview-content .overview-block:nth-child(5n + 1) { /*border: 0;*/ }
.overview-content .overview-block .sampler-matrix { overflow: hidden; height: 70px; margin-top: 20px; }
.overview-content .overview-block .sampler-matrix img { margin: 0 auto; }
.overview-content .overview-block a { clear: both; display: block; text-align: center; font-weight: bold; }
.overview-content .overview-block span { clear: both; display: block; text-align: center; font-size: 13px; color: #888582; }
.overview-content .overview-block span.sample-text { font-size: 48px; color: #000000; }

.overview-content .overview-block .icon-image { margin: 0 auto; width: 90px; height: 90px; margin-top: 25px; }
/* license icons replace by font */
#overview-pages .overview-tab .overview-content.licensing_tabs .overview-block {width: 136px;}
#overview-pages .licensing_tabs .overview-block .icon-image {height: auto;color: #000;line-height: 40px;margin-top: 8px !important;width: auto;}
#overview-pages .licensing_tabs .overview-block .icon-desktop_catalog {font-size: 6.7rem;}
#overview-pages .licensing_tabs .overview-block .icon-web_catalog {font-size: 75px;margin-bottom: 17px !important;margin-top: 23px !important;}
#overview-pages .licensing_tabs .overview-block .icon-digitalads { font-size: 66px;margin-bottom: 21px;margin-top: 28px !important;}
#overview-pages .licensing_tabs .overview-block .icon-mobile_catalog {font-size: 75px;margin-bottom: 12px !important;margin-top: 28px !important;}
#overview-pages .licensing_tabs .overview-block .icon-tablet_catalog {font-size: 75px;margin-bottom: 12px !important;margin-top: 28px !important;}
#overview-pages .licensing_tabs .overview-block .icon-server_catalog {font-size: 4.8rem;margin-bottom: 12px !important;margin-top: 26px !important;}
/* End */
.overview-content .overview-block .icon-image.orw-cyrillic { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -10px -282px; }
.overview-content .overview-block .icon-image.orw-chinese { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -126px -290px; }
.overview-content .overview-block .icon-image.orw-thai { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -242px -286px; }
.overview-content .overview-block .icon-image.orw-greek { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -390px -10px; }
.overview-content .overview-block .icon-image.orw-japanese { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -378px -118px; }
.overview-content .overview-block .icon-image.orw-desktop { width: 120px; background: url(/css/images/overview/orw_spritesheet.png) no-repeat -126px -10px; }
.overview-content .overview-block .icon-image.orw-web { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -256px -394px   ; }
.overview-content .overview-block .icon-image.orw-server { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -14px -10px; }
.overview-content .overview-block .icon-image.orw-ebook { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -358px -334px; }
.overview-content .overview-block .icon-image.orw-mobile { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -377px -226px; }
.overview-content .overview-block .icon-image.orw-blackletter { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -267px -10px; height: 105px; }
.overview-content .overview-block .icon-image.orw-birthday { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -10px -120px; width: 110px; height: 105px; }
.overview-content .overview-block .icon-image.orw-comic { background: url(/css/images/overview/orw_spritesheet.png) no-repeat -140px -120px; height: 105px; }

.overview-tab.x-3 { width: 572px; float: left; }
.overview-tab.x-3 .overview-tab-header { width: 436px; }
.font-identifier-table { height: 280px; width: 350px; float: left; margin: 0 20px 30px 0; }
.font-identifier-table .table-header-wrapper { display: block; clear: both; height: 25px; }
.font-identifier-table .font-identifier-content { background-color: #f5f5f4; margin-top: 1px; height: 225px; padding: 20px; position: relative; }
.font-identifier-table .table-header { float: left; width: 166px; background-color: #e7e6e4; height: 25px; padding-left: 13px; margin-right: 1px; }
.font-identifier-table .table-header span { font-size: 10px; margin-left: 10px; text-transform: uppercase; font-weight: bold; }
.font-identifier-table .fonts-az { display: block; background-color: #e7e6e4; height: 25px; padding-left: 10px; float: left; padding-top: 5px; height: 20px; color: #888582; font-size: 10px; text-transform: uppercase; font-weight: bold; width: 160px; }
.font-identifier-content ul { display: block; list-style-type: none; height: 170px; }
.font-identifier-content ul li { width: 145px; height: 50px; margin-bottom: 10px; float: left; display: block; margin-right: 10px; font-size: 11px; }
.font-identifier-content ul li.last-line { margin-bottom: 0; }
.font-identifier-content ul li img { display: block; width: 35px; height: 35px; float: left; margin-right: 10px; padding: 5px; background: #fff; }
.font-identifier-content ul li a { display: block; width: 85px; float: left; padding-top: 2px; }
.font-identifier-content a.go-advanced { clear: both; display: block; float: right; font-size: 11px; position: absolute; bottom: 10px; right: 20px; }
.font-identifier-content p { padding: 0; margin: 0; padding-bottom: 20px; font-size: 13px; }

/* Font by Categories, Usage and Themes */
.by-categories-content { padding-top: 30px; clear: both; display: block; }
.by-categories-tab-header { float: left; width: 670px; display: block; height: 25px; background-color: #e7e6e4; margin-right: 1px; }
.by-categories-tab-header span { font-size: 10px; margin-left: 10px; text-transform: uppercase; font-weight: bold; }
div.font-by-categories .by-categories-block { width: 670px; margin-bottom: 0; padding: 0; margin-bottom: 30px; padding-bottom: 30px; height: auto; border: 0; border-bottom: 1px solid #e7e6e4; }
div.font-by-categories { width: 670px; float: left; }
div.fonts-by-use-teaser { float: left; margin-left: 20px;}
#fonts-by-use-description { float: left; width: 175px; margin-right: 55px; }
.shadow-box-content.fonts-by-use { padding: 20px 0px 0px 20px; }
.fonts-by-use .fonts-by-use-teaser-text { float: left; width: 490px; font: italic 30px GenerisSerifCom,Georgia,Times,serif; font-weight: bold; color: #000000; height: 45px; }
.fonts-by-use .fonts-by-use-teaser-text a { color: inherit; }
.fonts-by-use .fonts-by-use-teaser-text span { color: #afaaa7; font-weight: normal; }
.fonts-by-use .fonts-by-use-teaser-info { clear: both; float: left; width: 385px; color: #000; padding: 0; margin: 0; background: none; font-family: FrutigerNeue,Helvetica,Arial,sans-serif; font-size: 14px; font-style: normal; line-height: 25px;}
.fonts-by-use #fonts-by-use-description-text { width: 178px; font: italic 14px GenerisSerifComMedium,Georgia,Times,serif; }
.fonts-by-use.shadow-box-content .arrow-anchor-box { position: relative; float: right; bottom: 0; right: 0; }
.fonts-by-use.shadow-box-content .arrow-anchor-box .txt { color: #fff; background-color: #afaaa7; width: 50px; padding-left: 10px; }
.fonts-by-use #fonts-by-use-description-text { font: italic 15px GenerisSerifComMedium,Georgia,Times,serif; }
#active-promotions-list {background:#ffffff;padding: 25px;}
.promotion_page .left {
    float: left; width: 46%;margin-left: 21px;
}
.promotion_page .right {
    float: right;width:50%; text-align: right;position:relative;
}
.promotion_page .right img
{
    max-width: 440px;
    max-height: 220px;
}
.promotion_page .right img.logo_on_promo
{
    position: absolute;
    right: -15px;
    top: -11px;
    -webkit-box-shadow: -5px 4px 2px 0px rgba(50, 50, 50, 0.05);
    -moz-box-shadow:    -5px 4px 2px 0px rgba(50, 50, 50, 0.05);
    box-shadow:         -5px 4px 2px 0px rgba(50, 50, 50, 0.05);
}
.more_promotions {
    background: #eee none repeat scroll 0 0;
    padding: 13px;
}
.featured_container {margin-bottom: 45px;margin-top: 40px;}
.more_promotions .promotions_heading {margin-left:8px;float:left;color:#3d3938;font-family:FrutigerNeueHeavy; font-weight: normal;font-size: 16px;letter-spacing: 0.5px;text-transform: uppercase;}
.more_promotions .promotions_sort {float:right;margin-right: 12px;}
.promotional_items {padding:16px 0 22px; border-bottom:2px solid #eeeeee;margin-top: 14px;}
.promotional_items .promo_item_image{float:left;width:50%;}
.promotional_items .promo_item_desc{float:left;width:32%;margin:3px 0 0 22px}
.promotional_items .promo_item_expire{float:right;width:8%;margin-top: 6px;margin-right: 20px;}
.promotion_page #active-promotions-list {padding:0;}
.promotion_page .left h5 {color:#afaaa7;text-transform: uppercase;font-size: 16px;margin-bottom: 0;margin-top:0px;font-family: FrutigerNeueHeavy;letter-spacing: 0.5px;font-weight: normal;line-height:12px;margin-bottom:4px;}
.promotion_page .left h6, .promo_item_desc h6 { color: #3d3938;font-family: FrutigerNeueHeavy;font-size: 16px;font-style: normal;font-weight: normal;margin-top: 0;text-transform: uppercase;letter-spacing: 0.5px;}
.promotion_page .left p, .promo_item_desc p {letter-spacing: 0.5px;font-family:FrutigerNeue;font-size: 14px; color:#3d3938;margin-top: 11px;}
.promo_item_expire p {font-family:FrutigerNeue;font-size: 14px; color:#afaaa7;margin:0;}
.promotion_page .left .arrow-box, .promotional_items .arrow-box {text-transform: uppercase;width: 136px;}
.promotion_page .left .arrow-box span.peak, .promotional_items .arrow-box span.peak
{
    background: rgba(0, 0, 0, 0) url("/images/promotion/getoffer_peak.png") no-repeat scroll 0px 0;
    display: block;
    float: left;
    height: 26px;
    width: 18px;
    margin-left: -1px; 
}
.promotion_page .left .arrow-box span.txt, .promotional_items .arrow-box span.txt {color: #888582;padding:1px 25px;font-size:0.85rem;font-family:frutigerneue;font-weight: bold;height: 23px;line-height: 23px;background: #f1f0ef;float:left;margin-top: 1px;letter-spacing: 0.3px;}
.more_promotions .promotions_sort span {font-family:FrutigerNeueHeavy;font-size: 14px;}
.more_promotions .promotions_sort span{color:#afaaa7;}
.more_promotions .promotions_sort a.active{color:#afaaa7;}
.more_promotions .promotions_sort a:hover{text-decoration: none;}
.more_promotions .promotions_sort a.active:hover {cursor: auto;}
.more_promotions .promotions_sort span.ends_soonest{color:#cc0000;}
span.highlight {color:#cc0000;}

.more_promotions .promotions_sort span {font-family: FrutigerNeue; font-weight: normal;}
.more_promotions .promotions_sort span.sort_by a {color: #afaaa7;}
.more_promotions .promotions_sort span a {text-decoration: none;}
.sort_icon{background:rgba(0, 0, 0, 0) url("/css/images/content/arrow-down.png") no-repeat scroll center 0;height: 6.5px;width:14px;display:inline-block;transform: rotate(180deg);margin-left: 10px;cursor:pointer;}
.sort_icon.asc { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
.promotion_page .promotional_items:last-child {border: none;}
.promotion_page .left p {margin-bottom: 30px;}
.promo_item_desc p{margin-bottom: 18px;}
.grid_view .grid_elem {float:left;width:33.2%;margin-bottom:20px;}
.grid_view .grid_elem img {max-width: 285px;}
.grid_view .grid_elem:nth-child(3n+1) {margin-right: 9px;}
.grid_view .grid_elem:nth-child(3n) {margin-left: 9px;float: right;width:31.6%;}
.grid_view .grid_row {margin-bottom: 20px;}
.promotions_sort div#list-grid-switcher .tc-list {border-right: none !important;}
.promotion_page .grid_view {margin-top: 30px;}
.view_separator {float: left;color: #dddddd;font-size: 25px !important;height: 22px;line-height: 22px;padding-left: 16px;padding-right: 16px;}
.promotions_sort div#list-grid-switcher {width:auto !important;margin-right: 4px;}
.promotions_sort #list-grid-switcher span.button {padding:0px !important;margin: 0px !important;}
#quickcheckout-modal-wrapper .modal-container{padding:0;}

