/*-----------------------------------------------------------------------------------
	    blackball
        Built with Blocs
-----------------------------------------------------------------------------------*/

body{
	margin:0;
	padding:0;
    background:#FFF;
	height: 100%;
    overflow-x:hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
a,button{transition: all .3s ease-in-out;outline: none!important;} /* Prevent ugly blue glow on chrome and safari */
a:hover{text-decoration: none; cursor:pointer;}

#page-loading-blocs-notifaction{position: fixed;top: 0;bottom: 0;width: 100%;z-index:100000;background:#FFFFFF url("img/pageload-spinner.gif") no-repeat center center;}

/* = Blocs
-------------------------------------------------------------- */

.bloc{
	width:100%;
	clear:both;
	background: 50% 50% no-repeat;
	padding:0 50px;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position:relative;
	z-index: 1;
}
.bloc .container{
	padding-left:0;
	padding-right:0;
}

/* = Full Screen Blocs 
-------------------------------------------------------------- */

.bloc-fill-screen{
	padding-top:0;
	position: relative;
	height: inherit;
}
.bloc-fill-screen > .container{
	position:relative;
	top:50%;
	transform:translateY(-50%);
	-webkit-transform:translateY(-50%);
}
.bloc-fill-screen .fill-bloc-top-edge, .bloc-fill-screen .fill-bloc-bottom-edge{
	position: absolute;
	margin: 20px auto;
	left: 0;
	right: 0;
	z-index: 1;
	transform: none;
}
.bloc-fill-screen .fill-bloc-top-edge{
	top:0;
}
.bloc-fill-screen .fill-bloc-bottom-edge{
	top: initial;
	bottom: 20px;
}
.blocs-hero-btn-dwn{
	width: 58px;
	height: 58px;
	display: block;
	margin:0 auto;
	line-height: 58px;
	padding: 0;
	border-radius: 50%;
	text-align: center;
	font-size: 18px;
	color: rgba(255,255,255,.8);
	background: rgba(0,0,0,.6);
	border:0;
}
.blocs-hero-btn-dwn:hover{
	color: rgba(255,255,255,1);
}


/* Dark theme */

.d-bloc{
	color:rgba(255,255,255,.7);
}
.d-bloc button:hover{
	color:rgba(255,255,255,.9);
}
.d-bloc .icon-round,.d-bloc .icon-square,.d-bloc .icon-rounded,.d-bloc .icon-semi-rounded-a,.d-bloc .icon-semi-rounded-b{
	border-color:rgba(255,255,255,.9);
}
.d-bloc .divider-h span{
	border-color:rgba(255,255,255,.2);
}
.d-bloc .a-btn,.d-bloc .navbar a,.d-bloc .navbar-brand, .d-bloc a .icon-sm, .d-bloc a .icon-md, .d-bloc a .icon-lg, .d-bloc a .icon-xl, .d-bloc h1 a, .d-bloc h2 a, .d-bloc h3 a, .d-bloc h4 a, .d-bloc h5 a, .d-bloc h6 a, .d-bloc p a{
	color:rgba(255,255,255,.6);
}
.d-bloc .a-btn:hover,.d-bloc .navbar a:hover,.d-bloc .navbar-brand:hover,.d-bloc a:hover .icon-sm, .d-bloc a:hover .icon-md, .d-bloc a:hover .icon-lg, .d-bloc a:hover .icon-xl, .d-bloc h1 a:hover, .d-bloc h2 a:hover, .d-bloc h3 a:hover, .d-bloc h4 a:hover, .d-bloc h5 a:hover, .d-bloc h6 a:hover, .d-bloc p a:hover{
	color:rgba(255,255,255,1);
}
.d-bloc .navbar-toggle .icon-bar{
	background:rgba(255,255,255,1);
}
.d-bloc .btn-wire,.d-bloc .btn-wire:hover{
	color:rgba(255,255,255,1);
	border-color:rgba(255,255,255,1);
}
.d-bloc .panel{
	color:rgba(0,0,0,.5);
}
.d-bloc .panel button:hover{
	color:rgba(0,0,0,.7);
}
.d-bloc .panel icon{
	border-color:rgba(0,0,0,.7);
}
.d-bloc .panel .divider-h span{
	border-color:rgba(0,0,0,.1);
}
.d-bloc .panel .a-btn{
	color:rgba(0,0,0,.6);
}
.d-bloc .panel .a-btn:hover{
	color:rgba(0,0,0,1);
}
.d-bloc .panel .btn-wire, .d-bloc .panel .btn-wire:hover{
	color:rgba(0,0,0,.7);
	border-color:rgba(0,0,0,.3);
}

/* Row Margin Offsets */

.voffset{
	margin-top:30px;
}

/* Bloc text custom styling */

#bloc-1 p{
	font-size: 18px;
}
#bloc-2 p{
	font-size: 18px;
}
#bloc-4 p{
	font-size: 18px;
}
#bloc-7 p{
	font-size: 18px;
}

/* = NavBar
-------------------------------------------------------------- */

.navbar{
	margin-bottom: 0;
	z-index:1;
}
.navbar-brand{
	height:auto;
	padding:3px 15px;
	font-size:25px;
	font-weight:normal;
	font-weight:600;
	line-height:44px;
}
.navbar-brand img{
	max-height: 200px;
	margin: 0 5px 0 0;
	display:inline;
}
.nav-center .navbar-brand img{
	margin:0;
}
.navbar .nav{
	padding-top: 2px;
	margin-right: -16px;
	float:right;
	z-index:1;
}
.nav > li{
	float:left;
	margin-top:4px;
	font-size:16px;
}
.navbar-nav .open .dropdown-menu > li > a{
	text-align: inherit;
}
.nav > li a:hover, .nav > li a:focus{
	background:transparent;
}
.navbar-toggle{
	margin: 10px 10px 0 0;
	border: 0px;
}
.navbar-toggle:hover{
	background:transparent!important;
}
.navbar-toggle .icon-bar{
	background-color: rgba(0,0,0,.5);
	width: 26px;
}
 /* Inverted navbar */

.nav-invert .navbar .nav{
	float:left;
}
.nav-invert .navbar-header, .nav-invert .navbar-brand{
	float:right;
	position:relative;
	z-index:2;
}
@media (min-width: 768px){
	.site-navigation{
		position:absolute;
		top:50%;
		right:20px;
		transform:translate(0, -50%);
		-webkit-transform:translateY(-50%);
	}
	.nav > li .dropdown-menu a,.nav > li .dropdown-menu a:hover{
		color:#484848;
	}
	.nav-invert .site-navigation{
		left:0;
		right:0;
	}
	.nav-center{
		text-align:center;
	}
	.nav-center .navbar-header{
		width:100%;
	}
	.nav-center .navbar-header, .nav-center .navbar-brand, .nav-center .nav > li{
		float: none;
		display:inline-block;
	}
	.nav-center .site-navigation{
		position:relative;
		width:100%;
		margin-top:20px;
	}
.nav-center.mini-nav .navbar-toggle{
	float:none;
	margin: 10px auto 0;
	}
}
.nav > li > .dropdown a{
	background: none!important;
	display: block;
	padding: 14px 15px;
}

nav .caret{
	margin: 0 5px;
}
/* Dropdown Menus SubMenu */
	.dropdown-menu .dropdown-menu{
	top:-8px;
	left:100%;
}
.dropdown-menu .dropmenu-flow-right{
	top:100%;
	left:0;
	margin-left: -1px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.dropdown-menu .dropdown span{
	border: 4px solid black;
	border-top-color:transparent;
	border-right-color:transparent;
	border-bottom-color:transparent;
	margin: 6px -5px 0 0!important;
	float: right;
}
.hero .hero-nav{
	padding-left:inherit;
	padding-right:inherit;
}
/* = Sticky Nav
-------------------------------------------------------------- */

.sticky-nav.sticky{
	position:fixed;
	top:0;
	z-index:1000;
	box-shadow:0 1px 2px rgba(0,0,0,.3);
	 transition: all .2s ease-out;
}

/* = Bric adjustment margins
-------------------------------------------------------------- */

.mg-clear{
	margin:0;
}
.mg-md{
	margin-top:10px;
	margin-bottom:20px;
}

/* = Buttons
-------------------------------------------------------------- */

.btn{
	margin: 0 5px 5px 0;
}
.btn.pull-right{
	margin: 0 0 5px 5px;
}
.btn-d,.btn-d:hover,.btn-d:focus{
	color:#FFF;
	background:rgba(0,0,0,.3);
}

/* Prevent ugly blue glow on chrome and safari */
button{
	outline: none!important;
}






.panel-sq, .panel-sq .panel-heading, .panel-sq .panel-footer{
	border-radius:0;
}
.panel-rd{
	border-radius:30px;
}
.panel-rd .panel-heading{
	border-radius:29px 29px 0 0;
}
.panel-rd .panel-footer{
	border-radius:0 0 29px 29px;
}





/* ScrollToTop button */

.scrollToTop{
	width:40px;
	height:40px;
	position:fixed;
	bottom:20px;
	right:20px;
	opacity: 0;
	z-index: 500;
	transition: all .3s ease-in-out;
}
.scrollToTop span{
	margin-top: 6px;
}
.showScrollTop{
	font-size: 14px;
	opacity: 1;
}

/* = Custom Styling
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6,p,label,.btn,a{
	font-family:"Helvetica";
}
.container{
	max-width:1170px;
}
.but-01{
	background-image:url("img/ico-aboutus.png");
	height:140px;
	width:140px;
}
.but-01:hover{
	background-image:url("img/ico-hover-aboutus.png");
	width:140px;
	height:140px;
}
.but-02:hover{
	background-image:url("img/ico-hover-services.png");
}
.but-03:hover{
	background-image:url("img/ico-hover-download.png");
}
.but-04:hover{
	background-image:url("img/ico-hover-contacts.png");
}
.div-aboutus{
	background-color:rgba(0,0,0,0.6);
}
.title-01{
	color:#FEFFFE!important;
	padding-top:15px;
	padding-bottom:15px;
}
.paragraph-01{
	font-weight:normal;
	color:#FEFFFE!important;
	padding-bottom:15px;
}
.div-empty{
	height:140px;
}
.title-02{
	color:#FEFFFE!important;
}

/* = Colour
-------------------------------------------------------------- */

/* Background colour styles */

.bgc-black{
	background-color:#000000;
}
.bgc-white{
	background-color:#ffffff;
}

/* Bloc image backgrounds */

.bg-03{
	background-image:url("img/03.jpg");
}
.bg-05{
	background-image:url("img/05.jpg");
}
.bg-08{
	background-image:url("img/08.jpg");
}
.bg-02{
	background-image:url("img/02.jpg");
}
.bg-04{
	background-image:url("img/04.jpg");
}

.bg-06{
	background-image:url("img/06.jpg");
}
.bg-01{
	background-image:url("img/01.jpg");
}
.bg-07{
	background-image:url("img/07.jpg");
}

/*******NEW STYLES*******/
html {
	height: 100%;
}

.sticky-nav {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 2;
}

.page-container {
	height: 100%;
	padding-top: 50px;
}

.container-nav {
	padding: 0 17px;
}

.main-block {
	height: 100%;
	display: flex;
	align-items: flex-start;
	padding: 0 65px;
	padding-top: 10vh;
	overflow: hidden;
}

.content-wrapper {
	width: 100%;
}

.bg-1 {
	background: url("./img/start-bg.jpg") center no-repeat;
	background-size: cover;
}

.bg-2 {
	background: url("./img/01.jpg") center no-repeat;
	background-size: cover;
}

.bg-3 {
	background: url("./img/02.jpg") center no-repeat;
	background-size: cover;
}

.bg-4 {
	background: url("./img/03.jpg") center no-repeat;
	background-size: cover;
}

.bg-5 {
	background: url("./img/04.jpg") center no-repeat;
	background-size: cover;
}

.bg-6 {
	background: url("./img/05.jpg") center no-repeat;
	background-size: cover;
}

.bg-7 {
	background: url("./img/06.jpg") center no-repeat;
	background-size: cover;
}

.bg-8 {
	background: url("./img/07.jpg") center no-repeat;
	background-size: cover;
}

.bg-9 {
	background: url("./img/08.jpg") center no-repeat;
	background-size: cover;
}

.bg-block {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	opacity: 0;
	transition: all 1s;
}

.bg-block.active {
	opacity: 1;
	transition: all 1s;
}

.content {
	position: relative;
	z-index: 1;
}

.logo-wrapper {
	position: absolute;
	bottom: 50px;
	right: 50px;
}

.items-list {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
}

.items-item {
	position: relative;
	width: 100%;
	margin-bottom: 5px;
	display: flex;
	align-items: flex-start;
}

.items-item .description-wrapper {
	opacity: 0;
}

.items-item.active .description-wrapper {
	opacity: 1;
	transition: all .3s;
}

.items-link {
	width: 100px;
	height: 100px;
	border: 2px solid #fff;
	margin-right: 27px;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	flex-shrink: 0;
	transition: all .2s;
}

.items-link:hover {
	background-color: #000;
	transition: all .2s;
}

.items-item.active .items-link {
	background-color: #000;
	transition: all .2s;
}

.items-item.active .tab-pane {
	z-index: 4;
}

.items-link img {
	height: 88%;
}

.items-link.circular img {
	margin-top: 6%;
}

.items-link.download {
	align-items: center;
}

.items-link.download img {
	height: auto;
	width: 82%;
}

.items-link.letter img {
	height: auto;
	width: 80%;
	margin-top: 8%;
}

.description-wrapper {
	flex-grow: 1;
	position: relative;
}

.description {
	background-color: rgba(0, 0, 0, 0.5);
	padding: 44px 38px 65px;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}

.description__head {
	font-size: 45px;
	margin: 0;
	margin-bottom: 32px;
	color: #fff;
}

.description__text {
	font-size: 18px;
	color: #fff;
}

.description-information {
	display: flex;
	color: #fff;
}

.description-item-title {
	font-size: 21px;
	margin: 0;
	min-height: 46px;
	margin-bottom: 10px;
}

.description-information__item {
	margin-right: 20px;
}

.description-information__item:last-child {
	margin-right: 0;
}

.contacts-description .description-item-title {
	min-height: auto;
}
.contacts-description .description-information {
	justify-content: space-between;
}


/* = Mobile adjustments 
-------------------------------------------------------------- */

@media (max-width: 992px) and (min-width: 768px)
{
    .navbar .nav{
		max-width:80%
    }
	.nav-center.navbar .nav{
		max-width:100%
    }
}
@media (min-width: 1600px) {

	.description__head {
		font-size: 53px;
	}

	.description__text {
		font-size: 21px;
	}

	.description-item-title {
		min-height: 70px;
	}

	.description-item-title {
		font-size: 31px;
	}

	.description-item-text {
		font-size: 21px;
	}
}

@media (max-width: 1400px) {
	.main-block {
		padding-top: 2vh;
	}

	.items-link {
		width: 80px;
		height: 80px;
	}

	.logo-wrapper {
		bottom: 20px;
		right: 50px;
	}

	.description {
		padding: 27px 27px 23px;
	}

	.description__head {
		font-size: 34px;
		margin-bottom: 23px;
	}

	.description__text {
		font-size: 15px;
	}

	.logo {
		width: 240px;
	}
}

@media (min-width: 991px) and (max-width: 1400px) {
	.contacts-description .description__head {
		margin-bottom: 15px;
	}

	.contacts-description hr {
		margin-top: 11px;
		margin-bottom: 15px;
	}

	.contacts-description .description {
		padding: 27px 27px 0px;
	}

	.description-item-text {
		line-height: 1.2;
	}
}

@media (max-width: 992px) {
	.bloc {
		padding: 0 10px;
	}

	.main-block {
		padding: 0 15px;
	}
}

@media (max-width: 767px) {
	.navbar .nav{
		padding-top: 0;
		border-top:1px solid rgba(0,0,0,.2);
		float:none!important;
	}
	.navbar.row{
		margin-left: 0;
		margin-right: 0;
	}
	.site-navigation{
		position:inherit;
		transform:none;
		-webkit-transform:none;
		-ms-transform:none;
	}
	.nav > li{
		margin-top: 0;
		border-bottom:1px solid rgba(0,0,0,.1);
		background:rgba(0,0,0,.05);
		text-align: left;
		padding-left:15px;
		width:100%;
	}
	.nav > li:hover{
		background:rgba(0,0,0,.08);
	}
	.dropdown .dropdown a .caret{
		float: none;
		margin: 5px 0 0 10px!important;
		border: 4px solid black;
		border-bottom-color: transparent;
		border-right-color: transparent;
		border-left-color: transparent;
	}

	#hero-bloc .navbar .nav{
		background:rgba(0,0,0,.8);
	}
	#hero-bloc .navbar .nav a{
		color:rgba(255,255,255,.6);
	}

	.hero{
		padding:50px 0;
	}
	.hero-nav{
		left:-1px;
		right:-1px;
	}
	.navbar-collapse{
		padding:0;
		overflow-x: hidden;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	.navbar-brand img{
		max-height: 40px;
		width:auto;
	}
	.nav-invert .navbar-header{
		float: none;
		width:100%;
	}
	.nav-invert .navbar-toggle{
		float:left;
	}
	.bloc{
		padding-left: 0;
		padding-right: 0;
	}
	.bloc-xxl,.bloc-xl,.bloc-lg{
		padding: 40px 0;
	}
	.bloc-sm,.bloc-md{
		padding-left: 0;
		padding-right: 0;
	}
	.bloc-tile-2 .container, .bloc-tile-3 .container, .bloc-tile-4 .container{
		padding-left:0;padding-right:0;
	}
	.a-block{
		padding:0 10px;
	}
	.btn-dwn{
		display:none;
	}
	.voffset{
		margin-top:5px;
	}
	.voffset-md{
		margin-top:20px;
	}
	.voffset-lg{
		margin-top:30px;
	}
	form{
		padding:5px;
	}
	.close-lightbox{
		display:inline-block;
	}
	.video-bg-container{
		display:none;
	}
	.blocsapp-device-iphone5{
		background-size: 216px 425px;
		padding-top:60px;
		width:216px;
		height:425px;
	}
	.blocsapp-device-iphone5 img{
		width: 180px;
		height: 320px;
	}

	.items-list {
		flex-direction: row;
		justify-content: space-between;
		margin-top: 9px;
	}

	.items-item {
		width: auto;
	}

	.items-link {
		width: 50px;
		height: 50px;
		margin: 0;
	}

	.description {
		position: fixed;
		left: 0;
		top: 132px;
		padding: 10px;
	}

	.description__head {
		font-size: 27px;
		margin: 0;
	}

	hr {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.contacts-description .description-information {
		flex-direction: column;
	}

	.contacts-description .description-information br {
		display: none;
	}

	.description-item-title {
		font-size: 18px;
		margin-bottom: 0;
	}

	.description-information {
		flex-direction: column;
	}

	.services-information .description-item-title{
		min-height: auto;
		margin-bottom: 10px;
		margin-top: 10px;
	}

	.description {
		max-height: 68vh;
		overflow-y: scroll;
	}

	#menu1 {
		z-index: 2;
	}

	.logo-wrapper {
		bottom: 10px;
		right: 10px;
	}

	.logo {
		width: 133px;
	}
}