/*Make sure your selectors are very specific, you can accidentally overide builder css if you are not careful*/
/*Do not edit positioning, width, height in CSS, set that in the markup*/
/*CSS Changes, are somewhat permanent, user cannot change these, they can overide them via element inline style, but thats about it*/

/* background */
.fonts {
  font-family: 'Stint Ultra Condensed', cursive;
  font-family: 'Alegreya', serif;
  font-family: 'Grand Hotel', cursive;
}

.natfoo.default {
  font-family: 'Alegreya', serif;
  font-size: 18px;
  /*ul*/
  /*li*/
  /*a*/
  /*hover*/
  /*selected page*/
}
.natfoo.default.pagebg {
  background: #ffffff;
}
.natfoo.default .header-bg {
  background: url("assets/natfoo-header-bg.jpg") top center repeat-x;
  width: 100%;
}
.natfoo.default .footer-bg {
  background: url("assets/natfoo-footer-bg.jpg") bottom center repeat-x;
  width: 100%;
}
.natfoo.default p {
  margin: 0;
  padding: 0;
}
.natfoo.default h1,
.natfoo.default h2,
.natfoo.default h3,
.natfoo.default h4,
.natfoo.default h5,
.natfoo.default h6 {
  padding: 0;
  margin: 0;
}
.natfoo.default h1 {
  font-family: 'Grand Hotel', cursive;
  font-size: 48px;
  line-height: 65px;
}
.natfoo.default h3 {
  font-family: 'Stint Ultra Condensed', cursive;
  font-size: 36px;
  line-height: 38px;
  text-transform: capitalize;
}
.natfoo.default h6 {
  font-family: 'Grand Hotel', cursive;
}
.natfoo.default h6.heading {
  font-size: 18px;
  line-height: 30px;
}
.natfoo.default h6.footer {
  font-size: 30px;
  line-height: 36px;
}
.natfoo.default h6.main-banner {
  font-size: 30px;
  line-height: 40px;
}
.natfoo.default h6.products {
  font-size: 24px;
  line-height: 36px;
}
.natfoo.default p {
  font-family: 'Alegreya', serif;
  font-size: 18px;
  line-height: 30px;
}
.natfoo.default .navigation-plugin {
  background-color: none !important;
  border: none;
  text-align: left;
}
.natfoo.default .navigation-plugin .k-link:hover {
  color: #ffffff !important;
  background-color: none !important;
  border-bottom: 1px solid #ffffff !important;
}
.natfoo.default .navigation-plugin .k-link:active {
  color: #ffffff !important;
  background-color: none !important;
  border-bottom: 1px solid #ffffff !important;
}
.natfoo.default .navigation-plugin .k-item.selected-page > .k-link {
  color: #ffffff !important;
  background-color: none !important;
  border-bottom: 1px solid #ffffff !important;
}
.natfoo.default .navigation-plugin .k-item > .k-link {
  text-decoration: none !important;
  padding: 0 !important;
}
.natfoo.default .navigation-plugin .k-header {
  background: none !important;
}
.natfoo.default .navigation-plugin ul {
  background-color: none;
  border: none;
  text-align: left;
  margin: 0px;
  padding: 0;
}
.natfoo.default .navigation-plugin ul .k-item {
  border-width: 0 0px 0 0 !important;
  vertical-align: top;
  border-color: none !important;
  background: none !important;
  zoom: 1;
  box-sizing: content-box;
  font-family: 'Stint Ultra Condensed', cursive;
  font-weight: 400;
  font-size: 30px;
  line-height: 36px;
  list-style: none;
  padding: 0 45px 0 0;
}
.natfoo.default .navigation-plugin ul .k-item:last-child {
  padding: 0;
}
.natfoo.default .navigation-plugin ul .k-item .k-link {
  line-height: 36px;
}
.natfoo.default .navigation-plugin ul li a {
  color: #ffffff;
  text-transform: capitalize;
}
.natfoo.default .k-animation-container {
  padding-left: 0 !important;
  margin-left: 0 !important;
  margin-top: 6px !important;
}
.natfoo.default .navigation-plugin .k-menu .k-animation-container ul.k-group {
  background: #d6d5d5 !important;
  margin: 0 !important;
  -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
}
.natfoo.default .navigation-plugin .k-menu .k-animation-container .k-group .k-item {
  margin: 0 !important;
  width: 100% !important;
  border-bottom: 1px solid #BBBBBB !important;
  padding: 0 !important;
  display: block !important;
  text-align: left !important;
}
.natfoo.default .navigation-plugin .k-menu .k-animation-container .k-group li a {
  padding: 10px 15px !important;
  font-size: 14px;
  line-height: 18px !important;
  background-color: #d6d5d5 !important;
  text-transform: capitalize;
  color: #514f4f !important;
  font-family: Tahoma, Geneva, sans-serif;
  box-sizing: content-box;
  border-bottom: none !important;
}
.natfoo.default .navigation-plugin .k-menu .k-animation-container .k-group .k-item.k-state-hover a {
  background-color: rgba(0, 0, 0, 0.4) !important;
  color: #ffffff !important;
}
.natfoo.default .navigation-plugin .k-menu .k-animation-container .k-group .selected-page a {
  color: #ffffff !important;
}
.natfoo.default .navigation-plugin .k-menu .k-state-border-down {
  background: none !important;
  color: #ffffff !important;
}
.natfoo.default div.form-plugin #FormHeading-id {
  display: none;
}
.natfoo.default div.form-plugin table table label {
  font-weight: normal;
}
.natfoo.default div.form-plugin label {
  font-family: 'Alegreya', serif;
  font-size: 14px;
  font-weight: 400;
  color: #444444;
  text-transform: lowercase;
  width: 200px;
  text-transform: capitalize;
  display: block;
  padding-bottom: 0px;
}
.natfoo.default div.form-plugin input[type="text"],
.natfoo.default div.form-plugin textarea {
  background-color: #dfcac2;
  outline: none;
  border: none;
  padding: 5px 5px;
  font-family: 'Alegreya', serif;
  font-size: 14px;
  font-weight: 400;
  color: #666666;
  width: 200px;
  min-width: 200px;
}
.natfoo.default div.form-plugin #subject-id input[type="text"] {
  width: 425px;
  min-width: 425px;
}
.natfoo.default div.form-plugin textarea {
  width: 425px;
  min-width: 425px;
  height: 70px;
}
.natfoo.default div.form-plugin .form-element-wrapper {
  display: block;
  padding-bottom: 3px;
}
.natfoo.default div.form-plugin .form-element-wrapper#name-id table .FirstName input {
  margin-right: 0px;
  display: block;
}
.natfoo.default div.form-plugin .form-element-wrapper#email-id {
  display: inline-block !important;
  width: 200px;
  margin-right: 17px;
}
.natfoo.default div.form-plugin .form-element-wrapper#phone-id {
  display: inline-block !important;
  width: 200px;
}
.natfoo.default div.form-plugin input[type="submit"] {
  font-family: 'Alegreya', serif;
  font-size: 18px;
  font-weight: 400;
  text-transform: uppercase;
  color: #666666;
  background: #e6cf1d;
  padding: 4px 15px;
  margin: 10px 0;
  display: block;
  border: none;
}
.natfoo.default .trans {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
}
.natfoo.default p.lh27,
.natfoo.default h1.lh27,
.natfoo.default h2.lh27,
.natfoo.default h3.lh27,
.natfoo.default h4.lh27,
.natfoo.default h5.lh27,
.natfoo.default h6.lh27 {
  line-height: 27px;
}
.natfoo.default p.lh25,
.natfoo.default h1.lh25,
.natfoo.default h2.lh25,
.natfoo.default h3.lh25,
.natfoo.default h4.lh25,
.natfoo.default h5.lh25,
.natfoo.default h6.lh25 {
  line-height: 25px;
}
.natfoo.default p.lh24,
.natfoo.default h1.lh24,
.natfoo.default h2.lh24,
.natfoo.default h3.lh24,
.natfoo.default h4.lh24,
.natfoo.default h5.lh24,
.natfoo.default h6.lh24 {
  line-height: 24px;
}
.natfoo.default p.lh22,
.natfoo.default h1.lh22,
.natfoo.default h2.lh22,
.natfoo.default h3.lh22,
.natfoo.default h4.lh22,
.natfoo.default h5.lh22,
.natfoo.default h6.lh22 {
  line-height: 22px;
}
.natfoo.default p.left,
.natfoo.default h1.left,
.natfoo.default h2.left,
.natfoo.default h3.left,
.natfoo.default h4.left,
.natfoo.default h5.left,
.natfoo.default h6.left {
  text-align: left;
}
.natfoo.default p.center,
.natfoo.default h1.center,
.natfoo.default h2.center,
.natfoo.default h3.center,
.natfoo.default h4.center,
.natfoo.default h5.center,
.natfoo.default h6.center {
  text-align: center;
}
.natfoo.default p.right,
.natfoo.default h1.right,
.natfoo.default h2.right,
.natfoo.default h3.right,
.natfoo.default h4.right,
.natfoo.default h5.right,
.natfoo.default h6.right {
  text-align: right;
}
.natfoo.default p.bold,
.natfoo.default h1.bold,
.natfoo.default h2.bold,
.natfoo.default h3.bold,
.natfoo.default h4.bold,
.natfoo.default h5.bold,
.natfoo.default h6.bold {
  font-weight: 700;
}
.natfoo.default p.semibold,
.natfoo.default h1.semibold,
.natfoo.default h2.semibold,
.natfoo.default h3.semibold,
.natfoo.default h4.semibold,
.natfoo.default h5.semibold,
.natfoo.default h6.semibold {
  font-weight: 600;
}
.natfoo.default p.normal,
.natfoo.default h1.normal,
.natfoo.default h2.normal,
.natfoo.default h3.normal,
.natfoo.default h4.normal,
.natfoo.default h5.normal,
.natfoo.default h6.normal {
  font-weight: 400;
}
.natfoo.default p.light,
.natfoo.default h1.light,
.natfoo.default h2.light,
.natfoo.default h3.light,
.natfoo.default h4.light,
.natfoo.default h5.light,
.natfoo.default h6.light {
  font-weight: 300;
}
.natfoo.default p.white,
.natfoo.default h1.white,
.natfoo.default h2.white,
.natfoo.default h3.white,
.natfoo.default h4.white,
.natfoo.default h5.white,
.natfoo.default h6.white {
  color: #ffffff;
}
.natfoo.default p.black,
.natfoo.default h1.black,
.natfoo.default h2.black,
.natfoo.default h3.black,
.natfoo.default h4.black,
.natfoo.default h5.black,
.natfoo.default h6.black {
  color: #000000;
}
.natfoo.default p.gray,
.natfoo.default h1.gray,
.natfoo.default h2.gray,
.natfoo.default h3.gray,
.natfoo.default h4.gray,
.natfoo.default h5.gray,
.natfoo.default h6.gray {
  color: #666666;
}
.natfoo.default p.orange,
.natfoo.default h1.orange,
.natfoo.default h2.orange,
.natfoo.default h3.orange,
.natfoo.default h4.orange,
.natfoo.default h5.orange,
.natfoo.default h6.orange {
  color: #ff9d74;
}
.natfoo.default p.yellow,
.natfoo.default h1.yellow,
.natfoo.default h2.yellow,
.natfoo.default h3.yellow,
.natfoo.default h4.yellow,
.natfoo.default h5.yellow,
.natfoo.default h6.yellow {
  color: #e6cf1d;
}
.natfoo.default p.p0,
.natfoo.default h1.p0,
.natfoo.default h2.p0,
.natfoo.default h3.p0,
.natfoo.default h4.p0,
.natfoo.default h5.p0,
.natfoo.default h6.p0 {
  padding: 0;
}