@charset "UTF-8";
/************************************************

Stylesheet: Main Stylesheet

*************************************************/

@import 'https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i,800,800i;

/*********************
GENERAL STYLES
*********************/

/*********************
LINK STYLES
*********************/
a:link, a:visited:link {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.3); }

/*********************
H1, H2, H3, H4, H5 P STYLES
*********************/
h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a {
  text-decoration: none; }

/*********************
HEADER STYLES
*********************/
.header ul.off-canvas-list li {
  list-style: none; }

/*********************
NAVIGATION STYLES
*********************/
.top-bar .title-area {
  z-index: 1; }

.off-canvas-list ul {
  margin-left: 0; }
  .off-canvas-list ul li a {
    border-bottom: 0px; }
  .off-canvas-list ul .dropdown {
    margin-left: 20px; }

/*********************
POSTS & CONTENT STYLES
*********************/
#content #inner-content {
  padding: 1rem 0rem; }

.page-title .vcard {
  border: 0px;
  padding: 0px; }

.byline {
  color: #999; }

.entry-content img {
  max-width: 100%;
  height: auto; }

.entry-content .alignleft, .entry-content img.alignleft {
  margin-right: 1.5em;
  display: inline;
  float: left; }

.entry-content .alignright, .entry-content img.alignright {
  margin-left: 1.5em;
  display: inline;
  float: right; }

.entry-content .aligncenter, .entry-content img.aligncenter {
  margin-right: auto;
  margin-left: auto;
  display: block;
  clear: both; }

.entry-content video, .entry-content object {
  max-width: 100%;
  height: auto; }

.entry-content pre {
  background: #eee;
  border: 1px solid #cecece;
  padding: 10px; }

.wp-caption {
  max-width: 100%;
  background: #eee;
  padding: 5px; }
  .wp-caption img {
    max-width: 100%;
    margin-bottom: 0;
    width: 100%; }
  .wp-caption p.wp-caption-text {
    font-size: 0.85em;
    margin: 4px 0 7px;
    text-align: center; }

.post-password-form input[type="submit"] {
  display: inline-block;
  text-align: center;
  line-height: 1;
  cursor: pointer;
  -webkit-appearance: none;
  transition: all 0.25s ease-out;
  vertical-align: middle;
  border: 1px solid transparent;
  border-radius: 0;
  padding: 0.85em 1em;
  margin: 0 1rem 1rem 0;
  font-size: 0.9rem;
  background: #2199e8;
  color: #fff; }
  [data-whatinput='mouse'] .post-password-form input[type="submit"] {
    outline: 0; }
  .post-password-form input[type="submit"]:hover, .post-password-form input[type="submit"]:focus {
    background: #1583cc;
    color: #fff; }

/*********************
IMAGE GALLERY STYLES
*********************/
/*********************
PAGE NAVI STYLES
*********************/
.page-navigation {
  margin-top: 1rem; }

/*********************
COMMENT STYLES
*********************/
#comments .commentlist {
  margin-left: 0px; }

#respond ul {
  margin-left: 0px; }

.commentlist li {
  position: relative;
  clear: both;
  overflow: hidden;
  list-style-type: none;
  margin-bottom: 1.5em;
  padding: 0.7335em 10px; }
  .commentlist li:last-child {
    margin-bottom: 0; }
  .commentlist li ul.children {
    margin: 0; }

.commentlist li[class*=depth-] {
  margin-top: 1.1em; }

.commentlist li.depth-1 {
  margin-left: 0;
  margin-top: 0; }

.commentlist li:not(.depth-1) {
  margin-left: 10px;
  margin-top: 0;
  padding-bottom: 0; }

.commentlist .vcard {
  margin-left: 50px; }
  .commentlist .vcard cite.fn {
    font-weight: 700;
    font-style: normal; }
  .commentlist .vcard time {
    float: right; }
    .commentlist .vcard time a {
      color: #999;
      text-decoration: none; }
      .commentlist .vcard time a:hover {
        text-decoration: underline; }
  .commentlist .vcard img.avatar {
    position: absolute;
    left: 10px;
    padding: 2px;
    border: 1px solid #cecece;
    background: #fff; }

.commentlist .comment_content p {
  margin: 0.7335em 0 1.5em;
  font-size: 1em;
  line-height: 1.5em; }

.commentlist .comment-reply-link {
  float: right; }

/*********************
COMMENT FORM STYLES
*********************/
.respond-form {
  margin: 1.5em 10px;
  padding-bottom: 2.2em; }
  .respond-form form {
    margin: 0.75em 0; }
    .respond-form form li {
      list-style-type: none;
      clear: both;
      margin-bottom: 0.7335em; }
      .respond-form form li label,
      .respond-form form li small {
        display: none; }
    .respond-form form input[type=text],
    .respond-form form input[type=email],
    .respond-form form input[type=url],
    .respond-form form textarea {
      padding: 3px 6px;
      background: #efefef;
      border: 2px solid #cecece;
      line-height: 1.5em; }
      .respond-form form input[type=text]:focus,
      .respond-form form input[type=email]:focus,
      .respond-form form input[type=url]:focus,
      .respond-form form textarea:focus {
        background: #fff; }
      .respond-form form input[type=text]:invalid,
      .respond-form form input[type=email]:invalid,
      .respond-form form input[type=url]:invalid,
      .respond-form form textarea:invalid {
        outline: none;
        border-color: #fbc2c4;
        background-color: #f6e7eb;
        -ms-box-shadow: none;
        box-shadow: none; }
    .respond-form form input[type=text],
    .respond-form form input[type=email],
    .respond-form form input[type=url] {
      max-width: 400px;
      min-width: 250px; }
    .respond-form form textarea {
      resize: none;
      width: 97.3%;
      height: 150px; }

#comment-form-title {
  margin: 0 0 1.1em; }

#allowed_tags {
  margin: 1.5em 10px 0.7335em 0; }

.nocomments {
  margin: 0 20px 1.1em; }

/*********************
SIDEBARS & ASIDES
*********************/
.widget ul {
  margin: 0; }
  .widget ul li {
    list-style: none; }

/*********************
FOOTER STYLES
*********************/
.footer {
    background: #222 none repeat scroll 0 0;
    clear: both;
    color: #fff;
    margin-top: 1em;
    padding: 1rem 0;
    text-align: center;
}
.footer p {
  margin-bottom: 0;
}

/*********************
FOUNDATION STYLES
*********************/

/*********************
PLUGIN STYLES
*********************/
.gform_body ul {
  list-style: none outside none;
  margin: 0; }

/******************************************************************

Stylesheet: Retina Screens & Devices Stylesheet

When handling retina screens you need to make adjustments, especially
if you're not using font icons. Here you can add them in one neat
place.

******************************************************************/
/******************************************************************

Stylesheet: Print Stylesheet

This is the print stylesheet. There's probably not a lot
of reasons to edit this stylesheet. 

Remember to add things that won't make sense to print at 
the bottom. Things like nav, ads, and forms shouldbe set 
to display none.
******************************************************************/
@media print {
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    -webkit-filter: none !important;
    filter: none !important;
    -ms-filter: none !important; }
  a, a:visited {
    color: #444 !important;
    text-decoration: underline; }
    a:after, a:visited:after {
      content: " (" attr(href) ")"; }
    a abbr[title]:after, a:visited abbr[title]:after {
      content: " (" attr(title) ")"; }
  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }
  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid; }
  thead {
    display: table-header-group; }
  tr, img {
    page-break-inside: avoid; }
  img {
    max-width: 100% !important; }
  @page {
    margin: 0.5cm; }
  p, h2, h3 {
    orphans: 3;
    widows: 3; }
  h2,
  h3 {
    page-break-after: avoid; }
  .sidebar,
  .page-navigation,
  .wp-prev-next,
  .respond-form,
  nav {
    display: none; } }


/* Icons (icomoon)
      ========================================================================== */

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

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-play:before {
  content: "\e950";
}
.icon-file-text2:before {
  content: "\e96a";
}
.icon-file-picture:before {
  content: "\e96b";
}
.icon-file-play:before {
  content: "\e96d";
}
.icon-stack:before {
  content: "\e972";
}
.icon-location:before {
  content: "\e911";
}
.icon-map2:before {
  content: "\e914";
}
.icon-calendar:before {
  content: "\e915";
}
.icon-users:before {
  content: "\e91d";
}
.icon-quotes-left:before {
  content: "\e91f";
}
.icon-quotes-right:before {
  content: "\e920";
}
.icon-search:before {
  content: "\e906";
}
.icon-zoom-in:before {
  content: "\e907";
}
.icon-zoom-out:before {
  content: "\e90c";
}
.icon-enlarge:before {
  content: "\e90d";
}
.icon-shrink:before {
  content: "\e90e";
}
.icon-menu:before {
  content: "\e921";
}
.icon-download2:before {
  content: "\e900";
}
.icon-upload2:before {
  content: "\e903";
}
.icon-earth:before {
  content: "\e98f";
}
.icon-cross:before {
  content: "\e92c";
}
.icon-checkmark:before {
  content: "\e92d";
}
.icon-arrow-up-left2:before {
  content: "\e930";
}
.icon-arrow-up2:before {
  content: "\e931";
}
.icon-arrow-up-right2:before {
  content: "\e932";
}
.icon-arrow-right2:before {
  content: "\e933";
}
.icon-arrow-down-right2:before {
  content: "\e934";
}
.icon-arrow-down2:before {
  content: "\e935";
}
.icon-arrow-down-left2:before {
  content: "\e936";
}
.icon-arrow-left2:before {
  content: "\e937";
}
.icon-mail2:before {
  content: "\e93e";
}
.icon-google-plus:before {
  content: "\e940";
}
.icon-facebook:before {
  content: "\e943";
}
.icon-instagram:before {
  content: "\e904";
}
.icon-twitter:before {
  content: "\e901";
}
.icon-rss:before {
  content: "\e944";
}
.icon-youtube:before {
  content: "\e902";
}
.icon-linkedin2:before {
  content: "\e949";
}
.icon-file-pdf:before {
  content: "\e95b";
}
.icon-file-word:before {
  content: "\e95d";
}
.icon-file-excel:before {
  content: "\e95e";
}

/* Main elements & Grid
      ========================================================================== */

* {
    margin: 0;
}
html, body {
    height: 100%;
    font-family: 'Open Sans', serif;
}
section {
    width: 100%;
    position: relative;
    padding: 30px 0;
}
.row.wide {
    width: 100%;
    max-width: 100%;
}
.row.wide .columns {
    padding: 0;
}


/* Typography
      ========================================================================== */

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.2;
    font-family: 'Open Sans', sans-serif;
}
h1 {
    font-size: 1.625rem;
}
.hero h1 {
    font-size: 1.385rem;
    font-weight: 800;
}
.hero.subpage {
  text-align: center;
}
h2 {
    font-size: 1.425rem;
}
h3 {
    font-size: 1.125rem;
}
h4 {
    font-size: 0.938rem;
    line-height: 1.2;
    font-weight: 300;
}
p {
    font-size: 0.875rem;
}
.breadcrumbs {
    margin-bottom: 0;
    padding-bottom: 0;
}
.breadcrumbs li a {
    color: #333;
    font-size: 0.875rem;
    font-family: 'Prompt', sans-serif;
}
.center {
    text-align :center;
}
.white {
    color: #fff !important;
}
.black, {
    color: #222 !important;
}
.dark {
    background: #111 none repeat scroll 0 0;
    color: #fff;
}
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6,
.dark p,
.dark ul,
.dakr ol {
    color: #fff;
}
  /* ---------- 600 ---------- */
  @media screen and (min-width: 600px) {
    h1 { word-break: normal; }
  }
  /* ---------- 768 ---------- */
  @media screen and (min-width: 768px) {
    h1 { font-size: 1.850rem; }
    .hero h1 { font-size: 2.250rem; padding-top: 50px; }
    .hero.subpage  h1 { padding-top: 0; text-align: left; }
    h2 { font-size: 1.625rem; }
    h3 { font-size: 1.375rem; }
    .breadcrumbs li a { font-size: 1rem; }
    p {
        font-size: 1rem;
    }
  }

  /* ---------- 1200 ---------- */
  @media screen and (min-width: 1200px) {
    h1 { font-size: 2.250rem; }
    .hero h1 { font-size: 3.250rem; padding-top: 86px; }
    h2 { font-size: 1.875rem; }
    h3 { font-size: 1.5rem; }
  }

  /* ---------- 1440 ---------- */
  @media screen and (min-width: 1440px) {
    h1 { font-size: 2.250rem; }
    .hero h1 { font-size: 4rem; padding-top: 86px; }
    h2 { font-size: 1.875rem; }
    h3 { font-size: 1.5rem; }
  }


/* Buttons & Links
      ========================================================================== */



/* Header & Footer & Offcanvas 
      ========================================================================== */
.header {
    position: fixed;
    width: 100%;
    z-index: 100;
    background-color: rgba(255,255,255,1);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.05);
    transition: all .4s ease;
}
.scrolled .header {
    background-color: rgba(255,255,255,0.9);
    box-shadow: 0 0 15px rgba(0, 05, 0, 0.15);
}
.header .row {
    -webkit-align-items: center;
    align-items:         center;
}
.header .columns {
    padding: 0;
}
.flex-right {
    display: flex;
    justify-content: flex-end;
}
.page-wrap {
    min-height: 100%;
    padding-top: 0;
    margin-bottom: -100px;
}
.page-wrap:after {
    content: "";
    display: block;
}
.site-footer, .page-wrap:after {
    height: 100px; 
}
.site-footer {
    overflow: visible;
    position: relative;
    min-height: 100px;
    background-color: #222;
    display: flex;
    justify-content:     center;
    -webkit-align-items: center;
    align-items:         center;
}
.footer-content {
    font-family: 'Prompt', sans-serif;
    font-size: 0.875rem;
    text-align: center;
    color: #fff;
}
.content-area {
    position: relative;
    width: 100%;
    height: 100%;
    transform: translate3d(0,0,0); /* no shifting of DIV to start */
    transition: transform 0.5s; /* transition the transform property over 0.5s*/
}
.open .content-area {
    transform: translate3d(-235px,0,0);
}
#overlay {
    background-color: rgba(0, 0, 0, 0.0);
    display: block;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 50;
    visibility: hidden;
    transition: all .5s ease;
}
.open #overlay {
    background-color: rgba(0, 0, 0, 0.75);
    width: 100%;
    visibility: visible;
    background-image: url(../img/bg-grey-pattern.png);
}

  /* ---------- 960 ---------- */
  @media screen and (min-width: 960px) {
    .header .row {
        -webkit-align-items: flex-end;
        align-items:         flex-end;
    }
    .footer-content {
        font-size: 1rem;
    }
  }


/* HERO Element
      ========================================================================== */

.hero {
    height: 500px;
    width: 100%;
    background-color: rgba(245, 245, 245, 1);
    background-size: cover;
    display: flex;
    -webkit-justify-content: center;
    justify-content:         center;
    -webkit-flex-direction: column;
    flex-direction:         column;
}
.hero-content {
    width:100%;
    max-width: 75rem;
    margin: auto;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
}
.hero.subpage  {
    height: 200px;
    min-height: 150px;
    padding: 50px 0 0 0;
}
.hero.white::after {
    background-color: rgba(0, 0, 0, 0.55);
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    transition: background-color 1s ease;
}
.hero.black::after {
    background-color: rgba(255, 255, 255, 0.45);
    content: "";
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 5;
    transition: background-color 1s ease;
}
.hero .columns {
  z-index: 10;
}
  
  /* ---------- 768 ---------- */
  @media screen and (min-width: 768px) {
  	.hero {
  		height: 100vh;
  	}
    .hero.black::after {
        background-color: rgba(255, 255, 255, 0.35);
    }
    .hero.white::after {
        background-color: rgba(0, 0, 0, 0.45);
    }
    .hero.subpage  {
    	height: 25vh;
    }
  }


  /* ---------- 960 ---------- */
  @media screen and (min-width: 960px) {
    .hero {
      background-attachment: fixed;
      padding: 90px 0 0 0;

    }
    .open .off-canvas {
        visibility: hidden;
        display: none;
    }
    .content-area,
    .open .content-area {
        transform: none;
        transition: none;
    }
    .hero.subpage  {
        height: 35vh;
        min-height: 300px;
        padding-bottom: 0;
        padding-top: 90px;
    }
  }

  /* ---------- 1280 ---------- */
  @media screen and (min-width: 1280px) {
  }

/* ------- Background images ------- */

.bg {
    width: 100%;
    min-height: 200px;
    background-color: #efefef;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    -webkit-justify-content: center;
    justify-content:         center;
    -webkit-flex-direction: column;
    flex-direction:         column;
}
.bg h1, .hero h1 {
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

  /* ---------- 768 ---------- */
  @media screen and (min-width: 768px) {
      .bg {
        background-attachment: scroll;
        min-height: 460px;
      }
      .bg h1, .hero h1 { font-size: 2.675rem; }
      .bg h4, .hero h4 { font-size: 1.25rem; line-height: 1.3; }
  }
  
  /* ---------- 1200 ---------- */
  @media screen and (min-width: 1200px) {
      .bg {
        background-attachment: fixed;
        background-size: cover;
      }
      .bg h1, .hero h1 { font-size: 3.775rem; }
      .bg h4, .hero h4 { font-size: 1.475rem; }
  }


/* Content
      ========================================================================== */

#content {
	padding-top: 50px;
}

	/* ---------- 960 ---------- */
	@media screen and (min-width: 960px) {
	  	#content {
			padding-top: 90px;
		}
	}

/* Menu
      ========================================================================== */

.logo {
    display: block;
    float: left;
    width: auto;
    z-index: 10;
    color: #222;
    text-transform: uppercase;
}
.logo img, .scrolled .logo img {
    height: auto;
    width: 140px;
    padding: 0 0.938rem;
    transition: all .4s ease;
}
.menu-toggler {
    float: right;
    border-radius: 0;
    font-size: 1rem;
    margin: 0;
    padding: 0.938rem;
    color: #fff;
    cursor: pointer;
    background-color: #ee4c45;
}
.mobile ul {
    margin-top: 50px;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
}
.desktop .menu-paavalikko-container ul {
    display: none;
}
.menu {
    font-family: 'Prompt', sans-serif;
    list-style: none;
    padding: 0;
    margin: 0;
}
.menu > li > a {
    color: #ee4c45;
    transition: all .3s ease;
}
.menu > li > a:hover,
.menu > li > ul > li > a:hover {
    color: #ffffff;
    background-color: #ee4c45;
    text-decoration: none;
}
.off-canvas {
    width: 250px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 100;
    visibility: hidden;
    position: fixed;
    transform: translate3d(250px,0,0);
    box-sizing: border-box;
    background: #18191f;
    display: block;
    text-align: center;
    overflow-y: auto;
    transition: transform 0.5s, visibility 0s 0.5s;
}
.open .off-canvas {
    visibility: visible;
    transition-delay: 0s;
    transform: translate3d(0,0,0);
}
.off-canvas.mobile ul li {
    display: block;
    flex: 0 0 auto;
    width: 100%;
}
.off-canvas.mobile ul ul {
    margin: 0;
}
.off-canvas.mobile ul > li > a,
.off-canvas.mobile ul > li > ul > li > a {
    color: #ffffff;
    display: block;
    width: 100%;
    text-align: left;
    padding: 0.7rem 1rem;
}
.off-canvas.mobile ul > li > ul > li > a {
    padding: 0.5rem 2rem;
}
.off-canvas.mobile ul > li.current-menu-item a {
    background: #111;
}
.off-canvas.mobile ul > li.current-menu-item a:hover {
    
}

/* Searchbar & Languagebar */

.function-btns {
    float: right;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    line-height: 1;
    display: inline-block;
}
.function-btns li {
    float: left;
    padding: 1rem;
}

  /* ---------- 960 ---------- */
  @media screen and (min-width: 960px) {
    .logo img {
        width: 240px;
        line-height: 1;
        padding: 1rem 0.938rem;
    }
    .scrolled .logo img {
		padding: 0.725rem 0.938rem;
    	width: 130px;
    }
    .open .off-canvas {
        visibility: hidden;
        transition-delay: 0s;
        transform: translate3d(-250px,0,0); /* shift menu -width to hide it initially */
    }
    .open #overlay, #overlay { display: none; }
    .desktop .menu-paavalikko-container ul { 
        display: inline-block;
        float: left;
        width: auto;
    }
    .menu-toggler { display: none; }
    .menu > li {
        float: left;
    }
    .menu > li > a {
        line-height: 1.1;
        padding: 1rem;
        display: inline-block;
    }
    ul.menu li.level1.hasSubItems > ul,
    ul.menu li.level2.hasSubItems > ul {
        background-color: #e91f13;
        list-style: none;
        display: none;
        position: absolute;
        width: 200px;
        margin: 0;
        padding: 0;
    }
    ul.menu .last.level1.hasSubItems > ul {
        right: 0;
    }
    ul.menu li.level1.hasSubItems:hover > ul {
        display: block;
    }
    ul.menu li.level1.hasSubItems:hover a {
        color: #ffffff;
        background-color: #e91f13;
    }
    ul.menu ul li a, 
    ul.menu ul ul li a {
        color: #fff;
        font-size: 0.875rem;
        font-weight: 300;
        display: block;
        padding: 0.875rem 1rem;
    }
    ul.menu ul li,
    ul.menu ul li a {
        width: 100%;
    }
    ul.menu ul li {
      border-bottom: 1px solid #86af1c;
    }
    ul.menu ul li:last-child {
      border-bottom: 0;
    }
    ul.menu li.level2 a:hover,
    ul.menu li.level2.hasSubItems a:hover {
        color: #fff;
        background: #7ba413 !important;
    }
    .menu li.current-menu-item a,
    .menu > li.current-menu-item a:hover {
      color: #ee4c45;
      background: #fefefe;
      text-decoration: underline;
    }
    .scrolled .menu > li > a {
        line-height: 1.2;
    }
    .scrolled .function-btns span {
        line-height: 1.2;
    }
  }

/* Product Items
      ========================================================================== */

.products .columns {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
.item-container {
    list-style: none;
    margin: 0;
    padding: 1rem 0;
}
.item-container .column, .staff {
    text-align:center;
    padding-bottom: 0.9375rem;
}
.staff .item-container .column img,
.staff img {
    border-radius: 300px;
    margin: 1rem;
    max-width: 50%;
}
.products .column a img {
    border-radius: 300px;
    margin: 1rem;
    box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.25);
    max-width: 80%;
    opacity: 1;
    transition: all .2s ease;
}
.products .column a:hover img {
    opacity: 0.9;
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}
.products .column a:hover h3,
.products .column a:hover {
  text-decoration: none;
  color: #e91f13;
}
.staff img {
    max-width: 50%;
}
.item-container .column > a,
.staff > a {
    display: inline-block;
    color: #333;
}
.item-container .column h3,
.staff h3 {
    font-size: 1rem;
    font-weight: 700;
}

  /* ---------- 640 ---------- */
  @media screen and (min-width: 640px) {
    .staff .item-container .column img,
    .staff img {
        max-width: 75%;
    }
    .item-container .column h3,
    .staff h3 {
        font-size: 1.250rem;
    }
  }


/* --------- Images & Image gallery -------- */

.content img {
    margin-bottom: 2rem;
}
.image-group {
    list-style: outside none none;
    margin: 0 auto;
    overflow: hidden;
    padding: 1px;
    text-align: center;
    width: 100%;
}
.image-group li {
    display: inline-block;
    float: left;
    height: 150px;
    max-width: 600px;
    position: relative;
    width: 50%;
}
.image-group li a {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    height: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    transition: all 0.3s ease 0s;
    width: 100%;
}
.image-group li a span {
    align-items: center;
    background-color: rgba(255, 255, 255, 0);
    border: 1px solid rgba(255, 255, 255, 1);
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    text-align: center;
    transition: all 0.1s linear 0s;
    width: 100%;
}
.image-group li a span h3 {
    color: #000;
    opacity: 0;
    transition: all 0.1s linear 0s;
}
.image-group li a:hover span {
    background-color: rgba(255, 255, 255, 0);
    border: 1px solid rgba(255, 255, 255, 1);
}
.image-group li a:hover span h3 {
    opacity: 1;
}


/* ---------- 640 ---------- */
@media screen and (min-width: 640px) {
  .thumblist {
      margin: 0;
      padding: 0;
  }
  .image-group {
      margin: 0;
      padding: 1px;
  }
  .image-group li {
      display: inline-block;
      height: 300px;
      max-height: 600px;
      max-width: 800px;
      text-align: left;
      width: 33.333%;
  }
  .image-group li a span {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 1);
  }
  .image-group li a:hover span {
    background-color: rgba(255, 255, 255, 0);
    border: 5px solid rgba(255, 255, 255, 0.75);
}
  .gallery-item img {
      height: auto;
      max-width: 100%;
      width: auto;
  }
  .entry-title.single-title {
      margin: auto;
      max-width: 80%;
  }
}


/* ---------- 830 ---------- */
@media screen and (min-width: 830px) {
  .gallery-item img {
      max-width: 800px;
  }
}


/* ---------- 1000 ---------- */
@media screen and (min-width: 1000px) {
  .thumblist {
      margin: 40px 0;
      padding: 0;
  }
  .image-group {
      margin: 0;
      padding: 1px;
  }
  .image-group li {
      display: inline-block;
      height: 260px;
      max-height: 400px;
      max-width: 600px;
      text-align: left;
      width: 25%;
  }
}



/* FORMS */

.wpcf7-submit {
    background-color: #666;
    border: 0 none;
    color: #fff;
    font-size: 1em;
    font-weight: 700;
    padding: 0.8em 2em;
    text-transform: uppercase;
    transition: background-color 0.3s ease 0s;
}
.wpcf7-submit:hover {
    background-color: #ee4c45;
    color: #fff;
}
.wpcf7-submit:active {
    background-color: #ccc;
}
.mouse-scroll {
    bottom: 60px;
    display: block;
    margin: auto;
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 20;
}
.scroll-icon {
    display: none;
    text-align: center;
    width: auto;
    opacity: 1;
    transition: all .3s ease;
}
.scrolled .scroll-icon {
    opacity: 0.15;
}
.scroll-icon img {
	width: 26px;
}

/* ---------- 640 ---------- */
@media screen and (min-width: 640px) {
  .scroll-icon {
  	display: inline-block;
  }
}