@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;700&family=Montserrat:wght@600&display=swap'); html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } body { font-family: 'Fira Sans', Arial; font-size: 12px; margin: 0; padding: 0; color: #cbcbcb; background-color: #181818; transition: background-color 0.1s; } a { color: white; text-decoration: none; } table { border-collapse: collapse; border-spacing: 0; } strong { font-weight: bold; } i { font-style: italic; } /* Slanted title, old and new version */ .tiled_bg { background: url('/img/new/bg_tile.png') 0 0 #000; } .slanted_box, .slanted_box_right { font-family: 'Montserrat', Arial; font-size: 28px; font-weight: bold; position: relative; display: inline-flex; align-items: center; min-height: 46px; max-width: calc(100% - 20px); padding: 0 10px; box-sizing: border-box; position: relative; color: #FFF; background: #b70606; } .slanted_box:after { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: 0; left: 100%; border-top: 46px solid #b70606; border-right: 15px solid transparent; } .slanted_box_right:before { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: -46px; left: -15px; border-bottom: 46px solid #b70606; border-left: 15px solid transparent; } .slanted_box.grad { background: linear-gradient(90deg, #ec5628 0%, #b70606 100%); } .slanted_title { /*display: flex; */overflow: hidden; } .slanted_title div:nth-child(1) { font-family: 'Montserrat', Arial; font-size: 28px; font-weight: bold; line-height: 1; position: relative; /*background: #b70606;*/ color: #fff; font-weight: bold; padding: 9px 15px 5px; box-sizing: border-box; text-transform: uppercase; } .slanted_title div:nth-child(2) { /*display: table-cell;*/ height: 5px; width: 80%; /*background: #b70606;*/ position: relative; overflow: hidden; } .slanted_title div:nth-child(2):after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #b70606; transform-origin: 100% 0; transform: skew(-18deg); /*z-index: -1;*/ } .slanted_title img { height: 100%; } .latest_features { margin-bottom: 8px; } .date[data-date] { opacity: 0; } /* Main styles */ header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1000000; box-shadow: rgba(0,0,0,0.6) 0 0 10px; } header .tiled_bg { display: flex; justify-content: space-between; align-items: center; } header .slanted_box { display: flex; align-items: center; } header .slanted_box a { line-height: initial; } header .slanted_box .logo { height: 28px; } header .top-menu { white-space: nowrap; } header .top-menu a { font-size: 14px; margin: auto 11px; font-weight: bold; } header .top-menu a:hover { color: #ee5627; } header .top-menu a span { color: #ee5627; font-size: 10px; padding-left: 2px; pointer-events: none; } header .slanted_box_right { position: fixed; right: 0; display: flex; align-items: center; } header .slanted_box_right img { height: 22px; cursor: pointer; } header .slanted_box_right form { margin: 0; padding: 0; display: inline-flex; width: 0; overflow: hidden; transition: width 0.2s; } header .slanted_box_right form input { width: 120px; border: 0; height: 20px; margin-right: 14px; padding: 2px 5px; color: #333; font-family: 'Fira Sans', Arial; } header .slanted_box_right form.show { width: 140px; } header .sub-menu { position: fixed; z-index: 2; padding-top: 13px; margin-left: -5px; box-shadow: rgba(0,0,0,0.6) 0px 3px 7px; display: none; } header .sub-menu:before { content: ''; display: block; position: absolute; width: 100%; height: 100%; z-index: -1; padding: 10px 20px; margin-left: -20px; margin-top: -10px; } header .sub-menu a { font-size: 13px; background: #dddddd; color: #222; padding: 10px; padding-right: 13px; display: block; border-bottom: 1px solid #444; font-weight: normal; margin: 0; } header .sub-menu a:last-child { border-bottom: 1px solid #ee5728; } header .sub-menu a:hover { color: #ee5728; } header .socials { margin-left: -80px; } header .socials a { margin-right: 6px; } header .socials a:last-child { margin-right: 0; } header .socials a img { height: 18px; opacity: 0.6;} header .socials a img:hover { opacity: 1; } .socials a img[alt='TH'], .footer-socials a img[alt='TH'] { filter: invert(1); transform: scale(1.8); } #menu-icon { width: 20px; height: 18px; margin-right: 15px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .4s ease-in-out; -moz-transition: .4s ease-in-out; -o-transition: .4s ease-in-out; transition: .4s ease-in-out; cursor: pointer; } #menu-icon span { display: block; position: absolute; height: 3px; width: 100%; background: #fff; border-radius: 1px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .2s ease-in-out; -moz-transition: .2s ease-in-out; -o-transition: .2s ease-in-out; transition: .2s ease-in-out; } #menu-icon span:nth-child(1) { top: 0px; } #menu-icon span:nth-child(2), #menu-icon span:nth-child(3) { top: 6px; } #menu-icon span:nth-child(4) { top: 12px; } #menu-icon.open span:nth-child(1) { width: 0%; left: 50%; } #menu-icon.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #menu-icon.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #menu-icon.open span:nth-child(4) { width: 0%; left: 50%; } body.sidenav { overflow: hidden; } body.sidenav #side-navigation { left: 0; } body.sidenav #side-navigation-overlay { opacity: 1; display: block; } #side-navigation { position: fixed; z-index: 20; width: 240px; max-height: calc(100% - 46px); top: 46px; left: -250px; background: #2d2d35; border-bottom: 1px solid #b70606; transition: left 0.3s; } #side-navigation .friends { border-top: 1px solid #898a8e; padding: 12px 17px; color: #818286; } #side-navigation .friends img { height: 11px; } #side-navigation .socials { background: #151515; padding: 12px 5px 12px 17px; } #side-navigation .socials a { margin-right: 10px; } #side-navigation .socials a:last-child { margin-right: 0; } #side-navigation .socials a img { height: 18px; opacity: 0.6;} #side-navigation .socials a img:hover { opacity: 1; } #side-navigation .links { margin: 10px 0; } #side-navigation .links a { display: block; } #side-navigation .links>div { transition: background-color 0.1s; } #side-navigation .links>div>a { padding: 7px 17px; font-weight: bold; color: #d9dadc; } #side-navigation .links>div>span { float: right; display: inline-block; font-weight: bold; padding: 0 12px; color: #fff; cursor: pointer; font-size: 16px; } #side-navigation .links>div.expanded { background: #ee5627; } #side-navigation .links>div.expanded a { color: #fff; } #side-navigation .links>div>div { margin-left: 25px; padding-bottom: 1px; display: none; } #side-navigation .links>div>div a { margin-bottom: 7px; } #side-navigation .links>div>a:hover { color: #fff; } #side-navigation .links>div>div a:hover { color: #ddd; } #side-navigation-overlay { background: rgba(0,0,0,0.8); position: fixed; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 0.2s; display: none; } footer { background: #262626; padding-top: 40px; padding-bottom: 40px;} footer .footer-wrapper { width: 960px; max-width: 90%; margin: auto; line-height: 1.6; } footer .footer-logoline { display: flex; justify-content: space-between; margin-bottom: 30px; } footer .footer-logoline .logo { height: 35px; } footer .footer-socials img { height: 22px; margin: auto 5px; opacity: 0.5; } footer .footer-copyright { flex-basis: 90%; font-size: 11px; line-height: 15px; margin: 30px 0 20px; color: #5f5f5f; display: flex; align-items: center; } footer .footer-copyright img { width: 85px; height: 30px; opacity: 0.25; } footer .footer-copyright a { color: #5f5f5f; } footer .footer-copyright a:hover { text-decoration: underline; } footer .footer-evolve { padding-bottom: 0; margin-right: 20px; padding-right: 20px; border-right: 1px solid #5f5f5f; } footer .footer-menu h5 { font-size: 11px; font-weight: 700; color: #dedede; margin-bottom: 10px; } footer .footer-menu-links { display: flex; flex-wrap: wrap; } footer .footer-menu-links li { width: 25%; } footer .footer-menu-links li a { text-transform: uppercase; color: #eaeaea; font-size: 11px; line-height: 25px; } footer .footer-menu-links li a:hover { text-decoration: underline; } div.wrapper { background-color: #202022; transition: background-color 0.1s; margin: 0 auto; margin-top: 45px; padding: 20px 14px; position: relative; width: 1000px; max-width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; transition: opacity 0.2s; } div.wrapper.faded { opacity: 0.3; } div.inner-wrapper { display: flex; flex-wrap: wrap; box-sizing: border-box; -moz-box-sizing: border-box; } .col-left { padding-right: 14px; width: calc(100% - 316px); box-sizing: border-box; } .col-right { width: 316px; } .col-wide > img { max-width: 100%; } .right-module { background-color: #2c2c32; margin-bottom: 20px; padding: 8px; } .right-module.nopad { padding: 0; } /*.left-module { background-color: #151515; margin-bottom: 20px; padding: 8px; }*/ .left-article-module { background-color: #151515; margin-bottom: 1px; } .left-article-module img.cover { width: 100%; } .left-article-module img.big { width: 100%; margin-bottom: -6px; } .left-article-module>div { padding: 10px 15px 15px 15px; } /* top padding was 18 */ .left-article-module>div a.title { font-family: 'Montserrat'; font-size: 24px; font-weight: bold; display: block; line-height: 1.2; } .left-article-module>div a.title:hover { color: #e05127; } .left-article-module>div .desc { display: flex; margin: 10px auto 30px; line-height: 1.6; font-size: 16px; } .left-article-module>div .desc a { color: #ee5627; } .left-article-module>div .desc .title { color: white; margin-bottom: 10px; } .left-article-module>div .desc .thumb { margin-right: 10px; width: 200px; } .left-article-module>div .article-info { display: flex; justify-content: space-between; } /*.left-article-module>div .article-info div { display: flex; align-items: center; }*/ /*.left-article-module>div .article-info div:first-child img { margin-right: 5px; height: 12px; }*/ .article-info { color: #858585; text-transform: uppercase; font-size: 12px; } .article-info div:first-child a { color: #ee5627; margin-right: 14px; } .article-info div:first-child a.tag { color: #fff; background: #ee5627; padding: 3px 8px; margin-right: 14px; display: inline-block; } .article-info div:first-child a.tag:hover { opacity: 0.8; } .article-info div:first-child em { color: #bbb; margin-right: 14px; } .article-info div:first-child div.authors { display: inline-block; } .article-info div:first-child div.authors a { color: #ee5627; } .article-info div:first-child div.authors a:before, .article-info div:first-child em:before { content: ''; width: 12px; height: 10px; margin-right: 4px; background: url(/img/new/icon_author.svg) no-repeat center center; background-size: contain; display: inline-block; } /*.article-info > span:first-of-type::before { content: ''; width: 12px; height: 10px; margin-right: 4px; background: url(/img/new/icon_clock.svg) no-repeat center center; background-size: contain; display: inline-block; }*/ .article-info > div > span::before { content: ''; width: 12px; height: 12px; margin-right: 6px; background: url(/img/new/icon_clock.svg) no-repeat center center; background-size: contain; display: inline-block; vertical-align: middle; } .article-info div:first-child span { white-space: nowrap; } .article-info div:first-child a.comments { white-space: nowrap; } /*.article-info div:first-child a.comments:before { content: ''; width: 12px; height: 10px; margin-right: 4px; background: url(/img/new/icon_comments.svg) no-repeat center center; background-size: contain; display: inline-block; }*/ /* ********** Insticator comment counter styles ********** */ .insticator-counter-icon svg *[fill] { fill: #ee5627!important; } .insticator-counter-count { color: #ee5527!important; } .insticator-counter-label { color: #ee5527!important; } a.comments.insticator-counter span { color: #ee5527!important; } a.comments.insticator-counter { margin-left: 14px; } /* ********** Insticator comment counter styles ********** */ .article-info div:first-child > * { margin-bottom: 7px; } article .article-info { margin-top: 10px; } h3 { color: #ffc000; font-size: 24px; font-weight: 700; margin: 0; margin-bottom: 10px; padding: 0; text-align: center; position: relative; } h3:after { border-bottom: 1px dotted #ffc000; content: ''; position: absolute; flex: 1; } select.article_dropdown { font-family: 'Fira Sans', Arial; background-color: #cccccc; border: 0; height: 35px; padding: 0 10px; margin-bottom: 8px; box-sizing: border-box; } .calendar-date { width: 40px; height: 45px; background-color: #fff; color: #000; text-align: center; font-family: Helvetica, Arial; font-size: 10px; overflow: hidden; } .calendar-date div:nth-child(1) { background-color: #ee5527; color: #fff; height: 14px; line-height: 14px; } .calendar-date div:nth-child(2) { height: 18px; line-height: 18px; font-size: 18px; font-weight: bold; margin-top: 1px; } .calendar-date div:nth-child(3) { height: 10px; font-size: 10px; } /* Homepage Cover */ #homepage-cover { width: 100%; font-family: 'Montserrat'; display: none; } #homepage-cover .first-row { display: flex; justify-content: space-between; margin-bottom: 8px; } #homepage-cover .first-row .cover { position: relative; width: calc(100% - 370px); } #homepage-cover .first-row .cover>img { width: 100%; height: 100%; max-height: 295px; object-fit: cover; } #homepage-cover .first-row .cover .title { position: absolute; padding: 0; bottom: 20px; font-size: 28px; font-weight: bold; max-width: 65%; display: flex; } #homepage-cover .first-row .cover .title>div { background: rgba(183, 6, 6, 0.8); padding: 20px; line-height: 1.1; transition: transform 0.2s; } #homepage-cover .first-row .cover .title>img { height: 100%; position: absolute; left: 100%; opacity: 0.8; transition: transform 0.2s; } #homepage-cover .first-row .cover:hover .title>div, #homepage-cover .first-row .cover:hover .title>img { transform: translateY(-10px); } /* Homepage Cards */ #homepage-cover .card { display: block; background: #151515; } #homepage-cover .card>img:first-child { width: 100%; height: 120px; object-fit: cover; } #homepage-cover .card .portfolio { position: absolute; margin-top: -35px; margin-left: 8px; display: block; clear: both; } #homepage-cover .card .title { padding: 6px 10px 10px 10px; font-size: 16px; font-weight: bold; } #homepage-cover .inline-four { width: 100%; margin-bottom: 20px; display: flex; } #homepage-cover .inline-four>a { margin: 0 5px; flex-basis: 100%; } #homepage-cover .inline-four>a:first-child { margin-left: 0; } #homepage-cover .inline-four>a:last-child { margin-right: 0; } #homepage-cover .card-cover { width: 360px; /* height: 320px; */ } #homepage-cover .card-cover>img:first-child { height: 210px; object-fit: cover; } #homepage-cover .card-cover .title { padding: 6px 16px; font-size: 24px; } #homepage-cover .card:hover .title { color: #ddd; } /* Homepage Slider */ #homepage-slider { width: 100%; height: 390px; margin-bottom: 20px; overflow: hidden; position: relative; opacity: 0.5; transition: opacity 0.5s; display: none; } #homepage-slider .slider-scroller { display: flex; height: calc(100% - 40px); transition: margin 0.5s; } #homepage-slider .slider-scroller>a { display: inline-block; flex-shrink: 0; width: 100%; } #homepage-slider .slider-scroller>a img { display: block; width: 100%; height: calc(100% - 95px); object-fit: cover; } #homepage-slider .slider-scroller>a .title { height: 95px; background: #333; padding: 12px 15px; box-sizing: border-box; } #homepage-slider .slider-scroller>a .title div { height: 61px; font-size: 28px; font-weight: bold; color: white; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } #homepage-slider .slider-circles { text-align: center; margin-top: 5px; } #homepage-slider .slider-circles div { width: 12px; height: 12px; margin: 5px; border-radius: 50%; background-color: #666666; display: inline-block; cursor: pointer; } #homepage-slider .slider-circles div.active { background-color: #ee5627; } #homepage-slider .slider-left, #homepage-slider .slider-right { position: absolute; left: 0; top: calc(50% - 90px); cursor: pointer; transition: transform 0.1s; filter: drop-shadow( 0px 0px 5px rgba(0, 0, 0, .5)); } #homepage-slider .slider-right { left: auto; right: 0; } #homepage-slider .slider-left:hover, #homepage-slider .slider-right:hover { transform: scale(1.15); } #homepage-slider .portfolio, #homepage-slider .slider-scroller>a .title img { display: none !important; } /* Top Cover Panels */ .top_coverpanel { background: #181818; position: relative; margin-bottom: 15px; display: none; } .top_coverpanel .covers { position: relative; height: 314px; width: calc(100% - 64px); margin-left: 64px; } .top_coverpanel .covers > a { opacity: 0; transition: opacity 0.4s; } .top_coverpanel .covers > a img { position: absolute; width: 100%; height: 100%; object-fit: cover;} .top_coverpanel .covers > a.active { opacity: 1; } .top_coverpanel .thumb_navigation { width: 56px; position: absolute; top: 4px; left: 4px; height: calc(314px - 8px); } .top_coverpanel .thumb_navigation .button_up, .top_coverpanel .thumb_navigation .button_down { width: 100%; background: #232323; height: 10px; text-align: center; display: flex; align-items: center; justify-content: center; position: absolute; cursor: pointer; } .top_coverpanel .thumb_navigation .button_down { bottom: 0 } .top_coverpanel .thumb_navigation .button_up.disabled, .top_coverpanel .thumb_navigation .button_down.disabled { opacity: 0.5; cursor: initial; } .top_coverpanel .thumb_navigation .button_up span { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #ee5627; } .top_coverpanel .thumb_navigation .button_down span { width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #ee5627; } .top_coverpanel .thumb_navigation .button_up.disabled span { border-bottom-color: black; } .top_coverpanel .thumb_navigation .button_down.disabled span { border-top-color: black; } .top_coverpanel .thumb_navigation .thumbnails { position: absolute; overflow: hidden; top: 13px; bottom: 13px; } .top_coverpanel .thumb_navigation .thumbnails .thumbnails_wrapper { transition: margin 0.4s; } .top_coverpanel .thumb_navigation .thumbnails img { width: 50px; height: 50px; border: 3px solid #232323; display: block; filter: grayscale(80%); cursor: pointer; } .top_coverpanel .thumb_navigation .thumbnails img.active { border-color: #ee5627; filter: none; } .top_coverpanel .titles { position: relative; background: #151515; height: 60px; padding: 6px 10px; overflow: hidden; } .top_coverpanel .titles > div { position: absolute; width: 100%; height: 100%; opacity: 0; box-sizing: border-box; overflow: hidden; color: white; } .top_coverpanel .titles > div.active { opacity: 1; } .top_coverpanel .titles > div a { color: white; text-decoration: none; } .top_coverpanel .titles h2 { color: #eee; text-transform: uppercase; font-family: 'Montserrat', Arial; font-size: 20px; line-height: 1; margin-bottom: 6px; } .top_coverpanel .titles h2 span { color: #ee5627; font-size: 30px; line-height: 15px; } .top_coverpanel .titles .blurb { color: #cbcbcb; } .top_coverpanel .titles .blurb a { color: #ee5627; } /* Play by Play */ #playbyplay .event { padding:20px; margin-bottom: 30px; } #playbyplay .list-links { background: #101010; margin-bottom: 30px; } #playbyplay .list-links li { padding: 5px 11px; } #playbyplay .list-links li a { color:#fff; font-family:'Fira Sans', Arial; text-transform: uppercase; text-decoration: none; display: block; } #playbyplay .list-links li a:hover { color:#f25520; } #playbyplay .list-links li a span.versus { font-size:16px; } #playbyplay .list-links li:first-child a { font-size: 24px; font-weight: bold; } #playbyplay span.versus { color: #999; font-family:'Fira Sans', Arial; font-style: italic; font-size: 20px; } #playbyplay h2 span.versus { display: block; line-height: 1; margin: -10px 0; } #playbyplay h2 { font-family:'Fira Sans', Arial; text-transform: uppercase; font-size: 24px; text-align: center; padding:0 0 20px; margin:0 0 10px; border-bottom: dotted 1px #444; } #playbyplay .event:nth-child(even) { background: #101010; border-bottom: 1px solid #303030; } #playbyplay .event h3 { text-transform: uppercase; font-family:'Fira Sans', Arial; text-align:center; margin:0; padding:0; } /* Right Modules */ .right-module hr { border: 0; background: #444; height: 1px; margin: 0 -4px; } .yellow-title { line-height: 1; text-align: center; overflow: hidden; } .yellow-title h3 { font-family: 'Montserrat', Arial; font-size: 24px; font-weight: 700; color: #ffc000; margin: 7px 0 15px; text-transform: uppercase; display: inline-block; position: relative; } .yellow-title h3:before, .yellow-title h3:after { content: ""; position: absolute; border-bottom: 1px solid #ffc000; bottom: 4px; width: 300%; } .yellow-title h3:before { right: 100%; margin-right: 15px; } .yellow-title h3:after { left: 100%; margin-left: 15px; } .right-search { display: flex; padding-bottom: 10px; } .right-search input[type=text] { font-family: 'Fira Sans', Arial; font-size: 12px; line-height: 1; border: 0; padding: 10px; width: 100%; color: #333; background-color: #ddd; box-sizing: border-box; outline: none; } .right-search input::placeholder { color: #666; font-style: italic; } .right-search input[type=submit] { background: url(/img/new/search.svg) no-repeat center center #ee5627; border: 0; min-width: 40px; } h4 { color: #ffc000; font-weight: bold; font-size: 14px; padding: 12px 0; margin: 0; } .right-more-fighters { color: #444; font-size: 14px; padding-bottom: 10px; line-height: 1.7; } .right-more-fighters a { color: #eee; } .right-links a { font-size: 15px; font-weight: bold; text-transform: uppercase; display: block; padding: 10px; border-bottom: 1px solid #444; margin: 0 -8px; } .right-links a:first-child { border-top: 1px solid #444; } .right-links a:last-child { border-bottom: none; } .right-links.forum a { font-size: 12px; line-height: 1.6; padding: 8px 10px; } .right-module .right-more { display: block; margin: 0 -8px -8px -8px; padding: 15px; background: #151515; border-bottom: 1px solid #b70606; color: #b70606; text-align: center; font-size: 15px; font-family: 'Montserrat', Arial; font-weight: bold; } .right-module .right-tabs { display: flex; background: #1f1f1f; margin: 0 -8px; font-size: 13px; font-weight: bold; border-bottom: 2px solid #333; } .right-module .right-tabs a { color: #555; padding: 10px; flex-grow: 1; text-align: center; border-left: 1px solid #333; } .right-module .right-tabs a:first-child { border-left: none; } .right-module .right-tabs a:hover { color: #bbb; } .right-module .right-tabs a.active { color: #fff; background-color: #2e2e35; } .right-module .right-tabs-content > a, .right-module .right-fighters-content > a { font-size: 15px; display: flex; padding: 14px; border-bottom: 1px solid #444; margin: 0 -8px; color: #cccccc; } .right-module .right-tabs-content > a:first-child { border-top: 1px solid #444; } .right-module .right-tabs-content > a:last-child { border-bottom: none; } .right-module .right-tabs-content > a .calendar-date { margin-right: 10px; } .right-module .right-fighters-content > a:hover { color: #e05127; } .right-module .right-tabs-content > a .event b { text-transform: uppercase; display: block; color: #fff; } .right-module .right-fighters-content > a { font-size: 16px; align-items: center; padding: 9px 14px; } .right-module .right-fighters-content > a img { margin-right: 8px; width: 53px; height: 53px; object-fit: cover; } .right-module a:hover { color: #e05127; } .right-module a.right-more:hover { border-color: #e05127; } .right-module.nopad .right-more { margin: 0; } .latest_articles_by_tag .right-tabs { margin: 0; } /* Download Mobile App Page */ #mobileapp { color: #eee;font-size: 15px;padding: 80px 30px 10px 30px; line-height: 1.4; /*background: url(../../img/mobile-phone-app.jpg) transparent center center; background-repeat: no-repeat; background-size: cover; */ min-height: 600px; } #mobileapp .sherdog_logo { background: url(/img/w/sherdog-sprite-logos.png); display: block; height: 84px; width: 368px; margin: 0 auto 16px auto; } #mobileapp ul { margin-top: 16px; list-style: disc outside !important; overflow: inherit; } #mobileapp ul li { margin: 10px 16px; padding: 0; border-bottom: 0; display: list-item !important; overflow: inherit; } #mobileapp img { margin-top: 10px; margin-bottom: 20px; } #mobileapp .applinks { text-align: center; } #mobileapp .applinks img { height: 65px; margin: 10px 15px 20px 15px; transition: all .2s; } #mobileapp .applinks img:hover { box-shadow: 0px 0px 20px rgba(255,255,255,0.5); } /* About Us */ #aboutus { color: #eee;font-size: 15px;padding: 30px 30px 10px 30px; line-height: 1.4; } #aboutus img { display: block; margin: 30px auto; } /* Homepage All Access Videos Slider */ .all-access-videos { width: 100%; background-color: #151515; border-bottom: 1px solid #b70606; padding: 8px 15px 15px; } .all-access-videos .slider { position: relative; /*border: 1px solid white; */ height: 208px; overflow: hidden; } .all-access-videos .sldddddddider>div { } .all-access-videos .slider .left, .all-access-videos .slider .right { position: absolute; display: block; height: 100%; width: 10%; max-width: 90px; z-index: 2; background: linear-gradient(90deg, rgba(21,21,21,1) 20%, rgba(21,21,21,0) 100%); display: flex; align-items: center; justify-content: flex-start; padding: 10px; box-sizing: border-box; font-size: 50px; cursor: pointer; padding-bottom: 40px; } .all-access-videos .slider .right { right: 0; background: linear-gradient(270deg, rgba(21,21,21,1) 20%, rgba(21,21,21,0) 100%); justify-content: flex-end; } .all-access-videos .slider .left.disabled, .all-access-videos .slider .right.disabled { pointer-events: none; color: rgba(255,255,255,0.2); } .all-access-videos .slider .items-holder-wrapper { position: absolute; left: 2%; right: 2%; height: 100%; z-index: 1; } .all-access-videos .slider .items-holder { white-space: nowrap; display: flex; } .all-access-videos .slider .items-holder .item { width: auto; white-space: initial; height: 100%; display: inline-block; margin: 0 10px; font-size: 17px; font-weight: 700; line-height: 1.2; } .all-access-videos .slider .items-holder .item div.image { position: relative; } .all-access-videos .slider .items-holder .item div.image img:first-child { width: 100%; max-height: 155px; } .all-access-videos .slider .items-holder .item div.image img:nth-child(2) { position: absolute; top: 50%; left: 50%; transition: opacity 0.4s; transform: translate(-50%, -50%); } .all-access-videos .slider .items-holder .item div.title { max-height: 39px; overflow: hidden; } .all-access-videos .slider .items-holder .item:hover div.image img:nth-child(2) { opacity: 0.5; } /* Final result win/loss/nc... used on .... */ .final_result { display: inline-block; color: white; font-weight: bold; text-transform: uppercase; line-height: 1; white-space: nowrap; padding: 6px 11px; background-color: #13a400; } .final_result.loss { background-color: #c3031c; } .final_result.draw { background-color: #ff7900; } .final_result.nc { background-color: #888; } .final_result.no_contest { background-color: #888; } .final_result.yet_to_come { background-color: #ffa500; } /* Ads */ @media (max-width: 480px) { .content.top_ads { min-height: 160px; } } @media (min-width: 480px) and (max-width: 768px) { .content.top_ads { min-height: 110px; } } @media (min-width: 760px) { .content.top_ads { min-height: 280px; } } .content.top_ads{ display: flex; justify-content: center; } .ads.top_ad { margin: auto; } .top_ads { text-align: center; width: 100%; } @media (max-width: 760px) { .right-module.ads{ min-height: 270px } } @media (min-width: 760px) { .right-module.ads{ min-height: 620px } } .right-module.ads{ display: flex; justify-content: center; } .right-module .ad{ margin: auto; } .right-module .gpt-ad{ margin: auto; } #adIn { display: flex; justify-content: center } #adIn .gpt-ad { margin: auto; } #adIn { margin-bottom: 15px; text-align: center; } #adViAi { margin-bottom: 15px; text-align: center; } @media (max-width: 480px) { #adViAi { min-height: 214px; } } @media (min-width: 481px) { #adViAi { min-height: 266px; } } #adViAi #vi-stories-top-div-1 { margin: auto; } #adViAi .viaititle { font-size: 12px; color: #858585; } #ad728x90 { width: 100%; margin-bottom: 20px; text-align: center; } #fighterh { margin: auto; text-align: center; padding-bottom: 8px; } #fighterw { margin: -20px auto 20px; text-align: center; } /* #ad320 { position: fixed; bottom: 0; left: 0; right: 0; text-align: center; background-color: rgba(0,0,0,0.8); padding-top: 3px; z-index: 9999; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } #ad320.move {-webkit-transform: translateY(100%);-ms-transform: translateY(100%);transform: translateY(100%);-webkit-transition-delay: 1s;-moz-transition-delay: 1s;transition-delay: 1s; } */ /* Galery */ @media (max-width: 480px) { .nGalleryWrapper { height: 450px; } } @media (min-width: 481px) { .nGalleryWrapper { height: 600px; } } /* Theme Switcher */ #theme-switch { display: inline-block; border: 1px solid white; width: 18px; height: 10px; border-radius: 5px; box-sizing: border-box; position: relative; cursor: pointer; opacity: 0.7; margin-right: 80px; } #theme-switch:before { display: block; position: absolute; content: ''; width: 18px; height: 18px; left: -22px; top: -5px; background: url(/img/new/theme.png) no-repeat center center; } #theme-switch em { display: inline-block; width: 8px; height: 8px; border-radius: 100%; background-color: white; position: absolute; transition: margin-left 0.15s; } #theme-switch.light em { margin-left: 8px; } /* Fighter Page */ .module.bio_fighter { border-bottom: 1px solid #ee5627; margin-bottom: 20px; } .fight_card_preview { text-align: center; } .fight_card_preview h2 { font-family: 'Fira Sans', Arial; font-size: 28px; font-weight: 800; text-transform: uppercase; font-style: italic; margin-bottom: 4px; color: #fff; } .fight_card_preview .date_location { color: #e8e8e8; text-transform: uppercase; font-size: 12px; } .fight_card_preview .date_location em { margin-left: 15px; } .fight_card_preview .fight { display: flex; justify-content: center; margin-top: 15px; margin-bottom: 23px; } .fight_card_preview .fight .versus { align-self: center; } .fight_card_preview .fight .versus img { max-width: 100px; } .fight_card_preview .fight .record { color: #999; text-transform: uppercase; font-size: 10px; } .fight_card_preview .fight h3 a { color: #ffc000; text-transform: uppercase; font-size: 18px; display: inline-block; line-height: 1.2; } .fight_card_preview .fight h3 { margin: 0; } .fight_card_preview .card_button { color: #ff7800; border: 2px solid #ff7800; padding: 5px 13px; font-weight: bold; font-size: 15px; white-space: nowrap; margin-bottom: 5px; display: inline-block; } .fight_card_preview .card_button:hover { color: #fff; border-color: #fff; } /* Articles/left section */ .article { background-color: #151515; font-family: 'Fira Sans', Arial; line-height: 1.6; font-size: 16px; margin-bottom: 20px; } .article .header { padding: 15px; } .article .header h1 { color: #fff; font-size: 33px; font-weight: bold; display: block; line-height: 1.1; margin: 0; } .article h2 { font-size: 20px; font-weight: bold; } .article a { color: #f25520; } .article .content { padding: 15px; } .article .info { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: baseline; } .article .info .share { margin-top: 14px; } .article iframe { max-width: 100%!important; } .module_list_generic { margin: 5px 0; margin-bottom: 20px; font-family: 'Fira Sans', Arial; line-height: 1.6; font-size: 16px; } .module_list_generic ul { margin: 0; padding: 0; list-style: none; } .module_list_generic ul li { margin: 0 0 1px 0; padding: 11px; padding-left: 35px; background-color: #151515; } .module_list_generic ul li a { color: #f0f0f0; } .module_list_generic ul li a:hover { color: #f25520; } .module_list_generic ul li:before { content: ""; border-color: transparent #f25520; border-style: solid; border-width: 0.35em 0 0.35em 0.45em; display: block; height: 0; width: 0; margin-left: -16px; margin-top: 6px; position: absolute; } .right-module.nopad .module_list_generic { margin: 0; line-height: 1.3; font-size: 15px; } .left-module-pad { background-color: #151515; padding: 15px; } .left-module-pad-line { background-color: #151515; padding: 15px; border-bottom: 1px solid #ee5627; } .left-module-pad-line.organization-description { font-size: 15px; } .left-module { background-color: #151515; margin-bottom: 15px; } .left-module .yellow-title { margin: 0 10px; padding-top: 14px; } .left-module .content { padding: 10px; } .meter-title { color: #fff; font-size: 12px; font-weight: bold; margin-bottom: 1px; } .meter-title em { color: #f25520; padding: 0 2px; } .meter { width: 120px; height: 12px; display: flex; color: white; font-size: 11px; font-weight: bold; font-family: Arial; line-height: 12px; margin-bottom: 10px; } .meter .pl { display: inline-block; width: 25px; background-color: #ee5627; text-align: center; } .meter .pr { display: inline-block; width: 35px; text-align: center; } .meter .pm { display: inline-block; width: 60px; background-color: #2f3034; position: relative; } .meter .slanted_box { width: 90%; position: relative; display: inline-block; height: 12px; padding: 0; box-sizing: border-box; position: relative; background: #ee5627; z-index: 2; min-height: auto; } .meter .slanted_box:after { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: 0; left: 100%; border-top: 12px solid #ee5627; border-right: 3.5px solid transparent; } .meter .pm:after { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: 0; left: 100%; border-top: 12px solid #2f3034; border-right: 3.5px solid transparent; } .meter .pm img { position: absolute; height: 100%; top: 0; left: -1px; z-index: 5; } .fighter-info { display: flex; } .fighter-info .profile-image { width: 200px; /*23%;*/ object-fit: contain; object-position: top; background: #151515;} .fighter-info .profile-image-mobile { display: none; width: 100%; max-height: 300px; object-fit: contain; } .fighter-info .fighter-right { width: calc(100% - 200px); /*77%;*/ } .fighter-title { display: flex; flex-direction: column; background-color: #2e2f34; padding: 13px 13px 13px 17px; } .fighter-title h1 { /* margin-top: -2px; min-width: 70%; */ } .fighter-title h1 .fn { font-size: 40px; font-weight: bold; line-height: 1.06; text-transform: uppercase; color: #f0f0f0; } .fighter-title h1 .nickname, .fighter-title h1 .nickname_empty { font-size: 30px; font-weight: bold; line-height: 1; color: #ffc000; } .fighter-title .fighter-line1 { } .fighter-title .fighter-line2 { display: flex; align-items: end; } .fighter-title .share { margin-left: auto; padding-top: 3px; flex-shrink: 0; } .fighter-title.fighter-title-long-name .fighter-line1 { flex-direction: column; } .fighter-title.fighter-title-long-name .fighter-line1 h1 { order: 2; } .fighter-title .big_flag { margin-left: 6px; } .fighter-title .birthplace { text-transform: uppercase; color: white; font-size: 12px; line-height: 1.1; } .fighter-title .birthplace strong { font-weight: bold; margin-bottom: 2px; display: inline-block; } .fighter-title .fighter-flag-social { display: inline-flex; flex-direction: column; float: right; margin-left: auto; align-items: flex-end; flex-shrink: 0; /*margin-top: 10px; max-width: 25%;*/ width: min-content; } .fighter-title .fighter-nationality { display: flex; text-align: right; align-items: start; } .fighter-data { width: 100%; display: flex; justify-content: space-between; background: #151515; padding: 18px 11px; box-sizing: border-box; gap: 10px; } /*.fighter-data .bio-holder table { margin-right: 15px; }*/ .fighter-data .bio-holder table td { text-transform: uppercase; padding: 5px 8px; font-size: 12px; } .fighter-data .bio-holder table td b { color: #fff; font-weight: bold; font-size: 14px; } .fighter-data .bio-holder table td em { color: #ee5627; } .fighter-data .bio-holder table td a { color: #ee5627; font-weight: bold; } .fighter-data .association-class { font-size: 11px; text-transform: uppercase; padding: 15px 7px 0; margin-top: 8px; border-top: 1px solid #555; } .fighter-data .association-class a, .fighter-data .association-class b { color: #ee5627; font-weight: bold; margin-top: 2px; display: inline-block; } .winsloses-holder { display: flex; gap: 8px; } .winloses { width: 106px; border: 1px solid #13a400; display: flex; margin-bottom: 15px; font-size: 14px; } .winloses span { color: #fff; font-weight: bold; padding: 3px 1px 1px; display: block; text-transform: uppercase; flex-grow: 1; text-align: center; line-height: 22px; } .winloses span:first-child { background-color: #13a400;} .winloses span:nth-child(2) { font-size: 25px; } .winloses.lose { border: 1px solid #c3031c;} .winloses.lose span:first-child { background-color: #c3031c;} .winloses.draws { border: 1px solid #ff7900; margin-top: 20px; } .winloses.draws span:first-child { background-color: #ff7900;} .winloses.nc { border: 1px solid #888; margin-top: 20px; } .winloses.nc span:first-child { background-color: #888;} .portfolio_top { display:flex; height: 44px; margin-top: 0px; margin-bottom: 10px; } .portfolio_bottom { display:flex; height: 44px; margin-top: 7px; margin-bottom: 10px; margin-left: 1px; } .pf-color-cs { background-color: #daed00; } .pf-color-gr { background-color: #e92929; } .pf-color-md { background-color: #ff2815; } .pf-color-psls { background-color: #0072bb; } .pf-color-shh { background-color: #003956; } .pf-color-wz { background-color: #bd0004; } .pf-inner-logo, .pf-inner-arrow { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; width:150px; height:44px; box-sizing: border-box; } .pf-inner-arrow { width: 50px; } .pf-inner-text, .pf-inner-more { flex-grow: 1; height: 40px; color: white; box-sizing: border-box; padding-left: 15px; background-color: #434343; line-height: 40px; text-transform: uppercase; font-size: 12px; } .pf-inner-more { display: flex; align-items: center; justify-content: center; font-weight: bold; padding-left: 0; } .pf-inner-logo img { max-width: 120px; max-height: 32px; } .pf-inner-arrow img { max-width: 21px; max-height: 21px; } .pf-inner-more img { max-height: 24px; margin-left: 10px; } .pagination { background: #151515; padding: 10px 15px; border-bottom: 1px solid #e05127; font-size: 18px; text-transform: uppercase; display: flex; justify-content: space-between; } .pagination.pagination-topmargin { margin-top: 2px; } .pagination a { display: inline-block; color: #e05127; font-weight: bold; } .pagination a.more { margin: 3px auto; font-size: initial; } .pagination a.more.loading { pointer-events: none; } .pagination a:hover { color: #eee; } .author-info { margin-top: 15px; overflow: auto; } .author-info .profile_image { float: right; border: 1px solid; margin: 0 0 5px 5px; } .author-info .socialmedia { margin-top: 15px; } .author-info .socialmedia .twitter a { display: inline-flex; align-items: center; color: #a1a1a1; font-weight: bold; } .author-info .socialmedia>* { margin-right: 12px; } .archive { margin-bottom: 40px; line-height: 1.4; } .archive a { margin-right: 8px; font-weight: bold; white-space: nowrap; } .archive a:first-child { margin-left: 8px; } .archive a:hover { color: #ee5627; } /* Fight Finder / Events / Search box on top of galleries etc... */ .left-module.fight-finder { margin-bottom: 30px; } .left-module.fight-finder form { padding: 15px; } .left-module.fight-finder .yellow { color: #ffc000; text-transform: uppercase; line-height: 1.9; } .left-module.fight-finder #weights-associations { display: flex; justify-content: space-between; margin-bottom: 15px; } .left-module.fight-finder #weights-associations>div { width: 49%; } .left-module.fight-finder #organization-button { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 15px; } .left-module.fight-finder #organization-button>div:first-child { width: calc(98% - 135px); } .left-module.fight-finder #main-events-search { margin-bottom: 15px; } .left-module.fight-finder #more-fighters .yellow { font-weight: bold; } .left-module.fight-finder input[type=text], .left-module.fight-finder select { width: 100%; background-color: #cccccc; border: 0; height: 35px; padding: 0 10px; box-sizing: border-box; } .left-module.fight-finder input[type=submit] { background-color: #ee5627; color: #fff; height: 35px; border: 0; padding: 10px; min-width: 135px; } .left-module.fight-finder input, .left-module.fight-finder select { font-family: 'Fira Sans', Arial; } .left-module.fight-finder select { color: #7a7a7a; } .left-module.fight-finder select option { color: #000;} .left-module.fight-finder input::placeholder, .left-module.fight-finder select::placeholder { text-transform: uppercase; color: #7a7a7a;} .left-module.fight-finder #more-fighters a { display: inline-block; color: #7f7f81; background: #202022; padding: 2px 10px; line-height: 1.5; margin-right: 10px; margin-bottom: 5px; white-space: nowrap; } .left-module.fight-finder #more-fighters a:hover { color: #ddd; } .left-module.fight-finder #fighter-pictures-search { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 15px; } .left-module.fight-finder #fighter-pictures-search>div:first-child { width: calc(98% - 135px); } .left-module.fight-finder #more-fighters a:hover { color: #ddd; } /* 404 search */ .search_404 { display: flex; justify-content: space-between; margin-top: 15px; } .search_404 input[type=text] { width: calc(98% - 135px); background-color: #cccccc; border: 0; height: 35px; padding: 0 10px; box-sizing: border-box; } .search_404 input[type=submit] { background-color: #ee5627; color: #fff; height: 35px; border: 0; padding: 10px; min-width: 135px; font-family: 'Fira Sans', Arial; } /* Fight Odds */ .info.odds { display: flex !important; justify-content: space-between; padding: 7px; line-height: 2; padding-left: 12px; padding-right: 15px; font-size: 18px; text-transform: uppercase; } .info.odds a:not(.active) { color: #eee; } .info.odds a:hover { color: #fff; } .oddsprovided { font: bold 40px "fgDemi", sans-serif; text-transform: uppercase; color: #f0f0f0; float:right; font-size: 14px; line-height: 1; text-align: right; margin-right: 11px; margin-top: 2px; } .oddsprovided span { color: #fdc23e; } .oddsprovided.unibet span { color: #ffb000; } .oddsprovided.bookmaker span { color: #ff6c22; } .oddsprovided.bottom { margin-top: 5px; } table#odds tr td { padding: 4px; margin-bottom: 5px; } table#odds.crownbet tr td { padding: 1px 4px; } table#odds.crownbet tr td h1 { font-size: 33px; line-height: 50px; } table#odds tr td.r { text-align: right; } table#odds tr.head td { padding: 0px; } table#odds tr.head td div:first-child { padding: 4px; background-color: #333; font-weight: bold; font-size: 16px; } table#odds tr.head td div:nth-child(2) { padding: 2px 4px; background-color: #2f2f2f; } table#odds tr td a.betnow { float: right; border-radius: 5px; line-height: 1; padding: 3px 12px; margin: 0px; margin-left: 8px; color: black; font-family: Helvetica, Arial, fgDemi, sans-serif; transition: all 0.2s; font-size: 16px; } table#odds.crownbet tr td a.betnow { background-color: #782f76; color: #fff; } table#odds tr td a.betnow:hover { transform: scale(1.15); color: #000; } table#odds tr td a { color: #ccc; display: initial; background: none; } table#odds tr td a:hover { color: #ab3da8; } table#odds tr.subhead td { font-weight: bold; background: #2a2a2a; color: #fff; padding-top: 5px; } table#odds tr.points td { font-size: 12px; padding-top: 0; padding-bottom: 0; padding-left: 16px; color: #999; } table#odds tr.points td:first-child { padding-left: 5px; } table#odds.unibet tr td a.betnow { background: #ffe71e; } table#odds.bookmaker tr td a.betnow { background: #ffe61d; } table#odds.unibet tr td img { margin-left: -7px; height: 26px; margin-top: -3px; margin-bottom: 4px; } table#odds.bookmaker tr td img { margin-left: -2px; margin-top: 2px; height: 14px; margin-bottom: 11px; } #betsLoader { margin: 40px auto; text-align: center; text-transform: uppercase; line-height: 2; font-weight: bold; } #betsError { display: none; margin: 80px auto; text-align: center; font-weight: bold; } /* Contact form */ #get_in_touch { font-size: 26px; text-align: center; margin: 20px 20px 0; line-height: 1.3; } #get_in_touch b { font-size: 28px; color: white; } #inquires { display: grid; text-align: center; margin: 40px 0; grid-template-columns: repeat(4, 1fr); /* grid-auto-rows: 1fr; */ grid-column-gap: 5px; grid-row-gap: 60px; } #inquires div { display: flex; flex-direction: column; justify-content: space-between; align-items: center; /*flex-basis: 100%;*/ } #inquires div:first-child { grid-column: 2 / span 2; } #inquires h5 { font-size: 20px; line-height: 1; margin-bottom: 20px; } #inquires a { display: inline-block; color: #fff; background: #ee5527; border-radius: 20px; text-transform: uppercase; padding: 8px 20px 6px; line-height: 1.3; margin-top: 25px; } #inquires a:hover { opacity: 0.8; } #contact-form { display: none; } .zend_form { width:100%; padding:0; } .zend_form dt { padding:0; clear:both; width:15%; float:left; text-align:right; margin:5px 5px 5px 0; } .zend_form dd { padding:0; float:left; width:82%; margin:5px 2px 5px 0; } .zend_form p { padding:0; margin:0; } .zend_form input, .zend_form textarea { margin:0 0 2px 0; padding:0; } .zend_form input[type='text'] { width:50%; border:solid 1px #999; padding:5px; margin-top:-5px; } .zend_form select { width:52.4%; border:solid 1px #999; padding:5px; margin-top:-5px; background-color:#FFF; } .zend_form textarea { width:100%; border:solid 1px #999; height:200px; padding: 5px; box-sizing: border-box; } .required:after{ content:'* '; color:#FF6700; } .zend_form input[type='submit'] { padding: 8px 22px; background: #ee5627; color: #FFF; text-transform: uppercase; font-weight: bold; border-width: 0; font-size: 16px; margin-right: 20px; margin-left: 16%; margin-top: 20px; } .zend_form .g-recaptcha { margin-left: 16% !important; } #submit-element::after { content:' *'; color:#FF6700; } #inquiry-label, #inquiry-element { display: none; } .green_box, .red_box { margin-bottom: 25px; text-align: center; background: #549d23; color: white; margin: 30px 0px 40px; padding: 12px; } .red_box { background: #d80e0e; } .team-sherdog { margin-top: 20px; } .team-sherdog .columns { display: flex; justify-content: space-between; max-width: 480px; margin: auto; padding-bottom: 40px; } .team-sherdog .columns h2 { font-size: 17px; } /* RSS Syndication */ .rss-content { margin-top: 10px; padding-top: 30px; } .rss-content .columns { display: flex; justify-content: space-between; max-width: 480px; margin: auto; padding-bottom: 40px; } .rss-content ul { list-style: none; } .rss-content ul li { padding: 0; margin: 8px; margin-left: 0; display: block; overflow: hidden; position: relative; } /* Advertising */ .ad_stats { /*background: url(../../img/w/ad_stats.jpg) no-repeat; width: 660px; height: 127px; display: block; padding: 15px 2px 0; margin: 0 0 15px; box-shadow: 0 3px 15px #222; */ } .ad_stats ul { /*margin-left: 270px;*/ display: flex; flex-direction: column; align-items: center; } .ad_stats ul li { margin: 10px 0; font-size: 16px; } .ad_stats span { color: #ee5627; } .ad_stats strong { font-weight: bold; color: #fff; } .advertising_target_clients { margin-top: 10px; font-size: 14px; } .advertising_target_clients h3 { margin-bottom: 30px; } .advertising_target_clients p { margin-bottom: 20px; } /* Prev/next navigation bottom of articles */ .tools_list { margin-bottom: 35px; font-size: 15px; display: flex; justify-content: space-between; } .tools_list>a { width: 48%; } .tools_list>a.right { text-align: right; } .tools_list>a:hover { color: #ee5627; } /* Featured video */ .featured-video { background-color: #151515; margin-bottom: 15px; } #big-video-player { background: url(/img/w/cover_video_bg.png) no-repeat left top; background-size: cover; } #big-video-player { position: relative; overflow: hidden; width: 100%; padding-bottom: 56.2%; } #big-video-player .play { position: absolute; top: 50%; left: 50%; background: transparent url(/img/w/playButtonOverlay.png) no-repeat center center !important; width: 100px; height: 100px; z-index: 999; transform: translate(-50%, -58%); } #big-video-player .image { position: absolute; height: 100%; width: 100%; margin: 0; overflow: hidden; z-index: 2; } #big-video-player .image iframe, #big-video-player .image .videoPlayer { width: 100%; height: 100%; } #big-video-player .image .twitter-tweet { height: 100%; overflow: auto; } #big-video-player center { height: 100%; } /* Thumb scroller */ .thumb-scroller { display: flex; align-items: center; } .thumb-scroller>a { cursor: pointer; padding: 0 5px; } .thumb-scroller>a.disabled { cursor: auto; opacity: 0.3; } .thumb-scroller>div { width: 100%; border: 0px solid red; overflow: hidden; max-width: 100%; } .thumb-scrollable { display: flex; transition: all 0.3s; position: relative; } .thumb-scrollable div, .thumb-scrollable a { padding: 5px; box-sizing: border-box; display: block; } .thumb-scrollable div img, .thumb-scrollable a img { width: 100%; height: 100%; object-fit: cover; cursor: pointer; box-sizing: border-box; border: 2px solid transparent; transition: opacity 0.1s; } .thumb-scrollable div img:hover, .thumb-scrollable a img:hover { opacity: 0.7; } .thumb-scrollable div.selected img, .thumb-scrollable a.selected img { border-color: #aaa; } .thumb-scrollable div, .thumb-scrollable a { width: 25%; min-width: 25%; height: 100px; } .thumb-scrollable.small div, .thumb-scrollable.small a { width: 50%; min-width: 50%; height: 90px; } .thumb-scrollable.large div, .thumb-scrollable.large a { width: 20%; min-width: 20%; } /* Sharing */ body.phone .a2a_button_email { display: none; } body:not(.phone) .a2a_button_whatsapp { display: none; } .a2a_svg { background-color: #555 !important; } .event_detail .a2a_count, .fighter-info .a2a_count { display: none; } .event_detail .a2a_svg, .fighter-info .a2a_svg { width: 28px!important; height: 28px!important; line-height: 28px!important; } /*.fighter-info .share { float: right; margin-top: -27px; margin-right: -3px; }*/ .share_buttons { margin-top: 10px; } /* Tabs */ .tabbed { background-color: #151515; } .tabbed .tab_menu { border-bottom: 2px solid #202126; display: flex; } .tabbed .tab_menu a, .tabbed .tab_menu span { padding: 13px 19px; text-transform: uppercase; /*color: #333436; */line-height: 1; border-right: 1px solid #2e2f34; } .tabbed .tab_menu a.active, .tabbed .tab_menu span { background: #2e2f34; color: #fff; } .tabbed .single_tab { display: none; } .tabbed .single_tab.active { display: block; } /* New table */ /* .new_table td { padding: 5px; } */ .new_table_holder { width: 100%; /*overflow: auto;*/ overflow-y: hidden; overflow-x: auto; } .new_table_holder::-webkit-scrollbar { height: 10px; } .new_table_holder::-webkit-scrollbar-track { background: #aaa; } .new_table_holder::-webkit-scrollbar-thumb { background: #666; } .new_table_holder::-webkit-scrollbar-thumb:hover { background: #888; } .new_table { width: 100%; /*text-transform: uppercase; */ } .new_table td { padding: 8px 5px; color: white; font-size: 14px; vertical-align: middle; /*word-break: break-word;*/ } .new_table td a { color: #ee5627; font-weight: bold; font-size: 14px; /*word-break: break-word;*/ } .new_table td a:hover { color: #fff; } .new_table tr:nth-child(even):not(.table_head) { background: #151515; } .new_table tr:nth-child(odd):not(.table_head) { background: #2e2f34; } /*.new_table tr:not(.table_head) { word-break: break-all; }*/ .new_table tr.table_head { font-size: 12px; background: #2e2f34; text-transform: uppercase; } .new_table td.nowrap { word-break: normal; } .new_table.event tr:hover { cursor: pointer; opacity: 0.9; } .new_table.event tr:hover a { color: white; } .new_table.event tr td:nth-child(1) { padding-left: 15px; } .new_table.event tr td:nth-child(4) { line-height: 1.6; } .new_table.event tr td:nth-child(4) img { margin-right: 4px; } .new_table.event td { vertical-align: middle; } .new_table.fighter .final_result { background: #888; color: #fff; font-size: 13px; font-family: 'Fira Sans', sans-serif; font-weight: bold; text-transform: uppercase; padding: 4px 3px; margin: 3px 0; min-width: 40px; display: inline-block; text-align: center; } .new_table.fighter .final_result.win { background: #090; } .new_table.fighter .final_result.loss { background: #C00; } .new_table.fighter .final_result.draw { background: #ff7900; } .new_table.fighter .final_result.no_contest { background: #888; } .new_table.fighter .final_result.yet_to_come { background: #ffa500; } .new_table.fighter .col_five { padding-right: 12px; } .new_table .sub_line a { color: white; font-weight: normal; font-size: 10px; } .new_table .sub_line a:hover { color: #ee5627; } .new_table .weight_class { font-size: 10px; color: #9b9b9b; padding-top: 2px; display: inline-block; /*white-space: nowrap;*/ } .new_table .title_fight { font-size: 11px; color: #fcc300; display: block; font-weight: bold; margin-top: -18px; margin-bottom: 5px; position: relative; /*padding-bottom: 4px; */} /*prevent last column from breaking*/ .table_head .col_six { word-break: normal; } /* Search */ .search .section-title { padding: 0 10px; background: #151515; } .search .section-title .yellow-title h3 { margin-top: 12px; margin-bottom: 7px; } .img_list { background: #151515; padding: 20px; } .img_grid { display: grid; grid-template-columns: repeat(auto-fill, calc(25% - 10px)); grid-gap: 10px; } .img_grid a { background: #333; display: flex; } .img_grid a:before { content: ""; display: block; height: 0; width: 0; padding-bottom: calc(9/16 * 100%); } .img_grid a img { min-width: 100%; max-width: 100%; min-height: 100%; max-height: 100%; object-fit: cover; } .picture_big img { width: 100%; } .picture_details h2 { color: #fff; font-size: 29px; font-weight: bold; display: block; line-height: 1.1; margin: 0; margin-bottom: 10px; } .picture_credit { font-size: 10px; margin-bottom: 10px; text-align: right; } .picture_copy_code { display: flex; } .picture_copy_code span { margin-right: 10px; } .picture_copy_code input { flex-grow: 1; border: 0; background-color: #ccc; padding: 0 6px; } ul.ui-autocomplete { background: #202022; border: solid 1px #333; width: 400px; max-width: 90%; padding: 3px 0 0 0; } ul.ui-autocomplete.ui-menu { z-index:1000 !important; box-shadow: 3px 3px 10px 6px rgba(0,0,0,0.5); } ul.ui-autocomplete .ui-menu-item a { min-height: 37px; display: block; border: none; padding: 0; cursor: pointer; } ul.ui-autocomplete .ui-menu-item a span { font-size: 13px; line-height: 32px; padding-left: 5px; } ul.ui-autocomplete .ui-menu-item td { vertical-align:middle !important; } ul.ui-autocomplete .ui-menu-item a:hover, ul.ui-autocomplete.ui-menu .ui-menu-item a.ui-state-hover, ul.ui-autocomplete.ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; background: #333; min-height: 37px; border: none; padding: 0;} ul.ui-autocomplete-loading { background:url(/img/w/autocomplete_loading.gif) right 8px center no-repeat; } /* Event */ .event_detail { /*text-align: center;*/ color: #fff; margin-bottom: 15px; } .event_detail h1 { font-family: 'Fira Sans', Arial; font-size: 28px; font-weight: 800; text-transform: uppercase; font-style: italic; margin-bottom: 4px; line-height: 1.1; } .event_detail .organization a { color: #ff7800; font-size: 18px; font-weight: bold; } .event_detail .organization a:hover { color: white; } .event_detail .info { text-transform: uppercase; margin-top: 5px; margin-bottom: 10px; font-size: 13px; display: flex; width: 100%; } .event_detail .info>span:first-child { margin-right: 30px; white-space: nowrap; } .event_detail .info>span:nth-child(2) { display: flex; } .event_detail .info img { margin-right: 3px; margin-top: 2px; } .event_detail .share { display: flex; margin-top: 15px; } .event_detail .share>div { margin-left: auto; } .fight_card { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; } .fight_card .pbp_button { color: #ff7800; border: 2px solid #ff7800; padding: 5px 13px; font-weight: bold; font-size: 15px; white-space: nowrap; } .fight_card .pbp_button:hover { color: #fff; border-color: #fff; } .fight_card .versus { display: flex; flex-direction: column; color: #fcc300; text-align: center; align-items: center; margin: 0 10px; } .fight_card .versus .pbp_placeholder { height: 30px; } .fight_card .versus .weight_class { text-transform: uppercase; margin-top: -20px; margin-bottom: 30px; font-weight: bold; font-size: 20px; } .fight_card .versus b { font-size: 30px; line-height: 1; font-weight: bold; } .fight_card .versus img { margin: 35px 0; max-width: 90%; } .fight_card .versus .title_fight { font-size: 22px; line-height: 1; font-weight: bold; padding-top: 6px; margin-bottom: -8px; } .fight_card .fighter { background: #2d2e33; width: 200px; /*height: 430px;*/ position: relative; text-align: center; flex-shrink: 0; max-width: 37%; padding-bottom: 26px; } .fight_card .fighter img { height: 300px; width: 100%; object-fit: cover; } .fight_card .fighter h3 { height: 77px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 7px; } .fight_card .fighter h3 a { color: #fcc300; text-transform: uppercase; } .fight_card .fighter h3 a.break { /*line-break: anywhere;*/ line-height: 1; } .fight_card .fighter .record { color: #999; text-transform: uppercase; font-size: 15px; padding: 0 5px; } .fight_card .final_result { position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%); font-size: 20px; } .fight_card_resume { width: 100%; background: #2d2e33; } .fight_card_resume tr td { padding: 8px 5px; text-align: center; color: #edecf1; font-size: 16px; border-right: 1px solid #34353a; } .fight_card_resume tr td:last-child { border-width: 0; } .fight_card_resume tr td em { color: #858688; text-transform: uppercase; font-size: 10px; margin-bottom: 8px; display: inline-block; } .fighter_list { display: flex; /*flex-wrap: wrap; justify-content: center;*/ } .fighter_list img { width: 44px; height: 44px; -webkit-mask: url(/img/new/profile_mask.svg); -webkit-mask-size: cover; mask: url(/img/new/profile_mask.svg); mask-size: cover; margin-top: 5px; } .fighter_list.left { flex-direction: row-reverse; } .fighter_list.left .fighter_result_data { text-align: right; margin-right: 5px; } .fighter_list.right .fighter_result_data { text-align: left; margin-left: 5px; } .fighter_list .final_result { margin-top: 3px; padding-bottom: 4px; } .new_table.result tr td:nth-child(3) { width: 1px; padding-left: 0; padding-right: 0; } .new_table.result tr td:nth-child(1), .new_table.result td.col_two { text-align: center; max-width: 25px; /*padding-right: 0;*/ } .new_table.result tr td:nth-child(3) img { margin-bottom: -3px; } .new_table.result td.col_four, .new_table.result tr td:nth-child(6) { text-align: center; padding-right: 12px; /*max-width: 36px; */} .new_table.result tr:not(.table_head) td:nth-child(3) { padding-top: 26px; vertical-align: top; } .new_table.result .col_fc_upcoming { vertical-align: top!important; } .new_table tr td.winby { font-size: 10px; } .new_table tr td.winby b { font-size: 14px; font-weight: bold; /*line-height: 1.4; */} .new_table tr td .sub_line { display: inline-block; padding-top: 4px; } .new_table.upcoming { table-layout: fixed; } .new_table.upcoming tr td:nth-child(3) { width: 62px; padding-left: 0; padding-right: 0; } .new_table.upcoming tr td:nth-child(1), .new_table.upcoming tr td:nth-child(5) { text-align: center; width: 50px; } .new_table.upcoming span.record { display: inline-block; color: #999; font-size: 10px; padding-top: 2px; } .new_table.upcoming .col_fc_upcoming { vertical-align: top!important; } .new_table.upcoming tr:not(.table_head) td:nth-child(3) { padding-top: 26px; vertical-align: top; } .new_table.upcoming tr td:nth-child(3) img { margin-bottom: -3px; } .new_table.refmatches tr td:nth-child(3) { width: 1px; padding-left: 0; padding-right: 0; } .new_table.refmatches tr td:nth-child(1), .new_table.refmatches tr td:nth-child(6) { text-align: center; padding-right: 12px; /*max-width: 36px; */} .new_table.refmatches td.col_two { text-align: center; } .new_table.refmatches tr td:nth-child(3) img { margin-bottom: -3px; margin-top: -2px; } .new_table.refmatches tr td:nth-child(3) .title_fight { margin-top: -10px; } /* All Access */ .more_allaccess { display: flex; justify-content: space-between; flex: 1 1 0px; } .more_allaccess>a { display: inline-block; border-bottom: 6px solid #ee5627; width: 49.2%; height: 85px; background: #111; font-size: 15px; transition: transform 0.2s; background-size: cover; background-position: center; position: relative; } .more_allaccess>a:first-child { background-image:url(/img/new/all_access_watch_bg.jpg);} .more_allaccess>a:last-child { background-image:url(/img/new/all_access_listen_bg.jpg);} .more_allaccess>a div { width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; } .more_allaccess img { max-height: 55%; margin-left: 10px; } .allaccess_columns { display: flex; justify-content: space-between; flex: 1 1 0px; margin-bottom: 14px; } .allaccess_columns>a { background-color: #111; width: 32%; text-align: center; display: flex; flex-direction: column; transition: transform 0.2s; } .allaccess_columns>a img { max-width: 90%; max-height: 50%; } .allaccess_columns>a div.top { height: 170px; display: flex; align-items: center; justify-content: center; background-size: cover; filter: saturate(0); position: relative; } .allaccess_columns>a div.top div { display: flex; align-items: center; justify-content: center; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); } .allaccess_columns>a div.bot { background-color: #ee5627; color: #fff; padding: 10px 0; flex-grow: 1; } .allaccess_columns>a div.bot h2 { color: #fff; text-transform: uppercase; font-size: 26px; font-weight: bold; margin: 0; } .allaccess_columns>a div.bot h3 { color: #fff; text-transform: uppercase; font-size: 15px; font-weight: normal; margin: 0; } .allaccess_columns>a:hover, .more_allaccess>a:hover { transform: scale(1.03); } /* Tag banner */ .tagger { background-color: #ee5627; width: 100%; box-sizing: border-box; margin-bottom: 10px; text-transform: uppercase; position: relative; } .tagger .tag { padding: 10px; } .tagger .tag h3 { margin-bottom: 0px; font-size: 26px; } .tagger .tag h3 img { vertical-align: top; margin-right: 10px; } .tagger .tag h3 img.with_banner { filter: invert(1); } .tagger .banner { width: 100%; height: 100%; position: absolute; } .tagger .banner img { width: 100%; height: 100%; position: absolute; object-fit: cover; } .tagger .banner:after { content: ""; display: block; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); position: absolute; } /* Homepage featured box */ #featured_box { display: flex; align-items: center; justify-content: space-between; background: black; max-width: 100%; color: white; text-decoration: none; font-family: 'Fira Sans'; font-weight: 800; width: 100%; margin-bottom: 10px; } #featured_box .what { flex-shrink: 0; background: #c4001c; font-size: 28px; font-weight: bold; white-space: nowrap; line-height: 1; font-style: italic; padding: 15px; padding-right: 20px; display: flex; align-items: center; align-self: stretch; text-transform: uppercase; box-sizing: border-box; } #featured_box .title { padding: 10px; line-height: 1.2; font-size: 18px; padding-left: 18px; } #featured_box .img { position: relative; align-self: stretch; width: 200px; overflow: hidden; } #featured_box .img img { object-fit: cover; position: absolute; right: 0; width: auto; height: 100%; object-fit: cover; } /* Radio ONAIR notification */ #live_event_placeholder { width: 100%; } #live_event { border-bottom: 3px solid #ee5527; display: flex; align-items: center; font-family: 'Fira Sans'; text-decoration: none; background: #151515; max-width: 100%; margin-bottom: 10px; } #live_event .aircounter { background: #ee5527; padding: 5px 30px 2px; color: white; font-size: 12px; display: flex; align-items: center; align-self: stretch; line-height: 1; white-space: nowrap; } #live_event .aircounter em { margin-right: 5px; } #live_event .aircounter img { margin-right: 6px; height: 18px; } #live_event .airdescription { color: #ffc000; padding: 5px 10px 5px 20px; font-size: 15px; text-transform: uppercase; } #live_event .airdescription b { color: white; margin-right: 7px; font-size: 15px; } #live_event:hover .airdescription { color: #ee5527; } /* Our sharing Facebook/Twitter */ .our_sharing { width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; } .our_sharing .or-button-facebook, .our_sharing .or-button-twitter { width: calc(50% - 10px); color: white; font-size: 15px; line-height: 36px; text-align: center; position: relative; font-family: Roboto, Arial; cursor: pointer; } .our_sharing span { display: inline-block; width: 25px; height: 25px; background:url(/img/social_icons_fb_twitter.svg) no-repeat center center; background-size: cover; background-position: center 100%; vertical-align: middle; margin-top: -3px; margin-right: 3px; } .our_sharing .or-button-twitter span { background-position: center 0%; } .our_sharing .or-button-facebook { background: #3b5998; border-color: #1d3567; } .our_sharing .or-button-twitter { background: #00aced; border-color: #0589bb; } .our_sharing .or-button-facebook:hover { background: #6D84B4; } .our_sharing .or-button-facebook:hover:after { border-top-color: #6D84B4; } .our_sharing .or-button-twitter:hover { background: #0084B4; } .our_sharing .or-button-twitter:hover:before { border-bottom-color: #0084B4; } #the_article .our_sharing { width: 98%; margin: 8px auto 3px auto; flex-wrap: wrap; } #the_article .our_sharing .or-button-facebook, #the_article .our_sharing .or-button-twitter { width: 100%; margin: 2px 0; } .our_sharing .or-button-facebook:after { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: 0; left: 100%; border-top: 36px solid #3b5998; border-right: 9px solid transparent; } .our_sharing .or-button-twitter:before { content: ""; position: absolute; display: block; width: 0%; height: 100%; top: -36px; right: 100%; border-bottom:36px solid #00aced; border-left:9px solid transparent; } /* Various */ img.spns { display: block; margin: 0 0 10px 0; max-width: 90%; } section { margin-bottom: 40px; } section.mg20 { margin-bottom: 20px; } ol, ul { list-style: none; } .message { padding: 20px; line-height: 1.5;} .more_info { margin-bottom: 35px; font-size: 15px; padding-left: 4px; } .no_events { display: flex; align-items: center; justify-content: center; padding: 60px 0; font-size: 14px; } .body_content img { max-width: 100%; } #geo-loading { background: #151515; padding: 25px 0; } /*https://projects.lukehaas.me/css-loaders*/ .loader, .loader:after { border-radius: 50%; width: 2.5em; height: 2.5em; } .loader { margin: auto; font-size: 10px; position: relative; text-indent: -9999em; border-top: 6px solid rgba(255, 255, 255, 0.2); border-right: 6px solid rgba(255, 255, 255, 0.2); border-bottom: 6px solid rgba(255, 255, 255, 0.2); border-left: 6px solid #ffffff; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear; } .loader-small { border-radius: 50%; width: 0.7em; height: 0.7em; display: inline-block; visibility: hidden; margin: auto; font-size: 10px; position: relative; text-indent: -9999em; border-top: 3px solid rgba(255, 255, 255, 0.2); border-right: 3px solid rgba(255, 255, 255, 0.2); border-bottom: 3px solid rgba(255, 255, 255, 0.2); border-left: 3px solid #ffffff; } .loader-small.active, .more.loading .loader-small { visibility: visible; -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear; } .text_center { text-align: center; } .pbp_btn { background: #ee5627; color: white!important; font-weight: normal; font-size: 11px!important; display: inline-block; padding: 2px 6px; margin-top: 5px; } .pbp_btn:hover { opacity: 0.8; } #poll-embed { margin: 10px 0; display: block; } @-webkit-keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .big-country-flag{ width: 16px; height: 14px; } /* Referee */ .total-fights { display: inline-block; border: 2px solid #ffc000; font-size: 16px; margin-bottom: 20px; } .total-fights b { background: #ffc000; color: black; font-weight: bold; padding: 2px 10px; display: inline-block; } .total-fights span { color: white; padding: 2px 10px; } .referee-stats { display: flex; flex-wrap: wrap; justify-content: space-between; } .referee-stats .meter-holder { width: 33%; } .referee-stats-holder { margin: 7px; margin-top: 15px; } /* Privacy, Terms of use... */ .normaluls ul { list-style: disc outside !important; } .normaluls ol { list-style: number !important; } .normaluls ul, .normaluls ol { margin: 20px; margin-bottom: 30px; } .big-table-holder { max-width: 100%; overflow: auto; margin-bottom: 30px; } /*.third-party tr td:nth-child(3), .third-party tr td:nth-child(5) { text-overflow: ellipsis; overflow: hidden; }*/ /*.normaluls li { border-width: 0px !important;display: list-item !important;margin-bottom: 0px !important;padding: 4px 0px !important;overflow: initial !important; }*/ /* Polls */ #poll-title { font-size: 12px; font-weight: bold; color: #f2f2f2; line-height: 1.6; padding: 8px 10px; margin-bottom: 10px; text-transform: uppercase; } #poll-vote>div { padding: 10px; text-transform: uppercase; cursor: pointer; color: #fff; margin: 5px -8px; } #poll-vote>div.selected { background-color: #ee5627; } #poll-vote>div span { padding-left: 36px; display: inline-block; } #poll-vote>div em { border: 1px solid #f2f2f2; border-radius: 50%; width: 10px; height: 10px; } #poll-vote>div span:before { content: ''; border: 2px solid #afafb1; border-radius: 50%; width: 6px; height: 6px; display: inline-block; margin-top: 2px; margin-left: -20px; position: absolute; } #poll-vote>div.selected span:before { border-color: #afafb1; background-color: #ffffff;} #poll-results .poll_line { padding: 8px 15px; display: flex; justify-content: space-between; color: #f0f0f0; text-transform: uppercase; margin-bottom: 10px; } #poll-results .poll_line>div:nth-child(2) { margin-left: 10px; } #poll-results .poll_total { text-align: right; margin-bottom: 8px; font-weight: bold; color: #f2f2f2; } /* Various */ a.fow img { width: 100%; aspect-ratio: 16/5; object-fit: cover; margin-top: -5px; } a.fow div { text-align: center; margin-bottom: 10px; color: white; margin-top: 3px; font-size: 20px; font-weight :bold; text-transform: uppercase; } div[id^="div-insticator-ad-cmt"] { margin: 5px; padding: 5px; } .podcast-subscribe { display: block; width: 100%; background: #151515; border-bottom: 3px solid #b80607; margin-bottom: 10px; font-family: 'Fira Sans', Arial; font-size: 15px; font-weight: bold; text-transform: uppercase; } .podcast-subscribe span { background: #b80607; line-height: 1; padding: 5px 15px 2px; display: inline-block; } .podcast-subscribe img { height: 14px; vertical-align: middle; margin-top: -2px; margin-right: 4px; } .podcast-subscribe:hover { border-color: #ffc000; } .podcast-subscribe:hover span { background: #ffc000; color: black; } .podcast-subscribe:hover img { filter: brightness(0); } .espn_plus { display: block; font-size: 15px; color: #ee5627; font-weight: bold; margin-top: 5px; } .espn_plus img { height: 18px; vertical-align: middle; } .espn_plus:hover { opacity: 0.8; } .espn_plus.espn-smaller { color: #f9b300 !important; font-size: 13px !important; margin-top: 7px; } .espn_plus.espn-smaller img { height: 15px; } @media screen and (min-width: 1px) and (max-width: 990px) { .espn_plus:not(.espn-smaller) { margin: 10px 14px; } } /* --------------------------------------------- MOBILE ------------------------------------------------*/ @media screen and (min-width: 1781px) { header .top-menu { margin-right: 0; position: fixed; left: 50%; margin-left: 0; transform: translateX(-52%); } header .socials { margin-left: auto; margin-right: 90px; } } @media screen and (min-width: 1px) and (max-width: 1780px) { header .socials { display: none; } } @media screen and (min-width: 1px) and (max-width: 990px) { .fighter-info { flex-direction: column; } .fighter-info .fighter-right { width: 100%; } .fighter-info .profile-image { display: none; } .fighter-info .profile-image-mobile { display: block; } .new_table.refmatches tr td:nth-child(6), .new_table.refmatches tr td:nth-child(7) { display: none; } } @media screen and (min-width: 801px) and (max-width: 950px) { .new_table.result tr td:nth-child(1), .new_table.result tr td:nth-child(6), .new_table.result tr td:nth-child(7) { display: none; } .new_table.refmatches tr td:nth-child(5) { display: none; } } @media screen and (min-width: 800px) and (max-width: 1000px) { .fight_card .pbp_button { font-size: 12px; white-space: normal; } .fight_card .versus .weight_class { font-size: 11px; /*word-break: break-all;*/ } } @media screen and (min-width: 1px) and (max-width: 800px) { .col-left { width: 100%; max-width: 100%; padding-right: 0; } .col-right { width: 100%; } .right-module.ads { text-align: center; } .all-access-videos .slider .left { left: -10px; } .all-access-videos .slider .right { right: -10px; } .left-article-module>div .desc { flex-direction: column; } .left-article-module>div .desc .thumb { margin-right: 0; width: 100%; } .naonu-sponsoredslicicu { margin-top: -9px; } .fb-widget.module { text-align: center; } div.wrapper { padding: 0; } .top_ads { margin-top: 10px; } .latest_features .slanted_box { width: 100%; height: auto; line-height: 1.1; } .latest_features .slanted_box:after { display: none; } #homepage-cover .first-row .cover { position: relative; width: calc(60% - 10px); } #homepage-cover .first-row .card-cover { width: 40%; } #homepage-cover .first-row .cover .title { max-width: 75%; } } @media screen and (min-width: 1px) and (max-width: 700px) { #featured_box .what { font-size: 20px; } footer .footer-menu-links li { width: 33%; } } @media screen and (min-width: 1px) and (max-width: 600px) { .fighter-data { flex-direction: column; } .fighter-data .bio-holder table { margin-right: auto; margin-left: auto; margin-bottom: 30px; min-width: 300px; } .fighter-data .association-class { text-align: center; margin-bottom: 35px; margin-top: 0; border-bottom: 1px solid #555; padding-bottom: 16px; } .winsloses-holder { justify-content: space-between; min-width: 284px; /* try to match table width */ margin: auto; } .fighter-title .fighter-line2 { flex-direction: column; align-items: initial; } .fighter-title .fighter-line2 .share { margin-left: initial; margin-top: 8px; } .fighter-title .fighter-line1 { flex-direction: column; } .fighter-title .fighter-line1 h1 { order: 2; } .fighter-title .fighter-flag-social { max-width: initial; } .event_detail .share>div { margin-left: initial; } .fighter_list.left .fighter_result_data, .fighter_list.right .fighter_result_data {margin:0; width: 100%; text-align: center;} .img_grid { grid-template-columns: repeat(auto-fill, calc(50% - 10px)); } .new_table.result tr { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; } .new_table.result tr td { box-sizing: border-box; } .new_table.result tr td:nth-child(2) { width: 42.5%; text-align: center; } .new_table.result tr td:nth-child(3) { width: 15% !important; align-self: center; } .new_table.result tr td:nth-child(3) img { object-fit: contain; } .new_table.result tr td:nth-child(4) { width: 42.5%; } .new_table.result tr td:nth-child(1) { width: 15%; padding-top: 0 !important; text-align: center; order: 4; } .new_table.result tr td:nth-child(5) { width: 35%; padding-top: 0 !important; text-align: center; } .new_table.result tr td:nth-child(6) { width: 15%; padding-top: 0 !important; text-align: center; } .new_table.result tr td:nth-child(7) { width: 25%; padding-top: 0 !important; text-align: center; } .new_table.result tr td:nth-child(1):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "MATCH"; } .new_table.result tr td:nth-child(5):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "METHOD"; } .new_table.result tr td:nth-child(6):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "ROUND"; } .new_table.result tr td:nth-child(7):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "TIME"; } .new_table.result tr.table_head .col_one, .new_table.result tr.table_head .col_three, .new_table.result tr.table_head .col_four, .new_table.result tr.table_head .col_five, .new_table.result tr.table_head .col_six { display: none; } .new_table.upcoming tr td:nth-child(1), .new_table.upcoming tr td:nth-child(5) { display: none; } .new_table.fightfinder_result tr { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; } .new_table.fightfinder_result tr td { box-sizing: border-box; } .new_table.fightfinder_result tr td:nth-child(1) { width: 65px; } .new_table.fightfinder_result tr td:nth-child(2) { width: calc(60% - 35px); } .new_table.fightfinder_result tr td:nth-child(3) { width: calc(40% - 30px); } .new_table.fightfinder_result tr td:nth-child(4) { width: 33%; padding-top: 0 !important; text-align: center; } .new_table.fightfinder_result tr td:nth-child(5) { width: 33%; padding-top: 0 !important; text-align: center; } .new_table.fightfinder_result tr td:nth-child(6) { width: 33%; padding-top: 0 !important; text-align: center; } .new_table.fightfinder_result tr td:nth-child(4):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "HEIGHT"; } .new_table.fightfinder_result tr td:nth-child(5):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "WIDTH"; } .new_table.fightfinder_result tr td:nth-child(6):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "ASSOCIATION"; } .new_table.fightfinder_result tr.table_head .col_one { width: calc(60% + 25px) } .new_table.fightfinder_result tr.table_head .col_two { width: 50px; } .new_table.fightfinder_result tr.table_head .col_three, .new_table.fightfinder_result tr.table_head .col_four, .new_table.fightfinder_result tr.table_head .col_five { display: none; } .new_table.refmatches tr td:nth-child(5) { display: none; } #homepage-cover .first-row .cover .title img { display: none; } #homepage-cover .first-row .cover .title { width: 100%; max-width: 100%; bottom: 0; } #homepage-cover .first-row .cover:hover .title>div, #homepage-cover .first-row .cover:hover .title>img { transform: translateY(0px); } .article .info { flex-direction: column-reverse; } .referee-stats .meter-holder { width: 50%; } #inquires { grid-template-columns: repeat(2, 1fr); } #inquires div:first-child { grid-column: 1 / span 2; } #inquires div:nth-child(2) { display: none; } } @media screen and (max-width:540px) { /*#div-insticator-ad-cmt-1, #div-insticator-ad-cmt-2{ min-height:280px!important; margin-top:20px!important; margin-bottom:20px!important; }*/ #siq_mobile .siq_searchicon { display:none!important; } } @media screen and (min-width: 1px) and (max-width: 500px) { .allaccess_columns { flex-direction: column; } .allaccess_columns>a { width: 100%; margin-bottom: 13px; } .more_allaccess>a span { max-width: 60%; text-align: right; } #homepage-cover { width: 100%; } #homepage-cover .first-row { flex-direction: column; } #homepage-cover .inline-four { flex-direction: column; } #homepage-cover .inline-four>a { margin: 0 0 8px 0; } #homepage-cover .first-row .cover { width: 100%; margin-bottom: 8px; } #homepage-cover .first-row .cover .title { position: initial; font-size: 20px; } #homepage-cover .first-row .cover .title>div { padding: 15px 20px; background: #b70606; width: 100%; } #homepage-cover .first-row .cover>img { height: auto; vertical-align: bottom; } #homepage-cover .first-row .card-cover { width: 100%; } #homepage-cover .card-cover .title, #homepage-cover .card .title { font-size: 18px; } #homepage-cover .card>img:first-child { height: 210px; } #live_event .aircounter { padding-left: 20px; padding-right: 20px; } #featured_box { flex-wrap: wrap; position: relative; } #featured_box .what { width: 100%; padding: 10px; z-index: 2; } #featured_box .title { z-index: 2; padding-left: 10px; } #featured_box .img { position: absolute; height: calc(100% - 30px); width: 50%; right: 0; bottom: 0; opacity: 0.3; } .our_sharing b { display: none; } footer .footer-menu-links li { width: 50%; } footer .footer-logoline .logo { margin-bottom: 15px; } footer .footer-logoline { flex-direction: column; align-items: flex-start; } footer .footer-socials img { margin: 0 10px 0 0; } footer .footer-copyright { flex-direction: column; align-items: flex-start; } footer .footer-evolve { margin-bottom: 20px; border-right: 0; } } @media screen and (min-width: 1px) and (max-width: 420px) { /* fighter history table */ .new_table.fighter tr { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; } .new_table.fighter tr td { box-sizing: border-box; } .new_table.fighter tr td:nth-child(1) { width: 25%; text-align: center; } .new_table.fighter tr td:nth-child(2) { width: 25%; text-align: center; } .new_table.fighter tr td:nth-child(3) { width: 50%; } .new_table.fighter tr td:nth-child(4) { width: 50%; padding-top: 0 !important; order: 1; } .new_table.fighter tr td:nth-child(5) { width: 25%; padding-top: 0 !important; text-align: center; } .new_table.fighter tr td:nth-child(6) { width: 25%; padding-top: 0 !important; text-align: center; } .new_table.fighter tr td:nth-child(4):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "METHOD/REFEREE"; } .new_table.fighter tr td:nth-child(5):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "ROUND"; } .new_table.fighter tr td:nth-child(6):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "TIME"; } .new_table.fighter tr.table_head .col_four, .new_table.fighter tr.table_head .col_five, .new_table.fighter tr.table_head .col_six { display: none; } .new_table.event tr { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; align-items: center; } .new_table.event tr td { box-sizing: border-box; } .new_table.event tr.table_head td:nth-child(4) { display: none; } .new_table.event tr td:nth-child(1) { width: 50px; padding-left: 10px; } .new_table.event tr td:nth-child(1) img { height: 30px; } .new_table.event tr td:nth-child(2) { width: calc(50% - 30px); } .new_table.event tr td:nth-child(3) { width: calc(50% - 30px); } .new_table.event tr td:nth-child(4) { width: 100%; padding-top: 0; } .new_table.refmatches tr { display: flex; flex-wrap: wrap; width: 100%; box-sizing: border-box; } .new_table.refmatches tr td { box-sizing: border-box; } .new_table.refmatches tr td:nth-child(1) { display: block; width: 100%; padding: 10px; } .new_table.refmatches tr td:nth-child(2) { display: block; padding-top: 5px; width: calc(50% - 30px); } .new_table.refmatches tr td:nth-child(3) { display: block; padding-top: 5px; width: 60px; text-align: center; } .new_table.refmatches tr td:nth-child(4) { display: block; padding-top: 5px; width: calc(50% - 30px); } .new_table.refmatches tr td:nth-child(5) { display: block; padding-top: 0; width: 50%; text-align: center; } .new_table.refmatches tr td:nth-child(6) { display: block; padding-top: 0; width: 25%; text-align: center; } .new_table.refmatches tr td:nth-child(7) { display: block; padding-top: 0; width: 25%; } .new_table.refmatches tr td:nth-child(5):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "METHOD/REFEREE"; } .new_table.refmatches tr td:nth-child(6):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "ROUND"; } .new_table.refmatches tr td:nth-child(7):before { display: block; color: #999; font-size: 9px; margin-bottom: 4px; content: "TIME"; } .zend_form dd, .zend_form dt { float: none; width: 100%; text-align: left; box-sizing: border-box; } .zend_form dd { margin-bottom: 12px; } .zend_form label { white-space: nowrap; } .zend_form input[type='text'] { width: 100%; box-sizing: border-box; } .zend_form input[type='submit'] { margin-left: 0; } .zend_form .g-recaptcha { margin-left: 0!important; } .left-module.fight-finder #weights-associations { flex-direction: column; } .left-module.fight-finder #weights-associations>div { width: unset; } .left-module.fight-finder #weights-associations>div:first-child { margin-bottom: 15px; } .left-module.fight-finder #organization-button>div:first-child, .left-module.fight-finder #fighter-pictures-search>div:first-child { width: calc(98% - 80px); } .left-module.fight-finder input[type=submit] { min-width: 80px; } .search_404 { flex-direction: column; } .search_404 input[type=text] { width: unset; margin-bottom: 6px; } .picture_copy_code { flex-direction: column; } .picture_copy_code input { padding: 5px 6px; } .fight_card { flex-wrap: wrap; } .fight_card .fighter { height: 350px; max-width: 48%; } .fight_card .fighter img { height: 220px; } .fight_card .versus { order: 3; width: 100%; margin-top: 50px; } .fight_card .versus img { display: none; } .fight_card .versus .weight_class { margin-top: 0; margin-bottom: 20px; } .fight_card .versus .pbp_placeholder { display: none; } #live_event .aircounter { padding-left: 10px; padding-right: 10px; } .top_coverpanel .titles .blurb { display: none; } } @media screen and (min-width: 1px) and (max-width: 420px) { #theme-switch { display: none; } .podcast-subscribe { font-size: 13px !important; } } /* TOPNAV */ /* header .top-menu a:nth-child(11) { display: none; } header .sub-menu.more a { display: none; } header .top-menu a:nth-child(8) { display: none; } header .top-menu a:nth-child(11) { display: initial; } header .sub-menu.more a:nth-child(6) { display: block; } header .sub-menu.more a:nth-child(5) { display: block; } */ header .top-menu { margin-right: 100px; } @media screen and (min-width: 1px) and (max-width: 1360px) { header .top-menu { margin-right: 0; } } @media screen and (min-width: 1px) and (max-width: 1240px) { header .top-menu a:nth-child(10) { display: none; } } @media screen and (min-width: 1px) and (max-width: 1160px) { header .top-menu a:nth-child(9) { display: none; } } @media screen and (min-width: 1px) and (max-width: 1060px) { header .top-menu a:nth-child(8) { display: none; } } @media screen and (min-width: 1px) and (max-width: 1000px) { header .top-menu a:nth-child(7) { display: none; } } @media screen and (min-width: 1px) and (max-width: 950px) { header .top-menu a:nth-child(6) { display: none; } } @media screen and (min-width: 1px) and (max-width: 900px) { header .top-menu a:nth-child(5) { display: none; } } @media screen and (min-width: 1px) and (max-width: 800px) { .top-menu { display: none; } } /* --------------------------------------------- LIGHT ------------------------------------------------*/ html.light body { background: #f5f5f5; } html.light div.wrapper { background: #dfdfdf; } html.light #homepage-cover .card { background: #f5f5f5; } html.light #homepage-cover .card:hover .title { color: #444; } html.light .card { background: #f5f5f5; } html.light .card .title { color: #141414; } html.light .left-article-module { background-color: #fff; color: #1b1b1b; } html.light .left-article-module>div a.title { color: #131313; } html.light #theme-switch { opacity: 1; } html.light .pagination { background: #ffffff; } html.light .pagination a:hover { color: #444; } html.light .new_table tr:not(.table_head) td { color: #000; } html.light .new_table tr:nth-child(even):not(.table_head) { background: #ffffff; } html.light .new_table tr:nth-child(odd):not(.table_head) { background: #c3c3c3; } html.light .new_table td a:hover { color: #000; } html.light .new_table .sub_line a { color: #000; } html.light .new_table .sub_line a:hover { color: #ee5627; } html.light .new_table.event tr:hover a { color: initial; } html.light .new_table .weight_class { color: #111; } html.light .new_table .title_fight { color: #FF7F00; } html.light .new_table.result tr td:nth-child(3) img { filter: brightness(60%); } html.light .new_table.upcoming span.record { color: #000; } html.light .new_table.upcoming tr td:nth-child(3) img { filter: invert(1); } html.light .article { background-color: #fff; color: #1b1b1b; } html.light .article .header h1 { color: #000; } html.light .tools_list>a { color: #1b1b1b; } html.light .archive, html.light .archive a:not(:hover) { color: #2d2d2d; } html.light #playbyplay .list-links { background: #2c2c32; } html.light #playbyplay .event:nth-child(even) { background: #eee; border-color: #ccc; } html.light .picture_details h2 { color: #1b1b1b; } html.light .more_info, html.light .more_info a { color: #1b1b1b; } html.light #get_in_touch b { color: black; } /* -- google search console fixes -- */ /* images on mobile bigger thant screen */ .big_picture img { width: 100%; object-fit: cover; }