/* It is recommended to place all your extra/additional CSS rules here */

#safetyadvise ul li {
  text-align: right;
  line-height: 1.6em;
}

#languagemenu {
  width: 30%;
  position: absolute;
  top: 38px;
  right: 30px;
  text-align: right;
  z-index: 100;
}

#languagemenu .langchoice {
  float: right;
  padding: 3px;
  border: 1px solid #ddd;
  margin-left: 6px;
  border-radius: 0px;
}


.langchoice a:visited.active {
  color: #333 !important;
}

.tab-pane img {
    float: left;
    margin: 0 12px 0 0;
    border-radius: 0px;
}

#floorcovering img { max-height: 600px; width: 100%; margin-bottom: 3px; }

.referenceclient {
  float: left;
  width: 45%;
  padding: 1%;
  border-bottom: 1px solid #444;
}

.cbp-l-filters-button .cbp-filter-item {
    background-color: none;
    color: #FFF;
    cursor: pointer;
    overflow: visible;
    padding: 12px;
    position: relative;
    display: inline-block;
    -webkit-transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
    transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
}

.hide-desktop { display: none }
.show-desktop { display: block }

.responsive-img { width: 100%; }


/* mobile portrait */

@media only screen and (max-device-width : 320px) {

  .responsive-img { width: 100%; }
  .hide-phone { display: none }
  .show-phone { display: block }

}

/* mobile  */

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {

  #mobile-menu-icon {
    width: 20%;
    top: 60px;
    position: absolute;
    right: 0px;
  }

  .logo { width: 50%; background: rgba(0,0,0,0) !important; margin-top: 3px;}
  .introtext img {max-width: 50%; height: auto;}
  div[class^="col-"] {
    text-align: center !important;
  }
  .text-right, li {
    text-align: center !important;
  }

  .tab-pane img {
      float: none;
      margin: 12px;
      border-radius: 0px;
  }

  #languagemenu {
    top: 12px;
  }

  #languagemenu .langchoice {
    float: right;
    padding: 3px;
    border: none;
    margin-left: 6px;
    border-radius: 0px;
  }

  .responsive-img { width: 100%; margin-bottom: 12px; }
  .hide-phone { display: none }
  .show-phone { display: block }

}


/* tablet */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

  #references {
    max-width: 90%;
    margin-left: 10%;
  }

  .hide-tablet { display: none }
  .show-tablet { display: block }

  .responsive-img { width: 100%; margin-bottom: 12px! important; }

}