@charset "utf-8";
/* Theme Style */
input, textarea {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}
a, img {
    border:none;
    outline:none;
}
body {
	margin: 0px;
	-webkit-transition: .4s all;   
    -moz-transition: .4s all;   

    -ms-transition: .4s all;   

    -o-transition: .4s all;  
	 transition: .4s all; 
	}
@media screen and (max-width: 2300px) {
body {

	}
	}
@media screen and (max-width: 2000px) {
body {

	}
	}
@media screen and (max-width: 1700px) {
body {

	}
	}
@media screen and (max-width: 1400px) {
body {

	}
	}
@media screen and (max-width: 1100px) {
body {
	}	
	}
@media screen and (max-width: 800px) {
body {
	}	
	}
@media screen and (max-width: 500px) {
body {

	}	
	}	
.transition-smooth {
	-webkit-transition: 2s all;   
    -webkit-transition-delay: 0s; 
    -moz-transition: 2s all;  
    -moz-transition-delay: 0s; 
    -ms-transition: 2s all; 
    -ms-transition-delay:0s; 
    -o-transition: 2s all;  
    -o-transition-delay: 0s; 
    transition: 2s all;
	transition-delay: 0s;
}
.transition-smooth-fast {
	-webkit-transition: 0.5s all;   
    -webkit-transition-delay: 0s; 
    -moz-transition: 0.5s all;  
    -moz-transition-delay: 0s; 
    -ms-transition: 0.5s all; 
    -ms-transition-delay:0s; 
    -o-transition: 0.5s all;  
    -o-transition-delay: 0s; 
    transition: 0.5s all;
	transition-delay: 0s;
}
.displayBlock {
	display:block;
}
.panel{
	width:auto;
	height:auto;
	position:relative;
	display:block;
	z-index:0;
	}

#p1{}
#p2{
	background-color:;
	}
#p3{
	background-color:;
	z-index:5;
	}
#p4{z-index:5;}
#p5{
	width:100%;
	height:1000px;
	margin-top:-300px;
	z-index:-10;
	float:left;
	}
#p6{
	overflow:hidden;
	}
#p7{
	margin-top:50px;
	padding-bottom:50px;
	}
#p8{
	z-index:50;
	}
.fade{
	display:none;
	}
.fade-delay{
	display:none;
	}		
	
	
.center-panel{
	width:78%;
	height:auto;
	margin-left:11%;
	position:relative;
	}	
@media screen and (max-width: 1100px) {
.center-panel{
	width:94%;
	margin-left:3%;
	margin-right:3%;
	}
	}	
@media screen and (max-width: 800px) {
.center-panel{
	width:94%;
	margin-left:3%;
	margin-right:3%;
	}
	}
@media screen and (max-width: 500px) {
.center-panel{
	width:100%;
	margin-left:0%;
	margin-right:0%;
	}
	}
		
.content-panel{}/* main paragraph of each page. - styles are specified in each "page-theme.css" */		
.overflow{
	overflow:hidden;
	}
.bg {
	background-image:url(../img/silq-pattern.jpg);
	background-repeat:repeat;
	}
.bg-panel {

	width:100%;
	height:120%;
	background-image:url(../img/silq-pattern.jpg);
	background-position:bottom;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
 	background-size: cover;
	z-index:-999;
	position:fixed;
	top:0px;
	}
@media screen and (max-width: 500px) {
.bg-panel, .bg {

	width:100%;
	height:120%;
	background-image:url(../img/silq-pattern500.jpg);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
 	background-size: cover;
	
	background-position:bottom;
	background-repeat:repeat-y;
	}	
	}
.pc-pattern{
	background-image:url(../img/silq-pattern.jpg);
	background-repeat:repeat-y;
	background-size:100%;
	}
@media screen and (max-width: 800px) {
.pc-pattern{
	background-image:none;
	}	
	}
	
.white-bg {
	background-color:#FFFFFF!important;
	}
/*home-note*/
.home-note{
	width:135px;
	height:auto;
	
	text-align:center;
	
	background: rgba(51, 51, 51, .95);
	border-color:#7A584B;
	border-width:1px;
	border-style:solid;
	
	margin-left:11%;
	
	opacity:0;
	
	display:block;
	
	position:absolute;
	top:50%;
	transform: translate(-0%, -50%);
	-ms-transform:translate(-0%, -50%);
	left:0px;
	
	color:#FFF;

	-webkit-transition: .2s all;   
    -webkit-transition-delay: 0s; 
    -moz-transition: .2s all;  
    -moz-transition-delay: 0s; 
    -ms-transition: .2s all; 
    -ms-transition-delay:0s; 
    -o-transition: .2s all;  
    -o-transition-delay: 0s; 
    transition: .2s all;
	transition-delay: 0s;
		
	}
@media screen and (max-width: 1500px) {
.home-note{
	margin-left:3%;	
	}
}
@media screen and (max-width: 920px) {
.home-note{
	display:none;
	}
}
.home-note2{
	width:135px;
	height:auto;
	
	text-align:center;
	
	background: rgba(51, 51, 51, .95);
	border-color:#7A584B;
	border-width:1px;
	border-style:solid;
	
	margin-left:11%;
	
	opacity:0;
	
	display:block;
	
	position:absolute;
	top:50%;
	transform: translate(-0%, -50%);
	-ms-transform:translate(-0%, -50%);
	left:0px;
	
	color:#FFF;

	-webkit-transition: 1s all;   
    -webkit-transition-delay: 0s; 
    -moz-transition: 1s all;  
    -moz-transition-delay: 0s; 
    -ms-transition: 1s all; 
    -ms-transition-delay:0s; 
    -o-transition: 1s all;  
    -o-transition-delay: 0s; 
    transition: 1s all;
	transition-delay: 0s;
		
	}

@media screen and (max-width: 1300px) {
.home-note2{
	margin-left:3%;	
	}
}
@media screen and (max-width: 920px) {
.home-note2{
	display:none;
	}
}
.left-arrow{
	width:auto;
	height:10px;
	
	top:19px;
	left:0px;
	position:absolute;
	
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
	}
@media screen and (max-width: 1400px)
and (min-width: 1100px) {
.left-arrow{
	left:95px;
	-ms-transform: rotate(270deg); /* IE 9 */
    -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
    transform: rotate(270deg);
	}
	}
/*home-note ^*/
.border-top{
	border-top-style:solid;
	border-top-width:2px;
	border-top-color:#7A564B;
	}
.border-top-purple{
	border-top-style:solid;
	border-top-width:1px;
	border-top-color:#330533;	
	}
.border-bottom{
	border-bottom-style:solid;
	border-bottom-width:1px;
	border-bottom-color:#330533;
	}
.title-block {
	width:100%;
	height:auto;
	
	position:relative;
	
	padding-top:5px;
	padding-bottom:5px;
	
	text-align:left;	
	}
@media screen and (max-width: 500px) {
.title-block {
	width:97%;
	margin-left:3%;
	}	
	}
.sub-title-block{
	width:100%;
	height:auto;
	
	position:relative;
	
	padding-top:5px;
	padding-bottom:5px;
	
	line-height:10px;
	text-align:center;
	
	background-color:#FFF;
	z-index:10;
	
	text-transform:uppercase;
	}
/* rows */
.row {
	width:100%;
	height:auto;
	position:relative;
	}
.row-spacer-25px{/* sets gaps inbetween the rows */
	width:100%;
	height:25px;
	
	position:relative;
	}
.row a{
	text-decoration:none;
	color:#FFF;
	}
/* rows ^*/
	
/* columns */
.column-1{
	width:32.6%;
	height:auto;
	
	position:relative;
	left:0px;

	-webkit-transition: .4s all;    
    -moz-transition: .4s all;   
    -ms-transition: .4s all;    
    -o-transition: .4s all;   
    transition: .4s all; 

	outline: none;
	
	opacity:1;
	overflow:hidden;
	}
.column-2{
	width:32.6%;
	height:auto;
	
	position:absolute;
	top:0px;
	left:33.7%;
	
	-webkit-transition: .4s all;    
    -moz-transition: .4s all;   
    -ms-transition: .4s all;    
    -o-transition: .4s all;   
    transition: .4s all; 

	outline:none;
	
	opacity:1;
	overflow:hidden;
	}
.column-3{
	width:32.6%;
	height:auto;
	
	position:absolute;
	top:0px;
	left:67.4%;
	
	-webkit-transition: .4s all;    
    -moz-transition: .4s all;   
    -ms-transition: .4s all;    
    -o-transition: .4s all;   
    transition: .4s all; 

	outline: none;
	opacity:1;
	overflow:hidden;
	}
@media screen and (max-width: 800px) {
.column-1{
	width:100%;
	}
.column-2, .column-3{
	width:100%;
	position:relative;	
	left:0px;
	}	
	}
.column-picture-contain{
	width:100%;
	height:auto;
	overflow:hidden;
	position:relative;	
	}

.column-content-contain,
.column-content-contain2{
	width:90%;
	position:relative;
	
	background-color:#FFF;
	
	padding-top:5px;
	padding-bottom:5px;
	
	padding-left:5%;
	padding-right:5%;
	/* have to adjust according to media queries */
	list-style:none;
	}
.column-content-holder,
.column-content-holder2{
	width:90%;
	position:relative;
	
	background-color:#FFF;
	
	padding-top:5px;
	padding-bottom:5px;
	
	padding-left:5%;
	padding-right:5%;
	/* have to adjust according to media queries */
	list-style:none;
	}
.column-left-button {
	width:49%;
	height:auto;
	
	position:relative;
	
	margin-top:10px;
	
	padding-top:10px;
	padding-bottom:10px;
	
	background-color:#330533;
	
	font-family: "Open Sans";
	font-size:90%;
	color:#FFF;	
	cursor:pointer;
	
	text-align:center;
	
	transition:  .4s ease-in-out;
  	-o-transition:  .4s ease-in-out;
  	-ms-transition:  .4s ease-in-out;
  	-moz-transition:  .4s ease-in-out;
  	-webkit-transition:  .4s ease-in-out;
	}
@media screen and (max-width: 800px) {
.column-left-button{
	margin-bottom:10px;
	}	
}
.column-right-button{
	width:49%;
	height:auto;
	
	position:absolute;
	left:51%;
	bottom:0px;

	padding-top:10px;
	padding-bottom:10px;
	
	background-color:#330533;
	
	font-family: "Open Sans";
	font-size:90%;
	color:#FFF;	
	cursor:pointer;
	
	text-align:center;
	
	transition:  .4s ease-in-out;
  	-o-transition:  .4s ease-in-out;
  	-ms-transition:  .4s ease-in-out;
  	-moz-transition:  .4s ease-in-out;
  	-webkit-transition:  .4s ease-in-out;	
	}
.column-right-button a, .column-left-button a{
	color:#FFF;
	}
@media screen and (max-width: 800px) {
.column-right-button{
	bottom:0px;
	}	
}
@media screen and (min-width: 1101px) {	
.column-left-button:hover, .column-right-button:hover {
	background-color:#7A564B;	
		}
}
	

/* columns ^ */	
.digital-information {
	width:230px;
	height:auto;
	position:absolute;
	
	top:10px;
	margin-left:11%;
	left:160px;

	color:#8C8C8C;
	line-height:6px!important;
	
	}
@media screen and (max-width: 1500px) {
.digital-information {
	margin-left:3%;
	}	
	}
@media screen and (max-width: 920px) {
.digital-information {
	width:230px;
	margin-left:0;
	text-align:left;
	left:55px;
	top:0px;
	line-height:2px!important;
	}	
	}
/* weather widget */	
#weather {
  width: 100%;
  height:auto;
  vertical-align:middle;
  
  text-align: center;
  text-transform: uppercase;
  
  color: #7A564B;
  font-size: 120%;
  font-family: "Open Sans";

  padding-bottom:50px;

  position:relative;
  
  opacity:1;
	
}
#weathericon{
	width:50px;
	height:auto;

	
	position:relative;
	top:16px;

	}
#digital-weathericon{
	width:25px;
	height:auto;

	
	position:relative;
	top:8px;

	}
.icon-0:before { content: ":"; }
.icon-1:before { content: "p"; }
.icon-2:before { content: "S"; }
.icon-3:before { content: "Q"; }
.icon-4:before { content: "S"; }
.icon-5:before { content: "W"; }
.icon-6:before { content: "W"; }
.icon-7:before { content: "W"; }
.icon-8:before { content: "W"; }
.icon-9:before { content: "I"; }
.icon-10:before { content: "W"; }
.icon-11:before { content: "I"; }
.icon-12:before { content: "I"; }
.icon-13:before { content: "I"; }
.icon-14:before { content: "I"; }
.icon-15:before { content: "W"; }
.icon-16:before { content: "I"; }
.icon-17:before { content: "W"; }
.icon-18:before { content: "U"; }
.icon-19:before { content: "Z"; }
.icon-20:before { content: "Z"; }
.icon-21:before { content: "Z"; }
.icon-22:before { content: "Z"; }
.icon-23:before { content: "Z"; }
.icon-24:before { content: "E"; }
.icon-25:before { content: "E"; }
.icon-26:before { content: "3"; }
.icon-27:before { content: "a"; }
.icon-28:before { content: "A"; }
.icon-29:before { content: "a"; }
.icon-30:before { content: "A"; }
.icon-31:before { content: "6"; }
.icon-32:before { content: "1"; }
.icon-33:before { content: "6"; }
.icon-34:before { content: "1"; }
.icon-35:before { content: "W"; }
.icon-36:before { content: "1"; }
.icon-37:before { content: "S"; }
.icon-38:before { content: "S"; }
.icon-39:before { content: "S"; }
.icon-40:before { content: "M"; }
.icon-41:before { content: "W"; }
.icon-42:before { content: "I"; }
.icon-43:before { content: "W"; }
.icon-44:before { content: "a"; }
.icon-45:before { content: "S"; }
.icon-46:before { content: "U"; }
.icon-47:before { content: "S"; }

/* weather widget ^ */	

/* 360 View Styles */
.view360-container {
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0);
	position:absolute;
	z-index: 20;
	text-align: center;
}
.view360-container:hover {
	background-color:rgba(0,0,0,0.5);
}

.view360-container p {
	color:#FFF;
	opacity:0;
}

.view360-container .center-to-panel {
	display: flex;
  justify-content: center;
  flex-direction: column;
  height: 100%;
}
.view360 {
	width:40px;
	height:auto;
	position:absolute;
	right:10px;
	bottom:10px;
	z-index: 10;
	opacity: 0.8;
}
.view360-container:hover p,
.view360-container .view360 { 
	opacity:1;
}
/* 360 View Styles ^ */

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 25; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 0px;
    width: 800px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
}
@media screen and (max-width: 1300px) { 
	.modal-content {
    width: 500px;
}
}
.qr-modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    border: 0px;
    width: 350px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
	text-align:center;
}
.qr-modal-content img{
	
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

/* The Close Button */
.close{
    color: #696361;
    float: right;
    font-size: 28px;
    font-weight: bold;
	margin-right:10px;
	margin-top:18px;
}

.close:hover,
.close:focus{
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.modal-body {padding: 0px;}

.modal-footer {
    padding: 0px;
    background-color: #330533;
	height:auto;
	text-align:center;
	text-transform:uppercase;
}
.modal-footer p {
	font-family: "Open Sans";
    font-size: 16px;
    color: #FFF;
    padding-top: 10px;
    margin: 0px;
    padding-bottom: 10px;
}
.view360iframe {
	width:800px;
	height: 800px;
}
@media screen and (max-width: 1300px) { 
.view360iframe {
    width: 500px;
	height: 500px;
}
}
@media screen and (max-width: 640px) { 
.view360iframe {
    width: 350px;
	height: 350px;
}
}

.qr-icon {
	width: 40px;
	height: 70%;
    position: absolute;
    top: 15%;
    right: 5%;
    background-image: url("../img/phone-scan@2x.png");
	background-size:contain;
	background-repeat: no-repeat;
	background-position:center;
}
.facilities-qr-icon {
	bottom:10px;
	height: 50px;
	top:auto;
	background-position: bottom;
}
@media screen and (max-width: 800px) {
.facilities-qr-icon {
	position:relative;
	height: 50px;
    margin-bottom: 10px;
    right: 0px;
	top:1px;
}	
}
.show-on-mobile {
	display:none;
}
@media screen and (max-width: 1070px) {
.show-on-mobile {
	display:block;
	height: 0px;
}
}
