@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400;1,700&display=swap');
/*@font-face {
	font-family: 'Lato';
	src: url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');
}*/

* {
	margin:0; 
	padding:0; 
	outline:none; 
	font-family:'Lato', sans-serif; 
	font-weight: 400; 
	vertical-align:top; 
	box-sizing:border-box!important; 
	-moz-box-sizing:border-box!important; 
	-webkit-box-sizing:border-box!important;
}
*, *:before, *:after {
	box-sizing:inherit; 
}
section, main, header, footer, nav {
	display:block; 
}
html {
	width:100%; 
	height:100%;
	scroll-behavior: smooth; 
}
body {
	width:100%; 
	height:100%; 
	border-collapse:collapse; 
	margin:0 auto; 
	background:#fff; 
	font-size:24px; 
	font-weight:400; 
	line-height:1.2em; 
	color:#3f454b; 
	-webkit-tap-highlight-color:rgba(89, 128, 211, .5); 
	-webkit-font-smoothing:antialiased; 
	text-rendering:optimizeLegibility; 
}
.wrapper {
	margin:20px auto; 
	padding:0 70px; 
}
h1, h1 * {
	font-size:48px; 
	line-height:100%; 
	/*font-family:Lato, sans-serif;*/ 
	font-weight: 700; 
	/*margin:0 0 80px 0;*/
}
h2, h2 * {
	color:#3f454b; 
	font-size:36px; 
	line-height:100%; 
	/*font-family:Lato, sans-serif;*/ 
	font-weight: 700; 
	/*margin:0 0 40px 0; */
}
h3, h3 * {
	font-size:24px; 
	line-height:100%; 
	font-weight:normal; 
}
h4, h4 * {
	color:#6c8ca0; 
	font-size:24px; 
	line-height:100%; 
}
h5, h5 * {
	font-size:20px; 
	/*font-family:Lato, sans-serif;*/ 
	font-weight: 700; 
	line-height:130%; 
	color:#b6ad99; 
}
a {
	color:#80a0b4; 
	text-decoration:underline; 
}
a:hover {
	text-decoration:none; 
}

/*HEADER START*/
header {
	padding-top:20px/*!important;*/ 
}
header a.logo {
	background:url('img/logo.png') no-repeat 0 center; 
	width:277px; 
	height:83px; 
	display:inline-block; 
	text-indent:-99999px; 
}
header a.logo:hover {
	opacity:.7; 
}
header nav {
	float:right; 
}
header nav .menuitem {
	display:inline-block;
	position: relative;
}
header nav a {
	text-decoration:none; 
	color:#252525; 
	padding:11px; 
	/*margin-right:40px;*/ 
}
/*header nav a:last-child {
	margin-right:0; 
	padding-right:0; 
}*/
header nav a:hover {
	color:#6c8ca0; 
}
header nav a.x-modules {
	background: url('img/x-modules_logo.png') 0% / 12px no-repeat;
    padding-left: 18px;
}
header nav a.subgit {
	background: url('img/svn_mirror_logo.png') 0% / 12px no-repeat;
    padding-left: 18px;
}
header nav a.svn_mirror {
	background: url('img/svn_mirror_logo.png') 0% / 12px no-repeat;
    padding-left: 18px;
}
header nav a.svnkit {
	background: url('img/svnkit_crop.png') 0% / 12px no-repeat;
    padding-left: 18px;
}

/*header nav a.red {
	color:#ff7039; 
}
header nav a.red:hover {
	color:#ff7039; 
	opacity:.7; 
}*/
header .nav-toggle {
	display: none; 
	background:url('img/menu.png') no-repeat center center; 
	width:37px; 
	height:36px; 
}
header .nav-toggle.rotate {
	transform:rotate(180deg); 
}
nav .submenu {
	display: none;
	position: absolute;
	z-index: 1;
	padding: 5px 0 0 12px;
	width: 220px;
}
.showproducts:hover .submenu, .submenu:hover {
	display: block;
}
nav .subitem {
	font-size: 20px;
	line-height: 1.4em;
	padding: 5px 0;
}
.cookies {
	background:#6c8da0; 
	color:#fff; 
}
.cookies .wrapper {
	padding-top:20px; 
	padding-bottom:20px;
	margin-top: 0; 
}
.cookies a {
	color:#fff; 
}
.cookies p {
	float:left; 
	width:80%; 
}
.cookies a.close-cookies {
	float:right; 
}
.cookies a.close-cookies:hover {
	opacity:.7; 
}
/*HEADER END*/

main {
	margin-top:50px; 
}
.top_banner {
	background: url('img/main-illustration.jpg') center no-repeat; 
	background-size: cover; 
	min-height: 642px;
}
.top_banner_alone {
	background: url('img/main-illustration-standalone.jpg') center no-repeat; 
	background-size: cover; 
	min-height: 642px;
}
.top_banner_xmod {
	background: linear-gradient(#fff, #fff, #6B889A); 
	/*background-size: cover;*/ 
	min-height: 500px;
}
.puzzle {
	background: url('img/puzzle_all.png') 100% 100% / 80% no-repeat, linear-gradient(#fff, #fff, #6B889A);
}
.top_banner h1, .top_banner_alone h1 {
	line-height: 1.2em; 
	padding-top: 80px;
}
.slogan {
	max-width: 1000px; 
	margin: auto; 
	text-align: left; 
	/*padding-left: 30px;*/
}
.top_banner_xmod .slogan {
	width: 45%;
	padding-left: 0;
	background: url('img/x-modules_logo.png') no-repeat;
	display: inline-block;
	margin-left: 60px;
}
.top_banner_xmod .xmod_video {
	display: inline-block;
	margin: 0 2% 40px 2%;
	width: 45%;
}
.yt {
	position: relative;
	height: 0;
	margin: auto;
	padding: 0% 0% 56.25%;
	overflow: hidden;
}
.yt iframe {
	position: absolute;
	top: 0; bottom: 0; left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.top_banner_xmod h1 {
	font-size: 54px;
	line-height: 1.8em;
}
.top_banner_xmod .red {
	font-size: 72px;
	padding-left: 120px;
}
.top_banner_xmod .button {
	margin: 20px 20px;
}
.top_banner_xmod .button.blue {
	margin: 20px 0;
}
.cosmo {
	margin: 150px 80% 0 0;
	float: right;
}


/*SCROLLING BUTTON START*/
.scroll {
  position: relative;
  width: 100%;
  height: 100%;
}
.scroll::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 100%;
  height: 80%;
}
.scroll a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 46px;
  height: 46px;
  margin-left: -23px;
  border: 1px solid #567E93;
  border-radius: 100%;
  box-sizing: border-box;
}
.scroll a span::after {
  position: absolute;
  top: 50%;
  left: 50%;
  content: '';
  width: 16px;
  height: 16px;
  margin: -12px 0 0 -8px;
  border-left: 1px solid #567E93;
  border-bottom: 1px solid #567E93;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  box-sizing: border-box;
}
.scroll a {
  position: absolute;
  bottom: 20px;
  left: 50%;
  z-index: 2;
  display: inline-block;
  padding-top: 60px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  transition: opacity .3s;
}
.scroll a:hover {
  opacity: .5;
}
/*SCROLLING BUTTON END*/

.middle_banner {
	background: url('img/middle_banner.png') center no-repeat;
	background-size: cover; 
	min-height: 363px;
}
.middle_banner_alone {
	background: url('img/middle_banner_alone.png') center no-repeat;
	background-size: cover; 
	min-height: 363px;
}
.rocket {
	margin: -105px 80% 0 0; 
	float: right;
}
.middle_banner h2, .middle_banner_alone h2 {
	line-height: 1.2em; 
	padding-top: 150px;
}

.product_item {
	max-width: 1200px; 
	margin: auto; 
}
.product_item .product_name h2 {
	margin-bottom: 40px;
}
.products .x-modules {
	padding: 100px 30% 50px 0; 
	background:url('img/x-modules illustration.png') right no-repeat; 
	min-height:346px;
}
.products .x-modules .product_name {
	background:url('img/x-modules_logo.png') no-repeat; 
	min-height:80px; 
	padding: 24px 0px 24px 100px;
}
.products .svn_mirror {
	padding: 100px 30% 100px 0; 
	background:url('img/svn illustration.png') right no-repeat; 
	min-height:346px; 
}
.products .svn_mirror .product_name, .products .subgit .product_name {
	background:url('img/svn_mirror_logo.png') no-repeat; 
	min-height:80px; 
	padding: 24px 0px 24px 100px;
}
.products .subgit {
	padding: 100px 30% 100px 0;
	background:url('img/svn illustration_bb.png') right no-repeat;
	min-height:346px; 
}
.products .access-control {
	padding: 140px 30% 50px 0; 
	background:url('img/access illustration.png') right no-repeat; 
	min-height:346px; 
}
.products .access-control .product_name {
	background:url('img/access_control_logo.png') no-repeat; 
	min-height:80px; 
	padding: 24px 0px 24px 100px;
}
.products .x-mirror {
	padding: 100px 30% 100px 0; 
	background:url('img/x-mirror illustration.png') right no-repeat; 
	min-height:346px; 
}
.products .x-mirror .product_name, .products .xm_alone .product_name {
	background:url('img/x-mirror_logo.png') no-repeat; 
	min-height:80px; 
	padding: 24px 0px 24px 100px;
}
.products .xm_alone {
	padding: 100px 30% 100px 0;
	background:url('img/x-mirror illustration_bb.png') right no-repeat;
	min-height:346px;  
}
.product_text p {
	margin: 0 80px 40px 0;
}
.products .switch_site {
	max-width: 650px; 
	margin: 0 auto -40px auto; 
	background:url('img/more-tools.png') right no-repeat; 
	min-height:143px; 
}
.products .ss_alone {
	max-width: 650px; 
	margin: 0 auto -40px auto;
	background:url('img/more-tools_bb.png') right no-repeat;
	min-height:143px;
}
.products .switch_site p, .products .ss_alone p {
	padding: 0 300px 0 0;
}

/*X-MODULES*/
.presentations {
	background: linear-gradient(#fff, #fff, #6B889A); 
}
.presentation, .presentation_small, .presentation_mobile {
	margin-top: 80px;
	text-align: center;
}
.presentation_small, .presentation_mobile {
	display: none;
}

.videos {
	max-width: 1200px;
    margin: auto;
}
.videos h2 {	
	margin: 40px auto;
	text-align: center;
	font-weight: normal;
}
.videos h3, .videos .desc {
	width: 40%;
	float: left;
	margin: 20px 0;
	text-align: left;
	font-size: 22px;
	line-height: 1.1em;
}
.videos .desc li {
	font-weight: 700;
}
.videos .desc p {
	font-size: 20px;
	font-weight: 400;
	padding: 5px 0 10px 0;
}
.video_item {
	text-align: right;
	margin: 60px 0;
}
.video_item .small {
	display:none;
}

.download {
	margin: 150px auto;
	text-align: center;
	padding-bottom: 60px;
	background: linear-gradient(#fff, #fff, #6B889A);
}
.download_block {
	display: inline-block;
}
.download h3 {
	padding: 30px;
}
.plugin {
	display: block;
    width: 60%;
    margin: 0 auto 30px auto;
}
.download p {
	font-size: 20px;
    margin-top: 20px;
    font-weight: bold;
}

.testimon {
	background:url('img/spacex.jpg') 0 0 no-repeat; 
	background-size:cover; 
	height: 535px;
}
.testimon_text {
	background: url('img/citate.png') 90% 50% no-repeat;
	margin: 70px 70px 0 0;  
  	float: right; 
	height: 313px;
}
.testimon_text p {
	margin: 40px 90px 230px 0;
	padding-left: 70px;
	width: 390px;
	line-height: 1.3em;
}
.testimon .clients {
	width: 49%;
	padding-top: 50px;
	margin-left: 70px;
	float: left;
}
.testimon .clients span {
	display:inline-block; 
	text-align:center; 
	vertical-align:baseline; 
	width:49%; 
	height:80px;
	padding: 20px; 
}
.testimon .clients span img {
	vertical-align:middle; 
}
.testimon .author {
	text-align:left; 
	/*font-size: 36px;*/
	margin-top: -200px; 
}
.testimon .author a {
	color: #a8a7a7;
	/*font-size: 24px;*/
	text-decoration:none; 
}
.testimon .author a:hover {
	text-decoration:underline; 
}

.team {
	background-image: url('img/astronaut2.png'); 
	background-position: 90% 100%;
	background-repeat: no-repeat;
	background-color: #54788f;
	color: #fff;
	padding: 70px;
	/*background:-moz-linear-gradient(left, #81a0b4 0%, #56778c 100%); 
	background:-webkit-linear-gradient(left, #81a0b4 0%,#56778c 100%); 
	background:linear-gradient(to right, #81a0b4 0%,#56778c 100%); 
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#81a0b4', endColorstr='#56778c',GradientType=1 );
	padding-top:90px; 
	padding-bottom:80px; 
	background:#81a0b4;*/
}
.team h2 {
	color: #fff;
	margin-bottom: 40px;
}
.team p {
	margin-bottom: 40px;
}
.team .mate {
	display: inline-block;
	width: 29%;
	margin: 20px;
}
.team .mate img {
	float: left;
	margin-right: 20px;
}
.team .mate h3 {
	margin: 0px 0 10px 10px;
}
.team .mate p {
	font-size: 18px;
	margin-bottom: auto;
}

.contact {
	margin:70px; 
	/*display:none;*/ 
}
.contact h1 {
	margin-bottom:30px;
}
.contact .form {
	max-width:750px;
}
.contact.x-mod h1 {
	margin-bottom:30px;
	text-align: center; 
}
.contact.x-mod .form {
	max-width:750px;
	margin: auto; 
	text-align: center;
}
.contact.x-mod .support-info {
	text-align: center;
}
.contact .form .issue {
	display:inline-block; 
	margin-left:45px; 
	margin-top:14px; 
}
.contact .form input[type=radio] {
	width:0; 
	height:0; 
	/*visibility:hidden;*/ 
	display:none; 
}
.contact .form textarea {
	height:140px; 
}
.contact .form label {
	color:#bdb6a4; 
	cursor:pointer; 
	height:32px; 
	padding:7px 40px 5px 40px; 
	white-space:nowrap; 
	line-height:50px;
	font-size: 20px; 
}
.contact .form :checked + label {
	color:#80a0b4; 
}
.contact .form label[for='demo'] {
	background:url('img/contact/schedule-n.png') no-repeat 0 center; 
}
.contact .form input[type='radio']#demo:checked + label {
	background:url('img/contact/schedule-h.png') no-repeat 0 center; 
}
.contact .form label[for='quote'] {
	background:url('img/contact/quote-n.png') no-repeat 0 center; 
}
.contact .form input[type='radio']#quote:checked + label {
	background:url('img/contact/quote-h.png') no-repeat 0 center; 
}
.contact .form label[for='tech'] {
	background:url('img/contact/tech-n.png') no-repeat 0 center; 
}
.contact .form input[type='radio']#tech:checked + label {
	background:url('img/contact/tech-h.png') no-repeat 0 center; 
}
.contact .form label[for='other'] {
	background:url('img/contact/other-n.png') no-repeat 0 center; 
}
.contact .form input[type='radio']#other:checked + label {
	background:url('img/contact/other-h.png') no-repeat 0 center; 
}
.contact .contact-success {
	display:none; 
	background:url('img/contact/success.png') 95% 0 no-repeat; 
	min-height:280px; 
	padding-right:500px; 
	padding-top:70px; 
}
.contact .contact-success h2 {
	font-size:30px; 
	line-height:40px; 
}
.contact-error {
	display:none; 
	background:#ff723c; 
	color:#fff; 
	margin-bottom:-90px; 
	margin-top:50px; 
}
.contact-error .wrapper {
	padding-top:25px; 
	padding-bottom:25px; 
}
.contact-error a {
	color:#fff; 
}
.support-info {
	margin-top: 20px;
}

/*FOOTER START*/
footer {
	display:table-row; 
	font-size:17px; 
	vertical-align:bottom; 
	height:1px; width:100%; 
	background:#887d74; 
	/*background:-moz-linear-gradient(left, #887d74 0%, #77705b 30%, #77705b 59%, #887d74 100%); 
	background:-webkit-linear-gradient(left, #887d74 0%,#77705b 30%,#77705b 59%,#887d74 100%); 
	background:linear-gradient(to right, #887d74 0%,#77705b 30%,#77705b 59%,#887d74 100%); 
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#887d74', endColorstr='#887d74',GradientType=1 );*/ 
}
footer .footer_mobile {
	display: none;
	background:#887d74;
}
footer nav p {
	font-size:14px; 
	line-height:20px; 
	color:#b6ae97; 
	font-family:Lato, sans-serif; 
	font-weight: 700; 
}
footer nav {
	display:table; 
	color:#fff; 
	min-height:169px; 
	width:100%; 
	margin-top:40px; 
	margin-bottom:60px; 
}
footer nav .logo {
	display:table-cell; 
	width:200px; 
	background:url('img/logo-white.png') no-repeat 0 0; 
}
footer nav .info {
	display:table-cell; 
}
footer nav .info-wrapper {
	/*max-width:720px;*/ 
	margin:0 auto; 
}
footer nav .info a {
	color:#fff; 
	text-decoration: none; 
}
footer nav .info a:hover {
	color:#6c8ca0; 
}
footer nav .info span {
	display:inline-block; 
	width:30%; 
	margin-left:4%; 
}
footer nav .info span:first-child {
	margin-left:0; 
}
footer nav .info span.address {
	width:35%; 
}
footer nav .info span.terms {
	width:25%; 
}
footer nav .info span.terms a {
	display:block; 
	margin-bottom:0px; 
}
footer nav .info span .ficon {
	padding:3px 0 5px 55px; 
	margin-bottom:20px; 
	display:block; 
}
footer nav .info span .ficon.mailto, .footer_right .ficon.mailto {
	background:url('img/mail.png') no-repeat 0 0; 
}
footer nav .info span .ficon.call, .footer_right .ficon.call {
	background:url('img/phone.png') no-repeat 0 0; 
}
footer nav .info span .ficon.pin, .footer_right .ficon.pin {
	background:url('img/pin.png') no-repeat 5px 0; 
}
footer nav .info span address {
	font-style:normal; 
}
footer nav .info p {
	margin-top:0px; 
}
footer nav .info .copy {
	display:none; 
}
footer nav .social {
	display:table-cell; 
	width:240px; 
	padding-left:20px; 
}
footer nav .social a, .footer_mobile .social a {
	height:53px; 
	width:53px; 
	display:inline-block; 
	margin-left:15px; 
}
footer nav .social a:hover {
	opacity:.7; 
}
footer nav .social a:first-child, .footer_mobile .social a:first-child {
	margin:0px; 
}
footer nav .social p, .footer_mobile .social p {
	margin-top:55px; 
}
footer nav .social .twitter, .footer_mobile .social .twitter {
	background:url('img/twit.png') no-repeat 0 0; 
}
footer nav .social .discourse, .footer_mobile .social .discourse {
	background:url('img/discourse.png') no-repeat 0 0; 
}
footer nav .social .stack, .footer_mobile .social .stack {
	background:url('img/overflow.png') no-repeat 0 0; 
}
.footer_left {
	background:url('img/logo-white.png') no-repeat 0 0;
	display: inline-block;
	margin: 50px;
	width: 35%;
}
.footer_right {
	display: inline-block;
	margin: 50px;
	width: 35%;
}
.footer_left p {
	margin-top: 200px;
	color:#b6ae97;
}
.footer_right .contacts .ficon, .footer_right .terms .ficon {
	font-size: 20px;
	color: #fff;
	padding:3px 0 5px 55px; 
	display: block;
	text-decoration: none;
}
.footer_right .contacts .ficon {
	margin-bottom:20px;
}
.footer_right address {
	font-style: normal;
}
.footer_mobile .social {
	display: block;
	margin-top: 30px;
}

.modal {
	display:none; 
	background:#fff; 
	position:fixed; 
	top:0; left:50%; 
	width:720px; 
	margin-left:-360px; 
	z-index:1200;
}
.modal .wrapper {
	padding:40px;
}
.modal .close {
	display:inline-block; 
	position:absolute; 
	top:25px; 
	right:25px; 
	width:27px; 
	height:27px; 
	cursor:pointer; 
	background:url('img/close.png') no-repeat;
}
.modal .gitlab {
	display:inline-block; 
	position:absolute; 
	top:25px; 
	left:25px; 
	width:27px; 
	height:27px;
	background: url('img/x-mod_gitlab.png') no-repeat 0 0 / 100%; 
}
.modal .opensource {
	display:inline-block; 
	position:absolute; 
	top:25px; 
	left:25px; 
	width:27px; 
	height:27px;
	background: url('img/opensource.png') no-repeat 0 0 / 100%;
}
.modal h2 {
	margin: 0 50px 30px 0;	
}
/*Checkbox*/
.modal .form input[type=checkbox] { 
	width:0; 
	height:0; 
	display:none; 
}
.modal .form input + label { 
	display:inline-block; 
	color:#3f454b; 
	font-weight:400; 
	cursor:pointer; 
	margin:0 30px 30px 0; 
	line-height:33px;
	font-size: 20px; 
}
.modal .form input + label:last-child { 
	margin-right:0; 
}
.modal .form input + label span { 
	display:inline-block; 
	height:34px; 
	width:34px; 
	background:#f7f6f4; 
	border:2px solid #d3cbb8; 
	vertical-align:bottom; 
	margin-right:15px; 
	position:relative; 
}
.modal .form input:checked + label span:before { 
	content:''; 
	position:absolute; 
	top:7px; left:7px; 
	display:block; 
	width:16px; 
	height:16px; 
	background:#d3cbb8; 
}
/*Checkbox end*/

.modal .modal-error {
	display:none; 
	background:#ff723c; 
	color:#fff; 
	margin-top:-40px;
}
.modal .modal-error .wrapper {
	padding-top:5px; 
	padding-bottom:15px;
}
.modal .modal-error a {
	color:#fff;
}
.signup-modal, .cli {
	width:650px!important; 
	position:absolute!important;
}
.signup-modal p, .cli p {
	margin:10px 0;
}
.cli h2, .cli_button {
	text-align: center;
	margin: 30px 0;
}
.signup-modal h5 {
	position:relative; 
	top:-10px;
}
.signup-modal .form .row .col {
	padding: 0;
}
.signup-success {
	display:none;
	background:url('img/contact/success.png') 50% 95% no-repeat; 
	min-height:400px; 
	text-align: center; 
}
.signup-success h2 {
	font-size:30px; 
	line-height:40px; 
}
/*FOOTER END*/

input[type='text'], input[type='email'], input[type='tel'], input[type='password'], textarea {
	width:100%; 
	background:#f5f4f0; 
	border:2px solid #d3cbb8; 
	padding:12px; 
	font-size:20px; 
	-webkit-appearance:none; 
	-moz-appearance:none; 
	appearance:none; 
	/*-webkit-border-radius:0; */
}
textarea {
	padding:12px; 
	-webkit-appearance:none; 
	-moz-appearance:none; 
	appearance:none; 
	/*-webkit-border-radius:0; */
}
input[type='text']:focus, input[type='email']:focus, input[type='tel']:focus, input[type='password']:focus, textarea:focus {
	border-color:#bbb095; 
}
input.required, textarea.required, select.required {
	border-color:#b91b03!important; 
}
select { 
	width:400px; 
	border:2px solid #d3cbb8; 
	padding:12px 30px 12px 12px; 
	font-size:20px; 
	color:#3f454b; 
	cursor:pointer; 
	-webkit-appearance:none; 
	-moz-appearance:none; 
	appearance:none; 
	background:url('img/select-arrow.png') 93% / 13px no-repeat #f5f4f0; 
	-moz-border-radius:0px; 
	-webkit-border-radius:0px; 
	border-radius:0px; 
}
@media screen and (min-width:0\0) { 
	select { 
		background:none; padding:5px; 
	}
}
select:hover { 
	border-color:#bbb095; 
}
select[multiple] {
	padding: 5px;
	background:#f5f4f0;
}
b, strong, .bold { 
	font-family:'Lato', sans-serif; 
	font-weight: 700; 
	position:relative; 
}
.button, button, input[type='submit'] {
	display:inline-block; 
	font-family:Lato, sans-serif; 
	font-weight: 700; 
	color:#fff; 
	text-decoration:none; 
	background:#ff7039; 
	text-align:center; 
	font-size:24px; 
	/*box-shadow:0 7px #e6e2d7;*/ 
	cursor:pointer; 
	padding:15px 45px 15px 45px; 
	border:none; 
	-webkit-appearance:none; 
	-moz-appearance:none; 
	appearance:none; 
	border-radius:10px; 
	-webkit-border-radius:10px; 
}
.button.simple, button.simple, input[type='submit'].simple {
	box-shadow:none; 
}
.button.little, button.little, input[type='submit'].little {
	font-size:15px; 
	padding:10px 19px 12px 19px; 
}
.button.blue, button.blue, input[type='submit'].blue {
	background-color:#81a0b4; 
	/*box-shadow:0 7px #4a697f;*/ 
	color:#fff; 
}
.button.blue:hover, button.blue:hover, input[type='submit'].blue:hover {
	background:#8DAFC4;
}
.button:hover, button:hover, input[type='submit']:hover {
	background:#ff8c60; 
}
.hidden {
	display:none!important;
}
.back {
	display:none; 
	position:fixed; 
	top:0; 
	left:0; 
	background:rgba(128, 160, 180, 0.8); 
	width:100%; 
	height:100%; 
	z-index:1100; 
	cursor:pointer;
}
.col {
	display:inline-block; 
	width:50%;
}
.form .row {
	padding:10px 0;
}
.form .row .col {
	/*display:inline-block;*/ 
	width:50%!important; 
	padding-left:20px; 
	float:left;
}
.form .row .col:first-child {
	padding-left:0;
}
.form input[type='text'], .form input[type='email'], .form input[type='tel'], .form input[type='password'], .form textarea, .form select {
	width:100%;
}
.form .req-error {
	display:none; 
	margin-top:15px; 
	float:right; 
	text-align:right!important;
}
.bold {
	font-family:Lato, sans-serif; 
	font-weight: 700;
}
.small {
	font-size:16px; 
	line-height:20px;
}
.white {
	color:#fff;
}
.red {
	color:#ff7039; 
	vertical-align: baseline;}
.blue {
	color:#6c8ca0; 
	vertical-align: baseline;}
.brown {
	color:#c5bca6; 
	vertical-align: baseline;}
.clearfix::before, .clearfix::after, .form .row::before, .form .row::after {
	content:''; 
	display:table;
}
.clearfix::after, .form .row::after {
	clear:both;
}
/*.clearfix, .form .row {
	zoom:1;
}*/

@media(max-width:1679px) {
    body {
	-webkit-text-size-adjust:100%;
	}
    .wrapper {
	max-width:1599px;
	}
	.top_banner {
		background: url('img/main-illustration_1680.jpg') center no-repeat; 
		/*background-size: cover;*/ 
		min-height: 562px;
	}
	.top_banner_alone {
		background: url('img/main-illustration-standalone_1680.jpg') center no-repeat; 
		/*background-size: cover;*/ 
		min-height: 562px;
	}
	.cosmo {
		margin-top: 100px;
	}
	.top_banner_xmod {
		min-height: 450px;
	}
	.top_banner_xmod .slogan {
		margin-left: 60px;
		background: url(img/x-modules_logo.png) 0 0 / 60px no-repeat;
	}
	.top_banner_xmod .red {
		font-size: 60px;
    	padding-left: 90px;
	}
	.top_banner_xmod h1 {
		line-height: 1.4em;
	}
	.product_item {
		max-width: 1000px;
	}
	.middle_banner {
		background: url('img/middle_banner_1680.png') center no-repeat;
		/*background-size: cover;*/ 
		min-height: 318px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_1680.png') center no-repeat;
		/*background-size: cover;*/ 
		min-height: 318px;
	}
	.middle_banner h2, .middle_banner_alone h2 {
		padding-left: 50px;
	}
	.rocket {
		margin-top: -130px;
		height: 210px;
	}
}

@media (max-width:1439px){
	.top_banner {
		background: url('img/main-illustration_1440.jpg') center no-repeat; 
		/*background-size: cover;*/ 
		min-height: 482px;
	}
	.top_banner_alone {
		background: url('img/main-illustration-standalone_1440.jpg') center no-repeat; 
		/*background-size: cover;*/ 
		min-height: 482px;
	}
	.top_banner h1, .top_banner_alone h1 {
		padding-top: 60px;
	}
	.top_banner_xmod {
		min-height: 400px;
	}
	.top_banner_xmod h1 {
		font-size: 48px;
	}
	.cosmo {
		margin-top: 70px;
	}
	.middle_banner {
		background: url('img/middle_banner_1440.png') center no-repeat;
		/*background-size: cover;*/ 
		min-height: 272px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_1440.png') center no-repeat;
		/*background-size: cover;*/ 
		min-height: 273px;
	}
	.middle_banner h2, .middle_banner_alone h2 {
		padding-left: 100px;
		padding-top: 120px;
	}
	.rocket {
		margin-top: -110px;
		height: 180px;
	}
	.presentation, .presentation_mobile {
		display: none;
	}
	.presentation_small {
		display: block;
	}
}


@media(max-width:1279px) {

	body {
		font-size: 22px;
	}
	h1, h1 * {
		font-size: 42px;
	}
	main {
		margin-top: 0;
	}
	.wrapper {
		margin: 0;
		padding: 0 30px;
	}
	header a.logo {
		background: url(img/logo.png) no-repeat 0 center / 75%;
		width: 250px;
	}
	header nav .submenu {
		background:#fff;
	}
	header nav .menuitem {
		padding-top: 20px;
	}
	.top_banner {
		background: url('img/main-illustration_1280.jpg') center no-repeat; 
		/*background-size: cover;*/ 
		min-height: 428px;
	}
	.top_banner_alone {
		background: url('img/main-illustration-standalone_1280.jpg') center no-repeat; 
		/*background-size: cover; */
		min-height: 428px;
	}
	.top_banner h1, .top_banner_alone h1 {
		padding-top: 40px;
		padding-left: 70px;
	}
	.top_banner_xmod {
		min-height: 350px;
	}
	.top_banner_xmod .slogan {
		margin-left: 40px;
		background-size: 46px;
	}
	.top_banner_xmod .red {
		font-size: 48px;
		padding-left: 60px;
	}
	.top_banner_xmod h1 {
		font-size: 36px;
	}
	.top_banner_xmod h2 {
		font-size: 24px;
	}
	.button {
		padding: 15px 20px;
	}
	.videos {
		max-width: 1000px;
	}
	.cosmo {
		margin-top: 80px;
		height: 100px;
	}
	.product_item {
		max-width: 900px;
	}
	.middle_banner {
		background: url('img/middle_banner_1280.png') center no-repeat;
		/*background-size: cover; */
		min-height: 242px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_1280.png') center no-repeat;
		/*background-size: cover; */
		min-height: 243px;
	}
	.rocket {
		margin-top: -130px;
		height: 170px;
	}
	.middle_banner h2, .middle_banner_alone h2 {
		padding-left: 160px;
	}
	.testimon_text {
		margin: 70px 30px 0 0;
	}
	.testimon .clients {
		width: 45%;
		margin-left: 30px;
	}
	.team .mate {
		width: 45%;
	}
	.contact {
		margin: 50px;
	}
}

@media(max-width:1023px) {
	h1, h1 * {
		font-size: 36px; 
	}
	h2, h2 * {
		font-size: 30px;
	}
	header nav {
		font-size: 16px;
	}
	header nav a {
		margin-right:10px; 
		font-size:16px;
		}
	header a.logo {
		width: 200px;
	}
	.puzzle {
		background-size: 60%;
	}
	.top_banner_xmod .slogan {
		display: block;
		width: auto;
	}
	.top_banner_xmod .xmod_video {
		display: block;
		width: 90%;
		margin: auto;
		padding: 20px 0;
	}
	.cosmo {
		margin: 80px 85% 0 0;
	}
	.rocket {
		margin-top: -120px;
	}
	/*.wrapper {
	max-width:820px!important;
	}*/
	.product_item {
		max-width: 700px;
	}
	.products .x-modules {
		padding: 100px 30% 50px 0; 
		background:url('img/x-modules illustration.png') right / 45% no-repeat; 
		min-height:346px;
	}
	.products .x-modules .product_name {
		background:url('img/x-modules_logo.png') top left / 15% no-repeat; 
		min-height:80px; 
		padding: 24px 0px 24px 100px;
	}
	.products .svn_mirror {
		padding: 100px 30% 100px 0; 
		background:url('img/svn illustration.png') right / 45% no-repeat; 
		min-height:346px; 
	}
	.products .svn_mirror .product_name, .products .subgit .product_name {
		background:url('img/svn_mirror_logo.png') top left / 15% no-repeat; 
		min-height:80px; 
		padding: 24px 0px 24px 100px;
	}
	.products .subgit {
		padding: 100px 30% 100px 0;
		background:url('img/svn illustration_bb.png') right / 45% no-repeat;
		min-height:346px; 
	}
	.products .access-control {
		padding: 140px 30% 50px 0; 
		background:url('img/access illustration.png') right / 45% no-repeat; 
		min-height:346px; 
	}
	.products .access-control .product_name {
		background:url('img/access_control_logo.png') top left / 15% no-repeat; 
		min-height:80px; 
		padding: 24px 0px 24px 100px;
	}
	.products .x-mirror {
		padding: 100px 30% 100px 0; 
		background:url('img/x-mirror illustration.png') right / 45% no-repeat; 
		min-height:346px; 
	}
	.products .x-mirror .product_name, .products .xm_alone .product_name {
		background:url('img/x-mirror_logo.png') top left / 15% no-repeat; 
		min-height:80px; 
		padding: 24px 0px 24px 100px;
	}
	.products .xm_alone {
		padding: 100px 30% 100px 0;
		background:url('img/x-mirror illustration_bb.png') right / 45% no-repeat;
		min-height:346px;  
	}
	.videos {
		max-width: 750px;
	}
	.videos h2 {
		font-size: 24px;
		margin: 20px auto;
	}
	.videos h3 {
		width: auto;
		float: none;
		margin: 0;
		text-align: center;
	}
	.videos .desc {
		width: 40%;
		font-size: 18px;
		margin: 0 20px;
	}
	.videos video {
		width: 50%;
	}
	.video_item {
		text-align: center;
		margin: auto;
	}
	.testimon {
		position: relative;
	}
	.testimon .clients {
		margin-left: -20px;
	}
	.testimon .clients span {
		display: block;
		position: absolute;
		top: 550px;
		animation: slideOne 10s linear infinite;
	}
	.testimon .clients span:nth-child(1){
		animation-delay: 1s;
	}
	.testimon .clients span:nth-child(2){
		animation-delay: 2s;
	}
	.testimon .clients span:nth-child(3){
		animation-delay: 3s;
	}
	.testimon .clients span:nth-child(4){
		animation-delay: 4s;
	}
	.testimon .clients span:nth-child(5){
		animation-delay: 5s;
	}
	.testimon .clients span:nth-child(6){
		animation-delay: 6s;
	}
	.testimon .clients span:nth-child(7){
		animation-delay: 7s;
	}
	.testimon .clients span:nth-child(8){
		animation-delay: 8s;
	}
	.testimon .clients span:nth-child(9){
		animation-delay: 9s;
	}

	.team .mate {
		width: 90%;
	}

    footer nav .info span .ficon {
	background:none!important; 
	padding:0;
	}
    footer nav .logo {
	display:none;
	}
    footer nav .info p {
	background:url('img/logo-white.png') no-repeat 0 0; 
	background-size:auto 100%; 
	padding-left:100px;
	}
    footer nav .info span.terms a {
	margin-bottom:7px;
	}
    footer nav .social {
	width:190px;
	}
    footer nav .social a {
	height:42px; 
	width:42px; 
	background-size:42px 42px!important; 
	margin-left:15px;
	}
	
	.contact .contact-success {
		padding-right:300px; 
		background-position:100% center; 
		background-size:auto 200px;
	}

	.team {
		position: relative;
	}
}

@keyframes slideOne {
	from { top: 550px;}
	to {top: -100px;}
}
@keyframes slideTwo {
	from { margin-left: -100px; }
	to { margin-left: 3000px; }
}

@media(max-width:799px) {
	header {
		position:fixed; 
		z-index:1000; 
		background:#fff; 
		border-bottom:2px solid #f7f6f4; 
		width:100%; 
		/*height:75px;*/ 
		top:0;
	}
	header a.logo {
		width:277px; 
		height:83px; 
		background-size:auto 72px;
	}
	header nav {
		display:none; 
		position:fixed; 
		float:none; 
		width:200px; 
		left:0; 
		top:90px; 
		padding:10px 0; 
		background:#fff; 
		/*border-bottom:2px solid #f7f6f4;*/
	}
	header nav a {
		display:block; 
		padding:15px;
	}
	header .nav-toggle {
		display:inline-block;
		margin-top: 15px;
	}
	header nav .menuitem {
		display:block;
		line-height: 0.5em;
	}
	nav .submenu {
		display: none;
		position: relative;
		z-index: 1;
		padding: 5px 0 0 20px;
		width: 400px;
	}
	nav .subitem {
		line-height: 0.5em;
	}
	/*main {
		padding-top: 40px;
	}*/
    .top_banner {
		background: url('img/top_banner_800_cosmo.jpg') center no-repeat; 
		background-size: cover; 
		min-height: 399px;
		margin-top: 80px;
	}
	.top_banner_alone {
		background: url('img/top_banner_alone_800_cosmo.jpg') center no-repeat; 
		background-size: cover; 
		min-height: 401px;
		margin-top: 80px;
	}
	.top_banner .slogan, .top_banner_alone .slogan {
		top: -140px;
		position: absolute;
		left: 15%;
		text-align: center;
	}
	.top_banner_xmod {
		min-height: 300px;
		margin-top: 100px;
	}
	.top_banner_xmod h1 {
		font-size: 42px;
	}
	.top_banner_xmod .red {
		font-size: 48px;
	}
	.cosmo {
		display: none;
	}
	.scroll a span {
		display: none;
	}
	.videos .desc {
		width: auto;
		margin: 0 30px;
	}
	.videos video {
		width: auto;
	}
	.product_item {
		margin: auto 30px;
	}
	.products .x-modules, .products .svn_mirror, .products .access-control, .products .x-mirror, .products .subgit, .products .xm_alone {
		padding-top: 50px;
	}
	.middle_banner {
        background: url('img/middle_banner_800_rocket.png') center no-repeat; 
		background-size: cover; 
		min-height: 163px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_800_rocket.png') center no-repeat; 
		background-size: cover; 
		min-height: 164px;
	}
	.rocket {
		display: none;
	}
	.middle_banner h2, .middle_banner_alone h2 {
        padding-top: 60px;
        padding-left: 80px;
	}
	.presentation, .presentation_small {
		display: none;
	}
	.presentation_mobile {
		display: block;
	}
	.testimon .clients {
		margin: 0;
		width: 100%;
		float: none;
	}
	.testimon .clients span {
		position: absolute;
		top: 450px;
		left: -300px;
		animation: slideTwo 10s linear infinite;
	}
	
    .wrapper {
		max-width:100%!important; 
		padding: 0 30px;
		margin: 0;
	}
    h1, h1 * {
		font-size:30px; 
		/*margin-bottom:40px;*/
	}
    h2, h2 * {
		font-size:30px; 
		/*margin-bottom:20px;*/
	}

	footer .footer_mobile {
		display: block;
	}
	footer .wrapper.clearfix {
		display: none;
	}
	    
    .modal {
		position:absolute; 
		width:100%!important; 
		left:0!important; 
		margin:0!important; 
		padding:0!important;
	}
    .modal .container {
		overflow-y:auto; 
		height:100%;
	}
    .modal .container .wrapper {
		padding:40px 20px;
	}
    .modal .close {
		position:static; 
		float:right;
	}
    .modal h2 {
		font-size:25px!important;
	}
    .row .col, .col, .form .col, .contact .form .col, .form .row .col {
		display:block!important; 
		width:100%!important; 
		float:none!important; 
		margin:0!important; 
		padding:0!important; 
	}
    .form .row .col {
		padding:20px 0 0 0!important;
	}
    .form .req-error {
		text-align:left!important; 
		width:100%!important; 
		margin-bottom:20px;
		font-size: 24px;
	}
    .cookies {
		margin-top:72px;
	}
	.cookies .wrapper {
		/*margin-top: 100px;*/
		padding-top: 30px;
	}
	.contact {
		padding-bottom: 50px;
	}
	.contact h1 {
		margin-top: 30px;
	}
    .contact .form .issue {
		display:block; 
		margin-left:0; 
		margin-top:20px;
	}
    .contact .form label {
		display:inline-block!important; 
		width:50%; margin-bottom:20px; 
		padding-left:25px; 
		padding-top:5px!important; 
		line-height:25px; 
		font-size:20px; 
		background-size:20px auto!important;
	}
    .contact .form label[for='quote'], .contact .form label[for='other'] {
		width:40%; 
		position:relative; 
		left:10px;
	}
    .contact .contact-success {
		padding-right:0; 
		padding-bottom:80%; 
		padding-top:0; 
		background-position:center bottom; 
		background-size:100% auto;
	}
	
    .team {
		padding:30px;
	}
    .team h2 {
		font-size:35px!important; 
		margin-bottom:40px!important;
	}
	.team .mate img {
    	width: 25%;
	}
}

@media (max-width: 600px) {
	.top_banner {
		background: url('img/top_banner_600_cosmo.jpg') center no-repeat; 
		background-size: cover; 
		min-height: 300px;
		margin-top: 80px;
	}
	.top_banner_alone {
		background: url('img/top_banner_alone_600_cosmo.jpg') center no-repeat; 
		background-size: cover; 
		min-height: 301px;
		margin-top: 80px;
	}
	.top_banner .slogan, .top_banner_alone .slogan {
		left: 5%;
	}
	.top_banner_xmod h1 {
		font-size: 36px;
	}
	.products .switch_site {
		max-width: 550px;
	}
	.middle_banner {
        background: url('img/middle_banner_600_rocket.png') center no-repeat; 
		background-size: cover; 
		min-height: 122px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_600_rocket.png') center no-repeat; 
		background-size: cover; 
		min-height: 123px;
	}
	.middle_banner h2, .middle_banner_alone h2 {
		padding-top: 30px;
	}
	video {
		width: 400px;
		margin: -20px 0;
	}
	.videos h2 {
		font-size: 24px;
	}
	.videos h3 {
		font-size: 20px;
	}
	.footer_left, .footer_right {
		margin: 20px;
		width: 90%;
	}
	.footer_right .contacts .ficon, .footer_right .terms .ficon {
		font-size: 18px;
	}
}

@media (max-width: 415px) {
	header a.logo {
		width: 200px;
		background-size: 80%;
	}
	body {
		font-size: 18px;
	}
	h2, h2 * {
		font-size: 30px;
		/*margin-bottom: 20px;*/
	}
	.top_banner {
		background: url('img/top_banner_375_cosmo.png') center no-repeat; 
		background-size: cover; 
		min-height: 187px;
		margin-top: 80px;
	}
	.top_banner_alone {
		background: url('img/top_banner_alone_375_cosmo.png') center no-repeat; 
		background-size: cover; 
		min-height: 188px;
		margin-top: 80px;
	}
	.top_banner .slogan, .top_banner_alone .slogan {
		left: 0;
		padding-left: 50px;
	}	
	.top_banner_xmod .slogan {
		background-size: 35px;
	}
	.top_banner h1, .top_banner_alone h1 {
		padding-left: 0;
	}
	.top_banner_xmod h1 {
		font-size: 24px;
	}
	.top_banner_xmod .button {
		margin: 20px 0 0 0;
	}
	.red {
		font-size: 30px;
	}
	.top_banner_xmod .red {
		font-size: 36px;
		padding-left: 60px;
	}
	.video_item .large {
		display:none;
	}
	.video_item .small {
		display:block;
	}
	.plugin {
		width: 50%;
	}
	.product_item {
		margin: 0 20px 40px 20px;
	}
	.products .x-modules {
		padding: 30px 0;
		background: url('img/x-modules illustration.png') bottom / 100% no-repeat;
		min-height: 580px;
	}
	.products .x-modules .product_name, .products .svn_mirror .product_name, .products .access-control .product_name, .products .access-control .product_name, .products .subgit .product_name, .products .xm_alone .product_name {
		padding: 10px 0 0 80px;
	}
	.products .svn_mirror {
		padding: 30px 0;
		background: url('img/svn illustration.png') bottom / 100% no-repeat;
    	min-height: 450px;
	}
	.products .subgit {
		padding: 30px 0;
		background: url('img/svn illustration_bb.png') bottom / 100% no-repeat;
    	min-height: 450px;
	}
	.products .access-control {
		padding: 30px 0;
		background: url('img/access illustration.png') bottom / 100% no-repeat;
		min-height: 580px;
	}
	.products .x-mirror {
		padding: 30px 0;
		background: url('img/x-mirror illustration.png') bottom / 100% no-repeat;
		min-height: 450px;
	}
	.products .xm_alone {
		padding: 30px 0;
		background: url('img/x-mirror illustration_bb.png') bottom / 100% no-repeat;
		min-height: 450px;
	}
	.products .switch_site {
		max-width: 350px;
		margin: 20px;
    	background: url('img/more-tools.png') right / 50% no-repeat;
	}
	.products .ss_alone {
		max-width: 350px;
		margin: 20px;
    	background: url('img/more-tools_bb.png') right / 50% no-repeat;
	}
	.products .switch_site p, .products .ss_alone p {
		padding: 20px 150px 0 0;
	}
	.middle_banner {
        background: url('img/middle_banner_375_rocket.png') center no-repeat; 
		min-height: 76px;
	}
	.middle_banner_alone {
		background: url('img/middle_banner_alone_375_rocket.png') center no-repeat; 
		min-height: 77px;
	}
	.middle_banner h2, .middle_banner_alone h2 {
		padding-top: 0px;
		padding-left: 65px;
	}
	.testimon {
		height: 350px;
	}
	.testimon_text {
		background: url('img/citate.png') 80% / 65% no-repeat;
		margin: auto;
		float: right;
		height: 250px;
	}
	.testimon_text p {
		margin-bottom: 200px;
		padding-left: 150px;
	}
	.testimon .author, .testimon .author a {
		font-size: 18px;
		padding-top: 20px;
	}
	.testimon .clients span {
		top: 250px;
	}
	.team {
		padding: 20px;
	}
	.team .mate {
		margin: 0;
	}
	.team .mate p {
		font-size: 16px;
		margin-bottom: 20px;
	}
}