,body {
    margin: 0;
    padding: 0;
    display: inline-block;
}
.gridanimation .wpb_single_image.vc_align_left {
    text-align: center!important;
}
.mobile{
    display: none;
}
.wpcf7-form-control.wpcf7-text {
    width: 90%;
        color: #fff; 
    border: 1px solid #fff;
    background: none;
    height: 40px;
    box-shadow: none;
    border-radius: 7px;
}
.wpcf7-form-control.wpcf7-textarea {
    width: 90%;
    height: 170px;
    border: 1px solid #fff;
    background: none;
    clear: both;
    box-shadow: none;
    border-radius: 7px;
}
.wpcf7-form label{
    font-size: 16px;
    padding-bottom: 5px;
}
.wpcf7-form-control.wpcf7-submit {
      display: block;
    width: 100px;
    cursor:pointer;
    height: 35px;
    padding: 0;
    line-height: 35px;
   background: #000;
    border: 1px solid #fff;
    text-transform: uppercase;
    font-size: 20px;
    text-transform: uppercase;
    color: #fff;
    border-radius: 5px;
    font-weight: 500;
    float: right;
   padding-right: 9px; 
    text-align: center;
    justify-content: inherit;
    margin: 0;
    padding-top: 1px;
}
.wpcf7-form-control.wpcf7-submit:hover{
    background: #ff2d00;
}
.loader {
  display:inline-block;
  border: 5px dotted lightgray;
  border-radius: 50%;
  border-top: 5px solid gray;
  border-bottom:5px solid gray;
  width: 30px;
  height: 30px;
  -webkit-animation: spin 1s linear infinite; /* Safari */
  animation: spin 1s linear infinite;
}
.profile-title-left{
    text-transform: uppercase;
    font-family: 'Avgardd';
    color: #ffffff;
    font-size: 26px;
    margin-left: 10px;
    font-weight: 800;
    position: inherit;
        -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    transform: rotate(-180deg);
}
.archetec_text strong{
    font-size: 22px;
    display: block;
    margin-bottom: 20px;
}
.archetec_text p{
  
    text-align: right;
}
.progect-grid .wpb_button, .progect-grid .wpb_content_element, .progect-grid ul.wpb_thumbnails-fluid>li {
    margin-bottom: 7px!important;
}
.progect-grid h2{
        text-align: center;
    margin-bottom: 5px;
}
.progect-grid{
   grid-area: profile-r2!important;
}
.archetec_text{
    position: fixed!important;
    width: 43%;
    bottom: 0;
    padding-left: 29px;
    bottom: 0;
    height: 100%;
    top: 0;
    margin-bottom: 0!important;
    background: #000;
    color:#fff;
}
/*.gray-bg{
    background-color: #ffffff!important;
}
.white-bg{
    background-color: #fff!important;
}*/
.white-bg ul li,.white-bg ul li a,.gray-bg .profile-title{
  
}
/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}
.loader-symbol{
text-align:center}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.container {
    display: grid;
    height: 100vh;
    grid-template-columns: 4fr 5fr;
    grid-template-rows: 7fr 4fr 2fr;
    grid-template-areas:
    "main nav1"
    "main-slider nav"
    "footer nav2";
}

p {
    padding: 0;
    margin: 0;
}
.arccon {
    margin-top: 280px;
    text-align: right;
    padding-right: 34px;
}
.project_desc table{
    float:right;
   width: 70%;
}
.project_desc,.project_desc p{
    text-align: right;
    padding-right: 34px;
}
main {
    grid-area: main;
    position: relative;
}
.mobiletitle{
    display: none;
}
nav {
    background-color: #000;
    grid-area: nav;
}

footer {
       position: fixed;
    left: 0;
    bottom: 5px;
    width: 77%;
}
.archimenu li a{
        font-size: 20px!important;
}
.archimenu li{
    line-height: 22px;
        line-height: 22px;
    text-align: right;
    margin-right: 0;
}
h1 {
    margin: 0;
    padding: 0;
}

h2 {
    margin: 0;
    padding: 0;
    font-weight: normal;
}
table td {
    vertical-align: top:
}
.wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output {
    border-color: !important;
    color: #fff!important;
    border: inherit!important;
    text-align: right;
    font-size: 15px;
}
h3 {
    margin: 0;
    padding-left: 5%;
    font-family: 'Avgardd';
    font-weight: 800;
    color: white;
    font-size: 2.5vw;
}

h4 {
    margin: 0;
    font-family: 'Avgardd';
    font-weight: 800;
    color: #fff;
    font-size: 0.8vw;
}

li {
    list-style: none;
    text-align: right;
    color: white;
    font-size: 2.7vw;
    margin-right: 5%;
    font-family: 'Avgardd';
    font-weight: 800;
    line-height: 30px;
}
.homenav {
    grid-area: main-slider;
    padding-top: 80px;
}
li a {
    color: white;
    text-decoration: none;
    transition: 1s;
}

li a:hover {
    color: black;
    text-decoration: none;
}

.hohome :hover {
    color: #666;
}

.hoprof :hover {
    color: #ff2d00;
}

.hoarch :hover {
    color: #ff2d00;
}

.hopubl :hover {
    color: #ff2d00;
}

.hocont :hover {
    color: #ff2d00;
}

.nav1 {
    background-color: #000;
    grid-area: nav1;
}

.nav2 {
    background-color: #000;
    grid-area: nav2;
}


.lang {
    float: right;
    font-family: 'Avgardd';
    font-size: 1.2vw;
    color: white;
    margin-top: 5%;
    margin-right: 5%;
}

.lang.arc {

    color: white;
    margin-top: unset;
    float: left;
    text-decoration: none;
    padding-left: 2vw;
    padding-top: 3%;
    font-size: 0.8vw;
}

.lang.arc a:visited {
    color: white;

}

.lang.arc a {
    color: white;
}

.nav1 a {
    text-decoration: none;
    color: white;
}

.text-u {
    font-size: 33px;
    color: #ffffff;
    text-align: right;
    line-height: 1;
    font-family: 'Avgardd';
    font-weight: 800;
    margin-top: 0;
    margin-bottom: 20px;
}

.text-a {
   font-size: 33px;
    color: #ffffff;
    line-height: 0;
    margin-left: 30%;
    text-align: right;
    font-family: 'Avgardd';
}
.logo img{
    width:14%!important;
}
.copyright a:hover{
    color: #ff2d00;
}
.nav1.home h3{
        margin: 0;
    padding-left: 5%;
    font-family: 'Avgardd';
    font-weight: 800;
    color: white;
    font-size: 33px;
    text-align: right;
        margin-top: 18px!important;
}
.logo {

    width: 66%;
    margin-left: 3%;
    /* bottom: -70%; */
    margin-top: 30px;
}

.main-slider {
    width: 100%;
    grid-area: main-slider;
    -webkit-transition: 5s;
    transition: 5s;
    overflow: hidden;
    position: relative;
}

.footer-mob {
    height: 6%;
    width: 95%;
    float: left;
    padding-bottom: 10vh;
    padding-left: 5%;
}

.footer-mob-side {
    height: 12%;
    width: 95%;
    float: left;
    position: absolute;
    bottom: 3%;
    left: 5%;
}
.progect-grid h2{
    font-size: 16px!important;
}
.footer-mob-bottom {
    height: 3rem;
    width: 95%;
    float: left;
    padding-left: 5%;
    padding-top: 5%;
    padding-bottom: 1rem;
}

.footer-mob-bottom.abs {
    bottom: 0;
}

.solid {
    position: absolute;
    width: 100%;
    height: 100%;
    mix-blend-mode: color;
    z-index: 100;
    opacity: 0;
}

.solid-green {
    background-color: #ff2d00;
}

.solid-yellow {
    background-color: #ff2d00;
}

.solid-purple {
    background-color: #ff2d00;
}

.solid-blue {
    background-color: #0029FA;
}

.solid-place {
    z-index: 104;
}

.main-slider figure {
    position: relative;
    width: 1000%;
    margin: 0;
    left: 0;
    animation: 40s main-slider infinite;
    height: 100%;
}

.main-slider figure img {
    float: left;
    width: 10%;
    height: 100%;
    object-fit: cover;
}

@keyframes main-slider {
    0% {
        left: 0;
    }

    5.2% {
        left: 0;
    }

    10.4% {
        left: -100%;
    }

    15.6% {
        left: -100%;
    }

    20.8% {
        left: -200%;
    }

    26% {
        left: -200%;
    }

    31.2% {
        left: -300%;
    }

    36.4% {
        left: -300%;
    }

    41.6% {
        left: -400%;
    }

    46.8% {
        left: -400%;
    }

    52% {
        left: -500%;
    }

    57.2% {
        left: -500%;
    }

    62.4% {
        left: -600%;
    }

    67.6% {
        left: -600%;
    }

    72.8% {
        left: -700%;
    }

    78% {
        left: -700%;
    }

    85% {
        left: -800%;
    }

    90% {
        left: -800%;
    }

    100% {
        left: -900%;
    }


}

.social-icon {
    margin-left: 3%;
    /* height: 2%; */
    width: 41%;
    position: absolute;
    margin-bottom: 1%;
    bottom: 0px;
    right: 0;
}

.social-icon-mobile {
    margin-left: 3%;
    height: 25%;
    width: 97%;
    bottom: 0;
    float: left;
}
.portfoliopagemenu{
        display: none;
    }
.copyright {
       position: absolute;
    bottom: 10%;
    left: 12%;
    float: left;
    font-size: 0.6vw;
    margin-right: 3%;
    font-size: 12px;
    color: #ffffff;
    
}
.copyright a{
    color: #ffffff;
}
.copyright-mob {
    bottom: 10%;
    right: 0;
    float: right;
    font-size: 2vw;
    margin-right: 3%;
    font-family: 'Avgardd';
    color: #ffffff;
}

.copyright-mob-bot {
    bottom: 0;
    right: 0;
    position: absolute;
    float: right;
    font-size: 2vw;
    margin-right: 3%;
    font-family: 'Avgardd';
    color: #ffffff;
}


.copyright-mob-side {
    bottom: 0;
    right: 0;
    float: right;
    font-size: 2vw;
    margin-right: 3%;
    font-family: 'Avgardd';
    color: white;
    position: absolute;
}
.social-icon a{
    display: inline-block;
    margin-left: 10px;
}
.social-icon img{
    height:30px;
}

.instagram-nonf {
    height: 100%;
}

.twitter-nonf {
    height: 100%;
}

.nav-mob {
    display: none;
}
.footer-mob-side img{
        width: 30px;
    height: 28px;
}
#sidebar {
    position: fixed;
    width: 100%;
    height: 100%;
    right: -100%;
    background-color: #000;
    opacity: 1.0;
    transition: all 0.3s ease-in, background 0.5s ease-in;
    -webkit-transition: all 0.3s ease-in, background 0.5s ease-in;
    z-index: 9999;
}

#sidebar li {
    color: white;
    font-size: 8vw;
    padding: 1%;
    text-align: right;

}

#sidebar ul {
 

}

.toggle-btn {
    position: fixed;
    margin-top: 5.2%;
    cursor: pointer;
    display: none;

}

.toggle-btn.arcall {
    z-index: 99999;
}

.toggle-btn.whitebar {
    margin-top: 5.6%;
    z-index: 99999;
}

.toggle-btn.whitebar span {
    background-color: white;
}

.toggle-custom {
    position: fixed;
    width: 8vw;
    float: right;
    cursor: pointer;
    right: 0;
    padding-right: 5%;
    z-index: 100004;
    margin-top: 5.2%;
}

.toggle-custom.white {
    width: 8vw;
    cursor: pointer;
    z-index: 100004;
    margin-top: -4.6%;

}

.toggle-custom.main {
    position: fixed;
    width: 8vw;
    float: right;
    cursor: pointer;
    right: 0;
    padding-right: 5%;
    z-index: 100004;
    display: none;
}

.toggle-custom.socials {
    width: 11vw;
    margin-top: 21%;
}

.toggle-custom.socials2 {
    width: 11vw;
    margin-top: 37%;
}


.toggle-btn.arcall span {
    background-color: #ffffff;
}

.addwhite {
    background-color: white;
}

.toggle-btn span {
    display: block;
    background-color: white;
    cursor: pointer;
    width: 40px;
    height: 1px;
    margin-bottom: 9px;
    z-index: 9999;
}

#sidebar.active {
    top: 0;
    right: 0;
    transition: 1s;
    z-index: 99998;
}

#infobar {
    position: fixed;
    width: 100%;
    height: 100%;
    bottom: -100%;
    background-color: white;
    opacity: 1;
    transition: all 0.3s ease-in, background 0.5s ease-in;
    -webkit-transition: all 0.3s ease-in, background 0.5s ease-in;
    z-index: 100000;
    overflow: scroll;
}

#infobar.active {
    right: 0;
    bottom: 0;
    transition: 1s;
    z-index: 100001;
}

.infobartextcontainer {
    padding-top: 5%;
    padding-left: 2%;
}

.infobartext {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 3vw;
    color: #5c6368;
    text-align: left;
    width: 96%;
    margin-left: 2%;
    line-height: 1.5;
}

.infobartext.mobteam {
    width: 90%;
    margin-left: 5%;
    margin-top: 5%;
}

.profiletext {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 2.4vw;
    color: #5c6368;
    text-align: left;
    width: 90%;
    margin-top: 5%;
    margin-left: 5%;
    line-height: 1.5;
}

.team-membersinfobar {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 2.2vw;
    color: #5c6368;
    text-align: left;
    width: 100%;
    padding-left: 0;
    line-height: 1.5;
}

.bolding {
    font-weight: bolder;
}

.nomargin {
    margin-top: 2.2rem;
!important;
}

.nomargin2 {
    margin-top: 0.5rem;
!important;
}

.nomargin0 {
    margin-top: 0;
!important;
}

.clickinfo {
    z-index: 99999;
}

.project-container {
    display: grid;
    height: 100vh;
    grid-template-columns: 4fr 3fr;
    grid-auto-rows: 53% auto 17%;
    grid-template-areas:
    "team right1"
    "project-pics project-info"
    "footer project-info";
}

.team {
    grid-area: team;
}

.project-container-m {
    width: 100%;
    height: auto;
    background-color: red;
    display: none;
}

.project-pics {
    grid-area: project-pics;
    position: relative;
    width: 100%;
}

.left3 {
    grid-area: left3;
}

.right1 {
    grid-area: right1;
    background-color: #000;
    text-align: right;
}

.project-info {
    grid-area: project-info;
    background-color: #ffffff;
    font-size: 2vw;
}

.team-grid {
    display: grid;
    height: 100%;
    grid-template-columns: 1fr 4fr;
    grid-template-rows: 4fr 1fr;
    grid-template-areas:
    "teamleft1 teamright1"
    "teamleft1 teamright1";
}

.teamleft1 {
    grid-area: teamleft1;
    padding-left: 5%;
    padding-top: 5%;
    position: relative;
}

.teamright1 {
    grid-area: teamright1;
    padding-left: 5%;
    padding-top: 5%;
    position: relative;
}

.team-content {
    font-family: 'Avgardd';
    font-size: 0.8vw;
    color: #5c6368;
}

.team-column {
    width: auto;
    float: left;
    margin-left: 2vw;

    text-align: right;
}
#sidebar li {
    height:auto!important;
}
.archimenu{
    margin-top: 27px;
    float: right;
    z-index: 99999999;
    position: relative;
}
.marchimenu li a{
    font-size: 18px;
}
.borderimg{
        border: 3px solid #000!important;
    padding: 10px;
}
.team-column.mobile {
    width: auto;
    float: left;
    margin-left: 5%;
    margin-right: 2%;
    margin-top: 1vh;
    text-align: left;
}
.word-top{
    display: flex;
    /* width: 100%; */
    padding-right: 28px;
    float: right;
}
.team-column.mobile.bar {
    width: auto;
    float: left;
    margin-left: 0;
}

.team-column.mobile.bar p {
    font-size: 2.2vw;
}

.team-column.none {
    margin-top: 0;
}

.pt-2 {
    padding-top: 1.2rem;
}

.pb-2 {
    padding-bottom: 1.2rem;
}

.team-members {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 0.8vw;
    color: #fff;
    text-align: right;
    width: 100%;
    padding-left: 0;
    line-height: 1.5;
}

.team-members.none {
    margin-top: 0;
}

.showcase {
    width: 100%;
    position: relative;
    margin-bottom: 5%;
}

.showcase.low {
    margin-bottom: 26px;
    width: 100%;
    position: relative;
    margin-bottom: 0.4%;
    margin-bottom: 20px;
}

.project-title {
    font-family: 'Avgardd';
    color: #ffffff;
    font-size: 3vw;
    font-weight: 800;
    position: absolute;
    top: 9vh;
    right: 5%;
    text-align: right;
}


.project-title.long {
    font-size: 2vw;
}

.project-title.mid {
    font-size: 2.7vw;
}

.info {
    color: #5c6368;
    font-family: 'Avgardd';
    font-size: 0.8vw;
    padding-left: 2vw;
    padding-right: 5%;
    line-height: 1.5;
}

.sidenav {
    margin-top: 30px;
    text-decoration: none;
    font-family: 'Avgardd';
    color: white;
    position: fixed;
    padding-right: 2%;
    writing-mode: vertical-lr;
    float: right;
    z-index: 99999;
    display: inline;
        /* writing-mode: vertical-lr; */
    float: left;
    width:3%;
}

.sidenav ul {
    padding-top: 10px;

}
footer .social-icon{
    display: none;
}
.home footer .social-icon,.page-template-index footer .social-icon{
    display: block;
}
.sidenav ul li {
    font-size: 10px;
    display: inline;
    font-weight: normal;
}
.sidenav ul li a:hover {
    color:#ff2d00;
}
#quicknav {
   width: 44%;
    background-color: #000!important;
    height: 3vw;
    position: fixed;
    bottom: 0;
    left: 0;
    transition: background-color .3s,
    opacity .5s, visibility .5s;

    z-index: 10000;
    display: flex;
    align-items: center;
}

#quicknav ul {

    align-items: center;
     padding-left: 35px;
        width: 98%;
    text-align: right;

}

#quicknav li {

display: inline-block;
    font-family: 'Avgardd';
    font-size: 15px;
    font-weight: normal;
    margin-right: 2%;
    line-height: 1;
    width: auto;
    padding-right: 3px;
}

#quicknav a {
    color: white;
}

#quicknav a:hover {
    color: #ff2d00;
}

#quicknav.show {
    opacity: 1;
    visibility: visible;
}

.backtotop {
    font-weight: bold;
    color: #ffbb00;

}

#mobnav {
    background-color: #ffffff;
    width: 100%;
    height: auto;
    position: fixed;
    right: 0;
    transition: background-color .3s,
    opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 10000;
    display: flex;
    align-items: center;
    padding-top: 5%;
    padding-bottom: 5%;
}

#mobnav ul {
    display: flex;
    align-items: center;
}

#mobnav li {
    display: inline-block;
    font-family: 'Avgardd';
    font-size: 0.8vw;
    font-weight: normal;
    margin-right: 2%;
    line-height: 1;
    padding-right: 2%;
}

#mobnav a {
    color: white;
}

#mobnav a:hover {
    color: #5c6368;
}


#mobnav.show {
    opacity: 1;
    visibility: visible;
}

#justop {
    background-color: #ffffff;
    width: 100%;
    height: 8%;
    position: fixed;
    bottom: 0;
    right: 0;
    transition: background-color .3s,
    opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 10000;
    display: flex;
    align-items: center;
}

#justop ul {
    display: flex;
    align-items: center;
}

#justop li {
    display: inline-block;
    font-family: 'Avgardd';
    font-size: 0.8vw;
    font-weight: normal;
    margin-right: 2%;
    line-height: 1;
    padding-right: 2%;
}

#justop a {
    color: white;
}

#justop a:hover {
    color: #5c6368;
}


#justop.show {
    opacity: 1;
    visibility: visible;
}

.infobottom {
    background-color: #ffffff;
    width: 100%;
    height: 10%;
    top: 0;
    right: 0;
    position: sticky;
    transition: background-color .3s,
    opacity .5s, visibility .5s;
    opacity: 1;
    visibility: visible;
    z-index: 999;
    display: flex;
    
    align-items: center;
    justify-content: space-between;

}


#mobnavbot {
    background-color: #ffffff;
    width: 100%;
    height: 8%;
    position: fixed;
    bottom: 0;
    right: 0;
    transition: background-color .3s,
    opacity .5s, visibility .5s;
    opacity: 1;
    visibility: visible;
    z-index: 10000;
    display: flex;
    align-items: center;
}

#mobnavbot ul {
    display: flex;
    align-items: center;
}

#mobnavbot li {
    display: inline-block;
    font-family: 'Avgardd';
    font-size: 0.8vw;
    font-weight: normal;
    margin-right: 2%;
    line-height: 1;
    padding-right: 2%;
}

#mobnavbot a {
    color: white;
}

#mobnavbot a:hover {
    color: #5c6368;
}

#mobnavbot.show {
    opacity: 1;
    visibility: visible;
}

/*   P R O F I L E   P A G E   */
.record{
    position: relative;
    position: relative;
    float: left;
    width: 32%;
    margin-left: 1%;
}
.profile-container {
    display: grid;
    height: 100vh;
    grid-template-columns: 4fr 5fr;
    grid-auto-rows: 38% auto 17%;
    grid-template-areas:
    "profile-l1 profile-r1"
    "profile-l2 profile-r2"
    "footer profile-r2";
}

.profile-l1 {
    
    /*grid-area: profile-r1;*/
    position: relative;
    z-index: 999;
}

.profile-l2 {
    
    width: 90%;
  /*  grid-area: profile-l2;*/
    grid-area: profile-r2;/**/
    position: relative;
    margin-bottom: 128px;
padding: 20px;
    padding-top: 0;
}
.logoc{
    margin-bottom: 10px;
}
.profile-r1 {
    grid-area: profile-l1;
    background-color: #000;
}

.profile-r2 {
    grid-area: profile-l2;
    /*grid-area: profile-r2;*/
    z-index: 10000;
    background-color: #000;
  padding-left: 6%;
    height: 100%;
    margin-bottom: 77px;

}

.profile-r3 {
    grid-area: profile-r3;
    background-color: green;
}
#grid{
	position: relative;
    left: -38px;
}
.profile-title {
	    text-transform: uppercase;
    font-family: 'Avgardd';
    color: #ffffff;
   font-size: 26px;
    font-weight: 800;
    position: absolute;
    top: 9vh;
    right: 57%;
    text-align: right;
}
.teamlogo{
    margin-left: 20px;
}

.profile-title.mobile {
    font-family: 'Avgardd';
    color: #ffffff;
    font-size: 6vw;
    font-weight: 800;
    right: unset;
    top: unset;
    position: relative;
    text-align: left;
}

.profile-title.mobile.mid {
    font-size: 4vw;
}

.profile-title.mobile.detail {
    font-family: 'Avgardd';
    color: white;
    font-size: 4vw;
    font-weight: 800;
    right: unset;
    top: unset;
    position: relative;
    margin-left: 5%;
    text-align: left;
    width: 90%;
}

.profile-title.mobile.detail.big {
    font-size: 6vw;
    width: 50%;
    margin-left: 0;
}

.profile-title.mobile.detail.big2 {
    font-size: 6vw;
    width: 90%;
    margin-left: 0;
}

.profile-title.mobile.detail.sm {
    font-size: 2.2vw;
    width: 50%;
}

.profile-title.mobile.detail.mid {
    font-size: 2.8vw;
    width: 50%;
}

.profile-title.mobile.detail.light {
    font-size: 4vw;
    width: 65%;
    font-weight: normal;
    margin-left: 5%;
    padding-left: 0;
    cursor: pointer;
}

.profile-title.mobile.detail.light.topbar {
    font-size: 4vw;
    width: auto;
    font-weight: normal;
    float: left;
    margin-left: 5%;
    cursor: pointer;
}

.profile-title.mobile.detail.light2 {
    font-size: 4vw;
    width: 35%;
    font-weight: normal;
    margin-left: 5%;
    padding-left: 0;
    cursor: pointer;
}


.profile-title.mobile.detail.dark {
    color: #5c6368;
    margin-left: 0;
}

.mt-2 {
    margin-top: 2%;
}

.mt-10 {
    margin-top: 10%;
}
.site-info{
    display: none;
}
.page-template-index .site-info,.home .site-info{
    display: block;
}
.profile-r2 p {
    color: #fff;
    font-family: 'Avgardd';
    font-size: 0.8vw;
    padding-bottom: 4%;
    padding-left: 5%;
    padding-right: 5%;
    line-height: 1.5;
    text-align: right;
      text-align: justify; /* For Edge */
  -moz-text-align-last: right; /* For Firefox prior 58.0 */
  text-align-last: right;
}

.profile-pic {
    object-fit: cover;
    height: 100%;
}

.profile-btn-container {
    margin-top: 9.3vh;
    margin-left: 5%;
}

.profile-btn {
    width: 7%;
    float: left;
    position: relative;
    -webkit-transition: ease-in-out 1s;
    transition: ease-in-out 1s;
}

.profile-btn-container:hover {
    cursor: pointer;
    margin-left: 7%;
    -webkit-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
}
.mails p{
    padding-bottom: 0!important;
      text-align: justify; /* For Edge */
  -moz-text-align-last: right; /* For Firefox prior 58.0 */
  text-align-last: right;
        padding-right:60px;
}
.profile-txt {
    font-family: 'Avgardd';
    margin-left: 8%;
    font-size: 1.2vw;
    color: white;
    padding-top: 2.2%;
}
.footer-mob-side a:first-child{
    margin-right: 13px;
}
.profile-imgs {
    width: 32.6%;
    height: auto;
    float: left;
    margin: 0;
    padding: 0;
}

.profile-imgs.l {
    margin-right: 1%;
    position: relative;
}

.profile-imgs.m {
    margin-right: 1%;
}

.profile-imgs.r {
    float: right;
    position: relative;
}


/*   C O N T A C T   P A G E   */

.contact-container {
    display: grid;
    height: 100vh;
    width: 100vw;
    grid-template-columns: 5fr 4fr;
    grid-template-rows: 7fr 4fr 2fr;
    grid-template-areas:
    "contact-l1 contact-r1"
    "contact-l2 contact-r2"
    "footer contact-r3";

}

.contact-container-mobile {
    width: 100vw;
    height: 100vh;
}

.contact-l1 {
    grid-area: contact-r1;
    /*grid-area: contact-l1;*/
    position: relative;
}

.contact-l2 {
    width: 100%;
    /*grid-area: contact-l2;*/
    grid-area: contact-r2;
    -webkit-transition: 5s;
    transition: 5s;
    overflow: hidden;
    top: -72%;
    height:400px;
    position: relative;

}

.contact-r1 {
    /*grid-area: contact-r1;*/
        grid-area: contact-l1;
    background-color: #000;
    position: relative;
}

.contact-r2 {
  /*  grid-area: contact-r2;*/
    background-color: #ffffff;
    position: relative;
}

.contact-r3 {
    /*grid-area: contact-r3;*/
    background-color: #ffffff;
}

.address {
    width: auto;
    float: left;
    margin-left: 5%;
    text-align: left;
    font-family: 'Avgardd';
    line-height: 1.5;
    font-size: 0.8vw;
    color: #5c6368;
    bottom: 0;
    margin-top: 10px;
}
.marchimenu{
    display: none;
}
.mails {
margin-left: 7%;
    font-family: 'Avgardd';
    top: 0vh;
    line-height: 6px;
    width: 85%;
    font-size: 1vw;
    position: relative;
    padding-bottom: 6vh;
    right: 24px;
    float: right;
    
}

.mail-container {
    width: 100%;
    display: inline-block;
    height: auto;
    padding-top: 2%;
}

.mail-container-lp {
    width: 100%;
    display: inline-block;
    height: auto;
    padding-top: 0;
}

.mail-container-left {
    width: 7%;
    padding-left: 5%;
    position: relative;
    float: left;
    padding-top: 1%;
}

.mail-container-right {
    width: 80%;
    padding-top: 1%;
    position: relative;
    float: left;
}

.mail-container-right-non {
    width: 80%;
    padding-top: 0;
    margin-top: 0;
    position: relative;
    float: left;
}
input[type=\"text\"],
input[type=\"email\"],
textarea
{
    background-color: #fff;
    color: #fff;
    width: 100%;
}
.wpcf7 input[type=\"text\"],
.wpcf7 input[type=\"email\"],
.wpcf7 textarea
{
    background-color: #fff;
    color: #fff;
    width: 100%;
}
.wpcf7 form .wpcf7-response-output {
    margin: 2em 0.5em 1em;
    padding: 0.2em 1em;
    border: 2px solid #00a0d2; /* Blue */
}
 
.wpcf7 form.init .wpcf7-response-output {
    display: none;
}
 
.wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
    color: #fff;
    text-align: right;
    border: inherit;
}
 
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
    border-color: #dc3232; /* Red */
}
 .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: #fff!important;
}
.wpcf7 form.spam .wpcf7-response-output { 
    border-color: #fff; /* Orange */
}
 
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    border-color: #fff; /* Yellow */
    color: #fff;
    text-align: right;
}

.contact-icons {
    width: 2.6vw;
    height: 37px;
    float: right;
    position: relative;
    margin-right: 0;
    margin-left: 20px;
    object-fit: contain;
}
.mails:last-child{ 
    padding-top: 8px;
}
#primary-menu li.current_page_item a {
    color:#ff2d00;
}
.contact-icons-mobile {
    width: 3rem;
    float: left;
    position: relative;
}


.contact-text {
    font-family: 'Avgardd';
    line-height: 1;
    font-size: 0.8vw;
    margin-left: 4%;
  
    color: #5c6368;
}

.contact-text-mobile {
    font-family: 'Avgardd';
    line-height: 1.5;
    font-size: 2vw;
    margin-left: 6%;
    float: left;
    color: #5c6368;
}

.contact-text-mobile.sm {
    font-size: 1.5vw;
    padding-bottom: 2%;
}

.jobs {
    font-size: 12px;
    margin-top: 6vh;
    width: 75%;
    line-height: 1.5;
    margin-left: 15%;
   
    bottom: 0;
}

.bold {
       font-weight: 700;
    font-size: 17px;
}

/*   A R C H I T E C T U R E   P A G E   */

.arc-container {
    display: grid;
    height: 100vh;
    grid-template-columns: 4fr 3fr;
    grid-auto-rows: 53% auto 17%;
    grid-template-areas:
    "arc-l1 arc-r1"
    "arc-l2 arc-r2"
    "footer arc-r3";
}

.arc-container-mobile {
    width: 100vw;
    height: 100vh;
}

.arc-mobile-header {
    width: 100vw;
    height: auto;
    display: flex;
    align-items: center;
    padding-top: 5%;
    padding-bottom: 5%;
}

.arc-mobile-info {
    width: 100vw;
    height: auto;
    display: flex;
    align-items: center;
    background-color: #ffffff;
}

.arc-mobile-info-hi {
    height: auto;
    display: flex;
    align-items: center;
    background-color: #ffffff;
    text-decoration: none;
}

.arc-mobile-info.detail {
    padding: 4% 0 0 0;
}

.arc-mobile-info.detail.low {
    padding: 1% 0 4% 0;
}

.arc-mobile-info.detail.low.top {
    padding: 1% 0 4% 0;
    align-items: flex-start;
}


.arc-mobile-info p {
    font-family: 'Avgardd';
    font-size: 2.1vw;
    padding: 5%;
    color: white;
}

.arc-mobile-info-hi p {
    font-family: 'Avgardd';
    font-size: 2.5vw;
    padding: 5%;
    color: white;
}

.team-members.mobile {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 2vw;
    color: #5c6368;
    text-align: left;
    width: 100%;
    line-height: 1.5;
}

.team-members.mobile.light {
    color: white;
}

.team-members.mobile.bold {
    font-weight: bold;
}

.team-members.mobile.bold.extra {
    margin-top: 1vw;
}

.team-members.mobile.bold.extra.light {
    color: white;
}

.team-members.mobile.margin {
    font-size: 2vw;
    margin: 0;
    padding-bottom: 1vw;
}

.arc-column.mobile {
    width: auto;
    float: left;
    margin-left: 5%;
    text-align: left;
}

.arc-column.mobile ul {
    margin-top: 1vh;
}

.teamlogo-mobile {
    float: left;
    width: 25%;
    margin-left: 2%;
}

.logowhite {
    width: 100%;
}

.logowhite.topbar {
    width: 30%;
    margin-left: 2%;
}

.arc-mobile-projects {
    margin-top: 5%;
    width: 100vw;
    height: auto;
    display: flex;
    justify-content: center;
}

.arc-mobile-projects.lowm {
    margin-top: 2%;
}

.arc-mobile-one {
    width: 100%;
    display: flex;
    align-items: center;
}

.arc-mobile-just {
    width: 100%;
}

.arc-mobile-divided {
    width: 49%;
    position: relative;
    float: left;
}

.arc-mobile-divided.toright {
    width: 48%;
    position: relative;
    float: right;
}

.arc-mob {
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    padding-bottom: 10%;
    background-color: white;
}

.r-arrow {
    background-image: url("../fonts/r-arrow.svg");
    height: 12vw;
    width: 12vw;
    position: relative;
    background-repeat: no-repeat;
    float: right;
    padding-right: 7%;
    margin-top: 2%;
}

.nostyle {
    text-decoration: none;
}

.arrow-container {
    width: 5%;
    /* cubic-bezier-easing = sine / mehr Beispiele: https://easings.net/ */
    animation: bounce 1600ms infinite cubic-bezier(0.445, 0.05, 0.55, 0.95);
    height: 15px;
    margin-left: 5%;
    padding-top: 2%;
    padding-bottom: 1%;
}

.arrow-down {
    height: 1px;
    background: #ffffff;
    transform: rotate(45deg);
    transform-origin: 0 0;
    border-radius: 0;
}

.arrow-down:after, .arrow-right:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 100%;
    border-radius: 0;
    background: #ffffff;
    transform: rotate(-90deg);
    transform-origin: 0 100%;
}

@keyframes bounce {
    50% {
        transform: translateY(10px);
    }
}

.closeclick {
    cursor: pointer;
    float: right;
}

.close {
    position: relative;
    padding-top: 4%;
    width: 5vh;
    height: 5vh;
    opacity: 1;
}

.close:hover {
    opacity: 1;
}

.close:before, .close:after {
    position: absolute;
    content: ' ';
    height: 100%;
    width: 2px;
    background-color: white;
}

.close:before {
    transform: rotate(45deg);
}

.close:after {
    transform: rotate(-45deg);
}

.arrow-right-container {
    width: 6%;
    height: 15px;
    float: right;
    position: relative;
    margin-top: 11%;
    margin-right: 5%;
}

.arrow-right {
    height: 1px;
    background: #ffffff;
    transform: rotate(-45deg);
    transform-origin: 0 0;
    border-radius: 0;
}

.arc-l1 {
    grid-area: arc-l1;
    position: relative;
}

.arc-l2 {
    grid-area: arc-l2;
    position: relative;
}

.arc-r1 {
    grid-area: arc-r1;
    background-color: #ffffff;
}

.arc-r2 {
    grid-area: arc-r2;
    background-color: #ffffff;
    z-index: 9999;
}

.arc-r3 {
    grid-area: arc-r3;
    position: relative;
    background-color: #ffffff;
}

.arc-projects {
    width: 100%;
    height: auto;
    float: left;
    margin: 0;
    padding: 0;
    top: -18%;
}

.arc-projects.l {
    margin-right: 1%;
    position: relative;
}

.arc-projects.m {
    margin-right: 1%;
}

.arc-projects.r {
    float: right;
    position: relative;
}

.arc-tedp {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.okulall {
    opacity: 1;
    -webkit-transition: 1s;
    transition: 1s;
}

.tedp-index {
    width: 100%;
    float: left;
}

.arc-cso, .arc-tedidari {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-pub1, .arc-pub2, .arc-pub3, .arc-pub4, .arc-pub5, .arc-pub6, .arc-pub7, .arc-pub8, .arc-pub9, .arc-pub10, .arc-pub11, .arc-pub12, .arc-pub13, .arc-pub14, .arc-pub15, .arc-pub16, .arc-pub17, .arc-pub18, .arc-pub19, .arc-pub20, .arc-pub21, .arc-pub22, .arc-pub23, .arc-pub24, .arc-pub25, .arc-pub26, .arc-pub27, .arc-pub28, .arc-pub29, .arc-pub30, .arc-pub31, .arc-pub32, .arc-pub33, .arc-pub34, .arc-pub35, .arc-pub36, .arc-pub37, .arc-pub38, .arc-pub39, .arc-pub40, .arc-pub41, .arc-pub42, .arc-pub43, .arc-pub44, .arc-pub45, .arc-pub46, .arc-pub47, .arc-pub48, .arc-pub49, .arc-pub50, .arc-pub51, .arc-pub52, .arc-pub53, .arc-pub54, .arc-pub55, .arc-pub56, .arc-pub57, .arc-pub58, .arc-pub59, .arc-pub60, .arc-pub61, .arc-pub62, .arc-pub63, .arc-pub64, .arc-pub65, .arc-pub66, .arc-pub67, .arc-pub68, .arc-pub69, .arc-pub70, .arc-pub71, .arc-pub72, .arc-pub73, .arc-pub74, .arc-pub75, .arc-pub76, .arc-pub77, .arc-pub78, .arc-pub79, .arc-pub80, .arc-pub81, .arc-pub82, .arc-pub83, .arc-pub84, .arc-pub85, .arc-pub86, .arc-pub87, .arc-pub88, .arc-pub89, .arc-pub90, .arc-pub91, .arc-pub92, .arc-pub93, .arc-pub94, .arc-pub95, .arc-pub96, .arc-pub97, .arc-pub98, .arc-pub99, .arc-pub100, .arc-pub101, .arc-pub102, .arc-pub103, .arc-pub104, .arc-pub105, .arc-pub106, .arc-pub107, .arc-pub108, .arc-pub109, .arc-pub110, .arc-pub111, .arc-pub112, .arc-pub113, .arc-pub114, .arc-pub115, .arc-pub116, .arc-pub117, .arc-pub118, .arc-pub119, .arc-pub120, .arc-pub121, .arc-pub122, .arc-pub123, .arc-pub124, .arc-pub125, .arc-pub126, .arc-pub127, .arc-pub128, .arc-pub129, .arc-pub130, .arc-pub131, .arc-pub132, .arc-pub133, .arc-pub134, .arc-pub135, .arc-pub136, .arc-pub137, .arc-pub138, .arc-pub139, .arc-pub140, .arc-pub141, .arc-pub142, .arc-pub143, .arc-pub144, .arc-pub145, .arc-pub146, .arc-pub147, .arc-pub148, .arc-pub149, .arc-pub150, .arc-pub151, .arc-pub152, .arc-pub153, .arc-pub154, .arc-pub155, .arc-pub156, .arc-pub157, .arc-pub158, .arc-pub159, .arc-pub160, .arc-pub161, .arc-pub162, .arc-pub163, .arc-pub164, .arc-pub165, .arc-pub166, .arc-pub167, .arc-pub168, .arc-pub169, .arc-pub170, .arc-pub171, .arc-pub172, .arc-pub173, .arc-pub174, .arc-pub175, .arc-pub176, .arc-pub177, .arc-pub178, .arc-pub179, .arc-pub180, .arc-pub181, .arc-pub182, .arc-pub183, .arc-pub184, .arc-pub185, .arc-pub186, .arc-pub187, .arc-pub188, .arc-pub189, .arc-pub190, .arc-pub191, .arc-pub192, .arc-pub193, .arc-pub194, .arc-pub195, .arc-pub196 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-diyarbakir {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-dhaka, .arc-gelibolu, .arc-45public {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-cermodern {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-tedkoleji {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;

}

.arc-odtukonukevi {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-44schools, .arc45public {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-kolejin {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-44s1, .arc-44s2, .arc-44s3, .arc-44s5, .arc-44s6, .arc-44s8, .arc-44s9, .arc-44s10, .arc-44s11, .arc-44s12, .arc-44s13, .arc-44s14,
.arc-44s15, .arc-44s16, .arc-44s17, .arc-44s18, .arc-44s19, .arc-44s20, .arc-44s21, .arc-44s22, .arc-44s23, .arc-44s24, .arc-44s25, .arc-44s26,
.arc-44s27, .arc-44s28, .arc-44s29, .arc-44s30, .arc-44s31, .arc-44s32, .arc-44s33, .arc-44s34, .arc-44s35, .arc-44s36, .arc-44s37, .arc-44s38,
.arc-44s39, .arc-44s40, .arc-44s41, .arc-44s42, .arc-44s43, .arc-44s44, .arc-45p1, .arc-45p2, .arc-45p3, .arc-45p4, .arc-45p5, .arc-45p6, .arc-45p7,
.arc-45p8, .arc-45p9, .arc-45p10, .arc-45p11, .arc-45p12, .arc-45p13, .arc-45p14, .arc-45p15 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    width: 100%;
    float: left;
    position: absolute;
}

.arc-tininfo {
    font-family: 'Avgardd';
    text-transform: uppercase;
    color: #5c6368;
    font-size: 1.6vw;
    font-weight: 800;
    position: relative;
    text-align: left;
    margin-left: 2vw;
}

.arc-tininfo.small {
    font-size: 0.8vw;

    margin-left: 0;
}

.arc-tininfo.mobile {
    font-family: 'Avgardd';
    text-transform: uppercase;
    color: #5c6368;
    font-size: 3vw;
    font-weight: 800;
    position: relative;
    text-align: left;
    margin-top: 4%;
    margin-left: 5%;
}

.gal-overlay {
    background-color: #ff2d00;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
}

.gal-overlay.cso {
    background-color: goldenrod;
}

.gal-overlay.diyarbakir,
.gal-overlay.dhaka {
    background-color: blue;
}

.gal-overlay.odtukonukevi {
    background-color: #e03222;
}

.gal-overlay.cermodern {
    background-color: #ff8836;
}

.gal-overlay.tedkoleji,
.gal-overlay.gelibolu {
    background-color: #7ef353;
}

.gal-overlay {
    background-color: #d45d9d;
}

.gal-overlay.kolejin {
    background-color: rebeccapurple;
}

.gal-overlay.pr1 {
    background-color: blue;
}

.gal-overlay.pr2 {
    background-color: yellow;
}

.gal-overlay:hover, .gal-overlay.cso:hover, .gal-overlay.diyarbakir:hover,
.gal-overlay.odtukonukevi:hover, .gal-overlay.cermodern:hover, .gal-overlay.tedkoleji:hover,
.gal-overlay.kolejin:hover {
    -webkit-transition: 0.5s;
    transition: 0.5s;
    opacity: 1;
}

.gal-select-tedp, .gal-select-44s9, .gal-select-44s16, .gal-select-44s23, .gal-select-44s30, .gal-select-44s37, .gal-select-45p1, .gal-select-45p7, .gal-select-45p13 {
    background-color: #ff2d00;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-cso, .gal-select-44s1, .gal-select-44s10, .gal-select-44s17, .gal-select-44s24, .gal-select-44s31, .gal-select-44s38 {
    background-color: goldenrod;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}


.gal-select-odtukonukevi, .gal-select-tedidari, .gal-select-44s3, .gal-select-44s12, .gal-select-44s19, .gal-select-44s26, .gal-select-44s33, .gal-select-44s40, .gal-select-45p2, .gal-select-45p8, .gal-select-45p14 {
    background-color: #e03222;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pub1, .gal-select-pub6, .gal-select-pub11, .gal-select-pub15 {
    background-color: #ff6456;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pub2, .gal-select-pub7, .gal-select-pub12, .gal-select-pub16, .gal-select-pub20, .gal-select-pub24, .gal-select-pub28,
.gal-select-pub32, .gal-select-pub36, .gal-select-pub40, .gal-select-pub44, .gal-select-pub48, .gal-select-pub52, .gal-select-pub56, .gal-select-pub60,
.gal-select-pub64, .gal-select-pub68, .gal-select-pub72, .gal-select-pub76, .gal-select-pub80, .gal-select-pub84, .gal-select-pub88, .gal-select-pub92,
.gal-select-pub96, .gal-select-pub100, .gal-select-pub104, .gal-select-pub108, .gal-select-pub112, .gal-select-pub116, .gal-select-pub120,
.gal-select-pub124, .gal-select-pub128, .gal-select-pub132, .gal-select-pub136, .gal-select-pub140, .gal-select-pub144, .gal-select-pub148, .gal-select-pub152,
.gal-select-pub156, gal-select-pub160, .gal-select-pub164, .gal-select-pub168, .gal-select-pub172, .gal-select-pub176, .gal-select-pub180, .gal-select-pub184, .gal-select-pub188,
.gal-select-pub192, .gal-select-pub196, .gal-select-45public {
    background-color: #0047ff;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pub3, .gal-select-pub8, .gal-select-pub13, .gal-select-pub17, .gal-select-pub21, .gal-select-pub25, .gal-select-pub29,
.gal-select-pub33, .gal-select-pub37, .gal-select-pub41, .gal-select-pub45, .gal-select-pub49, .gal-select-pub53, .gal-select-pub57,
.gal-select-pub61, .gal-select-pub65, .gal-select-pub69, .gal-select-pub73, .gal-select-pub77, .gal-select-pub81, .gal-select-pub85,
.gal-select-pub89, .gal-select-pub93, .gal-select-pub97, .gal-select-pub101, .gal-select-pub105, .gal-select-pub109, .gal-select-pub113,
.gal-select-pub117, .gal-select-pub121, .gal-select-pub125, .gal-select-pub129, .gal-select-pub133, .gal-select-pub137, .gal-select-pub141,
.gal-select-pub145, .gal-select-pub149, .gal-select-pub153, .gal-select-pub157, .gal-select-pub161, .gal-select-pub165, .gal-select-pub169,
.gal-select-pub173, .gal-select-pub177, .gal-select-pub181, .gal-select-pub185, .gal-select-pub189, .gal-select-pub193, .gal-select-pub197,
.gal-select-45p5, .gal-select-45p11 {
    background-color: #ffbf13;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pub4, .gal-select-pub9, .gal-select-pub14, .gal-select-pub18, .gal-select-pub22, .gal-select-pub26, .gal-select-pub30,
.gal-select-pub34, .gal-select-pub38, .gal-select-pub42, .gal-select-pub46, .gal-select-pub50, .gal-select-pub54, .gal-select-pub58,
.gal-select-pub62, .gal-select-pub66, .gal-select-pub70, .gal-select-pub74, .gal-select-pub78, .gal-select-pub82, .gal-select-pub86,
.gal-select-pub90, .gal-select-pub94, .gal-select-pub98, .gal-select-pub102, .gal-select-pub106, .gal-select-pub110, .gal-select-pub114,
.gal-select-pub118, .gal-select-pub122, .gal-select-pub126, .gal-select-pub130, .gal-select-pub134, .gal-select-pub138, .gal-select-pub142,
.gal-select-pub146, .gal-select-pub150, .gal-select-pub154, .gal-select-pub158, .gal-select-pub162, .gal-select-pub166, .gal-select-pub170,
.gal-select-pub174, .gal-select-pub178, .gal-select-pub182, .gal-select-pub186, .gal-select-pub190, .gal-select-pub194 {
    background-color: #b23aff;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pub5, .gal-select-pub10, .gal-select-pub15, .gal-select-pub19, .gal-select-pub23, .gal-select-pub27, .gal-select-pub31,
.gal-select-pub35, .gal-select-pub39, .gal-select-pub43, .gal-select-pub47, .gal-select-pub51, .gal-select-pub55, .gal-select-pub59, .gal-select-pub63,
.gal-select-pub67, .gal-select-pub71, .gal-select-pub75, .gal-select-pub79, .gal-select-pub83, .gal-select-pub87, .gal-select-pub91, .gal-select-pub95,
.gal-select-pub99, .gal-select-pub103, .gal-select-pub107, .gal-select-pub111, .gal-select-pub115, .gal-select-pub119, .gal-select-pub123, .gal-select-pub127,
.gal-select-pub131, .gal-select-pub135, .gal-select-pub139, .gal-select-pub143, .gal-select-pub147, .gal-select-pub151, .gal-select-pub155, .gal-select-pub159,
.gal-select-pub163, .gal-select-pub167, .gal-select-pub171, .gal-select-pub175, .gal-select-pub179, .gal-select-pub183, .gal-select-pub187, .gal-select-pub191 {
    background-color: #559999;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-tedkoleji, .gal-select-gelibolu, .gal-select-44s5, .gal-select-44s13, .gal-select-44s20, .gal-select-44s27, .gal-select-44s34, .gal-select-44s41 {
    background-color: #7ef353;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-44s8, .gal-select-44s14, .gal-select-44s22, .gal-select-44s29, .gal-select-44s36, .gal-select-44s43, .gal-select-45p4, .gal-select-45p10 {
    background-color: #ff8836;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-diyarbakir,
.gal-select-cermodern,
.gal-select-dhaka,
.gal-select-44s2,
.gal-select-45p3,
.gal-select-45p9,
.gal-select-45p15,
.gal-select-44s11,
.gal-select-44s18,
.gal-select-44s25,
.gal-select-44s32,
.gal-select-44s39,
.gal-select-pr1,
.gal-select-pl2 {
    background-color: blue;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-44schools, .gal-select-44s21, .gal-select-44s28, .gal-select-44s35, .gal-select-44s42 {
    background-color: #d45d9d;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-kolejin, .gal-select-44s6, .gal-select-44s15, .gal-select-45p6, .gal-select-45p12 {
    background-color: rebeccapurple;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.gal-select-pr2 {
    background-color: gold;
    width: 100%;
    height: 100%;
    position: absolute;
    mix-blend-mode: color;
    z-index: 10;
    overflow: auto;
    opacity: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}


.showcase-a {
    width: 100%;
    position: relative;
    display: block;
    margin-bottom: 3%;
}

.showcase-p {
    width: 100%;
    position: relative;
    display: block;
    margin-bottom: 10%;
}

.showcase-b {
    width: 100%;
    position: relative;
    display: block;
    margin-bottom: 3%;
    border-width: 2px;
    border-style: solid;
    border-color: #ece7df;
}

.showcase-m {
    width: 100%;
    position: relative;
    display: block;
}

.showcase-full {
    width: 100vw;
    position: relative;
    display: block;
}

.padbot5 {
    padding-bottom: 5%;
}

.arc-column {
    width: auto;
    float: left;
    margin-left: 2vw;
    text-align: left;
}

.arc-r1 > p {
    padding-right: 10%;
    margin-top: 10vh;
}

.pub-container {
    display: grid;
    height: 100vh;
    width: 100vw;
    grid-template-columns: 4fr 3fr;
    grid-auto-rows: 53% auto 17%;
    grid-template-areas:
    "pub-l1 pub-r1"
    "pub-l2 pub-r2"
    "footer pub-r3";
}

.pub-l1 {
    grid-area: pub-l1;
    position: relative;

}

.pub-l2 {
    grid-area: pub-l2;

}

.pub-r1 {
    grid-area: pub-r1;
    background-color: #ffffff;
}

.pub-r2 {
    grid-area: pub-r2;
    background-color: #ffffff;
    position: relative;
}

.pub-r3 {
    grid-area: pub-r3;
    background-color: #ffffff;
}

.pub-r1 > p {
    padding-right: 10%;
    margin-top: 10vh;
}

.pub-items {
    width: 49%;
    height: auto;
    float: left;
    margin: 0;
    padding: 0;
}

.pub-items.l {
    float: left;
}

.pub-items.r {
    float: right;
}

.pub-p1 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    float: left;
    width: 100%;
    position: relative;
}

.pub-p2 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    float: left;
    width: 100%;
    position: absolute;
}

.pub-p3 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    float: left;
    width: 100%;
    position: absolute;
}

.pub-p4 {
    opacity: 0;
    -webkit-transition: 1s;
    transition: 1s;
    float: left;
    width: 100%;
    position: absolute;
}

.wrap {
    width: 100%;
}

.pub-tininfo {
    font-family: 'Avgardd';
    text-transform: uppercase;
    color: #5c6368;
    font-size: 1.6vw;
    font-weight: 800;
    position: relative;
    text-align: left;
    margin-left: 2vw;
}

.pub-column {
    float: left;
    margin-left: 2vw;
    text-align: left;
    width: auto;
}

.modal-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 99999;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0s, opacity 0.5s;
    overflow: scroll;
}

.modal-row {
    width: 80%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4rem;
    display: flex;
    justify-content: space-between;
}

.modal-one {
    width: 33%;
    position: relative;
}

.modal-two {
    width: 50%;
    position: relative;
}

.modal-three {
    width: 100%;
    position: relative;
}

.modal-left {
    width: 30%;
    position: relative;
    float: left;
}

.modal-left.two {
    width: 40%;
}

.modal-left.all {
    width: 100%;
}

.modal-right {
    width: 70%;
    height: 100%;
    position: relative;
    float: left;
}

.modal-right.two {
    width: 60%;
}

.modal-pp {
    width: 100%;
    position: relative;
    float: left;
    margin-right: 2rem;
}

.mobteam-pp {
    width: 100%;
    position: relative;
    float: left;
    padding-bottom: 5%;
}

.mobteam-spp {
    width: 50%;
    position: relative;
    float: left;
    padding-bottom: 5%;
}

.sub-text {
    margin-top: 1%;
    display: block;
    font-size: 0.8vw;
    letter-spacing: normal;
    font-style: italic;
}

.bg-active {
    visibility: visible;
    opacity: 1;
}

.modal-team {
    position: relative;
    float: left;
    width: 70%;
    height: 50%;
    margin-top: 1%;
    overflow-y: hidden;
    overflow-x: hidden;
}

.team-index {
    font-family: 'Avgardd';
    font-size: 1.8vw;
    opacity: 0.7;
    color: #5c6368;
    font-weight: 800;
    margin-left: 2vw;
    width: 100%;
}

.team-text {
    font-family: 'Avgardd';
    color: #5c6368;
    font-size: 0.8vw;
    margin-left: 2vw;
    line-height: 1.5;
    opacity: 0.7;
    position: relative;
}

.team-text.title {
    font-size: 0.8vw;
    font-style: oblique;
}

.team-text.title.mobteamtext {
    font-size: 3vw;
    font-style: oblique;
    margin-left: unset;
}

.team-text.title.mobteamtext2 {
    font-size: 2.4vw;
    font-style: unset;
    margin-left: unset;
}

.team-infotext {
    font-family: 'Avgardd';
    color: #5c6368;
    font-size: 0.8vw;
    margin-left: 2vw;
    line-height: 1.5;
    opacity: 0.7;
    position: absolute;
    bottom: 0;
}

.mrg-top-7 {
    margin-top: 7%;
}

.mrg-top-3 {
    margin-top: 3%;
}

.mrg-bottom-3 {
    margin-bottom: 3%;
}

.team-btn {
    border: 0;
    font-family: 'Avgardd';
    font-size: 1.2vw;
    color: white;
    padding-top: 2.2%;
    background: none;
    cursor: pointer;
}

.team-title {
    font-family: 'Avgardd';
    color: #ffffff;
    opacity: 0.3;
    font-size: 20vh;
    font-weight: 800;
    position: fixed;
    margin-top: 7%;
    left: 0;
    text-align: left;
    z-index: -1;
    pointer-events: none;
    writing-mode: sideways-lr;
}

.team-ppic {
    float: left;
    height: 100px;
    width: 100px;
}

.object-fit {
    height: 60%;
    object-fit: cover;
}

.team-right {
    float: left;
    height: 60%;
}

.modal-close {
    position: fixed;
    margin-top: 1%;
    opacity: 0.7;
    right: 2vw;
    font-family: 'Avgardd';
    font-size: 10vh;
    color: #ffffff;
    cursor: pointer;
}

.cross {
    width: 4%;
    opacity: 0.4;
    float: right;
    cursor: pointer;
    position: fixed;
    margin-top: 2%;
    right: 0;
    padding-right: 2%;
}

.cross-white {
    position: absolute;
    width: 8vw;
    float: right;
    cursor: pointer;
    right: 0;
    padding-right: 5%;
    z-index: 100004;
}

.sidebar-leftcon {
    width: 80%;
    float: right;
}

.sidebar-rightcon {
    padding-top: 5%;
    margin-right: 3%;
    width: 15%;
    float: right;
}
.menu-item a:hover{
    color:#d54121;
}
@media only screen and (min-width: 768px){
  .nav1.home {
    grid-area: main;
    padding-top: 30px;
      padding-right: 30px;
}  
    .homemain {
    grid-area: nav1;
    height: 104px;
}
}

@media only screen and (max-width: 767px) {
    .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output {
    border-color: !important;
    color: #000!important;
    border: inherit!important;
    text-align: right;
    font-size: 15px;
}
    .container {
        display: grid;
        height: 100vh;
        width: 100vw;
        grid-template-columns: 1fr;
        grid-template-rows: 3fr 0.1fr 0.2fr 0.5fr;
        grid-template-areas:
      "main-slider"
      "main"
      "nav"
      "footer"
    }

    main {
        margin-top: 5%;
        padding-left: 5%;
        float: left;
        position: relative;
    }

    ul {
        padding-left: 5%;
        margin-top: 3%;
    }

    .text-u {
        text-align: left;
    }

    .text-a {
        text-align: left;
    }

    .logo {
        margin-left: auto;
        margin-right: auto;
        position: relative;
        margin-top: 3%;
        float: left;
         margin-left: 20px;
    }

    .toggle-custom.main {
        position: fixed;
            width: 54px;
        float: right;
        cursor: pointer;
        right: 0;
        padding-right: 5%;
        z-index: 100004;
        top:-8px;
        display: inline;
    }


    li {
        font-size: 4vh;
        text-align: left;
    }

    li a {
        color: white;
    }

    .social-icon {
        height: 30px;
    margin-left: 6%;
    margin-bottom: 0;
    }

    nav {
        background-color: white;
        display: none;
    }

    .nav1 {
        display: none;
    }

    #twitter {
        float: left;
        height: 100%;
        margin-left: 2%;
    }

    .copyright {
        font-size: 2vw;
    }

    .project-container {
        display: grid;
        height: 100vh;
        grid-template-columns: 1fr;
        grid-auto-rows: 1fr 1fr 1fr;
        grid-template-areas:
      "team"
      "project-pics"
      "footer";
    }

    .nav-mob {
        display: inline-block;
    }

    .toggle-btn {
        position: fixed;
        right: 5%;
        top: 1%;
        cursor: pointer;
        display: block;

    }

    .blob-container {
        position: fixed;
        float: right;
        cursor: pointer;
        right: 0;
        padding-top: 5%;
        padding-right: 5%;
        z-index: 100;

    }

    .blob {
        background: white;
        border-radius: 50%;
        height: 30px;
        width: 30px;

        box-shadow: 0 0 0 0 rgb(255, 255, 255);
        transform: scale(1);
        animation: pulse 2s infinite;
    }


    @keyframes pulse {
        0% {
            transform: scale(1);
            box-shadow: 0 0 0 0 rgba(255, 255, 255, 1);
        }

        70% {
            transform: scale(1);
            box-shadow: 0 0 0 50px rgba(0, 0, 0, 0);
        }

        100% {
            transform: scale(1);
            box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
        }
    }


}
.msocial-icon{
    display: none;
}
@media only screen and (max-width: 767px) {
 .gridanimation img{
        max-width: 280px!important;
    }
    .msocial-icon{
    display: block;
}
.wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
    color: #000;
    text-align: right;
    border: inherit;
}
}
@media only screen and (min-width: 1101px) {
    .archimenu{
        position: fixed;
    right: 57%;
    }
}
@media only screen and (max-width: 1100px) {
    .wpcf7 form.sent .wpcf7-response-output {
    border-color: #46b450;
    color: #000;
    text-align: right;
    border: inherit;
}
    .wpcf7-form-control.wpcf7-text, .wpcf7-form-control.wpcf7-textarea {
    width: 90%;
    color: #000!important;
}
    .mobiletitle{
        display: block;
    }
    .mobile{
    display: block;
}
   .wpcf7-form-control.wpcf7-submit {
       
    display: block;
    width: 100px;
    cursor: pointer;
    height: 35px;
    padding: 0;
    line-height: 35px;
    background: transparent;
    border: 1px solid #000;
    text-transform: uppercase;
    font-size: 20px;
    text-transform: uppercase;
    color: #000;
       padding-right: 9px; 
    }
    .wpcf7-form-control.wpcf7-text {
  
    border: 1px solid #000;
   
}
.wpcf7-form-control.wpcf7-textarea {
 
    border: 1px solid #000;
   
}
    .archimenu{
        display: none;
    }
    .profile-container {
    display: block;
    }
    .logo {
        margin-bottom: 20px;
        margin-left: 20px;
    }
#quicknav {
  display: none;
    width: 100%;
}
.profile-l2 {
    margin-bottom: 0;
    }
    .profile-r2 {
        padding-top: 20px;
            background: transparent;
    }
    .wpcf7-form{
            padding-right: 2%;
    }
    .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
    border-color: #fff;
    color: #000;
    text-align: right;
}
    .profile-r2 p,.profile-r2 p a {
    color: #000;
    font-family: 'Avgardd';
    font-size: 14px;
    padding-bottom: 4%;
    padding-left: 0%;
    padding-right: 3%;
    line-height: 1.5;
    text-align: right;
    text-align: justify;
    -moz-text-align-last: right;
    /* text-align-last: right; */
}
    .profile-r2 p a {
        padding-left: 0;
        padding-right: 0;
    }
    .profile-title {
    text-transform: uppercase;
    font-family: 'Avgardd';
    color: #000;
    font-size: 3vw;
    font-weight: 800;
    position: absolute;
        top: 30px;
    right: 57%;
    text-align: right;
}
    .mails p {
    padding-bottom: 0!important;
    text-align: justify;
    -moz-text-align-last: left;
    text-align-last: right;
}
.mails {
    margin-left: 4%;
    font-family: 'Avgardd';
    top: 0vh;
    line-height: 6px;
    width: 100%;
    font-size: 14px;
    position: relative;
    padding-bottom: 6vh;
    right: 24px;
    float: right;
    width: 100%;
}
.contact-icons {
    width: 40px;
   
}
    iframe{
        height:200px;
    }
.jobs {
    width: 95%;
    margin-left: 0;
    }
    .archetec_text {
    position: a!important;
    width: 94%;
    position: absolute;
    bottom: 0;
    padding-left: 29px;
    bottom: 0;
    height: 100%;
    top: -162px;
    margin-bottom: 0!important;
    background: transparent;
    color: #000;
        display: none;
}
    .sidenav {
        display: none;
    }
    .profile-r2d.white-bg.progect-grid{
        padding-top: 16px;
    }
    .team-members {
    font-family: 'Avgardd';
    font-weight: normal;
    font-size: 14px;
    color: #000;
    text-align: left;
    width: 100%;
    padding-left: 0;
    line-height: 1.5;
}
    .team-column {
    width: auto;
    float: left;
    margin-left: 2vw;
    text-align: left;
    font-size: 14px;
}
    h4 {
    margin: 0;
    font-family: 'Avgardd';
    font-weight: 800;
    color: #000;
    font-size: 14px;
}
    .word-top {
    display: flex;
    /* width: 100%; */
    padding-right: 28px;
    float: left;
}
.portfoliopagemenu{
        display: inline-block;
    }
    
    .home.mobile h1,.home.mobile h2,.home.mobile h3{
        color:#000;
        font-size: 22px;
            line-height: 28px;
        margin-bottom: 0!important;
        text-align: right;
    }
    .home footer .social-icon, .page-template-index footer .social-icon {
    display: inline-block;
    right: 0;
    bottom: 0px;
        width: 118px;
}
    .mlogo{
            width: 60%;
     margin-left: 20px;
    margin-top: 17px;
    }
    .marchimenu{
        display: block;
    }
}