/* ==================================================================================================== Variables */
/* ==================================================================================================== General HTML */
html, body {
  width: 100%;
  height: 100%;
}

body, td, th {
  font-family: "Raleway", sans-serif;
  color: #252525;
  font-size: 16px;
  font-weight: 400;
}

body {
  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  background: #FAFAFA;
}

body.no_scroll {
  overflow: hidden;
}

a:link,
a:hover,
a:visited,
a:active {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  font-weight: normal;
  font-family: "Comfortaa", sans-serif;
}

p {
  margin: 0;
  padding: 0;
  margin-top: 1em;
}

p:first-child {
  margin-top: 0;
}

img {
  border: 0;
}

textarea,
select,
input,
input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-background-clip: padding;
  -moz-background-clip: padding;
  background-clip: padding-box;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-appearance: none;
  appearance: none;
  background: none;
  color: #3f3f3f;
  outline: 0;
  margin: 0;
  padding: 0;
  text-align: left;
  font-family: "Raleway", sans-serif;
  font-size: 16px;
  font-weight: normal;
  /* vertical-align: middle; */
  border: none;
  display: block;
  width: 100%;
}

textarea::-webkit-input-placeholder,
select::-webkit-input-placeholder,
input::-webkit-input-placeholder,
input[type=date]::-webkit-input-placeholder,
input[type=datetime]::-webkit-input-placeholder,
input[type=datetime-local]::-webkit-input-placeholder,
input[type=email]::-webkit-input-placeholder,
input[type=month]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=search]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=text]::-webkit-input-placeholder,
input[type=time]::-webkit-input-placeholder,
input[type=url]::-webkit-input-placeholder,
input[type=week]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #808080;
  opacity: 1;
}

textarea::-moz-placeholder,
select::-moz-placeholder,
input::-moz-placeholder,
input[type=date]::-moz-placeholder,
input[type=datetime]::-moz-placeholder,
input[type=datetime-local]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=month]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=search]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=text]::-moz-placeholder,
input[type=time]::-moz-placeholder,
input[type=url]::-moz-placeholder,
input[type=week]::-moz-placeholder { /* Firefox 19+ */
  color: #808080;
  opacity: 1;
}

textarea:-ms-input-placeholder,
select:-ms-input-placeholder,
input:-ms-input-placeholder,
input[type=date]:-ms-input-placeholder,
input[type=datetime]:-ms-input-placeholder,
input[type=datetime-local]:-ms-input-placeholder,
input[type=email]:-ms-input-placeholder,
input[type=month]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=search]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=text]:-ms-input-placeholder,
input[type=time]:-ms-input-placeholder,
input[type=url]:-ms-input-placeholder,
input[type=week]:-ms-input-placeholder { /* IE 10+ */
  color: #808080;
  opacity: 1;
}

textarea:-moz-placeholder,
select:-moz-placeholder,
input:-moz-placeholder,
input[type=date]:-moz-placeholder,
input[type=datetime]:-moz-placeholder,
input[type=datetime-local]:-moz-placeholder,
input[type=email]:-moz-placeholder,
input[type=month]:-moz-placeholder,
input[type=number]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=search]:-moz-placeholder,
input[type=tel]:-moz-placeholder,
input[type=text]:-moz-placeholder,
input[type=time]:-moz-placeholder,
input[type=url]:-moz-placeholder,
input[type=week]:-moz-placeholder { /* Firefox 18- */
  color: #808080;
  opacity: 1;
}

::selection {
  background: #252525; /* WebKit/Blink Browsers */
  color: #FFF;
}

::-moz-selection {
  background: #252525; /* Gecko Browsers */
  color: #FFF;
}

/* ==================================================================================================== General Content */
.clear {
  clear: both;
}

.shadow {
  -webkit-box-shadow: 5px 10px 20px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 5px 10px 20px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 5px 10px 20px 0px rgba(0, 0, 0, 0.3);
}

.round {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  overflow: hidden;
}

.circle {
  -webkit-border-radius: 100em;
  -moz-border-radius: 100em;
  border-radius: 100em;
  overflow: hidden;
}

.custom_transition .no {
  -o-transition: all 0s ease-in-out none !important;
  -moz-transition: all 0s ease-in-out none !important;
  -webkit-transition: all 0s ease-in-out none !important;
  transition: all 0s ease-in-out none !important;
}
.custom_transition .slow {
  -o-transition: all 5s ease-in-out !important;
  -moz-transition: all 5s ease-in-out !important;
  -webkit-transition: all 5s ease-in-out !important;
  transition: all 5s ease-in-out !important;
}
.custom_transition .medium {
  -o-transition: all 2s ease-in-out !important;
  -moz-transition: all 2s ease-in-out !important;
  -webkit-transition: all 2s ease-in-out !important;
  transition: all 2s ease-in-out !important;
}
.custom_transition .fast {
  -o-transition: all 0.3s ease-in-out !important;
  -moz-transition: all 0.3s ease-in-out !important;
  -webkit-transition: all 0.3s ease-in-out !important;
  transition: all 0.3s ease-in-out !important;
}

.text_link a,
a.text_link {
  color: #df195d;
}

.text_link a:hover,
a.text_link:hover {
  text-decoration: underline;
}

img .fill {
  width: 100%;
}
img .block {
  display: block;
}

.link_area {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.content_width {
  position: relative;
  width: 100%;
  max-width: 1000px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
  align-items: stretch;
}

.button_master {
  padding: 12px 32px;
  box-sizing: border-box;
  border-radius: 4px;
  text-align: center;
  font-family: "Comfortaa", sans-serif;
  border: 1px solid #252525;
  color: #252525;
  font-size: 12px;
  font-weight: 700;
}

/* ==================================================================================================== Logo */
.logo {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.logo .logo_container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 240px;
  height: 240px;
  border-radius: 1000px;
  background: rgba(255, 255, 255, 0.95);
  transform: translateY(-40px);
}
.logo .logo_container.hide {
  filter: blur(20px);
  opacity: 0;
  pointer-events: none;
}
.logo .logo_container img {
  width: 100px;
  display: block;
}
@supports (backdrop-filter: blur()) {
  .logo .logo_container {
    background: rgba(255, 255, 255, 0.2);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
  }
}

/* ==================================================================================================== Projects */
.project_wrap {
  padding-top: 100vh;
  padding-bottom: 40vh;
  box-sizing: border-box;
  width: 100%;
  min-height: 150vh;
  position: relative;
  z-index: 2;
}
.project_wrap .item {
  flex-basis: calc(33.333333% - 16px);
  border-radius: 16px;
  border: 1px solid #FFF;
  background: rgba(255, 255, 255, 0.95);
  padding: 24px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
}
.project_wrap .item .project_logo {
  width: auto;
  height: 48px;
  display: block;
  margin-bottom: 8px;
}
.project_wrap .item .text {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  pointer-events: none;
}
.project_wrap .item .text p {
  font-size: 12px;
}
@supports (backdrop-filter: blur()) {
  .project_wrap .item {
    background: rgba(255, 255, 255, 0.2);
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
  }
}

/* ==================================================================================================== Footer */
.footer {
  padding: 24px;
  text-align: center;
  font-size: 12px;
  font-family: "Lato", sans-serif;
  color: #3f3f3f;
}

/* ==================================================================================================== Desktop */
@media all and (min-width: 1000px) { /* Desktop */
  .mobile_only {
    display: none !important;
  }
  .grow:hover {
    transform: scale(1.01);
  }
  .item:hover {
    background: rgb(255, 255, 255) !important;
    border: 1px solid #EAEAEA;
  }
  .item:hover .button_master {
    color: #FFF;
    background-color: #252525;
  }
}
/* ==================================================================================================== Mobile */
@media all and (max-width: 1000px) { /* Mobile */
  .desktop_only {
    display: none !important;
  }
  /* ==================================================================================================== Logo */
  .logo .logo_container {
    width: 150px;
    height: 150px;
    background: #FAFAFA;
    transform: translateY(-100px);
  }
  .logo .logo_container img {
    width: 75px;
    display: block;
  }
  @supports (backdrop-filter: blur()) {
    .logo .logo_container {
      background: rgba(255, 255, 255, 0.2);
      -webkit-backdrop-filter: blur(15px);
      backdrop-filter: blur(15px);
    }
  }
  .project_wrap {
    padding-bottom: 24px;
  }
  .project_wrap .content_width {
    max-width: none;
  }
  .project_wrap .content_width .item {
    flex-basis: 100%;
  }
  .particle.blur {
    filter: blur(15px);
  }
}/*# sourceMappingURL=style.css.map */