@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=latin-ext');

html {

}


html, body, .slider-opis, .slider-h2, .slider-h3  {
    font-family: 'Roboto', sans-serif; letter-spacing: 0.03rem; 
}

body {font-size: calc(14px + 2 * ((100vw - 320px) / 1600)); line-height: calc(24px + 6 * ((100vw - 320px) / 1600));}

h2, h3, h4, h5, p{font-weight:normal !important; }
h4{}
h5 {}

p {
  margin-bottom: 1.5rem;
}

header h1{font-size: calc(22px + 18 * ((100vw - 320px) / 1600)); font-weight:400}

h1, .cena {font-size: calc(24px + 28 * ((100vw - 320px) / 1600));}
h2, .loading{font-size: calc(20px + 16 * ((100vw - 320px) / 1600)); margin-bottom:20px;}

h3 {font-size: calc(16px + 8 * ((100vw - 320px) / 1600));
line-height: calc(24px + 8 * ((100vw - 320px) / 1600));}

.small, small, .bcg-02 {
    font-size: 90%;
    font-weight: 400;
    line-height: calc(20px + 6 * ((100vw - 320px) / 1600));
}

.clear{clear:both;}
.btn {font-size: calc(16px + 2 * ((100vw - 320px) / 1600));}


q:lang(pl) { quotes: "\201E" "\201D" "\201A" "\2019" }
q:before { content: open-quote }
q:after { content: close-quote }


a, a:visited, a:link, .blue-c{ color: #7061c8; text-decoration:underline}
a:hover, a:before {color: #000000;}





.lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a {
    background-color: #7061c8 !important;
}



.nav a {color:#fff; padding:17px 10px; line-height: 47px; transition-property: color;
	transition-duration: 1s;}
.nav a:hover, .nav a:before {color: #f15a31; text-decoration:none; }

.original  .menu  {padding-top:13px;}
.original  .btn-m  {padding-top:20px !important;}

ul { padding-left: 20px;}
li {padding:5px 0 0 10px}

.check li::before {
    content: "✓";
    padding-right: 7px;
    color:   #fff;
    font-weight: bold;
    position: absolute;
    margin-left: -26px;
	font-size:20px;
}

.check {
	margin-left:-2px;
	list-style-type: none;
   
}

.dot{
    list-style:none;
}
.dot li {padding:0}
.dot li:before {
    content: "•";
	font-size: 26px;
    padding-right: 8px;
    color: #f5ca41;
}





.bg-rm {
background: url('../images/2.png') no-repeat top right;
-webkit-background-size: auto;
-moz-background-size: auto;
-o-background-size: auto;
background-size: auto;
}

@media only screen and (max-width: 992px) {
.bg-rm {
background: none;}
}

.bg-z{
background: url('../images/4.png') no-repeat center left;
-webkit-background-size: auto;
-moz-background-size: auto;
-o-background-size: auto;
background-size: auto;
}

@media only screen and (max-width: 992px) {
.bg-z{
background: none;}
}

.modal-backdrop {
    background-color: #f15a31;
}

.modal-backdrop.show {
    opacity: .9;
}

header h3 , header p, header h5{text-transform: uppercase;}

.fa-brain {color:#fff; font-size:50px; padding:20px 0;}

.head {padding-top:100px; padding-bottom:50px}
.d-block-head {width:400px;}
@media only screen and (max-width: 768px) {
.d-block-head {width:250px;}
}

@media only screen and (max-width: 310px) {
.d-block-head {width:200px;}
}

.d-block-m {width:350px; padding-top:80px; padding-bottom:80px}
@media only screen and (max-width: 768px) {
.d-block-m {width:250px; padding-top:40px; padding-bottom:20px}
}
@media only screen and (max-width: 310px) {
.d-block-m {width:150px;}
}

.d-block-h {width:300px; padding-top:90px; padding-bottom:90px}
@media only screen and (max-width: 768px) {
.d-block-h{width:200px; padding-top:20px; padding-bottom:60px}
}
@media only screen and (max-width: 310px) {
.d-block-h {width:150px;}
}

.col-01{background:#27a3dc; color:#fff; padding:30px}
.bcg-04{background:#4776ba; color:#fff; padding:30px}
.ram-04 {border:7px solid #4776ba;  padding:30px}
.ram-02 {border:7px solid #f5ca41;  padding:30px}
.bcg-02{background:#f5ca41; padding:30px}

@media only screen and (max-width: 310px) {
.col-01, .bcg-04, .ram-04, .ram-02, .bcg-02 {padding:10px}
}

@media only screen and (min-width: 1200px) {
.h-xl{padding-bottom:110px}
}

@media only screen and (min-width: 992px) {
.h-xl{padding-bottom:113px}
}


.gray-bg {background: #f7f7f7}
.bcg-06{background:#da2428; color:#fff;}

.cell-rw-block1 {display: table}
.cell1 {display: table-cell; width:45.5%; margin:15px; float:left;}

@media only screen and (max-width: 992px) {
.logo{height:auto;}
}


.down-cursor{
	width: 0;
	height: 0;
	border-left: 15px solid transparent;
	border-right: 15px solid transparent;
	border-top: 18px solid #f7f7f7;
	margin: 0 50px;
	position:relative;
	margin-bottom:20px;
	}



section {padding:40px 0 30px 0; }

@media only screen and (max-width: 992px) {
section {padding:30px 0px; }
}

/* Preloader */

.center
{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);

}

.dtp{display:block !important;}
.mobile{display:none !important;}
@media screen and (max-width: 992px) {
.dtp{display:none !important;}
.mobile{display:block !important;}
}

.down{color:#252c65; font-size:90px; margin-bottom:-20px; padding: 0px;}

.down a {color:#fff;}
.down a:hover, .down a:before {color: #fff;}

.up{color:#252c65; font-size:100px; }
@-webkit-keyframes pulse {
 0% {
 -webkit-transform: scale(1, 1);
}
 50% {
 -webkit-transform: scale(1.1, 1.1);
}
 100% {
 -webkit-transform: scale(1, 1);
};
}

@keyframes pulse {
 0% {
 transform: scale(1, 1);
}
 50% {
 transform: scale(1.1, 1.1);
}
 100% {
transform: scale(1, 1);
};
}
@media only screen and (min-width: 992px) {
.down {
	-webkit-animation: pulse 1s linear infinite;
	animation: pulse 1s linear infinite;
}
}

.down:hover {
	-webkit-animation: none;
	animation:none;
}


#preloader {
	background: #ffffff;
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
  left: 0;
  right: 0;
	z-index: 10000;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: opacity .35s ease;
  padding:0;
  margin:0;
}


.loading {
  position: relative;
  display: inline-block;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.7);
  padding: 40px 0;
}

.loading::after {
  content: attr(data-text);
  position: absolute;
  top: 0;
  left: 0;
  color: #f15a31;
  overflow: hidden;
  width: 0;
  height:100%;
  padding: 40px 0;
  animation: loading-action 12s linear infinite;

}

@keyframes loading-action {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

	  
.btn-sub {
    font-size: 20px;
    letter-spacing: 0.3px;
    height: 55px !important;
    border-radius: 40px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 15px 35px 15px 35px;
    min-width: 240px;
    position: relative;
    transition: all 0.3s ease;
   /* line-height: 38px;*/
    cursor: pointer;
		text-align: center;
    vertical-align: middle;
    user-select: none;
	transition-property: background;
	transition-duration: 1s;
	text-decoration:none !important;
	border:0;
		/*display: inline-block;*/
	}

  @media only screen and (max-width: 767.98px) {
    .btn-sub {
        font-size: 14px;
        letter-spacing: 0.3px;
        height: 45px !important;
        border-radius: 40px;
        text-transform: uppercase;
        padding: 12px 23px 12px 23px;
        min-width: auto;
    		/*display: inline-block;*/
    	}

  }

.btn-01 {
  color: #fff !important;
  background-color: #27a3dc;
 }
  .btn-01:hover {
    color: #27a3dc !important;
    background-color: #fff;
	text-decoration: none;}
	
.btn-03 {
  font-size: 16px !important;
  padding: 10px 25px 10px 25px !important;
  color: #fff !important;
  background-color: #000000;
 }
  .btn-03:hover {
    color: #000000 !important;
    background-color: #fff;
	text-decoration: none;
}

.btn-04 {
  color: #fff !important;
  background-color: #4776ba;
 }
  .btn-04:hover {
    color: #4776ba !important;
    background-color: #fff;
	text-decoration: none;
}

.btn-05 {
  color: #000 !important;
  background-color: #f5ca41;
 }
  .btn-05:hover {
    color: #f5ca41 !important;
    background-color: #fff;
	text-decoration: none;
}
.btn-06 {
  color: #000 !important;
  background-color: #fff;
 }
  .btn-06:hover {
    color: #fff !important;
    background-color: #000;
	text-decoration: none;
}

.btn-07 {
  color: #fff !important;
  background-color: #da2428;
  border:1px solid #da2428;
  height:60px !important;
 }
  .btn-07:hover {
    color: #da2428 !important;
    background-color: #fff;
	text-decoration: none;
	border:1px solid #da2428;
}

.form-horizontal .form-group {
    margin-right: auto;
    margin-left: auto;
}

.form-controls {
    padding: 10px 20px;
    width: 100%;
    margin: 5px;
    border: 1px solid #ececec;
    color: #1f1f1f;
    font-size: 16px;

}

@media only screen and (max-width: 767.98px) {	
.form-controls {
    margin: auto;
}
}


/*super flex */

.flex-container {
    display: -webkit-flex;
    display: flex;
    width: 100%;

}

@media only screen and (max-width: 767.98px) {
.flex-container {
    display: block;
    width:94%;

}
}

.flex-item {
    padding:20px; margin:10px; width:35%;
}

@media only screen and (max-width: 767.98px) {
.flex-item{
  width:100% !important;
}
}

/*super flex end*/

.flex-item-o{
  padding:20px; margin:10px; width:50%;
}


@media only screen and (max-width: 767.98px) {
.flex-item-o{
  width:100% !important;
}
}

/* Content */
.content {
	max-width: 800px;
	width: 100%;
	border: 2px solid firebrick;
	padding: 30px;
	box-shadow: 0 0 40px rgba(0,0,0,0.15);
}



/* Helpers */
#preloader.preloader-hiding {
	opacity: 0;
}

#preloader.preloader-hidden {
	display: none;
}

.modal-header {
    border-bottom: 1px solid transparent;
}

.close {
    font-size: 2.5rem;
    color:#f15a31;
    opacity:1;
}

.modal-body {
    padding-top:0;
    padding-bottom:3rem;
}

.modal-content {
    border-radius: 0rem;
}

.pointer {cursor: pointer;}

.border-i{border:1px solid #f3f3f3; padding:20px }


#footer {
    font-size: 85%;
    font-weight: 400;
    line-height: 150%;
    border-top:5px solid #f3f3f3;
}

 #footer img {width:60%}



.box-wideo-height{height:410px;}


@media only screen and (max-width: 1199.98px) {
.box-wideo-height{height:350px;}

}

@media only screen and (max-width: 991.98px) {
.box-wideo-height{height:300px;}
}

@media only screen and (max-width: 640px) {
.box-wideo-height{height:390px;}

}

@media only screen and (max-width: 480px) {
.box-wideo-height{height:290px;}

}

@media only screen and (max-width: 400px) {
.box-wideo-height{height:200px;}
}


@media only screen and (max-width: 360px) {
.box-wideo-height{height:260px;}

}
@media only screen and (max-width: 320px) {
.box-wideo-height{height:200px;}

}