/* =========================================================================
	 HTML5 CSS Reset Minified - Eric Meyer
========================================================================== */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
li{list-style:none}


/* =========================================================================
	 My CSS
========================================================================== */
@font-face {
	font-family: 'PT Sans';
	font-style: normal;
	font-weight: 400;
	src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v11/jizaRExUiTo99u79D0aExdGM.woff2) format('woff2');
}
body {
	font-family: 'PT Sans', sans-serif;
}
canvas {
  display: block;
  vertical-align: bottom;
}
#particles-js {
	z-index: 0;
	width: 100%;
	height: 100%;
/*    background-color: #0b1d39;
    background-size: cover;
    background-repeat: no-repeat;*/
    position: absolute;
    background: fixed;
    background-position: top;
}
@keyframes upup {
from {
    transform: translateY(30px);
    scale(1,1);
  }
50% {
	transform: translateY(0px);
    scale(1.2,1.2);
}
to {
    transform: translateY(30px);
    scale(1.5,1.5);
  }
}
.topbutton {
	position: fixed;
	z-index: 100;
	top: 75%;
	right: 50px;
	font-size: 50px;
	color: #0b1d39;
	background-color: #fff;
	border-radius: 50% 50%;
	animation: upup 1s infinite ease-in-out;
}
.fb {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
.header {
	flex-direction: column;
	align-items: center;
	z-index: 1;
	width: 100%;
	background-color: #0b1d39;
}
.top, .offer, .tel, .icons {
	z-index: 1;
}
.top {
	justify-content: center;
	flex-wrap: wrap;
	align-self: center;
  	align-items: center;
	margin-top: 20px;
	color: #f4f4f4;
}
.logo {
	justify-content: center;
	align-items: center;
	align-self: center;
	margin-top: 2px;
	text-transform: uppercase;
}
.logo img {
	margin-right: 30px;
	width: 150px;
	height: auto;
}
.name_t {
	font-size: 72px;
	font-weight: 900;
}
.name_b {
	font-size: 14px;
}
.name {
	flex-direction: column;
}
.phone, .email, .addres {
	flex-direction: column;
	justify-content: center;
	align-self: center;
	align-items: center;
	margin-top: 16px;
	text-transform: none;
}
.logo, .phone, .email, .addres {
	margin-right: 20px;
	margin-left: 20px;
}
.one_b {
	color: #fe0;
	font-size: 18px;
	font-weight: 900;
}
.one_b i {
	margin-right: 5px;
}
.two_b {
	font-size: 17px;
	margin-top: 5px;
	border-bottom: 1px dotted #f4f4f4;
}
.two_b a {
	color: #f4f4f4;
}
.offer {
	font-size: 50px;
	font-weight: 900;
	text-align: center;
	color: #fff;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.tel {
	font-size: 65px;
	color: #fe0;
	font-weight: 900;
	margin-top: 20px;
	text-align: center;
}
.remont, .ustanovka, .sale {
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	align-self: baseline;
	margin: 20px 50px 20px 50px;
	color: #fff;
	font-size: 20px;
	font-weight: 900;
	text-align: center;
}
.icons {
	justify-content: center;
	flex-wrap: wrap;
	margin-bottom: 30px;
}
.icons div {
	width: 250px;
}
.fbimg {
	width: 250px;
	height: auto;
}
.fbspan {
	margin-top: 20px;
}
.middle {
	margin: 0 55px 0 55px;
}
.apl {
	padding-top: 30px;
	text-transform: uppercase;
	font-size: 26px;
	text-decoration: underline solid #bec2d0;
	margin-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	color: #0b1d39;
}
.asc {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 30px;
}
.fbtext {
	flex-direction: column;
	font-size: 16px;
	text-align: left;
}
.panasonic,.lg, .delongi {
	justify-content: space-between;
	flex-direction: column;
	align-items: center;
	width: 400px;
	margin: 0 20px 55px 20px;
}
.fblogo {
	width: 250px;
	height: auto;
	margin-bottom: 30px;
}
.hover { position: relative; }
.hover:after,.hover:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; }
.hover:after { 	content: 'Проверить авторизацию на официальном сайте'; 
				padding: 2em 0; 
				font-weight: 900; 
				text-decoration: underline; 
				font-size: 18px; 
				text-align: center; 
				color: #fe0; 
				margin: 10px; 
				border: 2px solid #fff; }
.hover:before { background: rgba(0,0,0,.5); }
.hover:hover:before,
.hover:hover:after { opacity: 1; }
.cert {
	width: 100%;
	background-color: #acacac;
	background-image: url('../img/cert_bg.jpg');
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.cert_wrap {
	width: 90%;
	margin: 0 auto;
}
.c_img {
	text-align: center;
	padding: 0 20px 0 20px;
	color: #000;
	font-size: 16px;
}
.c_img img{
	width: 150px;
	height: auto;
	padding: 10px;
	margin: 0 auto;
}
.slick-prev:before, .slick-next:before {
	color: #0b1d39;
}
.slick-dots {
	position: unset;
	padding-bottom: 10px;
}
.slick-dotted.slick-slider {
	margin-bottom: 0;
}
.foot_text {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	margin: 15px;
}
.fb_wrap {
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
	background: #f4f4f4;
	padding-bottom: 20px;
}
.fb_img {
	width: 150px;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
	border: 2px solid #777;
}
.fb_img:hover {
	transform: scale(1.2);
	box-shadow: 0px 0px 20px #666666;
}
.fb_box {
	flex-direction: column;
	text-align: center;
	align-items: center;
	align-self: baseline;
	width: 200px;
	padding: 10px;
}
.fb_name {
	display: block;
	width: 100%;
	padding-top: 20px;
	font-size: 22px;
	text-align: center;
}
.repair {
	flex-direction: column;
	margin-bottom: 30px;
}
.base {
	justify-content: center;
	align-items: baseline;
	flex-wrap: wrap;
}
.bfirst {
	margin-top: 20px;
}
.col {
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	margin: 0 20px 20px 20px;
}
.center {
	align-self: center;
}
.ibase {
	width: 150px;
	height: auto;
}
.tbase {
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	text-decoration: underline solid #bec2d0;
	margin-top: 15px;
	text-align: center;
	color: #0b1d39;
}
.iprice {
	position: relative;
	background-color: #fff;
	border: 1px solid #cfffc3;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	color: #0b1d39;
	padding: 15px 15px 15px 50px;
	margin: 10px;
	border-radius: 5px;
}
.iprice::before {
	position: absolute;
	left: 10px;
	top: -10px;
	content: "\f1c1";
	font-weight: 900;
	font-family: "Font Awesome 5 Pro";
	font-size: 39px;
	color: #f00;
	padding: 2px;
	background-color: #fff;
}
.ibutton {
	background-color: #fe0;
	border: 1px solid #cfffc3;;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 900;
	color: #0b1d39;
	padding: 15px;
	margin: 10px;
	border-radius: 5px;
}
/* MEDIA */
@media screen and (max-width: 600px) {
	.slick-next {
		right: -15px;
	}
	.slick-prev {
		left: -15px;
	}
	.repair {
	    margin-bottom: 0;

	}
}
@media screen and (max-width: 500px) {
	.phone, .email, .addres {
		display: none;
	}
	.offer {
		font-size: 40px;
		font-weight: 900;
		margin-top: 30px;
	}
	.tel {
		font-size: 50px;
		margin-top: 10px;
		margin-bottom: 20px;
	}
	.panasonic,.lg {
		margin-bottom: 30px;
	}
	.icons {
		margin-top: 20px;
	}
	.remont, .ustanovka, .sale {
		margin: 0;
	}
	.ustanovka {
		margin-top: -20px;
	}
	.sale {
		margin-top: 30px;
	}
	.middle {
    	margin: 0 20px 0 20px;
	}
	.fb_name {
		font-size: 18px;	
	}
	.topbutton {
		right: 30px;
	}
}

@media screen and (max-width: 400px) {
	.logo img {
		margin-right: 20px;
		width: 100px;
		height: auto;
	}
	.offer {
		font-size: 30px;
		font-weight: 900;
		margin-top: 30px;
	}
	.tel {
		font-size: 30px;
		margin-top: 10px;
	}
	.fbimg {
		width: 150px;
	}
	.ustanovka {
		margin-top: -10px;
	}
	.apl {
		font-size: 19px;
	}
	.slick-next {
		right: -5px;
	}
	.slick-prev {
		left: -5px;
	}
	.topbutton {
		right: 20px;
	}
}



