html {height:100%; min-height:100%;}
body {position:relative; color:#222; background:#f3f3f3; min-height:100%; padding:0; margin:0; font-family:'Source Sans Pro', Arial, sans-serif; font-size:110%; line-height:1.58;}

.header {background:#224; height:50px; position:relative; font-size:80%;}
.header-logo {position:absolute; width:170px; height:50px; left:0; top:10px; overflow:hidden;}
.header-menu {position:absolute; height:50px; width:auto; right:0; top:0; list-style:none; padding:0; margin:0;}
.header-menu:before, .header-menu:after {content:""; display:table; clear:both;}
.header-menu > li {border-radius:3px; float:left; margin:10px; background:rgba(255,255,255,.1); padding:7px 10px; line-height:1; position:relative; white-space:nowrap;}
.header-menu li > ul {display:none; width:220px!important;}
.header-menu li:hover > ul {display:block; position:absolute; left:0; top:30px; width:inherit; background:#224; list-style:none; padding:0;}
.header-menu li:hover:last-child > ul {left:auto!important; right:0; top:30px;}
.header-menu li > ul > li { font-size:90%; background:rgba(255,255,255,.1);}
.header-menu li > ul > li > a {color:#eee; display:block; padding:7px 12px;}
.header-burger {display:none; width:32px; height:32px; padding:1px; position:absolute; right:10px; top:10px;}
.header-burger:hover {outline:1px solid #fff;}

h1, h2, h3 {color:#444; font-weight:400; color:#448; text-align:center; clear:both; line-height:1.1;}
 
.header-menu a {color:#fff; font-size:120%;}
.header .column {z-index:3;} 

.site {max-width:1200px; position:relative; margin:10px auto 0 auto; min-height:800px;}
.content {margin:0 200px;}
.text {background:#fff; padding:5px 20px 20px 20px; box-shadow: 0 1px 6px 0 rgba(0,0,0,.08); border-radius:6px; overflow:hidden;}
.text strong,.text b {color:#222; font-weight:600;}

.content-group {text-align:center;}
.content-group li {display:inline; padding:5px 10px; background:#fff; margin:10px 3px; white-space:nowrap;}

.footer {text-align:center; padding:20px 0;}

/*.content a {text-decoration:none; border-bottom:1px solid rgba(0,0,0,.2);}*/
/*.content img {max-width:100%; height:auto;}*/
.column {max-width:1000px; margin:0 auto; position:relative;}

.leftmenu  {top:0; left:0;  position:absolute; width:200px; white-space:nowrap; overflow:hidden;}
.rightmenu {top:0; right:0; position:absolute; width:200px; white-space:nowrap;}
.sidemenu {font-size:80%;}
.sidemenu ul {list-style:none; padding:0; margin:20px 0 0 0;}
.sidemenu ul a {display:block; padding:0 0 0 1em; margin:0 0 2px 0; color:#224; font-weight:600; text-decoration:none; border-radius:2px;}
.sidemenu ul a:hover {box-shadow:inset 1px 1px 6px #ccc; background:#fff;}

.bookmakers {width:100%; border-spacing:0; border-collapse:collapse; line-height:1; font-size:90%;}
.bookmakers img {text-decoration:none; max-height:40px; max-width:130px;}
.bookmakers tr {}
.bookmakers tr:nth-child(2n) {background:rgba(34,34,68,.03);}
.bookmakers td, .bookmakers th {padding:5px;}
.bookmakers td {text-align:center; vertical-align:middle; }

.sports {font-size:90%; position:relative;}
.sports-main > div {padding-left:75px; background:#fefefe;}
.sports-main > div + div {margin-top:1em;}
.sports-main .kos {width:50px; overflow:hidden; font-size:300%; position:absolute; left:0; top:auto; bottom:auto;}
.sports a {font-size:110%; display:block; font-weight:bolder;}
.sports:before, .sports:after {content:""; display:table; clear:both;}

.sports-other {line-height:1;}
.sports-other > div {width:49%; height:3em; float:left; position:relative; margin:0 1% 10px 0;}
.sports-other > div > a {margin-left:50px; margin-right:10px;}
.sports-other .kos {width:40px; overflow:hidden; font-size:220%; position:absolute; left:0; top:auto; bottom:auto;}


.btn-review {    text-decoration: none;
    color: #333;
    border-radius: 3px;
    border: 1px solid #DDDDDD;
    border-style: solid;
    border-width: 1px;
    border-image: none;
    border-color: rgba(0, 0, 0, 0.10) rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.25);
    background: linear-gradient(to bottom, #fefefe 0%,#a8e8b8 100%);
    padding: 5px 13px;
    font-size: 85%;
    font-weight:500;
    cursor: pointer;
    text-align: center;
    text-shadow: 0 1px rgba(255, 255, 255, 1);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn-review:hover {
    background: linear-gradient(to bottom, #fefefe 0%,#98d8a8 100%);
}

.shortlinks, .shortlinks a {color:#555;}
.shortlinks {font-size:90%; background:#f8f8f8; border-radius:10px; padding:10px 40px;}
.shortlinks a {text-decoration:none; border-bottom:1px dashed #ccc;}
.shortlinks a:hover {color:#000; border-bottom:1px solid #000;}


@media (max-width: 900px) {
    .leftmenu {display:none;}
    .rightmenu {display:none;}
    .content {margin:0;}
    .header-burger {display:block;}
    .header-menu {display:none;}
    .header-menu {width:auto; height:auto; background:#224; top:50px;}
    .header-menu > li {margin:0 10px 4px 10px; float:right; clear:both;}
    .header-menu li:hover > ul {display:none;}

    .text {font-size:80%; padding:5px!important;}
    h1, h2, h3 {padding:5px; line-height:1.1;}
/*    h1 {font-size:140%;}
    h2 {font-size:125%;}
    h3 {font-size:110%;}
*/}

@media (max-width:500px) {
    .text > p > img,
    .text > img {display:block; max-width:100%; height:auto!important; clear:both; float:none!important; margin: 5px auto;}
}
