@keyframes sortingHatFadeIn{from{opacity:0;transform:translateY(30px)}
to{opacity:1;transform:translateY(0)}
}
@-webkit-keyframes sortingHatFadeIn{from{opacity:0;transform:translateY(30px)}
to{opacity:1;transform:translateY(0)}
}
@keyframes sortingHatTitleFadeIn{from{opacity:0;transform:translateY(30px)}
to{opacity:1;transform:translateY(0)}
}
@-webkit-keyframes sortingHatTitleFadeIn{from{opacity:0;transform:translateY(30px)}
to{opacity:1;transform:translateY(0)}
}
.sorting-hat{background-color:#fff}
.sorting-hat .hide-products,.sorting-hat .hide-show-more{display:none}
.sorting-hat .sorting-hat__headline-left{color:#fff;border-top:2px solid #fff;margin-top:42px;padding-top:19px;margin-bottom:30px}
.sorting-hat .sorting-hat__headline-left .headline-text{-webkit-animation:sortingHatTitleFadeIn .3s ease-in both;animation:sortingHatTitleFadeIn .3s ease-in both;margin-bottom:0}
.sorting-hat .sorting-hat__headline-left .headline-text.animate{-webkit-animation:sortingHatFadeIn .3s ease-in both;animation:sortingHatFadeIn .3s ease-in both}
.sorting-hat .sorting-hat-plus{height:12px;width:12px;fill:#007abc}
.sorting-hat .sorting-hat_item__active:focus{outline-color:#0061a0;outline-offset:-2px;outline-style:solid;outline-width:2px}
.sorting-hat .sorting-hat__itemtitle{color:#000;text-decoration:none;font-weight:500;cursor:pointer;padding:17px 20px 17px 15px;box-shadow:0 2px 8px 0 rgba(0,0,0,0.05);border:solid 1px #f2f2f2;background-color:#fff;-webkit-animation:sortingHatFadeIn .3s ease-in both;animation:sortingHatFadeIn .3s ease-in both;display:flex;font-size:16px;line-height:20px}
.sorting-hat .sorting-hat__itemlink{display:flex;align-items:center}
.sorting-hat .sorting-hat__itemtitle:hover,.sorting-hat .keyboard-active .sorting-hat__itemtitle:focus{color:#fff;background-color:#0061a0;background-image:linear-gradient(to bottom,rgba(0,0,0,0.1),rgba(0,0,0,0.1)),linear-gradient(65deg,rgba(0,0,0,0.9),rgba(0,0,0,0))}
.sorting-hat .sorting-hat__itemtitle:hover .sorting-hat__itemlink svg,.sorting-hat .keyboard-active .sorting-hat__itemtitle:focus .sorting-hat__itemlink svg{fill:#fff}
.sorting-hat .showmore-link{color:#007abc;margin-top:30px;text-decoration:none;cursor:pointer}
.sorting-hat .showmore-link:hover,.sorting-hat .showmore-link:focus{text-decoration:underline}
.sorting-hat .sorting-hat-menu-option:nth-of-type(n+2){margin-top:10px}
.sorting-hat .sorting-hat__itemtitle a:focus,.sorting-hat .sorting-hat__itemtitle a:hover,.sorting-hat .show-more__section a:focus,.sorting-hat .show-more__section a:hover{text-decoration:none}
.sorting-hat .sorting-hat__left-container{position:relative}
.sorting-hat .sorting-hat__itemlink svg{width:24px;height:24px;margin-right:12px;flex-shrink:0;fill:#007abc}
.sorting-hat .sorting-hat__right-section{margin-top:20px}
.sorting-hat .sorting-hat__right-section .sorting-hat-menu-option:nth-child(n+5){display:none}
.sorting-hat .sorting-hat__right-section.show-more-products .sorting-hat-menu-option:nth-child(n+5){display:block}
.sorting-hat .sorting-hat__headline-left-backButton{width:40px;height:40px;border:1px solid #007abc;border-radius:100%;display:flex;align-items:center;justify-content:center;margin-top:30px;cursor:pointer;-webkit-animation:sortingHatFadeIn .3s ease-in both;animation:sortingHatFadeIn .3s ease-in both;margin-left:15px}
.sorting-hat .sorting-hat__headline-left-backButton .icon-chevron-left{height:10px;width:10px;color:#007abc;fill:#007abc}
.sorting-hat .sortinghat-border-top,.sorting-hat .sortinghat-border-bottom{display:none}
@media screen and (max-width:1023px){.sorting-hat .sorting-hat__headline-left-backButton.desktop{display:none}
}
@media screen and (max-width:768px){.sorting-hat .sorting-hat__left-container{background-image:url('https://www.metlife.com/static/images/sorting-hat/sortinghat-mobile.svg')}
}
@media screen and (max-width:1023px){.sorting-hat .sorting-hat__left-container{background-image:url('https://www.metlife.com/static/images/sorting-hat/sortinghat-tablet.svg');background-color:#333;background-repeat:no-repeat;background-size:cover}
}
@media screen and (min-width:768px){.sorting-hat .sorting-hat__headline-left{border-top:3px solid #fff;margin-top:40px;padding-top:20px;margin-bottom:40px}
.sorting-hat .sorting-hat__headline-left-backButton:focus{outline-color:#0061a0;outline-offset:2px;outline-style:solid;outline-width:2px}
.sorting-hat .sorting-hat__right-section{margin-top:30px}
.sorting-hat .sorting-hat__right-section .sorting-hat-menu-option:nth-child(n+5){display:block}
.sorting-hat .sorting-hat__right-section .sorting-hat-menu-option:nth-child(n+7){display:none}
.sorting-hat .sorting-hat__right-section.show-more-products .sorting-hat-menu-option:nth-child(n+7){display:block}
.sorting-hat .sorting-hat-menu-option:nth-of-type(n+2){margin-top:0}
.sorting-hat .sorting-hat-menu-option:nth-of-type(n+3){margin-top:10px}
}
@media screen and (min-width:1024px){.sorting-hat .sorting-hat__headline-left-backButton:focus{outline-color:white;outline-offset:2px;outline-style:solid;outline-width:2px}
.sorting-hat .sorting-hat__right-container{margin-top:105px;margin-bottom:105px}
.sorting-hat .sorting-hat__right-section{margin-top:0}
.sorting-hat .showmore-link{margin-top:40px}
.sorting-hat .sorting-hat__headline-left-backButton{width:60px;height:60px;border:1px solid #fff;margin-top:40px}
.sorting-hat .sorting-hat__headline-left-backButton .icon-chevron-left{height:15px;width:15px;color:#fff;fill:#fff}
.sorting-hat .sorting-hat__left-container{background-image:none;min-height:400px}
.sorting-hat .sorting-hat__left-container--image{background-image:url('https://www.metlife.com/static/images/sorting-hat/sortinghat-desktop.svg');position:absolute;background-color:#333;top:0;bottom:0;left:15px;right:15px;background-repeat:no-repeat;background-size:cover}
.sorting-hat .sorting-hat__headline-left{border-top:0;margin-left:21.25%;padding-right:15px;margin-top:105px;padding-top:0;margin-bottom:105px}
.sorting-hat .sortinghat-desktop-bordertop,.sorting-hat .sortinghat-desktop-borderbottom{border:1px solid;border-image-slice:1;border-image-source:linear-gradient(to left,#a2cf42 calc(10%),#008edd calc(59.66%),#fff calc(61.66%));position:relative;z-index:1}
.sorting-hat .sortinghat-desktop-bordertop{border-width:0 0 4px 0;top:60px}
.sorting-hat .sortinghat-desktop-borderbottom{border-width:0 0 1px 0;bottom:60px}
.sorting-hat .sortinghat-border-top,.sorting-hat .sortinghat-border-bottom{height:0;display:block}
.sorting-hat .sortinghat-border-top{margin-bottom:-1px}
.sorting-hat .sortinghat-border-bottom{margin-top:-1px}
}