@media(max-width: 1199px){
     header nav ul li,.notify{
         padding-right: 13px;
    }
     header a.logo{
         width: 120px
    }
     header nav ul li .searchbox-open{
         width: 80%
    }
     .notification-data:before{
         right: 16px
    }
}
 @media(max-width: 991px){
     h1{
         font-size: 28px;
         line-height: 32px
    }
     h2{
         font-size: 24px;
         line-height: 28px
    }
     h3{
         font-size: 18px;
         line-height: 22px
    }
     .right-data p{
         text-align: center;
         padding: 0 15px
    }
     .right-data form .form-group,.verify .right-data form button{
         margin-top: 30px
    }
     .side-banner{
         height: 500px
    }
     .right-data{
         height: auto;
         padding: 30px 0
    }
     .side-banner .banner-text p{
         padding: 0 0 20px
    }
     .right-data form{
         width: auto;
         min-width: 280px;
         margin: 0 15px
    }
     header nav ul li{
         display: none;
    }
     a.mobile-menu{
         display: inline-block;
    }
     a.search i{
         font-size: 26px
    }
     .profile{
         margin-right: 30px
    }
     header{
         padding: 12px 15px
    }
     header nav ul li{
         padding-right: 0
    }
     header nav ul li a{
         color: #000;
         text-align: center;
         padding: 6px 10px 10px
    }
     header nav ul li:hover a{
         color: #288851
    }
     header nav ul li:hover a.search{
         text-align: right;
    }
     a.search{
         padding: 0 0 0 15px
    }
     .searchbox-input{
         border-bottom: 2px solid #ccc
    }
     header nav ul li .searchbox-open{
         width: 100%
    }
     .searchbox-input{
         color: #000
    }
     .searchbox-input::-webkit-input-placeholder{
        color:#000;
    }
     .searchbox-input:-moz-placeholder{
        color:#000;
    }
     .searchbox-input::-moz-placeholder{
        color:#000;
    }
     .searchbox-input:-ms-input-placeholder{
        color:#000;
    }
     header nav ul{
         position: absolute;
         top: 76px;
         right: 20px;
         background: #fff;
         box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
         -webkit-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
         -ms-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
         -moz-box-shadow: 0 3px 20px rgb(0 0 0 / 20%);
         z-index: 5
    }
     .notify{
         padding-right: 12px
    }
     .profile-name{
         padding-left: 0
    }
     header a.logo{
         width: 100px
    }
     .profile-img{
         width: 30px;
         height: 30px
    }
     a.mobile-menu{
         width: 20px
    }
     .profile-name{
         font-size: 16px
    }
     .notification-data ul{
         background: none;
         box-shadow: none;
         position: relative;
         top: auto;
         right: auto
    }
     .notification-data ul li{
         display: block;
    }
     .notification-data{
         left: -75px;
         right: auto;
         width: 260px
    }
     .notification-data:before{
         left: 75px;
         right: auto
    }
     main.inner-page .form-group{
         width: 100%
    }
     main.inner-page{
         margin-top: 100px
    }
     main.inner-page .form-group.third-grp label{
         text-align: left;
    }
     .review .row .col-md-6{
         padding: 0
    }
     .review h3{
         padding-bottom: 5px;
    }
     .review .review-number{
         padding-top: 5px
    }
}
 @media(max-width: 767px){
     .review ul li div{
         display: block;
    }
     .review ul li i.profile{
         display: block;
         margin: 0 auto
    }
     .review ul li div.rate-detail{
         display: block;
         padding: 0;
         text-align: center;
    }
     .review ul li em.date{
         text-align: center;
    }
     .review ul li p{
         text-align: center;
    }
     section{
         padding: 15px
    }
     .offer-listing .title{
         display: block;
    }
     main.inner-page .offer-listing h2{
         padding-bottom: 15px
    }
     #offer-detail .modal-dialog{
         width: auto;
    }
     #offer-detail .modal-body .title{
         display: block;
    }
     .offer-content{
         padding: 0 15px
    }
     #offer-detail .modal-body .title{
         margin-bottom: 20px
    }
     #offer-detail .modal-body .title h3{
         padding-bottom: 10px;
         font-size: 24px;
         line-height: 28px
    }
     #offer-detail i{
         margin-bottom: 20px
    }
     #offer-detail i img{
         border-top-left-radius: 15px;
         border-top-right-radius: 15px;
    }
     #offer-detail .modal-body{
         padding: 0 20px 20px
    }
}
 @media(max-width: 374px){
     header a.logo{
         width: 80px
    }
     #add-review ul li a{
         width: 30px
    }
     #add-review ul li a img{
         width: 100%
    }
}
 @media(max-width: 319px){
     .bell i{
         font-size: 20px
    }
     .notify{
         padding-right: 5px
    }
     .profile{
         margin-right: 15px
    }
     .profile-img{
         width: 20px;
         height: 20px
    }
     .profile-name{
         font-size: 14px
    }
     .profile-name span:after{
         right: -13px
    }
     ul.profile-menu{
         top: 63px
    }
     ul.profile-menu li a, ul.profile-menu li a:hover{
         font-size: 14px
    }
     .notification-data:before{
         left: 120px
    }
     .notification-data{
         left: -120px
    }
     header a.logo{
         width: 80px
    }
}
 @media (max-width: 767px){
     .spoton-question-section .spoton-question-box .question-no {
         position: relative;
         top: 0;
         left: 0;
    }
     .spoton-question-section .spoton-question-box{
         padding: 15px;
    }
    .spoton-question-section .spoton-question-box .input-list .btnfile{
         width: 100%;
    }
}
 @media (max-width: 767px){
     .spoton-question-section .spoton-question-box .question-no {
         position: relative;
         top: 0;
         left: 0;
    }
     .spoton-question-section .spoton-question-box{
         padding: 15px;
    }
    .spoton-question-section .spoton-question-box .input-list .btnfile{
         width: 100%;
    }
     .wallet-border{
        border-bottom: solid 1px #fff;
    }
     .spoton-wallet-section .wallet-history{
        margin: 25px 0;
         padding: 20px;
    }
     .spoton-wallet-section h2.history-title {
         margin: 0 0px 28px;
    }
     .spoton-wallet-section .wallet-history h4{
        text-align: left;
    }
     .spoton-wallet-section button.btnwallet{
        width: 100%;
         margin:0 0 10px;
    }
}
 @media (min-width:992px ){
     header nav ul li a ,header nav ul li a:hover{
         font-size: 18px;
    }
     header nav ul li {
         Padding-right:15px
    }
}
 @media(max-width: 767px) {
     .task-details-card .task-box {
         padding: 0 0 15px;
         position: relative;
         margin-bottom: 0;
    }
}
 @media (max-width: 767px) {
     .spoton-question-section .spoton-question-box .question-no {
         position: relative;
         top: 0;
         left: 0;
    }
     .spoton-question-section .spoton-question-box {
         padding: 15px;
    }
     .spoton-question-section .spoton-question-box .input-list .btnfile {
         width: 100%;
    }
     .wallet-border {
         border-bottom: solid 1px #fff;
    }
     .spoton-wallet-section .wallet-history {
         margin: 25px 0;
         padding: 20px;
    }
     .spoton-wallet-section h2.history-title {
         margin: 0 0px 28px;
    }
     .spoton-wallet-section .wallet-history h4 {
         text-align: left;
    }
     .spoton-wallet-section button.btnwallet {
         width: 48%;
         margin: 0 0 10px;
    }
}
 @media (max-width:576px){
     .incoming_msg_img {
         display: inline-block;
         width: 16%;
    }
     .received_msg {
         display: inline-block;
         padding: 0 0 0 10px;
         vertical-align: top;
         width: 82%;
    }
     .sent_msg {
         display: inline-block;
         padding: 0 0 0 10px;
         vertical-align: top;
         width: 82%;
    }
     .outgoing_msg_img {
         display: inline-block;
         width: 16%;
    }
}
 @media (max-width: 767px){
     .login-section .logo-sign-in .login-box {
         width: auto;
         margin: 0 auto;
         display: block;
    }
}
 @media (max-width: 767px){
     .Time-part .panel {
         border: solid 1px #f1f1f1;
         box-shadow: none;
         padding: 0;
         width: 100%;
         display: block;
    }
}
 @media (max-width:576px) {
     .chat-img img{
         width: 100%;
         border-radius: 50px;
         margin-top: 30px;
    }
}
 @media (min-width:577px) and (max-width:992px) {
     .chat-img img{
         width: 100%;
         border-radius: 50px;
         margin-top: 30px;
    }
}