/*
 Theme Name:   Hello Elementor Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Hello Elementor Child Theme
 Template:     hello-elementor 
 Text Domain:  helloelementorchild
*/

@font-face {
	font-family: 'playfairdisplay-italic';
	src: url('url(/fonts/playfairdisplay-italic.ttf)');
	src: url('fonts/playfairdisplay-italic.woff') format('woff'), url('fonts/playfairdisplay-italic.eot') format('truetype'), url('fonts/playfairdisplay-italic.svg') format('svg');
}
@font-face {
	font-family: 'PlayfairDisplay';
	src: url('url(/fonts/PlayfairDisplay.ttf)');
	src: url('fonts/PlayfairDisplay.woff') format('woff'), url('fonts/PlayfairDisplay.eot') format('truetype'), url('fonts/PlayfairDisplay.svg') format('svg');
}
/* general */

span.pant306{
 font-family: "playfairdisplay-italic";
 color:#00B8E0;
}

/* end general */

/* products */

ul.elementor-portfolio__filters li {
background: #d3d9dd;
border-radius: 40px;
padding: 7px 27px;
font-weight: 500;
}

li.elementor-portfolio__filter.elementor-active {
    background: #00b8e0;
}

.portfolio-tab .elementor-tab-title {
    background: #d3d9dd;
    margin: 10px;
    border-radius: 40px;
    padding: 10px 20px !important;
}

.portfolio-tab  .elementor-tab-title.elementor-active {
    background: #00b8e0;
}

/* end products */

/* portfolio */

.post-slider-wrap h3 {
    padding: 18% 0;
}
.post-slider-wrap a {
 color: #fff !important;
 position: relative !important;
 z-index: 100;
}
.post-slider-container .slick-slide {
 margin: 10px !important;
 position: relative !important;
}
.post-slider-wrap h3:after {
 background: #000000ab;
 content: "";
 height: 100%;
 width: 100%;
 top: 0;
 left: 0;
 position: absolute;
 z-index: 1;
}

/* end portfolio */

/* single post */

span.post-navigation__prev--label{
 background: #d2dadd;
}
span.post-navigation__next--label{
 background: #00b8e0;
}
span.post-navigation__prev--label,
span.post-navigation__next--label{
 padding: 10px 35px;
 border-radius: 30px;
 color: #fff;
}
span.post-navigation__next--label{
 padding: 10px 35px;
 border-radius: 30px;
 color: #fff;    
}
/* end single post */

/* sidebar */

li#categories-2 {
 list-style: none;
}

h2.widgettitle {
 display: none;
}

select#cat {
 border: 0;
 background: #eff3f5;
 border-radius: 20px;
 text-transform: uppercase;
 color: #857f7f;
 font-weight: 500;
}
/* end sidebar */

/* gravity form */
.gform-body input, .gform-body textarea {
 margin-top: 10px;
 background: #00b8e029;
 border: 0 !important;
 border-radius: 0 !important;
 color: #fff;
 height: 43px;
}

.gform_button {
 background: #00b8e0 !important;
 border: 0 !important;
 color: #fff !important;
}

/* end gravity form */
.grid-container {
flex-wrap: wrap;
background: #000;
width: 100%;
margin: 0 auto;
}
.grid {
position: relative;
width: calc(20% - 0px);
background-color: #ddd;
overflow: hidden;
/*transition: width 0.8s ease;  Updated transition property */
cursor: pointer;
}
.expanded .team-img {
width: 25%;
}
.grid.expanded {
width: 80%;
}
.grid.expanded .description {
display: flex;
align-items: center;
}
.description h5 {
margin-bottom: 2px;
}
.description {
padding: 20px;
right: 0;
position: absolute;
top: 0;
width:calc(76% - 10px); /* Adjust as needed */
background-color: #fff;
display: none;
transition: left 0.5s ease; 
}
.description p {
margin: 0;
}
.description:before {
content: "\a";
position: absolute;
z-index: 1;
top: calc(50% - 22px);
margin: auto;
border-style: solid;
left: -22px;
border-width: 22px 22px 22px 0;
border-color: transparent #fff transparent transparent;
}
.description p{
font-size: 13px;
}
.grid.expanded .description {
display: flex;
justify-content: center;
flex-direction: column;
align-items: flex-start;
}
.taxonomy-term {
font-style: italic;
font-size: 15px;
font-weight: 500;
margin-bottom: 10px;
}

@media (min-width: 1200px){
.container {
    width: 1170px;
}
.section-our-people .row-isotope .col-sm-8 {
 width: 72.6%;
}
.section-our-people .col-sm-3 {
 width: 20%;
}
}
@media (min-width: 768px){
.col-sm-3 {
 width: 25%;
}

}
@media only screen and (min-width: 600px) {
.grid-container {
    display: flex;
}
.post-slider-wrap h3 {
padding-left: 90px;
}
}
@media only screen and (max-width: 600px) {
.grid.expanded {
width: 100%;
}
.expanded .team-img {
width: 27%;
}
.grid {
width: 100%;
}
.post-slider-wrap h3 {
 padding-left: 15px;
} 
.post-slider-wrap h3 a{
 font-size: 20px !important;
} 
}