.breadcrumb{
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    padding:0px;
    margin-bottom:0px;
    background:none;
    border-radius:0px
}
.breadcrumb-item{
    text-transform:capitalize
}
.breadcrumb-item a{
    color:#fff;
    text-transform:capitalize;
    text-shadow:2px 3px 8px rgba(0,0,0,0.1)
}
.breadcrumb-item a:hover{
    text-decoration:underline
}
.breadcrumb-item.active{
    color:#fff;
    text-shadow:2px 3px 8px rgba(0,0,0,0.1)
}
.breadcrumb-item+.breadcrumb-item::before{
    color:var(--white)
}
.form-group{
    margin:0px 50px 50px;
    position:relative
}
.form-group:focus-within input,.form-group:focus-within textarea{
    border-bottom:2px dashed var(--primary)
}
.form-group:focus-within i{
    background:var(--primary-gdnt);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent
}
.form-group input,.form-group textarea{
    width:100%;
    border:none;
    outline:none;
    background:none;
    border-bottom:2px dashed #bbb
}
.form-group input::-webkit-input-placeholder,.form-group textarea::-webkit-input-placeholder{
    font-size:14px;
    font-weight:500;
    font-style:italic;
    text-transform:uppercase
}
.form-group input:-ms-input-placeholder,.form-group textarea:-ms-input-placeholder{
    font-size:14px;
    font-weight:500;
    font-style:italic;
    text-transform:uppercase
}
.form-group input::-ms-input-placeholder,.form-group textarea::-ms-input-placeholder{
    font-size:14px;
    font-weight:500;
    font-style:italic;
    text-transform:uppercase
}
.form-group input::placeholder,.form-group textarea::placeholder{
    font-size:14px;
    font-weight:500;
    font-style:italic;
    text-transform:uppercase
}
.form-group input{
    height:60px
}
.form-group textarea{
    height:180px;
    padding-top:14px
}
.form-group i{
    position:absolute;
    top:21px;
    right:0px;
    font-size:14px;
    color:#777777
}
.form-btn{
    text-align:center
}
@media (max-width: 767px){
    .form-group{
        margin:0px 0px 30px
    }
}
.single-banner{
    background:url(../../img/single-banner.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    padding:155px 0px 90px
}
.single-content{
    text-align:center
}
.single-content h2{
    font-size:38px;
    margin-bottom:10px;
    color:#fff;
    text-shadow:2px 3px 8px rgba(0,0,0,0.1)
}
@media (max-width: 991px){
    .single-banner{
        padding:80px 0px
    }
    .single-content h2{
        font-size:38px
    }
}
.blog-det-part{
    padding:10px 0px
}
.blog-det-part .container{
    max-width:1000px
}
.blog-det-banner{
    position:relative;
    border-radius:10px;
    margin-bottom:50px;
    -webkit-box-shadow:0px 15px 20px 0px rgba(0,0,0,0.25);
    box-shadow:0px 15px 20px 0px rgba(0,0,0,0.25)
}
.blog-det-banner::before{
    position:absolute;
    content:"";
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border-radius:10px;
    background:-webkit-gradient(linear, left top, left bottom, from(rgba(128,0,255,0.1)), to(rgba(0,0,0,0.8)));
    background:linear-gradient(to bottom, rgba(128,0,255,0.1), rgba(0,0,0,0.8))
}
.blog-det-banner img{
    width:100%;
    border-radius:10px
}
.blog-det-content{
    position:absolute;
    bottom:50px;
    left:30px;
    padding:0px 30px
}
.blog-det-title{
    margin-bottom:20px
}
.blog-det-title h2 a{
    color:var(--white)
}
.blog-det-meta{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start
}
.blog-det-meta li{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    padding:0px 18px;
    border-right:1px solid var(--text)
}
.blog-det-meta li:first-child{
    padding-left:0px
}
.blog-det-meta li:last-child{
    padding-right:0px;
    border-right:none
}
.blog-det-meta li i{
    font-size:14px;
    margin-right:8px;
    margin-top:-2px;
    color:var(--white)
}
.blog-det-meta li p{
    font-size:14px;
    color:var(--light-white);
    text-transform:uppercase
}
.content-fluid{
    padding:0px 80px
}
.blog-det-descrip p{
    margin-bottom:35px
}
.blog-det-descrip p span{
    display:block;
    margin-top:25px
}
.blog-det-subtitle{
    margin-bottom:35px
}
.blog-det-subtitle h3{
    margin-bottom:15px
}
.blog-det-subtitle p a{
    text-decoration:underline
}
.blog-det-quote{
    padding:50px 50px;
    background:var(--light-white);
    border-left:5px solid var(--primary);
    margin-bottom:45px;
    border-radius:10px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column
}
.blog-det-quote p{
    font-size:22px;
    font-style:italic;
    line-height:35px;
    margin-bottom:35px
}
.blog-det-quote span{
    font-weight:500;
    -ms-flex-item-align:end;
    align-self:flex-end;
    text-transform:capitalize
}
.blog-det-list{
    list-style:disc;
    margin-left:20px;
    padding-bottom:50px;
    border-bottom:1px solid var(--border)
}
.blog-det-list li{
    margin-bottom:30px
}
.blog-det-list li:last-child{
    margin-bottom:0px
}
.blog-det-footer{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    margin:45px 0px
}
.blog-det-tag{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start
}
.blog-det-tag li{
    margin-right:8px
}
.blog-det-tag li h4{
    font-weight:700;
    margin-right:5px
}
.blog-det-tag li a{
    color:var(--text);
    font-size:14px;
    padding:2px 16px;
    border-radius:30px;
    text-transform:capitalize;
    border:1px solid var(--border)
}
.blog-det-tag li a:hover{
    color:var(--white);
    background:var(--primary-gdnt)
}
.blog-det-share{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start
}
.blog-det-share li{
    margin-right:8px
}
.blog-det-share li h4{
    font-weight:700;
    margin-right:5px
}
.blog-det-share li a i{
    width:40px;
    height:40px;
    font-size:14px;
    line-height:40px;
    text-align:center;
    border-radius:50%;
    color:var(--primary);
    background:var(--light-white);
    text-shadow:2px 3px 8px rgba(0,0,0,0.1)
}
.blog-det-share li a i:hover{
    color:var(--white);
    background:var(--primary-gdnt)
}
.blog-det-author{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:start;
    -ms-flex-align:start;
    align-items:flex-start;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:start;
    padding:45px 45px;
    margin-bottom:50px;
    border-radius:10px;
    background:var(--light-white)
}
.author-img{
    margin-right:30px
}
.author-img a img{
    width:100px;
    border-radius:5px
}
.author-social{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    margin-top:15px
}
.author-social li{
    margin:0px 3px
}
.author-social li a i{
    width:30px;
    height:30px;
    font-size:12px;
    line-height:30px;
    text-align:center;
    border-radius:50%;
    color:var(--primary);
    background:var(--white);
    text-shadow:2px 3px 8px rgba(0,0,0,0.1)
}
.author-social li a i:hover{
    color:var(--white);
    background:var(--primary-gdnt)
}
.author-content h4{
    margin-bottom:10px
}
.author-content h4 a{
    display:block;
    font-size:14px;
    color:var(--primary);
    transition:all linear .3s;
    -webkit-transition:all linear .3s;
    -moz-transition:all linear .3s;
    -ms-transition:all linear .3s;
    -o-transition:all linear .3s
}
.author-content h4 a:hover{
    color:var(--secondary);
    text-decoration:underline
}
.blog-det-navigate{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-pack:space-evenly;
    -ms-flex-pack:space-evenly;
    justify-content:space-evenly;
    margin-bottom:60px;
    position:relative
}
.navigate-post{
    width:400px;
    border-radius:10px;
    position:relative;
    -webkit-box-shadow:0px 15px 20px 0px rgba(0,0,0,0.25);
    box-shadow:0px 15px 20px 0px rgba(0,0,0,0.25)
}
.navigate-post::before{
    position:absolute;
    content:"";
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border-radius:10px;
    background:-webkit-gradient(linear, left top, left bottom, from(rgba(128,0,255,0.1)), to(rgba(0,0,0,0.8)));
    background:linear-gradient(to bottom, rgba(128,0,255,0.1), rgba(0,0,0,0.8))
}
.navigate-post img{
    width:100%;
    border-radius:10px
}
.navigate-post h4{
    position:absolute;
    bottom:25px;
    left:0px;
    padding:0px 30px;
    line-height:28px
}
.navigate-post h4 a{
    color:var(--white)
}
.prev-arrow,.next-arrow{
    position:absolute;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
    font-size:14px;
    text-transform:capitalize;
    border-radius:5px;
    padding:9px 20px;
    color:var(--text);
    background:var(--white);
    -webkit-box-shadow:0px 10px 25px 0px rgba(0,0,0,0.15);
    box-shadow:0px 10px 25px 0px rgba(0,0,0,0.15)
}
.prev-arrow:hover,.next-arrow:hover{
    color:var(--white);
    background:var(--primary)
}
.prev-arrow{
    left:0px
}
.prev-arrow i{
    margin-right:8px
}
.next-arrow{
    right:0px
}
.next-arrow i{
    margin-left:8px
}
.blog-det-comment{
    margin-bottom:30px
}
.blog-det-comment h3{
    margin-bottom:30px
}
.comment-list li ul{
    margin-left:100px
}
.comment{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    padding:45px 0px;
    border-top:1px solid var(--border);
    position:relative
}
.comment-img{
    margin-right:30px
}
.comment-img a img{
    width:100px;
    border-radius:5px
}
.comment-content h4{
    font-weight:600;
    margin-bottom:10px
}
.comment-content h4 span{
    font-size:14px;
    font-weight:500;
    display:block
}
.comment-reply{
    position:absolute;
    top:25px;
    right:15px
}
.comment-reply a{
    font-size:16px;
    font-weight:600;
    color:var(--text);
    text-transform:capitalize
}
.comment-reply a:hover{
    color:var(--primary)
}
.comment-reply a i{
    margin-right:8px
}
.blog-det-form h3{
    margin-bottom:30px
}
@media (max-width: 767px){
    .blog-det-part{
        padding:60px 0px
    }
    .blog-det-banner{
        -webkit-box-shadow:none;
        box-shadow:none;
        border-radius:0px;
        margin-bottom:30px
    }
    .blog-det-banner::before{
        display:none
    }
    .blog-det-banner img{
        margin-bottom:30px;
        -webkit-box-shadow:0px 10px 15px 0px rgba(0,0,0,0.25);
        box-shadow:0px 10px 15px 0px rgba(0,0,0,0.25)
    }
    .blog-det-content{
        position:inherit;
        left:0px;
        bottom:0px;
        padding:0px
    }
    .blog-det-title{
        margin-bottom:15px
    }
    .blog-det-title h2{
        font-size:28px;
        line-height:36px
    }
    .blog-det-title h2 a{
        color:var(--heading)
    }
    .blog-det-meta{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap
    }
    .blog-det-meta li{
        border:none;
        padding:2px 7px
    }
    .blog-det-meta li p,.blog-det-meta li i{
        color:var(--text);
        font-size:13px
    }
    .content-fluid{
        padding:0px
    }
    .blog-det-quote{
        padding:35px 30px
    }
    .blog-det-quote p{
        font-size:18px
    }
    .blog-det-list{
        padding-bottom:30px
    }
    .blog-det-footer{
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        margin:35px 0px
    }
    .blog-det-tag{
        margin-bottom:25px
    }
    .blog-det-author{
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        padding:35px
    }
    .author-img{
        margin:0px 0px 15px
    }
    .blog-det-navigate{
        -webkit-box-orient:vertical;
        -webkit-box-direction:reverse;
        -ms-flex-direction:column-reverse;
        flex-direction:column-reverse
    }
    .navigate-post{
        width:100%;
        margin-bottom:30px
    }
    .navigate-post h4{
        bottom:20px;
        padding:0px 25px;
        line-height:28px
    }
    .next-arrow{
        top:0px
    }
    .prev-arrow{
        top:inherit;
        bottom:-15px
    }
    .comment{
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column;
        padding:30px 0px
    }
    .comment-img{
        margin:0px 0px 15px
    }
    .comment-content h4{
        margin-bottom:5px
    }
    .comment-reply{
        top:45px
    }
    .comment-list li ul{
        margin-left:60px
    }
}
@media (min-width: 431px) and (max-width: 767px){
    .blog-det-navigate{
        width:400px;
        margin:0 auto 50px
    }
}
@media (min-width: 768px) and (max-width: 991px){
    .blog-det-part{
        padding:80px 0px
    }
    .navigate-post{
        width:320px
    }
    .prev-arrow,.next-arrow{
        top:0%
    }
}
 