/*
CSS Ethlan
Tous droits réservés !
*/

body {
    padding-top: 70px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}

.img-responsive {
    max-width: 100%;
}

img {
    max-width :100%;
}

.photoaccueil {
    margin-bottom: 20px;
}

.thumbnail img {
  width:100%;
  overflow: hidden;
}

footer {
    margin: 30px 0;
}

.contenu-page {
    margin-top: 30px;
}

.navbar {
    background-color: rgba(249,249,249,1);
}

.well-admin {
  background-color: #f4cece;
}

.blink_me {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% { opacity: 0.0; }
}

.panel-heading [data-toggle="collapse"]:after {
        font-family: 'Glyphicons Halflings';
        content: "\e072"; /* "play" icon */
        float: right;
        color: #F58723;
        font-size: 18px;
        line-height: 22px;
        /* rotate "play" icon from > (right arrow) to down arrow */
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg);
    }

    .panel-heading [data-toggle="collapse"].collapsed:after {
        /* rotate "play" icon from > (right arrow) to ^ (up arrow) */
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        transform: rotate(90deg);
        color: #454444;
    }

.logo-social {
	width: 16px;
	height: 16px;
}

.container-navbar {
	padding-left: 15px;
	padding-right: 15px;
}

.img-equipe {
    max-width: 150px;
    display: block;
    margin: auto;
}

.img-profil {
    margin: 0 auto;
}

.indent {
    text-indent: 30px;
}

.boxer {
   display: table;
   border-collapse: separate;
   background-color: #ecf0f1;
   width: 100%;
   border-spacing:3px;
}
 
.boxer .box-row {
   display: table-row;
}

.case-placement {
    border-radius: 3px;
    display: table-cell;
    min-width: 40px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    margin: 3px;
}

.case-exemple {
    border-radius: 3px;
    display: table-cell;
    min-width: 40px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    margin: 3px;
}

.allee {
    border-radius: 0px;
    background-color: #ecf0f1;
    color: #ecf0f1;
}

.reservee {
    background-color: #9b8e8640;
    color: #21212178;
    /* border: 2px solid #e3a23c; */
}

.libre {
    background-color: #69e17f;
}

.admin {
    background-color: #ff903e8c;
    color: #686868;
}

.lol {
    background-color: #69e17f;
    border: 2px solid #6b7dc5;
}

.csgo {
    background-color: #69e17f;
    border: 2px solid #e3a23c;
}

.tft {
    background-color: #69e17f;
    border: 2px solid orangered;
}

.self {
    background-color: #9c27b0;
    color: white;
    font-weight: bolder;
    animation: blinker 2s linear infinite;
}


.typeahead,
.tt-query,
.tt-hint {
  width: 396px;
  height: 30px;
  padding: 8px 12px;
  font-size: 24px;
  line-height: 30px;
  border: 2px solid #ccc;
  -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
          border-radius: 8px;
  outline: none;
}

.typeahead {
  /*background-color: #fff;*/
}

/*.typeahead:focus {
  border: 2px solid #0097cf;
}*/

.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
  color: #999
}

.tt-menu {
  width: 422px;
  margin: 12px 0;
  padding: 8px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
          border-radius: 8px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
     -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
          box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
  padding: 3px 20px;
  font-size: 18.5px;
  line-height: 24px;
}

.tt-suggestion:hover {
  cursor: pointer;
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}

.tt-suggestion p {
  margin: 0;
}

.gist {
  font-size: 14px;
}

.right-inner-addon {
    position: relative;
}
.right-inner-addon input {
    padding-right: 30px;    
}
.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 10px 12px;
    pointer-events: none;
}

.gly-spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
.gly-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.gly-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.gly-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}
.gly-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.gly-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}


@media screen and (max-width: 480px){
	[data-columns]::before {
		content: '1 .column.size-1of1';
	}
    .modal-body {
         max-width: 400px;
         overflow-x: auto;
    }
}




.column { float: left; }
.size-1of4 { width: 25%; padding: 10px; }
.size-1of2 { width: 50%; padding: 10px; }
.size-1of1 { width: 100%; padding: 10px; }


.transition-background {
    transition-property: background;
    transition-duration: 0.3s;
    transition-timing-function:linear;
}

.transition-background:hover{
    cursor:pointer;
    background-color: cornflowerblue;
}

.votebtn:hover span {display:none}
.votebtn:hover:before {content:"Voter !"}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modal{
    width: 90%;
    position: fixed;
    text-align: center;
    margin: 0px auto;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 1050;
}
.modal_wrapper{
    display: table;
    overflow: auto;
    overflow-y: scroll;
    height: 100%;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    text-align: left;
    margin: 0px auto;
}
.modal-dialog{
    width: 90%;
    margin-top: 0px;
    display: table-cell;
    vertical-align: middle;
    margin: 0px 20px;
}
.modal-title{
  text-align: center;
}
.modal-content{
    min-height: 80%;
}


.img_plateforme{
  max-width:24px;
}

.img_plateforme_list {
  max-width:16px;
  margin-left: 10px;
}

#cookies-eu-banner {
    background: #d0d0d0;
    color: #222;
    padding: 6px;
    font-size: 13px;
    text-align: center;
}

#sidebar .nav>li>a {
    font-size: 15px;
    padding: 6px;
}

#jeux {
  column-count:         4;
  column-gap:           10px;  
}

#jeux > .thumbnail{
  -webkit-column-break-inside: avoid;
          page-break-inside: avoid;
               break-inside: avoid;
}

pre {
    white-space: pre-wrap; /* Since CSS 2.1 */
    word-wrap: break-word;
    word-break: break-word;
}

#sidebar > div:nth-child(1) > ul > li > a > i {
    padding: 0px 6px 0px 6px;
}

.fileinput-button {
    position: relative;
    overflow: hidden;
    display: inline-block;
}
.fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    -ms-filter: 'alpha(opacity=0)';
    font-size: 200px !important;
    direction: ltr;
    cursor: pointer;
}

.flex-tournament-content{
    padding: 10px;
    flex-grow: 1;
}
.bracket-tree{
    margin: auto;
}

.breathing{
    animation: breathing 5s ease-out infinite normal;
}

@keyframes breathing {
    0% { transform: scale(0.95); }
    50% { transform: scale(1.05); }
    100% { transform: scale(0.95); }
}

/*Animation to gently shake every few seconds*/
.shake {
    animation: shake 5s ease-out infinite normal;
}

@keyframes shake {
/* Animation takes 5 seconds in total.  scale to 0.9 and shake it for 1 second, then reset it and no movement for the next 4 seconds */
    0% { transform: scale(1) rotate(0deg) translateX(0px); }
    1% { transform: scale(0.9) rotate(-2deg) translateX(-2px); }
    5% { transform: scale(0.9) rotate(2deg) translateX(2px); }
    10% { transform: scale(0.9) rotate(-2deg) translateX(-2px); }
    15% { transform: scale(0.9) rotate(0deg) translateX(0px); }
    20% { transform: scale(1) rotate(0deg) translateX(0px); }
}