body {
	padding: 0;
	margin: 0;
	font-size: 16px;
	display: block;
	overflow-x:hidden; /*Убираем горизонтальный скролл*/
	font-family: russo-one;
    background: var(--primary-background);
    letter-spacing: 0.06em;
}

:root {
  --primary-colorText: #fff;
  --primary-background: #0B111F;
}

h1, h2, h3, h4, h5, h6, ul, li,
blockquote, code, dd, div,
dl, dt, fieldset, form, input, p,
pre, td, textarea, th {
	padding: 0;
	margin: 0;
}

ul, li {
	display: inline-block;
}

ul {
	z-index: 1;
    position: relative;
}


@font-face {
	font-family: 'russo-one';
	src: url(../fonts/russo-one.ttf);
}	
@font-face {
	font-family: 'rubikMonoOne';
	src: url(../fonts/rubikMonoOne.ttf);
}



/*header*/
.header {
	height: 100vh;
}

._conteiner {
	width: 1170px;
	margin: auto;
	padding-top: 22px;
}

.header__conteiner {
	position: relative;
}

.header__wrapper, .header__connection {
	display: flex;
    align-items: center;
    justify-content: space-between;
}

.header__wrapper a,
.section_contacts,
.section_contacts a {
    text-decoration: none;
    color: var(--primary-colorText);
}

.header__logo {
    font-size: 36px;
}

.menu_toggle,
.section_company__rightimage,
.section_types__price {
	display: none;
}

.nav a {
	color: var(--primary-colorText);
	text-decoration: none;
	list-style-type: circle;
    margin-right: 45px;
}

.nav a:hover,
.phone:hover,
.mail:hover,
.head_request:hover{
	border-bottom: 2px solid #fff;
}

.phone {
	font-family: russo-one;
	color: var(--primary-colorText);;
	margin-right: 45px;
}

.fixed {
	position: fixed;
	top: 0;
	/*background: rgba(80, 136, 219, 1);*/
	z-index: 100;
	text-align: center;
	padding: 0;
	width: 1170px;
}

.fix_active {
	position: fixed;
	top: 0;
	background: var(--primary-background);
    z-index: 99;
    width: 100%;
    height: 45px;
}

.header__wrapper_title {
	position: relative;
}

.header__wrapper_title__title {
	position: relative;
	width: 470px;
}


h1 {
	font-family: rubikMonoOne;
	font-weight: 400;
	color: var(--primary-colorText);
	font-size: 64px;
	text-transform: uppercase;
    margin-top: 40%;
    text-align: center;
}

.header__wrapper_title__title p {
	color: #fff;
	font-size: 17px;
	white-space: pre-line;
	margin-top: 12px;
}

.head_title_image_triangleOne {
    position: absolute;
    top: 3%;
    left: 0;
}

.head_title_image_triangleTwo {
    position: absolute;
    top: 30%;
    right: 0;
}

.head_title_image_brain {
    position: absolute;
    bottom: auto;
    left: 0;
}

.head_request {
    position: absolute;
    right: 0;
    margin-top: 10%;
    color: var(--primary-colorText);
    text-decoration: none;
}

.strelka {
	position: absolute;
    right: 0;
    bottom: 5%;
    left: 0;
    text-align: center;
    animation: strelka 1.8s infinite;
}

@keyframes strelka {
    0%{
        opacity: 0;
        transform: translateY(-50px);
    }
    50%{
        opacity: 1;
        transform: translateY(0);
    }
    100%{
        opacity: 0;
        transform: translateY(0);
    }
}

.section_company__leftname,
.section_types__rectangle,
.fixed, .phone, .nav a {
	transition: all 0.5s ease;
}

/*section_company*/

.section_company__title,
.section_portfolio__title {
	display: flex;
	align-items: center;
}

h2 {
    font-size: 32px;
    color: var(--primary-colorText);
    margin: 10rem 0;
}

.section_company__line,
.section_portfolio__line {
	background: #C8E9FE;
    height: 4px;
    width: 476px;
    margin-left: 8px;
    margin-bottom: 10px;	
}

.section_company__wrapper {
	display: flex;
	margin-bottom: 30px;
}

.section_company__leftname {
    height: 77px;
    width: 476px;
    border: 2px solid #C8E9FE;
    border-radius: 10px;
    margin-left: 110px;
    margin-top: 18px;
}

.leftname_active, .section_company__leftname:hover {
	background: url(../img/strelka_w_left.svg) rgba(0, 178, 255, 0.19) no-repeat 97%;
}

.section_company__leftname p {
	line-height: 77px;
    margin-left: 23px;
}

.section_company__wrapper_rightimage {
	height: 271px;
    width: 506px;
    border: 2px solid #C8E9FE;
    border-radius: 10px;
    margin-left: 36px;
    margin-top: 18px;
    text-align: center;
}

.rightimage,
.rightimage_active {
    height: 100%;
}

.rightimage_active,
.price_active {
    display: block;
}


/*section_types*/

.section_types {
	background: rgba(0, 178, 255, 0.19);
	height: 419px;
	position: relative;
}

.section_types__conteiner {
	padding: 0;
}

.section_types__radiusup,
.section_types__heading,
.section_types__price {
	position: absolute;
    margin: auto;
    right: 0;
    left: 0;
}

.section_types__radiusup,
.section_types__radiusdown {
	width: 14em;
    height: 6em;
    background: white;
    margin: auto;
}

.section_types__radiusup {
	border-radius: 0 0 50% 50% / 0 0 100% 100%;
	margin-top: -18px;
    margin-bottom: 94px;
}

.section_types__radiusdown {
	position: absolute;
	right: 0;
	left: 0;
	bottom: -18px;
	border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

.section_types__heading {
	text-align: center;
	top: 18px;
}

.section_types__price {
    text-align: center;
    bottom: 35px;
}

.section_types__rectangle {
    height: 77px;
    width: 239px;
    border: 1px solid #41B5FF;
    background: white;
    border-radius: 10px;
    text-align: center;
    justify-content: space-between;
    margin: auto;
    margin-top: 171px;
}

.rectangle_active {
	box-shadow: 0 0 7px 2px #41B5FF;
}

.section_types__rectangle:hover {
	box-shadow: 0 0 7px 2px #41B5FF;
}

.section_types__rectangle p {
	line-height: 77px;
}

/*section_portfolio*/

.section_portfolio {
	
}

.section_portfolio__wrapper {
	
}

.section_portfolio__cards {
    display: flex;
    justify-content: center;
}

.section_portfolio__card {
	position: relative;
	height: 207px;
	width: 160px;
	border: 2px solid #C8E9FE;
	border-radius: 10px;
	text-align: center;
	margin-top: 122px;
	margin-right: 42px;
	transition: all 0.5s ease;
}

.section_portfolio__card:hover{
    transform: scale(1.2);
}

.section_portfolio__card_title {
    font-family: merienda;
    font-size: 14px;
    font-weight: 700;
    padding-top: 122px;
}

.section_portfolio__card_description {
    font-size: 12px;
    margin-top: 10px;
}

.section_portfolio__card_picture {
    position: absolute;
    top: -40px;
    left: 6px;
    border-radius: 10px;
}

.section_portfolio__card space {
    color: #FF800B;
}

.section_portfolio__card a {
	color: var(--primary-colorText);
	text-decoration: none;
	list-style-type: circle;
}


/*Section_Services*/

.section_services {
    position: relative;
}

.section_services__blocks {
    height: 404px;
}

.section_services_cardOne {
    position: absolute;
    background: url(..//img/cardOne.jpg) transparent left / cover;
    height: 404px;
    width: 50%;
    left: 0;
}

.section_services_cardTwo {
    position: absolute;
    background: url(..//img/cardTwo.jpg) left / cover;
    height: 404px;
    width: 50%;
    right: 0;
}

.section_services_cardThree {
    position: absolute;
    background: url(..//img/cardThree.jpg) left / cover;
    height: 404px;
    width: 50%;
    left: 0;
}

.section_services__blocks h2 {
    text-align: right;
    padding-top: 10rem;
}

.section_services_cardTwo {
    right: 0;
}

h2.services_title_cardTwo {
    text-align: left;
    padding-top: 10rem;
}


/*
.section_portfolio_design {
    height: 623px;
    position: relative;
}

.section_portfolio_design h2 {
    position: absolute;
    top: 25%;
    right: 0;
}

h2.web_title {
    position: absolute;
    top: 25%;
    left: 0;
}

.section_portfolio__design_picture,
.section_portfolio__mobile_picture {
    position: absolute;
    left: -30%;
    height: 100%;
}

.section_portfolio__web_picture {
    position: absolute;
    right: -30%;
    height: 100%;
}
*/


/*Section_Contacts*/

.section_contacts__phone {
    border-right: 0.15rem solid #fff;
    height: 155px;
}

.section_contacts_wrapper {
    display: flex;
    align-items: center;
    margin-top: 120px;
    justify-content: space-between;
}

.section_contacts_wrapper h3 {
    font-size: 48px;
}

.section_contacts__phone {
    padding-right: 7%;
    text-align: right;
}




/*footer*/

.footer {
	background: rgba(0, 178, 255, 0.19);
	margin-top: 120px;
	padding: 0 0 22px 0;
    color: var(--primary-colorText);
	
}

.footer h2 {
    margin: 1rem 0;
}


.footer_icon:hover{
    transform: scale(1.1);
    transition: all 0.5s ease;
}

.footer_icon {
    margin-right: 5px;
    margin-top: 5px;
}

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

.footer_wrapper__center {
	margin-left: 192px;
}

.footer_wrapper__right {
	margin-left: 68px;
}

.footer_blocks {
	height: 40px;
    width: 304px;
    border: 1px solid #41B5FF;
    background: white;
    border-radius: 10px;
    margin-top: 15px;
    display: flex;
    line-height: 40px;
    padding: 0 6px;
}

#scroll_top {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 15px;
	padding-top: 45px;
	z-index: 100;
	background: url(..//img/strelka_up.svg) no-repeat top / contain;
	opacity: 0.5;
	color: #41B5FF;
	text-decoration: none;

}
#scroll_top:hover {
 	opacity: 1;
}