/*
=====================================================================
*   Woo v1.0 Layout Stylesheet
*   url: styleshout.com
*   05-02-2014
=====================================================================

   TOC:
   a. General and Common Styles
   b. Header Styles
   c. home Section
   d. Features Section
   e. versies Section
   f. Screenshots Section
   g. Call To Action Section
   h. Customers Section
   i. Support Section
   j. Footer
   k. lightbox

   todo: check bug in mobile z-index

===================================================================== */

/* ------------------------------------------------------------------ */
/* a. General and Common Styles
/* ------------------------------------------------------------------ */

body { background: #EEEEEE; }

.section-head {
  	padding: 0 4%;
   text-align: center;
}
.section-head h1 {
   font: 20px/36px 'montserrat-regular', sans-serif;
   color: #333;
   text-transform: uppercase;
   letter-spacing: 1.5px;
   margin-bottom: 12px;
}

/* for css animations */
.show { opacity: 1; }
.js .big_form input[type="email"],
.js .big_form input[type="submit"],
.js .big_form input[type="text"],
.js .big_form select,
.js .big_form textarea {
   opacity: 1;
}
.js #demo_form input[type="email"],
.js #demo_form input[type="submit"],
.js #demo_form input[type="text"],
.js #demo_form select,
.js #demo_form textarea {
   opacity: 1;
}


/* ------------------------------------------------------------------ */
/* b. Header Styles
/* ------------------------------------------------------------------ */

header {
   height: 54px;
   width: 100%;
   background: #65BDDB;
   position: fixed;
   left: 0;
   top: 0;
   z-index: 990;
   text-align: center;
}

/* header logo */
header .logo {
   margin-left: 36px;
   margin-right: 20px;
   margin-top: 13px;
   float: left;
   width: auto; 
   z-index: 991; 

   /* add position relative since z-index only applies to  
   elements that have been given an explicit position */
   position: relative; 
}
header .logo a {
   display: block;
   margin: 0;
	padding: 0;
	border: none;
	outline: none;
   width: 64px;
   height: 18px;   
}

/* header social */
header .header-social {
	font-size: 20px;
   font-weight: normal;
   line-height: 54px;
   color: #424a56;
   margin: 0 10px 0 0;
   padding: 0;
   float: right;
}
header .header-social li {
   display: inline-block;
   margin-right: 20px;
}
header .header-social li a { color: #fff; }
header .header-social li a:hover { color: #000; }

/* primary navigation
--------------------------------------------------------------------- */
#nav-wrap, #nav-wrap ul, #nav-wrap li, #nav-wrap a {
	 margin: 0;
	 padding: 0;
	 border: none;
	 outline: none;
    display: inline-block;
}

/* nav-wrap */
#nav-wrap {
   font: 16px 'montserrat-regular', sans-serif;
   text-transform: uppercase;
   letter-spacing: 1.5px;
}

/* hide toggle button */
#nav-wrap > a { display: none; }

ul#nav {
   min-height: 54px;
   width: auto;

   /* left align the menu */
   text-align: left;
}
ul#nav li {
   position: relative;
   list-style: none;
   height: 54px;
   display: inline-block;

}

/* Links */
ul#nav li a {

   /* 8px padding top + 8px padding bottom + 38px line-height = 54px */
   display: inline-block;
   padding: 8px 8px;
   line-height: 38px;
	text-decoration: none;
   text-align: left;
   color: #fff;

	-webkit-transition: color .2s gebruiksgemak-in-out;
	-moz-transition: color .2s gebruiksgemak-in-out;
	-o-transition: color .2s gebruiksgemak-in-out;
	-ms-transition: color .2s gebruiksgemak-in-out;
	transition: color .2s gebruiksgemak-in-out;
}
ul#nav li a:hover { color: #000; }
ul#nav li a:active { background-color: transparent !important; }
ul#nav li.current a { color: #000; }


/* ------------------------------------------------------------------ */
/* c. home Section
/* ------------------------------------------------------------------ */

#home {
   padding-top: 66px;
   background: #23292f url(img/home-bg.jpg);
   overflow: hidden;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

/* For high-res devices */
/*@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {

	#home { 
		background: #23292f url(img/home-bg_@2X.png); 
		background-size: 960px 364px;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
	}
  
}*/

#home .row { max-width: 1040px; }

/* home Text */
.home-text {
	color: #000000;
   width: 83%;
   text-align: center;
   margin: 24px auto 24px auto;
}
.home-text h1 {
   font: 40px/1.2em 'montserrat-regular', sans-serif; 
   color: #000000;
   padding: 0;
   margin: 0;
   text-shadow: 0px 1px 4px rgba(0, 0, 0, .2);
}
.home-text h1 span,
.home-text a { color: #00A8E2; }
.home-text p {
   font: 16px/30px 'opensans-regular', sans-serif;
   padding: 0;
   margin: 12px 8% 0;
   text-shadow: 0px 1px 2px rgba(0, 0, 0, .2);
}

.home-text h4 { color: #000; 
   text-shadow: 0px 1px 2px rgba(0, 0, 0, .2);
}
.home-text h4 span,
.home-text a { color: #000; }
.home-text i {
   font-size: 150%;
}

/* home Image */
.home-image {
   width: 50%;
   margin: 0 auto;
}
.home-image img {
   vertical-align: bottom;
   display: block;
}

/* home CTA Buttons */
#home .buttons {
   text-align: center;
   margin: 0 0 18px 0;
}
#home .buttons .button {
   font: 16px/26px 'montserrat-regular', sans-serif;
   text-transform : uppercase;
   letter-spacing: 2px;
}
#home .buttons .trial {
   /*background: #f64b39;*/
   margin-right: 30px;

   -webkit-animation-delay: 10s;
      -moz-animation-delay: 10s;
       -ms-animation-delay: 10s;
        -o-animation-delay: 10s;
   -webkit-animation-iteration-count: 3;
      -moz-animation-iteration-count: 3;  
}
/*#home .buttons .trial:hover { background: #F86A5A; }*/
#home .buttons .learn-more {
   background: #505050;
}
#home .buttons .learn-more:hover {
   background: #6D6D6D;
}


/* ------------------------------------------------------------------ */
/* d. Features Section
/* ------------------------------------------------------------------ */

#features {
   background: #fff;
   padding-top: 96px;
   padding-bottom: 78px;
   overflow: hidden;
}
#features .feature {
   margin-top: 30px;
   margin-bottom: 54px;
}
#features .right {
   padding-left: 32px;
   float: right;   
}
#features .left {
   padding-right: 32px;
   float: left;   
}
#features h1 {
   font: 16px/24px 'montserrat-regular', sans-serif;
   text-transform: uppercase;
   letter-spacing: 1px;
   color: #222;
}
.fluid-video-wrapper { margin-top: 18px; }


/*----------------------------------------------*/
/*	e. versies Section
/*----------------------------------------------*/

.versions {
	background: #F7F7F7;
   padding-top: 107px;
   padding-bottom: 77px;   
   border-top: 1px solid #F0F0F0;
   border-bottom: 1px solid #F0F0F0;
   text-align: center;
}
.versions .price-block {
   background: #fff;
   border: 1px solid #E6E6E6;
   text-align: center;
   margin-bottom: 36px;
}
.plan-title {
   font: 15px/30px 'montserrat-regular', sans-serif;
   padding: 30px 20px 6px 20px;
   margin-bottom: 0px;
   text-align: center;
   text-transform: uppercase;
   letter-spacing: 2px;
}
.demo .plan-title {
   padding: 10px 20px 6px 20px;
}
.plan-title .fa {
  	display: block;
  	margin-bottom: 6px;
   font-size: 26px;
}
.plan-price {
	font-family: 'montserrat-regular', sans-serif;
   font-size: 30px;
   color: #333;
	padding: 6px 30px 6px 30px;
   margin-bottom: 0;
	text-align: center;
   letter-spacing: .5px;
}
.plan-price span {
	font-family: 'opensans-light', sans-serif;
	font-size: 18px;
	color: #000;	
	display: block;
	margin-top: 0;
}
.plan-description {
   padding-left: 15px;
   padding-right: 15px;
   padding-bottom: 22px;
   text-align: center;
}

ul.features {
   margin: 12px 0 0 0;
   list-style: none;
}
ul.features li {
   line-height: 32px;
   margin-bottom: 0;
}
ul.features li:nth-child(odd) { }
ul.features li:nth-child(even) { }

.plan-sign-up {
  	padding: 24px 15px;
   margin: 0;
   text-align: center;
}
.plan-sign-up .button {
   font: 13px/24px 'montserrat-regular', sans-serif;
   text-transform: uppercase;
   letter-spacing: 2px;
}


/* ------------------------------------------------------------------ */
/* c. Screenshots
/* ------------------------------------------------------------------ */

#screenshots {
   /*background: #fff url(img/grey.png);*/
   padding-top: 96px;
   padding-bottom: 120px;
}

/* For high-res devices */
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {

   #screenshots {
      /*background: #fff url(img/grey_@2X.png);*/
      background-size: 397px 322px;
   }

}

/* Portfolio Content */
#screenshots-wrapper .columns { padding: 0; }
.item .item-wrap {
   background: #fff;
   overflow: hidden;
   position: relative;

   -webkit-transition: all 0.3s gebruiksgemak-in-out;
	-moz-transition: all 0.3s gebruiksgemak-in-out;
	-o-transition: all 0.3s gebruiksgemak-in-out;
	-ms-transition: all 0.3s gebruiksgemak-in-out;
	transition: all 0.3s gebruiksgemak-in-out;
}
.item .item-wrap a {
   display: block;
   cursor: pointer;
}

/* overlay */
.item .item-wrap .overlay {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;

	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);

   -webkit-transition: opacity 0.3s gebruiksgemak-in-out;
	-moz-transition: opacity 0.3s gebruiksgemak-in-out;
	-o-transition: opacity 0.3s gebruiksgemak-in-out;
	transition: opacity 0.3s gebruiksgemak-in-out;

   background: url(img/overlay-bg.png) repeat;
}
.item .item-wrap .link-icon {
   display: block;
   color: #fff;
   height: 30px;
   width: 30px;
   font-size: 18px;
   line-height: 30px;
   text-align: center;

   opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);

   -webkit-transition: opacity 0.3s gebruiksgemak-in-out;
	-moz-transition: opacity 0.3s gebruiksgemak-in-out;
	-o-transition: opacity 0.3s gebruiksgemak-in-out;
	transition: opacity 0.3s gebruiksgemak-in-out;

   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: -15px;
   margin-top: -15px;
}
.item .item-wrap img {
   vertical-align: bottom;

   -webkit-transition: all 0.3s gebruiksgemak-out;
	-moz-transition: all 0.3s gebruiksgemak-out;
	-o-transition: all 0.3s gebruiksgemak-out;
	-ms-transition: all 0.3s gebruiksgemak-out;
	transition: all 0.3s gebruiksgemak-out;
}

/* on hover */
.item:hover .overlay {
	opacity: 1;
	-moz-opacity: 1;
	filter:alpha(opacity=100);
}
.item:hover .link-icon {
   opacity: 1;
	-moz-opacity: 1;
	filter:alpha(opacity=100);
}
.item:hover .item-wrap img {
   -moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}


/* ------------------------------------------------------------------
/* h. customers
/* ------------------------------------------------------------------ */

#customers {
   background: #10999E url(img/escheresque.png);
   padding-top: 112px;
   padding-bottom: 66px;
   position: relative;
   min-height: 198px;
   width: 100%;
   overflow: hidden;
   text-align: center;
}

/* For high-res devices */
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {

	#customers {
		background: #10999E url(img/escheresque_@2X.png);
		background-size: 46px 29px;
	}
  
}

#customers .quote-left, 
#customers .quote-right {
   position: absolute;
   top: 50%;
   color: #fff;
   font-size: 40px;
   margin-top: -25px;
}
#customers .quote-left { left: 5%; }
#customers .quote-right { right: 5%; }

#customers .text-container {
   width: 86%;
   margin: 0 auto;
}
#customers h1 {
   font: 16px/24px 'montserrat-regular', sans-serif;
   color: #6AECF0;
   text-transform: uppercase;
   letter-spacing: 2px;   
   margin-bottom: 36px;
}

/*	Blockquotes */
#customers blockquote {
   margin: 0 0px 30px 0px;
   padding-left: 0;
   position: relative;   
}
#customers blockquote:before { content: none; }
#customers blockquote p {
   font-family: 'opensans-semibold', sans-serif;
   font-style: normal;
   color: #fff;
   padding: 0;
   font-size: 26px;
   line-height: 42px;   
}
#customers blockquote cite {
   display: block;
   font-size: 12px;
   font-style: normal;
   line-height: 18px;
   color: #fff;
}
#customers blockquote cite:before { content: "\2014 \0020"; }
#customers blockquote cite a,
#customers blockquote cite a:visited { color: #8B9798; border: none }

/* Flex Slider
/* ------------------------------------------------------------------ */

/* Reset */
.flexslider a:active,
.flexslider a:focus  { outline: none; }
.slides,
.flex-control-nav,
.flex-direction-nav { margin: 0; padding: 0; list-style: none; }
.slides li { margin: 0; padding: 0;}

/* Necessary Styles */
.flexslider {
   position: relative;
   zoom: 1;
   margin: 0;
   padding: 0;
}
.flexslider .slides { zoom: 1; }
.flexslider .slides > li { position: relative; }

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }
/* Suggested container for slide animation setups. Can replace this with your own */
.flex-container { zoom: 1; position: relative; }

/* Clearfix for .slides */
.slides:before,
.slides:after {
   content: " ";
   display: table;
}
.slides:after {
   clear: both;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child { display: block; }

/* Slider Styles */
.slides { zoom: 1; }
.slides > li {
   /*margin-right: 5px; */
   overflow: hidden;
}

/* Control Nav */
.flex-control-nav {
   width: 100%;
   text-align: center;
}
.flex-control-nav li {
   margin: 0 6px;
   display: inline-block;
   zoom: 1;
   *display: inline;
}
.flex-control-paging li a {
   width: 12px;
   height: 12px;
   display: block;
   background: #ddd;
   background: rgba(255, 255, 255, .3);
   cursor: pointer;
   text-indent: -9999px;
   border-radius: 20px;
   box-shadow: inset 0 0 3px rgba(255, 255, 255, .3);
}
.flex-control-paging li a:hover {
    background: #CCC;
    background: rgba(255, 255, 255, .7);
}
.flex-control-paging li a.flex-active {
    background: #fff;
    background: rgba(255, 255, 255, .9);
    cursor: default;
}

/* ------------------------------------------------------------------ */
/* i. Customers Section
/* ------------------------------------------------------------------ */

#klanten {
   background: #F7F7F7;
   padding-top: 107px;
   padding-bottom: 77px;   
   border-top: 1px solid #F0F0F0;
   border-bottom: 1px solid #F0F0F0;
   text-align: center;
}


/* ------------------------------------------------------------------ */
/* j. Support Section
/* ------------------------------------------------------------------ */

#support {
   background: #F7F7F7;
   padding-top: 96px;
   padding-bottom: 78px;
   overflow: hidden;
}
/*#support {
   background: #23292F;
   padding-top: 96px;
   padding-bottom: 66px;
   overflow: hidden;
   text-align: center;
}
#support a, #support a:visited  { color: #fff; }
#support a:hover, #support a:focus { color: #00a8e2; }

#support h1 { color: #fff; }
#support p {
   color: #7A7A7A;
   text-align: center;
   padding: 0;
}*/

/* mailchimp signup form */
.big_form {
   background: none;
   clear: both;
   display: block;
   margin: 6px auto 30px auto;
   width: 70%;
   text-align: center;   
}
.big_form:before,
.big_form:after {
    content: " ";
    display: table;
}
.big_form:after {
    clear: both;
}
.big_form input[type="submit"] {
   float: right;
   height: 60px;
   margin: 0;
   padding: 0 20px;
   font-size: 16px;
   line-height: 60px;
   width: 47%;  
}
.big_form input[type="email"],
.big_form input[type="text"] {
   text-align: left;
}
.big_form input[type="email"],
.big_form input[type="text"],
.big_form select,
.big_form textarea {
   display: inline;
   float: left;
   height: 60px;
   margin: 0;
   margin-bottom: 5px;
   padding: 18px 20px;
   font-size: 18px;
   line-height: 24px;
   font-family: 'montserrat-regular',sans-serif;
   width: 100%;
}
.big_form select {
   text-indent: 18px;
}

#demo_form {
   background: none;
   clear: both;
   display: block;
   margin: 6px auto 30px auto;
   width: 70%;
   text-align: center;   
}
#demo_form:before,
#demo_form:after {
    content: " ";
    display: table;
}
#demo_form:after {
    clear: both;
}
#demo_form input[type="submit"] {
   float: right;
   height: 60px;
   margin: 0;
   padding: 0 20px;
   font-size: 16px;
   line-height: 60px;
   width: 47%;  
}
#demo_form input[type="email"],
#demo_form input[type="text"] {
   text-align: left;
}
#demo_form input[type="email"],
#demo_form input[type="text"],
#demo_form select,
#demo_form textarea {
   display: inline;
   float: left;
   height: 60px;
   margin: 0;
   margin-bottom: 5px;
   padding: 18px 20px;
   font-size: 18px;
   line-height: 24px;
   font-family: 'montserrat-regular',sans-serif;
   width: 100%;  
}
#demo_form select {
   text-indent: 18px;
}


/* ------------------------------------------------------------------ */
/* k. Footer
/* ------------------------------------------------------------------ */

footer {
   padding-top: 84px;
   margin-bottom: 60px;
   color: #58687A;
   font-size: 13px;
   line-height: 24px;
   position: relative;   
}

footer a, footer a:visited { color: #58687A; }
footer a:hover, footer a:focus { color: #00a8e2; }

footer .info { padding-right: 90px; }

footer .footer-logo a {
   display: block;
   margin-bottom: 12px;
   margin-top: 12px;
   margin-left: 3px;
}
footer .footer-logo a img {
   height: 24px;
   width: 92px;
}

footer .right-cols .columns {
   padding-right: 5px;
   padding-left: 5px;
   width: 33.33333%; ;
}
footer .right-cols .columns p { margin-bottom: 6px; }

footer h1 {
   font: 13px/24px 'opensans-semibold', sans-serif;
   margin-bottom: 0;
   font-weight: normal;
   color: #00a8e2;
   text-transform: uppercase;
   letter-spacing: 1px;
}
footer h1:before {
   font-family: 'FontAwesome';   
	margin: 0 0 6px 3px;
	font-size: 30px;
   line-height: 48px;
   text-align: left;
   color: #738291;
   display: block;
}
footer h1.address:before { content: "\f041"; }
footer h1.social:before { content: "\f0c0"; }
footer h1.contact:before { content: "\f0e0"; }

footer ul {
   margin: 0;
   padding: 0;
}
footer ul li {
   margin: 0;
   line-height: 24px;
}
footer ul li a,
footer ul li a:visited { color: #58687A; }
footer ul li a:hover,
footer ul li a:focus { color: #00a8e2; }

/* copyright */
footer .copyright {
   margin: 0;
   padding: 0 18px;
   clear: both;
}

/* Go To Top Button */
.go-top {
	position: absolute;
	top: -24px;
   left: 50%;
   margin-left: -30px;
   text-align: center;
   z-index: 889;
}
.go-top a {
	text-decoration: none;
	border: 0 none;
	display: block;
	width: 60px;
	height: 60px;
	background: #525252;

	-webkit-transition: all 0.2s gebruiksgemak-in-out;
   -moz-transition: all 0.2s gebruiksgemak-in-out;
   -o-transition: all 0.2s gebruiksgemak-in-out;
   -ms-transition: all 0.2s gebruiksgemak-in-out;
   transition: all 0.2s gebruiksgemak-in-out;

   color: #fff !important;
   font-size: 21px;
   line-height: 60px;
 	border-radius: 100%;
}
.go-top a:hover { background: #0F9095 !important; color: #fff !important; }


/* ------------------------------------------------------------------ */
/* l. lightbox
/* ------------------------------------------------------------------ */

#imagelightbox {
   cursor: pointer;
   position: fixed;
   z-index: 995;
   -ms-touch-action: none;
   touch-action: none;
   -webkit-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */
   -moz-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */
   box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3 ); /* 50 */
}

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

   -webkit-animation: imagelightbox-loading .5s gebruiksgemak infinite;
   -moz-animation: imagelightbox-loading .5s gebruiksgemak infinite;
   -o-animation: imagelightbox-loading .5s gebruiksgemak infinite;
   animation: imagelightbox-loading .5s gebruiksgemak 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 ); }
}

/* lightbox overlay */
#imagelightbox-overlay {
   background-color: #383838;
   background-color: rgba( 0, 0, 0, .8 );
   position: fixed;
   z-index: 994;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
}

/* close button */
#imagelightbox-close {	  
   position: fixed;
   z-index: 999;
   top: 2.5em; /* 40 */
   right: 2.5em; /* 40 */ 
}

#imagelightbox-close i {	  
	display: block;
	background: #fff;
	padding: 10px;
	border-radius: 100%;

	-webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */
	-moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */
	box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5 ); /* 40 */
}
a#imagelightbox-close { color: #333; }
a#imagelightbox-close:hover, a#imagelightbox-close:focus { color: #00a8e2; }

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

#imagelightbox-loading,
#imagelightbox-overlay,
#imagelightbox-close,
#imagelightbox-caption {
	-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 */
	}

}

.manual {
   background: #F7F7F7;
   padding-top: 107px;
   padding-bottom: 77px;   
   border-top: 1px solid #F0F0F0;
   border-bottom: 1px solid #F0F0F0;
   text-align: left;
}

.manual .section, .manual .subSection {
   padding-top: 60px;
}

#userKeyBlock {
   display: none;
}