html,body{font-family: 'Lato', sans-serif; font-weight: 300; line-height: 1.2em; font-size: 12px; background:transparent; height:100%}

h1,h2,h3,#pdfClip{font-family: 'Crimson Text', sans-serif; font-weight: 400; margin: 0; padding:0; text-transform: uppercase}
h1 a,h2 a{color:inherit; text-decoration: none}
address a, h1{font-size: 18px; font-family: 'Lato', serif; text-transform: none; font-weight: 300; letter-spacing: 3px; text-transform: uppercase; background:#130d39}
h2{font-size: 18px}
#huxmap{text-align: left}
.address{width:100%; text-align: center; margin-top:-15px; letter-spacing: 3px}
.address a i{color:#000; font-style: normal;}
.address a{font-size: 14px; padding: 5px 10px 5px 10px; margin: 0 5px 20px 5px; display: inline-block; text-transform: uppercase !important; background:#130d39 !important; color:#FFF; text-decoration: none}
.dark{background:#000; color:#FFF}
.swiper-slide{cursor: pointer}
.cat{width:100%; padding-top:90px}
#newsClip{display: inline-block; max-width: 400px; position:absolute; top:30%; left:10%; padding:30px; background:url(/images/white-90.png); font-size:14px; line-height:22px; color:#555}

#pdfClip{display: inline-block; position:absolute; bottom:30%; right:10%; padding:0; background:#000; font-size:14px; line-height:22px; color:#CCC}
#pdfClip a{color:inherit; text-decoration: none; padding: 15px 20px 15px 20px; display: inline-block}

#newsClip h1{background:none; font-size:18px; font-weight:400; color:#130d39; font-family: 'Lato', serif;}
#spacer .dark{background: transparent}
.box .wipTape{width:195px; height:195px; position: absolute; top:0; left:0; z-index: 1}
.pure-u-1{position: relative; margin:0; padding:0}
.pure-menu-link,.pure-menu{-webkit-transform: translate3d(0, 0, 0)}
.pure-menu, .pure-menu-open, .pure-menu-horizontal.pure-menu-horizontal{width:auto; font-family: 'Lato', sans-serif; font-weight: 400; text-transform: uppercase; display:inline-block; background: transparent; letter-spacing: 3px}
#menu{position: absolute; top: 28px; right:20px}
#menuLink{outline: 0 !important}
.left,.right{position: absolute; top:50%; left:0; margin-top: -38px; z-index: 5; width:38px; height:76px; cursor:pointer}
.right{left:auto; right:0}
.footer .content{padding:80px 20px 80px 20px; background: #FFF; font-family: 'Lato'; font-weight: 400; letter-spacing: 2px}
.footer .content a{text-transform: uppercase; color:#000; text-decoration:none; padding:0 15px 0 15px }
.pure-menu li{background: #FFF}
.darkHeader li{background: transparent;}
.pure-menu li a{color:#333; font-size: 13px; padding:7px 10px 7px 10px; font-style: normal; font-weight: 400}
.darkHeader li a{color: #FFF;}
.fill{width:100%; height:100%}
.box{overflow: hidden; margin:0; padding:0; position: relative}
.box .content h1{position: absolute; bottom:0; left:0; width:auto; padding:15px 22px 15px 22px; margin:0}
.box .room h2{padding:8px 10px 8px 10px; background: url(/images/white-90.png); position: absolute; bottom:0; left:0; font-size: 16px; font-family: 'Lekton', sans-serif; text-transform: none; font-style: italic; letter-spacing: 2px}
.box .content .banner{position: absolute; top:50%; left:0; margin-top: -20px; width:100%; pointer-events: none}
.box .content .banner span{font-size: 15px; font-style: italic; font-family: 'Lekton', sans-serif; font-weight: 400; letter-spacing: 2px }
#logo2,#logo{height:70px; width:70px; position: absolute; top:0; left:0; image-rendering: -webkit-optimize-contrast; -ms-interpolation-mode: bicubic}
#pageloader{position: absolute; top:0; left:0; width:100%; height:100%; background:#FFF; pointer-events: none; z-index: 7}
.center{text-align: center}
.white{background: url(../images/white-90.png); opacity: 0}
.whiteText{color:#FFF}
.blackText{color:#000;}
.white:hover{opacity: 1; cursor: pointer}
#carrot{position:absolute; bottom:-34px; left:50%; margin-left: -32px; width:64px; height:34px; z-index: 6; pointer-events: visible}
#carrot img{width:100%; height:auto; position: absolute; top:0; left:0}
.hidden{opacity: 0}
.show{opacity: 1}
.about h1{font-family: 'Lato', sans-serif; font-weight: 300; font-size: 48px; font-style: normal; position:relative; bottom:auto; left:auto; width:auto; padding:0; margin:0; line-height: 56px; letter-spacing: 4px;}
.box:before{
	content: "";
	display: block;
	padding-top: 52%; 	/* initial ratio of 16:9*/
}

.desaturate{ -webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

.desaturate:hover{-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
filter: grayscale(0%)
}
.box .content .banner h2{font-family: 'Lato', sans-serif; font-style: normal; letter-spacing: 3px; color:#130d39; font-weight: 300}
.tallbox:before{padding-top: 40%;}
.aboutbox:before{padding-top: 40% !important;}
.tall:before{
	padding-top: 104%; 	/* initial ratio of 16:9*/
}
.header{height:90px; -webkit-font-smoothing: subpixel-antialiased; font-smoothing: subpixel-antialiased; -webkit-backface-visibility: hidden; -webkit-transform-style: preserve-3d}
.catheader{position:absolute; left:130px; top:40px; height:60px; font-family: 'Lato', sans-serif; font-style: normal; font-weight: 300; letter-spacing: 0.0625em}
.box img{
	width: 100%;
	height: auto;
}
.about, .content{
	position:  absolute;
	z-index: 5;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}
.about{top:20%; bottom:auto; padding:0 10% 0 10%; color:#FFF; font-size: 18px; line-height: 22px }
.textbox,.about{font-family: 'Lato', sans-serif; font-weight: 300}
.small{position:relative; padding:5% 10% 5% 10%; font-size: 16px; line-height: 20px; color:#FFF}
#logo,#logo2{margin:10px 0 0 10px}
#pageloader,.pure-menu-link,.pure-menu li a,.trans{
-webkit-transform: translate3d(0, 0, 0);
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
}

.bgcover{ 
	background: no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover}
  

  
 .news{background: #130d39 no-repeat center center; 
  -webkit-background-size: auto 70%;
  -moz-background-size: auto 70%;
  -o-background-size: auto 70%;
  background-size: auto 70%} 
  
  
  
  .news:before{
	content: "";
	display: block;
	padding-top: 62%; 	/* initial ratio of 16:9*/
}
  
 .fixed{position: fixed}
 .top{z-index: 10}
 .bottom{z-index:0; -webkit-transform: translate3d(0,0,0);}
 
  .pure-menu-link {
        display: none; /* show this only on small screens */
        right: 500px;
       
         background:inherit;
        
        font-size: 10px; /* change this value to increase/decrease button size */
        z-index: 13;
        width: 2em;
        height: auto;
        padding: 2.0em 1.5em;
    }
.pure-menu-link.active{right:142px; background:#130d39}
#menu.active{margin-left: -140px}
#menu li a{font-size: 12px; padding: 6px 10px 5px 10px}
#menu li:hover a{color:#333 }



        .pure-menu-link:hover,
        .pure-menu-link:focus {
          
        }

        .pure-menu-link span {
            position: relative;
            display: block;
        }

        .pure-menu-link span,
        .pure-menu-link span:before,
        .pure-menu-link span:after {
            background-color: #FFF;
            width: 100%;
            height: .3em;
            -webkit-transition: all 0.6s;
               -moz-transition: all 0.6s;
                -ms-transition: all 0.6s;
                 -o-transition: all 0.6s;
                    transition: all 0.6s;
        }

            .pure-menu-link span:before,
            .pure-menu-link span:after {
                position: absolute;
                margin-top: -.6em;
                content: " ";
            }

            .pure-menu-link span:after {
                margin-top: .6em;
            }

        .pure-menu-link.active span {
            background: transparent;
        }

            .pure-menu-link.active span:before {
                -webkit-transform: rotate(45deg) translate(.5em, .4em);
                   -moz-transform: rotate(45deg) translate(.5em, .4em);
                    -ms-transform: rotate(45deg) translate(.5em, .4em);
                     -o-transform: rotate(45deg) translate(.5em, .4em);
                        transform: rotate(45deg) translate(.5em, .4em);
            }

            .pure-menu-link.active span:after {
                -webkit-transform: rotate(-45deg) translate(.45em, -.35em);
                   -moz-transform: rotate(-45deg) translate(.45em, -.35em);
                    -ms-transform: rotate(-45deg) translate(.45em, -.35em);
                     -o-transform: rotate(-45deg) translate(.45em, -.35em);
                        transform: rotate(-45deg) translate(.45em, -.35em);
            }

@media screen and (min-width:768px) and (max-width:1023px) {
	 .aboutbox:before{padding-top:90% !important;}
	}
	
	@media screen and (min-width:1024px) and (max-width:1279px) {
		 .aboutbox:before{padding-top:55% !important;}
		}

@media (min-width:1024px) {
.dark:before{padding-top: 20%; }

}

 
@media (max-width:768px) {
.dark:before, .tallbox:before, .box:before, .tall:before{
	padding-top: 62%; 
}


.aboutbox:before{padding-top: 140% !important;}

#logo, #logo2{height:55px; width:55px}
h1{font-size: 18px}
h2{font-size: 14px}
.box .content h1{padding:8px 13px 10px 13px}
}

 @media (max-width:570px) {
	 
	 #newsClip{width:80%; left:5%; padding:5%}
	 
	 
	 .aboutbox:before{padding-top: 270% !important;}
	 
	 .address{ margin-top:0}
	 .address a{display: block}
#carrot{position:absolute; bottom:-23px; left:50%; margin-left: -23px; width:46px; height:23px; z-index: 6}
.catheader{ left:90px;}
 .about{padding:0 5% 0 5%}
 .about h1{font-size: 34px; line-height: 42px}
 .small{padding:5%;}
#menu{position:absolute; left:100%; right:auto; top:15px; z-index: 15; width:200px; }
#menu li{width:100%; margin-bottom: 0; background:#FFF !important; border-bottom: 1px solid #9ec7d8; color:#9a9a9a}
#menu li a{color:#000 !important}
#menu li:last-child{border:none}
 #mobcheck{display:none}
 .left, .right{width:23px; height:46px; margin-top: -23px}
.box .content .banner{left:0; top:0; bottom:0; right:0; width:auto; margin:0; padding:0}
.box .content .banner h2{background: url(/images/white-90.png); margin:0; position: absolute; bottom:0; left:0; padding:8px 10px 10px 10px; letter-spacing: 2px;  text-align: left; font-size: 12px}
.box .content .banner span{display:none}
.white{opacity: 1; background: none}
#menu a{padding:12px}
.white:hover{opacity: 1}
.tallbox:before{
	padding-top: 120%; 
}




.pure-u-1-2 .box:before{
	padding-top: 82%; 
}




.whiteText,.blackText{font-size:14px}
 .bottom{position: absolute; z-index: auto}
 .header{height:75px}
 .cat{padding-top:75px}
 #newsItem{ 
  -webkit-background-size: 80% auto;
  -moz-background-size: 80% auto;
  -o-background-size: 80% auto;
  background-size: 80% auto} 
  
  
 .pure-menu-link {
        position: fixed;
        top:15px;
        right:15px;
        display: block;
        background: #000;
        z-index: 15;
    }
 }