/*Responsive Styles*/



/*Targeted Device max-width 1200*/









@media all and (min-width: 1170px) {



  body.left-header-layout {

    padding-left: 280px;

  }

  body.left-header-layout .jr-site-header {

    height: 100vh;

    position: fixed;

    top: 0;

    left: 0;

    background-color: grey;

    max-width: 280px;

  }

  body.left-header-layout .jr-site-header .row {

    height: 100vh;

  }

  body.left-header-layout .jr-site-header [class*="col-md-"] {

    flex: 0 0 100%;

    max-width: 100%;

    align-self: center;

  }

  body.left-header-layout .jr-site-header .col-md-3 {

    margin-top: auto;

    margin-bottom: 50px;

  }

  body.left-header-layout .jr-site-header .col-md-9 {

    margin-bottom: auto;

  }

  body.left-header-layout .jr-site-header .menu-main ul {

    width: 100%;

    padding-left: 0;

  }

  body.left-header-layout .jr-site-header .menu-main ul li {

    float: none;

    width: 100%;

    margin-left: 0;

    text-align: left;

  }

  body.left-header-layout .jr-site-footer {

    padding-left: 280px;

  }

  body.left-header-layout .skill-bar-percent {

    right: 22px;

    top: -5px;

  }

  body.left-header-layout .top_slider .slide1 .flex_caption1 {

    margin-left: -500px;

  }

  body.left-header-layout #carousel {

    right: 0;

  }

  

  body.right-header-layout {

    padding-right: 280px;

  }

  body.right-header-layout .jr-site-header {

    height: 100vh;

    position: fixed;

    top: 0;

    left: auto;

    right: 0;

    background-color: grey;

    max-width: 280px;

  }

  body.right-header-layout .jr-site-header .logo-holder {

    text-align: right;

  }

  body.right-header-layout .jr-site-header .row {

    height: 100vh;

  }

  body.right-header-layout .jr-site-header [class*="col-md-"] {

    flex: 0 0 100%;

    max-width: 100%;

    align-self: center;

  }

  body.right-header-layout .jr-site-header .col-md-3 {

    margin-top: auto;

    margin-bottom: 50px;

  }

  body.right-header-layout .jr-site-header .col-md-9 {

    margin-bottom: auto;

  }

  body.right-header-layout .jr-site-header .menu-main ul {

    width: 100%;

    padding-left:0; 

  }

  body.right-header-layout .jr-site-header .menu-main ul li {

    float: none;

    width: 100%;

    margin-left: 0;

    text-align: right;

  }

  body.right-header-layout .jr-site-footer {

    padding-right: 280px;

  }

  body.right-header-layout .skill-bar-percent {

    right: 22px;

    top: -5px;

  }

  body.right-header-layout .top_slider .slide1 .flex_caption1 {

    margin-left: -500px;

  }

  body.right-header-layout #carousel {

    right: 0;

  }

}



/*Targeted Device max-width 1200===========================================================*/



@media all and (max-width: 1200px){



  body{

    overflow-x: hidden;

  }



  .container-large{

    max-width: 95%;

    width: 100%;

  }



  



    nav ul li{

      padding: 0 12px;

    }



    .skill-bar-percent{

      right:0;

      top:0;

    }



    .quail-component{

      margin-left: 0;

      margin-right: 0;

    }



  }





/*Targeted Device max-width 1020 ===========================================================*/



@media all and (max-width: 1020px){



.flexslider.top_slider .slides .slide1{ background-attachment:scroll!important;}



  .mobile-menu{

    display: block;

  }

  .nav.menu-main{

    left: 0;

  }



body.box-layout {

  width: 100%;

  max-width: 1280px;

  margin: 0 auto;

  background-color: rgba(0, 0, 0, 0.14);

}



body.box-layout .jr-site-header {

  max-width: 1280px;

  left: auto;

}



body.box-layout .jr-site-footer {

  width: 100%;

  max-width: 1280px;

  margin: 0 auto;

  left: auto;

  right: auto;

}



.compo-service-body{

  grid-template-columns: repeat(autofill, minmax(300px, 1fr));

}



body.box-layout #carousel {

  right: 0;

}



.top_slider .slide1 .flex_caption1 {

    padding-left:20px;

    padding-right: 20px;

  }

  .flexslider.top_slider .flex-direction-nav{

    margin-left: 20px;

  }



  .banner-nav{

    display: none;

  }



  .flex-direction-nav.container,

  .banner-caption {

      width: 1200px;

      max-width: 100%;

    }





     .body-wrapp section:nth-last-child(2) {

    margin-bottom: 0 !important;

  }

  .share-this {

    margin-left: 0;

  }





.post-list-view .article-img-wrap {

  margin-right: 40px;

}



.banner-caption{

  display: flex;

  height: 100%;

  align-items:center;

  position: relative;

}



.top_slider .slide1 .flex_caption1{

  position: absolute;

  left: 0;

  top:50%;

  margin-left: 0;

}



.mobile-menu {

  display: block;

  height: 30px;

  width: 30px;

  cursor: pointer;

  position: fixed;

  top: 45px;

  right: 14px;

  z-index: 999;

 

}

.mobile-menu span {

  display: block;

  height: 1px;

  width: 100%;

  margin-bottom: 8px;

  background-color: white;

  transition: all 0.4s ease;

  -ms-transition: all 0.4s ease;

  -webkit-transition: all 0.4s ease;

  -moz-transition: all 0.4s ease;

}

.mobile-menu.collapse-menu span:first-child {

  transform: rotate(45deg);

  margin-top: 12px;

}

.mobile-menu.collapse-menu span:nth-child(2) {

  opacity: 0;

}

.mobile-menu.collapse-menu span:last-child {

  transform: rotate(-45deg);

  margin-top: -18px;

}

nav.menu-main {

  display: none;

  position: fixed;

  width: 100%;

  height: calc(100vh - 20px);

  height: -webkit-calc(100vh - 20px);

  overflow-y: auto;

  top: 100px;

  left:0;

  right: 0;

  background-color: rgba(0, 0, 0, 0.94);

  padding: 20px 10px;

}

nav.menu-main ul {

  margin-left: 0;

  width: 100%;

}

nav.menu-main ul li {

  border-radius: 0;

  display: block;

  margin: 0;

  padding: 0 15px;

  width: 100%;

  text-align: left;

}



.container-large{

  flex-wrap: wrap;

}



.panel-grid-cell{

  width: 100% !important;

  flex: 0 0 100%;

}



.compo-home-blog .compo-body{

  grid-template-columns: repeat(2, 1fr);

}





.content-all .row{

  margin: 0;

}



.post-masonry-view.has-sidebar .postGrid{

  -webkit-column-count: 2; /* Chrome, Safari, Opera */

  -moz-column-count: 2; /* Firefox */

  column-count: 2;



}



.post-masonry-view.no-sidebar .postGrid{

  -webkit-column-count: 2; /* Chrome, Safari, Opera */

  -moz-column-count: 2; /* Firefox */

  column-count: 2;

 

}





}





/*Targeted Device max-width 767============================================================*/



@media all and (max-width: 767px){



  .top_slider .slide1 .flex_caption1 .title2, .top_slider .slide1 .flex_caption1 .title3{

    font-size: 28px !important;

    line-height: 115%;

  }



  .flex_caption1 a.custom-btn {

    margin-top: 10px;

}



    .flex-direction-nav{

    display:none;

  }

  .flexslider.top_slider,

  .flexslider.top_slider li{

    height:350px;

  }

  .top_slider .slide1 .flex_caption1{

    top:50%;

  }

  

  .top_slider .slide1 .flex_caption1 .title4{

    line-height:25px;

    font-size:22px;

  }

  

.top_slider .slide1 .flex_caption1 .title1,.top_slider .slide1 .flex_caption1 .title2, .top_slider .slide1 .flex_caption1 .title3{

    line-height:30px; 

    margin-bottom:10px;

  }

  .banner-caption a.deafBtn{

    margin-top:15px;

  }

  



  .container-large{

    max-width: 100%;

    width: 100%;

  }



  .flex-box{

    flex-wrap: wrap;

  }

  .compo-divider-body a,

  .compo-divider-body.inline-btn a,

 {

    margin: 0;

    margin-top: 30px;

  }



  .banner-caption a.deafBtn{

    margin: 0;

    margin-top: 10px;

  }



  .top_slider .slide1 .flex_caption1 .title4{

    margin-bottom: 10px;

  }



  .compo-counter .compo-body{

    display: block;

  }

  .milestone-counter{

   padding-bottom: 40px;

    max-width: 100%;

    min-width: 100%;

  }



	.jr-site-footer {

    position: static !important;

  }

  .jr-site-footer .footerCol {

    flex: 0 0 100%;

    -webkit-flex: 0 0 100%;

    padding-bottom: 20px;

  }



  .body-wrapp{

    margin-bottom: 0 !important;

  }



  .article-wrap{

    flex-wrap:wrap;

  }

  .post-list-view .article-img-wrap{

    margin-right: 0;

  }



  .compo-service-body{

    grid-template-columns: repeat(1, 1fr);

  }



  .is-sidebar{

    margin-top: 30px;

  }



  #primary-menu {

    width: 100%;

  }



  

  .flexslider.top_slider {

    min-height: 100%;

  }

  .jr-site-footer .footerCol:first-child {

    padding-left: 40px;

  }



  .jr-site-footer .footerCol:last-child{

    padding-right: 40px;

  }



  .compo-home-blog .compo-body{

    grid-template-columns: 1fr;

  }

  

  .compo-home-blog .compo-body .article-wrap:first-child {

    grid-column: span 1;

    grid-row: span 1;

}



.logo-holder{

  padding-left: 20px;

}





.inner-page  .article-wrap .article-img-wrap,

.jr-site-blog-list .article-wrap .article-img-wrap{

  margin-right: 0;

}

#primary-menu li.woocommerce-cart{

  display: inline-block;

  width: auto;

}



.article-wrap{

  display: block;

}

.article-wrap .comments{

  margin-left: 0;

  display: block;

}



.aGrid,

[class*="col_"],

.sml-info-contact {

  display: block

}





.top_slider .slide1 .flex_caption1 .title2, 

.top_slider .slide1 .flex_caption1 .title3, 

.top_slider .slide1 .flex_caption1 .title1{font-size: 40px;}



.content-all{

  padding: 40px 20px;

}



.compo-text-image-video-body .video-part{

  max-width: 100%;

}



.two-col .cols{

  grid-column: span 2;

}





.post-masonry-view.has-sidebar .postGrid{

  -webkit-column-count: 1; /* Chrome, Safari, Opera */

  -moz-column-count: 1; /* Firefox */

  column-count: 1;

  column-gap: 0;

}



.post-masonry-view.no-sidebar .postGrid{

  -webkit-column-count: 1; /* Chrome, Safari, Opera */

  -moz-column-count: 1; /* Firefox */

  column-count: 1;

  column-gap: 0;

}



 	

}

