@charset "UTF-8";
/*----FONTS
font-family: 'baskerville-regularregular';
font-family: 'elvencommonspeakregular';
font-family: 'montserratthin';
--------*/
/*---COLORS---
#615043*/

body {background-color: white; margin: 0;font-size:100%;}

img {max-width: 100%;}

header {background-image: url(images/rd_headeralt.png); 
    background-size: cover;
    background-position: center center;
    width: 100%;
    height:700px;
    margin: auto;}

.logo {width:30%; height: 100px; padding-top: 30px; padding-left: 30px; box-sizing: border-box; float:left;}

.logo img {width:100%;}

.logo a {}

.logo p {color:white; text-align: center; padding-top: 30px; font-size: 1em;}

.logo a:hover {opacity: .7;
    transition: .7s ease;}

.mobile-menu {display: none;}

.hidden {width:45%; height: 100px;
    line-height: 2.6em; 
    letter-spacing: .1em;
    float:right; margin-top: 100px;}

.hidden a {font-family: 'baskerville-regularregular';
    color: white;
    text-decoration: none;
    font-size: 1.6em;
    float:right;
    margin-right: 125px;}

.hidden a:hover {opacity: .4;
    transition: .7s ease;}

.hidden img {clear: both; float: right; width:3px; margin-top: -115px; margin-right: 75px;}

.illustration1 {width: 100%; max-width: 300px; float: left;margin-left: 50px;margin-top: 50px;}

p {font-family: 'montserratthin'; line-height: 2em;}

p.1 {font-size: .5em; color: white;
    width: 90%;} /*PLS HLP*/

#container {width: 100%; max-width: 1100px;margin: auto;text-align: center;}

.text1 {float: right; width:55%;margin-bottom: 50px;}

h1 {font-family: 'elvencommonspeakregular'; font-size: 5em;margin-bottom: 50px;text-align: center;line-height: 1.5em;color: #615043;}

.button2 {font-family: 'elvencommonspeakregular';text-decoration: none; color: #615043;padding-top:25px; text-align: center;}

.button2 a {font-size: 2.3em; text-decoration: underline; color: #615043;}

.button2 > a {
  position: relative;
  color: #615043;
  text-decoration: none;}

.button2 > a:hover {
  color: #615043;}

.button2 > a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #615043;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;}

.button2 > a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);}

.text2 {width: 35%; clear: both; float:left; margin-top: 60px; margin-right: 50px;}

h2 {font-family: 'libre_baskervilleregular'; font-size: 1.2em; margin-bottom: 20px;color: #615043;}

p.2 {font-size: 2em;}

p.3 {float: left; margin-top: 20px;}

.photo1 {background-image: url(images/interior.png);
   background-repeat: no-repeat;background-size: cover;
    background-position: center center;
    width: 50%; max-width:500px;height:381px;float: right;width: 100%;margin: auto;text-align: center;}

.button {font-family: 'elvencommonspeakregular';text-decoration: none; color: #615043;padding-top:15px;padding-bottom: 25px; text-align: center;}

.button a {font-size: 2.3em; text-decoration: underline; color: #615043;}

.button > a {
  position: relative;
  color: #615043;
  text-decoration: none;}

.button > a:hover {
  color: #615043;}

.button > a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color:#615043;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;}

.button > a:hover:before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);}

.quote {clear: both; width:100%;font-family: 'elvencommonspeakregular';margin: auto;padding-bottom: 25px;color: #615043;}

h4 {text-align: center;font-size: 3.5em; margin: auto;padding-top: 50px;padding-left: 35px;padding-right: 35px;}

p.jrtolkien {text-align: center;}

footer {width:100%; background-color: #615043; height: 330px; clear: both; position: center bottom;}

.socialmedia {width: 33.3%; float:left; text-align: center;margin-top: 90px;}

.socialmedia a {margin-left:20px;margin-right: 20px;}

.socialmedia a:hover {opacity: .4;
    transition: 1s ease;}

h3 {font-family: 'baskerville-regularregular'; font-size: 1em; margin-bottom: 20px; color: white; line-height: 2.5em;}

.footerillustrations {width: 33.3%; float:left; text-align: center;}

.footerillustrations img {width: 80%; margin-top: 50px;}

.hours {width: 33.3%; float:left;margin-top:90px; text-align: center;}


/*--------MENU---------*/

header.menupg {background-image: url(images/menuhead.jpeg);
    height: 320px; background-position: center bottom;}

.logo1 {width:15%; height: 200px; padding-top: 30px; padding-left: 70px; float:left;}

.logo1 p {color:white; text-align: center; padding-top: 10px; font-size: .9em;}

.logo1 p {color:white; text-align: center; padding-top: 30px; font-size: 1em;}

.logo1 a:hover {opacity: .7;
    transition: .7s ease;}


.menucontainer1 {width: 90%; max-width: 900px;clear: both;margin: auto;}

.menucontainer2 {width: 90%; max-width: 900px;clear: both;margin: auto;}

h6 {background-image: url(images/asset2.png); background-repeat: no-repeat;background-position: center center;font-family:'elvencommonspeakregular'; font-size: 5em; text-align: center;padding-top: 75px;padding-bottom: 75px;}

.leftmenu {width: 50%;max-width: 300px; float: left;text-align: center;}

.rightmenu {width: 50%; max-width: 300px; float: right;text-align: center;}

span1 {font-family:'baskerville-regularregular';font-size: 1.75em;}

span {font-family:'montserratthin';font-size: 1em;}

.bottomleftmenu {width: 50%; max-width: 300px; float: left;text-align: center;padding-bottom: 75px;}

.bottomrightmenu {width: 50%; max-width: 300px; float: right;text-align: center;padding-bottom: 75px;}

/*---------ABOUT------------*/

header.aboutpg {background-image: url(images/about_header.jpg);
    height: 320px; background-position: center top;}

h6{padding: 0;padding-top: 90px;padding-bottom: 20px;}

.abouttext {width:100%; max-width: 600px; font-family:'montserratthin';margin: auto;}

p.about {padding-bottom: 100px;}

/*-----SPACE--------*/

header.spacepg {background-image: url(images/space_header.jpg);
    height: 320px; background-position: center center;}

/* -------------Tablet -------------------------------*/

@media screen and (min-width: 481px) and (max-width: 800px) {
    body {background-color: white;}
    
    .mobile-menu {display: block;}
    
    header {height:250px;background-position: center top;}
    
    .logo {float: none; padding: 0; text-align: center; margin: auto; width:20%;padding-top: 40px;}

    .logo p {color:white;padding: 0;margin: 0; width: 150px; padding-top: 10px; font-size: .7em;text-align: center;margin: auto;}
    
   #container {max-width: 700px;}
    
    .illustration1 {width:100%; max-width: 150px; float:right;margin-bottom: -20px; margin-right: 50px;}
    
    h1 {font-size: 3em;width: 100%; margin: 0; text-align: center;}
    
    p {font-size: .8em; padding-left: 25px;padding-right:25px;}
    
    .text1 {text-align: center; width: 100%;}
    
     .text2{float:none;width: 100%;margin: 0; padding-top: 50px;text-align: center;}
    
    .hidden {display: none;}
    footer {height:350px;}
    
    .button {padding-top:25px;text-align: center;}
   
    h4 {text-align: center;font-size: 2.5em; margin: auto;padding-top: 50px;}
    
    .photo1 {max-width: 400px; max-height: 300px; float: none;}

    p.jrtolkien {text-align: center;}
    
    .hours {float: right; margin-top:0; min-width: 220px;width: 50%;}
    
    .socialmedia {float:left; width: 50%; min-width: 233px; margin: 0; margin-top: 40px;}
    
    .footerillustrations {clear: both;float: center; margin-left: 50px;}

/*---------MENU------------*/

header.menupg {height: 250px;}

.logo1 {float: none; padding: 0; text-align: center; margin: auto; width:20%;padding-top: 40px;}

.logo1 p {color:white;padding: 0; width: 150px; padding-top: 10px; font-size: .7em;text-align: center;margin: auto;}
    
h6 {padding-top: 75px; padding-bottom: 50px;}
    
.menucontainer1 {width: 90%; max-width: 100%;max-width: 700px;}
    
.menucontainer2 {width: 90%; max-width: 100%;max-width: 700px;}

span1 {font-size: 1.4em;}

span {font-family:'montserratthin';font-size: .9em}
    

/*---------SPACE------------*/
header.spacepg {height: 250px;}
    
p.abouttext {padding: 0;}

p.about {padding: 0;padding-left:20px;padding-right: 20px;}

/*---------ABOUT------------*/
header.aboutpg {height: 250px;}
}

/* ---------------Mobile -------------------------------------- */
@media screen and (max-width: 480px){
 body {background-color: white;}
    
    header {width: 100%; max-width: 480px; height: 215px;}
    
    .mobile-menu {display: block;}
    
    .hidden {display: none;}
   
    #container {max-width: 480px;} 
    
    .illustration1 {display: none;}
    
    .hours, .footerillustrations, .socialmedia {width:100%; text-align: center; font-size: .85em;}
    
    footer {height: 545px;}
    
    .socialmedia {margin:0; margin-top: 35px;}
    
    .footerillustrations {height: 190px;}
    
    .logo {width:100%; max-width:150px;float: none;}
    
    .logo img {text-align: center;}
    
    .logo p {color:white; text-align: center;font-size: .5em;padding: 0;}
    
    .text1 {text-align: center; width: 100%;}
    
    h1 {width: 100%; font-size: 2.2em; margin: 0; text-align: center;margin-top: 20px;}
    
    h2 {font-size:1em;}
    
   p {font-size:.75em; padding-left: 25px;padding-right:25px;}
    
    .text2{float:none;width: 100%;margin: 0; padding-top: 50px;text-align: center;}
    
    .photo1 {float: none;width: 80%;max-width: 400px; max-height: 300px;}
    
    .photo1 img {width: 80%;}
    
     h4 {text-align: center;font-size: 2.5em; margin: auto;padding-top: 50px;padding-bottom: 25px;}
    /*---------MENU------------*/
header.menupg {background-image:none;height:40px;}

.logo1 {margin-top: -90px;height: 0;}

.logo1 p {display: none;}
    
h6 {padding: 0; padding-top: 10px;font-size: 3.5em; margin-bottom: 40px;}
    
span1 {font-family:'baskerville-regularregular';font-size: 1em;}

span {font-family:'montserratthin';font-size: .7em;}
    
.menucontainer1 {width: 80%;}
    
.menucontainer2 {width: 80%;}
    
.bottomleftmenu {width: 45%;}

.bottomrightmenu {width: 45%;}
    
.leftmenu {width:45%;}

.rightmenu {width: 45%;}
    
    /*---------SPACE------------*/
header.spacepg {background-image: none;height: 40px;}
    
h6 {padding: 0;padding-top: 45px;}
    
.logo1 {margin-top: -90px;height:0;}

.logo1 p {display: none;}
    
.abouttext {width: 80%;}
    
    /*---------ABOUT------------*/
header.aboutpg {background-image: none;height: 40px;}
    
h6 {padding: 0;padding-top: 45px;}
    
p.about {padding: 0;padding-top: 15px;}
    
.logo1 {margin-top: -90px;height: 0;}

.logo1 p {display: none;}
    
}