@media screen and (max-width:768px) {
    header .top-header .short-menu {
      display: inline-flex;
      width: max-content;
    }
    header .top-header .short-menu li:not(.language-nav){
      display: none;
    }
    .top-header .social a , .short-menu .language-nav a{
      padding: 0 10px !important;
    }
    }
@media screen and (max-width:767.98px) {
    header .top-header{
      flex-flow: row;
    }
    header .register-nav .logRegister-nav{
      display: none;
    }
    }
@media screen and (max-width:350px) {
    .register-nav li.love-icon {
       display: none;
    }
    }
@media screen and (max-width:768px) {
    header.user-loggedIn .social {
      display: none;
    }
    header.user-loggedIn .register-nav {
      position: absolute;
      top: -88%;
      right: 0;
    }
    }
@media screen and (min-width:768px) {
    .sidebar-nav .signInUp-nav{
      display: none;
    }
    }
@media screen and (max-width:567px) {
    .borderd{
      margin-top: 11px;
    }
    .logo-footer {
      margin: 0;
    }
    }
@media (min-width: 992px) {
    .profile img:not(.AddCartBtn img){
      /* width: 40px; */
      margin: 0 8px;
    }
    .dark .col-lg-6 {
      max-width: 33.5%;
      margin-left: 13.5%;
    }
    .fair .col-lg-10 {
      margin-left: 13.5%;
    }
    textarea{
      height: 150px;
    }
    }
@media screen and (max-width:689px) {
    .cover input[type=text]{
      margin-bottom: 20px;
    }
    }
@media (max-width: 767.98px) {
    .article-section::after {
      top: 0;
      width: 100%;
    }
    }
@media (min-width: 768px) {
    .article-section:nth-of-type(odd) .cover-order {
      -ms-flex-order: 2;
       order: 2;
    }                 
    .article-section:nth-of-type(odd) .text-order {
       -ms-flex-order: 1;
        order: 1;
    }
    }
@media (min-width: 1200px) {
    .article-details-image {
          max-width: 390px !important;
    }
    }
@media (max-width: 769px){
    .related .ng2-carouselamos-wrapper {
        width: 72%!important;
    }
    .forum div {
        padding-top: 0!important;
        width: 100%
    }
    }
@media (max-width: 575.98px) {
    .div-image-caption, .align-article-image, .details p img {
        float: none !important;
        display: block !important;
         margin: 1em auto !important;
    }
    .details .div-image-caption img {
        margin: 0 !important;
    }
    }
@media (max-width: 575.98px) {
    .details figure {
        padding: 0;
    }
    }
@media screen and (max-width:768px) {
    .article-details-info{
        flex-flow: column;
        width: max-content;
        margin: auto;
        align-items: flex-start;
    }
    .article-details-info .dott {
        display: none;
    }
    .article-details-info a {
        padding: 0;
    }
    }
@media (max-width: 575.98px) {
    .overlap-img{
        padding: 0 !important;
    }
    }
@media screen and ( max-width: 992px) {
    .social-details {
        margin-bottom: 15px;
    }
    .social-details li:first-child {
        line-height: 2;
    }
    }
@media screen and (max-width:520px) {
    .paging {
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
    }
    .paging li{
        padding: 0 6px;
    }
    .paging span {
        padding: 0 4px;
    }
    }
@media screen and (max-width:768px) {
    .pagination-article-title {
        display: none;
    }
    }
@media screen and (max-width:992px) {
    .thumbnail:after {
        content: none;
    }
    }
@media (max-width: 575.98px) {
    .ql-snow .ql-tooltip[data-mode=video]::before {
       display: block;
    }
    }
@media screen and (max-width:768px) {
     /* new update comment */
    /* .cdk-overlay-pane {
        width: auto !important;
    } */
    }
@media (min-width: 992px){
    .modal-dialog {
         max-width: 100%;
         margin: 0!important
    }
    .head-drp .cdk-overlay-pane {
        width: 100%
    }
    .head-drp.mat-mdc-menu-panel {
        transform-origin: right top 0px!important
    }
    .login-bx {
        min-width: 780px;
        /* max-height: 600px; */
    }
    .login-bx input {
         box-shadow: none !important;
    }
    .login-bx form {
         margin-bottom: 10px;
    }
    .login-bx .modal-content{
        background: url('../img/login.jpg')top right #f8f8f8 repeat-y;
        background-size: 50% 100%;
        padding-right:50%
    }
    }
@media (max-width: 991.98px) {
    .login-modal {
        flex-grow: 1;
        max-width: 95% !important;
    }
    .login-bx .modal-body {
        padding-left: 15px;
    }
    }
@media (min-width: 576px) and (max-width: 991.98px) {
    .login-modal {
        max-width: 500px !important;
    }
    }
@media (max-width: 575.98px) {
    .steps-content .step-info {
        padding: 0 25px;
    }
    }
@media (max-width: 575.98px) {
    .steps-content .favorite-books .book-container {
        margin: 0 3px 20px;
    }
    }
@media (max-width: 575.98px) {
    .steps-content .mat-horizontal-stepper-header-container {
        padding: 0;
    }
    .mat-horizontal-content-container {
        padding: 10px 0 !important;
    }
    }
@media screen and (max-width:400px) {
    .evnt-item .details-btn{
        margin-bottom: 30px;
    }
    }
@media screen and (max-width:768px) {
    .sponsor {
        margin-bottom: 30px;
    }
    .sponsor .ui-grid img {
        width: 57%;
        transform: translateY(-10%);
        margin-top: 30px;
    }
    }
@media screen and (min-width:768px) {
    .sponsor .col-md-6:first-child img {
        float: right;
    }
    .sponsor .col-md-6:nth-child(2) img {
        float: left;
    }
    }
@media screen and (max-width:567px) {
    .event-buttons-group {
        margin-top: 65px;
        margin-bottom: 20px;
    }
    }
@media screen and (max-width:768px) {
    .makers p {
        padding-bottom: 50px;
    }
    }
@media screen and (min-width:578px) and (max-width:992px) {
    .makers img.col-lg-2 {
        max-width: 300px;
    }
    }
            
@media screen and (max-width:576px) {
    .makers img.col-lg-2 {
        max-height: 250px;
        width: auto;
        margin: auto;
    }
    .makers .row {
        padding: 0;
    }
    }
@media screen and (max-width:768px) {
    .makers h5:after {
        width: 19%;
    }
    }
@media screen and (max-width:567px) {
    .play-section h1{
        text-align: center;
        margin-bottom: 12px;
        font-size: 30px;
    }
    .play-section p{
        font-size: 12px;
    }
    .play-section hr , .play-section ul {
        position: relative;
        top:10px;
    }
    }
@media screen and (max-width:768px) {
    .lect-list-head .bottomleft{
        top: 2%;
    }
    }
@media screen and (max-width:567px) {
    .lect-list-head h1{
        font-size: 24px;
        margin-top: 10px;
    }
    .lect-list-head img{
        height: 150px;
    }
    }
@media (max-width: 768px) {
    .table-responsive table {
        min-width: 636px;
        overflow-x: auto;
    }
    }
@media (min-width: 769px) {
    .table-responsive .fixed_headers .break td {
        float: left;
        width: 100%;
    }
    .evening,.break{
        float: left;
        width: 100%;
        line-height: 2
    }                   
    .table-responsive tr {
        width: 100%;
        float: left;
    }                  
    .table-responsive .fixed_headers td:nth-child(2),.table-responsive .fixed_headers th:nth-child(2){
        width: 100px;
    }
    .table-responsive .fixed_headers td:last-child, .table-responsive .fixed_headers th:last-child {
        width: 150px;
    }
    .table-responsive .fixed_headers td,.table-responsive .fixed_headers th{
        width:250px
    }
    .table-responsive table td,
    .table-responsive table th {
        width: 193px;
    }
    .evening td:last-child {
        width: 81%!important;
    }
    /* .table-responsive td:first-child, .table-responsive th:first-child {
        width: 50px;
    } */
    }
@media screen and (max-width:768px) {
    .wrk-shp h5 {
        text-align: center;
    }
    .arrow-steps {
        display: flex;
        flex-flow: column;
    }
    .arrow-steps .step {
        width: 100%;
    }
    .arrow-steps .step:after , .arrow-steps .step:before{
        content: none;
    }
    }
@media screen and (max-width:992px) {
    .contact-us-social p {
        margin-bottom: 10px !important;
    }
    }
@media screen and (max-width:580px) {
    .comment-photo {
        justify-content: unset;
    }
    }
@media screen and (max-width:500px) {
    .comment-details{
        padding: 10px;
    }
    }
@media screen and (max-width:768px) {
    header .logo {
        display: flex;
        flex-flow: column;
        background-size: 50%;
        background-position: 100% 5px;
    }
    .details h1{
        line-height: 57px;
    }
    ul.nav.navbar-bar.float-left li:first-child {
        border-right: 0 !important;
    }
    .register-nav li{
                          /* display: flex;
                          justify-content: center;
                          align-items: center;
                          width: 100%; */
                          /* margin-top: 30px; */
                          /* display: none; */
    }
    }
@media screen and (max-width:768px) {
    .title-buttons button {
        height: 35px;
        line-height: 1;
    }
    .title-buttons p{
        margin-bottom: 3px !important;
    }
    }
@media screen and (max-width:576px) {
    .title-buttons p {
        align-items: center;
        flex-wrap: nowrap;
        display: flex;
    }
    .title-buttons div{
        display: flex;
    }
    .title-buttons button {
        margin: 0px 2px;
                              /* width: 69px; */
    }
    }
@media screen and (max-width:567px) {
    .slider-homepage label {
        bottom: 58px;
    }
    }
@media screen and (max-width:567px) {
    .home-second-slider{
        height: auto;
        background-size: cover;
    }
    .home-second-slider h1{
        margin: 30px 0;
    }
    .home-second-slider .second-slider-content .day-details{
        margin-top: 10px;
    }
    .home-second-slider .second-slider-content ul{
        visibility: hidden;
    }
    }
@media screen and (min-width:992px) and (max-width:1200px) {
    .home-second-slider .second-slider-content{
          bottom: calc(-70% + 86px);
    }
    .home-second-slider h1{
          top: 15%;
    }
    }
        
@media screen and (max-width:992px) {
    .home-second-slider .second-slider-content{
          bottom: calc(-50% + 86px);
    }
    .home-second-slider h1{
          top: 15%;
    }
    }
@media screen and (max-width:485px) {
    .home-second-slider .second-slider-content{
          bottom: calc(-40% + 86px);
    }
    .home-second-slider h1{
          top: 40%;
    }
    }
@media screen and (min-width:768px) {
    .home-first-slider .main-banner-full {
        width: 100%;
        max-height: 400px;
        display: block;
    }
    .home-first-slider .main-banner-mobile {
        /* display: none; */
    }
    }
@media screen and (max-width:768px) {
    .home-first-slider .main-banner-full {
        /* display: none; */
    }
    .home-first-slider .main-banner-mobile {
        /* display: block;
        width: 100%;
        transform: scale(1.2); */
    }
    }
@media screen and (min-width:1366px) {/* for large screen */
    .home-first-slider .slider-img{
        width: 1366px;
        margin: auto;
        max-width: 1366px;
    }
    .slick-prev:before, .slick-next:before {
        color:#9b5d50 !important;
    }
    }
                
@media screen and (max-width:768px) {
    .home-first-slider .slider-img {
        /* new update */
        /* min-height: 300px;
        max-height: 300px; */
    }
    }
    .home-first-slider .slick-prev {
        z-index: 5;
        left: 10%;
    }
    .home-first-slider .slick-next {
         z-index: 5;
        right: 10%;
    }
@media screen and (max-width:567px) {
    .home-first-slider .slick-prev {
        left: 4%;
    }
    .home-first-slider .slick-next {
        right: 4%;
    }
    }
@media screen and (max-width:992px) {
    .first-slider-data {
        /* bot: 10%; */
    }
    .home-first-slider .ui-carousel .ui-carousel-mobiledropdown {
        display: none !important;
    }
    }
@media (max-width: 575.98px) {
    .home-first-slider .slider-img {
        /* height: 175px; */
        min-height: auto;
        /* height: 240px; */
    }
    .home-first-slider button.rightRs, .home-first-slider button.leftRs {
        width: 30px !important;
        height: 30px !important;
    }
    .home-first-slider button.rightRs i, .home-first-slider button.leftRs i {
        font-size: 11px !important;
    }
    }
                        
        /* realted article */
                        
    .home-related-article .bottomleft{
        padding: 10px;
    }
                        
@media screen and (max-width:992px) {
    .home-related-article li {
        margin-bottom:30px ;
    }
    }
                        
    .home-related-article img{
        max-height: 293px;
        min-height: 293px;
        width: 100%;
        cursor: pointer;
    }
@media screen and (max-width:768px) {
    .home-related-article img{
        min-width: 300px;
        max-width: 300px;
    }
    }
@media screen and (max-width:768px) {
    .latestArticle-item {
        margin: auto;
        width: min-content;
        position: relative;
    }
    }
@media screen and (max-width:768px) {
    .details-play-btn{
        flex-flow: column;
    }
    .details-play-btn button{
        margin-left: 0 !important;
        width: 230px;
        margin-bottom: 10px;
        padding: 0;
        height: 47px;
    }
                                
    .lec-group-btn{
        flex-flow: column;
    }
    .lec-group-btn > button , .details-play-btn button {
        margin-bottom: 10px;
    }
    }
@media screen and (max-width:567px) {
    .event-date {
        padding-bottom: 30px;
    }
    }
@media screen and (max-width:768px){
    .table-general thead tr {
        display: table-row !important;
    }
    .table-general tbody {
        display: table-row-group !important;
    }
    .table-general table{
        table-layout: unset !important;
    }
                                        
    .table-general thead th , .table-general td {
        padding-left: 0;
        padding-right: 0;
    }
    .estrha-class , .omsya-class{
        position: relative;
    }
    .estrha-class:after{
        content: '';
        display: block;
        width: 52px;
        position: absolute;
        top: -2px;
        left: -52px;
        background: #e6fded;
        height: 112%;
        border: 2px solid #28c75d;
        border-right: 0;
                                        }
    .omsya-class:after{
        content: '';
        display: block;
        width: 52px;
        position: absolute;
        top: -1px;
        left: -52px;
        background: #cedde0;
        height: 105%;
        border: 1px solid #88a5f8;
        border-right: 0;
    }
                                        /* hide date */
    /* .table-workshop--7 th:nth-child(2), .table-workshop--7 td:nth-child(2){
        display: none;
    } */
    }
@media screen and (max-width:576px){
    .table-general {
        padding: 0 5px !important;
    }
    .table-responsive table {
        min-width: unset;
    }
    /* .table-responsive table td:first-child:not(.estrha-class):not(.omsya-class) {
        display: none;
    }
                                            
    .table-responsive table th:first-child {
        display: none;
    } */
    .table-responsive table td:nth-child(3) img{
        display: none;
    }
    .table-responsive table th , .table-responsive td {
        min-width: 130px !important;
        padding: 0 2px;
        white-space: unset !important;
    }
    .table-responsive td ,.table-responsive td a ,.table-responsive td button{
        /* font-size: 10.6px; */
    }
                                            
    .table-event--6 table th:nth-child(4) , .table-event--6 td:nth-child(4) {
        /* white-space: nowrap !important; */
    }
    .table-event--6 table{
        min-width: 636px;
    }
    .table-event--6 table th, .table-event--6 td {
        min-width: 94px !important;
    }
        /* work shop */
    .table-responsive {
        padding: 0 !important;
    }
    /* .table-workshop--7 td:first-child ,.table-workshop--7 th:first-child {
        display: initial !important;
    } */
    .table-workshop--7 td:nth-child(4) img{
        display: none;
    }
    .table-workshop--7 th {
        /* font-size: 10.6px; */
    }
    .table-workshop--7 td {
        vertical-align: middle;
        min-width: 50px !important;
    }
    .table-workshop--7 td:nth-child(1) label{
        margin-top: 20px;
        margin-right: 12px;
    }
    .table-workshop--7 td ,.table-workshop--7 td a{
        font-size: 9;
    }
    }/* end mobile table*/
@media screen and (min-width:768px) {
    .table-workshop--7 td, .table-workshop--7 th {
        width: initial !important;
    }
    .table-workshop--7 tbody{
        display:table-row-group !important;
    }
    .table-workshop--7 tr {
        float: none !important;
        display: table-row !important;
    }
    /* .table-workshop--7 td:first-child, .table-workshop--7 th:first-child {
         width: 50px !important;
    } */
    .workShop-date-mob {
        display: none;
    }
    }
        /* End table */
@media screen and (max-width:992px){
    .blog-cover select{
        margin-bottom: 15px;
    }
    }
                                                
@media screen and (max-width:768px){
    .blog-cover input{
        border: 1px solid #e5e3e2 !important;
        margin-bottom: 10px !important;
        width: 80% !important;
    }
    .blog-cover button{
        height: 37px;
        margin-bottom: 10px;
    }
    .blog-cover .input-group {
        padding: 7px;
        padding-bottom: 0px;
    }
    }
                                                
@media screen and (max-width:576px){
    .blog-cover input{
    width: 70% !important;
    }
    }
                                                
@media screen and (max-width:768px) {
    .table-omsya tbody tr{
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    padding: 10px;
    }
    }
@media screen and (max-width:768px) {
    .ui-carousel .ui-carousel-mobiledropdown{
        display: none !important;
    }
    .register-modal-message {
        width: 270px !important;
    }
    .register-modal-message p{
        width: 50%;
        display: block;
        margin: 10px auto;
    }
    }
@media screen and (max-width:768px) {
    .head-underLine:after{
        width: 19%;
    }
    }
@media screen and (min-width:768px) {
    .guest-slider-item:hover .guest-item-info {
        top:40%;
    }
    .guest-slider-item:hover button {
        visibility: visible;
    }
    }
                                                            
@media screen and (max-width:768px) {
    .guest-item-info button{
        visibility: visible;
    }
    .guest-item-info {
        top: 28%;
    }
    }
                                                            
@media screen and (max-width:992px) {
    .guest-slider-item .guest-item-info button{
        display: none;
    }
    }
                                                            
@media screen and (min-width:576px) and (max-width:768px) {
    .guest-item-info p {
        font-size: 12px;
        text-shadow: -1px -1px 1px #000, 1px 1px 1px #000, 0px 0px 1px #000;
    }
    .guest-item-info small {
        font-size: 10px;
        text-shadow: -1px -1px 1px #000, 1px 1px 1px #000, 0px 0px 1px #000;
    }
    }
                                                            
                                                            
@media screen and (max-width:576px) {
    .guest-wrapper .img-guest {
        /* max-height: 220px; */
        width: 80%;
        margin: auto;
    }
    .guest-item-info {
        top: 57%;
    }
    .guest-item-info small {
        font-size: 15px;
        text-shadow: -1px -1px 1px #000, 1px 1px 1px #000, 0px 0px 1px #000;
    }
    .guest-item-info p {
        font-size: 16px;
        text-shadow: -1px -1px 1px #000, 1px 1px 1px #000, 0px 0px 1px #000;
    }
    }
@media screen and (max-width:768px){
        /* .setting-profile-form .form-group {
        flex-flow: column;
        } */
    .setting-profile-form .form-group input, .setting-profile-form .form-group select {
        margin: 0 20px;
    }
        /* .full-name-group {
        flex-flow: column;
    } */
    .photo-group{
        margin:0 20px;
    }
    }
                                                                
@media screen and (min-width:1000px) {
    .for-single-col {
        width: 50%;
        margin: auto;
    }
    .for-two-col {
        width: 66%;
        margin: auto;
    }
    }
@media (max-width: 576.9px) {
    .container {
        max-width: 100% !important;
    }
    }
@media (min-width: 1200px) {
    .container {
        max-width: 1140px !important;
    }
    }
@media (max-width: 575.98px) {
    .custom-input-number i {
        padding: 13px 9px;
    }
    }
@media (max-width: 575.98px) {
    .main-search-box select.custom-select {
        margin: 10px auto;
        border-width: 1px;
        width: calc(100% - 20px);
    } 
    }

@media (min-width : 320px) and (max-width : 480px) {
    li.nav-item.side-menu-nav, li.nav-item.language-nav.ng-star-inserted {
        width: 100px;
    }
    li.nav-item.side-menu-nav a, li.nav-item.language-nav.ng-star-inserted a {
        padding: 7px 0;
    }
    ul.nav.navbar-bar.register-nav .nav-item a span {
        font-size: 11px;
    }
    ul.nav.navbar-bar.register-nav .nav-item a span.items-number {
        top: 3px !important;
    }
    .profile {
        margin: 12px 5px;
    }
    }
@media (max-width: 575.98px) {
    .register-nav li strong {
        display: none;
    }
    }
@media screen and (max-width:576px) {
    .mat-mdc-card {
        min-width: 100% !important;
    }
    }
@media (max-width: 575.98px) {
    .single-blog-paragraph.paragraph {
        padding: 0;
    }
    }
@media (max-width: 420px) {
    .profile .profile-content .latest-books .book-content .book-cover {
        height: 165px;
    }
    }
@media (max-width: 330px) {
    .profile .profile-content .latest-books .book-content .book-cover {
        height: 140px;
    }
    }
@media (min-width: 992px) {
    .book-details-modal {
        width: 45% !important;
    }
    }
@media (max-width: 575.98px) {
    .book-details .book-info .options button {
        padding: 7px;
        margin: 0 5px;
    }
    }
/* book details modal */
@media (max-width: 575.98px) {
    .book-details-modal, .book-rating-modal {
        max-width: 95% !important;
        width: 95% !important;
    }
    }
@media (max-width: 575.98px) {
    .book-modal {
        font-size: 1.2rem;
    }
    }
@media (max-width: 575.98px) {
    .book-modal .info-list li {
        padding: 13px 0;
    }
    }
@media (max-width: 991.98px) {
    .reviews-section .comments .comment .comment-content {
        padding-left: 8px;
        font-size: 12px;
    }
    }
@media (max-width: 767.98px) {
    nav .pagination>ul {
        width: 100%;
        margin: 10px 0;
    }
    }
@media (max-width: 575.98px) {
    .book-cards-lg a.reviews-link {
        margin-top: 15px;
    }
    }
@media (max-width: 575.98px) {
    .book-cards-lg .book-container .book-cover {
        height: 290px;
    }
    }
@media (max-width: 991.98px) {
    .book-cards-lg .book-info .book-price .new {
        font-size: 19px;
    }
    }
@media (min-width : 320px) and (max-width : 480px)  {
    .best-seller-books .book-cards .book-card {
        max-width: 250px;
        margin: 0 auto 30px !important;
        min-height: 331px !important;
    }
    .best-seller-books .book-cards .book-card .book-cover {
        height: 180px !important;
    }
    .best-seller-books .slide-content {
        min-height: auto !important;
    } 
    .justify-content-md-between {
        justify-content: space-between !important;
    }
    .best-seller-books .book-cards.book-details .book-card {
        margin: 0 15px 30px !important;
    }
    }
@media (max-width: 575.98px){
    .best-seller-books .book-cards .book-card .book-cover {
        height: 180px !important;
    }
    }
@media (max-width:767.9px) {
    .best-seller-books .book-cards .book-card {
        max-width: 250px;
        margin: 0 auto 30px !important;
        min-height: 331px !important;
    }
    .best-seller-books .book-cards .book-card .book-cover {
        height: 180px !important;
    }
    .best-seller-books .slide-content {
        min-height: auto !important;
    } 
    .best-seller-books .book-cards.book-details .book-card {
        margin: 0 15px 30px !important;
    }
    }
@media (max-width: 575.98px) {
    .books .search-actions {
        width: 100%;
    }
    }
@media screen and (min-width: 1366px) {
    .home-first-slider {
        width: 1366px;
        margin: auto;
        max-width: 100%;
    }
    }
/* publish btn */
@media (max-width: 991.98px) {
    .publish .publish-btn {
        margin: 6px 1px !important;
    }
    }
@media (max-width: 767.98px) {
    .coupon .discount {
        border: none;
    }
    }
@media (max-width: 360px) {
    .best-offers .offers-slider .offer .offer-content .options button {
        padding: 8px;
    }
    }
@media (max-width: 575.98px) {
    .main-modal, .main-modal-md {
        max-width: 95% !important;
        width: 95% !important;
        min-width: auto;
    }
    }
@media (max-width: 575.98px) {
    .read-mara-register .intro-text {
        font-size: 14px;
    }
                    }
@media (max-width: 575.98px) {
    .view-reading-marathon .shadow-card {
        padding: 10px !important;
    }
    }
@media (max-width: 575.98px) {
    .view-reading-marathon .mat-mdc-card-header, .read-marathon-reg-form .mat-card-header {
        font-size: 18px;
    }
    }
@media (max-width: 575.98px) {
    .view-reading-marathon img {
        width: 100%;
    }
    }
@media (max-width: 767.98px) {
    .view-reading-marathon .marathon-banner .statistics {
        padding: 15px 20px 30px;
    }
    }
@media (max-width: 767.98px) {
    .view-reading-marathon .marathon-banner .statistics .stat p {
        font-size: 18px;
    }
    }
@media (max-width: 767.98px) {
    .view-reading-marathon .marathon-banner .statistics .stat div {
        padding: 12px 5px;
        font-size: 14px;
    }
    }
@media (max-width: 575.98px) {
    .books .filter {
    position: fixed;
          background: #fafafa;
          z-index: 5;
          top: 0;
          overflow-y: auto;
          max-height: 100%;
          height: 100%;
          border-width: 0 1px;
          width: 100%;
          left: 0;
          max-width: 1000px !important;
          transition: all .5s;
          transform: translateY(100%);
    }
    .books .filter.open {
          transform: translateY(0);
    }
    .books .filter .title {
          padding: 15px 12px !important;
    }
    .books .filter .title i {
          cursor: pointer;
          font-size: 19px;
    }
    .books .filter .filter-content .mat-expansion-panel.select-list .mat-expansion-panel-body {
          overflow-y: auto !important;
    }
    }


    /* media of lang.css file */

@media screen and (max-width:768px) {
    .ar header .logo {
        background-position: 20px 5px;
    }
    .ar ul.nav.navbar-bar.float-left li:first-child {
        border-left: 0 !important;
    }
    }
@media screen and (min-width: 992px){
    .ar .offset-lg-3 {
        margin-right: 25%;
    }
    }
@media (min-width: 992px) {
    .ar .dark .col-lg-6,.ar .fair .col-lg-10 {
        margin-left: 0;
        margin-right: 13.5%;
    }
    }
@media (min-width: 768px){
    .ar .related img {
        margin: 0 0 0 3%;
    }
    }
@media (min-width: 576px){
    .ar .login-bx .modal-content{
        background: url('../img/login.jpg')top left #f8f8f8 repeat-y;
        padding-left:50%;
        padding-right:0
    }
    }
@media (min-width: 992px){
    .ar.login-bx .modal-content {
        padding-left: 50%;
        background-position: left;
        padding-right: initial;
    }
    }
@media screen and (min-width:768px) {
    .ar .sponsor .col-md-6:first-child img {
        float: left;
    }
    .ar .sponsor .col-md-6:nth-child(2) img {
        float: right;
    }
    }
@media screen and (max-width:768px) {
    .ar .article-details-info {
        /* flex-flow: column;
        align-items: flex-end; */
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        width: 100%;
    }
    .ar .details-play-btn button.btn {
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
    .ar header.user-loggedIn .register-nav {
        left: 0;
        right: unset;
    }
    }
@media screen and (max-width:576px) {
    .ar .related-article-data {
        margin-left: 120px !important;
    }
    }
@media (max-width: 991.98px) {
    .ar .reviews-section .comments .comment .comment-content {
        padding-left: 0 !important;
        padding-right: 8px !important;
    }
    }

    /* media of quill.snow.css file */

    @media (pointer: coarse) {
        .ql-snow.ql-toolbar button:hover:not(.ql-active),
        .ql-snow .ql-toolbar button:hover:not(.ql-active) {
          color: #444;
        }
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
          fill: #444;
        }
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
        .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
        .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
          stroke: #444;
        }
      }