*,
*:after,
*:before {
    box-sizing: border-box;
}

/* embed fonts
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@font-face {
    font-style: normal;
    font-family: 'BPG Ingiri';
    src: url('../fonts/ingiri.woff2') format('woff2'), url('../fonts/ingiri.woff') format('woff'), url('../fonts/ingiri.ttf') format('truetype');
}
@font-face {
    font-style: normal;
    font-family: 'EurostyleGeoDemi';
    src: url('../fonts/EurostyleGeoDemi.woff2') format('woff2'), url('../fonts/EurostyleGeoDemi.woff') format('woff'), url('../fonts/EurostyleGeoDemi.ttf') format('truetype');
}

/* Base
–––––––––––––––––––––––––––––––––––––––––––––––––– */

img {
    display: block;
}
html {
    font-size: 11px;
}
body {
    font-family: 'EurostyleGeoDemi';
    font-style: normal;
    color: #65beec;
    background: #000f3d;
    padding: 0 20px 20px;
}
a {
    text-decoration: none;
}

/* layout
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header {height:140px; background-image:url(../img/header_bg.jpg?v=2); margin-bottom:7px; text-align:center; overflow:hidden; color:#fff; letter-spacing:0.1rem; font-size:2.4rem; line-height:142px;}

.fb_login img {display:inline; }
.fb_login a {color: white;     padding-right: 30px; line-height: 38px;}
.fb_login span {text-align: center;}
.fb_login{
    height: 0px;
    top: 55px;
    right: 110px;
    color: white;
    font-size: 15px;
    z-index: 100;
    text-align: right;
    position: relative;
}
.content {
    margin: 0 auto;
    width: 1321px;
}
.col_right,
.col_left {
    display: inline-block; margin-bottom:20px;
}
.col_right {
    text-align: right;
    margin-left: 5px;
}
.abc {
    display: inline-block;
    margin-bottom: 10px;
    width: 658px
}
.buttons,
.final {
    width: 100%;
    float: left;
}
.final {
    margin-bottom: 20px;
}
.name {
    color: #fff;
    font-size: 1.3rem;
    padding-bottom: 4px;
    letter-spacing: 0.1rem
}
.match {
    font: 1.1rem 'EurostyleGeoDemi';
}
.r_team,
.l_team {
    width: 112px;
    height: 23px;
    border-bottom: 1px solid #999999;
    padding-top: 4px;
    overflow: hidden;
}
.r_team {
    text-align: right;
}
.col_right .l_team {
    text-align: left;
}
.score {
    width: 35px;
    height: 23px;
    border: 1px solid #999999;
    overflow: hidden;
	text-align:center;
	padding-top:2px;
}
.score span {color:#fff;}
.goal {
    border: none;
    width: 34px;
    height: 22px;
    letter-spacing: 0.09rem;
    text-align: center;
    padding-left: 1px;
    line-height: 23px;
    color: #000f3d;
	margin-top:-2px;
}
.goal::-webkit-inner-spin-button {
    opacity: 1;
}
input:focus {
    outline: none;
}
input:active {
    outline: none;
}
.when {
    font: 1.1rem 'BPG ingiri';
    padding-top: 4px;
    color: #aaa;
    letter-spacing: 0.05rem;
    height: 21px;
}
.col_right .when {
    text-align: right
}
.results {
    display: inline-block;
    padding-top: 29px
}
.box {
    height: 221px;
    margin-left: 30px;
    color: #fff;
    font-size: 11px;
}
.col_right .box {
    margin-left: 0;
    margin-right: 30px;
}
.country_line td {
    height: 40px;
    line-height: 40px;
    background: #005798;
}
.country {
    position: relative;
    padding: 0 0 0 25px;
    width: 147px;
}
.col_right .country {
    position: relative;
    text-align: right;
    width: 147px;
    padding: 0 25px 0 0;
}
.space {
    height: 10px;
}
.flag {
    border-radius: 50%;
    border: 1px solid #999999;
    position: absolute;
    left: -20px;
    height: 40px;
    width: 40px;
}
.col_right .flag {
    left: auto;
    right: -20px;
    top:0px;
}
.pad {
    padding-right: 14px;
    width: 38px;
}
.col_left .padw{padding-left: 18px;}
.col_left .padd{padding: 0 0 0 8px;}
.col_left .padl{padding: 0 0 0 5px;}
.col_left .padgf{padding:0;}
.col_left .padga{padding: 0;}
.col_left .padgd{padding: 0;}
.col_left .padpts{padding: 0 8px 0 0;}

.col_right .padw{padding-left: 10px;}
.col_right .padd{padding-left: 6px;}
.col_right .padl{padding: 0;width: 28px;}
.col_right .padgf{padding-left: 0px; width: 30px;}
.col_right .padga{padding: 0; width: 30px;}
.col_right .padgd{padding: 0; width: 30px;}
.col_right .padpts{padding: 0;}

.col_right .pad {
    padding-right: 0px;
    padding-left: 14px;
}
.caption {
    margin-left: 30px;
    font-size: 10px;
}
.col_right .caption {
    margin-left: 0;
    margin-right: 30px;
    letter-spacing: 0.09rem;
}
.caption td {
    padding-bottom: 1px;
    color: #fff;
}
.distance {
    width: 144px;
}
.col_right .distance {
    width: 0px;
}
.pts {
    padding-left: 9px;
}
.col_right .pts {
    padding-left: 9px;
}

/* finals */

.chart {
    margin-bottom: 40px;
}
.numero {
    height: 44px;
    width: 44px;
    color: #fff;
    font-size: 22px;
    background-color: #005798;
    display: inline-block;
    text-align: center;
    padding-top: 7px;
}
td.games {
    position: relative;
}
div.semi_final {
    position: absolute;
    top: 40px;
    right: -193px;
}
.about.semi {
    right: -193px;
}
.col div.semi_final {
    right: auto;
    left: -193px;
}
.col .about.semi {
    right: auto;
    left: -193px;
}
.games .l_team {
    width: 122px;
    padding-left: 8px;
}
.col .games .l_team {
    width: 112px;
    padding-left: 0px;
}
.col .games .r_team {
    width: 122px;
    padding-right: 8px;
}
.col .match {
    float: right;
}
.games .when {
    padding-left: 8px;
}
.col .games .when {
    padding-left: 0;
    padding-right: 8px;
}
.quarter_final {
    padding-left: 22px;
    position: relative;
}
.quarter_final .match {
    margin-top: 39px;
}
.quarter_final .l_team {
    width: 254px;
    padding-left: 142px;
}
.quarter_final td.when {
    padding-left: 142px;
}
.col .quarter_final .l_team {
    width: 112px;
    padding-left: 0;
}
.col .quarter_final .r_team {
    width: 254px;
    padding-right: 142px;
}
.col .quarter_final {
    padding-left: 0;
    padding-right: 22px;
    position: relative;
}
.col .quarter_final td.when {
    padding-left: 0px;
    padding-right: 142px;
}
div.lines {
    height: 127px;
    width: 1px;
    border-left: 1px solid #999;
}
.about {
    position: absolute;
    right: 0;
    top: 12px;
    color: #fff;
    letter-spacing: 0.04rem;
}
.col .about {
    left: 0;
    right: auto;
}

/* buttons */

.buttons {
    padding: 0 0 40px 304px;
}
.buttons_bottom {
    padding: 20px 0 0 0;
    width: 1321px;
}
.buttons_bottom span {
    line-height: 46px;
    color: #999;
	overflow:hidden;
    margin-right: 220px;
}
.buttons_bottom span a {
    color: #999;
    -webkit-transition: .4s;
    transition: .4s;
}
.buttons_bottom span a:hover {
    color: #fff;
}
.calc {
    height: 44px;
    width: 352px;
    margin-right: 10px;
    background: #921004;
    display: inline-block;
    text-align: center;
    line-height: 46px;
    color: #fff;
    overflow: hidden;
    -webkit-transition: .4s;
    transition: .4s;
    letter-spacing: 0.09rem;
}
.calc.begin {width:714px;}
.fb {
    height: 44px;
    width: 236px;
    background: #3b5998 url(../img/fb_bg.svg) no-repeat left;
    display: inline-block;
    -webkit-transition: .4s;
    transition: .4s;
	overflow:hidden;
	text-align:center;
	line-height: 46px;
    color: #fff;
}
.fb:hover {
    background: #274788 url(../img/fb_bg.svg) no-repeat left;
}
.calc:hover {
    background: #710b03;
}

.help { font: 1.1rem 'BPG ingiri'; letter-spacing:0.04rem; margin-top:20px;}

/* center */

.middle {
    display: inline-block;
    width: 403px;
}
.fin {
    width: 310px;
    background: #005798;
    margin: 0 auto;
    height: 130px;
    padding: 20px;
}
.title {
    color: #fff;
    letter-spacing: 0.4px;
    font-size: 1.1rem;
    margin-bottom: 12px
}
.fin table {
    height: 61px;
    width: 270px;
    color: #fff;
}
.fin td {
    overflow: hidden;
}
.fin .score {
    width: 35px;
    border: none;
    overflow: hidden;
	height:30px;
}
.fin .goal {
    border: none;
    width: 44px;
    height: 30px;
    letter-spacing: 0.09rem;
    text-align: center;
    padding-left: 8px;
    line-height: 23px;
    color: #005798;
}
.winner {
	margin-top:180px;
	width: 310px;
    margin: 0 auto;
    height: 130px;
    padding: 20px;
	margin-top:169px;
	}
.winner td {text-align:center; color:#fff; font-size:1.3rem;}
div.large_flag {width:94px; height:94px; background-color:#005798; border-radius:50%; border:1px solid #000f3d; margin-left:108px; background-size:cover;}
.winner .my_winner { height:53px; padding-top:40px; }

.top_team {
    border-bottom: 1px solid #fff;
    padding-top: 5px;
}

.score.top { border-bottom: 1px solid #fff;}

.bot_team {
    padding-top: 3px
}

/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.full-width {
    width: 100%;
    box-sizing: border-box;
}
.max-full-width {
    max-width: 100%;
    box-sizing: border-box;
}
.right {
    float: right;
}
.left {
    float: left;
}

/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Self Clearing Goodness */

.cf {
    content: "";
    display: table;
    clear: both;
}

/* flags
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.flag_0 {
    background: #E7E7E7 url(../img/rus_a.svg) center;
}
.flag_1 {
    background: #E7E7E7 url(../img/ksa_a.svg) center;
}
.flag_2 {
    background: #E7E7E7 url(../img/egy_a.svg) center;
}
.flag_3 {
    background: #E7E7E7 url(../img/uru_a.svg) center;
}
.flag_4 {
    background: #E7E7E7 url(../img/por_b.svg) center;
}
.flag_5 {
    background: #E7E7E7 url(../img/spa_b.svg) center;
}
.flag_6 {
    background: #E7E7E7 url(../img/mor_b.svg) center;
}
.flag_7 {
    background: #E7E7E7 url(../img/irn_b.svg) center;
}
.flag_8 {
    background: #E7E7E7 url(../img/fra_c.svg) center;
}
.flag_9 {
    background: #E7E7E7 url(../img/aus_c.svg) center;
}
.flag_10 {
    background: #E7E7E7 url(../img/per_c.svg) center;
}
.flag_11 {
    background: #E7E7E7 url(../img/den_c.svg) center;
}
.flag_12 {
    background: #E7E7E7 url(../img/arg_d.svg) center;
}
.flag_13 {
    background: #E7E7E7 url(../img/ice_d.svg) center;
}
.flag_14 {
    background: #E7E7E7 url(../img/cro_d.svg) center;
}
.flag_15 {
    background: #E7E7E7 url(../img/nga_d.svg) center;
}
.flag_16 {
    background: #E7E7E7 url(../img/brz_e.svg) center;
}
.flag_17 {
    background: #E7E7E7 url(../img/swi_e.svg) center;
}
.flag_18 {
    background: #E7E7E7 url(../img/crc_e.svg) center;
}
.flag_19 {
    background: #E7E7E7 url(../img/ser_e.svg) center;
}
.flag_20 {
    background: #E7E7E7 url(../img/ger_f.svg) center;
}
.flag_21 {
    background: #E7E7E7 url(../img/mex_f.svg) center;
}
.flag_22 {
    background: #E7E7E7 url(../img/swe_f.svg) center;
}
.flag_23 {
    background: #E7E7E7 url(../img/kor_f.svg) center;
}

.flag_24 {
    background: #E7E7E7 url(../img/bel_g.svg) center;
}
.flag_25 {
    background: #E7E7E7 url(../img/pan_g.svg) center;
}
.flag_26 {
    background: #E7E7E7 url(../img/tun_g.svg) center;
}
.flag_27 {
    background: #E7E7E7 url(../img/eng_g.svg) center;
}
.flag_28 {
    background: #E7E7E7 url(../img/pol_h.svg) center;
}
.flag_29 {
    background: #E7E7E7 url(../img/sen_h.svg) center;
}
.flag_30 {
    background: #E7E7E7 url(../img/col_h.svg) center;
}
.flag_31 {
    background: #E7E7E7 url(../img/jpn_h.svg) center;
}