/*
 * Theme Name: Gelform 2015
*/
/**
 * Common mixins
 */
/*
 * media query sizes based on bootstrap
 * CSS:
 * @media screen and (max-width: $screen-sm-max) {
 *    display: none;
 * }
 * 
 */
/**
 * colors
 * 
 */
/**
 * size variables
 */
/**
 * @link https://gist.github.com/garyharan/957284
 * MODIFIED: spread added
 */
/**
 * @link https://gist.github.com/garyharan/957284
 * MODIFIED: all 4 corners added
 */
/**
 * For vertical-aligning elements
 * Works well with the Bootstrap carousel
 *
 * HTML:
 * <div class="wrapper">
 *     <div class="content">centered content</div>
 * </div>
 *
 * CSS:
 * .wrapper {@include vertical-align-wrapper();}
 * .content {@include vertical-align();}
 */
/**
 * Commonly reused styles
 */
/**
 * Site-wide styles
 */
* {
  color: #555; }

html,
body {
  height: 100%;
  max-width: 100%;
  overflow-x: hidden; }

body {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAH0lEQVQIW2NkQAWSjEh8SQYGhucwATAHJAkSgHNAAgBJLgMeVQZnUgAAAABJRU5ErkJggg==) repeat; }

.btn {
  border: 0;
  color: #555; }

#sidebar-work {
  background: #BBB;
  height: 100%;
  left: -480px;
  position: absolute;
  overflow: auto;
  width: 0;
  top: 0;
  width: 480px;
  z-index: 0; }
  #sidebar-work h1 {
    color: white;
    margin-bottom: 0;
    padding: 15px; }
    #sidebar-work h1 span {
      color: #CF0; }
  #sidebar-work small {
    color: #CF0;
    display: block; }
  #sidebar-work i {
    color: #999; }
  #sidebar-work li {
    border-right: 3px solid #C1C1C1; }
  #sidebar-work li a {
    display: block;
    padding: 15px; }
    #sidebar-work li a:visited, #sidebar-work li a:active, #sidebar-work li a:focus {
      text-decoration: none; }
  #sidebar-work li a:hover {
    position: relative;
    opacity: .618em;
    text-decoration: none; }
    #sidebar-work li a:hover > * {
      position: relative;
      z-index: 1; }
    #sidebar-work li a:hover:after {
      background: white;
      bottom: 0;
      content: '';
      left: 0;
      position: absolute;
      right: 0;
      top: 0;
      z-index: 0; }
  #sidebar-work h3, #sidebar-work .h3 {
    color: #666;
    margin: 0; }

/**
 * Header styles
 */
body.home header {
  margin-bottom: 0;
  height: 100%; }
  body.home header .liner {
    transform: translateY(-50%); }
  @media screen and (max-width: 479px) {
    body.home header {
      height: auto; }
      body.home header .liner {
        transform: translateY(0%); } }

header {
  margin-bottom: 45px;
  position: relative;
  text-align: center; }
  header .liner {
    display: inline-block;
    position: relative;
    text-align: left;
    top: 50%; }
    @media screen and (max-width: 479px) {
      header .liner {
        padding: 0 15px; } }
  header h1 {
    font-weight: bold; }
  header a {
    color: #333; }
  header .btn-contact {
    background: #CF0;
    font-size: 1.618rem;
    position: relative; }
  header .btn-contact:before {
    bottom: 100%;
    content: '';
    border-color: transparent transparent #CF0 transparent;
    border-style: solid;
    border-width: 0 1rem 1rem;
    display: block;
    position: absolute;
    width: 0;
    height: 0; }
  header .btn-work {
    background: white;
    font-size: 1.618rem; }

/**
 * Footer styles
 */
#mc-embedded-subscribe-form {
  bottom: 0;
  left: 0;
  position: fixed;
  text-align: center;
  width: 100%;
  z-index: 0; }
  @media screen and (max-width: 479px) {
    #mc-embedded-subscribe-form {
      padding-top: 30px;
      position: static; }
      #mc-embedded-subscribe-form .btn {
        width: 80%; } }

/**
 * Homepage styles
 */