body {font-family: 'PT Sans', sans-serif; background: #1a1822; font-size: 15px; font-size: 1.5rem; font-weight:400;}
#body-cover {padding: 80px 0 60px;}

h1, .registration h2, .h1like {margin: 0 0 0.6em; font-size: 40px; font-size: 4.0rem; font-weight: 700;}
h2:first-child, h3:first-child, h4:first-child, h5:first-child {margin-top: 0;}
input[type="text"], input[type="email"], input[type="password"], input[type="date"], select, textarea {width: 100%; padding: 0 10px; height: 35px; border-radius: 4px; font-style: italic; font-size: 15px; font-size: 1.5rem;}
select {font-style: normal;}
textarea {padding: 10px; height: auto;}
label {font-size: 15px;}
input[type="submit"] {display:block; margin: 1em auto; padding: 0 15px; height: 45px; background: #d60500; color: #fff; font-weight: 700; text-align: center; font-size: 20px; font-size: 2.0rem; border: none; border-bottom: 3px solid #a80400; text-transform: uppercase; border-radius: 4px;}
input[type="submit"]:hover {background: #a80400;}
.centered {text-align: center;}

.modal {background: rgba(20, 20, 20, .85);}
.modal-content {border-radius: 4px;}
.modal-header {border-radius: 4px 4px 0 0; background: url(../img/checkered.png) right 0 repeat-y #2b2937; }
.modal-title {font-size: 15px; font-size: 1.5rem; font-weight: 700;}
.modal-header .close {font-size: 32px; font-size: 3.2rem; color: #fff; text-shadow: none; opacity:1; margin-top: -7px;}
.modal-header .close:hover {color: #ff6e00;}
.modal form {position: relative; margin-bottom: 10px;}
.modal .form-title {float:left; margin-right:20px; margin-top: 2px;}
.modal .form-group {clear:both; margin: 0 -15px; padding: 1em 15px;}
.modal [type="submit"] {margin: 0 auto 0.5em auto;}
.modal-footer {border:0;}
.modal .panel-group {margin: 0 -15px;}
.modal .h1like {margin:0;}
.imageradio .form-title {float:none;}
.imageradio label {padding:0;}
.imageradio label > input {display:none;}
.imageradio label > input + img {cursor:pointer; height: 79px; width: 79px; padding: 12px; border-radius: 4px;}
.imageradio label > input:checked + img {border:3px solid #ff6e00; padding: 10px;}
#gamesettings .imageradio {padding-bottom: 35px; margin-bottom: 35px; border-bottom: 1px solid #d8dce2;}
#gamesettings .imageradio label > input + img {background: #fff; height: 100px; width: 100px;}
#gamesettings .imageradio label:last-of-type > input + img {margin-right:0;}
#gamesettings .imageradio.fields label > input + img {padding:0;}

/* imageradio - IE clickable img */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .imageradio label > input + img {pointer-events: none;}
}

.navbar {min-height: 67px; color: #7c7f94;}
.navbar .row {background: url(../img/checkered.png) 542px -4px repeat-y;}
.navbar-brand {padding-top: 10px; padding-bottom: 0; height: auto;}
.navbar.navbar-inverse {background: #2b2937; border-bottom: 3px solid #1a1822;}
.navbar-inverse .navbar-nav > li {border-left: 1px solid #1a1822;}
.navbar-inverse .navbar-nav {border-right: 1px solid #1a1822;}
.navbar-inverse .navbar-nav > li > a {color: #f0f2f5; line-height: 34px;}
.navbar-inverse .navbar-nav > li > a:hover {background-color: #1a1822;}
.navbar-inverse .navbar-nav > li > a strong {margin: 0 0 -5px 10px; display: inline-block; width: 28px; height: 28px; line-height: 28px; border-radius: 50%; background: #ff6e00; text-align: center; color: #fff; font-size: 13px; font-size: 1.3rem; text-shadow: 0px 1px 0px #b04c00;}
.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {color: #fff; background-color: #1a1822;}

#menu_more .dropdown-menu,
#menu_sub .dropdown-menu {
  background: #1a1822 none repeat scroll 0% 0%;
  border-radius: 0px;
  border: medium none;
  padding-bottom: 10px;
  width: 100%;
}

#menu_more a,
#menu_sub a {
  color: #f0f2f5;
}

#menu_more .dropdown-menu a:hover,
#menu_sub .dropdown-menu a:hover {
  background: #2b2937 none repeat scroll 0% 0%;
}

.navbar-inverse #menu_more .dropdown-toggle {
  background: #ff6e00 none repeat scroll 0 0 !important;
  border: medium none;
  margin-top: 17px;
}
.navbar-inverse #menu_more .dropdown-toggle {
  border-color: #333;
}

#menu_more .dropdown-toggle {
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
  margin-bottom: 8px;
  margin-left: 10px;
  margin-top: 8px;
  padding: 9px 10px;
}

#menu_more .dropdown-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}

.navbar-inverse #menu_more .dropdown-toggle .icon-bar {
  background-color: #fff;
}

#menu_more .dropdown-toggle .icon-bar {
  border-radius: 1px;
  display: block;
  height: 2px;
  width: 22px;
}

#switches {float:right; padding-top: 19px;}
#switches button {display:block; width: 28px; height: 28px; padding:0; margin:0 0 0 5px; list-style-type:none; float:left; border:none; overflow: hidden; text-indent: 100px; background-color: #7c7f94; border-radius: 50%; cursor: pointer;}
#switches > button:first-child { margin-left: 0; }
#switches .light, #switches .light.on {background: url(../img/switch-light.svg) 0 0 no-repeat #7c7f94;}
#switches .light.off {background-position: right 0;}
#switches .sound, #switches .sound.on {background: url(../img/switch-sound.svg) 0 0 no-repeat #7c7f94;}
#switches .sound.off {background-position: right 0;}
#switches a:hover {background-color: #65687a !important;}

#switches .dropdown.select-language {float: left;}

#switches .dropdown.select-language > .dropdown-menu {
  left: 5px;
  background: #1a1822 none repeat scroll 0 0;
  border: none; /*1px solid #5d6176;*/
  border-radius: 0;
  padding-bottom: 10px;
  min-width: 200px;
  width: 100%;
}

#switches .dropdown.select-language > .dropdown-menu a {
  color: #f0f2f5;
}

#switches .dropdown.select-language > .dropdown-menu a img {
  height: 16px;
  width: 16px;
  margin-right: 10px;
}

#switches #switch-language {background: url(../img/switch-language.svg) 0 0 no-repeat #7c7f94; text-indent: 0; overflow: visible;}

#switches .selected-language {
  color: #fff;
  font-weight: bold;
  left: 14px;
  position: relative;
  text-shadow: 0 0 1px #000;
  top: 8px;
}

#language-chooser {
  padding: 0 10px;
}

#language-chooser li {
  list-style: none;
  display: inline-block;
}

#language-chooser li a {
  border-radius: 4px;
  text-decoration: none;
  padding: 0 5px;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 250px;
  height: 35px;
  vertical-align: middle;
  border: 3px solid transparent;
}

#language-chooser li a:hover,
#language-chooser li a:focus {
  border: 3px solid #ff6e00;
}

#language-chooser li a img {
  margin-top: -2px;
  margin-right: 10px;
}

#login {background: url(../img/login.svg) 15px 50% no-repeat #1a1822; height: 64px; color: #f0f2f5; padding:0;}
#login .btn.btn-default {background: none; padding: 0 0 0 55px; width: 100%; border:none; border-radius:0; text-align: left; height: 64px; color: #f0f2f5; background: url(../img/login-btn.svg) right 31px no-repeat;}
#login .open .btn.btn-default {background-position: right -163px; }
#login .dropdown-menu {border-radius: 0; border:none; background: #1a1822; padding-bottom: 10px; width:100%;}
#login a {color: #f0f2f5;}
#login .dropdown-menu a:hover {background: #2b2937;}
#login-unlogged {padding: 22px 15px 0 55px;}

.alert {padding-top: 8px; padding-bottom: 8px;}
.alert p {margin:0; display: inline-block; margin-right: 30px;}
.alert .btn {margin: -7px 8px -4px 0px; padding: 3px 15px; color: #fff; border: none; font-weight: bold;}

#menu-cover {overflow: hidden; border-radius: 4px; margin-bottom: 15px;}
#game-over .modal-dialog {width: 400px;}
#game-over .h1like {font-size: 3rem;}
#game-menu, .user-menu, .record-menu, .victory-menu, .modal-body .socials {list-style-type:none; padding:0 !important; border-radius: 4px; margin-bottom: 15px;}
#game-menu { margin-bottom: 0; padding-bottom:0;}
.user-menu {margin:30px 30px 0 0; clear:both;}
.victory-menu {margin: 30px 0; clear: both;}
.user-menu li, .record-menu li {float:left; padding-right: 15px;}
#game-menu li a, .user-menu li a, .record-menu li a, .registration .controls li a, .registration .socials a, .modal-body .socials a, .victory-menu > li > a, #game-menu-phone button {display: block; padding: 10px 15px; background-color: #394165; border-radius: 4px; text-align: center; background-repeat: no-repeat; text-decoration: none; color: #fff; font-size: 20px; font-size: 2.0rem; line-height: 22px;}
.home #game-menu li a, .user-menu li a, .record-menu li a, .registration .socials li a, .modal-body .socials li a, .victory-menu > li > a {padding-left: 50px; text-align: left;}
.record-menu {float:left; margin:0;}
.record-menu li a, .victory-menu > li > a {padding: 8px 10px 6px 35px; font-size: 15px; font-size: 1.5rem;}
#game-menu li.btn-playnow a, .user-menu .btn-challengeme a, .victory-menu .btn-rematch a {padding: 10px 15px !important; text-align: center; font-weight: 700; background-color: #d60500; border-color: #a80400;}
.victory-menu .btn-rematch a {padding: 8px 15px 6px !important;}
#game-menu li.btn-playnow a:hover, .user-menu .btn-challengeme a:hover, .victory-menu .btn-rematch a:hover {background-color: #a80400; color: #fff;}
#game-menu li.btn-invitefriend a {background-image: url(../img/ico-invitefriend.svg); background-position: 15px 12px;}
#game-menu li.btn-creategame a {background-image: url(../img/ico-creategame.svg); background-position: 15px 13px;}
#game-menu li.btn-playagainstcomputer a {background-image: url(../img/ico-playagainstcomputer.svg); background-position: 15px 14px;}
.user-menu li.btn-sendpm a {background-image: url(../img/ico-sendpm.svg); background-position: 15px 15px;}
.user-menu li.btn-report a {background-image: url(../img/ico-sendpm.svg); background-position: 15px 15px;}
.user-menu li.btn-follow a {background-image: url(../img/ico-follow.svg); background-position: 15px 12px;}
.user-menu li.btn-unfollow a {background-image: url(../img/ico-unfollow.svg); background-position: 18px 12px;}
.user-menu li.btn-profile a {background-image: url(../img/ico-invitefriend.svg); background-position: 18px 12px;}
.user-menu li.btn-settingsu a {background-image: url(../img/ico-settingsu.svg); background-position: 16px 11px;}
.record-menu li.btn-analysis a {background-image: url(../img/ico-analysis.svg); background-position: 10px 12px;}
.record-menu li.btn-downloadpgn a {background-image: url(../img/ico-downloadpgn.svg); background-position: 13px 10px;}
.record-menu li.btn-share a, .victory-menu li.btn-share > a {background-image: url(../img/ico-share.svg); background-position: 9px 10px;}
.victory-menu li.btn-newgame a {background-image: url(../img/ico-newgame.svg); background-position: 10px 10px;}
.victory-menu li.btn-share {position:relative;}
.dropdown-menu.share {border: 1px solid #9298a3; padding: 10px 0; border-radius: 4px; left: 50%; margin-left: -105px; width: 210px;}
.dropdown-menu.share a {display: block;}
.dropdown-menu.share:after {width: 29px; height: 18px; display:block; position: absolute; left: 50%; top: -18px; margin-left:-15px; background: red; content:''; background: url(../img/share-after.png) no-repeat 0 0;}
#game-menu-phone {margin-bottom: 20px;}
#game-menu-phone .btn-group.cover {width: 100%;}
#game-menu-phone button {border: none;}
#game-menu-phone .btn-group.cover > button { margin-right: 20px; width:30%; margin-right:5%}
#game-menu-phone .btn-group.cover > .btn-group {width: 30%;}
#game-menu-phone .btn-group.cover > .btn-group > button {border: none; width: 100%;}
#game-menu-phone .dropdown-menu {box-shadow: none; border: none; background-color: #394165; color: #fff; font-size: 15px; font-size: 1.5rem; left: auto; right:0;}
#game-menu-phone .dropdown-menu a {color: #fff; padding-top: 10px; padding-bottom: 10px; text-align: center;}

#chessboard {position: relative; width: 100%; border-radius: 4px;}
#chessboard:before{content: ""; display: block; padding-top: 100%;  /* initial ratio of 1:1*/}
#chessboard-game{position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-size: cover !important;}
#game-names {display: none; position: absolute; right: 23px; top: 1px; font-size: 14px; font-size: 1.4rem;}
#game-names img {display:block; float:right; margin: 1px 0 0 10px;}

.block-basic {border-radius: 4px; margin-bottom: 15px; overflow: hidden;}
.block-basic.tab-pane {border-top:0; border-radius: 0 0 4px 4px;}
.block-basic.padded {padding: 15px;}
.block-basic table {width: 100%;}
.block-basic.registration {text-align: center;}

.registration h2 {margin: 1em 20px 0;}
.registration p {margin: 0 20px 2em;}
.registration .controls, .registration .socials {padding:0;}
.registration .controls, .registration .socials, .modal-body .socials {padding-bottom: 0.5em; border-radius: 0;}
.registration .controls li, .registration .socials li, .modal-body .socials li, .victory-menu li {float:none; display:inline-block; padding: 0 10px;}
.registration .controls input[type="submit"] {display: inline;}
.registration .socials li a, .modal-body .socials li a {font-size: 17px; font-size: 1.7rem; background: url(../img/reg-socials.svg) no-repeat 0 0;}
.registration .socials li.soc-facebook a, .modal-body .socials li.soc-facebook a {background-color: #4e71a8; border-color: #264a83;}
.registration .socials li.soc-facebook a:hover, .modal-body .socials li.soc-facebook a:hover {background-color: #264a83;}
.registration .socials li.soc-twitter a, .modal-body .socials li.soc-twitter a {background-color: #1cb7eb; border-color: #0981aa; background-position: 0 -82px;}
.registration .socials li.soc-twitter a:hover, .modal-body .socials li.soc-twitter a:hover {background-color: #0981aa;}
.registration .socials li.soc-google a, .modal-body .socials li.soc-google a {background-color: #e3411f; border-color: #a62206; background-position: 0 -164px;}
.registration .socials li.soc-google a:hover, .modal-body .socials li.soc-google a:hover {background-color: #a62206;}
.registration .controls li.registration_link a {display:block; margin: 1em auto; padding: 10px 30px; height: 45px; background: #d60500; color: #fff; font-weight: 700; text-align: center; font-size: 20px; font-size: 2.0rem; border: none; border-bottom: 3px solid #a80400; text-transform: uppercase; border-radius: 4px;}
.registration .controls li.registration_link a:hover {background: #a80400;}
.registration form .row {padding-bottom: 30px;}
.registration input[type="submit"] {padding-right: 30px; padding-left: 30px;}
.modal-body .socials {padding: 1em 0;}
.modal-body .socials li {clear:both; display:block; margin: 0 auto 15px; max-width: 280px;}

.game .tab-pane {height: 355px; }
#chat {padding-bottom: 90px; position:relative;}
#chat-answers {height:100%;}
.chat-row {padding: 9px 0 5px;}
.chat-row p {padding-left: 36px; line-height: 18px;}
.chat-row p:last-of-type {margin-bottom:0;}
.onthemove-color, .chat-row-color {height: 80px; width: 80px; display: table-cell; vertical-align: middle; border-radius: 50%; text-align: center;}
.chat-row-color {height: 26px; width: 26px; padding-bottom: 3px; float:left; margin: -4px 10px 0 0; }
.onthemove-color img {height: 50px;}
.chat-row-color img {height: 16px;}
#chat-input {position: absolute; left:0; right:0; bottom:0; height:66px; padding: 15px;}
.switch.chat {position: absolute; left: 15px; top: -23px; padding-left: 22px; text-transform: uppercase; color: #adb2b9; text-decoration: none; font-size: 12px; font-size: 1.2rem; background: url(../img/chat-mute.svg) no-repeat 0 3px;}
.switch.chat.off {background-position: 0 -25px;}
#chat-input input[type="text"] {padding-right: 60px;}
#chat-input input[type="submit"], .nav-tabs li.filtering input[type="submit"], #modal-share input[type="submit"], #contact-widget input[type="submit"] {height: 35px; width: 50px; background: url(../img/chat-submit.svg) no-repeat 50% 60% #394165; position: absolute; right: 15px; top: 15px; margin:0; border-radius: 0 4px 4px 0; border: none; text-indent: 100px;}
.nav-tabs li.filtering input[type="submit"], #contact-widget input[type="submit"] {background-image: url(../img/ico-search.svg);}

.nav-tabs li {font-size: 17px; font-size: 1.7rem;}
.nav-tabs li > a {font-weight:700;}
.home .tab-pane {height:705px;}
.tab-pane.wide {padding-top: 30px;}
.profile .tab-pane {padding-bottom: 30px;}
table.result {width:100%;}
table.result td {padding: 6px 5px;}
table.result tr:last-of-type td {border:none;}
table.result td img {margin-top: -2px; display:block; height: 22px;}
.stats {padding: 0 15px;}
.stats table.result td img {display: inline; height: auto;}
.block-header {padding: 0 40px 0 15px; font-size: 15px; position: relative;}
.block-header table {font-weight: 700; }
.block-header table td {padding: 10px 5px 6px 5px; height: 40px; vertical-align: top;}
.block-header img {height: 22px;}
.block-header.title {padding: 12px 15px;}
.block-header.title h2, .block-header.title h1 {font-size: 15px; font-size: 1.5rem; font-weight:700; margin:0;}
.block-header.title.user-game h2 {font-size: 20px; font-size: 2.0rem; font-weight:400;}
.block-header.dif-bullet {border-right: 15px solid #b0d213;}
.block-header.dif-blitz {border-right: 15px solid #00b8ce;}
.block-header.dif-standard {border-right: 15px solid #ff6e00;}
.table-body {height: 310px; padding: 10px 15px; margin-bottom: 40px;}
.game table.result td img {height: 17px; float:left; margin-top: 3px; margin-right: 5px;}
.game table.result td {padding: 1px 5px 2px;}
.btn-settings, .btn-download {position: absolute; right:0; top:0; display:block; width:40px; height: 40px; overflow: hidden; text-indent: 100px; background: url(../img/ico-settings.svg) no-repeat 50% 50%; border-left: 1px solid #d8dce2;}
.btn-download {background: url(../img/ico-download.svg) no-repeat 50% 50%;}
.btn-sorting {display: inline-block; width: 14px; height: 14px; background:red; overflow: hidden; text-indent: 100px; margin: 0 0 -1px 5px; background: url(../img/ico-sorting.svg) no-repeat 50% 50%;}
.table-td1 {width: 16%}
.table-td3, .table-td4 {width: 23%;}
.table-td2 {width: 30%;}

.mode-human-vs-bot {
  font-style: italic;
}

.home table.result tr td:last-child::after {
  position: relative;
  top: 3px;
  float: right;
  right: 5px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.home table.result tr:hover td:last-child::after { content: "\e013"; }
.home table.result tr.myself:hover td:last-child::after { content: "\e014"; }

.sorting {position: relative;}
.sorting form {position: absolute; right:0; top:0;}
.sorting label {float:left; line-height: 35px; margin-right: 15px; color: #65687a;}
.sorting .sbHolder {float:left; width: 170px;}
.nav-tabs li.filtering {padding-left:25px;}
.nav-tabs li.filtering form {float:left; padding-right: 20px;}
.nav-tabs li.filtering input, #modal-share input {float:left; clear: none; margin:0;}
.nav-tabs li.filtering input[type="text"], #modal-share input[type="text"] {width: 210px; border-radius: 4px 0 0 4px;}
.nav-tabs li.filtering input[type="submit"], #modal-share input[type="submit"] {position: static; margin-left: -1px;}
#modal-share input[type="text"], #contact-widget input[type="text"] {width: 100%; padding-right: 60px}
#modal-share input[type="submit"] {position: absolute; right:0; top:0; margin: 0; background: url(../img/copy-submit.svg) no-repeat 50% 60% #394165;}
.nav-tabs li.filtering a {float:left; height: 35px; background: #394165; line-height: 30px; padding:0 15px; font-weight: normal; color: #fff; border-radius: 4px; border: none;}
.block-basic.gamelist-game {margin-bottom: 30px; background: #fff;}
.gamelist-game img {width: 100%;}
.gamelist-user {padding: 7px 15px; color: #000;}
.gamelist-user.black {background: #000; color: #fff;}
.gamelist-user span {float:right;}

.nav-tabs li.filtering .dropdown-menu { width: 210px; border-top-left-radius: 4px; }
.nav-tabs li.filtering .dropdown-menu li { font-size: 1.5rem; }
.nav-tabs li.filtering .dropdown-menu a { float: none; display: block; background-color: transparent; border-bottom: none; font-weight:400; border-radius: 0; line-height: 35px; }

.paging {clear:both; list-style-type:none; text-align:center; padding:0;}
.paging li {display: inline-block; padding: 0 5px;}
.paging li a {display: block; height: 45px; width: 45px; padding: 0 5px; border: 2px solid #65687a; border-radius: 4px; line-height: 39px; color: #65687a; font-size: 20px; font-size: 2.0rem; text-align: center; text-decoration: none;}
.paging li.previous {float:left; padding:0;}
.paging li.previous a {width: auto; padding: 0 15px 0 35px; background: url(../img/paging.svg) no-repeat 0 -1px;}
.paging li.next {float:right; padding:0;}
.paging li.next a {width: auto; padding: 0 35px 0 15px; background: url(../img/paging.svg) no-repeat right -46px;}
.paging li.active a {border-color: #f58a39; background: #f58a39 !important; color: #fff;}
.paging.small {padding: 0 15px;}
.paging.small li a {width: 45px; text-indent: 100px; overflow: hidden; padding:0;}
.paging.small li.current {color: #65687a; font-size: 15px; font-size: 1.5rem; line-height: 45px;}
.paging.small li.previous a {background-position: -2px -2px}
.paging.small li.next a {background-position: -2px -47px}

.player-summary h2 {padding: 0.7em 15px; margin:0; font-size: 17px; font-size: 1.7rem;}
.game-time {text-align: center; font-size: 33px; font-size: 3.3rem; line-height: 55px;}
.knocked-figures {padding: 15px; height: 62px;}
.knocked-figures img {height: 30px;}
.knocked-figures .knocked-figure {display:inline; margin-right: 15px; position: relative;}
.knocked-figures .amount, .chat-new {display:block; width: 20px; height: 20px; position: absolute; right: -6px; bottom: -6px; background: #ff6e00; border-radius: 50%; text-align: center; color: #fff; font-size: 14px; font-size: 1.4rem; text-shadow: 0px 1px 0px #b04c00; line-height: 18px;}
.chat-new {position: static; display: inline-block; margin-left: 3px;}

.panel-default {border:none; margin:0 !important; box-shadow: none; border-radius:0 !important; background: transparent;}
.panel-body {border:none !important; padding-top:5px;}
.panel-body.heighted {max-height:560px;}
.panel-heading {padding:0; background: none !important; border:none !important; }
.panel-heading a {display:block; padding: 10px 15px 10px 35px; text-decoration:none; color: #65687a; font-size: 17px; font-size: 1.7rem; background: url(../img/ico-panel-heading.svg) 15px 19px no-repeat;}
.panel-heading a.collapsed {background-position: -775px 19px;}
@media screen and (-webkit-min-device-pixel-ratio:0){
  .panel-heading a {background-position: -20px 19px;}
  .panel-heading a.collapsed {background-position: -740px 19px;}
}

/* Safari 6.1+ */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) {
  @media {
    .panel-heading a {background-position: 15px 19px;}
    .panel-heading a.collapsed {background-position: -775px 19px;}
  }
}

.filter .checkbox {float:left; width: 50%; padding-right: 10px; margin:10px 0 0;}
.filter label {padding-left: 0;}
.pad-box {padding: 0 15px;}
.form-end {padding-top: 1em; margin-top: 1em;}

#profile-summary, #profile-about-us {padding: 30px 0; margin-bottom: 30px;}
#profile-summary h1, #profile-about-us h1 {margin:0;}
#profile-summary h1 img, #profile-about-us img {margin: -3px 0 0 25px;}
#profile-image-big {padding-left: 30px;}
#profile-image-big img {border-radius: 50%; max-width:100%; width: 155px; display: block; margin: 0 auto;}
.motto {float:right; width: 550px; padding: 0 30px 25px 50px; color: #65687a; font-size: 18px; font-size: 1.8rem; line-height: 24px;}
#profile-about-us .motto {width: auto; padding-bottom: 0; font-size: 15px; font-size: 1.5rem; line-height: 1.42857;}
.gamelist-game-details {height: auto;}
.user-game-record {padding: 25px 15px 25px 25px; height: 230px;}
.user-game-record h3 {font-size: 17px; font-size: 1.7rem; font-weight: 700; margin-bottom: 20px;}
.custom-counter {margin: 0; padding: 0; list-style-type: none;}
.custom-counter li {counter-increment: step-counter; float:left; margin-right: 20px; padding-bottom: 7px;}
.custom-counter li::before {content: counter(step-counter)"."; color: #787b8b;}
.custom-counter img {height: 14px; margin: -4px 2px 0;}
.user-game-more {padding: 9px 25px; color: #787b8b;}
.user-game-more p { float:left; line-height: 40px; margin-right: 15px;}

#footer-cover {background: #2b2937;}
#footer {padding-top: 25px; padding-bottom: 15px; font-size: 14px; background: url(../img/checkered.png) right 0 repeat-y;}
#footer .col-md-6 {color: #555268;}
#footer #copyright {font-size: 12px;clear:both; }
#footer .nav li {display: inline-block; float:left; border-right: 1px solid #555268; padding-right:10px; margin-right:10px; line-height: 16px; padding-bottom: 2px;}
#footer .nav li:last-of-type {border:none;}
#footer .nav li a {padding:0; background:none; color: #9095ab;}
#footer .nav li a:hover {color: #fff;}
#footer .socials {float:right;}
.socials-ext .socials li, .dropdown-menu.share li {list-style-type: none; float:left; padding: 0 0 0 20px;}
.socials-ext .socials li a, .dropdown-menu.share li a {display: block; width: 42px; height: 42px; overflow: hidden; border-radius:50%; background: url(../img/socials.svg) 0 0 no-repeat; text-indent: 100px;}
.socials-ext .socials li a:hover {background-color: #fff;}
.socials-ext .socials li.soc-twitter a, .dropdown-menu.share li.soc-twitter a{background-position: -42px 0;}
.socials-ext .socials li.soc-google a, .dropdown-menu.share li.soc-google a {background-position: -84px 0;}

#contact-widget {width: 270px; position: fixed; right:60px; bottom:0; z-index:100; border-bottom:0; border-radius: 4px 4px 0 0;}
#contact-widget .btn-widget {width: 100%; padding: 9px 12px; background: #ff6e00; border-radius: 4px 4px 0 0; color: #fff; font-weight: bold; text-align: left; border-bottom: 1px solid #c25400;}
#contact-widget .btn-widget:hover {background: #c25400;}
#contact-widget .well {background: none; border:none; border-radius:0; padding:0;}
#contact-widget form {position:relative; padding: 15px;}
#contact-widget .panel-heading {position:relative;}
#contact-widget .panel-heading a {padding: 6px 15px 6px 30px; background:none; font-size: 15px;}
#contact-widget .panel-heading:after {position: absolute; left:15px; top:10px; width: 8px; height: 8px; content:''; border-radius: 50%;}
#contact-widget .panel-heading.online:after {background: #ff6e00;}
#contact-widget .user-menu {margin:0 0 0 15px;}
#contact-widget .user-menu li {}
#contact-widget .user-menu li a {width: 42px; height: 30px; padding:0; overflow: hidden; text-indent:100px; line-height: 100px; background-position: 50% 55%;}
#contact-widget .user-menu li.btn-challengeme a {background-image: url(../img/ico-challengeme.svg);}
#contact-widget .user-menu li.btn-sendpm a {background-size: auto 13px;}
#contact-widget .user-menu li.btn-profile a {background-size: auto 18px;}

/* * * * * * *
 * FORMULARE *
 * * * * * * */

.radio-switch {
  position: relative;
  margin: 28px 0 0 0;
  height: 34px;
  width: 60px;
  background: #d8dce2;
  border-radius: 17px;
  padding:4px 0 0 4px;
}

.knocked-figures form {float:right;}
.knocked-figures .radio-switch {margin-top:0;}

.switch-label {
  position: relative;
  z-index: 2;
  float: left;
  width: 26px;
  height: 26px;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
  text-indent: 100px;
}
.switch-input {display: none;}
.switch-input:checked + .switch-label {background-position:0 0;}
.switch-input:checked + .switch-label-off ~ .switch-selection {left: 30px;}
.visibility .switch-label-on {background: url(../img/ico-visibility-show.svg) 0 bottom no-repeat;}
.visibility .switch-label-off {background: url(../img/ico-visibility-hide.svg) 0 bottom no-repeat;}
.figures .switch-label-on {background: url(../img/ico-figures-sum.svg) 0 bottom no-repeat;}
.figures .switch-label-off {background: url(../img/ico-figures-diff.svg) 0 bottom no-repeat;}

.switch-selection {
  display: block;
  position: absolute;
  z-index: 1;
  top: 4px;
  left: 4px;
  width: 26px;
  height: 26px;
  background: #65687a;
  border-radius: 50%;
  -webkit-transition: left 0.15s ease-out;
  -moz-transition: left 0.15s ease-out;
  -o-transition: left 0.15s ease-out;
  transition: left 0.15s ease-out;
}

/* Removes the default 20px margin and creates some padding space for the indicators and controls */
.carousel {
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
}
/* Reposition the controls slightly */
.carousel-control {
  left: -12px;
}
.carousel-control.right {
  right: -12px;
}
/* Changes the position of the indicators */
.carousel-indicators {
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.carousel-indicators li {
  background: #c0c0c0;
}
.carousel-indicators .active {
background: #333333;
}

/* * * * * * *
 * RESPONZE *
 * * * * * * */

@media (min-width: 992px) and (max-width: 1200px) {
  #navbar .navbar-nav {float: right;}
  .home #game-menu li a {font-size: 16px; font-size: 1.6rem; padding-left: 45px;}
  #chessboard {height: 617px;}
  .panel-body.heighted {max-height: 422px;}
  .home .tab-pane {height: 572px;}
  .game .tab-pane {height: 216px; }
  .table-body {height: 180px; }
  .col-md-4 .nav-tabs li > a {padding-left: 10px; padding-right: 10px;}
  .onthemove-color {height: 60px; width: 60px;}
  .onthemove-color img {height: 40px;}
  .block-basic.gamelist-game, .gamelist-game-details {height: auto;}
  .user-game-record {padding: 15px; height: 180px;}
  .user-game-more {padding: 9px 15px; font-size: 14px; font-size: 1.4rem;}
  .record-menu li {padding-right:10px;}
  .record-menu li a {font-size: 14px; font-size: 1.4rem; padding-left: 26px; background-position: 7px 55% !important; background-size: auto 40%;}
  .motto {width: 450px;}
  #gamesettings .imageradio label > input + img {height: 83px; margin-right:10px;}
}

@media (max-width: 992px) {
  #navbar .navbar-nav {float: right;}
  #switches {float:left; padding-bottom: 15px; padding-left:0;}
  .navbar-inverse .navbar-nav > li {border-bottom: 1px solid #1a1822;}
  #game-menu li {margin-bottom:0 !important;}
  .game #game-menu li:nth-last-child(2) {margin-bottom: 0;}
  #chessboard {margin-bottom: 20px;}
  .block-basic.gamelist-game, .gamelist-game-details {height: auto;}
  .motto {width: 100%; clear: both;}
  #profile-summary, #profile-about-us {padding: 30px;}
  #profile-summary h1, #profile-summary h2, #profile-summary p, #profile-about-us h1, #profile-about-us h2, #profile-about-us p {text-align: center;}
  .user-menu {margin-right:0;}
  #profile-summary .user-menu li {float: none; width: 100%; padding:0 0 15px 0;}
  .gamelist-game-details {height: auto;}
  .user-game-record {height: auto; max-height: 600px;}
  .paging.small {margin-bottom: 40px;}
  .registration form {padding:0 30px;}
  .registration form .col-md-4 {margin-bottom: 15px;}
  .radio-switch.visibility {margin: 0 0 30px;}
  #profile-image-big {padding: 0 0 30px 0;}
  #gamesettings .imageradio label {margin:0 0 20px; padding:0;}
  #gamesettings .imageradio label > input + img {height: 80px;}
  #body-cover {padding-bottom: 15px}
}

@media (max-width: 767px) {
  #navbar .navbar-nav {float: none;}
  #game-menu {background: none !important;}
  #game-menu li {margin-bottom:0 !important;}
  #contact-widget {left:15px; right: auto;}
  #footer .socials {float:none; padding:0;}
  #footer .socials li {padding: 10px 20px 50px 0;}
  .panel-body.heighted {max-height: none !important;}
  .home .tab-pane {height: auto; }
  .navbar-brand {padding-left:0;}
  .navbar-inverse .navbar-toggle {background: #ff6e00 !important; margin-top: 17px; border:none;}
  .navbar-inverse .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {background-color: #c25400 !important;}
  .navbar-inverse .navbar-collapse {margin-top: 10px;}
  .navbar-inverse .navbar-nav {margin-top:0;}
  .navbar-inverse .navbar-nav > li {border-left:0; border-right:0 !important;}
  #chessboard {height: auto;}
  .paging li.previous a, .paging li.next a {width: 45px; height: 45px; padding:0; overflow: hidden; background-position: -2px -2px;}
  .paging li.next a {background-position: -1px -47px;}
  .motto {padding:0 0 10px 0; text-align: center;}
  .registration .socials li {padding-bottom: 15px;}
  .player-summary {float:left; width: 50%; border-radius: 4px 0 0 4px;}
  .player-summary.myself {border-radius: 0 4px 4px 0;}
  .player-summary h2, .game-time {float:left; width: 50%; min-height: 65px; text-align: center;}
  .game-time {font-size: 25px; font-size: 2.5rem; line-height: 65px;}
  .player-summary.myself h2, .myself .game-time {float:right;}
  .knocked-figures {clear:both; min-height: 70px; padding: 15px 5px;}
  .knocked-figures img {height: 25px;}
  .knocked-figures .knocked-figure {margin-right: 5px;}
  .knocked-figures .amount {width: 15px; height: 15px; line-height: 15px;}
  #body-cover {padding-bottom: 15px}
  #profile-image-big {padding: 0 0 15px !important;}
  #profile-summary .user-menu li:last-child {padding-bottom: 0 !important;}
  .block-basic.gamelist-game {margin-bottom:15px;}
  .filtering form {padding-bottom:0 !important;}
  .paging.small {margin-bottom: 25px;}
  .registration h2 {margin: 0.5em 0 0 0;}
  .registration p {margin: 0 0 1em;}
  .registration .socials {padding-bottom:10px;}
  .registration form .row {padding-bottom:0;}
  .chessboard {padding:0;}
  #chessboard {border-radius:0;}
}

@media (max-width: 767px) {
  #game-menu li {margin-bottom:15px !important;}
  #game-menu li:last-of-type {margin-bottom:0px !important;}
}

@media (max-width: 650px) {
  .filtering {clear:both; padding: 15px 0 !important;}
  .filtering form {padding:0 15px 15px 0 !important;}
  .sorting form {position: static; clear:both; margin: 20px 0 0; height: 40px;}
  .record-menu li, .victory-menu li {margin-bottom: 15px;}
  .user-game-more p {float:none; margin:0;}
  .registration .socials li {padding-left: 25px; padding-right: 25px;}

  /* Get rid of the chessboard rim and display the chessboard at the full width */
  #chessboard-game {top: 0; right: 0; bottom: 0; left: 0;}
  #game-names {display: none;}
}

a, .ui-slider-handle {
  cursor: pointer !important;
}

/* Padding for pieces inside squares. Must use px, using % will cause the piece to disappear when moved */
/* Non-game, or small board */
.piece-417db {padding: 2px;}
/* In-game, or live game at top page */
.home .piece-417db, .game .piece-417db {padding: 10px;}
/* In-game - small devices (live game at top page is not shown on small devices) */
@media (max-width: 650px) {
  .game .piece-417db {
    padding: 5px;
  }
}

.figure-promotion {
  position: absolute;
  top: 55px;
  left: -20px;
  z-index: 999;
  width: 114px;
  padding: 5px;
  border: 2px solid #A0A0A0;
  background: url("../img/promotion-transparent.png");
  -moz-box-shadow: 0 3px 5px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.3);
  box-shadow: 0 3px 5px rgba(0,0,0,0.3);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.figure-promotion i {
  position: absolute;
  top: -10px;
  left: 45px;
  display: block;
  width: 20px;
  height: 10px;
  background: url("../img/promotion-dropdown.png") 0 0 no-repeat;
}
.figure-promotion ul {
  margin: 0;
  padding: 0;
}
.figure-promotion li {
  display: block;
  float: left;
}
.figure-promotion a {
  display: block;
  padding: 5px;
}
.figure-promotion a:hover {
  background-color: #C0C0C0;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.figure-promotion img {
  display: block;
  width: 40px;
  height: 40px;
}

.message-general .message.alert, .messages .alert {
  margin-bottom: 15px;
}

.messages+:not(.messages) {
  margin-top:15px;
}

.message-general ul {
  width: 100%;
}

.glow {
  -webkit-box-shadow:0 0 30px #d9fcb4;
  -moz-box-shadow: 0 0 30px #d9fcb4;
  box-shadow:0 0 30px #d9fcb4;
}

@font-face {
  font-family: "figurine";
  src: url("figurine.woff?2018-02-08") format('woff');
}

#scoresheet {position: relative; padding-bottom: 90px;}
#scoresheet_moves {height: 100%; margin-bottom: 0;}
#scoresheet_moves .table-body {height: 100%; margin-bottom: 0;}
#scoresheet_controls {position: absolute; left:0; right:0; bottom:0; height: auto; padding: 10px; text-align: center;}

#scoresheet table, .custom-counter {
  font-family: figurine;
  font-size: 1.8rem;
}

#scoresheet table td:focus {
  outline: none;
}

#scoresheet table td {
  cursor: pointer;
}