* {
  padding: 0;
  margin: 0;
  border: 0;
}


*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


:focus,
:active {
  outline: none;
}
a:focus,
a:active {
  outline: none;
}


nav,
footer,
header,
aside {
  display: block;
}

ul, li {
    list-style: none;
}

html,
body {
  height: 100%;
  width: 100%;
  font-size: 100%;
  line-height: 1;
  font-size: 14px;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}


input,
button,
textarea {
  font-family: inherit;
}


input::-ms-clear {
  display: none;
}
button {
  cursor: pointer;
}
button::-moz-focus-inner {
  padding: 0;
  border: 0;
}
a,
a:visited {
  text-decoration: none;
}
a:hover {
  text-decoration: none;
}

img {
  vertical-align: top;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: 400;
}





div {
    box-sizing: border-box;
}

nav {
    float: right;
    margin-top: 81px;
}

body {
    background-color: #f6f9fa;
}

.heading {
    height: 150px;
}

.container {
    width: 82%;

    margin: 0 auto;
}

.logo {
    margin-top: 53px;
    float: left;
    margin-right: 20px;
    width: 200px;
    height: 100px;
}

.menu {
    margin: 0;
    padding: 0;
    display: block;
}

.menu li {
    float: left;
    display: block;
    margin-right: 41px;
    font-size: 20px;
    font-family: "Gilroy-Medium";
}

.menu a {
    color: #000000;
    text-decoration: none;

}

@font-face {
    font-family: "Gilroy-Medium";
    src: url("./fonts/Gilroy/gilroy-medium.ttf") format("truetype");
    font-style: 500;
    font-weight: 500;
}

@font-face {
    font-family: "Gilroy-Bold";
    src: url("./fonts/Gilroy/gilroy-bold.ttf");
    font-style: 700;
    font-weight: 700;
}
@font-face {
    font-family: 'Gilroy';
    src: url('./fonts/Gilroy/gilroy-regular.ttf');
    font-style: normal;
    font-weight: normal;
}

.career {
    font-family: Gilroy-Bold;
    font-size: 150px;
    letter-spacing: 0.05em;
    color: #3C414F;
    margin: 145px 0 0 0;
    

}

.EMIT {
    margin-left: 110px;
    font-family: Gilroy-Bold;
    font-size: 150px;
    letter-spacing: 0.05em;
    color: #3C414F;
}

.one-line {
    display: flex;
    flex-direction: row;
}

.description {
    font-family: Gilroy;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 23px;
    letter-spacing: 0.05em;
    color: #3C414F;
    margin-top: 110px;
    width: 353px;
    height: 50px;
}

.for-students {
    font-family: Gilroy-Bold;
    font-size: 100px;
    line-height: 59px;
    letter-spacing: 0.05em;
    color: #3C414F;
    text-align: left;
    max-width: 277px;
}

.buttons-for-students {
    width: 250px;
    height: 250px;
    left: 596px;
    top: 702px;
    flex-direction: column;
    background: linear-gradient(102.51deg, rgba(255, 255, 255, 0.5) 14.21%, rgba(255, 255, 255, 0.5) 88.62%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.2), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    border-radius: 30px;
    margin-right: 42px;
    margin-bottom: 42px;
    padding: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}


.button-text {
    font-family: Gilroy;
    font-style: normal;
    font-weight: normal;
    font-size: 30px;
    color: #00123F;
    text-align: left;
}

.table-for-students {
    max-width: 438px;
    padding-top: 100px;
}

.flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 245px;
}

.title {
    margin-bottom: 290px;
    margin-left: 121px;
}

.buttons-for-students p {
    vertical-align: top;
    width: 197px;
    margin-left: 30px;
}



.list {
    width: 470px;
    height: 270px;

    background: linear-gradient(102.51deg, rgba(255, 255, 255, 0.3) 14.21%, rgba(255, 255, 255, 0.3) 88.62%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.15), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    
    z-index: 2;
    border-radius: 30px;
    display: flex;
    padding: 38px;
    align-items: center;
    
}

.flex-1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 350px;
    padding-top: 250px;
}
.employers p {
    width: 393px;
    height: 62px;

    font-family: Gilroy-Bold;
    font-size: 50px;
    line-height: 59px;
    text-align: center;
    letter-spacing: 0.05em;

    color: #3C414F;
}

.list p {
    font-family: Gilroy;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 23px;
    text-align: left;
    letter-spacing: 0.05em;
    color: #00123F;
    
}



.line {
    margin-left: 12px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.line div {
    margin-bottom: 54px;
}

.line div:last-child {
    margin-bottom: 0px;
}

.options {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-left: 25px;
}

.options a {
    margin-bottom: 54px;
}



.options a:last-child {
    margin-bottom: 0px;   
}

.white-stuff {
    width: 100%;
    height: 750px;
    margin-bottom: 133px;
    
    background: #FFFFFF;
}

.our-projects {
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.plitki {
    height: 539px;
    display: flex;
    justify-content: space-between;
    padding-top: 57px;
}

.plitki p {
    width: 148.39px;
    height: 58.41px;
    font-family: Gilroy-Bold;
    font-size: 25px;
    line-height: 29px;
    text-align: center;
    letter-spacing: 0.05em;
    margin: auto;
    color: #3C414F;
    z-index: 2;
}

.our-projects p {
    font-family: Gilroy-Bold;
    font-size: 50px;
    line-height: 59px;
    text-align: center;
    letter-spacing: 0.05em;
    color: #3C414F;
}

.plitka-1 {
    width: 273.35px;
    height: 325px;
    padding: 40px;
    text-align: center;
    position: relative;
    background: linear-gradient(90.96deg, rgba(251, 174, 188, 0.5) 0.1%, rgba(255, 255, 255, 0.5) 104.24%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.2), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);

    border-radius: 20px;
    display: flex;
    justify-content: center;
    transition: 0.3s;
}

.plitka-1:hover {
    transform: scale(1.1);
}

.plitka-2:hover {
    transform: scale(1.1);
}

.plitka-3:hover {
    transform: scale(1.1);
}


.plitka-2 {
    width: 273.35px;
    height: 325px;
    padding: 40px;
    display: flex;
    justify-content: center;
    text-align: center;
    background: linear-gradient(90.96deg, rgba(250, 215, 186, 0.5) 0.1%, rgba(255, 255, 255, 0.5) 104.24%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.2), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    /* Note: backdrop-filter has minimal browser support */
    position: relative;
    border-radius: 20px;
    transition: 0.3s;
}


.plitka-3 {
    width: 273.35px;
    height: 325px;
    padding: 40px;
    display: flex;
    justify-content: center;
    text-align: center;
    background: linear-gradient(90.96deg, rgba(104, 65, 221, 0.5) 0.1%, rgba(255, 255, 255, 0.5) 104.24%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.2), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(15px);
    /* Note: backdrop-filter has minimal browser support */
    
    border-radius: 20px;
    transition: 0.3s;
}

.white-stuff-2 {
    width: 100%;
    height: 350px;
    flex-direction: column;
    background: #FFFFFF;
    border-radius: 30px;
}


.contacts-phrase {
    width: 95px;
    height: 24px;
    font-family: Gilroy;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0.05em;
    color: #00123F;
}


.contacts {
    width: 266px;
    height: 23px;
    font-family: Gilroy;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 23px;
    letter-spacing: 0.05em;
    color: #00123F;
}

.contacts a{
    color: #00123F;
}

.contacts-list {
    padding-top: 39px;
    display: flex;
    flex-direction: column;
    height: 150px;
}

.contacts-list p{
    margin-bottom: 27px;
}

.contacts-list p:last-child{
    margin-bottom: 0;
}

.red-ellipse-1 {
    position: absolute;
    width: 66.32px;
    height: 64.53px;
    left: 155px;
    top: 214px;
    z-index: 1;

    border-radius: 50%;
    background: linear-gradient(118.68deg, #FBAEBC 1.22%, #B8485C 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(15px);
}

.red-ellipse-2 {
    position: absolute;
    width: 37px;
    height: 36px;
    left: 73px;
    top: 141px;
    z-index: 1;
    border-radius: 50%;
    background: linear-gradient(118.68deg, #FBAEBC 1.22%, #B8485C 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(15px);
}

.yellow-ellipse-1 {
    position: absolute;
    width: 37px;
    height: 36px;
    left: 154px;
    top: 198px;
    z-index: 1;
    border-radius: 50%;
    background: linear-gradient(118.68deg, #FAD7BA 1.22%, #FAAB6B 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(10px);
}

.yellow-ellipse-2 {
    position: absolute;
    left: 49px;
    top: 61px;
    width: 64.31px;
    height: 62.57px;
    border-radius: 50%;
    background: linear-gradient(118.68deg, #FAD7BA 1.22%, #FAAB6B 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(10px);
    z-index: 1;
}

.purple-ellipse-1 {
    position: absolute;
    width: 65.54px;
    height: 63.77px;
    left: 172px;
    top: 119px;

    border-radius: 50%;
    background: linear-gradient(118.68deg, #FAD7BA 1.22%, #6841DD 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(10px);

    z-index: 1;
}

.purple-ellipse-2 {
    position: absolute;
    width: 37px;
    height: 36px;
    left: 77px;
    top: 220px;
    
    border-radius: 50%;
    background: linear-gradient(118.68deg, #FAD7BA 1.22%, #6841DD 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    filter: blur(10px);
}

.glass {
    position: absolute;
    width: 295.71px;
    height: 227.67px;
    left: 990px;
    top: 350px;
    z-index: 2;
    background: linear-gradient(102.51deg, rgba(255, 255, 255, 0.5) 14.21%, rgba(255, 255, 255, 0.5) 88.62%);
    box-shadow: 0px 30px 100px rgba(0, 0, 0, 0.2), inset 5px -5px 4px rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);

    border-radius: 30px;
    transform: rotate(-100.61deg);
}

.ellipse-glass-1 {
    z-index: 3;
    position: absolute;
    width: 37px;
    height: 36px;
    left: 1080px;
    top: 560px;
    border-radius: 50%;
    
    background: linear-gradient(118.68deg, #FAD7BA 1.22%, #6841DD 82.91%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
}

.ellipse-glass-2 {
    z-index: 1;
    position: absolute;
    width: 139px;
    height: 137px;
    left: 1100px;
    top: 240px;
    border-radius: 50%;
    
    background: linear-gradient(117.72deg, #FAD7BA 11.85%, #6841DD 90.98%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
}

.glass-text {
    position: absolute;
    width: 40px;
    height: 23px;
    left: 20px;
    top: 170px;
    
    font-family: Gilroy;
    font-style: normal;
    font-weight: 300;
    font-size: 20px;
    line-height: 23px;
    
    text-align: center;
    
    color: rgba(0, 0, 0, 0.3);
    transform: rotate(87deg);
}

.ellipse-employers-1 {
    position: absolute;
    width: 69px;
    height: 67px;
    left: 430px;
    top: 2030px;
    border-radius: 50%;
    background: linear-gradient(117.72deg, #FAD7BA 11.85%, #6841DD 90.98%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    z-index: 3;
}

.ellipse-employers-2 {
    position: absolute;
    width: 109px;
    height: 107px;
    left: 530px;
    top: 2290px;
    border-radius: 50%;
    background: linear-gradient(117.72deg, #FAD7BA 11.85%, #6841DD 90.98%);
    box-shadow: 0px 2px 100px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.marker {
    width: 21px;
    height: 20px;
    background: #F9F9F9;
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1), inset 0px 1px 1px rgba(0, 0, 0, 0.25);
    border-radius: 50%;
    box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.1), inset 0px 1px 1px rgba(0, 0, 0, 0.25);;
}