@font-face {
  font-family: "socialmedia";
  src:url("/fonts/socialmedia.eot");
  src:url("/fonts/socialmedia.eot?#iefix") format("embedded-opentype"),
    url("/fonts/socialmedia.woff") format("woff"),
    url("/fonts/socialmedia.ttf") format("truetype"),
    url("/fonts/socialmedia.svg#socialmedia") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before {
  font-family: "socialmedia" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "socialmedia" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-facebook-circle:before {
  content: "\61";
}
.icon-twitter-circled:before {
  content: "\62";
}
.icon-twitter:before {
  content: "\63";
}
.icon-facebook:before {
  content: "\64";
}
.icon-instagram:before {
  content: "\65";
}
.icon-instagrem:before {
  content: "\66";
}
.icon-vimeo:before {
  content: "\67";
}
.icon-youtube-alt:before {
  content: "\68";
}
.icon-youtube:before {
  content: "\69";
}
.icon-phone:before {
  content: "\6a";
}
.icon-clock:before {
  content: "\6b";
}
.icon-mail:before {
  content: "\6c";
}
.icon-pin:before {
  content: "\6d";
}
.icon-search:before {
  content: "\6e";
}
.icon-search-1:before {
  content: "\6f";
}
.icon-up-open-big:before {
  content: "\70";
}
.icon-down-open-big:before {
  content: "\71";
}
.icon-right-open-big:before {
  content: "\72";
}
.icon-left-open-big:before {
  content: "\73";
}
.icon-dot-circle-o:before {
  content: "\74";
}
.icon-circle:before {
  content: "\75";
}
.icon-folder-open:before {
  content: "\76";
}
.icon-folder:before {
  content: "\77";
}
.icon-users-1:before {
  content: "\79";
}
.icon-question-circle:before {
  content: "\78";
}
.icon-question:before {
  content: "\7a";
}
.icon-home:before {
  content: "\41";
}
.icon-wrench:before {
  content: "\42";
}
.icon-wrench-1:before {
  content: "\43";
}
.icon-rss:before {
  content: "\44";
}
.icon-feed-rss-2:before {
  content: "\46";
}
.icon-camera:before {
  content: "\45";
}
.icon-social-youtube-outline:before {
  content: "\47";
}
.icon-info:before {
  content: "\49";
}
.icon-info-circled:before {
  content: "\48";
}
.icon-camera-1:before {
  content: "\4a";
}
.icon-medal-rank-star:before {
  content: "\4c";
}
.icon-locked:before {
  content: "\4b";
}

.headers_list {
  float: left;
  width: 100%;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
.filterform {
  display: inline-block;
  max-width: 400px;
  background-color: #333;
  width: 100%;
  color: #fff;
  padding: 12px;
  margin-bottom: 12px;
  border-radius: 8px;
}


[id*=tabbedpanels],
[id^=tabbedpanels] {
    width: 100%;
    float: left;
    text-align: left;
    position: relative;
    margin-top: 12px;
    margin-bottom: 24px;
    border: 1px solid #eee;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

[id*=tabbedpanels] h3,
[id^=tabbedpanels] h3 {
    font-weight: 400;
    font-size: 17px;
    line-height: auto;
    margin-top: 0;
    margin-bottom: 0;
    color: #333
}

[id*=tabbedpanels] h3 a,
[id^=tabbedpanels] h3 a {
    width: 100%;
    float: left;
    position: relative;
    padding: 8px 8px 8px 32px;
    background-color: #eee;
    border-bottom: 1px solid #505050;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px
}

[id*=tabbedpanels] div,
[id^=tabbedpanels] div {
    padding: 8px;
    float: left;
    background-color: #fff;
    color: #333;
    width: 100%
}

[id*=tabbedpanels] td div,
[id^=tabbedpanels]td div {
    padding: 0;
    float: left;
    background-color: #fff;
    color: #333
}

[id*=tabbedpanels] td p,
[id^=tabbedpanels]td p {
    padding: 0;
    margin: 0;
    float: left;
    background-color: #fff;
    color: #333
}

[id*=tabbedpanels] h3 a:before,
[id^=tabbedpanels] h3 a:before {
    position: absolute;
    top: 8px;
    left: 4px;
    content: 'r';
    font-size: 24px;
    font-family: SocialMedia;
    color: #e5487d;
}

[id*=tabbedpanels] .open a,
[id^=tabbedpanels] .open a {
    width: 100%;
    float: left;
    position: relative;
    padding: 8px 8px 8px 32px;
    background-color: #7b7b7b;
    color: #eee
}

[id*=tabbedpanels] .open a:before,
[id^=tabbedpanels] .open a:before {
    position: absolute;
    top: 8px;
    left: 4px;
    content: 'q';
    font-size: 24px;
    font-family: SocialMedia;
    color: #FFF
}



.google-maps {
    margin-top: 12px;
    position: relative;
    padding-bottom: 75%;
    // This is the aspect ratio height: 0;
    overflow: hidden;
}
.google-maps iframe {

    position: absolute;
    top: 0;
    left: 0;
    width: 100%!important;
    height: 100%!important;
}

.bookingform {
  display: inline-block;
  /* max-width: 600px; */
  background-color: #333;
  width: 100%;
  color: #fff;
  padding: 12px;
  margin-top: 12px;
  margin-bottom: 12px;
  border-radius: 8px;
}

.bookingform h2 {
 color: #eee;
 padding: 32px;
}

.bookingform form input, .bookingform form textarea{
 float: left;
  margin-top: 12px;
  margin-bottom: 12px;
}

.filterform label {
  float: left;
  width: 100%;
  color: #f8ac00;
  font-size: 24px;
  margin-bottom: 12px;
}

.filterform input {
  float: left;
  background-color: #fff;
  width: 100%;
  color: #333;
  padding: 8px;
  font-size: 16px;
  border-radius: 8px;
}





#otherinfosheets {
  float: left;
  background-color: #333;
  width: 100%;
  padding: 12px;
  margin-top: 12px;
}

.icontable {
  float: left;
  width: 100%;
  
}

.iconblock {
  float: left;
  width: 20%;
  padding: 4px;
  border: 1px solid #fff;
  background-color: #494885;
  margin-top: 4px;
  color: #fff;
  border-radius: 4px;
}

.infoicon {
  float: left;
  width: 100%;
  
}

.infoicon img {
  border-radius: 50%;
  border: 2px solid #fff;
}




.icondetails {
  font-size: 11px;
}


#otherinfosheets  h3{
 color: #e5487d;
 font-size: 22px;
 font-weight: 300;
}

.infosheetbox {
  float: left;
  width: 100%;
  /* border: 4px solid #8ad7df; */
  /* padding: 0px; */
  }

.infosheetmainimage img {
  float: left;
  width: 100%;
  border-top: 12px solid #333;
  border-bottom: 12px solid #333;

  }

  .infosheetmainimage {
  float: left;
  width: 100%;
  margin-top: 12px;

  }

.infosheettitle {
  float: left;
  width: 100%;

  }



  .infosheetitem {
  width: 32.333%;
  border: 1px solid #333333;
  padding: 0px;
  display: block;
  margin: 0.5%;
  float: left;
  
  }

  .infosheetitem h2 {
      font-family: 'Open Sans Condensed', sans-serif;
    font-size: 20px;
    margin: 0px;
    padding-bottom: 12px;
    font-weight: 700;

  }

.infosheetitemsmall
{
  width: 19%;
  border: 1px solid #f8ac00;
  padding: 0px;
  display: block;
  float: left;
  background-color: #333;
  color: #fff;
  margin: 0.5%;
  margin-bottom: 4px;

  }

  .infosheetitemsmall h2
{
font-size: 14px;
color: #e5487d;
  }


 .infosheetthumbimage{
  float: left;
  width: 100%;
  }


  .infosheetthumbimage img {
  float: left;
  width: 100%;
  }




    .infosheetthumb {
  float: left;
  margin-bottom: 8px;
  width: 100%;
  }


  .infosheetthumb img {
  float: left;
  width: 100%;
  }

  

.infosheetleft {
  float: left;
  width: 50%;
  padding: 4px;
  }

  .infosheetleft img {
  float: left;
  width: 100%;


  }


  .infosheetright{
  float: left;
  width: 50%;
  padding: 4px;
  }

.infosheetdescription {
    float: left;
    width: 100%;
    /* background-color: #d4f9ff; */
    text-align: center;
    padding: 8px;
}

.infosheetdescription p{

    font-size: 19px;
}



  .infodetails {
    float: left;
    width: 100%;
    background-color: #d4f9ff;
    text-align: left;
    padding: 8px;
  }

  .detailheading {

    font-size: 22px;
    font-weight: 600;
    color: #494885;
    font-family: 'Open Sans Condensed', sans-serif;
  }

    .thedetails {

    font-size: 14px;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    padding-bottom: 4px;
  }

    .caredetails {
    margin-top: 4px;
    float: left;
    width: 100%;
    background-color: #8ad7df;
    text-align: left;
    padding: 8px;
  }

.mb-style-3 {
    width: 100%
}

.mb-style-3 blockquote {
    background: rgba(62, 62, 62, 1.0);
    padding: 8px;
    padding-bottom: 8px;
    border-radius: 5px;
    margin: 32px 0 0;
    color: #333;
    position: relative;
    float: left;
    width: 100%;
}


.mb-style-3 blockquote:before {
    content: '\201C';
    position: absolute;
    font-size: 140px;
    top: -72px;
    left: -12px;
    color: #e5487d;
    text-shadow: 7px 14px 10px rgba(0, 0, 0, .1);
}

.mb-style-3 .mb-attribution {
    text-align: right;
    float: left;
    width: 100%;
    position: relative;
    padding-right: 90px;
    margin-bottom: 24px
}

.mb-style-3 .mb-attribution p {
    line-height: 1;
    padding-top: 12px;
    padding-right: 24px;
    margin: 0
}

cite {
    font-style: normal;
    padding-right: 24px;
    font-size: 13px
}

.mb-style-3 .mb-thumb {
    display: block;
    width: 90px;
    height: 90px;
    border: 5px solid #ff5c39;
    /* border-radius: 50%; */
    position: absolute;
    right: 10px;
    top: -25px;
    box-shadow: inset 1px 1px 4px rgba(0, 0, 0, .5), 0 2px 3px rgba(0, 0, 0, .6);
    overflow: hidden;
}

.mb-style-3 .mb-thumb img {
    width: 100%;
    height: auto
}

.mb-style-3 .mb-author {
    font-size: 18px;
    color: #e5487d;
}

.mb-style-3 cite a {
    font-style: normal;
    color: #fff;
    line-height: 1;
    padding-right: 24px;
    margin: 0
}

.mb-style-3 cite a:hover {
    color: rgba(188, 147, 200, 1);
    text-shadow: 0 1px 1px rgba(255, 255, 255, .7)
}

.mb-style-3 .mb-thumb {
    display: block;
    width: 90px;
    height: 90px;
    border: 5px solid #e5487d;
    /* border-radius: 50%; */
    position: absolute;
    right: 10px;
    top: -25px;
    box-shadow: inset 1px 1px 4px rgba(0, 0, 0, .5), 0 2px 3px rgba(0, 0, 0, .6);
    overflow: hidden;
}

.mb-style-3 .mb-thumb img {
    width: 100%;
    height: auto
}

.mb-style-3 .mb-author {
    font-size: 18px;
    color: #e5487d;
}

.mb-style-3 cite a {
    font-style: normal;
    color: #fff;
    line-height: 1;
    padding-right: 24px;
    margin: 0
}

.mb-style-3 cite a:hover {
    color: rgba(188, 147, 200, 1);
    text-shadow: 0 1px 1px rgba(255, 255, 255, .7)
}




.stuff h1,
.stuff h2 {
    background-color: rgba(0, 0, 0, .5)
}

.mb-style-3 blockquote p {
    font-size: 14px;
    color: #eaeaea;
    font-weight: 400;
    font-style: normal;
    position: relative;
    padding-top: 8px;
    font-family: 'Open Sans', sans-serif;
}

.mb-style-3 blockquote h4 {
    font-family: 'Over the Rainbow';
    font-size: 28px;
    line-height: 1.8;
    color: #ffffff;
    font-weight: 400;
    position: relative;
}

#primary_nav_wrap
{
  margin-top: 24px;
  position: fixed;
  z-index: 10000;
  right: 32px;
      -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
}

.scrolled #primary_nav_wrap
{
  margin-top: 12px;
  position: fixed;
  z-index: 10000;
  right: 32px;
      -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
}

#primary_nav_wrap ul
{
  list-style:none;
  position:relative;
  float:left;
  margin:0;
  padding:0
}

#primary_nav_wrap ul a
{
  display:block;
  text-decoration:none;
  font-weight:700;
  font-size:12px;
  line-height:32px;
  padding: 0 20px;
  color: #f8ac00;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 22px;
  padding-bottom: 4px;
  font-weight: 300;
  text-transform: uppercase;
  }

#primary_nav_wrap ul li
{
  position:relative;
  float:left;
  margin:0;
  padding:0
}

#primary_nav_wrap ul li.current-menu-item
{
  border-bottom: 2px solid #e5487d;
}

#primary_nav_wrap ul li:hover
{
  background:#f6f6f6
}

#primary_nav_wrap ul ul
{
  display:none;
  position:absolute;
  top:100%;
  left:0;
  background:#fff;
  padding:0
}

#primary_nav_wrap ul ul li
{
  float:none;
  width:200px
}

#primary_nav_wrap ul ul a
{
  line-height:120%;
  padding:10px 15px
}

#primary_nav_wrap ul ul ul
{
  top:0;
  left:100%
}

#primary_nav_wrap ul li:hover > ul
{
  display:block
}




/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}


.nuvo_imagearea {
    padding: 8px;
    /* border: 1px solid #ddd; */
}

.nuvo_imagearea {
    width: 33%;
    padding: 4px;
    margin-bottom: 8px;
    float: left;
    max-width: 300px;
}

img {
   max-width: 100%;
   /* height: auto; */
   vertical-align: top;
   height: auto;
}

.testimonials img {
border-radius: 4px;
height: 100px;
}


.nuvo_imagearea.circularpic img{
    border-radius: 50%;
}
.right {
    float: right;
    margin-right: 0;
    margin-left: 8px;
}
.left {
    float: left;
    margin-left: 0;
    margin-right: 8px;
}

.clippingarea {
  position: relative;
    z-index: 20;
}

.bannerwrapper {
  position: relative;
  float: left;
  width: 100%;

}

#instarea {
  float: left;
  width: auto;
  padding: 32px;
  width: 100%;
  background-color: #eee;
  margin-top: 24px;
  border-top: 1px solid #ccc;
}
#instafeed {
  display: inline-block;
  width: 100%;
  position: relative;
  max-width: 1024px;
    border: 1px solid #fff;
}


.instabox {
  float: left;
  width: 20%;
  border: 1px solid #fff;
}


.instabox:nth-child(1) {
  width: 20%;

  
}

.instabox:nth-child(2) {
  width: 10%;
   position: absolute;
   left: 20%;
 top: 0%
  
}
.instabox:nth-child(3) {
  width: 10%;
 position: absolute;
 left: 20%;
 bottom: 0%
  
}

.instabox:nth-child(4) {
  width: 20%;
 position: absolute;
 left: 30%;
 top: 0%
  
}

.instabox:nth-child(5) {
  width: 10%;
  height: 100%;
 position: absolute;
 left: 50%;
 top: 0%;
 overflow: hidden;
  
}

.instabox:nth-child(5) img {
  width: 200%;
  height: 100%;
 position: absolute;
 left: -50%;
 top: 0%;
  
}

.instabox:nth-child(6) {
  width: 20%;
 position: absolute;
 left: 60%;
 top: 0%
  
}

.instabox:nth-child(7) {
  width: 20%;
  position: absolute;
  left: 80%;
  top: 0%;
}




.instabox img{
  float: left;
  width: 100%;
}


p {
  font-size: 15px;
  margin-top: 12px;
  margin-bottom: 12px;
}

.scrolllink a{
  border: 2px solid #333;
  position: absolute;
  width: 40px;
  height: 40px;
  z-index: 20000;
  left: 48%;
  right: 50%;
  bottom: 10px;
  background-color: #fff;
 
}

.scrolllink a:after{content: "q";font-family: 'SocialMedia';position: absolute;font-size: 24px;width: 100%;text-align: center;}



.scrolllinkbottom a{
  border: 2px solid #333;
  position: fixed;
  width: 40px;
  height: 40px;
  z-index: 20000;
  right: 0%;
  bottom: 0px;
  background-color: #fff;
}

.scrolllinkbottom a:after{
content: "p";
font-family: 'SocialMedia';
  position: absolute;
  font-size: 24px;
  width: 100%;
  text-align: center;
  right: 0px;
}

article.h-entry {
  background-color: #fff;
  float: left;
  padding: 8px;
width: 100%;
  padding-bottom: 32px;
}

.fb-like {
width: 100%;
padding: 8px;
margin-top: 8px;
margin-bottom: 8px;
  float: left;
  border: 1px solid #eee;
}
ol, ul {
  list-style: none;
}


.blogbanner {
  width: 100%;
  float: left;
  margin-top: 12px;
  margin-bottom: 32px;
}

.blogbanner img{
  float: left;
  width: 100%;
  padding: 8px;
  border: 1px solid #ccc;
  background-color: #fff;

}

input[type=month], input[type=week], input[type=email], input[type=number], input[type=search], input[type=tel], input[type=time], input[type=url], input[type=color], input[type=text], input[type=password], input[type=date], input[type=datetime], input[type=datetime-local], textarea {
    -webkit-appearance: none;
    border-radius: 0;
    background-color: #FFF;
    font-family: inherit;
    border-style: solid;
    border-width: 1px;
    border-color: #ccc;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    color: rgba(0, 0, 0, .75);
    display: block;
    font-size: .875em;
    margin: 0em;
    padding: .5em;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: all .15s linear;
}
input[type=month]:focus, input[type=week]:focus, input[type=email]:focus, input[type=number]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=time]:focus, input[type=url]:focus, input[type=color]:focus, input[type=text]:focus, input[type=password]:focus, input[type=date]:focus, input[type=datetime]:focus, input[type=datetime-local]:focus, textarea:focus {
    background: #fafafa;
    border-color: #999;
    outline: 0;
}
fieldset[disabled] input[type=month], fieldset[disabled] input[type=week], fieldset[disabled] input[type=email], fieldset[disabled] input[type=number], fieldset[disabled] input[type=search], fieldset[disabled] input[type=tel], fieldset[disabled] input[type=time], fieldset[disabled] input[type=url], fieldset[disabled] input[type=color], fieldset[disabled] input[type=text], fieldset[disabled] input[type=password], fieldset[disabled] input[type=date], fieldset[disabled] input[type=datetime], fieldset[disabled] input[type=datetime-local], fieldset[disabled] textarea, input[type=month]:disabled, input[type=month][disabled], input[type=month][readonly], input[type=week]:disabled, input[type=week][disabled], input[type=week][readonly], input[type=email]:disabled, input[type=email][disabled], input[type=email][readonly], input[type=number]:disabled, input[type=number][disabled], input[type=number][readonly], input[type=search]:disabled, input[type=search][disabled], input[type=search][readonly], input[type=tel]:disabled, input[type=tel][disabled], input[type=tel][readonly], input[type=time]:disabled, input[type=time][disabled], input[type=time][readonly], input[type=url]:disabled, input[type=url][disabled], input[type=url][readonly], input[type=color]:disabled, input[type=color][disabled], input[type=color][readonly], input[type=text]:disabled, input[type=text][disabled], input[type=text][readonly], input[type=password]:disabled, input[type=password][disabled], input[type=password][readonly], input[type=date]:disabled, input[type=date][disabled], input[type=date][readonly], input[type=datetime]:disabled, input[type=datetime][disabled], input[type=datetime][readonly], input[type=datetime-local]:disabled, input[type=datetime-local][disabled], input[type=datetime-local][readonly], textarea:disabled, textarea[disabled], textarea[readonly] {
    background-color: #DDD;
    cursor: default;
}
input[type=month].radius, input[type=week].radius, input[type=email].radius, input[type=number].radius, input[type=search].radius, input[type=tel].radius, input[type=time].radius, input[type=url].radius, input[type=color].radius, input[type=text].radius, input[type=password].radius, input[type=date].radius, input[type=datetime].radius, input[type=datetime-local].radius, textarea.radius {
    border-radius: 3px;
}
form .row .prefix-radius.row.collapse button, form .row .prefix-radius.row.collapse input, form .row .prefix-radius.row.collapse select, form .row .prefix-radius.row.collapse textarea {
    border-radius: 0 3px 3px 0;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-top-right-radius: 3px;
}
form .row .postfix-radius.row.collapse button, form .row .postfix-radius.row.collapse input, form .row .postfix-radius.row.collapse select, form .row .postfix-radius.row.collapse textarea, form .row .prefix-radius.row.collapse .prefix {
    border-radius: 3px 0 0 3px;
    -webkit-border-bottom-left-radius: 3px;
    -webkit-border-top-left-radius: 3px;
}
form .row .postfix-radius.row.collapse .postfix {
    border-radius: 0 3px 3px 0;
    -webkit-border-bottom-right-radius: 3px;
    -webkit-border-top-right-radius: 3px;
}
form .row .prefix-round.row.collapse button, form .row .prefix-round.row.collapse input, form .row .prefix-round.row.collapse select, form .row .prefix-round.row.collapse textarea {
    border-radius: 0 1000px 1000px 0;
    -webkit-border-bottom-right-radius: 1000px;
    -webkit-border-top-right-radius: 1000px;
}
form .row .postfix-round.row.collapse button, form .row .postfix-round.row.collapse input, form .row .postfix-round.row.collapse select, form .row .postfix-round.row.collapse textarea, form .row .prefix-round.row.collapse .prefix {
    border-radius: 1000px 0 0 1000px;
    -webkit-border-bottom-left-radius: 1000px;
    -webkit-border-top-left-radius: 1000px;
}
form .row .postfix-round.row.collapse .postfix {
    border-radius: 0 1000px 1000px 0;
    -webkit-border-bottom-right-radius: 1000px;
    -webkit-border-top-right-radius: 1000px;
}
input[type=submit] {
    -webkit-appearance: none;
    border-radius: 0;
    float: left;
    font-size: 14px;
    color: #fff;
    padding: 4px 12px;
    margin-top: 0px;
    border: 0px solid #ccc;
    background-color: #5C504C;
}


textarea[rows] {
    height: auto;
}
textarea {
    max-width: 100%}
select {

    background-color: #FAFAFA;
    background-image: url(data:image/svg+xml;
    base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);
    background-position: 100% center;
    background-repeat: no-repeat;
    border-style: solid;
    border-width: 1px;
    border-color: #ccc;
    padding: .5em;
    font-size: .875em;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    color: rgba(0, 0, 0, .75);
    line-height: normal;
    border-radius: 0;
    height: 2.3125em;
}
select::-ms-expand {
    display: none;
}
select.radius {
    border-radius: 3px;
}
select:hover {
    background-color: #f3f3f3;
    border-color: #999;
}
select:disabled {
    background-color: #DDD;
    cursor: default;
}
select[multiple] {
    height: auto;
}
input[type=file], input[type=checkbox], input[type=radio], select {

    margin: 0 0 1em;
}
input[type=checkbox]+label, input[type=radio]+label {
    display: inline-block;
    margin-left: .5em;
    margin-right: 1em;
    margin-bottom: 0;
    vertical-align: baseline;
}
input[type=file] {
    width: 100%}
fieldset {
    border: 1px solid #DDD;
    padding: 1.25em;
    /* margin: 1.125em 0; */
    background-color: #fff;
}
fieldset legend {
    font-weight: 700;
    background: #FFF;
    padding: 0 .1875em;
    margin: 0 0 0 -.1875em;
}
[data-abide] .error small.error, [data-abide] .error span.error, [data-abide] small.error, [data-abide] span.error {
    display: block;
    padding: .375em .5625em .5625em;
    margin-top: -1px;
    margin-bottom: 1em;
    font-size: .75em;
    font-weight: 400;
    font-style: italic;
    background: #f04124;
    color: #FFF;
}
[data-abide] small.error, [data-abide] span.error {
    display: none;
}
small.error, span.error {
    display: block;
    padding: .375em .5625em .5625em;
    margin-top: -1px;
    margin-bottom: 1em;
    font-size: .75em;
    font-weight: 400;
    font-style: italic;
    background: #f04124;
    color: #FFF;
}
.error input, .error select, .error textarea {
    margin-bottom: 0;
}
.error input[type=checkbox], .error input[type=radio] {
    margin-bottom: 1em;
}
.error label, .error label.error {
    color: #f04124;
}
.error small.error {
    display: block;
    padding: .375em .5625em .5625em;
    margin-top: -1px;
    margin-bottom: 1em;
    font-size: .75em;
    font-weight: 400;
    font-style: italic;
    background: #f04124;
    color: #FFF;
}
.error>label>small {
    color: #676767;
    background: 0 0;
    padding: 0;
    text-transform: capitalize;
    font-style: normal;
    font-size: 60%;
    margin: 0;
    display: inline;
}
.error span.error-message {
    display: block;
}
input.error, select.error, textarea.error {
    margin-bottom: 0;
}
label.error {
    color: #f04124;
}
#form1_submit {
    float: right;
    margin-top: 12px;
    width: 20%;
    border: 1px solid #ccc;
    padding: 4px;
    margin-bottom: 4px;
}








.hfeed {

width: 100%;
float: left;
background-color: #fff;
text-align: left;

}

.hentry {

width: 100%;
float: left;
position: relative;
}

.hentrytwo {

width: 100%;
float: left;
position: relative;
}

.hentry .blogimage {

width: 50%;
float: left;

}

.hentrytwo .blogimage {

width: 50%;
float: right;

}

.entry-published {
  float: left;
  width: 100%;
  border-bottom: 1px solid #eee;
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.blogimage img{

width: 100%;
float: left;

}

.blogdetails {width: 50%;float: left;padding: 24px;position: relative;height: 100%;}

.blogdetails .shinybuttons a {

float: left;
padding: 8px;
border: 1px solid #eee;
margin-top: 24px;

}

.blogdetails h3 {font-size: 20px;font-weight: 700;color: #e5487d;}



blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}



#slickslidesarea {

  float: left;
  width: 100%;

}


footer {
    position: relative;
    float: left;
    width: 100%;
}



.thirdcolumn {
  width: 33.3333333333%;
  float: left;
  text-align: left;
  
}

.addressinfo {
  text-align: left;
  /* color: #fff; */
  padding-left: 12px;
  padding-right: 12px;
}

.address {
  padding-left: 32px;
  position: relative;
  
}


.address:after{
 left: -0px;
 top: 0px;
 content: "m";
  position: absolute;
  font-family: 'SocialMedia';
  
}

.openingtimes {
  padding-left: 32px;
  position: relative;
  
}


.openingtimes:after{
 left: -0px;
 top: 0px;
 content: "k";
  position: absolute;
  font-family: 'SocialMedia';
  
}

.telephone {
  padding-left: 32px;
  position: relative;
  
}


.telephone:after{
 left: -0px;
 top: 0px;
 content: "j";
  position: absolute;
  font-family: 'SocialMedia';
  
}

.emailaddress {
  padding-left: 32px;
  position: relative;
  
}


.emailaddress:after{
 left: -0px;
 top: 0px;
 content: "l";
  position: absolute;
  font-family: 'SocialMedia';
  
}

.thirdcolumn li {
list-style: disc;
margin-left: 16px;
padding-top: 4px;

}


.thirdcolumn h3 {
  text-align: left;
  color: #232174;
  font-size: 18px;
}

#footerbase {
    position: relative;
    text-align: center;
    float: left;
    width: 100%;
    padding: 12px;
    background-color: rgba(62, 62, 62, 1.0);
    color: #ccc;
    font-size: 12px;
    background-image: url(/images/logotexture.png);
    background-repeat: repeat;
    background-position: top -140px right -200px;
}


*, html {
      box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    font-weight: 300;
  
}

.navigationarea {
  float: left;
  position: relative:
  z-index: 1000000000000000;
}

.box    {
  width: 25%;
  height:auto;
  background-color: #fff;
  overflow:visible;
  position: relative;
  float: left;
  clear:both;
  margin-bottom: 8px;
  /* border-bottom: 4px solid #000; */
}


  .box:before    {
  width: 300%;
  content: "Mark Griffiths";
  text-align: left;
  padding-left: 10%;
  font-size: 2em;
  right: -300%;
  height: 100%;
  background-color: #000;
  position: absolute;
  z-index: -1000;
}

.box img {
  display: block;
  width: 100%;
}

.overlay    {
  position: absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  background:rgba(0,0,0,.75);
  text-align:center;
  opacity:0.9;
  -webkit-transition: opacity .25s ease;
}

.box:hover .overlay {
  opacity:0;
}

.box:active .overlay {
  opacity:0;
}

.overlay .plus {
  position: absolute;
  left: 0px;
  top: 0%;
  margin: auto;
  width: 100%;
  height: 100%;
  content:"+";
  margin: 0;
  font-size: 48px;
  line-height: 48px;
}



.overlay .plus:before {
   width: 48px;
   height: 48px;
   content:"+";

   position: absolute;
   bottom: 0px;
   right: 0px;

   color:rgba(255,255,255,.85);
*/
}


.overlay.clicked .plus:before {
  content:"-";
}


.overlay.clicked + .description {
  bottom:0%;
  left: 100%;
  width:300%;
    -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
}

.overlay.clicked + .description:after {
   right: -0px;
   top: 40%;
   width: 24px;
    border-color: transparent #ff6900 transparent transparent;
}






#logoarea {
  position: fixed;
  width: 400px;
  /* padding: 4px; */
  /* border: 1px solid #fff; */
  /* margin: 10px; */
  -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
  /* background-color: rgba(256,256,256,0.2); */
  line-height: 0;
}

video {

    width: 100%;
    height: auto;
    background: url('joltbanner6.jpg') no-repeat;
    background-size: cover;
    transition: 1s opacity;
    display: block;
}


#logoarea.smaller {
  position: fixed;
  width: 224px;
  padding: 4px;
  margin: 0px;
  border: 0px;
  -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
  line-height: 0;
}

h1 {
  color: #e5487d;
  font-weight: 300;
  font-size: 36px;
 font-family: 'Open Sans Condensed', sans-serif;;
}

.stuff h1 {
  color: #a7aeb7;
  font-weight: 300;
  text-transform: uppercase;
  background-color: rgba(0,0,0,0.5);
  line-height: 1.4;
    margin: 0px;
  padding: 0px;
}

.stuff h2 {
  color: #fff;
  font-weight: 300;
  /* text-transform: uppercase; */
  background-color: rgba(0,0,0,0.5);
  line-height: 1;
  font-size: 17px;
  margin: 0px;
  padding: 0px;
  padding-bottom: 12px;
}






#logoarea img{
  width: 100%;
  height: auto;
  line-height: 0;
}

.burger {
  float: right;
  width: 54px;
  height: 54px;
  border: 0px solid #e17200;
  right: 8px;
  top: 0px;
  position: absolute;
  border-radius: 20%;
  z-index: 100000000000000000;
}

.has-push-right .burger {
  float: right;
  width: 50px;
  height: 50px;
  border: 3px solid #ffffff;
  background-color: rgba(256,256,256,0);
  right: 8px;
  top: 8px;
  position: absolute;
  border-radius: 50%;
  z-index: 100000000000000000;
}


.has-push-right .burger {
  float: right;
  width: 50px;
  height: 50px;
  border: 3px solid #ffffff;
  background-color: rgba(256,256,256,0);
  right: 4px;
  top: 4px;
  position: absolute;
  border-radius: 50%;
}

.has-push-right .burger.colourchange {

  border: 3px solid #333;

}

.textinner {
  position: relative;
  z-index: 2;
  margin-left: auto;
  margin-right: auto;
  padding: 12px;
  width: 100%;
  max-width: 980px;
  /* float: left; */
}

.videoarea {
  position: relative;
  z-index: 2;
  padding: 16px;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.whiteback .videoarea h3{color: #f8ac00;}

.videouter{
  position: relative;
  z-index: 2;
  padding: 0px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: #505050;
}

.textinnerwide {
  position: relative;
  z-index: 2;
  max-width:1024px;
  margin-left: auto;
  margin-right: auto;
}

.testimonials {
  padding-top: 8px;
  position: relative;
  z-index: 2;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  font-size: 22px;
  line-height: 1.4;
  color: #eee;
}

.burger span {
    display:  block;
    padding: 2px;
    background-color: #ccc;
    color: #fff;
    width: 48px;
    position: absolute;
    right: -1px;
    text-align: right;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;
    opacity: 1.0;
}

.burger span.colourchange {background-color: #e8eaed;-moz-transition: all .3s ease-in;-o-transition: all .3s ease-in;-webkit-transition: all .3s ease-in;transition: all .3s ease-in;}


.has-push-right .burger span.colourchange:nth-child(1) {
   background-color: #333;
}

.has-push-right .burger span.colourchange:nth-child(3) {
   background-color: #333;
}

.burger span:nth-child(1) {
   top: 8px;
}

.burger span:nth-child(2) {
   top: 20px;

}

.burger span:nth-child(3) {
   top: 32px;

}


.has-push-right .burger span:nth-child(1) {
   -ms-transform: rotate(45deg);/* IE 9 */
   -webkit-transform: rotate(45deg);/* Chrome, Safari, Opera */
   transform: rotate(45deg);
   top: 20px;
   -moz-transition: all .3s ease-in;
   -o-transition: all .3s ease-in;
   -webkit-transition: all .3s ease-in;
   transition: all .3s ease-in;
   background-color: #ffffff;
}

.has-push-right .burger span:nth-child(2) {
   -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
    transform: rotate(180deg);
    opacity: 0;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    transition: all .3s ease-in;

}

.has-push-right .burger span:nth-child(3) {
  -ms-transform: rotate(-45deg);/* IE 9 */
  -webkit-transform: rotate(-45deg);/* Chrome, Safari, Opera */
  transform: rotate(-45deg);
  top: 20px;
  -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
  background-color: #ffffff;
}






header {
  position: fixed;
  padding: 8px;
  width: 100%;
  z-index: 12;
  background-color: rgba(62, 62, 62, 1.0);
  height: 124px;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  border-bottom: 1px solid rgba(0,0,0,0);
}


.transtextareainternal {
  text-align: center;
  padding: 8px;
  float: left;
  width: 100%;
  margin-left: 1%;
  margin-right: 1%;
  padding: 8px;
  background-color: rgba(255, 255, 255, 0.9);
}

.locationheaderinternal {
  
text-align: left;
padding: 8px;  
float: left;
width: 100%;
margin-bottom: 24px;
padding: 8px;  
border-bottom: 1px solid #FFFFFF;
}

.locationheaderinternal h2{
  /* color: #fff; */
  font-size: 42px;
}


header.scrolled {
  position: fixed;
  z-index: 12;
  background-color: rgba(62, 62, 62, 1.0);
  height: 80px;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  border-bottom: 1px solid rgba(0,0,0,1);
}


html, body {

  font-family: 'Open Sans', sans-serif;
  margin: 0px;
  overflow-x: hidden;
  width: 100%;
  line-height: 1.4;
  font-size: 14px;

}

.rslides h1 {
    font-family: 'Dancing Script';
    top: 30vw;
    font-size: 3.5vw;
    width: 100%;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8);





}
.rslides h2 {
    top: 36vw;
    font-size: 1.4vw;
    width: 100%;
    color: #fff
}
.rslides,
.rslides_container {
    position: relative
}
.rslides {
    list-style: none;
    padding: 0;
    margin: 0
}
div.slide-left p {
    animation: slide-left 10s
}
.rslides_container_small {
    padding: 8px;
    background-color: #fff;
    border: 1px solid #eee;
    float: left;
    position: relative;

}
.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0
}
.rslides li:first-child {
    position: relative;
    display: block;
    float: left
}
.rslides img {
    display: block;
    width: 100%;
    border: 0
}
.rslides_tabs {
    /* display: none; */
    /* background: rgba(0, 0, 0, .25); */
    font-size: 1.4vw;
    list-style: none;
    padding: 6px 0;
    text-align: center;
    width: 100%;
    z-index: 10000000;
    position: relative;
    /* bottom: 4.2vw; */
}
.rslides_tabs li {
    display: inline;
    float: none;
    margin-right: 1px
}
.rslides_tabs a {
    width: 9px;
    line-height: 20px;
    padding: 2px;
    height: auto;
    background: 0 0;
    display: inline;
}
.rslides_tabs a:hover {
    border: 0
}
.rslides_tabs li:first-child {
    margin-left: 0
}
.rslides_tabs .rslides_here a {
    background: rgba(255, 255, 255, .1);
    color: #fff
}
.rslides1_nav {
    position: absolute;
    -webkit-tap-highlight-color: transparent;
    top: 70%;
    left: 8px;
    z-index: 1000000000000;
    opacity: .7;
    text-indent: -9999px;
    overflow: hidden;
    height: 48px;
    width: 30px;
    background: url(themes.png) left top no-repeat;
    margin-top: -45px;
    background-size: 190%;



}
.rslides2_nav,
.rslides3_nav {
    -webkit-tap-highlight-color: transparent;
    text-indent: -9999px;
    top: 0;
    position: absolute;
    overflow: hidden
}
.rslides1_nav:active {
    opacity: 1
}
.rslides1_nav.next {
    left: auto;
    background-position: right top;
    right: 8px;
}
.rslides2_nav {
    left: 0;
    display: block;
    background: #fff;
    opacity: 0;
    filter: alpha(opacity=1);
    width: 48%;
    height: 91%
}
.rslides2_nav.next {
    left: auto;
    right: 0
}
.rslides3_nav {
    opacity: .6;
    bottom: 0;
    left: 0;
    background: url(themes.gif) left 50% no-repeat #000;
    width: 38px
}
.rslides3_nav:active {
    opacity: 1
}
.rslides3_nav.next {
    left: auto;
    background-position: right 50%;
    right: 0
}
 h1, h2, h3, h4, h5 {
   font-weight: 300;
 }


 .testimonials h3 {padding-bottom: 12px;}

 h3 {color: #f8ac00;}

  h2 {
  color: #44473b;
  font-size: 22px;
  }

#mainarea {z-index: 1;float: left;clear: both;position: relative;/* min-height: 800px; */padding: 0px;text-align: center;width: 100%;}

.whiteback {
  float: left;
  width: 100%;
  background-color: #fff;
  padding: 0px;
  /* padding-bottom: 32px; */
}

.whiteback h3, .greyback h3 {
  color: #f8ac00;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 24px;
  margin: 0px;
  padding-bottom: 12px;
  font-weight: 300;
 }

 .whiteback h4 {
  color: #494885;
  font-size: 20px;
  margin: 0px;
  font-weight: 600;
 }

.greyback {
  float: left;
  width: 100%;
  background-color: #d8d8d8;
  padding: 12px;
}


#mainareawhite {
  float: left;
  clear: both;
  position: relative;
  /* min-height: 800px; */
  padding: 0px;
  text-align: center;
  width: 100%;
  z-index: 1;
  /* background-color: #fff; */
  }

a {
  color: inherit;
  text-decoration: none;
}



.person {
  font-size: 12px;
  color: #e5487d;
}

.diagonalone {
  float: left;
  clear: both;
  position: relative;
  /*! min-height: 340px; */
  padding: 14px;
  text-align: center;
  width: 100%;
  font-weight: 300;
  /* background-color: #fff; */
  }


.diagonaltwo {
  margin-top: 60px;
  float: left;
  clear: both;
  position: relative;
  padding: 32px;
  text-align: center;
  width: 100%;
  background-image: url(/images/logotexture2.png);
  background-repeat: no-repeat;
  background-position: top -100px right -200px;
  background-color: rgba(62, 62, 62, 1.0);
  }

  #socialmedia {
  margin-top: 0px;

  float: left;
  clear: both;
  position: relative;
  padding: 32px;
  text-align: center;
  width: 100%;
  background-color: #f8ac00;
  color: black;
  }




 






/*RESPONSIVE SLIDER  CSS*/



.caption1 {
 font-family: 'Open Sans Condensed', sans-serif;
 font-weight: 300;
 text-transform: uppercase;
 width: 100%;
 position: absolute;
 display: block;
 bottom: 17%;
 left: 0;
 padding: 8px;
 text-align: center;
 color: #fff;
 font-size: 5vw;
 z-index: 1000;
 text-shadow: 1px 1px 1px rgba(0,0,0,0.9);
 -webkit-transition: all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;
 }
   

.caption1.smaller {
opacity: 0.1;
-webkit-transition: all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
 -webkit-filter: blur(4px);
    filter: blur(4px);
}


.caption2 {
 font-family: 'Open Sans Condensed', sans-serif;
  font-weight: 600;
   text-transform: uppercase;
   width: 100%;
   position: absolute;
   display: block;
   bottom: 32%;
   left: 0;
   padding: 8px;
   text-align: center;
   color: #fff;
   font-size: 15px;
   z-index: 1000;
   z-index: 2;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.9);
     -webkit-transition: all .2s ease-in-out;
   -moz-transition:all .2s ease-in-out;

}

.caption2.smaller {
font-size: 60px;
opacity: 0.1;
-webkit-transition: all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
 -webkit-filter: blur(4px);
    filter: blur(4px);
}




.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0 auto;
  z-index: 0;
  background-color: #fff;
  }

  .rslides ul{
  padding: 0;
  margin: 0;

  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

.rslides #bannerlogo {
width: auto;
 position: absolute;
 display: block;
 bottom: 30%;
 width: 100%;
 text-align: center;
 z-index: 1000;
 -webkit-transition: all .2s ease-in-out;
 -moz-transition:all .2s ease-in-out;
 }
  

  .rslides #bannerlogo img {width: 8vw;display: block;bottom: 23%;padding: 8px;text-align: center;color: #fff;z-index: 1000;text-shadow: 1px 1px 1px rgba(0,0,0,0.9);-webkit-transition: all .2s ease-in-out;-moz-transition:all .2s ease-in-out;float: none;display: inline-block;}
  



  #overlaybox {
    position: absolute;
    z-index: -0;
    width: 100%;
    bottom: 0px;
    left: 0px;
    height: 180px;
  }
  
body.sixthformstyle .rslides_container {
  margin-bottom: 0px;
  position: relative;
  float: left;
  width: 100%;
  padding: 0px;
  border: 0px;
  margin-top: 12px;
  } 


  .rslides_container {
  margin-bottom: 12px;
  position: relative;
  float: left;
  width: 100%;
  margin-top: 0px;
  }



#slider-wrapper:before {
  /* content: ""; */
  /* background-image: url('mainbanneroverlay.png'); */
  opacity: 0.3;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  background-repeat: repeat;
  z-index: 1;
}

#slider-wrapper {
    position: relative;
    width: 100%;
    float: left;
    height: auto;
    z-index: 1;
    margin-top: 124px;
    margin-bottom: 20px;
}


.whitepage #slider-wrapper img{
    width: 100%;
 
}


#slider-wrapper p {
    font-size: 20px;
    line-height: 28px;
    padding-left: 290px
}
#slider-wrapper-small {
    max-width: 1080px;
    z-index: 0;
    margin-top: -8px;
    border: 8px solid #fff
}




.rslides1_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 50%;
  left: 0;
  z-index: 1;
  opacity: 0.7;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 54px;
  width: 48px;
  background: transparent url("themes.png") no-repeat left top;
  /* margin-top: -45px; */
  }

.rslides1_nav:active {
  opacity: 1.0;
  }

.rslides1_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
  }

.rslides2_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 0;
  left: 0;
  display: block;
  background: #fff;/* Fix for IE6-9 */
  opacity: 0;
  filter: alpha(opacity=1);
  width: auto;
  text-indent: -9999px;
  overflow: hidden;
  height: 91%;
  }

.rslides2_nav.next {
  left: auto;
  right: 0;
  }

.rslides3_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  opacity: 0.6;
  text-indent: -9999px;
  overflow: hidden;
  top: 0;
  bottom: 0;
  left: 0;
  background: #000 url("themes.gif") no-repeat left 50%;
  width: 38px;
  }

.rslides3_nav:active {
  opacity: 1.0;
  }

.rslides3_nav.next {
  left: auto;
  background-position: right 50%;
  right: 0;
  }

.rslides1_nav:focus,
.rslides2_nav:focus,
.rslides3_nav:focus {
  outline: none;
  }

.rslides_tabs {
 position: absolute;
 width: 100%;
 bottom: -5%;
 text-align: center;
 display: none;
 }

.rslides_tabs li {
  display: inline;
  float: none;
  _float: left;
  *
  float: left;
  margin-right: 5px;
  z-index: 3;
  position: relative;
  }

.rslides_tabs a {
  text-indent: -9999px;
  overflow: hidden;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background: #e5487d;
  display: inline-block;
  _display: block;*
  display: block;
  /* -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3); */ */
  -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  /* box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3); */ */
  width: 9px;
  height: 9px;
  }

.rslides_tabs .rslides_here a {
  background: #222;
  background: rgba(0,0,0, .8);
  }
  
  #content {
  }


#horizontal {
      background-image: url("lizard2.gif");
      /* background-position: left 0%; */
      background-repeat: repeat-x;
      -webkit-transition: background 4s ease-in-out;
      -moz-transition: background 4s ease-in-out;
      -o-transition: background 4s ease-in-out;
      transition: background 4s ease-in-out;
      height: 120px;
      background-size: 300px 200px;
      border-top: 1px solid #eee;
      float: left;
      position:relative;
      z-index: 3;
      width: 100%;
      margin-top: -0px;
      background-position: center center;
}




#horizontal.moving{
      /* background-position: right 0%; */
      -webkit-transition: background 4s ease-in-out;
      -moz-transition: background 4s ease-in-out;
      -o-transition: background 4s ease-in-out;
      transition: background 4s ease-in-out;
}



.servicesarea {
  float: left;
  width: 100%;
  background-color: #4c4c4c;
  border: 32px solid #4c4c4c;
  margin-bottom: 12px;
}

.servicesarea h2 {
  color: #494885;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 32px;
  margin: 0px;
  font-weight: 700;
 }

 .servicesarea h3 {
  color: #f8ac00;
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 32px;
  margin: 0px;
  font-weight: 300;
 }

.servicesarea a{
  padding: 4px;
  display: inline-block;
  width: 19%;
  max-width: 180px;
  color: #eee;
}

.serviceheader {
font-family: 'Open Sans Condensed', sans-serif;
  padding: 8px;
  float: left;
  width: 100%;
  font-size: 24px;
  line-height: 24px;
  height: 68px;

}

.servicesingle {
  display: inline-block;
  float: left;
  width: 100%;
  background-color: #ffffff;
  border-radius: 4px;
  border-bottom: 2px solid #1794a6;
  padding-bottom: 12px;
}

.servicesingle img {
  width: 80%;
  opacity: 0.8;
}


#hoverlinkarea {
  float: left;
  width: 100%;
}




.hoverlink {

float: left;

width: 100%;

background-color: #333;

overflow: hidden;

transition: all 0.8s ease-in-out;

-webkit-transition: all 0.8s ease-in-out;

-moz-transition: all 0.8s ease-in-out;

-o-transition: all 0.8s ease-in-out;

position: relative;
}



.hoverlink:hover {
  background-color: #4bbdd3;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(1) div.hoverlink:hover{
  background-color: #D346A2;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(2) div.hoverlink:hover{
  background-color: #4bbdd3;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(3) div.hoverlink:hover{
  background-color: #856898;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(4) div.hoverlink:hover{
  background-color: #D346A2;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(5) div.hoverlink:hover{
  background-color: #4bbdd3;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

#hoverlinkarea a:nth-child(6) div.hoverlink:hover{
  background-color: #856898;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}


.hoverlink .topline {

  width: 0%;
  height: 4px;
  position: absolute;
  top: 12px;
  right: 0px;
  background-color: #fff;
  z-index: 2;
   transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

.hoverlink .bottomline {

  width: 0%;
  left: 0px;
  height: 4px;
  position: absolute;
  bottom: 12px;
  background-color: #fff;
  z-index: 2;
   transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}





.hoverlink:hover .topline {

  width: 100%;
  height: 4px;
  position: absolute;
  top: 12px;
  background-color: #fff;
  z-index: 2;
   transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

.hoverlink:hover .bottomline {

  width: 100%;
  height: 4px;
  position: absolute;
  bottom: 12px;
  background-color: #fff;
  z-index: 2;
}

.hoverlink img {

top: 0px;

float: left;

width: 100%;

opacity: 0.6;

transition: all 0.8s ease-in-out;

-webkit-transition: all 0.8s ease-in-out;

-moz-transition: all 0.8s ease-in-out;

-o-transition: all 0.8s ease-in-out;
}



.hoverlink:hover img {
  float: left;
  opacity: 01.0;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;

}

.hovertextbox {
  position: absolute;
  width: 100%;
  height: auto;
  padding: 8px;
  text-align: center;
  color: #fff;
  bottom: 20px;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

.hoverlink:hover .hovertextbox {
  position: absolute;
  width: 100%;
  height: auto;
  padding: 8px;
  text-align: center;
  color: #fff;
   bottom: 50px;
       transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
}

.hoverheader {font-size: 18px;}

.hoverexcerpt {
  font-size: 36px;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  text-transform: uppercase;
  line-height: 32px;

}

.hoverlink:hover .hoverexcerpt {
  font-size: 54px;
      transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;

}

.hovermore {font-size: 16px;padding: 4px;/* border: 1px solid #fff; */width: 200px;margin-top: 8px;margin-left: auto;margin-right: auto;}


.hoverlink img.portfolioimage{
/*type your css here which you want to use for both*/
}
.hoverlink:hover img.portfolioimage{
display:none;
}
.hoverlink img.hover{display:none;}
.hoverlink:hover img.hover{
display:block;
}




.hi-icon {
  display: inline-block;
  font-size: 0px;
  cursor: pointer;
  margin: 2px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  text-align: center;
  position: relative;
  z-index: 1;
  color: #fff;
}

.hi-icon:after {
  pointer-events: none;
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  content: '';
  -webkit-box-sizing: content-box; 
  -moz-box-sizing: content-box; 
  box-sizing: content-box;
}

.hi-icon:before {
  speak: none;
  font-size: 36px;
  line-height: 60px;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  display: block;
  -webkit-font-smoothing: antialiased;
}



/* Effect 1 */
.hi-icon-effect-1 .hi-icon {
  background: rgba(255,255,255,0.1);
  -webkit-transition: background 0.2s, color 0.2s;
  -moz-transition: background 0.2s, color 0.2s;
  transition: background 0.2s, color 0.2s;
}

.hi-icon-effect-1 .hi-icon:after {
  top: -7px;
  left: -7px;
  padding: 7px;
  box-shadow: 0 0 0 4px #fff;
  -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
  -webkit-transform: scale(.8);
  -moz-transition: -moz-transform 0.2s, opacity 0.2s;
  -moz-transform: scale(.8);
  -ms-transform: scale(.8);
  transition: transform 0.2s, opacity 0.2s;
  transform: scale(.8);
  opacity: 0;
}

/* Effect 1a */
.hi-icon-effect-1a .hi-icon:hover {
  background: rgba(255,255,255,1);
  color: #333;
}

.hi-icon-effect-1a .hi-icon:hover:after {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

@media screen and (max-width: 960px) {

#primary_nav_wrap {
  display: none;
}

}

@media screen and (max-width: 768px) {


    .infosheetitem {
  width: 49%;
  
  
  }



  .hentry {

width: 100%;
float: left;
position: relative;
padding: 12px;
border: 1px solid #eee;
margin-bottom: 12px;
}

.hentrytwo {

width: 100%;
float: left;
position: relative;
padding: 12px;
border: 1px solid #eee;
margin-bottom: 12px;

}

.hentry .blogimage {

width: 100%;
float: left;

}

.hentrytwo .blogimage {

width: 100%;
float: left;

}







  #horizontal {
     height: 80px;
    
}


#slider-wrapper {
    margin-top: 80px;
}

  .servicesarea a{
  width: 50%;
}


  .burger span {background-color: #e5487d;-moz-transition: all .3s ease-in;-o-transition: all .3s ease-in;-webkit-transition: all .3s ease-in;transition: all .3s ease-in;}

header {
  position: fixed;
  z-index: 12;
  background-color: rgb(80, 80, 80);
  height: 80px;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  border-bottom: 1px solid rgba(0,0,0,1);
}



#logoarea {
  position: fixed;
  width: 224px;
  padding: 4px;
  margin: 0px;
  border: 0px;
  -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
  line-height: 0;
}


  .box    {
  width: 33.3333333333%;
  height:auto;
  background-color: #fff;
  overflow:visible;
  position: relative;
  float: left;
  clear:both;
  margin-bottom: 8px;
  
}

  .box:before    {
  width: 200%;
  padding-left: 10%;
  font-size: 2em;
  right: -200%;
}


.overlay.clicked + .description {
  bottom:0%;
  left: 100%;
  width:200%;
    -moz-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  transition: all .3s ease-in;
}










.hi-icon {
  display: inline-block;
  font-size: 0px;
  cursor: pointer;
  margin: 0px;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  text-align: center;
  position: relative;
  z-index: 1;
  color: #fff;
}

.hi-icon:before {
  speak: none;
  font-size: 34px;
  line-height: 58px;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  display: block;
  -webkit-font-smoothing: antialiased;
}


}




@media screen and (max-width: 540px) {


   .infosheetitem {
  width: 100%;
  
  
  }




  .hoverlink {
  float: left;
  width: 100%;
  background-color: #333;
  overflow: hidden;
  transition: all 0.8s ease-in-out;
  -webkit-transition: all 0.8s ease-in-out;
  -moz-transition: all 0.8s ease-in-out;
  -o-transition: all 0.8s ease-in-out;
  position: relative;
}


}






@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait){
 .rslides_container li .stuff, .rslides_container li, .rslides_container {
    height: 1024px;
  }
}

/** 
 * iPad with landscape orientation.
 */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape){
 .rslides_container li .stuff, .rslides_container li, .rslides_container {
    height: 768px;
  }
}}<div class="greyback">
<h3> In Store </h3>
<?php perch_content('Category Slider'); ?>


  </div>