@media only screen and (max-width: 600px) {
    /* Styles for smartphones */
  }

@media only screen and (min-device-width:1200px) {
    .post table.sticky-table-header {
        overflow-y: initial
    }
    table.sticky-table-header thead {
        position: sticky;
        top: 65px;
        z-index: 2;
        border-radius: 15px
    }
    table.sticky-table-header thead th {
        display: table-cell
    }
    table.sticky-table-header thead th:first-child {
        border-top-left-radius: 15px
    }
    table.sticky-table-header thead th:last-child {
        border-top-right-radius: 15px
    }
    #menunav.showmenow {
        display: flex;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex
    }
    .visible-tablet,
    .visible-xm,
    .visible-xs,
    .post img.visible-xs,
    a.button.visible-xs,
    .author-socials.visible-xs {
        display: none
    }
}

@media only screen and (max-device-width:1199px) {
    #contentwrap,
    .headcontents,
    .topbar-content,
    .footergrid,
    .footer-risk-warning-text,
    #content,
    #content.casino-content,
    #content.kouponi-opap,
    #content.tziroi-betfair,
    #content.oddscontent,
    #footer {
        width: 100%
    }
    .post,
    #sidebar2wrap {
        max-width:710px
    }
    #sidebar2wrap {
        padding: 20px;
        width: 100%;
        box-sizing: border-box
    }
    #content {
        margin: 0
    }
    .post {
        padding: 20px
    }
    .hover-border-from-left:after,
    .menu-item:after,
    .current-menu-item:after,
    .hover-border-table-row tr:after,
    .post p a:not([class]):after,
    .widget_text p a:not([class]):after,
    .hover-border-from-top-left:before,
    .sub-menu .menu-item:before,
    .hover-border-from-top-left-ul li:before,
    .hover-border-from-top-right:before,
    #header .hidden-xs,
    #topbarlinks,
    .custom-media.visible-xs {
        display: none
    }
    .post p a:not([class]),
    .widget_text p a:not([class]) {
        display: initial
    }
    .responsive-menu,
    .responsive-share {
        position: absolute;
        padding: 5px;
        border: 2px solid #f8a037;
        border-radius: 30px;
        width: 28px;
        height: 28px;
        text-align: center;
        line-height: 28px;
        font-size: 20px;
        top: 25px
    }
    .responsive-share {
        right: 20px
    }
    .responsive-menu {
        left: 20px
    }
    .responsive-menu.closebtn {
        background: #fff
    }
    .visible-mob.header-leagues-ticker {
        display:block;
    }
    #contentwrap {
        padding-top:80px;
    }
    #sidebar1wrap {
        display:none;
        position: fixed;
        top: 0;
        z-index: 100;
        width: 100%;
        margin: 0;
        height: 100%;
        padding: 30px 0;
        box-sizing: border-box;
        overflow-y: scroll;
    }
    #menunav .close-box {
        top: 20px;
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
    #menunav {
        display: none;
        height: 150vh;
        width: 100%;
        position: absolute;
        z-index: 10;
        top: 0px;
        left: 0;
        background-color: rgba(21, 21, 21, .8);
        transition: .5s
    }
    #menunav ul {
        width: 320px;
        background: #009E8B;
        float:right;
        height:100%;
        color:#fff;
        padding-top:80px
    }
    #menunav ul li {
        height: 55px
    }
    #menunav ul li a {
        padding: 0 30px;
        transition: .3s;
        font-size: 16px;
        line-height: 55px;
        border-top: 0;
        letter-spacing: .96px;
        white-space: nowrap
    }
    li.menu-item-has-children span {
        position: absolute;
        top: 0;
        width: 55px;
        height: 55px;
        right: 0;
        transition: transform .3s ease-in-out
    }
    #menunav ul li.menu-item-has-children .caret-down:after {
        top: 25px;
        right: 25px
    }
    #menunav ul.sub-menu li.menu-item-has-children .caret-right:after {
        right: 20px;
        top: 25px
    }
    #menunav ul .menu-item-has-children:hover ul,
    #menunav ul li.hidden-xs {
        display: none
    }
    #menunav ul .menu-item-has-children ul.active {
        display: inline-block;
        padding: 0;
        border-radius: 0;
        width: 100%
    }
    #menunav ul .menu-item-has-children ul.active li a {
        line-height: 55px;
        padding: 0 50px;
        border-bottom-color: #212121
    }
    #menunav li.current-menu-ancestor>a,
    #menunav li.current-menu-item>a {
        background-color: #00dbc1;
        color: #fff
    }
    .menu-item:hover:after,
    .current-menu-item:after {
        display: none
    }
    #menunav ul li.menu-search {
        height: 80px;
        line-height: 80px;
        border-bottom: 1px solid #2B2B2B
    }
    #menunav ul li.menu-item-has-children ul li.menu-item-has-children ul {
        left: 0;
        top: 100%;
        box-shadow: none;
        -webkit-box-shadow: none;
        background: #353535
    }
    #menunav ul li.menu-item-has-children ul li.menu-item-has-children ul li a {
        padding-left: 75px
    }
    #menunav ul .menu-item-has-children:hover .caret-down:after {
        transform: rotate(0deg);
        top: 25px
    }
    #menunav ul.sub-menu li.menu-item-has-children:hover .caret-right:after {
        transform: rotate(0deg);
        right: 20px
    }
    #menunav ul .menu-item-is-opened>span {
        transform: rotate(180deg)
    }
    .menu-search form {
        width: 75%
    }
    #social-icons-m {
        display: none;
        background: #FF8B00;
        border: 2px solid #fff;
        border-radius: 20px;
        position: absolute;
        top: 25px;
        right: 20px
    }
    #social-icons-m a {
        border: 0;
        font-size: 16px;
        color: #fff;
        width: 30px
    }
    #social-icons-m div {
        position: relative;
        padding: 7px 50px 7px 15px
    }
    #social-icons-m .closebtn {
        width: 40px;
        height: 40px;
        background: #fff;
        border-radius: 30px;
        display: block;
        position: absolute;
        top: -1px;
        right: 0;
        line-height: 40px;
        text-align: center;
        color: #f8a037;
        font-size: 20px;
        font-weight: 400
    }
    #head-content {
        background: #212121;
        position: relative;
        padding: 7px
    }
    .site-logo {
        float: none
    }
    .site-logo img {
        width: 170px;
        height: auto
    }
    .marquee3k,
    .tips-bar a.promo-ticker,
    .tips-bar a.tips-button {
        border-radius: 0
    }
    .tips-bar a.tips-button {
        padding: 0 12px
    }
    .tips-bar {
        margin-bottom: 0
    }
    .featured-article-content p {
        padding: 10px 0
    }
    .summary-left img {
        max-width: 100px
    }
    #ad_bg,
    #banner .mlbanner,
    #sidebar1 li.widget_text,
    #topbar,
    .hidden-xs,
    .visible-xm {
        display: none !important
    }
    #onesignal-bell-launcher {
        bottom: 50px !important;
        right: 0 !important
    }
    #sidebar1wrap li.widget {
        padding: 0;
    }
    #sidebar1wrap #nomimes {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 20px
    }
    #sidebar1wrap .roundsqback {
        width: 35px;
        height: 35px
    }
    #sidebar1wrap #nomimes li a {
        font: normal normal normal 11px/22px Open Sans;
        letter-spacing: .44px;
        text-transform: none;
        padding: 4px 10px 4px 0;
        line-height: 20px;
        text-indent: 39px
    }
    .isnew:after {
        font-size: 7px;
        padding: 0 5px
    }
    .custom-media-content img {
        max-width: 100px !important
    }
    .footer-menu li {
        display: block;
        margin-right: 0;
        text-align: center
    }
    .footer-menu a {
        font: normal normal bold 15px/18px Roboto;
        padding: 8px 0
    }
    .footer-menu {
        padding: 30px 0
    }
    .footer-risk-warning-text,
    .footergrid {
        width: 90% !important
    }
    .grid.one-third {
        width: 100%;
        margin-bottom: 30px
    }
    .bannermedium {
        width: 100%;
        overflow: hidden
    }
    .three-cols {
        width: 45%
    }
    .bottom_popup__mobile {
        display: block !important;
        width: 100%;
        height: 60px;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1001;
        background-color: #000;
        text-align: center;
        overflow: hidden
    }
    .league-tooltip:hover:after,
    .league-tooltip:hover:before {
        display: none
    }
    .scrollable-table {
        overflow-x: auto;
        margin: 30px 0
    }
    .scrollable-table .iscontentbox:first-child {
        margin-top: 0
    }
    .scrollable-table table {
        margin: 0
    }
    #odds-table.odds-table-single-article img {
        width: auto
    }
    #odds-table.predictor-table {
        width: 100%;
        float: none;
        margin-left: 0
    }
    #odds-table span.teamnames img,
    .vathmologies-table img.team-logo-standings {
        max-width: 24px
    }
    #content.tempgreekodds {
        width: 100%
    }
    .mobile-betslip {
        width: 48px;
        height: 48px;
        line-height: 56px;
        background: #f8a037;
        display: block;
        position: fixed;
        bottom: 100px;
        right: 20px;
        border-radius: 30px;
        box-shadow: 0 0 10px #00000096;
        border: 5px solid #EFAF63;
        color: #fff;
        z-index: 10
    }
    .mobile-betslip i {
        font-size: 23px
    }
    .mobile-betslip:after {
        content: attr(data-betslip-cnt);
        background: red;
        width: 20px;
        height: 20px;
        display: block;
        border-radius: 50%;
        line-height: 20px;
        position: absolute;
        top: -12px;
        right: 0
    }
    .tempgreekodds #sidebar2wrap {
        display: none;
        position: fixed;
        bottom: 125px;
        padding: 0;
        top: initial;
        width: calc(100% - 50px);
        z-index: 9;
        height: 65vh;
        left: 50%;
        transform: translateX(-50%)
    }
    .tempgreekodds #sidebar2wrap li.widget {
        padding: 20px 15px;
        background: #151515;
        height: calc(65vh - 40px)
    }
    #betslip span.clear-all {
        top: 20px
    }
    #betslip h2 {
        border-bottom: 0;
        margin-left: -14px
    }
    #betslip h2 a {
        float: right;
        width: 20px;
        height: 20px;
        background: #303030;
        line-height: 20px;
        border: 1px solid #404040
    }
    .betslip-content {
        height: calc(65vh - 230px);
        width: 100%
    }
    .betslip-results {
        margin-left: -20px;
        width: 100%;
        bottom: 60px
    }
    .betslip-results-content {
        background: #111;
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 190px;
        left: 0;
        margin: 0;
        box-sizing: border-box;
        border-radius: 0 0 20px 20px;
        padding: 30px 20px;
        -webkit-transition: height .8s ease;
        -moz-transition: height .8s ease;
        -ms-transition: height .8s ease;
        -o-transition: height .8s ease;
        transition: height .8s ease
    }
    .all-results {
        width: 100%
    }
    .all-results .betslip-results-sb {
        margin-top: 3px !important
    }
    .show-all-betslip-results,
    .betslip-results-content a.button {
        width: 210px;
        padding: 10px 0
    }
    .betslip-results-content h4 {
        margin-bottom: 0
    }
    .betslip-results-content .betslip-results-sb {
        grid-template-columns: 1.1fr .9fr;
        margin-bottom: 0;
        width: 200px;
        background: transparent
    }
    .betslip-results-content span.show-all-betslip-results {
        top: 1px;
        font-size: 17px;
        margin-bottom: 10px;
        padding: 0
    }
    .tempgreekodds .istabsbox {
        grid-template-columns: 1fr;
        row-gap: 15px
    }
    .button-with-odds img {
        width: 60px
    }
    table.sticky-table-header thead {
        top: 0px !important
    }
    .isboostedodds .related-articles-item {
        grid-template-columns: 150px 1fr;
        height: auto
    }
    .isboostedodds .related-articles-content {
        padding: 15px
    }
    .isboostedodds .related-articles-item>div:last-child {
        display: none
    }
    .istopoffers .related-articles-content:before {
        left: 123px
    }
    .superpromo {
        top: 1%;
        left: 50%;
        transform: translateX(-50%);
        margin-left: 0
    }
}

@media only screen and (min-device-width:640px) {
    .visible-xm,
    .summary-right a.button-black,
    .author-socials.hidden-xs {
        display: block !important
    }
    .top-row h3 {
        display: inline-block !important
    }
    .summary-info-item a.visible-xs,
    .author-socials.visible-xs,
    .visible-mob,
    .post .visible-mob,
    .post img.visible-mob {
        display: none
    }
}

@media only screen and (max-device-width:639px) {
    body {
        background:#fff;
    }
    #header {top:0}
    .isbox {
        box-shadow: none;
        -webkit-box-shadow: none;
    }
    .header-logo-padding {
        padding-left:20px;
    }
    .post {padding:0}
    .flex-mb-column {
        flex-direction: column;
    }
    .hidden-mb {
        display: none
    }
    #sidebar1wrap {
        display:none;
        position: fixed;
        top: 0;
        z-index: 100;
        width: 100%;
        margin: 0;
        height: 100%;
        padding: 30px 0;
        box-sizing: border-box;
        overflow-y: scroll;
    }
    .scroll-item-w-full {
        width: 100%;
    }
    .padding-30, .sportsbook-top-content.grid-col-2 {
        padding:20px;
    }
    .team-logo-medium {
        width:50px;
        max-height: 50px;
    }
    .h2h-stats-item {
        padding:0 8px;
    }
    .h2h-stats-item strong {
        font-size:30px;
    }
    .h2h-stats-graphs-item {
        margin:0 25px 20px;
    }
    .post table, h1.istopheading {
        border-radius:0;
    }
    .match-vote-title.radius-top {
        border-radius:0;
    }
    .visible-mob {
        display: initial
    }
    .visible-mob.isgrid {
        display:grid
    }
    .visible-mob.isflex {
        display:flex
    }
    #countdown-timer {
        font-size:25px;
    }

    .iscontentbox,
    .istopheading,
    .istopparagrapgh,
    .toc,
    .sportsbook-panel,
    .featured-article-content {
        padding: 15px
    }
    .istopparagrapgh {
        margin-top: -15px
    }
    .summary-info-item,
    .related-articles-content,
    .featured-sub-articles .featured-article-content {
        padding: 15px
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .summary {
        margin-bottom: 15px
    }
    .istopheading p:last-child:empty {
        margin-bottom: -15px
    }
    h1,
    h2 {
        font-size: 18px;
        letter-spacing: 1.44px;
        line-height: 22px
    }
    p {
        line-height: 22px;
        margin-bottom: 15px
    }
    .post .casino-listings td {
        padding: 15px 10px
    }
    .casino-listings .summary-buttons {
        margin: 15px auto
    }
    .casino-listings .summary-buttons .button {
        margin-right: 0
    }
    .featured-sub-articles .featured-post {
        display: block
    }
    .featured-sub-articles .featured-post img.wp-post-image {
        width: 100%;
        max-height: 420px;
        height: auto;
        margin: 0 !important;
        border-radius: 20px 20px 0 0
    }
    .featured-sub-articles h3,
    .featured-sub-articles p {
        height: auto
    }
    .featured-article-content .featured-article-cat {
        display: inline-block;
        max-width: 100px
    }
    .featured-article-content .alignright {
        max-width: 133px
    }
    .featured-article-content .meta-author {
        display: block;
        margin-left: 0
    }
    .grid-col-2,
    .special-content {
        grid-template-columns: 100%;
        height: auto
    }
    .special-content .special-title-element {
        padding: 18px 0;
        font-size: 17px;
        letter-spacing: 1.44px
    }
    .special-content h3 {
        padding: 15px
    }
    .grid-col-2 {
        column-gap: 0;
        row-gap: 15px
    }
    .sportsbook-panel .halflist {
        margin: 0 0 15px;
        float: none;
        width: 100%
    }
    .istabsbox,
    .sub-articles-list-grid {
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 15px
    }
    .istabsbox .custom-select {
        width: 100% !important
    }
    .useful-infos {
        padding: 30px 15px
    }
    .hidden-stats {
        padding: 40px 15px 0
    }
    .summary-div-item a.button-with-terms {
        letter-spacing: 0;
        font-size: 13px;
        line-height: 22px;
        margin: 0 0 25px;
        padding: 3px 10px
    }
    .summary-left,
    .summary-right {
        flex-basis: 50%
    }
    .summary-right ul {
        padding-left: 0
    }
    .summary-div-item .summary-buttons a.button-black {
        margin: 0 20px 15px
    }
    .top-row .rfloat {
        float: none;
        text-align: center;
        display: block;
        margin-bottom: 15px
    }
    .custom-media {
        padding: 10px 25px 15px;
        border-radius: 20px 20px 0 0
    }
    .custom-media-christmas {
        padding-bottom: 30px
    }
    .custom-media-content {
        flex-direction: column;
        align-items: flex-start
    }
    .media-content-flex {
        align-self: normal;
        margin: 0
    }
    .custom-media-content .media-button {
        font-size: 17px;
        max-width: 0;
        margin: 0
    }
    .custom-media .media-terms {
        bottom: 0;
        right: 0;
        width: auto
    }
    .single-article .istopheading h1,
    .sportsbook-template .istopheading h5 {
        padding-bottom: 15px
    }
    .metadata-top .meta-author {
        display: block;
        line-height: 0;
        margin-right: 0
    }
    .metadata-top .featured-article-cat {
        position: relative;
        top: -6px;
        font-size: 11px;
        padding: 6px 10px
    }
    .author-grid,
    .author-content-stats {
        display: grid;
        grid-template-columns: 1fr;
        column-gap: 0;
        row-gap: 15px;
        text-align: center
    }
    .author-content-stats .author-socials {
        margin: -10px auto 20px
    }
    a.related-articles-item {
        grid-template-columns: 45% 55%
    }
    .related-articles img.attachment-thumbnail {
        width: 100%;
        height: 100%
    }
    #odds-table tr span.inodds-tv-channel {
        font-size: 8px
    }
    span.with-arrow {
        grid-template-columns: auto auto;
        column-gap: 2px
    }
    .match-main-content {
        padding: 15px 10px;
        grid-template-columns: 35% 30% 35%;
        margin-bottom: 25px
    }
    .match-main-content>* {
        min-width: 0
    }
    .match-main-content img {
        width: 50px;
        height: 50px;
    }
    .match-main-content span.bold {
        font-size: 20px !important
    }
    .team-form span {
        width: 16px;
        height: 16px;
        line-height: 16px;
        font-size: 10px;
        margin-right: 0
    }
    .bb-container .match-main-content {
        padding-bottom: 0;
        margin-bottom: 0
    }
    .bb-container-list {
        padding: 0 25px 15px
    }
    .bb-container-list img {
        width: 80px
    }
    .best-bottom-list {
        width: 100%;
        box-sizing: border-box
    }
    .best-list-center {
        margin: 60px 0 30px
    }
    .compare-table tr td {
        padding: 5px
    }
    #ListaCol1,
    #ListaCol2,
    .dd-select,
    .dd-options {
        width: 130px !important
    }
    .dd-options {
        padding: 40px 10px 10px !important
    }
    .dd-option,
    .dd-selected {
        grid-template-columns: 20px auto !important;
        font-size: 10px !important
    }
    .post .diastavrwseis-header-cell {
        padding: 15px 45px
    }
    .post table a.button.button-with-arrow-right {
        padding: 3px 25px 3px 10px
    }
    .post table a.button-with-arrow-right:after {
        width: 24px;
        height: 24px;
        line-height: 24px
    }
    .msg-box-content {
        width: 90%;
        background-size: initial !important
    }
    .msg-container {
        padding: 20px
    }
    .msg-container .tw-color {
        margin-top: 10px
    }
    #footer .inline-flex img {
        width: 95%;
        height: auto
    }
    .istopoffers .related-articles-item {
        grid-template-columns: 150px 1fr
    }
    .istopoffers .related-articles-content {
        padding: 0 15px
    }
    .istopoffers .related-articles-content:before {
        left: 135px;
        font-size: 17px;
        padding: 4px 3px;
        border-radius: 8px;
        border-width: 3px
    }
    .istopoffers .related-articles-item>div:last-child {
        display: none
    }
    .isboostedodds .related-articles-content {
        padding: 15px
    }
    li.tv-match-item {
        padding: 0;
        grid-template-columns: 1fr;
        border-radius: 20px;
        margin: 30px 0;
        border: none
    }
    .tv-match-metadata {
        grid-template-columns: 60px auto;
        align-items: center;
        width: 100%;
        background: #353535;
        padding: 10px;
        box-sizing: border-box;
        border-bottom: 1px solid #3d3d3d;
        border-radius: 20px 20px 0 0
    }
    .tv-match-metadata .inodds-tv-channel {
        text-align: right
    }
    .tv-match-details {
        padding: 15px 0 25px
    }
    .is-cat-euro .match-container img {
        width: 75px;
        height: auto
    }
    .istypeoffers .related-articles-item {
        border-radius: 20px;
        grid-template-columns: 60px 1fr 1fr;
        column-gap: 20px
    }
    .istypeoffers .auto-grid {
        height: 60px;
        border-radius: 10px
    }
    .istypeoffers .visible-xs .button {
        padding: 1px 10px;
        font-size: 12px
    }
    .banner-gift .isgrid {
        grid-template-columns: 1fr 1fr;
        row-gap: 20px
    }
    .banner-gift .inline-companies {
        justify-self: start
    }
}

@media only screen and (min-width:1024px) {
    .hgc-mobile {
        display: none
    }
}

@media only screen and (max-width:1023px) {
    .hgc-desktop {
        display: none
    }
    a.footer-hgc {
        column-gap: 15px
    }
}
/* mobile menu: full-width rows, arrow as a 55px tap target at the row's right edge,
   submenus expand inline (the desktop dropdown styles would otherwise keep them hidden) */
@media only screen and (max-device-width:1199px) {
    /* the open menu fills the screen and scrolls on its own (it sits in the fixed header,
       so with submenus expanded the last items were out of reach) */
    #menunav {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: auto;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch
    }
    #menunav>ul {
        height: auto;
        min-height: 100%;
        padding-bottom: 30px
    }
    #menunav ul li.menu-item-has-children {
        display: block;
        position: relative;
        height: auto;
        float: none;
        clear: both;
        width: 100%
    }
    #menunav ul li.menu-item-has-children>a {
        position: static;
        padding-right: 55px;
        overflow: hidden;
        text-overflow: ellipsis
    }
    #menunav ul li.menu-item-has-children>a>span {
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent
    }
    #menunav ul li.menu-item-has-children.menu-item-is-opened>a>span {
        transform: rotate(180deg)
    }
    #menunav ul li.menu-item-has-children ul.sub-menu {
        position: static;
        display: block;
        float: none;
        width: 100%;
        height: auto;
        max-height: 0;
        padding: 0;
        opacity: 1;
        visibility: visible;
        overflow: hidden;
        background: #00877a;
        border-radius: 0;
        transition: max-height .35s ease-in-out
    }
    #menunav ul li.menu-item-has-children ul.sub-menu.active {
        max-height: 1000px
    }
    /* touch leaves :hover stuck on the tapped row; keep the text white (the desktop hover
       colour is the same teal as the current-item background) */
    #menunav ul li.menu-item:hover>a,
    #menunav ul li.menu-item>a {
        color: #fff;
        -webkit-tap-highlight-color: transparent
    }
    #menunav ul li.menu-item-has-children ul.sub-menu:before,
    #menunav ul li.menu-item-has-children ul.sub-menu:after {
        display: none
    }
    #menunav ul li.menu-item-has-children ul.sub-menu li {
        display: block;
        float: none;
        height: auto
    }
    #menunav ul li.menu-item-has-children ul.sub-menu li a {
        display: block;
        padding: 12px 30px 12px 45px;
        line-height: 1.3;
        white-space: normal;
        color: #fff;
        font-size: 15px
    }
}

/* custom-media banners on phones: logo left, full-size button right
   (the max-width:0 above squeezed the button into a sliver with its text overflowing) */
@media only screen and (max-device-width:639px) {
    .custom-media-content {
        grid-template-columns: 100px 1fr;
        column-gap: 16px
    }
    .custom-media-content .media-button {
        max-width: none;
        width: auto;
        justify-self: end;
        padding: 10px 18px;
        font-size: 15px;
        white-space: nowrap
    }
    .custom-media .media-terms {
        right: 14px
    }
}

/* custom-media banner (≥640px): less vertical padding, one-line button, terms text below the button instead of under it */
@media only screen and (min-device-width:640px) {
    .custom-media {padding: 22px 20px 36px}
    .custom-media-content {grid-template-columns: 100px 1fr auto}
    .custom-media-content .media-button {padding: 10px 24px; white-space: nowrap}
    .custom-media .media-terms {bottom: 15px; right: 20px}
}