/*body {
	font-family: 'Gilroy';
    font-weight: normal;
    font-style: normal;
	background: #fff;
	margin: 0;
	width: 100vw;
	overflow-x: hidden;
} */
body {
	font-family: 'Gilroy';
    font-weight: normal;
    font-style: normal;
	background: #1a89e3;  
	margin: 0;
	width: 98vw;
}
/*body.body_contacts {
	font-family: 'Gilroy';
    font-weight: normal;
    font-style: normal;
	background: #1e33e5;
	margin: 0;
	width: 100vw;
}  */

body.body_reasons {
	font-family: 'Gilroy';
    font-weight: normal;
    font-style: normal;
	background: #fff;
	margin: 0;
	width: 100vw;
}  

.fixed_html {
	position: fixed;
	height: 100vh;
}

html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	font-family: 'Gilroy';
    font-weight: normal;
    font-style: normal;
    line-height: 1.15;
    width: 98vw;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: none;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-font-smoothing: antialiased;
}

html:before, html:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

.slideout::after {
    transform: scaleX(1);
    transform-origin: left;
    transition: transform 0.35s ease;
}

body::after {
    top: 0px;
    left: 0px;
    content: ' ';
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 10000;
    background: #1a89e3;
    transform: scaleX(1);
    transform-origin: left;
    transition: transform 0.3s ease;
}



.slidein::after {
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.35s ease;
	transition-delay: 0s;
    transition-delay: .2s;
}

body.rolled::before {
    transform: translate(0);
    transition-delay: .2s;
}
/*
body.body_contacts.rolled::before {
    transform: translate(0);
    transition-delay: .2s;
}
*/
/*
body.body_contacts:before {
    content: ' ';
    position: fixed;
    background-image: url(/images/lenin.svg);
    background-position: top right;
    top: 0px;
    right: 0px;
    z-index: -1;
    pointer-events: none;
    overflow-x: hidden;
    transition: transform 5s ease;
	transition-delay: 0s;
    transform: translate(20%,-20%);
    width: 50%;
    height: 50%;
    background-repeat: repeat;
	background-size: 50%;
}  */
body.body_reasons:before {
    content: ' ';
    position: fixed;
    background-image: url(/images/ou.svg);
    background-position: top right;
    top: 0px;
    right: 0px;
    z-index: -1;
    pointer-events: none;
 /*   overflow-x: hidden; */
    transition: transform 1s ease;
	transition-delay: 0s;
  /*  transform: translate(20%,-20%);  */
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
	background-size: contain;
} 
body:before {
    content: ' ';
    position: fixed;
    background-image: url(/images/romb.svg);
    background-position: right bottom;
    top: 0px;
    right: 0px;
    z-index: -1;
    pointer-events: none;
/*    overflow-x: hidden;*/
    transition: transform 1s ease;
	transition-delay: 0s;
    transform: translate(20%,-20%);
    transform:scaleX(2);
    background-repeat: no-repeat;
	background-size: contain;
}

@media (min-width: 320px) {
/*	body.body_contacts:before {
		width: 50%;
		height: 50%;
	}  */
	body:before {
	   display:none;
		width: 100%;
		height: 100%;
	}
}

@media (min-width: 640px) {
/*	body.body_contacts:before {
		width: 50%;
		height: 50%;
	}*/
	body:before {
	    display:block;
		width: 100%;
		height: 100%;
	}
}


@media (min-width: 1024px) {
/*	body.body_contacts:before {
		width: 70%;
		height: 70%;
	}  */
	body:before {
	    display:block;
		width: 60%;
		height: 100%;
	}
}

@media (min-width: 1280px) {
/*	body.body_contacts:before {
		width: 100%;
		height: 100%;
	}*/
	body:before {
	    display:block;
		width: 100%;
		height: 100%;
	}
}

@media (min-width: 1360px) {
/*	body.body_contacts:before {
		width: 80%;
		height: 80%;
	} */
	body.body_reasons:before {
		width: 80%;
		height: 80%;
	} 
	body:before {
	    display:block;
		width: 100%;
		height: 100%;
	}
}

@media (min-width: 1590px) {
/*	body.body_contacts:before {
		width: 80%;
		height: 80%;
	} */
	body:before {
	    display:block;
		width: 100%;
		height: 100%;
	}
}


@media (min-width: 1900px) {
/*	body.body_contacts:before {
		width: 90%;
		height: 90%;
	}  */
	body:before {
	    display:block;
		width: 100%;
		height: 100%;
	}
}