@charset "utf-8";
@media screen and (max-width: 768px){
    .main_title{
        font-size:24px
    }
    .ot-overlay{
        background:rgba(0, 0, 0, 0.5) !important
    }
    .desk_video{
        display:none !important
    }
    .mob_image{
        background:url(../images/mobile_bg.jpg) no-repeat top center fixed
    }
    #ot-features .feature-left .feature-copy{
        width:100% !important
    }
    #ot-logo a{
        color:#420707;
        float:left
    }
    #ot-logo a img{
        max-width:150px
    }
    #ot-logo{
        margin:15px 0
    }
    #ot-header-section{
        padding:0px 0 10px 0
    }
    .mobile_off{
        display:none
    }
    ul.partners_logo{
        list-style:none;
        display:table;
        margin:50px auto;
        padding:0;
        width:100%
    }
    ul.partners_logo li{
        display:inherit;
        padding:25px 20px;
        border-right:none;
        border:1px solid #333;
        margin:0;
        width:50%;
        float:left
    }
    ul.partners_logo li:last-child{
        width:100%;
        border-right:1px solid #333
    }
    .home_about_text{
        padding:30px 0px 20px 0px;
        text-align:center;
        max-width:100%
    }
    .home_about_text h3{
        font-size:42px
    }
    #opalina-about{
        min-height:auto !important
    }
    .scrl_logo{
        display:none
    }
    #latest_news{
        background:url(../images/news_bg_mb.jpg) no-repeat top center #101d23 !important
    }
    #latest_news ul li{
        display:block;
        vertical-align:top;
        padding:20px 10px;
        border-right:none;
        text-align:center
    }
    #latest_news ul li:last-child{
        border-right:none;
        width:100%;
        text-align:center
    }
    #latest_news ul li .carousel-control{
        position:relative;
        padding:10px;
        max-width:100px;
        margin:0 auto;
        width:100%
    }
    #ot-blog{
        background:#e3e3e3;
        padding:3em 0 0em 0
    }
    #ot-blog ul.service_bypass{
        margin:0em auto 2.5em auto !important
    }
    ul.blog_list li{
        margin-bottom:50px
    }
    ul.blog_list li ul.blog_aligns{
        list-style:none;
        margin:0;
        padding:0;
        display:block;
        width:100%
    }
    ul.blog_list li ul.blog_aligns li{
        list-style:none;
        width:100%;
        margin:0;
        padding:0;
        display:block;
        vertical-align:middle
    }
    ul.blog_list li ul.blog_aligns li img{
        width:100%
    }
    ul.blog_list li ul.blog_aligns li .blog-text{
        padding:20px;
        margin:-50px auto 0px auto !important;
        width:94%
    }
    ul.blog_list li ul.blog_aligns li:nth-child(odd) .blog-text{
        margin:0 auto -50px auto !important
    }
    ul.blog_list li ul.blog_aligns li .blog-text h1,ul.blog_list li ul.blog_aligns li .blog-text h1 a{
        color:#000;
        font-family:robotoConden;
        font-size:22px;
        margin:0 0 10px 0;
        line-height:28px
    }
    #ot-services{
        background:#e3e3e3;
        padding:3em 0
    }
    .page_discription{
        margin-bottom:30px;
        font-size:14px;
        line-height:26px
    }
    .service_point .service_detail_text{
        padding:30px 20px;
        width:94%;
        margin:-20px auto 0 auto
    }
    .service_point .service_detail_text h2{
        font-size:20px;
        line-height:28px
    }
    .service_point{
        margin-bottom:40px
    }
    figure.effect-bubba h2{
        padding-top:15px;
        font-size:14px !important;
        line-height:22px !important;
        margin-bottom:0px;
        font-weight:normal !important;
        letter-spacing:-0.1px
    }
    figure.effect-bubba figcaption::after{
        border:none !important
    }
    figure.effect-bubba figcaption::before{
        border:none !important
    }
    figure.effect-bubba p{
        display:none
    }
    figure.effect-bubba .view_service{
        padding:5px 12px;
        font-size:12px;
        opacity:1
    }
    .grid figure figcaption{
        padding:1em 1em
    }
    .pageTitle h1{
        background:#fff;
        display:inline-block;
        padding:15px 30px;
        color:#282828;
        text-transform:uppercase;
        font-size:24px;
        font-family:robotoConden
    }
    ul.service_bypass{
        display:block;
        margin:0em auto 0 auto !important
    }
    ul.service_bypass li{
        width:100%;
        padding:5px;
        display:block
    }
    ul.service_bypass li a{
        padding:11px;
        font-size:14px
    }
    ul.case_studies_list{
        display:block
    }
    ul.case_studies_list li{
        display:block;
        width:100%
    }
    ul.case_studies_list li h3{
        font-size:18px;
        margin:0 0 10px 0
    }
    ul.case_studies_list li h1{
        font-size:22px;
        margin:0 0 10px 0
    }
    ul.case_studies_list li p{
        font-size:14px;
        display:none;
        margin:0 0 15px 0;
        line-height:22px
    }
    .vcs_btn{
        opacity:1 !important;
        margin:0px 0 0 0 !important
    }
    .domain_div{
        padding:50px 15px;
        margin:1px -30px 15px -30px
    }
    .domain_div span{
        position:relative !important;
        opacity:1;
        left:auto;
        margin-left:0;
        bottom:auto
    }
    .domain_div:hover span{
        opacity:1;
        bottom:auto
    }
    .domain_div:hover img{
        margin:0 !important
    }
    .domain_div h1{
        font-size:22px
    }
    .domain_div p{
        font-size:14px;
        line-height:22px
    }
    .domain_div h1{
        margin:0 0 10px 0 !important
    }
    ul.listing_points li{
        background:#eee none repeat scroll 0 0;
        border:2px solid #fff;
        color:#393939;
        float:none;
        font-family:robotolight;
        font-size:16px;
        margin:0;
        padding:15px 7px;
        text-align:center;
        width:100%
    }
    .domain_contents{
        padding:30px 10px;
        margin:-100px 10px 0 10px
    }
    .domain_contents p.domain_text{
        text-align:center;
        margin-bottom:20px;
        color:#393939;
        font-size:16px;
        line-height:24px;
        font-family:robotolight
    }
    .listing_title{
        font-size:16px;
        margin:50px 0 0 0
    }
    ul.listing_points{
        padding:30px 0 0 0
    }
    #ot-domains{
        background:#e3e3e3;
        padding:3em 0 3em 0
    }
    #exTab1 .tab-content h1{
        font-size:29px
    }
    #exTab1 .tab-content p{
        font-size:16px;
        line-height:26px;
        margin-bottom:50px
    }
    #exTab1 .tab-content{
        padding:0px 15px
    }
    .tab-content > .tab-pane{
        display:block
    }
    #exTab1 ul.nav{
        display:none
    }
    .contact_box{
        padding:30px 15px 1px 15px !important;
        margin:-25px -25px 50px -25px !important
    }
    .map_pop .modal-content{
        margin-top:50px !important
    }
    .map_pop button.close{
        right:0;
        top:-35px
    }
    .map_btn,.map_btn:focus{
        right:-8px;
        padding:10px 20px
    }
    #ot-contact-us{
        padding:5em 0 0em 0
    }
}
@media screen and (max-width:990px){
    .service-half-wrapper .service-half-image{
        left:0;
        position:initial;
        top:0;
        height:auto;
        width:100%
    }
    .service-half-wrapper .service-half-text h2{
        color:#000;
        font-size:24px;
        font-family:robotoConden;
        margin:0 0 15px 0
    }
    .service-half-wrapper .service-half-text p{
        color:#2b2b2b;
        line-height:24px;
        font-size:16px;
        font-family:robotolight
    }
    .service-half-wrapper .service-half-text .text-white-box{
		width: 100%;
        display:block !important;
        vertical-align:middle;
        height:auto;
        padding:30px 15px 50px 15px;
        background:#fff !important;
        margin-bottom:30px
    }
    .service-half-wrapper.flip_right .service-half-image{
        left:0;
        position:initial;
        top:0;
        height:auto;
        width:100%
    }
    .service-half-wrapper.flip_right .service-half-text .text-white-box{
        display:block;
        vertical-align:middle;
        height:auto;
        padding:30px 15px 50px 15px;
        background:#fff !important;
        margin-bottom:30px
    }
}
@media screen and (max-width: 420px){
    .grid figure{
        max-height:150px !important
    }
    ul.partners_logo{
        list-style:none;
        display:table;
        margin:30px auto;
        padding:0;
        width:100%
    }
    ul.partners_logo li{
        display:inherit;
        padding:10px 20px !important;
        border:none;
        border-bottom:1px solid #333;
        margin:0;
        width:100%;
        float:none
    }
    ul.partners_logo li:last-child{
        width:100%;
        border-right:none;
        border-bottom:none
    }
}
@media screen and (max-width: 768px){
    #ot-primary-menu .sub-menu a{
        padding:0 10px;
        font-size:16px;
        line-height:24px;
        color:#bfbfbf !important;
        display:block;
        border-bottom:1px solid #222
    }
    #ot-primary-menu .sub-menu{
        padding:10px 0px 10px;
        background:none
    }
    #ot-primary-menu .sub-menu li.active a{
        color:#fff !important
    }
    #offcanvas-menu ul li > .sub-menu{
        margin-top:0px;
        padding-left:0px
    }
    #offcanvas-menu ul li a,#offcanvas-menu ul li a:hover,#offcanvas-menu ul li a:focus{
        font-size:16px;
        color:#7b7f33 !important;
        text-transform:uppercase
    }
    #offcanvas-menu ul li{
        padding:0;
        margin:0 0 15px 0;
        list-style:none
    }
    #ot-primary-menu .sub-menu a:hover{
        color:#fff !important;
        text-transform:none !important
    }
    body.ot-offcanvas #ot-wrapper{
        position:fixed !important;
        width:100%
    }
    body.ot-offcanvas #footer,body.ot-offcanvas #footer-socialicons{
        display:none
    }
    #offcanvas-menu ul li.active > a{
        color:#7b7f33
    }
    .sf-arrows .sf-with-ul:after{
        opacity:0
    }
    .domain_div{
        min-height:auto
    }
    #ot-features .feature-left{
        margin-bottom:0px !important
    }
    #ot-portfolio-list li a .case-studies-summary{
        opacity:1 !important;
       background: rgba(0, 0, 0, 0.6);
        margin: 0 !important;
        padding: 15px; 
    }

	#ot-portfolio-list li a:hover .case-studies-summary {
    width: auto;
        bottom: 0em !important;
    left: 0em !important;
    right: 0em !important;
    
}
	#ot-portfolio-list li a {
    padding:0 !important; 

}
	#ot-portfolio-list li a:hover:before {
    background:none !important;
    
}
    .home_service_bg{
        background:#222 !important;
    }
    .cs_detail_sec{
        background:#244c5a !important;
        margin-bottom:3em !important;
    }
    #ot-case-studies{
        padding:3em 0 0em 0
    }
    #ot-services{
        padding:4em 0 2em 0
    }
    #ot-domains{
        background:#e3e3e3;
        padding:3em 0 1em 0
    }
    #ot-career{
        padding:3em 0 2em 0
    }
    #latest_news ul li .carousel-control a.left{
        color:#fff !important
    }
    #latest_news ul li .carousel-control a.right{
        color:#fff !important
    }
    .service_header_img{
        background-image:url(../images/home_service_mb_bg.jpg)
    }
    .ot-cover.ot-cover_2{
        height:250px !important
    }
    .ot-cover.ot-hero-2,.ot-hero.ot-hero-2{
        height:250px !important
    }
}
@media screen and (max-width: 768px){
    .servList_mb{
        bottom:50%;
        position:absolute;
        width:100%;
        margin:-18px -18px -35px -18px
    }
    #cptch_val{
        font-size:28px !important;
        letter-spacing:5px !important;
        padding:0
    }
    .papper_plane_img{
        background-image:none !important
    }
}



@media screen and (max-width: 768px)
.ot-cover .desc h2 {
    margin-top: -30px !important;
}
}