@font-face {
    font-family: Brandon;
    src: url('./../fonts/Brandon_bld.otf')
}

@font-face {
    font-family: PFBeauSansPro;
    src: url('./../fonts/PFBeauSansPro-Bold.ttf')
}

@font-face {
    font-family: Trade;
    src: url('./../fonts/TradeGothicLTStd-Bold.otf')
}

.overlay {
    /*background: url('./../img/stadium_bg.jpg') center -62px no-repeat;*/
    padding: 5px;
    /*background-size: cover;*/
    color: #ffffff;
    text-shadow: 0 0 25px rgba(0,0,0,1);
    width: 814px;
    height: 454px;
    overflow: hidden;
}

.overlay a,
.overlay a:focus,
.overlay a:hover{
    color: #ffffff;
    text-decoration: none;
}

.overlay .campaign-link {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

.overlay .campaign-link.match-01 {
    background-image: url('./../img/schweiz_frankreich.png');
}

.overlay .campaign-link.match-02 {
    background-image: url('./../img/russland_wales.png');
}

.overlay .campaign-link.match-03 {
    background-image: url('./../img/nordirland_deutschland_tschechien_turkei.png');
}

.overlay .campaign-link.match-04 {
    background-image: url('./../img/tschechien_turkei.png');
}

.overlay .campaign-link.match-05 {
    background-image: url('./../img/ungarn_portugal_italien_irland.png');
}

.overlay .campaign-link.match-06 {
    background-image: url('./../img/italien_irland.png');
}

.overlay .back-to-atv-link {
    position: absolute;
    right: 5px;
    z-index: 2;
    font-size: 22px;
    line-height: 1;
    color: #ffffff;
    text-transform: uppercase;
}

.overlay .back-to-atv-link .caption {
    vertical-align: top;
    line-height: 26px;
    font-size: 20px;
    text-shadow: 1px 1px #000;
    font-weight: 700;
}

.overlay .back-to-atv-link .ico {
    margin-left: 2px;
    font-size: 26px;
}

.overlay .back-to-atv-link:hover,
.overlay .back-to-atv-link:focus {
    color: #ED1700;
}

.overlay .back-to-atv-link .close-icon {
    vertical-align: top;
}

.overlay .matches-container {
    background-size: 100%;
    margin-top: 40px;
    position: relative;
    text-align: center;
    background: url('./../img/grey_transparent_bg.png') top center no-repeat;
    background-size: 100%;
}

.overlay .matches-container .match-container {
    text-transform: uppercase;
}

.overlay .matches-container .match-container .team-title-container:first-child {
    text-align: right;
    margin-left: 42px;
}

.overlay .matches-container .match-container .team-title-container {
    padding-top: 28px;
    text-align: left;
}

.overlay .matches-container .team-title {
    font-size: 22px;
    text-transform: uppercase;
    font-family: PFBeauSansPro;
}

.overlay .matches-container .match-container .team-flag-img-container.align-right {
    text-align: right;
}

.overlay .matches-container .match-container .team-flag-img-container.align-left {
    text-align: left;
}

.overlay .matches-container .match-container .team-flag-img {
    width: 90px;
}

.overlay .matches-container .match-container:first-child .livestream-details {
    margin-bottom: 0;
}

.overlay .matches-container .match-container .livestream-details {
    font-size: 28px;
    line-height: 1;
    text-transform: uppercase;
    font-family: Trade;
    margin-top: 10px;
    margin-bottom: 25px;
}

.overlay .matches-container .match-container .vs-text-container {
    padding-top: 26px;
    margin: 0 -40px;
}

.overlay .matches-container .match-container .vs-text-container .vs-text {
    font-size: 28px;
    text-transform: uppercase;
    font-family: PFBeauSansPro;
}

.overlay .livestream-link {
    position: absolute;
    right: 10px;
    bottom: 6px;
}

.overlay .footer {
    margin: 0 -10px;
}

.overlay .footer-img {
    width: 100%;
}

.overlay .match-separation .match-separation-img {
    width: 800px;
    margin: -20px 0;
}

/* One match */

.overlay .matches-container .match-container.one-match .vs-text-container {
    padding-top: 36px;
    margin: 0;
}

.overlay .matches-container .match-container.one-match .team-flag-img {
    width: 160px;
    margin-bottom: 50px;
}

.overlay .matches-container .match-container.one-match .livestream-details {
    margin-bottom: 70px;
    line-height: 1.2;
}

.overlay .matches-container .match-container.one-match {
    margin-top: 45px;
}

.overlay .medium-1 {
    width:8.33333%
}

.overlay .medium-push-1 {
    position: relative;
    left: 8.33333%
}

.overlay .medium-pull-1 {
    position: relative;
    left: -8.33333%
}

.overlay .medium-offset-0 {
    margin-left: 0
}

.overlay .medium-2 {
    width: 16.66667%
}

.overlay .medium-push-2 {
    position: relative;
    left: 16.66667%
}

.overlay .medium-pull-2 {
    position: relative;
    left: -16.66667%
}

.overlay .medium-offset-1 {
    margin-left: 8.33333%
}

.overlay .medium-3 {
    width: 25%
}

.overlay .medium-push-3 {
    position: relative;
    left: 25%
}

.overlay .medium-pull-3 {
    position: relative;
    left: -25%
}

.overlay .medium-offset-2 {
    margin-left: 16.66667%
}

.overlay .medium-4 {
    width: 33.33333%
}

.overlay .medium-push-4 {
    position: relative;
    left: 33.33333%
}

.overlay .medium-pull-4 {
    position: relative;
    left: -33.33333%
}

.overlay .medium-offset-3 {
    margin-left: 25%
}

.overlay .medium-5 {
    width: 41.66667%
}

.overlay .medium-push-5 {
    position: relative;
    left: 41.66667%
}

.overlay .medium-pull-5 {
    position: relative;
    left: -41.66667%
}

.overlay .medium-offset-4 {
    margin-left: 33.33333%
}

.overlay .medium-6 {
    width: 50%
}

.overlay .medium-push-6 {
    position: relative;
    left: 50%
}

.overlay .medium-pull-6 {
    position: relative;
    left: -50%
}

.overlay .medium-offset-5 {
    margin-left: 41.66667%
}

.overlay .medium-7 {
    width: 58.33333%
}

.overlay .medium-push-7 {
    position: relative;
    left: 58.33333%
}

.overlay .medium-pull-7 {
    position: relative;
    left: -58.33333%
}

.overlay .medium-offset-6 {
    margin-left: 50%
}

.overlay .medium-8 {
    width: 66.66667%
}

.overlay .medium-push-8 {
    position: relative;
    left: 66.66667%
}

.overlay .medium-pull-8 {
    position: relative;
    left: -66.66667%
}

.overlay .medium-offset-7 {
    margin-left: 58.33333%
}

.overlay .medium-9 {
    width: 75%
}

.overlay .medium-push-9 {
    position: relative;
    left: 75%
}

.overlay .medium-pull-9 {
    position: relative;
    left: -75%
}

.overlay .medium-offset-8 {
    margin-left: 66.66667%
}

.overlay .medium-10 {
    width: 83.33333%
}

.overlay .medium-push-10 {
    position: relative;
    left: 83.33333%
}

.overlay .medium-pull-10 {
    position: relative;
    left: -83.33333%
}

.overlay .medium-offset-9 {
    margin-left: 75%
}

.overlay .medium-11 {
    width: 91.66667%
}

.overlay .medium-push-11 {
    position: relative;
    left: 91.66667%
}

.overlay .medium-pull-11 {
    position: relative;
    left: -91.66667%
}

.overlay .medium-offset-10 {
    margin-left: 83.33333%
}

.overlay .medium-12 {
    width: 100%
}

.overlay .medium-offset-11 {
    margin-left: 91.66667%
}

.overlay .medium-up-1>.column,.overlay .medium-up-1>.columns {
    width: 100%;
    float: left
}

.overlay .medium-up-1>.column:nth-of-type(1n),.overlay .medium-up-1>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-1>.column:nth-of-type(1n+1),.overlay .medium-up-1>.columns:nth-of-type(1n+1) {
    clear: both
}

.overlay .medium-up-1>.column:last-child,.overlay .medium-up-1>.columns:last-child {
    float: left
}

.overlay .medium-up-2>.column,.overlay .medium-up-2>.columns {
    width: 50%;
    float: left
}

.overlay .medium-up-2>.column:nth-of-type(1n),.overlay .medium-up-2>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-2>.column:nth-of-type(2n+1),.overlay .medium-up-2>.columns:nth-of-type(2n+1) {
    clear: both
}

.overlay .medium-up-2>.column:last-child,.overlay .medium-up-2>.columns:last-child {
    float: left
}

.overlay .medium-up-3>.column,.overlay .medium-up-3>.columns {
    width: 33.33333%;
    float: left
}

.overlay .medium-up-3>.column:nth-of-type(1n),.overlay .medium-up-3>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-3>.column:nth-of-type(3n+1),.overlay .medium-up-3>.columns:nth-of-type(3n+1) {
    clear: both
}

.overlay .medium-up-3>.column:last-child,.overlay .medium-up-3>.columns:last-child {
    float: left
}

.overlay .medium-up-4>.column,.overlay .medium-up-4>.columns {
    width: 25%;
    float: left
}

.overlay .medium-up-4>.column:nth-of-type(1n),.overlay .medium-up-4>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-4>.column:nth-of-type(4n+1),.overlay .medium-up-4>.columns:nth-of-type(4n+1) {
    clear: both
}

.overlay .medium-up-4>.column:last-child,.overlay .medium-up-4>.columns:last-child {
    float: left
}

.overlay .medium-up-5>.column,.overlay .medium-up-5>.columns {
    width: 20%;
    float: left
}

.overlay .medium-up-5>.column:nth-of-type(1n),.overlay .medium-up-5>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-5>.column:nth-of-type(5n+1),.overlay .medium-up-5>.columns:nth-of-type(5n+1) {
    clear: both
}

.overlay .medium-up-5>.column:last-child,.overlay .medium-up-5>.columns:last-child {
    float: left
}

.overlay .medium-up-6>.column,.overlay .medium-up-6>.columns {
    width: 16.66667%;
    float: left
}

.overlay .medium-up-6>.column:nth-of-type(1n),.overlay .medium-up-6>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-6>.column:nth-of-type(6n+1),.overlay .medium-up-6>.columns:nth-of-type(6n+1) {
    clear: both
}

.overlay .medium-up-6>.column:last-child,.overlay .medium-up-6>.columns:last-child {
    float: left
}

.overlay .medium-up-7>.column,.overlay .medium-up-7>.columns {
    width: 14.28571%;
    float: left
}

.overlay .medium-up-7>.column:nth-of-type(1n),.overlay .medium-up-7>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-7>.column:nth-of-type(7n+1),.overlay .medium-up-7>.columns:nth-of-type(7n+1) {
    clear: both
}

.overlay .medium-up-7>.column:last-child,.overlay .medium-up-7>.columns:last-child {
    float: left
}

.overlay .medium-up-8>.column,.overlay .medium-up-8>.columns {
    width: 12.5%;
    float: left
}

.overlay .medium-up-8>.column:nth-of-type(1n),.overlay .medium-up-8>.columns:nth-of-type(1n) {
    clear: none
}

.overlay .medium-up-8>.column:nth-of-type(8n+1),.overlay .medium-up-8>.columns:nth-of-type(8n+1) {
    clear: both
}

.overlay .medium-up-8>.column:last-child,.overlay .medium-up-8>.columns:last-child {
    float: left
}

.overlay .medium-collapse>.column,.overlay .medium-collapse>.columns {
    padding-left: 0;
    padding-right: 0
}

.expanded.row .overlay .medium-collapse.row,.overlay .medium-collapse .row {
    margin-left: 0;
    margin-right: 0
}

.overlay .medium-uncollapse>.column,.overlay .medium-uncollapse>.columns {
    padding-left: .9375rem;
    padding-right: .9375rem
}

.overlay .medium-centered {
    float: none;
    margin-left: auto;
    margin-right: auto
}

.overlay .medium-pull-0,.overlay .medium-push-0,.overlay .medium-uncentered {
    position: static;
    margin-left: 0;
    margin-right: 0;
    float: left
}

.row {
    max-width: 75rem;
    margin-left: auto;
    margin-right: auto
}

.row:after,.row:before {
    content: ' ';
    display: table
}

.row:after {
    clear: both
}

.row.collapse>.column,.row.collapse>.columns {
    padding-left: 0;
    padding-right: 0
}

.row .row {
    margin-left:-.9375rem;
    margin-right: -.9375rem
}

.row .row.collapse {
    margin-left: 0;
    margin-right: 0
}

.row.expanded {
    max-width: none
}

.row.expanded .row {
    margin-left: auto;
    margin-right: auto
}

.column,.columns {
    width: 100%;
    float: left;
}

.column:last-child:not(:first-child),.columns:last-child:not(:first-child) {
    float: right
}

.column.end:last-child:last-child,.end.columns:last-child:last-child {
    float: left
}

.column.row.row,.row.row.columns {
    float: none
}

.row .column.row.row,.row .row.row.columns {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0
}