From afbace5940a92ae0c812da8f32d47a82ccdf8525 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ferit=20Yi=C4=9Fit=20BALABAN?= <fyb@duck.com>
Date: Fri, 22 Jul 2022 00:45:12 +0300
Subject: [PATCH] Update dev server

---
 resources/styles/main.css | 923 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 923 insertions(+)
 create mode 100644 resources/styles/main.css

diff --git a/resources/styles/main.css b/resources/styles/main.css
new file mode 100644
index 0000000..5a1681d
--- /dev/null
+++ b/resources/styles/main.css
@@ -0,0 +1,923 @@
+@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@600&display=swap");
+.showcase {
+  display: flex;
+  height: 90vh;
+  background-image: url("../img/index/g.jpg");
+  background-position: center;
+  background-size: cover;
+  background-repeat: no-repeat;
+}
+@media screen and (max-width: 850px) {
+  .showcase {
+    height: 95vh;
+  }
+}
+
+.showcase-animation {
+  animation: slideshow-appear 1000ms;
+}
+
+@keyframes slideshow-appear {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+.table {
+  display: flex;
+  flex-direction: column;
+}
+.table .table-item {
+  margin-top: 10px;
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+}
+.table .table-item p {
+  font: x-large sans-serif;
+}
+@media screen and (max-width: 1100px) {
+  .table .table-item p {
+    font-size: large;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .table-item p {
+    font-size: xx-small;
+  }
+}
+.table .table-item img {
+  margin-right: 20px;
+  width: 150px;
+}
+@media screen and (max-width: 1100px) {
+  .table .table-item img {
+    margin-right: 10px;
+    width: 100px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .table-item img {
+    margin-right: 2px;
+    width: 60px;
+  }
+}
+@media screen and (max-width: 400px) {
+  .table .table-item img {
+    margin: 0 0 2px 0;
+    width: 100px;
+  }
+}
+.table .table-item .vertical-separator {
+  height: 120px;
+  border: solid 1px #1d60b5;
+  margin-right: 180px;
+}
+@media screen and (max-width: 1100px) {
+  .table .table-item .vertical-separator {
+    margin-right: 90px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .table-item .vertical-separator {
+    margin-right: 18px;
+  }
+}
+@media screen and (max-width: 400px) {
+  .table .table-item .vertical-separator {
+    display: none;
+  }
+}
+.table .table-item .horizontal-separator {
+  display: none;
+  width: 120px;
+  border: solid 1px #1d60b5;
+  margin: 0 0 18px 0;
+}
+@media screen and (max-width: 400px) {
+  .table .table-item .horizontal-separator {
+    display: block;
+  }
+}
+.table .table-item:first-of-type {
+  margin-top: 0;
+}
+@media screen and (max-width: 400px) {
+  .table .table-item {
+    flex-direction: column;
+  }
+}
+.table .reverse {
+  flex-direction: row-reverse;
+}
+.table .reverse img {
+  margin-right: 0;
+  margin-left: 20px;
+}
+@media screen and (max-width: 1100px) {
+  .table .reverse img {
+    margin-left: 10px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .reverse img {
+    margin-left: 2px;
+  }
+}
+.table .reverse .vertical-separator {
+  margin-right: 0;
+  margin-left: 180px;
+}
+@media screen and (max-width: 1100px) {
+  .table .reverse .vertical-separator {
+    margin-left: 90px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .reverse .vertical-separator {
+    margin-left: 18px;
+  }
+}
+@media screen and (max-width: 400px) {
+  .table .reverse {
+    flex-direction: column;
+  }
+  .table .reverse img {
+    margin: 0 0 2px 0;
+    width: 100px;
+  }
+}
+.table .square img {
+  height: 150px;
+  width: auto;
+}
+@media screen and (max-width: 1100px) {
+  .table .square img {
+    height: 100px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .table .square img {
+    height: 60px;
+  }
+}
+@media screen and (max-width: 400px) {
+  .table .square img {
+    height: 100px;
+  }
+}
+.table .table-item-animation {
+  animation: slide-in-right 3000ms;
+}
+.table .table-item-animation-reverse {
+  animation: slide-in-left 3000ms;
+}
+@keyframes slide-in-left {
+  from {
+    transform: translateX(-5%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0%);
+    opacity: 1;
+  }
+}
+@keyframes slide-in-right {
+  from {
+    transform: translateX(5%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0%);
+    opacity: 1;
+  }
+}
+
+.social {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background: linear-gradient(to left, #1d60b5, #3b8fff);
+  color: white;
+}
+.social p {
+  font: 700 32px "Montserrat", sans-serif;
+  margin: 30px 0;
+}
+.social .social-button {
+  display: inline-block;
+  height: 52px;
+  width: auto;
+  border: 2px solid white;
+  border-radius: 50%;
+  margin: 0 10px 0 0;
+}
+.social .social-button img {
+  margin: 10px;
+  height: 32px;
+  width: 32px;
+}
+.social .social-button:hover {
+  background-color: white;
+}
+.social .social-button:hover img {
+  filter: brightness(0) saturate(100%) invert(29%) sepia(52%) saturate(2311%) hue-rotate(197deg) brightness(87%) contrast(88%);
+}
+.social .social-button:last-of-type {
+  margin: 0;
+}
+@media screen and (max-width: 400px) {
+  .social .social-button {
+    margin: 0 0 30px 0;
+  }
+}
+@media screen and (max-width: 400px) {
+  .social {
+    flex-direction: column;
+  }
+  .social p {
+    font-size: 20px;
+    font-weight: 600;
+    text-align: center;
+  }
+}
+
+table {
+  width: 100%;
+  border: solid 1px black;
+}
+
+td {
+  padding: 1vw;
+  border: solid 1px black;
+}
+
+.documents {
+  display: flex;
+  flex-direction: row;
+  background: linear-gradient(to left, #1d60b5, #3b8fff);
+}
+.documents .document {
+  margin: 0 5vw 0 0;
+  padding: 1vh 1vw;
+  flex: 1;
+  display: block;
+  filter: light(50%);
+  text-align: center;
+  border-radius: 20px;
+}
+.documents .document:last-of-type {
+  margin: 0;
+}
+.documents .document:hover {
+  background-color: rgba(255, 255, 255, 0.75);
+  transition: 250ms cubic-bezier(0.4, 0, 1, 1);
+}
+.documents .document:hover img {
+  filter: brightness(0) saturate(100%) invert(15%) sepia(90%) saturate(2506%) hue-rotate(220deg) brightness(96%) contrast(90%);
+}
+.documents .document:hover h1 {
+  color: #1d409d;
+}
+.documents .document img {
+  margin: 0 0 2.5vh 0;
+  height: 100px;
+}
+.documents .document h1 {
+  color: white;
+  font: 600 18px Montserrat, sans-serif;
+}
+@media screen and (max-width: 1515px) {
+  .documents .document {
+    display: inline-flex;
+    align-items: center;
+    margin: 0 0 4.5vh 0;
+  }
+  .documents .document:last-of-type {
+    margin: 0;
+  }
+  .documents .document img {
+    margin: 0 2.5vw 0 0;
+  }
+  .documents .document h1 {
+    text-align: left;
+  }
+}
+@media screen and (max-width: 420px) {
+  .documents .document img {
+    width: 50px;
+    margin: 0 2vw 0 0;
+  }
+}
+@media screen and (max-width: 1515px) {
+  .documents {
+    flex-direction: column;
+  }
+}
+
+h1 {
+  margin: 0;
+}
+
+a {
+  text-decoration: none;
+  color: #706fff;
+}
+a:hover {
+  color: #01003B;
+}
+
+#map {
+  width: calc(100vw - (100vw - 100%));
+  height: auto;
+}
+#map iframe {
+  width: 100%;
+}
+
+#information {
+  display: flex;
+  flex-direction: row;
+  font: 500 24px "Montserrat", sans-serif;
+}
+#information .contact, #information .location {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  width: 50%;
+}
+#information .contact h1, #information .location h1 {
+  font: 600 48px "Montserrat", sans-serif;
+}
+#information .contact h2, #information .location h2 {
+  font: 600 40px "Montserrat", sans-serif;
+  margin: 0.5em 0 0 0;
+}
+#information .contact h3, #information .location h3 {
+  font: 600 32px "Montserrat", sans-serif;
+  margin: 0.5em 0 0.25em 0;
+}
+#information .contact {
+  margin: 0 50px 0 0;
+}
+#information .click-call, #information .click-pm {
+  margin: 0 0 0 1em;
+}
+#information .click-call img, #information .click-pm img {
+  width: 1em;
+  height: 1em;
+  margin: 0 1em 0 0;
+}
+#information .horizontal-separator {
+  width: 100%;
+  width: -moz-available;
+  width: -webkit-fill-available;
+  border: solid 1px black;
+}
+
+#video {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background: linear-gradient(to left, #1d60b5, #3b8fff);
+}
+#video video {
+  width: 100% !important;
+  height: auto !important;
+}
+#video h1 {
+  margin: 0 0 1em 0;
+  font: 600 2.5vw "Montserrat", sans-serif;
+  color: white;
+}
+
+.sec-links-to-documents {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  background: linear-gradient(to left, #1d60b5, #3b8fff);
+}
+.sec-links-to-documents h1 {
+  font: 500 32px "Montserrat", sans-serif;
+}
+.sec-links-to-documents h1 a {
+  background: linear-gradient(#FFFFFF, #adf0ff);
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+  font: 700 33px "Montserrat", sans-serif;
+}
+.sec-links-to-documents h1 a:hover {
+  color: black;
+}
+.sec-links-to-documents h1 a:active {
+  background: linear-gradient(to top, #FFFFFF, #adf0ff);
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+.sec-links-to-documents h1:first-of-type {
+  margin: 0 0 2.5vh 0;
+}
+@media screen and (max-width: 1215px) {
+  .sec-links-to-documents h1 {
+    font-size: 22px;
+  }
+  .sec-links-to-documents h1 a {
+    font-size: 23px;
+  }
+}
+@media screen and (max-width: 610px) {
+  .sec-links-to-documents h1 {
+    font-size: 12px;
+  }
+  .sec-links-to-documents h1 a {
+    font-size: 13px;
+  }
+}
+
+#header {
+  background: #FDFFFF;
+  padding: 0 150px;
+  position: sticky;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+}
+@media screen and (max-width: 850px) {
+  #header {
+    padding: 0 50px;
+  }
+}
+@media screen and (max-width: 360px) {
+  #header {
+    padding: 0 25px;
+  }
+}
+#header #logo {
+  display: flex;
+  align-items: center;
+  height: 56px;
+}
+@media screen and (max-width: 850px) {
+  #header #logo {
+    height: 36px;
+  }
+}
+#header .bounce-animation span {
+  font: 600 56px "Oswald", sans-serif;
+  display: inline-block;
+  color: #1d60b5;
+  animation: bounce 2500ms infinite;
+  animation-delay: calc(0.1s * var(--i));
+}
+@media screen and (max-width: 850px) {
+  #header .bounce-animation span {
+    font-size: 36px;
+  }
+}
+@keyframes bounce {
+  0%, 40%, 100% {
+    transform: translateY(0);
+  }
+  20% {
+    transform: translateY(-5px);
+  }
+}
+#header .navbar {
+  display: flex;
+}
+#header .navbar .nav-item {
+  margin-right: 1vw;
+  font: 18px "Montserrat", sans-serif;
+  font-weight: 600;
+  color: #706fff;
+  text-decoration: none;
+}
+#header .navbar .nav-item:hover {
+  color: #01003B;
+}
+#header .navbar .nav-item:last-of-type {
+  margin-right: 0;
+}
+@media screen and (max-width: 1200px) {
+  #header .navbar .nav-item {
+    display: none;
+  }
+}
+#header #toggle {
+  display: none;
+}
+#header .dropdown-toggle {
+  margin: 0;
+  width: 36px;
+  height: 36px;
+  position: relative;
+  cursor: pointer;
+}
+#header .dropdown-toggle .bar {
+  padding: 0;
+  width: 36px;
+  height: 4px;
+  background-color: #1d60b5;
+  display: block;
+  border-radius: 4px;
+  transition: all 0.4s ease-in-out;
+  position: absolute;
+}
+#header .dropdown-toggle .bar1 {
+  transform-origin: 5%;
+}
+#header .dropdown-toggle .bar4 {
+  transform-origin: 5%;
+}
+@media screen and (max-width: 850px) {
+  #header .dropdown-toggle {
+    width: 28px;
+    height: 28px;
+  }
+  #header .dropdown-toggle .bar {
+    width: 28px;
+  }
+}
+#header .bar1 {
+  top: 0;
+}
+#header .bar2,
+#header .bar3 {
+  top: 16px;
+}
+@media screen and (max-width: 850px) {
+  #header .bar2,
+#header .bar3 {
+    top: 12px;
+  }
+}
+#header .bar3 {
+  right: 0;
+}
+#header .bar4 {
+  bottom: 0;
+}
+#header .toggle:checked + label > .dropdown-toggle > .bar1 {
+  transform: rotate(45deg);
+  height: 3px;
+  width: 50px;
+}
+@media screen and (max-width: 850px) {
+  #header .toggle:checked + label > .dropdown-toggle > .bar1 {
+    width: 39px;
+  }
+}
+#header .toggle:checked + label > .dropdown-toggle > .bar3 {
+  transform: rotate(45deg);
+  height: 3px;
+  background-color: transparent;
+}
+#header .toggle:checked + label > .dropdown-toggle > .bar2 {
+  transform: rotate(-45deg);
+  height: 3px;
+  background-color: transparent;
+}
+#header .toggle:checked + label > .dropdown-toggle > .bar4 {
+  transform: rotate(-45deg);
+  height: 3px;
+  width: 50px;
+}
+@media screen and (max-width: 850px) {
+  #header .toggle:checked + label > .dropdown-toggle > .bar4 {
+    width: 39px;
+  }
+}
+#header #toggle-label {
+  display: none;
+}
+@media screen and (max-width: 1200px) {
+  #header #toggle-label {
+    display: block;
+  }
+}
+
+#footer {
+  display: flex;
+  justify-content: space-between;
+  background-color: #000000;
+  font: 16px "Montserrat", sans-serif;
+  padding-top: 50px;
+  padding-bottom: 50px;
+}
+#footer #small-logo {
+  height: 50px;
+  width: auto;
+}
+#footer .footer-columns {
+  display: flex;
+}
+#footer .footer-columns .footer-column {
+  margin: 0 20px 20px 20px;
+}
+#footer .footer-columns .footer-column h1 {
+  margin: 0 0 16px 0;
+  font: 700 18px "Montserrat", sans-serif;
+  color: #f5ffff;
+}
+@media screen and (max-width: 400px) {
+  #footer .footer-columns .footer-column h1 {
+    font-size: 14px;
+  }
+}
+#footer .footer-columns .footer-column a {
+  text-decoration: none;
+  color: #abb3b3;
+}
+#footer .footer-columns .footer-column a:hover {
+  font-size: 17px;
+  color: #b3d1ff;
+}
+@media screen and (max-width: 400px) {
+  #footer .footer-columns .footer-column a:hover {
+    font-size: 13px;
+  }
+}
+#footer .footer-columns .footer-column ul {
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+}
+@media screen and (max-width: 400px) {
+  #footer {
+    font-size: 12px;
+  }
+}
+
+#footer-stateless {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background-color: #1d60b5;
+  color: white;
+  font: 14px "Montserrat", sans-serif;
+}
+#footer-stateless a {
+  color: white;
+  text-decoration: none;
+}
+#footer-stateless a:hover {
+  font-style: italic;
+}
+#footer-stateless .smaller {
+  font-weight: 200;
+  font-size: 12px;
+}
+@media screen and (max-width: 400px) {
+  #footer-stateless .smaller {
+    font-size: 8px;
+  }
+}
+@media screen and (max-width: 400px) {
+  #footer-stateless {
+    font-size: 10px;
+  }
+}
+
+html, body {
+  margin: 0;
+  padding: 0;
+  background-color: #364040;
+  scroll-behavior: smooth;
+  font-family: sans-serif;
+}
+
+.content-spacing {
+  padding: 100px 200px;
+}
+@media screen and (max-width: 1100px) {
+  .content-spacing {
+    padding: 50px 100px;
+  }
+}
+@media screen and (max-width: 850px) {
+  .content-spacing {
+    padding: 10px 20px;
+  }
+}
+
+.ignore-vertical {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.hidden {
+  display: none;
+}
+
+.flex {
+  display: flex;
+}
+
+.inline-block {
+  display: inline-block;
+}
+
+.no-decoration {
+  text-decoration: none;
+  color: inherit;
+}
+.no-decoration:hover {
+  color: inherit;
+}
+
+#header {
+  height: 10vh;
+}
+@media screen and (max-width: 850px) {
+  #header {
+    height: 45px;
+  }
+}
+
+.dropdown {
+  position: fixed;
+  z-index: 2;
+  background: linear-gradient(to left bottom, #1d60b5, #003e86);
+  width: 100%;
+  height: 90vh;
+  -webkit-animation: drawer-open 550ms;
+  animation: drawer-open 550ms;
+  flex-direction: column;
+  align-items: center;
+}
+.dropdown .dropdown-nav-item {
+  position: relative;
+  margin-top: 50px;
+  background: linear-gradient(#FFFFFF, #adf0ff);
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+  font: 600 28px "Montserrat", sans-serif;
+  text-decoration: none;
+  -webkit-animation: navbar-appear 550ms;
+  animation: navbar-appear 550ms;
+}
+.dropdown .dropdown-nav-item:first-of-type {
+  margin-top: 100px;
+}
+.dropdown .dropdown-nav-item:after {
+  content: "";
+  position: absolute;
+  width: 100%;
+  transform: scaleX(0);
+  height: 2px;
+  bottom: 0;
+  left: 0;
+  background: linear-gradient(to left, #FFF, #AFF);
+  transform-origin: bottom right;
+  transition: transform 0.25s ease-out;
+}
+.dropdown .dropdown-nav-item:hover:after {
+  transform: scaleX(1);
+  transform-origin: bottom left;
+}
+@media screen and (max-width: 850px) {
+  .dropdown {
+    height: calc(100vh - 45px);
+  }
+}
+
+.dropdown_close_animation {
+  -webkit-animation: drawer-close 550ms;
+  animation: drawer-close 550ms;
+}
+
+.dropdown-nav-item_close_animation {
+  -webkit-animation: navbar-disappear 550ms;
+  animation: navbar-disappear 550ms;
+}
+
+@-webkit-keyframes drawer-close {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+@keyframes drawer-close {
+  from {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+  to {
+    visibility: hidden;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+@-webkit-keyframes drawer-open {
+  from {
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes drawer-open {
+  from {
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+  to {
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+@-webkit-keyframes navbar-appear {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+@keyframes navbar-appear {
+  from {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+  to {
+    opacity: 1;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+  }
+}
+@-webkit-keyframes navbar-disappear {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+@keyframes navbar-disappear {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
+  }
+}
+#container {
+  height: 90vh;
+  display: grid;
+  grid-template-rows: 1fr auto;
+  grid-template-columns: 1fr;
+  grid-gap: 0;
+  overflow: auto;
+}
+@media screen and (max-width: 850px) {
+  #container {
+    height: calc(100vh - 45px);
+  }
+}
+
+#content {
+  background: whitesmoke;
+  grid-column: 1;
+  grid-row: 1;
+  overflow-wrap: break-word;
+}
+
+#footer {
+  grid-column: 1;
+  grid-row: 2;
+}
+
+#footer-stateless {
+  grid-column: 1;
+  grid-row: 3;
+}
+
+/*# sourceMappingURL=main.css.map */