ul {list-style-type: none; font-family:"quicksand", sans-serif;  list-style-position: inside;
  padding-left: 0;}
html{scroll-behavior:smooth;}
img {}

body{font-family:"quicksand", sans-serif;

}

h1 { font-family: protest-revolution, sans-serif;
font-weight: 400;
font-style: normal; margin-top:0px;}


h2 { font-family: protest-revolution, sans-serif;
font-weight: 400;
font-style: normal;margin-top:0px;}


a {text-decoration:none; font-family: protest-revolution, sans-serif;
font-weight: 400;
font-style: normal;  transition: 0.3s;}

span {font-family:inherit; color:inherit; padding:inherit; margin:inherit; line-height:inherit;}
/* Header stuff */

div.header {position:fixed;
  top: 0;
	z-index:1000;}


div.headerdes {background:url("images/background-tile-short.png"); background-repeat:repeat-x; padding-top:2px;}

div.header a {font-family: protest-revolution, sans-serif;
font-weight: 400;
font-style: normal; font-size:30px; color:#14194a;  transition: 0.3s;}

div.header a:hover {color:#df7f30;}

.header div.col-2 {padding-top:20px;}

div.headermo {background:url("images/background-tile-mid.png"); background-repeat:repeat-x; padding-top:10px;}

/* The Overlay (background) */
.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1100;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;	
}

.overlay-content {
  position: relative;
  top: 0;
  width: 100%;
  text-align: center;
  /*margin-top: 30px;*/
	background:url("images/background-tile-shorter.png") bottom center no-repeat;  background-size:100%;
	padding-bottom:45px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 48px;
  color: #14194a;
  display: block;
  transition: 0.3s;
	background-color:#f4ebd3; 
margin:0px;}

.overlay img {margin:0;}

a.purple  {background: url("images/white-blue.jpg") top center no-repeat #6e6e81; background-size:100%;}

a.white  {background: url("images/blue-white.jpg") top center no-repeat #f4ebd3; background-size:100%;}


.overlay a:hover, .overlay a:focus {
  color: #df7f30; 
}

.overlay .closebtn {
  position: absolute;
  top: 0px;
  right: 45px;
}

@media screen and (max-height: 450px) {
  .overlay {overflow-y: auto;}
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}

/*above fold stuff */

div.abovefold p {text-align:right; color:#f4edd3;  background-color:rgba(10, 13, 36, 0.4); padding:5px; border-radius:10px;}
div.abovefold h1 {font-size: 90px; text-align:right; margin-top:80px; margin-bottom: 5px; color:#fad11b; line-height:90px;}



div.abovefold a {background:url("images/button.png") top center no-repeat; font-size: 60px; text-alight:center; margin-top: 50px; color:#fad11b; margin-bottom: 0px;  transition: 0.3s;}
img.underline {width:100%;}

div.abovefold {background: url("images/beanstalk-texture.jpg") left top repeat;  margin-bottom: 0px;}
div.ramen {background-image: url("images/ramen-desktop-big.png");
  background-position: left bottom;
  background-repeat: no-repeat; background-color:rgba(20, 25, 74, 0.3);
  position: relative;
  width: 100%;
	padding-top:100px; padding-bottom:150px;
 margin-bottom: 0px;}


div.button {
  text-align: right;margin-top:90px;}
div.button a {color:#df7f30; font-size:60px; padding:15px 40px 20px;}
div.button a:hover {color: #14194a}
/*changing for Mobile*/

	.desktopseen {display:block;}
	.mobileseen{display:none;}

/* Menu stuff*/
div.specials h1 {padding-top:100px; font-size:120px; padding-bottom: 0px; margin-bottom:0px;color:#fad11b;}
div.specials img.underline {width:40%; margin-left:auto; margin-right:auto;   display: block;}
div.specials h2 {color:#df7f30; font-size:60px;}
div.specials { padding:40px inherit 30px; background:url("images/round.jpg") rgba(10, 13, 36, .8); background-blend-mode: overlay; margin-top:0px; color:#f4edd3;}
.specials .container div.col-4 {background-color:rgba(10, 13, 36, 0.4); border-radius:10px;}
.special .col-4 ul {padding:20px;}
div.specials li {color:#f4edd3; padding:0px 15px;}
div.specials  b li {font-size:20px; color:#fad11b; text-align:center;}
div.specials p {color:#f4edd3; margin-top:0px; padding: 20px;}
.specials img {width:100%;}
div.specials {margin-top:0px;}

div.top h2 {background:url("images/topbob2.png") repeat-x center; padding-bottom:24px;font-size:60px;color:#df7f30; margin-bottom:0px;}

div.starters { background:url("images/beanstalk-texture.jpg") rgba(10, 13, 36, .7); background-blend-mode: lighten;}
div.starters li {color:#f4edd3; margin:30px 0px;}
div.starters li b {font-size:20px; color:#fad11b;}


div.ramenmenu {background:url("images/beanstalk-texture.jpg") rgba(10, 13, 36, .7); background-blend-mode:lighten;}
div.ramenmenu li {color:#f4edd3; margin:30px 0px;}
div.ramenmenu li b {font-size:20px; color:#fad11b;}

img.ramenone {right:150px; position:relative;  float:left; height:300px;}
img.ramentwo {left:150px; position:relative;  float:right; height:300px;}






/* about stuff*/
div.about {background:url("images/round.jpg")  rgba(10, 13, 36, .8) ; background-blend-mode:overlay;}

.about h2 {color:#fad11b; font-size:90px; margin-bottom: 0px;}
.about h3 { margin-top: 0px; color:#f4edd3;font-family: protest-revolution, sans-serif;
font-weight: 400;}

.about p {color:#f4edd3;}
.about em {color:#fad11b; font-style: normal; font-family: protest-revolution, sans-serif;
font-weight: 400;}
div.ramenmenu h2 { padding-top:100px; background:url("images/topbob2.png") repeat-x bottom;  }

.about img {width:120%; top:40px; position:relative;}
.about img.moveover {right:50px;}

/* location stuff*/
div.location {background:url("images/round.jpg") rgba(10, 13, 36, .8); background-blend-mode:overlay;}
.location h3 {color:#fad11b;font-size:60px; margin-bottom: 10px; font-family: protest-revolution, sans-serif; margin-top:0px; font-weight: 400; padding:10px;}
.location li {color:#f4edd3; font-size:30px; margin:10px;}
.location div.col-4 {background-color:rgba(10, 13, 36, 0.4);  border-radius:10px;}
.location div.col-5 {color:#f4edd3; font-size:20px; padding-top:20px; padding-bottom:50px; text-align:right;}
.location div.col-3 { padding-top:20px;}
.location div.col-2 { padding-top:20px;}
.location iframe {margin-bottom:40px;}
div.location h2 { padding-top:100px; background:url("images/topbob2.png") repeat-x bottom; margin-bottom:30px; }
/* rewards stuff*/
div.rewards {background:url("images/oriental.jpg") rgba(10, 13, 36, .8); background-blend-mode: overlay; padding-bottom:0px; padding-top:0px;}
.rewards div.col-6 {background:#f4edd3; padding-top:10px; padding-bottom:40px; margin-top:0px; margin-bottom:0px;}
.rewards .col-3 img.riih {width:90%; right:40px; position:relative; margin-bottom:0px;}
.rewards .col-3 img.leff {width:90%; left:60px; position:relative; margin-bottom:0px;}
.rewards div.col-3 {margin-top:0px; margin-bottom:0px;}
.rewards .col-6 img {padding:25px 44px; width:80%;}
div.rewards h2 { background:url("images/topbob2.png"),url("images/rewards.png")  no-repeat center, repeat-x bottom; }
.rewards .col-6 h2 {font-size:50px; padding-bottom:20px; padding-top:20px;}


@media all and (max-width: 750px){
	.desktopseen {display:none;}
	.mobileseen{display:block;}
	
	div.abovefold p {text-align:left;}
	div.abovefold h1 {text-align:center; margin-top:0px;}
	div.ramen {background-image: url("images/ramen-mobile-big.png");
  background-position:bottom;
  background-repeat: no-repeat;  padding-bottom:480px; padding-top:80px; background-size:100%;}
	div.button {text-align:center; margin-top:150px;}
	div.abovefold span {font-size:60px; line-height:60px;}
	
	img.ramenone {width:100%; position:static; height:100%;}
	img.ramentwo{display:none;}
	
	img.moveover{display:none;}
	.about img {width:100%;}
	iframe {width:100%;}
	.location div.col-2-sm{margin-top:0px; padding:0px 20px 30px;}
	.location div.col-3-sm{margin-top:0px; padding:0px 20px 30px;}
	.location div.col-5 {text-align:left; margin-top:0px;}
	
	.rewards img.leff{display:none;}
	.rewards img.riih{display:none;}
}