.hvr-bounce-to-right {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.hvr-bounce-to-right:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(255, 189, 57, 0.85);
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-bounce-to-right:hover,
.hvr-bounce-to-right:focus,
.hvr-bounce-to-right:active {
    color: #fff;
}

.hvr-bounce-to-right:hover:before,
.hvr-bounce-to-right:focus:before,
.hvr-bounce-to-right:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}

.hvr-float-shadow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.hvr-float-shadow:before {
    pointer-events: none;
    position: absolute;
    z-index: -1;
    content: '';
    top: 100%;
    left: 5%;
    height: 10px;
    width: 90%;
    opacity: 0;
    background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform, opacity;
    transition-property: transform, opacity;
}

.hvr-float-shadow:hover,
.hvr-float-shadow:focus,
.hvr-float-shadow:active {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);

}

.hvr-float-shadow:hover:before,
.hvr-float-shadow:focus:before,
.hvr-float-shadow:active:before {
    opacity: 1;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
}

/*** 
====================================================================
  About more detail section
====================================================================

 ***/
#about-section .counter-wrap a.more,
#about1-section .counter-wrap a.more {
    width: 100%;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#about-section .counter-wrap a.more:hover,
#about1-section .counter-wrap a.more:hover {
    color: #fff;
}

#about1-section .aboutheadimg {
    width: 100px;
    margin: 0 auto;
    align-items: center;
    justify-content: center;
}

#about1-section .aboutheadimg img {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-position: center;
    object-fit: cover;
}

/*** 

/*** 
====================================================================
  resume detail section
====================================================================

 ***/
#resume-section a.more {
    width: 200px;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#resume-section a.more:hover {
    color: #fff;
}

/*** 

/*** 

/*** 
====================================================================
  consultant more detail section
====================================================================

 ***/
#consultant-section .counter-wrap a.more {
    width: 100%;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#consultant-section .counter-wrap a.more:hover {
    color: #fff;
}

/*** 
====================================================================
  Program & Coruses more detail section
====================================================================

 ***/
#blog-section .blog-entry a.more,
#resume-section .resume-wrap a.more {
    width: 100%;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}


#projects-section a.more:hover,
#blog-section .blog-entry a.more:hover,
#resume-section .resume-wrap a.more:hover,
#blog-section .blog-entry :hover .icon {
    color: #fff;
}



img {
    max-width: 100%;
    display: block;
}

/* button {
    border: none;
    outline: none;
    box-shadow: none;
    display: block;
    padding: 0;
} */

input,
textarea {
    outline: none;
    box-shadow: none;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


.clear-fix {
    clear: both;
}

.clear-fix:after {
    display: table;
    content: '';
    clear: both;
}

.tran3s,
.theme-main-menu .navbar-nav>li a,
.project-gallery .single-img .opacity,
#team-section .team-member-wrapper .single-team-member .member-name h6,
#team-section .team-member-wrapper .single-team-member .member-name p,
#team-section .team-member-wrapper .single-team-member .member-name ul,
#our-client .owl-theme .owl-dots .owl-dot span {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.tran4s,
#service-section .single-service-content p,
.project-gallery .single-img .opacity ul,
.project-gallery .single-img .opacity h6 a {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.round-border {
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
}

.theme-title {
    text-align: center;
    margin: 95px 0 0 0;
}

.theme-title h2 {
    position: relative;
}

.theme-title h2:before {
    content: '';
    width: 25px;
    height: 3px;
    position: absolute;
    bottom: -25px;
    left: 50%;
    margin-left: -12px;
}

.theme-title p {
    font-size: 16px;
    width: 75%;
    margin: 60px auto 0 auto;
}

.p-color,
.theme-main-menu .navbar-nav>li.active>a,
.theme-main-menu .navbar-nav>li>a:hover,
#about-us .single-about-content:hover h5 a,
#service-section .single-service-content:hover .icon-heading .icon,
#service-section .single-service-content:hover .icon-heading h6 a,
#pricing-section .single-price-table a:hover,
#blog-section .single-news-item .img a,
#blog-section .single-news-item:hover .post p a,
#blog-section .single-news-item .post h6:hover a,
#contact-section .contact-address-content .left-side ul li:hover .icon,
#contact-section .send-message form button:hover,
.inner-page-banner .opacity ul li:last-child,
.blog-details-page aside .sidebar-news-list ul li a i,
.monthly-header-title,
.blog-details-page aside .sidebar-news-list ul li a:hover,
.blog-details-page aside .sidebar-archives ul li a i,
.blog-details-page aside .sidebar-archives ul li a:hover,
.blog-details-page aside .sidebar-archives ul li a.active,
.blog-details-page aside .sidebar-news-list ul li a.active,
.recent-single-post .post a:hover,
.sidebar-tags ul li a:hover,
.blog-details-post-wrapper .list-img-wrapper ul li a i,
.blog-details-post-wrapper .list-img-wrapper ul li a:hover,
.blog-details-post-wrapper .post-comment form button:hover,
.blog-details-post-wrapper .post-share-area .share li a:hover,
.theme-main-menu.navbar .nav>li ul li a:hover,
.blog-details-post-wrapper .post-share-area .share li a.active {
    color: #d73e4d;
}

.p-color-bg,
.theme-title h2:before,
#about-us .single-about-content:hover .icon,
#skill-section .codeconSkillbar .skillBar,
#our-client .owl-theme .owl-dots .owl-dot.active span,
#our-client .owl-theme .owl-dots .owl-dot:hover span,
.blog-details-post-wrapper .comment-area .single-comment .comment button:hover {
    background: #d73e4d;
}

.banner .project-button,
#about-us .icon,
#about-us .single-about-content a.more,
#service-section .single-service-content:hover,
.project-menu ul li.active,
.project-menu ul li:hover,
.page-middle-banner .opacity a,
#team-section .team-member-wrapper .single-team-member .img .opacity h4,
#pricing-section .single-price-table a,
#our-client .owl-theme .owl-dots .owl-dot.active span,
#our-client .owl-theme .owl-dots .owl-dot:hover span,
#contact-section .contact-address-content .left-side ul li .icon,
#contact-section .send-message form button,
.sidebar-tags ul li a:hover,
.blog-details-post-wrapper .post-comment form button,
.blog-details-post-wrapper .post-comment textarea:focus,
.blog-details-post-wrapper .post-comment input:focus {
    border-color: #d73e4d;
    border-style: solid;
}



/*** 
====================================================================
  resume detail section
====================================================================

 ***/
#resume-section a.more {
    width: 200px;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#resume-section a.more:hover {
    color: #fff;
}

/*** 

/*** 

/*** 
====================================================================
  consultant more detail section
====================================================================

 ***/
#consultant-section .counter-wrap a.more {
    width: 100%;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#consultant-section .counter-wrap a.more:hover {
    color: #fff;
}

/*** 
====================================================================
  Program & Coruses more detail section
====================================================================

 ***/
#blog-section .blog-entry a.more,
#resume-section .resume-wrap a.more {
    width: 100%;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

#blog-section .blog-entry a.more:hover,
#resume-section .resume-wrap a.more:hover,
#blog-section .blog-entry :hover .icon {
    color: #fff;
}



/*** 

====================================================================
  Service section
====================================================================

 ***/
#service-section {
    background: #232a34;
    padding-bottom: 80px;
}

#service-section .theme-title h2,
#service-section .theme-title p {
    color: #fff;
}

#service-section .row {
    margin: 50px 0 0 0;
}

#service-section .row [class*="col-"] {
    padding-top: 25px;
}

#service-section .single-service-content {
    border: 1px solid #808489;
    text-align: center;
    margin-bottom: 20px;
    padding: 118px 23px 65px 23px;
    overflow: hidden;
}

#service-section .single-service-content p {
    -webkit-transition-delay: 0.3s;
    /* Safari */
    transition-delay: 0.3s;
    opacity: 0;
    -webkit-transform: translate3D(0, 200px, 0);
    -moz-transform: translate3D(0, 200px, 0);
    -ms-transform: translate3D(0, 200px, 0);
    -o-transform: translate3D(0, 200px, 0);
    transform: translate3D(0, 200px, 0);
}

#service-section .single-service-content .icon-heading {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    top: 120px;
}

#service-section .single-service-content .icon-heading .icon {
    font-size: 48px;
    color: #808489;
    width: 80px;
    margin: 0 auto;
    background: #232a34;
}

#service-section .single-service-content .icon-heading a {
    color: #808489;
    text-transform: capitalize;
    margin-top: 33px;
}

#service-section .single-service-content:hover .icon-heading {
    top: -10px;
}

#service-section .single-service-content:hover p {
    opacity: 1;
    color: #fff;
    -webkit-transform: translate3D(0, 0, 0);
    -moz-transform: translate3D(0, 0, 0);
    -ms-transform: translate3D(0, 0, 0);
    -o-transform: translate3D(0, 0, 0);
    transform: translate3D(0, 0, 0);
}

/*** 
  
  ====================================================================
    Project section
  ====================================================================
  
   ***/
.project-menu ul {
    text-align: center;
    margin-top: 34px;
    margin-bottom: 60px;
}

.project-menu ul li {
    display: inline-block;
    cursor: pointer;
    font-size: 16px;
    font-weight: 700;
    color: #292929;
    padding: 0 8px;
    border-width: 0;
    border-bottom-width: 1px;
    border-color: transparent;
    margin: 15px 10px 0 10px;
    padding-bottom: 10px;
}

.project-gallery .grid-item {
    width: 33.33333333333%;
    padding: 0 15px;
    margin-bottom: 32px;
    float: left;
    display: none;
}

.project-gallery .single-img {
    position: relative;
    overflow: hidden;
}

.project-gallery .single-img .opacity {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* background: #ffbd39; */
    /* background: rgba(250, 200, 2, 0.8); */
    background: rgb(255, 189, 57, 0.85);
    opacity: 0;
    -webkit-transform: scale(0.2);
    -moz-transform: scale(0.2);
    -ms-transform: scale(0.2);
    -o-transform: scale(0.2);
    transform: scale(0.2);
}

.project-gallery .single-img .opacity .border-shape {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid #000;
    text-align: center;
}

.project-gallery .single-img img {
    width: 100%;
}

.project-gallery h2 {
    margin-bottom: 2.5rem;
    text-align: center;
}

.project-gallery h2 a {
    color: #fff;
}

.project-gallery .single-img .opacity h1 a {
    color: #000;
    font-weight: 600;
}

.project-gallery .single-img .opacity ul li {
    display: inline-block;
    color: #000;
    margin-top: 8px;
    font-size: 18px;
    margin-right: 2rem;
    font-weight: 600;
}

.project-gallery .single-img .opacity .border-shape>div {
    display: table;
    width: 100%;
    height: 100%;
}

.project-gallery .single-img .opacity .border-shape>div>div {
    display: table-cell;
    vertical-align: middle;
}

.project-gallery .single-img .opacity h1 a {
    -webkit-transform: translate3D(0, -100px, 0);
    -moz-transform: translate3D(0, -100px, 0);
    -ms-transform: translate3D(0, -100px, 0);
    -o-transform: translate3D(0, -100px, 0);
    transform: translate3D(0, -100px, 0);
}

.project-gallery .single-img .opacity ul {
    -webkit-transform: translate3D(0, 100px, 0);
    -moz-transform: translate3D(0, 100px, 0);
    -ms-transform: translate3D(0, 100px, 0);
    -o-transform: translate3D(0, 100px, 0);
    transform: translate3D(0, 100px, 0);
}

.project-gallery .single-img .opacity ul,
.project-gallery .single-img .opacity h1 a {
    opacity: 0;
    -webkit-transition-delay: 0.3s;
    /* Safari */
    transition-delay: 0.3s;
}

.project-gallery .single-img:hover .opacity {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.project-gallery .single-img img,
#team-section .team-member-wrapper .single-team-member .img img,
#skill-section .img img,
#blog-section .single-news-item .img img {
    -webkit-transition: all .6s ease-in-out;
    -moz-transition: all .6s ease-in-out;
    -ms-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out;
}

.project-gallery .single-img:hover img,
#team-section .team-member-wrapper .single-team-member:hover .img img,
#skill-section:hover .img img,
#blog-section .single-news-item:hover .img img {
    -webkit-transform: scale3d(1.15, 1.15, 1);
    -moz-transform: scale3d(1.15, 1.15, 1);
    -ms-transform: scale3d(1.15, 1.15, 1);
    -o-transform: scale3d(1.15, 1.15, 1);
    transform: scale3d(1.15, 1.15, 1);
}

.project-gallery .single-img:hover .opacity ul,
.project-gallery .single-img:hover h2,
.project-gallery .single-img:hover .opacity h1 a {
    opacity: 1;
    -webkit-transform: translate3D(0, 0, 0);
    -moz-transform: translate3D(0, 0, 0);
    -ms-transform: translate3D(0, 0, 0);
    -o-transform: translate3D(0, 0, 0);
    transform: translate3D(0, 0, 0);
}


.slideshow-container {
    max-width: 1000px;
    position: relative;
    margin: auto;
}


#projects-section .prev,
#projects-section .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -22px;
    padding: 16px;
    color: #ffbd39;
    font-weight: bold;
    font-size: 24px;
    font-weight: bold;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}


.next {
    right: 0;
    border-radius: 3px 0 0 3px;
}


.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
    color:#ffbd39;
}

.projects-section .text {
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    padding: 8px 12px;
    position: absolute;
    bottom: 8px;
    width: 100%;
    text-align: center;
}


.mySlides .numbertext {
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}


.projects-section .dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.projects-section .active,
.projects-section .dot:hover {
    background-color: rgb(255, 189, 57, 0.85);;
}

/* Fading animation */
.slideshow-container .fadeimgproject {
    animation-name: fadeimgproject;
    animation-duration: 3.5s;
}

@keyframes fadeimgproject {
    from {
        opacity: .1
    }

    to {
        opacity: 1
    }
}

@media only screen and (max-width: 300px) {
    .slideshow-container .text {
        font-size: 11px
    }

    .projects-section .prev,
    .projects-section .next,
    .projects-section .text {
        font-size: 11px
    }
}

#projects-section a.more {
    /* width: 100%; */
    padding: 0 3rem;
    line-height: 45px;
    color: rgb(255, 189, 57, 0.85);
    border-width: 1px;
    margin-top: 22px;
    text-align: center;
    border: 1px solid rgb(255, 189, 57, 0.85);
}

.row {
    display: -ms-flexbox;
    /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap;
    /* IE10 */
    flex-wrap: wrap;
    padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.column {
    -ms-flex: 25%;
    flex: 25%;
    max-width: 25%;
    padding: 4px;
}

.column img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    cursor: pointer;
    transition: transform 0.5s ease;
}

.column img:hover {
    transform: scale(2);
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
    .column {
        -ms-flex: 50%;
        flex: 50%;
        max-width: 50%;
    }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
    .column {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;
        padding: 1rem;
    }
}

/*** 
  
  ====================================================================
    Page Middle Banner
  ====================================================================
  
   ***/
.page-middle-banner {
    background: url(../images/home/1.jpg) no-repeat center;
    background-size: cover;
    background-attachment: fixed;
    margin-top: 70px;
}

.page-middle-banner .opacity {
    background: rgba(0, 0, 0, 0.8);
    text-align: center;
    padding: 134px 0 137px 0;
}

.page-middle-banner .opacity h3 {
    color: #fff;
    margin-bottom: 25px;
}

.page-middle-banner .opacity a {
    width: 200px;
    line-height: 45px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    border-width: 1px;
}


/* test */
.showbookimg {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 10px;
    margin-top: 3rem;
    padding: 2rem 0;
}

.showbookimg img {
    width: 100%;
    height: auto;
    object-fit: cover;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.showbookimg img:hover {
    transform: scale(1.50);
}

.iconcontact,
.iconcontact1 {
    display: grid;
    grid-template-columns: 1fr 100px;
    /* column-gap: 1rem; */
    /* background: #ffbd39; */
    align-items: center;
    /* justify-content: center; */
}

.iconcontact,
.iconcontact1 {
    display: flex;
    align-items: center;
    justify-content: center;
}


.facebook:hover {
    background: #0056b3;
    color: #ffffff;
}

.twitter:hover {
    background: #55ACEE;
    color: #ffffff;
}

.tiktok:hover {
    background: #000;
    color: #ffffff;
}

.youtube:hover {
    background: #bb0000;
    color: #ffffff;
}

.line:hover {
    background-color: #00be4f;
    color: #ffffff
}