/**
 * Place your custom styles here.
 */
 /**
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
body {
  font-family: 'Lato', Helvetica, sans-serif;
  
   
text-align: justify;
font-weight: 400;
letter-spacing: 0.5px;
text-transform: none;
}


 * body {
 * background-color: lightblue;
 * }
 */
 
 body {
    color: #333333 !important;
    font-size: medium !important;
}

 ul.nav li.dropdown:hover > ul.dropdown-menu {
    display: block;
}


   .path-frontpage .region-header{
        display: none !important;
    }
    .path-frontpage .navbar{
        margin-bottom: 0px !important;
    }
    .navbar-default {
     background-color: #ffffff;  
     border-color: #ffffff;   
}


.embed-container { 
    position: relative; 
    padding-bottom: 56.25%; 
    height: 0; 
    overflow: hidden; 
    max-width: 100%; 
    
} 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    
}

.material-icons.md-light { color: rgba(255, 255, 255, 1); }
    
    #vimeo_volume_off, #vimeo_volume_up {
        position: absolute;
        top: -10px !important;
        right: 5px !important;
    }
    
    #vimeo_fullscreen {
        position: absolute;
        bottom: 25px !important;
        right: 5px !important;
    }
    
    #vimeocontainer {
        position: relative;
        padding-bottom: 56.25%;
        height: 0;
        overflow: hidden; 
        max-width: 100%;
      /* border: 3px solid #ff0000;  */
    }
    #vimeonavi{
        position: absolute; 
      width: 100%;
      height: 100%;


      /* border: 3px solid #73AD21;    */
      z-index: 10;
    }
    #vimeovideo{
        position: absolute; 
    /*    border: 3px solid #0000ff; */
        width: 100%;
      height: 100%;
    }
    #vimeocontainer iframe, #vimeocontainer object, #vimeocontainer embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.field--name-field-kuvat {
  display: inline-block;
  width: 100%;
  margin: 15px 15px 15px 15px;
}

.field--name-field-image {
  margin-top: -5px !important;
}

.img-responsive:hover {
  opacity: 0.7;
  }


.field--name-field-tapahtuman-logo {
  float: left;
  margin: 15px 45px 15px 15px;
 /* @extends .col-sm-4;  */
  }
  
.field--name-field-image {
  float: left;
  margin: 15px 45px 15px 15px; 
  }
  
.field--name-body img {
  margin: 5px 15px 15px 15px !important;
  }
  
.teaser .field--name-body img {
  margin: 15px 45px 15px 15px !important;
  }
  
.img-responsive {
  float: left;
  margin: 5px 5px 5px 5px;
  }
  
.fa-envelope {
  left: 5px;
  bottom: 180px;
  position: fixed;
  }
/* 
.fa-google-plus {
  left: 5px;
  bottom: 140px;
  position: fixed;
  }

.fa-twitter {
  left: 5px;
  bottom: 180px;
  position: fixed;
  }
*/
.fa-facebook {
  left: 5px;
  bottom: 220px;
  position: fixed;
  }

.fa-instagram {
  left: 5px;
  bottom: 260px;
  position: fixed;
  }
  
a {
  color: #303030;
 }
  
a:hover {
  color: #707070;
  }
  
a:hover {
  text-decoration: none;
}

.is-promoted, .teaser {
  /* border: 2px solid #f0f0f0; */
  /*  border-radius: 5px; */
  padding-top: 15px;
  padding-bottom: 15px;
  padding-right: 5px;
  padding-left: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 5px;
  margin-left: 5px;
  }
  
.btn-primary {
  color: #0f0f0f;
  background-color: #d0d0d0;
  border-color: #d0d0d0;
  margin-top: 5px;
  margin-bottom: 5px;
 }
 
.btn-primary:hover {
  color: #0f0f0f;
  background-color: #e0e0e0;
  border-color: #d0d0d0;
  }

a.a2a_dd {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
a.a2a_button_facebook {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
a.a2a_button_twitter {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}
a.a2a_button_google_plus {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.kuva-tuote-ryhmaX {
  display: inline-block  !important;
  border-radius: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 5px;
  padding-left: 5px;
  }
.kuva-tuote-100 {
  display: inline-block  !important;
  border-radius: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 5px;
  padding-left: 5px;
  }

.kuva-tuote-ryhma img {
  border-radius: 5px;
  }

.catalog-views-colX { 
  position: relative !important;

}

.kuva-yhteenveto {
    margin:15px 45px 15px 15px !important;
    
}

.catalog-view-col-nameX {
  position: absolute !important;
   color: green !important; 
  font-size: 18px !important;
   letter-spacing: -1px !important;  
   background: rgb(255, 255, 255) !important; /* fallback color */
   background: rgba(255, 255,255, 0.7) !important;
   padding: 10px !important; 
   border-radius: 5px !important;
   /* left: 10px;
  top: 180px; */
  top: 50% !important;
  left: 50% !important;  
  transform: translate(-50%, -50%) !important;

}

.catalog-views-col {
    position: relative;
    text-align: center;
    color: white;
    }
    
.views-field-uc-catalog-image {
    width:100%;
}
    
.views-field-name {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}
.map-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
    border:20px;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:90%;
    width:90%;
    position:absolute;
}
@media screen and (max-width:767px){
    body {
      padding-left: 0px !important;
	  /* font-size: small !important; */

    }
    .view-frontpage {
        flex-basis: 100%;
    }
    .view-frontpage .field--name-field-image {
        width: 100%;
        margin-left: 0px;
        margin-right: 0px;

    }
    
    .view-frontpage .field--name-field-image img {

        margin-left: 10% !important;
        margin-right: auto !important;
    }
    .region-highlighted{
        margin-left: -15px !important;
        margin-right: -15px !important;

    }
    .region-header{
        display: none !important;
    }
    .navbar{
        margin-bottom: 0px !important;
    }
}