#searchBox{

position: fixed;

top: 120px;

width: 100%;

height: auto;

background-color: #BFDEEE;

z-index: 9999;

padding: 35px 0;

box-shadow: 0px 5px 5px rgba(0,0,0,0.3);
max-height: 60vh;
overflow: auto;
}



#searchBox .container{
max-height: 55vh;
overflow: scroll;
}
#searchBox .container >div{
 
	  column-count: 3;

	column-rule: 1px solid #ADCBDB;
	grid-column-gap: 25px;
   
	

}
/*

max-height: 70vh;
overflow-x: hidden;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-column-gap: 25px;
*/




#searchBox .title_2{
	margin-top: 1em;
	font-size: 1em;
	font-weight: bold;
	color: #005B89;
	padding-bottom: 0.2em;
	line-height: 1em;
}



#searchBox .search_list{

display: block;

text-decoration: none;

font-size: 0.8em;

line-height: 0.7em;

margin-top: 0;

font-weight: bold;

color: #A61866;

margin-bottom: 0;

transition: all 0.3s linear;

}



#searchBox .search_list:hover{

	text-decoration:underline;

	transition: all 0.3s linear;

}

#searchBox .search_list .name span{

	width: 15px;

}



#searchBox .search_list .date{

	/*

color: #3b3d4a;

font-weight: normal;

border-left: 2px solid #3b3d4a;

padding-left: 5px;

margin-left: 5px;

*/

}

#searchBox  .date {

display: block;

border: none;

margin-left: 16px;

padding: 0 0 0.2em 0;

color: #3b3d4a;

font-weight: normal;

font-size:11px;

}



#searchBox .spectacle_nom{

    

    color: #3b3d4a;

    line-height: 1em;

    display: block;

    margin-left: 16px;

	font-size:11px;

}

#searchBox  .date i,

#searchBox .spectacle_nom i {

    width: 19px;

    font-size: 1em;

    text-align: center;

}



#searchBox  .container > div + .title_2{

	margin-top:1em

}



#searchBox .container > div{
	margin:0.2em 0 0.5em
}
#searchBox .container > div > div{
	margin-bottom: 0.5em;
}
 

#close_search{
position: absolute;
  top: 5%;
  right: 1%;
  background-color: #005B89;
  color: #fff;
  border-radius: 50%;
  padding: 0;
  transition: all 0.3s linear;
  width: 30px;
  display: block;
  text-align: center;
  height: 30px;
  line-height: 30px;

}

#close_search:hover{

	transition: all 0.3s linear;

	background-color:#A61866;

}



 @media (max-width: 575.98px) {

    #searchBox .container{

        column-count: 1;

        column-rule: 1px solid #ADCBDB;

    }

    

}



@media (max-width: 991px){

    #searchBox{

        top: 110px;

    }

    #close_search {

        top: 1%;

        padding: 0.2em;

        }

    #searchBox .title_2 {

        font-size: 1em;

        }

    #searchBox .search_list {

        font-size: 0.8em;

        }

    .open-search{

        display: block!important;

    }

    .open-search .emilesfid,.open-search .header-left,.open-search  .header-right{

        display: none!important;

    }



    .search-widget{

        margin-top: 8px!important;

    }

}







#searchBox{

	min-height:110px
}



#loadermenu .content {
  position: absolute;
  top: 35px;
  left: calc(50% - 100px);
  right: 0;
  bottom: 0;

}
#loadermenu p{
		padding-left: 50px;
}


#loadermenu.hidde {
  display: none;
}

 

#loadermenu .container-loader {
  position: absolute;
  animation: rotate 3s linear infinite;
}

#loadermenu .container-loader:last-of-type {
  z-index: -1;
  margin: 1%;
}

#loadermenu .triangle {
  position: relative;
  text-align: left;
  transform-origin: 33.33% 66.66%;
}

#loadermenu .triangle:before,
#loadermenu .triangle:after {
  content: "";
  position: absolute;
  background: inherit;
}

#loadermenu .triangle,
#loadermenu .triangle:before,
#loadermenu .triangle:after {
  width: 1em;
  height: 1em;
  border-top-right-radius: 20%;
}

#loadermenu .triangle:before {
  transform: rotate(-135deg) skewX(-45deg) scale(1.414, 0.707) translate(0, -50%);
}

#loadermenu .triangle:after {
  transform: rotate(135deg) skewY(-45deg) scale(0.707, 1.414) translate(50%);
}

#loadermenu .triangle:first-of-type {
  background: #A61866;
  transform: rotate(-60deg) skewX(-30deg) scale(1, 0.866) translate(143.33%, 110%);
  animation: first 3s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
}

#loadermenu .triangle:last-of-type {
  background: #005b89;
  transform: rotate(0deg) skewX(-30deg) scale(1, 0.866) translate(-100%, -4%);
  animation: last 3s cubic-bezier(0.645, 0.045, 0.355, 1) infinite;
}

#loadermenu .triangle.shadow,
#loadermenu .triangle.shadow:before,
#loadermenu .triangle.shadow:after {
  background: #a0f5d0;
  backface-visibility: hidden;
  perspective: 1000;
  filter: blur(0.5em);
}



















