/* FONT */
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/css?family=Oswald:300,400,500,600,700');

/* GENERAL */
*,
*:after,
*:before {
	box-sizing: border-box;
	margin:0px;
	padding:0px;
}

body{
	background: #eee !important;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    r:#252525;
    font-weight: 300;
    overflow-x: hidden;
}

/* Style the video: 100% width and height to cover the entire window */
#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
}


video#bgvid { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background: url(polina.jpg) no-repeat;
    background-size: cover; 
}



video-background{
	position: fixed;
	top:0;
	left:0;
	bottom:0;
	right:0;
	overflow: hidden;
}
video-background:before{
	content: "";
	position: absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	background:rgba(0,0,0,0.6);
	opacity: 1;
	z-index: 10;
}
video-background iframe{
	min-width: 100%;
	min-height: 100%;
	position: fixed;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%) scale(1.5);
}
#content{
	min-height: 100vh;
	position: relative;
	z-index: 10;
	width: 1200px;
	max-width: 100%;
	margin:0 auto;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	r:#fff;
	font-family: 'Oswald', sans-serif;
	padding:50px 0 0;
}
.logo{
	margin:0px;
	display: inline-block;
}
.logo img{
	height: 100px;
}
.logo-text{
	margin:0;
	font-weight: normal;
	font-size: 30px;
}
.sub-logo-text{
	font-weight: 200;
	margin:0;
	font-size:22px;
}
.cpanel{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	flex:1;
	justify-content: center;
	margin:20px 0 0;
}
.cpanel a{
	display: block;
	width: 150px;
	margin:5px;
	text-decoration: none;
	r:#333;
	outline: none!important;
}
.cpanel a .icon{
	width: 150px;
	height: 150px;
	background: #BD1021;
	border-radius: 30px;
	font-size:30px;
	margin:0 0 15px;
	r:#fff;
	border-bottom: 5px solid rgba(0,0,0,0.3);
	box-shadow: 0px 1px 3px rgba(0,0,0,0.1);
	transition: .3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}
.cpanel a:hover .icon{
	transform: translateY(-10px);
	box-shadow: 0px 10px 30px rgba(0,0,0,0.5);
	filter:saturate(50%);
}
.cpanel a .icon img{
	width: auto;
	height: 100px;
	display: inline-block;
	max-width: 120px;
    object-fit: contain;
}
.cpanel a:nth-child(2n) .icon{
	background: #F37B3C;
}
.cpanel a:nth-child(3n) .icon{
	background: #006AB2;
}
.cpanel a:nth-child(4n) .icon{
	background: #64523A;
}
.cpanel a:nth-child(5n) .icon{
	background: #604588;
}
.cpanel a:nth-child(6n) .icon{
	background: #28FE7C;
}
.cpanel a .title{
	r:rgba(255,255,255,1);
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: bold;
}
.enter-web{
	margin: 30px 0;
}
.enter-web .enter-btn{
	background:#fff;
	r:none;
	padding:10px 30px;
	border-radius: 50px;
	border:2px solid rgba(255,255,255,0.9);
	text-decoration: none;
	font-family: 'Roboto', sans-serif;
	font-size:14px;
	font-weight: bold;
}
.enter-web .enter-btn:hover{
	filter:saturate(50%);
}
.swirl{
	margin:10px 0 0;
	width: 500px;
	height: auto;
}
footer{
	font-family: 'Roboto', sans-serif;	
	margin:30px 0;
	r:rgba(255,255,255,0.5);
	font-size:11px;
}
.navbar{
	padding:15px 0;
	background: #00CC7C !important;
	border-radius: 0;
	border:none;
	margin:0 !important;
}
.navbar-default{
	border-r: #00CC7C !important;
}
.navbar-header a.navbar-brand{
	margin:0;
	padding:0;
	font-family: 'Oswald', sans-serif;	
	font-weight: 200;
	font-size:30px;
	r:#fff;
}
.navbar-brand img{
	width: auto;
	height: 50px;
	display: inline-block !important;
	vertical-align: middle;
}
.navbar .navbar-btn{
	background: #fff;
	border:none;
	border-radius: 2px;
	r:#333;
	padding-left:30px;
	padding-right:30px;
}
.container{
	width:1200px!important;
	max-width: 100%;
}
.modal-backdrop{
	z-index: 0!important;
}
.modal-content{
	border-radius: 4px;
	border:none;
	overflow: hidden;
}
.modal-header{
	border:none;
	box-shadow: 0px 10px 50px -20px rgba(0,0,0,0.1);
}
.modal-title{
	text-transform: uppercase;
	font-weight: 300;
}
.modal-footer{
	border:none;
	background: #f5f5f5;
}
.modal-body{
	padding:30px;
}
.category-link{
	display: flex;
	flex-direction: row;
	flex:1;
	flex-wrap: wrap;
}
.category-link a{
	display: block;
	width: 32%;
	margin:0.5%;
	background:#eee;
	border-radius: 5px;
	text-align: center;
	padding:15px;
	r:#555;
	text-decoration: none;
	text-transform: uppercase;
	font-size:12px;
	font-weight: bold;
	transition:.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}
.category-link a:hover{
	background: #00CC7C;
	r:#fff;
}
.page{
	position: relative;
	padding:50px 0;
}
.page:before{
	content: "";
	position: absolute;
	top:0;
	left:0;
	right:0;
	height: 200px;
	background: #00CC7C;
}
.wrapper{
	background: #8B0000;
	position: relative;
	box-shadow: 0 4px 5px 0 rgba(0,0,0,.14);
	border-radius: 5px;
	padding:80px;
	color:#424242;
	font-size:14px;
	line-height: 180%;
}
.wrapper h2{
	font-weight: 400;
	margin:0 0 30px;
}
#footer-page{
		text-align: center;
		padding:15px 0;
	r:#aaa;
}
.notification-modal{
	display: flex!important;
	align-items: center!important;
	justify-content: center!important;
	position: fixed!important;
	top:0!important;
	left:0!important;
	bottom:0!important;
	right:0!important;
	visibility: hidden;
	opacity: 0;
	transition: .5s ease!important;
}
.notification-modal.in{
	visibility: visible;
	opacity: 1;
}
.notification-modal .modal-dialog{
	width: 400px;
	margin:0 auto;
	transform: scale(0.5);
	transition: .3s ease;
	opacity: 0;
}
.notification-modal.in .modal-dialog{
	transform: scale(1);
	opacity: 1;
}
.notification-modal .modal-content{
	box-shadow: 0px 10px 50px -20px rgba(0,0,0,0.3);
	border-radius: 20px;
}
.notification-modal .modal-content .modal-header{
	box-shadow: none;
	text-align: center;
	margin:0;
}
.notification-modal .modal-content .modal-header .modal-title{
	font-weight: bold;
	r:#333;
}
.notification-modal .modal-content .modal-body{
	padding:0 30px 30px;
}
.notification-modal .modal-content .icon{
	font-size:100px;
}
.notification-modal .modal-content .icon .fa-check-circle{
	r:#2ecc71;
}
.notification-modal .modal-content .icon .fa-paper-plane{
	transform: translate(-100px, 100px);
	transition: .3s ease;
	transition-delay: .2s;
	opacity: 0;
}
.notification-modal.in .modal-content .icon .fa-paper-plane{
	transform: translate(0,0);
	opacity: 1;
}
.modal-info{
	display: flex!important;
	align-items: center!important;
	justify-content: center!important;
	position: fixed!important;
	top:0!important;
	left:0!important;
	bottom:0!important;
	right:0!important;
	visibility: hidden;
	opacity: 0;
	transition: .5s ease!important;
}
.modal-info.in{
	visibility: visible;
	opacity: 1;
}
.modal-info .modal-dialog{
	margin:0 auto;
	transform: scale(0.5);
	transition: .3s ease;
	opacity: 0;
}
.modal-info.in .modal-dialog{
	transform: scale(1);
	opacity: 1;
}
.media .media-body label{
	font-weight:normal !important;
}
@media (max-width: 767px){
	body{
		background: #FFF!important;
		width: 100vw!important;
		overflow-x: hidden!important;
	}
	#content{
		padding:15px;
		display: block;
		width: auto;
		overflow:hidden;
	}
	.cpanel a{
		margin:5px 5px 10px;
	}
	video-background:before{
		background: rgba(0,0,0,0.8);
	}
	.{
		font-size:20px;
	}
	.sub-{
		font-size:16px;
	}
	.wrapper{
		padding:50px;
		border-radius: 0;
		box-shadow: none;
	}
	.page{
		padding:30px 0;
	}
	.page .container{
		padding:0;
	}
	.navbar-header{
		text-align: center;
	}
	.navbar-header .navbar-brand{
		float: none;
	}
	.navigation{
		text-align: center;
		border:none;
	}
	.navigation .btn{
		border-radius: 50px;
	}
	footer{
		margin:0;
		padding:30px;
	}
	video-background{
		display: none;
	}
	.swirl{
		max-width: 100%!important;
	}
}