/* Strat of area */
.teampage{padding: 50px 0px 50px 0px;}
.teampage .mainheading{text-align: center;}
.teampage .mainheading span{color: var(--accent-color);}
.serviceitem {overflow: hidden;flex: 0 1 calc(33.333% - 1.5rem);justify-content: center;box-sizing: border-box;border-radius: 0px 50px 0 50px;
     transition-duration: .2s;transition-property: transform;}
.serviceitem .serviceimg {overflow: hidden;position: relative;}
.serviceitem .serviceimg img {transition: 0.6s;width: 100%;}
.details {background: rgba(255, 255, 255, 1);padding: 15px;min-height: 100%;border-radius: 0px 50px 0 50px;
    margin: -35px 20px 20px 20px;transition: all ease-in-out 0.3s;position: relative;text-align: center;box-shadow: 0px 0 15px rgba(0, 0, 0, 0.1);}
.details .sheading {font-weight: 600;margin: 5px 0 5px 0;font-size: 20px;color: #222;text-decoration: none;transition: ease-in-out 0.3s;font-family: var(--heading-font);}
.details .aesthetic{color: var(--default-color);font-size: 16px; margin-bottom: 12px;}
.details div {color: color-mix(in srgb, var(--default-color), transparent 10%);line-height: 24px;font-size: 15px;margin-bottom: 12px;}
.buttontop{margin-top: 12px;display: inline-block;}
.teambtn{background-color: #fff;box-shadow: 0px 10px 50px 0px #00000014; padding: 8px 15px;font-size: 1rem;border: 1px solid var(--accent-color);  transition: 0.3s;color: var(--accent-color);}
.teambtn:hover{color: var(--accent-color);border: 1px solid var(--accent-color);}
.readbtn{background-color: #fff;box-shadow: 0px 10px 50px 0px #00000014; padding: 8px 15px;font-size: 1rem;border: 1px solid var(--default-color);  transition: 0.3s;color: var(--default-color);}
.readbtn:hover{color: var(--accent-color);border: 1px solid var(--accent-color);}
.details p{font-size: 16px; margin-bottom: 15px;}
.serviceitem:hover .details .sheading {color:#fff;}
.serviceitem:hover .details{background: var(--accent-color);}
.serviceitem:hover .sheading a{color: #fff;}
.serviceitem:hover .details div{color: #fff;}
.serviceitem:hover .viewallbtn{border: #fff 1px solid; color: #fff;}
.serviceitem:hover p{color: #fff;}


/* Start of IPad Pro Screen */
@media screen and (max-width:1400px) and (min-width:1301px){
.teampage{padding: 60px 0px 40px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 10px 15px 10px;box-shadow: 0px 0 5px rgba(0, 0, 0, 0.1);}
.details .sheading {margin: 0px 0 0px 0;font-size: 18px;}
.details p {font-size: 16px;margin-bottom: 0px;}
.readbtn {font-size: 16px;padding: 5px 10px;}
.teambtn {font-size: 16px;padding: 5px 10px;}
.details .aesthetic {font-size: 16px;margin-bottom: 5px;}
}

/* Start of IPad Pro Screen */
@media screen and (max-width:1300px) and (min-width:1201px){
.teampage{padding: 50px 0px 40px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 10px 15px 10px;box-shadow: 0px 0 5px rgba(0, 0, 0, 0.1);}
.details .sheading {margin: 0px 0 3px 0;font-size: 18px;}
.details p {font-size: 16px;margin-bottom: 0px;}
.readbtn {font-size: 16px;padding: 5px 10px;}
.teambtn {font-size: 16px;padding: 5px 10px;}
.details .aesthetic {font-size: 16px;margin-bottom: 5px;}
}

/* Start of IPad Pro Screen */
@media screen and (max-width:1200px) and (min-width:1101px){
.teampage{padding: 50px 0px 40px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 5px 15px 5px;box-shadow: 0px 0 5px rgba(0, 0, 0, 0.1);}
.details .sheading {margin: 0px 0 3px 0;font-size: 18px;}
.details p {font-size: 15px;margin-bottom: 0px;}
.readbtn {font-size: 14px;padding: 4px 8px;}
.teambtn {font-size: 14px;padding: 4px 8px;}
.details .aesthetic {font-size: 14px;margin-bottom: 0px;}
}

/* Start of IPad Pro Screen */
@media screen and (max-width:1100px) and (min-width:992px){
.teampage{padding: 40px 0px 40px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 5px 15px 5px;}
.details .sheading {margin: 0px 0 3px 0;font-size: 18px;}
.details p {font-size: 15px;margin-bottom: 0px;}
.readbtn {font-size: 14px;padding: 5px 10px;}
.teambtn {font-size: 14px;padding: 5px 10px;}
.details .aesthetic {font-size: 15px;margin-bottom: 5px;}
}

/* Start of IPad Screen */
@media screen and (max-width:991.99px) and (min-width:768px){
.teampage{padding: 40px 0px 40px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 15px 15px 2px;box-shadow: 0px 0 5px rgba(0, 0, 0, 0.1);}
.details .sheading {margin: 0px 0 3px 0;font-size: 18px;}
.details p {font-size: 15px;margin-bottom: 0px;}
.readbtn {font-size: 15px;padding: 5px 10px;}
.teambtn {font-size: 15px;padding: 5px 10px;}
.details .aesthetic {font-size: 15px;margin-bottom: 5px;}
}


/* Start of Iphone/Mobile Screen */
@media screen and (max-width:767px) and (min-width:320px){
.teampage{padding: 30px 0px 30px 0px;}
.details {padding: 10px 10px 10px;margin: -25px 15px 15px 2px;box-shadow: 0px 0 5px rgba(0, 0, 0, 0.1);}
.details .sheading {margin: 0px 0 3px 0;font-size: 18px;}
.details p {font-size: 15px;margin-bottom: 0px;}
.readbtn {font-size: 15px;padding: 5px 10px;}
.teambtn {font-size: 15px;padding: 5px 10px;}
.details .aesthetic {font-size: 15px;margin-bottom: 5px;}
}