/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : May 13, 2020, 10:22:36 AM
    Author     : dininurhayati
*/
.padding-floor-1{
    padding: 0 3em!important;
}
.margin-floor-top{
    margin-top: 2em;
}
.margin-floor-room{
    margin: 3em auto;
}
.guidance-floor {
    padding: .5em;
    line-height: 1.5em;
}
.guidance-floor .octagonal {
    width: 45px;
    height: 45px;
    background-color: #8ec320;
    padding: 13px 11px;
    -webkit-clip-path: polygon(45% 0, 55% 0, 100% 45%, 100% 55%, 55% 100%, 45% 100%, 0 55%, 0 45%);
    clip-path: polygon(45% 0, 55% 0, 100% 45%, 100% 55%, 55% 100%, 45% 100%, 0 55%, 0 45%);
    color: white;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: normal;
}
.guidance-floor .octagonal.green {
    display: inline-block;
}
.guidance-floor .octagonal.yellow{
    display: inline-block;
    background-color: #d6c027;
}
.guidance-floor .octagonal.orange{
    display: inline-block;
    background-color: #ed6d00;
}
.guidance-floor .octagonal.blue{
    display: inline-block;
    background-color: #009fb9;
}
.guidance-floor h5 {
    border-bottom: 1px dashed #c0bcba;
    padding-bottom: 1em;
    margin-bottom: 1em;
    color: #4f4e4e;
    font-weight: 700;
    letter-spacing: normal;
}
.guidance-floor h5.no-border-btm{
    border-bottom: none;
}
.guidance-floor p {
    font-size: 13px;
    color: #4f4e4e;
    padding: 0 1em;
    text-align: left;
    font-weight: normal;
    letter-spacing: normal;
}
.guidance-floor span {
    margin-right: .5em;
    font-size: 14px;
}
.floor-maps {
    margin: 2em 0 3em;
}
.floor-maps .hz-line {
    border-bottom: 1px solid #e0dad7;
    display: block;
}
.head .title {
    text-align: center;
}
.head .title h4 {
    font-size: 24px;
}
.head .title h4.btm {
    font-size: 16px;
}
.head .sub-ttl h4.btm{
    color: #717272;
    text-align: center;
    font-size: 20px;
}

@media screen and (max-width: 768px) {

    .margin-floor-top {
        margin-top: 1em;
    }
    .margin-floor-room {
        margin: 2em auto;
    }
    .floor-maps {
        margin: 1em 0 2em;
    }
    .head .title h4 {
        font-size: 20px;
    }
    .head .title h4.btm {
        font-size: 14px;
    }
    .head .sub-ttl h4.btm {
        font-size: 18px;
    }
    .guidance-floor .octagonal {
        width: 33px;
        height: 33px;
        padding: 10px 9px;
        font-size: 13px;
    }
    .guidance-floor p{
        padding: 0;
        font-size: 12px;
    }
    .guidance-floor h5{
        font-size: 11px;
    }
}

@media screen and (max-width: 40.063em) {
    .guidance-floor p{
        padding: 0 1em;
        font-size: 14px;
    }
    .guidance-floor h5{
        font-size: 14px;
    }
    .guidance-floor .octagonal {
        width: 45px;
        height: 45px;
        padding: 13px 13px;
        font-size: 16px;
    }
}