/*
=====================================================================
*   Woo v1.0 Layout Stylesheet
*   url: styleshout.com
*   05-02-2014
*
*   modified by Boris Gabric :  xservers.si
*   2021-07-22
=====================================================================

   TOC:
   a. General and Common Styles
   b. Header Styles
   c. Carousel ex. Hero Section
   d. Features Section
   e. Servers ex. Pricing Section
   f. Screenshots Section
   g. Use pool ex. Call To Action Section
   h. Testimonials Section
   i. Subscribe Section
   j. Footer
   k. lightbox
   j. Error

   todo: check bug in mobile z-index

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

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

body { background: #181d21; }

.section-head {
   padding: 0 4%;
   text-align: center;
}

.section-head h1 {
   font: 20px/36px 'montserrat-bold', sans-serif;
   color: #333;
   text-transform: uppercase;
   letter-spacing: 1.5px;
   margin-bottom: 12px;
}

/* for css animations */
.show { opacity: 1; }
.js #mc_embed_signup input[type="email"],
.js #mc_embed_signup input[type="submit"] {
   opacity: 0;
}


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

header {
    height: 54px;
    width: 100%;
    background: #13171B;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 990;
}

header .h-center {
    margin: 0 auto;
    width: 704px;
}

/* header logo */
header .logo {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 14px;
    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: #11ABB0; }

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

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

/* 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: #14D0D6;
	-webkit-transition: color .2s ease-in-out;
	-moz-transition: color .2s ease-in-out;
	-o-transition: color .2s ease-in-out;
	-ms-transition: color .2s ease-in-out;
	transition: color .2s ease-in-out;
}
ul#nav li a:hover { color: #fff; }
ul#nav li a:active { background-color: transparent !important; }
ul#nav li.current a { color: #fff; }


/* Go To Bottom Button */
#go-bottom {
    position: absolute;
    top: 39px;
    left: 50%;
    margin-left: -15px;
    text-align: center;
    z-index: 889;
}
#go-bottom a {
    text-decoration: none;
    border: 0 none;
    display: block;
    width: 30px;
    height: 30px;
    background: #525252;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    color: #fff;
    font-size: 11px;
    line-height: 30px;
    border-radius: 100%;
}
#go-bottom a:hover { background: #0F9095; }


/* ------------------------------------------------------------------ */
/* c. Carousel ex. Hero Section
/* ------------------------------------------------------------------ */

#carousel {
   padding-top: 1em; 
   background: #e6ffff;;
   overflow: hidden;
}

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

	#carousel { 
		background: #23292f; 
	}
  
}*/

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

/* Carousel Text */
.carousel-text {
   color: #676e73;
   width: 83%;
   text-align: center;
   padding-top: 4em;
   margin: 60px auto 24px auto;
}
.carousel-text h1 {
   font: 60px/1.6em 'montserrat-regular', sans-serif; 
   color: #14D0D6;
   padding: 0;
   margin: 0;
}
.carousel-text h1 span,
.carousel-text a { color: #11ABB0; }
.carousel-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);
}

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

/* Carousel CTA Buttons */
#carousel .buttons {
   text-align: center;
   margin: 0 0 18px 0;
}
#carousel .buttons .button {
   font: 14px/24px 'montserrat-bold', sans-serif;
   text-transform : uppercase;
   letter-spacing: 2px;
}
#carousel .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;  
}
#carousel .buttons .trial:hover { background: #F86A5A; }
#carousel .buttons .learn-more {}


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

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


/*----------------------------------------------*/
/*	e. Servers ex. Pricing Section              */
/*----------------------------------------------*/

#servers {
   background: #F7F7F7;
   padding-top: 60px;
   padding-bottom: 77px;   
   border-top: 1px solid #F0F0F0;
   border-bottom: 1px solid #F0F0F0;
   text-align: center;
}
#servers .server-block {
   background: #fff;
   border: 1px solid #E6E6E6;
   text-align: center;
   margin-bottom: 24px;
   width: 100%;
}
#servers .server-justify {
   background: #fff;
   border: 1px solid #E6E6E6;
   text-align:  justify;
   margin-bottom: 36px;
}

.server-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;
}
.server-title .fas, .server-title .fab{
   display: block;
   margin-bottom: 6px;
   font-size: 60px;
   color: #14D0D6;
}
.server-name {
   font-family: 'montserrat-bold', sans-serif;
   font-size: 20px;
   color: #333;
   padding: 6px;
   margin-bottom: 0;
   text-align: center;
   letter-spacing: .5px;
   color: #14D0D6;
}
.server-name span {
   font-family: 'opensans-light', sans-serif;
   font-size: 15px;
   color: #999;	
   display: block;
   margin-top: 0;
}

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

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

.server-justify h2, .server-justify h5 {
   color: #14D0D6;
}


div[id^="package-"] {
   padding-top: 3.5em ;
}


/* ------------------------------------------------------------------ */
/* f. Screenshots                                                     */
/* ------------------------------------------------------------------ */

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

/* 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: 5px; }
.item .item-wrap {
   background: #fff;
   overflow: hidden;
   position: relative;

   -webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-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 ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;

   background: url(img/overlay.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 ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	-o-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-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 ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-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);
}

#screenshots .fcenter {
    margin: auto;
}

/* ------------------------------------------------------------------ */
/* g. Use pool ex. Call To Action Section
/* ------------------------------------------------------------------ */

#use-pool {
    background: #23292F;
    padding-top: 80px;
    padding-bottom: 48px;
    text-align: center;
    color: #697B8B;
}
#use-pool h1 {
   font: 18px/24px 'montserrat-bold', sans-serif;
   text-transform: uppercase;
   letter-spacing: 3px;
   color: #fff;
}
#use-pool h1 span { display: none; }
/*#use-pool .header-col h1:before {
   font-family: font-family: "Font Awesome 5 Pro","Font Awesome 5 Free","fontawesome";
   content: "\f19d";

#use-pool .header-col h1
   padding-right: 18px;
   padding-top: 6px;
   font-size: 72px;
   line-height: 72px;
   text-align: center;
   float: right;
   color: #EBEEEE;  
}
*/

#use-pool .action { margin-top: 18px; }
#use-pool .action .button { text-align: center; }
#use-pool h2 {
   font: 28px/36px 'montserrat-bold', sans-serif;
   color: #EBEEEE;
   margin-bottom: 12px;
}
#use-pool h2 a {
   color: inherit;
}
#use-pool p {
   color: #697B8B; 
   font-size: 17px; 
   padding-right: 5px; 
}
#use-pool p span {
	font-family: 'opensans-semibold', sans-serif; 
	color: #A9B5C0;
}

/* To Top Button */
.to-top {
   position: absolute;
   top: -24px;
   left: 50%;
   margin-left: -30px;
   text-align: center;
   z-index: 889;
}


/* ------------------------------------------------------------------
/* h. Testimonials
/* ------------------------------------------------------------------ */

#testimonials {
   background: #10999E url(img/escheresque.png); 
   padding-top: 80px;
   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) {

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

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

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

/*	Blockquotes */
#testimonials blockquote {
   margin: 0 0px 30px 0px;
   padding-left: 0;
   position: relative;   
}
#testimonials blockquote:before { content: none; }
#testimonials blockquote p {
   font-family: 'opensans-semibold', sans-serif;
   font-style: normal;
   color: #fff;
   padding: 0;
   font-size: 26px;
   line-height: 42px;   
}
#testimonials blockquote cite {
   display: block;
   font-size: 12px;
   font-style: normal;
   line-height: 18px;
   color: #fff;
}
#testimonials blockquote cite:before { content: "\2014 \0020"; }
#testimonials blockquote cite a,
#testimonials 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. Subscribe Section
/* ------------------------------------------------------------------ */

#subscribe {
   background: #23292F;
   padding-top: 80px;
   padding-bottom: 66px;
   overflow: hidden;
   text-align: center;
}

#subscribe a, #subscribe a:visited  { color: #fff; }
#subscribe a:hover, #subscribe a:focus { color: #11ABB0; }

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

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


/* ------------------------------------------------------------------ */
/* j. Footer
/* ------------------------------------------------------------------ */

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

./ footer a, footer a:visited { color: #0A6567; } */
footer a, footer a:visited { color: #14D0D6;; }
footer a:hover, footer a:focus { color: #fff; }
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%;
   margin-bottom: 44px;
}
footer .right-cols .columns p { margin-bottom: 6px; }

footer h3 {
   font: 13px/24px 'opensans-semibold', sans-serif;
   margin-bottom: 0;
   font-weight: normal;
   color: #fff;
   text-transform: uppercase;
   letter-spacing: 1px;
}
footer h3:before {
   font-family: 'Font Awesome 5 Pro','Font Awesome 5 Free';
   margin: 0 0 6px 3px;
   font-size: 30px;
   line-height: 48px;
   text-align: left;
   color: #738291;
   display: block;
}

footer ul {
   margin: 0;
   padding: 0;
}

footer ul li {
   margin: 0;
   line-height: 24px;
}
/*
footer ul li a,
footer ul li a:visited { color: #3c4753; }
footer ul li a:hover,
footer ul li a:focus { color: #fff; }
*/

/* 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 ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;

   color: #fff;
   font-size: 21px;
   line-height: 60px;
   border-radius: 100%;
}
*/

#go-top {
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -15px;
    text-align: center;
    z-index: 889;
}
#go-top a {
    text-decoration: none;
    border: 0 none;
    display: block;
    width: 30px;
    height: 30px;
    background: #525252;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    color: #fff;
    font-size: 11px;
    line-height: 30px;
    border-radius: 100%;
}



#go-top a:hover { background: #0F9095; }


/* ------------------------------------------------------------------ */
/* k. 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 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 ); }
}

/* 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: #11ABB0; }

/* 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 */
	}

} 


/* ------------------------------------------------------------------ */
/* j. error                                                           */
/* ------------------------------------------------------------------ */

#clock-placeholder {
    padding-top: 30px;
}

#vertical-clock {
    display:block;
    font-size:22px;
    font-family:serif;
    text-align:center;
    width:380px;
    height:350px;
    margin:auto;
    padding-top: 10px;
    top:0;
    bottom:0;
    left:0;
    right:0;
}
.digit-group {
    display:inline-block;
    height:350px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.digit-group:not(:last-child):after{
    content:':';
    font-size:48px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.digit {
    display:inline-block;
    width:50px;
    height:350px;
}
.digit .digit-number {
    color:rgb(192,192,192);
    -webkit-transform: rotate(-90deg);
    transform:rotate(-90deg);
    transition: font-size 200ms, color 150ms,-webkit-transform 350ms;
    transition: font-size 200ms, transform 350ms, color 150ms;
    transition: font-size 200ms, transform 350ms, color 150ms, -webkit-transform 350ms;
}
.digit .digit-number.highlight {
    color: inherit;
    font-size: 50px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    margin: 10px;
}



/* ---- CHRONY.EU -------------------------- */

.tab-description {
   text-align: justify;
   width: 95%;
}

.section-head-j {
   text-align: justify;
}

.section-footer {
  font: 10px/18px 'montserrat-bold', sans-serif;
  margin: 0 auto;;
}

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

img[src$="center-img"] {
  display:block;
  margin: 0 auto;
}

#contactus .buttons {
    text-align: center;
}

.mail-sent {
    margin: 0 auto;
    text-align: center;
}

.class-center {
    margin: 0 auto;
    text-align: center;
}

.fa-balance-scale, .fa-cogs, .fa-link, .fa-chart-bar, .footerLogo {
    margin-top: 20px;
}

.status-table, .status-table > tbody > tr > td {
    margin: auto;
    text-align: center;
    padding: 0 7px ;
}