/*-----------------------------------------------------------------------------------

    Template Name: Shopnil - One Page paralax Portfolio Html Template
    Template URI: irsfoundation.com/tf/html/shopnil-preview/
    Description: Shopnil - One Page paralax Portfolio Html Template
    Author: irsfoundation
    Author URI: irsfoundation.com
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
  
    1. Home One
        1.1 Header Area
        1.2 Slider Default
        1.3 Portfolio Area
        1.4 Counter Area
        1.5 What We Do
        1.6 Feature Blog
        1.7 Call To Action
        1.8 Footer Top
    2. Home Two
    3. Home Three
    4. Home Four
    5. Home Five
    6. About Me
    7. Portfolio
    8. Blog
    9. Blog Details
   10. Contact Area
   11. 404

-----------------------------------------------------------------------------------*/


/*============================================
* 1. Home One / 1.1 Header Area
*=============================================*/

#header {
    position: relative;
}

.header-area {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 9999;
    background-color: #fff;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
    -webkit-transition: background 0.3s ease 0s;
    -o-transition: background 0.3s ease 0s;
    transition: background 0.3s ease 0s;
}

.logo {
    display: block;
}

.logo a {
    display: inline-block;
}

.logo a img {
    max-width: 110px;
    padding : 10px 0px;
}

.main-menu {}

.main-menu nav ul {
    text-align: right;
}

.main-menu nav ul li {
    display: inline-block;
    position: relative;
}

.main-menu nav ul li a {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: #555;
    letter-spacing: 0;
    padding: 30px 18px;
    /*text-transform: capitalize;*/
}

.main-menu nav ul li:hover>a,
.main-menu nav ul li.active>a {
    color: #d16378;
}

.main-menu .submenu {
    position: absolute;
    left: 0;
    top: 78px;
    z-index: 999;
    width: 220px;
    padding: 10px 0px 15px;
    background: #fff;
    text-align: left;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05);
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    transform-origin: top;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.main-menu nav>ul>li:hover>.submenu {
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
}

.main-menu .submenu li {
    display: block;
}

.main-menu .submenu li a {
    padding: 10px 15px;
}




/*mobile menu*/

.slicknav_menu {
    background-color: #fff;
    margin: 0;
    padding: 0;
    height: 0;
}

.slicknav_menu nav {
    margin-top: 15px;
}

.slicknav_nav >ul {
    margin: 0;
}

.slicknav_nav {
    background: #2a2d2d;
}

.slicknav_nav .slicknav_row:hover {
    border-radius: 0;
    background: #d16378;
}

.slicknav_nav .slicknav_arrow {
    float: right;
}

.slicknav_menu .slicknav_menutxt {
    display: none;
}

.slicknav_btn {
    background-color: transparent;
    position: relative;
    margin-top: -40px;
}

.slicknav_menu .slicknav_icon-bar {
    height: 1px;
    width: 27px;
    margin: 6px 0px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    background-color: #666666;
}

.header-transparent .slicknav_menu .slicknav_icon-bar {
    background-color: #fff;
    box-shadow: none;
}

.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(2) {
    opacity: 0;
}

.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(1) {
    -webkit-transform: rotate(45deg) translate(2px, 10px);
    transform: rotate(45deg) translate(2px, 10px);
}

.slicknav_menu .slicknav_open .slicknav_icon-bar:nth-child(3) {
    -webkit-transform: rotate(-45deg) translateY(-9px);
    transform: rotate(-45deg) translateY(-9px);
}





/*============================================
* 1.2 Slider Default
*=============================================*/

.slider-default {
    padding: 200px 0px;
    position: relative;
    text-align: center;
    z-index: 1;
    overflow: hidden;
}

.section-overlay {
    position: absolute;
    left: -1.92801%;
    right: -1.92801%;
    top: -2.39781%;
    bottom: -2.39781%;
    height: 110%;
    width: 110%;
    z-index: -1;
    overflow: hidden;
    background: url(../img/bg/slider-bg1.jpg) center center/cover no-repeat;
}

.section-overlay:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    background: rgba(0, 0, 0, 0.4);
}

.sd-default-content h5 {
    font-size: 30px;
    color: #ffffff;
    font-weight: 400;
    margin-bottom: 17px;
    letter-spacing: 0;
}

.sd-default-content h2 {
    font-size: 58px;
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 56px;
    margin-bottom: 30px;
}

.sd-default-content p {
    font-size: 18px;
    font-weight: 400;
    color: #ffffff;
    letter-spacing: 0;
}

.sd-default-content .btn-style-one {
    margin-top: 55px;
}

.btn-style-one a {
    display: inline-block;
    min-width: 180px;
    height: 45px;
    color: #d16378;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #d16378;
    line-height: 43px;
    letter-spacing: 0;
    padding: 0px 23px;
    text-align: center;
    /*text-transform: capitalize;*/
}
.btn-style-one.white a {
    color: #ffffff;
    border: 1px solid #ffffff;
}
.btn-style-one a:hover {
    background-color: #d16378;
    color: #fff;
}





/*============================================
* END Slider Style Two
*=============================================*/


/*============================================
* 1.3 Portfolio Area
*=============================================*/

.portfolio-area {}

.portfolio-filter {
    text-align: center;
    margin-bottom: 50px;
}

.portfolio-filter button {
    font-size: 12px;
    font-weight: 500;
    color: #666666;
    background: #fff;
    border: 1px solid transparent;
    text-transform: uppercase;
    letter-spacing: 0;
    outline: none;
    padding: 0px 15px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.portfolio-filter button:hover,
.portfolio-filter button.active {
    border-color: #d16378;
    color: #d16378;
}

.portfolio-masonary {}

.portfolio-masonary .prt_gride {
    margin-bottom: 30px;
    position: relative;
}

.portfolio-masonary .prt-item {
    position: relative;
    width: 100%;
    display: block;
}

.prt-item .hover-info {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.prt-item:hover .hover-info {
    opacity: 1;
}

.prt-item .hover-info ul {
    margin-bottom: 22px;
}

.prt-item .hover-info ul li {
    display: inline-block;
    margin: 0px 30px;
    opacity: 0;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.prt-item .hover-info ul li a {
    color: #fff;
    font-size: 16px;
    height: 50px;
    width: 50px;
    border: 1px solid #fff;
    display: block;
    line-height: 50px;
    border-radius: 50%;
}

.prt-item .hover-info ul li a:hover {
    background-color: #fff;
    color: #444;
}

.prt-item .hover-info h4 {
    color: #fff;
    font-size: 16px;
    letter-spacing: 0;
    font-weight: 500;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.prt-item:hover .hover-info h4 {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
}

.prt-item:hover .hover-info ul li {
    margin: 0px 5px;
    opacity: 1;
}





/*============================================
* END Portfolio Area
*=============================================*/


/*============================================
* 1.4 Counter Area
*=============================================*/

.counter-area {
    position: relative;
    z-index: 1;
    background: url(../img/bg/counter-bg.jpg) center center/cover no-repeat;
}

.counter-area:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
    background: rgba(51, 51, 51, 0.7);
}

.single-counter {
    text-align: center;
}

.single-counter h2 {
    font-size: 40px;
    color: #d16378;
    line-height: 48px;
    margin-bottom: 11px;
}

.single-counter p {
    font-size: 16px;
    color: #ffffff;
}





/*============================================
* END Counter Area
*=============================================*/


/*============================================
* 1.5 What We Do
*=============================================*/

.what-we-do {}

.section-title {
    text-align: center;
    margin-bottom: 60px;
}

.section-title h2 {
    display: inline-block;
    font-size: 36px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
    border-bottom: 1px solid #999999;
    padding-bottom: 21px;
    position: relative;
}

.section-title h2:before {
    content: '';
    position: absolute;
    left: calc(50% - 20px);
    bottom: -3px;
    width: 40px;
    height: 6px;
    background: #d16378;
}

.whwd-single {
    text-align: center;
    box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.08);
    margin-bottom: 30px;
    padding: 40px 30px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.whwd-single:hover {
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.08);
}

.whwd-single span:before {
    color: #333333;
    font-size: 43px;
    display: block;
    margin-bottom: 20px;
    line-height: 46px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.whwd-single h2 {
    font-size: 19px;
    font-weight: 500;
    color: #333333;
    letter-spacing: 0;
    margin-bottom: 13px;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.whwd-single:hover span:before,
.whwd-single:hover h2 {
    color: #d16378;
}

.whwd-single p {
    color: #666666;
}




/*============================================
* END What We Do
*=============================================*/


/*============================================
* 1.6 Feature Blog
*=============================================*/

.feature-blog {}

.ft-single-blog {}

.blg-thumb {
    display: block;
    overflow: hidden;
}

.blg-thumb a {
    position: relative;
    display: inline-block;
}

.blg-thumb a img {
    max-width: 100%;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.ft-single-blog:hover .blg-thumb a img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.blg-thumb a:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    height: 100%;
    width: 100%;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.ft-single-blog:hover .blg-thumb a:before {
    opacity: 1;
}

.blg-content {
    background-color: #fff;
    padding: 21px 15px 30px 30px;
}

.blg-content h2 a {
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
    line-height: 31px;
}

.blg-content span.blg-meta {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #666666;
    letter-spacing: 0;
    margin-bottom: 14px;
}

.blg-content p {
    color: #666666;
}

.blg-content a.read-more {
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    color: #666666;
    margin-top: 20px;
    letter-spacing: 0;
}

.blg-content h2 a:hover,
.blg-content a.read-more:hover {
    color: #d16378;
}




/*============================================
* END Feature Blog
*=============================================*/


/*============================================
* 1.7 Call To Action
*=============================================*/

.call-to-action {
    padding: 80px 0px;
}

.cta-left h2 {
    font-size: 36px;
    color: #666666;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 52px;
    margin-bottom: 12px;
}

.cta-left p {
    color: #666666;
}

.cta-right .btn-style-one {}




/*============================================
* END Call To Action
*=============================================*/


/*============================================
* 1.8 Footer Top
*=============================================*/

.footer-top {
    padding: 100px 0px;
    background-color: #313131;
    border-bottom: 1px solid #484141;
}

.footer-top  li {line-height: 30px;}

.ftp-single {
    /*text-align: center;*/
    color: #ffffff;
}

.ftp-single  a, .ftp-single  a:link{
    /*text-align: center;*/
    font-size:14px;
    color: #ffffff;
}

.ftp-single  a:hover{
    text-decoration:underline;
    color:#d16378;
}



.ftp-single i {
    color: #fff;
    font-size: 20px;
}

.ftp-single h5 {
    font-size: 18px;
    color: #d16378;
    letter-spacing: 0;
    font-weight: 500;
    margin-top: 7px;
}

.footer-bottom {
    padding: 25px 0px;
    background-color: #313131;
}

.footer-bottom p {
    color: #ffffff;
    font-size: 14px;
}

ul.fsocial {
    text-align: right;
}

ul.fsocial li {
    display: inline-block;
    margin-left: 11px;
}

ul.fsocial li a {
    display: block;
    color: #ffffff;
    font-size: 17px;
}

ul.fsocial li a:hover {
    color: #d16378;
}




/*============================================
* END Footer Top
*=============================================*/


/*============================================
* 2. Home Two
*=============================================*/

.slider-two {
    position: relative;
    z-index: 1;
    text-align: left;
}

.slider-two:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
    background: rgba(0, 0, 0, 0.7);
}

.slider-two .sd-default-content h2 {
    text-transform: uppercase;
    margin-bottom: 22px;
}




/*slider content animation*/

.slider-two .sd-default-content h5,
.slider-parallax .sd-default-content h5,
.slider-two .sd-default-content h2,
.slider-parallax .sd-default-content h2,
.slider-two .sd-default-content p,
.slider-parallax .sd-default-content p,
.slider-two .sd-default-content .btn-style-one,
.slider-parallax .sd-default-content .btn-style-one,
.slider-two .theme-shape-img {
    opacity: 0;
}

.scontent_loaded .sd-default-content h5,
.scontent_loaded .sd-default-content h5 {
    -webkit-animation: fadeinup 500ms ease-in-out 0s forwards;
    -o-animation: fadeinup 500ms ease-in-out 0s forwards;
    animation: fadeinup 500ms ease-in-out 0s forwards;
}

.scontent_loaded .sd-default-content h2,
.scontent_loaded .sd-default-content h2 {
    -webkit-animation: fadeinup 1100ms ease-in-out 0.9s forwards;
    -o-animation: fadeinup 1100ms ease-in-out 0.9s forwards;
    animation: fadeinup 1100ms ease-in-out 0.9s forwards;
}

.scontent_loaded .sd-default-content h5,
.scontent_loaded .sd-default-content h5 {
    -webkit-animation: fadeinup 1100ms ease-in-out 0.7s forwards;
    -o-animation: fadeinup 1100ms ease-in-out 0.7s forwards;
    animation: fadeinup 1100ms ease-in-out 0.7s forwards;
}

.scontent_loaded .sd-default-content p,
.scontent_loaded .sd-default-content p {
    -webkit-animation: fadeinup 1200ms ease-in-out 0.9s forwards;
    -o-animation: fadeinup 1200ms ease-in-out 0.9s forwards;
    animation: fadeinup 1200ms ease-in-out 0.9s forwards;
}

.scontent_loaded .sd-default-content .btn-style-one,
.scontent_loaded .sd-default-content .btn-style-one {
    -webkit-animation: fadeinup 1300ms ease-in-out 1.1s forwards;
    -o-animation: fadeinup 1300ms ease-in-out 1.1s forwards;
    animation: fadeinup 1300ms ease-in-out 1.1s forwards;
}

.scontent_loaded .theme-shape-img {
    -webkit-animation: fadein 1000ms ease-in-out 1.2s forwards;
    -o-animation: fadein 1000ms ease-in-out 1.2s forwards;
    animation: fadein 1000ms ease-in-out 1.2s forwards;
}

@keyframes fadeinup {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40px);
        -ms-transform: translateY(40px);
        -o-transform: translateY(40px);
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.theme-shape-img {
    display: block;
    position: relative;
    padding-left: 20px;
}

.theme-shape-img:before {
    content: '';
    position: absolute;
    left: 0;
    top: -21px;
    height: 350px;
    width: 350px;
    background: rgba(248, 192, 0, 0.4);
    border-radius: 50%;
    z-index: -1;
}

.theme-shape-img img {
    max-width: 100%;
}




/*testimonial-area*/

.testimonial-area {
    position: relative;
    z-index: 1;
}

.testimonial-area:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%;
    width: 100%;
    background-color: rgba(31, 31, 31, 0.86);
}

.testimonial-area .theme-shape-img {
    margin-left: -180px;
}

.testimonial-carousel .icon {
    color: #d16378;
    font-size: 27px;
    margin-bottom: 20px;
}

.testimonial-carousel p {
    font-size: 14px;
    font-weight: 500;
    color: #ffffff;
    line-height: 25px;
}

.tst-meta {
    margin-top: 27px;
}

.tst-meta .meta-left {
    height: 60px;
    width: 60px;
    border-radius: 50%;
    margin-right: 20px;
    overflow: hidden;
}

.tst-meta .meta-content h4 {
    font-size: 18px;
    color: #d16378;
    font-weight: 600;
    letter-spacing: 0;
}

.tst-meta .meta-content span {
    font-size: 14px;
    font-weight: 500;
    color: #ffffff;
    letter-spacing: 0;
}

.testimonial-pagination {
    margin-top: 50px;
}

.testimonial-pagination .swiper-pagination-bullet {
    opacity: 1;
    background-color: #fff;
}

.testimonial-pagination .swiper-pagination-bullet-active {
    background-color: #d16378;
}




/*============================================
* END Home Two
*=============================================*/


/*============================================
* 3. Home Three
*=============================================*/


/* Slider Style Two*/

.swiper-slider-area {
    height: 800px;
    width: 100%;
    background: #000;
    position: relative;
}

.slide-inner {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
}

.swiper-slider-area .swiper-slide {
    overflow: hidden;
}




/*header-transparent*/

.header-transparent {
    background: transparent;
}

.stickey-transparent {
    background: #d16378;
}

.header-transparent .main-menu nav ul li a {
    color: #fff;
}

.header-transparent .main-menu nav ul li:hover>a,
.header-transparent .main-menu nav ul li.active>a {
    color: #d16378;
}

.stickey-transparent .main-menu nav ul li:hover>a,
.stickey-transparent .main-menu nav ul li.active>a {
    color: #444;
}

.header-transparent .main-menu .submenu {
    background: #444;
}

.stickey-transparent .main-menu .submenu {
    background: #d16378;
}





/*slider content animation*/

.swiper-slider-area .sd-default-content h5,
.swiper-slider-area .sd-default-content h2,
.swiper-slider-area .sd-default-content p,
.swiper-slider-area .sd-default-content .btn-style-one,
.swiper-slider-area .theme-shape-img {
    opacity: 0;
}

.swiper-slide-active .sd-default-content h5 {
    -webkit-animation: fadeinup 500ms ease-in-out 0s forwards;
    -o-animation: fadeinup 500ms ease-in-out 0s forwards;
    animation: fadeinup 500ms ease-in-out 0s forwards;
}

.swiper-slide-active .sd-default-content h2 {
    -webkit-animation: fadeinup 1100ms ease-in-out 0.9s forwards;
    -o-animation: fadeinup 1100ms ease-in-out 0.9s forwards;
    animation: fadeinup 1100ms ease-in-out 0.9s forwards;
}

.swiper-slide-active .sd-default-content h5 {
    -webkit-animation: fadeinup 1100ms ease-in-out 0.7s forwards;
    -o-animation: fadeinup 1100ms ease-in-out 0.7s forwards;
    animation: fadeinup 1100ms ease-in-out 0.7s forwards;
}

.swiper-slide-active .sd-default-content p {
    -webkit-animation: fadeinup 1200ms ease-in-out 0.9s forwards;
    -o-animation: fadeinup 1200ms ease-in-out 0.9s forwards;
    animation: fadeinup 1200ms ease-in-out 0.9s forwards;
}

.swiper-slide-active .sd-default-content .btn-style-one {
    -webkit-animation: fadeinup 1300ms ease-in-out 1.1s forwards;
    -o-animation: fadeinup 1300ms ease-in-out 1.1s forwards;
    animation: fadeinup 1300ms ease-in-out 1.1s forwards;
}

.swiper-slide-active .theme-shape-img {
    -webkit-animation: fadein 1000ms ease-in-out 1.2s forwards;
    -o-animation: fadein 1000ms ease-in-out 1.2s forwards;
    animation: fadein 1000ms ease-in-out 1.2s forwards;
}

.swiper-slider-area .swiper-button-white:hover {
    color: #d16378;
}

.swp-btn {
    position: absolute;
    left: 0;
    top: calc(50% - 35px);
    height: 70px;
    width: 50px;
    background: rgba(27, 27, 27, 0.8);
    z-index: 9;
    text-align: center;
    line-height: 70px;
    font-size: 26px;
    color: #d0cece;
}

.swp-btn:hover {
    background: rgba(27, 27, 27, 1);
}

.swp-btn-next {
    left: auto;
    right: 0;
}




/*about-area*/

.about-area ul,
.about-area ol {
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 0;
}

.about-area ul {
    margin: 0 0 0 25px;
    list-style-type: disc;
}

.about-area ol {
    list-style: decimal;
}



.about-area {
    border-bottom: 1px solid #dddddd;
}

.abt-left {
    position: relative;
    z-index: 1;
    text-align: right;
    margin-right: 50px;
}

.abt-left:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 30px;
    z-index: -1;
    max-height: 333px;
    max-width: 333px;
    width: 90%;
    height: 80%;
    background-color: rgba(248, 192, 0, 0.1);
}

.abt-left:after {
    content: '';
    position: absolute;
    left: 30px;
    bottom: 0;
    z-index: -1;
    max-height: 333px;
    max-width: 333px;
    width: 90%;
    height: 80%;
    background-color: rgba(248, 192, 0, 0.3);
}

.abt-left img {
    width: 244px;
    max-width: 100%;
}

.abt-content h5 {
    font-size: 18px;
    color: #333333;
    font-weight: 700;
    letter-spacing: 0;
    position: relative;
    padding-bottom: 16px;
    margin-bottom: 27px;
}

.abt-content h5:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 40px;
    height: 6px;
    z-index: 1;
    background: #d16378;
}

.abt-content h5:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 230px;
    height: 1px;
    background: #999999;
}

.abt-content h2 {
    font-size: 24px;
    color: #333333;
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 23px;
}

.abt-content p {
    font-size: 14px;
    color: #666666;
    font-weight: 500;
    margin-bottom: 19px;
    line-height: 26px;
}

.abt-content .btn-style-one {
    margin-top: 36px;
}




/*full wide portfolio*/

.full-wide .prt_gride {
    margin-bottom: 0;
}




/*whwd-sytle-two*/

.whwd-sytle-two {}

.whwd-sytle-two .meta-left {
    margin-right: 20px;
}

.whwd-sytle-two .meta-content {
    text-align: left;
}

.whwd-sytle-two .whwd-single h2 {
    font-size: 21px;
    margin-bottom: 10px;
}

.whwd-sytle-two .whwd-single:hover {
    background-color: #f9f9f9;
}




/*============================================
* END Home Three
*=============================================*/


/*============================================
* 4. Home Four
*=============================================*/

.slider-parallax {
    z-index: 1;
}

.slider-parallax:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
    background: rgba(0, 0, 0, 0.4);
}

.text-upercase h2 {
    text-transform: uppercase;
}




/*masonary-style-two*/

.masonary-style-two .prt-item:before,
.masonary-style-two .prt-item:after,
.masonary-style-two .hover-info:before,
.masonary-style-two .hover-info:after {
    content: '';
    position: absolute;
    height: 1px;
    width: 80px;
    left: 20px;
    top: 20px;
    z-index: 1;
    background-color: #fff;
    -webkit-transition: all 0.3s ease 0.2s;
    -o-transition: all 0.3s ease 0.2s;
    transition: all 0.3s ease 0.2s;
}

.masonary-style-two .hover-info:before,
.masonary-style-two .hover-info:after {
    left: auto;
    right: 20px;
    top: auto;
    bottom: 100px;
}

.masonary-style-two .prt-item:after,
.masonary-style-two .hover-info:after {
    height: 1px;
    width: 0;
}

.masonary-style-two .prt-item:before,
.masonary-style-two .hover-info:before {
    height: 0;
    width: 1px;
}

.masonary-style-two .prt-item:hover:after,
.masonary-style-two .prt-item:hover .hover-info:after {
    width: 80px;
}

.masonary-style-two .prt-item:hover:before,
.masonary-style-two .prt-item:hover .hover-info:before {
    height: 80px;
}

.masonary-style-two .prt-item h4 {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 23px 0px;
    text-align: center;
    background: #fff;
    color: #333333;
    font-size: 16px;
    letter-spacing: 0;
    opacity: 0;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.05);
    -webkit-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.masonary-style-two .prt-item:hover h4 {
    opacity: 1;
}



/*============================================
* END Home Four
*=============================================*/


/*============================================
* 5. Home Five
*=============================================*/

.slider-full-screen {
    height: 100vh;
    text-align: center;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.offset-menu {
    position: fixed;
    left: -460px;
    top: 0;
    width: 450px;
    z-index: 999;
    height: 100vh;
    overflow: hidden;
    background: url(../img/bg/sidebar-menu-bg.jpg) center center/cover no-repeat;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.offset-menu:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    height: 100%;
    width: 100%;
    background: rgba(21, 18, 18, 0.92);
}

.show-hide-offset-menu {
    left: -18px;
}

.offset-menu-inner {
    position: absolute;
    right: -18px;
    top: 0;
    overflow-y: scroll;
    width: 100%;
    height: 100%;
    z-index: 1;
    padding-bottom: 60px;
}

/*home burger*/
#burger-wrapper {
    width: 100px;
    height: 100px;
    float: right;
    top: 3%;
    right: 3%;
    display: flex;
    position: fixed;
    justify-content: center;
    align-items: center;
    z-index: 9;
}

#burger-circle {
    width: 40px;
    height: 40px;
    border-radius: 32px;
    box-sizing: border-box;
    background-color: #000;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -20px;
    margin-left: -20px;
    cursor: pointer;
    z-index: 1;
    -webkit-transition: background-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
}

.light-content #burger-circle {
    background-color: #fff;
}

#menu-burger {
    width: 14px;
    height: 22px;
    position: relative;
    margin: 0 auto;
    z-index: 2;
    pointer-events: none;
}

.menu-overlay #menu-burger {
    display: block;
}

#menu-burger span {
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    background: #fff;
    opacity: 1;
    right: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.light-content #menu-burger span {
    background: #000;
}

#menu-burger.white span {
    background: #fff;
}

#menu-burger span:nth-child(1) {
    top: 8px;
}

#menu-burger span:nth-child(2) {
    top: 14px;
}

#menu-burger.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 10px;
}

#menu-burger.open span:nth-child(2) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 10px;
}

.body-overlay {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 997;
    opacity: 0;
    visibility: hidden;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    cursor: url(../img/icon/close-cursor.png) 25 25, pointer;
}

.show-hide-overlay {
    opacity: 1;
    visibility: visible;
}

.sidebar-logo {
    padding: 60px 0px;
    text-align: center;
    display: block;
}

.sidebar-logo a {
    display: inline-block;
}

.sidebar-logo a img {
    max-width: 100%;
}

ul.metismenu {
    padding: 0;
}

ul.metismenu li a {
    display: block;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    color: #fff;
    padding: 16px 0px;
    padding-left: 32%;
}

ul.metismenu ul {
    padding-left: 30px;
}

ul.metismenu li.active>a,
ul.metismenu li:hover >a {
    color: #d16378;
}

ul.metismenu>li ul li a {
    padding-left: 35%;
}

.sidebar-social {
    margin-top: 55px;
}

.sidebar-social ul {
    text-align: left;
    padding-left: 30%;
}



/*============================================
* 5. Home Five
*=============================================*/


/*============================================
* 6. About Me
*=============================================*/



.crumbs-area:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.6);
}

.crumbs-content {}

.crumbs-content h2 {
    font-size: 36px;
    font-weight: 700;
    color: #ffffff;
    line-height: 36px;
    margin-bottom: 17px;
}

.crumbs-content ul {}

.crumbs-content ul li,
.crumbs-content ul li a {
    font-size: 16px;
    letter-spacing: 0;
    font-weight: 500;
    display: block;
    color: #fff;
    position: relative;
}

.crumbs-content ul li {
    display: inline-block;
    color: #999999;
    margin-right: 15px;
}

.crumbs-content ul li a:before {
    content: '/';
    position: absolute;
    right: -13px;
    top: 0;
    color: #fff;
}



/*about me*/

.abt-me:before,
.abt-me:after {
    display: none;
}

.abt-skills {
    margin-top: 48px;
}

.skill-progress {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 25px;
}

.skill-progress:last-child {
    margin-bottom: 0;
}

.skill-progress span {
    display: block;
    font-size: 14px;
    color: #333333;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 10px;
}

.progress-h {
    background-color: #ddd;
    height: 10px;
    flex-basis: 100%;
}

.skill-progress .progress-bar {
    width: 100%;
    height: 10px;
    background: #d16378;
    opacity: 0;
    position: relative;
}

.left-anim {
    animation: animate-positive 2s;
    opacity: 1 !important;
}

@keyframes animate-positive {
    0% {
        width: 0%;
    }
}



/*tst-style-two*/

.tst-style-two {
    text-align: center;
}

.tst-style-two .meta-left {
    float: none;
    display: inline-block;
    margin-right: 0;
}

.tst-style-two .meta-content {
    margin-bottom: 20px;
}



/*team-area*/

.member-thumb {
    display: block;
    position: relative;
}

.member-thumb img {
    max-width: 100%;
}

.member-thumb .hover-info {
    position: absolute;
    background-color: rgba(153, 153, 153, 0.8);
    left: 18px;
    top: 18px;
    height: calc(100% - 36px);
    width: calc(100% - 36px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    opacity: 0;
    -webkit-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
}

.single-member:hover .hover-info {
    opacity: 1;
}

.member-thumb .hover-info ul {}

.member-thumb .hover-info ul li {
    display: inline-block;
}

.member-thumb .hover-info ul li a {
    display: block;
    font-size: 24px;
    color: #fff;
    margin: 0px 10px;
}

.member-thumb .hover-info ul li a:hover {
    color: #d16378;
}

.single-member:hover .hover-info ul li a {
    margin: 0px 5px;
}

.member-content {
    text-align: center;
    padding: 30px 0px;
    border-bottom: 1px solid #dddddd;
}

.member-content h2 {
    font-size: 24px;
    color: #333333;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 9px;
}

.member-content span {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
}


/*about us*/

.abt-left-us {
    z-index: 1;
    position: relative;
}

.abt-left-us:before {
    content: '';
    position: absolute;
    left: -30px;
    top: -30px;
    height: 100%;
    width: 100%;
    z-index: -1;
    background-color: #eeeeee;
}


/*============================================
* END About Me
*=============================================*/


/*============================================
* 7. Portfolio
*=============================================*/

.portfolio-single {
    padding: 100px 0px;
}

.portfolio-slider {
    margin-right: 6px;
}

.portfolio-slider .swiper-slide img {}

.prts-btn {
    position: absolute;
    left: 10px;
    top: calc(50% - 20px);
    height: 40px;
    width: 45px;
    background: #fff;
    z-index: 9;
    text-align: center;
    line-height: 40px;
    font-size: 22px;
    color: #222;
    border-radius: 2px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.prts-btn:hover {
    background-color: #d16378;
}

.prts-btn-next {
    left: auto;
    right: 10px;
}

.portfolio-right-content h2 {
    font-size: 30px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
    line-height: 35px;
    margin-bottom: 37px;
}

.portfolio-right-content p {
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    line-height: 26px;
    margin-bottom: 25px;
}

.project-details {
    display: inline-block;
    border: 2px solid #dddddd;
    padding: 44px 30px 29px;
    width: 350px;
    max-width: 100%;
}

.project-details h5 {
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
    margin-bottom: 20px;
}

.project-details ul li {
    font-size: 14px;
    color: #666666;
    letter-spacing: 0;
    font-weight: 500;
    display: block;
    padding-top: 17px;
    margin-bottom: 18px;
}

.project-details ul li+li {
    border-top: 1px solid #dddddd;
}

.project-details ul li span {
    float: right;
}



/*============================================
* END Portfolio
*=============================================*/


/*============================================
* 8. Blog
*=============================================*/

.blog-area {
    padding: 100px 0px;
    background-color: #f9f9f9;
}

.blog-area .ft-single-blog {
    margin-bottom: 30px;
}

.footer-top.bg-gray {
    background-color: #f9f9f9;
}

.pagination-wrapper {
    margin-top: 20px;
}

.pagination-wrapper ul {
    text-align: center;
}

.pagination-wrapper ul li {
    display: inline-block;
}

.pagination-wrapper ul li a,
.pagination-wrapper ul li span {
    display: block;
    height: 40px;
    width: 40px;
    border: 1px solid #ddd;
    text-align: center;
    line-height: 40px;
    color: #223;
}

.pagination-wrapper ul li span,
.pagination-wrapper ul li a:hover,
.pagination-wrapper ul li span:hover {
    background-color: #ddd;
}

.widget_sidebar {}

.widget {
    margin-bottom: 50px;
}

.widget:last-child {
    margin-bottom: 0;
}

.widget_search form {
    position: relative;
}

.widget_search form input {
    height: 45px;
    width: 100%;
    border: 1px solid #ddd;
    padding-left: 20px;
    padding-right: 45px;
    background: #fff;
    letter-spacing: 0;
}

.widget_search form button {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 45px;
    border: none;
    background-color: #d16378;
}

h2.widget_title {
    font-size: 24px;
    color: #333333;
    font-weight: 700;
    letter-spacing: 0;
    position: relative;
    padding-bottom: 16px;
    margin-bottom: 34px;
}

h2.widget_title:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 40px;
    height: 6px;
    z-index: 1;
    background: #d16378;
}

h2.widget_title:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 230px;
    height: 1px;
    background: #b7b7b7;
}

.widget_category ul li {
    display: block;
}

.widget_category ul li a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    border-bottom: 1px solid #b7b7b7;
    letter-spacing: 0;
    line-height: 20px;
    margin: 13px 0px;
    padding-bottom: 13px;
    position: relative;
    padding-left: 18px;
}

.widget_category ul li a:first-child {
    margin-top: 0;
}

.widget_category ul li a:before {
    content: '\f0da';
    position: absolute;
    left: 0;
    top: 0;
    font-family: fontawesome;
}

.widget_category ul li a:hover {
    color: #d16378;
}

.widget_category ul li a span {
    float: right;
}

.rcp_post_ist {}

.rcp_single {
    overflow: hidden;
    margin-bottom: 20px;
}

.rcp_single:last-child {
    margin-bottom: 0;
}

.rcp_thumb {
    float: left;
    margin-right: 20px;
}

.rcp_thumb img {
    max-width: 70px;
}

.rcp_content {
    overflow: hidden;
    margin-top: -7px;
}

.rcp_content h2 a {
    display: block;
    font-size: 14px;
    color: #333333;
    letter-spacing: 0;
    font-weight: 600;
}

.rcp_content h2 a:hover {
    color: #d16378;
}

.rcp_content span {
    font-size: 14px;
    font-weight: 500;
    color: #999999;
    letter-spacing: 0;
}

.widget_tags {}

.widget_tags ul li {
    display: inline-block;
}

.widget_tags ul li a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    letter-spacing: 0;
    border: 1px solid #333333;
    padding: 8px 13px;
    border-radius: 3px;
    margin-bottom: 10px;
    margin-right: 3px;
}

.widget_tags ul li a:hover {
    background-color: #333333;
    color: #fff;
}


/*============================================
* END Blog
*=============================================*/


/*============================================
* 9. Blog Details
*=============================================*/

.blog-details .blg-content {
    padding-left: 0;
}

.blog-top-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.meta-title {
    flex-basis: 70%;
}

.meta-title h2 a {
    font-weight: 700;
}

.meta-share {
    flex-basis: 30%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.meta-share span {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    letter-spacing: 0;
}

.meta-share ul li {
    display: inline-block;
}

.meta-share ul li a {
    display: block;
    color: #333;
    font-size: 15px;
    margin-left: 8px;
}

.meta-share ul li a:hover {
    color: #d16378;
}

.blog-details p {
    font-weight: 500;
    margin-bottom: 17px;
}

.blog-details blockquote {
    border: 1px solid #ddd;
    padding: 30px;
    border-left: 30px solid #d16378;
    margin: 30px 0px;
    margin-left: 50px;
}

.blog-details blockquote p {
    margin-bottom: 0;
}

.blog-details blockquote p i {
    font-size: 20px;
    margin-left: 7px;
}

.comment-area {
    overflow: hidden;
    margin-bottom: 22px;
}

h4.comment-title {
    font-size: 18px;
    font-weight: 700;
    color: #333333;
    letter-spacing: 0;
    position: relative;
    margin-bottom: 30px;
    padding-bottom: 13px;
}

h4.comment-title:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 70px;
    background-color: #999999;
}

.comment-info-inner article {
    overflow: hidden;
    border-bottom: 1px solid #e1e1e1;
    padding-bottom: 30px;
    margin-bottom: 30px;
}

.comment-thumb {
    float: left;
}

.comment-thumb img {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    margin-right: 20px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
}

.comment-content {
    overflow-x: hidden;
}

.comment-content .meta-data {}

.comment-content .meta-data h2 {
    font-size: 18px;
    color: #333333;
    font-weight: 600;
    letter-spacing: 0;
    margin-bottom: 5px;
}

.comment-content .meta-data span {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #999999;
    letter-spacing: 0;
    margin-bottom: 8px;
}

.comment-content p {
    font-size: 14px;
    font-weight: 500;
    color: #333333;
    letter-spacing: 0;
    line-height: 23px;
}

.comment-content a {
    margin-top: 12px;
    display: inline-block;
    color: #999999;
    letter-spacing: 0;
    font-weight: 600;
    font-size: 14px;
}

.comment-content a:hover {
    color: #d16378;
}

.children {
    padding-left: 60px;
}


/*leave-comment-area*/

.leave-comment-area form input,
.leave-comment-area form textarea {
    width: 100%;
    height: 50px;
    margin-bottom: 20px;
    border: 1px solid #999999;
    padding-left: 20px;
    letter-spacing: 0;
    font-weight: 500;
    /*text-transform: capitalize;*/
}

.leave-comment-area form textarea {
    height: 120px;
    padding-top: 12px;
}

.leave-comment-area form #c_submit {
    max-width: 120px;
    background-color: #999999;
    text-align: center;
    padding-left: 0;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.leave-comment-area form #c_submit:hover {
    background-color: transparent;
    color: #999999;
}


/*============================================
* END Blog Details
*=============================================*/

/*============================================
* 10. Contact Area
*=============================================*/

#google_map{
    height: 500px;
}

.contact-area{
    padding: 100px 0px;
}
.contact-info h4{
        font-size: 18px;
    font-weight: 700;
    color: #333333;
    letter-spacing: 0;
    position: relative;
    margin-bottom: 30px;
    padding-bottom: 20px;
    text-align: center;
}
.contact-info ul{
    text-align: center;
    padding: 20px 0px;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.08);
    margin-top: 24px;
}
.contact-info ul li{
    display: block;
    font-size: 14px;
    color: #333333;
    letter-spacing: 0;
    font-weight: 600;
    line-height: 25px;
}
.contact-info ul li i{
        font-size: 28px;
    margin-bottom: 10px;
}
.cnt-subtitle{
    font-size: 14px;
    font-weight: 600;
    color: #666666;
    letter-spacing: 0;
    margin-bottom: 35px;
    max-width: 100%;
    width: 600px;
}

/*============================================
* END Contact Area
*=============================================*/

/*============================================
* 11. 404
*=============================================*/
.error-area{
    padding: 100px 0px;
}
.error-inner{
    text-align: center;
}
.error-inner img{
    max-width: 100%;
}
.error-inner h4{
        font-size: 30px;
    font-weight: 600;
    letter-spacing: 0;
    color: #333333;
    margin: 50px 0px 60px;
}
.error-inner a{
    display: inline-block;
    color: #ffffff;
    background: #d16378;
    padding: 10px 21px;
    letter-spacing: 0;
    font-size: 14px;
    font-weight: 500;
}
.error-inner a:hover{
    background-color: #222;
}

/*============================================
* END 404
*=============================================*/

.accordion-box{
    position:relative;
}

.accordion-box .block {
    margin-bottom: 25px;
    position: relative;
}

.accordion-box .block .acc-btn{
    border: 1px solid #852d49;
    color:#1c1c1c;
    cursor:pointer;
    font-size:16px;
    padding: 12px;
    position:relative;
}

.accordion-box .block .acc-btn.active{
    border-bottom: 1px solid #ef173c;
    border-color: #ef173c;
    color:#1c1c1c;
    padding-bottom: 10px;
}

.accordion-box .block .icon-outer {
    font-size: 12px;
    position: absolute;
    right: 15px;
    top: -10px;
}

.accordion-box .block .icon-outer .icon {
    color: #ef173c;
    line-height: 52px;
    position: absolute;
    top: 8px;
    right: 0px;
    transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -webkit-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;   
}

.accordion-box .block .icon-outer .icon-plus{
    opacity:0;
}

.accordion-box .block .icon-outer .icon-plus{
    opacity:1;
}

.accordion-box .block .active .icon-outer .icon-minus{
    opacity:1;
}

.accordion-box .block .active .icon-outer .icon-plus{
    opacity:0;
}

.accordion-box .block .acc-content{
    position:relative;
    display:none;   
}

.accordion-box .block .acc-content.current{
    display:block;  
}

.accordion-box .block .content{
    border: 1px solid #ef173c;
    border-top: none;
    color: #808080;
    font-size:13px;
    padding: 7px 12px 8px;
    position:relative;
}

/*Accordion Style Two*/

.accordion-box.style-two .block .acc-btn {
    font-size: 20px;
}

.accordion-box.style-two .block .content {
    font-size: 14px;
}



/*------------------------------------------------------------------
    accordions
-------------------------------------------------------------------*/
.accordion > dt {
    margin-bottom: 10px;
    letter-spacing: .2em; 
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 400;
}

.accordion.time-line > dt > a {
    background: none;
}

.accordion > dt > a {
    position: relative;
    display: block;
    padding: 14px 20px;
    text-decoration: none;
    /*font-family: 'Abel', sans-serif;*/
    letter-spacing: 2px; 
    color: #222;
    border: 1px solid #e8e8e8;
    background: #e8e8e8;
}

.accordion > dt > a:hover {
    text-decoration: none;
}

.accordion > dt > a:hover,
.accordion > dt > a.active {
    cursor: pointer; 
    color: #fff;
    border-color: #222;
    background: #222;
}

.accordion > dt > a:after {
    position: absolute;
    top: 50%;
    right: 10px;
    width: 15px;
    height: 15px;
    margin-top: -8px;
    content: "\e648";
    text-align: center;
    text-transform: none;
    color: #696969;
    font-family: "icomoon";
    font-size: 16px;
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    line-height: 15px;

    -webkit-font-smoothing: antialiased; 
    speak: none;
}

.accordion > dt > a.active:after,
.accordion > dt > a.active:hover:after {
    content: "\e641";
    color: #fff;
}

.accordion > dt > a:hover:after {
    color: #fff;
}

.accordion > dd {
    margin-bottom: 10px;
    padding: 10px 20px 20px;
    color: #777; 
    font-size: 14px;
    line-height: 1.8;
}

.accordion > dt > a,
.accordion > dt > a:after,
.toggle > dt > a,
.toggle > dt > a:after {
    -webkit-transition: all .27s cubic-bezier(0, 0, .58, 1);
            transition: all .27s cubic-bezier(0, 0, .58, 1);
}

/*------------------------------------------------------------------
    timeline accordions
-------------------------------------------------------------------*/
dl.accordion.time-line {
    position: relative;
}

dl.accordion.time-line:before {
    position: absolute;
    z-index: 0; 
    top: 25px;
    bottom: 10px;
    left: 15px;
    content: "";
    border-left: 1px dashed #cecece;
}

.accordion.time-line > dd {
    margin-bottom: 10px;
    padding: 10px 20px 20px 40px;
    color: #777; 
    font-size: 14px;
    line-height: 1.8;
}

.accordion.time-line > dt > a:after {
    position: absolute;
    top: 50%;
    left: 0;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    padding-left: 3px; 
    content: "\e648";
    text-align: center;
    text-transform: none;
    color: #fff;
    background: #222;
    font-family: "icomoon";
    font-size: 20px;
    font-weight: bold;
    font-style: normal;
    font-variant: normal;
    line-height: 30px;

    -webkit-font-smoothing: antialiased;
    speak: none;
}

.accordion.time-line > dt > a.active:after,
.accordion.time-line > dt > a.active:hover:after {
    content: "\e641";
    color: #fff;
}

.accordion.time-line > dt > a {
    position: relative;
    display: block;
    padding: 14px 20px 14px 40px;
    text-decoration: none;
    /*font-family: 'Abel', sans-serif;*/
    letter-spacing: 2px; 
    color: #222;
    border: none;
}

.accordion.time-line > dt > a:hover,
.accordion.time-line > dt > a.active {
    background: none !important;
}