@import url(//fonts.googleapis.com/earlyaccess/notosansbengali.css);
@import url(//fonts.googleapis.com/earlyaccess/notosansbengaliui.css);
@import url('https://fonts.maateen.me/bangla/font.css');

body {
    margin: 20px 0;
    /*font-family: 'Kalpurush', sans-serif;
    font-family: 'Noto Sans Bengali', sans-serif; 
    font-family: 'Noto Sans Bengali UI', sans-serif;
    font-family: 'Bangla', sans-serif;*/
    color: #000;
    font-family: 'Kalpurush', sans-serif;
}

/*######### customization ##############*/
section {
    padding: 20px 0;
    margin-bottom: 20px;
    border-bottom: 3px solid #000;
}

.sidebar section {
    padding: 0px 0;
}

.container {
    border: 1px solid #000;
    padding: 20px;
    max-width: 1300px;
}

a {
    font-family: 'Kalpurush', sans-serif;
    text-decoration: none;
    color: #666;
}

a:hover {
    color: #000;
    text-decoration: none;
}

.read-more {}

.read-more a {
    color: #DF928E;
    padding: 3px 8px;
    border: 2px solid #DF928E;
}

.read-more a:hover {
    color: #444;
    border: 2px solid #444;
}

.card,
.card-footer {
    border-radius: 0 !important;
}

.card-meta {
    display: inline-block;
}

.card-img-top{
    border-radius: 0px ;
}
.card blockquote {
    margin: 0 0 5px;
}
.card footer{
    border-top: 1px solid #e6e6e6;
    background: #fff;
    padding: 5px 0 0 0;
}

/* ========================================
                Selection
===========================================*/
::-moz-selection {
    /* Code for Firefox */
    color: #fff;
    background: #e35252;
}

::selection {
    color: #fff;
    background: #e35252;
}

/* ========================================
                viewport 
===========================================*/

.max-viewport {
    min-height: 100vh;
}

.viewport-80 {
    min-height: 80vh;
}

.viewport-60 {
    min-height: 60vh;
}

.viewport-50 {
    min-height: 50vh;
}

/*######### rong ##############*/
.mukhyo {
    color: #000;
}

.bg-mukhyo {
    background: #000;
}

.barta {
    color: #939599;
}

.bg-barta {
    background: #939599;
}

.halka {
    color: #4a5568;
}

.bg-halka {
    background: #4a5568;
}

.halka {
    color: #a0aec0;
}

.bg-halka {
    background: #a0aec0;
}

.meta {
    color: #000;
    ;
}

.bg-meta {
    background: #787972;
}

.poripurok {
    color: #e35252;
}

.bg-poripurok {
    background: #e35252;
}

.ujjol {
    color: #e35252;
}

.bg-ujjol {
    background: #e35252;
}

.card-title a,
.post-title a {
    color: #000;
}

.card-title a:hover,
.post-title a:hover {
    color: #666;
}

.card-body p a,
.post-content p a {
    color: #e35252;
}

.card-body p a:hover,
.post-content p a:hover {
    color: #000;
}


/*######### typography ##############*/
h1,
h2,
h3,
h4 {}

h1 {
    font-size: 3rem;
}

h2 {
    font-size: 2rem;
}

p {}



/*######### section-title ##############*/
.section-title {
    margin-bottom: 20px;
}

.section-title h3 {
    font-size: 5rem;
    /*font-weight: bold;*/
    border-bottom: 1px solid #000;
}

/*######### /section-title ##############*/

/*######### navbar ##############*/

.navbar {
    background: #fff;
    padding: 0px;
    transition: padding 2s ease;
    color: #000;
}

.fixed-top.container {
    border: none;
    margin-top: 1px;
    padding: 5px 20px;
    background: rgba(255, 255, 255, 0.96);
}

.navbar-background {
    padding: 5px 20px;
}

.navbar ul {
    border-bottom: 1px solid #000;
}

.navbar-brand {
    color: #000;
    font-size: 30px;
    transition: all 2s;
}

.navbar-brand:hover {
    background: #000;
    color: #fff;
}

.navbar-toggler {
    border: 3px solid #000;
    padding: 3px;
}

.bar1,
.bar2,
.bar3 {
    width: 23px;
    height: 3px;
    margin: 5px;
    background: #000;
    transition: all 0.5s ease;
}

.change .bar1 {
    transform: rotate(-45deg) translate(-5px, 6px);
}

.change .bar2 {
    opacity: 0;
}

.change .bar3 {
    transform: rotate(45deg) translate(-5px, -8px);
}

.nav-link {
    color: #000;
    font-size: 20px;
    padding: 5px 10px !important;
    border-radius: 0px;
    transition: background 2s ease;
}

.nav-link:hover {
    background: #000;
    color: #fff;

}

.nav-active {
    color: #fff;
    font-size: 20px;
    padding: 5px 10px !important;
    border-radius: 0px;
    background: #000;
    transition: background 2s ease;
}

.nav-active:hover {
    background: #000;
}

/*######### /navbar ##############*/


/*######### brand ##############*/
.brand {
    border-top: 3px solid #000;
    border-bottom: 3px solid #000;
    padding: 0px 0;
    font-size: 7rem;
    margin: 10px 0 0;
}

/*######### /brand ##############*/


/*######### icon ##############*/

.icon {
    /*background: #fff;*/
    color: #000;
    font-size: 25px;
    box-sizing: border-box;
}

.icon a {
    color: #000;
    transition: color 1s ease;
}

.icon a:hover {
    color: #e6e6e6;
    padding: 0;
}

/*######### /icon-top ##############*/

/*######### search-btn ##############*/
.search-btn {
    background: #000;
    transition: all 1s ease;
    color: #fff;
}

.search-btn:hover {
    color: #000;
    background: #fff;
    border: 1px solid #e6e6e6;
}

/*######### /search-btn ##############*/



/* ========================================
                large-blog-post
===========================================*/
.large-blog-post .card {
    background: #ffffff;
    border-radius: 0;
    border: 0;
}

.large-blog-post .card .img-container,
.large-blog-post .card .img-container img {
    position: relative;
    border-radius: 0;
}

.large-blog-post .img-text {
    position: absolute;
    bottom: 0%;
    left: 0%;
    padding: 5px;
    visibility: visible;
    background: #fff;
}

.large-blog-post .img-container:hover .img-text {
    /*visibility: visible;*/
}

.large-blog-post .card-title a {
    font-size: 4rem;
    margin-bottom: 8px;
    display: block;
}

.large-blog-post .card-body {
    padding: 10px 5px;
    font-size: 1.5rem;
}

.large-blog-post .card-body .text {
    color: #000;
}

.large-blog-post .card-meta {
    display: inline-block;
}

.large-blog-post .card-footer {
    margin-top: 0;
    background: #333;
}

#featured-news .large-blog-post .card-footer a {
    text-decoration: none;
    color: #f5f3f5;
}

.large-blog-post hr {
    margin-top: 0px;
    margin-bottom: 5px;
}

/* ========================================
            thumb-blog-post
===========================================*/
.thumb-blog-post {

    position: relative;
    z-index: 1;
    border-bottom: 1px solid #000;
    padding-bottom: 20px;
    margin-bottom: 20px;

}

.thumb-blog-post:last-child {
    border-bottom: none;
    margin-bottom: 0px;
}

.thumb-blog-post .post-thumbnail {
    position: relative;
    z-index: 1;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33%;
    flex: 0 0 33%;
    max-width: 33%;
    width: 33%;
    margin: 0 3% 0 0;
}

.thumb-blog-post.reverse .post-thumbnail {
    margin: 0 0 0 3%;
}

.thumb-blog-post .post-thumbnail img {
    width: 100%;
}

.thumb-blog-post .post-content {
    padding-left: 0px;
    margin-top: -5px;
}

.thumb-blog-post .post-content .post-title h1 {
    font-size: 2rem;
    margin-bottom: 8px;
    display: block;
}

.thumb-blog-post .post-content p {
    margin-bottom: 5px;
}

.thumb-blog-post .post-content .post-meta p {
    display: inline-block;
    color: #666;
}



/* ========================================
                mid-blog-post 
===========================================*/
.mid-blog-post .card {
    border: none;
    margin-bottom: 10px;
}

.mid-blog-post .img-container {
    background: rgba(0, 0, 0, 0.98);
    position: relative;
    overflow: hidden;
    /*height: 100%;*/
}

.mid-blog-post img {
    transition: transform 4s ease-in-out;
    border-radius: 0;
}

.mid-blog-post .img-text {
    position: absolute;
    bottom: 0%;
    right: 0%;
    padding: 5px;
    visibility: visible;
    background: #000;
    color: #fff;
}

.mid-blog-post .img-container:hover .img-text {
    visibility: visible;
}

.mid-blog-post .card-body {
    font-size: 18px;
    padding: 0px 5px;
}

.mid-blog-post .card-title {
    margin-top: 10px;
    margin-bottom: 0px;
}

.mid-blog-post .card-title a h1,
.mid-blog-post .card-title a h2 {
    margin-bottom: 0px;
    font-size: 2rem;
}

.mid-blog-post .card-meta p {
    display: inline-block;
    color: #666;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-size: 16px;
}

.mid-blog-post .card-text p {
    color: #000;
    margin-bottom: 20px;
}


/* ========================================
                procchod 
===========================================*/
#prochhod .card .img-container {
    position: relative;
}

.topleft {
    position: absolute;
    top: 8px;
    left: 16px;
    font-size: 18px;
}

.bottomleft {
    position: absolute;
    bottom: 8px;
    left: 16px;
    font-size: 18px;
}

.topright {
    position: absolute;
    top: 8px;
    right: 16px;
    font-size: 18px;
}

.center {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    text-align: center;
    font-size: 18px;
}

.bottomright {
    position: absolute;
    bottom: 8px;
    right: 16px;
    font-size: 18px;
}


/* ========================================
                deyal-likhon 
===========================================*/
#deyal-likhon {
    max-height: 800px;
}

.bg-deyal {
    background: #003366;
    color: #f8f8f8;
    border-bottom-color: #e35252;
}

.bg-deyal .section-title h3 {
    border-bottom-color: #f8f8f8;
}

#deyal-likhon .card {
    /*background-color: #003366;
    background-image: url(../images/deyal-likhon-sticky.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: left top;
    background-size: auto;*/
    color: #003366;
    /*position: relative;*/
}

#deyal-likhon .card,
#deyal-likhon .card img {
    border-radius: 0;
}

#deyal-likhon .card-title,
#deyal-likhon .card-body blockquote,
#deyal-likhon .card-body p {
    margin-bottom: 5px;
}

#deyal-likhon .card-body {
    padding: 5px 10px;
}

#deyal-likhon .card footer {
    text-align: right;
}

.cello-tape {
    width: 100px;
    height: 15px;
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translate(-50%, 0%);
    border: 1px solid #ccc;
}

.pin {
    width: 30px;
    height: 30px;
    background-image: url(../images/sticky.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: contain;
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translate(-50%, -10%);
}

.sticky {
    /*position: absolute;*/
    top: -10%;
    left: 50%;
    font-size: 22px;
    /*transform: translate(-50%, -10%);*/
    color: #e35252;
}



/* ========================================
                featured-slider
===========================================*/

#featured-slider.carousel {
    /*border: 2px solid #363635;*/
}

/*-------------- next/prev ----------------*/
#featured-slider .carousel-control-next,
#featured-slider .carousel-control-prev {
    /*background: linear-gradient(to right, rgba(0, 0, 0, 0.51), rgba(0, 0, 0, 0.01));
    background-blend-mode: difference;*/
    width: 10%;
    opacity: 1;
}

#featured-slider .carousel-control-prev {
    justify-content: center;
}

#featured-slider .carousel-control-next {
    justify-content: center;
}

#featured-slider .carousel-control-prev:hover,
#featured-slider .carousel-control-next:hover {
    opacity: 1;
}

#featured-slider .carousel-control-prev-icon,
#featured-slider .carousel-control-next-icon {

    border: 2px solid #f8f8f8;
    padding: 30px;
    background-size: 60%;
    /*background-color: #000;*/
    top: 50%;
    border-radius: 0;
    opacity: 1;
}

#featured-slider .carousel-control-prev-icon {
    margin-left: 15%;
}

#featured-slider .carousel-control-next-icon {
    margin-right: 15%;
}

#featured-slider .carousel-control-prev-icon:hover,
#featured-slider .carousel-control-next-icon:hover {
    background-color: #83bf17;
    border: 2px solid #83bf17;
    opacity: 1;
}


#featured-slider .carousel-caption {
    text-align: left;
    left: 5%;
    bottom: 5%;
    padding-bottom: 0;
}

#featured-slider .carousel-caption .card-meta a {
    color: #83bf17;
}

#featured-slider .carousel-caption .card-meta a:hover {
    color: #f8f8f8;
}

#featured-slider .carousel-caption .text {
    background: rgba(0, 0, 0, 0.8);
    padding: 10px;
    color: #f8f8f8;
}

#featured-slider .category-name {
    background: #CC0000;
    padding: 5px;
    display: inline;
}

#featured-slider .category-name a {
    color: #f8f8f8;
}

#featured-slider .title {
    background: #f8f8f8;
    padding: 10px;
    font-size: 1.1rem;
}

#featured-slider .title a {
    color: #000;
}

#featured-slider .author-profile {
    color: #000;
}

#featured-slider .author-profile a {
    color: #f8f8f8;
}


/* ========================================
                okutobhoy 
===========================================*/

#okutobhoy h1 {
    font-size: 4rem;
}

#okutobhoy .read-more a {
    font-size: 1.5rem;
    background: #000;
    color: #f8f8f8;
    ;
    padding: 3px 8px;
    border: 2px solid #000;
}

#okutobhoy .read-more a:hover {
    background: #e35252;
    ;
    border: 2px solid #e35252;
}



/* ========================================
                chotochobi
===========================================*/
#chotochobi .mid-blog-post .card-title a h1 {
    font-size: 3rem;
}


/* ========================================
                sodyo
===========================================*/
#sodyo .zgrid .card-title h2 {
    font-size: 1.5rem;
    font-weight: bold;
}


/* ========================================
                angina 
===========================================*/

#angina .card {
    /*background-color: #003366;
    background-image: url(../images/deyal-likhon-sticky.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: left top;
    background-size: auto;*/
    color: #003366;
    /*position: relative;*/
}

#angina .card,
#angina .card img {
    border-radius: 0;
}

#angina .card-title,
#angina .card-body blockquote,
#angina .card-body p {
    margin-bottom: 5px;
}

#angina .card-body {
    padding: 10px;
}

#angina .card-body h4 {
    font-size: 22px;
}

#angina .card footer {
    text-align: right;
}


/* ========================================
                sidebar
===========================================*/
.sidebar {
    border-left: 2px solid #000;
}

.sidebar .section-title {
    margin-bottom: 15px;
}

.sidebar .section-title h3 {
    font-size: 1.3rem;
    background: #000;
    color: #f8f8f8;
    padding: 5px 10px;
    font-weight: 100;
}

/************ sidebar thumb-blog-post *****************/
.sidebar .thumb-blog-post .post-content .post-title h1 {
    font-size: 1.3rem;
    font-weight: bold;
}

.sidebar .thumb-blog-post {
    margin-bottom: 5px;
    padding-bottom: 5px;
}

.sidebar .thumb-blog-post .post-content p {
    margin-bottom: 0px;
}

/************ sidebar ul *****************/
.sidebar #bibhag ul {
    list-style-type: none;
    padding-left: 3px;
}

.sidebar #bibhag li {
    border-bottom: 1px solid #000;
    padding: 5px 0;
}

.sidebar #bibhag li:last-child {
    border-bottom: none;
}


/* ========================================
                prokashok
===========================================*/

#prokashok .card {
    border: 1px solid #000;
    padding: 5px;
}

#prokashok .mid-blog-post h2.card-title {
    font-size: 1.3rem;
    background: #000;
    color: #f8f8f8;
    padding: 2px 10px;
}

#prokashok .card-body {
    padding: 0;
}

#prokashok .card-text {
    padding: 0 3px;
    margin-top: 10px;
}

#prokashok .card-footer {
    padding: 0 3px;
    border-top: none;
    font-size: 1.5rem;
    margin-top: 30px;
    background: #fff;
}

#prokashok .card-footer a {
    color: #000;
}

#prokashok .card-footer a:hover {
    color: #666;
}



/* ========================================
                kolomdhari
===========================================*/

#kolomdhari .card-body {
    padding: 5px;
}
#kolomdhari .card img {
    margin-top: -50px;
}
#kolomdhari .card hr {
    /*background-color: #f15025;*/
}
#kolomdhari .card .faz {
    /*color: #f15025;*/
    font-size: 30px;
}
#kolomdhari .card .faz:hover {
    color: #242a33;
}
.card-footer {
    padding: .75rem 1.25rem;
    background-color: #fff;
    border-top: 1px solid rgba(0, 0, 0, .125);
}



/* ========================================
                montobyo
===========================================*/

#montobyo .sticky {
    color: #666;
}
#montobyo .fa-quote-left{
    color: #e35252;
}
#montobyo .card-body {
    padding: 5px 15px;
}
#montobyo .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 1.25rem;
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;
}


/* ========================================
                chithipotro
===========================================*/

#chithipotro .fa-envelope-open {
    color: #666;
}
#chithipotro .fa-quote-left{
    color: #e35252;
}
#chithipotro .card-body {
    padding: 15px 10px 0px;
}


/* ========================================
                prokashok
===========================================*/
section#amra-kara{
    border-bottom: none;
}
#amra-kara .card {
    border: 1px solid #000;
    padding: 5px;
}

#amra-kara .mid-blog-post h2.card-title {
    font-size: 1.3rem;
    background: #000;
    color: #f8f8f8;
    padding: 2px 10px;
}

#amra-kara .card-body {
    padding: 0;
}

#amra-kara .card-text {
    padding: 0 3px;
    margin-top: 10px;
}

#amra-kara .card-footer {
    padding: 0 3px;
    border-top: none;
    font-size: 1.5rem;
    margin-top: 30px;
    background: #fff;
}

#amra-kara .card-footer a {
    color: #000;
}

#amra-kara .card-footer a:hover {
    color: #666;
}


/* ========================================
                contact-form
===========================================*/
section#contact-form{
    border-bottom: none;
}
.contact .form-control{
    border-radius: 0;
    border: 1px solid #000;
    padding: 10px 10px;
}
.contact label{
    margin-bottom: 0px;
}
.contact .btn {
    border-radius: 0;
    background: #000;
    color: #e35252;
    font-size: 1.3rem;
}
.contact .btn:hover {
    border-radius: 0;
    background: #e35252;
    color: #000;
}
.contact .input-group-addon{
    background: #000;
    color: #fff;
    width: 30px;
    text-align: center;
}
.contact .section-title {
    margin-bottom: 15px;
}
.contact .section-title h3 {
    font-size: 1.3rem;
    background: #000;
    color: #f8f8f8;
    padding: 5px 10px;
    font-weight: 100;
}

.form-control-msg{
    display: none;
}
.has-error{
    .form-control-msg{
        display: block;
    }
}
.js-show-feedback{
    display: block;
}


/* ========================================
                footer
===========================================*/
footer{
    border-top: 2px solid #000;
    background: #fff;
    padding: 20px;
}
footer .brand {
    border-top: none;
    border-bottom: none;
}


/* ========================================
                Single Page
===========================================*/

.video-holder {
    display: inline-block;
    position: relative;
    padding-bottom: 60%;
    width: 100%;
    margin-bottom: 10px 0;
}
.video-holder iframe {
    height: 100% !important;
    position: absolute;
    top: 0; left: 0;
    width: 100% !important;
}