@charset "UTF-8";
#root {
  /* ICON */
  /* FAVOURITE BTN */
  /* CATEGORY FILTER */
  /* OFFER */ }
  #root #loto {
    background-color: #f0f0f0; }
  #root #loto div.loto .toggle-display {
    float: right;
    cursor: pointer;
    padding: 0px;
    height: 35px;
    display: block;
    margin-top: 15px;
    margin-left: 15px;
    width: 35px;
    border-radius: 2px;
    background-image: url(../images/loto/statistika_gumb.svg?1);
    background-position: center;
    background-repeat: no-repeat; }
  #root #loto div.loto .toggle-display:hover {
    background-image: url(../images/loto/statistika_gumb_hover_klik.svg?1); }
  #root #loto div.loto .toggle-display.open {
    background-image: url(../images/loto/statistika_gumb_klik.svg?1); }
  #root .btn-favourite {
    background: transparent;
    border: none;
    padding: 3px;
    cursor: pointer;
    height: 15px;
    width: 15px;
    float: right;
    clear: right;
    background: url(../images/zvjezdice/zvjezdica_siva.svg?1) no-repeat center; }
  #root .btn-favourite.fav {
    background-image: url(../images/zvjezdice/zvjezdica_zuta.svg?1); }
  #root #loto div.loto {
    margin-right: 300px;
    background-color: #f0f0f0; }
  #root .category-filter {
    margin-bottom: 20px;
    float: left; }
  #root .category-filter .narrow-icon {
    text-align: right; }
  #root .category-filter .narrow-icon span {
    /*
    background-image: url(../images/strelice/strelica_lijevo_uvlacenje_izbornika.svg?1);
    cursor: pointer;
    */
    background-repeat: no-repeat;
    background-position: right 8px;
    display: inline-block;
    height: 28px; }
  #root div.category-filter div.spacer, #root div.header-loto div.spacer {
    width: 26px;
    text-align: center;
    padding-right: 7px;
    float: left;
    max-height: 35px;
    padding-left: 7px;
    margin-top: 3px; }
  #root div.category-filter div.spacer img.flag {
    width: 21px;
    margin-top: 4px; }
  #root .category-filter .subtitle .title {
    background-color: #0073d1;
    color: white;
    padding: 6px 8px;
    cursor: pointer; }
  #root .category-filter .subtitle.HL-izdvaja .title {
    cursor: default; }
  #root .category-filter .subtitle.closed .title {
    background-image: url(../images/strelice/bijela_strelica_gore.svg?1);
    background-repeat: no-repeat;
    background-position: right 9px bottom;
    border-bottom: 1px solid white; }
  #root .category-filter .subtitle.closed .expander {
    display: none; }
  #root .category-filter .subtitle .expander {
    background-image: url(../images/strelice/plava_strelica_dole.svg?1);
    background-repeat: no-repeat;
    background-position: right 7px top;
    background-color: white; }
  #root .category-filter .allOrNothing {
    padding: 5px 2%; }
  #root .category-filter .allOrNothing div {
    float: left;
    width: 42%;
    padding: 3% 2%;
    text-align: center;
    background-color: gainsboro;
    cursor: pointer;
    margin: 2%; }
  #root .category-filter .allOrNothing div.selected {
    background-color: #00d1a1; }
  #root .category-filter .loto-name {
    font-size: 15px; }
  #root .category-filter div span {
    color: #787878;
    font-size: 14px; }
  #root .category-filter div span.toggle-category-display {
    float: right;
    width: 25px;
    height: 30px;
    background-image: url(../images/strelice/crna_strelica_gore.svg?1);
    background-repeat: no-repeat;
    background-position: center; }
  #root .category-filter div.open span.toggle-category-display {
    background-image: url(../images/strelice/crna_strelica_dole.svg?1); }
  #root .category {
    width: 300px; }
  #root .category .header-loto {
    cursor: pointer;
    border-bottom: 1px solid gainsboro; }
  #root .category .header-loto .icon {
    width: 30px;
    padding: 0 10px;
    text-align: center; }
  #root .category .header-loto .category-name h3 {
    margin: 0;
    /* display: inline-block; */
    padding: 0;
    width: 300px;
    font-weight: 400;
    font-size: 16px;
    line-height: 30px; }
  #root .category.active.open .header-loto .category-name h3 {
    background-color: #e6e6e6; }
  #root .category .header-loto .category-name h3:hover {
    background-color: whitesmoke; }
  #root .category.open .header-loto {
    margin-bottom: 1px; }
  #root .category .body {
    margin-bottom: 0px; }
  #root .category .body .category-item {
    border-bottom: 1px solid #e6e6e6;
    cursor: pointer;
    padding: 5px 5px 5px 40px;
    position: relative; }
  #root .category .body .category-item:hover {
    border-bottom: 1px solid #fff;
    background: whitesmoke;
    cursor: pointer; }
  #root .category .body .category-item.selected {
    background-color: #e6e6e6; }
  #root .category .body .category-item .date-time {
    float: right; }
  #root .category .body .category-item.selected {
    border-bottom: 1px solid #fff; }
  #root .offer {
    width: calc( 100% - 300px);
    padding: 0;
    float: left; }
  #root .offer .loto-item {
    margin: 28px 10px;
    position: relative;
    background-color: white; }
  #root .offer .loto-item .header-loto {
    background: #0073d1;
    padding: 8px 15px 7px 5px;
    color: #fff;
    font-size: 16px; }
  #root .offer .loto-item .header-loto img {
    width: 23px;
    margin-right: 2px; }
  #root .offer .loto-item .header-loto a,
  #root .offer .loto-item .header-loto span {
    color: #fff;
    padding: 0 5px;
    text-decoration: none; }
  #root .offer .loto-item .header-loto .close {
    float: right;
    cursor: pointer; }
  #root .offer .loto-item .header-loto .btn-favourite {
    height: 18px; }
  #root .offer .loto-item .header-loto div.time-to-payin {
    background-image: url(../images/loto/sat_ikona.svg?1);
    background-position: left 4px;
    background-repeat: no-repeat;
    display: inline-block;
    line-height: 25px;
    padding-left: 22px;
    font-size: 14px;
    cursor: default; }
  #root .offer .loto-item .header-loto div.time-to-payin div.info {
    display: none; }
  #root .offer .loto-item .header-loto div.time-to-payin:hover {
    background-image: url(../images/loto/sat_ikona_hover.svg?1);
    color: #8BB2D5;
    position: relative; }
  #root .offer .loto-item .header-loto div.time-to-payin:hover div.info {
    display: inline-block;
    position: absolute;
    bottom: -38px;
    left: -10px;
    white-space: nowrap; }
  #root .offer .loto-item .header-loto div.time-to-payin:hover div.info div.connect {
    background-image: url(../images/strelice/plava_strelica_gore.svg?1);
    background-position: 12px top;
    background-repeat: no-repeat;
    height: 5px; }
  #root .offer .loto-item .header-loto div.time-to-payin:hover div.info div.text {
    background-color: #4196dc;
    color: white;
    font-size: 14px;
    padding: 5px 10px;
    line-height: 25px; }
  #root .offer .loto-item .sub-header div.title div.i div.info {
    display: none; }
  #root .offer .loto-item .sub-header div.title div.i:hover {
    position: relative;
    background-image: url(../images/loto/info_plavi_hover.svg?1); }
  #root .offer .loto-item .sub-header div.title div.i:hover div.info {
    display: inline-block;
    position: absolute;
    top: -33px;
    left: 4px;
    white-space: nowrap; }
  #root .offer .loto-item .sub-header div.title div.i:hover div.info div.connect {
    background-image: url(../images/loto/svjetloplava_strelica_dole.svg?1);
    background-position: 8px bottom;
    background-repeat: no-repeat;
    height: 5px; }
  #root .offer .loto-item .sub-header div.title div.i:hover div.info div.text {
    background-color: #4196dc;
    color: white;
    font-size: 14px;
    padding: 5px 10px;
    line-height: 25px; }
  #root .offer .loto-item .header-loto a.official-url {
    background-image: url(../images/loto/link_ikona.svg?1);
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 10px; }
  #root .offer .loto-item .header-loto a.official-url:hover,
  #root .offer .loto-item .header-loto a.official-url:active {
    background-image: url(../images/loto/link_ikona_hover.svg?1); }
  #root .offer .loto-item .header-loto a.name:hover,
  #root .offer .loto-item .header-loto a.name:active {
    color: #8BB2D5; }
  #root .offer .loto-item .sub-header {
    background-color: white; }
  #root .offer .loto-item .sub-header .round-data {
    float: right;
    padding-right: 10px; }
  #root .offer .loto-item .sub-header .title {
    background: #e6e6e6;
    line-height: 35px;
    padding: 0;
    font-size: 15px; }
  #root .offer .loto-item .sub-header .title span {
    padding-left: 15px; }
  #root .offer .loto-item .sub-header .title span.indent {
    padding-left: 32px; }
  #root .offer .loto-item .sub-header .title div.i {
    background-image: url(../images/loto/info_plavi.svg?1);
    background-position: 9px 7px;
    background-repeat: no-repeat;
    padding-left: 32px;
    height: 30px;
    float: left; }
  #root .offer .loto-item .sub-header .title ul {
    margin: 0;
    padding: 0;
    display: block;
    list-style: none;
    margin-right: 180px;
    margin-left: 10px; }
  #root .offer .loto-item .sub-header .title li {
    padding: 0;
    display: inline-block; }
  #root .offer .loto-item .sub-header .loto-subscriptions {
    overflow: hidden;
    font-size: 15px;
    padding: 0 20px; }
  #root .offer .loto-item .sub-header .loto-subscriptions .no-of-rounds {
    float: right;
    padding: 10px; }
  #root .offer .loto-item .sub-header .loto-subscriptions span,
  #root .offer .loto-item .sub-header .loto-subscriptions ul {
    float: left;
    list-style: none;
    padding: 15px;
    margin: 0;
    line-height: 40px; }
  #root .offer .loto-item .sub-header .loto-subscriptions ul li {
    float: left;
    width: 40px;
    background-color: gainsboro;
    margin-right: 5px;
    text-align: center;
    line-height: 40px;
    border-radius: 2px;
    font-size: 16px;
    cursor: pointer; }
  #root .offer .loto-item .sub-header .loto-subscriptions ul li:hover {
    background-color: #c8c8c8; }
  #root .offer .loto-item .sub-header .loto-subscriptions ul li.selected {
    background-color: #323232;
    color: white; }
  #root .offer .loto-item .sub-header .loto-subscriptions ul li.selected:hover {
    background-color: black; }
  #root .offer .loto-item .sub-header .no-of-rounds input.sub-no {
    border: 1px solid gainsboro;
    height: 36px;
    border-radius: 2px;
    margin: 0 5px 0 15px;
    width: 50px;
    text-align: center; }
  #root .offer .loto-item .sub-header .no-of-rounds input.sub-conf {
    line-height: 38px;
    border-radius: 2px;
    margin: 0 5px 0 0px;
    width: 50px;
    color: black;
    background-color: gainsboro;
    border: none;
    cursor: pointer; }
  #root .offer .loto-item .sub-header .no-of-rounds input.sub-conf:hover {
    background-color: #c8c8c8; }
  #root .offer .loto-item .sub-header .loto-subscriptions div {
    float: left;
    line-height: 40px; }
  #root .offer .loto-item .sub-header .max-numbers {
    float: right;
    color: #28aae1;
    padding: 0 5px; }
  #root .offer .loto-item .sub-header .rounds {
    overflow: hidden; }
  #root .offer .loto-item .sub-header .rounds.short {
    max-height: 88px;
    margin-bottom: 20px; }
  #root .offer .loto-item .sub-header .rounds ul {
    float: left;
    list-style: none;
    padding: 10px;
    margin: 0;
    overflow: hidden;
    padding: 15px 30px;
    width: 96%; }
  #root .offer .loto-item .sub-header .rounds ul li {
    float: left;
    width: 19.6%;
    background-color: gainsboro;
    margin-right: 4px;
    text-align: center;
    line-height: 35px;
    border-radius: 2px;
    font-size: 14px;
    margin-bottom: 4px;
    cursor: pointer; }
  #root .offer .loto-item .sub-header .rounds ul li.selected {
    background-color: #323232;
    color: white; }
  #root .offer .loto-item .sub-header .rounds ul li:hover {
    background-color: #c8c8c8; }
  #root .offer .loto-item .sub-header .rounds ul li.selected:hover {
    background-color: black;
    cursor: default; }
  #root .offer .loto-item .sub-header .show-all-rounds {
    text-align: right;
    overflow: hidden;
    line-height: 40px;
    padding-right: 20px;
    background-image: url(../images/strelice/crna_strelica_dole.svg?1);
    background-repeat: no-repeat;
    background-position: right center;
    margin-right: 35px;
    cursor: pointer;
    margin-top: -20px; }
  #root .offer .loto-item .sub-header .show-all-rounds.upper {
    line-height: 15px;
    margin-top: 15px; }
  #root .offer .loto-item .sub-header .show-all-rounds:before {
    content: 'Prikaži manje'; }
  #root .offer .loto-item .sub-header .show-all-rounds.short:before {
    content: 'Prikaži više'; }
  #root .offer .loto-item .sub-header .show-all-rounds.short {
    font-size: 15px;
    background-image: url(../images/strelice/crna_strelica_gore.svg?1); }
  #root .offer .loto-item .sub-header .days span.days {
    display: inline-block;
    padding: 20px 18px 0px 0px;
    font-size: 15px; }
  #root .offer .loto-item .sub-header .days {
    padding: 10px 30px 20px; }
  #root .offer .loto-item .sub-header .days ul {
    padding-left: 0px;
    display: inline; }
  #root .offer .loto-item .sub-header .days ul > span {
    white-space: nowrap;
    display: inline-block;
    line-height: 25px; }
  #root .offer .loto-item .sub-header .days table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 28px; }
  #root .offer .loto-item .sub-header .days td, #root .offer .loto-item .sub-header .days th {
    border: 1px solid #c8c8c8;
    text-align: center;
    padding: 7px 5px;
    font-size: 15px; }
  #root .offer .loto-item .sub-header .days td:nth-child(2), #root .offer .loto-item .sub-header .days th:nth-child(2) {
    color: #787878; }
  #root .offer .loto-item .sub-header .days th {
    border-top: none;
    font-weight: 400; }
  #root .offer .loto-item .sub-header .days .left {
    border-left: none;
    text-align: left;
    color: #787878; }
  #root .offer .loto-item .sub-header .days .right {
    border-right: none; }
  #root .offer .loto-item .sub-header .days td.wait {
    height: 200px;
    border: none; }
  #root td.wait div.waiting {
    display: block;
    position: relative;
    background-position: center; }
  #root .offer .loto-item .sub-header .button-line {
    overflow: hidden; }
  #root .offer .loto-item .sub-header .buttons {
    float: left;
    padding: 5px 30px 20px; }
  #root .offer .loto-item .sub-header .buttons a {
    display: inline-block;
    margin-right: 5px;
    padding: 12px 10px;
    text-decoration: none;
    background-color: gainsboro;
    width: 115px;
    text-align: center;
    color: black;
    font-size: 14px; }
  #root .offer .loto-item .sub-header .buttons a:hover {
    background-color: #c8c8c8; }
  #root .offer .loto-item .sub-header .lotolink {
    display: block;
    float: right;
    margin-right: 30px;
    line-height: 50px;
    text-decoration: none;
    color: black; }
  #root .offer .loto-item .sub-header .lotolink:hover {
    color: #28aae1; }
  #root .offer .loto-item .stats {
    position: absolute;
    width: 345px;
    z-index: 1;
    left: 128px;
    top: 50px;
    border-radius: 2px;
    padding-top: 6px;
    background-image: url(../images/strelice/crna_strelica_dole.svg?1);
    background-repeat: no-repeat;
    background-position: 13px top; }
  #root .offer .loto-item .stats ul {
    margin: 0;
    padding: 0px;
    overflow: hidden;
    list-style: none;
    width: 100%;
    padding: 10px 0px;
    background-color: #323232;
    color: white; }
  #root .offer .loto-item .stats ul li {
    float: left;
    line-height: 35px;
    padding: 0 25px;
    font-size: 15px;
    width: 100%; }
  #root .offer .loto-item .stats ul li:hover {
    background-color: black; }
  #root .offer .loto-item .sub-header ul li span.gray {
    padding: 0 8px;
    color: #4196dc; }
  #root .offer .loto-item .sub-header ul li span.gray.first {
    padding-left: 0; }
  #root .offer .loto-item .body {
    padding: 20px 20px 10px;
    background-color: white;
    clear: both;
    user-select: none;
    /* supported by Chrome and Opera */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */ }
  #root .offer .loto-item .sub-header-2 {
    background-color: white;
    position: relative; }
  #root .offer .loto-item .sub-header-2 .picks {
    float: right;
    padding: 23px 30px 4px;
    font-size: 20px;
    max-width: 75%;
    overflow: hidden;
    word-break: break-word;
    display: inline-block; }
  #root .offer .loto-item .sub-header-2 .tool-box {
    float: left;
    padding-left: 28px; }
  #root .offer .loto-item span.blue {
    color: #4196dc;
    padding: 0 8px 0 5px; }
  #root .offer .loto-item .sub-header span.blue {
    padding: 0 5px; }
  #root .offer .loto-item .quick-pick, #root #mygame {
    background-image: url(../images/loto/qp_gumb.svg?1);
    background-repeat: no-repeat;
    padding: 7px 7px;
    cursor: pointer;
    border: none;
    margin-top: 15px;
    border-radius: 2px;
    height: 22px;
    width: 22px; }
  #root #mygame {
    background-image: url(../images/loto/moja-igra_gumb.svg?1);
    margin-left: 15px; }
  #root #mygame.active {
    background-image: url(../images/loto/moja-igra_gumb_selected.svg?1);
    margin-left: 15px; }
  #root #mygame:hover {
    background-image: url(../images/loto/moja-igra_gumb_hover.svg?1); }
  #root #mygame.active:hover {
    background-image: url(../images/loto/moja-igra_gumb_selected.svg?1);
    cursor: default; }
  #root #mygame.disabled, #root #mygame.disabled:hover {
    background-image: url(../images/loto/moja-igra_gumb_disabled.svg?1);
    cursor: default; }
  #root .offer .loto-item .quick-pick:hover,
  #root .offer .loto-item .quick-pick:active {
    background-image: url(../images/loto/qp_gumb_hover.svg?1); }
  #root .offer .loto-item .body .number {
    display: inline-block;
    position: relative;
    width: 52px;
    height: 52px;
    cursor: pointer;
    margin: 6.7px;
    background-color: #e6e6e6;
    border-radius: 2px; }
  #root .offer .loto-item .body .number.active {
    background: #323232;
    color: #fff; }
  #root .offer .loto-item .body .number.active:hover {
    background-color: #323232; }
  #root .offer .loto-item .body .number:hover {
    background: #c8c8c8; }
  #root .offer .loto-item .body .number .total-drawn,
  #root .offer .loto-item .body .number .passed-rounds {
    font-size: 12px;
    position: absolute;
    width: 100%;
    text-align: center;
    color: #787878;
    line-height: 15px; }
  #root .offer .loto-item .body .number.active .total-drawn,
  #root .offer .loto-item .body .number.active .passed-rounds {
    color: gainsboro; }
  #root .offer .loto-item .body .number .total-drawn {
    top: 0; }
  #root .offer .loto-item .body .number .passed-rounds {
    bottom: 0; }
  #root .offer .loto-item .body .number .nr {
    font-size: 22px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  #root .offer .loto-item .name {
    text-transform: uppercase; }
  #root div.ticker {
    float: left;
    height: 40px;
    overflow: hidden;
    text-indent: 0;
    cursor: grab;
    margin: 0 0 0 5px;
    font-size: 15px; }
  #root div.ticker div {
    white-space: nowrap; }
  #root div.ticker span.loto-cont {
    padding: 0 10px;
    display: block; }
  #root span.rez-label {
    text-transform: uppercase;
    line-height: 40px;
    float: left;
    padding: 0 23px 0 19px;
    font-size: 17px;
    background-image: url(../images/loto/rezultati_separator.svg?1);
    background-repeat: no-repeat;
    background-position: right center; }
  #root div.ticker span.blue {
    padding: 0 6px;
    color: #4196dc; }
  #root div.ticker span.strong {
    font-family: 'Compasse Bold', Verdana; }

@media (max-width: 1800px) {
  #root .offer .loto-item .sub-header .rounds ul li {
    width: 24.6%; }
  #root .offer .loto-item .sub-header .rounds ul {
    width: 95%; } }
@media (max-width: 1680px) {
  #root .offer .loto-item .sub-header .rounds ul li {
    width: 24.5%; } }
@media (max-width: 1599px) {
  #root .offer .loto-item .body .number {
    width: 53px;
    height: 53px; }
  #root .offer .loto-item .sub-header .loto-subscriptions span, #root .offer .loto-item .sub-header .loto-subscriptions .no-of-rounds div {
    max-width: 110px;
    line-height: 20px; }
  #root .offer .loto-item .sub-header .rounds ul {
    width: 94%; } }
@media (max-width: 1505px) {
  #root .offer .loto-item .sub-header-2 .picks {
    max-width: 66%; } }
@media (max-width: 1480px) {
  #root .offer .loto-item .sub-header .rounds ul li {
    width: 32.6%; }
  #root span.rez-label {
    display: none; }
  #root .offer .loto-item .sub-header .rounds ul {
    width: 93%; } }
@media (max-width: 1330px) {
  #root .offer .loto-item .sub-header .loto-subscriptions span {
    display: none; }
  #root div.ticker {
    font-size: 14px; }
  #root div.ticker span.blue {
    padding: 0 4px; }
  #root .offer .loto-item .sub-header .rounds ul {
    width: 91%; } }
@media (max-width: 1240px) {
  #root .offer .loto-item .sub-header .rounds ul li {
    width: 49%; }
  #root .offer .loto-item .sub-header-2 .picks {
    max-width: 52%; } }
@media (max-width: 1200px) {
  #root .offer .loto-item .sub-header .loto-subscriptions span, #root .offer .loto-item .sub-header .loto-subscriptions .no-of-rounds div {
    max-width: 100%;
    line-height: 40px; }
  #root .offer .loto-item .sub-header .rounds ul {
    width: 90%; } }
@media (max-width: 1100px) {
  #root .offer .loto-item .sub-header .rounds ul {
    width: 88%; } }

/*# sourceMappingURL=Loto.css.map */