/* RESETS */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;
	}

body{
	font-family: Proxy, Helvetica, Arial, sans-serif; 
	font-size:14px; 
	line-height: 14px;
	margin:0;
	}
	
ul,ol,dl,dd,dt,figure,button,address,form,fieldset{margin:0; padding:0;}
ol,ul{list-style: none;}

fieldset{border:0;}
a{display: inline-block; zoom:1; font-family: Proxy; text-decoration: none; color: #000;}
a:active, a:hover, a:visited{color: #000;}
button{
	display: block; 
	border:0; 
	cursor: pointer; 
	font-size:14px; 
	font-family: Proxy;
	padding:10px 20px;
	background-position: center -10px;
	transition: background 0.3s ease-out;
	-webkit-transition: background 0.3s ease-out;
	-moz-transition: background 0.3s ease-out;
	}
	button[type="submit"]{margin-top:15px;}
	
input{
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #ccc;
	height:34px; 
	padding:0 5px; 
	font-size:14px; 
	font-family: Proxy; 
	display: inline-block; zoom:1; 
	border-radius: 2px;
	width:200px;
	}
	input[type="radio"], input[type="checkbox"]{
		width:auto;
		padding:0;
		height:auto;
		border:0;
		}
	
label{
	display: inline-block; zoom:1; 
	position: relative; 
	margin-top:15px;
	cursor: pointer;
	}
legend{
	width:100%; 
	display: block; 
	font-size:16px; 
	margin:10px 0; 
	padding:0;
	font-family: ProxyBold;
	}

/* STANDAARD CLASSES */	
.wrapper{margin:0 auto; width:80%; position: relative;}
.left{float: left;}
.right{float: right;}

.break{clear: both;}
.clear:before, .clear:after {
	content: "\0020";
	display: block;
	height: 0;
	overflow: hidden;
	}
	.clear:after {clear: both;}

.justify-middle{text-align: justify; line-height: 0; font-size:1px;}
	.justify-middle > * {line-height: 100%; display: inline-block; zoom:1; font-size:14px;}	
	.justify-middle:after{width:100%; content: ""; display: inline-block; zoom:1;}	
	
/* STANDAARD ELEMENTEN */

/* Navigatie */
.main-nav > ul{font-size:0%; line-height: 0%;}
	.main-nav > ul > li{ 
		font-size:14px;
		line-height: 14px;
		display: inline-block; zoom:1;
		text-align: center;
		vertical-align: top;
		position: relative;
		}
		.main-nav > ul > li > a{background:#f5f5f5; padding:10px 20px;}
		.main-nav > ul > li > a:hover{background: #fff;}
		
		/* Dropdown */
		.sub-nav{
			position: absolute; 
			left:auto; 
			width:200px; 
			border-top: 4px solid transparent;
			display: none;
			z-index: 1;
			}
			.sub-nav a{background: #f5f5f5; display: block; padding:10px 5px;}
			.main-nav > ul > li:hover .sub-nav{display: block;}
		
/* Breadcrumbs */
.breadcrumbs{font-size:0;}
.breadcrumbs li{display: inline-block; zoom:1; font-size:14px;}
	.breadcrumbs li:before{
		display: inline-block; zoom:1; 
		content: "/"; 
/* 		font-family: KeytoeIcons;  */
		margin:0 5px;
		color: #D1C8C8;
		}
	.breadcrumbs li:first-child:before{content: ""; margin-left:-5px;}
		.breadcrumbs a{padding:10px 0;}

/* Formulieren */
label > span{display: inline-block; zoom:1; width:200px;}
label > span + .ax-label{left:209px; right:auto;}
.indent{margin-left:200px;}

.input-icon input{padding-left:25px;}
.input-icon:before{
	position: absolute; 
	right:175px;
	top:10px;
	}
	div.input-warning{
		z-index: 3;
		position: absolute;
		right:0; 
		top:-50px; 
		padding:15px 25px;
		background:#ed3030;
		border:1px solid #cb2e2e;
		border-radius: 2px;
		max-width:250px;
		color: #fff;
		display: none;
		}
		.ax-label{
			color: #47caeb; 
			position: absolute; 
			left:5px; 
			top:-12px;
			width:auto;
			font-size:10px;
			font-weight: normal;
			border-radius: 2px;
			opacity:0;
			-webkit-transition: all 0.4s ease-in;
			-moz-transition: all 0.4s ease-in;
			transition: all 0.4s ease-in;
			}
			.ax-label.typing{opacity:1; top:-7px;}
			.input-icon .ax-label{left:25px;}
			
		div.input-warning::before{
			font-family: KeytoeIcons;
			content: "\e82b";
			position: absolute;
			bottom:-11px;
			color:#cb2e2e;
			}
		label.warning input{border-bottom: 1px solid #ed3030;}	
		label:hover .input-warning, label:focus .input-warning{display: block;}
/* Product Gallery */

/* Filter */
.filter-box fieldset{margin-top:25px;}
	.filter-box fieldset:first-child{margin-top:0;}
.filter-box label{display: block; margin-top:auto;}
	.filter-box .active .more:before{
		-webkit-transform: rotate(180deg);
		-moz-transform: rotate(180deg);
		-o-transform: rotate(180deg);
		transform: rotate(180deg);
		}

/* Frequently Asked Questions*/
.faq-list dt{border-top:1px solid #f5f5f5; padding:10px 0; position: relative;}
	.faq-list dt a{font-family: ProxyBold; padding-left:10px; display: block;}
		.faq-list dt:first-child{border-top:0;}
	
.faq-list dt:before{
	position: absolute;
	left:0;
	content: "\e821"; 
	font-family: KeytoeIcons;
	-webkit-transition: all 0.4s ease-in ;
	}
	.faq-list dt.active:before{
		-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
	}
.faq-list dd{display: none; margin-left:10px;}
	.faq-list dd > p:first-child{margin-top:0;}
	.faq-list dd > p:last-child{margin-bottom:0;}
	
/* Tabs */
.tab-nav{position: relative;}
.tab-nav:before{
	content: "";
	width:100%;
	position: absolute;
	bottom:0;
	left:0;
	border-bottom:1px solid #f5f5f5;
	z-index: -1;
	}
.tab-nav li{display: inline-block; zoom:1; margin-left:-4px; z-index: 1;}
	.tab-nav li:first-child{margin-left:0;}
		.tab-nav li:first-child a{border-left:1px solid #f5f5f5;}
		.tab-nav li:last-child a{border-right:1px solid #f5f5f5;}
		
	.tab-nav .selected{background: #fff; z-index: 2; border-bottom:1px solid #fff;}
		.tab-nav a{display: block; padding:10px 20px;}
		
.tabs > article{
	display:none; 
	padding:20px; 
	border-width:0 1px 1px 1px; 
	border-style: solid; 
	border-color: #f5f5f5;
	}
.tabs header{font-size:18px; font-family: ProxyBold;}
	
/*Accordion*/
.accordion{width:200px; border: 1px solid #aaa;}
	.accordion > li{background: #ddd;}
		.accordion > li:first-child > a{border-top:0;}
		.accordion > li > a{padding:10px 5px; display: block; border-top: 1px solid #aaa;}

	.level-2, .level-3{display: none;}		
		.level-2 li{background: #f5f5f5;}
			.level-2 li a{padding:10px 25px; display: block; border-top:1px solid white;}
			.level-2 li:first-child > a{border-top:1px solid #aaa;}
			
		.level-3 li{background: #fafafa;}
			.level-3 li a{padding:10px 40px; border-top:1px solid #ddd;}

/* Veelgebruikte elementen */
.pagination-top strong{text-align: left;}
.pagination-top label{margin-top:0;}
/*Proxima Nova. Mijn schatje.*/
@font-face {
    font-family: 'ProxyBold';
    src: url('../fonts/proximanova-bold-webfont.eot');
    src: url('../fonts/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/proximanova-bold-webfont.woff') format('woff'),
         url('../fonts/proximanova-bold-webfont.ttf') format('truetype'),
         url('../fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

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

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

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

@font-face {
  font-family: 'KeytoeIcons';
  src: url('../fonts/keytoe_std.eot?56754355');
  src: url('../fonts/keytoe_std.eot?56754355#iefix') format('embedded-opentype'),
       url('../fonts/keytoe_std.woff?56754355') format('woff'),
       url('../fonts/keytoe_std.ttf?56754355') format('truetype'),
       url('../fonts/keytoe_std.svg?56754355#KeytoeIcons') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'keytoe_std';
    src: url('../font/keytoe_std.svg?56754355#keytoe_std') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "KeytoeIcons";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
     
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-search:before { content: '\e800'; } /* '' */
.icon-mail:before { content: '\e801'; } /* '' */
.icon-heart:before { content: '\e802'; } /* '' */
.icon-star:before { content: '\e803'; } /* '' */
.icon-user:before { content: '\e804'; } /* '' */
.icon-users:before { content: '\e805'; } /* '' */
.icon-user-add:before { content: '\e806'; } /* '' */
.icon-menu:before { content: '\e807'; } /* '' */
.icon-check:before { content: '\e808'; } /* '' */
.icon-cancel:before { content: '\e809'; } /* '' */
.icon-cancel-circled:before { content: '\e80a'; } /* '' */
.icon-cancel-squared:before { content: '\e80b'; } /* '' */
.icon-plus:before { content: '\e80c'; } /* '' */
.icon-plus-circled:before { content: '\e80d'; } /* '' */
.icon-plus-squared:before { content: '\e80e'; } /* '' */
.icon-info:before { content: '\e80f'; } /* '' */
.icon-home:before { content: '\e810'; } /* '' */
.icon-info-circled:before { content: '\e811'; } /* '' */
.icon-lock:before { content: '\e812'; } /* '' */
.icon-lock-open:before { content: '\e813'; } /* '' */
.icon-thumbs-up:before { content: '\e814'; } /* '' */
.icon-thumbs-down:before { content: '\e815'; } /* '' */
.icon-download:before { content: '\e816'; } /* '' */
.icon-quote:before { content: '\e817'; } /* '' */
.icon-export:before { content: '\e818'; } /* '' */
.icon-pencil:before { content: '\e819'; } /* '' */
.icon-comment:before { content: '\e81a'; } /* '' */
.icon-chat:before { content: '\e81b'; } /* '' */
.icon-location:before { content: '\e81c'; } /* '' */
.icon-phone:before { content: '\e81d'; } /* '' */
.icon-share:before { content: '\e81e'; } /* '' */
.icon-down-open:before { content: '\e81f'; } /* '' */
.icon-left-open:before { content: '\e820'; } /* '' */
.icon-right-open:before { content: '\e821'; } /* '' */
.icon-up-open:before { content: '\e822'; } /* '' */
.icon-down-open-mini:before { content: '\e823'; } /* '' */
.icon-left-open-mini:before { content: '\e824'; } /* '' */
.icon-right-open-mini:before { content: '\e825'; } /* '' */
.icon-up-open-mini:before { content: '\e826'; } /* '' */
.icon-down-open-big:before { content: '\e827'; } /* '' */
.icon-left-open-big:before { content: '\e828'; } /* '' */
.icon-right-open-big:before { content: '\e829'; } /* '' */
.icon-up-open-big:before { content: '\e82a'; } /* '' */
.icon-down-dir:before { content: '\e82b'; } /* '' */
.icon-left-dir:before { content: '\e82c'; } /* '' */
.icon-right-dir:before { content: '\e82d'; } /* '' */
.icon-up-dir:before { content: '\e82e'; } /* '' */
.icon-list:before { content: '\e82f'; } /* '' */
.icon-twitter:before { content: '\e830'; } /* '' */
.icon-twitter-circled:before { content: '\e831'; } /* '' */
.icon-facebook:before { content: '\e832'; } /* '' */
.icon-facebook-circled:before { content: '\e833'; } /* '' */
.icon-gplus:before { content: '\e834'; } /* '' */
.icon-gplus-circled:before { content: '\e835'; } /* '' */
.icon-linkedin:before { content: '\e836'; } /* '' */
.icon-linkedin-circled:before { content: '\e837'; } /* '' */
.icon-basket:before { content: '\e838'; } /* '' */
.icon-calendar:before { content: '\e839'; } /* '' */
.icon-attach:before { content: '\e83a'; } /* '' */
.icon-clock:before { content: '\e83b'; } /* '' */
.icon-attention:before { content: '\e83c'; } /* '' */
.icon-floppy:before { content: '\e83d'; } /* '' */
.icon-chart-bar:before { content: '\e83e'; } /* '' */
.icon-chart-area:before { content: '\e83f'; } /* '' */
.icon-book:before { content: '\e840'; } /* '' */
.icon-trash:before { content: '\e841'; } /* '' */
.icon-cup:before { content: '\e842'; } /* '' */
.icon-upload-cloud:before { content: '\e843'; } /* '' */
.icon-upload:before { content: '\e844'; } /* '' */
.icon-help:before { content: '\e845'; } /* '' */
.icon-doc-text:before { content: '\e846'; } /* '' */
.icon-map:before { content: '\e847'; } /* '' */
.icon-th-large:before { content: '\e848'; } /* '' */
.icon-pinterest-circled:before { content: '\e849'; } /* '' */
.icon-ok-circled:before { content: '\e84a'; } /* '' */
.icon-cancel-circled-1:before { content: '\e84b'; } /* '' */

/* Grid (unsemantic) www unsemantic com */
/* ============================================ */
/* This file has a mobile-to-desktop breakpoint */
/* ============================================ */
@media screen and (max-width: 400px) {
  @-ms-viewport {
    width: 320px;
}
}
/*
@media all {
  .clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
  }
*/

  .grid-container:before, .clearfix:before,
  .grid-container:after,
  .clearfix:after {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
  }

  .grid-container:after, .clearfix:after {
    clear: both;
  }

  .grid-container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .grid-5, .mobile-grid-5, .grid-10, .mobile-grid-10, .grid-15, .mobile-grid-15, .grid-20, .mobile-grid-20, .grid-25, .mobile-grid-25, .grid-30, .mobile-grid-30, .grid-35, .mobile-grid-35, .grid-40, .mobile-grid-40, .grid-45, .mobile-grid-45, .grid-50, .mobile-grid-50, .grid-55, .mobile-grid-55, .grid-60, .mobile-grid-60, .grid-65, .mobile-grid-65, .grid-70, .mobile-grid-70, .grid-75, .mobile-grid-75, .grid-80, .mobile-grid-80, .grid-85, .mobile-grid-85, .grid-90, .mobile-grid-90, .grid-95, .mobile-grid-95, .grid-100, .mobile-grid-100, .grid-33, .mobile-grid-33, .grid-66, .mobile-grid-66 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom:10px;
    padding-top:10px;
  }

.cms-block-cnt .grid-5, .cms-block-cnt .mobile-grid-5, .cms-block-cnt .grid-10, .cms-block-cnt .mobile-grid-10, .cms-block-cnt .grid-15, .cms-block-cnt .mobile-grid-15, .cms-block-cnt .grid-20, .cms-block-cnt .mobile-grid-20, .cms-block-cnt .grid-25, .cms-block-cnt .mobile-grid-25, .cms-block-cnt .grid-30, .cms-block-cnt .mobile-grid-30, .cms-block-cnt .grid-35, .cms-block-cnt .mobile-grid-35, .cms-block-cnt .grid-40, .cms-block-cnt .mobile-grid-40, .cms-block-cnt .grid-45, .cms-block-cnt .mobile-grid-45, .cms-block-cnt .grid-50, .cms-block-cnt .mobile-grid-50, .cms-block-cnt .grid-55, .cms-block-cnt .mobile-grid-55, .cms-block-cnt .grid-60, .cms-block-cnt .mobile-grid-60, .cms-block-cnt .grid-65, .cms-block-cnt .mobile-grid-65, .cms-block-cnt .grid-70, .mobile-grid-70, .cms-block-cnt .grid-75, .cms-block-cnt .mobile-grid-75, .cms-block-cnt .grid-80, .cms-block-cnt .mobile-grid-80, .cms-block-cnt .grid-85, .cms-block-cnt .mobile-grid-85, .cms-block-cnt .grid-90, .cms-block-cnt .mobile-grid-90, .cms-block-cnt .grid-95, .cms-block-cnt .mobile-grid-95, .cms-block-cnt .grid-100, .cms-block-cnt .mobile-grid-100, .cms-block-cnt .grid-33, .cms-block-cnt .mobile-grid-33, .cms-block-cnt .grid-66, .cms-block-cnt .mobile-grid-66{padding-left:25px; padding-right:25px; margin-bottom:25px;}
  
  .grid-parent {
    padding-left: 0;
    padding-right: 0;
  }


@media screen and (max-width: 767px) {	
  .mobile-grid-100:before,
  .mobile-grid-100:after {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
  }

  .mobile-grid-100:after {
    clear: both;
  }

  .mobile-push-5,
  .mobile-pull-5, .mobile-push-10,
  .mobile-pull-10, .mobile-push-15,
  .mobile-pull-15, .mobile-push-20,
  .mobile-pull-20, .mobile-push-25,
  .mobile-pull-25, .mobile-push-30,
  .mobile-pull-30, .mobile-push-35,
  .mobile-pull-35, .mobile-push-40,
  .mobile-pull-40, .mobile-push-45,
  .mobile-pull-45, .mobile-push-50,
  .mobile-pull-50, .mobile-push-55,
  .mobile-pull-55, .mobile-push-60,
  .mobile-pull-60, .mobile-push-65,
  .mobile-pull-65, .mobile-push-70,
  .mobile-pull-70, .mobile-push-75,
  .mobile-pull-75, .mobile-push-80,
  .mobile-pull-80, .mobile-push-85,
  .mobile-pull-85, .mobile-push-90,
  .mobile-pull-90, .mobile-push-95,
  .mobile-pull-95, .mobile-push-33,
  .mobile-pull-33, .mobile-push-66,
  .mobile-pull-66 {
    position: relative;
  }

  .hide-on-mobile {
    display: none !important;
  }

  .mobile-grid-5 {
    float: left;
    width: 5%;
  }

  .mobile-prefix-5 {
    margin-left: 5%;
  }

  .mobile-suffix-5 {
    margin-right: 5%;
  }

  .mobile-push-5 {
    left: 5%;
  }

  .mobile-pull-5 {
    left: -5%;
  }

  .mobile-grid-10 {
    float: left;
    width: 10%;
  }

  .mobile-prefix-10 {
    margin-left: 10%;
  }

  .mobile-suffix-10 {
    margin-right: 10%;
  }

  .mobile-push-10 {
    left: 10%;
  }

  .mobile-pull-10 {
    left: -10%;
  }

  .mobile-grid-15 {
    float: left;
    width: 15%;
  }

  .mobile-prefix-15 {
    margin-left: 15%;
  }

  .mobile-suffix-15 {
    margin-right: 15%;
  }

  .mobile-push-15 {
    left: 15%;
  }

  .mobile-pull-15 {
    left: -15%;
  }

  .mobile-grid-20 {
    float: left;
    width: 20%;
  }

  .mobile-prefix-20 {
    margin-left: 20%;
  }

  .mobile-suffix-20 {
    margin-right: 20%;
  }

  .mobile-push-20 {
    left: 20%;
  }

  .mobile-pull-20 {
    left: -20%;
  }

  .mobile-grid-25 {
    float: left;
    width: 25%;
  }

  .mobile-prefix-25 {
    margin-left: 25%;
  }

  .mobile-suffix-25 {
    margin-right: 25%;
  }

  .mobile-push-25 {
    left: 25%;
  }

  .mobile-pull-25 {
    left: -25%;
  }

  .mobile-grid-30 {
    float: left;
    width: 30%;
  }

  .mobile-prefix-30 {
    margin-left: 30%;
  }

  .mobile-suffix-30 {
    margin-right: 30%;
  }

  .mobile-push-30 {
    left: 30%;
  }

  .mobile-pull-30 {
    left: -30%;
  }

  .mobile-grid-35 {
    float: left;
    width: 35%;
  }

  .mobile-prefix-35 {
    margin-left: 35%;
  }

  .mobile-suffix-35 {
    margin-right: 35%;
  }

  .mobile-push-35 {
    left: 35%;
  }

  .mobile-pull-35 {
    left: -35%;
  }

  .mobile-grid-40 {
    float: left;
    width: 40%;
  }

  .mobile-prefix-40 {
    margin-left: 40%;
  }

  .mobile-suffix-40 {
    margin-right: 40%;
  }

  .mobile-push-40 {
    left: 40%;
  }

  .mobile-pull-40 {
    left: -40%;
  }

  .mobile-grid-45 {
    float: left;
    width: 45%;
  }

  .mobile-prefix-45 {
    margin-left: 45%;
  }

  .mobile-suffix-45 {
    margin-right: 45%;
  }

  .mobile-push-45 {
    left: 45%;
  }

  .mobile-pull-45 {
    left: -45%;
  }

  .mobile-grid-50 {
    float: left;
    width: 50%;
  }

  .mobile-prefix-50 {
    margin-left: 50%;
  }

  .mobile-suffix-50 {
    margin-right: 50%;
  }

  .mobile-push-50 {
    left: 50%;
  }

  .mobile-pull-50 {
    left: -50%;
  }

  .mobile-grid-55 {
    float: left;
    width: 55%;
  }

  .mobile-prefix-55 {
    margin-left: 55%;
  }

  .mobile-suffix-55 {
    margin-right: 55%;
  }

  .mobile-push-55 {
    left: 55%;
  }

  .mobile-pull-55 {
    left: -55%;
  }

  .mobile-grid-60 {
    float: left;
    width: 60%;
  }

  .mobile-prefix-60 {
    margin-left: 60%;
  }

  .mobile-suffix-60 {
    margin-right: 60%;
  }

  .mobile-push-60 {
    left: 60%;
  }

  .mobile-pull-60 {
    left: -60%;
  }

  .mobile-grid-65 {
    float: left;
    width: 65%;
  }

  .mobile-prefix-65 {
    margin-left: 65%;
  }

  .mobile-suffix-65 {
    margin-right: 65%;
  }

  .mobile-push-65 {
    left: 65%;
  }

  .mobile-pull-65 {
    left: -65%;
  }

  .mobile-grid-70 {
    float: left;
    width: 70%;
  }

  .mobile-prefix-70 {
    margin-left: 70%;
  }

  .mobile-suffix-70 {
    margin-right: 70%;
  }

  .mobile-push-70 {
    left: 70%;
  }

  .mobile-pull-70 {
    left: -70%;
  }

  .mobile-grid-75 {
    float: left;
    width: 75%;
  }

  .mobile-prefix-75 {
    margin-left: 75%;
  }

  .mobile-suffix-75 {
    margin-right: 75%;
  }

  .mobile-push-75 {
    left: 75%;
  }

  .mobile-pull-75 {
    left: -75%;
  }

  .mobile-grid-80 {
    float: left;
    width: 80%;
  }

  .mobile-prefix-80 {
    margin-left: 80%;
  }

  .mobile-suffix-80 {
    margin-right: 80%;
  }

  .mobile-push-80 {
    left: 80%;
  }

  .mobile-pull-80 {
    left: -80%;
  }

  .mobile-grid-85 {
    float: left;
    width: 85%;
  }

  .mobile-prefix-85 {
    margin-left: 85%;
  }

  .mobile-suffix-85 {
    margin-right: 85%;
  }

  .mobile-push-85 {
    left: 85%;
  }

  .mobile-pull-85 {
    left: -85%;
  }

  .mobile-grid-90 {
    float: left;
    width: 90%;
  }

  .mobile-prefix-90 {
    margin-left: 90%;
  }

  .mobile-suffix-90 {
    margin-right: 90%;
  }

  .mobile-push-90 {
    left: 90%;
  }

  .mobile-pull-90 {
    left: -90%;
  }

  .mobile-grid-95 {
    float: left;
    width: 95%;
  }

  .mobile-prefix-95 {
    margin-left: 95%;
  }

  .mobile-suffix-95 {
    margin-right: 95%;
  }

  .mobile-push-95 {
    left: 95%;
  }

  .mobile-pull-95 {
    left: -95%;
  }

  .mobile-grid-33 {
    float: left;
    width: 33.33333%;
  }

  .mobile-prefix-33 {
    margin-left: 33.33333%;
  }

  .mobile-suffix-33 {
    margin-right: 33.33333%;
  }

  .mobile-push-33 {
    left: 33.33333%;
  }

  .mobile-pull-33 {
    left: -33.33333%;
  }

  .mobile-grid-66 {
    float: left;
    width: 66.66667%;
  }

  .mobile-prefix-66 {
    margin-left: 66.66667%;
  }

  .mobile-suffix-66 {
    margin-right: 66.66667%;
  }

  .mobile-push-66 {
    left: 66.66667%;
  }

  .mobile-pull-66 {
    left: -66.66667%;
  }

  .mobile-grid-100 {
    clear: both;
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  .grid-100:before,
  .grid-100:after {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
  }

  .grid-100:after {
    clear: both;
  }

  .push-5,
  .pull-5, .push-10,
  .pull-10, .push-15,
  .pull-15, .push-20,
  .pull-20, .push-25,
  .pull-25, .push-30,
  .pull-30, .push-35,
  .pull-35, .push-40,
  .pull-40, .push-45,
  .pull-45, .push-50,
  .pull-50, .push-55,
  .pull-55, .push-60,
  .pull-60, .push-65,
  .pull-65, .push-70,
  .pull-70, .push-75,
  .pull-75, .push-80,
  .pull-80, .push-85,
  .pull-85, .push-90,
  .pull-90, .push-95,
  .pull-95, .push-33,
  .pull-33, .push-66,
  .pull-66 {
    position: relative;
  }

  .hide-on-desktop {
    display: none !important;
  }

  .grid-5 {
    float: left;
    width: 5%;
  }

  .prefix-5 {
    margin-left: 5%;
  }

  .suffix-5 {
    margin-right: 5%;
  }

  .push-5 {
    left: 5%;
  }

  .pull-5 {
    left: -5%;
  }

  .grid-10 {
    float: left;
    width: 10%;
  }

  .prefix-10 {
    margin-left: 10%;
  }

  .suffix-10 {
    margin-right: 10%;
  }

  .push-10 {
    left: 10%;
  }

  .pull-10 {
    left: -10%;
  }

  .grid-15 {
    float: left;
    width: 15%;
  }

  .prefix-15 {
    margin-left: 15%;
  }

  .suffix-15 {
    margin-right: 15%;
  }

  .push-15 {
    left: 15%;
  }

  .pull-15 {
    left: -15%;
  }

  .grid-20 {
    float: left;
    width: 20%;
  }

  .prefix-20 {
    margin-left: 20%;
  }

  .suffix-20 {
    margin-right: 20%;
  }

  .push-20 {
    left: 20%;
  }

  .pull-20 {
    left: -20%;
  }

  .grid-25 {
    float: left;
    width: 25%;
  }

  .prefix-25 {
    margin-left: 25%;
  }

  .suffix-25 {
    margin-right: 25%;
  }

  .push-25 {
    left: 25%;
  }

  .pull-25 {
    left: -25%;
  }

  .grid-30 {
    float: left;
    width: 30%;
  }

  .prefix-30 {
    margin-left: 30%;
  }

  .suffix-30 {
    margin-right: 30%;
  }

  .push-30 {
    left: 30%;
  }

  .pull-30 {
    left: -30%;
  }

  .grid-35 {
    float: left;
    width: 35%;
  }

  .prefix-35 {
    margin-left: 35%;
  }

  .suffix-35 {
    margin-right: 35%;
  }

  .push-35 {
    left: 35%;
  }

  .pull-35 {
    left: -35%;
  }

  .grid-40 {
    float: left;
    width: 40%;
  }

  .prefix-40 {
    margin-left: 40%;
  }

  .suffix-40 {
    margin-right: 40%;
  }

  .push-40 {
    left: 40%;
  }

  .pull-40 {
    left: -40%;
  }

  .grid-45 {
    float: left;
    width: 45%;
  }

  .prefix-45 {
    margin-left: 45%;
  }

  .suffix-45 {
    margin-right: 45%;
  }

  .push-45 {
    left: 45%;
  }

  .pull-45 {
    left: -45%;
  }

  .grid-50 {
    float: left;
    width: 50%;
  }

  .prefix-50 {
    margin-left: 50%;
  }

  .suffix-50 {
    margin-right: 50%;
  }

  .push-50 {
    left: 50%;
  }

  .pull-50 {
    left: -50%;
  }

  .grid-55 {
    float: left;
    width: 55%;
  }

  .prefix-55 {
    margin-left: 55%;
  }

  .suffix-55 {
    margin-right: 55%;
  }

  .push-55 {
    left: 55%;
  }

  .pull-55 {
    left: -55%;
  }

  .grid-60 {
    float: left;
    width: 60%;
  }

  .prefix-60 {
    margin-left: 60%;
  }

  .suffix-60 {
    margin-right: 60%;
  }

  .push-60 {
    left: 60%;
  }

  .pull-60 {
    left: -60%;
  }

  .grid-65 {
    float: left;
    width: 65%;
  }

  .prefix-65 {
    margin-left: 65%;
  }

  .suffix-65 {
    margin-right: 65%;
  }

  .push-65 {
    left: 65%;
  }

  .pull-65 {
    left: -65%;
  }

  .grid-70 {
    float: left;
    width: 70%;
  }

  .prefix-70 {
    margin-left: 70%;
  }

  .suffix-70 {
    margin-right: 70%;
  }

  .push-70 {
    left: 70%;
  }

  .pull-70 {
    left: -70%;
  }

  .grid-75 {
    float: left;
    width: 75%;
  }

  .prefix-75 {
    margin-left: 75%;
  }

  .suffix-75 {
    margin-right: 75%;
  }

  .push-75 {
    left: 75%;
  }

  .pull-75 {
    left: -75%;
  }

  .grid-80 {
    float: left;
    width: 80%;
  }

  .prefix-80 {
    margin-left: 80%;
  }

  .suffix-80 {
    margin-right: 80%;
  }

  .push-80 {
    left: 80%;
  }

  .pull-80 {
    left: -80%;
  }

  .grid-85 {
    float: left;
    width: 85%;
  }

  .prefix-85 {
    margin-left: 85%;
  }

  .suffix-85 {
    margin-right: 85%;
  }

  .push-85 {
    left: 85%;
  }

  .pull-85 {
    left: -85%;
  }

  .grid-90 {
    float: left;
    width: 90%;
  }

  .prefix-90 {
    margin-left: 90%;
  }

  .suffix-90 {
    margin-right: 90%;
  }

  .push-90 {
    left: 90%;
  }

  .pull-90 {
    left: -90%;
  }

  .grid-95 {
    float: left;
    width: 95%;
  }

  .prefix-95 {
    margin-left: 95%;
  }

  .suffix-95 {
    margin-right: 95%;
  }

  .push-95 {
    left: 95%;
  }

  .pull-95 {
    left: -95%;
  }

  .grid-33 {
    float: left;
    width: 33.33333%;
  }

  .prefix-33 {
    margin-left: 33.33333%;
  }

  .suffix-33 {
    margin-right: 33.33333%;
  }

  .push-33 {
    left: 33.33333%;
  }

  .pull-33 {
    left: -33.33333%;
  }

  .grid-66 {
    float: left;
    width: 66.66667%;
  }

  .prefix-66 {
    margin-left: 66.66667%;
  }

  .suffix-66 {
    margin-right: 66.66667%;
  }

  .push-66 {
    left: 66.66667%;
  }

  .pull-66 {
    left: -66.66667%;
  }

  .grid-100 {
    clear: both;
    width: 100%;
  }
}