/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #eee; 
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #b30000; 
}

.whatsapp {
    position: fixed; bottom: 30px; right: 30px;
    -webkit-filter: drop-shadow(2px 2px 5px #aaa);
    filter: drop-shadow(2px 2px 5px #aaa);
    opacity: .5;
}
.whatsapp:hover {
    -webkit-filter: drop-shadow(2px 2px 5px #ddd);
    filter: drop-shadow(2px 2px 5px #ddd);
    animation: pulse; /* referring directly to the animation's @keyframe declaration */
    animation-duration: .5s; /* don't forget to set a duration! */
    opacity: 1;
}
.whatsapp a:hover {text-decoration: none;}
.header {
    position:relative; z-index: 90;
    box-shadow: 2px 2px 20px rgba(0,0,0,.5);
    
}
.logo {
    height: 80px;
}
.search-container {
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 200px;
    height: 40px;
}
.search-input {
    position: absolute;
    width: 200px;
    border-radius: 20px;
}
.luv-button {
    position: absolute;
    margin-left: 160px;
    margin-top: 5px;
    background: #fff;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
}
.menu-button {
    display: inline-block;
    margin-top: 10px;
    width: 150px; 
    font-size: 16pt;
    padding: 10px;
    transition: all .2s linear;
    cursor: pointer;
}
.menu-button img {vertical-align: middle; margin-top: -5px;}
.menu-button:hover {
    text-shadow: 2px 2px 20px #0c7c7d;
}
.artikel {
    margin-bottom: 0px; 
    font-size: 14pt;
    overflow-y: auto;
    color: #0c7c7d;
    text-align: left;
}
.icon-container {
    position: absolute;
    bottom: 20px;
    left: 20px;
}
.icon-button {
    width: 80px;
    color: #0c7c7d;
    display: inline-block;
    text-align: center;
    font-size: 8pt;
    font-weight: bold;
}
.icon-button a:hover {text-decoration: none}
.circle-icon {
    cursor: pointer;
    display: inline-block;
    background: #0c7c7d;
    width: 60px;
    height: 60px;
    text-align: center;
    padding-top: 10px;
    border-radius: 100%;
    margin-bottom: 5px;
    box-shadow: 2px 2px 5px #aaa,  -2px -2px 20px rgba(0,0,0,.4) inset,
        2px 5px 5px rgba(255,255,255, 1) inset;
    transition: all .2s linear;
}
.circle-icon img {
    height: 40px;
}
.circle-icon:hover {
    animation: rubberBand;
    animation-duration: 1s;
    background: #ff8c00;    
}
.frame {
    z-index: -9;
    position: relative;
}
.frame img {width: 100%; box-shadow: 0 15px 10px -15px rgba(50,50,50,.1);}
.slideshow {
    width: 100%;
    position: absolute;
    z-index: -20;
    top: 0;
}
.slideshow-button {
    display: none;
    position: absolute;
    z-index: 99;
    bottom: 200px; right: 20%;
    box-shadow: 2px 2px 5px #555;
    transition: background .2s linear;
}
.footer {
}
.medsos{
    display: inline-block;
    cursor: pointer;
    margin-right: 15px;
}
.company-name{
    text-align: center;
}

.lang-btn {
    position: absolute;
    right: 0;
    bottom: -30px;
    padding: 5px 10px;
    font-size: 10pt;
    opacity: .5;
    cursor: pointer;
}
.lang-btn:hover { 
    opacity: 1;
}

.gallery-box {
    background: rgba(200,200,200,.2); margin: 10px 0px;
    padding: 12px;
    transition: all .2s ease-in;
    cursor: pointer;
    min-height: 150px;
    border-radius: 0 15px 15px 15px;
}

.gallery-box:hover {
    background: #a4d7d2;
}

.gallery-box .image {
    border-radius: 0 5px 5px 5px;
    width: 120px; height: 120px; background: #aaa; vertical-align: top;
    box-shadow: 2px 2px 4px rgba(0,0,0,.2) inset;
    position: inherit;
    margin: 5px 15px;
}

.gallery-box .text-box {
    padding: 0 15px;
}