@import url(https://fonts.googleapis.com/css?family=Open+Sans:700);

.blackscreen {
    background: rgba(161, 163, 163, 0.50); 
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1500;
}
.loader_popup {
            width: 97px;
            height: 19px;
            position: fixed;
            z-index:99999;
            top:50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
        }

            .loader_popup > div {
                content: " ";
                width: 19px;
                height: 19px;
                background: rgb(33,150,243);
                border-radius: 100%;
                position: absolute;
                animation: cssload-shift 2.3s linear infinite;
                -o-animation: cssload-shift 2.3s linear infinite;
                -ms-animation: cssload-shift 2.3s linear infinite;
                -webkit-animation: cssload-shift 2.3s linear infinite;
                -moz-animation: cssload-shift 2.3s linear infinite;
            }

                .loader_popup > div:nth-of-type(1) {
                    animation-delay: -0.46s;
                    -o-animation-delay: -0.46s;
                    -ms-animation-delay: -0.46s;
                    -webkit-animation-delay: -0.46s;
                    -moz-animation-delay: -0.46s;
                }

                .loader_popup > div:nth-of-type(2) {
                    animation-delay: -0.92s;
                    -o-animation-delay: -0.92s;
                    -ms-animation-delay: -0.92s;
                    -webkit-animation-delay: -0.92s;
                    -moz-animation-delay: -0.92s;
                }

                .loader_popup > div:nth-of-type(3) {
                    animation-delay: -1.38s;
                    -o-animation-delay: -1.38s;
                    -ms-animation-delay: -1.38s;
                    -webkit-animation-delay: -1.38s;
                    -moz-animation-delay: -1.38s;
                }

                .loader_popup > div:nth-of-type(4) {
                    animation-delay: -1.84s;
                    -o-animation-delay: -1.84s;
                    -ms-animation-delay: -1.84s;
                    -webkit-animation-delay: -1.84s;
                    -moz-animation-delay: -1.84s;
                }



       @keyframes cssload-shift {
            0% {
                left: -58px;
                opacity: 0;
                background-color: rgb(255,255,0);
            }

            10% {
                left: 0;
                opacity: 2;
            }

            90% {
                left: 97px;
                opacity: 3;
            }

            100% {
                left: 156px;
                background-color: rgb(255,0,0);
                opacity: 0;
            }
        }

        @-o-keyframes cssload-shift {
            0% {
                left: -58px;
                opacity: 0;
                background-color: rgb(255,255,0);
            }

            10% {
                left: 0;
                opacity: 2;
            }

            90% {
                left: 97px;
                opacity: 3;
            }

            100% {
                left: 156px;
                background-color: rgb(255,0,0);
                opacity: 0;
            }
        }

        @-ms-keyframes cssload-shift {
            0% {
                left: -58px;
                opacity: 0;
                background-color: rgb(255,255,0);
            }

            10% {
                left: 0;
                opacity: 1;
            }

            90% {
                left: 97px;
                opacity: 1;
            }

            100% {
                left: 156px;
                background-color: rgb(255,0,0);
                opacity: 0;
            }
        }

        @-webkit-keyframes cssload-shift {
            0% {
                left: -58px;
                opacity: 0;
                background-color: rgb(255,255,0);
            }

            10% {
                left: 0;
                opacity: 1;
            }

            90% {
                left: 97px;
                opacity: 1;
            }

            100% {
                left: 156px;
                background-color: rgb(255,0,0);
                opacity: 0;
            }
        }

        @-moz-keyframes cssload-shift {
            0% {
                left: -58px;
                opacity: 0;
                background-color: rgb(255,255,0);
            }

            10% {
                left: 0;
                opacity: 1;
            }

            90% {
                left: 97px;
                opacity: 1;
            }

            100% {
                left: 156px;
                background-color: rgb(255,0,0);
                opacity: 0;
            }
        }

.cssload-container * {
	color: rgb(0,0,0);
	font-size: 33px;
	font-weight: 700;
	font-family: 'Open Sans', sans-serif;
}
.cssload-container {
	position: absolute;
	width: 117px;
	height: 49px;
	left: 50%;
	transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
}
.cssload-container > div {
	position: absolute;
	transform-origin: center;
		-o-transform-origin: center;
		-ms-transform-origin: center;
		-webkit-transform-origin: center;
		-moz-transform-origin: center;
}
.cssload-l {
	left: 8px;
}
.cssload-i {
	left: 58px;
}
.cssload-n {
	left: 70px;
}
.cssload-g {
	left: 97px;
}
.cssload-square,
.cssload-circle,
.cssload-triangle {
	left: 29px;
}
.cssload-square {
	background: rgb(117,179,209);
	width: 23px;
	height: 23px;
	left: 31px;
	top: 12px;
	transform: scale(0);
		-o-transform: scale(0);
		-ms-transform: scale(0);
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
	animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-o-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-ms-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-webkit-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-moz-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
	animation-delay: 2.3s;
		-o-animation-delay: 2.3s;
		-ms-animation-delay: 2.3s;
		-webkit-animation-delay: 2.3s;
		-moz-animation-delay: 2.3s;
}
.cssload-circle {
	background: rgb(129,212,125);
	width: 26px;
	height: 26px;
	top: 10px;
	left: 29px;
	border-radius: 50%;
	animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-o-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-ms-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-webkit-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-moz-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
	animation-delay: 0s;
		-o-animation-delay: 0s;
		-ms-animation-delay: 0s;
		-webkit-animation-delay: 0s;
		-moz-animation-delay: 0s;
}
.cssload-triangle {
	width: 0;
	height: 0;
	left: 29px;
	top: 11px;
	border-style: solid;
	border-width: 0 14.5px 24.1px 14.5px;
	border-color: transparent transparent rgb(210,121,140) transparent;
	transform: scale(0);
		-o-transform: scale(0);
		-ms-transform: scale(0);
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
	animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-o-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-ms-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-webkit-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
		-moz-animation: cssload-shrinkgrow 3.45s ease-in-out infinite;
	animation-delay: 0.5s;
		-o-animation-delay: 0.5s;
		-ms-animation-delay: 0.5s;
		-webkit-animation-delay: 0.5s;
		-moz-animation-delay: 0.5s;
}


@keyframes cssload-shrinkgrow {
	0% {
		transform: scale(0);
	}
	12.5% {
		transform: scale(1);
	}
	25% {
		transform: scale(1);
	}
	33% {
		transform: scale(0);
	}
	100% {
		transform: scale(0);
	}
}

@-o-keyframes cssload-shrinkgrow {
	0% {
		-o-transform: scale(0);
	}
	12.5% {
		-o-transform: scale(1);
	}
	25% {
		-o-transform: scale(1);
	}
	33% {
		-o-transform: scale(0);
	}
	100% {
		-o-transform: scale(0);
	}
}

@-ms-keyframes cssload-shrinkgrow {
	0% {
		-ms-transform: scale(0);
	}
	12.5% {
		-ms-transform: scale(1);
	}
	25% {
		-ms-transform: scale(1);
	}
	33% {
		-ms-transform: scale(0);
	}
	100% {
		-ms-transform: scale(0);
	}
}

@-webkit-keyframes cssload-shrinkgrow {
	0% {
		-webkit-transform: scale(0);
	}
	12.5% {
		-webkit-transform: scale(1);
	}
	25% {
		-webkit-transform: scale(1);
	}
	33% {
		-webkit-transform: scale(0);
	}
	100% {
		-webkit-transform: scale(0);
	}
}

@-moz-keyframes cssload-shrinkgrow {
	0% {
		-moz-transform: scale(0);
	}
	12.5% {
		-moz-transform: scale(1);
	}
	25% {
		-moz-transform: scale(1);
	}
	33% {
		-moz-transform: scale(0);
	}
	100% {
		-moz-transform: scale(0);
	}
}


/*...css for do not refresh ..*/

.blackscreen-popup {
    /*background: rgba(161, 163, 163, 0.8);*/ 
    background: rgba(0, 0, 0, 0.3);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1500;
}
.loader-popup {
            width: 350px;
            height: auto;
            position: fixed;
            z-index:99999;
            top:40%;
            left: 50%;
            transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
	background-color: #fff;
	border:solid 1px #333;
        }


/*...css for hotel loader for mobile view..*/

.blackscreen-mobile {
    background: rgba(255, 255, 255, 0.8); 
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1500;
}
@keyframes flicker {
  0% {
    background: transparent;
  }
  50% {
    background: #03A9F4;
  }
  100% {
    background: transparent;
  }
}
@keyframes neon {
  0% {
    text-shadow: none;
  }
  50% {
    text-shadow: rgba(256, 256, 256, 0.9) 0 0 50px;
  }
  100% {
    text-shadow: none;
  }
}
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

    .loader {
        padding: 0.5em;
       width: 100px;
        height: 130px;
        min-width: 100px;
        min-height: 130px;   
        background: #444444;
        -moz-box-shadow: #2b2b2b 0 0 20px inset;
        -webkit-box-shadow: #2b2b2b 0 0 20px inset;
        box-shadow: #2b2b2b 0 0 20px inset;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
         position: fixed;
            z-index:99999;
            top:50%;
            left: 45%;
            transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
    }

          .loader .hotel-sign {
            padding: 0.25em 0;
            position: absolute;
            right: -24px;
            width: 22px;
            content: " ";
            text-align: center;
            background: #807e7e;
            font-family: sans-serif;
            font-weight: 700;
            -moz-border-radius: 4px;
            -webkit-border-radius: 4px;
            border-radius: 4px;
            -moz-box-shadow: #2b2b2b 0 0 10px inset;
            -webkit-box-shadow: #2b2b2b 0 0 10px inset;
            box-shadow: #2b2b2b 0 0 10px inset;
            animation: neon 3s infinite ease;
        }
.loader .hotel-sign span {
  line-height: 1;
	font-size: 18px;
	color:#000;
}
        .loader .window {
            background: white;
            width: 13px;
            height: 12px;
            float: left;
            margin: 0 0.5em 0.5em 0;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
            border-radius: 2px;
            animation: flicker 1s infinite ease;
        }
.loader .window:nth-of-type(5n) {
  margin: 0 0 0.5em 0;
}
.loader .window:nth-child(1) {
  animation-delay: 0.5s;
  animation-duration: 0.5s;
}
.loader .window:nth-child(2) {
  animation-delay: 1s;
  animation-duration: 1s;
}
.loader .window:nth-child(3) {
  animation-delay: 1.5s;
  animation-duration: 1.5s;
}
.loader .window:nth-child(4) {
  animation-delay: 2s;
  animation-duration: 2s;
}
.loader .window:nth-child(5) {
  animation-delay: 2.5s;
  animation-duration: 2.5s;
}
.loader .window:nth-child(5) {
  animation-delay: 1.25s;
  animation-duration: 1.25s;
}
.loader .window:nth-child(6) {
  animation-delay: 1.5s;
  animation-duration: 1.5s;
}
.loader .window:nth-child(7) {
  animation-delay: 1.75s;
  animation-duration: 1.75s;
}
.loader .window:nth-child(8) {
  animation-delay: 2s;
  animation-duration: 2s;
}
.loader .window:nth-child(9) {
  animation-delay: 2.25s;
  animation-duration: 2.25s;
}
.loader .window:nth-child(10) {
  animation-delay: 2.5s;
  animation-duration: 2.5s;
}
.loader .window:nth-child(10) {
  animation-delay: 1s;
  animation-duration: 1s;
}
.loader .window:nth-child(11) {
  animation-delay: 1.1s;
  animation-duration: 1.1s;
}
.loader .window:nth-child(12) {
  animation-delay: 1.2s;
  animation-duration: 1.2s;
}
.loader .window:nth-child(13) {
  animation-delay: 1.3s;
  animation-duration: 1.3s;
}
.loader .window:nth-child(14) {
  animation-delay: 1.4s;
  animation-duration: 1.4s;
}
.loader .window:nth-child(15) {
  animation-delay: 1.5s;
  animation-duration: 1.5s;
}
.loader .window:nth-child(16) {
  animation-delay: 1.6s;
  animation-duration: 1.6s;
}
.loader .window:nth-child(17) {
  animation-delay: 1.7s;
  animation-duration: 1.7s;
}
.loader .window:nth-child(18) {
  animation-delay: 1.8s;
  animation-duration: 1.8s;
}
.loader .window:nth-child(19) {
  animation-delay: 1.9s;
  animation-duration: 1.9s;
}
.loader .window:nth-child(20) {
  animation-delay: 2s;
  animation-duration: 2s;
}
.loader .window:nth-child(20) {
  animation-delay: 1.33333s;
  animation-duration: 1.66667s;
}
.loader .window:nth-child(21) {
  animation-delay: 1.4s;
  animation-duration: 1.75s;
}
.loader .window:nth-child(22) {
  animation-delay: 1.46667s;
  animation-duration: 1.83333s;
}
.loader .window:nth-child(23) {
  animation-delay: 1.53333s;
  animation-duration: 1.91667s;
}
.loader .window:nth-child(24) {
  animation-delay: 1.6s;
  animation-duration: 2s;
}
.loader .window:nth-child(25) {
  animation-delay: 1.66667s;
  animation-duration: 2.08333s;
}
.loader .window:nth-child(26) {
  animation-delay: 1.73333s;
  animation-duration: 2.16667s;
}
.loader .window:nth-child(27) {
  animation-delay: 1.8s;
  animation-duration: 2.25s;
}
.loader .window:nth-child(28) {
  animation-delay: 1.86667s;
  animation-duration: 2.33333s;
}
.loader .window:nth-child(29) {
  animation-delay: 1.93333s;
  animation-duration: 2.41667s;
}
.loader .window:nth-child(30) {
  animation-delay: 2s;
  animation-duration: 2.5s;
}
        .loader .door {
            background: white;
            position: absolute;
            bottom: 0;
            width: 20px;
            height: 18px;
            left: 45%;
            margin-left: -0.5em;
            -moz-border-radius-topleft: 3px;
            -webkit-border-top-left-radius: 3px;
            border-top-left-radius: 3px;
            -moz-border-radius-topright: 3px;
            -webkit-border-top-right-radius: 3px;
            border-top-right-radius: 3px;
        }
        .loader .wait-text {
            position: absolute;
            bottom: -24px;
            width: 233%;
            left: -66px;
            font-size: 18px;
            text-align: center;
            z-index: 2;
        }
       
        .loader .mobile-gif {
         position: absolute;
       bottom: -45px;
        width: 100%;
         left: -30px;
     text-align: center
        }


        .blackscreen-room {
             background: rgba(161, 163, 163, 0.50); 
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1500;
        }
       
         .mobile-loder-trvyoo {
          width: 220px;
            height: auto;
            position: fixed;
            z-index:99999;
            top:40%;
            left: 50%;
            transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
	background-color: #fff;
	border:solid 1px #333;
        text-align: center;
    padding-top: 10px;
    border-radius: 10px;
    }