/* ---------------------- 
Stylesheet Guide
-------------------------

FONTS
GENERAL STYLES
MAIN MENU
SUBMENU DROPDOWN
PAGE STRUCTURE
ICON CONTAINERS
OUR TEAM
OUR MENU
EVENTS
GALLERY
BLOG
COMMENTS
FOOTER
SOCIAL ICONS
CONTACT
FORMS
RESPONSIVE IFRAME
FLEX IMAGE
INFO BOXES
TABS
ACCORDION


*/

/* ================= FONTS ================== */


body,p, .info .desc, h1,h2,h3,h4,h5,h6,.site-nav ul li a,.ns_nerveSlider .ns_caption,#lightGallery-slider .info .title,{
    font-family: 'Alegreya Sans', sans-serif;
    font-weight: normal;
    font-style: normal;  
}
.page-title h1,.page-title h2{
    font-family: 'Alegreya Sans', sans-serif;
    font-weight: normal;
    font-style: normal;
}

/* ================= GENERAL STYLES ================== */

html,
body {
    margin: 0px;
    padding: 0px;
}
body {
    font-size: 20px;
    background-color: transparent;
    -webkit-overflow-scrolling: touch;
    overflow: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    line-height: 1;
    margin-top: 0px;
    margin-bottom: 20px;
    padding: 0px;
}
h1 {     font-size: 52px; }
h2 {     font-size: 44px;   }
h3 {      font-size: 32px;  }
h4, summary {     font-size: 28px;  }
h5 {     font-size: 24px; }
h6 {      font-size: 22px; }

.show {
    display: block !important;
}
.hide {
    display: none !important;
}
.clear,.clr {     clear: both;  }
strong {      font-weight: bold;  }
i,   em {        font-style: italic; }

hr {
    margin-top: 39px;
    margin-bottom: 39px;
    padding: 0;
    border: none;
    height: 1px;
}
hr.container-hr {
    margin-top: 14px;
}
.pagecontent a {    text-decoration: none;  }
.pagecontent ul  {     list-style-type: none;  }
.pagecontent a:hover {    text-decoration: underline; }
/* ================= MAIN MENU  ================== */
.logo {     position: relative;   color: white;}
.logo img {
    height: auto;
    width: 100%;
    vertical-align: bottom;
    display: inline-block;
}
.left-bar {
    position: fixed;
    width: 230px;
    height: 100%;
    right: 80%;
    left:auto;
    top: 0px;
    z-index: 99;
    overflow: auto;
}
#mobile-menu-icon {
    position:absolute;
    left:0px;
    top:0px;
    width: 75px;
    height:75px;
    background-image: url('../web_pics/menu75.png');
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 9;
    cursor: pointer;
    display: none;
}
#mobile-close-icon {
    position:absolute;
    left:0px;
    top:0px;
    width: 100%;
    height: 58px;
    background-image: url('../web_pics/close.png');
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 9;
    cursor: pointer;
    display: none;
}
.site-nav ul {
    margin: 0px;
    padding: 0px;
    text-align: left;      
}
.site-nav ul li {
    margin-bottom: 5px;
}
.site-nav ul li a {
    position: relative;
    display: inline-block;
    margin: 0px;
    outline: none;
    text-decoration: none;
    font-size: 22px;
    font-family: Alegreya Sans SC;
    font-weight: normal;
    width: 100%;
    padding: 10px;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;   
}
.site-nav ul li a:hover,
.site-nav ul li a:focus {
    outline: none; color:#fff; 
}
.site-nav ul li a::before,
.site-nav ul li a::after {
    position: absolute;
    left: 0;    color:#fff; 
    width: 100%;
    height: 1px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    -moz-transition: opacity 0.3s, -moz-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);    
}
.site-nav ul li a::before {
    top: 0;     color:#fff; 
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);     
}
.site-nav ul li a::after {
    bottom: 0;   color:#fff; 
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);     
}
.site-nav > ul > li > a:hover::before,
.site-nav > ul > li > a:focus::before,
.site-nav > ul > li > a:hover::after,
.site-nav > ul > li > a:focus::after,
.site-nav > ul > li.selected-menu-item > a::before,
.site-nav > ul > li.selected-menu-item > a::after{
    opacity: 1;      color:#fff; 
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);     
}
/* ================= SUBMENU DROPDOWN ================== */
#submenu {
    margin: 0px 0px 10px 0px; 
    box-shadow: 0 4px 5px rgba(218, 214, 214, 0.3);  /* space around the sub menu*/
}
#submenu ul ul {
    display: none;
    padding-top: 10px;
}
#submenu ul ul li a {
    padding: 0px 10px 15px 50px;     /* inside the sub menu , top/right/bot/left */
    font-size:18px;
    text-transform:none;
}
 
#submenu ul ul li {
    margin-bottom: 0px;
}
#submenu ul > li > a.has-sub,#submenu ul > li > a.has-sub2 {
    background-position: 95% center;
    background-repeat:no-repeat;
    padding-left: 10px;
    padding-right: 30px;
}
#submenu ul > li > a.has-sub {
    background-image: url('../web_pics/downArrow.png');
}
#submenu ul > li > a.has-sub2 {
    background-image: url('../web_pics/upArrow.png');
}
/* ================= PAGE STRUCTURE ================== */
#site-loading-left,#site-loading-right{
	position:fixed;
	top:0;
	margin:0px;
    height:100%;
	z-index:99999999999;
    background-position: center center;
    background-repeat: no-repeat;
}
#site-loading-left {
    width:25%;
    left: 0;
   // background-image: url(../images/loading3.gif);
}
#site-loading-right {
    width:75%;
    right: 0;
    background-image: url(http://www.stilts.hk/wordpress/wp-content/uploads/2015/10/logo_hen2.png);
}
.left-slider {
    width: 20%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1;
    overflow: hidden;     
}
.left-slider img{object-fit: cover;height: 100%; width: 100%;}

.floor {
    padding-left: 20%;
}
#ascensorBuilding {
     display: block !important;
}
.pagecontent {
    padding: 0px 40px 20px 40px;
    height:auto;
}
@media only screen and (max-width:1100px){ .pagecontent {padding: 0px; } }


.page-title h1,.page-title h2 {
    margin: 0px;
    padding: 5px;
    text-align: center;
    font-size: 45px;
}
.opening-hours {
    padding: 10px;
    text-align: center;
    font-size: 22px;
}
/* ================= ICON CONTAINERS  ================== */

/* ================= SOCIAL ICONS ================== */
.social-container {
    width: 100%;
    position: relative;
}
.social-icons {
    list-style-type: none;
    margin: 0px auto;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: table;
    padding: 0px;
    float:left;
    
}
.social-icons li {
    float: left;
    display: inline-block;
    margin: 5px 2px 5px 2px;
    padding: 0px; padding-left:5px; -webkit-transform: rotate(0deg);
        -webkit-transition: -webkit-transform 0.25s ease-in-out;
}
.social-icons li img {
    width: 30px;
    height: auto;
    vertical-align: bottom;
}
.social-icon {
    padding: 5px;
}


.social-icons li:hover
      {    -webkit-transform: rotate(360deg);
           -webkit-transition: -webkit-transform 0.25s ease-in-out;} 
 .nav ul {list-style: none;padding: 0;outline: none;}          
           
      
.nav{   background-color: rgba(15, 15, 15, 0.7);width: 230px; font-family: Alegreya Sans SC;list-style: none;}
.nav a, .nav label {
  display: block;
  margin: 0px 0px 8px 0px;
  color: #fff;
  box-shadow: 0 4px 5px rgba(218, 214, 214, 0.3);
  -webkit-transition: all .25s ease-in;
  transition: all .25s ease-in;
  text-decoration: none;
  border-bottom: 1px solid #000;
    border-top: 1px solid #000;
}
.nav label:focus, .nav label:hover {
border-bottom: 1px solid red; border-top: 1px solid red;
    text-decoration: none;
 -webkit-transition: all .25s ease-in;
 transition: all .25s ease-in; 

}

.nav a:focus, .nav a:hover, .nav label:focus, .nav label:hover {
outline: none;
  color: #ff1a1a;
  background: #030303;
 }
.other_links{padding:10px 0px 10px 0px;box-shadow:none;}
.nav label { cursor: pointer; padding: 10px;}
.group-list a, .group-list label {      padding: 0px 10px 15px 50px;     box-shadow: none;  font-size:18px;}
.group-list a:focus, .group-list a:hover, .group-list label:focus, .group-list label:hover { background: #131313; }

.group-list {
  height: 100%;
  max-height: 0;
  overflow: auto;
  -webkit-transition: max-height .5s ease-in-out;
  transition: max-height .5s ease-in-out;
}

.nav__list input[type=checkbox]:checked + label + ul { /* reset the height when checkbox is checked */
max-height: 1000px; }

/** * Rotating chevron icon */
                                        
label > span {
  float: right;
  -webkit-transition: -webkit-transform .65s ease;
  transition: transform .65s ease;
}

.nav__list input[type=checkbox]:checked + label > span {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}