@font-face {
  font-family: bebas-bold;
  src: url("/fonts/BebasNeue_Bold.ttf"); }
@font-face {
  font-family: bebas-regular;
  src: url("/fonts/BebasNeue_Regular.ttf"); }
@font-face {
  font-family: bebas-book;
  src: url("/fonts/BebasNeue_Book.ttf"); }
@font-face {
  font-family: poppins-medium;
  src: url("/fonts/Poppins-Medium.ttf"); }
@font-face {
  font-family: poppins-light;
  src: url("/fonts/Poppins-Light.ttf"); }
@font-face {
  font-family: poppins-regular;
  src: url("/fonts/Poppins-Regular.ttf"); }
@font-face {
  font-family: moonlight;
  src: url("/fonts/Moon Light.otf"); }
html, body {
  height: 100%; }

body {
  margin: 0;
  overflow-x: hidden; }

.red {
  background-color: red; }

.green {
  background-color: green; }

.blue {
  background-color: blue; }

.grey {
  background-color: grey; }

.top_menu {
  position: fixed;
  top: 0;
  height: 150px;
  padding-top: 40px;
  padding-left: 80px;
  z-index: 1000; }
  .top_menu .logo {
    float: left; }
  .top_menu ul {
    float: left;
    margin-right: 5px;
    list-style: none;
    padding-left: 80px; }
    .top_menu ul li {
      display: inline-block;
      list-style: none;
      padding-left: 40px; }
    .top_menu ul li a {
      font-family: bebas-bold;
      font-size: 18px;
      color: #ffffff;
      text-transform: uppercase;
      letter-spacing: 1px;
      text-decoration: none; }
    .top_menu ul li a:hover {
      color: #03ff8f;
      text-shadow: #54f2ab 1px 1px 24px; }

#home {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  #home #left_part {
    margin: 0;
    position: absolute;
    top: 0;
    background-color: #001a11;
    height: 100%;
    width: 70%;
    left: 0;
    z-index: 20;
    overflow: hidden; }
    #home #left_part .header_left {
      position: absolute;
      height: 60px;
      top: 35%;
      left: 43%;
      color: #03ff8f;
      font-family: moonlight;
      font-size: 125px;
      letter-spacing: 15px;
      text-transform: uppercase;
      z-index: 30;
      transform: translateX(-50%);
      animation: glitch 6s infinite;
      animation-delay: 2s; }
    #home #left_part .greenoverlay {
      display: none;
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
      background-color: rgba(48, 126, 70, 0.45);
      z-index: 20; }
    #home #left_part .shadow_r {
      position: absolute;
      height: 100%;
      width: 58%;
      left: 28%;
      -ms-transform: skew(-20deg, 0deg);
      -webkit-transform: skew(-20deg, 0deg);
      transform: skew(-20deg, 0deg);
      background: linear-gradient(to right, transparent, black);
      z-index: 15;
      opacity: 0; }
    #home #left_part .shadow_top {
      background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.8));
      position: absolute;
      width: 100%;
      height: 150px; }
    #home #left_part video {
      filter: url("#greenfilter");
      position: absolute;
      top: 50%;
      left: 50%;
      min-width: 100%;
      min-height: 100%;
      width: auto;
      height: auto;
      z-index: -100;
      transform: translateX(-50%) translateY(-50%);
      background-size: cover;
      transition: 1s opacity; }
  #home #right_part {
    background: transparent;
    margin: 0;
    position: absolute;
    top: 0;
    height: 100%;
    width: 55%;
    right: 0;
    z-index: 30;
    border-bottom-color: #000000;
    border-bottom-style: solid;
    border-bottom-width: 3px;
    text-align: center;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    overflow: hidden; }
    #home #right_part .shadow_right {
      position: absolute;
      height: 100%;
      width: 20%;
      left: 170px;
      -ms-transform: skew(-20deg, 0deg);
      -webkit-transform: skew(-20deg, 0deg);
      transform: skew(-20deg, 0deg);
      background: linear-gradient(to left, transparent, rgba(0, 0, 0, 0.7));
      z-index: 20;
      opacity: 0; }
    #home #right_part .header_right {
      position: absolute;
      height: 60px;
      top: 50%;
      left: 55%;
      color: #0f4c47;
      font-family: moonlight;
      font-size: 45px;
      letter-spacing: 5px;
      text-transform: uppercase;
      z-index: 30;
      transform: translateX(-50%);
      animation: glitch 6s infinite; }
    #home #right_part .social {
      position: absolute;
      display: inline-block;
      bottom: 20px;
      margin-left: 50px; }
      #home #right_part .social i {
        margin-left: 30px;
        color: #ffffff; }
      #home #right_part .social i:hover {
        color: #03ff8f;
        text-shadow: #54f2ab 1px 1px 24px; }

#aboutus, #aboutus2 {
  position: relative;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(225deg, #0c071a 1%, #160c2e 23%, #0a3031 100%);
  top: 0;
  left: 0;
  overflow: auto; }
  #aboutus .slide0 .textblock, #aboutus .slide0 .text1, #aboutus .slide0 .text2, #aboutus2 .slide0 .textblock, #aboutus2 .slide0 .text1, #aboutus2 .slide0 .text2 {
    text-align: center; }
  #aboutus .slide0, #aboutus .slide1, #aboutus .slide2, #aboutus .slide3, #aboutus2 .slide0, #aboutus2 .slide1, #aboutus2 .slide2, #aboutus2 .slide3 {
    opacity: 0;
    width: 50%;
    height: 70%;
    position: absolute;
    top: 10%;
    right: 0;
    bottom: 0;
    left: 3%;
    overflow: hidden;
    margin: auto; }
    #aboutus .slide0.activesl, #aboutus .slide1.activesl, #aboutus .slide2.activesl, #aboutus .slide3.activesl, #aboutus2 .slide0.activesl, #aboutus2 .slide1.activesl, #aboutus2 .slide2.activesl, #aboutus2 .slide3.activesl {
      opacity: 1; }
  #aboutus .slide1 .textblock, #aboutus .slide2 .textblock, #aboutus .slide3 .textblock, #aboutus2 .slide1 .textblock, #aboutus2 .slide2 .textblock, #aboutus2 .slide3 .textblock {
    text-align: left; }
    #aboutus .slide1 .textblock .slide_text .main_header, #aboutus .slide2 .textblock .slide_text .main_header, #aboutus .slide3 .textblock .slide_text .main_header, #aboutus2 .slide1 .textblock .slide_text .main_header, #aboutus2 .slide2 .textblock .slide_text .main_header, #aboutus2 .slide3 .textblock .slide_text .main_header {
      font-size: 40px;
      margin-bottom: 30px;
      overflow: hidden; }
    #aboutus .slide1 .textblock .slide_text .text1, #aboutus .slide1 .textblock .slide_text .text2, #aboutus .slide1 .textblock .slide_text .main_header, #aboutus .slide2 .textblock .slide_text .text1, #aboutus .slide2 .textblock .slide_text .text2, #aboutus .slide2 .textblock .slide_text .main_header, #aboutus .slide3 .textblock .slide_text .text1, #aboutus .slide3 .textblock .slide_text .text2, #aboutus .slide3 .textblock .slide_text .main_header, #aboutus2 .slide1 .textblock .slide_text .text1, #aboutus2 .slide1 .textblock .slide_text .text2, #aboutus2 .slide1 .textblock .slide_text .main_header, #aboutus2 .slide2 .textblock .slide_text .text1, #aboutus2 .slide2 .textblock .slide_text .text2, #aboutus2 .slide2 .textblock .slide_text .main_header, #aboutus2 .slide3 .textblock .slide_text .text1, #aboutus2 .slide3 .textblock .slide_text .text2, #aboutus2 .slide3 .textblock .slide_text .main_header {
      margin-left: 50px;
      margin-right: 50px;
      text-align: justify; }
    #aboutus .slide1 .textblock .slide_text img, #aboutus .slide2 .textblock .slide_text img, #aboutus .slide3 .textblock .slide_text img, #aboutus2 .slide1 .textblock .slide_text img, #aboutus2 .slide2 .textblock .slide_text img, #aboutus2 .slide3 .textblock .slide_text img {
      margin-left: 38px; }
  #aboutus .textblock, #aboutus2 .textblock {
    text-align: center;
    word-wrap: normal;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 0s; }
    #aboutus .textblock .backheader, #aboutus2 .textblock .backheader {
      display: inline-block;
      width: 100%;
      color: rgba(10, 4, 41, 0.18);
      font-family: bebas-regular;
      font-size: 160px;
      letter-spacing: 20px;
      text-transform: uppercase;
      text-align: center; }
    #aboutus .textblock .slide_text, #aboutus2 .textblock .slide_text {
      position: absolute;
      top: 10%;
      width: 100%; }
      #aboutus .textblock .slide_text .main_header, #aboutus2 .textblock .slide_text .main_header {
        font-family: bebas-book;
        text-transform: uppercase;
        font-size: 120px;
        letter-spacing: 5px;
        color: #03ff8f;
        text-shadow: #54f2ab 1px 1px 8px; }
      #aboutus .textblock .slide_text .text1, #aboutus .textblock .slide_text .text2, #aboutus2 .textblock .slide_text .text1, #aboutus2 .textblock .slide_text .text2 {
        color: #ffffff;
        font-family: poppins-medium; }
      #aboutus .textblock .slide_text .text1, #aboutus2 .textblock .slide_text .text1 {
        font-size: 20px; }
      #aboutus .textblock .slide_text hr, #aboutus2 .textblock .slide_text hr {
        width: 90px;
        border-style: solid;
        border-color: #026337;
        border-width: 1px;
        margin-top: 50px;
        margin-bottom: 50px; }
      #aboutus .textblock .slide_text .text2, #aboutus2 .textblock .slide_text .text2 {
        font-size: 15px; }
  #aboutus #counter, #aboutus2 #counter {
    position: absolute;
    left: 5%;
    top: 15%;
    width: 85px;
    text-align: center; }
    #aboutus #counter .digits, #aboutus2 #counter .digits {
      color: #0f4c47;
      font-family: bebas-regular;
      font-size: 80px;
      text-transform: uppercase;
      margin-top: 0;
      margin-bottom: 30px; }
    #aboutus #counter .vertical, #aboutus2 #counter .vertical {
      display: inline-block;
      background-color: #000000;
      width: 2px;
      height: 150px; }
    #aboutus #counter .frame_name, #aboutus2 #counter .frame_name {
      display: inline-block;
      font-family: bebas-regular;
      font-size: 20px;
      color: black;
      letter-spacing: 2px;
      text-transform: uppercase;
      margin-top: 65px;
      margin-left: 3px; }
  #aboutus #marks, #aboutus2 #marks {
    position: absolute;
    right: 5%;
    top: 50%;
    text-align: center;
    transform: translateY(-50%); }
    #aboutus #marks hr, #aboutus2 #marks hr {
      width: 28px;
      border-width: 1px;
      border-color: #000000;
      margin-bottom: 30px; }
    #aboutus #marks .activeslide, #aboutus2 #marks .activeslide {
      border-width: 2px;
      border-style: solid;
      border-color: #0f4c47; }

#projects {
  background-image: linear-gradient(225deg, #0c071a 1%, #160c2e 23%, #0a3031 100%); }
  #projects .tiles {
    position: absolute;
    list-style-type: none;
    padding: 0;
    margin: 0;
    margin-top: 0;
    left: 10%;
    right: 10%;
    bottom: 5%;
    top: 150px; }
    #projects .tiles li {
      display: table;
      float: left;
      position: relative;
      width: 33.3%;
      height: 33.3%;
      padding: 7px; }
      #projects .tiles li .prj-tile {
        background-color: bisque;
        width: 100%;
        height: 100%;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover; }
      #projects .tiles li .prj-tile:not(#prj1) {
        filter: url("#desaturate");
        cursor: pointer; }
      #projects .tiles li #prj1 {
        background-color: #181f29;
        font-family: bebas-book;
        font-size: 45px;
        text-transform: uppercase;
        color: #03ff8f;
        text-shadow: #54f2ab 1px 1px 8px;
        letter-spacing: 3px; }
      #projects .tiles li #prj2 {
        background-image: url("/img/proj1_big.jpg"); }
      #projects .tiles li #prj3 {
        background-image: url("/img/proj2_big.jpg"); }
      #projects .tiles li #prj4, #projects .tiles li #prj5, #projects .tiles li #prj6, #projects .tiles li #prj7, #projects .tiles li #prj8, #projects .tiles li #prj9 {
        font-family: poppins-light;
        background-image: url("/img/proj0_big.jpg");
        font-size: 35px;
        color: #ffffff;
        text-shadow: #bcb5b5 1px 1px 8px; }
  #projects #prj_modal_out {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }
  #projects #prj_modal {
    display: none;
    background-color: #181f29;
    position: absolute;
    left: 10%;
    right: 10%;
    bottom: 5%;
    top: 150px;
    padding: 50px; }
    #projects #prj_modal .prj_header {
      position: relative;
      font-family: bebas-book;
      color: #03ff8f;
      text-shadow: #54f2ab 1px 1px 8px;
      letter-spacing: 3px;
      font-size: 50px;
      padding-top: 30px;
      padding-bottom: 20px; }
    #projects #prj_modal .prj_video {
      position: relative;
      float: left;
      width: 55%;
      height: 80%; }
    #projects #prj_modal .prj_desc {
      float: left;
      width: 45%;
      height: 80%;
      padding: 0 5% 0 5%; }
      #projects #prj_modal .prj_desc .prj_desc_header {
        text-align: left;
        font-family: poppins-regular;
        font-size: 20px;
        color: #03ff8f;
        padding-bottom: 20px; }
      #projects #prj_modal .prj_desc .prj_desc_text {
        color: #ffffff;
        font-size: 14px; }
    #projects #prj_modal .prj_desc_info {
      padding-top: 20px; }
      #projects #prj_modal .prj_desc_info .info_item {
        float: left;
        text-align: left;
        margin-right: 20px; }
        #projects #prj_modal .prj_desc_info .info_item .ii_name {
          font-family: poppins-light;
          color: #03ff8f;
          margin-bottom: 0; }
        #projects #prj_modal .prj_desc_info .info_item .ii_val {
          font-family: poppins-regular;
          color: #ffffff; }
    #projects #prj_modal .close_prj {
      position: absolute;
      right: 50px;
      top: 80px;
      color: #ffffff;
      cursor: pointer; }
      #projects #prj_modal .close_prj img {
        width: 70px; }

#contactus, #ourteam {
  background-image: linear-gradient(225deg, #0c071a 1%, #160c2e 23%, #0a3031 100%); }
  #contactus .book, #ourteam .book {
    font-family: bebas-book;
    color: #03ff8f;
    text-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    display: inline-block;
    font-size: 2em; }
  #contactus .padding1, #ourteam .padding1 {
    padding: 7em 0em 0em 0em; }
  #contactus .hrteam, #ourteam .hrteam {
    color: #03ff8f;
    box-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    margin-top: 1rem;
    border-top: 2px solid;
    width: 100px;
    float: right; }
  #contactus .popins, #ourteam .popins {
    font-family: poppins-regular;
    font-size: 14pt;
    color: white; }
  #contactus .chel, #ourteam .chel {
    background-color: rgba(0, 0, 0, 0.6);
    line-height: 3em; }
  #contactus .byte, #ourteam .byte {
    display: -webkit-box; }
  #contactus .backform, #ourteam .backform {
    background: rgba(14, 11, 11, 0.11);
    border: none;
    border-bottom: 2px solid #03ff8f;
    color: #03ff8f;
    text-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    border-radius: 0rem;
    color: white; }
  #contactus .bookhook, #ourteam .bookhook {
    font-family: poppins-light;
    color: #03ff8f;
    text-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    display: inline-block;
    font-size: 0.8em; }
  #contactus .bookhook:focus, #ourteam .bookhook:focus {
    color: white; }
  #contactus .icons, #ourteam .icons {
    float: right;
    color: white; }
  #contactus .icon, #ourteam .icon {
    padding: 0px 10px 0px 10px; }
  #contactus .icon:hover, #ourteam .icon:hover {
    color: #03ff8f;
    box-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f; }
  #contactus .sendmail, #ourteam .sendmail {
    display: -webkit-box;
    color: white;
    font-family: poppins-regular;
    font-size: 0.85em; }
  #contactus .sendmail:hover, #ourteam .sendmail:hover {
    color: #03ff8f; }
  #contactus .shic, #ourteam .shic {
    margin: -2em 0em 0em 0em;
    float: right;
    background-color: transparent;
    color: white;
    text-transform: uppercase;
    font-family: bebas-bold;
    font-size: 3em; }
  #contactus .shic:hover, #ourteam .shic:hover {
    border-bottom: 1px solid #03ff8f;
    color: #03ff8f; }
  #contactus .book, #ourteam .book {
    font-family: bebas-book;
    color: #03ff8f;
    text-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    float: left;
    font-size: 2em; }
  #contactus .padding1, #ourteam .padding1 {
    padding: 7em 0em 0em 0em; }
  #contactus .hrteam, #ourteam .hrteam {
    color: #03ff8f;
    box-shadow: 0.2px 0.2px 0.2px black, 0 0 0.07em #03ff8f;
    margin-top: 1rem;
    border-top: 2px solid;
    width: 100px;
    float: right; }
  #contactus .member_card, #ourteam .member_card {
    background-color: #181f29; }
  #contactus .card-img-overlay, #ourteam .card-img-overlay {
    padding: 0em; }
  #contactus .card-text, #ourteam .card-text {
    text-align: center; }
  #contactus .popins, #ourteam .popins {
    font-family: poppins-regular;
    font-size: 10pt;
    color: white; }
  #contactus .chel, #ourteam .chel {
    background-color: rgba(0, 0, 0, 0.6);
    line-height: 2.5em;
    display: none; }
  #contactus .card-img, #ourteam .card-img {
    -webkit-filter: grayscale(100%); }
  #contactus .member_card:hover .chel, #ourteam .member_card:hover .chel {
    display: block; }
  #contactus .member_card:hover .card-img, #ourteam .member_card:hover .card-img {
    -webkit-filter: grayscale(0%); }
  #contactus .byte, #ourteam .byte {
    display: -webkit-box; }
  #contactus .twoimage, #ourteam .twoimage {
    background-image: url(/assets/info1.png);
    background-repeat: no-repeat;
    background-position-x: right;
    background-size: 50% 97%; }
  #contactus .card-img, #ourteam .card-img {
    width: 100px;
    height: 160px; }
  #contactus .hover, #ourteam .hover {
    max-width: 102px; }
  #contactus .persontext, #ourteam .persontext {
    color: white;
    font-size: 0.8em;
    font-family: poppins-regular; }
  #contactus .persontext2, #ourteam .persontext2 {
    color: #03ff8f;
    font-size: 0.8em;
    font-family: poppins-light; }
  #contactus .persontext3, #ourteam .persontext3 {
    color: #83fbf7;
    font-size: 0.8em;
    font-family: poppins-light; }
  #contactus .persontext4, #ourteam .persontext4 {
    color: #03ff8f;
    font-size: 1.4em;
    font-family: poppins-regular; }
  #contactus .active, #ourteam .active {
    box-shadow: 1px 1px 2px black, 0 0 1em #03ff8f; }
  #contactus .active .card-img, #ourteam .active .card-img {
    -webkit-filter: grayscale(0%); }
  #contactus .vertical, #ourteam .vertical {
    vertical-align: top; }
  #contactus .background2, #ourteam .background2 {
    max-width: none !important;
    width: 1200px !important; }
  #contactus .background1, #ourteam .background1 {
    background: linear-gradient(225deg, #0c071a 1%, #160c2e 23%, #0a3031 100%) no-repeat center center fixed;
    min-height: 100%;
    height: auto;
    background-size: cover; }
  #contactus .app1, #ourteam .app1 {
    background: linear-gradient(225deg, #0c071a 1%, #160c2e 23%, #0a3031 100%) !important; }
  #contactus .babos, #ourteam .babos {
    font-family: bebas-bold;
    font-size: 16pt;
    color: white !important; }
  #contactus a:focus, #contactus a:hover, #ourteam a:focus, #ourteam a:hover {
    color: #03ff8f !important;
    text-shadow: 1px 1px 2px black, 0 0 1em #03ff8f; }
  #contactus .nav-link, #ourteam .nav-link {
    display: block;
    padding: 4em 1em 1em 2em; }
  #contactus .active, #ourteam .active {
    color: #03ff8f;
    text-shadow: 1px 1px 2px black, 0 0 1em #03ff8f; }
  #contactus .backform:active, #contactus .backform:focus, #ourteam .backform:active, #ourteam .backform:focus {
    background: rgba(14, 11, 11, 0.11);
    color: white;
    border-color: white !important; }
  #contactus .bookhook:active, #contactus .bookhook:hover, #contactus .bookhook:focus, #ourteam .bookhook:active, #ourteam .bookhook:hover, #ourteam .bookhook:focus {
    color: white !important; }

.rightm0 {
  margin-right: 0; }

.rotate {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%; }

#trapezoid {
  border-bottom: 100px solid red;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  height: 0;
  width: 100px; }

.videowrapper {
  width: 100%;
  left: -50px; }

.vdo {
  width: 100px; }

@keyframes glitch {
  45% {
    filter: none; }
  46% {
    filter: url(#dist-01); }
  47% {
    filter: url(#dist-02); }
  48% {
    filter: url(#dist-03); }
  50% {
    filter: none; }
  95% {
    filter: none; }
  96% {
    filter: url(#dist-02); }
  97% {
    filter: url(#dist-04); } }
@keyframes transform {
  0% {
    transform: translate(-1%, -1%) skew(-2deg) scale(1.03); }
  1% {
    transform: none; }
  88% {
    transform: none; }
  89% {
    transform: translate(1%, 2%) scale(1.03); }
  90% {
    transform: none; } }

/*# sourceMappingURL=main.css.map */
