body {
	font-family:Roboto, Arial !important;
	font-size: 12px !important;

	background-color:#1d1d1d !important;
    height: 100vh;
	background-size:1920px;
	background-attachment:fixed;

 }

.BeaconFabButtonFrame{
	bottom: 44px!important;
}
.BeaconContainer-enter-done {
	z-index: 9999 !important;
	height: 80vh !important;
	bottom: 110px !important;
}
 @keyframes cssfadeInOut {
	0% { opacity: 1;}
	10% { opacity: 0.3; }
	20% { opacity: 1; }
	30% { opacity: 1; }
	40% { opacity: 0.3;}
	50% { opacity: 1;}
	60% { opacity: 0.3; }
	70% { opacity: 1; }
	80% { opacity: 0.3; }
	90% { opacity: 1; }
	100% { opacity: 0.3; }
}
.loading-dot-processing{
	content: ' .';
	animation: dots 1s steps(5, end) infinite;
	display: inline;
	padding-left: 2px;
}
.loading-processing:after {
	content: ' .';
	animation: dots 1s steps(5, end) infinite;
	min-height: 100px;
	font-size: 25px;
	display: flex;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	justify-content: space-around;
 }
 .resend-processing:after {
	 content: ' .';
	 animation: dots 1s steps(5, end) infinite;
 }

 @keyframes dots {
	 0%, 20% {
		 color: rgba(0,0,0,0);
		 text-shadow:
				 .25em 0 0 rgba(0,0,0,0),
				 .5em 0 0 rgba(0,0,0,0);}
	 40% {
		 color: white;
		 text-shadow:
				 .25em 0 0 rgba(0,0,0,0),
				 .5em 0 0 rgba(0,0,0,0);}
	 60% {
		 text-shadow:
				 .25em 0 0 white,
				 .5em 0 0 rgba(0,0,0,0);}
	 80%, 100% {
		 text-shadow:
				 .25em 0 0 white,
				 .5em 0 0 white;}
 }
 
#loadingProgressGallery {
	background-image: url('../../html/theViewer/content/loadingProgress.png');
	background-size: 150px 75px;
	width: 150px;
	height: 75px;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation-name: cssfadeInOut;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 10s;
	animation-direction: alternate;
	z-index: 1;
}

button, input[type="button"] {
	border: 0;
}

#errorSubscribe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}
#errorSubscribe h1 {
	margin-bottom: 4px !important;
	font-size: 32px !important;
}
.cc-grower .cc-window.cc-floating {
	max-width: 100%;
}

a {
 transition: 0.3s;
}

a:visited{
    text-decoration: none !important;

}
 .clear{
	clear:both;
	margin:0px;
	padding:0px;
	width:0px;
	height:0px;
	border:0px

 }
 html{
 height: 100%;
 }
 .mainContainer {
	padding: 80px 0 140px 0;
	min-height: 100%;
 }
.fixed-container {
	padding: 0px !important;
}
 .warpEditor {
	height:940px;
 }

 #editor {
 	padding-top: 120px!important;
 }

 .right{
 float:right !important;
 }
 .left{
 float:left !important;
 }
 /* header */
 #theViewer-header {
	width: 100%;
	height: 80px;
	border-bottom: 1px solid #232323;
	background: #111;
 }
 #theViewer-header #logo-container {
	width: 180px;
	height: 100%;
	border-right: 1px solid #232323;
	float:left;
 }
  #theViewer-header #logo-container img {
	height:20px;
	margin-left:20px;
	margin-top: 25px;
  }

 #theViewer-header-bg {
	 height: 250px;
	 background: url(../../html/theViewer/content/main-page/theViewer-header-bg.jpg);
	 position: relative;
	 overflow:hidden;
	 margin-top: 80px;
 }
 
 #theViewer-header-bg img {
 	position: relative;
 }

/* HERO TITLE MAIN PAGE */
.hero-text-block {
  z-index: 500;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle!important;
    justify-content: center!important;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    z-index: 0;
    width:100%;
}

.hero-title.word {
  display: block!important;
  overflow: visible!important;
  font-family: Roboto,sans-serif!important;
  font-size: 36px!important;
  font-style: normal!important;
  font-weight: 700!important;
  /* text-align: left!important; */
}

.hero-title {
  margin-top: 0!important;
  margin-bottom: 1px!important;
  font-size: 20px!important;
  line-height: 44px!important;
  text-shadow: 0 0 6px #000!important;
}

.hero-title {
  color: #fff;
  /*  text-transform: uppercase; */
}

.hero-title.title-2 {
  margin-top: 5px!important;
  font-size: 36px!important;
  line-height: 34px!important;
}
.hero-budge-container{
	display: flex;
    flex-flow: row wrap;
    justify-content: center;
    top: 80%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    width: fit-content;
}
.hero-budge-item{
    width: 100px;
    height: 35px;
    margin: 20px;
    padding: 0px;
}
.hero-budge-item a, .hero-budge-img {
	height: inherit;
}
.hero-title,.hero-title.title-2 {
  font-weight: 700;
  font-family: Roboto,sans-serif;
}
@media only screen and (min-width: 300px) and (max-width: 767px) {
	#featured > h3 {
		font-size: 20px !important;
	}
	.hero-budge-img {
		height: 18px !important;
	}
	.hero-budge-container {
		top: 88% !important;
	}
	.hero-budge-item {
		margin: 0px 8px !important;
	}
	.modal-container {
		width : 90% !important;
	}
}
@media (max-width: 991px){
	.hero-title.word {
		font-size: 27px!important;
	}
	.hero-title.title-2 {
		margin-top: 5px!important;
		font-size: 27px!important;
		line-height: 34px!important;
	}
}
@media (max-width: 767px){
	.hero-text-block {
	    display: grid!important;
	    vertical-align: middle!important;
	    justify-content: center!important;
	    padding: 25px 0px!important;
	}
	.hero-title.word {
	    font-size: 20px!important;
	    line-height: 20px!important;
	}
	.hero-title.title-2 {
		font-size: 20px!important;
		line-height: 20px!important;
	}
	#theViewer-header-bg {
	    height: 125px;
	}
	.hero-budge-img {
		height: 22px;
	}
	.hero-budge-item{
		width: fit-content;
		height: fit-content;
		margin: 0px 10px;
	}
}


 #featured p {
	 font-family: Roboto;
	 font-size: 16px;
	 color: #e4e4e4;
	 padding-left: 17px;
	 padding: 30px 0px 10px 0px;
	 margin-bottom: -80px;
	 text-align: center;
 }

 #featured {
 	position: relative;
 	margin: 25px 0px 30px 0px;
    text-align: center;
    color: #fff;
 }
.noHighlight{
	display: none!important;
}
/* menu - responsive */
.btn-signup {
	border: 1px solid #fff;
	border-radius: 25px !important;
    background: transparent !important;
    transition: 0.3s;
    outline: none !important;
    height: 30px !important;
    line-height: 28px !important;
}
.btn-signup:hover {
	border: 1px solid #14c5d8;
	color: #14c5d8 !important;
}
.display {
	display: block !important;
}
ul {
	list-style-type: none;
}
ul.topnav li a span {
	color:#fff !important;
	font-size: 12px;
}
ul.topnav li ul {
	padding: 0px !important;
}

ul.topnav li a.highlight {
	color: #fff!important;
}
ul.topnav {
	width:100%;
	z-index:150;
  	margin: 0;
  	padding: 0;
  	background-color: rgba(17,17,17,1);
  	border-bottom:1px solid #232323;
  	transition: top 0.3s;
  	position: fixed;
  	top:0px;
}


ul.topnav li {
	height:80px;
	float: left;
}
ul.topnav li.no-border{
	border: 0px !important;
}
ul.topnav li.no-border a, ul.topnav li.no-border span {
	padding-right:0px !important;
}
ul.topnav li a#logo { display: unset;}
ul.topnav li a, ul.topnav li label, ul.topnav li span {
  display: inline-block;
  color: #888 !important;
  text-align: center;
  padding: 0 20px 0 20px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 16px;
  font-weight:400;
  height:100%;
  line-height:80px;
  cursor: pointer;
}
ul.topnav li .gfx-link{
	background-repeat: no-repeat;
    background-position: 20px center;
	background-size: 23px 24px;
	cursor:pointer;
}

ul.topnav li a:hover, ul.topnav li label:hover {color: #fff!important;}

ul.topnav li.icon {display: none;}

ul.topnav li a#logo{
	width: 100%;
}
ul.topnav li a#logo img{
	height:40px;
}

ul.topnav li #login-label{
	font-size: 14px;
	text-transform: none;
	font-weight: 400;
    background-image: url(../../html/content/layout/menu/user-icon.svg);
  	color: #fff!important;
  	padding-left: 50px;
}

ul.topnav li #login-label img {
	width: 10px;
	margin-left: 5px;
}

ul.topnav li .normal-link{
	color: #00b9cd;
	font-size: 16px;
	text-transform:none;
	font-weight: 400;
}

ul.topnav li #signup-link{
    color: #fff!important;
    border-color: #fff!important;
}

ul.topnav li #getPremiumBtn-cell a > input{
	height: 30px!important;
    padding: 0px 20px!important;
    text-transform: none;
}

.show-userDropDownMenu {
	display: block;
}

ul.topnav li:hover #signup-in{
    color: #14c5d8!important;
    border-color: #14c5d8!important;
    background-color: transparent!important;
}

#getPremiumLink-cell {
 	display: block;
 }
ul.topnav #getPremiumBtn-cell {
	display: none;
}
ul.topnav li #login-link, ul.topnav li #logout-link, ul.topnav li #profile-link, ul.topnav li #signup-link {
	color: #fff!important;
}
ul.topnav li #login-link:hover, ul.topnav li #logout-link:hover, ul.topnav li #profile-link:hover {
	color: #14c5d8!important;
}
ul.topnav a#userProfileDirectLink {
	padding-left: 0px!important;
}

.hide-userDropDownMenu {
		display: none;
	}

ul#userDropDownMenu {
    height: auto;
    position: fixed;
    padding-left: 0px;
    list-style: none;
    background-color: #111;
    width: 100%;
    z-index:999;
}

ul#userDropDownMenu li {
	height: 40px;
	float: none;
}

ul#userDropDownMenu li a {
	line-height: 40px;
	font-size: 14px;
}

ul#userDropDownMenu li a#getPremiumLink {
	color: #14c5d8!important;
}

li#logged-user{
	cursor: pointer;
}

/* login */
@media only screen and (min-width: 300px) and (max-width: 580px) {
.background-signup {
	background: url('../../html/content/signup/background-prov-mobile.jpg') !important;
	background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
	}
}
@media only screen and (min-width: 1441px) and (max-width: 2800px) {
.background-signup {
	background: url('../../html/content/signup/background-prov-desktop2x.jpg') !important;
	background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
	}

}
 @media only screen and (min-height: 1000px) {
	 .modal-container {
		 height: 60% !important;
	 }
 }
 @media only screen and (min-height: 1300px) {
	 .modal-container {
		 height: 50% !important;
	 }
 }
 @media only screen and (min-height: 1500px) {
	 .modal-container {
		 height: 45% !important;
	 }
 }
 @media only screen and (min-height: 1600px) {
	 .modal-container {
		 height: 50% !important;
	 }
 }
 @media only screen and (min-height: 1900px) {
	 .modal-container {
		 height: 35% !important;
	 }
	 .page {
		 padding:20px !important;
	 }
 }
 @media only screen and (min-height: 2050px) {
	 .modal-container {
		 height: 30% !important;
	 }
 }
 @media only screen and (min-height: 2500px) {
	 .modal-container {
		 height: 28% !important;
	 }
	 .page {
		 padding:40px !important;
	 }
 }
 @media (min-width:961px) and (max-width:1281px)  {
	 .modal-container {
		 height: 50% !important;
	 }
 }

 @media only screen and (min-width:1281px) and (max-width:1366px){
	 .modal-container {
		 width: 90% !important;
		 height: 65% !important;
	 }
 }
 @media only screen and (min-width:1400px) and (max-width:2000px){
	 .modal-container {
		 width: 80% !important;
	 }
 }

 /*@media only screen and (min-height: 1024px) {
	 .modal-container {
	 	height: 65% !important;
	 }
 }

 @media only screen and (min-height: 1024px) and (min-width:2000px){
	 .modal-container {
		 height: 50% !important;
	 }
 }

 @media only screen and (min-height: 1366px) {
	 .modal-container {
		 height: 50% !important;
	 }
 }

 @media only screen and (min-height: 1600px) {
	 .modal-container {
		 height: 30% !important;
	 }
 }
*/



 .background-signup {
    justify-content: center;
    align-items: center;
    box-shadow: inset 0 0 0 1680px rgba(0,0,0,0.4);
	background: url('../../html/content/signup/background-prov-desktop.jpg');
	background-size: cover;
    background-repeat: no-repeat;
    min-height: 100%;
    width: 100%;
    display: flex;	
}
#signup-container {
	margin: 0 auto;
    text-align: center;
    min-height: 50%;
}
#signup-container .signup-logo > img {  max-width: 207px;  max-height: 37px;  width: 150px;  height: auto;}
#signup-container #loginWithEmail .consents {
    position: absolute;
    top: 0;
    left:0;
    background: black;
    height: 100%;
    color: #fff;
    padding: 15px;
}
#signup-container #loginWithEmail #google-login .consents h2 {
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    color: #888888;
}
#google-login .consents p {
	padding: 20px 0px;
	font-size: 12px;
	margin: 0;
	padding: 13px 0px;
}
#signup-container #loginWithEmail #google-login .close-consent svg {
    background: #ddd;
    padding: 6px;
    border-radius: 50%;
    cursor: pointer;
}
#signup-container #loginWithEmail #google-login .tip {
	width: 17px; 
	height: 17px;
	background: #00b9cd; 
	text-align: center;
	color: #fff; 
	font-size: 15px; 
	font-family: Times New Roman;
	border-radius: 50%; 
	display: inline-block; 
	line-height: 16px;
	cursor: pointer;
}
#signup-container .signup-logo {
	text-align: center;
	line-height: 100px;
}
#signup-container #copy-logo {
	position: absolute;
    text-align: center;
    left: 0;
    right: 0;
    bottom: 50px;
    color: #fff;
}

@media only screen and (min-width: 300px) and (max-width: 580px) {
	#signup-container #loginWithEmail #google-login .consents h2 {
		font-size: 10px;
		padding:0;
	}
	#signup-container #loginWithEmail #google-login #electronicConsentDesc, #signup-container #loginWithEmail #google-login #supportConsentDesc {
		font-size: 8px;
	}
	#signup-container #loginWithEmail #google-login .tip { font-size: 12px;}
	#signup-container #loginWithEmail #google-login .disc-container input { vertical-align: sub;}
	#signup-container #loginWithEmail #google-login .disc-container div { font-size: 11px !important;}
	#signup-container { padding: 40px 0 140px 0;}
}
.highlight-attention {
	color: #de1b1b !important;
}
.mandatory-asterix {
	color: #de1b1b;
}

#signup-container #loginWithEmail {
  float: none;
  border-radius: 5px;
  box-shadow: 0 2px 10px 0 #000000;
  background-color: #ffffff;
  margin: 0 auto;
}
.loginProvider{ top:0 !important;}
#loginWithEmail {
    float: none;
    top: 80px;
    margin: 0 auto;
    text-align: center;
}
#loginWithEmail > h1, #errorSubscribe h1 {
    color:#FFF ;
    font-size:36px ;
    font-weight: 100 ;
    padding:0px ;
    margin: 0 0 40px 0 ;
    line-height:1.6 ;
 }
#signup-container #loginWithEmail h2, #errorSubscribe h1 {
	color:#111111 ;
	font-family: Roboto;
	font-size: 32px;
	font-weight: bold;
	padding-top: 27px;
 }
 #loginWithEmail > h2, #errorSubscribe h1 {
	color:#FFF ;
	font-size:20px ;
    font-weight: 400 ;
    padding:0px ;
    margin: 0 0 40px 0 ;
    color:#FFF;
    font-size:20px;
    font-weight: 400;
    padding:0px;
    margin: 0 0 40px 0;
 }
 
 #loginWithEmail h3 {
 font-family: Roboto;
  font-size: 16px;
  color:#888888;
 }
#loginWithEmail h5{
	color: #FFFFFF;
}
#signupBtn {
	background: white;
	border-radius: 4px;
	width: 100% !important;
	color: black !important;
	font-weight: 500;
}
#signupBtn > a {
	color: #000 !important;
	font-size: 14px;
	padding: 10px 40px;
	display: block;
}
#questionAccount {
	padding: 0 0 20px 0;
	font-size: 15px;
	color: #d0d0d0;
}
h1.header-text {
 	font-family: Roboto;
    font-size: 20px!important;
    font-weight: 400!important;
	margin-bottom: 5px!important;
 }
h2.subtitle {
    font-family: Roboto;
    font-size: 26px!important;
    font-weight: 300!important;
    line-height: 28px!important;
 }
#loginWithEmail h2 {
    margin-bottom: 4px!important;
}
#signup-container #google-login {
		padding:0 0 20px 0;
	
}
 #firebase-email-button {
	max-width: 240px !important;
	border-radius: 4px !important;
	margin-bottom: 20px !important;
}
.signup > .firebase-email-button > .firebaseui-idp-text, .login > .firebase-email-button > .firebaseui-idp-text {
	font-size: 16px !important;
	padding-left: 5px !important;
	border: none;
    font-family: Helvetica, Arial, sans-serif;
    letter-spacing: .25px;
    overflow: hidden;
    text-align: center;
    text-overflow: clip;
    white-space: nowrap;
}
.signup > .firebase-email-button > .firebaseui-idp-text {
	padding-left: 16px !important;
}
.signup > .firebaseui-idp-button, .login > .firebaseui-idp-button {
	padding: 8px 16px !important;
}
.login > #firebase-email-button > .firebaseui-idp-icon-wrapper > .firebaseui-idp-icon, .signup > #firebase-email-button > .firebaseui-idp-icon-wrapper > .firebaseui-idp-icon {
	position: relative;
    left: -8px;
    height: unset;
    width: unset;
    vertical-align: middle;
}
 .firebase-auth-hidden {
	display:none;
	pointer-events: none;
}

.signup > #wrapper-firebase-form {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.form-close {
	float: right;
    font-size: 21px;
    font-weight: 200;
    line-height: 1;
    color: #000;
    position: relative;
    right: 14px;
    top: 20px;
}
.login > #wrapper-firebase-form{
	position: absolute;
	left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 99;
}

@media only screen and (min-width: 300px) and (max-width: 580px) {
	.login > #wrapper-firebase-form > #firebaseui-auth-container > .mdl-card {
		min-width: 280px;
		min-height: 320px;
	}
	.signup > #wrapper-firebase-form > #firebaseui-auth-container {
		height: 100%;
	}
	.form-close {
		float: right;
		font-size: 21px;
		font-weight: 200;
		line-height: 1;
		color: #000;
		position: absolute;
		right: 15px;
		top: 8px;
		cursor: pointer;
		padding: 8px 0px 8px 8px;
		z-index: 99;
	}
}

@media only screen and (min-width: 580px) {
	.login > #wrapper-firebase-form > #firebaseui-auth-container > .mdl-card {
		min-width: 410px;
		min-height: 370px;
	}
	.signup > #wrapper-firebase-form > #firebaseui-auth-container {
		height: 100%;
	}
	.signup > #wrapper-firebase-form > .form-close {
		float: right;
		font-size: 21px;
		font-weight: 200;
		line-height: 1;
		color: #000;
		position: absolute;
		right: 15px;
		top: 8px;
		cursor: pointer;
		padding: 8px 0px 8px 8px;
		z-index: 99;
	}
	.form-close {
		float: right;
		font-size: 21px;
		font-weight: 200;
		line-height: 1;
		color: #000;
		position: relative;
		right: 15px;
		top: 50px;
		cursor: pointer;
		padding: 8px 0px 8px 8px;
		z-index: 99;
	}
}

.signup .login > #wrapper-firebase-form > #firebaseui-auth-container > .mdl-shadow--2dp {
	box-shadow: none;
}
.signup > #wrapper-firebase-form > #firebaseui-auth-container > .mdl-card {
	border-radius: 6px;
	min-height: 100%;
}

#google-login {
	padding:0 0 50px 0;
	text-align: center;
}
.signup > #googleSignupButtonId > .abcRioButton {
	border-radius: 4px;
	height: 40px !important;
	max-width: 240px;
	width: auto !important;
}
#googleSignupButtonId span {
	float:left;
}
.signup > #googleSignupButtonId > .abcRioButton > .abcRioButtonContentWrapper {
	border: 1px solid transparent !important;
    padding: 2px !important;
}

#googleSignupButtonId .abcRioButtonContents {
	font-size: 16px!important;
    margin-left: 22px;
    line-height: 36px !important;
}
.g-signin2 {
	margin-bottom: 11px;
	margin-top: 30px;
    display: inline-block;
}
.g-signin2 .abcRioButtonLightBlue {
    height: 40px!important;
    width: 240px!important;
    padding: 2px 0px;
    border-radius: 3px;
}

.g-signin2 .abcRioButtonIcon {
	padding: 8px 0px 8px 8px!important;
}

.g-signin2 .abcRioButtonContents {
	margin-left: 0px;
	margin-right: 8px;
	font-size: 16px!important;
}

.login > .fb-login-button {
	display: block!important;
    margin-bottom: 11px;
}
.signup > .fb-login-button {
	margin-bottom: 11px;
	display: block;
}
.fb-login-button > span {
	box-shadow: 0 2px 4px 0 rgba(0,0,0,.25);
    border-radius: 5px;
}
.fb-login-button > span > iframe {
    width: auto;
    max-width: 240px;
}
.fb-login-button-disabled {
	display: none !important;
}
#googleSignupButtonId .abcRioButton {
	margin: 0 auto;
}
.custom-login-button{
	padding: 2px 0px;
    border-radius: 3px;
    margin: 20px 0px 10px 0px;
}
.disc-container{
	color:#d0d0d0;
	font-size: 14px;
	line-height: 20px;
	clear: both;
	float: none!important;
	margin: 0 auto;
}
.disc-container div {
	color:#111111;
	font-weight:400;
	font-size: 14px;
	width: 100%;
	text-align: left;
}
#email-marketing {
	position: relative;
	top: 2px;
	margin-right: 9px;
}
#email-newsletter {
	position: relative;
	top: 2px;
	margin-right: 3px;
}
.consent-description {
	text-align: left;
	font-size: 12px;
	padding-top: 6px;
}
.show-more {
	margin-left: 10px;
	cursor: pointer;
	color: #14c5d8;
	float: right;
}
.show-more:hover {
	text-decoration: underline;
}
#google-login .disc-container{
	margin: 0 auto;
}
#showPremiumBtn {
    font-size: 12px;
    font-weight: 300;
    color: #888;
    margin-top: 50px;
    cursor: pointer;
}
#thecontruct-login {
	float: none;
    margin: 0 auto;
    top: 80px;
    display: none;
    visibility: hidden;
}
#thecontruct-login > h1 {
	color: #fff;
}
@media only screen and (max-width: 520px) {
	 .subtitle {
    	line-height: 22px;
    	font-size: 21px!important;
	}
}

@media only screen and (max-width: 414px) {
	 .subtitle {
        line-height: 20px;
    	font-size: 18px!important;
	}
	.disc-container {
		font-size: 12px;
		line-height: 16px;
	}
}

@media only screen and (max-width: 320px) {
	#loginWithEmail, #thecontruct-login  {
		top: 50px;
	}
}


/* formularze */
/* nowy upload */
#upload-project-form, #upload-gallery-form {
position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
    max-width: 1170px;
}

#create-gallery-btn, #create-project-btn {
	margin-top: 20px;
	float: right;
	border-radius: 6px !important;
    border-color: #b4b4b4 !important;
    color: #b4b4b4 !important;
}

#create-gallery-btn:hover, #create-project-btn:hover {
    border: 2px solid #14c5d8 !important;
    color: #1d1d1d !important;
}

#login-form {
	margin-top:50px;

}
form textarea.form-control {
	background: transparent !important;
	border: 1px solid #333 !important;
	border-top:0px;
	border-left:0px;
	border-right:0px;
	border-radius:5px;
	color: #888 !important;
	margin-bottom:30px;
	padding-bottom:30px;
	box-shadow: none !important;
}
form textarea#description {
height: 150px;
}
.form-group{

}
form input.form-control {

	background: transparent !important;
    border-bottom: 1px solid #333 !important;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
    border-radius: 0px;
    color: #888 !important;
    padding: 0px 0px 0px 15px !important;
    line-height: 60px;
    height: 60px;
    box-shadow: none !important;
}
select.select_st02 {
	border:1px solid #333 !important;
	color: #888 !important;
	box-shadow: none !important;
	height:40px;
	width: 240px;
	overflow: hidden;
	padding:0 0 0 10px;
	background-image: url('../../html/content/layout/menu/arrow_down_icon.svg');
	background-color: transparent;
	background-position: center right 10px;
	background-size: 12px 12px;
	background-repeat:no-repeat;
}
select::-ms-expand {	display: none; }
select{
    -webkit-appearance: none;
    appearance: none;
	-moz-appearance: none;
}
.input-group-btn  .btn-primary {
	display: inline-block !important;
    padding: 6px 12px !important;
    margin-bottom: 0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.42857143 !important;
    text-align: center !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
	border-radius:0px !important;
	background: #14c5d8 !important;
	color:#1d1d1d !important;
	text-transform:none !important;
	height:34px !important;
}

.primary-btn-container{
	margin-top:40px;
}
.btn-primary {
    padding:10px 36px !important;
	border:1px solid #14c5d8 !important;
	height:50px !important;
	color: #14c5d8 !important;
	border-radius:25px !important;
	background: transparent !important;
	text-transform:uppercase;
	font-weight:400;
	transition:0.3s;
	cursor:pointer;
	outline:none !important;
}
.btn-secondary {
	border:1px solid #888 !important;
	height:50px !important;
	color: #888 !important;
	border-radius:25px !important;
	background: transparent !important;
	text-transform:uppercase;
	font-weight:400;
	margin-top:0px;
	cursor:pointer;
	padding:11px 40px 0px 40px !important;
}
.btn-primary:hover{
	color: #1d1d1d !important;
	background: #14c5d8 !important;
	border:1px solid #14c5d8 !important;
}
.btn-secondary:hover{
	color: #1d1d1d !important;
	background: #888 !important;
	border:0px !important;
}

.create-gallery-btn {
    margin-top:30px;
    float:right;

}
#imagesUploadAccept{
    margin-top:20px;
    float:right;

}
.thumbnail {
	display: block !important;
    padding: 4px !important;
    margin-bottom: 20px!important;
    line-height: 1.42857143 !important;
    background-color: transparent !important;
    border: 1px solid #333 !important;
    border-radius: 4px !important;
    -webkit-transition: border .2s ease-in-out !important;
    -o-transition: border .2s ease-in-out !important;
    transition: border .2s ease-in-out !important;
}
.thumbnail img{
	border: 1px solid #333 !important;
}

.wrapperDiv {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -20px;
	z-index: -9999;
}
.footerDiv{
	color: #777777 !important;
	height:41px;
	border-top:1px solid #232323;
	background:#111;
	position:fixed;
	bottom:0px;
	width:100%;
	padding: 0 20px 0 20px !important;
	z-index: 99;
	transition: bottom 0.3s;
	display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.footerDiv a{
	text-decoration:none;
	color:#777 !important;
	margin-right:10px;
}

.footerDiv a:visited{
	text-decoration:none;
	color:#777 !important;
}
.footerDiv a:hover{
	text-decoration:none;
	color:#fff !important;
}


#footer a.social img {
	height: 20px;
}

#toc:hover { text-decoration: none !important; color: #ffffff !important; background: none !important; }

#toc { background: none !important; text-decoration: none !important; color: #777 !important; font-family: Roboto,Arial !important; font-size: 12px !important; font-weight: 500 !important; padding: 0 !important; display: inline-block !important; vertical-align: inherit !important; transition: 0.3s !important; }


pushDiv {
	padding: 3%;
	color: white;
	/*text-align: center;*/
	height: 20px;
}

 .myProgress {
  position: relative;
}

#myBar {
  position: absolute;
  width: 10%;
  height: 100%;
  background-color:#1d1d1d ;

}

#label {
  text-align: center;
  line-height: 30px;
  color: white;
}

.loader {
  position: absolute;
  left: 50%;
  top: 45%;
  z-index: 1;
  width: 200px;
  height: 200px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

.text{
  margin-left: 47%;
  font-size: 40px;
  color:white;
}

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

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 }
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom {
  from{ bottom:-100px; opacity:0 }
  to{ bottom:0; opacity:1 }
}

#myDiv {
  display: none;
  text-align: center;
}
/*hover galerie*/
.wrapper-image {
  border-radius: 4px;
  position:relative;
}

.hovereffect img{
	width:100%;
}

.overlay {
  width: 100%;
  height: 100%;
  position: relative;
  top: 0;
  left: 0;
  border-radius: 4px;
  opacity: 1;
  filter: alpha(opacity=0);
  background: #323232;
}

.hovereffect img {
	display: block;
	position: absolute;
	left: 0px;
	right: 0px;
	margin: auto;
	bottom: 0px;
	top: 0px;
	height: 100%;
}

.hovereffect span {
  color: #fff;
  text-align: center;
  position: relative;
  font-family: "Quicksand-Regular";
  font-size: 18pt;
  padding: 10px;
}

.hovereffect:hover img {
  transform: scale(1.0);
}

.hovereffect:hover .overlay {
  opacity: 1;
  filter: alpha(opacity=100);
}

.hovereffect:hover{
	box-shadow: 0 0 5px #fff;
}

.hovereffect:hover span {
  opacity: 1;
  filter: alpha(opacity=100);
  transform: translatey(0);
}

.hovereffect:hover a.info {
  transition-delay: .2s;
}

.progressBar {
	display : none;
	z-index: 100;
	opacity : 0;
    position: fixed;
    top: 0px;
    left:0px;
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0, 0.8);
    transition: opacity 0.5s linear;
}
.singleProgressBar {
	display : none;
	z-index: 100;
	opacity : 0;
    position: absolute;
    top: 0px;
    left:0px;
    margin: auto;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0, 0.95);
    transition: opacity 0.5s linear;
}

#localProgressId {
    position: absolute;
    background-color: rgba(0,0,0, 0.95);
}

#localProgressId .newLoader {
    top: 40%;
}

.miniProgress {
}
.miniLoader,
.miniLoader:after {
  border-radius: 50%;
  width: 18px !important;
  height: 18px !important;
  border-top: 4px solid #111 !important;
  border-right: 4px solid #111 !important;
  border-bottom: 4px solid #111 !important;
  border-left: 4px solid #14c5d8 !important;
}
.newLoader {
  margin:auto;
  top:45%;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 0.6em solid #111;
  border-right: 0.6em solid #111;
  border-bottom: 0.6em solid #111;
  border-left: 0.6em solid #14c5d8;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
.newLoader,
.newLoader:after {
  border-radius: 50%;
  width: 6em;
  height: 6em;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 0px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 18px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

.TextLabel{
	text-align: center;
	color: white;
	padding-top: 3%;
	font-size: 19pt;
	font-family: "Quicksand-Regular";
}

#socialHeader{
	position:absolute;
	margin-left:92%!important;
	margin-top:1.5%;
}

.twitterIcon{
	position:absolute;
	margin-left:95%!important;
	margin-top:1.5%;
}

#theConstructLogo{
		width:auto;
		height:auto;
}

@media only screen and (max-width: 600px) {
	#theConstructLogo{
		width:208px;
		height:auto;
	}

	#socialHeader{
		width:25px;
		height:auto;
		position:absolute;
		margin-left:92%!important;
		margin-top:1.5%;
	}

	.twitterIcon{
		width:25px;
		height:auto;
		position:absolute;
		margin-left:95%!important;
		margin-top:1.5%;
	}

	.fileUpload {
	    position: relative;
	    overflow: hidden;
	    margin:0px;
	}


}
.navigationBar{
	position: absolute;
	right: 50%;
	margin-top:1.5%;
}

.navigationSpan{
	text-align: center;
	color: white;
	padding-top: 10%;
	font-size: 20pt;
	font-family: "Quicksand-Regular";

}

.navigation{
	padding-left:20px;
}

.headerTopPadding{
	position: absolute;
	right: 50%;
	margin-top:1.5%;
}

@media only screen and (max-width: 600px) {
	.headerTopPadding {
		position: absolute;
		right: 40%;
		margin-top:12%;
	}
}

@font-face {
	font-family: "Quicksand-Light";
	src: url(../../../content/layout/font/Quicksand-Light.ttf)
		format("truetype");
}

@font-face {
	font-family: "Quicksand-Regular";
	src: url(../../../content/layout/font/Quicksand-Regular.ttf)
		format("truetype");
}

.defaultDisplayDiv {
	display: block;
}

.loggedInUser {
	position: absolute;
	max-width: 35%;
}

.loggedInUser span {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
	color:white;
	font-size: small;
}

@media only screen and (max-width: 600px) {
	.loggedInUser span {
		font-size: xx-small;
	}
}

.bottomThumbDiv {
	position: absolute;
	width: 100%;
	height: auto;
	bottom: 5%;
}

.upperThumbDiv {
	position: absolute;
	width: 100%;
	height: auto;
	top: 10%;
}

.viewOverlay img {
	width: auto;
	max-width: 100%;
}

.galToolbarDiv {
	position: absolute;
	width: 100%;
	height: auto;
	max-height: 8%;
	text-align: center;
	padding: 5px;
	padding-bottom: 0px;
}

.galToolbarElem {
	width: 10%;
	display: inline-block;
	margin: 0 5px 0 5px;

}

.galToolbarElem img {
	width : 100%;
	height : auto;
}

.shareDiv{
	display:none;
}
.shareDiv, .viewOverlay {
	margin-top: 5px;
	padding-left: 5%;
	padding-right: 5%;
}

.shareDiv img {
	width: auto;
	max-width: 100%;
}

.shareInputClass {
	position: absolute;
	overflow: hidden;
	height: 1px;
	top: 0px;
	left: 0px;
	opacity: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.shareInfoClass {
	position: relative;
	padding-top: 20px;
	font-size: 14px !important;
	text-align: left;
	vertical-align: top;
	transition: color 0.5s linear;
}

.shareInfoSelectedClass {
	color: #14c5d8;
	transition: color 0.5s linear;
}

.thumbDiv {
	position:relative;
	margin-bottom:8px;

}
#thumbnailsProgress
{
	position: absolute;
    top: calc(50% - 3em);
    left: calc(50% - 3em);
}
.thumbDiv:hover .overlay {
  opacity: 1;
}

.thumbDiv:hover span {
  opacity: 1;
}
.userSpaceGalleryTitleClass {
    padding: 0 60% 0 20px !important;
}

.galleryTitleClass {
    padding: 0 30% 0 20px !important;
}

a.viewGalleryClass{
	width:100%;
	height:100%;
	display:block;
	cursor:pointer;
	z-index:0;
	position:absolute;
	background-color:rgba(0, 0, 0, 0.0);
	top:0;
}
a.viewGalleryClass:hover{
	background-color:rgba(0, 0, 0, 0.4);
}
a.viewGalleryClass:hover + .tour-name-div span a {
	color: #999999 !important;
}
.thumbImg {
	width: 100%;
}

.thumbImg img {
	margin: auto;
}

.noOverflow {
	overflow: auto;
}
/* ikonki w galerii */

.galleryToolbar {
	width:auto;
	height:auto;
	position:absolute;
	right:14px;
	bottom: 14px;
}

.galleryToggle {
	width: auto;
    height: 32px;
    position: absolute;
    right: 14px;
    top: 14px;
}

.shareClose {
	position: absolute;
    top: 15px;
    right: 15px;
	background-image:url('../../html/theViewer/content/close_icon.svg');
	background-size:16px 16px;
	width:16px;
	height:16px;
	display:block;
	cursor:pointer;
	z-index: 10;
}
.shareClose:hover{
	opacity:.8;
}

.galleryMenuElement {
	display: block;
}
.galleryMenuDiv {
	width: auto;
	height: auto;
	position: absolute;
	left: 40px;
	bottom: 55px;
	z-index: 1;
	border-radius: 4px;
	background: #fff;
}
.galleryMenuDiv:before {
    content: '';
    background: #FFF;
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    left: 10px;
    bottom: -4px;
    transform: rotate(45deg);
    z-index: -1;
}
.shareContentDiv {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 2;
	background: #000;
}

.galleryMenuDiv {
	display: none;
}

.showGalleryMenu {
	display: block;
}
.hide {
	display: none;
}

.show {
	display: block;
}
.galleryLinksClass {
	border-bottom: solid rgba(255,255,255,0.2) 1px;
	padding: 5px 16px 5px 6px;
}
.galleryMenuDiv a {
	color: #000 !important;
	z-index: 1;
	cursor: pointer;
	font-size: 12px;
	padding: 10px 20px;
	border-bottom: solid 1px rgb(0,0,0,0.10);
	width: auto;
}
.shareInfoClass, .galleryLinksClass {
    color: #fff !important;
    z-index: 1;
    cursor: pointer;
    font-size: 12px;
    position: relative;
}

.shareInfoClass {
	padding-left: 20px;
	line-height: 15px;
}
.shareGalleryClass, .toggleGalleryClass, .untoggleGalleryClass, .galleryMenuClass, .removeProjectClass, .unlinkProjectClass, .duplicateProjectClass, .settingsProjectClass {
	width:30px;
	height:22px;
	z-index:1;
	cursor:pointer;
	transition: none;
	display: inline-block;
}

.toggleGalleryClass {
	background-color: rgba(0, 0, 0, 1);
}

.untoggleGalleryClass {
	background-color: rgba(0, 0, 0, 0.7);
}

.toggleGalleryClass:hover {
    background-color: rgba(0, 0, 0, 0.7);
}

.untoggleGalleryClass:hover {
	background-color: rgba(0, 0, 0, 1);
}

.toggleGalleryClass, .untoggleGalleryClass {
	width: 30px;
	height: 38px;
	display: block;
	float: left;
	border-radius: 5px;
	margin-left: 16px;
	background-size: 14px 24px;
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 1;
	cursor: pointer;
}

.settingsGalleryClass:hover, .archiveGalleryClass:hover, .editGalleryClass:hover, .copyGalleryClass:hover, .removeGalleryClass:hover , .promoteGalleryClass:hover,
	.demoteGalleryClass:hover, .unlinkGalleryClass:hover, .linksActivated, .optionsActivated, .shareInfoClass:hover, .galleryLinksClass:hover,
	.extractGalleryClass:hover, .duplicateProjectClass:hover {
	background-color:rgba(0, 0, 0, 1);
	opacity: 1;
	text-decoration: none;
	color: #fff!important;
}

.galleryMenuClass {
	background: url('../../html/theViewer/content/main-page/edit-tour.png') 10px #1d1d1d no-repeat;
	background-size: 12px;
	margin-left: 3px;
}

.shareGalleryClass:active, .linksActivated {
}

.shareGalleryClass {
	background: url('../../html/theViewer/content/main-page/share-tour.png') 8px #1d1d1d no-repeat;
	background-size: 12px;
} 

.duplicateProjectClass {
	background: url('../../html/theViewer/content/main-page/duplicate-tour-white.png') 8px #1d1d1d no-repeat;
	background-size: 12px;
}
 .settingsProjectClass {
	 background: url('../../html/theViewer/content/main-page/settings-tour-white.png') 6px #1d1d1d no-repeat;
	 background-size: 18px;
 }
 .removeProjectClass {
	background:url('../../html/theViewer/content/main-page/delete-tour-white.png') 10px #1d1d1d;
	background-size: 11px;
	background-repeat: no-repeat;
}
.unlinkGalleryClass, .unlinkProjectClass {
	background: url('../../html/content/projects/unlink_icon.svg') 6px #1d1d1d no-repeat;
	background-repeat: no-repeat;
	background-size: 20px;
}
.toggleGalleryClass {
	background-image:url('./../../../../html/thePortal_v0.2/content/layout/enabled-on-mobile-on_wh.svg');
}
.untoggleGalleryClass {
	background-image:url('./../../../../html/thePortal_v0.2/content/layout/tour_disable-on-mobile.svg');
}

.navigationMenuButton {
	position: absolute;
	text-align: center;
	width: 100%;
}

.navMenuBG{
	bottom: 0;
	width: 100%; height: 100%;
	opacity: 0.99;
	background-color: rgba(0, 0, 0, 0.5);
}

.navigationMenu {
	opacity: 0;
	visibility: hidden;
	top: 0;
	text-align: center;
	position: absolute;
	width:100%;
	height: 0%;
	transition: all 1s;
    -webkit-transform: translate(0,0);
    transform: translate(0,0);
    font-family: 'Quicksand-Light';
    font-size: 30px;
}

#menuButton{
	height: 27px;
}

#menuButton:hover {
	background-color: rgba(191,239, 256, 0.4);
	box-shadow: 0 0 10px #BFEFFF;
}

.navMenuItem{
	font-weight: bold;
	color: #BFEFFF;
	text-shadow: 0 0 10px #00ffff;
	text-decoration: underline;
}

.navMenuItem:hover{
	text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #00ffff , 0 0 70px #00ffff , 0 0 80px #00ffff , 0 0 100px #00ffff;
}

.navigationMenu.active {
	opacity: 1;
	visibility: visible;
	top: 27px;
}
#VRGallery, #gallery {
	min-height: 100%;
	position:relative;
}
#gallery{
min-height:100%;
}
/* alerty, powiadomienia */
.alert-info{
color:#ff0000 !important;
background: transparent !important;
border: 0px solid #ff0000 !important;
}
.infoDiv {
	width:300px;
	line-height:16px;
	color: #888;
	padding-left:25px;
	background-repeat: no-repeat;
    background-position: 0px center;
	background-size: 16px 16px;
	background-image: url('../../html/theViewer/content/info_icon.svg');
}
/* pop up upload */

/* Outer */
.popup {
    width:100%;
    height:100%;
    display:none;
    position:fixed;
    top:0px;
    left:0px;
    background:rgba(0,0,0,0.75);
}

.popup-visible {
	display : block;
}

/* Inner */
.popup-inner {
    max-width:800px;
    width:90%;
    padding:20px;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    box-shadow:0px 2px 6px rgba(0,0,0,1);
    border-radius:3px;
    background:#1d1d1d;
}
.popup-inner h2 {
	color: #fff;
}

/* Close Button */
.popup-close {
    width:16px;
    height:16px;
    cursor: pointer;
    display:inline-block;
    position:absolute;
    top:20px;
    right:20px;
    background-image:url('../../html/theViewer/content/close_icon.svg');
    background-repeat: no-repeat;
}
.popup-close:hover{
    opacity: .7;
}

 .selectorStyle {
	 width: 118px;
	 height: 25px;
	 padding: 5px 35px 5px 8px;
	 border-radius: 2px;
	 border-width: 1.5px;
	 border-style: solid;
	 border-color: rgba(204, 204, 204, 0.8);
	 border-image: initial;
	 background: url(../../html/theViewer/content/arrow_drop_down_white_24dp.svg) 97% center / 19% no-repeat rgb(29, 29, 29);
	 opacity: 0.5;

	 font-size: 10px;
	 font-weight: 525;
	 color: rgba(255, 255, 255, 1);
	 font-family: Roboto;
 }

 .sortTextStyle {
	 font-size: 12px;
	 font-family: Roboto;
	 font-weight: 500;
	 color: rgba(255, 255, 255, 0.5);
	 margin-right: 10px;
 }

 .sortDiv {
	 display: inline;
	 text-align: center;
	 font-size: 18px;
	 font-weight: 300;
	 float: right;
 }

.tileTitleBar {
	width: 98%;
	margin: 1%;
	font-size: 18px;
	font-weight: 300;
}

.tileTitle {
	color: white;
}

.tileTitleBack {
	height: 25px;
	margin-left: 10px;
	cursor: pointer;
	display: inline-flex;
}

.tileTitleBack > img {
	height: 100%;
	width: auto;
}

.project-name { 
	display: inline-block;
	font-size: 18px;
	color: #fff;
}
.wrapper-project-name {
	padding: 0 10px;
}
.wrapper-project-name:hover {
	background: #313131;
	border-radius: 2px;
	cursor: pointer;
}
.tool-bar-project {
	padding: 10px 0 0 0;
}
.project-menu {
	color: #080808;
	border-radius: 33px;
	position: absolute;
	width: 140px;
}
.project-menu > ul {
	list-style-type: none;
	padding: 0;
}
.project-menu > ul > li {
	border-radius: 0px 0px 4px 4px;
    text-align: center;
    background: #ffffff;
    padding: 6px;
    cursor: pointer;
}
.project-menu > ul > li:hover {
	background-color: rgba(0, 0, 0, 1);
	color: #fff;
}

.project-menu > ul > li:active {
	background-color: #323232;
	color: #fff;
}

.project-overlay {
	z-index: 99;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.projectRenameForm { 
	background: #fff;
	padding: 20px 50px;
}
.projectRenameForm #project-input-name {
	width: 250px;
}

.projectRenameForm > .projectFormButons {
	padding-top: 6px;
	text-align: right;
}
.projectFormButons > input[type="button"] {
	padding: 5px 20px;
}
.arrow { 
	display: inline-block;
    vertical-align: super;
    padding-left: 6px;
    position: relative;
    top: 2px;
}
.tool-bar-project {
	display: none;
}

.createTab {
	display: block;
	position: absolute;
	color: #14c5d8;
	margin-left: 10%;
	margin-top: 20px;
	margin-bottom: 10px;
	width: 100%;
	cursor: pointer;
	text-transform: uppercase;
}

.createTabHighlight {
	border-bottom: solid;
	border-width: 1px;
	background-color: rgba(10, 197, 216, 0.2);
}

.galleryTab, .projectTab {
	position: relative;
	padding: 5px 5px 5px 5px;
	font-weight: 400;
	width: 7%;
	float: left;
}

.newProjectSection {
	text-align: center;
	vertical-align: middle;
	transition: opacity 0.5s ease;
	overflow: hidden;
	position: relative;
	margin-bottom: 20px;
}

.newProjectSection > input {
	margin: 10% 10% 10% 10%;
}

.newProjectSection > input {
	margin: 10% 10% 10% 10%;
}

.galleryLegend {
	color: white;
}

@media only screen and (max-width: 1450px) {
	.galleryMenuDiv a.galleryMenuElement, div.shareInfoClass {
	    line-height: 6px;
	    background-size: auto 15px;
	    font-size: 12px;
	}
	div.shareInfoClass {
	    line-height: 8px;
	}
}

@media (min-width: 1150px) and (max-width: 1824px) {
}
@media only screen and (max-width: 1280px) {
	.galleryMenuDiv a.galleryMenuElement, div.shareInfoClass {
	    line-height: 6px;
	    background-size: auto 13px;
	    font-size: 12px;
	}
	.galleryMenuDiv a.galleryMenuElement {
		line-height: 2px;
	}
}

@media only screen and (max-width: 1160px) {
	.galleryMenuDiv a.galleryMenuElement {
	    line-height: 2px;
	}
	.galleryMenuDiv a.galleryMenuElement {
	    line-height: 2px;
	}

	.galleryMenuDiv a.galleryMenuElement, div.shareInfoClass {
	    line-height: 6px;
	    background-size: auto 12px;
	    font-size: 12px;
	}
}

@media only screen and (max-width: 1000px) {
	.navigationBar{
		position: absolute;
		right: 40%;
		margin-top:15%;
	}
}

@media only screen and (max-width: 1050px) {}

@media only screen and (max-width: 700px) {
	galleryMenuDiv a, .shareInfoClass, .galleryLinksClass {
		font-size: 12px;
		padding: 6px 15px 6px 14px !important;
	}
}

/* ==== NEW CSS THEVIEWER ==== */
/* ---- generic ---- */
a{
    color:#14c5d8 !important;
    text-decoration:none;
}
a:visited{
    color:#14c5d8 !important;
    text-decoration:none;
}
a:hover{
    color:#14c5d8 !important;
    text-decoration:underline;
}
/* ---- containers ----*/
.section{
    padding:70px 0 70px 0;
}
.step-img img{
    margin-top:30px;
}
.empty-space-sm{
    height:70px;
}
.empty-space-xs{
    height:20px;
}
.empty-space-xxs{
    height:10px;
}
.guides-links div{
    margin-bottom:20px;
    text-align:center;
}
.guides-links div img {
    width:100%;
}
.upside-down .left {
    float:right !important; 
    
}
.upside-down .right {
    float:left !important; 
}
.upside-down .step-img img{
    position:relative;
    right:260px;
}
/* ---- copy/text ---- */
h1.lp_h1{
    color:#FFF !important;
	font-size:40px !important;
	font-weight: 100 !important;
	padding:0px !important;
	margin: 0 0 60px 0 !important;
}
h4{
    color:#FFF !important;
	font-size:12px !important;
	font-weight: 800 !important;
	padding:0px !important;
	margin: 0 0 10px 0 !important;
    text-transform: uppercase;
    letter-spacing: 5px;
    
} 
.aditional-info{
    font-size:11px;
    color:#888;
    display: block;
    float: left;
}
p.lp-section-desc{
    font-size:14px;
    line-height:1.9;
    margin-bottom:40px;
}
/* ---- alingment ---- */
.centered-content {
    text-align: center;
}
.right-content {
    text-align: right;
}
.left-content {
    text-align: left;
}
.subsection{
    margin:0 0 60px 0;
}
/* ----- navigate elements -----*/
.primary-blue-btn, .primary-blue-btn:visited {
    font-size:14px;
    padding:8px 30px;
	border:1px solid #14c5d8;
	height:40px;
	color: #14c5d8;
	border-radius:25px;
	background: transparent;
	text-transform:uppercase;
	font-weight:300;
	transition:0.3s;
	cursor:pointer;
    text-decoration: none;
}
.primary-blue-btn:hover {
	color: #333 !important;
	border-radius:25px;
	background: #14c5d8;
    text-decoration: none;
}
.secondary-grey-link {
    font-size:14px;
    padding:10px 30px;
	color: #888 !important;
	text-transform:uppercase;
	font-weight:300;
	transition:0.3s;
	cursor:pointer;
    text-decoration: none;
}
.secondary-grey-link:hover {
    opacity: .8;
    color:#888 !important;
    text-decoration: none;
}
/* ---- colors ---- */
.white {
    background:white;
}
.light-grey {
    background:#f1f1f1;
}
.dark-grey {
    background:#1d1d1d;
}
.white-txt {
    color:white;
}
.white-txt-hover:hover {
    color:white !important;
}
.light-grey-txt {
    color:#f1f1f1;
}
.dark-grey-txt {

    color:#1d1d1d !important;
}
.light-blue-txt{
   color:#14c5d8; 
}
/* ---- lists ---- */
.features-list{
    font-size:14px;
    padding:0;
    list-style-type: none;
}
.features-list li{
    margin-bottom:10px;
        text-indent: -8px;
    padding-left: 8px;
}
.features-list > li:before {
  content: "-";
  text-indent: -5px;
}
/* ---- video --- */
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.inactive {
	opacity: 0.05 !important;
}
.archive {
	position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-content: space-around;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    color:#fff;
    background:transparent;
}
.unarchive-button {
	cursor: pointer;
}

.modal-container {
	margin: auto;
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 70%;
	height: 80%;
	z-index: 9999;
	overflow: hidden;
	box-shadow: 0px 2px 8px 0px #000;
}
.modal-close {
	padding: 10px 12px;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	background: #111111;
	position: absolute;
	right: 0;
}
.modal-close > span {
	color: #828685;
	background-image: url('../../html/theViewer/content/close_icon.svg');
	width: 15px;
	height: 15px;
	cursor: pointer;
}
#iframe-settings {
	width: 100%;
	height: 100%;
	border: 0;
}
#iubenda-popup {
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	height: 100%;
	width: 100%;
	z-index: 99999;
	border: none;
	background: #00000091;
}