/* STEP[#003]: Define WIDGET FRAMES */

.widjet {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    padding: 0px;
    overflow: hidden;
    display: none;
    text-shadow: 0 0 10px rgba(68, 68, 68, 1), 0 0 20px rgba(10, 175, 230, 0);
    z-index: 2;
}

.widjet .top {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100px;
    /* background-color: rgba(0, 0, 0, 0.5); */
    /* filter: drop-shadow(0 0px 5px rgba(0, 0, 0, 1)); */
    padding: 0px;
    display: none;
}


/* SETP[#003-1]: Hotel Logo */

.widjet .top .hotellogo {
    position: absolute;
    width: 300px;
    height: 80px;
    background-image: none;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    margin: 10px 0 4px 20px;
    display: block;
}


/* SETP[#003-2]: Message */

.widjet .top .message {
    position: absolute;
    top: -11px;
    left: 1618px;
    height: 100px;
    /* float: left; */
    display: block;
    padding: 24px 10px 10px 10px;
}

.widjet .top .message #unread_cnt {
    /* position: relative; */
    width: 66px;
    height: 100%;
    float: left;
    background-image: url(images/icons/icon_widjet_top_message_cnt.png);
    background-size: contain;
    background-repeat: no-repeat;
    padding: 4px 0px 0px 0px;
    vertical-align: middle;
    color: rgb(235, 235, 235);
    font-size: 46px;
    line-height: 52px;
    text-align: center;
}


/* SETP[#003-3]: Weather */

.widjet .top .weather {
    position: absolute;
    top: -11px;
    left: 1370px;
    height: 100px;
    float: left;
    background-image: none;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    margin: 7px 0px 0px 0px;
}

.widjet .top .weather #icon {
    position: relative;
    /* top: -10px; */
    left: 16px;
    width: 100px;
    height: 100%;
    float: left;
    background-image: none;
    background-size: contain;
    background-repeat: no-repeat;
    justify-content: center;
    display: flex;
    align-items: center;
    filter: drop-shadow(0 0px 5px rgba(0, 0, 0, 0.5));
}

.widjet .top .weather #temp {
    position: relative;
    left: 14px;
    float: left;
    font-size: 60px;
    line-height: 100px;
    vertical-align: middle;
    color: rgb(235, 235, 235);
}


/* SETP[#003-4]: Date&Time */

.widjet .top .datetime {
    position: absolute;
    left: 1630px;
    width: 270px;
    height: 60px;
    margin: 10px 30px 10px 0;
    color: rgb(235, 235, 235);
}

.widjet .top .datetime p {
    margin: 0;
    padding: 0;
}

.widjet .top .datetime .time {
    font-size: 52px;
    line-height: 52px;
    padding: 5px 0;
    text-align: right;
    /* -webkit-text-stroke: 1px rgb(64,64,64); */
}

.widjet .top .datetime .date {
    letter-spacing: 0.1em;
    font-size: 24px;
    line-height: 24px;
    text-align: right;
}