#myparallaxslider{ /* CSS for specific carousel container called #myparallaxslider. */
width:100%;
height:95%;
}

/* ######### Shared CSS for various parts of slider (in the event of multiple sliders) ######### */

div.parallaxslider{ /* shared CSS for main carousel container */
background: black url(ajaxload.gif) center center no-repeat; /* loading gif while caoursel is loading */
}

div.parallaxslider img.navbutton{ /* CSS for the nav buttons */
}

div.parallaxslider *{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

div.parallaxslider div.slide{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
display: none;
}

div.parallaxslider div.slide div.bgoverlay{ /* CSS for each image's DIV container within main container */
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: black;
background-position: center center; /* center image within carousel */
background-repeat: no-repeat;
background-size: cover; /* CSS3 property to scale image within container? "cover" or "contain" */
}

div.parallaxslider div.selectedslide{ /* CSS for currently selected slide */
}

div.parallaxslider div.slide div.desc{ /* DIV that contains the textual description inside .slide */
position: absolute;
color: black;
padding: 8px;
text-shadow: 0 -1px 1px #8a8a8a; /* CSS3 text shadow */
z-index:5;
pointer-events: none; /* keep this property intact. Disable pointer events on desc divs themselves */
}

div.parallaxslider div.slide div.desc *{
pointer-events: auto; /* keep this property intact. Enable pointer events on individual elements within desc divs, such as links */
}

div.parallaxslider div.selectedslide div.desc{ /* CSS for currently selected slide's desc div */
}


div.parallaxslider div.slide div.desc a{
color:yellow;
text-decoration:none;
}

/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
    width: 100%; /* Full width */
    padding: 12px; /* Some padding */  
    border: 1px solid #ccc; /* Gray border */
    border-radius: 4px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    margin-top: 6px; /* Add a top margin */
    margin-bottom: 16px; /* Bottom margin */
    resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
  }
  
  /* Style the submit button with a specific background color etc */
  input[type=submit] {
    background-color: #fcad1b;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
  }
  
  /* When moving the mouse over the submit button, add a darker green color */
  input[type=submit]:hover {
    background-color: #fcad1b;
  }
  
  /* Add a background color and some padding around the form */
  .container {
    border-radius: 5px;
  }




  @import url('https://fonts.googleapis.com/css?family=Varela+Round');
  html, body {
      overflow-x: hidden;
      height: 100%;
      -webkit-overflow-scrolling: touch;
  }
  body {
      background: #fff;
      padding: 0;
      margin: 0;
      font-family: Verdana;
  }
  .header {
      display: block;
      margin: 0 auto;
      width: 100%;
      max-width: 100%;
      box-shadow: none;
      background-color: white;
      position: fixed;
      height: 80px!important;
      overflow: hidden;
      z-index: 10;
  }
  .main {
      margin: 0 auto;
      display: block;
      height: 100%;
      margin-top: 80px;
  }
  .mainInner{
      display: table;
      height: 100%;
      width: 100%;
      text-align: center;
  }
  .mainInner div{
      display:table-cell;
      vertical-align: middle;
      font-size: 3em;
      font-weight: normal;
      letter-spacing: 1.25px;
  }
  #sidebarMenu {
      height: 100%;
      position: fixed;
      right: 0;
      width: 100%;
      margin-top: 80px;
      transform: translateX(100%);
      transition: transform 250ms ease-in-out;
      background: white;
      z-index: 2;
  }
  .sidebarMenuInner{
      margin:0;
      padding:0;
      border-top: 1px solid rgba(70, 67, 67, 0.212);
  }
  .sidebarMenuInner li{
      list-style: none;
      color: #fff;
      font-weight: bold;
      padding: 20px;
      cursor: pointer;
      border-bottom: 1px solid rgba(70, 67, 67, 0.212);
      text-align: center;
  }
  .sidebarMenuInner li span{
      display: block;
      font-size: 14px;
      color: rgba(70, 67, 67, 0.212);
  }
  .sidebarMenuInner li a{
      color: #000;
      font-weight: normal;
      cursor: pointer;
      text-decoration: none;
  }
  input[type="checkbox"]:checked ~ #sidebarMenu {
      transform: translateX(0);
  }
  
  input[type=checkbox] {
      transition: all 0.3s;
      box-sizing: border-box;
      display: none;
  }
  .sidebarIconToggle {
      transition: all 0.3s;
      box-sizing: border-box;
      cursor: pointer;
      position: absolute;
      z-index: 99;
      height: 100%;
      width: 100%;
      top: 22px;
      right: 15px;
      height: 22px;
      width: 22px;
  }
  .spinner {
    display: block;
      transition: all 0.3s;
      box-sizing: border-box;
      position: absolute;
      height: 3px;
      width: 100%;
      background-color: #000000;
  }
  .horizontal {
      transition: all 0.3s;
      box-sizing: border-box;
      position: relative;
      float: left;
      margin-top: 3px;
  }
  .diagonal.part-1 {
      position: relative;
      transition: all 0.3s;
      box-sizing: border-box;
      float: left;
  }
  .diagonal.part-2 {
      transition: all 0.3s;
      box-sizing: border-box;
      position: relative;
      float: left;
      margin-top: 3px;
  }
  input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
      transition: all 0.3s;
      box-sizing: border-box;
      opacity: 0;
  }
  input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
      transition: all 0.3s;
      box-sizing: border-box;
      transform: rotate(135deg);
      margin-top: 8px;
  }
  input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
      transition: all 0.3s;
      box-sizing: border-box;
      transform: rotate(-135deg);
      margin-top: -9px;
  }