html{scroll-behavior: smooth;font-size: 16px}
.container{max-width: 1200px; margin: 0 auto}
.p-70{padding: 30px 70px}
h1{font-family: 'Oxygen', sans-serif;}
h6{font-size: 18px;}
h5{font-size: 42px;}
h4{font-size: 32px;}
.c-white{color: #fff}
a:hover{transition: all .3s}
header{ background: #fff;}
header  .navbar-expand-lg {max-width: 1280px; margin: 0 auto; padding:10px 40px;}
.navbar-light .navbar-nav .nav-link {padding: 0 15px;color: #777;font-size: .875rem;}
.navbar-light .navbar-nav .nav-link:hover {color: #222;}
.navbar-light .navbar-brand{padding: 5px 15px;}
header.page_head{box-shadow: 0px 2px #5b5e5d;}

/*section 1 banner1 css*/
.banner1{background:url(../img/rural_tv/BG-4.jpg);background-repeat:no-repeat;background-size:cover;background-position-y:calc(-42.96px);padding:40px;height:515.5px;display:flex;margin-top:80px;align-items:center;justify-content:center}
#section2 p{margin:20px 0}
.button a:hover,.email_us:hover{background:#fff;color:#000;text-decoration:none}
.banner1 img{width: 600px}
section.page_section{padding: 0}
section:before{content:"";height:100%;width:100%;background:rgba(29,34,37,.72);position:absolute;top:0;bottom:0;left:0;right:0}
section{padding: 70px 0;}

/* section2 */
#section2{background: url(../img/rural_tv/BG-1.jpg) no-repeat 50% 50%; background-size: cover; }
#section2 .cwhite:hover{color: #fff}
#section2:before{ background: rgba(110,68,74,0.94);}

/* section 3 */
#section3{background: url(../img/rural_tv/BG-3.jpg) no-repeat 50% 50%;background-size: cover; }
#section3:before{ background: rgba(98,126,117,0.71);}
#section3 h1{font-size: 60px; font-weight: 700}
#section3 h4{margin-top: 40px;font-family: 'Roboto Condensed', sans-serif; font-weight: 700}
#section3 h5{font-size: 18px; line-height: 42px;  border-bottom: 1px dashed #dddddd;}
#section3 h6{margin: 20px 0;line-height: 1.5;}

/* section 4 */
#section4{background: url(../img/rural_tv/BG-5.jpg) no-repeat 50% 50%; background-size: cover; padding: 140px}
#section4:before{    background: rgba(0,0,0,0.5);}
#section4 h4{font-size: 25px; font-weight: 700; margin-bottom: 20px;}
#section4 h5{font-size:25px;font-weight:700;margin-bottom:20px}
#section4 h6{margin-bottom:20px}

/* contact */
.call_us{font-size:16px;background:#9fc457;border:1px solid #fff;color:#fff}
.email_us{background:0 0;border:1px solid #fff;color:#fff}
.button a{display:inline-block;padding:0 40px;line-height:53px;font-size:.875rem;text-transform:capitalize}
.contact{background: url(../img/rural_tv/BG-3.jpg) no-repeat 50% 50%; background-size: cover; padding: 140px}
.contact:before{    background: rgba(34,36,64,0.85);}
.p-50{padding-top:  50px }
.content a{text-decoration: none;}
#contact h5, #contact h4, #contact p {font-weight: 400;}
.bg-white:before{background: transparent; content: none;}
#select_list ul {    display: flex;
    padding-left: 0;
    flex-wrap: wrap;}
h4.clientname{border-bottom: 2px solid #9cc256}
p.btn-p{    margin: 0px;padding: 4px;cursor: pointer;}
li.bg-video{background: #57dea6}
li.bg-img{background: #e49964}
li.bg-ebv{background: #dff}
div.cxebv{padding: 25px}

#select_list ul li{display: inline-block;}
.flex-container {
    display: flex;
    flex-wrap: wrap; border: 1px solid #795548a8;min-height: 130px;
}
.logo {
    flex: 0 0 24%;
    border-right: 1px solid #999;
    align-items: center;    
    justify-content: center;
    display: flex;
}
.content {background: #eeeeee;flex: 0 0 76%;}
.content.mxdcon , .content.mxcon {position: relative;}
.eye_view{    
    background: #fff;
    padding: 5px;
    font-size: 10px;
    font-weight: bold;
    position: absolute;
    bottom: 0;
    right: 0;
}
.wishList{
    background: #fff;
    cursor: pointer;
    padding: 0 5px;
    border-left: 1px solid #1ea2b8;
    position: absolute;
    right: 0;
    top: 0;
    border-bottom: 1px solid #1ea2b8;
}
#successWish{
    position: fixed;
    top: 25%;
    width: 30%;
    padding: .75rem 1.25rem;
    border-radius: .25rem;
    z-index: 9999999;
}
.mx-link-right, .mx-link-left{
    background: #7ea351;
    padding: 0 5px;
    position: absolute;
    bottom: 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.mx-link-right{right: 1%;}
.mx-link-left{right: 10%;color: #fff; cursor: pointer;}
.mx-link-right a, .mx-link-left a{color: #fff;font-weight: bold;text-decoration: none;font-size: 12px;}
span#pageView{font-size: 11px; float: right;}
button.sorting_table {
    background: #e2e2e2;
    border: 1px solid #7d7d7d;
    border-radius: 14px;
    padding: 6px 0;
    width: 200px;
    color: #000;
    font-weight: 500;
    cursor: pointer;
}
.content_detial {flex: 0 0 40%;max-width: 40%;}
.content_blog {flex: 0 0 60%;max-width: 60%;}
.content_blog p{margin-bottom: 0}
#select_list ul li input{ position: absolute; opacity: 0; z-index: -1;}  
label.mxlabel { 
    cursor: pointer;
    padding: 0 10px;
    margin-right: 15px;
    color: #777;
}
label.mxlabel.active{color: #000;background: #d2fb98;}
.content_detial h5 {font-size: 26px;}
ul{padding-left: 0}
li{list-style: none;}
.bg_sky{background: #8db0b4}
.bg_green_light{background: #fff}
.bg_gray{background: #b7b7b7}
.tab_list {
    border-left: 1px solid #999;
    height: 100%;
    max-width: 33.33%;
    float: left;
    width: 100%;  
}
.tab_list li {
    /*border: 1px solid #7d7c78;*/
    font-size: 18px;
    font-weight: 600;
    padding: 4px 0;
}
.content_wrapper {
    max-width: 66.33%;
    text-align: left;
    float: left;
    padding: 5px;
}
.client-v{max-height: 130px}
.content_wrapper a {font-weight: 600;color: #222;}
#mx-yt{z-index: 1;color: #f00;font-size: 35px;}
#mx-cam{z-index: 1;color: #00F;font-size: 35px;}
h5.cli_region {
    position: absolute;
    font-size: 15px;
    bottom: -7px;
    background: #88caca;
    width: 135px;
    line-height: 25px;
    text-align: center;
    font-weight: bold;
}
.my_container .reg-row{background: #0f0;opacity: 0.2;}
.my_container .pt-20{padding-top: 10%}
.my_container .pt-15{padding-top: 15%}
div.contact_card{
    float: left;
    overflow: hidden;
    width: 100%;
    text-align: center;
    height: 340px;
}
div.contact_card .background-block{
    float: left;
    width: 100%;
    height: 200px;
    overflow: hidden;
    padding: 15px 25px;
    text-align: left;
}

div.contact_card .profile {
    border-radius: 50%;
    position: absolute;
    bottom: 45%;
    left: 50%;
    max-width: 100px;
    opacity: 1;
    box-shadow: 3px 3px 20px rgba(0, 0, 0, 0.5);
    border: 2px solid rgba(255, 255, 255, 1);
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    z-index: 99999;
    background: #fff;
}
div.contact_card .card-content{
    width: 100%;
    padding: 0 25px;
    color: #232323;
    float: left;
    background: #efefef;
    height: 100%;
    border-radius: 0 0 5px 5px;
    position: relative;
    z-index: 9999;
    text-align: right;
}
div.contact_card .card-content::before{
    content: '';
    background: #efefef;
    width: 125%;
    height: 100%;
    left: -70px;
    bottom: 51px;
    position: absolute;
    z-index: -1;
    transform: rotate(-13deg);
}
div.contact_card .icon-block {
    float: left;
    width: 100%;
    margin-top: 15px;
}
/* ===================== responsive ====================== */

@media(max-width: 991px){
    .sidenav{height:100%;width:0;position:fixed;z-index:1;top:0;right:0;background-color:#111;overflow-x:hidden;transition:.5s;padding-top:60px}
    .sidenav a{padding:8px 8px 8px 32px;text-decoration:none;font-size:25px;color:#818181;display:block;transition:.3s}
    .sidenav a:hover{color:#f1f1f1}
    .sidenav .closebtn{position:absolute;top:0;left:0;font-size:36px;padding-left:10px;width:100%}
    .navbar-light .navbar-nav .nav-link{padding:10px 15px;color:#fff;font-size:1rem}
    .collapse{display:block}
    #section3 h1 {font-size: 34px;}
    .mx-link-left{right: 10px;bottom: 20px;border-radius: 5px;}
    .mx-link-right{right: 10px;}
    #successWish{top: 15%; width: 92%;}
    .navbar-light .navbar-nav .nav-link:hover {color: #fff;}
    .my_container .pt-20{padding-top: 20%;}
}
@media(max-width: 767px){
h5.cli_region {width: 130px;}

    .banner1 img {width: 100%;}
    .p-70{padding: 15px}
    #section4, .contact{padding: 30px 0}
    header .navbar-expand-lg{padding: 10px}
    .navbar-light .navbar-brand {padding: 0;}
}
@media(max-width:575px){
    .navbar-light .navbar-brand {padding: 0;margin-right: 0;max-width: calc(100% - 50px);}
    .navbar-light .navbar-brand img {width: 100%;}
    #section4 h5 {font-size: 21px;line-height: 31px;}
    .logo{flex: 0 0 40%;}
    .content{flex: 0 0 60%;}

}