* {
    color: #111222;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
}

body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    overflow-x: hidden;

}

.container {
    display: flex;
    flex-direction: column;
    overflow-x: hidden;

}

.main {
    padding: 0 120pt;
    min-height: 79.5vh;

}
 
/* Navigation menu */

.nav {
    padding: 8pt 120pt ;
    display: flex;
    flex-direction: row;
    border-bottom: 3pt solid #e6e6e6;
    border-bottom-style: groove;
}

.nav .logo {
    flex-grow: 1;
    width: 240pt;
    min-width: 200pt;
    height: 40pt;

    background-image: url(/img/logo_header.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.menu , .menu_mobile {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.menu  a {
    margin-right: 20pt;

    font-size: large;
    font-weight: bold;

    outline: none;
    text-decoration: none;
}

.text {
    flex-grow: 1;

    line-height: 24pt;
    font-size: larger;
    margin: 16pt 0 0 0;
}

.text:first-of-type {
    margin-top: 0;
}

.header {
    padding: 60pt 0 40pt 0;
    font-size: 36pt;
    font-weight: 700;

    text-align: center;
}

.education__cards .header {
    padding-top: 80pt;
}

.main > h2 {
    text-align: center;
}

/* About Us */

.about_main_cards {
    border-radius: 10pt;
    background-color: rgba(219, 238, 255, 0.3);
    padding: 32pt;
    margin-bottom: 24pt;
}

.about_main_cards h1 {
    margin-top: 0;
}

.under__header {
    height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0 24pt;
    background: linear-gradient( #ffffff, #cce2f7, #76adff, #4864ff, #232b97, #111222);
}

.under__header .header {
    padding: 40pt 0 28pt 0;
    font-weight: 800;
}

.under__header h1 {
    text-align: center;
    border: none;
    padding-bottom: 40pt;
}

.about__card {
    margin: 24pt 0 20pt;
}

.about_us_icon {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    justify-items: center;
    align-items: center;

    padding: 40pt 0;
    background-color: rgba(219, 238, 255, 0.3);
    border-radius: 10pt;

}


.about_content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 24pt;
}

.about_sert {
    width: 240pt;
    height: 300pt;
    background-image: url(/img/sert.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.about_us_icon .icon_first {
    width: 150pt;
    height: 160pt;
    
    background-image: url(/img/niokr.svg);
    background-repeat: no-repeat;
    background-size: contain;
}


.about_us_icon .icon_second {
    width: 150pt;
    height: 160pt;

    background-image: url(/img/sdot.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.about_us_icon .icon_third {
    width: 150pt;
    height: 160pt;

    background-image: url(/img/education.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.about_us_icon h3 {
    text-align: center;
}


/* NIOKR */

.niokr {
    margin: 0;
}

.general__info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background-color: rgba(219, 238, 255, 0.3);
    gap: 24pt;

    padding: 32pt;
    border-radius: 10pt;
}


.gi__text {
    font-size: larger;

    margin: 0;
}

.general__info .right {
    font-weight: bolder;
    font-size: 22px;
}

.general__info a {
    margin-top: 20pt;
    text-decoration: none;
}

.niokr__card > div{
    margin-top: 40pt;
}

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

.niokr__card .card {
    background-color: rgba(219, 238, 255, 0.3);
    border-radius: 10pt;
    padding: 32pt;
}

.niokr__card .card .photo {
    height: 220pt;
    width: 220pt;
    min-width: 220pt;
    border-radius: 15pt;
    background-repeat: no-repeat;
    background-size: contain;
}

.niokr__card .card:nth-child(2n) .text{
    padding-left: 40pt;
    padding-right: 0;

}

.niokr__card .text {
    padding: 0 40pt 0 0;
    margin: 0;
}

.first__niokr__card .photo {
    background-image: url(/img/niokr1.png);
}

.second__niokr__card .photo {
    background-image: url(/img/niokr2.png);
}

.third__niokr__card .photo {
    background-image: url(/img/niokr3.png);
}
.fourth__niokr__card .photo {
    background-image: url(/img/niokr4.png);
}
.fifth__niokr__card .photo {
    background-image: url(/img/niokr5.png);
}

.niokr ul {
    padding-left: 0;
    margin: 0;
}

.niokr li {
    margin-left: 0;
}


/* differences */

.dif_cards {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-rows: max-content;
    gap: 24pt;
}

.dif_cards .text{
    font-size: larger;
    margin: 0;

}

.dif_cards .text::before {
    display: block;

    width: 36pt;
    height: 36pt;
    margin-bottom: 12pt;

    content:'';
    background-repeat: no-repeat;
    background-size: contain;
}

.dif_cards .one::before {
    background-image: url(/img/card_numb1.svg);
}

.dif_cards .two::before {
    background-image: url(/img/card_numb2.svg);
}

.dif_cards .three::before {
    background-image: url(/img/card_numb3.svg);
}

.dif_cards .four::before {
    background-image: url(/img/card_numb4.svg);
}

.dif_cards .five::before {
    background-image: url(/img/card_numb5.svg);
}

.dif_cards .six::before {
    background-image: url(/img/card_numb6.svg);
}

.dif_cards .seven::before {
    background-image: url(/img/card_numb7.svg);
}

.dif_cards .eight::before {
    background-image: url(/img/card_numb8.svg);
}

.dif_cards .nine::before {
    background-image: url(/img/card_numb9.svg);
}

.dif_cards .ten::before {
    background-image: url(/img/card_numb10.svg);
}

.dif_cards .eleven::before {
    background-image: url(/img/card_numb11.svg);
}

.dif_cards .twelve::before {
    background-image: url(/img/card_numb12.svg);
}


/* solutions */

.sol_card {
    background-color: rgba(219, 238, 255, 0.3);
    border-radius: 10pt;
    padding: 32pt;
    margin-bottom: 36pt;

    font-size: larger;
    font-weight: bolder;
}

.sol_card__info {
    display: grid;
    grid-template-columns:  1fr 1fr;
    grid-auto-rows: max-content;
    gap: 24pt;
}


/* SDOT */

.sdot__card {
    background-color: rgba(219, 238, 255, 0.3);
    border-radius: 10pt;
    padding: 32pt;
    margin-bottom: 24pt;
}

.sdot__card:first-of-type {
    align-self: center;
}

.sdot_module h2 {
    padding-top: 40pt;
}
.sdot__info h2 {
    margin: 0;
    margin-bottom: 20pt;
}

.sdot__lists {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24pt;
}

.sdot__lists .text::before {
    width: 40pt;
    height: 40pt;
    margin-bottom: 20pt;

    content:'';
    background-repeat: no-repeat;
    background-size: contain;

    display: block;
}

.sdot__list.text:first-of-type {
    margin-top: 12pt;
}

.sdot__lists .one::before {
    background-image: url(/img/card_numb1.svg);
}

.sdot__lists .two::before {
    background-image: url(/img/card_numb2.svg);
}

.sdot__lists .three::before {
    background-image: url(/img/card_numb3.svg);
}

.sdot__lists .four::before {
    background-image: url(/img/card_numb4.svg);
}

.sdot__lists .five::before {
    background-image: url(/img/card_numb5.svg);
}

.sdot__lists .six::before {
    background-image: url(/img/card_numb6.svg);
}

.sdot__lists .seven::before {
    background-image: url(/img/card_numb7.svg);
}

.sdot__lists .eight::before {
    background-image: url(/img/card_numb8.svg);
}

.sdot__lists .nine::before {
    background-image: url(/img/card_numb9.svg);
}

.sdot__lists .ten::before {
    background-image: url(/img/card_numb10.svg);
}

.sdot__lists .eleven::before {
    background-image: url(/img/card_numb11.svg);
}

.sdot__lists .twelve::before {
    background-image: url(/img/card_numb12.svg);
}

/* education */

.buttons {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24pt;
}

.button {

    padding: 12pt;
    border-radius: 10pt;
    border: 1pt solid rgb(115, 213, 255);
/* background-color: rgba(219, 238, 255, 0.3); */

    font-weight: 600;

    text-align: center;
}

.button:hover {
    background-color: #cce9f7;
}

.button.active {
    background-color: #cce9f7;    
}

.education__cards{
    display: none;
}

.education_card {
    margin-bottom: 36pt;
    padding: 32pt;
    border-radius: 10pt;
    background-color: rgba(219, 238, 255, 0.3);
}

.education_card_info {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.education_card_info.real {
    display: flex;
    flex-direction: column;
}


/* TABLE  */

table {
    
    border: 1pt solid #111222;
    table-layout: fixed;

    border-collapse: collapse;
    padding: 4pt;
}

tr, td, th{
    border: 1pt solid #111222;
    padding: 4pt;
    margin: 0;
}

th {
    padding: 12pt 4pt 12pt 4pt;
    background-color: rgba(219, 238, 255, 0.3);
}

td:nth-child(3), td:nth-child(4) {
    text-align: center;
    vertical-align:middle;
}

td {
    padding: 12pt 4pt 12pt 4pt;
    vertical-align: top;

}


/* списки */

* ul, * li {
    font-weight: normal;
    font-size: 13pt;
}

h2 {
    margin: 0;
    margin-bottom: 28pt;
    padding-bottom: 8pt;
    border-bottom: 1pt dashed #0061d3;
}

ul {
    list-style-type: none;
    padding-left: 20pt;
}

ul li {
    padding: 0;
    padding-left: 16pt;
    margin: 12pt 0 12pt 20pt;

    background-image: url(/img/ul_li.svg);
    background-size: 8pt 8pt;
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: 6pt;

    font-size: larger;
}

ol {
    padding-left: 0;
}

ol li {
    margin: 12pt 0 12pt 20pt;
    font-size: larger;
    line-height: 18pt;
}

ol li::marker {
    color: #0061d3;
    font-weight: 600;
}

.disabled {
    pointer-events: none;
}

/* contact */ /* contact */ /* contact */ /* contact */ /* contact */ /* contact */


.contact_card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24pt;
}

.contact_info {
    display: flex;
    flex-direction: row;
    padding-bottom: 24pt;
}

.info_contact {
    width: 100%;
    min-width: 300px;
}

.contact_text {
    flex-grow: 1;
    font-size: 16pt;
    text-align: left;
}

.contact_info > .logo {
    width: 22pt;
    height: 22pt;
    min-width: 22pt;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 12pt;
}

.place .logo {
    background-image: url(/img/map-pin.svg);
}

.email .logo {
    background-image: url(/img/mail.svg);
}

.whats_phone .logo {
    background-image: url(/img/whatsapp.svg);
}

.phone .logo {
    background-image: url(/img/phone.svg);
}

/* Clients logo */

.client {
    margin-bottom: 40pt;
}

.client_logos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 24pt;
}

.client_logos > div{
    width: 120pt;
    min-width: 80pt;
    height: 60pt;
    padding: 0 12pt;

    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-origin: padding-box;
    

    border: 1pt solid #8ad0ff;
    border-radius: 10pt;


}

.cli_log_a {
    background-image: url(/img/cli_logo/1.svg);
}
.cli_log_b {
    background-image: url(/img/cli_logo/2.svg);
}
.cli_log_c {
    background-image: url(/img/cli_logo/3.svg);
}
.cli_log_d {
    background-image: url(/img/cli_logo/4.svg);
}
.cli_log_e {
    background-image: url(/img/cli_logo/5.svg);
}
.cli_log_f {
    background-image: url(/img/cli_logo/6.svg);
}
.cli_log_j {
    background-image: url(/img/cli_logo/7.svg);
}
.cli_log_h {
    background-image: url(/img/cli_logo/8.svg);
}
.cli_log_i {
    background-image: url(/img/cli_logo/9.svg);
}
.cli_log_j {
    background-image: url(/img/cli_logo/10.svg);
}
.cli_log_k {
    background-image: url(/img/cli_logo/11.svg);
}
.cli_log_l {
    background-image: url(/img/cli_logo/12.svg);
}
.cli_log_m {
    background-image: url(/img/cli_logo/13.svg);
}
.cli_log_n {
    background-image: url(/img/cli_logo/14.svg);
}
.cli_log_o {
    background-image: url(/img/cli_logo/15.svg);
}

/* FOOTER */

.footer {
    width: 100%;
    position:relative;
    bottom: 0;

    border-top: 3pt solid #e6e6e6;
    border-top-style: groove;
    padding: 20pt 0;
    margin-top: 60pt;
}

.footer span {
    padding: 0 120pt;
}

#scrollToTopBtn {
    display: none;
    position: fixed;
    bottom: 80px;
    right: 50px;
    width: 40pt;
    height: 40pt;
    padding: 10px;
    background-image: url(/img/up_btn.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-color: unset;
    border: none;
    border-radius: 20px;
    cursor: pointer;
}

#scrollToTopBtn:hover {
    background-color: rgba(219, 238, 255, 0.3);
}

.menu_mobile{
    display: none;
}

.burger {
    width: 25pt;
    height: 25pt;
    background-image: url(/img/burger.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.burger.active {
    width: 16pt;
    height: 16pt;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg' stroke='%23121212'%3e%3cg id='SVGRepo_bgCarrier' stroke-width='0'%3e%3c/g%3e%3cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3e%3c/g%3e%3cg id='SVGRepo_iconCarrier'%3e%3cpath d='M20.7457 3.32851C20.3552 2.93798 19.722 2.93798 19.3315 3.32851L12.0371 10.6229L4.74275 3.32851C4.35223 2.93798 3.71906 2.93798 3.32854 3.32851C2.93801 3.71903 2.93801 4.3522 3.32854 4.74272L10.6229 12.0371L3.32856 19.3314C2.93803 19.722 2.93803 20.3551 3.32856 20.7457C3.71908 21.1362 4.35225 21.1362 4.74277 20.7457L12.0371 13.4513L19.3315 20.7457C19.722 21.1362 20.3552 21.1362 20.7457 20.7457C21.1362 20.3551 21.1362 19.722 20.7457 19.3315L13.4513 12.0371L20.7457 4.74272C21.1362 4.3522 21.1362 3.71903 20.7457 3.32851Z' fill='%23121212'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
    background-color: unset;
}

.links {
    display: none;
}

.links.active{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    padding: 32pt 0;

    position: absolute;
    width: 100%;
    max-width: 400px;
    top: 56pt;
    right: 0;
    background: #ffffff;
}

.links > a {
    width: 100%;
    font-size: 14pt;
    font-weight: 600;
    padding: 12pt 0;
    text-decoration: none;
    text-align: center;
}

.links > a:hover {
    background-color: #cce9f7;
}

.links > a:first-of-type {
    border-top: unset;
}

h1 {
    padding-top: 32pt;
}

a {
    text-decoration: none;
}

.service {
    margin-bottom: 40pt;
}

.btn {
    background-color: rgba(219, 238, 255, 0.3);
    border-radius: 12pt;
    padding: 10pt;
    margin: 4pt;

    font-size: larger;
}

.btn:hover {
    background-color: #cce2f7;
}

.buttons-nav {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

}