@charset "utf-8";
/* CSS Document */
body {
    font-size: 110%;
    line-height: 26px;
    font-weight: normal;
	font-family: 'Source Sans Pro', sans-serif;

}

body, html{
	margin: 0;
	padding: 0;
	height: 100%;
	border: 0;
    white-space: normal;
    letter-spacing: 0.08em;
    color: #0b595c;
    text-decoration: none;
    background-color: #178588;
	text-align: center;
}

html {
	  -webkit-font-smoothing: antialiased;
      -webkit-text-size-adjust: none;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}

.noscript {
	text-align: center;
	color: white;
	font: normal 14px  'Open Sans', sans-serif;
	background-color: #f52a1b;
	position: fixed;
	top: 200px;
	visibility: visible;
	overflow: hidden;
	z-index: 600000000000;
	width: 980px;
	vertical-align: middle;
	height: auto;
	margin-right: auto;
	margin-top: 0;
	margin-left: auto;
	padding-top: 20px;
	padding-bottom: 20px;
}


ul.ebene_1 {

  list-style-type: none;
  padding-left: 1.4em;
}

li.ebene_1 {
	margin-bottom: 1.0em;
}

li.ebene_1:before {

  content: '&' /*fontawesome char code inside the ''*/;
  display: inline-block;
  margin-left: -1.5em; /*same as padding-left set on li*/
  width: 1.5em; /*same as padding-left set on li*/
  font: normal normal 0.9em 'kratz';
  vertical-align: -1px;

}

ul.ebene_2 {

  list-style-type: disc;
  padding-left: 3.0em;

  list-style-position: outside;
	padding-top: 1.0em;
}

li.ebene_2 {
	  padding-bottom: 1.0em;
}


.icon {
	font: normal normal 24px 'kratz';
	vertical-align: bottom;

}
.icon_2 {
	font: normal normal 40px 'kratz';
	vertical-align: bottom;

}
.icon_3 {
	font: normal normal 60px 'kratz';
	vertical-align: bottom;

}

.ref-popup h2 {

  color: #28765d;

}

.ref-popup {
  position: relative;
  background: #3ea984;
  padding: 0;
  width: 100%;
  max-width: 1200px;
  margin: 40px auto;
  color: #28765d;
	z-index: 2000004;
}

.leistungen-popup h2 {

  color: #ffffff;

}

.leistungen-popup {
  position: relative;
  background: #9bd297;
  padding: 0;
  width: 100%;
  max-width: 1200px;
  margin: 40px auto;
  color: #699066;
	z-index: 2000004;
}

.visitenkarte-popup h2 {
	color: #1a90cb;
}

.Datenschutzerklärung-popup h2 {
	text-align: left;
	color: #116b96;
	  font: 400 1.4em/2em 'Source Sans Pro', sans-serif;
}
.Datenschutzerklärung-popup {
  position: relative;
  background: #004360;
  padding: 0;
  width: 100%;
  max-width: 1200px;
  margin: 40px auto;
  color: #116b96;
	z-index: 2000004;

}


.visitenkarte-popup {
  position: relative;
  background: #004360;
  padding: 0;
  width: 100%;
  max-width: 350px;
  margin: 40px auto;
  color: #116b96;
	z-index: 2000004;
	font-size: 21px;
}

.default-popup {
  position: relative;
  background: white;
  padding: 0;
  width: 100%;
  max-width: 1200px;
  margin: 40px auto;


}

.popup_content {


		overflow: auto;
		width: auto;
		background-color: transparent;
	    padding: 40px 0;
	margin-right: 40px;
	margin-left: 40px;
}


/* overlay at start */
.mfp-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
  background-color: black;
}
/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.30s ease-out;
  -moz-transition: all 0.30s ease-out;
  transition: all 0.30s ease-out;

}
/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;

}
/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}




.btn {
  border: none;

  padding: 0px 0px 0px;
  line-height: 20px;
  text-decoration: none;
  text-shadow: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-transition: 0.25s;
  -moz-transition: 0.25s;
  -o-transition: 0.25s;
  transition: 0.25s;
  -webkit-backface-visibility: hidden;
}
.btn.btn-large {
  color: #0b595c;
  line-height: 20px;
  padding: 14px 40px;
	font-size: 16px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-align: center;
	border: 2px solid #0e5f62;
	  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.btn.btn-large > [class^="fui-"] {
  top: 0;
}
.btn.btn-large > [class^="fui-"].pull-right {
  margin-right: -2px;
}
.btn.btn-primary {
  background-color: transparent;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn-group:focus .btn.btn-primary.dropdown-toggle {
	border: 2px solid white;
	color: white;
}
.btn.btn-primary:active,
.btn-group.open .btn.btn-primary.dropdown-toggle,
.btn.btn-primary.active {
	background-color: transparent;
	border: 2px solid #106b6e;
	color: #0e5f62;
}



#footer a {

    color: #ffffff;
    text-decoration: none;
    letter-spacing: 1px;
    -webkit-transition:  color 0.2s ease-in-out;
    -moz-transition:  color 0.2s ease-in-out;
    -o-transition:  color 0.2s ease-in-out;
    -ms-transition:  color 0.2s ease-in-out;
    transition:  color 0.2s ease-in-out;
    text-decoration: none;
	text-transform: uppercase;
}

#footer a:hover {
    color: #1f1f1f;
}


a {

    color: rgba(255,254,255,0.45);
    text-decoration: none;

    -webkit-transition:  color 0.2s ease-in-out;
    -moz-transition:  color 0.2s ease-in-out;
    -o-transition:  color 0.2s ease-in-out;
    -ms-transition:  color 0.2s ease-in-out;
    transition:  color 0.2s ease-in-out;

    white-space: normal;
    letter-spacing: 0.1em;
	font-weight: normal;
	font-style: normal;
}

a:hover {

    color: #ffffff;

}




.marker {
    font-weight: 600;
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased;

}

.marker_1 {

	color: #1a533f;
	font-style: italic;
	font-size: 1em;
	line-height: 2px;
    -webkit-font-smoothing: antialiased;

}


.marker_2 {
  color: #22bbc0;
  font-size: 30px;
  -webkit-font-smoothing: antialiased;
}


h1 {

   color: rgba(255,254,255,0.63);
   white-space: normal;
   letter-spacing: 0.1em;
   margin-bottom: 1em;
   text-align: center;
   text-transform: uppercase;
   font: 300 2.8em/2em 'Source Sans Pro', sans-serif;
   -webkit-font-smoothing: antialiased;
}


h2 {

  white-space: normal;
  letter-spacing: 0.1em;
  font: 400 1.4em/3em 'Source Sans Pro', sans-serif;
  text-align: center;
  text-transform: uppercase;
  -webkit-font-smoothing: antialiased;
}

h3 {
  white-space: normal;
  font: 400 1.1em/2em 'Source Sans Pro', sans-serif;
  text-align: center;
  letter-spacing: 0.2em;
  -webkit-font-smoothing: antialiased;
}

#Leistungen h2 {

  color: #878888;
}
#Leistungen h3 {

  color: white;
}
#Inhaber h2 {

  color: #699066;
}
#Inhaber h3 {

  color: #699066;
}
#Referenzen h2 {

  color: #28765d;
}
#Referenzen h3 {

  color: #28765d;
}
#Kontakt h2 {

  color: #106b6e;
}
#Kontakt h3 {

  color: #106b6e;
}
#Impressum h2 {

  color: #116b96;
	text-align: left;
}
#Impressum h3 {

  color: #116b96;
	text-align: left;
}


img{
	border: 0;
}


.opacity img
{
	opacity:0.3;
}

.opacity img:hover
{
	opacity:1;
}

.grayscale_opacity img
{
	opacity:0.5;

	filter: grayscale(1);
	-webkit-filter: grayscale(1);
	-moz-filter: grayscale(1);
	-o-filter: grayscale(1);
	-ms-filter: grayscale(1);
}

.grayscale_opacity img:hover
{
	opacity:1;

	filter: grayscale(0);
	-webkit-filter: grayscale(0);
	-moz-filter: grayscale(0);
	-o-filter: grayscale(0);
	-ms-filter: grayscale(0);
}

/*

Responsive Mobile Menu v1.0
Plugin URI: responsivemobilemenu.com

Author: Sergio Vitov
Author URI: http://xmacros.com

License: CC BY 3.0 http://creativecommons.org/licenses/by/3.0/

*/

.rmm {
	display:block;
	position:relative;
	width:100%;
	padding: 10px 0px 0px;
	margin:0 auto !important;
	text-align: center;
	line-height:19px !important;
}
.rmm * {
	-webkit-tap-highlight-color:transparent !important;
}
.rmm a {
	color:#ebebeb;
	text-decoration:none;
	text-transform: uppercase;
	letter-spacing: 2px;
}
.rmm .rmm-main-list, .rmm .rmm-main-list li {
	padding:0px;
	margin: 0;
}
.rmm ul {
	display:block;
	width:auto !important;
	margin:0 auto !important;
	overflow:hidden;
	list-style:none;
}


/* sublevel menu - in construction */
.rmm ul li ul, .rmm ul li ul li, .rmm ul li ul li a {
	display:none !important;
	height:0px !important;
	width:0px !important;
}
/* */


.rmm .rmm-main-list li {
	display:inline;
	padding:padding:0px;
	margin:0px !important;
}
.rmm-toggled {
	display:none;
	width:100%;
	position:relative;
	overflow:hidden;
	margin:0 auto !important;
}
.rmm-button:hover {
	cursor:pointer;
}
.rmm .rmm-toggled ul {
	display:none;
	margin:0px !important;
	padding:0px !important;
}
.rmm .rmm-toggled ul li {
	display:block;
	margin:0 auto !important;
}






/* MINIMAL STYLE */

.rmm.minimal a {
	color: #707171;


}
.rmm.minimal a:hover {

	color: white;
}
.rmm.minimal .rmm-main-list li a {
	display:inline-block;
	padding: 8px 20px;
	margin:0px -3px 0px -3px;
	font-size:18px;
	background-color: transparent;
}
.rmm.minimal .rmm-toggled {
	width:95%;
	min-height:36px;
}
.rmm.minimal .rmm-toggled-controls {
	display:block;
	height:36px;
	color:#707171;
	text-align:left;
	position:relative;
}
.rmm.minimal .rmm-toggled-title {
	position:relative;
	top:9px;
	left:9px;
	font-size:22px;
	color:#707171;
}
.rmm.minimal .rmm-button {
	display:block;
	position:absolute;
	right:9px;
	top:7px;
}

.rmm.minimal .rmm-button span {
	display:block;
	margin: 3px 0px 6px;
	height:3px;
	background:#707171;
	width:25px;
}
.rmm.minimal .rmm-toggled ul li a {
	display:block;
	width:100%;
	text-align:center;
	padding:10px 0px 10px 0px;

	color:#707171;
	border-style: none;
}

.rmm.minimal .rmm-toggled ul li a:hover {
	display:block;
	width:100%;
	text-align:center;
	padding:10px 0px 10px 0px;

	color:#fff;
	border-style: none;
}

.rmm.minimal .rmm-toggled ul li:first-child a {

	border-style: none;
}
.rmm.minimal .rmm-toggled ul li:last-child a {

	border-style: none;
	margin-bottom: 10px;
}














.logo {

  overflow: visible;
  max-width: 100%;
  position: absolute;
  background-color: transparent;
	width: 100%;
	visibility: visible;
	z-index: 999;
	height: 100px;
	top: 36%;
	text-align: center;
}

.logo_center_box{

  overflow: visible;
  max-width: 560px;
  position: relative;
  background-color: transparent;

	visibility: visible;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding: 0 50px;
}

.header_zeile {

	background-color: transparent;
	padding: 0;
	text-align: center;

    position: absolute;
	bottom: 0;
	visibility: visible;
	color: #d8d8d8;
	letter-spacing: 2px;
	overflow: hidden;
	margin: 0 0 20px;
	width: 100%;
}

#Navigation {
	min-height:56px;

	margin: 0;

	overflow: visible;
	width: 100%;
	padding: 0;

	clear: both;
	text-align: center;
	border-style: none;
	color: white;
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	visibility: visible;
	z-index: 1000;
	background: #333 none repeat;
}

#Kratz {


		height: 100%;
		background: #333;
	    position: relative;
	    width: 100%;
	    background-size: cover !important;
	    -webkit-background-size: cover !important;
	    -moz-background-size: cover !important;
	    -o-background-size: cover !important;
		padding: 0;
		margin: 0 auto;


}


/* Weihnachtshintergrund #Kratz {


		height: 100%;
		background: #333 url(../gfx/Hintergrund.jpg) no-repeat center center;
	    position: relative;
	    width: 100%;
	    background-size: cover !important;
	    -webkit-background-size: cover !important;
	    -moz-background-size: cover !important;
	    -o-background-size: cover !important;
		padding: 0;
		margin: 0 auto;


}*/


#Home {
	background: transparent;
	height: auto;
	margin: 0;
	padding: 80px 0;
	position: relative;
}

#Leistungen {
	height: auto;
	margin: 0;
	padding: 80px 0 0;
	position: relative;
	color: #707171;
	background: #414141 none repeat;


}


#Inhaber {
	background: #9bd297 none repeat;
	height: auto;
	margin: 0;
	padding: 80px 0;
	position: relative;
	color: #699066;
	text-align: left;
}

#Referenzen {
	background: #3ea984 none repeat;
	height: auto;
	margin: 0;
	padding: 80px 0;
	position: relative;
	color: #28765d;
	z-index: 1;
}

#Kontakt {
	background: #178588 none repeat;
	height: auto;
	margin: 0;
	padding: 80px 0;
	position: relative;
	color: #0b595c;
}

#Impressum {
	background: #004360 none repeat;
	height: auto;
	margin: 0;
	padding: 80px 0;
	position: relative;
	color: #116b96;
	text-align: left;
}

#footer {
	background: #043249 none repeat;
	height: auto;
	margin: 0 auto;
	padding: 80px 0;
    white-space: normal;
    letter-spacing: 0.08em;
    color: #0b4e70;
    text-decoration: none;
	font-size: 1.2em;
	text-align: center;
    -webkit-font-smoothing: antialiased;
}

.jaf-container {

	height: auto;
	margin: 0;
	padding: 0 0 80px;
	position: relative;
	background-color: transparent;
}


#controls {

	background: #f9fbfb;
	height: 100px;
	margin: 0;
	padding: 0;
	position: relative;
}

.controls_content {
	margin: 0 auto;

	overflow: auto;
	background-color: transparent;
	padding: 7px 0;
	width: 86px;
	height: 100%;
}

#nav_content {
	height:100px;
	margin: 0 auto;
	max-width: 980px;
	width: 100%;
	overflow: auto;
	background-color: transparent;
	padding: 0;
	z-index: 119000000;
}

.content {
	max-width: 980px;
	width: auto;
	overflow: auto;
	background-color: transparent;
	margin: 0 auto;

}




/*
textarea, message {
  width : 100%;


  -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
     -moz-box-sizing: border-box; /* For all Gecko based browsers */
          box-sizing: border-box;
}

.input {
        color: #0b595c;
	    text-decoration: none;
		padding: 0;
		margin: 0px 0px 30px 0;
font-size: 16px;
	    white-space: normal;
        letter-spacing: 0.1em;
	    outline: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;

	background-color: transparent;
	text-indent: 0px;

	  width : 100%;


  -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
     -moz-box-sizing: border-box; /* For all Gecko based browsers */
          box-sizing: border-box;
            -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
	height: 44px;
	border-top-style: none;
	border-left-style: none;
	border-bottom: 2px solid #0e5f62;
	border-right-style: none;
}




.message {
        color: #0b595c;
	    text-decoration: none;
	font-size: 16px;
		height: 250px;
		width: 100%;
	    white-space: normal;
        letter-spacing: 0.1em;

	    padding: 20px 0px 0px;
	    outline: none;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
	background-color: transparent;
	text-indent: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-left: 0;	border-right-style: none;
	border-top-style: none;
	border-left-style: none;
	border-bottom: 2px solid #0e5f62;
}


.input::-webkit-input-placeholder  {
	color: #0b595c;
	text-indent: 0px;
	font-size: 16px;
}
.message::-webkit-input-placeholder  {
	color: #0b595c;
	font-size: 16px;
	text-indent: 0px;
}

.placeholder{
	color: #0b595c;
	text-indent: 0px;
	font-size: 16px;
}

input[type=submit] {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}

*/


/* Image Lightbox */

		/* IMAGE LIGHTBOX SELECTOR

			-webkit-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 );
			-moz-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 );
			box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 );

		*/

		#imagelightbox
		{
			cursor: pointer;
			position: fixed;
			z-index: 10000;

			-ms-touch-action: none;
			touch-action: none;

			-webkit-box-shadow: none; /* 50 */
			-moz-box-shadow: none; /* 50 */
			box-shadow: none; /* 50 */
		}


		/* WITH ACTIVITY INDICATION */

		#imagelightbox-loading,
		#imagelightbox-loading div
		{
			-webkit-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
		}
		#imagelightbox-loading
		{
			width: 1.25em; /* 40 */
			background-color: #444;
			background-color: rgba( 0, 0, 0, .5 );
			position: fixed;
			z-index: 10003;
			top: 50%;
			left: 50%;
			padding: 0.625em; /* 10 */
			margin: -1.25em 0 0 -1.25em; /* 20 */

			-webkit-box-shadow: none; /* 40 */
			-moz-box-shadow: none; /* 40 */
			box-shadow: none;
	        height: 1.25em;
}
			#imagelightbox-loading div
			{
				width: 1.25em; /* 20 */
				height: 1.25em; /* 20 */
				background-color: #fff;

				-webkit-animation: imagelightbox-loading .5s ease infinite;
				-moz-animation: imagelightbox-loading .5s ease infinite;
				-o-animation: imagelightbox-loading .5s ease infinite;
				animation: imagelightbox-loading .5s ease infinite;
			}

			@-webkit-keyframes imagelightbox-loading
			{
				from { opacity: .5;	-webkit-transform: scale( .75 ); }
				50%	 { opacity: 1;	-webkit-transform: scale( 1 ); }
				to	 { opacity: .5;	-webkit-transform: scale( .75 ); }
			}
			@-moz-keyframes imagelightbox-loading
			{
				from { opacity: .5;	-moz-transform: scale( .75 ); }
				50%	 { opacity: 1;	-moz-transform: scale( 1 ); }
				to	 { opacity: .5;	-moz-transform: scale( .75 ); }
			}
			@-o-keyframes imagelightbox-loading
			{
				from { opacity: .5;	-o-transform: scale( .75 ); }
				50%	 { opacity: 1;	-o-transform: scale( 1 ); }
				to	 { opacity: .5;	-o-transform: scale( .75 ); }
			}
			@keyframes imagelightbox-loading
			{
				from { opacity: .5;	transform: scale( .75 ); }
				50%	 { opacity: 1;	transform: scale( 1 ); }
				to	 { opacity: .5;	transform: scale( .75 ); }
			}



		/* WITH OVERLAY */

		#imagelightbox-overlay
		{
			background-color: #fff;
            opacity: 0.8;
            filter: alpha(opacity=80);
         	background-color: #0b0b0b;
			position: fixed;
			z-index: 9998;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
		}


		/* WITH "CLOSE" BUTTON */

		#imagelightbox-close
		{
			width: 2.5em; /* 40 */
			height: 2.5em; /* 40 */
			text-align: left;
			text-indent: -9999px;
			background-color: #666;
			position: fixed;
			z-index: 10002;
			top: 2.5em; /* 40 */
			right: 2.5em; /* 40 */

			-webkit-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;

			-webkit-transition: color .3s ease;
			-moz-transition: color .3s ease;
			-ms-transition: color .3s ease;
			-o-transition: color .3s ease;
			transition: color .3s ease;
		}
			#imagelightbox-close:hover
			{
				background-color: #111;
			}
			#imagelightbox-close:before,
			#imagelightbox-close:after
			{
				width: 2px;
				background-color: #fff;
				content: '';
				position: absolute;
				top: 20%;
				bottom: 20%;
				left: 50%;
				margin-left: -1px;
			}
			#imagelightbox-close:before
			{
				-webkit-transform: rotate( 45deg );
				-moz-transform: rotate( 45deg );
				-ms-transform: rotate( 45deg );
				-o-transform: rotate( 45deg );
				transform: rotate( 45deg );
			}
			#imagelightbox-close:after
			{
				-webkit-transform: rotate( -45deg );
				-moz-transform: rotate( -45deg );
				-ms-transform: rotate( -45deg );
				-o-transform: rotate( -45deg );
				transform: rotate( -45deg );
			}


		/* WITH CAPTION */

		#imagelightbox-caption
		{
			text-align: center;
			color: #fff;
			background-color: #666;
			position: fixed;
			z-index: 10001;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 0.625em; /* 10 */
		}


		/* WITH NAVIGATION */

		#imagelightbox-nav
		{
			background-color: #444;
			background-color: rgba( 0, 0, 0, .5 );
			position: fixed;
			z-index: 10001;
			left: 50%;
			bottom: 3.75em; /* 60 */
			padding: 0.313em; /* 5 */

			-webkit-transform: translateX( -50% );
			-moz-transform: translateX( -50% );
			-ms-transform: translateX( -50% );
			-o-transform: translateX( -50% );
			transform: translateX( -50% );

			-webkit-border-radius: 20px;
			-moz-border-radius: 20px;
			border-radius: 20px;
		}
			#imagelightbox-nav a
			{
				width: 1em; /* 20 */
				height: 1em; /* 20 */
				border: 1px solid #fff;
				display: inline-block;
				margin: 0 0.313em; /* 5 */

				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
				border-radius: 50%;
			}
			#imagelightbox-nav a.active
			{
				background-color: #fff;
			}

	#imagelightbox-loading,
	#imagelightbox-overlay,
	#imagelightbox-close,
	#imagelightbox-caption,
	#imagelightbox-nav
	{
		-webkit-animation: fade-in .25s linear;
		-moz-animation: fade-in .25s linear;
		-o-animation: fade-in .25s linear;
		animation: fade-in .25s linear;
	}
		@-webkit-keyframes fade-in
		{
			from	{ opacity: 0; }
			to		{ opacity: 1; }
		}
		@-moz-keyframes fade-in
		{
			from	{ opacity: 0; }
			to		{ opacity: 1; }
		}
		@-o-keyframes fade-in
		{
			from	{ opacity: 0; }
			to		{ opacity: 1; }
		}
		@keyframes fade-in
		{
			from	{ opacity: 0; }
			to		{ opacity: 1; }
		}

	@media only screen and (max-width: 41.250em) /* 660 */
	{
		#container
		{
			width: 100%;
		}
		#imagelightbox-close
		{
			top: 1.25em; /* 20 */
			right: 1.25em; /* 20 */
		}
		#imagelightbox-nav
		{
			bottom: 1.25em; /* 20 */
		}
	}






/* Image Grid */

.cbp-rfgrid {
    margin: 35px 0 0;
    padding: 0;
    list-style: none;
    position: relative;
    width: 100%;

}

.cbp-rfgrid li {
    position: relative;
    float: left;
    overflow: hidden;
    width: 16.6666667%; /* Fallback */
    width: -webkit-calc(100% / 6);
    width: calc(100% / 6);
}

.cbp-rfgrid li a,
.cbp-rfgrid li a img {
    display: block;
    width: 100%;
    cursor: pointer;
}

.cbp-rfgrid li a img {
    max-width: 100%;
}

/* Flexbox is used for centering the heading */
.cbp-rfgrid li a div {
    position: absolute;
    left: 20px;
    top: 20px;
    right: 20px;
    bottom: 20px;
    background: rgba(71,163,218,0.2);
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    align-items: center;
    text-align: center;
    opacity: 0;
}

.cbp-rfgrid li a:hover div {
    opacity: 1;
}

.cbp-rfgrid li a div h3 {
    width: 100%;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.4em;
    letter-spacing: 2px;
    padding: 0 10px;
}

/* Example for media query: change number of items per row */

@media screen and (min-width: 1190px) {
    .cbp-rfgrid li {
        width: 25%; /* Fallback */
        width: -webkit-calc(100% / 4);
        width: calc(100% / 4);
    }
}

@media screen and (min-width: 945px) {
    .cbp-rfgrid li {
        width: 25%; /* Fallback */
        width: -webkit-calc(100% / 4);
        width: calc(100% / 4);
    }
}

@media screen and (min-width: 660px) {
    .cbp-rfgrid li {
        width: 33.3333333%; /* Fallback */
        width: -webkit-calc(100% / 4);
        width: calc(100% / 4);
    }
}

@media screen and (max-width: 660px) {
    .cbp-rfgrid li {
        width: 33.3333333%; /* Fallback */
        width: -webkit-calc(100% / 3);
        width: calc(100% / 3);
    }
}

@media screen and (max-width: 410px) {
    .cbp-rfgrid li {
        width: 50%; /* Fallback */
        width: -webkit-calc(100% / 2);
        width: calc(100% / 2);
    }
}

@media screen and (max-width: 300px) {
    .cbp-rfgrid li {
        width: 100%;
    }
}