@charset "UTF-8";
/*----------------------------------------------------------
  General CSS rules for the common elements
  (like headings, forms, pagination, etc.) and
  for main template parts like header, footer and so forth.
  Also styles reset, widely used classes, animations, etc.
------------------------------------------------------------
 >>> TABLE OF CONTENTS:
------------------------------------------------------------
* Colorscheme
* Reset styles
* Animations
* General
	** General styles
	** Skip link
	** Headings
* Classes
	** Markup
	** Underline
	** Graphics
	** Lightbox
	** Contact links
	** Other
* Controls
	** Close
	** Arrows
	** Dots
	** Pagination
	** Buttons
* Forms
* Navigation
* Breadcrumbs
* Prices
* CMS
* Development
* Services
* Testimonials
* Feedback
* Footer
* Page content
* No-content
* 404 page
* Modal windows
* Custom dialog boxes
* Scrollbars
* Progressbar
----------------------------------------------------------*/


/********************  COLORSCHEME  ********************/

:root {
	--color-black: #272727;			/* rgb(39,39,39) */
	--color-white: #fff;			/* rgb(255,255,255) */
	--color-green: #10dd63;			/* rgb(16,221,99) */
	--color-blue: #55cee3;			/* rgb(85,206,227) */
	--color-navy: #252932;			/* rgb(37,41,50) */
	--color-grey: #d8d8d8;			/* rgb(216,216,216) */
	--color-smokewhite: #f5f5f5;	/* rgb(245,245,245) */
	--color-error: #f00;			/* rgb(255,0,0) */
}


/********************  RESET STYLES  ********************/

/* General */
html, body, div, span,
header, footer, main, aside, nav, section, article,
p, a, strong, em, b, i, sub, sup, small, mark, del, ins,
address, time, blockquote, q, cite, abbr, dfn,
h1, h2, h3, h4, h5, h6,
ul, ol, li, dl, dt, dd,
img, iframe, figure, figcaption, audio, video, canvas, object, embed,
form, input, textarea, button, label, fieldset, legend,
table, caption, thead, tbody, tfoot, tr, th, td,
details, summary, output, samp, pre, code, kbd, var, bdi, ruby {
	vertical-align: baseline;
	font-size: 100%;
	font: inherit;
	border: 0;
	padding: 0;
	margin: 0;
}

*, ::before, ::after {box-sizing: border-box;}
html {-webkit-text-size-adjust: none;}
body:not(.tabbed) :focus {outline: 0;}

/* HTML5 */
header, footer, main, aside, nav, section, article, figure, figcaption, details, dialog {display: block;}
audio, video, canvas, picture, progress {display: inline-block;}
audio:not([controls]) {display: none; height: 0;}

/* Text */
strong, b {font-weight: 700;}
em, i {font-style: italic;}
sub {vertical-align: sub; font-size: 70%; line-height: 0;}
sup {vertical-align: super; font-size: 70%; line-height: 0;}
small {font-size: 80%;}
del {text-decoration: line-through;}
ins {text-decoration: underline;}
pre, code, kbd, samp {font-family: monospace;}

/* Forms */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]) {-webkit-appearance: none;}
textarea {resize: none; overflow: auto;}
select, [type="button"], [type="submit"], [type="reset"], [type="file"] {cursor: pointer;}
label {display: block;} label[for] {cursor: pointer;}
legend {display: table; max-width: 100%; white-space: normal;}
::-webkit-file-upload-button {cursor: pointer;}
::-ms-clear, ::-ms-reveal {display: none; width: 0; height: 0;}
::-webkit-search-decoration {-webkit-appearance: none; display: none;}
::-webkit-search-cancel-button {-webkit-appearance: none; display: none;}
::-webkit-search-results-button {-webkit-appearance: none; display: none;}
::-webkit-search-results-decoration {-webkit-appearance: none; display: none;}

/* Controls */
a, button {background: none; color: inherit; text-decoration: none; cursor: pointer;}
button, [role="button"], [role="tab"] {cursor: pointer; -webkit-touch-callout: none;}
:disabled, [aria-disabled="true"] {cursor: not-allowed;}
[aria-busy="true"] {cursor: progress;}

/* Embeds */
img {max-width: 100%; height: auto;}
iframe {display: block; position: relative;}
picture {display: table; line-height: 0;}

/* Details */
details:not([open]) > *:not(summary) {display: none;}
summary {display: block; cursor: pointer;}
::-webkit-details-marker {display: none;}

/* Other */
ul, ol, li, dt, dd {list-style: none;}
table {border-spacing: 0; border-collapse: collapse;}
th, td {text-align: center; vertical-align: middle;}
blockquote, q {quotes: none;}
blockquote::before, blockquote::after, q::before, q::after {content: ''; content: none;}
abbr {background-color: transparent; color: inherit; text-decoration: none;}
abbr[title] {display: inline-block; border-bottom: 1px dotted;}

/* SVG */
svg {display: block; position: relative;}
svg:not([fill]) {fill: currentColor;}
svg:not(:root) {overflow: hidden;}


/********************  ANIMATIONS  ********************/

/*------ Rotate ------*/
@-webkit-keyframes f-rotate {0%{-webkit-transform: rotate(0deg);}100%{-webkit-transform: rotate(360deg);}}
@keyframes f-rotate {0%{transform: rotate(0deg);}100%{transform: rotate(360deg);}}

/*------ Errors ------*/
@-webkit-keyframes error-input {25%{-webkit-transform: translateX(2px);}50%{-webkit-transform: translateX(0);}75%{-webkit-transform: translateX(-2px);}100%{-webkit-transform: translateX(0);}}
@keyframes error-input {25%{transform: translateX(2px);}50%{transform: translateX(0);}75%{transform: translateX(-2px);}100%{transform: translateX(0);}}

@-webkit-keyframes error-chradio {16.65%{-webkit-transform: translateY(5px);}33.3%{-webkit-transform: translateY(-4px);}49.95%{-webkit-transform: translateY(3px);}66.6%{-webkit-transform: translateY(-2px);}83.25%{-webkit-transform: translateY(1px);}100%{-webkit-transform: translateY(0);}}
@keyframes error-chradio {16.65%{transform: translateY(5px);}33.3%{transform: translateY(-4px);}49.95%{transform: translateY(3px);}66.6%{transform: translateY(-2px);}83.25%{transform: translateY(1px);}100%{transform: translateY(0);}}

/*------ Load Box ------*/
@-webkit-keyframes cssload-animate {17%{border-bottom-right-radius: 3px;}25%{-webkit-transform: translateY(9px) rotate(22.5deg);}50% {-webkit-transform: translateY(18px) scale(1,0.9) rotate(45deg); border-bottom-right-radius: 39px;}75%{-webkit-transform: translateY(9px) rotate(67.5deg);}100%{-webkit-transform: translateY(0) rotate(90deg);}}
@keyframes cssload-animate {17%{border-bottom-right-radius: 3px;}25%{transform: translateY(9px) rotate(22.5deg);}50% {transform: translateY(18px) scale(1,0.9) rotate(45deg); border-bottom-right-radius: 39px;}75%{transform: translateY(9px) rotate(67.5deg);}100%{transform: translateY(0) rotate(90deg);}}

@-webkit-keyframes cssload-shadow {0%,100%{-webkit-transform: scale(1,1);}50%{-webkit-transform: scale(1.2,1);}}
@keyframes cssload-shadow {0%,100%{transform: scale(1,1);}50%{transform: scale(1.2,1);}}

/*------ Contacts Icons ------*/
@-webkit-keyframes phone-wobble {25%{-webkit-transform: rotate(30deg);}50%{-webkit-transform: rotate(-15deg);}75%{-webkit-transform: rotate(10deg);}}
@keyframes phone-wobble {25%{transform: rotate(30deg);}50%{transform: rotate(-15deg);}75%{transform: rotate(10deg);}}

@-webkit-keyframes email-wobble {25%{-webkit-transform: rotate(-10deg);}50%{-webkit-transform: rotate(10deg);}75%{-webkit-transform: rotate(-5deg);}}
@keyframes email-wobble {25%{transform: rotate(-10deg);}50%{transform: rotate(10deg);}75%{transform: rotate(-5deg);}}

@-webkit-keyframes location-wobble {25%{-webkit-transform: translateY(-3px);}50%{-webkit-transform: translateY(1px);}75%{-webkit-transform: translateY(-2px);}}
@keyframes location-wobble {25%{transform: translateY(-3px);}50%{transform: translateY(1px);}75%{transform: translateY(-2px);}}

/*------ Buttons ------*/
@-webkit-keyframes button-pulse {0%{box-shadow: 0 0 8px 6px rgba(16,221,99,1), 0 0 12px 14px rgba(16,221,99,1);}100%{box-shadow: 0 0 18px 6px rgba(16,221,99,0), 0 0 4px 40px rgba(16,221,99,0);}}
@keyframes button-pulse {0%{box-shadow: 0 0 8px 6px rgba(16,221,99,1), 0 0 12px 14px rgba(16,221,99,1);}100%{box-shadow: 0 0 18px 6px rgba(16,221,99,0), 0 0 4px 40px rgba(16,221,99,0);}}

/*------ Buzz Out ------*/
@-webkit-keyframes buzz-out {10%{-webkit-transform: translateX(3px) rotate(2deg);}20%{-webkit-transform: translateX(-3px) rotate(-2deg);}30%{-webkit-transform: translateX(3px) rotate(2deg);}40%{-webkit-transform: translateX(-3px) rotate(-2deg);}50%{-webkit-transform: translateX(2px) rotate(1deg);}60%{-webkit-transform: translateX(-2px) rotate(-1deg);}70%{-webkit-transform: translateX(2px) rotate(1deg);}80%{-webkit-transform: translateX(-2px) rotate(-1deg);}90%{-webkit-transform: translateX(1px) rotate(0);}100%{-webkit-transform: translateX(-1px) rotate(0);}}
@keyframes buzz-out {10%{transform: translateX(3px) rotate(2deg);}20%{transform: translateX(-3px) rotate(-2deg);}30%{transform: translateX(3px) rotate(2deg);}40%{transform: translateX(-3px) rotate(-2deg);}50%{transform: translateX(2px) rotate(1deg);}60%{transform: translateX(-2px) rotate(-1deg);}70%{transform: translateX(2px) rotate(1deg);}80%{transform: translateX(-2px) rotate(-1deg);}90%{transform: translateX(1px) rotate(0);}100%{transform: translateX(-1px) rotate(0);}}

/*------ Wobble Vertical ------*/
@-webkit-keyframes wobble-vertical {16.65%{-webkit-transform: translateY(8px);}33.3%{-webkit-transform: translateY(-6px);}49.95%{-webkit-transform: translateY(4px);}66.6%{-webkit-transform: translateY(-2px);}83.25%{-webkit-transform: translateY(1px);}100%{-webkit-transform: translateY(0);}}
@keyframes wobble-vertical {16.65%{transform: translateY(8px);}33.3%{transform: translateY(-6px);}49.95%{transform: translateY(4px);}66.6%{transform: translateY(-2px);}83.25%{transform: translateY(1px);}100%{transform: translateY(0);}}


/********************  GENERAL  ********************/

html {overflow: auto; overflow-x: hidden;}
@media all and (max-width: 319px){ html {overflow-x: scroll !important;} }
body {display: flex; flex-direction: column; min-width: 320px; height: 100%; background: #fff; font-size: 16px; line-height: 1.6; font-family: 'Open Sans', sans-serif; color: #272727;}

::-moz-selection {background-color: #10dd63; color: #fff;}
::selection {background-color: #10dd63; color: #fff;}

#global-wrapper {flex: 1 0 auto; display: flex; flex-direction: column; min-height: 100vh; position: relative; overflow: hidden;}
#global-wrapper::before {content: ''; display: block; width: 100%; height: 0; position: fixed; top: 0;}
	#main-content {flex: 1 0 auto; display: flex; flex-direction: column; min-height: 1px;}
	#main-content > * {flex: 0 0 auto; order: 10; width: 100%;}
		.wrapper {display: block; width: 100%; max-width: 1320px; min-width: 320px; padding: 80px 20px; margin: 0 auto; position: relative;}
.wrap {
  padding: 80px 20px;
}
			
			/* Skip link */
			#skip-link {display: inline-block; background: #10dd63; border-radius: 0 0 6px 6px; font-size: 14px; color: #fff; text-align: center; text-decoration: underline; padding: 8px 15px; position: fixed; z-index: 200; left: 10px; top: 0; white-space: nowrap; transition: transform 0.2s ease-out 0s; transform: translateY(-100%);}
				#skip-link:hover {text-decoration: none;}
				#skip-link:focus {transform: none;}
			
			/* Headings */
			h1, h2, h3, h4, h5, h6 {font-weight: 700; line-height: 1.2; font-family: Roboto, sans-serif; text-align: center;}
			
			h1 {font-size: 40px; text-align: left; margin: 0 auto 30px;}
				h1 + .sub-title {font-size: 22px; line-height: 1.4; margin: -15px auto 30px;}
			h2 {font-size: 40px; margin: 0 auto 50px;}
				h2 + .sub-heading {font-size: 22px; line-height: 1.4; text-align: center; margin: -30px auto 50px;}
			
			.heading-text {display: inline-block; padding: 5px 20px; position: relative;}
				.heading-text .icon {width: 15px; height: 15px; color: #10dd63; position: absolute; transition: all 0.2s ease-out 0s;}
					/* bottom left */
					.heading-text .icon-bl {bottom: 0; left: 0;}
					.heading-text:hover .icon-bl {transform: rotate(180deg);}
					/* bottom right */
					.heading-text .icon-br {bottom: 0; right: 0;}
					.heading-text:hover .icon-br {transform: rotate(-180deg);}
					/* top left */
					.heading-text .icon-tl {top: 0; left: 0;}
					.heading-text:hover .icon-tl {transform: rotate(180deg);}
					/* top right */
					.heading-text .icon-tr {top: 0; right: 0;}
					.heading-text:hover .icon-tr {transform: rotate(-180deg);}


/*------ Mobile ------*/
.mobile header,
.mobile footer,
.mobile #main-content > * {
	background-attachment: scroll !important;
}

/*------ 1024 ------*/
@media all and (max-width: 1279px){
	
	.wrapper, .wrap {padding: 60px 20px;}
	
	h1 {}
		h1 + .sub-title {font-size: 20px; margin-top: -20px;}
	h2 {margin-bottom: 40px;}
		h2 + .sub-heading {font-size: 20px; margin: -25px auto 40px;}
	
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	
	header, footer, #main-content > * {background-attachment: scroll !important;}
	.wrapper, .wrap {padding: 55px 15px;}
	
	#skip-link {display: none;}
	
	h2 {font-size: 36px;}
	.heading-text {padding: 5px 15px;}
		.heading-text .icon {width: 12px; height: 12px;}
	
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	
	body {font-size: 15px;}
	.wrapper, .wrap {padding: 50px 15px;}
	
	h1 {font-size: 36px;}
		h1 + .sub-title {font-size: 18px;}
	h2 {font-size: 30px; margin-bottom: 35px;}
		h2 + .sub-heading {font-size: 18px; margin-bottom: 35px;}
	
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	
	.wrapper, .wrap {padding: 40px 15px;}
	
	h1 {font-size: 30px; margin-bottom: 25px;}
		h1 + .sub-title {margin: -15px auto 25px;}
	h2 {font-size: 26px; margin-bottom: 30px;}
		h2 + .sub-heading {font-size: 16px; margin: -20px auto 30px;}
	
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	
	body {font-size: 14px;}
	.wrapper,
    .wrap {
      padding: 35px 10px;
    }
	
	h1 {font-size: 28px;}
	h2 {font-size: 24px;}
	
}


/********************  CLASSES  ********************/

.clear {height: 1px; clear: both;}
.ellipsis {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.unselectable {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none;}
.screen-reader-text {clip: rect(1px, 1px, 1px, 1px); position: absolute; width: 1px; height: 1px; overflow: hidden; word-wrap: normal;}

/* Underline */
.underline {display: inline-block; line-height: 1.1; position: relative; transition: all 0.2s ease-out 0s;}
.underline:active {top: 1px;}
	.underline::after {content: ''; display: block; width: 0; height: 0; border-bottom: 1px solid; margin: 0 auto; position: absolute; left: auto; right: 0; bottom: 0; transition: inherit; transition-property: width; pointer-events: none;}
	.underline:hover::after {width: 100%; left: 0; right: auto;}

.underlined {display: inline-block; line-height: 1.1; position: relative; transition: all 0.2s ease-out 0s;}
.underlined:active {top: 1px;}
	.underlined::after {content: ''; display: block; width: 100%; height: 0; border-bottom: 1px solid; margin: 0 auto; position: absolute; left: 0; right: 0; bottom: 0; transition: inherit; transition-property: opacity, bottom; pointer-events: none;}
	.underlined:hover::after {opacity: 0; bottom: -4px;}

/* Graphics */
figure, picture {display: block; position: relative;}
	figure img, picture img {display: block; max-width: 100%; height: auto;}

[data-lazy]:not(img) {min-height: 40px;}
	[data-lazy]:not(img)::after {content: ''; display: block; width: 40px; height: 40px; border: 5px solid #10dd63; border-right-color: transparent; border-radius: 50%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 3; -webkit-animation: f-rotate 0.8s linear infinite; animation: f-rotate 0.8s linear infinite;}

.icon {display: block; background: url(../images/icons.png) -9999px 0 no-repeat; position: relative;}
svg.icon, img.icon {background: none;}

.logotype {display: inline-block; position: relative; transition: all 0.2s ease-out 0s;}
a.logotype:active {top: 1px;}
	.logotype img {display: block; max-width: 9999px; max-height: 9999px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

/* Lightbox */
.f-lightbox {display: block; position: relative; overflow: hidden; transition: all 0.3s ease-out 0s;}
.f-lightbox *, .f-lightbox ::before, .f-lightbox ::after {transition: inherit;}
	.f-lightbox img {display: block; width: 100%; height: 100%; object-fit: cover;}
	.f-lightbox .overlay {opacity: 0; visibility: hidden; display: block; width: 100%; height: 100%; background: rgba(16,221,99,0.85); margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
		.f-lightbox .overlay .icon {width: 50px; height: 50px; color: #fff; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transform: scale(3);}
.f-lightbox:hover, .tabbed .f-lightbox:focus {outline: 0;}
	.f-lightbox:hover img, .tabbed .f-lightbox:focus img {transform: scale(1.02);}
	.f-lightbox:hover .overlay, .tabbed .f-lightbox:focus .overlay {opacity: 1; visibility: visible;}
		.f-lightbox:hover .overlay .icon, .tabbed .f-lightbox:focus .overlay .icon {transform: scale(1);}
.f-lightbox:active {}
	.f-lightbox:active .overlay .icon {transition-duration: 0.1s; transform: scale(0.96);}

/* Contact links */
.contact-link {display: inline-block; font-weight: 700; font-size: 24px; line-height: 1.2; margin-left: 30px; position: relative; transition: all 0.2s ease-out 0s;}
a.contact-link:hover, .tabbed a.contact-link:focus {color: #10dd63;}
a.contact-link:active {top: 1px;}
	.contact-link .icon {outline: 0; width: 20px; height: 20px; position: absolute; left: -30px; top: 5px;}

.phone {}
	.phone .icon {}
	a.phone:hover .icon {-webkit-animation: phone-wobble 0.6s ease-in-out 1; animation: phone-wobble 0.6s ease-in-out 1;}

.email {}
	.email .icon {}
	a.email:hover .icon {-webkit-animation: email-wobble 0.6s ease-in-out 1; animation: email-wobble 0.6s ease-in-out 1;}

.location {}
	.location .icon {}
	a.location:hover .icon {-webkit-animation: location-wobble 0.6s ease-in-out 1; animation: location-wobble 0.6s ease-in-out 1;}

@media all and (max-width: 767px){
	.contact-link {font-size: 22px; margin-left: 25px;}
		.contact-link .icon {width: 18px; height: 18px; left: -25px; top: 6px;}
}

@media all and (max-width: 479px){
	.contact-link {font-size: 20px;}
		.contact-link .icon {width: 16px; height: 16px; top: 4px;}
}

/* Social links */
.social-links {display: flex; flex-wrap: wrap; align-items: flex-start; margin: 0 -5px;}
	.social-links a {flex: 0 0 auto; display: inline-block; width: 50px; height: 50px; border-radius: 50%; box-shadow: 0 0 0 1px currentColor inset; margin: 5px; position: relative; transition: all 0.2s ease-out 0s;}
	.social-links a:hover, .tabbed .social-links a:focus {box-shadow: 0 0 0 25px #10dd63 inset; color: #fff;}
	.social-links a:active {top: 1px;}
		.social-links a .icon {display: block; width: 40%; height: 40%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: inherit; transition-property: transform;}
		.social-links a:hover .icon, .tabbed .social-links a:focus .icon {transform: scale(1.15);}

@media all and (max-width: 767px){
	.social-links {margin: 0 -4px;}
		.social-links a {width: 45px; height: 45px; margin: 4px;}
}

/* Other */
.break-line {display: block;}


/********************  CONTROLS  ********************/

/*------ Close ------*/
.f-close {display: block; width: 30px; height: 30px; color: #d8d8d8; border: 2px solid transparent; border-radius: 50%; position: relative; transition: all 0.2s ease-out 0s; -webkit-touch-callout: none;}
.f-close:enabled:hover, .tabbed .f-close:focus {color: #10dd63; border-color: currentColor; transform: rotate(90deg);}
.f-close:enabled:active {color: #f00; border-color: currentColor; transform: rotate(90deg) scale(0.96);}
.f-close:disabled {opacity: 0.5;}
	.f-close::before, .f-close::after {content: ''; display: block; width: 2px; height: 100%; background: currentColor; border-radius: 4px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: inherit; transition-property: height;}
	.f-close:enabled:hover::before, .f-close:enabled:hover::after, .tabbed .f-close:focus::before, .tabbed .f-close:focus::after {height: 80%;}
		.f-close::before {transform: rotate(45deg);}
		.f-close::after {transform: rotate(-45deg);}

/*------ Arrows ------*/
.f-arrow {display: block; margin: auto 0; position: absolute; top: 0; bottom: 0; z-index: 11; transition: all 0.2s ease-out 0s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none;}
.f-arrow[class*="prev"] {left: 0; transform: translateX(2px);}
.f-arrow[class*="next"] {right: 0; transform: translateX(-2px);}
	.f-arrow::before, .f-arrow::after {content: ''; display: block; background: currentColor; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: inherit; transition-property: transform;}
	.f-arrow[class*="prev"]::before, .f-arrow[class*="prev"]::after {transform-origin: 0 50%;}
	.f-arrow[class*="next"]::before, .f-arrow[class*="next"]::after {transform-origin: 100% 50%;}
	.f-arrow[class*="prev"]::before, .f-arrow[class*="next"]::after {transform: rotate(-42deg);}
	.f-arrow[class*="prev"]::after, .f-arrow[class*="next"]::before {transform: rotate(42deg);}
/* Hover */
.f-arrow:hover, .tabbed .f-arrow:focus {transform: none;}
	.f-arrow[class*="prev"]:hover::before, .f-arrow[class*="next"]:hover::after {transform: rotate(-45deg);}
	.f-arrow[class*="prev"]:hover::after, .f-arrow[class*="next"]:hover::before {transform: rotate(45deg);}
/* Active */
.f-arrow:active {}
	.f-arrow[class*="prev"]:active::before, .f-arrow[class*="next"]:active::after {transform: rotate(-38deg);}
	.f-arrow[class*="prev"]:active::after, .f-arrow[class*="next"]:active::before {transform: rotate(38deg);}
/* Styles */
.f-arrow {width: 30px; height: 40px; color: #d8d8d8;}
.f-arrow:hover, .tabbed .f-arrow:focus {color: #10dd63;}
	.f-arrow::before, .f-arrow::after {width: 28px; height: 5px; border-radius: 4px;}
	.f-arrow::before {top: 2px;} .f-arrow::after {bottom: 2px;}
/* Disabled */
.f-arrow:disabled {color: #d8d8d8; opacity: 0.5;}
	.f-arrow[class*="prev"]:disabled {transform: translateX(2px);}
	.f-arrow[class*="next"]:disabled {transform: translateX(-2px);}
		.f-arrow[class*="prev"]:disabled::before, .f-arrow[class*="next"]:disabled::after {transform: rotate(-42deg);}
		.f-arrow[class*="prev"]:disabled::after, .f-arrow[class*="next"]:disabled::before {transform: rotate(42deg);}

/*------ Dots ------*/
.f-dots {width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: -4px auto; position: absolute; left: 0; right: 0; bottom: 0; z-index: 10;}
	.f-dots .dot {flex: 0 0 auto; display: inline-block; width: 18px; height: 18px; background: transparent; color: #d8d8d8; border: 2px solid; border-radius: 50%; margin: 4px; position: relative; transition: all 0.2s ease-out 0s; -webkit-touch-callout: none;}
	.f-dots .dot:hover, .tabbed .f-dots .dot:focus {color: #10dd63;}
	.f-dots .dot.active {color: #10dd63; cursor: default;}
		.f-dots .dot::after {content: ''; display: block; width: calc(100% - 4px); height: calc(100% - 4px); background: currentColor; border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transform: scale(0); transition: transform 0.2s ease-out 0s;}
		.f-dots .dot.active::after {transform: scale(1);}

/*------ Pagination ------*/
.f-pagination {display: flex; justify-content: flex-start; align-items: center; margin: 40px auto 0; position: relative;}
.f-pagination > * {flex: 0 0 auto; display: inline-block; height: 35px; font-size: 18px; line-height: 35px; text-align: center; position: relative; transition: all 0.2s ease-out 0s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none;}
	.f-pagination .dots {color: #000; margin: 0 5px;}
	.f-pagination .pag {min-width: 35px; border: none; border-radius: 2px; box-shadow: 0 0 0 1px #d8d8d8 inset; color: #252932; padding: 0 5px; margin: 0 3px;}
		.f-pagination a.pag:hover, .tabbed .f-pagination a.pag:focus {color: #10dd63; box-shadow: 0 0 0 1px currentColor inset;}
		.f-pagination a.pag:active {top: 1px;}
		.f-pagination .pag.active, .f-pagination .pag.current {background: #10dd63; color: #fff; box-shadow: none;}
	.f-pagination .arrow {display: inline-block; width: 35px; border: none; border-radius: 2px; box-shadow: 0 0 0 1px #d8d8d8 inset; color: #252932;}
	.f-pagination .arrow:hover, .tabbed .f-pagination .arrow:focus {color: #10dd63; box-shadow: 0 0 0 1px currentColor inset;}
		.f-pagination .prev {margin-right: 12px;}
		.f-pagination .next {margin-left: 12px;}
			.f-pagination .arrow::before, .f-pagination .arrow::after {width: 12px; height: 2px; background: currentColor; border-radius: 2px;}
			.f-pagination .arrow::before {top: 1px;} .f-pagination .arrow::after {bottom: 1px;}

/*------ Buttons ------*/
.button {display: inline-block; background: #d8d8d8; position: relative; transition: all 0.3s ease-out 0s, top 0s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; --btn-bg-pos: 0; --btn-bg-opacity: 0;}
	.button::before, .button::after {content: ''; display: block; width: 100%; height: 100%; border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: inherit;}
		.button::before {z-index: 1;}
		.button::after {opacity: 0; z-index: 2;}
	.button-text {display: block; border-radius: inherit; position: relative; z-index: 3; overflow: hidden;}
		.button-text::before {content: ''; display: block; opacity: 0; width: 150%; height: 100%; position: absolute; top: 0; left: calc(-150% / 2); z-index: -1; transform: translateX(var(--btn-bg-pos)); transition: all 0.2s ease-out 0s; pointer-events: none;}
.button:hover {top: -1px;}
	.button:hover::before {-webkit-animation: button-pulse 0.8s 0s ease-out 1; animation: button-pulse 0.8s 0s ease-out 1;}
	.button:hover::after, .tabbed .button:focus::after {opacity: 1;}
	.button:hover .button-text::before {opacity: var(--btn-bg-opacity);}
.button:active {top: 0;}
.button:disabled {opacity: 0.5; top: auto;}
	.button:disabled::before {display: none;}
	.button:disabled::after {display: none;}
	.button:disabled .button-text::before {display: none;}
	
	/* All buttons */
	.button {border-radius: 6px; font-weight: 700; font-size: 22px; line-height: 1.2; text-align: center;}
	.button:not(:disabled):hover, .tabbed .button:focus {box-shadow: 0 7px 5px rgba(0,0,0,0.1);}
	.button:active {box-shadow: none !important;}
		.button::after {border-radius: 5px;}
		.button-text {padding: 22px 14px;}
			.button-text::before {background: radial-gradient(circle at center, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0) 100%);}
	
	/* Green buttons */
	.button-green {background: #10dd63; color: #fff;}
		.button-green:after {background: rgba(0,0,0,0.15);}
	
	/* Blue buttons */
	.button-blue {background: #55cee3; color: #fff;}
		.button-blue:after {background: #10dd63;}
	
	/* Navy buttons */
	.button-navy {background: #252932; color: #fff;}
		.button-navy:after {background: #10dd63;}
	
	/* White buttons */
	.button-white {background: transparent; box-shadow: 0 0 0 1px #fff inset; color: #fff;}
		.button-white:after {background: #10dd63;}
	
	/* Grey buttons */
	.button-grey {background: #fff; box-shadow: 0 0 0 1px #d8d8d8 inset; color: #272727;}
		.button-grey:after {background: #10dd63;}
		.button-grey:not(:disabled):hover, .tabbed .button-grey:focus {color: #fff;}

.button-full {
  width: 100%;
}

/*------ 1024 ------*/
@media all and (max-width: 1279px){
	.button {font-size: 20px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	
	.f-dots {}
		.f-dots .dot {width: 20px; height: 20px;}
	
	.button {font-size: 18px;}
		.button-text {padding: 18px 12px;}
	
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	.f-pagination {justify-content: center; margin-top: 30px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	
	.f-pagination {}
	.f-pagination > * {font-size: 16px;}
		.f-pagination .pag {padding: 0 4px; margin: 0 2px;}
		.f-pagination .arrow {}
			.f-pagination .prev {margin-right: 6px;}
			.f-pagination .next {margin-left: 6px;}
	
	@media all and (max-width: 359px){
		.f-pagination > * {height: 32px; line-height: 32px;}
			.f-pagination .pag {min-width: 32px;}
			.f-pagination .arrow {width: 32px;}
	}
	
	.button {font-size: 16px;}
		.button-text {padding: 16px 12px;}
	
}


/********************  FORMS  ********************/

form {position: relative;}
	form .form-heading {font-weight: 700; font-size: 26px; line-height: 1.2; text-align: center; margin: 0 auto 30px;}
	form .privacy {margin: 20px auto 0;}
	form .submit {display: block; width: 100%; margin: 20px auto 0;}
	
	/*------ Fields ------*/
	.form-field {display: flex; flex-direction: column; width: 100%; margin: 0 auto 15px; position: relative;}
	.form-field > * {flex: 0 0 auto; order: 5; transition: all 0.2s ease-out 0s;}
		
		/* Inputs */
		.field-input {display: block; width: 100%; background: #fff; border: 1px solid #d8d8d8; border-radius: 4px; font-size: 18px; line-height: 1.2; font-family: 'Open Sans', sans-serif; padding: 18px 25px;}
		.field-input:disabled {opacity: 0.5;}
		.field-input.error {color: #f00 !important; border-color: #f00 !important; box-shadow: none !important; -webkit-animation: error-input 0.1s linear 6; animation: error-input 0.1s linear 6;}
			.field-input:enabled:hover {border-color: #10dd63;} .field-input[readonly]:hover {border-color: #d8d8d8;}
			.field-input:enabled:focus {outline: 0; border-color: #10dd63; box-shadow: 0 0 0 1px #10dd63 inset;}
		
		.field-message {height: 145px;}
		
		/* Selects */
		select {padding-right: 40px !important; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none;}
		::-ms-expand {display: none; width: 0; height: 0;}
			.select-arrow {display: block; width: 20px; height: 20px; color: #d8d8d8; margin: auto 0; position: absolute; top: 0; bottom: 0; right: 10px; transition: all 0.2s ease-out 0s; pointer-events: none;}
			.select-arrow::before {content: ''; display: block; width: 70%; height: 70%; border: 3px solid; border-top: none; border-left: none; border-radius: 2px; margin: auto; position: absolute; left: 0; right: 0; top: calc(20px / 4 * -1); bottom: 0; transform: rotate(45deg);}
				select:enabled:hover ~ .select-arrow {color: #10dd63;}
				select:enabled:focus ~ .select-arrow {color: #10dd63;}
		
		/* Checkbox & Radio */
		.chradio-field {display: flex; align-items: flex-start; position: relative; cursor: pointer; transition: all 0.2s ease-out 0s;}
		.chradio-field.disabled {cursor: not-allowed;}
			.chradio-field input {position: absolute; left: -9999px;}
			.f-chradio {flex: 0 0 auto; display: inline-block; width: 20px; height: 20px; background: #fff; color: #d8d8d8; border: 1px solid; position: relative; transition: inherit;}
				.chradio-field:hover :enabled ~ .f-chradio {color: #10dd63;}
				:focus ~ .f-chradio, :checked ~ .f-chradio {color: #10dd63;}
				.error ~ .f-chradio {color: #f00 !important; -webkit-animation: error-chradio 1s ease-in-out 1; animation: error-chradio 1s ease-in-out 1;}
				:disabled ~ .f-chradio {opacity: 0.5;}
			.f-chradio + .label {flex: 1 1 0%; font-size: 16px; line-height: 1.2; margin: 1px 0 0 10px; transition: inherit;}
			/* checkbox */
			.f-checkbox {border-radius: 2px;}
				.f-checkbox::before {content: ''; display: block; width: calc(100% - 6px); height: calc(100% - 6px); background: currentColor; border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transform: scale(0); transition: inherit; transition-property: transform;}
				:checked ~ .f-checkbox::before {transform: scale(1);}
			/* radio */
			.f-radio {border-radius: 50%;}
				.f-radio [class*="marker"] {display: block; width: calc(100% - 6px); height: 0; margin: 0 auto; position: absolute; left: 0; right: 0; overflow: hidden; transition: height 0.1s ease-out 0s; pointer-events: none;}
				.f-radio .marker-left {bottom: 3px; transition-delay: 0s;}
				.f-radio .marker-right {top: 3px; transition-delay: 0.1s;}
					.f-radio [class*="marker"]::before {content: ''; display: block; width: 50%; height: calc(20px - 8px); background: currentColor; position: absolute;}
					.f-radio .marker-left::before {border-radius: 100% 0 0 100% / 50% 0 0 50%; left: 0; bottom: 0;}
					.f-radio .marker-right::before {border-radius: 0 100% 100% 0 / 0 50% 50% 0; right: 0; top: 0;}
				:checked ~ .f-radio [class*="marker"] {height: calc(20px - 8px);}
				:checked ~ .f-radio .marker-left {transition-delay: 0.1s;}
				:checked ~ .f-radio .marker-right {transition-delay: 0s;}
		
		/* Labels & Placeholders */
		.field-label {order: 1; width: 100%; border: 1px solid transparent; font-size: 18px; line-height: 1.2; color: #272727; padding: 18px 25px; margin: 0 auto; position: absolute; left: 0; right: 0; top: 0; transform-origin: 0 100%; transition-delay: 0.1s; pointer-events: none;}
		.field-input:not(.field-search):required ~ .field-label::after {content: '*'; font-size: 50%; line-height: 0; vertical-align: super; color: #f00;}
			.field-input:not([readonly]):focus ~ .field-label {opacity: 0; transform: translateY(-10px) scale(0.9); transition-delay: 0s;}
			.field-input.completed ~ .field-label {opacity: 0; transform: translateY(-10px) scale(0.9); transition-delay: 0s;}
			.field-input.error ~ .field-label {display: none;}
		
		.js select:not(:focus):not(.completed) {color: #272727;}
		
		.field-input:-ms-input-placeholder {color: rgba(39,39,39,0); transition: none;}
		.field-input::-ms-input-placeholder {color: rgba(39,39,39,0); transition: none;}
		.field-input::-webkit-input-placeholder {color: rgba(39,39,39,0); transition: none;}
		.field-input::-moz-placeholder {color: rgba(39,39,39,0); transition: none;}
		.field-input::placeholder {color: rgba(39,39,39,0); transition: none;}
			
			.field-input.error:-ms-input-placeholder {color: #f00 !important;}
			.field-input.error::-ms-input-placeholder {color: #f00 !important;}
			.field-input.error::-webkit-input-placeholder {color: #f00 !important;}
			.field-input.error::-moz-placeholder {color: #f00 !important;}
			.field-input.error::placeholder {color: #f00 !important;}
		
		/* Icons */
		.field-icon {position: absolute; left: 10px; top: 10px; pointer-events: none;}
			.field-input:enabled:focus ~ .field-icon {color: #10dd63;}
			.field-input.error ~ .field-icon {color: #f00 !important; -webkit-animation: error-input 0.1s linear 6; animation: error-input 0.1s linear 6;}
		
		/* Clear buttons */
		.js.mobile .field-input[type="text"], .js.mobile .field-input[type="text"] ~ .field-label
		.js.mobile .field-input[type="email"], .js.mobile .field-input[type="email"] ~ .field-label
		.js.mobile .field-input[type="search"], .js.mobile .field-input[type="search"] ~ .field-label
		.js.mobile .field-input[type="password"], .js.mobile .field-input[type="password"] ~ .field-label
		.js.mobile .field-input[type="url"], .js.mobile .field-input[type="url"] ~ .field-label {
			padding-right: 40px !important;
		}
		
		.input-clear {display: none; visibility: hidden; width: 30px; height: 30px; color: #d8d8d8; margin: auto 0; position: absolute; top: 0; bottom: 0; right: 5px; transition: all 0.2s ease-out 0s;}
		.js.mobile .input-clear {display: block;}
		.field-input.completed:focus ~ .input-clear {visibility: visible;}
			.input-clear:hover {color: #10dd63;}
			.input-clear:active {color: #f00; transform: scale(0.9);}
				.input-clear::before, .input-clear::after {content: ''; display: block; width: 2px; height: 66%; background: currentColor; border-radius: 4px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition: inherit; transition-property: transform;}
				.input-clear::before {transform: rotate(45deg);}
				.input-clear::after {transform: rotate(-45deg);}
	
	/*------ Sending ------*/
	form.disabled {cursor: progress;}
	input[name="name"] {display: none !important;}
		
		form .form-loading {background: rgba(0,0,0,0.7); color: #10dd63; border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 20; opacity: 0; visibility: hidden; transition: all 0.3s ease-out 0s;}
		form.disabled .form-loading {opacity: 1; visibility: visible;}
			form .form-loading .loadbox {width: 50px; height: 50px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
				form .form-loading .loadbox::before, form .form-loading .loadbox::after {content: ''; display: block; width: 100%; margin: 0 auto; position: absolute; left: 0; right: 0;}
				form .form-loading .loadbox::before {height: 100%; background: currentColor; border-radius: 3px; top: 0; z-index: 2; -webkit-animation: cssload-animate 0.6s linear infinite; animation: cssload-animate 0.6s linear infinite;}
				form .form-loading .loadbox::after {height: 5px; background: #000; opacity: 0.15; border-radius: 50%; top: 60px; z-index: 1; -webkit-animation: cssload-shadow 0.6s linear infinite; animation: cssload-shadow 0.6s linear infinite;}


/*------ 480 ------*/
@media all and (max-width: 599px){
	form {}
		form .form-heading {font-size: 24px; margin-bottom: 25px;}
		.form-field {margin-bottom: 10px;}
			.field-input {font-size: 16px;}
			.field-label {font-size: 16px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	form {}
		form .form-heading {font-size: 20px; margin-bottom: 20px;}
		.form-field {}
			.field-input {padding: 15px;}
			.field-label {padding: 15px;}
		.chradio-field {}
			.f-chradio + .label {font-size: 15px;}
}


/********************  NAVIGATION  ********************/

#global-wrapper {padding-top: 70px;}
#navigation {flex: 0 0 auto; width: 100%; height: 70px; background: #252932; color: #fff; margin: 0 auto; position: absolute; left: 0; right: 0; top: 1px; z-index: 100; transition: background-color 0.3s ease-out 0s;}
#navigation .wrapper {display: flex; justify-content: space-between; align-items: center; height: 100%; padding-top: 0; padding-bottom: 0;}
	#navigation .callback {flex: 0 0 auto;}
		#navigation .phone {display: none; font-size: 18px; margin-left: 25px;}
		#navigation .phone:nth-of-type(1) {display: inline-block;}
		#navigation .phone:nth-of-type(2) {display: inline-block;}
			#navigation .phone .icon {width: 15px; height: 15px; left: -25px; top: 3px;}
	#navigation .social-links {display: none;}
	
	/*------ Logo ------*/
	#navigation .logo-wrap {flex: 0 0 auto; display: flex; flex-direction: column; justify-content: center; height: 100%; line-height: 0; position: relative;}
		#navigation .logotype {flex: 0 0 auto;}
		#navigation .logo-1 {}
			#navigation .logo-1 img {max-width: 140px; max-height: 50px;}
		#navigation .logo-2 {display: none; width: 100%; min-height: 100%; background: #000; padding: 25px 0; margin: 0 auto; position: absolute; left: 0; right: 0; top: 0; transform-origin: 0% 0%;}
			#navigation .logo-2 img {max-width: 60%; margin: 0 auto; position: relative;}
			#navigation .logo-2:active img {top: 1px;}
	
	/*------ Menu ------*/
	#navigation .menu {flex: 1 1 0%; margin: 0 10px;}
	#navigation .menu-container {}
		#navigation .menu-item {display: block; font-weight: 700; font-size: 13px; text-transform: uppercase; line-height: 1.2; position: relative; perspective: 1600px;}
			#navigation .menu-item > a {display: block; position: relative; transition: all 0.2s ease-out 0s;}
				#navigation .menu-item > a:hover, #navigation .menu-item:hover > a, .tabbed #navigation .menu-item > a:focus {color: #10dd63; outline-color: #10dd63;}
				#navigation .menu-item > a:active {top: 1px;}
				#navigation .menu-item > a.active:not([data-jump]) {color: #10dd63; top: auto;}
					#navigation .menu-item > a .icon {width: 8px; height: 8px; color: #5c626f; margin: auto; position: absolute;}
					#navigation .menu-item > a:hover .icon, #navigation .menu-item:hover > a .icon {color: currentColor;}
		/* Top menu */
		#navigation .top-menu {display: flex; justify-content: center; }
			#navigation .top-menu-item {flex: 0 1 auto; text-align: center; min-width: 1px;}
				#navigation .top-menu-item::before {content: ''; display: block; width: 5px; height: 5px; background: #10dd63; border-radius: 50%; margin: auto 0; position: absolute; top: 0; bottom: 0; left: -2px;}
					#navigation .top-menu-item:first-child::before {display: none;}
				#navigation .top-menu-item > a {display: flex; flex-direction: column; justify-content: center; height: 70px; padding: 0 15px;}
					#navigation .top-menu-item > a .icon {left: 0; right: 0; top: auto; bottom: 10px;}
		/* Sub-menus */
		#navigation .sub-menu {opacity: 0; visibility: hidden; width: 100%; min-width: 180px; background: #252932; padding: 5px 0; position: absolute; top: 0; left: 100%; transform-origin: 0 50%; transform: rotateY(30deg); transition: all 0.2s ease-out 0s;}
		#navigation .top-menu-item > .sub-menu {top: 100%; left: 0; transform-origin: 50% 0; transform: rotateX(-30deg);}
		#navigation .menu-item:hover > .sub-menu {opacity: 1; visibility: visible; transform: none;}
			#navigation .back-item {display: none;}
			#navigation .sub-menu-item {font-weight: 400; text-align: left; text-transform: none;}
				#navigation .sub-menu-item > a {padding: 8px 10px; padding-right: 25px;}
					#navigation .sub-menu-item > a .icon {top: 0; bottom: 0; left: auto; right: 10px; transform: rotate(-90deg);}
	
	/*------ Nav button ------*/
	#nav-button {flex: 0 0 auto; display: none; width: 36px; height: 36px; border-radius: 50%; color: #fff; position: relative; transition: all 200ms ease-out 0s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
	#nav-button > * {transition-duration: inherit; transition-timing-function: inherit;}
		#nav-button [class*="circle"] {display: block; width: 50%; height: 0; position: absolute; overflow: hidden; transition-property: height;}
			#nav-button .circle-left {left: 0; bottom: 0; transition-delay: 0ms;}
			#nav-button .circle-right {right: 0; top: 0; transition-delay: 200ms;}
				#nav-button [class*="circle"]::before {content: ''; display: block; width: 100%; height: 36px; border: 2px solid; position: absolute;}
				#nav-button .circle-left::before {border-right: none; border-radius: 100% 0 0 100% / 50% 0 0 50%; left: 0; bottom: 0;}
				#nav-button .circle-right::before {border-left: none; border-radius: 0 100% 100% 0 / 0 50% 50% 0; right: 0; top: 0;}
		#nav-button [class*="line"] {display: block; width: 90%; height: 3px; background: currentColor; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; transition-property: width, top, opacity, transform; transition-delay: 0ms, 200ms, 200ms, 0ms;}
			#nav-button .line-top {top: -18px;}
			#nav-button .line-middle {}
			#nav-button .line-bottom {top: 18px;}
	#nav-button:hover {color: #10dd63;}
	#nav-button.active {color: #10dd63;}
		#nav-button.active [class*="circle"] {height: 100%;}
			#nav-button.active .circle-left {transition-delay: 200ms;}
			#nav-button.active .circle-right {transition-delay: 0ms;}
		#nav-button.active [class*="line"] {width: 65%; top: 0; transition-delay: 200ms, 0ms, 0ms, 200ms;}
			#nav-button.active .line-top {transform: rotate(-45deg);}
			#nav-button.active .line-middle {opacity: 0;}
			#nav-button.active .line-bottom {transform: rotate(45deg);}


/*------ >= 1024 ------*/
@media all and (min-width: 1024px){
	#navigation.fixed {}
		#navigation.fixed .logo-2 {transform: scale(0);}
		#navigation .menu {transform: none !important;}
			#navigation .top-menu {transform: none !important;}
}

/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#navigation {}
		#navigation .logo-wrap {}
			#navigation .logo-1 {}
				#navigation .logo-1 img {max-width: 130px;}
		#navigation .callback {}
			#navigation .phone {font-size: 16px; margin: 0;}
				#navigation .phone .icon {display: none;}
		#navigation .menu {}
			#navigation .menu-item {font-size: 11px;}
				#navigation .top-menu-item::before {display: none;}
				#navigation .top-menu-item > a {padding: 0 5px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#global-wrapper {padding-top: 60px;}
	#navigation {height: 60px; position: fixed; top: 0;}
		#navigation .menu {display: flex; flex-direction: column; width: 100%; max-width: 400px; height: calc(100vh - 50px); background: #252932; padding: 20px 15px; margin: 0; position: absolute; top: 100%; right: 0; overflow: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; transform: translateX(100%); transition: transform 0.3s ease-out 0s;}
		#navigation .menu.drag {transition-duration: 0.1s;}
		#navigation .menu.active {transform: none;}
			#navigation .menu-container {flex: 1 0 auto; width: 100%; max-width: 400px; margin: 0 auto; position: relative; overflow: hidden;}
				#navigation .top-menu {display: block; width: 100%; margin: 0; transform: translateX(0); transition: transform 0.2s ease-out 0s;}
				#navigation .sub-menu {display: none; opacity: 1; visibility: visible; width: 100%; min-width: 1px; background: none; top: 0 !important; left: 100% !important; transform: none !important;}
				#navigation .sub-menu[data-fnav-visible] {display: block;}
					/* menu items */
					#navigation .menu-item {font-size: 14px; text-align: center; margin: 0 auto 5px; position: static; perspective: none;}
					#navigation .menu-item:last-child {margin-bottom: 0;}
						#navigation .menu-item > a {display: block; height: auto; border: 1px solid; padding: 10px 20px;}
							#navigation .menu-item > a .icon {color: #fff; top: 0; bottom: 0; left: auto; right: 10px; transform: rotate(-90deg);}
					/* back item */
					#navigation .back-item {display: block; font-size: 16px; text-align: left; text-transform: uppercase; margin-bottom: 15px; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
					#navigation .back-item:hover {color: #10dd63;}
					#navigation .back-item:active {top: 1px;}
						#navigation .back-item .icon {display: inline-block; vertical-align: middle; width: 20px; height: 20px; margin: -4px 8px 0 0; transform: translateX(2px); transition: transform 0.2s ease-out 0s;}
						#navigation .back-item:hover .icon {transform: none;}
					/* animation */
					#navigation .top-menu-item {opacity: 0; transform: translateY(8px);}
					#navigation .menu.active .top-menu-item {opacity: 1; transform: none; transition: all 0.3s ease-out 0s;}
						#navigation .top-menu-item::before {display: none;}
		#nav-button {display: inline-block;}
		#navigation .logo-wrap {width: 36px; height: auto; overflow: visible;}
		#navigation .social-links {flex: 0 0 auto; display: flex; justify-content: center; margin-top: 20px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#navigation {}
		#navigation .logo-1 {}
			#navigation .logo-1 img {max-width: 135px; max-height: 45px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#navigation {}
		#navigation .callback {order: 1;}
			#navigation .callback .break-line {display: none;}
			#navigation .phone {display: none !important; width: 36px; height: 36px; border: 2px solid; border-radius: 50%; font-size: 0; margin: 0;}
			#navigation .phone:first-child {display: block !important;}
				#navigation .phone .icon {display: block; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
		#navigation .logo-wrap {order: 2; flex: 0 0 auto; width: auto; margin: 0 15px;}
			#navigation .logo-1 {}
				#navigation .logo-1 img {max-width: 150px;}
		#nav-button {order: 3;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#navigation {}
		#navigation .menu {max-width: 375px; padding-left: 10px; padding-right: 10px;}
}


/********************  BREADCRUMBS  ********************/

#breadcrumbs {margin-bottom: -72px; position: relative; z-index: 3;}
#breadcrumbs .wrapper {padding-top: 20px; padding-bottom: 20px;}
	#breadcrumbs .bc-trail {display: flex; flex-wrap: wrap; align-items: flex-start;}
		#breadcrumbs .bc-item {flex: 0 0 auto; line-height: 1.1; margin: 8px 0;}
		#breadcrumbs .bc-item > span {font-weight: bold; font-size: 15px;}
			#breadcrumbs .bc-item a {color: #27c6de; font-weight: bold; font-size: 15px;}
		#breadcrumbs .bc-separator {flex: 0 0 auto; line-height: 1.1; color: #cacaca; margin: 8px 10px; font-size: 15px;}
			#breadcrumbs .bc-separator:last-child {display: none;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#breadcrumbs {margin-bottom: -50px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#breadcrumbs {margin-bottom: -45px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#breadcrumbs {margin-bottom: -40px;}
	#breadcrumbs .wrapper {padding-top: 15px; padding-bottom: 15px;}
		#breadcrumbs .bc-trail {}
			#breadcrumbs .bc-item {margin: 5px 0;}
			#breadcrumbs .bc-separator {margin: 5px 8px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#breadcrumbs {margin-bottom: -30px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#breadcrumbs {margin-bottom: -25px;}
}


/********************  PRICES  ********************/

#prices {background: #f5f5f5;}
#prices .wrapper {}
	#prices .for-business {display: none; max-width: 90%; text-align: center; margin: 0 auto 40px;}
		#prices .for-business p {}
		#prices .for-business .offer {font-weight: 700; font-size: 130%; line-height: 1.2; margin-top: 1em; margin-bottom: 1em;}
			#prices .for-business .offer span {display: inline-block; background: #55cee3; border-radius: 4px; color: #fff; padding: 15px 30px;}
	#prices .items {display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto -25px;}
		#prices .item {flex: 0 0 auto; display: flex; flex-direction: column; width: calc((100% - 25px * 3) / 4 - 1px); background: #fff; padding: 55px 35px; margin: 0 0 25px 25px; transition: all 0.2s ease-out 0s;}
		@media all and (min-width: 1024px){ #prices .item:nth-child(4n+1) {margin-left: 0;} }
    #prices .item:hover {box-shadow: 0 16px 20px rgba(0,0,0,0.06); transform: translateY(-3px);}
    #prices .item .content {flex: 1 0 auto; border-bottom: 1px solid #d8d8d8;}
    #prices .item .description {margin-bottom: 30px; font-size: 15px; font-weight: 300;}
			#prices .item .title {font-weight: 700; font-size: 30px; line-height: 1.2; font-family: Roboto, sans-serif; padding: 30px 0; margin: -40px 0 0; word-wrap: break-word;}
			#prices .item .price {flex: 0 0 auto; font-weight: 700; font-size: 20px; line-height: 1.2; color: #55cee3; text-align: center; margin: 40px 0;}
			#prices .item .button {flex: 0 0 auto; display: block; width: 100%; margin: 0 auto;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#prices {}
		#prices .items {margin-bottom: -15px;}
			#prices .item {width: calc((100% - 15px * 3) / 4 - 1px); padding: 35px 20px; margin: 0 0 15px 15px;}
				#prices .item .title {font-size: 24px; padding: 20px 0; margin-top: -30px;}
				#prices .item .price {font-size: 18px; margin: 30px 0;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#prices {}
		#prices .items {}
			#prices .item {width: calc((100% - 15px) / 2 - 1px);}
			#prices .item:nth-child(2n+1) {margin-left: 0;}
				#prices .item .title {display: flex; flex-direction: column; justify-content: center; text-align: center;}
					#prices .item .title .break-line {display: none;}
				#prices .item .price {margin: 25px 0;}
				#prices .item .button {max-width: 240px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#prices {}
		#prices .for-business {margin-bottom: 30px;}
			#prices .for-business .offer {font-size: 120%; margin-top: 1em; margin-bottom: 1em;}
				#prices .for-business .offer span {padding: 10px 20px;}
		#prices .items {margin-bottom: -10px;}
			#prices .item {width: calc((100% - 10px) / 2 - 1px); padding: 30px 15px; margin: 0 0 10px 10px;}
				#prices .item .title {font-size: 20px; padding: 15px 0; margin-top: -25px;}
				#prices .item .actions-label + .content {margin-top: 15px;}
				#prices .item .price {font-size: 16px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#prices {}
		#prices .items {}
			#prices .item {padding: 25px 10px;}
        #prices .item .title {font-size: 18px; padding: 10px 0; margin-top: -20px;}
        #prices .item .actions-label + .content {margin-top: 15px;}
				#prices .item .button {max-width: 200px;}
}


/********************  CMS  ********************/

#assortment-cms {}
#assortment-cms .wrapper {}
	#assortment-cms .items {display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto -40px;}
		#assortment-cms .item {flex: 0 0 auto; display: block; width: calc((100% - 25px * 3) / 4 - 1px); text-align: center; margin: 0 0 40px 25px;}
		@media all and (min-width: 768px){ #assortment-cms .item:nth-child(4n+1) {margin-left: 0;} }
			#assortment-cms .item .icon-container {width: 140px; height: 140px; background: #fff; border-radius: 50%; box-shadow: 0 8px 20px rgba(0,0,0,0.05); padding: 35px; margin: 0 auto; position: relative;}
				#assortment-cms .item .icon {width: auto; height: auto; max-width: 70px; max-height: 70px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
				#assortment-cms .item:hover .icon {-webkit-animation: buzz-out 0.75s linear 1; animation: buzz-out 0.75s linear 1;}
			#assortment-cms .item .separator {width: 4px; height: 16px; border-radius: 4px; background: #10dd63; margin: 15px auto 10px;}
			#assortment-cms .item .title {font-weight: 700; font-size: 115%; line-height: 1.2; transition: all 0.2s ease-out 0s;}
				#assortment-cms a.item:hover .title {color: #10dd63;}
			#assortment-cms .item .description {font-size: 115%; padding: 0 15px;}
			#assortment-cms .item .title + .description {font-size: 100%; margin-top: 15px;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#assortment-cms {}
		#assortment-cms .items {max-width: 1000px; margin-bottom: -30px;}
			#assortment-cms .item {width: calc((100% - 15px * 3) / 4 - 1px); padding: 0 10px; margin: 0 0 30px 15px;}
				#assortment-cms .item .icon-container {width: 130px; height: 130px;}
				#assortment-cms .item .title {font-size: 110%;}
				#assortment-cms .item .description {padding: 0;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#assortment-cms {}
		#assortment-cms .items {max-width: 800px;}
			#assortment-cms .item {}
				#assortment-cms .item .icon-container {width: 100px; height: 100px;}
					#assortment-cms .item .icon {max-width: 45px; max-height: 45px;}
				#assortment-cms .item .title {font-size: 100%;}
				#assortment-cms .item .title + .description {margin-top: 10px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#assortment-cms {}
		#assortment-cms .items {}
			#assortment-cms .item {width: calc((100% - 15px * 2) / 3 - 1px); padding: 0;}
			@media all and (min-width: 600px){ #assortment-cms .item:nth-child(3n+1) {margin-left: 0;} }
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#assortment-cms {}
		#assortment-cms .items {margin-bottom: -20px;}
			#assortment-cms .item {width: calc((100% - 20px) / 2 - 1px); margin: 0 0 20px 20px;}
			#assortment-cms .item:nth-child(2n+1) {margin-left: 0;}
}


/********************  DEVELOPMENT  ********************/

#development {}
#development .wrapper {}
	#development .items {display: flex; flex-wrap: wrap; margin: 0 auto -30px;}
		#development .grid-item {flex: 0 0 auto; border: 1px solid #d8d8d8; margin: 0 0 30px 30px;}
			#development .item {padding: 20px 30px; position: relative;}
				#development .item .counter {display: inline-block; width: 2ch; font-weight: 700; font-size: 72px; line-height: 1; color: #10dd63; margin-bottom: 10px;}
					.is-ie #development .item .counter {width: 2.5ch;}
				#development .item .content {}
					#development .item .title {font-weight: 700; font-size: 115%; line-height: 1.4;}
					#development .item .description {}
					#development .item .title + .description {margin-top: 10px;}
		@media all and (min-width: 1024px){
			#development .grid-item-big {flex: 0 0 auto; width: calc((100% - 30px * 2) / 3 - 1px); margin-left: 0;}
				#development .grid-item-big .item {}
			#development .grid-item-medium {display: flex; flex-direction: column; width: calc(100% - 30px - ((100% - 30px * 2) / 3 - 1px)); border: none;}
				#development .grid-item-medium .item {flex: 1 0 auto; display: flex; align-items: center; width: 100%; border: 1px solid #d8d8d8; margin-bottom: 15px;}
				#development .grid-item-medium .item:last-child {margin-bottom: 0;}
					#development .grid-item-medium .item .counter {flex: 0 0 auto; margin: 0 20px 0 0;}
					#development .grid-item-medium .item .content {flex: 1 1 0%;}
			#development .grid-item-regular {width: calc((100% - 30px * 2) / 3 - 1px);}
			#development .grid-item-regular:nth-child(5n+3) {margin-left: 0;}
				#development .grid-item-regular .item {}
		}


/*------ 1024 ------*/
@media all and (max-width: 1279px) and (min-width: 1024px){
	#development {}
		#development .items {margin-bottom: -15px;}
			#development .grid-item {margin: 0 0 15px 15px;}
				#development .grid-item-big {width: calc((100% - 15px * 2) / 3 - 1px); margin-left: 0;}
				#development .grid-item-medium {width: calc(100% - 15px - ((100% - 15px * 2) / 3 - 1px));}
				#development .grid-item-regular {width: calc((100% - 15px * 2) / 3 - 1px);}
					#development .grid-item-medium .item {margin-bottom: 10px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#development {}
		#development .items {}
			#development .grid-item {display: block; width: 100%; border: none; margin: 0;}
				#development .item {display: flex; align-items: center; border: 1px solid #d8d8d8; padding: 20px; margin-bottom: 15px;}
					#development .item .counter {flex: 0 0 auto; font-size: 50px; text-align: center; margin: 0 30px 0 0;}
					#development .item .content {flex: 1 1 0%;}
						#development .item .title {font-size: 105%;}
						#development .item .title + .description {margin-top: 5px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#development {}
		#development .items {margin-bottom: -10px;}
			#development .item {flex-wrap: wrap; text-align: center; margin-bottom: 10px;}
				#development .item .counter {flex: 0 0 auto; width: 100%; font-size: 45px; margin: 0 0 15px;}
				#development .item .content {flex: 0 0 auto; width: 100%;}
}


/********************  SERVICES  ********************/

#services {}
#services .wrapper {}
	#services .items {display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto -25px;}
	#services .items ~ .items {margin-top: 100px;}
		#services .item {flex: 1 1 0%; display: block; min-width: calc((100% - 25px * 3) / 4 - 1px); background-color: #252932; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; text-align: center; margin: 0 0 25px 25px; position: relative;}
		@media all and (min-width: 1280px){ #services .item:nth-child(4n+1) {margin-left: 0;} }
			#services .item::before {content: ''; display: block; padding-top: 300px;}
			#services .item .content {display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100%; background: rgba(37,41,50,0.7); padding: 35px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden;}
				#services .item .title {flex: 0 0 auto; display: inline-flex; flex-direction: column; justify-content: center; width: 100%; max-width: 330px; min-height: 70px; padding: 15px; margin: 0 auto; position: relative; transition: all 0.35s ease-out 0s;}
					#services .item .overlay {width: 100%; height: 100%; background: #fff; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; transition: inherit;}
					#services .item .service-name {flex: 0 0 auto; display: block; font-weight: 700; font-size: 105%; line-height: 1.2; font-family: 'Open Sans', sans-serif; text-transform: uppercase; margin: 0; position: relative; z-index: 2; transition: inherit; transition-property: transform;}
						#services .item:active .service-name {transform: scale(0.98);}
		#services .item:hover, .tabbed #services .item:focus {outline: 0;}
			#services .item:hover .title, .tabbed #services .item:focus .title {color: #fff;}
				#services .item:hover .overlay, .tabbed #services .item:focus .overlay {background: rgba(16,221,99,0.85); transform: scale(6);}
	#services .view-button {display: block; width: 100%; max-width: 360px; margin: 40px auto 0;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#services {}
		#services .items {margin-bottom: -15px;}
		#services .items ~ .items {margin-top: 60px;}
			#services .item {min-width: calc((100% - 15px * 2) / 3 - 1px); margin: 0 0 15px 15px;}
			@media all and (min-width: 768px){ #services .item:nth-child(3n+1) {margin-left: 0;} }
				#services .item::before {padding-top: 260px;}
				#services .item .content {padding: 25px;}
					#services .item .title {}
						#services .item .service-name {font-size: 100%;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#services {}
		#services .items {margin-bottom: -10px;}
		#services .items ~ .items {margin-top: 10px;}
			#services .item {min-width: calc((100% - 10px * 2) / 3 - 1px); margin: 0 0 10px 10px;}
				#services .item::before {padding-top: 240px;}
				#services .item .content {padding: 15px;}
					#services .item .title {}
						#services .item .service-name {font-size: 95%;}
		#services .view-button {max-width: 300px; margin-top: 30px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#services {}
		#services .items {}
			#services .item {min-width: calc((100% - 10px) / 2 - 1px);}
			@media all and (min-width: 480px){ #services .item:nth-child(2n+1) {margin-left: 0;} }
				#services .item::before {padding-top: 220px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#services {}
		#services .items {}
			#services .item {}
				#services .item .title {min-height: 65px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#services {}
		#services .items {}
			#services .item {flex: 0 0 auto; width: 100%; margin: 0 auto 10px;}
				#services .item::before {min-height: 200px; padding-top: 60%;}
				#services .item .content {padding: 25px;}
					#services .item .title {min-height: 60px;}
		#services .view-button {max-width: 240px; margin-top: 20px;}
}


/********************  TESTIMONIALS  ********************/

#testimonials {}
#testimonials .wrapper {}
	#testimonials .items {display: flex; flex-wrap: wrap; justify-content: center; max-width: 1060px; margin: 0 auto -35px;}
		#testimonials .item {flex: 0 0 auto; width: calc((100% - 35px * 2) / 3 - 1px); background: #fff; border: 1px solid #d8d8d8; text-align: center; padding: 50px 25px; margin: 0 0 35px 35px;}
		@media all and (min-width: 1024px){ #testimonials .item:nth-child(3n+1) {margin-left: 0;} }
			#testimonials .item .logo {height: 60px; margin: 0 auto 20px; position: relative;}
				#testimonials .item .logo img {display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
			#testimonials .item .author {font-weight: 700; font-size: 125%; line-height: 1.2; margin: 0 auto 30px;}
			#testimonials .item .content-excerpt {}
			#testimonials .item .content-full {display: none;}
			#testimonials .item .view-all-link {color: #10dd63; margin: 20px 0 0;}
			#testimonials .item .quotes-icon {width: 40px; height: 40px; background: #10dd63; border-radius: 50%; color: #fff; margin: 35px auto 0; position: relative;}
				#testimonials .item .quotes-icon .icon {width: 30%; height: 30%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
	#testimonials .show-more-button {display: block; width: 100%; max-width: 220px; margin: 50px auto 0;}
	#testimonials .show-more-button:disabled {opacity: 1;}
		#testimonials .show-more-button .button-text::after {content: ''; display: none; vertical-align: middle; width: 20px; height: 20px; border: 3px solid; border-right-color: transparent; border-radius: 50%; margin-left: 10px; -webkit-animation: f-rotate 0.8s linear infinite; animation: f-rotate 0.8s linear infinite;}
		#testimonials .show-more-button.progress .button-text::after {display: inline-block;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#testimonials {}
		#testimonials .items {margin-bottom: -25px;}
			#testimonials .item {margin: 0 0 25px 25px;}
		#testimonials .show-more-button {margin-top: 40px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#testimonials {}
		#testimonials .items {margin-bottom: -15px;}
			#testimonials .item {width: 100%; padding: 30px 20px; margin: 0 auto 15px;}
				#testimonials .item .author {margin-bottom: 20px;}
				#testimonials .item .view-all-link {margin-top: 15px;}
				#testimonials .item .quotes-icon {margin-top: 15px;}
		#testimonials .show-more-button {margin-top: 30px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#testimonials {}
		#testimonials .items {}
			#testimonials .item {padding: 20px 15px;}
				#testimonials .item .logo {height: 55px; margin-bottom: 15px;}
				#testimonials .item .author {font-size: 115%; margin-bottom: 15px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#testimonials {}
		#testimonials .show-more-button {max-width: 200px;}
			#testimonials .show-more-button .button-text::after {width: 18px; height: 18px;}
}


/********************  FEEDBACK  ********************/

#feedback {flex: 0 0 auto; width: 100%;}
#feedback .wrapper {max-width: 100%; padding: 0;}
	#feedback h2 {display: none;}
	#feedback .contacts {display: none;}
	#feedback form {background: #10dd63;}
		#feedback form .form-content {max-width: 670px; padding: 45px 20px; margin: 0 auto;}
			#feedback form .form-heading {font-size: 40px; font-family: Roboto, sans-serif; color: #fff;}
			#feedback form .fields-row {display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; margin: 0 auto;}
				#feedback form .form-field {flex: 1 1 0%; margin-left: 25px; margin-right: 0;}
				#feedback form .form-field:nth-of-type(2n+1) {margin-left: 0;}
				#feedback form .form-field:last-of-type {flex: 0 0 100%; margin-left: 0;}
					#feedback form .field-input {border-color: #10dd63;}
					#feedback form .field-input:enabled:hover {border-color: #252932;} #feedback form .field-input[readonly]:hover {border-color: #10dd63;}
					#feedback form .field-input:enabled:focus {border-color: #252932; box-shadow: 0 0 0 1px #252932 inset;}
				#feedback form .f-chradio {color: #10dd63;}
					#feedback form .chradio-field:hover :enabled ~ .f-chradio {color: #252932;}
					#feedback form :focus ~ .f-chradio, #feedback form :checked ~ .f-chradio {color: #252932;}
			#feedback form .submit-row {margin: 5px auto 0;}
				#feedback form .privacy {margin-top: 0;}
				#feedback form .submit {max-width: 220px;}
					#feedback form .submit::before {display: none;}
					#feedback form .submit::after {background: #000;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#feedback {}
		#feedback form {}
			#feedback form .form-field {margin-left: 15px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#feedback {}
		#feedback form {}
			#feedback form .form-content {padding: 40px 15px;}
				#feedback form .form-heading {font-size: 36px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#feedback {}
		#feedback form {}
			#feedback form .form-heading {font-size: 34px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#feedback {}
		#feedback form {}
			#feedback form .form-heading {font-size: 30px;}
			#feedback form .form-field {margin-left: 10px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#feedback {}
		#feedback form {}
			#feedback form .form-content {padding: 30px 10px;}
				#feedback form .form-heading {font-size: 28px;}
				#feedback form .form-field {flex: 0 0 100%; width: 100%; margin: 0 auto 5px;}
				#feedback form .submit {max-width: 200px;}
}


/********************  FOOTER  ********************/

footer {flex: 0 0 auto; width: 100%; background: #15181e; color: #fff;}
footer .wrapper {display: flex; justify-content: space-between; align-items: flex-start; padding-top: 30px; padding-bottom: 30px;}
	/* Info */
	footer .info {flex: 0 1 auto; font-size: 14px; color: #a6a9af;}
		footer .info > * {margin-bottom: 10px;}
		footer .info > :last-child {margin-bottom: 0;}
			footer .logotype {}
				footer .logotype img {max-width: 80px; max-height: 100px;}
			footer .copyright {}
			footer .protected {}
			footer .requisites {}
			footer .privacy {}
	/* Menu */
	footer .menu-container {flex: 1 1 0%; display: flex; flex-wrap: wrap; margin: 0 60px;}
		footer .menu {flex: 0 0 auto; margin-right: 80px;}
		footer .menu:last-child {margin-right: 0;}
			footer .top-menu {}
			footer .sub-menu {margin: 20px 0;}
				footer .menu-item {}
				footer .top-menu-item:not(:last-child) {margin-bottom: 10px;}
				footer .sub-menu-item {color: #a6a9af; margin-bottom: 3px;}
					footer .menu-item > a {position: relative; transition: all 0.2s ease-out 0s;}
					footer .menu-item > a:hover, .tabbed footer .menu-item > a:focus {color: #10dd63; outline-color: #10dd63;}
					footer .menu-item > a:active {top: 1px;}
						footer .top-menu-item > a {font-weight: 700;}
						footer .sub-menu-item > a {font-size: 90%;}
		footer .menu:first-child {}
			footer .menu:first-child .top-menu {display: flex; flex-wrap: wrap;}
				footer .menu:first-child .top-menu-item {flex: 0 0 auto; margin-right: 75px;}
				footer .menu:first-child .top-menu-item:last-child {margin-right: 0;}
	/* Callback */
	footer .callback {flex: 0 0 auto; text-align: right;}
		footer .callback .phone {font-size: 20px; margin-left: 20px;}
			footer .callback .phone .icon {width: 15px; height: 15px; left: -20px; top: 5px;}
		footer .callback-button {font-size: 18px; margin: 20px 0 0;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	footer {}
		footer .menu-container {margin: 0 40px;}
			footer .menu {margin-right: 40px;}
				footer .menu:first-child .top-menu-item {margin-right: 40px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	footer .wrapper {padding-top: 20px; padding-bottom: 20px;}
		footer .info {margin-right: 15px;}
			footer .protected {display: none;}
			footer .requisites {display: none;}
		footer .menu-container {display: none;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	footer {}
		footer .logotype {}
			footer .logotype img {max-width: 65px; max-height: 75px;}
}

/*------ 425 ------*/
@media all and (max-width: 479px){
	footer {}
		footer .info {font-size: 13px;}
		footer .callback {}
			footer .callback .phone {font-size: 18px;}
				footer .callback .phone .icon {top: 4px;}
			footer .callback-button {font-size: 16px; margin-top: 15px;}
}

/*------ 360 ------*/
@media all and (max-width: 424px){
	footer {}
		footer .info {font-size: 11px; margin-right: 10px;}
		footer .callback {}
			footer .callback .phone {font-size: 15px; margin-left: 18px;}
				footer .callback .phone .icon {width: 12px; height: 12px; left: -18px;}
			footer .callback-button {font-size: 14px; margin-top: 10px;}
				footer .callback-button .button-text {padding: 15px 10px;}
}

/*------ 320 ------*/
@media all and (max-width: 359px){
	footer {}
		footer .info {width: 100%; font-size: 13px; text-align: center;}
		footer .callback {display: none;}
}


/********************  PAGE CONTENT  ********************/

#page-content {}
#page-content .wrapper {}


/********************  NO CONTENT  ********************/

#no-content {background-color: #252932; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; color: #fff; position: relative; overflow: hidden;}
	#no-content::before {content: ''; display: block; width: 100%; height: 100%; background: rgba(37,41,50,0.85); margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1;}
#no-content .wrapper {padding-top: 250px; padding-bottom: 250px; z-index: 2;}
	#no-content h1 {font-size: 72px; text-align: center; text-transform: none; margin: 0 0 20px;}
		#no-content h1 b {color: #10dd63;}
	#no-content h1 + .sub-title {max-width: 80%; text-align: center; margin: 0 auto;}

/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#no-content .wrapper {padding-top: 200px; padding-bottom: 200px;}
		#no-content h1 {font-size: 66px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#no-content .wrapper {padding-top: 150px; padding-bottom: 150px;}
		#no-content h1 {font-size: 56px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#no-content .wrapper {padding-top: 120px; padding-bottom: 120px;}
		#no-content h1 {margin-bottom: 15px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#no-content {}
		#no-content h1 {font-size: 50px; margin-bottom: 10px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#no-content {}
		#no-content h1 {font-size: 46px;}
		#no-content h1 + .sub-title {max-width: 100%; font-size: 16px;}
}


/********************  404 PAGE  ********************/

#page-404 {background-color: #252932; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; text-align: center; color: #fff; position: relative; overflow: hidden;}
	#page-404::before {content: ''; display: block; width: 100%; height: 100%; background: rgba(37,41,50,0.85); margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1;}
#page-404 .wrapper {padding-top: 150px; padding-bottom: 150px; z-index: 2;}
	#page-404 .status {font-weight: 700; font-size: 300px; line-height: 1; font-family: Roboto, sans-serif; margin-bottom: 20px;}
	#page-404 h1 {text-align: center; margin-bottom: 15px;}
	#page-404 .back-link {color: #10dd63;}


/*------ 1024 ------*/
@media all and (max-width: 1279px){
	#page-404 .wrapper {padding-top: 100px; padding-bottom: 100px;}
}

/*------ 768 ------*/
@media all and (max-width: 1023px){
	#page-404 .wrapper {padding-top: 80px; padding-bottom: 80px;}
		#page-404 .status {font-size: 280px;}
}

/*------ 600 ------*/
@media all and (max-width: 767px){
	#page-404 {}
		#page-404 .status {font-size: 230px; margin-bottom: 10px;}
		#page-404 h1 {margin-bottom: 10px;}
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	#page-404 {}
		#page-404 .status {font-size: 200px;}
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	#page-404 {}
		#page-404 .status {font-size: 160px;}
}


/********************  MODAL WINDOWS  ********************/

body, #navigation {width: 100%; width: 100vw;}

[id^="f-overlay-modal"] {display: none; width: 100%; height: 100%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.8); z-index: 1000;}
[id^="f-modals"] {display: none; flex-direction: column; justify-content: space-between; width: 100%; height: 100%; margin: auto; position: fixed; left: 0; right: 0; top: 0; bottom: 0; overflow: auto; -webkit-transform: translateZ(0); -webkit-overflow-scrolling: touch; z-index: 1001;}
	[id^="f-modals"]::before, [id^="f-modals"]::after {content: ''; display: block; flex: 0 0 auto; width: 100%; height: 45px;}

/* html {overflow: hidden;} #f-overlay-modal {display: block;} #f-modals {display: flex;} .f-modal {transform: none !important;} /* для отладки */

/* Animations */
.f-modal {transform: translate(0, 20px); transition: transform 0.4s ease-out 0s;}
.f-modal.active {transform: translate(0, 0);}
.f-modal.switch-out.rtl, .f-modal.switch-in.ltr {transform: translate(-30px, 0);}
.f-modal.switch-in.rtl, .f-modal.switch-out.ltr {transform: translate(30px, 0);}
	
	/* All modals */
	.f-modal {display: none; flex: 0 0 auto; width: 95%; min-width: 300px; background: #fff; border-radius: 6px; margin: 0 auto; position: relative;}
		.f-modal .close-button {position: absolute; top: 15px; right: 20px; z-index: 15;}
		.f-modal .icon-angle {width: 15px; height: 15px; color: #10dd63; position: absolute;}
			.f-modal .icon-tl {top: 10px; left: 10px;}
			.f-modal .icon-tr {top: 10px; right: 10px;}
			.f-modal .icon-bl {bottom: 10px; left: 10px;}
			.f-modal .icon-br {bottom: 10px; right: 10px;}
		.f-modal form {padding: 75px 40px;}
			.f-modal form .form-content {max-width: 360px; margin: 0 auto;}
			.f-modal form .form-heading {display: none;}
			.f-modal form .submit {max-width: 220px;}
	
	/* Privacy */
	#modal-privacy {max-width: 1100px; padding: 40px;}
	
	/* Review */
	#modal-review {max-width: 1100px; padding: 40px;}
	
	/* Callback form */
	#modal-callback-form {max-width: 500px;}
	
	/* Request form */
	#modal-request-form {max-width: 500px;}
	
	/* Success */
	#modal-success-dialog {max-width: 500px; text-align: center; padding: 90px 40px;}
		#modal-success-dialog .message {font-weight: 700; font-size: 20px; line-height: 1.4; font-family: Roboto, sans-serif; margin: 0 auto;}


/*------ 768 ------*/
@media all and (max-width: 1023px){
	
	[id^="f-modals"]::before, [id^="f-modals"]::after {height: 30px;}
	
	#modal-privacy {padding: 35px 25px;}
	#modal-review {padding: 35px 25px;}
	
}

/*------ 480 ------*/
@media all and (max-width: 599px){
	
	[id^="f-modals"]::before, [id^="f-modals"]::after {height: 20px;}
	
	.f-modal {}
		.f-modal .close-button {top: 10px; right: 15px;}
			.f-modal .icon-tl {top: 5px; left: 5px;}
			.f-modal .icon-tr {top: 5px; right: 5px;}
			.f-modal .icon-bl {bottom: 5px; left: 5px;}
			.f-modal .icon-br {bottom: 5px; right: 5px;}
		.f-modal form {padding: 60px 30px;}
			.f-modal form .form-content {max-width: 320px;}
	
	#modal-privacy {padding: 35px 20px;}
	#modal-review {padding: 35px 20px;}
	#modal-success-dialog {padding: 80px 30px;}
	
}

/*------ 320 ------*/
@media all and (max-width: 479px){
	
	.f-modal {}
		.f-modal .close-button {top: 10px; right: 12px;}
		.f-modal form {padding: 55px 25px 45px;}
			.f-modal form .submit {max-width: 200px;}
	
	#modal-privacy {padding: 35px 15px;}
	#modal-review {padding: 35px 15px;}
	
	#modal-success-dialog {padding: 70px 15px;}
		#modal-success-dialog .message {font-size: 18px;}
	
}


/********************  CUSTOM DIALOG BOXES  ********************/

html.fd-lock {overflow: hidden !important; position: relative;}
#fd-dialogs-overlay {display: none; width: 100%; height: 100%; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(255,255,255,0.9); z-index: 100000;}
#fd-dialogs {display: none; width: 100%; height: 100%; margin: auto; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 100001; overflow: auto; -webkit-transform: translateZ(0);}
	
	/* Dialogs (alert, confirm, prompt) */
	.fd-dialog {display: none; width: 95%; max-width: 500px; min-width: 300px; background: #232323; border-radius: 8px; font-weight: 400; font-size: 16px; line-height: 1.4; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; color: #232323; text-align: center; text-transform: none; letter-spacing: 0; word-wrap: break-word; padding: 35px; margin: 25px auto; position: absolute; left: 0; right: 0; z-index: 1; transform: translateY(-150%); transition: transform 0.4s cubic-bezier(0.175,0.885,0.32,1.275) 0s;}
	.fd-dialog.active {transform: none; transition-delay: 0.2s;}
		.fd-dialog::before, .fd-dialog::after {content: ''; display: block; width: 100%; height: 100%; border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
			.fd-dialog::before {background: #fff; background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.15) 100%); z-index: 1;}
			.fd-dialog::after {width: calc(100% - 15px); height: calc(100% - 15px); background: #fff; z-index: 2;}
		.fd-dialog > * {position: relative; z-index: 3;}
			
			/* close button */
			.fd-dialog-close {display: block; width: 22px; height: 22px; background: none; border-radius: 50%; color: #232323; position: absolute; top: 10px; right: 10px; transition: all 0.2s ease-out 0s; cursor: pointer; -webkit-touch-callout: none;}
			.fd-dialog-close:hover {background: #232323; color: #fff;}
			.fd-dialog-close:active {transform: scale(0.95);}
				.fd-dialog-close::before, .fd-dialog-close::after {content: ''; display: block; width: 2px; height: 16px; background: currentColor; border-radius: 2px; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
				.fd-dialog-close::before {transform: rotate(45deg);}
				.fd-dialog-close::after {transform: rotate(-45deg);}
			
			/* message container */
			.fd-dialog-message {}
			
			/* input */
			.fd-dialog-input {display: block; width: 100%; background: #fff; border: 1px solid #d8d8d8; font-size: 16px; line-height: 1.2; padding: 10px; margin: 20px auto 0; transition: all 0.2s ease-out 0s;}
				.fd-dialog-input:hover {border-color: #148cd7;}
				.fd-dialog-input:focus {outline: 0; border-color: #148cd7; box-shadow: 0 0 0 1px #148cd7 inset;}
			
			/* control buttons */
			.fd-dialog-buttons {font-size: 0; line-height: 0; text-align: center; margin: 15px auto -5px;}
				.fd-dialog-buttons button {display: inline-block; vertical-align: middle; min-width: 100px; max-width: 200px; border: 1px solid rgba(35,35,35,0.05); border-radius: 4px; box-shadow: 0 10px 30px rgba(255,255,255,0.5) inset; font-weight: 700; font-size: 15px; line-height: 1; color: #fff; text-align: center; text-transform: uppercase; text-shadow: 0 1px 1px #232323; padding: 14px 10px; margin: 5px; position: relative; transition: all 0.2s ease-out 0s;}
				.fd-dialog-buttons button:hover {box-shadow: 0 -10px 30px rgba(255,255,255,0.5) inset;}
				.fd-dialog-buttons button:focus {outline: 0; box-shadow: 0 -10px 30px rgba(255,255,255,0.5) inset, 0 0 10px #148cd7;}
				.fd-dialog-buttons button:active {top: 1px;}
					.fd-confirm-button {background: #50be00;}
					.fd-cancle-button {background: #d22814;}
	
	.fd-alert {}
	.fd-confirm {}
	.fd-prompt {}


/*------ 320 ------*/
@media all and (max-width: 479px){
	.fd-dialog {font-size: 14px; padding: 30px; margin: 20px auto;}
		.fd-dialog-input {font-size: 14px; margin-top: 15px;}
		.fd-dialog-buttons {margin-top: 10px;}
			.fd-dialog-buttons button {font-size: 13px;}
}


/********************  SCROLLBARS  ********************/

.ps {position: relative; overflow: hidden !important; overflow-anchor: none; -ms-overflow-style: none; -ms-touch-action: auto; touch-action: auto;}
@supports (-ms-overflow-style: none){ .ps {overflow: auto !important;} }
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){ .ps {overflow: auto !important;} }

.ps__rail-x, .ps__rail-y {position: absolute; transition: background-color 0.2s linear;}
.ps__rail-x {height: 15px; bottom: 0;}
.ps__rail-y {width: 15px; right: 0;}

.ps .ps__rail-x:hover, .ps .ps__rail-y:hover,
.ps .ps__rail-x:focus, .ps .ps__rail-y:focus,
.ps .ps__rail-x.ps--clicking, .ps .ps__rail-y.ps--clicking {
	background-color: rgba(216,216,216,0.1);
}

.ps__thumb-x, .ps__thumb-y {background-color: #10dd63; border-radius: 6px; position: absolute; transition: opacity 0.2s ease-in-out, width 0.2s ease-in-out, height 0.2s ease-in-out;}
.ps__thumb-x {height: 50%; bottom: 2px;}
.ps__thumb-y {width: 50%; right: 2px;}

.ps__rail-x:hover > .ps__thumb-x, .ps__rail-x:focus > .ps__thumb-x, .ps__rail-x.ps--clicking .ps__thumb-x {height: calc(100% - 4px); opacity: 1;}
.ps__rail-y:hover > .ps__thumb-y, .ps__rail-y:focus > .ps__thumb-y, .ps__rail-y.ps--clicking .ps__thumb-y {width: calc(100% - 4px); opacity: 1;}


/********************  PROGRESSBAR  ********************/

@-webkit-keyframes nprogress-spinner {0%{-webkit-transform: rotate(0deg);}100% {-webkit-transform: rotate(360deg);}}
@keyframes nprogress-spinner {0%{transform: rotate(0deg);}100% {transform: rotate(360deg);}}

#nprogress {color: #10dd63; pointer-events: none;}
#nprogress .bar {width: 100%; width: 100vw; height: 2px; background: currentColor; position: fixed; top: 0; left: 0; z-index: 12000;}
#nprogress .peg {display: block; opacity: 1; width: 100px; height: 100%; box-shadow: 0 0 10px currentColor, 0 0 5px currentColor; position: absolute; right: 0; transform: rotate(3deg) translate(0, -4px);}
#nprogress .spinner {display: block; position: fixed; top: 15px; right: 15px; z-index: 12000;}
#nprogress .spinner-icon {width: 18px; height: 18px; box-sizing: border-box; color: currentColor; border: 2px solid transparent; border-top-color: currentColor; border-left-color: currentColor; border-radius: 50%; -webkit-animation: nprogress-spinner 400ms linear infinite; animation: nprogress-spinner 400ms linear infinite;}
.nprogress-custom-parent {position: relative; overflow: hidden;}
.nprogress-custom-parent #nprogress .spinner, .nprogress-custom-parent #nprogress .bar {position: absolute;}


/* Styles */

.row {
  max-width: 1310px;
  margin-right: auto;
  margin-left: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap; }
.row.-max-width-1476 {
  max-width: 1476px;
}         
  .row .row {
    margin-right: -0.625rem;
    margin-left: -0.625rem; }
    @media print, screen and (min-width: 40em) {
      .row .row {
        margin-right: -0.9375rem;
        margin-left: -0.9375rem; } }
    @media print, screen and (min-width: 64em) {
      .row .row {
        margin-right: -0.9375rem;
        margin-left: -0.9375rem; } }
    .row .row.collapse {
      margin-right: 0;
      margin-left: 0; }
  .row.expanded {
    max-width: none; }
  .row:not(.expanded) .row {
    max-width: none; }
  .row.collapse > .column, .row.collapse > .columns {
    padding-right: 0;
    padding-left: 0; }
  .row.is-collapse-child,
  .row.collapse > .column > .row,
  .row.collapse > .columns > .row {
    margin-right: 0;
    margin-left: 0; }

.column, .columns {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 0px;
      -ms-flex: 1 1 0px;
          flex: 1 1 0px;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  min-width: initial; }
  @media print, screen and (min-width: 40em) {
    .column, .columns {
      padding-right: 0.9375rem;
      padding-left: 0.9375rem; } }

.column.row.row, .row.row.columns {
  float: none;
  display: block; }

.row .column.row.row, .row .row.row.columns {
  margin-right: 0;
  margin-left: 0;
  padding-right: 0;
  padding-left: 0; }

.small-1 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 8.33333%;
      -ms-flex: 0 0 8.33333%;
          flex: 0 0 8.33333%;
  max-width: 8.33333%; }

.small-offset-0 {
  margin-left: 0%; }

.small-2 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 16.66667%;
      -ms-flex: 0 0 16.66667%;
          flex: 0 0 16.66667%;
  max-width: 16.66667%; }

.small-offset-1 {
  margin-left: 8.33333%; }

.small-3 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 25%;
      -ms-flex: 0 0 25%;
          flex: 0 0 25%;
  max-width: 25%; }

.small-offset-2 {
  margin-left: 16.66667%; }

.small-4 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 33.33333%;
      -ms-flex: 0 0 33.33333%;
          flex: 0 0 33.33333%;
  max-width: 33.33333%; }

.small-offset-3 {
  margin-left: 25%; }

.small-5 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 41.66667%;
      -ms-flex: 0 0 41.66667%;
          flex: 0 0 41.66667%;
  max-width: 41.66667%; }

.small-offset-4 {
  margin-left: 33.33333%; }

.small-6 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 50%;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%; }

.small-offset-5 {
  margin-left: 41.66667%; }

.small-7 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 58.33333%;
      -ms-flex: 0 0 58.33333%;
          flex: 0 0 58.33333%;
  max-width: 58.33333%; }

.small-offset-6 {
  margin-left: 50%; }

.small-8 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 66.66667%;
      -ms-flex: 0 0 66.66667%;
          flex: 0 0 66.66667%;
  max-width: 66.66667%; }

.small-offset-7 {
  margin-left: 58.33333%; }

.small-9 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 75%;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
  max-width: 75%; }

.small-offset-8 {
  margin-left: 66.66667%; }

.small-10 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 83.33333%;
      -ms-flex: 0 0 83.33333%;
          flex: 0 0 83.33333%;
  max-width: 83.33333%; }

.small-offset-9 {
  margin-left: 75%; }

.small-11 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 91.66667%;
      -ms-flex: 0 0 91.66667%;
          flex: 0 0 91.66667%;
  max-width: 91.66667%; }

.small-offset-10 {
  margin-left: 83.33333%; }

.small-12 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%; }

.small-offset-11 {
  margin-left: 91.66667%; }

.small-order-1 {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
      -ms-flex-order: 1;
          order: 1; }

.small-order-2 {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
      -ms-flex-order: 2;
          order: 2; }

.small-order-3 {
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
      -ms-flex-order: 3;
          order: 3; }

.small-order-4 {
  -webkit-box-ordinal-group: 5;
  -webkit-order: 4;
      -ms-flex-order: 4;
          order: 4; }

.small-order-5 {
  -webkit-box-ordinal-group: 6;
  -webkit-order: 5;
      -ms-flex-order: 5;
          order: 5; }

.small-order-6 {
  -webkit-box-ordinal-group: 7;
  -webkit-order: 6;
      -ms-flex-order: 6;
          order: 6; }

.small-up-1 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-1 > .column, .small-up-1 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%; }

.small-up-2 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-2 > .column, .small-up-2 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%; }

.small-up-3 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-3 > .column, .small-up-3 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%; }

.small-up-4 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-4 > .column, .small-up-4 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%; }

.small-up-5 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-5 > .column, .small-up-5 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 20%;
        -ms-flex: 0 0 20%;
            flex: 0 0 20%;
    max-width: 20%; }

.small-up-6 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-6 > .column, .small-up-6 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%; }

.small-up-7 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-7 > .column, .small-up-7 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 14.28571%;
        -ms-flex: 0 0 14.28571%;
            flex: 0 0 14.28571%;
    max-width: 14.28571%; }

.small-up-8 {
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; }
  .small-up-8 > .column, .small-up-8 > .columns {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 12.5%;
        -ms-flex: 0 0 12.5%;
            flex: 0 0 12.5%;
    max-width: 12.5%; }

.small-collapse > .column, .small-collapse > .columns {
  padding-right: 0;
  padding-left: 0; }

.small-uncollapse > .column, .small-uncollapse > .columns {
  padding-right: 0.625rem;
  padding-left: 0.625rem; }

@media print, screen and (min-width: 40em) {
  .medium-1 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .medium-offset-0 {
    margin-left: 0%; }
  .medium-2 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .medium-offset-1 {
    margin-left: 8.33333%; }
  .medium-3 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%; }
  .medium-offset-2 {
    margin-left: 16.66667%; }
  .medium-4 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .medium-offset-3 {
    margin-left: 25%; }
  .medium-5 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .medium-offset-4 {
    margin-left: 33.33333%; }
  .medium-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%; }
  .medium-offset-5 {
    margin-left: 41.66667%; }
  .medium-7 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .medium-offset-6 {
    margin-left: 50%; }
  .medium-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .medium-offset-7 {
    margin-left: 58.33333%; }
  .medium-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%; }
  .medium-offset-8 {
    margin-left: 66.66667%; }
  .medium-10 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .medium-offset-9 {
    margin-left: 75%; }
  .medium-11 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .medium-offset-10 {
    margin-left: 83.33333%; }
  .medium-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%; }
  .medium-offset-11 {
    margin-left: 91.66667%; }
  .medium-order-1 {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1; }
  .medium-order-2 {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2; }
  .medium-order-3 {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
        -ms-flex-order: 3;
            order: 3; }
  .medium-order-4 {
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
        -ms-flex-order: 4;
            order: 4; }
  .medium-order-5 {
    -webkit-box-ordinal-group: 6;
    -webkit-order: 5;
        -ms-flex-order: 5;
            order: 5; }
  .medium-order-6 {
    -webkit-box-ordinal-group: 7;
    -webkit-order: 6;
        -ms-flex-order: 6;
            order: 6; }
  .medium-up-1 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-1 > .column, .medium-up-1 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 100%;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%;
      max-width: 100%; }
  .medium-up-2 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-2 > .column, .medium-up-2 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 50%;
          -ms-flex: 0 0 50%;
              flex: 0 0 50%;
      max-width: 50%; }
  .medium-up-3 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-3 > .column, .medium-up-3 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 33.33333%;
          -ms-flex: 0 0 33.33333%;
              flex: 0 0 33.33333%;
      max-width: 33.33333%; }
  .medium-up-4 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-4 > .column, .medium-up-4 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 25%;
          -ms-flex: 0 0 25%;
              flex: 0 0 25%;
      max-width: 25%; }
  .medium-up-5 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-5 > .column, .medium-up-5 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 20%;
          -ms-flex: 0 0 20%;
              flex: 0 0 20%;
      max-width: 20%; }
  .medium-up-6 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-6 > .column, .medium-up-6 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 16.66667%;
          -ms-flex: 0 0 16.66667%;
              flex: 0 0 16.66667%;
      max-width: 16.66667%; }
  .medium-up-7 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-7 > .column, .medium-up-7 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 14.28571%;
          -ms-flex: 0 0 14.28571%;
              flex: 0 0 14.28571%;
      max-width: 14.28571%; }
  .medium-up-8 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .medium-up-8 > .column, .medium-up-8 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 12.5%;
          -ms-flex: 0 0 12.5%;
              flex: 0 0 12.5%;
      max-width: 12.5%; } }

@media print, screen and (min-width: 40em) and (min-width: 40em) {
  .medium-expand {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0px;
        -ms-flex: 1 1 0px;
            flex: 1 1 0px; } }

.row.medium-unstack > .column, .row.medium-unstack > .columns {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%; }
  @media print, screen and (min-width: 40em) {
    .row.medium-unstack > .column, .row.medium-unstack > .columns {
      -webkit-box-flex: 1;
      -webkit-flex: 1 1 0px;
          -ms-flex: 1 1 0px;
              flex: 1 1 0px; } }

@media print, screen and (min-width: 40em) {
  .medium-collapse > .column, .medium-collapse > .columns {
    padding-right: 0;
    padding-left: 0; }
  .medium-uncollapse > .column, .medium-uncollapse > .columns {
    padding-right: 0.9375rem;
    padding-left: 0.9375rem; } }

@media print, screen and (min-width: 64em) {
  .large-1 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 8.33333%;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%; }
  .large-offset-0 {
    margin-left: 0%; }
  .large-2 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 16.66667%;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%; }
  .large-offset-1 {
    margin-left: 8.33333%; }
  .large-3 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%; }
  .large-offset-2 {
    margin-left: 16.66667%; }
  .large-4 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.33333%;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%; }
  .large-offset-3 {
    margin-left: 25%; }
  .large-5 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.66667%;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%; }
  .large-offset-4 {
    margin-left: 33.33333%; }
  .large-6 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%; }
  .large-offset-5 {
    margin-left: 41.66667%; }
  .large-7 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.33333%;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%; }
  .large-offset-6 {
    margin-left: 50%; }
  .large-8 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.66667%;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%; }
  .large-offset-7 {
    margin-left: 58.33333%; }
  .large-9 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%; }
  .large-offset-8 {
    margin-left: 66.66667%; }
  .large-10 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.33333%;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%; }
  .large-offset-9 {
    margin-left: 75%; }
  .large-11 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.66667%;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%; }
  .large-offset-10 {
    margin-left: 83.33333%; }
  .large-12 {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%; }
  .large-offset-11 {
    margin-left: 91.66667%; }
  .large-order-1 {
    -webkit-box-ordinal-group: 2;
    -webkit-order: 1;
        -ms-flex-order: 1;
            order: 1; }
  .large-order-2 {
    -webkit-box-ordinal-group: 3;
    -webkit-order: 2;
        -ms-flex-order: 2;
            order: 2; }
  .large-order-3 {
    -webkit-box-ordinal-group: 4;
    -webkit-order: 3;
        -ms-flex-order: 3;
            order: 3; }
  .large-order-4 {
    -webkit-box-ordinal-group: 5;
    -webkit-order: 4;
        -ms-flex-order: 4;
            order: 4; }
  .large-order-5 {
    -webkit-box-ordinal-group: 6;
    -webkit-order: 5;
        -ms-flex-order: 5;
            order: 5; }
  .large-order-6 {
    -webkit-box-ordinal-group: 7;
    -webkit-order: 6;
        -ms-flex-order: 6;
            order: 6; }
  .large-up-1 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-1 > .column, .large-up-1 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 100%;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%;
      max-width: 100%; }
  .large-up-2 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-2 > .column, .large-up-2 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 50%;
          -ms-flex: 0 0 50%;
              flex: 0 0 50%;
      max-width: 50%; }
  .large-up-3 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-3 > .column, .large-up-3 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 33.33333%;
          -ms-flex: 0 0 33.33333%;
              flex: 0 0 33.33333%;
      max-width: 33.33333%; }
  .large-up-4 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-4 > .column, .large-up-4 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 25%;
          -ms-flex: 0 0 25%;
              flex: 0 0 25%;
      max-width: 25%; }
  .large-up-5 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-5 > .column, .large-up-5 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 20%;
          -ms-flex: 0 0 20%;
              flex: 0 0 20%;
      max-width: 20%; }
  .large-up-6 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-6 > .column, .large-up-6 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 16.66667%;
          -ms-flex: 0 0 16.66667%;
              flex: 0 0 16.66667%;
      max-width: 16.66667%; }
  .large-up-7 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-7 > .column, .large-up-7 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 14.28571%;
          -ms-flex: 0 0 14.28571%;
              flex: 0 0 14.28571%;
      max-width: 14.28571%; }
  .large-up-8 {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
    .large-up-8 > .column, .large-up-8 > .columns {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 12.5%;
          -ms-flex: 0 0 12.5%;
              flex: 0 0 12.5%;
      max-width: 12.5%; } 
  .large-expand {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 0px;
        -ms-flex: 1 1 0px;
            flex: 1 1 0px; } }

.accordion {
  margin-left: 0;
  background: #fefefe;
  list-style-type: none;
}

.accordion[disabled] .accordion-title {
  cursor: not-allowed;
}

.accordion-title {
  position: relative;
  display: block;
  padding: 30px 80px 30px 80px;
  border-bottom: 0;
  font-size: 24px;
  line-height: 1.4;
  font-weight: bold;
  color: #252932;
  transition: all 0.3s ease-out;
}

.accordion-item:nth-child(odd),
.accordion-item:nth-child(odd) .accordion-content {
  background-color: #f5f5f5;
}

.accordion-title:hover::before {
  background-image: url(../images/button-hover.png);
}

.accordion-title::before {
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -23px;
  content: '';
  background-image: url(../images/button.png);
  background-repeat: no-repeat;
  border-radius: 50%;
  width: 46px;
  height: 46px;
}

.is-active > .accordion-title::before {
  transform: rotateX(180deg);
}

.accordion-content {
  display: none;
  padding: 0 80px 35px 80px;
  /*border-top: 1px solid #d5d5d8;*/
  border-bottom: 0;
  /*background-color: #fefefe;*/
  color: #0a0a0a;
  font-size: 18px;
  line-height: 1.875;
}

.accordion-content .f-content {
  font-size: 18px;
}

/* Screen */
/* Base */
.screen {
  min-height: calc(100vh - 70px);
  background-color: #252932;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.screen::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(37,41,50,0.85);
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
}

/* Modifiers */
.screen.m--min-h {
  min-height: 320px;
}
.screen.-theme-project {
  min-height: 320px;
  background-position: 50% 50%;
}
/* Modifiers large */
@media print, screen and (min-width: 64em) {
  .screen.m-l--img-pos-100-30 {
    background-position: 100% 30%;
  }
  .screen.m-l--img-pos-100-80 {
    background-position: 100% 80%;
  }
}

/* Elements */
.screen__h1 {
  margin-top: 40px;
  margin-bottom: 0;
  font-family: 'Open Sans', serif;
}
.screen.-theme-project .screen__h1 {
  font-family: 'Roboto', serif;
  font-size: 58px;
  text-align: center;
  text-transform: uppercase;
}
.screen.-theme-project .screen__logo-wrap {
  text-align: center;
}
.screen__logo-wrap + .screen__h1 {
  margin-top: 43px;
}
.screen__sub-title {
  font-size: 20px;
  line-height: 1.7;
}
.screen__h1 + .screen__sub-title {
  margin-top: 20px;
}
.screen__h1 + .buttons,
.screen__sub-title + .buttons {
  margin-top: 35px;
  margin-bottom: 5px;
  line-height: 0;
}

.screen-inner {
  position: relative;
  flex: 0 0 auto;
  z-index: 2;
}

.screen-padding {
  padding: 80px 0;
}

/* Mixin */
.screen .wrapper {
  flex: 0 0 auto;
  z-index: 2;
}

.screen.-theme-project .wrapper {
  padding: 160px 0;
}
/* / Screen */

/* Basic text */
.basic-text p {
  line-height: 1.875;
}

.basic-text p + p {
  margin-top: 20px;
}
/* / Basic text */

.bg-gray {
  background-color: #f5f5f5;
}

.wrapper.m--left {
  margin: 0;
}

.page-template-template-about #breadcrumbs,
.page-template-template-price #breadcrumbs {
  margin-bottom: -73px !important;
}
.services-template-template-business #breadcrumbs,
.services-template-template-autobusiness #breadcrumbs,
.services-template-template-bitrix #breadcrumbs,
.services-template-template-landing #breadcrumbs,
.page-template-template-crm #breadcrumbs,
.single-projects #breadcrumbs {
  margin-bottom: -82px !important;
}
.page-template-template-about #breadcrumbs .bc-item > span,
.services-template-template-autobusiness #breadcrumbs .bc-item > span,
.services-template-template-bitrix #breadcrumbs .bc-item > span,
.services-template-template-landing #breadcrumbs .bc-item > span,
.page-template-template-crm #breadcrumbs .bc-item > span,
.page-template-template-price #breadcrumbs .bc-item > span,
.services-template-template-business #breadcrumbs .bc-item > span,
.single-projects #breadcrumbs .bc-item > span {
  color: #fff;
}

/* Text decor */
.text-decor {
  position: relative;
  padding-left: 20px;
}
.text-decor::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  width: 5px;
  height: calc(100%  - 16px);
  background-color: #10dd63;
}
.text-decor.is-gray::before {
  background-color: #ebebeb;
}
/* / Text decor */
/* Block */
.block {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  z-index: 2;
}

.block.is-quadro {
  background-color: #fff;
  padding: 50px 45px 50px 50px;
  height: 100%;
}

.block.is-quadro .title {
  font-family: Roboto;
  font-size: 28px;
  font-weight: bold;
  line-height: 36px;
  padding: 0;
  margin: 0;
  height: initial;
}

.block.is-quadro .description {
  font-size: 16px;
  line-height: 30px;
  padding: 0;
  text-align: left;
}

.block.is-quadro .decor {
  width: 100%;
  height: 1px;
  margin: 20px 0 20px 0;
  /*background-color: #f9f9f9;*/
  background-color: #eaeaea;
}

.block.is-column {
  flex-direction: column;
}

.block__header {
  font-size: 18px;
  line-height: 30px;
  font-weight: bold;
  position: relative;
  padding-left: 27px;
}
.block__header::before,
.block__decoration::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  background-color: #10dd63;
}
.block__decoration.m--left-20::before {
  left: 20px;
}
.block__description {
  padding-left: 27px;
  line-height: 30px;
}

.block__description.-decor-sm {
  padding-left: 15px;
}

.block__icon {
  position: absolute;
  top: 0;
  left: 14px;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
}

.block__title {
  padding-left: 58px;
}

.block__title.m--padding-left-85 {
  padding-left: 85px;
}

.block .separator {
  width: 4px;
  height: 16px;
  border-radius: 4px;
  background: #10dd63;
  margin: 15px auto 10px;
}

.block .icon-container {
  width: 140px;
  height: 140px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(0,0,0,.05);
  padding: 35px;
  margin: 0 auto;
  position: relative;
}

.block .icon-container .icon {
  width: auto;
  height: auto;
  max-width: 70px;
  max-height: 70px;
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.block .title,
.block .title-2 {
  font-weight: 700;
  text-align: center;
  /*height: 40px;*/
  font-size: 18px;
  line-height: 24px;
  transition: all .2s ease-out 0s;
  margin-bottom: 20px;
}

.block .title-2 {
  font-size: 22px;
  height: auto;
  margin-bottom: 10px;
}

.block .description,
.block .description {
  text-align: center;
}

.block .description-2 {
  text-align: center;
  line-height: 1.875;
}

.block.is-center,
.block .description-2,
.block .description {
  align-items: center;
}

.block__icon-item {
  height: 100px;
  width: 120px;
  margin: 0 auto;
  position: relative;
}

.block__icon-item img {
  position: absolute;
  top: 0;
  left: 35px;
}

.block.is-line {
  position: relative;
}
.block.is-line::before {
  content: "";
  position: absolute;
  top: 35px;
  left: 80%;
  width: 45%;
  height: 1px;
  background-color: #ececec;
  z-index: 1;
}
.block.is-line:last-child::before {
  display: none;
}

.block .img-decor {
  background-repeat: no-repeat;
  padding-left: 40px;
}

.block .img-decor .title {
  text-align: left;
  height: auto;
  margin-bottom: 20px;
}

.block__fi {
  font-size: 20px;
  font-weight: bold;
}
.block__post {
  font-size: 18px;
}

[data-fanimate]:hover .icon {
  -webkit-animation: buzz-out 0.75s linear 1;
  animation: buzz-out 0.75s linear 1;
}

.unselectable {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
}

#homescreen .block {
  min-height: 50px;
  align-items: center;
}

.p-block p {
  margin-bottom: 30px;
}

.callout {
  background-color: #e4f1f7;
  padding: 27px 0;
}
.callout.is-bg-gray {
  background-color: #f9f9f9;
  padding: 27px 0;
}
.callout.is-p {
  padding-left: 80px;
  padding-right: 80px;
}

.callout p + p {
  margin-top: 20px;
}

.link {
  display: inline-block;
  color: #27c6de;
  position: relative;
}

.link svg {
  position: absolute;
  top: 3px;
  right: -22px;
  width: 20px;
  height: 20px;
}

.caption {
  background-color: white;
  padding: 20px 30px;
}

.caption.text-decor::before {
  top: 0;
  height: 100%;
}

.hr {
  border: 0;
  border-bottom: 1px solid #d5d5d8;
}

.list-inline {
  display: flex;
  justify-content: space-between;
  /*padding-bottom: 20px;*/
  flex-wrap: wrap;
}
.list-inline li {
  list-style: none;
  padding: 0;
  padding-left: 3ch;
  position: relative;
  margin-bottom: 20px;
}
.list-inline li::before {
  content: '\2022';
  display: inline-block;
  width: 1ch;
  font-size: 25px;
  font-weight: 700;
  color: #10dd63;
  text-align: center;
  position: absolute;
  left: 0;
  top: -5px;
}


#prices .sub-heading {
  font-size: 16px;
  text-align: left;
}

#prices .sub-heading p {
  margin: 20px 0;
  line-height: 1.875;
}

.block .check-decor {
  padding-left: 45px;
  position: relative;
}

.block .check-decor::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  background-image: url(../images/check-decor.png);
  background-repeat: no-repeat;
  width: 21px;
  height: 16px;
}

.block .check-decor .title {
  text-align: left;
  height: initial;
  margin-bottom: 10px;
}

.block .subtitle,
.block .check-decor .subtitle {
  line-height: 1.875;
}

.title-decor .title {
  position: relative;
}
.title-decor .title::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -14px;
  left: 0;
  width: 25px;
  height: 4px;
  background-color: #10dd63;
  border-radius: 4px;
}

.label-text {
  font-size: 22px;
}

.table-row .th {
  position: relative;
}

.actions-label {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 60px;
  height: 22px;
  background-color: white;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.actions-label.m--invert {
  background-color: #f44545;
}

.actions-label__text {
  color: #f44545;
  font-family: 'Roboto', serif;
  font-size: 14px;
  font-weight: bold;
}

.actions-label.m--invert .actions-label__text {
  color: white;
}

.tariff-sale {
  text-decoration: line-through;
  margin-top: 10px;
  font-size: 14px;
}

.red-block {
  display: inline-block;
  padding: 5px 10px;
  background-color: #f44545;
  color: white;
  font-size: 20px;
}

.custom-heading-1 {
  font-size: 20px;
}
.custom-heading-2 {
  font-size: 18px;
}
#prices .wrapper h2 {
  display: block;
}
#prices .item {
  position: relative;
}

#prices .item .sale {
  text-decoration: line-through;
  color: #d2d2d2;
  font-size: 14px;
}

#prices .item .price {
  font-size: 16px;
}

#examples .info-item {
  position: relative;
}

#examples .info-item .sale.value {
  display: inline-block;
  color: white;
  text-decoration: line-through;
  font-size: 14px;
}
#examples .info-item .sale + .value {
  display: inline-block;
  color: #edfe5b;
  font-size: 18px;
}

.actions {
  margin-bottom: 60px;
}

.actions__img {
  position: relative;
  max-width: 408px;
  max-height: 280px;
  overflow: hidden;
  user-select: none;
}

.actions__warning {
  background-color: #252932;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 300px;
  height: 45px;
  color: white;
  font-size: 24px;
  text-align: center;
  z-index: 99;
}

.actions__gray {
  position: relative;
  overflow: hidden;
  opacity: 0.6; 
  user-select: none;
}

.actions__warning + .actions__img-wrp::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 408px;
  height: 280px;
  background-color: rgba(220, 220, 220, 0.8);
  z-index: 2;
  user-select: none; 
}

.actions__heading {
  font-size: 24px;
  font-weight: bold;
  margin-top: 20px;
  margin-bottom: 0;
  text-align: left;
}

.actions__date {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background-color: #252932;
  padding: 5px 15px;
  font-size: 15px;
  font-weight: 300;
  color: #fff;
  z-index: 1;
}

.actions__text p {
  margin-top: 20px;
}

.actions__signature {
  margin-top: 20px;
  font-size: 22px;
}

.actions__gray .button-green {
  background-color: #dadada;
}

.button[disabled],
.button[disabled]:hover {
  cursor: default;
  box-shadow: none;
  top: 0;
  background-color: #e8e8e8;
  color: #fff;
}

.button[disabled]:hover::before,
.button[disabled]:hover::after {
  display: none;
}

.buttons {
  position: relative;
}

.right-text-button {
  position: absolute;
  top: 14px;
  left: 400px;
  font-size: 16px;
  font-style: italic;
  font-weight: 300;
  color: white;
}

.right-text-button::before {
  content: '';
  position: relative;
  top: 24px;
  left: -60px;
  display: block;
  width: 35px;
  height: 1px;
  background-color: white;
}

.square-wrap {
  max-width: 1280px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto -30px;
}

.square {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  width: calc((100% - 30px) / 2 - 1px);
  margin: 0 0 30px 30px;
  transition: all 0.2s ease-out 0s;
  border: 1px solid #dddddd;
  padding: 70px 10px 55px 30px;
}

.square:nth-child(2n+1) {
  margin-left: 0;
}

.square .heading-2 {
  margin: 0;
}

.square ul {
  margin-top: 10px;
}

.square li {
  margin-top: 18px;
  padding-left: 40px;
  position: relative;
}

.square li:nth-child(n+7) {
  display: none;
}

.square ul.open li:nth-child(n+7) {
  display: list-item;
}

.square li:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  background-image: url(../images/check-decor.png);
  background-repeat: no-repeat;
  width: 21px;
  height: 16px;
}

.square .button-text {
  font-size: 18px;
}

.icon-arrow {
  position: relative;
}

.button.icon-arrow .button-text {
  padding: 22px 40px 22px 14px;
}

.icon-arrow .button-text::after {
  content: '';
  display: block;
  position: absolute;
  top: 30px;
  right: 10px;
  width: 16px;
  height: 16px;
  background-image: url('../images/ic_arrow.png');
  background-repeat: no-repeat;
}

.icon-arrow:hover .button-text::after {
  background-image: url('../images/ic_arrow_white.png');
}

.icon-arrow.invert-icon .button-text::after {
  transform: rotateX(180deg);
  top: 22px;
}

.project-notebook-wrap {
  padding-top: 70px;
  padding-bottom: 70px;
  text-align: center;
  background-color: #f5f5f5;
}

.project-design-bg {
  margin-top: 32px;
  padding-top: 86px;
  padding-bottom: 81px;
  background-color: #252932;
}

.project-design-wrap {
  text-align: center;
  max-width: 1310px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}

.project-design {
  display: block;
  margin: 0 0 28px;
}

.project-header {
  margin-bottom: 20px;
  font-size: 40px;
  font-family: 'Roboto', serif;
  text-transform: none;
  text-align: left;
  color: #252932;
}

.project-text {
  max-width: 1064px;
}

.project-caption {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e9e9e9;
  font-weight: bold;
  font-style: italic;
}

.project-logo {
  margin-top: 48px;
  margin-bottom: 26px;
}

.project-wrap {
  margin-top: 80px;
}

.cart-list {
  display: flex;
  padding: 40px 30px;
  background-color: white;
}

.cart-list:nth-child(n+6) {
  display: none;
}

.columns.open .cart-list:nth-child(n+6) {
  display: flex;
}

.cart-list + .cart-list {
  margin-top: 10px;
}

.cart-list + .button {
  margin-top: 10px;
  width: 100%;
  border-radius: 0;
  box-shadow: 0 7px 5px 0 rgba(0, 0, 0, 0.1);
}

.cart-list__index {
  margin-top: 10px;
  font-weight: bold;
  font-size: 18px;
  width: 30px;
  height: 30px;
  color: white;
  background-color: #10dd63;
  border-radius: 50%;
  text-align: center;
}

.cart-list__index-wrap + .cart-list__text {
  margin-left: 20px;
}

.cart-list__text {
  color: #272727;
  line-height: 30px;
}

.list-icon-text-wrap:nth-child(n+5) {
  margin-top: 60px;
}

.list-icon-text {
  display: flex;
}

.list-icon-text > .icon {
  min-width: 60px;
}

.video  iframe {
  margin: 0 auto;
}


.u-maxwidth-270 {
  max-width: 270px;
}
.u-maxwidth-350 {
  max-width: 350px;
}

.u-pl-20 {
  padding-left: 20px;
}
.u-pl-30 {
  padding-left: 30px;
}
/*.u-pl-100 {
  padding-left: 100px;
}*/

/* Utils */
.u-text-bold {
  font-weight: bold;
}

.u-fsize-18 {
  font-size: 18px !important;
}
.u-fsize-20 {
  font-size: 20px !important;
}
.u-fsize-30 {
  font-size: 30px !important;
}
.u-fsize-40 {
  font-size: 40px !important;
}
.u-fsize-62 {
  font-size: 62px !important;
}

.u-lineheight-24 {
  line-height: 24px !important;
}
.u-lineheight-34 {
  line-height: 34px !important;
}
.u-lineheight-30 {
  line-height: 30px !important;
} 
.u-lineheight-36 {
  line-height: 36px !important;
}
.u-lineheight-44 {
  line-height: 44px !important;
}

.u-texttransform-none {
  text-transform: none !important;
}
.u-texttransform-upper {
  text-transform: uppercase !important;
}
.u-texttransform-lower {
  text-transform: lowercase !important;
}
.u-text-left {
  text-align: left !important;
}
.u-text-center {
  text-align: center !important;
}
 
.u-mt-0 {
  margin-top: 0 !important;
}
.u-mt-10 {
  margin-top: 10px !important;
}
.u-mt-18 {
  margin-top: 18px !important;
}
.u-mt-20 {
  margin-top: 20px !important;
}
.u-mt-35 {
  margin-top: 35px !important;
}
.u-mt-40 {
  margin-top: 40px !important;
}
.u-mt-45 {
  margin-top: 45px !important;
}
.u-mt-50 {
  margin-top: 50px !important;
}
.u-mt-60 {
  margin-top: 60px !important;
}
.u-mt-70 {
  margin-top: 70px !important;
}

.u-mb-0 {
  margin-bottom: 0 !important;
}

.u-mb-9 {
  margin-bottom: 9px !important;
}
.u-mb-28 {
  margin-bottom: 28px !important;
}
.u-mb-30 {
  margin-bottom: 30px !important;
}
.u-mb-38 {
  margin-bottom: 38px !important;
}
.u-mb-45 {
  margin-bottom: 45px !important;
}
.u-mb-50 {
  margin-bottom: 50px !important;
}
.u-mb-60 {
  margin-bottom: 60px !important;
}
.u-mb-80 {
  margin-bottom: 80px !important;
}

.u-pt-40 {
  padding-top: 40px !important;
}
.u-pt-25 {
  padding-top: 25px !important;
}
.u-pt-46 {
  padding-top: 46px !important;
}
.u-pt-61 {
  padding-top: 61px !important;
}
.u-pt-64 {
  padding-top: 64px !important;
}

.u-pb-0 {
  padding-bottom: 0 !important;
}
.u-pb-28 {
  padding-bottom: 28px !important;
}
.u-pb-86 {
  padding-bottom: 86px !important;
}

.screen__label {
  display: none;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.h1 {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
}

.fs-lg {
  font-size: 16px;
  line-height: 24px;
}

.wrap-gray {
  background-color: #f5f5f5;
}

.row-column {
  display: flex;
  flex-direction: column;
}

.header-about {
  margin-bottom: 30px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: #252932;
  text-transform: none;
}

.subheader-about {
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 1.6;
  color: #272727;
}

.round-about {
  margin: 45px auto 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 109px;
  height: 109px;
  border-radius: 50%;
  background-color: #10dd63;
}

.title-about {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  color: #272727;
}

.text-about {
  margin-bottom: 30px;
  font-size: 16px;
  line-height: 1.6;
  color: #272727;
}

.video {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto auto 0;
  /*width: 264px;
  height: 152px;*/
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.video::before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  /*background-color: rgba(37, 41, 50, 0.40);*/
}

.video__inner {
  display: block;
  text-align: center;
  z-index: 1;
}

.video__text {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  text-transform: uppercase;
}

.box-wrap {
  position: relative;
  max-width: 1280px;
  margin-right: auto;
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto -25px;
}

.box-wrap.is-light {
  margin-top: 30px;
  color: #fff;
  z-index: 2;
}

.box-border.is-3 {
  flex: 0 0 auto;
  width: calc((100% - 25px) / 3 - 9px);

  margin: 0 25px 25px 0;

  padding: 40px;
  display: flex;
  flex-direction: column;
}

.box-border.is-2 {
  flex: 0 0 auto;
  width: calc((100% - 25px) / 2 - 4px);

  margin: 0 25px 25px 0;

  padding: 20px 25px 30px;
  display: flex;
  flex-direction: column;
}

.box-border.is-3:nth-child(3n) {
  margin-right: 0;
}

.box-border.is-2:nth-child(2n) {
  margin-right: 0;
}

.box-border {
  border: 1px solid #bdbdbd;
  text-align: center;
}

.box-border.is-left {
  text-align: left;
}

.box-border .icon-container {
  display: flex;
  justify-content: center;
}

.box-border__title {
  margin-top: 20px;

  font-size: 18px;
  font-weight: bold;
}

.box-border__text {
  margin-top: 30px;
  line-height: 1.8;
}

.box-wrap.is-light .box-border__text {
  margin-top: 20px;
}

.count {
  display: inline-block;
  margin-right: 20px;
  font-size: 48px;
  font-weight: bold;
  color: #10dd63;
  line-height: 1;
}

/* Media */
@media print, screen and (min-width: 1440px) {
  .screen.m-l--before-no::before {
    background: 0;
  }
  .u-pl-100 {
    padding-left: 100px;
  }
}
@media print, screen and (min-width: 1280px) {
  .u-pl-100 {
    padding-left: 100px;
  }
  .screen__label {
    display: block;
  }
}
@media print, screen and (min-width: 1025px) {
  .screen__h1 {
    font-size: 62px;
  }
  .heading-2 {
    font-size: 40px;
  }
  .heading-2.m--fs-48 {
    font-size: 48px;
  }
  .heading-3 {
    font-size: 30px;
  }
  .subheading-2 {
    font-size: 22px;
  }
  .block__title {
    font-size: 18px;
  }
  .block .check-decor .title,
  .block .img-decor .title {
    font-size: 22px;
  }
  .block .check-decor .subtitle,
  .block .description-2 {
    font-size: 18px;
  }
  .block .title-2 {
    margin-bottom: 30px;
  }
  .label-text-2 {
    font-size: 18px;
    line-height: 1.8;
  }
  .no-br-large br {
    display: none;
  }
  .actions {
    margin-top: 20px;
  }
  .actions-label {
    width: 90px;
    height: 30px;
  }
  .actions-label__text {
    font-size: 22px;
  }
  .tariff-sale {
    font-size: 18px;
  }
  #prices .item .price {
    font-size: 27px;
  }
  #prices .item .sale {
    font-size: 22px;
  }
  .red-block {
    font-size: 36px;
  }
  #examples .info-item .sale.value {
    font-size: 22px;
  }
  #examples .info-item .sale + .value {
    font-size: 30px;
  }

  .header-about {
    font-size: 40px;
  }

  .h1 {
    font-size: 40px;
  }

  .fs-lg {
    font-size: 24px;
    line-height: 42px;
  }
}
@media print, screen and (max-width: 1279px) {
  .video {
    max-width: 200px;
  }
}
@media print, screen and (max-width: 1023px) {
  .heading-2,
  .subheading-2 {
    font-size: 20px;
  }
  .heading-3 {
    font-size: 18px;
  }
  .block.is-quadro {
    padding: 20px;
  }
  .block.is-quadro .title {
    font-size: 18px;
  }
  .block.is-quadro .description {
    font-size: 16px;
  }
  .block.is-quadro .decor {
    margin: 10px 0 10px;
  }
  .block.is-quadro .title br {
    display: none;
  }
  .callout.is-p {
    padding-left: 20px;
    padding-right: 20px;
  }
  .block.is-line::before {
    display: none;
  }
  .block__fi {
    font-size: 15px;
  }
  .block__post {
    font-size: 15px;
  }
  .block .check-decor .title,
  .block .img-decor .title,
  .block .title-2 {
    font-size: 18px;
  }
  .block .check-decor .subtitle,
  .block .description-2 {
    font-size: 16px;
    line-height: 1.5;
  }
  .block .title-2 {
    margin-bottom: 10px;
  }
  .label-text {
    font-size: 16px;
  }
  /*.u-pl-100 {
    padding-left: 10px;
  }*/

  .accordion-title {
    padding: 15px 40px 15px 20px;
    font-size: 18px;
  }
  .accordion-title:hover::before {
    background-image: url(../images/button-hover-small.png);
  }
  .accordion-title::before {
    background-image: url(../images/button-small.png);
    width: 23px;
    height: 23px;
    margin-top: -11.5px;
  }
  .accordion-content, 
  .accordion-content .f-content {
    font-size: 16px;
  }
  .accordion-content {
    padding: 0 15px 20px 15px;
  }
  .accordion-content hr {
    margin-bottom: 15px !important;
  }
  .right-text-button {
    display: none;
  }
  .square-wrap {
    width: 100%;
  }
  .square {
    width: 100%;
    margin-left: 0;
    padding: 20px 10px 20px 15px;
  }

  .video iframe {
    max-width: 100%;
  }
  .list-icon-text-wrap:nth-child(n+4) {
    margin-top: 60px;
  }

  .screen.-theme-project .screen__h1 {
    font-size: 32px;
  }

  .project-header {
    font-size: 32px;
  }

  .video {
    max-width: 100%;
  }

  .box-border.is-2,
  .box-border.is-3 {
    padding: 20px;
  }
}
@media print, screen and (max-width: 767px) {
  .screen__h1 br,
  .block__title br,
  .block__description br {
    display: none;
  }
  .screen__h1 + .buttons, 
  .screen__sub-title + .buttons {
    text-align: center;
  }
}
@media print, screen and (max-width: 640px) {
  .u-m-mb-15 {
    margin-bottom: 15px !important;
  }
  .u-m-mb-30 {
    margin-bottom: 30px !important;
  }
  .list-icon-text-wrap:nth-child(n+2) {
    margin-top: 30px;
  }
  .columns.project-wrap + .project-wrap {
    margin-top: 30px;
  }
  .project-wrap {
    margin-top: 50px;
  }
  .screen__logo-wrap {
    padding: 0 30px;
  }
  .screen.-theme-project .wrapper {
    padding: 80px 0;
  }
  .project-design-bg {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .screen.-theme-project .screen__h1 br,
  .project-caption br {
    display: none;
  }
  .screen__logo-wrap+.screen__h1 {
    margin-top: 30px;
  }

  .box-border.is-2,
  .box-border.is-3 {
    width: 100%;
  }
}
@media print, screen and (max-width: 479px) {
  .screen .wrapper {
    padding-top: 50px;
  }
  .cart-list {
    flex-direction: column;
    padding: 10px;
  }
  .cart-list__index {
    margin: 0 auto 20px;
  }
  .cart-list__index-wrap + .cart-list__text {
    margin-left: 0;
  }
  
  #prices .item .title {
    min-height: 62px;
  }
}

.banner {
  position: relative;
  padding: 85px 80px 30px;
  background-color: #252932;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: soft-light;
  color: #fff;
}

.banner::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(37, 41, 50, 0.8);
}

.banner__box {
  position: relative;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
}

.banner__header {
  width: 70%;
  font-size: 30px;
  line-height: 45px;
  font-weight: bold;
  text-align: left;
}

.banners__buttons {
  width: 30%;
  text-align: right;
}

.banner__text {
  position: relative;
  margin-top: 35px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  padding-top: 20px;
  font-size: 15px;
}

.banner__text-gradient {
  background: linear-gradient(52deg, #f6808d 33%, #ac78ff 66%);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}

/*.button-disco {
  position: relative;
  border-radius: 50px;
  padding: 20px 30px 20px 40px;
  background: linear-gradient(52deg, #f04255 33%, #7944ce 66%);
  font-size: 22px;
  color: #fff;
}*/

.button-disco {
  border: double 4px transparent;
  border-radius: 80px;
  background-color: transparent;
  background-image: linear-gradient(white, white), radial-gradient(circle at top left, #f04255,#7944ce);
  background-origin: border-box;
  background-clip: content-box, border-box;
  color: #000;
}

.button-disco span {
  display: block;
  padding: 20px;
}

.button-disco .icon-insta {
  margin-right: 10px;
}

.icon-insta {
  display: inline-block;
  vertical-align: middle;
  
  background-image: url('../images/insta.png');
  background-repeat: no-repeat;
  width: 33px;
  height: 33px;
}


@media print, screen and (max-width: 1200px) {
  .banner__header,
  .banner__buttons {
    width: 50%;
  }

  .banner__buttons {
    text-align: center;
  }
}

@media print, screen and (max-width: 1020px) {
  .banner {
    padding: 40px 40px 30px;
  }

  .banner__header,
  .banner__buttons {
    width: 100%;
    text-align: center;
  }

  .banner__buttons {
    margin-top: 30px;
  }

  .screen-padding {
    padding: 40px 10px;
  }
}

@media print, screen and (max-width: 640px) {
  .banner {
    padding: 20px 20px 15px;
  }

  .banner__header {
    font-size: 24px;
    line-height: 1.4;
  }
}