/*TEAM CSS*/
@media (min-width: 1500px){
  .container-large {
      width: 1280px;
  }
}
@media (min-width: 1920px){
  .container-large {
      width: 1680px;
  }
}

#team {
    padding: 150px 0;
}
#fun-fact, #team {
    background: #f6f7fe;
}
#team .team-section-text {
    padding-top: 70px;
}
.section-count, .section-title {
    font-family: 'Josefin Sans',sans-serif;
}
.section-count {
    height: 120px;
    overflow: hidden;
    font-weight: 100;
    display: none;
}
.section-count>span {
    color: #e6e9f4;
    display: block;
    font-size: 220px;
    line-height: .7em;
}
.section-title {
    color: #688cb3;
    font-size: 48px;
    font-weight: 300;
    text-transform: capitalize;
    margin-bottom: 20px;
}
.section-text>p {
    margin-bottom: 15px;
    line-height: 2;
}

#team {
    padding: 150px 0
}

#team .team-section-text {
    padding-top: 70px
}

#team .team-single {
    border: 8px solid #e6e9f4;
    margin: 0 auto;
    padding: 15px;
    /*width: 320px;*/
    display: none
}

#team .team-single.active {
    display: block
}

#team .team-list>ul {
    list-style: none;
    margin: 0;
    padding: 0
}

#team .team-list>ul>li {
    position: relative;
    margin: 15px 0
}

#team .team-list>ul>li:first-child {
    margin-top: 0
}

#team .team-list>ul>li:last-child {
    margin-bottom: 0
}

#team .team-list>ul>li.active>a>figure:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*background: rgba(104, 140, 179, .7);*/
    background-image: url('https://poniarchitects.gr/wp-content/uploads/2020/11/hover-icon_03.png');
    background-size: contain;
}

#team .team-list>ul>li.Sophia.active>a>figure:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*background: rgba(104, 140, 179, .7);*/
    background-image: url('https://poniarchitects.gr/wp-content/uploads/2021/01/s_01.jpg');
    background-size: contain;
}

#team .team-list>ul>li.Alkmini.active>a>figure:before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    /*background: rgba(104, 140, 179, .7);*/
    background-image: url('https://poniarchitects.gr/wp-content/uploads/2021/01/alk_01.jpg');
    background-size: contain;
}

#team .team-list>ul>li.active::after {
    color: #688cb3;
    content: "\f061";
    font-family: fontawesome;
    margin-top: -10px;
    position: absolute;
    right: 0;
    top: 50%
}

#team .team-list>ul>li>a>figure {
    border-radius: 50%;
    height: 250px;
    overflow: hidden;
    width: 250px;
    position: relative
}

#team .team-info>h4 {
    color: #3a3a3a;
    font-size: 16px;
    margin-bottom: 5px;
    margin-top: 20px;
    text-align: center
}

#team .team-info>p {
    text-align: center
}

#team .team-img {
    position: relative
}

#team .team-img>img {
    width: 100%;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s
}

#team .team-social>ul {
    bottom: 0;
    list-style: none;
    margin: 0 0 0 20px;
    padding: 0;
    position: absolute;
    right: 30px;
    opacity: 0;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s
}

#team .team-social>ul>li>a {
    border-radius: 50%;
    color: #688cb3;
    display: block;
    font-size: 18px;
    height: 40px;
    margin: 15px 5px;
    padding: 8px;
    position: relative;
    text-align: center;
    width: 40px;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s
}
#team .team-social>ul>li>a:hover {
    background: #688cb3;
    color: #fff
}

#team .team-social>ul>li>a::after {
    border: 1px solid #dee3f4;
    border-radius: 50%;
    content: "";
    height: 50px;
    left: -5px;
    position: absolute;
    top: -5px;
    width: 50px
}

#team .team-single:hover .team-img>img {
    margin-left: -70px
}

#team .team-single:hover .team-social>ul {
    opacity: 1;
    right: 0
}

@media screen and (max-width:1200px) {
    #team {
        padding: 120px 0
    }
}

@media screen and (max-width:991px) {
    #team {
        padding: 90px 0
    }
    #team .col-md-5.col-sm-12.pull-right {
        float: none!important
    }
    #team .team-section-text {
        padding-bottom: 50px;
        padding-top: 0
    }
}

@media screen and (max-width:767px) {
    #team {
        padding: 60px 0
    }
    #team .team-section-text {
        padding-bottom: 30px;
        padding-top: 0
    }
    #team .team-single {
        margin: 30px auto 0;
        overflow: hidden;
        padding: 10px;
        width: 100%;
    }
    #team .team-list {
        text-align: center
    }
    #team .team-list>ul>li {
        position: relative
    }
    #team .team-list>ul>li>a>figure {
        height: 65px;
        position: relative;
        width: 65px
    }
    #team .team-list>ul>li.active::after {
        margin-top: 10px;
        position: absolute;
        right: 30px!important;
        top: 100%;
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg)
    }
    #team .team-list>ul>li {
        display: inline-block;
        margin: 15px 0
    }
}

@media screen and (max-width: 1200px){
	#team {
    padding: 120px 0;
	}
}
@media screen and (max-width: 991px){
	#team {
			padding: 90px 0;
	}
	#team .team-section-text {
    padding-bottom: 50px;
    padding-top: 0;
}
}
/* END OF TEAM CSS*/

.wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: #eaeaea;
    border: 1px solid #eaeaea;
}

/* BADGE CSS*/

.badge {
  display: block;
  width: 65px;
  height: 65px;
  background-image: url(https://poniarchitects.gr/wp-content/uploads/2020/11/logo-icon-light.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 50%;
  text-decoration: none;
  font-weight: bold;
  position: absolute;
  bottom: 25px;
  left: 50px;
  transform: translate(-50%, -50%) rotate(8deg);
  overflow: hidden;
  background-color: #eaeaea;
}

.archive .badge {
  bottom: 60%;
  left: 50%;
}

.badge.study {
  background-image: url(https://poniarchitects.gr/wp-content/uploads/2020/11/logo-icon-dark.png);
  background-color: #688cb3;
}
.badge.study:hover{
  background-color: #f8f8f8;
}

 .badge .title {
   width: 65px;
   line-height: 0.8;
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-align: center;
   font-size: 16px;
   text-transform: uppercase;
   color: #333333;
   transition: color 0.2s ease;
   word-break: break-all;
   letter-spacing: 1px;
   font-weight: 800;
}

.badge.study .title {
  color: #fafafa;
}

/* Ipad Pro Portrait */
@media only screen
  and (min-width: 1024px)
  and (max-height: 1366px)
  and (orientation: portrait)
  and (-webkit-min-device-pixel-ratio: 1.5) {

    .alternative-subtitle{display: none;}
    .grid-item-tit{font-size: 1em;}
    .badge {
      bottom: 10px;
      left: 30px;
    }

     .badge .title {
       width: 65px;
       line-height: 0.8;
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
       text-align: center;
       font-size: 16px;
       text-transform: uppercase;
       color: #333333;
       transition: color 0.2s ease;
       word-break: break-all;
       letter-spacing: 1px;
       font-weight: 800;
    }
}
 .badge .title:after {
	 content: attr(data-text);
	 position: absolute;
	 left: 2px;
	 text-shadow: -1px 0 red;
	 top: 0;
	 color: black;
	 overflow: hidden;
	 clip: rect(0, 900px, 0, 0);
}


 @keyframes noise-anim-2 {
	 0% {
		 clip: rect(48px, 9999px, 89px, 0);
	}
	 5% {
		 clip: rect(67px, 9999px, 19px, 0);
	}
	 10% {
		 clip: rect(76px, 9999px, 74px, 0);
	}
	 15% {
		 clip: rect(55px, 9999px, 17px, 0);
	}
	 20% {
		 clip: rect(54px, 9999px, 79px, 0);
	}
	 25% {
		 clip: rect(32px, 9999px, 82px, 0);
	}
	 30% {
		 clip: rect(42px, 9999px, 76px, 0);
	}
	 35% {
		 clip: rect(31px, 9999px, 42px, 0);
	}
	 40% {
		 clip: rect(54px, 9999px, 87px, 0);
	}
	 45% {
		 clip: rect(92px, 9999px, 49px, 0);
	}
	 50% {
		 clip: rect(90px, 9999px, 14px, 0);
	}
	 55% {
		 clip: rect(72px, 9999px, 82px, 0);
	}
	 60% {
		 clip: rect(65px, 9999px, 30px, 0);
	}
	 65% {
		 clip: rect(49px, 9999px, 89px, 0);
	}
	 70% {
		 clip: rect(50px, 9999px, 18px, 0);
	}
	 75% {
		 clip: rect(56px, 9999px, 7px, 0);
	}
	 80% {
		 clip: rect(49px, 9999px, 32px, 0);
	}
	 85% {
		 clip: rect(87px, 9999px, 42px, 0);
	}
	 90% {
		 clip: rect(46px, 9999px, 31px, 0);
	}
	 95% {
		 clip: rect(32px, 9999px, 52px, 0);
	}
	 100% {
		 clip: rect(33px, 9999px, 32px, 0);
	}
}
 .badge .title:before {
	 content: attr(data-text);
	 position: absolute;
	 left: -2px;
	 text-shadow: 1px 0 blue;
	 top: 0;
	 color: #fff;
	 overflow: hidden;
	 clip: rect(0, 900px, 0, 0);
}
 .badge .images {
	 width: 100%;
	 height: 100%;
	 opacity: 0;
	 transition: all 0.3s ease;
}
 @keyframes image-glitch-anim-1 {
	 0% {
		 clip: rect(76px, 150px, 112px, 0);
	}
	 6.6666666667% {
		 clip: rect(90px, 150px, 37px, 0);
	}
	 13.3333333333% {
		 clip: rect(55px, 150px, 138px, 0);
	}
	 20% {
		 clip: rect(69px, 150px, 31px, 0);
	}
	 26.6666666667% {
		 clip: rect(4px, 150px, 86px, 0);
	}
	 33.3333333333% {
		 clip: rect(32px, 150px, 142px, 0);
	}
	 40% {
		 clip: rect(77px, 150px, 131px, 0);
	}
	 46.6666666667% {
		 clip: rect(91px, 150px, 45px, 0);
	}
	 53.3333333333% {
		 clip: rect(51px, 150px, 5px, 0);
	}
	 60% {
		 clip: rect(71px, 150px, 35px, 0);
	}
	 66.6666666667% {
		 clip: rect(113px, 150px, 70px, 0);
	}
	 73.3333333333% {
		 clip: rect(113px, 150px, 25px, 0);
	}
	 80% {
		 clip: rect(68px, 150px, 92px, 0);
	}
	 86.6666666667% {
		 clip: rect(9px, 150px, 91px, 0);
	}
	 93.3333333333% {
		 clip: rect(42px, 150px, 123px, 0);
	}
	 100% {
		 clip: rect(141px, 150px, 62px, 0);
	}
}
 @keyframes image-glitch-anim-2 {
	 0% {
		 clip: rect(95px, 150px, 78px, 0);
	}
	 6.6666666667% {
		 clip: rect(139px, 150px, 98px, 0);
	}
	 13.3333333333% {
		 clip: rect(69px, 150px, 109px, 0);
	}
	 20% {
		 clip: rect(74px, 150px, 92px, 0);
	}
	 26.6666666667% {
		 clip: rect(36px, 150px, 91px, 0);
	}
	 33.3333333333% {
		 clip: rect(150px, 150px, 72px, 0);
	}
	 40% {
		 clip: rect(11px, 150px, 72px, 0);
	}
	 46.6666666667% {
		 clip: rect(40px, 150px, 46px, 0);
	}
	 53.3333333333% {
		 clip: rect(61px, 150px, 132px, 0);
	}
	 60% {
		 clip: rect(90px, 150px, 61px, 0);
	}
	 66.6666666667% {
		 clip: rect(83px, 150px, 16px, 0);
	}
	 73.3333333333% {
		 clip: rect(46px, 150px, 140px, 0);
	}
	 80% {
		 clip: rect(7px, 150px, 30px, 0);
	}
	 86.6666666667% {
		 clip: rect(141px, 150px, 60px, 0);
	}
	 93.3333333333% {
		 clip: rect(7px, 150px, 115px, 0);
	}
	 100% {
		 clip: rect(94px, 150px, 58px, 0);
	}
}
 .badge .images > img {
	 position: absolute;
	 top: 0px;
	 left: 0px;
	 width: 100%;
	 height: 100%;
}
 .badge .images > img:nth-child(2), .badge .images > img:nth-child(3) {
	 clip: rect(0, 0, 0, 0);
}
 .badge .images > img:nth-child(2) {
	 left: 2px;
	 animation: image-glitch-anim-1 2s infinite linear alternate-reverse;
}
 .badge .images > img:nth-child(3) {
	 left: -2px;
	 animation: image-glitch-anim-2 3s infinite linear alternate-reverse;
}
 .badge:hover .title {
	 color: #313139;
}
 @keyframes noise-anim {
	 0% {
		 clip: rect(14px, 9999px, 48px, 0);
	}
	 5% {
		 clip: rect(33px, 9999px, 86px, 0);
	}
	 10% {
		 clip: rect(73px, 9999px, 25px, 0);
	}
	 15% {
		 clip: rect(81px, 9999px, 86px, 0);
	}
	 20% {
		 clip: rect(98px, 9999px, 45px, 0);
	}
	 25% {
		 clip: rect(28px, 9999px, 83px, 0);
	}
	 30% {
		 clip: rect(49px, 9999px, 5px, 0);
	}
	 35% {
		 clip: rect(1px, 9999px, 84px, 0);
	}
	 40% {
		 clip: rect(81px, 9999px, 15px, 0);
	}
	 45% {
		 clip: rect(66px, 9999px, 94px, 0);
	}
	 50% {
		 clip: rect(99px, 9999px, 53px, 0);
	}
	 55% {
		 clip: rect(24px, 9999px, 36px, 0);
	}
	 60% {
		 clip: rect(59px, 9999px, 42px, 0);
	}
	 65% {
		 clip: rect(9px, 9999px, 84px, 0);
	}
	 70% {
		 clip: rect(91px, 9999px, 10px, 0);
	}
	 75% {
		 clip: rect(17px, 9999px, 73px, 0);
	}
	 80% {
		 clip: rect(83px, 9999px, 19px, 0);
	}
	 85% {
		 clip: rect(43px, 9999px, 71px, 0);
	}
	 90% {
		 clip: rect(19px, 9999px, 16px, 0);
	}
	 95% {
		 clip: rect(60px, 9999px, 30px, 0);
	}
	 100% {
		 clip: rect(51px, 9999px, 72px, 0);
	}
}
 .badge:hover .title:before {
	 animation: noise-anim-2 3s infinite linear alternate-reverse;
}
 .badge:hover .images {
	 opacity: 1;
}

.cn-button.wp-default{
  background: #444444 !important;
}

img.portrait{
  height: -webkit-fill-available;
}