@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300italic,300,400italic,500,500italic,700,700italic);

@-moz-viewport { width: device-width; scale: 1; }
@-ms-viewport { width: device-width; scale: 1; }
@-o-viewport { width: device-width; scale: 1; }
@-webkit-viewport { width: device-width; scale: 1; }
@viewport { width: device-width; scale: 1; }

html {
  box-sizing: border-box;

  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  -ms-touch-action: none;
  touch-action: manipulation;
}

*, *::before, *::after {
  box-sizing: inherit;
}

body {
  margin: 0;
  padding: 0;
  background-color:#f5f8f6;
  /* #ECF1ED */
  font-family: "museo-sans", "Roboto", "Helvetica";
  font-weight:300;
  font-size: 12px;
  line-height: 1.25;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}


a, a input{
  text-decoration: none;
  font-size: 0.9em;
  cursor: pointer;
  font-weight: 500;
  color: black;
}

.featured{
font-size:7px;
font-weight:500;
padding:2px;
color:white;
text-transform:uppercase;
}

svg{
  position: absolute;
  display: inline;
}


li{
  text-decoration: none;
  list-style-type: none;
}

textarea {
    resize: none;
}
/*------------------------------- dest --------------- */
#blank{
  margin-left: 6.78vw;
  width: 66.44vw;
  height:100vh;
  top:0px;
}

#dest{
  width:100vw;
  height:100vh;
  position:absolute;
  display: block;
  z-index: 0;
}

#box2 {
  overflow: hidden;
  position: fixed;
  height: 100vh;
  width: 100vw;
  background-size: cover;
  top: 0px;
}

#box2 svg{
  height:100vh;
  width:100vw;
}

.dif{
 mix-blend-mode: difference;
 fill:rgba(245, 248, 246, 0.9999);
 stroke: rgba(245, 248, 246, 0.9999);
 stroke-width:0.1;
}


/*------------------------------- AREA PAGE --------------- */
#area_page,#area_page_columns{
  width:80vw;
  height:auto !important;
  margin-left:10vw;
  position: relative;
  top: 0px;
  min-height: 100vh;
  margin-bottom: -210px;
}
#area_page2{
  width: 80vw;
  height: 100vh !important;
  margin-left: 10vw;
  position: relative;
  top: 0px;
  overflow: hidden;
}
#area_page:after {
  content: "";
  display: block;
  height: 210px;
}

@media only screen and (max-width: 430px) {
  #area_page,#area_page_columns{
    margin-bottom: -240px;
  }
  #area_page:after {
    height: 240px;
  }

}

.clear_both{
  clear: both;
  content: "";
  display: table;
}

.columns{
  width:5.323vw;
  height:600px !important;
  margin-right:1.465vw;
  background-color:rgba(220,81,114,0.2);
  position: relative;
  display: inline-block;

}

/*------------------------------- FOOTER --------------- */
footer{
  background-color: black;
  color:white !important;
  height:165px;
  margin-top: 50px;
  width: 100%;
  padding: 10px;
  position:relative;
  bottom:0;
  z-index: 1000;
}

footer ul{
  padding-left: 0px;
}
@media only screen and (max-width: 850px) {
  footer .little_name{
    font-size: 10px;
  }
}

footer a{
  color:white !important;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.7;
  font-weight: 300;
}

footer a:hover{
  text-decoration: underline;
}
footer div{
  display: inline-block;
  position:relative;
}

footer #col_cont{
  margin-left: 8vw;
  margin-right: 1.465vw;
  text-align:right;
  width:18.899vw;
}

footer #col_links{
  margin-left:1.465vw;
  text-align:center;
  width: 39.263vw;
}
footer #col_links2{
  display: none;
  text-align:center;
  width: 100%;
  margin-top:20px;
}

footer #col_menu{
  margin-left:1.465vw;
  width: 25.687vw;
}

footer #col_links a div, footer #col_links2 a div{
  margin-left: -30px;
}

@media only screen and (max-width: 700px) {
  footer .little_name{
    font-size: 12px;
  }
  footer{
    height:230px;
  }
  footer #col_links{
    display: none;
  }

  footer #col_links2{
    display: block;
  }

  footer #col_menu, footer #col_cont{
    margin:0px;
    width: 48%;
    float:none;
  }

}

@media only screen and (max-width: 430px) {
  footer #col_menu span{
    display: block;
  }
  footer .little_name, footer p, footer a{
    font-size: 11px;
  }
}
/* ------------------------------ MENU --------------- */
#menu{
  position: fixed;
  z-index: 1000;
  top:0px;
}

#menu_bar{
  position: fixed;
  width:100vw;
  background-color: rgba(245, 248, 246, 0.9999);
  opacity:0;
  box-shadow: 5px 5px 5px rgba(40,40,40,0.03);
  z-index: 900;
  height:80px;
  margin-left: -3vw;
}
@media only screen and (max-width: 900px) {
  #menu_bar{
    box-shadow: none;
    height:70px;
  }
}

/* --- Logo */
#logo{
  display: inline-block;
  position: fixed;
  z-index: 1040;
  top:0px;
  opacity:0;
  width: 100px;
  height: 155px;
  cursor:pointer;
  background-color: rgba(245, 248, 246, 0.9999);
  box-shadow: -5px 5px 5px rgba(40,40,40,0.01);
}

  @media only screen and (max-width: 720px) {
    #logo{
      width: 15vw;
      height: calc((155*15vw)/110);
    }
  }
  @media only screen and (max-width: 520px) {
    #logo{
      width: 80px;
      height: calc((155*80)/110);
    }
  }

  @media only screen and (max-width: 450px) {
    #logo{
      margin-left:-10px;
      width:70px;
    }
  }

  @media only screen and (max-width: 320px) {
    #logo{
      width:60px;
    }
  }

#logo_img{
  width:100px;
  margin:10px;
  margin-left: 0px;
}
  @media only screen and (max-width: 720px) {
    #logo_img{
      width: calc(15vw - 10px);
      height: calc(((155*15vw)/110) - 10px);
    }
  }
  @media only screen and (max-width: 520px) {
    #logo_img{
      width: 70px;
      height: calc(((155*80)/110) - 10px);
    }
  }
/* --- end logo */

/* --- Menu hamburger */
#menu_hamb{
  display: none;
  position: fixed;
  z-index:1100;
  margin-left: calc(100vw - 50px);
  font-size: 30px;
  top: 35px;
}
  @media only screen and (max-width:900px) {
    #menu_hamb{
      display: inline-block;
    }
  }
  @media only screen and (max-width: 415px) {
    #menu_hamb{
      font-size: 25px;
    }
  }

#menu_hamb.hover_effect, #menu_close.hover_effect {
  opacity: 0.3;
  transition: opacity 0.1s ease;
}

#menu_close{
  z-index:900;
  margin-left: calc(100% - 57px);
  margin-top: 25px;
  width:50px;
  height:50px;
}
  @media only screen and (max-width: 415px) {
    #menu_close{
      margin-top: 15px;
      width:42px;
      height:42px;
    }
  }

#menu_options_hamb{
  position: fixed;
  display: none;
  top:0px;
  left:0px;
  width:100vw;
  height:0;
  opacity: 0;
  z-index: 1200;
}

#bk_hamb{
  position: fixed;
  width:100vw;
  height:100vh;
  opacity: 0.95;
}

#title_menu{
  position: absolute;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  font-weight: 400;
  top: 50%;
  margin-left: 50%;
  margin-top: -20px;
  transform: translateY(-50%);
}

#menu_options_hamb ul {
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  position: relative;
  top: 50%;
  margin-left: auto;
  margin-right: auto;
  transform: translateY(-50%);
  padding: 0px;
}

#menu_options_hamb ul li{
  position: relative;
  display: block;
  font-size:26px;
  line-height: 1.7;
  text-transform: uppercase;
}

  @media only screen and (orientation: landscape) {
    #menu_options_hamb ul li{
      font-size:20px;
    }
  }

  @media only screen and (max-height: 370px) and (orientation: landscape) {
    #menu_options_hamb ul li{
      font-size:15px;
    }
  }

  @media only screen and (max-height: 540px) and (orientation: portrait) {
    #menu_options_hamb ul li{
      font-size:20px;
    }
  }

  @media only screen and (max-height: 420px) and (orientation: portrait) {
    #menu_options_hamb ul li{
      font-size:15px;
    }
  }

#menu_options_hamb ul li.hover_effect {
  text-decoration: line-through;
}

.mini{
  margin-top:20px;
  font-size:14px !important;
  letter-spacing: 0.5px !important;
}

.mini a{
  color:white !important;
}
/*end of the menu hamburger */

/* --- Menu options */
#menu_options{
  display: inline-block;
  position: relative;
  width: 66.491vw;
  z-index: 900;
  margin-left: 5.323vw;
  margin-top: 45px;
  font-weight: 500;
  font-size: 14px;
}
  @media only screen and (max-width: 1045px) {
    #menu_options{
      width:70vw;
      margin-left: 2vw;
    }
  }
  @media only screen and (max-width: 910px) {
    #menu_options{
      font-size: 13px;
      margin-left: 5.323vw;
    }
  }
  @media only screen and (max-width: 900px) {
    #menu_options{
      display: none;
    }
  }

#menu_options ul{
  margin: 0px;
  padding-left: 5px;
  margin-left: 1.465vw;
}
#menu_options ul li{
  display: inline-block;
}
#menu_options ul li > a{
  text-decoration: none;
  display: inline-block;
  padding: 10px 1vw 6px 0px;
  text-transform: uppercase;
}
#menu_options ul li > a:hover {
  text-decoration: underline;
  cursor:pointer;
}

.sub_op:after{
  content: "▾";
}
  @media only screen and (max-width: 1024px) {
    .sub_op:after{
      content: "";
    }
  }
/* --- end of Menu options */


/* --- Apply area */
#apply_area{
  display: inline-block;
  position: absolute;
  width:12vw;
  top:0px;
  text-align: right;
}
  @media only screen and (max-width: 900px) {
    #apply_area{
      display: none;
    }
  }
#apply_button{
  padding: 6px 14px 6px 14px;
  right: 0px;
  margin-top: 40px;
  font-weight: 700;
  color: black;
}

#apply_button:hover{
  color: white !important;
}

#edition{
  position: absolute;
  right: -8vw;
  top: -20px;
  width: 200px;
  height: 100px;
}

#info_apply{
  display: block;
  position: absolute;
  font-size: 10px;
  width: 120px;
  right: 20px;
  padding: 3px;
  text-align: right;
}
/* --- end of Apply area */


/* --- Sub menu */
.sub_menu_opt{
  display: none;
  position: absolute;
  width: 75vw;
  height: 300px;
  top: 25px;
  padding: 3vw;
  padding-top: 0px;
  left: -3vw;
  z-index: 200;
}


.grey_area{
  width:66.488vw;
  padding: 10px;
  height: 250px;
  background-color: rgba(248, 251, 249, 0.9999);
  box-shadow: 5px 5px 5px rgba(40,40,40,0.03);
}

.links_sub{
  margin-bottom: 10px;
  border: 2px solid !important;
  padding: 5px 7px;
  position: relative;
}

.links_sub:hover{
  text-decoration: none !important;
  border-width: 2px !important;
}

.links_sub:active, .hvr_active{
  opacity:0.7;
}

.hvr_disabled{
  cursor:default;
  opacity:0.5 !important;
  background-color: rgb(205, 221, 206);
  border-color:black !important;
  color:black !important;
}


.margin_gutter{
  margin-left: 1.465vw;
}

#country_events2_link{
  margin-left: 21.789vw !important;
}

#country_events_link{
  margin-left: 12.111vw !important;
}


/*agenda*/

.events_country{
  width:39.263vw;
  height:15vw;
  position: relative;
  display: inline-block;
  overflow: hidden;
  margin-left: 8.253vw;
  margin-top: 20px;
}

.events_container_menu{
  width:3000px;

}
.event_menu_box .day{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size:60px;
  position: relative;
  margin-top: -10px;
  margin-bottom: 0px !important;
  margin-right:15px;
  text-align: center;
}

.event_menu_box .month{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.2px;
  font-size:1.5em;
  margin-top: -10px;
  position: relative;
  text-transform: uppercase;
  margin-bottom: 0px !important;

}

.event_menu_box p{
  font-size: 0.8em;
  color:white;
  font-weight: 500;
  display: block;
  position: absolute;
  bottom: 0px;
  text-align: center;
  width: 100%;
}

.event_menu_box .hour{
  bottom: 18px;
}
.event_menu_box .band{
  bottom: 3px;
  font-weight: 700 !important;
  text-transform: uppercase;
}

.event_menu_box .venue_name{
  bottom: -10px;
}

@media only screen and (max-width: 1240px) {
  .event_menu_box .day{
    font-size: 45px;
  }
}
.event_menu{
  display: inline-block;
  position: relative;
  width:12.111vw;
  height:12.111vw;
  padding: 0 !important;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
  float: left;
}

.event_menu_box{
  display: inline-block;
  position: relative;
  width:10vw;
  height:10vw;
  padding: 0 !important;
  cursor:pointer;
  margin-left: 1vw;
  margin-top: 1vw;
  border: 2px solid transparent;
}

.event_menu_box:hover {
  border: 2px solid white;
}

.left_arrow{
  left: 21vw;
  top: 85px;
}

.right_arrow{
  right: 7vw;
  top: 85px;
}

/*countries*/
.search_country_submenu{
  width:650px;
  height: auto;
  margin-left:12.111vw !important;
  top:30px;
  position: absolute;
}

.search_country_submenu a li{
  padding: 5px;
  margin:3px;
  font-size: 11px;
  color:black;
  width: auto;
  position: relative;
  display: inline-block;
  width: 110px;
  border-width: 3px !important;
  transition: color, border-color 0.2s ease;
}

#countries_menu{
  margin-left: 1.465vw;
}

#input_country_submenu{
  font-size: 14px!important;
  width: calc(12.111vw - 30px);
}

.country_groups{
  position: relative;
  display: inline-block;
  margin-right: 2vw;
  padding: 0px;
}
.country_op{
  padding: 6px;
  margin:3px;
  font-size: 12px;
  color:black;
  position: relative;
  display: inline-block;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
  border-width: 2px !important;
  transition: color, border-color 0.2s ease;
}


mark{
  font-weight: 600 !important;
}

@media only screen and (max-width: 1100px) {
  #input_country_submenu{
    width: 200px;
  }
  .search_country_submenu{
    margin-left: 1.465vw !important;
    margin-top: 20px !important;
  }
  .search_country_submenu a li{
    margin: 0px;
  }
}

/*venues and magazine*/
.venue_mag_menu_container{
  display: inline-block;
  position: relative;
  cursor: pointer;
  width:12.111vw;
  height:14vw;
  top: -20px;
}

.venue_mag_menu{
  display: inline-block;
  position: relative;
  overflow: hidden;
  width:12.111vw;
  height:8vw;
  padding: 0 !important;
  background-position: center;
  background-size: cover;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  float: left;
  transition: filter 0.2s ease;
}

.venue_mag_menu_container:hover .venue_mag_menu{
  -webkit-filter: grayscale(0%);
filter: grayscale(0%);
}

.venue_mag_menu_t{
  font-size: 0.8em;
  color: black;
  font-weight: 500;
  position: relative;
  bottom: 0px;
  width: 100%;
  display: inherit;
  margin: 0px;
}

.venue_mag_menu_container h2{
  font-size:1.5em;
}
/* --- end of Sub menu */

/*menu for member*/
#menu_members{
  background-color:#171817;
  color:#F5F8F6 !important;
  width:100vw;
  height:35px;
  position: fixed;
  display:block;
  z-index: 1049;
  opacity: 0;
  top:0px;
}

/* --- Menu options for members*/
#menu_options_members{
  display: inline-block;
  position: relative;
  width: calc(100% - 14vw);
  margin-left:14vw;
  z-index: 900;
}
@media only screen and (max-width: 450px) {
  #member_username{
    width: -moz-fit-content;
      width: -webkit-fit-content;
      width: fit-content;
  }
}

#menu_options_members ul{
  margin: 0px;
  padding-left: 0px;
  text-align: left;
  display: inline-block;
}

#menu_options_members ul li{
  display: inline-block;
  color:#F5F8F6 !important;
}

#menu_options_members ul li > a{
  color:#F5F8F6 !important;
  text-decoration: none;
  display: inline-block;
  padding: 10px 2vw 6px 0px;
  font-weight: 300;
  font-size: 12px;
  text-transform: uppercase;
}
  @media only screen and (max-width: 450px) {
    #menu_options_members{
      margin-left: 0px;
      width: 100%;
    }
    #menu_options_members ul li > a{
      font-size: 10px;
      padding: 12px 2vw 6px 0px;
    }
  }

#menu_options_members ul li > a:hover {
  text-decoration: underline;
  cursor:pointer;
}
/* --- end of Menu options */

#member_username{
  margin: 0px;
  margin-right:  1.465vw;
  float: right;
  display: inline-block;
}

#member_username p{
  display: inline-block;
}
@media only screen and (max-width: 450px) {
  #member_username{
    margin-right:  2px;
  }
  #member_username p{
    font-size: 10px;
    padding-top:2px;
  }
}

#member_username a{
  font-weight: 500;
}

#member_username a:hover{
  text-decoration: underline;
}
/*end of menu for members*/


/* ///////////////////////////////////////////////////////*/
/* ---- ((elements that appear in most of the pages)) --- */
/* ///////////////////////////////////////////////////////*/

.big_title,.big_title3{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 96px;
  position: relative;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  text-transform: uppercase;
  z-index: 100;
}

.little_name {
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 500;
}

.little_border{
  border-bottom-width: 2px !important;
  width:10px;
  margin-top: -8px;
}

/* icones: normal and social */
.icon{
  position : absolute;
  background-size: cover;
  background-position: center center;
  mix-blend-mode: multiply;
  display:block;
  opacity: 0;
  width:35px;
  height:35px;
}

.icon_container {
  width:35px;
  position:absolute;
  display: inline-block;
}

.container_icon:hover .icon , .container_icon_social:hover .icon, .icon_hov {
  opacity:1;
}

.container_icon:active .icon , .container_icon_social:active .icon, .icon_act {
  opacity:0.5;
}

.container_icon_a{
  width:30px;
  height:30px;
  position:relative;
  display: inline-block;
}

.container_icon_social{
  width:30px;
  height:30px;
  position:relative;
  display: inline-block;
  cursor: pointer;
  background-size: cover;
  background-position: center center;
}

.container_icon_social svg{
  width: 100%;
  height: 100%;
}

.container_icon{
  width:35px;
  height:35px;
  position:absolute;
  display: inline-block;
  cursor: pointer;
  background-size: cover;
  background-position: center center;
}

@media only screen and (max-width: 650px) {
  .container_icon{
    width:30px;
    height:30px;
  }
}

@media only screen and (max-width: 520px) {
  .container_icon{
    width:25px;
    height:25px;
    display: block;
    margin-bottom: 5px;
  }
}

.type_icon_view{
  width:25px !important;
  height:25px !important;
}

.icon_selected{
  opacity: 0.4;
}
/* enf of icons */


/* List elements: musicians, formations, venues */
.country_name{
    position : absolute;
    display:block;
    opacity: 0;
    width:auto;
    height:auto;
    color:#F5F8F6;
    font-family:"league-gothic", 'Oswald', sans-serif;
    letter-spacing: 0.7px;
    font-size: 12px;
    text-transform: uppercase;
    cursor:pointer;
    -ms-transform: rotate(-90deg) translate(-25px,7vw); /* IE 9 */
    -webkit-transform: rotate(-90deg) translate(-25px,7vw);  /* Safari */
    transform: rotate(-90deg) translate(-25px,7vw);
    user-select: none;
       -moz-user-select: none;
       -khtml-user-select: none;
       -webkit-user-select: none;
       -o-user-select: none;
  }

  .formation_name{
      position : absolute;
      display:block;
      opacity: 0;
      width:12.111vw;
      height:auto;
      margin-top: calc(12.111vw + 10px);
      margin-left: -20px;
      text-transform: uppercase;
      font-family:'Oswald', sans-serif;
      font-size: 14px;
      cursor:pointer;
      user-select: none;
         -moz-user-select: none;
         -khtml-user-select: none;
         -webkit-user-select: none;
         -o-user-select: none;
    }

  .more_symbol{
    position : absolute;
    display:block;
    cursor:pointer;
    opacity: 0;
    width:auto;
    height:auto;
    color:#F5F8F6;
    margin-top:calc(12.111vw/2 - 60px);
    margin-left:calc(12.111vw/2 - 30px);
    font-family:'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 60px;
    user-select: none;
       -moz-user-select: none;
       -khtml-user-select: none;
       -webkit-user-select: none;
       -o-user-select: none;
    transition: opacity 0.3s ease-out;
  }
  .rect_fill{
    cursor:pointer;
    position : absolute;
    mix-blend-mode: multiply;
    display:block;
    opacity: 0;
    margin-top:5px;
    margin-left:-20px;
    width:12.111vw;
    height:12.111vw;
    transition: opacity 0.3s ease-out;
  }


  .rect_border{
    cursor:pointer;
    position : absolute;
    border-style: solid;
    border-width: 8px !important;
    background-color: rgba(0,0,0,0.9999);
    mix-blend-mode: difference;
    display:block;
    opacity: 0;
    width:11vw;
    height:11vw;
    margin-top:-10px;
    margin-left: -10px;
    transition: opacity 0.3s ease-out;
  }

  .member_formation_venue {
    cursor:pointer;
    width:12.111vw;
    height:12.111vw;
    position:relative;
    display: inline-block;
    margin-right: 1.465vw;
    background-color: white;
    margin-bottom: 50px;
    transition: background-color 0.3s ease-in;
  }

  .member_formation_venue:hover, .member_formation_venue.hover_effect{
    transition: background-color 0.01s ease-in;
    background-color: transparent;
  }

  .member_formation_venue:hover .container, .member_formation_venue.hover_effect .container{
    transition: border-width 0.3s ease-in;
    border-width: 0px;
  }

  .member_formation_venue:hover .country_name,
  .member_formation_venue:hover .formation_name,
  .member_formation_venue:hover .rect_fill,
  .member_formation_venue:hover .rect_border,
  .member_formation_venue:hover .more_symbol,
  .member_formation_venue.hover_effect .country_name,
    .member_formation_venue.hover_effect .formation_name,
    .member_formation_venue.hover_effect .rect_fill,
    .member_formation_venue.hover_effect .rect_border,
    .member_formation_venue.hover_effect .more_symbol{
    opacity:1;
    transition: opacity 0.3s ease-in;
  }

  .container
  {
    width:12.111vw;
    height:12.111vw;
    position:absolute;
    border:solid 10px white;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    top:0;
    left:0;
    overflow:hidden;
    background-image: url('member.jpg');
    background-position: center, center;
    background-size: cover;
    transition: border-width 0.01s ease-in;
    -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
     -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
        filter: grayscale(100%);
  }
  .member_formation_venue:hover p, .member_formation_venue.hover_effect p{
    color: #F5F8F6 !important;
    transition: color 0.3s ease-in;
  }

  .member_formation_venue.hover_effect p{
    font-size:26px;
    transition: font-size 0.1s ease-in;
  }

  .member_formation_venue p{
    font-size: 22px;
    font-family: "league-gothic", 'Oswald', sans-serif;
    letter-spacing: 0.6px;
    width:12.111vw;
    text-align: center;
    position: absolute;
    margin-top: calc(12.111vw + 5px);
    text-transform: uppercase;
    transition: font-size 0.1s ease-in;
  }


    @media only screen and (max-width: 1024px) {
      .more_symbol{
        margin-top:calc(18.899vw/2 - 60px);
        margin-left:calc(18.899vw/2 - 30px);
      }

      .country_name{
        font-size: 13px;
        -ms-transform: rotate(-90deg) translate(-25px,10vw); /* IE 9 */
        -webkit-transform: rotate(-90deg) translate(-25px,10vw);  /* Safari */
        transform: rotate(-90deg) translate(-25px,10vw);

      }

      .formation_name{
        width:18.899vw;
        margin-top: calc(18.899vw + 10px);
      }

      .rect_border{
        width: calc(18.899vw - 2vw);
        height: calc(18.899vw - 2vw);
      }

      .rect_fill, .member_formation_venue, .container {
        width: 18.899vw;
        height: 18.899vw;
      }

      .member_formation_venue p{
        width:18.899vw;
        margin-top: calc(18.899vw + 5px);
      }

    }

    @media only screen and (max-width: 770px) {
      .more_symbol{
        margin-top:calc(31.907vw/2 - 60px);
        margin-left:calc(31.907vw/2 - 30px);
      }

      .country_name{
        font-size: 13px;
        -ms-transform: rotate(-90deg) translate(-25px,18vw); /* IE 9 */
        -webkit-transform: rotate(-90deg) translate(-25px,18vw);  /* Safari */
        transform: rotate(-90deg) translate(-25px,18vw);

      }

      .formation_name{
        width:31.907vw;
        margin-top: calc(31.907vw + 10px);
      }

      .rect_border{
        width: calc(31.907vw - 2vw);
        height: calc(31.907vw - 2vw);
      }

      .rect_fill, .member_formation_venue, .container {
        width: 31.907vw;
        height: 31.907vw;
      }

      .member_formation_venue p{
        width:31.907vw;
        margin-top: calc(31.907vw + 5px);
      }
    }
    @media only screen and (max-width: 500px) {
      .member_formation_venue p{
        font-size: 18px;
      }
      .member_formation_venue.hover_effect p{
        font-size:20px;
        transition: font-size 0.1s ease-in;
      }
    }

    @media only screen and (max-width: 400px) {
      .more_symbol{
        margin-top:calc(65.137vw/2 - 60px);
        margin-left:calc(65.137vw/2 - 30px);
      }

      .country_name{
        font-size: 14px;
        -ms-transform: rotate(-90deg) translate(-25px,44vw); /* IE 9 */
        -webkit-transform: rotate(-90deg) translate(-25px,44vw);  /* Safari */
        transform: rotate(-90deg) translate(-25px,44vw);

      }

      .formation_name{
        width:65.137vw;
        margin-top: calc(65.137vw + 10px);
      }

      .rect_border{
        margin-left:0px;
        width: calc(65.137vw - 2vw);
        height: calc(65.137vw - 2vw);
      }

      .rect_fill, .member_formation_venue, .container {
        width: 65.137vw;
        height: 65.137vw;
      }

      .member_formation_venue p{
        width:65.137vw;
        font-size: 22px;
        margin-top: calc(65.137vw);
      }
      .member_formation_venue.hover_effect p{
        font-size:26px;
        transition: font-size 0.1s ease-in;
      }
    }
/* end of member_formation_venue */





/* ///////////////////////////////////////////////////////*/
/* ----------------- ((ANIMATIONS from other codes)) ---- */
/* ///////////////////////////////////////////////////////*/


/* Sweep To Top */
.hvr-sweep-to-top {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.hvr-sweep-to-top:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active, .hvr_hover {
  color: white;
}
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before, .hvr_hover {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}





/*- from animated.css */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInRight {
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}



@-webkit-keyframes fadeInUp {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
/* end - from animated.css -*/





/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((FORMATION PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* --------- foto, name, text */
#content_area{
  margin-left: 6.78vw;
  width: 66.46vw;
  margin-top:80px;
  min-height: 100vh;
}

  @media only screen and (max-width: 370px) {
    .map_min{
      margin-top: 100px !important;
    }
  }

#content_area_with_map{
  margin-left: 6.78vw;
  width: 66.46vw;
  margin-top:300px
}
  @media only screen and (max-width: 370px) {
    #content_area_with_map{
      margin-top:220px
    }
  }
  @media only screen and (max-height: 450px) and (orientation: landscape){
    #content_area_with_map{
      margin-top:100px
    }
  }

#title{
  display: inline;
  position: absolute;
  margin-left: 20.364vw !important;
  margin: 0px;
  height:14em;
  margin-top: -59px;
  z-index: 100;
}
  @media only screen and (max-width:  1024px){
    #title{
      margin-left: 6.788vw !important;
      height:130px;
    }
  }
  @media only screen and (max-width:  650px){
    #title{
      margin-top: -20px;
      margin-left: 6.788vw !important;
      height:90px;
    }
  }


#img_band{
  margin-top: 55px;
  width: 46.051vw;
}

  @media only screen and (max-width:  1250px){
    #img_band{
      width: 32.475vw;
    }
  }
  @media only screen and (max-width:  1240px){
    #img_band{
      width: 52.839vw;
      margin-left: 6.788vw;
      margin-top:70px;
    }
  }
  @media only screen and (max-width:  750px){
    #img_band{
      width: 66.46vw;
      margin-left: 0px;
    }
  }

#country{
  float:right;
  clear:both;
  color:white;
  padding:4px;
  margin-top: -82px;
  text-transform: uppercase;
}
  @media only screen and (max-width:  1024px){
    #country{
      margin-top: -55px;
    }
  }
  @media only screen and (max-width:  650px){
    #country{
      margin-top: -44px;
    }
  }

#text_band{
  display: inline;
  position: absolute;
  text-align: left;
  margin-top: 150px;
  margin-left: 1.465vw;
  width:20.687vw;
  font-size: 13px;
}
  @media only screen and (max-width:  1250px){
    #text_band{
      width: 25.687vw;
    }
  }
  @media only screen and (max-width:  1240px){
    #text_band{
      display: none;
    }
  }


#about2{
  display: none;
}
#about2 #member_title, #contact #member_title{
  display: none;
  margin-bottom: 0px;
}
  @media only screen and (max-width:  1240px){
    #about2{
      margin-left: 6.788vw;
      display: block;
    }
    #contact{
      margin-left: 6.788vw;
    }

  }
  @media only screen and (max-width:  1100px){
    #about2 #member_title, #contact #member_title{
      display: block;
    }
  }

  @media only screen and (max-width:  750px){
    #title{
      margin-left:0px !important;
    }
    #contact, #about2{
      margin-left: 0px;
    }
  }


#text_band2{
  display: block;
  position: relative;
  text-align: left;
  margin-left: 6.788vw;
  padding-top:1px;
  width:32.475vw;
  font-size: 14px;
}
  @media only screen and (max-width:  1100px){
    #text_band2{
      margin-left:0px;
    }
  }
  @media only screen and (max-width:  950px){
    #text_band2{
      width:52.839vw;
    }
  }
  @media only screen and (max-width:  470px){
    #text_band2{
      width:66.46vw;
    }
  }
/* end of foto, name, text */


/* --------- contact, link */
#contact_title{
  display: inline-block;
  position: relative;
  float: left;
  width: 5.232vw;
}
  @media only screen and (max-width:  1100px){
    #contact_title{
      display: none;
    }
  }
#contact_info{
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
  padding: 0px;
  width:18.899vw;
}
  @media only screen and (max-width:  1100px){
    #contact_info{
      margin-left: 0px;
      width: 32.475vw;
    }
  }
  @media only screen and (max-width:  470px){
    #contact_info{
      display: block;
      width: 66.46vw;
    }
  }

#contact_links{
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
  padding: 0px;
}

@media only screen and (max-width:  470px){
  #contact_links{
    display: block;
    margin-left: 0px;
  }
}
/* end of contact, link */


/* --------- members */
#order_by_country{
  display: block;
}

#order_by_abc{
  display: none;
}

.members{
  position: relative;
  width: calc(100% + 1.48vw);
  height:auto;
  margin-bottom:50px;
  margin-top: 20px;
}

#member_title{
  position: relative;
  margin-top: 50px;
  margin-bottom:20px;
}
/* end of members */


/* --------- events */
.events_container{
  width: 100%;
  height:auto;
  margin-left: calc(( 66.46vw - ( 18.899vw * 3 + 1.465vw * 2)) / 2);
}

#events{
  position: relative;
  display: block;
  width:100%;
  height:auto;
  margin-top:50px;
}

#event_title{
  position: relative;
  margin-bottom: 20px;
}

.event_box .day{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.4px;
  font-size:130px;
  position: relative;
  margin-top: -35px;
  margin-bottom: 0px !important;
  margin-right:15px;
  text-align: center;
}

.event_box .month{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.3px;
  font-size:32px;
  margin-top: -10px;
  position: relative;
  text-transform: uppercase;
  margin-bottom: 0px !important;

}

.fly{
  display: none;
  position: absolute;
  top:0px;
  left:0px;
  width:100%;
}

.event_box p{
  font-size: 1em;
  color:white;
  font-weight: 500;
  display: block;
  position: absolute;
  bottom: -20px;
  text-align: center;
  width: 100%;
}

.event_box .hour{
  margin-bottom: 30px;
}


.event{
  display: inline-block;
  position: absolute;
  width:100%;
  height:100%;
  padding: 0 !important;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
}

.event_box{
  display: inline-block;
  position: absolute;
  width:calc(100% - 4vw);
  height:calc(100% - 5vw);
  padding: 0 !important;
  cursor:pointer;
  margin-left: 1.9495vw;
  margin-top: 2.5vw;
  border: 4px solid transparent;
}

  @media only screen and (max-width: 1024px) {
    .event_box .day{
      font-size:90px;
    }

    .event_box .month{
      font-size:22px;
    }
  }
  @media only screen and (max-width: 990px) {
    .event_box p{
      font-size:10px;
    }
  }
  @media only screen and (max-width: 770px) {
    .events_container{
      margin-left:0px;
    }
    .events_container a:not(:first-child):not(:last-child) div{
      margin-right:0px;
    }
    .events_container a:last-child{
      display: none;
    }
    .event{
      width: calc(32.475vw - 1.465vw);
      height: 42.96vw;
    }
    .event_box .day{
      font-size:130px;
    }

    .event_box .month{
      font-size:32px;
    }
  }
  @media only screen and (max-width: 590px) {
    .event_box .day{
      font-size:100px;
    }

    .event_box .month{
      font-size:28px;
    }
  }
  @media only screen and (max-width: 415px){

    .event{
      width: 66.46vw;
      height: 87.92vw;
    }
    .event_box .day{
      margin-top: 0px;
      font-size:130px;
    }
    .event_box .month{
      font-size:32px;
    }
    .event_box{
      width: calc(100% - 8vw);
      height: calc(100% - 10vw);
      margin-left:4vw;
      margin-top: 5vw;
    }
    .event_box p{
      bottom: 0px;
      font-size:12px;
    }
  }

.event_box:hover {
  border: 4px solid white;
}

#more_events{
  position: relative;
  top: 20px;
  margin-left: calc(50% - 55px);
}
/* end of events */


/* --------- videos */
#videos{
  position: relative;
  display: block;
  width:100%;
  height:auto;
  margin-top:40px;
}

#video_title{
  position: relative;
  margin-bottom: 20px;
}

#main_video{
  position: relative;
  display: inline-block;
  float:left;
}

iframe{
  width:45.96vw;
  height:25.83vw;
  position: relative;
}

#portrait_video{
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
}

.portrait{
  width:18.899vw;
  height:10vw;
  margin-bottom: 1.4vw;
  background-position: center center;
  background-size: cover;
}
  @media only screen and (max-width: 840px) {
    iframe, #main_video{
      width:100%;
      height:37.35vw;
    }
    .portrait{
      display: none;
    }
    #portrait_video{
      margin-left: 0px;
    }
  }

.label{
  font-size: 10px;
  line-height: 1.25;
  margin-top: 1.465vw;
}
/* end of videos */




/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((MUSICIANS PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

#title2{
  display: inline;
  position: absolute;
  margin-left: 25vw !important;
  margin: 0px;
  height:14em;
  margin-top: -59px;
  z-index: 100;
}
@media only screen and (max-width: 1024px) {
  #title2{
    height:160px;
  }
  #title {
    height:130px;
  }
  #title2 h1{
    margin-top: 80px;
    font-size: 65px;
  }
  #title h1{
    margin-top: 50px;
    font-size: 65px;
  }
  #title2 #country,#title #country{
    margin-top: -45px;
  }
}

@media only screen and (max-width: 650px) {
  #title2{
    height:140px;
  }
  #title{
    height:90px;
  }
  #title2 h1{
    margin-top: 90px;
    font-size: 40px;
  }
  #title h1{
    margin-top: 35px;
    font-size: 40px;
  }
  #title2 #country{
    margin-top: -30px;
  }
  #title #country{
    margin-top: -25px;
  }
}

@media only screen and (max-width: 500px) {
  #title2{
    margin-left: 13.576vw !important;
    margin-top: -85px;
  }
}

@media only screen and (max-width: 450px) {
  #title2{
    height:140px;
  }
  #title{
    height:90px;
  }
  #title2 h1{
    margin-top: 100px;
    font-size: 30px;
  }
  #title h1{
    margin-top: 45px;
    font-size: 30px;
  }
  #title2 #country{
    margin-top: -20px;
  }
  #title #country{
    margin-top: -15px;
  }
}
/* --------- search by country */
#search_country{
  position: relative;
  width: calc(12.111vw + 40px);
  display: inline-block;
  z-index:600;
}

@media only screen and (max-width: 1300px) {
  #search_country{
    width: 200px;
  }
}

@media only screen and (max-width: 770px) {
  #search_country{
    margin-top: -80px;
    display: block;
    margin-bottom:40px;
  }
}

@media only screen and (max-width: 420px) {
 .big_title{
    font-size: 60px;
  }
  #search_country{
    margin-top: -50px;
  }
}

@media only screen and (max-height: 450px) and (orientation: landscape){
  .big_title{
    font-size: 40px;
  }
}

@media only screen and (max-height: 450px) and (orientation: landscape){
  #search_country{
    margin-top: -40px;
  }
}

.search_input_autoC{
  border-top: none;
  border-left: none;
  border-right: none;
  background-color: transparent;
  padding:6px;
  font-size: 18px;
  cursor:text;
  width: 80%;
}

  @media only screen and (max-width: 420px) {
    .search_input_autoC{
      font-size: 14px;
    }
  }


.selected {
	background: rgb(23, 24, 23);
  color:white;
	padding: 2px 8px;
}

.selected mark {
  color:white;
}

mark{
  background-color: transparent;
  text-decoration:underline;
}

li:hover mark{
  color:white;
}

.search_input_autoC:focus{
  outline:0;
  transition: border 0.3s ease-in;
}

/*estes servem para a pesquisa de país do topo e para a barra de pesquisa:*/
.list_from_input_aC{
  padding: 0px !important;
  width: 12.111vw;
  position: absolute;
  background-color:white;
  margin: 0px;
  z-index: 400;
  background: #fff;
  border-radius: 1px;
}

  @media only screen and (max-width: 1300px) {
    .list_from_input_aC{
      width: 180px;
    }
  }

.list_from_input_aC li{
  padding: 6px;
  border-radius: 1px;
  padding-left: 15px;
}

.list_from_input_aC li:hover{
  color:white;
  border-radius: 1px;
  cursor:pointer;
}
/* end of search by country */


/* --------- Stick bar with icons to order and search bar */
.stick {
  position: fixed !important;
  top:100px;
  margin-left: 128px;
}

#sticker{
  position:absolute;
  display:block;
  height:auto;
  width:76vw;
  z-index: 500;
}
  @media only screen and (max-width: 1500px) {
    #sticker{
      margin-top:55px;
      margin-left: -6vw;
      width:85vw;
    }
  }
  @media only screen and (max-width: 840px) {
    .sticker_country{
      margin-top:-40px !important;
    }
  }


.icon_order{
  position: relative;
}

.icon_search{
  right: 0px;
}
  @media only screen and (max-width: 520px) {
    .icon_search{
      margin-top: 30px;
      z-index: 910;
    }
  }

/*filter for search bar:*/
#filter{
  width:120px;
  display: inline-block
}
  @media only screen and (max-width: 410px) {
    #filter{
      width: auto;
      font-size: 10px;
    }
  }

.origin {
	font-weight: 600;
	font-size: 10px;
  padding-bottom:1px!important;
  padding-top:10px!important;
  pointer-events: none;
}

/*search bar input :*/
#bar_search{
  width:25vw;
  height:40px;
  float:right;
  position: relative;
  margin-right: 36px;
  display: none;
  background-color: white;
  box-shadow: 5px 5px 5px rgba(40,40,40,0.03);
  transition: all 0.3s ease-in;
}
  @media only screen and (max-width: 1024px) {
    #bar_search{
      width: 290px;
    }
  }
  @media only screen and (max-width: 520px) {
    #bar_search{
      margin-top: 30px;
      z-index: 910;
      position: absolute;
      right: 0px;
    }
  }
  @media only screen and (max-width: 350px) {
    #bar_search{
      right:auto;
    }
  }


#bar_search p{
  padding-left:20px;
  display: none;
}

.barSearch_input_autoC:hover{
  opacity:0.5;
}

.barSearch_input_autoC:focus{
  outline:0;
  transition: border 0.3s ease-in;
}

.barSearch_input_autoC{
  border-top: none;
  border-left: none;
  border-right: none;
  padding:6px;
  font-size: 12px;
  width: calc(12.111vw - 10px);
}
  @media only screen and (max-width: 1024px) {
    .barSearch_input_autoC{
      width:150px;
    }
  }

/* end of stick bar */

/*map venues*/
#map {
  width: 100vw;
  height: 230px;
  position: absolute;
  display: block;
  margin-left: -10vw;
  margin-top: -220px;
}
  @media only screen and (max-width: 370px) {
    #map{
      display: none;
    }
  }
  @media only screen and (max-height: 450px) and (orientation: landscape){
    #map{
      display: none;
    }
  }

.gm-style-iw a:hover{
  text-decoration: underline;
}

.gmnoprint{
  display: none;
}
/* end of map venues */


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((COUNTRIES PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

#countries{
  position: relative;
  display: block;
  width: calc(100% + 1.471vw);
  height:20vw;
  margin-bottom:50px;
  margin-top: -30px;
}
@media only screen and (max-width: 770px) {
  #countries{
    margin-top: 0px;
  }
}

.search_country_submenu2{
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  height: auto;
  margin: 0px;
  padding:0px;
  position: absolute;
}


.search_country_submenu2 a li{
  width:135px;
  text-align: center;
}
@media only screen and (max-width: 770px) {
  .search_country_submenu2 a li{
    width:120px;
  }
}
@media only screen and (max-width: 585px) {
  .search_country_submenu2 a li{
    width:96px;
  }
}
.country_op2{
  padding: 10px;
  margin:5px;
  font-size: 14px;
  color:black;
  width: auto;
  position: relative;
  display: inline-block;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  border-width: 3px !important;
  transition: color, border-color 0.2s ease;
}
@media only screen and (max-width: 770px) {
  .country_op2{
    padding: 5px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 585px) {
  .country_op2{
    font-size: 10px;
  }
}



/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((MUSICIAN PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

#musician_intro{
  min-height:400px;
  margin-left: -30px;
}
  @media only screen and (max-width: 1240px) {
    #musician_intro{
      min-height:500px;
    }
  }

  @media only screen and (max-width: 1060px) {
    #musician_intro{
      min-height:450px;
    }
  }

  @media only screen and (max-width: 900px) {
    #musician_intro{
    }
  }

  @media only screen and (max-width: 650px) {
    #musician_intro{
      min-height: 350px;
    }
  }

  @media only screen and (max-width: 500px) {
    #musician_intro{
      min-height: 260px;
    }
  }



#musician_destq{
    position: relative;
    height:auto;
    padding-bottom: 80px;
}

#img_band_musician{
  position: relative;
  display: inline-block;
  top: 55px;
  margin-left: 13.576vw;
  width: 300px;
  height: 300px;
  background-position: center center;
  background-size: cover;
}

@media only screen and (max-width: 1240px) {
  #img_band_musician{
    width: 400px;
    height: 400px;
  }
}

@media only screen and (max-width: 650px) {
  #img_band_musician{
    width: 300px;
    height: 300px;
  }
}

@media only screen and (max-width: 500px) {
  #img_band_musician{
    width: 200px;
    height: 200px;
  }
}

#text_band_musician{
  display: inline-block;
  position: absolute !important;
  text-align: left;
  margin-top: 180px;
  margin-left: 1.465vw;

}

.med_title{
  display: block;
  position: relative;
  top: 170px;
  left: calc(12.111vw - 230px);
  width: 300px;
  cursor: pointer;
}

  @media only screen and (max-width: 1240px) {
    .med_title{
      width: 400px;
      top: 272px;
    }
  }

  @media only screen and (max-width: 650px) {
    .med_title{
      width: 300px;
      top: 170px;
    }
  }

  @media only screen and (max-width: 500px) {
    .med_title{
      width: 200px;
      top: 116px;
      left: calc(12.111vw - 190px);
    }
  }


.med_title h1{
  font-family: "league-gothic", 'Oswald', sans-serif;
  text-align: left;
  position: absolute !important;
  letter-spacing: 0.3px;
  font-size: 35px;
  text-transform: uppercase;
  z-index: 100;
  -ms-transform: rotate(-90deg) translate(-25px,100px); /* IE 9 */
  -webkit-transform: rotate(-90deg) translate(-25px,100px);  /* Safari */
  transform: rotate(-90deg) translate(-25px,100px);
}
  @media only screen and (max-width: 500px) {
    .med_title h1{
      font-size: 25px;
    }
  }

.med_title h1:hover{
  text-decoration: underline;
}



/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((VENUE PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/*img de fundo */
#img_venue, #img_venue_bk_a {
  position:absolute;
  width: 100%;
  height: 300px;
  top: -140px;
  left: 0px;
  overflow: hidden;
  z-index: 0;
  background-color: rgba(0,0,0,0.4);
}

#img_venue_bk{
  width: 100%;
  height: 300px;
  background-position: center center;
  background-size: cover;
  z-index: 0;
  filter: blur(1px) grayscale(100%);
  -webkit-filter: blur(1px) grayscale(100%);
  -o-filter: blur(1px) grayscale(100%);
  -moz-filter: blur(1px) grayscale(100%);
  -ms-filter: blur(1px) grayscale(100%);
}
@media only screen and (max-width: 1100px) {
  #img_venue, #img_venue_bk_a {
    width: 66.46vw;
    height: 200px;
    left:auto;
  }
}
@media only screen and (max-width: 850px) {
  #img_venue, #img_venue_bk_a {
    display: none;
  }
}

#venue_container{
  position: relative;
  display: block;
  height: auto;
  margin-top: 220px;
  margin-bottom: 50px;
}

#country_of_venue{
  position: relative;
  display:block;
  color:white;
  padding:4px;
  margin-top: -70px;
  text-transform: uppercase;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  z-index: 300;
}

@media only screen and (max-width: 1100px) {
  #venue_container{
    margin-top: 120px;
    margin-left:1.465vw;
  }
}
@media only screen and (max-width: 1024px) {
  #venue_container{
    margin-top: 146px;
  }
  #venue_container .big_title{
    font-size:70px;
  }
  #country_of_venue{
    margin-top: -50px;
  }
}
@media only screen and (max-width: 850px) {
  #venue_container{
    margin-left:0px;
  }
}
@media only screen and (max-width: 600px) {
  #venue_container .big_title{
    font-size:45px;
  }
  #country_of_venue{
    margin-top: -25px;
  }
}

/* links icones */
#contact_links_venue{
  position: relative;
  display: inline-block;
  padding: 0px;
}


/* contacto mapa*/
#contact_venue{
  width: 17.159vw;
  position: relative;
  display: inline-block;
  margin-left: 8.253vw;
  margin-top: -52px;
}

#contact_text{
  width:100%;
}

#map_containter{
  position: relative;
  margin-top: 40px;
}

#map_loc{
  width: 39.263vw;
  height: 20vw;
  position: relative;
  display: inline-block;
  float:left;
}
  @media only screen and (max-width: 800px) {
    #contact_venue, #map_loc{
      width: 66.46vw;
      display: block;
      margin-left: 0px;
      margin-top: 0px;
      float: none;
    }
    #map_loc{
      height:40vw;
    }
  }

/* about e outros eventos */
#group_event_desc{
  position: relative;
  display: block;
  width:100%;
  height:auto;
  margin-top: 200px;
}

#description{
  width:39.263vw;
  position: relative;
  display: inline-block;
  float:left;
}

#other_events{
  display: inline-block;
  position: relative;
  width:17.159vw;
  height: auto;
  margin-left: 8.253vw;
}

#other_e_g{
  padding:10px;
  width:17.159vw;
  background-color: white;
}

.other_e{
  margin-bottom: 10px;
  line-height: 1.5;
  background-color: rgb(249,252,250);
  padding: 5px;
}
  @media only screen and (max-width: 1024px) {
    #description{
      width:32.475vw;
    }
    #other_events,#other_e_g{
      width:23.947vw;
    }
  }
  @media only screen and (max-width: 800px) {
    #group_event_desc{
      margin-top: 20px;
    }
    #description{
      width: 66.46vw;
      display: block;
      margin-left: 0px;
      margin-top: 0px;
      float: none;
    }
    #other_events, #other_e_g{
      width: 40vw;
      display: block;
      margin-left: 0px;
      margin-top: 0px;
      float: none;
    }
    #map_loc{
      height:40vw;
    }
  }

  @media only screen and (max-width: 500px) {
    #other_events, #other_e_g{
      width: 66.46vw;
    }
  }

/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((COUNTRY PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* submenu */
#submenu,#submenu2{
  width: 100%;
  padding: -5px;
  margin-left: calc(6vw - 17px);
  position: absolute;
  background-color: rgb(245, 248, 246);
  padding: 10px;
}

#submenu2{
  display: none;
}

#submenu a, #submenu2 a{
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding:5px;
  font-weight: 600;
}

#submenu a:hover, #submenu2 a:hover{
  text-decoration: underline;
  background-color: rgb(245, 248, 246);
}

#putit{
  font-weight: 500;
}

#putit.hover_effect, #putit:hover{
  text-decoration: underline;
  cursor:pointer;
}

@media only screen and (max-width: 800px) {
  #submenu a{
    font-size: 13px;
    font-weight: 500;
  }

}
@media only screen and (max-width: 520px) {
  #submenu{
    display: none;
  }
  #submenu2{
    display: block;
  }
  #submenu2 a{
    font-size: 11px;
    line-height: 1.8;
    font-weight: 500;
    display:block;
  }

  #submenu{
    margin-top: 18px;
  }

}
/* cidades */
.container_city{
  width:12.111vw;
  height:12.111vw;
  position:absolute;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  top:0;
  left:0;
}

.city {
  cursor:pointer;
  width:12.1vw;
  height:12.1vw;
  position:relative;
  display: inline-block;
  margin-right: 1.465vw;
  margin-bottom: 1.465vw;
}

.city:hover p, .city.hover_effect p{
  color: #F5F8F6;
  transition: color 0.3s ease-in;
}

.city p{
  font-size: 35px;
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.6px;
  width:12.1vw;
  color:white;
  text-align: center;
  position: absolute;
  margin-top: 20px;
  text-transform: uppercase;
}

.city:hover .country_name,
.city:hover .formation_name,
.city:hover .rect_fill,
.city:hover .rect_border,
.city:hover .more_symbol{
  opacity:1;
  transition: opacity 0.3s ease-in;
}

.city.hover_effect .country_name,
.city.hover_effect .formation_name,
.city.hover_effect .rect_fill,
.city.hover_effect .rect_border,
.city.hover_effect .more_symbol{
  opacity:1;
  transition: opacity 0.3s ease-in;
}

@media only screen and (max-width: 1224px) {
  .city p{
    font-size: 25px;
  }
}

@media only screen and (max-width: 1024px) {
  .city, .container_city {
    width: 18.899vw;
    height: 18.899vw;
  }

  .city p{
    font-size:28px;
    width:18.899vw;
  }

}

@media only screen and (max-width: 810px) {
  .city p{
    font-size: 25px;
  }
}

@media only screen and (max-width: 770px) {
  .city, .container_city {
    width: 100%;
    height: 60px;
  }

  .city p{
    margin-top: 15px;
    text-align: center;
    font-size:28px;
    width:100%;
  }

  .city .rect_border{
    width: 100%;
    height: 65px;
    margin-top:-20px;
  }

  .city .more_symbol{
    margin-top: -35px;
    margin-left: 6%;
  }

  .city .country_name{
    display: none;
  }
}


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((CURATORS PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* curator container */
.curator {
  cursor:pointer;
  width:12.111vw;
  height:12.111vw;
  position:relative;
  display: inline-block;
  margin-right: 1.465vw;
  background-color: white;
  margin-bottom: 20px;
  transition: background-color 0.3s ease-in;
}

.country_name_cur{
    position : absolute;
    display:block;
    opacity: 1;
    width:auto;
    height:auto;
    top:calc(12.111vw - 30px);
    width:12.111vw;
    text-align: center;
    color: rgb(23, 24, 23);
    font-family:"league-gothic", 'Oswald', sans-serif;
    letter-spacing: 0.7px;
    font-size: 12px;
    text-transform: uppercase;
    cursor:pointer;
    user-select: none;
       -moz-user-select: none;
       -khtml-user-select: none;
       -webkit-user-select: none;
       -o-user-select: none;
  }

.container_cur{
  width:12.111vw;
  height:12.111vw;
  position:absolute;
  border:solid 10px white;
  opacity: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  top:0;
  left:0;
  overflow:hidden;
  background-image: url('member.jpg');
  background-position: center, center;
  background-size: cover;
  transition: border-width 0.01s ease-in;
}

.curator:hover{
  transition: background-color 0.03s ease-in;
  background-color: transparent;
}

.curator:hover .container_cur,
.curator.hover_effect .container_cur{
  transition: border-width 0.3s ease-in;
  border-width: 0px;
}

.curator:hover .rect_fill,
.curator:hover .rect_border,
.curator:hover .container_cur,
.curator:hover .more_symbol,
.curator.hover_effect .rect_fill,
.curator.hover_effect .rect_border,
.curator.hover_effect .container_cur,
.curator.hover_effect .more_symbol{
  opacity:1;
  transition: opacity 0.3s ease-in;
}

.curator.hover_effect p,
.curator.hover_effect .country_name_cur,
.curator:hover p,
.curator:hover .country_name_cur{
  color: #F5F8F6 !important;
  transition: color 0.3s ease-in;
}

.curator p, .curator2 p{
  font-size: 20px;
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.6px;
  width: 12.111vw;
  text-align: center;
  position: absolute;
  margin-top: 2vw;
  text-transform: uppercase;
}

  @media only screen and (max-width: 1224px) {
    .curator p{
      font-size: 18px;
    }
  }

  @media only screen and (max-width: 1024px) {
    .country_name_cur{
      font-size: 13px;
    }

    .curator, .container_cur {
      width: 18.899vw;
      height: 18.899vw;
    }

    .country_name_cur{
      width: 18.899vw;
      margin-top: 7vw;
    }

    .curator p{
      font-size:20px;
      margin-top: 4vw;
      width:18.899vw;
    }

  }

  @media only screen and (max-width: 810px) {
    .curator p{
      font-size: 18px;
    }
  }

  @media only screen and (max-width: 770px) {
    .country_name_cur{
      font-size: 13px;
    }

    .curator, .container_cur {
      width: 31.907vw;
      height: 31.907vw;
    }

    .country_name_cur{
      width: 31.907vw;
      margin-top: 20vw;
    }

    .curator p{
      font-size:22px;
      margin-top: 5vw;
      width:31.907vw;
    }
  }

  @media only screen and (max-width: 400px) {
      .country_name_cur{
        font-size: 13px;
      }

      .curator, .container_cur {
        width: 65.137vw;
        height: 65.137vw;
      }

      .country_name_cur{
        font-size:20px;
        width: 65.137vw;
        margin-top: 52vw;
      }

      .curator p{
        font-size:25px;
        width:65.137vw;
        margin-top:8vw;
      }
    }
/* end of curator container */


/* more info */
#more_info{
  position: fixed;
  margin-left: 12.111vw;
  top: 100vh;
  width: 39.263vw;
  height:auto;
  min-height:220px;
  background-color: rgb(235, 241, 236);
  padding:15px;
  z-index: 600;
  box-shadow: 5px 5px 5px rgba(40,40,40,0.05);
  opacity: 0;
}

#close_more_info{
  float: right;
  position: relative;
  margin-top: -10px;
  z-index: 500;
}

.curator2 {
  cursor:pointer;
  width:12.111vw;
  height:12.111vw;
  position:relative;
  float:left;
  display: inline-block;
  margin-right: 1.465vw;
  background-color: white;
  margin-bottom: 20px;
  transition: background-color 0.3s ease-in;
}

#curator_info{
  position: relative;
  display: inline-block;
  width: calc(39.263vw - 12.111vw - 60px );
}

#contact_links_curator{
  position: relative;
  margin-left:13.576vw;
}

.container_cur2{
  width:12.111vw;
  height:12.111vw;
  position:absolute;
  top:0;
  left:0;
  overflow:hidden;
  background-image: url('member.jpg');
  background-position: center, center;
  background-size: cover;
  transition: border-width 0.01s ease-in;
}

.form_cur2{
  font-family:"league-gothic", 'Oswald', sans-serif;
  font-size: 22px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-top: 0px;
  margin-bottom: -10px;
}

.country_name_cur2{
  font-weight: 600;
  font-size: 10px;
}

@media only screen and (max-width: 1024px) {
  .curator2 {
    float:none;
    display: block;
    margin-right: auto;
    margin-left: auto;
  }

  #contact_links_curator{
    float:right;
    margin-left:0px;
  }

  #curator_info{
    width: calc(39.263vw - 60px);
  }
}
@media only screen and (max-width: 770px) {
  .curator2,.container_cur2 {
    width:25.687vw;
    height:25.687vw;
  }
  #more_info{
    margin-left: 0px;
    width: 65.137vw;
  }
  #curator_info{
    width: calc(65.137vw - 60px);
  }
}

@media only screen and (max-width: 400px) {
  .curator2,.container_cur2 {
    width:25.687vw;
    height:25.687vw;
  }
  #more_info{
    margin-left: -10vw;
    width: 80vw;
  }
  #curator_info{
    width: calc(80vw - 60px);
  }
}

@media only screen and (orientation:landscape) and (max-height: 400px) {
  #more_info{
    position: absolute;
  }
}
/* end of more_info */


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((LOGIN PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* login form */

#login_box{
  background-color:white;
  width:32.475vw;
  height: 420px;
  margin-left: calc((100%/2) - (32.475vw/2));
  box-shadow: 5px 5px 5px rgba(0,0,0,0.08);
}
  @media only screen and (max-width: 1024px) {
    #login_box{
      width:46.051vw;
      margin-left: calc((100%/2) - (46.051vw/2));
    }
  }

  @media only screen and (max-width: 750px) {
    #login_box{
      width:52.839vw;
      margin-left: calc((100%/2) - (52.839vw/2));
    }
  }
  @media only screen and (max-width: 600px) {
    #login_box{
      width:100%;
      margin-left: calc((100%/2) - (100%/2));
    }
  }
  @media only screen and (max-width: 500px) {
    #login_box{
      background-color: transparent;
      box-shadow:none;
    }
  }


#logo_login{
  position: relative;
  display: block;
  height:170px;
  padding-top:30px;
  margin-left: calc((100%/2) - 60px);
  margin-top: calc((100vh/2) - 210px);
  cursor:pointer;
}
#logo_login #logo_img{
  width:100px;
}

  @media only screen and (max-width: 500px) {
    #logo_login #logo_img{
      height:100px;
      margin-bottom: 20px;
    }
  }
  @media only screen and (orientation: landscape) and (max-height: 420px) {
    #logo_login{
      display: none;
    }
  }

#login_title{
  position: relative;
  text-transform: uppercase;
  font-weight: 600;
  font-size:18px;
  text-align: center;
  margin-top:10px;
  margin-bottom: 30px;
}
  @media only screen and (max-width: 550px) {
    #login_title{
      margin-top:-20px;
    }
  }
  @media only screen and (orientation: landscape) and (max-height: 420px) {
    #login_title{
      padding-top:20px;
    }
  }
  @media only screen and (orientation: landscape) and (max-height: 270px) {
    #login_title{
      padding-top:5px;
    }
  }

.log{
  text-align: center;
  width:210px;
  margin-left: auto;
  margin-right: auto;
}

.input_login{
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid rgb(230,230,230);
  background-color: transparent;
  padding:6px;
  font-size: 12px;
  cursor:text;
  width:200px;
  position: relative;
  display: inline-block;
  margin-bottom:10px;
  padding-left: 30px;
  margin-left: -20px;
}

.input_login:focus{
  outline:0;
  transition: border 0.3s ease-in;
}

.input_login:hover{
  opacity:0.9;
}

.icon_login{
  position: relative;
  display: inline-block;
}

#error{
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  font-weight: 500;
  text-align: center;
}

#login_button,#login_button2{
  margin-top: 40px;
  position: relative;
  padding: 5px;
  background-color: transparent;
  width:200px;
  border-color: black;
  border-width: 2px;
  font-weight: 500;
}
  @media only screen and (orientation: landscape) and (max-height: 250px) {
    #login_button, #login_button2{
      margin-top: 10px;
    }
  }
#login_button:hover, #login_button2:focus{
  color: white;
  background-color: black;
}


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((ABOUT PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/
.big_title2{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 80px;
  position: relative;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  text-transform: uppercase;
  z-index: 100;
  margin-bottom: 30px;
}
  @media only screen and (max-width: 1060px) {
    .big_title2{
      font-size: 60px;
    }
  }
  @media only screen and (max-width: 800px) {
    .big_title2{
      font-size: 55px;
    }
  }
  @media only screen and (max-width: 460px) {
    .big_title2{
      font-size: 45px !important;
    }
  }
  @media only screen and (max-width: 400px) {
    .big_title2{
      font-size: 35px;
    }
  }
/* links icones */
#links_about{
  position: relative;
  display: inline-block;
  padding: 0px;
}
  @media only screen and (max-width: 950px) {
    #links_about{

    }
  }

/* about container */
#first_line{
  position: relative;
}
#about_flying2{
  width:46.051vw;
  position: relative;
  display: block;
}
  @media only screen and (max-width: 950px) {
    #about_flying2{
      width: 52.839vw;
    }
  }
  @media only screen and (max-width: 560px) {
    #about_flying2{
      width:100% !important;
    }
  }

#about p, #about h3{
  font-size: 14px;
}

/* contacto */
#contact_about{
  width: 17.159vw;
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
  top: -93px;
}
  @media only screen and (max-width: 950px) {
    #contact_about{
      display: block;
      margin-left: 0px;
      top:0px;
      width: 30.735vw;
    }
  }
  @media only screen and (max-width: 560px) {
    #contact_about{
      width:100% !important;
    }
  }
/* foto */
#foto{
  position: relative;
  display: block;
  margin-left: -16.78vw;
  width: 100vw;
  height: auto;
  margin-top:-125px;
  margin-bottom:30px;
}
  @media only screen and (max-width: 950px) {
    #foto{
      width:auto;
      height: 70vh;
      margin-left: -35vw;
    }
  }
  @media only screen and (max-width: 600px) {
    #foto{
      margin-left: -50vw;
      margin-top:-100px;
    }
  }

  @media only screen and (max-width: 400px) {
    #foto{
      width:auto;
      height: 60vh;
      margin-left: -65vw;
    }
  }

#quote{
  width: 27.53vw;
  margin-left: 34.318vw;
  position: relative;
  margin-top:-200px;
  height:auto;
  padding-top: 20px;
  padding-right: 30px;
  padding-bottom: 20px;
  padding-left: 30px;
  font-size:14px;
  font-style: italic;
  color:white;
}
  @media only screen and (max-width: 930px) {
    .big_title3{
      font-size: 60px;
    }
    #quote{
      width: 39.263vw;
      margin-left: 27.53vw;
    }
  }
  @media only screen and (max-width: 750px) {
    #quote{
      width: 52.839vw;
      margin-left: 6.788vw;
    }
  }
  @media only screen and (max-width: 600px) {
    .big_title3{
      font-size: 50px;
      margin-top: 70px;
    }
    #quote{
      margin-top:-300px;
      margin-bottom: 80px;
    }
  }
  @media only screen and (max-width: 500px) {
    .big_title3{
      font-size: 40px;
    }
    #quote{
      width: 100%;
      margin-left: 0px;
      padding-top: 10px;
      padding-right: 20px;
      padding-bottom: 10px;
      padding-left: 20px;
    }
  }
  @media only screen and (max-width: 410px) {
    .big_title3{
      font-size: 30px;
      margin-top: 100px;
    }
    #quote{
      margin-top:-270px;
    }
  }

/* equipa */
#team{
  position: relative;
  display: block;
  text-align: left;
}

#team th{
  width:180px;
  font-weight: 500;
  font-size: 14px;
  padding-bottom:10px;
}

  @media only screen and (max-width: 410px) {
    #team th{
      font-size: 12px;
    }
  }

#team th a:hover{
  text-decoration: underline;
}

#team tr th span{
  font-size:8px;
  font-weight: 600;
  text-transform: uppercase;
}

/* end of team */


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((INSTITUITIONAL PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

#about_flying{
  width:46.051vw;
  position: relative;
  display: inline-block;
  margin-top:-50px;
}
  @media only screen and (max-width: 770px) {
    #about_flying{
      width:100%;
    }
  }

.curator2 p{
  font-size: 22px;
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.6px;
  width: 12.111vw;
  text-align: center;
  position: absolute;
  margin-top: calc(12.111vw - 120px);
  text-transform: uppercase;
}
/* end of curator container */



/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((AGENDA PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/
.wrap{
  position: fixed;
  top: 140px;
  width: 100vw;
  height: 40px;
  float: left;
  margin-left: -10vw;
  z-index: 900;
}

.wrap{
    z-index: 999;
}

#buttons{
  margin-left: 12vw;
  width: 12.111vw;
  position: fixed;
}
@media only screen and (max-width: 990px) {
  #buttons{
    margin-left: 25px;
    width: 80px;
    float: left;
    margin-top: 32px;
  }
}
@media only screen and (max-width: 720px) {
  #buttons{
    margin-left: 2vw;
    width: 80px;
    float: left;
    margin-top: 3.5vw;
  }
}
@media only screen and (max-width: 570px) {
  #buttons{
    margin-left: 15vw;
    float: none;
    margin-top: -62px;
    background-color: RGB(245, 248, 246);
    z-index: 900;
    width: 100%;
    text-align: left;
    padding-left: 10px;
  }
  #buttons .container_icon {
    display: inline-block!important;
    margin-right:10px !important;
  }
}


/* countries bar */
.items{
  position: fixed;
  list-style: none;
	margin: 0;
	padding: 0;
  top:90px;
  margin-left: 77vw;
  width: 16vw;
  font-size: 11px;
  z-index:500;
  cursor: pointer;
  transition: opacity 0.3s ease;
  background-color: rgba(235, 241, 236, 0.8);
  height:100vh;
  margin-top:-10px;
  padding-left:20px;
}
  @media only screen and (max-width: 500px) {
    .items{
      display: none;
    }
  }

.items:hover{
  opacity: 1;
  transition: opacity 0.3s ease;
}

.items li{
  padding:5px 1px 1px 5px;
  color:grey;
  transition: all 0.3s ease;
}

.items li:hover {
  font-weight: 600;
  color: black;
  margin-left:-10px !important;
  transition: all 0.3s ease;
}

.active_item{
  color:black !important;
  font-weight: 600;
  margin-left:-10px !important;
}
/* end of countries bar */

/* month bar */
.events_tab_menu{
  visibility: hidden;
  z-index: 990;
}

.subMenu,.subMenu2{
  position: fixed;
  padding-top:180px;
  left:10px;
	width: 100px;
	color:red;
  margin-left: 15px;
}

.subMenu a{
  transition: all 0.3s ease;
}

.subNavBtn,.subNavBtn2 {
  display: block;
  height: 35px;
  width: 100px;
  margin-left:-20px;
  text-decoration: none;
  font-size: 18px;
  padding: 8px 10px 8px 45px;
}
.subMenu a:hover,.subMenu2 a:hover{
	color:white;
  transition: all 0.3s ease;
  cursor: pointer;
}
@media only screen and (max-width: 650px) {
  .subMenu,.subMenu2{
    margin-left: -3vw;
  }
}
@media only screen and (max-width: 570px) {
  .subMenu,.subMenu2{
    margin-top:-40px !important;
  }
}
@media only screen and (max-width: 500px) {
  .subMenu,.subMenu2{
    margin-left: -4vw;
  }
}
@media only screen and (max-width: 400px) {
  .subMenu,.subMenu2{
    margin-left: -6vw;
  }
  .subNavBtn,.subNavBtn2 {
  	font-size: 16px;
  }
}

.active_tab{
  visibility: visible !important;
}

/*line*/
#line,#line2{
  width: 100px;
  border-width: 3px !important;
  padding-top: 170px;
}

#line_container,#line_container2{
  position: fixed;
  visibility: hidden;
  width:100px;
  height:100vh;
  z-index: 500;
  top: 10px;
  left: 0px;
}
@media only screen and (max-width: 500px) {
  #line_container,#line_container2,
  #line,#line2{
    width:70px;
  }
}

#line_container p,#line_container2 p{
  font-size: 14px;
  font-weight: 600;
  margin-left: 110px;
  margin-top: -10px;
  display: none;
}
/*-- end of month bar */
.sobe{
  margin-top: -35px!important;
  margin-right: 15vw!important;
  z-index: 999;
}
  @media only screen and (max-width: 1100px) {
    .sobe{
      margin-right:10px;
    }
  }
  @media only screen and (max-width: 970px) {
    .sobe{
      margin-right: 13vw !important;
      margin-top: -30px !important;
    }
  }
  @media only screen and (max-width: 650px) {
    .sobe{
      margin-top: -60px !important;
    }
    #bar_search{
      margin-top: -20px !important;
    }
  }
  @media only screen and (max-width: 450px) {
    .sobe{
      background-color: rgb(245, 248, 246);
    }
  }
/* tab content - each view */
#types_of_view{
  position: relative;
  display: block;
  width: 66.64vw;
  min-height:100%;
  margin-top: 140px;
  margin-left: 6.788vw;
}

.events_tab{
  position: relative;
  visibility: hidden;
  top:0px;
}

/* modular view */
.container_event{
  position: relative;
  display: inline-block;
  width: 18.899vw;
  height: 25vw;
  margin-right:1.465vw;
  margin-bottom:1.465vw;
}

  @media only screen and (max-width: 770px) {
    .events_container a .container_event{
      width: calc(32.475vw - 1.465vw);
      height: 42.96vw;
      margin-right:1.465vw !important;
    }
  }

  @media only screen and (max-width: 415px){
    .events_container a .container_event{
      width: 66.46vw;
      height: 87.92vw;
      margin-right:1.465vw !important;
    }
  }

.space{
  width:100%;
  height:100px;
}

/* map view */
#events_map{
  position: fixed;
  top:150px;
}

#map_agenda {
  width: 100vw;
  height: 100vh;
  margin-left: -17vw;
  position: absolute;
  display: block;
  margin-top: -120px;
}


#events_calendar>div{
  top:100px;
}


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((EVENT PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* event into */
#destq_event{
  margin-left: 7.9845vw;
}

.event_page_container{
  height: 25vw;
  width: 46.051vw;
  margin-top: 220px;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
}

#intro_event{
  margin-left:6.788vw;
}
@media only screen and (max-width: 850px) {
  .event_page_container{
    width:100%;
    height:auto;
  }
  #intro_event{
    margin-left:0px;
  }
}

@media only screen and (max-width: 460px) {
  .event_page_container{
    width:auto !important;
    height:40vh !important;
  }
}

#title_event_page{
  display: inline;
  position: absolute;
  margin-left: 13.5vw !important;
  margin: 0px;
  height: 150px;
  margin-top: -150px;
  z-index: 100;
}

#title_event_page #country{
  margin-top: -35px;
}

@media only screen and (max-width: 1060px) {
  #title_event_page{
    height:110px;
    margin-top: -110px;
  }
}

@media only screen and (max-width: 950px) {
  .event_page_container{
    height: 30vw;
    width: 100%;
  }
  #title_event_page{
    margin-left: 0px !important;
  }
}

@media only screen and (max-width: 800px) {
  #title_event_page #country{
    margin-top: -28px;
  }
}

@media only screen and (max-width: 650px) {
  #title_event_page{
    height:100px;
    margin-top: -100px;
  }

  #title_event_page #country{
    margin-top: -38px;
  }
}

@media only screen and (max-width: 460px) {
  #title_event_page{
    height:85px;
    margin-top: -85px;
  }
  #title_event_page #country{
    margin-top: -35px;
  }
}
.day2{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 200px;
  color: white;
  position: absolute;
  margin-top: calc(-50vh + 100px);
  margin-left: 34vw;
  text-align: center;
}
@media only screen and (max-width: 1220px) {
  .day2{
    margin-left: 32vw;
  }
}

.month2{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.2px;
  font-size: 65px;
  margin-top: -105px;
  margin-left: calc(46.051vw + 40px);
  position: relative;
  text-transform: uppercase;
  -ms-transform: rotate(90deg) translate(-25px,100px); /* IE 9 */
  -webkit-transform: rotate(90deg) translate(-25px,100px);  /* Safari */
  transform: rotate(90deg) translate(-25px,100px);
  width:200px;
  text-align: left;
}

.hour2{
  font-size: 12px;
  font-weight: 500;
  display: block;
  position: absolute;
  margin-top: -210px;
  margin-left: calc(46.051vw + 15px);
}
  @media only screen and (max-width: 950px) {
    .day2{
      margin-top: -31vh;
      margin-left:calc(46.051vw - 30px);
    }
    .month2{
      -ms-transform: rotate(0deg) translate(0px,0px); /* IE 9 */
      -webkit-transform: rotate(0deg) translate(0px,0px);  /* Safari */
      transform: rotate(0deg) translate(0px,0px);
      color:white !important;
      margin-left: 1.465vw;
      margin-top: -12vh;
    }
    .hour2{
      -ms-transform: rotate(0deg) translate(0px,0px); /* IE 9 */
      -webkit-transform: rotate(0deg) translate(0px,0px);  /* Safari */
      transform: rotate(0deg) translate(0px,0px);
      color:white !important;
      margin-left: 1.465vw;
      margin-top: -13vh;
    }
  }
  @media only screen and (max-width: 850px) {
    .day2{
      margin-left:calc(66.64vw - 150px);
    }
  }

  @media only screen and (max-width: 750px) {
    .day2{
      font-size: 120px;
      margin-left: calc(66.46vw - 100px);
      margin-top: -20vh;
    }
    .month2{
      font-size: 55px;
      margin-top: -10vh;
    }
    .hour2{
      margin-top: -11vh;
    }
  }
  @media only screen and (max-width: 460px) {
    .day2{
      font-size: 90px;
      margin-left: calc(66.46vw - 80px);
      margin-top: -37vh;
    }

  }

/* area de cada parte de detalhes */
#event_det{
  background: white;
  border: 0 none;
  border-radius: 3px;
  padding: 20px 30px;
  box-sizing: border-box;
  width: 52.839vw;
  position: relative;
  min-height:300px;
  margin-left: 6.788vw;
  margin-bottom: 20px;
}
@media only screen and (max-width: 850px) {
  #event_det{
    width: 100%;
    margin-left:0px;
  }
}

#title_bold{
  font-size:8px;
  font-weight: 600;
  text-transform: uppercase;
}

#detail{
  margin-left: calc(6.788vw - 20px);
}

.part_detail{
  display: inline-block;
  position: relative;
  float:left;
  width:18.899vw;
}
  @media only screen and (max-width: 850px) {
    .part_detail, .info_detail{
      width: calc(100%/2);
    }
  }

.detail_title{
  display: block;
  position: relative;
  width: 18.899vw;
  margin-bottom:5px;
}

.info_detail{
  position: relative;
  display: block;
  float: left;
  margin-left: 1.465vw;
  padding: 0px;
  width:18.899vw;
}
  @media only screen and (max-width: 600px) {
    .info_detail{
      margin-left: 0px;
    }
  }
  @media only screen and (max-width: 450px) {
    .info_detail{
      margin-left: calc(1.465vw*2);
      width: 100%;
    }
    .part_detail, .detail_title{
      width: 100%;
    }
  }
#map_loc2, #map_loc3{
  width:calc(25.687vw - 50px);
  height:150px;
  position: relative;
  display: inline-block;
}
@media only screen and (max-width: 850px) {
  #map_loc2, #map_loc3{
    display: none;
  }
}

#submenu_event{
  position: relative;
  text-transform: uppercase;
  margin-top: -20px;
  text-align: right;
  width: 46.051vw;
  font-size: 14px;
}
  @media only screen and (max-width: 850px) {
    #submenu_event{
      width: 100%;
      text-align: center;
    }
  }
/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((ARTICLE PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* article */
.meddium_title{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 60px;
  margin-top: 60px;
  margin-left: 7.5%;
  text-align: center;
  position: relative;
  width: 85%;
  text-transform: uppercase;
  z-index: 100;
}
  @media only screen and (max-width: 1080px){
    .meddium_title{
      font-size: 45px;
    }
  }
  @media only screen and (max-width: 800px){
    .meddium_title{
      font-size: 30px;
    }
  }
  @media only screen and (max-width: 600px){
    .meddium_title{
      font-size: 25px;
      font-weight:300;
      margin-top: 10px;
      margin-bottom: 40px;
    }
  }

#article_container{
  min-height: 90vh;
  padding: 5vw;
  width: 100%;
  margin-top: -160px;
  padding-top: 120px;
  background-color: white;
}
  @media only screen and (max-width: 600px){
    #article_container{
      margin-top: -170px;
    }
  }
  @media only screen and (max-width: 400px){
    #article_container{
      width: 120%;
      margin-left: -10%;
    }
  }

#article_container p{
  font-size: 16px;
  line-height: 1.5;
}
@media only screen and (max-width: 600px){
  #article_container p{
    font-size: 14px;
    line-height: 1.25;
  }
}

.article p{
  font-size: 16px;
  line-height: 1.5;
}

/* cabeçalho */
#article_date{
  width:100%;
  text-align: center;
}

#cab_article{
  width:100%;
  position: relative;
  font-weight: 500;
  margin-bottom: 30px;
}

#cab_article p{
  display: inline-block;
}

#cab_article .feat{
  float: right;
  margin-left:5px;
}
  @media only screen and (max-width: 500px){
    #cab_article .feat{
      float: none;
      display: block;
      margin-left:0px;
      margin-bottom: -10px;
    }
  }
.featured_article{
font-size:10px;
font-weight:500;
padding:5px;
color:white;
text-transform:uppercase;
}
/* end of the cabeçalho */

/* article content */
.article_img{
  position: relative;
  display: inline-block;
  margin-top: 20px;
  margin-bottom: 20px;
  width: 100%;
  height: 30vw;
  background-position: center center;
  background-size: cover;
}

/* related */
#related_articles, #country_sec{
  width:100%;
  min-height: 300px;
  margin-top: 30px;
  margin-bottom: 60px;
  margin-left: 5%;
  clear:both;
}

#t_related a{
  display: inline-block;
  position: relative;
  cursor: pointer;
  width: 18.899vw;
  min-height: 350px;
  margin-right:1.465vw;
  margin-bottom:1.465vw;
  background-color: #EBF1EC;
}

#t_related a:last-child{
  margin-right:0px !important;
}

  @media only screen and (max-width: 950px){
    #related_articles{
      margin-left: 0px;
    }
    #t_related a{
      width: calc((66.46vw/ 3) - 1vw);
    }
  }

  @media only screen and (max-width: 750px){
    #t_related a{
      width: calc((66.46vw/ 2) - 0.8vw );
    }
    #t_related a:nth-last-child(2){
      margin-right:0px !important;
    }
    #t_related a:last-child{
      display: none;
    }
  }

  @media only screen and (max-width: 580px){
    #t_related a:last-child{
      display: inline-block;
    }
    #t_related a{
      width: 100%;
    }
  }

.r_article_container_img{
  position: relative;
  width:90%;
  margin-left: 5%;
  height:150px;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;

}

.r_article_container p{
  margin-left: 5%;
}

.petty_title{
  letter-spacing: 0.5px;
  font-size: 22px;
  font-weight: 500;
  position: relative;
  width: 90%;
  margin-left: 5%;
}

.r_article_container .feat{
  float: left;
  margin-left:5%;
}
/* end of the related */




/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((MAGAZINE PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

/* destqaque */
#destq{
  margin-top:-50px;
  position: relative;
}
#img_cab_destq{
  width: 32.475vw;
  position: relative;
  display: inline-block;
  float: left;
}

.article_destq_img{
  width: 100%;
  height: 20vw;
  background-position: center center;
  background-size: cover;
}
  @media only screen and (max-width: 950px){
    #img_cab_destq{
      width: 100%;
      display: block;
      float: none;
    }
    .article_destq_img{
      height: 30vw;
    }
  }

#cab_article{
  margin-top:8px;
}

#article_destq_container{
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
  margin-top: -30px;
  margin-bottom: 20px;
  width: 32.475vw;
}

  @media only screen and (max-width: 950px){
    #article_destq_container{
      width: 100%;
      display: block;
      margin-left: 0px;
    }
  }

#article_destq_container p{
  font-size: 14px;
  line-height: 1.7;
  margin-top: 0px;
}

.destq_title{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 3em;
  position: relative;
  text-transform: uppercase;
  z-index: 100;
}

.destq_title:hover{
  text-decoration: underline;
}

#more{
  margin-top:-20px;
  margin-left: calc(100% - 35px);
}

/* recent */
#recent_articles{
  margin-bottom:150px;
  display: inline-block;
  position: relative;
  float:left;
  width: 45.951vw;
}
@media only screen and (max-width: 1000px){
  #recent_articles{
    width:100%;
    display: block;
    float: none;
    margin-bottom: 0px;
  }
}

.recent_article_container{
  display: inline-block;
  position: relative;
  cursor: pointer;
  margin-bottom: 1.465vw;
  width: 100%;
  background-color: #EBF1EC;
}

.recent_article_container_img{
  position: relative;
  display: inline-block;
  float:left;
  width:10vw;
  height: 10vw;
  margin-top: 1.465vw;
  margin-left: 1.465vw;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
}

.recent_cab{
  position: relative;
  display: inline-block;
  margin-left: 1.465vw;
  margin-top: 1.465vw;
  width:calc(100% - 12.93vw);
}
  @media only screen and (max-width: 1000px){
    .recent_article_container{
      margin-top: 0px;
      margin-bottom: 20px;
    }
    .recent_article_container_img{
      width:auto;
      height: 200px;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      float: none;
      display: block;
      margin-top: 0px;
    }
    .recent_cab{
      width:90%;
      margin-left: 5%;
    }
  }


.recent_date{
  margin-top: 0px;
}

.recent_petty_title{
  letter-spacing: 0.5px;
  font-size: 2em;
  position: relative;
  display: block;
  width: 95%;
}

.recent_article_container .feat{
  margin-right: 5px;
  display: inline-block;
}
.recent_article_container .text{
  display: block;
  font-weight: 300;
  font-size: 14px;
  line-height: 1.5;
  margin-top: -10px;
  position: relative;
  width: 90%;
  margin-left: 5%;
}

  @media only screen and (max-width: 1000px){
    .recent_article_container .text{
      margin-top: 0px;
    }
  }
/* end of the recent */

/* country news*/
#country_articles{
  position: relative;
  display: inline-block;
  width: 18.899vw;
  margin-left: 1.465vw;
}
  @media only screen and (max-width: 1000px){
    #country_articles{
      display: none;
    }
  }

.country_article_container{
  width: 100%;
  position: relative;
  cursor: pointer;
  margin-bottom: 1.465vw;
  background-color: white;
}

.country_cab{
  position: relative;
  padding: 1.465vw;
  width: calc(100% - 1.465vw*2);
}

.country_petty_title{
  letter-spacing: 0.5px;
  font-size: 1.5em;
  position: relative;
  display: block;
}
/* end of the country news */



/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((SUBMITION PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/
#apply_h1{
  margin-top:-100px;
}
@media only screen and (max-width: 1100px){
  #apply_h1{
    margin-top:-40px;
  }
}
@media only screen and (max-width: 450px){
  #apply_h1{
    font-size: 40px !important;
  }
}
/*apply area*/
#apply_form {
  width: 52.839vw;
  height:auto;
  margin: 50px auto;
  position: relative;
}

@media only screen and (max-width: 900px){
  #apply_form {
    width: 66.64vw;
  }
}
@media only screen and (max-width: 450px){
  #apply_form {
    width: 90vw;
    margin-left: -12vw;
  }
}


/*progress_bar*/
#progress_bar {
  padding:0px;
  margin:0px;
  margin-bottom: 30px;
  overflow: hidden;
  width: 100%;
}

#progress_bar li {
  list-style-type: none;
  color: black;
  text-transform: uppercase;
  font-size: 9px;
  width: calc(100% / 6);
  float: left;
  position: relative;
  transition: color 0.2s ease;
}

/* bola */
#progress_bar li:before {
  content: 'i';
  width: 25px;
  line-height: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  display: block;
  font-size: 10px;
  background: white;
  color: white;
  margin: 0 auto 5px auto;
  transition: color 0.2s ease;
}

/* linha */
#progress_bar li:after {
  content: '';
  width: 100%;
  height: 5px;
  background: white;
  position: absolute;
  left: -50%;
  top: 10px;
  z-index: -1;
}

#progress_bar li:first-child:after {
 content: none;
}

#progress_bar li.active:before, #progress_bar li.active:after {
  background: black;
  color: black;
  transition: color 0.2s ease;
}
/*end of progress_bar*/

/* area de cada parte da candidatura */
#apply_form fieldset {
  background: white;
  border: 0 none;
  border-radius: 3px;
  padding: 20px 30px;
  box-sizing: border-box;
  width: 100%;
  box-shadow: 5px 5px 5px rgba(0,0,0,0.08);
  position: relative;
  min-height:300px;
  transition: minHeight 2s ease;
}

#apply_form fieldset:not(:first-of-type) {
  display: none;
}

/*titles*/
.apply_title {
  font-size: 1.5em;
  text-transform: uppercase;
  margin-bottom: 10px;
  width:70%;
  margin-left: 15%;
  text-align: center;
}
.apply_subtitle {
  font-weight: 300;
  font-size: 12px;
  width:70%;
  margin-left: 15%;
  margin-bottom: 20px;
  text-align: center;
}

@media only screen and (max-width: 900px){
  .apply_title,.apply_subtitle {
    width: 100%;
    margin-left: 0px;
  }
}

/*button*/
.blank_apply{
  width:200px;
  height:40px;
  display: block;
}

.button_apply{
  padding: 6px 14px 6px 14px;
  font-weight: 700;
  text-transform: uppercase;
  position: relative;
  display: inline-block;
  width: 100px;
  margin-left: 10px;
  text-align: center;
  float:right;
}
@media only screen and (max-width: 900px){
  .button_apply{
    display: block;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    float:none;
  }
}

.next{
  background-color:rgb(235,235,235);
}

/*input*/
.margin_left_input{
  /*margin-left: calc((100%/2) - ((18.899vw + 15px)/2));*/
  margin-left:auto;
  margin-right:auto;
  text-align: center;
}
@media only screen and (max-width: 900px){
  .apply_title,.apply_subtitle {
    width: 100%;
    margin-left: 0px;
  }
}

.margin_left_input ul{
  box-shadow: 5px 5px 5px rgba(40,40,40,0.03);
}

.apply_input_field{
  outline:none;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid rgb(230,230,230);
  background-color: transparent;
  padding:6px;
  font-size: 12px;
  cursor:text;
  color:black;
  position: relative;
  display: inline-block;
  width: 18.899vw;
  margin-top:30px;
  padding-left: 30px;
  margin-left: -20px;
}

/*_text to biography*/
.apply_txt_a_field{
  outline:none;
  border:none;
  background-color: transparent;
  padding:6px;
  font-size: 12px;
  cursor:text;
  position: relative;
  display: inline-block;
  width: calc(18.899vw + 15px);
  height: 150px;
  margin-top:30px;
  padding-left: 30px;
  background: #F8F8F6;
  border-radius: 1px;
  font-family: "museo-sans", "Roboto", "Helvetica";
}

@media only screen and (max-width: 900px){
  .apply_input_field,.apply_txt_a_field{
    width: 200px !important;
  }
  .selectivity-multiple-input-container{
    width: 200px !important;
    margin-left: -38px !important;
  }
}

.disabled_input{
  border-bottom: solid 2px grey;
  pointer-events:none;
    -webkit-user-select: none;  /* Chrome all / Safari all */
   -moz-user-select: none;     /* Firefox all */
   -ms-user-select: none;      /* IE 10+ */
  user-select: none;
}

/* text to write how many musicians */
.apply_input_num{
  outline:none;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid rgb(230,230,230);
  background-color: transparent;
  padding:6px;
  font-size: 20px;
  cursor: text;
  color: black;
  position: relative;
  display: block;
  width: 60px;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

/*upload input*/
/*_hide the style of upload input*/
input[type="file"] {
  display: none;
}

.custom-file-upload {
  display: block;
  position: relative;
  width: 150px;
  padding: 6px 12px;
  cursor: pointer;
  background-color: black;
  color:white;
  margin:auto;
  text-align: center;
}
@media only screen and (max-width: 700px){
  .custom-file-upload {
    width: 200px;
  }
}
/*end of inputs */

/*images*/
/*_upload photo and rider */
#img_upload{
  width:200px;
  height: 200px;
  position: relative;
  border: 3px dashed #CCCCCC;
  display: block;
  margin:5% auto;
  opacity: 1;
}

/*_upload photo musicians */
#img_upload2{
  width:120px;
  height: 120px;
  position: relative;
  border: 2px dashed #CCCCCC;
  display: block;
  margin:5% auto;
}

/*_send image */
#img_send{
  width:300px;
  height: 200px;
  position: relative;
  display: block;
  margin:5% auto;
}
/*end of images*/

/*musicians field*/
#musicians{
  position: relative;
  display: block;
  width: 100%;
  margin-left:auto ;
  margin-right:auto;
  margin-bottom: 10px;
  margin-top:80px;
}

.title_info_musician{
  margin-bottom: -15px;
  margin-left: 220px;
}

.musician_photo{
  width: 200px;
  float:left;
  margin-top:45px;
  position: relative;
  display: inline-block;
}

.musician_info{
  min-width: 200px;
  min-height: 100px;
  margin-bottom: 50px;
  position: relative;
  display: inline-block;
}

@media only screen and (max-width: 730px){
  .musician_photo{
    float: none;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }

  .musician_info,.title_info_musician{
    float: none;
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
  }
}

/*end of musicians field*/




/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((EDIT FORMATION PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

#title_edit{
  position: absolute;
  margin-top: -70px;
  height: 14em;
  z-index: 100;
}

#edit_form,#edit_form2{
  position: relative;
  display: block;
  padding-top: 140px;
  width: 52.839vw;
  height:auto;
  margin: 50px auto;
}

@media only screen and (max-width: 700px){
  #edit_form{
    width: 66.64vw;
    margin-left: 12vw;
  }
  #edit_form2{
    width: 66.64vw;
    margin-left: 0px;
  }
}
@media only screen and (max-width: 450px){
  #edit_form,#edit_form2{
    width: 90vw;
    margin-left: -12vw;
    padding-top:90px;
  }
}

#submenu_edit_form{
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
  position: fixed;
  margin-top: -60px;
  left: 30px;
}

#edit_form #submenu2{
  display: none;
}
@media only screen and (max-width: 450px){
  #submenu_edit_form{
    display: none;
  }
  #edit_form #submenu2{
    display: block;
  }
}

#submenu_edit_form p{
  font-weight: 500;
}

#submenu_edit_form a{
  font-size: 10px;
  text-transform: uppercase;
  background-color: rgba(245, 248, 246, 0.5);
  letter-spacing: 1px;
  padding:5px 10px;
  font-weight: 600;
}

.submmit_edit{
  position: fixed;
  margin-left: calc(100% - (46.051vw - 40px));
  margin-top: 51vh;
}
#submmit_edit2, #save2, #submmit_app2{
  position: fixed;
  margin-left: calc(100% - (46.051vw - 40px));
  margin-top: 42vh;
}
#submmit_edit2, #save2, #submmit_app2{
  position: absolute;
  margin-left: calc(100%/2 - 100px);
  margin-top:40px;
  display: none;
}

  @media only screen and (max-width: 900px){
    #submmit_edit, #save, #submmit_app{
      width:100px!important;
    }
  }

  @media only screen and (max-width: 700px){
    #submmit_edit{
      position: fixed;
      left: 30px;
      margin-left:0px;
    }
    #save{
      display: none;
    }
    #save2{
     display: block;
   }
  }
  @media only screen and (max-width: 950px){
    #submmit_app{
      display: none;
    }
    #submmit_app2{
      display: block;
      margin-left:auto;
      margin-right:auto;
      text-align: center;
      float:none;
      position: relative;
    }
  }
  @media only screen and (max-width: 450px){
    #submmit_edit{
      display: none;
    }
    #submmit_edit2{
      display: block;
    }
  }

#submenu_edit_form a:hover{
  text-decoration: underline;
  background-color: rgb(245, 248, 246);
}

#edit_form form,#edit_form2 form{
  width:100%;
  height: auto;
}

#edit_form fieldset, #edit_form2 fieldset {
  background: white;
  border: 0 none;
  border-radius: 3px;
  padding: 40px;
  box-sizing: border-box;
  width: 100%;
  margin-bottom:20px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  display: block;
  min-height:280px;
  text-align: center;
  transition: opacity 0.2s ease;
}

#edit_form h2,#edit_form2 h2{
  text-align: center;
}

#img_band_edit{
  position: relative;
  width: 280px;
  height: 180px;
  margin-left: auto;
  margin-right:auto;
  padding: 0 !important;
  background-position: center;
  background-size: cover;
  margin-bottom:20px;
}
@media only screen and (max-width: 700px){
  #img_band_edit{
    width: 200px;
    height: 130px;
  }
}

#from{
  font-weight: 500;
  display: inline-block;
}

.tag p{
  margin-bottom: -20px;
  text-align: left;
  margin-top: 25px;
}

.tag{
  font-weight: 500;
  font-size: 10px;
  width: 18.899vw;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 700px){
  .tag{
    width: 200px;
  }
}


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((ADD EVENT venue_name PAGE)) ---- */
/* ///////////////////////////////////////////////////////*/


 #mycalendar2{
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative !important;
  display: block;
 }

 #submenu_add_event{
   width: 32.475vw;
   float:left;
   display: inline-block;
   position: relative;
 }

 #edit_form2 #other_events_edit{
   width: 18.899vw;
   position: relative;
   display: inline-block;
  margin-left: 1.465vw;
 }

  @media only screen and (max-width: 800px){
    #submenu_add_event{
      width:100%;
      float:none;
      display: block;
      margin-left: auto;
      margin-right: auto;
    }
      #edit_form2 #other_events_edit{
      width:100%;
      float:none;
      display: block;
      margin-left: auto;
      margin-right: auto;
      margin-top:30px;
    }
    #edit_form2 #other_events_edit #other_e_g{
      width:100%;
    }
    #edit_form2 #other_events_edit #other_e_g #other_e{
      padding-left: 20px
    }

  }


 /* ///////////////////////////////////////////////////////*/
 /* ------------------------------ ((APPLICATIONS PAGE)) ---- */
 /* ///////////////////////////////////////////////////////*/

 /* bar of formation */
.app{
  display: inline-block;
  width: calc(100% - 50px - 1.465vw);
  position: relative;
}

.formation_app{
 width:100%;
 height:45px;
 padding: 5px 15px;
 background-color: white;
 position: relative;
 display: inline-block;
 float:left;
}

.formation_app:hover{
  background-color:black;
  color:white;
  cursor: pointer;
}


.formation_app p{
  font-weight: 500;
  position: relative;
  margin-top: 10px;
  display: inline-block;
}

.formation_app i{
  font-weight: 500;
  position: relative;
  float: right;
  color:black;
  font-size: 15px;
  margin-top:10px;
  display: inline-block;
}

.formation_app .country_app{
  left: 30vw;
  font-size: 10px;
  padding-top:2px;
  position: absolute;
  text-transform: uppercase;
}
  @media only screen and (max-width: 450px){
    .formation_app .country_app{
      display: none;
    }
  }

.formation_nominate{
 margin-right: 1.465vw;
 width:50px;
 height:45px;
 padding-top: 5px;
 float:left;
 text-align: center;
 background-color: white;
 position: relative;
 display: inline-block;
}

.formation_nominate:hover{
  background-color:black;
  color:white;
  cursor: pointer;
}

.formation_nominate i {
  font-weight: 500;
  position: relative;
  color:black;
  font-size: 15px;
  margin-top:10px;
  display: inline-block;
}


.formation_app:hover i, .formation_nominate:hover i{
  color: white !important;
}

/*painel com mais info*/
div.panel {
  width:100%;
  padding-left: 20px;
  display: inline-block;
  position: relative;
  background-color: white;
  height: 0px;
  overflow: hidden;
  transition: all 0.7s ease;
  opacity: 0;
}

div.panel.show {
  opacity: 1;
  padding: 20px 20px;
  height: auto;
  margin-bottom: 10px;
  margin-top: 10px;
}

/*parte 1 do painel de foto*/
.sub_panel1{
  display: block;
  text-align: center;
  margin-left: auto;
  margin-right:auto;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  position: relative;
}

/*parte 2 do painel de info*/
.sub_panel2{
  width: 90%;
  height:auto;
  display: inline-block;
  position: relative;
  margin-left: 1.465vw;
  margin-bottom: 20px;
}
.sub_panel2 > p{
  width:30vw;
  font-size:13px;
}
@media only screen and (max-width: 950px) {
  .sub_panel2 > p{
    width:100%;
  }
}
.sub_panel2 h2,.sub_panel3 h2 {
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-size: 2em;
  margin-top:15px !important;
  text-align: left !important;
}

.group_of_groups{
  position: relative;
  display: inline-block;
}

.rider_group{
  float: left;
  margin-right: 40px;
  display: inline-block;
}

.img_download{
  width:100px;
  height: 100px;
  position: relative;
  border: 2px solid #CCCCCC;
  display: block;
}

.img_download:hover{
  border: 2px solid #171817;
  opacity: 0.5;
}

.img_download:active{
  border: 2px solid #171817;
  opacity: 1;
}

.img_download:hover path,
.img_download:hover polyline,
.img_download:hover line{
  stroke: #171817;
}

.img_download:active path,
.img_download:active polyline,
.img_download:active line{
  stroke: #171817;
}

.contact_group{
  position: relative;
  float: left;
  display: inline-block;
}

.panel_links{
  position: relative;
  display: inline-block;
  padding: 0px;
  margin-top: 20px;
}

/*parte 3 do painel -musico*/
.sub_panel3{
  width:calc(100%/2 - 1.465vw*2);
  height:auto;
  float: left;
  display: inline-block;
  position: relative;
  margin-top: 40px;
  margin-right: 1.465vw;
  margin-left: 1.465vw;
}
.sub_panel3 > p{
  font-size:13px;
}
@media only screen and (max-width: 950px) {
  .sub_panel3{
    float:none;
    display: block;
    width:100%;
  }
  .contact_group, .rider_group{
    float: none;
    display: block;
    margin-top:30px;
  }
}

#submmit_app{
  position: fixed;
  right:100px;
  top: calc(85% - 340px);
  transition: all 0.3s ease;
}

#curator_sub{
  position: absolute;
  display: inline-block;
  width:80%;
  margin-top:20px;
  margin-left: 20px;
}

/*////FORUM////*/
@media only screen and (max-width: 400px) {
  .moot{
    width:100%;
  }
}


/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((HOMEPAGE)) ---- */
/* ///////////////////////////////////////////////////////*/

.image_big{
  overflow: hidden;
  width:100vw;
  height: 80vh;
  margin-left: -16.8vw;
}

.image_backg{
  height: 100%;
  position: relative;
  display: block;
  background-position: center;
  background-size: cover;
  background-blend-mode: multiply;
}

.title_home{
  z-index: 100;
  color:white !important;
  margin-top: -20vh;
  margin-left: 6.78vw;
}

@media only screen and (max-width: 800px) {
  .image_big .big_title{
    font-size:70px;
  }
}

@media only screen and (max-width: 600px) {
  .image_big .big_title{
    font-size:50px;
  }
}

@media only screen and (max-width: 400px) {
  .image_big .big_title{
    font-size:40px;
  }
}

.title_home:hover{
  text-decoration: underline;
}


#focus:hover{
  cursor: pointer;
}

#focus{
  margin-top: 220px;
  width: 100px;
  height: 100px;
  border-radius: 100px;
  position: absolute;
  z-index: 100;
  pointer-events:none;
  display: block;
  mix-blend-mode: difference;
}

#focus2{
  margin-top: 220px;
  width: 40px;
  height: 40px;
  border-radius: 40px;
  position: absolute;
  z-index: 110;
  pointer-events:none;
  display: block;
  mix-blend-mode: difference;
}

#focus1{
  margin-top: 220px;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  position: absolute;
  z-index: 120;
  pointer-events:none;
  display: block;
  mix-blend-mode: difference;
}

#button_home{
  position: relative;
  top: -40px;
  margin-left: calc(50% - 55px);
  margin-bottom: 20px;
}

.text_title{
  margin-top: -80vh;
}

.image_big .ev_title{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 120px;
  position: relative;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  text-transform: uppercase;
  z-index: 100;
  display: block;
  margin-bottom: -100px;
  width: 100%;
  text-align: right;
  right: 6.788vw;
  color:white;
}

.image_big .size2{
  font-size: 200px;
  margin-bottom: -130px;
}

.hours{
  font-size: 20px;
  position: relative;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
  text-transform: uppercase;
  z-index: 100;
  display: block;
  color: white;
  width: 30px;
  text-align: right;
  margin-top: -145px;
  margin-left: 100vw;
  -ms-transform: rotate(90deg) translate(-25px,7vw);
  -webkit-transform: rotate(90deg) translate(-25px,7vw);
  transform: rotate(90deg) translate(-25px,7vw);
}

.forma_title{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 90px;
  position: relative;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  text-transform: uppercase;
  z-index: 100;
  margin-top:-400px;
  -ms-transform: rotate(-20deg) translate(-75px,3vw);
  -webkit-transform: rotate(-20deg) translate(-75px,3vw);
  transform: rotate(-20deg) translate(-75px,3vw);
}

.salao_title{
  font-family: "league-gothic", 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  font-size: 50px;
  position: relative;
  width: -moz-fit-content;
    width: -webkit-fit-content;
    width: fit-content;
  text-transform: uppercase;
  z-index: 100;
  display: block;
  width: 100%;
  text-align: left;
  left: 6.788vw;
  color:white;
  line-height: 3;
}

.salao_title span{
  color:rgb(235, 241, 236);
  font-family: "league-gothic", 'Oswald', sans-serif;
}

@media only screen and (max-width: 850px) {
  .image_big{
    height: 60vh;
  }
  .text_title{
    margin-top: -40vh;
  }
  .image_big .size2{
    font-size:120px;
    margin-bottom: -80px;
  }
  .hours{
    font-size:12px;
    margin-top: -105px;
  }
  .image_big .ev_title{
    font-size:80px;
  }
  .forma_title{
    font-size: 50px;
    transform: rotate(-20deg) translate(-20px, 20vw);
    -ms-transform: rotate(-20deg) translate(-20px, 20vw);
    -webkit-transform: rotate(-20deg) translate(-20px, 20vw);
  }

}

@media only screen and (max-width: 700px) {
  .image_big{
    height: 400px;
  }
  .text_title{
    margin-top: -30vh;
  }
  .hours{
    font-size:10px;
    margin-top: -65px;
  }
  .image_big .ev_title{
    font-size:40px;
    margin-top:0px;
  }

  .salao_title{
    font-size:30px;
    margin-top:40px;
  }

  .image_big .size2{
    font-size:80px;
    margin-bottom: -20px;
  }
  .forma_title{
    font-size: 30px;
    transform: rotate(-20deg) translate(-40px, 30vw);
    -ms-transform: rotate(-20deg) translate(-40px, 30vw);
    -webkit-transform: rotate(-20deg) translate(-40px, 30vw);
  }

}

@media only screen and (max-width: 400px) {
  .forma_title{
    transform: rotate(-20deg) translate(-40px, 50vw);
    -ms-transform: rotate(-20deg) translate(-40px, 50vw);
    -webkit-transform: rotate(-20deg) translate(-40px, 50vw);
  }
  .salao_title{
    margin-top: 20px;
    width:150px;
    line-height:40px;
  }
}

/* ///////////////////////////////////////////////////////*/
/* ------------------------------ ((STYLE GUIDE)) ---- */
/* ///////////////////////////////////////////////////////*/

/*menu styleguides*/
#menu_style{
  width:100%;
  height:160px;
  position: fixed;
  display: block;
  margin-left: -10vw;
  background-color: white;
  box-shadow: 5px 5px 5px rgba(40,40,40,0.03);
  z-index: 900;
  top:0px;
}

#menu_style .big_title{
margin-left: 17vw;
margin-top:40px;
font-size:70px;
}

#menu_style .big_title span{
  color:black;
  font-family: "league-gothic", 'Oswald', sans-serif;
}

/*menu lateral styleguides*/
#menu_lateral{
  position: absolute;
  min-height: calc(100vh - 160px);
  margin-top: 30px;
  width: 200px;
  padding: 30px;
  z-index: 800;
  background-color: rgb(235, 241, 236);
  left: -10vw;
  box-shadow: 5px 5px 5px rgba(40,40,40,0.08);
}

#menu_lateral p{
  display: block;
  padding-bottom:7px;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top:30px;
}

#menu_lateral a{
  display: block;
  font-size:14px;
  padding-bottom:5px;
  margin-left: 0px;
  font-weight: 300;
  transition: all 0.3s ease;
}

#menu_lateral a:hover{
  text-decoration: underline;
  color:darkgrey;
  margin-left:5px !important;
  transition: all 0.3s ease;
}

/*descriptions*/
.text_style{
  font-size: 14px;
  line-height: 1.5;
}

/*mixed grids - icons to show in columns*/
.mixed_grid{
  width:12.111vw;
  display: inline-block;
  margin-left:1.465vw;
  transition: all 0.1s ease;
}

.mixed_grid:hover{
  opacity: 0.4;
  transition: all 0.1s ease;
  cursor:help;
}
.mixed_grid:first-of-type{
  margin-left: 0px;
}

/* columns grid */
#colms{
  z-index: 500;
  width: 100vw;
  margin-left: -17vw;
  margin-top:40px;
  margin-bottom:60px;
}

/*  SECTIONS - columns grid  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
  width: 80vw;
  margin-left: 10vw;
  margin-bottom:10px;
  background-color: rgb(235, 241, 236);
  border-radius: 1.5px;
}

.col {
	display: block;
	float:left;
	margin: 1.465vw 0 1.465vw 1.465vw;
}

.col_styling{
  height:40px;
  text-align: center;
  color: white;
  transition: all 0.1s ease;
  border-radius: 1.5px;
}

.col:first-child, .col_:first-child { margin-left: 0; }

.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF TWELVE  */
.col12 {
	width: 80vw;
}

.col11 {
  	width: 73.203vw;
}

.col10 {
  	width: 66.415vw;
}

.col9 {
  	width: 59.627vw;
}

.col8 {
  	width: 52.839vw;
}

.col7 {
  	width: 46.051vw;
}

.col6 {
  	width: 39.263vw;
}

.col5 {
  	width: 32.475vw;
}

.col4 {
  	width: 25.687vw;
}

.col3 {
  	width: 18.899vw;
}

.col2 {
  	width: 12.111vw;
}

.col1 {
  	width: 5.323vw;
}

/* para colunas que não estão em uso
#area_page_columns2{
  width:80vw;
  height:auto !important;
  position: absolute;
  top: 0px;
}
#area_page_columns2 .columns{
  opacity: 1;
}
*/

.hide{
  display: none;
}

/* mixed columns */
.section2 {
  clear: both;
  position: absolute;
  padding: 0px;
  top:449px;
  width: 80vw;
  opacity:0.8;
  margin-left: 10vw;
  margin-bottom: 10px;
}

.col_ {
	display: block;
	float:left;
	margin: 1.465vw 0 1.465vw 1.465vw;
  height:410px;
  text-align: center;
  background-color: white;
  transition: all 0.1s ease;
  border-radius: 1.5px;
}

.col_ p{
  font-size: 22px;
  font-weight: 500;
  margin-top: 70px;
}

/*colors*/

#id_pallette{
  width:800px;
}

.cor_code{
  width:140px;
  height:180px;
  margin-right: 12px;
  margin-bottom: 40px;
  position: relative;
  display: inline-block;
  box-shadow: -5px -5px 15px rgba(40,40,40,0.08);
}

.cor_code2{
  width:140px;
  height:265px;
  margin-right: 12px;
  margin-bottom: 40px;
  position: relative;
  display: inline-block;
  box-shadow: -5px -5px 15px rgba(40,40,40,0.08);
}

.cor_pal_cor{
  width:140px;
  height:80px;
  padding: 5px;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background-color: white;
}

.cor_pal{
  width:140px;
  height:calc(180px - (126px/2));
  padding: 10px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  background-color: white;
}

.cor_pal2{
  width:140px;
  height:calc(265px - (126px/2));
  padding: 10px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  background-color: white;
}

.cor_pal p, .cor_pal2 p{
  margin-bottom:-6px;
  text-align: left;
}

.cor_pal p span,.cor_pal2 span{
  font-size:10px;
  text-transform: uppercase;
  color:grey;
  font-weight: 500;
  padding-right:5px;
}

.cor_pal2 #cl{
  text-transform: none;
  padding: 0px;
  font-size:10px;
  color:lightgrey;
  font-weight: 500;
}


.font_sample{
  background-color: white;
  border-radius: 1.5px;
  height:140px;
  overflow: hidden;
  padding: 30px;
}

.font_league h1,.font_league p {
  font-family: "league-gothic", 'Oswald', sans-serif;
}
.font_sample h1{
  margin-top: -20px;
  float:left;
  display: inline-block;
  font-size: 100px;
}

.font_league p{
  float:left;
  margin-top: 20px;
  margin-left: 75px;
  display: inline-block;
  font-size:25px;
}

.font_museo p{
  float:left;
  margin-top: 25px;
  margin-left:30px;
  display: inline-block;
  font-size:14px;
}

.legend{
  font-weight: 500;
  color: grey;
  text-transform: uppercase;
  font-size: 9px;
  letter-spacing:0.5px;
}

/*Gallery plugin*/
.demo-gallery{
  width:100%;
  height: auto;
  position: relative;
  display: block;
}

.demo-gallery > ul {
  margin-bottom: 0;
  margin: 0px;
  padding: 0px;
}
.demo-gallery > ul > li {
    display: inline-block;
    margin-bottom: 2px;
    margin-right: 2px;
    height:140px;
    width:205px;
}
.demo-gallery > ul > li a {
  overflow: hidden;
  position: relative;
  display: inline-block;
  width:100%;
  height: 100%;
  background-color: black;
}
.demo-gallery > ul > li a > div {
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: all 0.15s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
  width:100%;
  height: 100%;
}
.demo-gallery > ul > li a:hover > div, .img-thumb:hover {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
  opacity: 0.5;
}
.demo-gallery > ul > li a:hover .demo-gallery-poster > img {
  opacity: 1;
}
.demo-gallery > ul > li a .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.1);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: background-color 0.15s ease 0s;
  -o-transition: background-color 0.15s ease 0s;
  transition: background-color 0.15s ease 0s;
}
.demo-gallery > ul > li a .demo-gallery-poster > img {
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transition: opacity 0.3s ease 0s;
  -o-transition: opacity 0.3s ease 0s;
  transition: opacity 0.3s ease 0s;
}
.demo-gallery > ul > li a:hover .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.5);
}
.demo-gallery .justified-gallery > a > img {
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: transform 0.15s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  height: 100%;
  width: 100%;
}
.demo-gallery .justified-gallery > a:hover > img {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
}
.demo-gallery .justified-gallery > a:hover .demo-gallery-poster > img {
  opacity: 1;
}
.demo-gallery .justified-gallery > a .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.1);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: background-color 0.15s ease 0s;
  -o-transition: background-color 0.15s ease 0s;
  transition: background-color 0.15s ease 0s;
}
.demo-gallery .justified-gallery > a .demo-gallery-poster > img {
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transition: opacity 0.3s ease 0s;
  -o-transition: opacity 0.3s ease 0s;
  transition: opacity 0.3s ease 0s;
}
.demo-gallery .justified-gallery > a:hover .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.5);
}
.demo-gallery .video .demo-gallery-poster img {
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
  opacity: 0.8;
  width: 48px;
}
.demo-gallery.dark > ul > li a {
  border: 3px solid #04070a;
}
.home .demo-gallery {
  padding-bottom: 80px;
}


/*Slideshow plugin*/
ul{
list-style: none outside none;
  padding-left: 0;
      margin: 0;
}
  .demo .item{
      margin-bottom: 60px;
  }
.content-slider li{
  background-color: #ed3020;
  text-align: center;
  color: #FFF;
}
.lslide img{
  width:100% !important;
}
.content-slider h3 {
  margin: 0;
  padding: 70px 0;
}
.demo{
width: 100%;
}

.item{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.img-a-thumb{
  width: 194px;
  height: 120px;
  overflow: hidden;
  position: relative;
  display: inline-block;
  background-color: black;
}

.img-thumb{
  width:100%;
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: transform 0.15s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}

.icon_play {
  position: absolute !important;
  z-index: 900 !important;
  width: 50px !important;
  height: 50px !important;
  left: calc(50% - 25px) !important;
  top: calc(50% - 25px) !important;
}