.breadcrumbs {
    padding-top:5px;
}

#root > div {
    display: table;
    table-layout: fixed;
    width: 100%;
}

.content-column .left-column {
    display:table-cell;
    width: 230px;
    padding-right:20px;
    vertical-align: top;
}

.content-column .right-column {
    display: table-cell;
    vertical-align: top;
}



.search-bar {
    margin-bottom: 10px;
}

.search-bar > button {
    float: right;
    margin-left:10px;
}


.search-bar > .search-holder {
    display: block;
    overflow: hidden;
/*    border:solid 1px #ccc;*/
    padding:2px;
    border-radius: 2px;
}

.search-bar > .search-holder > input {
    width: 100%;
    border:none;
}

.titled-box {
/*    border: 1px solid #D3D3D3;*/
    padding: 10px;
/*    background-color: #EEE;*/
    margin-bottom: 10px;
}

.filter-pair {
    margin-top: 10px;
}

.filter-pair > .filter-header {
    font-weight: bold;
}

.filter-pair > .filter-group {
    background-color: #FFF;
    overflow-x: hidden;
    overflow-y: scroll;
    max-height: 140px;
    margin-top: 3px;
    padding: 3px;
    border: 1px solid #D3D3D3;
}

.refinement {
    font-size: 12px;
    display: table-row;
    /*! margin: 3px 0; */
}

.refinement > input {
    /*!display: table-cell;*/
    vertical-align: middle;
}

.refinement > span {
    padding-left: 3px;
    display: table-cell;
    vertical-align: middle;
}

.refinement.disabled {
    color:gray;
}

.filter-group .refinement {
  display: block;
  padding-left: 22px;
  text-indent: -22px;
}

.filter-group input {
  vertical-align: middle;
  margin-top:0;
}
.filter-group .refinement input:after {
  vertical-align: middle;
}

.selected-filters {
    margin: 10px 0 0 0;
}

.selected-filters > .selected-group {
    font-weight: bold;
    margin-right: 5px;
}


.selected-filters > .selected-group::after {
    content: ':';
}

.selected-filters > .filter-sep {
    margin-right: 5px;
}


.result-list > .result-info {
    text-align: right;
    margin: 0px 0px;
}

.result-report-wrapper {
    font-size:14px;
}

.result-report-wrapper .result-report {
    float: left;
    margin-top: 5px;
    margin-bottom:15px;
}

.result-report-wrapper .auto-correct, .result-report-wrapper .dym {
    clear: both;
    margin: 0px
}

.result-list > .result-info:last-child {
    padding: 20px 0px;
    clear: both;
}

.result-list > .result-info > .result-report {
    float: left;
    font-size:14px;
    margin-top: 5px;
}

.result-list > .result-info > .pager {
    display: block;
    margin-bottom: 5px;
    white-space:nowrap;
}

.result-list > .result-info > .pager:after {
    content: " ";
    display: table;
    clear: both;
}


.pager button {
    margin-left:3px;
    border-radius: 0px;
    padding:5px 8px;
    font-size:14px;
    font-weight: normal;
}

.pager button.button {
    border-color:#000;
    background-image:none;
    background-color:#ccc;
    color:#000;
    min-width:auto;
    margin:1px;
    box-shadow:none;
}

.pager button.disabled, .pager button.disabled:hover {
    border-color:#ccc;
    background-color:#eee;
    color:#666;
}

.result {
    margin-top: 20px;
    /*! clear: both; */ 
    width:31.667%;
    float: left;
    border: solid 1px #999;
    margin-right: 2.5%;
    box-sizing: border-box;
    height:255px;
    background-image:url(//media.digikey.com/photos/nophoto/pna_en.jpg);
    background-size: auto 125px;
    background-repeat: no-repeat;
    background-position: center top;
    padding-top:125px;
}

.result:nth-child(3n+1) {
    margin-right:0;
}

.box-title {
    font-weight: bold;
    font-size: 14px;
    padding: 3px 5px;
    border-bottom: 1px solid #D3D3D3;
/*    background-color: #E6E6E6;*/
    color: #555;
    margin: -10px -10px 10px;
}


.overflow-fade div div {
  padding: 10px;
  border-top: solid 1px #999;
  min-height: 120px;
}

.result-list .result {-webkit-flex: 1 1 30%;-ms-flex: 1 1 30%;flex: 1 1 30%;}

@media screen and (max-width:960px) {

.result-list .result {
    flex: 1 1 40%;
}

    .result {
        width:48.75%
    }
    
    .result:nth-child(3n+1) {
       margin-right:2.5%;
    }
    
    .result:nth-child(2n+1) {
        margin-right:0;
    }
    
}

@media screen and (max-width:768px) {

.result-list .result {
    flex: 1 1 65%;
}

    .titled-box {
        padding: 0 0 5px 0;
}

    .filter-header {
        margin: 10px;
        display: block;
        border: solid 1px #ccc;
        padding: 4px 6px;
        margin-bottom: 0;
}

    .filter-header:after {
        content:"\f067";
        display: inline-block;
        float: right;
        cursor: pointer;
}

    .filter-header.active:after {
        content:"\f068";

}
    
   .box-title {
    font-weight: bold;
    font-size: 14px;
    padding: 3px 5px;
    border-bottom: 1px solid #D3D3D3;
    background-color: #E6E6E6;
    color: #555;
    margin: 0;
} 

    .filter-pair > .filter-group {
        margin:10px;
        margin-top: 0;
        display: none;
        border-top: none;
}

    .filter-group.active {
        display: block;
}

    .left-column, .right-column {
        display: block !important;
        width: 100% !important;;
}
}

@media screen and (max-width:600px) {

.result-list .result {
    flex: 1 1 100%;
}

    .result {
        width:100%
    }
    
    .result:nth-child {
        margin-right:0;
    }
}

@media screen and (max-width:450px) {
    .result-report {
        float:left;
        text-align: center;
        width: 100%;
    }
    
    .pager {
        float:left;
        text-align: center;
        width: 100%;
    }
    
    .result-report-wrapper .auto-correct, .result-report-wrapper .dym {
        margin-bottom: 15px
    }
    
}


.featured_content--image {
    display: block;
    height: 125px;
    overflow: hidden;
    margin-top:-125px;
}

.result img {
    height: 100%;
    width:100%;
}

.featured_content--type {
    color:#000;
    text-decoration: none;
    text-transform: uppercase;
    display: block;
    padding:5px 5px 0 5px;
/*    border-top:solid 1px #999;*/
}

.featured_content--title {
    display: block;
    color:#000;
    text-decoration: none;
    font-weight:bold;
    font-size:16px;
    padding:5px 5px 0 5px;
    line-height: 1.2em;
    max-height: 4.8em;
    overflow: hidden;
}

.featured_content--text {
    padding:5px;
    margin: 0;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.remove-filter {
    display: inline-block;
    width: 11px;
    height: 11px;
    background-image: url('https://www.digikey.com/catalog/static/images/close-x.png');
    margin-left: 5px;
    cursor: pointer;
}


.result-loader {
    display: block;
    width: 54px;
    height: 55px;
    background-image: url('https://www.digikey.com/-/media/Images/Content%20Search/ajax-loader.gif');
    margin: 20px auto;
}

.featured_content--image {
    position: relative;
    overflow: hidden;
}

.portrait, 
.square, 
.landscape {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 100%;
    width: auto;
    transform: translate(-50%,-50%);
}

.result img.square {
    width: 100%;
    height: auto;
}

.result img.landscape {
    width: auto;
    height: 100%;
}

.result img.portrait {
    width: 80%;
    height: auto;
}

@media screen and (max-width:600px) {
    
    .result img.portrait {
  	width: auto;
  	height: 100%;
    }
}







/* MOCKUP STYLE SHEET */
/* DEV NOTE: ONLY GETS APPLIED TO CONTENT PAGES */

/*===[ GLOBAL CSS STYLES ]===*/
body > p {display: none; margin: 0; padding: 0; text-align: center;}
#main-layout-content {background: #f5f5f5;}

#content {display: block !important; margin: 0 auto !important; padding: 20px 20px 25px; max-width: 1160px;}
#content p {font-size: 14px; line-height: 1.5;}
#content h1 {font-size: 28px; margin: .5em 0;}
#content h2 {font-size: 18px;}
#content h2.headline-border {margin-bottom: 10px; border-bottom: 1px solid #333; box-sizing: border-box;}

.duration_search {display: none !important;}

a.resultTitleLink:empty {display: none !important;}

/* SUBHEADER ITEMS */
#SubHeaderLinks, .subheader {display: none;}
.subheader__share a {display: none;}
#language-toggle {display: none;}

/* COLUMNS */
.layout-onecolumn, .layout-twocolumn, .layout-threecolumn {padding: 20px 20px 25px;}
.layout-threecolumn > .left-column, .layout-threecolumn > .right-column {display: none;}
.content-column {display: block; vertical-align: initial;}
.content-column #root > div {display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; margin: 10px -5px; padding: 0;}
.layout-twocolumn #leftColumn, .layout-threecolumn .left-column, .layout-threecolumn .content-column {display: block;}
.content-column .left-column {display: block; position: relative; -webkit-flex: 1 0 22%; -ms-flex: 1 0 22%; flex: 1 0 22%; justify-content: flex-end; height: 100%; margin: 5px; padding: 15px 10px 0; box-sizing: border-box; background: white; border: 1px solid #eaeaea; border: 1px solid var(--wispy-grey); border-radius: 0.5rem; --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); box-shadow: 0 0 #0000, 0 0 #0000, var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.content-column .right-column {display: block !important; position: relative; -webkit-flex: 1 0 74%; -ms-flex: 1 0 74%; flex: 1 0 74%; justify-content: flex-end; margin: 5px; padding: 0 0 0 15px !important; border: 0; box-sizing: border-box;}
    .rtl .content-column .right-column {padding: 0 15px 0 0 !important;}

/* BANNERS */
.custom .content {display: flex; flex-flow: wrap; flex: 100%; align-items: center; background-size: 100% auto; background-position: top; width: 100%; left: 0px; background: #cc0000;}
    .rtl .custom .content {right: 0px; left: auto;}
.custom .content .content-body {flex: 1; padding: 0 50px;}
.custom .content .content-text {font-size:42px !important; font-weight: 700; line-height: 38px !important;  color:#fff; }
.custom .content .content-banner-white {position: relative; flex: 1; width: 100%; min-height: 300px; background: #fff; -webkit-clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%);}
    .rtl .custom .content .content-banner-white {-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%);}
.custom .content .content-banner-black {position: absolute; top: 0; bottom: 0; left: 0; right: 10px; background: #000; -webkit-clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 86% 100%, 0 100%);}
    .rtl .custom .content .content-banner-black {left: 10px; right: 0; -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%);}
.custom .content .content-img-body {position: absolute; top: 0; bottom: 0; left: 0; right: 20px; -webkit-clip-path: polygon(0% 0, 100% 0, 85% 100%, 0 100%);  clip-path: polygon(0 0, 100% 0, 85% 100%, 0 100%);}	
    .rtl .custom .content .content-img-body {left: 20px; right: 0; -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%);  clip-path: polygon(0 0, 100% 0, 100% 100%, 15% 100%);}	
.custom .content .content-img-body img {width: 100%;}

/* CONTENT SEARCH BANNER */
.hero-image--content-search {
    position: relative;
    min-height:300px;
    background: #cc0000 url("/-/media/Images/Marketing/Resources/Content Library/banner_content-search.jpg") no-repeat center center / cover;
    background-size: cover;
}	

/* ARTICLE BANNER */
.hero-image--articles {
    position: relative;
    min-height:300px;
    background: #cc0000 url("/-/media/Images/Marketing/Resources/Content Library/banner_articles.jpg") no-repeat center center / cover;
    background-size: cover;
}

/* PTM BANNER */
.hero-image--ptm {
    position: relative;
    min-height:300px;
    background: #cc0000 url("/-/media/Images/Marketing/Resources/Content Library/banner_ptm.jpg") no-repeat center center / cover;
    background-size: cover;   
}

/* PRODUCT HIGHLIGHTS BANNER */
.hero-image--prod-highlights {
    position: relative;
    min-height:300px;
    background: #cc0000 url("/-/media/Images/Marketing/Resources/Content Library/banner_product-highlights.jpg") no-repeat center center / cover;
    background-size: cover;   
}

@media (max-width: 800px) {
    .custom .content {display: block; background: #cc0000;}   
    .custom .content .content-body {padding: 10px 30px; height: auto;} 
    .custom .content .content-text {margin: 0; font-size: 20px !important; line-height: normal !important; color: #fff;}
    .custom .content .content-banner-white {position: relative; flex: 1; width: 100%; min-height: 150px; background: #fff; -webkit-clip-path: none; clip-path: none;}
        .rtl .custom .content .content-banner-white {-webkit-clip-path: none; clip-path: none;}
    .custom .content .content-banner-black {position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #000; -webkit-clip-path: none; clip-path: none;}
        .rtl .custom .content .content-banner-black {left: 0; right: 0; -webkit-clip-path: none; clip-path: none;}
    .custom .content .content-img-body {position: absolute; top: 0; bottom: 0; left: 0; right: 0; -webkit-clip-path: none; clip-path: none;}
        .rtl .custom .content .content-img-body {left: 0; right: 0; -webkit-clip-path: none; clip-path: none;}

    .hero-image--content-search {min-height: 150px;}
    .hero-image--articles {min-height: 150px;}
    .hero-image--ptm {min-height: 150px;}
    .hero-image--prod-highlights {min-height: 150px;}
}

/* SUB BANNER */
.content-search--header__red {align-items: center; width: 100%; height: 114px; margin: 0 0 20px;}
.content-search--header__red .dk-message__icon {width: 114px; height: 114px; background: #cc0000;}
.content-search--header__red .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_news.png');}
.content-search--header__red .dk-message__content {padding: 8px 40px;}
.content-search--header__red .dk-message__header {font-size: 28px; line-height: 1.1;}
.content-search--header__red .dk-message__header::after {content: '';}

.content-search--header__red.ptm--header .dk-message__icon::before,
.content-search--header__red.prodhighlights--header .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_idea.png');}

@media (max-width: 800px) {
    .content-search--header__red {height: 74px;}
    .content-search--header__red .dk-message__icon {width: 74px; height: 74px;}
    .content-search--header__red .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_news.png?w=74&h=74'); top: 0; line-height: 0;}
    .content-search--header__red .dk-message__content {padding: 8px 20px;}
    .content-search--header__red .dk-message__header {font-size: 18px;}

    .content-search--header__red.ptm--header .dk-message__icon::before,
    .content-search--header__red.prodhighlights--header .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_idea.png?w=74&h=74'); top: 0; line-height: 0;}
}
@media (max-width: 700px) {
    .content-search--header__red {height: 64px;}
    .content-search--header__red .dk-message__icon {width: 64px; height: 64px;}
    .content-search--header__red .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_news.png?w=64&h=64'); top: 0; line-height: 0;}
    .content-search--header__red .dk-message__content {padding: 8px 10px;}
    .content-search--header__red .dk-message__header {font-size: 16px;}

    .content-search--header__red.ptm--header .dk-message__icon::before,
    .content-search--header__red.prodhighlights--header .dk-message__icon::before {content: url('/-/media/Images/Marketing/Resources/Content Library/icon_idea.png?w=64&h=64'); top: 0; line-height: 0;}
}
@media (max-width: 550px) {
    .content-search--header__red .dk-message__header {font-size: 14px;}
}

/*===[ CONTENT SECTION ]===*/
.content-column .right-column {display: table-cell; padding-left: 20px;}
    .rtl .content-column .right-column {padding-left:0px; padding-right:20px;}

/* RESULTS - NEW */
.result-loader {display: block; width: 54px; height: 55px; background-image: url('https://www.digikey.com/-/media/Images/Content%20Search/ajax-loader.gif'); margin: 20px auto;}
.result-list {display: -ms-flexbox; display: -webkit-flex; display: flex; flex-flow: row wrap; margin: 0 -5px 10px; padding: 0; clear:both;}
.result-list .result {display: block;position: relative;justify-content: flex-end;height: 100% !important;margin: 5px;overflow: hidden;box-sizing: border-box;background: #fff;border: 1px solid #eaeaea;border: 1px solid var(--wispy-grey); --tw-shadow: 0 1px 3px 0 rgba(0,0,0,0.1),0 1px 2px 0 rgba(0,0,0,0.06);box-shadow: 0 0 transparent,0 0 transparent,var(--tw-shadow);box-shadow: var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow);border-radius: 0.5rem;}

.result-list .result .resultTitleLink {display: block; width: auto; height: auto; margin: 0; padding: 0 0 8px; font-size: 16px; line-height: 1.3; font-weight: bold; color: #444; box-sizing: border-box; text-decoration: none;}
.result-list .result p {display: block; width: auto; margin: 0; font-size: 13px; font-weight: normal; line-height: normal; color: #444; box-sizing: border-box; opacity: 1;}

.result-list .result > div {display: block;width: auto;height: auto;margin: 10px 0 0;padding: 0;font-size: 0;line-height: auto;font-weight: normal;color: #444;box-sizing: border-box;text-decoration: none;}
.result-list .result > div a {text-decoration: none;}
.result-list .result > div a:hover {text-decoration: underline;}
.result-list .result > div a:visited {text-decoration: none;}

/* RESULTS */
.result-list .result .searchResultImg {display: block; float: right; width: 200px; height: auto; margin: 0 auto; padding: 10px; background: #fff; border: 0; overflow: hidden; box-sizing: border-box;}
    .rtl .result-list .result .searchResultImg {float: left;}
.result-list .result .searchResultImg {display: block; width: auto; max-height: 100px; margin: 0 0 0 15px; padding: 0;}
    .rtl .result-list .result .searchResultImg {margin: 0 15px 0 0;}

.result-list .result .publish_date_search {display: block; width: auto; height: auto; margin: 0 0 5px; padding: 0; line-height: 14px; background: #fff; color: #444; box-sizing: border-box; font-style: italic;}
.result-list .result .updated_date_search {display: block; width: auto; height: auto; margin: 0 0 5px; padding: 0; line-height: 14px; background: #fff; color: #444; box-sizing: border-box; font-style: italic;}
.result-list .result .duration_search {float: none; display: block; width: auto; height: auto; margin: 0 0 5px; padding: 0; line-height: 14px; background: #fff; color: #444; box-sizing: border-box; font-style: italic;}

/* RESULT TAGS */
.result div a[href*="supplier-centers"],
.result div a[href*="articles"],
.result div a[href*="product-highlight"],
.result div a[href*="ptm"],
.result div a[href*="press-releases"] {display: inline-block; vertical-align: middle; min-width: 105px; height: 28px; margin: 8px 8px 0 0; padding: 7px 20px; background: #eaeaea; border-radius: 4px; font-size: 12px; color: #222; box-sizing: border-box; text-decoration: none; text-align: center;}
    .rtl .result div a[href*="supplier-centers"],
    .rtl .result div a[href*="articles"],
    .rtl .result div a[href*="product-highlight"],
    .rtl .result div a[href*="ptm"],
    .rtl .result div a[href*="press-releases"] {margin: 8px 0 0 8px;}

.result div a:hover[href*="supplier-centers"],
.result div a:hover[href*="articles"],
.result div a:hover[href*="product-highlight"],
.result div a:hover[href*="ptm"],
.result div a:hover[href*="press-releases"] {background: #dadada; text-decoration: none;}

/* MAKER PROJECT CARD */
.result-list .result .maker-project-result {margin: 0; padding: 0;}
.result-list .result .maker-project-result > a:nth-of-type(1) {display: block; width: auto; height: auto; margin: 0; padding: 0 0 8px; font-size: 16px; line-height: 1.3; font-weight: bold; color: #444; box-sizing: border-box; text-decoration: none;}
.result-list .result .maker-project-result p:last-child {display: block; width: auto; height: auto; margin: 0 0 5px; padding: 0; line-height: 14px; background: #fff; color: #444; box-sizing: border-box; font-style: italic;}

/* VIDEO */
.video-result-container {display: block !important; margin: 0 !important; padding: 0 !important; font-size: inherit !important;}
.video-result-container .video-result .video-image {display: block; float: right; width: auto; height: auto; margin: 0; padding: 0; background: #fff; border: 0; overflow: hidden; box-sizing: border-box;}
    .rtl .video-result-container .video-result .video-image {float: left;}
.video-result-container .video-result .video-image img {display: block; float:right; width: auto; max-height: 100px; margin: 18px 0 18px 15px; padding: 0;}

.video-result-container .video-result a.video-link {display: block; width: auto; height: auto; margin: 0; padding: 0 0 8px; font-size: 16px; line-height: 1.3; font-weight: bold; color: #444; box-sizing: border-box; text-decoration: none;}
.video-result-container .video-result a:hover.video-link,
.video-result-container .video-result a:visited.video-link {color: #444; text-decoration: none;}
.video-result-container .video-result .video-text {display: block; width: auto; margin: 0; padding: 0 0 8px; font-size: 13px; font-weight: normal; line-height: normal; color: #444; box-sizing: border-box; opacity: 1;}
.video-result-container .video-result .video-search-result-publish-date {display: block; width: auto; height: auto; margin: 0 0 5px; padding: 0; line-height: 14px; background: #fff; color: #333; box-sizing: border-box; font-style: italic;}


/* PARTNER */
.partner-info {padding: 0 !important;}
.partner-info .result-title-link {display: block; width: auto; height: auto; margin: 0; padding: 7px 7px 3px; font-size: 16px; line-height: 1.5; font-weight: bold; color: #333 !important; box-sizing: border-box; text-decoration: none !important;}

/*===[ REFINE SEARCH SECTION ]===*/
/* SEARCH */
.left-column .search-bar > .search-holder input {display: block; width: 100%; margin: 0; padding: 7px 30px 7px 15px; border: none; background: #fff; border: 2px solid #ccc; border-radius: 100px; box-sizing: border-box; overflow: hidden; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;}
    .rtl .left-column .search-bar > .search-holder input {padding: 7px 15px 7px 30px;}
.left-column .search-bar {display: block; position: relative; margin: 0 0 10px;}
.left-column .search-bar button {display: block; position: absolute; top: 7px; right: 7px; background: transparent; border: 0; font-size: 0;}
    .rtl .left-column .search-bar button {left: 7px; right: auto;}
.left-column .search-bar button::after {content: "\f02e"; font-family: 'dk' !important; font-size: 15px; font-weight: bold; color: #1a1552; cursor: pointer;}
.left-column .search-bar button:hover::after {text-shadow: 0 0 1px #1a1552;}

/* FILTER BOX */
.left-column .titled-box {margin: 0 0 10px;padding: 10px;border-right: 0px solid #d3d3d3;}
.left-column .titled-box > .box-title {display: block;width: auto;height: auto;margin: -10px -10px 6px;padding: 10px 0px;padding: 5px 1px;er-bottom: 1px solid #ccc;font-size: 14px;font-weight: bold;color: #333;cursor: pointer;}
.left-column .titled-box > p {display: block; width: auto; height: auto; margin: -10px -10px 10px; padding: 3px 3px; border-bottom: 1px solid #ccc; font-size: 14px; font-weight: bold; color: #333; cursor: pointer;}

.left-column .titled-box p:after {float: right; margin: 0 10px; font-family: 'dk' !important; content: "\f067"; font-size: 17px; font-weight: normal; color: #333; line-height: 1.0; cursor: pointer;}
    .rtl .left-column .titled-box p:after {float: left;}
.left-column .titled-box p.active:after {font-family: 'dk' !important; content: "\f068";}
.filter-pair {position: relative; display: block; width: auto; height: auto; margin: 10px -10px; padding: 0; color: #333; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;}

/* FILTER HEADER */
.filter-pair > .filter-header {display: block; width: inherit; height: inherit; padding: 15px 7px 15px 10px; border-radius: 5px; box-sizing: border-box; font-size: 12px; font-weight: bold; color: #333; cursor: pointer;}
    .rtl .filter-pair > .filter-header {padding: 15px 10px 15px 7px;}
.filter-pair > .filter-header.active {border-bottom: 1px solid #ccc; border-radius: 5px 5px 0 0;}
.filter-pair > .filter-header:after {float: right; font-family: 'dk' !important; content: "\f107"; font-size: 20px; font-weight: normal; color: #333; cursor: pointer; margin: 0 5px; line-height: 16px; transition: all .2s ease;}
    .rtl .filter-pair > .filter-header:after {float: left;}
.filter-pair > .filter-header.active:after {-webkit-transform: rotate(.5turn); transform: rotate(.5turn);}

/* FILTER GROUP */
.filter-group {display: block; width: auto; height: auto; margin: 0; padding: 10px 10px 15px; color: #333; border: 0; border-radius: 0 0 5px 5px; box-sizing: border-box;}
.filter-pair .filter-group.active {max-height: 200px; overflow-y: auto;}
.filter-group .refinement {position: relative; display: block; margin: 3px 0 0; padding: 0 2px 0 37px; font-size: 12px; border: 0; cursor: pointer;}
    .rtl .filter-group .refinement {padding: 0 20px 0 2px;}
.filter-group .refinement input {position: absolute; left: -2px; top: -2px;}
    .rtl .filter-group .refinement input {right: -2px; left: auto;}

/* FILTER CHILDREN */
.filter-group.active > .filter-pair > .filter-group.active {padding: 0;}
.filter-group .filter-pair {margin: 0; padding: 0 17px 7px; border: 0;}
.filter-header + .filter-group.active > .refinement.expandable:after {float: right; margin: 0; font-family: 'dk' !important; content: "\f107"; font-size: 16px; font-weight: normal; color: #333; line-height: 1.0; cursor: pointer; transition: all .2s ease; position: relative; top: -15px;}
    .rtl .filter-header + .filter-group.active > .refinement.expandable:after {float: left;}
.filter-header + .filter-group.active > .refinement.active.expandable:after {-webkit-transform: rotate(.5turn); transform: rotate(.5turn);}

/* TOGGLE FILTER BOXES */
.filter-header ~ .filter-group, .filter-header ~ .date-filter {display: none;}
.filter-header.active ~ .filter-group, .filter-header.active ~ .date-filter {display: block;}

.filter-header ~ .filter-group, .refinement + .filter-pair {display: none;}
.filter-header.active ~ .filter-group, .refinement.active + .filter-pair {display: block;}

/* FILTER - CLEAR ALL BUTTON */
.left-column .filter-clear-all {display: block; width: 100%; height: auto; margin: 20px auto 0; padding: 0; text-align: center;}
.left-column .filter-clear-all button {display: inline-block; margin: 5px auto; padding: 8px 24px; min-width: 101px; font-size: 13px; font-weight: bold; color: #1a1552; color: var(--blurple-blue); text-align: center; text-decoration: none; line-height: 1; background: #fff; outline: none; box-shadow: inset 0 0 0 2px #ccc; box-shadow: inset 0 0 0 2px var(--cloud-grey); border: 1px solid transparent; border-color: #ccc; border-color: var(--cloud-grey); border-radius: 100px; box-sizing: border-box; cursor: pointer; transition: all .15s ease-out;}
.left-column .filter-clear-all button:hover {background: #f5f5f5;}


/* SELECTED FILTER BOX */
.right-column .titled-box {display: block; margin: 0 auto 15px; padding: 0; border: 0; box-sizing: border-box;}
.right-column .titled-box .box-title {display: block; height: 11px; margin: 0 8px 12px 0; padding: 0; font-size: 12px; font-weight: bold; color: #222; line-height: 14px; letter-spacing: -0.17px; text-transform: uppercase; box-sizing: border-box; border: 0;}
    .rtl .right-column .titled-box .box-title {margin: 0 0 12px 8px;}

.right-column .selected-filters-container {display: flex; flex-flow: row wrap; justify-content: flex-start; align-items: center; margin: 0 -5px;}
.right-column .selected-filters {margin: 10px 5px 0;}
.right-column .selected-filters > .selected-group {margin: 0 5px 0 0; font-weight: bold;}
    .rtl .right-column .selected-filters > .selected-group {margin: 0 0 0 5px;}
.right-column .selected-filters > .selected-group::after {content: ':';}
.right-column .selected-filters > .filter-sep {display: none;}

.right-column .selected-filter {display: flex; justify-content: space-between; align-items: center; margin: 0 5px 5px 0; padding: 10px 14px; background: #fff; border: 1px solid var(--cloud-grey); border-radius: 6px; outline: none; overflow: hidden; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;}
    .rtl .right-column .selected-filter {margin: 0 0 5px 5px;}
.right-column .selected-filter:focus,
.right-column .selected-filter:active {outline: none; box-shadow: 0 0 0 1px var(--blurple-blue); border-color: var(--blurple-blue);}

.right-column .selected-filter .remove-filter {margin: 0 0 0 12px; color: #cc0000; color: var(--red); font-size: 0.9em; cursor: pointer; background: none;}
    .rtl .right-column .selected-filter .remove-filter {margin: 0 12px 0 0;}
.right-column .selected-filter .remove-filter::before {content: "\f00d"; color: #cc0000; font-weight: bold;}

.right-column .titled-box .filter-clear-all {display: block; width: 100%; height: auto; margin: 20px auto 0; padding: 0; text-align: center;}
.right-column .titled-box .filter-clear-all button {display: block; margin: 0 auto; padding: 5px 10px; font-size: 14px; font-weight: bold; color: #333; background: #fff; border: 2px solid #aaa; border-radius: 50em; cursor: pointer;}
.right-column .titled-box .filter-clear-all button:hover {background: #06517f; border: 2px solid #06517f; color: #fff;}

/* FILTER BORDER and SPACING REMOVAL */
.date-filter {width: 100%; margin: 0; padding: 10px; border: 0; border-radius: 0 0 5px 5px;}
.date-filter td, .date-filter th {margin: 0; padding: 0;}
.date-filter td {padding: 0 0 5px;}
.date-box .invalid {color: #ff0000;} 

/* SHOWING RESULTS MESSAGE and DYM - DID YOU MEAN */
.auto-correct, .dym {clear: both; margin-top: 15px;}

/* DATE PICKER */
.duration_search {float: right;}
    .rtl .duration_search {float: left;}
.hasDatepicker {appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; width:95%; padding: 0.5em 1em; font-size: 1rem; border-radius: 5px; box-sizing: border-box; border: 2px solid transparent; box-shadow: 0 0 0 1px #ddd; transition: box-shadow .2s ease;}
.remove-filter {display: inline-block; width: 11px; height: 11px; background-image: url('https://www.digikey.com/catalog/static/images/close-x.png'); margin-left: 5px; cursor: pointer;}

/* DATE PICKER UI */
#ui-datepicker-div {direction: ltr;}
.ui-datepicker-title {padding: 3px 0 0; text-align: center;}
.ui-widget {font-family: "Roboto", "Noto Sans", Arial, Helvetica, sans-serif;}
.ui-datepicker {width: auto;}
.ui-datepicker-header {background: #fff; border: 0;}
.ui-datepicker-calendar td a {display: flex; padding: 0; text-align: center; justify-content: center; align-items: center;}
.ui-datepicker-calendar td .ui-state-default {height: 1.8em; width: 1.8em; background: #fff; border: 2px solid transparent; font-weight: 400; color: #444; text-align: center; border-radius: 100%;}
.ui-datepicker-calendar td .ui-state-hover {height: 1.8em; width: 1.8em; background: #cc0000; border: 2px solid transparent; font-weight: 400; color: #fff; text-align: center; border-radius: 100%;}
.ui-datepicker-calendar td.ui-datepicker-current-day .ui-state-default {height: 1.8em; width: 1.8em; background: #cc0000; border: 2px solid transparent; font-weight: 400; color: #fff; text-align: center; border-radius: 100%;}
.ui-datepicker-calendar td.ui-datepicker-today .ui-state-default {height: 1.8em; width: 1.8em; background: #1a1552; border: 2px solid transparent; font-weight: 400; color: #fff; text-align: center; border-radius: 100%;}

.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next {position: absolute; top: 8px; width: 1.8em; height: auto; padding: 0; text-align: center;}
.ui-datepicker .ui-datepicker-prev-hover, 
.ui-datepicker .ui-datepicker-next-hover {top: 8px;}
.ui-datepicker .ui-datepicker-prev {float: left; left: 0;}
    .rtl .ui-datepicker .ui-datepicker-prev {float: right;}
.ui-datepicker .ui-datepicker-next {float: right; right: 0;}
    .rtl .ui-datepicker .ui-datepicker-next {float: left;}
.ui-datepicker-header .ui-datepicker-prev {border: 2px solid transparent;}
.ui-datepicker-header .ui-datepicker-prev.ui-state-hover {background: #fff; border: 2px solid transparent;}
.ui-datepicker-header .ui-datepicker-prev span {display: none;}
.ui-datepicker-header .ui-datepicker-prev::before {content: "\f104"; font-family: 'dk'; font-size: 1.2em; font-weight: bold; color: #1a1552; cursor: pointer;}
.ui-datepicker-header .ui-datepicker-prev.ui-state-hover::before {color: #c00;}
.ui-datepicker-header .ui-datepicker-next {border: 2px solid transparent;}
.ui-datepicker-header .ui-datepicker-next.ui-state-hover {background: #fff; border: 2px solid transparent;}
.ui-datepicker-header .ui-datepicker-next span {display: none;}
.ui-datepicker-header .ui-datepicker-next::before {content: "\f105"; font-family: 'dk'; font-size: 1.2em; font-weight: bold; color: #1a1552; cursor: pointer;}
.ui-datepicker-header .ui-datepicker-next.ui-state-hover::before {color: #c00;}

/*===[ RESULT LIST - Results, Results per Page, Pager ]===*/
.result-list {min-width:100%; width:100%;}
.result-list > .result-info {display: block; width: 100%; margin: 0px 0px;}
.result-list > .result-info:last-child {display: block; width: 100%; height: auto; margin: 5px auto 0; padding: 10px 0 0 0; text-align: center; box-sizing: border-box;}

/* RESULT NUMBER */
.result-report-wrapper {display: block; width: 100%; height: auto; margin: 0 auto; padding: 0; clear:both; font-size: 14px; line-height: 1.5;}
.result-report-wrapper .result-report {display: block; float: left; margin: 0; padding: 5px; font-weight: bold;}
    .rtl .result-report-wrapper .result-report {float: right;}

/* RESULTS PER PAGE */
.result-info .results-per-page {display: block; float: right; margin: 0; padding: 5px; font-size: 11px; color: #444; clear: both;}
    .rtl .result-info .results-per-page {float: left;}
.result-info .results-per-page select {margin: 0 0 0 7px; font-size: 11px;}
    .rtl .result-info .results-per-page select {margin: 0 7px 0 0;}

/* PAGER */
.pager {display: block; float: right; margin: 0; padding: 0;}
    .rtl .pager {float: left;}

.pager button {display: block; position: relative; float: left; margin: 0; padding: 5px 8px; border-radius: 0px; font-size: 14px; font-weight: normal;}
    .rtl .pager button {float: right;}

.pager button.button {min-width: auto; margin: 0; background: transparent; color: #1a1552; border: 1px solid transparent; box-shadow: none !important;}

.pager button.disabled {background: transparent; color: #1a1552; border: 1px solid transparent;}
.pager button.disabled:hover {background: transparent; color: #1a1552; border: 1px solid transparent;}

.pager button.disabled,
.pager button.disabled.current:first-child,
.pager button.disabled.current:last-child {background: transparent; color: #1a1552; border: 1px solid transparent;}

.pager button.disabled,
.pager button.disabled.current:hover:first-child,
.pager button.disabled.current:hover:last-child {background: transparent; color: #1a1552; border: 1px solid transparent;}

.pager button:focus:after,
.pager button:hover:after {content: " "; position: absolute; left: 0; bottom: 0; height: 0.15em; width: 90%; background: #c00; background: var(--red);}

/* ACTIVE PAGE */
.pager button.current {padding: 5px 0.6em 3px; background: #cc0000; color: #fff; border: 1px solid #cc0000; border-radius: 2.5em;}
.pager button.current:hover {background: #a20000; color: #fff; border: 1px solid #a20000;}
.pager button.current:focus:after,
.pager button.current:hover:after {display: none;}


/*===[ SIDEBAR SECTION ]===*/
/* EMAIL SIGN-UP IMAGE */
.right-column .richtextcontent img {display: none;}

/*===[ FLAGS - CORNER RIBBON]===*/
span.corner-ribbon {position: absolute; top: 25px; right: -34px; width: 130px; height: 0px; font-size: 11px; font-weight: 600; text-align: center; white-space: nowrap; z-index: 0;
    -webkit-transform: rotate(39deg);
    -moz-transform: rotate(39deg);
    -ms-transform: rotate(39deg);
    -o-transform: rotate(39deg);
    transform: rotate(39deg);
}
    .rtl span.corner-ribbon {left: -34px; right: auto;
        -webkit-transform: rotate(-39deg);
        -moz-transform: rotate(-39deg);
        -ms-transform: rotate(-39deg);
        -o-transform: rotate(-39deg);
        transform: rotate(-39deg);
    }
span.corner-ribbon::before {display: block; position: absolute; top: -2px; left: -39px; width: 141%; content: ""; box-sizing: border-box; border: 17px solid transparent; border-top-width: 0; border-left-width: 0; border-right-width: 0; z-index: -1;}
    .rtl span.corner-ribbon::before {right: -39px; left: auto;}

.result-list .result .corner-ribbon.new, .result-list .result.updated .corner-ribbon {color: #fff;}
.result-list .result .corner-ribbon.new::before {background-color: #668421;}
.result-list .result .corner-ribbon.comingSoon::before {background-color: #ffc320;}
.result-list .result .corner-ribbon.updated::before {background-color: #F8990B;}
.content .subtitle, .content .mk-s {margin: 0 0 0 10px;}
    .rtl .content .subtitle, .content .mk-s {margin: 0 10px 0 0;}

/* DESIGN SERVICES PROVIDERS */
.content-banner .content-banner__content .dsp p {font-size: 14px;}

/* Media Queries */
/* Large Devices - Desktops */
@media screen and (max-width: 1199px) {
    /* BANNER */
    .content-banner .content-banner__content h1 {font-size: 35px;}
    .content-banner .content-banner__content p {width: 100%; font-size: 20px;}
    .content-banner .custom-button a {padding: 12px 15px; font-size: 16px;}
    .content-banner .content-banner__imagery {right: 90px;} 
}

/* Medium Devices - tablets */
@media screen and (max-width: 991px) {
    /* BANNER */
    .content-banner .content-banner__content {margin: 25px 50px 0;}
    .content-banner .content-banner__imagery {right: 0px;} 

    /* COLUMNS */
    .content-column .left-column {-webkit-flex: 1 0 35%; -ms-flex: 1 0 35%; flex: 1 0 35%;}
    .content-column .right-column {-webkit-flex: 1 0 60%; -ms-flex: 1 0 60%; flex: 1 0 60%;}
}

/* Small Devices - landscape phones */
@media screen and (max-width: 768px) {
    /* BANNER */
    .content-banner__container {height: 200px;}
    .content-banner .content-banner__content {margin: 15px 15px 0;}
    .content-banner .content-banner__content h1 {font-size: 35px;}
    .content-banner .content-banner__content p {font-size: 20px; line-height: 1.4;}
    .content-banner .custom-button {width: 240px;}
    .content-banner .custom-button a {padding: 10px 13px; font-size: 16px;}
    .content-banner .content-banner__imagery {top: 0px;}
    .content-banner .content-banner__imagery img {width: 250px;}
    
    /* COLUMNS */
    .content-column .left-column {-webkit-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%;}
    .content-column .right-column {-webkit-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; padding: 0 !important;}
        .rtl .content-column .right-column {-webkit-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; padding: 0 !important;}
    .left-column .titled-box {border: 0;}

    /* FILTER */
    .pager button {display: inline-block; float: none;}
        .rtl .pager button {display: inline-block; float: none;}
    .result-list > .result-info {display: block; width: 250px; margin: 0px auto; text-align: center;}
    .result-list > .result-info:last-child {display: block; width: 250px; height: auto; margin: 0 auto; text-align: center;}
    .result-report-wrapper .result-report {float: none; margin: 5px auto; padding: 0;}
        .rtl .result-report-wrapper .result-report {float: none; margin: 5px auto; padding: 0;}
    .result-report-wrapper .results-per-page {float: none; margin: 10px auto; padding: 0;}
        .rtl .result-report-wrapper .results-per-page {float: none; margin: 10px auto; padding: 0;}
    .result-report-wrapper .pager {float: none;}
        .rtl .result-report-wrapper .pager {float: none;}
    .pager {float: none; margin: 5px auto;}
        .rtl .pager {float: none; margin: 5px auto;}
    .result-report-wrapper .result-left {display: block; float: none; width: 100%; margin: 0 auto; text-align: center; clear:both;}
        .rtl .result-report-wrapper .result-left {display: block; float: none; width: 100%; margin: 0 auto; text-align: center; clear:both;}
    .result-report-wrapper .result-right {display: block; float: none; width: 100%; margin: 0 auto; text-align: center; clear:both;}
        .rtl .result-report-wrapper .result-right {display: block; float: none; width: 100%; margin: 0 auto; text-align: center; clear:both;}
    .result-view-toggle {display: none; width: 60px; margin: 0 auto; text-align: center;}
    .result-info .results-per-page {float: none;}
        .rtl .result-info .results-per-page {float: none;}
    
    /* TOGGLE BOXES */
    .filter-pair {display: none;}
    .left-column p.box-title.active ~ .filter-pair {display: block;}
    p.main-box-title.active ~ .filter-pair {display: block;}
    .left-column .filter-clear-all {display: none;}
    .left-column p.box-title.active ~ .filter-clear-all {display: block;}
    p.main-box-title.active ~ .filter-clear-all {display: block;}
}

/* Extra Small Devices - portrait phones */
@media screen and (max-width: 575px) {
    /* BANNER */
    .content-banner .content-banner__content {width: auto; margin: 15px 0 0;}
    .content-banner .content-banner__content h1 {font-size: 30px; text-align: center;}
    .content-banner .content-banner__content p {font-size: 20px; line-height: 1.4; text-align: center;}
    .content-banner .custom-button {top: 20px; left: 0; right: 0; width: auto; height: 45px; margin: 0 auto;}
    .content-banner .custom-button a {padding: 12px 15px; font-size: 16px;}
    .content-banner .content-banner__imagery img {display: none;}

    /* RIGHT COLUMN */
    .content-column .right-column {width: 100%;}

    /* ARTICLE RESULTS - LIST */
    .results__container__list .result .result__image {display: block; float: none; width: auto; height: auto; margin: 0 auto; padding: 10px; background: #fff; border: 0; overflow: hidden; box-sizing: border-box;}
        .rtl .results__container__list .result .result__image {display: block; float: none; width: auto; height: auto; margin: 0 auto; padding: 10px; background: #fff; border: 0; overflow: hidden; box-sizing: border-box;}
    .results__container__list .result .result__image img {display: block; max-width: 100%; max-height: 100%; margin: 0 auto; padding: 0;}
    .video-result-container .video-result .video-image {float: none; margin: 0 auto;}
        .rtl .video-result-container .video-result .video-image {float: none; margin: 0 auto;}
    .result-list .result .searchResultImg, .video-result-container .video-result .video-image {display: block; float: none; margin: 0 auto; padding: 10px;}
        .rtl .result-list .result .searchResultImg, .video-result-container .video-result .video-image {display: block; float: none; margin: 0 auto; padding: 10px;}
    .result-list .result img.searchResultImg, .video-result-container .video-result .video-image img {margin: 10px auto;}

    /* RESULTS */
    .video-result-container .video-result .video-image img {float: none;}
}

/* For Smaller Devices */
@media screen and (max-width: 376px) {}

/* Print Styles */
@media print {}