/******************* soulmates 3 *******************/

#last_calc{ padding: 10px 35px 20px;}
#last_calc .last_calc_sum{ padding: 20px;}
#last_calc .button-wrapper{ font-size: 16px; display: flex;}
#last_calc .button-wrapper button.fromLeft{ display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0);
                                                        box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color;  -webkit-transition-duration: 0.3s;
                                                        transition-duration: 0.3s; border: 1px solid #FFFFFF;}
#last_calc .button-wrapper button.fromLeft::after{ content: ''; display: block;  width: 0; height: 4px;  background: #447cad; transition: width .3s; bottom: 0px; position: fixed; left: 0px; }
#last_calc .button-wrapper button.fromLeft:hover::after{ content: ''; display: block;  width: 100%; height: 4px;  background: #447cad; transition: width .3s; }
#last_calc .button-wrapper #smfilter{ border: 1px solid #e2e2e2;}
#last_calc .button-wrapper a{ margin-left: auto;}
#last_calc .button-wrapper button.fa-yel::after{background: #FDCC1A;}
#last_calc .button-wrapper button.fa-yel:hover::after{background: #FDCC1A;}
#last_calc .button-wrapper #recalc{ display: none; padding-top: 3px; margin-left: 5px; border: 1px solid #e2e2e2;}
#last_calc .button-wrapper #smsrec span i{ color: #FFFFFF;}

.filter-wrapper{ padding: 20px 35px; display: none;}
.filter-wrapper #smfilterform .dropdown.bootstrap-select .btn.dropdown-toggle{ border-radius: 0px;}
.filter-wrapper #smfilterform .select-wrapper{ display: flex;}
.filter-wrapper #smfilterform .select-wrapper .right-wrapper .bootstrap-select{ float: right;}
.filter-wrapper #smfilterform .select-wrapper label{ font-size: 12px; margin-bottom: 8px;}
.filter-wrapper #smfilterform .select-wrapper .right-wrapper label{ margin-left: 55px;}
.filter-wrapper #smfilterform .select-wrapper .dropdown button{ border: 1px solid #333;}
.filter-wrapper #smfilterform .select-wrapper .geoz-wrapper{ display: none; position: absolute; right: 73px; top: 160px;}
.filter-wrapper #smfilterform .select-wrapper select[name="geo"]{ text-align: right;}

.filter-wrapper #smfilterform .field-wrapper{ margin-top: 20px; display: flex; align-items: center; position: relative;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper{ width: 350px;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper label{ font-size: 12px; margin-bottom: 10px;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper label i{ margin-left: 5px;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper .slider{ width: 100%;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper .slider .slider-tick{ background: #447cad;}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper .slider .slider-tick.round{ opacity: .0}
.filter-wrapper #smfilterform .field-wrapper .slider-wrapper .slider .slider-selection{ background: #447cad; opacity: .7;}
.filter-wrapper #smfilterform .field-wrapper .sub-text-slider{position: absolute; color: #999999; font-size: 14px; width: 400px; display: flex; justify-content: space-between; top: 70px;}
.filter-wrapper #smfilterform .field-wrapper .sub-text-slider small{ font-size: 12px;}

.filter-wrapper #smfilterform .field-wrapper .button-wrapper{ margin-left: auto; margin-top: 50px;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button { background: #fff; border: 1px solid #333; border-radius: 3px; cursor: pointer; padding: 0px; }
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button span{ display: block; padding: 7px 5px 5px 5px;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button.fromLeft { display: inline-block; margin-right: 5px;vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0);
                                                        box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color;  -webkit-transition-duration: 0.3s;
                                                        transition-duration: 0.3s; border: 1px solid #e2e2e2;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button.fromLeft::after{ content: ''; display: block;  width: 0; height: 4px;  background: #FDCC1A; transition: width .3s; }
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button.fromLeft:hover::after{ content: ''; display: block;  width: 100%; height: 4px;  background: #FDCC1A; transition: width .3s;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button.sub-btn{ background: #447cad; color: #FFFFFF; margin-right: 0px;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper button#smclose.fromLeft::after{ background: #447cad;}
.filter-wrapper #smfilterform .field-wrapper .button-wrapper .sub-btn.btn-primary i{ color: #FFFFFF;}

.sm-header{ display: flex; justify-content: space-between; border: 1px solid #e2e2e2; padding: 10px 5px; border-radius: 6px; color: #777; margin: 0px 35px;}
.sm-header .sm-name{ margin-left: 10px;}
.sm-header .sm-affinity{ margin-left: 115px;}

#smcontainer{ margin: 10px 35px; }
#smcontainer .soulmate-wrapper{ position: relative;}
#smcontainer .soulmate-wrapper a{ display: flex; align-items: center; padding: 10px 0px; justify-content: space-between; width: 100%; border-bottom: 2px solid #e2e2e2;}
#smcontainer .soulmate-wrapper a:hover{ border-color: #447cad;}
#smcontainer .soulmate-wrapper a .sm-name{ margin-left: 10px; width: 300px; font-size: 16px; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#smcontainer .soulmate-wrapper a .sm-matches{ color: #333; margin-left: auto;}
#smcontainer .soulmate-wrapper a .sm-matches strong{  margin-right: 3px; font-size: 16px;}
#smcontainer .soulmate-wrapper a .sm-matches .total{  margin-left: 3px; color: #999;}
#smcontainer .soulmate-wrapper a .affinity{ color: #333; font-weight: bold; font-size: 18px;}
#smcontainer .soulmate-wrapper a .percent{ width: 200px; margin-left: 10px;}
#smcontainer .soulmate-wrapper-empty{ margin: 60px 0px;}
#smcontainer .not-enough-movies{ margin: 20px 0px; text-align: center;}

#smcontainer .recs-title{margin-top: 15px; font-size: 16px;}
#smcontainer #scroll-recs{ max-width: 750px; width: 100%; display: inline-flex; overflow: hidden; justify-content: flex-start; align-items: center; padding: 20px 0px 30px 10px;}
#smcontainer #scroll-recs .mc-oposter img{ height: unset; width: 100px; aspect-ratio: 3/4.4; border-radius: 6px; box-shadow: 2px 3px 4px #BBBBBB;}

#smfilterform .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn){ width: 350px;}
#smfilterform .dropdown-menu > .inner.show{ overflow: hidden;}
#smfilterform .dropdown-menu.inner.show{width: 100%;}
#smfilterform .bootstrap-select .dropdown-menu li a:hover{ background: #FDCC1A; color: #333;}

.hidden-template{display: none;}

.resume-wrapper{ margin: 0px 35px; position: relative;}
.resume-wrapper .profile-resume{ display: flex; padding: 10px 0px; border-radius: 6px; color: #777; margin: 0px 5px; align-items: center; justify-content: center; }
.resume-wrapper .profile-resume .user-icon{ width: 30px; height: 30px; line-height: 30px; background: #447cad; border-radius: 20px; text-align: center;}
.resume-wrapper .profile-resume .user-icon i{ font-size: 22px; color: #FFFFFF;}
.resume-wrapper .profile-resume .user-data{ display: inline-block; vertical-align: middle; margin-left: 10px; font-size: 16px;}
.resume-wrapper .profile-resume .user-data .user-nick{ font-weight: bold; text-align: left;}
.resume-wrapper .profile-resume .user-data .user-ratings{ margin-left: 5px;}
.resume-wrapper .profile-resume .user-data .user-ratings i { margin-right: 10px;}
.resume-wrapper .profile-resume .user-data i{ font-size: 6px; color: #D2D2D2; vertical-align: middle;}
.resume-wrapper .resume-lc{ position: absolute; top: 10px; left: 0px;}
.resume-wrapper .resume-lc .res-icon{ display: flex; align-items: center;}
.resume-wrapper .resume-lc .res-icon small{ font-size: 12px;}
.resume-wrapper .resume-lc .res-icon i{ margin-left: 3px;}


/*************  topgenfilter **********************/

.z-top-movies .fframe{ background: #FFF !important; border: 0px; position: relative; padding: 20px 30px; margin: 30px 0; position: absolute; top: 0px; border: 0px; background: #EDEBEC; position: relative; padding: 10px; margin: 30px 0 0 0;}
.z-top-movies .fframe .form-wrapper{ display: none;}
.z-top-movies .fframe .form-wrapper #filter_top{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center;
                        align-items: center; }
.z-top-movies .fframe .form-wrapper #filter_top .flags{ -webkit-box-flex: 1; -ms-flex: 1 0 32%; flex: 1 0 32%; padding: 0 15px 30px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-type-combo{ padding: 0 0px 30px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-type-combo .dropdown-menu li{ padding: 0px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-type-combo .dropdown-menu li a{ padding: 10px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider{ -webkit-box-flex: 1; -ms-flex: 1 0 30%; flex: 1 0 30%; padding: 0 0px 30px 10px; z-index: 1;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider.year-wrapper{padding: 0 0px 30px 0px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider.year-wrapper .dropdown.bootstrap-select{ border: 1px solid #333333}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider.year-wrapper .dropdown.bootstrap-select:first-child{ margin-right: 25px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider-sublabel{ display: flex;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider-sublabel span:first-child{ margin-left: -15px}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider-sublabel .d-last{ margin-left: auto; margin-right: 10px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider{ text-align: center; margin: 0 auto; width: 90%}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider .slider-tick{ background: #447cad;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .slider .slider-tick.round{ opacity: .0}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider #slideryear .slider-track .slider-selection{ background: #447cad; opacity: .7;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider #sliderratings .slider-track .slider-selection{ background: none; opacity: .7;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider #sliderruntime .slider-track .slider-selection{ background: #447cad; opacity: .7;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider .bs-tooltip-top .tooltip-inner{ left: 0px !important;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider #sliderruntime{ width: 95%}

.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .tooltip{ margin-top: -34px; font-size: 10px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .tooltip .arrow::before{ border: 0px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags-slider .tooltip .tooltip-inner{ background: #F8F9FA; border: 1px solid #333333; color: #555555;}

.z-top-movies .fframe .form-wrapper .slider.slider-horizontal{ margin-bottom: 16px !important;}
.z-top-movies .fframe .form-wrapper  #slideryear{margin-bottom: 0px !important;}
.z-top-movies .fframe .form-wrapper #sliderratings .slider-tick-label-container .slider-tick-label{ }

.z-top-movies .fframe .form-wrapper .platforms-wrapper .subheader{ padding-bottom: 10px; margin-left: 10px;}
.z-top-movies .fframe .form-wrapper .platforms-wrapper .subheader .in-block{ display: inline-block; margin-left: 10px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .nav.nav-tabs{ margin-top: 0px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container{ height: 70px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs{ border-bottom: 0px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs li{ position: relative; width: 50px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs li a{ margin-right: 3px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs li a img{ height: 40px; opacity: .3;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs li a:hover img{ opacity: 1;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs .selected img{ opacity: 1; height: 44px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs .selected a i{position: absolute; bottom: -20px; left: 15px;}
.z-top-movies .fframe .form-wrapper .scrtabs-tab-container .scrtabs-tabs-fixed-container .nav.nav-tabs li:not(.selected) a i{display: none}


.z-top-movies .fframe .form-wrapper #filter_top .flags .bootstrap-select, .fframe .form-wrapper form .flags .dropdown{ border: 1px solid #333333}
.z-top-movies .fframe .form-wrapper #filter_top .flags.flags-content{ flex: 4 0 50%; -ms-flex: 4 0 50%; text-align: right; padding: 0px 0px 30px;}
.z-top-movies .fframe .form-wrapper #filter_top .btn-group .fa-btn-checkbox{ padding-right: 20px; font-size: 12px; white-space: nowrap;}
.z-top-movies .fframe .form-wrapper #filter_top .btn-group .btn-check:checked + .btn-outline-primary{ color: #FFF;}
.z-top-movies .fframe .form-wrapper #filter_top .btn-group-toggle.group .fa-btn-checkbox.active span{ margin-right: 0px;}
.z-top-movies .fframe .form-wrapper #filter_top .btn-group-toggle.group .fa-btn-checkbox.active span::after{ font-family: "Font Awesome 5 Pro"; font-weight: 900; content: "\f00c"; font-weight: 100; position: absolute; top: 5px; right: 3px;}

.z-top-movies .fframe .form-wrapper #filter_top .btn-group .btn-check:checked + .btn-outline-primary span::after{ font-family: "Font Awesome 5 Pro"; font-weight: 900; content: "\f00c"; font-weight: 100; position: absolute; top: 5px; right: 3px;}


.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo{ flex: 1 0 29%; -webkit-box-flex: 1; -ms-flex: 1 0 29%;  padding: 0 0 30px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo .bootstrap-select.platforms{ }
.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo .bootstrap-select.platforms button{ height: 36px; padding: 2px 10px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo .bootstrap-select.platforms .dropdown-menu li a span.text img{ height: 30px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo .dropdown button .filter-option{ display: flex; align-items: center;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.platform-combo .bootstrap-select .dropdown-toggle .filter-option-inner-inner img{ height: 30px;}

.z-top-movies .fframe .form-wrapper #filter_top .flags.country-combo{ padding-left: 35px; padding-right: 0px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.country-combo .dropdown-item{ padding: 10px; }
.z-top-movies .fframe .form-wrapper #filter_top .flags.country-combo .nflag{ margin-right: 7px; height: 20px; width: 26px;}
.z-top-movies .fframe .form-wrapper #filter_top .flags.country-combo .rgn-wrapper{ margin-right: 7px; }
.z-top-movies .fframe .form-wrapper #filter_top .flags.country-combo .rgn-wrapper img{ height: 20px; width: 26px;}

.z-top-movies .fframe .form-wrapper #filter_top .platforms-wrapper{ display: none;}
.z-top-movies .fframe .form-wrapper #filter_top .platforms-wrapper .scrtabs-tab-scroll-arrow{ border-top: 1px solid #dddddd; text-align: center;}

.z-top-movies .fframe .form-wrapper .btns-wrapper{ flex: 1 0 100%; display: flex; justify-content: flex-end; margin-top: 10px;}
.z-top-movies .fframe .form-wrapper .btns-wrapper .reset-filter{ margin-right: 15px;}

.z-top-movies #filter_top .dropdown-menu {overflow-x: hidden; border: 1px solid #333333;}
.z-top-movies #filter_top .dropdown-toggle {position: relative; text-align: left; border-radius: 0px;}
.z-top-movies #filter_top .bootstrap-select .dropdown-toggle:focus{ outline: 0px !important;}
.z-top-movies #filter_top .dropdown-toggle::after {position: absolute; right: 10px; top: 50%;}
.z-top-movies #filter_top .dropdown-toggle.empty {color: #999;}
.z-top-movies #filter_top .genre-combo .dropdown-toggle {overflow: hidden; width: 230px; white-space: nowrap; text-overflow: ellipsis;}
.z-top-movies #filter_top .genre-combo .dropdown-toggle p {display: inline; margin: 0: padding: 0;}
.z-top-movies #filter_top .genre-combo .box {display: grid; grid-template-columns: auto auto auto; gap: 15px 15px; padding: 15px;}
.z-top-movies #filter_top .genre-combo .box .genres-legend {grid-row: 1; grid-column: 1 / span 3; margin-bottom: 15px; font-size: 13px;}
.z-top-movies #filter_top .genre-combo .box .genres-legend span {font-weight: bold;}
.z-top-movies #filter_top .genre-combo .box .genres-legend p {margin: 0; padding: 0;}
.z-top-movies #filter_top .genre-combo .box .genres-legend p:nth-child(2) {margin-top: 10px;}
.z-top-movies #filter_top .genre-combo .dropdown-item {display: grid; grid-template-columns: 30px 50px 50px 30px; padding: 0;}
.z-top-movies #filter_top .genre-combo .dropdown-item:hover {background: none;}
.z-top-movies #filter_top .genre-combo .dropdown-item:active {background: none;}
.z-top-movies #filter_top .genre-combo .dropdown-item .close-combo {grid-column: 2 / span 3; margin-left: 7px;}
.z-top-movies #filter_top .genre-combo .dropdown-item .text {grid-column: 2 / span 2; font-size: 13px;  align-self: stretch;}
.z-top-movies #filter_top .genre-combo .dropdown-item .text:hover {background: initial; color: initial;}
.z-top-movies #filter_top .genre-combo .dropdown-item .text:active {background: initial; color: initial;}
.z-top-movies #filter_top .genre-combo .dropdown-item .text.include{ color: #008000; border-bottom: 2px solid #008000}
.z-top-movies #filter_top .genre-combo .dropdown-item .text.exclude{ color: #FF0000; border-bottom: 2px solid #FF0000}
.z-top-movies #filter_top .genre-combo .dropdown-item .btn {padding: 2px;}
.z-top-movies #filter_top .genre-combo .dropdown-item .btn.active{ background: #008000;}
.z-top-movies #filter_top .genre-combo .dropdown-item .btn.exclude + .btn.active{ background: #FF0000;}
.z-top-movies #filter_top .genre-combo .dropdown-item .reset-combo {grid-column: 2 / span 5; margin-right: 7px; padding: 0px 10px;}
.z-top-movies #filter_top .genre-combo .dropdown-toggle {padding-right: 30px;}
.z-top-movies #filter_top .genre-combo .dropdown-item.btn-group.btn-group-toggle.disabled .btn-outline-secondary{ border: 1px solid #e2e2e2; color: #e2e2e2; }
.z-top-movies #filter_top .bootstrap-select.platforms{ width: 300px !important;}
.z-top-movies #filter_top .platform-combo .filter-option-inner-inner span {display: none;}

.z-top-movies #filter_top .fa-btn-secondary{ border: 1px solid #333}
.z-top-movies #filter_top .fa-btn-secondary:hover{ color: #333 !important;}


.z-top-movies #top-movies .popover {max-width: none !important;}
.z-top-movies #top-movies .popover-body {padding: 0;}
.z-top-movies #top-movies .popover-body .vod-wrapper .title {padding: 10px; background: #EEE; }
.z-top-movies #top-movies .popover-body .vod-wrapper .fa-btn-upd{display: none;}
.z-top-movies #top-movies .popover-body .vod-wrapper .body {padding: 10px; display: grid; grid-auto-flow: column; grid-template-rows: repeat(2, auto); column-gap: 15px;}
.z-top-movies #top-movies .popover-body .vod-wrapper .sub-title {margin: 0 0 5px 0; text-align: center;}
.z-top-movies #top-movies .popover-body .vod-wrapper .prov-offers-wrapper {max-width: 85px; display: block; margin: 0px;}
.z-top-movies #top-movies .popover-body .vod-wrapper .prov-offers-wrapper > a {display: inline-block; margin: 5px;}
.z-top-movies #top-movies .popover-body .vod-wrapper .prov-offers-wrapper > a img{ height: 30px;}
.z-top-movies #top-movies .popover-body .vod-wrapper .justwatch-logo {margin-right: 10px; text-align: right;}
.z-top-movies #top-movies .popover-body .vod-wrapper .justwatch-logo img{ height: 10px;}
.z-top-movies #top-movies .providers {display: flex; float: right; border: 1px solid #CCC; border-radius: 3px; padding: 5px; position: relative; cursor: pointer;}
.z-top-movies #top-movies .providers:hover {box-shadow: 1px 5px 5px #E2E2E2; background-color: #EEE;}
.z-top-movies #top-movies .provider-icons img {box-shadow: 1px 5px 5px #E2E2E2; margin: 0 3px; height: 30px;}
.z-top-movies #top-movies .tv-icon {font-size: 25px; background: #EEE; margin: -5px; padding: 5px;}
.z-top-movies #top-movies .no-movies { text-align: center; margin: 0px 10px; padding: 15px; border: 1px solid #e2e2e2; width: 100%;}

.z-top-movies .dropdown-menu{ padding: 0px;}
.z-top-movies .dropdown-menu .dropdown-item{ padding: 5px;}

.z-top-movies .resume-wrapper{ padding: 10px; border: 1px solid #999999; border-radius: 6px; margin: 10px;}
.z-top-movies .resume-wrapper .sublabel{ margin-right: 3px;}

.z-top-movies .orderandchv-wrapper{ position: relative; text-align: center; padding: 10px 10px 20px 10px;}
.z-top-movies .orderandchv-wrapper .chv-wrapper-primary{ position: absolute; right: -3px; top: -20px;}
.z-top-movies .orderandchv-wrapper > a{ padding: 10px; border: 1px solid #e2e2e2; border-radius: 6px; font-size: 12px;}
.z-top-movies .orderandchv-wrapper > a:hover{ background: #447cad; color: #FFFFFF;}

.z-top-movies .bottom-btn-wrapper{ display: flex; padding: 10px; margin: 30px 0 0 15px; justify-content: space-between;}
.z-top-movies ul#top-movies{ background: #FFF;}
.z-top-movies ul#top-movies .adver{ margin: 10px auto; text-align: center;}

.z-top-movies > .fframe .legend {}
.z-top-movies > .fframe .legend .hidden-texts {display: none;}

/******************** smsrec *****************************/

#country-menu, #genre-menu{ height: 500px; overflow-y: scroll}
#country-menu .ui-menu-item{ font-size: 16px; }
#country-menu .ui-menu-item .ui-icon{ width: 30px;; }
#country-menu .ui-menu-item .ui-menu-item-wrapper{ padding-left: 40px; }

#mt-content-cell .main-sms-rec-wrapper{ }
#mt-content-cell .z-smsrec .ff-hidden{ width: 800px; height: 400px; background: #FFF; position: relative; border: 1px solid #f2f2f2; margin-top: 30px;}
#mt-content-cell .z-smsrec .ff-hidden .skeleton{ height: 380px; position: absolute; top: 0px;}
#mt-content-cell .z-smsrec .sub-ex{ display: none;}
#mt-content-cell .z-smsrec > .fframe{ display: none; background: #FFF; padding: 5px; margin-top: 10px; height: 380px; width: 800px; font-size: 16px; background-color: #FFF; margin-bottom: 0px;}
#mt-content-cell .z-smsrec > .fframe .tab-form{ display: none;}
#mt-content-cell .z-smsrec > .fframe #smsform{ padding: 10px;}
#mt-content-cell .z-smsrec > .fframe #smsform .bootstrap-select{ border: 1px solid #333333}
#mt-content-cell .z-smsrec > .fframe #smsform .bootstrap-select{ width: 350px !important;}

#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper{ display: flex; align-items: center; margin-bottom: 15px; padding: 0 15px 30px; justify-content: flex-end;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper{ width: 50%; }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper label{ display: block; font-size: 12px; }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper.t-c{ text-align: right; padding-right: 20px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .gosoul{ color: #447CAD; border-color: #447cad;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .gosoul i{ color: #447CAD; }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .gosoul:hover{ background-color: #447cad; color: #FFFFFF;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .gosoul:hover i{ color: #FFFFFF;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .bootstrap-select .dropdown-menu .dropdown-item{ padding: 10px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper .option-wrapper .bootstrap-select .dropdown-menu .dropdown-item .nflag{ margin-right: 7px; height: 20px; width: 26px;}

#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2{ display: flex; justify-content: space-between; margin-bottom: 15px; padding: 0 15px 30px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper{ width: 50%; }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper label{ display: block; font-size: 12px; }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .no-s{ font-weight: normal;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .d-in{ display: inline-flex; margin-right: 25px; margin-top: 10px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper{ }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper > label{ margin-bottom: 15px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider{ text-align: center; margin: 0 auto; width: 90%}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider .slider-tick{ background: #447cad;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider .slider-tick.round{ opacity: .0}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider .slider-track .slider-selection{ background: #447cad; opacity: .7;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider-sublabel{ display: flex; font-size: 12px; margin-top: 5px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider-sublabel span:first-child{ }
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .year-slider-wrapper .slider-sublabel .d-last{ margin-left: auto; margin-right: 30px;}
#mt-content-cell .z-smsrec > .fframe #smsform .options-wrapper-2 .option-wrapper .filter-option .nflag{ margin-right: 7px; height: 20px; width: 26px;}
#mt-content-cell .z-smsrec > .fframe .ex-bt{ font-size: 12px; margin: 0px 45px 0px 25px}

#mt-content-cell .z-smsrec .no-rec-yet{}
#mt-content-cell .z-smsrec .no-rec-yet .wtext{ text-align: center; padding: 15px; border: 1px solid #e2e2e2; margin: 10px 60px 30px 30px; display: block;}
.hidden-template{ display: none; }

#mt-content-cell .z-smsrec .main-sms-rec-wrapper .sms-rec-movie-wrapper.fa-3x{ text-align: center; margin: 0 auto; display: block;}
#mt-content-cell .z-smsrec .main-sms-rec-wrapper .sms-rec-movie-wrapper.hidden{ display: none;}


/************* rankings ***********************/

.tabs-wrapper-overflow{visibility: hidden; height: 50px;}

.all-rankings .rankings-list {display: inline-block; width: 99%; padding: 0px; margin: 0px;}
.all-rankings .rankings-list > li {display: flex; margin: 5px; box-shadow: 0 1px 5px #CCCCCC; background: #FFF; padding: 5px;}
.all-rankings .rankings-list > li > a {display: block;}
.all-rankings .movies {display: inline-block; vertical-align: top; padding-left: 0px;}
.all-rankings .movies > li {display: inline-block; vertical-align: top; position: relative;}
.all-rankings .movies img {border: 1px solid #FFF; border-radius: 6px;}
.all-rankings .info {display: inline-block; margin-left: 15px; width: 500px;}
.all-rankings .info .title {font-size: 16px; margin: 5px 0 15px 0;}
.all-rankings .info .desc{font-size: 12px; color: #777777;}

.all-rankings .nav-tabs{ border-bottom: 1px solid #4682B4; }
.all-rankings .nav-tabs > li > a{ position: relative; display: block; padding: 10px 15px; border-bottom: 3px solid transparent;}
.all-rankings .nav-tabs > li > a:hover{ border-bottom: 3px solid #4682B4; }
.all-rankings .nav-tabs > li.active a{ border-bottom: 3px solid #4682B4;}
.all-rankings .scrtabs-tab-scroll-arrow{ border: 0px}

.z-top-movies.ranking {margin: 5px;}
.z-top-movies.ranking .ranking-desc { padding: 10px; border: 1px solid #999999; border-radius: 6px; margin: 10px 10px 10px 0px;}
.z-top-movies.ranking .gobtr{ margin-top: 10px; float: left; border-radius: 6px; display: inline-block; padding: 8px; border: 1px solid #447CAD; background-color: #ffffff; color: #326E9C; display: flex; align-items: center; justify-content: center;}
.z-top-movies.ranking .gobtr i{ margin-right: 3px;}
.z-top-movies.ranking .gobtr:hover{ background: #447cad; color: #ffffff;}
.z-top-movies .show-more {margin: 15px auto; width: 100px; text-align: center; color: #447CAD; border-radius: 6px; cursor: pointer; border: 1px solid #FFFFFF;}
.z-top-movies .show-more i { font-size: 36px;}
.z-top-movies .show-more:hover{ border: 1px solid #447cad;}
.z-top-movies .show-more .fa-spin {display: none;}


/*************** buttons *********************/

.btn.fromLeft{ display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0);
                                                        box-shadow: 0 0 1px rgba(0, 0, 0, 0); position: relative; -webkit-transition-property: color; transition-property: color;  -webkit-transition-duration: 0.3s;
                                                        transition-duration: 0.3s; }
.btn.fromLeft::after{ content: ''; display: block;  width: 0; height: 4px;  background: #447CAD; transition: width .3s; bottom: 0px; position: fixed; left: 0px; }
.btn.fromLeft:hover::after{ content: ''; display: block;  width: 100%; height: 4px;  background: #447CAD; transition: width .3s; }
.btn.fa-yel::after{background: #FDCC1A;}
.btn.fa-yel:hover::after{background: #FDCC1A;}


/**************** modals **********************/

.sm-modal-bg{ height: 100%; overflow: hidden; position: absolute; top: 0; width: 100%; background: #e2e2e2; opacity: .6; z-index: 1000;}
.sm-modal-bg.closed{ display: none; }
.sm-loading-wrapper{ width: 600px; max-width: 100%; height: 200px; border-radius: 20px; max-height: 100%;position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: white; box-shadow: 0 0 60px 10px rgba(0, 0, 0, 0.9);
                    display: flex; justify-content: center; align-items: center; z-index: 1001; }
.sm-loading-wrapper .sm-load-text{font-size: 30px; color: #777; margin-right: 20px;}
.sm-loading-wrapper .fa-3x i{font-size: 50px; color: #447cad;}
.sm-loading-wrapper.closed { display: none; }
.sm-loading-wrapper .fa-3x{}