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

Project:	Elysium Responsive Coming Soon Theme
Info:		https://www.codegrape.com/item/elysium-responsive-coming-soon-template/25003
Version:	1.0
Author:		flashblue
Profile:	https://www.codegrape.com/user/flashblue

-----------------------------------------------------------------
					*** TABLE OF CONTENTS ***
-----------------------------------------------------------------

	1.	Reset
	2.	General
	3. 	Preloader
    4. 	Left side
    5. 	Right side
    6. 	Newsletter
    7. 	Custom scrollbar
    8. 	Gallery
    9. 	Video controls
		
=============================================================*/

/*******************
    - 1. Reset -
*******************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  	margin:0;
  	padding:0;
  	border:0;
  	font-size:100%;
  	font:inherit;
  	vertical-align:baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
  	display:block;
}

body {
  	line-height:1;
}

ol, ul {
  	list-style:none;
}

blockquote, q {
  	quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  	content:'';
  	content:none;
}

table {
  	border-collapse:collapse;
  	border-spacing:0;
}

/*********************
    - 2. General -
*********************/
body {
 	position:absolute;
  	height:100%;
  	background:#20232D;
  	color:#fff;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-size:100%;
  	font-weight:400;
  	line-height:1.5em;	
  	-webkit-font-smoothing:antialiased;
  	   -moz-osx-font-smoothing:grayscale;
}

body.color #left-side {
  	background:transparent;
}

body, html {
  	width:100%;
  	margin:0;
  	padding:0;
}

body, input, select, textarea, span, button, a {
  	-webkit-transition:all 0.2s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.2s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.2s cubic-bezier(0.77, 0, 0.175, 1);
}

a {
  	text-decoration:none;
  	cursor:pointer;
}

a:hover {
  	color:#29e38d;
  	text-decoration:none !important;
  	outline:none !important;
}

a:active, a:focus {
  	text-decoration:none !important;
  	outline:none !important;
}

button {
  	cursor:pointer;
}

button:hover, button:active, button:focus {
  	text-decoration:none !important;
  	outline:none !important;
  	box-shadow:none !important;
}

strong, b {
  	font-weight:700;
}

em, i {
  	font-style:italic;
}

p {
  	margin:0;
  	color:#fff;
  	font-family:"Open Sans", "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-size:1em;
  	font-weight:400;
  	line-height:1.6em;
}

p.text-intro {
  	margin:0.5rem 0 2rem;
}

h1, h2, h3, h4, h5, h6 {
  	color:#fff;
  	font-weight:300;
  	line-height:1.3em;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  	color:inherit;
  	text-decoration:none;
}

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
  	color:inherit;
}

h1 {
  	font-size:60px;
  	font-weight:600;
  	text-transform:uppercase;
}

h2 {
 	margin-top:15px;
  	margin-bottom:30px;
  	font-size:22px;
}	

h3 {
  	margin-bottom:25px;
  	font-size:25px;
}

h4 {
  	margin-bottom:25px;
  	font-size:25px;
}

h5 {
  	margin-bottom:25px;
  	font-size:20px;
}

h6 {
  	margin-bottom:25px;
  	font-size:15px;
}

sub {
  	position:relative;
  	top:0.5em;
  	font-size:0.8em;
}

sup {
  	position:relative;
  	top:-0.5em;
  	font-size:0.8em;
}

.clear {
  	clear:both;
}

.display-none {
  	display:none !important;
}

.align-left {
  	text-align:left;
}

.align-center {
  	text-align:center;
}

.align-right {
  	text-align:right;
}

.no-margin-bottom {
  	margin-bottom:0;
}

.opacity-0 {
  	opacity:0 !important;
  	visibility:hidden !important;
}

.opacity-03 {
  	opacity:0.3 !important;
}

.opacity-1 {
  	opacity:1 !important;
  	visibility:visible !important;
}

.index-999 {
  	z-index:-999 !important;
}

i.fa-spinner {
  	margin-left:5px;
  	-webkit-animation:spinning 2.5s infinite linear;
       -moz-animation:spinning 2.5s infinite linear;
  			animation:spinning 2.5s infinite linear;
}

@keyframes spinning {
  	0% {
    	-webkit-transform:rotate(0deg);
    	   -moz-transform:rotate(0deg);
    			transform:rotate(0deg);
  	}
  	50% {
    	-webkit-transform:rotate(180deg);
    	   -moz-transform:rotate(180deg);
    		transform:rotate(180deg);
  	}
  	100% {
    	-webkit-transform:rotate(360deg);
    	   -moz-transform:rotate(360deg);
   				transform:rotate(360deg);
  	}
}

/***********************
    - 3. Preloader -
***********************/
#loading {
	position:fixed;
  	z-index:9999;
  	height:100vh;
  	width:100vw;
  	background:transparent;
}

#loading span {
  	position:absolute;
  	top:0;
  	width:20vw;
  	display:block;
  	height:100vh;
  	background:#20232D;
}

#loading span:nth-child(1) {
  	left:0;
  	background:rgba(32, 35, 45, 0.6);
}

#loading span:nth-child(2) {
  	left:20vw;
  	background:rgba(32, 35, 45, 0.5);
}

#loading span:nth-child(3) {
  	left:40vw;
  	background:rgba(32, 35, 45, 0.6);
}

#loading span:nth-child(4) {
  	left:60vw;
  	background:rgba(32, 35, 45, 0.5);
}

#loading span:nth-child(5) {
  	left:80vw;
  	background:rgba(32, 35, 45, 0.6);
}

#loading #preloader {
  	position:relative;
  	top:calc(50% - 50px);
  	height:80px;
  	width:100%;
  	margin:0 auto;
  	text-align:center;
  	opacity:0;
}

#loading #preloader:after {
  	position:absolute;
  	left:0;
  	top:90px;
  	right:0;
  	width:100%;
  	height:1px;
  	color:rgba(255, 255, 255, 0.8);
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-size:12px;
  	font-weight:400;
  	letter-spacing:1px;
  	text-transform:uppercase;
  	text-align:center;
  	content:"ROTEIROS INTEMPORAIS";
  	/* Text just below the loader */
}

#loading #preloader .circular {
  	position:absolute;
  	top:0;
  	bottom:0;
  	left:0;
  	right:0;
  	height:100%;
  	width:100%;
  	margin:auto;
  	-webkit-animation:rotate 2s infinite linear;
  	   -moz-animation:rotate 2s infinite linear;
  			animation:rotate 2s infinite linear;
  	-webkit-transform-origin:center center;
	   -moz-transform-origin:center center;
  			transform-origin:center center;
}

#loading #preloader .circular.smaller {
  	width:50%;
  	height:50%;
  	-webkit-animation:rotate 3s infinite linear;
  	   -moz-animation:rotate 3s infinite linear;
  			animation:rotate 3s infinite linear;
}

#loading #preloader .circular .path {
  	-webkit-animation:dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
   	   -moz-animation:dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  			animation:dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  	stroke-dasharray:1, 200;
  	stroke-dashoffset:0;
  	stroke-linecap:round;
}

@keyframes rotate {
  	100% {
    	-webkit-transform:rotate(360deg);
    	   -moz-transform:rotate(360deg);
    			transform:rotate(360deg);
  	}
}

@keyframes dash {
  	0% {
    	stroke-dasharray:1, 200;
    	stroke-dashoffset:0;
  	}
  	50% {
    	stroke-dasharray:89, 200;
    	stroke-dashoffset:-35px;
  	}
  	100% {
    	stroke-dasharray:89, 200;
    	stroke-dashoffset:-124px;
  	}
}

@keyframes color {
  	100%, 0% {
    	stroke:#FF1D4D;
  	}
	
  	40% {
    	stroke:#00c8aa;
  	}
  	66% {
    	stroke:#FFD633;
  	}
  	80%, 90% {
    	stroke:#6534ff;
  	}
}

/***********************
    - 4. Left side -
***********************/
#left-side {
  	position:fixed;
  	left:0;
  	top:0;
  	z-index:5;
  	width:100%;
  	height:100%;
  	background:rgba(32, 35, 45, 0.6);
  	-webkit-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
}

#left-side.right-side-opened {
  	opacity:0.4;
}

#left-side.right-side-opened .slideshow {
  	-webkit-transform:translateX(-20vw);
  	   -moz-transform:translateX(-20vw);
  			transform:translateX(-20vw);
}

#left-side::after {
  	position:absolute;
  	top:0;
  	left:0;
  	z-index:-1;
  	width:100vw;
  	height:100%;
  	background:rgba(32, 35, 45, 0.6);
  	content:'';
}

#left-side #particles-js {
  	position:fixed;
  	top:25vh;
  	left:50vw;
  	z-index:5;
  	width:50vw;
  	height:75vh;
  	-webkit-transform:rotate(25deg);
  	   -moz-transform:rotate(25deg);
  			transform:rotate(25deg);
  	-webkit-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
}

#left-side #particles-js.right-side-opened {
  	left:0;
  	top:0;
}

#left-side .slideshow {
  	position:fixed !important;
  	top:0;
  	left:0;
  	width:100%;
  	height:100vh !important;
  	overflow:hidden;
  	-webkit-transition:all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.7s cubic-bezier(0.77, 0, 0.175, 1);
}

#left-side .slideshow:after {
  	position:absolute;
  	top:0;
  	left:0;
  	z-index:0;
  	width:100%;
  	height:100%;
  	background:rgba(35, 52, 105, 0.5);
  	content:'';
}

#left-side .brand-logo {
  	position:absolute;
  	left:10%;
  	top:5%;
  	z-index:10;
  	max-width:350px !important;
  	opacity:0;
}

#left-side .brand-logo.align-center {
  	left:calc(50% - 75px);
  	/* -75px because my logo picture has a width of 500px but handled with the max-width:150px in the rule above.
  	I have to write -(half of my picture) or -(half of the width of the CSS rule .brand-logo if I have one) to get it centered */
}

#left-side .content {
  	position:absolute;
  	left:0;
  	top:50vh;
  	z-index:10;
  	width:100%;
  	padding:0 10%;
  	text-align:left;
  	-webkit-transform:translateY(-50%);
  	   -moz-transform:translateY(-50%);
  			transform:translateY(-50%);
  	visibility:visible;
}

#left-side .content .text-intro {
  	opacity:0;
}

#left-side .content .light-btn {
  	position:relative;
  	display:inline-block;
  	overflow:hidden;
  	margin-right:10px;
  	padding:0.7em 2em;
  	border:2px solid white;
  	background:transparent;
  	color:white;
  	font-weight:400;
}

#left-side .content .light-btn:hover {
  	border-color:#fff;
  	background:#fff;
  	color:#2B2D35;
}

#left-side .content .light-btn:active, #left-side .content .light-btn:focus {
  	color:#fff;
  	background:transparent;
}

#left-side .content .action-btn {
  	position:relative;
  	display:inline-block;
  	overflow:hidden;
  	padding:0.7em 2em;
  	border:2px solid #000;
  	color:#fff;
  	text-transform:uppercase;
  	font-weight:600;
}

#left-side .content .action-btn.blink:before {
  	position:absolute;
  	left:0;
  	top:0;
  	display:block;
  	width:60px;
  	height:100%;
  	background:rgba(255, 255, 255, 0.5);
  	-webkit-filter:blur(30px);
  			filter:blur(30px);
  	-webkit-animation:shine 5s infinite linear;
  	   -moz-animation:shine 5s infinite linear;
  			animation:shine 5s infinite linear;
  	content:'';
  	opacity:.6;
}

#left-side .content .action-btn.blink:after {
  	position:absolute;
  	left:30px;
  	top:0;
  	display:block;
  	width:30px;
  	height:100%;
  	background:rgba(255, 255, 255, 0.2);
  	-webkit-filter:blur(5px);
  			filter:blur(5px);
  	-webkit-animation:shine 5s infinite linear;
  	   -moz-animation:shine 5s infinite linear;
  			animation:shine 5s infinite linear;
  	content:'';
  	opacity:1;
}

#left-side .content .action-btn:hover {
  	border-color:#fff;
  	background:#fff !important;
  	color:#2B2D35;
}

#left-side .content .action-btn:hover.blink:before, 
#left-side .content .action-btn:hover.blink:after {
  	opacity:0 !important;
}

#left-side .content.align-center {
  	text-align:center;
}

#left-side .useful-links {
  	position:absolute;
  	left:10%;
  	bottom:5%;
  	z-index:10;
  	display:block;
  	width:auto;
  	margin-left:0;
  	margin-bottom:-22px;
  	white-space:nowrap;
  	opacity:0;
}

#left-side .useful-links a {
  	position:relative;
  	display:inline-block;
  	min-width:35px;
  	height:50px;
  	border:none;
  	background:transparent;
  	color:white;
  	line-height:50px;
  	letter-spacing:0;
  	font-size:1em;
  	font-weight:300;
  	text-align:center;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
}

#left-side .useful-links a:hover {
  	background:transparent;
  	-webkit-transform:translateY(-0.2rem);
  	   -moz-transform:translateY(-0.2rem);
  			transform:translateY(-0.2rem);
}

#left-side .useful-links.align-center {
  	left:0;
  	width:100%;
  	text-align:center;
}

@keyframes shine {
  	0% {
    	-webkit-transform:translateX(-100px) skewX(-15deg);
    	   -moz-transform:translateX(-100px) skewX(-15deg);
    			transform:translateX(-100px) skewX(-15deg);
  	}
  	10% , 100% {
    	-webkit-transform:translateX(300px) skewX(-15deg);
    	   -moz-transform:translateX(300px) skewX(-15deg);
    			transform:translateX(300px) skewX(-15deg);
  	}
}

/************************
    - 5. Right side -
************************/
#right-side {
  	position:relative;
	z-index:5;
  	top:0;
  	right:0;
  	left:100vw;
  	width:60vw;
  	padding:0;
  	background:#F7F7F7;
  	color:#343434;
  	-webkit-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.8s cubic-bezier(0.77, 0, 0.175, 1);
  	-webkit-transform:rotateZ(20deg) scale(1.2);
  	   -moz-transform:rotateZ(20deg) scale(1.2);
  			transform:rotateZ(20deg) scale(1.2);
  	opacity:0;
}

#right-side.right-side-opened {
  	-webkit-transform:rotateZ(0deg) scale(1) translateX(-60vw);
       -moz-transform:rotateZ(0deg) scale(1) translateX(-60vw);
  			transform:rotateZ(0deg) scale(1) translateX(-60vw);
  opacity:1;
}

#right-side h1, 
#right-side h2, 
#right-side h3, 
#right-side h4, 
#right-side h5, 
#right-side h6 {
  	margin-bottom:2.5rem;
  	color:#343434;
  	text-align:left;
  	font-weight:700;
}

#right-side h1 small, 
#right-side h2 small, 
#right-side h3 small, 
#right-side h4 small, 
#right-side h5 small, 
#right-side h6 small {
  	display:block;
  	margin-top:0.8rem;
  	color:rgba(52, 52, 52, 0.5);
  	font-size:1.2rem;
}

#right-side p {
  	color:gray;
  	font-size:1rem;
  	font-weight:400;
  	line-height:180%;
  	text-align:left;
}

#right-side .hero {
  	position:relative;
  	display:table;
  	width:100% !important;
  	padding:8% 10%;
  	background-color:#fff;
  	text-align:center;
}

#right-side .hero.hero-oblic {
  	padding:8% 10% 0 10%;
}

#right-side span.oblic {
  	position:relative;
  	z-index:-1;
  	height:10rem;
  	width:100%;
  	margin-top:-5rem;
  	margin-bottom:2.5rem;
  	background:#fff;
  	display:-webkit-box;
  	display:-moz-box;
  	display:box;
  	display:-webkit-flex;
  	display:-moz-flex;
  	display:-ms-flexbox;
 	display:flex;
  	-webkit-box-align:center;
  	   -moz-box-align:center;
  			box-align:center;
 	-webkit-align-items:center;
  	   -moz-align-items:center;
  			align-items:center;
  	-ms-flex-align:center;
  	-webkit-transform:skew(0deg, -5deg);
  	   -moz-transform:skew(0deg, -5deg);
  			transform:skew(0deg, -5deg);
}

#right-side .content {
  	padding:8% 10%;
}

#right-side .no-padding-bottom {
  	padding-bottom:0;
}

#right-side .photo-line figure {
  	width:calc(50% - 30px);
  	padding:0;
  	margin:0 15px 30px;
}

#right-side .photo-line figure:nth-child(odd) {
  	clear:both;
}

#right-side .photo-line figure a.box-picture {
  	position:relative;
  	overflow:hidden;
  	width:100%;
  	display:block;
}

#right-side .photo-line figure a.box-picture::before {
  	position:absolute;
  	top:0;
  	left:0;
  	z-index:1;
  	width:100%;
  	height:100%;
  	background:#20232D;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	content:'';
  	opacity:0;
}

#right-side .photo-line figure a.box-picture p {
  	position:absolute;
  	bottom:50%;
  	left:0;
  	z-index:2;
  	height:auto;
  	width:100%;
  	color:#fff;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	line-height:1;
  	text-align:center;
  	text-transform:uppercase;
  	font-size:1em;
  	letter-spacing:2px;
  	-webkit-transform:translateY(90%);
  	   -moz-transform:translateY(90%);
  			transform:translateY(90%);
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  opacity:0;
}

#right-side .photo-line figure a.box-picture .widget-angle {
  	position:absolute;
  	padding:0;
 	border:none;
  	background:transparent;
  	font-size:1em;
}

#right-side .photo-line figure a.box-picture .widget-angle span.icon-text {
  	position:absolute;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-top-right {
  	top:0;
  	right:0;
  	border-top:50px solid #2B2D35;
  	border-left:50px solid transparent;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-top-right span.icon-text {
  	top:-47px;
  	left:-22px;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-bottom-right {
  	bottom:0;
  	right:0;
  	border-bottom:50px solid #2B2D35;
  	border-left:50px solid transparent;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-bottom-right span.icon-text {
  	top:23px;
  	left:-22px;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-bottom-left {
  	bottom:0;
  	left:0;
  	border-bottom:50px solid #2B2D35;
  	border-right:50px solid transparent;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-bottom-left span.icon-text {
  	top:23px;
  	left:7px;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-top-left {
  	top:0;
  	left:0;
  	border-top:50px solid #2B2D35;
  	border-right:50px solid transparent;
}

#right-side .photo-line figure a.box-picture .widget-angle.angle-top-left span.icon-text {
  	top:-47px;
  	left:7px;
}

#right-side .photo-line figure a.box-picture:hover {
  	background:#343434;
}

#right-side .photo-line figure a.box-picture:hover::before {
  	opacity:0.8;
}

#right-side .photo-line figure a.box-picture:hover p {
  	-webkit-transform:translateY(50%);
  	   -moz-transform:translateY(50%);
  			transform:translateY(50%);
  opacity:1;
}

#right-side .photo-line figure .photo-details {
  	padding:2rem;
  	background:#fff;
  	color:#747c83;
  	text-align:left;
}

#right-side .photo-line figure .photo-details h4 {
  	margin-bottom:1em;
  	color:#343434;
  	text-transform:uppercase;
  	font-weight:700;
  	font-size:0.8em;
  	opacity:1;
}

#right-side .photo-line figure .photo-details span.border {
  	display:block;
  	height:2px;
  	width:10%;
  	margin:0.8em 0 1em;
}

#right-side .photo-line figure .photo-details p {
  	color:#767676;
  	font-size:0.9rem;
  	font-weight:400;
  	line-height:1.5rem;
}

#right-side .info-contact {
  	margin-bottom:0;
  	text-align:left;
}

#right-side .info-contact .item-contact .contact-item {
  	padding:15px 0;
  	font-size:14px;
}

#right-side .info-contact .item-contact .contact-item i {
  	font-size:2em;
}

#right-side .info-contact .item-contact .contact-item a {
  	color:gray;
}

#right-side #contact-form .icon-fields {
  	position:absolute;
  	top:12px;
  	left:25px;
  	color:rgba(52, 52, 52, 0.15);
}

#right-side #contact-form .form-control {
  	height:40px;
  	width:100%;
 	border:none;
  	padding:6px 12px 6px 35px;
  	color:rgba(52, 52, 52, 0.8);
  	background:#fff;
  	font-weight:700;
  	text-align:left;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
  	box-shadow:none;
  	outline:medium none;
}

#right-side #contact-form .form-control:hover, #right-side #contact-form .form-control:focus {
  	box-shadow:none;
}

#right-side #contact-form .form-control::-webkit-input-placeholder {
  	color:#747c83 !important;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-weight:400;
}

#right-side #contact-form .form-control::-moz-placeholder {
  	color:#747c83 !important;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-weight:400;
}

#right-side #contact-form .form-control:-moz-placeholder {
  	color:#747c83 !important;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-weight:400;
}

#right-side #contact-form .form-control:-ms-input-placeholder {
  	color:#747c83 !important;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-weight:400;
}

#right-side #contact-form textarea.form-control {
  	min-height:150px;
  	line-height:2;
}

#right-side #contact-form span.sub-text {
  	position:absolute;
  	right:1rem;
  	bottom:-1rem;
  	color:#b3b3b3;
  	font-size:0.7rem;
}

#right-side #contact-form #ios {
  	position:absolute;
  	visibility:hidden;
}

#right-side #contact-form .button {
  	position:relative;
  	top:0;
  	float:left;
  	display:block;
  	width:70px;
  	height:34px;
  	margin:1rem 0 1rem;
  	background:#fff;
  	cursor:pointer;
  	will-change:background;
}

#right-side #contact-form .button.ios {
  	position:relative;
  	-webkit-border-radius:100px;
  	   -moz-border-radius:100px;
  			border-radius:100px;
  	-webkit-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
}

#right-side #contact-form .button.ios:before {
  	position:absolute;
  	top:0;
  	left:0;
  	display:block;
  	height:100%;
  	width:100%;
  	background-color:#fff;
  	-webkit-border-radius:100px;
  	   -moz-border-radius:100px;
  			border-radius:100px;
  	-webkit-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  	will-change:transform;
  	will-change:background;
  	box-shadow:inset 0 10px 30px rgba(52, 52, 52, 0.2);
  	content:'';
}

#right-side #contact-form .button.ios:after {
  	position:absolute;
  	top:2px;
  	left:2px;
  	display:block;
  	height:30px;
  	width:30px;
  	background-color:#fff;
  	-webkit-border-radius:100px;
  	   -moz-border-radius:100px;
  			border-radius:100px;
  	-webkit-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:background, 0.25s cubic-bezier(0.77, 0, 0.175, 1);
  	box-shadow:0 10px 30px rgba(0, 0, 0, 0.1);
  	content:'';
}

#right-side #contact-form input[type=checkbox]:checked + label.ios {
  	-webkit-transition:0s background, 0s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:0s background, 0s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:0s background, 0s cubic-bezier(0.77, 0, 0.175, 1);
}

#right-side #contact-form input[type=checkbox]:checked + label.ios:after {
  	-webkit-transform:translateX(35px);
  	   -moz-transform:translateX(35px);
  			transform:translateX(35px);
}

#right-side #contact-form input[type=checkbox]:checked + label.ios:active:after {
  	-webkit-transform:translateX(10px);
  	   -moz-transform:translateX(10px);
  			transform:translateX(10px);
}

#right-side #contact-form input[type=checkbox]:checked + label.ios:before {
  	-webkit-transform:translateX(10px) scale(0.1);
  	   -moz-transform:translateX(10px) scale(0.1);
  			transform:translateX(10px) scale(0.1);
}

#right-side #contact-form label.check-news {
  	float:left;
  	display:block;
  	margin-top:1.3rem;
  	margin-left:0.6rem;
  	color:rgba(52, 52, 52, 0.5);
  	font-size:0.9rem;
  	font-style:italic;
}

#right-side #contact-form button#valid-form {
  	display:block;
  	margin:1rem 0 0;
  	padding:0.7em 2em;
  	border:2px solid #000;
  	color:#fff;
  	text-transform:uppercase;
  	font-weight:600;
  	font-size:100%;
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
}

#right-side #contact-form button#valid-form:hover {
  	border-color:#fff;
  	background:#fff;
  	color:#20232D;
}

#right-side #block-answer {
  	min-height:60px;
  	margin-top:1em;
  	color:#757A86;
  	text-align:center;
}

#right-side .success-message, 
#right-side .error-message {
  	color:#757A86;
}

#right-side .success-message p, 
#right-side .error-message p {
  	color:#757A86 !important;
}

#right-side .success-message .ion-checkmark-round, 
#right-side .error-message .ion-checkmark-round {
  	color:#27AE60;
}

#right-side .error-message .ion-close-round {
  	color:#FF1D4D;
}

#right-side footer {
  	width:100%;
  	padding:1rem 0;
  	background:transparent;
  	text-align:center;
}

#right-side footer p {
  	color:#b3b3b3;
  	font-family:Montserrat, "Helvetica Neue", "Lucida Grande", Arial, Verdana, sans-serif;
  	font-size:0.7rem;
  	font-weight:400;
  	letter-spacing:0;
  	text-transform:uppercase;
  	text-align:center;
}

#right-side footer p a {
  	color:#5a5a5a;
}

#right-side footer p a:hover {
  	color:#19c073;
}

#close-right-side {
 	position:fixed;
  	top:1rem;
  	right:-1rem;
  	z-index:100;
  	border:none;
  	background:transparent;
  	color:rgba(52, 52, 52, 0.5);
  	font-size:1.3rem;
  	opacity:0;
}

#close-right-side.right-side-opened {
  	right:1rem !important;
  	opacity:1 !important;
}

#close-right-side:hover {
  	color:#343434;
}

/************************
    - 6. Newsletter -
************************/
.dialog,
.dialog__overlay {
  	top:0;
  	left:0;
  	width:100%;
	height:100%;
}

.dialog__overlay {
  	position:absolute;
  	z-index:1;
  	background:rgba(32, 35, 45, 0.9);
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
   	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	opacity:0;
}

.dialog--open .dialog__overlay {
  	opacity:1;
  	pointer-events:auto;
}

.dialog {
  	position:fixed;
  	z-index:999;
  	display:-webkit-box;
  	display:-moz-box;
  	display:box;
  	display:-webkit-flex;
  	display:-moz-flex;
  	display:-ms-flexbox;
  	display:flex;
  	-webkit-box-pack:center;
  	   -moz-box-pack:center;
  			box-pack:center;
  	-webkit-justify-content:center;
  	   -moz-justify-content:center;
  			justify-content:center;
  	-ms-flex-pack:center;
  	-webkit-box-align:center;
  	   -moz-box-align:center;
  			box-align:center;
  	-webkit-align-items:center;
  	   -moz-align-items:center;
  			align-items:center;
  	-ms-flex-align:center;
  	pointer-events:none;
}

.dialog--open .dialog__content {
  	pointer-events:auto;
}

.dialog .dialog__content {
  	position:relative;
  	z-index:5;
  	width:50%;
  	max-width:500px;
  	min-width:290px;
  	padding:0;
  	overflow:hidden;
  	background:transparent;
  	background:url(../images/background-newsletter.jpg) center;
  	background-size:cover;
  	text-align:center;
  	opacity:0;
}

.dialog .dialog__content::before {
  	position:absolute;
  	top:0;
  	left:0;
  	z-index:-1;
  	width:100%;
  	height:100%;
  	background:rgba(32, 35, 45, 0.8);
 	content:" ";
}

.dialog .dialog__content .dialog-inner {
  	padding:90px 70px;
  	overflow:hidden;
  	border-left:10px solid #3dade9;
  	border-right:10px solid #bf2fcb;
  	background-size:100% 10px;
  	background-position:0 100%, 0 0;
  	background-repeat:no-repeat;
  	background-clip:border-box;
    background-image:-webkit-linear-gradient(left, #3dade9, #bf2fcb), -webkit-linear-gradient(left, #3dade9, #bf2fcb);
    background-image:-o-linear-gradient(left, #3dade9, #bf2fcb), -o-linear-gradient(left, #3dade9, #bf2fcb);
    background-image:linear-gradient(to right, #3dade9, #bf2fcb), linear-gradient(to right, #3dade9, #bf2fcb);
}

.dialog .dialog__content .dialog-inner::before {
  	position:absolute;
  	top:0;
  	left:0;
  	z-index:-1;
  	width:100%;
  	height:100%;
  	content:" ";
}

.dialog .dialog__content .dialog-inner h4 {
  	color:#fff;
  	font-size:40px;
  	font-weight:700;
}

.dialog .dialog__content .dialog-inner p {
  	color:#f2f3f7;
  	font-size:16px;
}

.dialog .dialog__content .dialog-inner #subscribe p {
  	font-weight:400;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe {
  	max-width:450px;
  	margin:auto;
  	margin-top:2em;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control {
  	padding:0 1em;
  	height:50px;
  	width:100%;
  	margin:auto;
  	border:none;
  	color:#fff;
  	background:rgba(32, 35, 45, 0.8);
  	text-align:center;
  	font-weight:700;
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	box-shadow:none;
  	outline:medium none;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control:hover, 
.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control:focus {
  	box-shadow:none;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control::-webkit-input-placeholder {
  	color:rgba(255, 255, 255, 0.5) !important;
  	font-weight:400;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control::-moz-placeholder {
  	color:rgba(255, 255, 255, 0.5) !important;
  	font-weight:400;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control:-moz-placeholder {
  	color:rgba(255, 255, 255, 0.5) !important;
  	font-weight:400;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group .form-control:-ms-input-placeholder {
  	color:rgba(255, 255, 255, 0.5) !important;
  	font-weight:400;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group button.submit {
  	display:block;
  	padding:0.7em 2em;
  	margin:0 auto;
  	border:2px solid #000;
  	color:#fff;
  	text-transform:uppercase;
  	font-weight:600;
  	font-size:100%;
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
}

.dialog .dialog__content .dialog-inner #subscribe #notifyMe .form-group button.submit:hover {
  	border-color:#fff;
  	background:#fff;
  	color:#2B2D35;
}

.dialog .dialog__content .dialog-inner #subscribe .block-message {
  	position:absolute;
  	left:0;
  	bottom:-100px;
  	min-height:50px;
  	width:100%;
  	padding:15px;
  	background:transparent;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dialog .dialog__content .dialog-inner #subscribe .block-message.show-block-error {
  	bottom:0;
  	background:#FF1D4D;
}

.dialog .dialog__content .dialog-inner #subscribe .block-message.show-block-valid {
  	bottom:0;
  	background:#00c8aa;
}

.dialog .dialog__content .dialog-inner #subscribe p.notify-valid {
  	color:#fff;
  	text-transform:none;
  	font-size:16px;
  	letter-spacing:0;
  	font-weight:600;
}

.dialog .dialog__content .close-newsletter {
  	position:absolute;
  	top:1rem;
  	right:1rem;
  	border:none;
  	width:40px;
  	height:40px;
  	color:#fff;
  	background:transparent;
  	line-height:35px;
  	font-size:20px;
  	opacity:0.5;
}

.dialog .dialog__content .close-newsletter:hover {
 	opacity:1;
}

.dialog.dialog--open .dialog__content,
.dialog.dialog--close .dialog__content {
  	-webkit-animation-duration:0.4s;
  	   -moz-animation-duration:0.4s;
  			animation-duration:0.4s;
  	-webkit-animation-fill-mode:forwards;
  	   -moz-animation-fill-mode:forwards;
  			animation-fill-mode:forwards;
}

.dialog.dialog--open .dialog__content {
  	-webkit-animation-name:anim-open;
  	   -moz-animation-name:anim-open;
  			animation-name:anim-open;
}

.dialog.dialog--close .dialog__content {
  	-webkit-animation-name:anim-close;
  	   -moz-animation-name:anim-close;
  			animation-name:anim-close;
}

@keyframes anim-open {
  	0% {
    	opacity:0;
    	-webkit-transform:translate3d(0, 50px, 0);
    	   -moz-transform:translate3d(0, 50px, 0);
    			transform:translate3d(0, 50px, 0);
  	}
  	100% {
    	opacity:1;
    	-webkit-transform:translate3d(0, 0, 0);
    	   -moz-transform:translate3d(0, 0, 0);
    			transform:translate3d(0, 0, 0);
  	}
}

@keyframes anim-close {
  	0% {
    	opacity:1;
    	-webkit-transform:translate3d(0, 0, 0);
    	   -moz-transform:translate3d(0, 0, 0);
    			transform:translate3d(0, 0, 0);
  	}
  	100% {
    	opacity:0;
    	-webkit-transform:translate3d(0, 50px, 0);
    	   -moz-transform:translate3d(0, 50px, 0);
    			transform:translate3d(0, 50px, 0);
  	}
}

/******************************
    - 7. Custom scrollbar -
******************************/
.mCSB_scrollTools {
  	position:absolute;
  	left:auto;
  	top:0;
  	right:0;
  	bottom:0;
  	z-index:5;
  	width:5px;
  	height:auto;
  	-webkit-transition:all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  	opacity:0;
}

.mCSB_scrollTools .mCSB_draggerRail {
  	width:5px;
  	height:100%;
  	margin:0;
  	background-color:#757a86;
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
  	opaticy:0.4;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
  	position:relative;
  	width:5px;
  	height:100%;
  	margin:0 auto;
  	text-align:center;
  	-webkit-border-radius:0;
  	   -moz-border-radius:0;
  			border-radius:0;
}

.mCSB_scrollTools.right-side-opened {
  	-webkit-transform:translateX(-60vw);
       -moz-transform:translateX(-60vw);
  			transform:translateX(-60vw);
  	opacity:1;
}

/*********************
    - 8. Gallery -
*********************/
.pswp__bg {
  	background:#090d19;
}

.pswp__ui--fit .pswp__caption {
  	border-top:5px solid #000;
}

.pswp__ui--fit .pswp__caption .pswp__caption__center {
  	padding:20px 10px;
}

.pswp__caption h4 {
  	margin-bottom:10px !important;
}

/****************************
    - 9. Video controls -
****************************/
#player-nav {
  	position:absolute;
  	right:10px;
  	top:10px;
  	z-index:10;
  	display:block;
  	width:auto;
  	margin-left:0;
  	white-space:nowrap;
  	opacity:0;
}

#player-nav a {
  	position:relative;
  	display:block;
  	min-width:50px;
  	height:50px;
  	margin-right:2px;
  	border:none;
  	background:transparent;
  	color:white;
  	line-height:50px;
  	letter-spacing:0;
  	font-size:1em;
  	font-weight:300;
  	text-align:center;
  	-webkit-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  	   -moz-transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
  			transition:all 0.3s cubic-bezier(0.77, 0, 0.175, 1);
}

#player-nav a:hover {
  	background:transparent;
  	-webkit-transform:translateX(-0.2rem);
  	   -moz-transform:translateX(-0.2rem);
  			transform:translateX(-0.2rem);
}