@font-face { font-family: lato; src: url(/assets/fonts/latoregular.woff2); font-display: swap; } 
@font-face { font-family: latoheavy; src: url(/assets/fonts/latoheavy.woff2); font-display: swap; }
@font-face { font-family: latobold; src: url(/assets/fonts/latobold.woff2); font-display: swap; }

body { padding: 0 0; margin: 0; }

* { box-sizing: border-box; }

h1, h2, h3, h4, h5, p { margin-top: 0; }


/* TOP BAR BEGIN */

.top-bar { max-width: 100%; border-bottom: 1px solid rgb(245,245,245); margin: 0; }
.tb-wrapper { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; }



.osct { max-width: 100%; display: flex; justify-content: flex-start; align-items: center; margin: 10px; }
.osct-i { width: 28px; height: 28px; flex-shrink: 0; margin: 0 10px 0 0; }
.osct-t { display: block; max-width: 95%; color: #111; font-size: 18px; line-height: 1.3; font-family: latobold; letter-spacing: 0.5px; text-align: left; padding: 0 0; margin: 0; }

.osct-t a { text-decoration: none; transition: color 0.4s; color: #111; }
.osct-t a:hover { color: #1bbde8; }


.btn-top { display: block; width: 180px; text-align: center; font-family: latoheavy; font-weight: 400; font-size: 18px; line-height: 1; letter-spacing: 0.5px; background: #fff; color: #111; border: 1px solid #c0c0c0; border-radius: 3px; transition: background 0.4s, color 0.4s; padding: 8px 10px; margin: 10px auto; }



.btn-top-wa { display: flex; justify-content: center; align-items: center; width: 180px; font-family: latoheavy; font-weight: 400; font-size: 18px; letter-spacing: 0.5px; background: #fff; color: #111; border: 1px solid #c0c0c0; border-radius: 3px; transition: background 0.4s, color 0.4s; text-decoration: none; padding: 4px 10px; margin: 10px auto; }

.btn-top-wa object { width: 26px; height: 26px; margin-right: 5px; }

.btn-top:hover, .btn-top-wa:hover { color: #fff; background: #1bbde8; text-decoration: none; }

@media all and (max-width: 1220px) {
  .tb-wrapper { justify-content: space-around; }
}

#logo { text-align: center; display: block; padding: 0; margin: 0; }
#logo a:hover { background-color: #fff; }
#logo a img { max-width: 100%; }


/* TOP BAR END */



/* NAV BAR BEGIN */

.toggle, [id^=drop] { display: none; }

nav { max-width: 100%; background: #3560fa; display: flex; justify-content: center; align-items: center; letter-spacing: 1px; border-top: 8px solid #3560fa; border-bottom: 8px solid #3560fa; padding: 0 0; margin: 0; }

/* Since we'll have the "ul li" "float:left" we need to add a clear after the container. */
/* nav:after { content:""; display:table; clear:both; } */

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul { list-style: none; position: relative; padding: 0; margin: 0; }

/* Positioning the navigation items inline */
nav ul li { display:inline-block; border-right: 1px solid #fff; margin: 0px; }
nav ul li:last-child { border-right: none; }
nav ul li ul li { border-right: none; }


/* Styling the links */
nav a {
  display: block;
  color: #fff;
  font-size: 18px;
  font-family: latobold;
  text-decoration: none;
  line-height: 20px;
  transition: color 0.4s;
  padding: 8px 12px;
}


/* submenu BG */
nav ul li ul li { background: #3560fa; border-bottom: 1px solid rgba(255,255,255,0.7); }
ul li ul li a { color: #fff; letter-spacing: 0.5px; }

nav ul li ul li:hover { color: #1bbde8; }

/* Background color change on Hover */
nav a:hover {
	/* background-color: #000000; */
  color: #5adbfd;
  text-decoration: none;
}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {
	display: none;
	position: absolute;
	/* has to be the same number as the "line-height" of "nav a" */
	top: 36px;
	z-index: 1105;
}

/* Display Dropdowns on Hover */
nav ul li:hover > ul {
	display:inherit;
}

/* Fisrt Tier Dropdown */
nav ul ul li {
	width: 220px; /* 170px; */
	/* float:none; */
	display:list-item;
	position: relative;
}

/* nav ul ul li a { font-family: pnre; } */

/* Second, Third and more Tiers
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {
	position: relative;
	top:-60px;
	/* has to be the same number as the "width" of "nav ul ul li" */
	left:170px;
}


/* Change ' +' in order to change the Dropdown symbol  (▾ Black Down-pointing Small Triangle  ▾ ▾) */
li > a:after { content:  ' ▾'; }
li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width: 768px) {

  #logo { margin: 0 auto; }

  nav { display: block; border-top: none; border-bottom: none; margin: 0; }
  nav ul li ul li:first-child { border-top: 1px solid rgba(255,255,255,0.2); }

	/* Hide the navigation menu by default */
	/* Also hide the  */
	.toggle + a,
	.menu { display: none; }

	/* Stylinf the toggle lable */
	.toggle {
		display: block;
		background-color: #3560fa;
		color: #fff;
		font-size: 18px;
		font-family: latobold;
		font-weight: 400;
		line-height: 20px;
		text-decoration: none;
		border: none;
		padding: 10px 12px;
	}

  .toggle-menu {
    text-align: center;
    font-family: latoheavy;
	font-size: 20px;
	border-bottom: 1px solid #fdfdfd;
    padding: 10px 0;
  }

	.toggle:hover {
    color: #5adbfd;
	}

  .toggle-menu:hover {
    color: #5adbfd;
	}

	/* Display Dropdown when clicked on Parent Lable */
	[id^=drop]:checked + ul { display: block; }




	/* Change menu item's width to 100% */
	nav ul li {
		display: block;
		width: 100%;
		border-right: none;
		border-bottom: 1px solid #fdfdfd;
	}

	nav ul ul .toggle,
	nav ul ul a {
		padding: 0 40px;
	}

	nav ul ul ul a {
		padding: 0 80px;
	}

	nav a:hover,
 	nav ul ul ul a {
		background-color: #fff;
    color: #000;
	}

	nav ul li ul li .toggle,
	nav ul ul a,
  nav ul ul ul a{
		padding: 10px 20px;
		color: #000;
		font-size: 17px;
	}


	nav ul li ul li .toggle,
	nav ul ul a {
		background-color: #3560fa;
	}

	/* Hide Dropdowns by Default */
	nav ul ul {
		/* float: none; */
		position:static;
		color: #000;
		/* has to be the same number as the "line-height" of "nav a" */
	}

	/* Hide menus on hover */
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
	}

	/* Fisrt Tier Dropdown */
	nav ul ul li {
		display: block;
		width: 100%;
	}

	nav ul ul ul li {
		position: static;
		/* has to be the same number as the "width" of "nav ul ul li" */

	}

}

@media all and (max-width: 330px) {
	nav ul li { display:block; width: 94%; }
}

/* NAV BAR END */



.mbw { max-width: 1200px; margin: 0 auto; padding: 30px 0; }
.oh { overflow: hidden; }
.nopad { padding: 0; }
.pt0 { padding-top: 0; }

.fbox1 { max-width: 100%; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; padding: 70px 0; margin: 0; }

.fbox1-lb, .fbox1-rb { display: block; text-align: left; padding: 10px; margin: 0; }
.fbox1-lb { max-width: 400px; }
.fbox1-rb { max-width: 800px; }

.big-title1 { color: #1bbde8; font-size: 44px; line-height: 1.25; font-family: latoheavy; letter-spacing: 0px; text-transform: uppercase; margin-bottom: 15px; }
.big-subtitle1 { color: #1bbde8; font-size: 36px; line-height: 1.2; font-family: lato; font-weight: 500; letter-spacing: 0.5px; margin-bottom: 0; }

h5 { color: #292f34; font-size: 18px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; margin-top: 10px; margin-bottom: 20px; }

.p1 { color: #606060; font-size: 17px; line-height: 1.6; font-family: lato; font-weight: 400; text-align: left; margin-bottom: 15px; }

.cont-abb { text-align: left; margin-top: 50px; margin-bottom: 0; }
.a-big-btn { text-transform: uppercase; text-decoration: none; font-family: lato; font-weight: 900; font-size: 22px; line-height: 1; letter-spacing: 0.5px; background: #fff; color: #1bbde8; border: 3px solid #1bbde8; border-radius: 10px; transition: background 0.4s, color 0.4s; padding: 20px 40px; margin: 0; }
.a-big-btn:hover { color: #fff; background: #1bbde8; text-decoration: none; }


.ccont1 { background-color: #f5f5f5; padding: 70px 0; margin: 0; }

.h2b1 { text-align: center; color: #292f34; font-size: 48px; line-height: 1.25; font-family: lato; font-weight: 700; letter-spacing: 0.5px; margin-bottom: 20px; }
.pcb { text-align: center; color: #606060; font-size: 24px; line-height: 1.25; font-family: lato; font-weight: 400; letter-spacing: 0.5px; margin-bottom: 30px; }



.fbox2 { max-width: 100%; display: flex; justify-content: space-around; align-items:stretch; flex-wrap: wrap; margin: 0; }

.icard1 { background: #fff; width: 360px;  text-align: center; margin: 15px 10px; }

.isub1 { width: 360px; height: 240px; overflow: hidden; background-image: url(/images/services-1.jpg); background-repeat: no-repeat; background-attachment: scroll; background-position: center; filter: brightness(100%); background-size: 100%; transition: background-size 8s ease-out, filter 0.4s; }
.isub1:hover { background-size: 130%; filter: brightness(80%); }

.ictc { text-align: left; padding: 30px 40px; margin: 0; }

.h4ic { color: #292f34; font-family: lato; font-size: 24px; font-weight: 700;  line-height: 1.25; letter-spacing: 0.5px; margin-bottom: 15px; }

.h4ic a { text-decoration: none; color: #292f34; transition: color 0.4s; }
.h4ic a:hover { color: #1bbde8; }


.cont-adb { text-align: left; margin-top: 30px; margin-bottom: 15px; }
.a-dark-btn { text-transform: uppercase; text-decoration: none; font-family: lato; font-weight: 900; font-size: 14px; line-height: 1; letter-spacing: 0.5px; background: #3c414c; color: #fff; border: 3px solid #3c414c; border-radius: 5px; transition: background 0.4s, color 0.4s; padding: 12px 24px; margin: 0; }
.a-dark-btn:hover { color: #3c414c; background: #fff; text-decoration: none; }



.pxcont1 { max-width: 100%; background: url(/images/parallax1.jpg) no-repeat center fixed; background-size: cover; padding: 90px 0; margin: 0; }

.fbox3 { max-width: 100%; display: flex; justify-content: flex-end; align-items: center; flex-wrap: wrap; margin: 0; }

.fbox3-b { max-width: 600px; display: block; text-align: left; padding: 10px; margin: 0; }

.ppx1 { color: #292f34; font-size: 20px; line-height: 1.3; font-family: lato; font-weight: 700; text-align: left; letter-spacing: 0.5px; margin-bottom: 35px; }

.ppx2 { color: #151515; font-size: 30px; line-height: 1.3; font-family: lato; font-weight: 400; text-align: left; letter-spacing: 0.5px; margin-bottom: 15px; }


.cont-abb2 { text-align: left; margin-top: 80px; margin-bottom: 20px; }
.a-big-btn2 { text-transform: uppercase; text-decoration: none; font-family: lato; font-weight: 900; font-size: 22px; line-height: 1; letter-spacing: 0.5px; background: #1bbde8; color: #fff; border: 3px solid #1bbde8; border-radius: 10px; transition: background 0.4s, color 0.4s; padding: 20px 40px; margin: 0; }
.a-big-btn2:hover { color: #1bbde8; background: rgba(255,255,255,0); text-decoration: none; }


.card1 { width: 360px;  text-align: left; margin: 15px 10px; }

.osvg1 { width: 80px; height: 80px; display: block; margin-bottom: 15px; }


.h1w {  text-align: center; color: #fff; font-size: 48px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 10px; margin-bottom: 0; }




.container-double { max-width: 1200px; padding: 30px 0; margin: 0 auto; }

.wpcn { float: left; max-width: 820px; padding: 15px 10px; margin: 0 auto; }

.sbw-container { float: right; width: 360px; padding: 0 0; margin: 0 auto; }

.sbw { max-width: 100%; background: #f5f5f5; overflow: hidden; padding: 10px 15px; margin-bottom: 10px; }

.cleaner-cb { clear: both; }



.mbw img { display: block; max-width: 100%; margin: 20px auto; }

.h1b { text-align: center; color: #111; font-size: 34px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 0; margin: 0 0 20px 0; }
.h2b { text-align: center; color: #111; font-size: 30px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 0; margin: 35px 0 15px 0; }
.h3b { text-align: center; color: #292f34; font-size: 26px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 0; margin: 30px 0 15px 0; }
.h4b { text-align: center; color: #111; font-size: 22px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 0; margin: 30px 0 15px 0; }

.tuc { text-align: left; text-transform: uppercase; text-indent: 10px; color: #111; font-size: 22px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; padding: 0 0; margin: 30px 0 15px 0; }

.sbuc { text-transform: uppercase; font-family: latobold; }

.h2b.mt0 { margin-top: 0; }

.p11 { color: #606060; text-indent: 15px; font-size: 17px; line-height: 1.6; font-family: lato; font-weight: 400; text-align: left; margin-bottom: 15px; }
.noi { text-indent: 0; }
.mt10 { margin-top: 10px; }
.mt25 { margin-top: 25px; }

.p11 a, .osctx a { color: #118fff ; text-decoration: none; }
.p11 a:hover, .osctx a:hover { color: #292f34; }

.fboxti { max-width: 100%; display: flex; justify-content: space-around; align-items: flex-start; flex-wrap: wrap; margin: 0 0 10px 0; }

.fboxti.mt20 { margin-top: 20px; }
.fboxti.mb0 { margin-bottom: 0; }

.jcfs { justify-content: flex-start; }

.sb { justify-content: space-between; align-items: center; margin-bottom: 20px; }

.cti { max-width: 400px; margin: 10px; }
.cti-tx { max-width: 760px; }

.cti.mw300 { max-width: 300px; }
.cti.w220 { width: 220px; }
.cti.mw860 { max-width: 860px; }

.cti-half { max-width: 580px; }
.cti img { max-width: 100%; margin: 0; }

@media all and (max-width: 768px) {
  .cti-half { width: 300px; }
}

.cti .p11 { margin-bottom: 10px; }
.cti .p11:last-child { margin-bottom: 0; }

.cquad { width: 280px; margin: 10px; }


ul.ultx, ul.ultx-quad { list-style-position: outside; padding: 0 0; margin: 0 0 15px 20px; }
ul.ultx { list-style-type: disc; }
ul.ultx-quad { list-style-type: square; }
ol.oltx { padding: 0 0; margin: 0 0 15px 20px; }
.ultx li, .ultx-quad li, .oltx li { color: #606060; font-size: 17px; line-height: 1.35; font-family: lato; font-weight: 400; margin: 10px 0; }

ul.ultx li:first-child, ul.ultx-quad li:first-child, ol.oltx li:first-child { margin-top: 0; }
ul.ultx li:last-child, ul.ultx-quad li:last-child, ol.oltx li:last-child { margin-bottom: 0; }

.cti ul, .cti ol { margin: 0 0 0 10px; }



table.table-lite { width: 100%; border-collapse: collapse; border-spacing: 0; border: 1px solid #f5f5f5; background-color: #fff; margin-bottom: 15px; }
.table-lite tr th, .table-lite tr td { border: 1px solid #f5f5f5; font-family: lato; font-size: 17px; line-height: 1.3; color: #606060; padding: 8px 10px; }
.table-lite tr th { font-family: latobold; background: #3c414c; color: #fff; text-align: center; letter-spacing: 0.5px; }
.table-lite tr th:first-child { text-align: left; }
.table-lite tr td:last-child, .table-lite tr td:nth-child(even) { text-align: center; }
.table-lite tr:nth-child(even) { background: #f5f5f5; }




@media all and (max-width: 1020px) {
  .h1b { font-size: 30px; margin-bottom: 15px; }
  .h2b { font-size: 28px; margin: 25px 0 15px 0; }
  /*
  .h3b { font-size: 24px; margin: 25px 0 10px 0; }
  .h4b { font-size: 22px; margin: 25px 0 10px 0; }
  */
}






.h5ct { color: #292f34; font-size: 18px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; margin: 10px 0 15px 0; }

.h5ctw { color: #fff; font-size: 20px; line-height: 1.3; font-family: latobold; font-weight: 400; letter-spacing: 0.5px; margin: 0 0 15px 0; }

.ula { /* list-style-position: inside; list-style-type: circle; padding: 5px 8px; */ list-style-type: none; padding: 0 0; margin: 0; }
.ula li { margin: 12px 0; }
.ula li:last-child { margin-bottom: 0; }
.ali { color: #095ec6; font-size: 17px; line-height: 1.35; font-family: lato; font-weight: 400; text-align: left; text-decoration: underline; transition: color 0.2s; }
.orange { color: orange; }
.red { color: red; }
.aliw { color: #fff; font-size: 19px; line-height: 1.35; font-family: lato; font-weight: 400; text-align: left; text-decoration: none; transition: color 0.4s; }
.ali:hover { color: #292f34; }
.aliw:hover { color: #1bbde8; text-decoration: none; }

.mb40 { margin-bottom: 40px; }


footer { background-color: #13213c; padding: 15px 0 10px 0; margin: 0; }

.fboxf { max-width: 1200px; display: flex; justify-content: space-around; align-items: stretch; flex-wrap: wrap; margin: 0 auto; }

.fw { width: 300px; padding: 10px; margin: 0; }


.f-logo { text-align: center; display: block; text-decoration: none; padding: 0 0; margin: 0 auto 20px auto; }
.f-logo img { max-width: 100%; }



.oscf { max-width: 100%; display: flex; justify-content: flex-start; align-items: center; margin: 18px 0; }
.aifs { align-items: flex-start; }
.oscf-i { width: 26px; height: 26px; flex-shrink: 0; margin: 0 8px 0 0; }
.oscf-t { display: block; max-width: 95%; color: #fff; font-size: 19px; line-height: 26px; font-family: lato; font-weight: 400; letter-spacing: 0.5px; text-align: left; padding: 0 0; margin: 0; }

.oscf-t a { text-decoration: none; transition: color 0.4s; color: #fff; }
.oscf-t a:hover { color: #1bbde8; }

/*
@media all and (max-width: 1020px) {
  footer { padding: 0 0 10px 0; }
}
*/




.fbox4 { max-width: 100%; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin: 0; }

.badge { width: 400px; height: 450px; position: relative; background: #ecf3f5; text-align: center; border: 1px solid #fff; border-bottom: 6px solid #ffc107; overflow: hidden;  padding: 0; margin: 0;  transition: background 0.3s, border-bottom-color 0.3s; }

.badge-ic { clip-path: polygon(0% 0%,100% 0%,100% 80%,50% 100%,0% 80%); margin: 0; transition: margin 0.3s; }

.badge-ic img { max-width: 100%; margin: 0 auto; opacity: 1; transition: opacity 0.3s; }

.b-ttl { color: #111; font-family: latobold; font-size: 24px; line-height: 1.25; letter-spacing: 0.5px; padding: 0 8px; margin: 15px 0; transition: color 0.3s; }

.b-p11 { color: #606060; font-size: 17px; line-height: 1.6; font-family: lato; text-align: center; padding: 0 8px; margin: 0; transition: color 0.3s; }


.b-price { position: absolute; left: 0; top: 25px; clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%); background: #ffc107; color: #000; font-family: latoheavy; font-size: 24px; line-height: 1; letter-spacing: 0.5px; padding: 8px 16px 8px 10px; margin: 0; transition: color 0.3s, background 0.3s; }


.a-badge-btn { display: block; width: 140px; text-decoration: none; font-family: latobold; font-size: 17px; line-height: 34px; letter-spacing: 0.5px; background: rgba(255,255,255,0); color: #fff; border: 2px solid #fff; border-radius: 5px; opacity: 0; margin: 15px auto 0 auto; transition: background 0.3s, color 0.3s, opacity 0.3s; }
.a-badge-btn:hover { color: #005dab; background: rgba(255,255,255,1); text-decoration: none; }


.btn-bg-yel { position: absolute; top: auto; bottom: 0; width: 100%; display: flex; justify-content: center; align-items: center; font-family: latoheavy; font-size: 20px; letter-spacing: 0.5px; background: #ffc107; color: #111; text-transform: uppercase; opacity: 0; transition: opacity 0.3s, background 0.3s; text-decoration: none; border: none; cursor: pointer; padding: 12px 10px; margin: 0; }

.btn-bg-yel object { width: 20px; height: 20px; margin-right: 5px; }

.btn-bg-yel:hover { background: yellow; }


.badge:hover .badge-ic { margin-top: -130px; }
.badge:hover { background: #005dab; border-bottom-color: yellow; }
.badge:hover .b-ttl, .badge:hover .b-p11 { color: #fff; }
.badge:hover .badge-ic img { opacity: 0; }
.badge:hover .b-price { color: #fff; }
.badge:hover .a-badge-btn, .badge:hover .btn-bg-yel { opacity: 1; }


.pttl-blue {  text-align: left; color: #005dab; font-size: 34px; line-height: 1.3; font-family: latoheavy; text-transform: uppercase; letter-spacing: 0.5px; padding: 0; margin: 0; }
.pttl-sub { text-align: left; color: #111; font-size: 24px; line-height: 1.3; font-family: latobold; letter-spacing: 0; padding: 0; margin: 0 0 20px 0; }


@media all and (max-width: 1020px) {
  .badge { width: 320px; }
  .b-ttl { font-size: 22px; margin: 30px 0 10px 0; }
  .b-p11 { line-height: 1.4; }

  /*.sb { justify-content: center; } */
  .pttl-blue { font-size: 26px; }
  .pttl-sub { font-size: 22px; }
}




.fboxbm { max-width: 100%; display: flex; justify-content: center; align-items: stretch; flex-wrap: nowrap; padding: 0; margin: 0; }
.badge-mini { width: 100%; height: 250px; }
.b-o { width: 80px; height: 80px; display: block; margin: 60px auto 0 auto; transition: margin 0.3s; }
.badge:hover .b-o { margin-top: 30px; }

[class^="flaticon-"] { display: block; color: #005dab; font-size: 70px; padding: 0; margin: 50px auto 0 auto; transition: margin 0.3s, color 0.3s;  }
.badge:hover [class^="flaticon-"] { color: #fff; margin-top: 10px; }

@media all and (max-width: 1020px) {
  .fboxbm { flex-wrap: wrap; }
  .badge-mini .b-ttl { margin: 20px 0 10px 0; }
}



.bgcont { max-width: 100%; background: url(/images/badges-bg.jpg) no-repeat center scroll; background-size: cover; padding: 0; margin: 0; }

.bgcont-overlay { max-width: 100%; background: rgba(0,93,171,0.7); padding: 30px 0; margin: 0; }

.fboxbg { max-width: 100%; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin: 0; }

.pttl-white {  text-align: left; color: #fff; font-size: 34px; line-height: 1.7; font-family: latoheavy; text-transform: uppercase; letter-spacing: 0.5px; padding: 0; margin: 0; }

.pttl-subw { text-align: left; color: #fff; font-size: 22px; line-height: 1.4; font-family: latobold; letter-spacing: 0; padding: 0; margin: 0; }

@media all and (max-width: 1020px) {
  .bgcont { background: #005dab; }
  .bgcont-overlay { background: rgba(0,93,171,1); padding: 0 0; }
  .pttl-white { font-size: 26px; line-height: 1.4; }
  .pttl-subw { font-size: 18px; }
}




.ccont4 { max-width: 100%; background: #ecf3f5; padding: 0; margin: 0; }

.pttl-sub2 { text-align: left; color: #111; font-size: 20px; line-height: 1.5; font-family: latobold; letter-spacing: 0; padding: 0; margin: 0; }

.fboxb2 { max-width: 100%; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; background: #fff; border: 1px solid #ddd; padding: 30px; margin: 0; transition: background 0.3s; }

.b2-ic { width: 300px; margin: 0 10px 0 0; }
.b2-ic img { max-width: 100%; margin: 0; }

.b2-tc { max-width: 760px; margin: 0; }

.b2-tc .pttl-sub { margin-bottom: 10px; }

.hvc { transition: color 0.3s; }


.fboxb2:hover { background: #005dab; }
.fboxb2:hover .b2-ic { clip-path: polygon(0% 0%, 80% 0%, 100% 50%, 80% 100%, 0% 100%); }
.fboxb2:hover .b2-tc .hvc { color: #fff; }



.btn-bg-yel2 { display: flex; justify-content: center; align-items: center; font-family: latobold; font-size: 20px; letter-spacing: 0; background: #ffc107; color: #111; text-transform: uppercase; transition: background 0.3s; text-decoration: none; border: none; border-radius: 20px; cursor: pointer; padding: 12px 14px; margin: 20px auto 0 0; }
.btn-bg-yel2 object { width: 20px; height: 20px; margin-right: 5px; }
.btn-bg-yel2:hover { background: yellow; }



@media all and (max-width: 1020px) {
  .fboxb2 { padding: 15px; }
  .b2-tc .pttl-sub { margin-top: 15px; }
  .btn-bg-yel2 { margin-top: 10px; }
}




.badge1 { width: 320px; text-align: center; border: 1px solid #ccc; border-radius: 12px; background: rgba(255,255,251,1); box-shadow: 0 8px 5px 0 rgba(0,0,0,0.1); padding: 0; margin: 10px auto 20px auto; }
.m-name { font-family: latobold; font-size: 22px; line-height: 1.3; text-align: center; letter-spacing: 0.5px; background-color: #efefef; padding: 0 10px; margin: 10px 0; }
.m-photo { max-width: 95%; border-radius: 50%; margin: 0; }
.m-exp { font-family: lato; font-size: 18px; line-height: 1.3;  text-align: center; color: #555; background-color: #ffc107; padding: 0 10px; margin: 10px 0; }
.m-works { font-family: lato; font-size: 18px; line-height: 1.3;  text-align: center; margin: 10px; }


.osc { max-width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; margin: 15px 0; }
.osci { width: 40px; height: 40px; flex-shrink: 0; margin: 0 8px 0 0; }
.osctx { display: block; max-width: 95%; color: #606060; font-size: 17px; line-height: 1.4; font-family: lato; font-weight: 400; text-align: left; padding: 0; margin: 0; }

.osc.lite { align-items: center; }
.osc.lite .osci { width: 32px; height: 32px; }

.osc.mt0 { margin-top: 0; }
.osc.mt25 { margin-top: 25px; }

.osc.mb0 { margin-bottom: 0; }

.bold { font-family: latobold }

.hl-block { max-width: 100%; border: 1px solid #ddd; border-radius: 8px; background: repeating-linear-gradient(-45deg, rgba(0,0,0,0), rgba(0,0,0,0) 20px, rgba(200,200,200,0.1) 20px, rgba(200,200,200,0.3) 40px); background-attachment: fixed; padding: 10px; margin: 15px 0; }

.hl-block .osc:first-child, .infobox .p11:first-child { margin-top: 0 }
.hl-block .osc:last-child, .infobox .p11:last-child { margin-bottom: 0 }

@media all and (max-width: 768px) {
  .osc.lite { align-items: flex-start; }
}



/* MR SAN BEGIN */

.ccont5 { background: url(/images/circle3.webp) no-repeat center right scroll, linear-gradient(to bottom, #16284f, #052e6d); background-size: contain; padding: 40px 0; margin: 0; }

.ccont52 { background: url(/images/circle3.webp) no-repeat 20% 60% scroll, linear-gradient(to bottom, #052e6d, #16284f); background-size: contain; padding: 40px 0; margin: 0; }

/* .ccont52 { background: url(/images/circle3.webp) no-repeat 20% 60% scroll, url(/images/phone.webp) no-repeat center scroll, linear-gradient(to bottom, #052e6d, #16284f); background-size: contain; padding: 40px 0; margin: 0; } */

.pttl3 {  text-align: left; color: #fff; font-size: 32px; line-height: 1.3; font-family: latoheavy; letter-spacing: 0.5px; padding: 0 10px; margin: 0; }
.pttl3.align-right { max-width: 550px; text-align: right; margin-left: auto; }

.fbox5 { max-width: 100%; display: flex; justify-content: flex-end; align-items: center; flex-wrap: nowrap; padding: 0; margin: 0; }
.fbox52 { max-width: 1200px; display: flex; justify-content: space-around; align-items: center; flex-wrap: nowrap; padding: 0; margin: 0 auto; }

.card-mr1 { max-width: 360px; background: #465b8c; border: 1px dashed #7890c4; outline: 14px solid #465b8c; border-radius: 10px; position: relative; padding: 25px 10px; margin: 20px; }

.card-mr2 { max-width: 500px; padding: 10px; margin: 10px 20px; }
.card-mr22 { max-width: 380px; padding: 10px; margin: 10px; }

.asfs { align-self: flex-start; }

.card-mr-i { max-width: 620px; position: relative; }
.card-mr-i img { max-width: 100%; margin: 0; }

.card-mr-i.mob { display: none; }
.card-mr-i.desktop { display: block; }

.osc2 { max-width: 100%; display: flex; justify-content: flex-start; align-items: center; margin: 25px 0; }
.osci2 { width: 55px; height: 55px; flex-shrink: 0; margin: 0 15px 0 0; }
.osctx2 { display: block; max-width: 95%; color: #fcf9f9; font-size: 19px; line-height: 1.5; font-family: latobold; font-weight: 400; text-align: left; letter-spacing: 0.5px; padding: 0; margin: 0; }

.osc2a { max-width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; margin: 15px 0; }
.osc2a:first-child { margin-top: 0; }
.osc2a:last-child { margin-bottom: 0; }
.osci2a { width: 55px; height: 55px; flex-shrink: 0; margin: 0 10px 0 0; }
.osctx2a { display: block; max-width: 95%; color: #fcf9f9; font-size: 18px; line-height: 1.4; font-family: latobold; text-align: left; letter-spacing: 0; padding: 0; margin: 0; }
.osctx2a a, .osctx2a a:hover { text-decoration: none; color: #ef8432; }



.brevno { width: calc(100% - 20px); height: 2px; background: #7890c4; margin: 30px auto; }

.hoover { width: 160px; height: 160px; position: absolute; left: 10px; top: 10px; background: #ef8432; border: 2px dashed #fff; outline: 8px solid #ef8432; border-radius: 50%; padding: 10px; margin: 15px; }
.hoover object { display: block; width: 55px; height: 55px; margin: 10px auto; }
.hoover span { display: block; text-align: center; font-family: lato; font-size: 17px; font-weight: 400; color: #fff; margin: 0; }



.cmr-p { color: #fcf9f9; font-size: 21px; line-height: 1.6; font-family: latobold; font-weight: 400; text-align: left; letter-spacing: 0.5px; padding: 0 0 0 10px; margin: 25px 0 ; }
.cmr-p a, .cmr-p a:hover { text-decoration: none; color: #fcf9f9; }

.cmr-pi1 { color: #fcf9f9; font-size: 17px; line-height: 1.4; font-family: latobold; font-weight: 400; font-style: italic; text-align: left; letter-spacing: 0; padding: 0 0 0 20px; margin: 25px 0; }
.cmr-pi2 { color: #fcf9f9; font-size: 17px; line-height: 1.4; font-family: latobold; font-weight: 400; font-style: italic; text-align: left; letter-spacing: 0; padding: 0 0 0 30px; margin: 25px 0; }

.a-wa { display: block; position: absolute; left: 230px; top: 60px; }
.a-wa img { width: 60px; height: 60px; margin: 0; }


.img-phone { max-width: 100%; margin: 0 0 30px 0; }
.img-obj { max-width: 100%; margin: 0; transform: rotate(0deg); }

.green-wa { color: #fff; font-size: 21px; line-height: 1; font-family: latobold; font-weight: 400; text-align: center; letter-spacing: 0.5px; background: #00c20e; box-shadow: rgba(0, 194, 14, 0.6) 10px 10px 10px 0px; transition: background 0.3s; border-radius: 10px; text-decoration: none; position: relative; overflow: hidden; padding: 20px 20px; margin: 0 15px; }
.green-wa:hover { background: #1aa326; text-decoration: none; }
.green-wa.desktop { display: block; } 
.green-wa.mobile { display: none; } 

.green-wa:after { content: ""; width: 250px; height: 200px; display: block; position: absolute; background: #fff; border-radius: 100%; transform: scale(0); top: -20px; left: -140px; animation-timing-function: linear; animation-name: ripple; animation-duration: 3s; animation-iteration-count: infinite; }

@keyframes ripple { 20% { opacity: 0; transform: scale(2.5); } 100% { opacity: 0; transform: scale(2.5); } } 


.tooltip1 { position: relative; background: #ef8636; color: #fffcfc; font-size: 20px; line-height: 1.4; font-family: lato; font-weight: 400; text-align: left; letter-spacing: 0px; border-radius: 15px; padding: 20px; margin: 0 15px 50px 15px; }

.tooltip1:after { content: ""; display: block; position: absolute; width: 60px; height: 40px; background: #ef8636; left: 40px; top: auto; bottom: 0; clip-path: polygon(0% 0%,100% 0%,50% 100%); transform-origin: 50% 50%; z-index: 0; margin-bottom: -39px; }

@media all and (max-width: 1500px) {
  .fbox5, .fbox52 { flex-wrap: wrap; justify-content: space-around; }
}

@media all and (max-width: 1020px) {
	
  .ccont5, .ccont52 { padding: 30px 0; }

  /* .ccont5 { padding: 30px 0; }
  .ccont52 { background: url(/images/circle3.webp) no-repeat center scroll, linear-gradient(to bottom, #052e6d, #16284f); padding: 30px 0; } */

  .pttl3 { font-size: 26px; padding: 0 10px 10px 10px; margin: 0; }

  .card-mr1 { padding: 15px 10px; }
  .card-mr2, .card-mr22 { max-width: 360px; margin: 10px; }
  .card-mr-i { max-width: 360px; }
  
  .card-mr-i.mob { display: block; margin-top: 25px; }
  .card-mr-i.desktop { display: none; }
  
  .osc2 { align-items: flex-start; }
  .osci2, .osci2a { width: 45px; height: 45px; margin: 0 10px 0 0; }
  .osctx2 { font-size: 18px;  }
  
  .hoover { left: 0; top: 0; transform: translate(-20px, -10px) scale(0.7); }

  .img-phone { margin: 0; }

  .green-wa { font-size: 20px; padding: 20px 15px; margin: 0 auto 25px auto; }
  .green-wa.desktop { display: none; } 
  .green-wa.mobile { display: block; }
  
  .tooltip1 { font-size: 18px; line-height: 1.3; }

}

/* MR SAN END */



/* SLICK BEGIN */

.regular1 { margin: 35px 0; }

.slick-prev:before, .slick-next:before { color: grey; font-size: 40px; }

.slick-prev { left: 0; z-index: 1100; }
.slick-next { right: 20px; z-index: 1100; }

.slider div .badge { margin: 0 auto; }

.regular3 .slick-slide { transition: all ease-in-out .3s; opacity: .2; }
.regular3 .slick-active { opacity: .5; }
.regular3 .slick-current { opacity: 1; transform: scale(1.03) }

/*
.slider { width: 50%; margin: 100px auto; }
.slick-slide { margin: 0px 20px; }
.slick-slide img { width: 100%; }

.slick-slide { transition: all ease-in-out .3s; opacity: .2; }
.slick-active { opacity: .5; }
.slick-current { opacity: 1; }
*/

/* SLICK END */




/* UIKIT BEGIN */

.uk-overlay { padding: 15px; }

.uk-overlay-primary { background: rgba(60, 65, 76, 0.7) }

.uko-ttl { font-family: latobold; color: #111; font-size: 24px; line-height: 1.2; text-align: left; letter-spacing: 0.5px; padding: 0; margin: 0 0 10px 0; }

.uko-p { font-family: lato; color: #111; font-size: 18px; line-height: 1.2; text-align: left; padding: 0; margin: 0; }

.white { color: white; }

.uk-overlay .a-light-btn { display: block; width: 160px; text-align: center; text-transform: uppercase; text-decoration: none; font-family: latoheavy; font-size: 17px; line-height: 1.8; letter-spacing: 0.5px; background: rgba(60, 65, 76, 0); color: #fff; border: 2px solid #fff; border-radius: 5px; transition: background 0.4s, color 0.4s; margin: 10px auto 0 auto; }
.uk-overlay .a-light-btn:hover { color: #3c414c; background: #fff; text-decoration: none; }


@media all and (max-width: 768px) {
  .uk-overlay { padding: 10px; }
  .uko-ttl { font-size: 20px; margin: 0 0 5px 0; }
  .uko-p { font-size: 16px; }
  .uk-overlay .a-light-btn { font-size: 16px; margin: 10px auto 0 0; }
}


/* UIKIT END */



/*
.slcont1 { max-width: 100%; height: 500px; background: url(/images/slide01.jpg) no-repeat center scroll; background-size: cover;  display: flex; justify-content: center; align-items: center; padding: 0; margin: 0; }

.slcont1-sub { width: 1200px;  display: flex; justify-content: flex-end; align-items: center; margin: 10px; }

.sub-box1 { max-width: 750px; margin: 0; }

.slp1 { margin-bottom: 15px; }
.slp1 .sl-span1 { font-family: lato; font-size: 18px; font-weight: 400; letter-spacing: 0.5px; line-height: 1; background: rgba(255,255,255,1); color: #606060; padding: 3px 6px; margin: 0; }

.slp2 { font-family: latoheavy; font-size: 44px; font-weight: 400; letter-spacing: 0.5px; line-height: 1.2; color: #fff; text-transform: uppercase; margin-bottom: 35px; }

.slp3 { color: #fff; font-size: 40px; line-height: 1.2; font-family: lato; font-weight: 500; letter-spacing: 0.5px; margin-bottom: 0; }
*/

/*
.big-subtitle1 { color: #1bbde8; font-size: 36px; line-height: 1.2; font-family: lato; font-weight: 500; letter-spacing: 0.5px; margin-bottom: 0; }
*/




.tbnr { max-width: 100%; background: url(/images/b-santehnik2.jpg) no-repeat center scroll; background-size: cover; padding: 80px 0; margin: 0; }

.b-remont-unitaza { background: url(/images/remont-unitaza-baner.jpg) no-repeat center scroll; background-size: cover; }

.b-zasor-unitaza { background: url(/images/b-zasor-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-zasor-v-rakovine { background: url(/images/b-zasor-v-rakovine.jpg) no-repeat center scroll; background-size: cover; }
.b-zasor-v-vannoy { background: url(/images/b-zasor-v-vannoy.jpg) no-repeat center scroll; background-size: cover; }
.b-ochistka-zhiroulovitelya { background: url(/images/b-ochistka-zhiroulovitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-mehanicheskaya-prochistka-kanalizacii { background: url(/images/b-mehanicheskaya-prochistka-kanalizacii.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-kanalizacionnogo-nasosa { background: url(/images/b-prochistka-kanalizacionnogo-nasosa.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-stoyaka { background: url(/images/b-prochistka-stoyaka.jpg) no-repeat center scroll; background-size: cover; }
.b-videodiagnostika-kanalizacionnyh-trub { background: url(/images/b-videodiagnostika-kanalizacionnyh-trub.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-kanalizacii-gidrodinamicheskim-sposobom { background: url(/images/b-prochistka-kanalizacii-gidrodinamicheskim-sposobom.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-livnevoy-kanalizacii { background: url(/images/b-prochistka-livnevoy-kanalizacii.jpg) no-repeat center bottom scroll; background-size: cover; }
.b-arenda-ilososa { background: url(/images/b-arenda-ilososa.jpg) no-repeat center scroll; background-size: cover; }
.b-obsluzhivanie-kanalizacii { background: url(/images/b-obsluzhivanie-kanalizacii.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-kanalizacii { background: url(/images/b-prochistka-kanalizacii.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-kanalizacii-v-restorane { background: url(/images/b-prochistka-kanalizacii-v-restorane.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-naruzhnoy-kanalizacii { background: url(/images/b-prochistka-naruzhnoy-kanalizacii.jpg) no-repeat center bottom scroll; background-size: cover; }
.b-remont-bachka-unitaza { background: url(/images/b-remont-bachka-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-gofry-unitaza { background: url(/images/b-zamena-gofry-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-armatury-unitaza { background: url(/images/b-zamena-armatury-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-razvodka-trub { background: url(/images/b-razvodka-trub.jpg) no-repeat center scroll; background-size: cover; }
.b-razvodka-trub-otopleniya { background: url(/images/b-razvodka-trub-otopleniya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-installyacii-unitaza { background: url(/images/b-ustanovka-installyacii-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-installyacii { background: url(/images/b-remont-installyacii.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-bachka-unitaza { background: url(/images/b-zamena-bachka-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-montaj-kanalizacii { background: url(/images/b-montaj-kanalizacii.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-stoyakov { background: url(/images/b-zamena-stoyakov.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-trub-v-vannoy { background: url(/images/b-zamena-trub-v-vannoy.jpg) no-repeat center scroll; background-size: cover; }
.b-pajka-mednyh-trub { background: url(/images/b-pajka-mednyh-trub.jpg) no-repeat center scroll; background-size: cover; }
.b-razvodka-trub-rehau { background: url(/images/b-razvodka-trub-rehau.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-trub-vodosnabzheniya { background: url(/images/b-zamena-trub-vodosnabzheniya.jpg) no-repeat center scroll; background-size: cover; }
.b-svarka-trub { background: url(/images/b-svarka-trub.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-moiki { background: url(/images/b-ustanovka-moiki.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-rakoviny-v-vannoj { background: url(/images/b-ustanovka-rakoviny-v-vannoj.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-sifona { background: url(/images/b-ustanovka-sifona.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-sliv-pereliv-vanny { background: url(/images/b-ustanovka-sliv-pereliv-vanny.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-vanny { background: url(/images/b-zamena-vanny.jpg) no-repeat center scroll; background-size: cover; }
.b-razmorozka-trub { background: url(/images/b-razmorozka-trub.jpg) no-repeat center bottom scroll; background-size: cover; }
.b-ustanovka-akrilovoj-vanny { background: url(/images/b-ustanovka-akrilovoj-vanny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-rakoviny { background: url(/images/b-ustanovka-rakoviny.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-smesitelya { background: url(/images/b-remont-smesitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-smesitelya1 { background: url(/images/b-remont-smesitelya1.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-smesitelya-v-vannoy { background: url(/images/b-zamena-smesitelya-v-vannoy.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-vanny { background: url(/images/b-ustanovka-vanny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-vanny-s-gidromassazhem { background: url(/images/b-ustanovka-vanny-s-gidromassazhem.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-vstraivaemogo-smesitelya { background: url(/images/b-ustanovka-vstraivaemogo-smesitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-smesitelya-v-dushevoi { background: url(/images/b-zamena-smesitelya-v-dushevoi.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-smesitelya-na-kuhne { background: url(/images/b-zamena-smesitelya-na-kuhne.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-smesitelya { background: url(/images/b-ustanovka-smesitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-chugunnoy-vanny { background: url(/images/b-ustanovka-chugunnoy-vanny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-dushevogo-ugolka { background: url(/images/b-ustanovka-dushevogo-ugolka.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-dushevoy-peregorodki { background: url(/images/b-ustanovka-dushevoy-peregorodki.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-rakoviny-s-tumboy { background: url(/images/b-ustanovka-rakoviny-s-tumboy.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-gigienicheskogo-dusha { background: url(/images/b-montazh-gigienicheskogo-dusha.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-dushevoy-kabiny { background: url(/images/b-ustanovka-dushevoy-kabiny.jpg) no-repeat center scroll; background-size: cover; }
.b-germetizaciya-dushevoy-kabiny { background: url(/images/b-germetizaciya-dushevoy-kabiny.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-dveri-dushevoy-kabiny { background: url(/images/b-remont-dveri-dushevoy-kabiny.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-dushevogo-poddona { background: url(/images/b-zamena-dushevogo-poddona.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-elektricheskogo-polotencesushitelya { background: url(/images/b-montazh-elektricheskogo-polotencesushitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-polotencesushitelya { background: url(/images/b-ustanovka-polotencesushitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-prochistka-sololifta { background: url(/images/b-prochistka-sololifta.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-bide { background: url(/images/b-ustanovka-bide.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-filtra { background: url(/images/b-ustanovka-filtra.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-sololifta { background: url(/images/b-ustanovka-sololifta.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-radiatorov-otopleniya { background: url(/images/b-zamena-radiatorov-otopleniya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-posudomoechnoy-mashiny { background: url(/images/b-ustanovka-posudomoechnoy-mashiny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-stiralnoy-mashiny { background: url(/images/b-ustanovka-stiralnoy-mashiny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-vodonagrevatelya { background: url(/images/b-ustanovka-vodonagrevatelya.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-vodyanogo-teplogo-pola { background: url(/images/b-montazh-vodyanogo-teplogo-pola.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-elektricheskogo-teplogo-pola { background: url(/images/b-montazh-elektricheskogo-teplogo-pola.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-zhiroulovitelya { background: url(/images/b-ustanovka-zhiroulovitelya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-rasshiritelnogo-baka { background: url(/images/b-ustanovka-rasshiritelnogo-baka.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-grebenki { background: url(/images/b-montazh-grebenki.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-teplogo-pola { background: url(/images/b-remont-teplogo-pola.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-zashchity-ot-protechek { background: url(/images/b-ustanovka-zashchity-ot-protechek.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-cirkulyacionnogo-nasosa { background: url(/images/b-ustanovka-cirkulyacionnogo-nasosa.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-regulyatora-davleniya { background: url(/images/b-ustanovka-regulyatora-davleniya.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-greyushchego-kabelya { background: url(/images/b-montazh-greyushchego-kabelya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-i-zamena-nasosa { background: url(/images/b-ustanovka-i-zamena-nasosa.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-kessona { background: url(/images/b-remont-kessona.jpg) no-repeat center scroll; background-size: cover; }
.b-chistka-skvazhin { background: url(/images/b-chistka-skvazhin.jpg) no-repeat center scroll; background-size: cover; }
.b-produvka-trub-na-zimu { background: url(/images/b-produvka-trub-na-zimu.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-skvazhin { background: url(/images/b-remont-skvazhin.jpg) no-repeat center scroll; background-size: cover; }
.b-montazh-sistemy-otopleniya { background: url(/images/b-montazh-sistemy-otopleniya.jpg) no-repeat center scroll; background-size: cover; }
.b-promyvka-sistemy-otopleniya { background: url(/images/b-promyvka-sistemy-otopleniya.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-i-remont-gidroakkumulyatora { background: url(/images/b-ustanovka-i-remont-gidroakkumulyatora.jpg) no-repeat center scroll; background-size: cover; }
.b-zamena-santehniki { background: url(/images/b-zamena-santehniki.jpg) no-repeat center scroll; background-size: cover; }
.b-remont-santehniki { background: url(/images/b-remont-santehniki.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-santehniki { background: url(/images/b-ustanovka-santehniki.jpg) no-repeat center scroll; background-size: cover; }
.b-zasor-v-dushevoy-kabiny { background: url(/images/b-zasor-v-dushevoy-kabiny.jpg) no-repeat center scroll; background-size: cover; }
.b-ustanovka-unitaza { background: url(/images/b-ustanovka-unitaza.jpg) no-repeat center scroll; background-size: cover; }
.b-about { background: url(/images/b-about.jpg) no-repeat center scroll; background-size: cover; }
.b-santehnik-raion { background: url(/images/b-santehnik-raion.jpg) no-repeat center scroll; background-size: cover; }

.tbnr-sub { width: 1200px; border-radius: 8px; background: rgba(255,255,255,0.85); text-align: center; padding: 20px; margin: 0 auto; }

.tb-title { font-family: latobold; font-size: 32px; letter-spacing: 0.5px; line-height: 1.3; color: #111; text-align: center; margin-bottom: 10px; }



.fboxtb { max-width: 100%; display: flex; justify-content: space-around; align-items: flex-start; flex-wrap: wrap; padding: 0; margin: 0; }

.osctb { max-width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; margin: 20px 10px; }
.aic { align-items: center; }
.osctb:first-child { margin-top: 10px; }
.osctb:last-child { margin-bottom: 10px; }
.osctb-i { width: 40px; height: 40px; flex-shrink: 0; margin: 0 10px 0 0; }
span.osctb-i { font-size: 36px; line-height: 1; padding: 0; }

.osctb-t { display: block; max-width: 510px; color: #222; font-size: 19px; line-height: 1.3; font-family: lato; font-weight: 700; letter-spacing: 0.5px; text-align: left; padding: 0; margin: 0; }

@media all and (max-width: 1220px) {
  .tbnr-sub { width: auto; }
}

@media all and (max-width: 1020px) {
  .tbnr { background: #f5f5f5; padding: 0 0; }
  .tbnr-sub { background: rgba(255,255,255,0); width: auto; padding: 20px; }
  .tb-title { font-size: 29px; }
}



/* cf */

.fboxcf1 { max-width: 500px; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; padding: 0; margin: 0; }

.cf-p0 { color: #111; font-size: 18px; line-height: 1.3; font-family: latobold; text-align: center; padding: 0 10px; margin: 10px 0 0 0; }

.cf-p1 { width: 215px; color: #606060; font-size: 16px; line-height: 1.2; font-family: lato; font-weight: 400; text-align: left; margin: 10px 5px; }
.cf-p1-m { width: auto; text-align: center; margin: 0 5px 15px 5px; }
.cf-p1 a { text-decoration: none; color: #1bbde8; font-weight: 400;  }
.cf-p1 a:hover { text-decoration: underline; }

input[name=nme99],
input[name=tel99],
input[name=email99],
input[name=rn99],
input[name=np99],
textarea[name=text99] { width: 215px; background: #f5f5f5; display: block; font-size: 17px; font-family: lato; line-height: 1.2; color: #606060; border-radius: 5px; border: 1px solid #999; resize: none; box-shadow: 1px 1px 2px 0.5px rgba(0,0,0,0.18) inset; padding: 10px 15px; margin: 10px 5px; }

textarea[name=text99] { width: 450px; margin-bottom: 5px; }

input[name=rn99]::placeholder,
input[name=np99]::placeholder,
input[name=nme99]::placeholder,
input[name=tel99]::placeholder,
input[name=email99]::placeholder,
textarea[name=text99]::placeholder { color: #999; }

input:focus, textarea:focus { /* outline-color: #ccc; */ outline: none; }

input[name=sbsubmit] { background: #1bbde8; border: 2px solid #1bbde8; font-size: 17px; color: white; display: block; line-height: 1.2; width: 215px; border-radius: 5px; letter-spacing: 0.5px; font-family: latobold; text-align: center; text-transform: uppercase; transition: background 0.4s, color 0.4s; padding: 10px 15px; margin: 10px 5px; }
input[name=sbsubmit]:hover { color: #1bbde8; background: rgba(255,255,255,0); }

input[name=sbsubmit]:disabled { color: #fff; background: #ddd; border-color: #ddd; }

.infobox { display: none; max-width: 360px; text-align: center; border: 2px solid #ccc; border-radius: 5px; background: white; padding: 5px 5px; margin: 10px auto; }
.infobox .msg-success, .infobox .msg-error { font-family: latobold; font-size: 18px; line-height: 1.3; margin-bottom: 0; }
.infobox .msg-success { color: #44c; }
.infobox .msg-error { color: #c44; }
.infobox .msg-desc { font-family: lato; font-size: 15px; text-align: left; color: #555; line-height: 1.3; margin-bottom: 0; }

@media all and (max-width: 1020px) {
  .cf-p1 { width: 280px; margin-left: auto; margin-right: auto; }

  input[name=nme99],
  input[name=tel99],
  input[name=email99],
  input[name=rn99],
  input[name=np99],
  textarea[name=text99],
  input[name=sbsubmit] { width: 300px; margin-left: auto; margin-right: auto; }
}

/* cf */


.ccont2 { background-color: #fff; padding: 20px 0; margin: 0; }
.pttl {  text-align: center; color: #111; font-size: 32px; line-height: 1.3; font-family: latobold; letter-spacing: 0.5px; padding: 0 10px; margin: 0 0 20px 0; }
.card2 { width: 280px;  text-align: center; box-shadow: 1px 1px 15px 3px #eee; transition: box-shadow 0.4s; margin: 15px 10px; }
.card2:hover { box-shadow: 1px 1px 15px 3px #ddd; }
.card2 img { max-width: 100%; margin: 0 auto; }
.card2-desc { width: 100%; height: 100px; font-family: lato; font-size: 17px; color: #131313; line-height: 1.2; background: #f6f6f5; text-align: center; padding: 10px; margin: 0; }

.card3 { width: 280px;  text-align: center; margin: 15px 10px; }

.rdtitle { font-family: latoheavy; color: #111; font-size: 50px; letter-spacing: 0.5px; margin-bottom: 15px; }
.rdtx { font-family: lato; color: #111; font-size: 21px; letter-spacing: 0.5px; margin-bottom: 0; }

@media all and (max-width: 480px) {
  .rdtitle { font-size: 40px; margin-bottom: 10px; }
  .rdtx { font-size: 19px; }
}


.ccont3 { background-color: #4845ec; padding: 0; margin: 0; }
/* background-color: #224e83; */

.pttl2 {  text-align: center; color: #fff; font-size: 32px; line-height: 1.3; font-family: latoheavy; letter-spacing: 0.5px; text-transform: uppercase; padding: 40px 10px; }

.fboxtech { max-width: 100%; display: flex; justify-content: center; align-items: stretch; flex-wrap: nowrap; padding: 0; margin: 0; }

.fbt-block { max-width: 480px; background-size: contain; border-bottom: 0px solid #ff3737; transition: all 0.3s; padding: 5px 20px 15px 20px; margin: 0; }

.fbt-block:nth-of-type(2) { flex-shrink: 1.2; }

.tech1 { background: url(/images/tech-1.png) no-repeat left top scroll; }
.tech2 { background: url(/images/tech-2.png) no-repeat left top scroll; }
.tech3 { background: url(/images/tech-3.png) no-repeat left top scroll; }
.tech4 { background: url(/images/tech-4.png) no-repeat left top scroll; }

.fbtb-ttl-box { max-width: 100%; height: 70px; margin: 0 0 39% 25%; }

.fbtb-ttl { font-family: latobold; font-size: 19px; line-height: 1.4; color: #fff; text-align: right; text-transform: uppercase; padding: 0; margin: 0 15px 5px 0; }

.subline { width: 80px; height: 2px; background: #ff3737;  margin: 0 15px 0 auto; }

ul.techlist { list-style-position: outside; list-style-type: disc; opacity: 0.6; transition: opacity 0.3s; padding: 0 0; margin: 0 0 10px 20px; }
.techlist li { color: #fff; font-size: 17px; line-height: 1.3; font-family: lato; letter-spacing: 0px; margin: 12px 0; }
.techlist li::marker { color: #fff; }

.fbt-block:hover { border-bottom: 15px solid #ff3737; margin-top: -15px; }
.fbt-block:hover ul.techlist { opacity: 1; }

@media all and (max-width: 1500px) {
  .fboxtech { flex-wrap: wrap; justify-content: space-around; }
  .pttl2 { font-size: 26px; padding: 30px 10px; margin: 0; }
  .fbt-block { margin-bottom: 20px; }
  ul.techlist { opacity: 1; }
}

@media all and (max-width: 480px) {
  .fbtb-ttl-box { margin: 0 0 45% 25%; }
}


span.linebreak { display: none; }

@media all and (max-width: 400px) {
  span.linebreak { display: inline; }
}



/* MODAL CF BEGIN */

div.modal { display: none; opacity: 0; position: fixed; z-index: 1110; left: 0; top: 0; width: 100%; height: 100%; overflow: auto;  background-color: rgba(245,245,245,0.7); transition: all 0.3s; }
.modal .modal-content { background-color: #fff; max-width: 900px; padding: 10px 10px; margin: 5% auto; }
.modal .mc-form { max-width: 650px; }
.modal-content .close0 { color: #aaa; float: right; font-size: 28px; line-height: 0.7; font-weight: bold; cursor: pointer; }
.modal-content .close0:hover { color: black; cursor: pointer; }
p.mdlp { color: #333; text-align: center; font-family: lato; font-size: 19px; line-height: 1.1; margin: 15px 0; }
.mdlp span { font-size: 24px; font-family: latobold; text-transform: uppercase; }


.form-modal { padding: 10px; }

div.cf-name-tel-holder { max-width: 100%; display: flex; align-items: center; justify-content: space-between; margin: 0; }
.cf-name-tel-holder div { margin: 10px; }

div.cf-date-holder { display: flex; align-items: center; justify-content: flex-start; margin: 10px; }

span.works-label { font-size: 16px; font-family: lato; line-height: 1.7; text-align: left; margin-right: 10px; }


select[name=vhours1],
select[name=vminutes1],
select[name=works99a] { height: auto; font-size: 16px; font-family: lato; line-height: 1; padding: 4px; }

select[name=vhours1]:focus,
select[name=vminutes1]:focus,
select[name=works99a]:focus { outline: none; }



input[name=nme99a],
input[name=tel99a],
input[name=city99a],
input[name=street99a],
input[name=house99a],
input[name=corp99a],
input[name=flat99a],
textarea[name=text99a] { background: #fff; display: block; font-size: 17px; font-family: lato; line-height: 1.2; color: #606060; border-radius: 5px; border: 1px solid #999; resize: none; box-shadow: 1px 1px 2px 0.5px rgba(0,0,0,0.18) inset; padding: 8px 10px; }

textarea[name=text99a] { width: 590px; margin: 10px auto; }

input[name=nme99a]::placeholder,
input[name=tel99a]::placeholder,
input[name=city99a]::placeholder,
input[name=street99a]::placeholder,
input[name=house99a]::placeholder,
input[name=corp99a]::placeholder,
input[name=flat99a]::placeholder,
textarea[name=text99a]::placeholder  { color: #999; }

input[name=vdate] { flex-shrink: 0; font-size: 15px; padding: 4px; }


input[name=msubmit] { background: #1bbde8; border: 2px solid #1bbde8; font-size: 16px; color: white; display: block; line-height: 1.2; width: 300px; border-radius: 5px; letter-spacing: 0.5px; font-family: latobold; text-align: center; text-transform: uppercase; transition: background 0.4s, color 0.4s; padding: 8px 12px; margin: 10px auto 0 auto; }
input[name=msubmit]:hover { color: #1bbde8; background: rgba(255,255,255,0); }

input[name=msubmit]:disabled { color: #fff; background: #ddd; border-color: #ddd; }


@media screen and (max-width: 820px) {
  div.cf-name-tel-holder { flex-wrap: wrap; justify-content: flex-start; }
  textarea[name=text99a] { width: 300px; height: 130px; margin: 0 auto; }
}

@media screen and (max-width: 340px) {
  textarea[name=text99a], input[name=msubmit] { width: 280px; }
}

/* MODAL CF END */



@media all and (max-width: 1220px) {
  .container-double { padding: 15px 0; }
  .wpcn, .sbw-container { float: none; }
  .sbw { padding: 10px 10px; }

  .slcont1 { display: none; }

}

@media all and (max-width: 360px) {
  .sbw-container { width: 300px; }
}

@media all and (max-width: 1020px) {
  .top-bar { border-bottom: 2px solid #ccc; }
  .mbw { padding: 15px 8px; }
  .nopad { padding: 0; }
  .pt0 { padding-top: 0; }
  .fbox1 { padding: 30px 0; }
  .big-title1 { font-size: 37px; }
  .big-subtitle1 { font-size: 32px; }

  .cont-abb, .cont-abb2 { text-align: left; margin-top: 40px; margin-bottom: 30px; }
  .a-big-btn, .a-big-btn2 { font-size: 17px; border-radius: 8px; padding: 16px 32px; }

  .ccont1 { padding: 30px 0; }

  .h2b1 { font-size: 34px; margin-bottom: 15px; }
  .pcb { font-size: 18px; margin-bottom: 20px; }

  .icard1, .card1 { width: 300px; }
  .card1 { padding: 10px 0; }

  .isub1 { width: 300px; height: 200px; }

  .ictc { padding: 24px; }
  .h4ic { font-size: 20px; margin-bottom: 10px; }

  .pxcont1 { background: #dce6e7; padding: 30px 0; }

  .fbox3 { justify-content: center; }

  .ppx1 { font-size: 17px;  margin-bottom: 25px; }

  .ppx2 { font-size: 26px; }

  .osvg1 { margin-bottom: 10px; }

  .h1w { font-size: 30px; }

  .ccont2 { padding: 10px 0; }
  .pttl { font-size: 26px; margin: 0 0 10px 0; }

}