html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


body {
  font-size: 100%;
  /*font-family: "Century Gothic", sans-serif;*/
  color: #333333;
  background-color: white;
    /*max-width: 1600px;*/
    /*margin: 0 auto !important;*/
}

body, html {
  /* important */
  height: 100%;
  font-family: "Century Gothic", sans-serif;
    max-width: 1600px;
    margin: 0 auto !important;
}

/*a {*/
  /*color: #b4d7a8;*/
  /*text-decoration: none;*/
/*}*/

/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 1024px;
  margin: 0 auto;
  /*letter-spacing: .1em;*/
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}

.cd-container h1{
    text-align: center;
    font-size: 2.9em;
    margin: -5% 0 2% 0;
}
.cd-container h2{
    /*text-align: center;*/
    font-size: 1em;
    font-weight: 600;
    margin-bottom: 2%;
}
.cd-container p{
    font-size: 1em;
    /*text-align: center;*/
    margin-bottom: 2%;
}

/* -------------------------------- 

Main components 

-------------------------------- */
.cd-header {
  position: fixed;
  top: 0;
  /*left: 0;*/
  width: 100%;
  height: 70px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  z-index: 2;
    max-width: 1600px;
    /*margin: 200px !important;*/
    /*margin-left: auto !important;*/
    /*margin-right: auto !important;*/
    /*margin-left: 100px !important;*/
    /*margin: 0 0 0 -40%;*/
    /*left:46%;*/
}
.cd-header:after {
  content: "";
  display: table;
  clear: both;
}
.cd-header #cd-logo {
  float: left;
  width: 29%;
  margin: -6% 0 0 0;
}

.cd-header #cd-logo img{
    position: relative;
    margin: -4% 0 0 0;
    max-width: 100%;
}

.cd-header .social{
  float: right;
  margin-right: 5.54%;
}

.cd-header .social a{
    display: inline-block;
    position: relative;
    z-index: 1;
    padding: 0.5em;
    margin: -0.5em;
}

/*.cd-header #social img{
  margin-top: 5px;
  margin-right: 75px;
}*/


.cd-header .social #face-book{
  margin-right: -5%
}

.cd-header .social #face-book #tweet{
    display: block;
    height: 100%;
    margin-top: 5%;
}

/*.cd-header .social a{*/
    /*padding: 20px;*/
    /*margin: -20px;*/
/*}*/

.cd-main-nav{
  clear: both;
    width:40% ;
  margin-top: -50px;
}

.cd-header .cd-main-nav ul li a {
    font-size: .9em;
    text-decoration: none;
    -webkit-transition: ease-in-out 745ms;
    transition: ease-in-out 745ms;
    /*letter-spacing: 2px;*/
}

a:focus {
    outline: none;
}
a:active {
    outline: none;
}
.cd-header .cd-main-nav ul li a:link{
    text-decoration: none;
    border: 0;
}

.cd-header .cd-main-nav ul li a:visited{
    text-decoration: none;
    border: 0;
}

.cd-header .cd-main-nav ul li a:hover{
    color: rgb(163, 138, 92);
    text-decoration: none;
    border: 0;
}

.cd-header .cd-main-nav ul li a:active{
    text-decoration: none;
    border: 0;
    outline: none;
}

.cd-scrolling-bg.cd-color-2 .cd-container{
  text-align: center;
  height: 10%;
}
.cd-scrolling-bg.cd-color-3 .cd-container{
  text-align: center;
}

#about{
  width: 100%;
}

#about-width{
  width: 70%;
    margin: 0 auto;
}

#about-width img{
    margin-top: 1%;
}
#about-width p{

}
#about-width h4{
    font-weight: 100;
    font-size: 2.54em;
    text-align: center;
    letter-spacing: -0.08em;
    margin: -5% 0 4% 0;
    /*color: #505050;*/
}

.links{
    width: 90%;
    margin: 2% auto;
    text-align: center;
}
.links img{
  max-width: 100%;
  margin-right: .5%;
  margin-top: 4%;
 }
.links-mobile{
    display: none;
}



#menu-width{
  width: 76%;
  margin: 0 0 0 12%;
  box-shadow: none;
  /*font-size: .6em;*/
}

#menu-width1{
    width: 76%;
    margin: 0 0 0 12%;
    box-shadow: none;
    /*font-size: .6em;*/
}

#menu-width h4{
    font-weight: 100;
    font-size: 2.54em;
    text-align: center;
    letter-spacing: -0.08em;
    margin: -5% 0 4% 0;
    /*color: #505050;*/
}
.left-side{
    float: left;
    width: 45%;
    text-align: left;
}
.left-side img{
    max-width: 100%;
    float: right;
    margin: 12% 0 12% 0;
}
.left-side h2{
    clear: both;
    font-size: .7em;
    font-weight: 600;
 }
.breakfast-menu{
    float: left;
    width: 100%;
}
.breakfast-menu h3 {
    font-size: .65em;
    font-weight: 500;
}
.breakfast-menu li{
    margin-bottom: 4.5%;
}
.breakfast-menu p{
    margin: -1% 0 0 0;
    font-size: .6em;
    font-weight: normal;
    text-align: left;
    line-height: 1.4em;
    color: gray;
}
.right-side{
    float: right;
    width: 45%;
    text-align: left;
}
.right-side img{
    max-width: 100%;
    float: left;
    margin: 12% 0 12% 0;
}
.right-side h2{
    clear: both;
    font-size: .7em;
    font-weight: 600;
}
.lunch-menu{
    float: left;
    width: 100%;
}
.lunch-menu h3 {
    font-size: .65em;
    font-weight: 500;
}
.lunch-menu li{
    margin-bottom: 4.5%;
}
.lunch-menu p{
    margin: -1% 0 0 0;
    font-size: .6em;
    font-weight: normal;
    line-height: 1.4em;
    text-align: left;
    color: gray;
}

#menu-width .right-side{
        float: right;
        width: 45%;
        text-align: left;
    }
#menu-width .right-side img{
        max-width: 100%;
        float: left;
        margin: 12% 0 12% 0;
    }
#menu-width .right-side h2{
        clear: both;
        font-size: .7em;
        font-weight: 600;
    }
#menu-width  .lunch-menu{
        float: left;
        width: 100%;
    }
#menu-width   .lunch-menu h3 {
        font-size: .65em;
        font-weight: 500;
    }
#menu-width  .lunch-menu li{
        margin-bottom: 4.5%;
    }
#menu-width .lunch-menu p{
        margin: -1% 0 0 0;
        font-size: .6em;
        font-weight: normal;
        line-height: 1.4em;
        text-align: left;
        /*color: gray;*/
    }



#party-width{
  width: 76%;
  margin: 0 0 0 18%;
}
#party-width p{
    text-align: center;
    font-size: .65em;
    line-height: 1.4em;
    margin-bottom: 8%;
    /*font-weight: 600;*/
}
#party-width .party-image{
  /*margin: 12% 0 12% 0;*/
}

#party-width h4{
    font-weight: normal;
    font-size: 2.54em;
    text-align: center;
    letter-spacing: -0.04em;
    margin: -5% 0 4% 0;
    /*color: #505050;*/
}
#left-side-party{
  float: left;
  width: 30%;
  margin: 0 3.33% 0 0;
}
#left-side-party h2{
    font-size: .7em;
    font-weight: 700;
  margin-bottom: -3%;
}
#left-side-party h3{
    font-size: .65em;
    font-weight: 500;
    /*color: gray;*/
}
#left-side-party p{
    margin: -1% 0 0 0;
    font-size: .6em;
    font-weight: normal;
    text-align: left;
    color: gray;
}
#left-side-party li{
    margin-bottom: 7.4%;
}

#center-party{
  float: left;
  width: 30%;
   margin: 0 3.33% 0 0;
}
#center-party h2{
    font-size: .7em;
    font-weight: 700;
    margin-bottom: -3%;
}
#center-party h3{
    font-size: .65em;
    font-weight: 500;
    /*color: gray;*/
}
#center-party p{
    margin: -1% 0 0 0;
    font-size: .6em;
    font-weight: normal;
    text-align: justify;
    color: gray;
}
#center-party li{
    margin-bottom: 7.4%;
}

#right-side-party{
  float: left;
  width: 30%;
  margin: 0 3.33% 0 0;
}

#right-side-party h2{
    font-size: .7em;
    font-weight: 700;
    margin-bottom: -3%;
}
#right-side-party h3{
    font-size: .65em;
    font-weight: 500;
    /*color: gray;*/
}
#right-side-party p{
    margin: -1% 0 0 0;
    font-size: .6em;
    font-weight: normal;
    text-align: justify;
    color: gray;
}
#right-side-party li{
    margin-bottom: 7.4%;
}


#christmas{
   position: absolute;
   top: 55%;
   right: 6%;
}

#christmas-medium{
    position: absolute;
    top: 55%;
    right: 6.5%;
}

#christmas-small{
    position: absolute;
    top: 55%;
    right: 6.5%;
}

.cd-scrolling-bg.cd-color-1 #contact{
    height: 150% !important;
}

.cd-scrolling-bg.cd-color-1 .cd-container #footer-info{
  float: left;
  width: 45%;
  text-align: left;
  margin-top: 11%;
}
.cd-scrolling-bg.cd-color-1 .cd-container #map-container{
     border: 2px solid white;
     padding: 1% 0 0 1%;
     float: right;
     width: 50%;
     height: 314px;
 }
#contact #footer-info{
    color: white;
    margin: 2% 0 0 4%;
}
#contact #footer-info h5{
    font-weight: normal;
    font-size: 2.54em;
    text-align: left;
    letter-spacing: -0.08em;
    margin: 0 0 4.04% -5.4%;
}
#contact #footer-info p{
    font-size: .6em;
    line-height: 1.1em;
}
#contact #footer-info h5 img{
    max-width: 100%;
}
#contact #footer-info a {
    color:rgb(173, 216, 230);
    -webkit-transition: ease-in-out 745ms;
    transition: ease-in-out 745ms;
}
/*#contact #footer-info a:link{*/
    /*color: white;*/
/*}*/

#contact #footer-info a:hover{
    color: rgb(163, 138, 92);
    text-decoration: none;
    border: 0;
}
#contact #footer-info #opening{
    width: 50%;
    margin-bottom: 5.4%;
}
#contact #footer-info #opening #opening-title{
    font-size: .9em;
    letter-spacing: .1em;
    line-height: 1.4em
}
#contact #footer-info #opening p{
    font-size: .554em;
    letter-spacing: .1em;
    line-height: 1.4em
}
 #map-canvas{
     width: 98%;
     height: 96%;
 }

 #extra{
     clear: both;
 }





@media only screen and (min-width: 768px) {
  .cd-header {
    height: 70px;
      background: black;
  }
  .cd-header #cd-logo {
    margin: 23px 0 0 5%;
  }
}

.cd-main-nav {
  float: right;
  margin-right: 5%;
  width: 44px;
  height: 100%;
  background: url("../img/menu-icon.png") no-repeat center center;
  background-size: 34px 34px;
  cursor: pointer;
}
.cd-main-nav ul {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}
.cd-main-nav ul.is-visible {
  -webkit-transform: translateY(50px);
  -moz-transform: translateY(50px);
  -ms-transform: translateY(50px);
  -o-transform: translateY(50px);
  transform: translateY(50px);
}
.cd-main-nav a {
  display: block;
  height: 50px;
  line-height: 50px;
  padding-left: 5%;
  background: #2f292a;
  border-top: 1px solid #453c3d;
  color: white;
}
@media only screen and (min-width: 768px) {
  .cd-header{
    height: 80px;
  }
  .cd-main-nav {
    width: auto;
    height: auto;
    background: none;
    cursor: auto;
  }
  .cd-main-nav ul {
    position: static;
    width: auto;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    line-height: 70px;
  }
  .cd-main-nav ul.is-visible {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  .cd-main-nav li {
    display: inline-block;
    margin-left: 1em;
  }
  .cd-main-nav a {
    display: inline-block;
    height: auto;
    line-height: normal;
    background: transparent;
    padding: .6em 1em;
    border-top: none;
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    font-size: 0.875rem;
  }
  .no-touch .cd-main-nav a:hover {
    color: white;
  }
}

.cd-main-content {
  /* you need to assign a min-height to the main content so that the children can inherit it*/
  height: 80%;
  position: relative;
  z-index: 1;
}

/*.cd-main-content .cd-scrolling-bg.cd-color-2 #about{
  height: 80% !important;
}*/

.cd-fixed-bg {
  position: relative;
  min-height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 1;
}

.cd-fixed-bg h1, .cd-fixed-bg h2 {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 90%;
  max-width: 1170px;
  text-align: center;
  font-size: 30px;
  font-size: 1.875rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  color: white;
}
.cd-fixed-bg.cd-bg-1 {
  background-image: url("../img/Outside-compressor.jpg");
    font-family: "Century Gothic", sans-serif;
}
.mobile-letters{
    display: none;
}
#menu-letter-mobile{
    display: none;
}

#mobile-letter-style{
    display: none;
}
.cd-fixed-bg.cd-bg-2 {
  background-image: url("../img/img1.jpg");
}
.cd-fixed-bg.cd-bg-3 {
  background-image: url("../img/Newimg1.jpg");
}
.cd-fixed-bg.cd-bg-4 {
  background-image: url("../img/Unique-compressor.jpg");
}
.cd-fixed-bg.cd-bg-5 {
    background-image: url("../img/img10.jpg");
}
@media only screen and (min-width: 768px) {
  .cd-fixed-bg h1, .cd-fixed-bg h2 {
    font-size: 36px;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-fixed-bg {
    background-attachment: fixed;
  }
  .cd-fixed-bg h1, .cd-fixed-bg h2 {
    font-size: 48px;
    font-weight: 300;
  }
}

.cd-scrolling-bg {
  position: relative;
  min-height: 100%;
  padding: 4em 0;
  line-height: 1.6;
  /*box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);*/
  z-index: 2;
}
.cd-scrolling-bg.cd-color-1 {
  background-color: white;
  /*color: #a6989a;*/
}
.cd-scrolling-bg.cd-color-2 {
  background-color: white;
  /*color: #3d3536;*/
}
.cd-scrolling-bg.cd-color-3 {
  background-color: white;
  /*color: #3d3536;*/
}
@media only screen and (min-width: 768px) {
  .cd-scrolling-bg {
    padding: 8em 0;
    font-size: 20px;
    line-height: 2;
    font-weight: 300;
  }
}

/*@media only screen and (min-width: 1800px) {*/
    /*.cd-header{*/
        /*max-width: 1800px !important;*/
        /*margin-left: 2% !important;*/
    /*}*/
/*}*/