@charset "UTF-8";
/* CSS Document */
/* CSS stylesheet 
                         _   _             __                      _                     _ _   _                 
 _ __ ___   __ _ _   _  | |_| |__   ___   / _| ___  _ __ ___ ___  | |__   ___  __      _(_| |_| |__    _   _ ___ 
| '_ ` _ \ / _` | | | | | __| '_ \ / _ \ | |_ / _ \| '__/ __/ _ \ | '_ \ / _ \ \ \ /\ / | | __| '_ \  | | | / __|
| | | | | | (_| | |_| | | |_| | | |  __/ |  _| (_) | | | (_|  __/ | |_) |  __/  \ V  V /| | |_| | | | | |_| \__ \
|_| |_| |_|\__,_|\__, |  \__|_| |_|\___| |_|  \___/|_|  \___\___| |_.__/ \___|   \_/\_/ |_|\__|_| |_|  \__,_|___/
                 |___/ 
																														*/
/*background*/

body {
	background-image: url(../img/cubes_@2X.png;);
	background-repeat: repeat;
}
.pageWrapper {
	width: 100%;
	position: fixed;
}

/*LOGO*/
.mainLogo {
	background: url(../img/website_photos/cafe_logo.png);
	background-repeat:no-repeat;
	background-size: 13.5vw;
	padding:130px;
	margin:-1vh 2vw;
	float:left;
	position:absolute;	
}

/*HEADER AND CAROUSEL*/
header{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height:1600px;
}

nav {
	width:100%;
	top:0;
	left:0;
	position:absolute;
	padding:4px;
	display:block;
	float:left;
	background-color:lightgray;
	text-align: center;
}
a{
	text-decoration:none;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	color:dimgray;
	font-size:19px;
}
a:hover{
	background-color:#b3ccd8;
}
.active{
	color:snow;
	background-color:#b3ccd8;
}



ul {list-style-type: none;}
body {font-family: Verdana, sans-serif;}

/* Month header */
.month {
  float:left;
  padding: 70px 0px;
  width: 100%;
  background: #99cad6;
  text-align: center;
	font-family:"poiret-one";
}

/* Month list */
.month ul {
  margin: 0;
  padding: 0;
}

.month ul li {
  color: white;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 3px;
}

/* Previous button inside month header */
.month .prev {
  float: left;
  padding-top: 10px;
}

/* Next button */
.month .next {
  float: right;
  padding-top: 10px;
}

/* Weekdays (Mon-Sun) */
.weekdays {
  margin: 0;
  padding: 10px 0;
  background-color:#ddd;
}

.weekdays li {
  display: inline-block;
  width: 13.6%;
  color: #666;
  text-align: center;
}

/* Days (1-31) */
.days {
  padding: 20px 0;
  background: #eee;
  margin: auto;
}

.days li {
  list-style-type: none;
  display: inline-block;
  width: 13.6%;
  text-align: center;
  margin-bottom: 5px;
  font-size:14px;
  color: #777;
}

/* Highlight the "current" day */
.days li .active {
  padding: 5px;
  background: #99cad6;
  color: white;
}

/* Month header */
.month2 {
  float:left;
  padding: 70px 0px;
  width: 100%;
  background: #99cad6;
  text-align: center;
}

/* Month list */
.month ul {
  margin: 0;
  padding: 0;
}

.month ul li {
  color: white;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 3px;
}

/* Previous button inside month header */
.month .prev {
  float: left;
  padding-top: 10px;
}

/* Next button */
.month .next {
  float: right;
  padding-top: 10px;
}

/* Weekdays (Mon-Sun) */
.weekdays {
  margin: 0;
  padding: 10px 0;
  background-color:#ddd;
}

.weekdays li {
  display: inline-block;
  width: 13.6%;
  color: #666;
  text-align: center;
}

/* Days (1-31) */
.days {
  padding: 20px 0;
  background: #eee;
  margin: auto;
}

.days li {
  list-style-type: none;
  display: inline-block;
  width: 13.6%;
  text-align: center;
  margin-bottom: 5px;
  font-size:14px;
  color: #777;
}

/* Highlight the "current" day */
.days li .active {
  padding: 5px;
  background: #99cad6;
  color: white;
}

img{
	padding:50px;
	width:30vw;
	float:left;
	opacity:0.9;
	margin:0 4%;
}

ol{
	color:dimgray;
	font-size:1vw;
	font-family:"poiret-one";
}

h1{
	color:#b21e00;
	font-size:2vw;
	font-family:"poiret-one";
}

/*FOOTER*/
.footer {
    position: fixed;
	display:block;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color: #99cad6;
    color: white;
    text-align: center;
	font-size:1.25vw;
	font-family:"poiret-one";
}

.boxOne{
	margin-left:18%;
	padding:8px;
	float:left;
	width:auto;
	
}
.boxTwo{
	margin-left:18%;
	padding:8px;
	float:left;
	width:auto;
}
.boxThree{
	margin-left:18%;
	padding:8px;
	float:left;
	width:auto;
	
}

@media screen and (max-width:490px) {
.footer{
	display:none;
}
	}