body {
background-size: cover;
margin: 0;
padding: 0;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
#onglets {
position: fixed;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
top: 56px;
/*border-top: 1px #000 solid;*/
background-color: #3498DB;
}
#onglets > li {
text-align: center;
list-style: none;
float: right;
margin: 0;
padding-top: 0.3em;
color: inherit;
height: inherit;
width: 33.3%;
z-index: 99999999;
}
#onglets > li > a {
display: block;
padding-bottom: 10px;
padding-top: 1px;
}

#onglets > li > a:first-child {
color: inherit;
text-decoration: none;
display: block;
}
#onglets > li > a:first-child:hover {
text-decoration: none;
}
#onglets > li > div {
position: absolute;
display: block;
top: 2.5em;
left: 0;
right: 0;
color: inherit;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
z-index: 1;
}
#onglets li {
overflow-y: hidden;
}
#onglets > li:target > div {
z-index: 3;
}
#onglets > li:not(:target) {
/*opacity: 0.5;*/
}
#onglets > li:not(:target):hover {
opacity: 1.0;
}
#onglets > li:not(:target) > div {}
#onglets > li:not([id]) {
display: block;
opacity: 1.0;
}
#onglets > li:not([id]) > div {
z-index: 2;
}
.oline,.day,.total {
font-weight: bold;
}
.oline {}
.day {}
.total {}

  .total,.oline,.feedtime {
    animation                 : animtotal 4s;
    animation-iteration-count : infinite;
  }

  @keyframes animtotal {
    0% {
      transform : translateX(0);
    }

    25% {
      transform : translateX(7%);
    }

    50% {
      transform : translateX(0%);
    }

    75% {
      transform : translateX(-7%);
    }

    100% {
      transform : translateX(0);
    }
  }




#onglets #compteur {}
#onglets #villes {}
#onglets #pays {}
#onglets #Vide1 {}
#onglets #Vide2 {}
li#compteur {}
li:hover#compteur,li:hover#villes,li:hover#pays {
display: block;
background-color: #2ECC71;
}

li#villes{
  max-width: 33%;
border-left:0.5px dotted #000;
border-right:0.5px dotted #000
}
li#pays {}
li#villes div,li#pays div {
height: 100%;
overflow-y: auto;
background-size: cover;
width: 100%;
margin-top: 0px;
padding-top: 20px;
position: absolute;
}
#villes ul,#pays ul {
width: 100%;
display: block;
padding: 0;
margin: 0;
}
#villes ul li,#pays ul li {}
#villes ul li ul,#pays ul li ul {
min-height: min-content;
float: left;
margin-top: 2.5px;
margin-bottom: 2.5px;
width: 100%;
}
#resfeed {
position: fixed;
top: 126px;
padding-top: 0px;
}
#villes ul li label,#pays ul li label,.feed h6{
position: fixed;
top: 90px;
width: 100%;
float: left;
display: block;
padding-top: 8px;
padding-bottom: 8px;
z-index: 9999;
font-weight: bold;
font-size: 100%;
}
.feed h6 {
  top: 56px;
  font-size: 96%;
  padding-top: 6px;
  padding-bottom: 6px;

}
#villes ul li ul li,#pays ul li ul li{
padding-bottom: 5px;
padding-top: 0px;
float: left;
list-style: none;
}
.cFlag {
text-align: center;
width: 5%;
max-width: 30px;
min-width: 30px;
overflow: hidden;
}
.nombre {
text-align: right;
width: 24%;
padding-right: 2%;
}
.nomVille,.nomPays {
padding-left: 2%;
text-align: left;
width: 63%;
}

#pub {
display: none;
}
#pub #nopay {
z-index: 9999999;
border-top: 1px solid #000;
margin: 0;
padding: 0;
padding-top: 0;
position: absolute;
width:100%;
overflow: hidden;
min-height:250px;
max-height:250px;
height:250px;
z-index: 999999999;
bottom: 30px;
text-align: center;
overflow: hidden;
display: none;
}

.logo {
position:fixed;
bottom:0;
left:0;
right:0;
background-repeat:no-repeat;
background-position:center center;
background-size: auto 65%;
height:30px;
z-index: 999999999;
min-width: 200%;
width: 200%;
margin-left: -50%
}

.logo a {
display: block;
font-size: 1px;
height: 100%;
width: 100%;
}
.logo {
  animation : animlogo 4s;
  animation-iteration-count : infinite;
}

@keyframes animlogo {
  0% {
    transform : translateX(0);
  }

  25% {
    transform : translateX(20%);
  }

  50% {
    transform : translateX(0%);
  }

  75% {
    transform : translateX(-20%);
  }

  100% {
    transform : translateX(0);
  }
}

.blk-300x250 {
min-height:100%;
min-width:100%;
overflow:hidden;
}

.tab ul,.blk-label,.blk-liste,.feed {
width:100%;
/*min-width: 250px;*/
margin:0;
padding:0;
float:left
}

.tab li,.blk-label li,.blk-liste li {
list-style:none;
text-align:center;
padding-top:1px;
padding-bottom:5px;
margin-bottom: 5px;
float:left;
width: 32%;
margin:0;
padding-left:0.5%;
padding-right:0.5%;
}
.feed li {
list-style:none;
text-align: left;
padding:0.5%;
padding-top: 7.5px;
float:left;
width:auto;
margin:0
}

.blk-label li:nth-child(even),.blk-liste li:nth-child(even) {

padding-left:1%;
padding-right:1%;
width: 32%;
}

hr {
margin-top:2px;
float:left
}
#compteur h6 {}
#compteur .feed h6 {
font-size: 110%;
}
.feed {
position: fixed;
top: 110px;
float:left;
margin-top:1px;
width:100%;
height: 100%;
background-size: cover;
z-index: 777777;
}

/*.feed {
  animation                 : animfeed 10s;
  animation-iteration-count : infinite;
}

@keyframes animfeed {
  0% {
    transform : translatey(0);
  }

  10% {
    transform : translatey(-10%);
  }

  20% {
    transform : translatey(-20%);
  }

  30% {
    transform : translatey(-30%);
  }

  40% {
    transform : translatey(-35%);
  }

  50% {
    transform : translatey(-35%);
  }

  60% {
    transform : translatey(-30%);
  }

  70% {
    transform : translatey(-25%);
  }

  80% {
    transform : translatey(-20%);
  }

  90% {
    transform : translatey(-10%);
  }
  100% {
    transform : translatey(0%);
  }
}*/

* {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
*::-webkit-scrollbar { display: none; }

.feed a {}
.sepfeed {
float: left;
width: 100%;
margin-bottom: 0;
}
.feed ul {
width:100%;
margin:0;
padding:0;
float: left;
}
li.feedtime {
width:24%;
background-image: url(../imgs/feedtime.png);
background-position: 8px 8px;
background-size: 16px 16px;
background-repeat: no-repeat;
padding-left: 30px;
}
.feedcity  {
background-image: url(../imgs/feedcity.png);
background-position: 8px 8px;
background-size: 16px 16px;
background-repeat: no-repeat;
}
.feedreferer {
width:16%;
background-image: url(../imgs/feedreferer.png);
background-position: 8px 8px;
background-size: 16px 16px;
background-repeat: no-repeat;
}
.feednavint {
width:16%;
background-image: url(../imgs/feednavint.png);
background-position: 8px 8px;
background-size: 16px 16px;
background-repeat: no-repeat;
}
li.feedbrowser,li.feedos,li.feedpays {
width:7%;
font-size: 0;
}
.feedbrowser img,.feedos img,.feedpays img,.cFlag img{
overflow:hidden;
padding: 1px;
}
li.feedcity {
width:34%;
padding-left: 26px;
}

li.feedreferer,li.feednavint {
width:99%;
padding-left:0.5%;
padding-right:0.5%;
display:block;
text-align:left;
padding-left: 30px;
}

li.feednavint {
margin-bottom:10px;
padding-bottom: 5px;
}
.label {
position: fixed;
float: left;
min-height: 55px;
z-index: 888888;
top: 0;
border: 0.5px solid #000;
max-width: 99.8%;
}
#compteur div{
position: fixed;
float: left;
overflow-y: auto;
width: 100%;
}





@media only screen and (max-width: 250px) {
li.feedtime {
width:18%;
background-position: 7px 7px;
background-size: 14px 14px;
background-repeat: no-repeat;
padding-left: 28px;
}
.feedcity  {
background-position: 7px 7px;
background-size: 14px 14px;
background-repeat: no-repeat;
}
.feedreferer,.feednavint {
width:15%;
background-position: 7px 7px;
background-size: 14px 14px;
background-repeat: no-repeat;
}
.feedbrowser img,.feedos img,.feedpays img,.cFlag img{
width:14px;
height:14px;
}
}
@media only screen and (max-width: 320px) {
li#villes{
  max-width: 32%;
}
li.feedtime,.feedcity {
  min-width: 100%;
  display: block;
}
li.feedos {
  margin-left: 5px;
}
li.feedpays,li.feedbrowser,li.feedos {
  min-width: 20%;
}
.nombre {
width: 21%;
padding-right: 1%;
}
.nomVille,.nomPays {
width: 57%;
}
.label {
border: 0.5px solid #000;
max-width: 99.2%;
}
}
