* {
  box-sizing: border-box;
}
body {
  background-color: whitesmoke;
      height:inherit;
  padding: 0px;
   margin: 0;
 font-family: 'Playfair Display', serif;
}
/* Center website */
.main {
  max-width: 1000px;
  margin: auto;
}
h1 {
  font-size: 50px;
  word-break: break-all;

}
.row {
  margin: 10px -16px;
}
/* Add padding BETWEEN each column */
.row,
.row > .column {
  padding: 8px;
}
/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 33.33%;
  display: none; /* Hide all elements by default */
}
/* Clear floats after rows */
.row:after {
  content: "";
  display: table;
  clear: both;
}
/* Content */
.content {
  background-color: white;
  padding: 10px;
  margin-bottom:40px;
}
.contents {
    margin-bottom: 40px;
}
/* The "show" class is added to the filtered elements */
.show {
  display: block;
}
/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: white;
  cursor: pointer;
}
.btn:hover {
  background-color: #ddd;
}
.btn.active {
  background-color: #666;
  color: white;
}
    #divh1 {
        font-family: 'Gilda Display', serif;
        font-size: 16px;
        text-align: right;
         color: #5FBBC2;
         margin-right: 20px;
         margin-top: 20px;
}
#div5 {
border: 0px black;
        background-color: black;
        padding: 14px;
        margin: 0px;
        margin-top: 0px;
        display: block;
        color: white;
        text-align: center;
        font-size: 15px;
        width: 100%;
        position: fixed;
        bottom: 0px;
    }
     .M {
        width: 70px;
        display: block;
        margin-left: auto;
      display: block;
}
.topnav {
    overflow: hidden;
    background-color: none;
    position: fixed;
    top: 0;
    width: 100%;
}

    .topnav a {
        float: left;
        display: block;
        color: black;
        text-align: center;
        padding: 16px 30px;
        text-decoration: none;
        font-size: 21px;
    }
.topnav a:hover {
  background-color: #ddd;
  color: black;
}
.topnav a.active {
  background-color: #4CAF50;
  color: white;
}
.topnav .icon {
  display: none;
}
    h2{
        color: whitesmoke;
    }
    button{
        color: #64C5CC;
    }
    #link{
        text-decoration: none;
        color:orangered;
    }
    .featured_projects .text-blk {
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  line-height: 25px;
  margin-top: 40px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.featured_projects * {
  font-family: Nunito, sans-serif;
}

.featured_projects .responsive-container-block {
  min-height: 75px;
  height: fit-content;
  width: 100%;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 0px;
  margin-right: auto;
  margin-bottom: 0px;
  margin-left: auto;
  justify-content: flex-start;
}

.featured_projects .container-block {
  min-height: 75px;
  height: fit-content;
  width: 100%;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  display: block;
}

.featured_projects .responsive-container-block.bg {
  max-width: 1500px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  height: auto;
}

.featured_projects .container-block.bg {
  max-width: 1500px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.featured_projects .responsive-container-block.content {
  justify-content: space-evenly;
}

.featured_projects #iu99 {
  color: black;
}

.featured_projects .im {
  width: 100%;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  background-color: #666666;
  height: 100%;
}

.featured_projects .responsive-container-block.img {
  width: 33.33%;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  position: relative;
  min-height: auto;
  height: auto;
}

.featured_projects .responsive-container-block.overlay {
  position: absolute;
  height: 100%;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.featured_projects .responsive-container-block.desc {
  position: absolute;
  height: 100%;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

.featured_projects .responsive-container-block.overlay.overlay-visible {
  background-color: #666666;
  mix-blend-mode: multiply;
}

.featured_projects .responsive-container-block.opt-cont {
  justify-content: space-evenly;
  align-items: center;
  margin-top: 30px;
  margin-right: 0px;
  margin-bottom: 5px;
  margin-left: 0px;
}

.featured_projects .text-blk.tab {
  font-size: 25px;
  line-height: 34.1px;
  display: flex;
  align-items: center;
  color: #999999;
  font-weight: 700;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  cursor: pointer;
  text-align: center;
}

.featured_projects .text-blk.tab.tab-active {
  color: #0087b1;
}

.featured_projects .responsive-container-block.img.hide.graphdes.mobdev {
  height: auto;
}

.featured_projects .text-blk.title {
  font-size: 20px;
  line-height: 27.28px;
  color: white;
  text-align: center;
  font-weight: 700;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
  padding-left: 10px;
}

.featured_projects .text-blk.info {
  font-size: 20px;
  line-height: 27.28px;
  color: white;
  text-align: center;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 50px;
  margin-left: 0px;
  padding-top: 0px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
}

.featured_projects .text-blk.heading {
  font-size: 25px;
  line-height: 34.1px;
  color: #0087b1;
  font-weight: 700;
  padding-top: 10px;
  padding-right: 0px;
  padding-bottom: 10px;
  padding-left: 0px;
  border-bottom-width: 5px;
  border-bottom-style: solid;
  border-bottom-color: #0087b1;
}

.featured_projects .tab:hover {
  cursor: pointer;
}

.featured_projects .bg {
  padding: 0 0 0 0;
  margin: 0 auto 0 auto;
}

.featured_projects .content {
  padding: 0 0 0 0;
}

.featured_projects .opt-cont {
  min-height: auto;
  padding: 0 0 0 0;
}

@media (max-width: 1024px) {
  .featured_projects .text-blk.info {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
  }
}

@media (max-width: 768px) {
  .featured_projects .im {
    width: 100%;
  }

  .featured_projects .responsive-container-block.img {
    width: 60%;
  }

  .featured_projects .responsive-container-block.img.hide {
    display: none;
  }

  .featured_projects .responsive-container-block.img.hide.hidden {
    display: none;
  }

  .featured_projects .responsive-container-block.opt-cont {
    flex-direction: column;
  }

  .featured_projects .text-blk.info {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    font-size: 13px;
    line-height: 15px;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
  }

  .featured_projects .text-blk.title {
    font-size: 13px;
    line-height: 15px;
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 0px;
    padding-left: 10px;
  }

  .featured_projects .text-blk.title {
    font-size: 20px;
    line-height: 27.28px;
  }

  .featured_projects .text-blk.info {
    font-size: 20px;
    line-height: 27.28px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .featured_projects .responsive-container-block.opt-cont {
    margin-top: 30px;
    margin-right: 0px;
    margin-bottom: 15px;
    margin-left: 0px;
  }
}

@media (max-width: 500px) {
  .featured_projects .im {
    width: 100%;
  }

  .featured_projects .im {
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
  }

  .featured_projects .responsive-container-block.img {
    width: 100%;
  }

  .featured_projects .responsive-container-block.opt-cont {
    flex-direction: column;
  }

  .featured_projects .responsive-container-block.img.hidden {
    display: none;
  }

  .featured_projects .text-blk.info {
    font-size: 17px;
    line-height: 22px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
    margin-left: 0px;
  }

  .featured_projects .text-blk.title {
    font-size: 17px;
    line-height: 22px;
  }

  .featured_projects .text-blk.title {
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
  }

  .featured_projects .text-blk.info {
    font-size: 20px;
    line-height: 27.28px;
  }

  .featured_projects .text-blk.title {
    font-size: 20px;
    line-height: 27.28px;
  }

}
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700;800&display=swap');

*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  margin: 0;
}

.wk-desk-1 {
  width: 8.333333%;
}

.wk-desk-2 {
  width: 16.666667%;
}

.wk-desk-3 {
  width: 25%;
}

.wk-desk-4 {
  width: 33.333333%;
}

.wk-desk-5 {
  width: 41.666667%;
}

.wk-desk-6 {
  width: 50%;
}

.wk-desk-7 {
  width: 58.333333%;
}

.wk-desk-8 {
  width: 66.666667%;
}

.wk-desk-9 {
  width: 75%;
}

.wk-desk-10 {
  width: 83.333333%;
}

.wk-desk-11 {
  width: 91.666667%;
}

.wk-desk-12 {
  width: 100%;
}

@media (max-width: 1024px) {
  .wk-ipadp-1 {
    width: 8.333333%;
  }

  .wk-ipadp-2 {
    width: 16.666667%;
  }

  .wk-ipadp-3 {
    width: 25%;
  }

  .wk-ipadp-4 {
    width: 33.333333%;
  }

  .wk-ipadp-5 {
    width: 41.666667%;
  }

  .wk-ipadp-6 {
    width: 50%;
  }

  .wk-ipadp-7 {
    width: 58.333333%;
  }

  .wk-ipadp-8 {
    width: 66.666667%;
  }

  .wk-ipadp-9 {
    width: 75%;
  }

  .wk-ipadp-10 {
    width: 83.333333%;
  }

  .wk-ipadp-11 {
    width: 91.666667%;
  }

  .wk-ipadp-12 {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .wk-tab-1 {
    width: 8.333333%;
  }

  .wk-tab-2 {
    width: 16.666667%;
  }

  .wk-tab-3 {
    width: 25%;
  }

  .wk-tab-4 {
    width: 33.333333%;
  }

  .wk-tab-5 {
    width: 41.666667%;
  }

  .wk-tab-6 {
    width: 50%;
  }

  .wk-tab-7 {
    width: 58.333333%;
  }

  .wk-tab-8 {
    width: 66.666667%;
  }

  .wk-tab-9 {
    width: 75%;
  }

  .wk-tab-10 {
    width: 83.333333%;
  }

  .wk-tab-11 {
    width: 91.666667%;
  }

  .wk-tab-12 {
    width: 100%;
  }
}

@media (max-width: 500px) {
  .wk-mobile-1 {
    width: 8.333333%;
  }

  .wk-mobile-2 {
    width: 16.666667%;
  }

  .wk-mobile-3 {
    width: 25%;
  }

  .wk-mobile-4 {
    width: 33.333333%;
  }

  .wk-mobile-5 {
    width: 41.666667%;
  }

  .wk-mobile-6 {
    width: 50%;
  }

  .wk-mobile-7 {
    width: 58.333333%;
  }

  .wk-mobile-8 {
    width: 66.666667%;
  }

  .wk-mobile-9 {
    width: 75%;
  }

  .wk-mobile-10 {
    width: 83.333333%;
  }

  .wk-mobile-11 {
    width: 91.666667%;
  }

  .wk-mobile-12 {
    width: 100%;
  }
}
        @media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display:none;}
  .topnav a.icon {
    float:right;
    display: block;
  }
  }
@media screen and (max-width: 600px) {
  .topnav.responsive {position: fixed;}
  .topnav.responsive .icon {
    position: fixed;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: inline-block;
    text-align: left;
    font-size: 12px;
  }
        #div5{
            max-width: 100%;
            font-size: 8px;
        }
        p{
              visibility: visible  !important;
        }
        .column {
width: 100%;
}
h4{
   font-size:9px;
}
 .M{
    visibility: hidden  !important;
}
        #divh1 {
          visibility: hidden  !important;
    }
}