/*

Theme Name: jnj

Version: 1.0.0

*/
.jnj-services-meta .jnj-meta-field{
    display: flex;
    align-items: center;
}

.modal-dialog {
      max-width: 800px;
      margin: 30px auto;
  }



.modal-body {
  position:relative;
  padding:0px;
}
.close {
  position:absolute;
  right:-30px;
  top:0;
  z-index:999;
  font-size:2rem;
  font-weight: normal;
  color:#fff;
  opacity:1;
}
/* ==== Main CSS === */

.img-fill{

  width: 100%;

  display: block;

  overflow: hidden;

  position: relative;

  text-align: center

}



.img-fill img {

  min-height: 100%;

  min-width: 100%;

  position: relative;

  display: inline-block;

  max-width: none;

}



*,

*:before,

*:after {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.04);

}



.Grid1k {

  padding: 0 15px;

  max-width: 1200px;

  margin: auto;

}



.blocks-box,

.slick-slider {

  margin: 0;

  padding: 0!important;

}



.slick-slide {

  float: left /* If RTL Make This Right */ ;

  padding: 0;

}



/* ==== Slider Style === */

.Modern-Slider .item .img-fill{

  height:100vh;

  background:#000;

}



.Modern-Slider .item .img-fill .info{ padding: 0 200px;

  position:absolute;

  width:100%;

  height:100%;

  top:0px;

  left:0px;

  background:rgba(0,0,0,.50);

  line-height:100vh;

  text-align:center;

}



.Modern-Slider .item .img-fill img{

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}



.Modern-Slider .item .info > div{

  display:inline-block!important;

  vertical-align:middle;

}



.Modern-Slider .NextArrow{

  position:absolute;

  top:50%;

  right:0px;

  width:45px;

  height:45px;

  background:rgba(0,0,0,.50);

  border:0 none;

  margin-top:-22.5px;

  text-align:center;

  font:20px/45px FontAwesome;

  color:#FFF;

  z-index:5;

}





.Modern-Slider .PrevArrow{

  position:absolute;

  top:50%;

  left:0px;

  width:45px;

  height:45px;

  background:rgba(0,0,0,.50);

  border:0 none;

  margin-top:-22.5px;

  text-align:center;

  font:20px/45px FontAwesome;

  color:#FFF;

  z-index:5;

}



.Modern-Slider .slick-dots{

  position:absolute;

  height:5px;

  background:rgba(255,255,255,.20);

  bottom:0px;

  width:100%;

  left:0px;

  padding:0px;

  margin:0px;

  list-style-type:none;

}

.Modern-Slider .slick-dots li button{display:none;}

.Modern-Slider .slick-dots li{

  float:left;

  width:0px;

  height:5px;

  background:#d62828;

  position:absolute;

  left:0px;

  bottom:0px;

}



.Modern-Slider .slick-dots li.slick-active{

  width:100%;

  animation:ProgressDots 11s both;

}



.Modern-Slider .item h3{
    
    color: #fff;
    margin-bottom: 36px;


      position: relative;
    display: block;
    font-size: 50px;
    line-height: 60px;
    font-weight: 800;
    margin-bottom: 23px;
    -webkit-transform: translateX(100px);
    -moz-transform: translateX(100px);
    -ms-transform: translateX(100px);
    -o-transform: translateX(100px);
    transform: translateX(100px);
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 1000ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;

}



.Modern-Slider .item h5{

  margin:0;

  padding:0;


  color:#FFF;

  overflow:hidden;

  height:60px;

  animation:fadeOutLeft 1s both;

}



.Modern-Slider .item.slick-active h3{

  animation:fadeInDown 1s both 1s;

}



.Modern-Slider .item.slick-active h5{

  animation:fadeInLeft 1s both 1.5s;

}



.Modern-Slider .item.slick-active{

  animation:Slick-FastSwipeIn 1s both;

}



.Modern-Slider {background:#000;}



/* ==== Slider Image Transition === */

@keyframes Slick-FastSwipeIn{

    0%{transform:rotate3d(0,1,0,150deg) scale(0)  perspective(400px);} 

    100%{transform:rotate3d(0,1,0,0deg) scale(1) perspective(400px);} 

}



@-webkit-keyframes ProgressDots{from{width:0px;}to{width:100%;}}

@keyframes ProgressDots{from{width:0px;}to{width:100%;}}



/* ==== Slick Slider Css Ruls === */

.slick-slider{position:relative;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}

.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}

.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}

.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}

.slick-track{position:relative;top:0;left:0;display:block}

.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}

.slick-loading .slick-track{visibility:hidden}

.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}

.slick-slide.dragging img{pointer-events:none}

.slick-initialized .slick-slide{display:block}

.slick-loading .slick-slide{visibility:hidden}

.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}



    



























/* Pagination */

.pagination {

   clear:both;

   position:relative;

   font-size:11px; /* Pagination text size */

   line-height:13px;

   float:right; /* Pagination float direction */

}

.pagination span, .pagination a {

   display:block;

   float:left;

   margin: 2px 2px 2px 0;

   padding:6px 9px 5px 9px;

   text-decoration:none;

   width:auto;

   color:#fff; /* Pagination text color */

   background: #555; /* Pagination non-active background color */

   -webkit-transition: background .15s ease-in-out;

   -moz-transition: background .15s ease-in-out;

   -ms-transition: background .15s ease-in-out;

   -o-transition: background .15s ease-in-out;

   transition: background .15s ease-in-out;

}

.pagination a:hover{

   color:#fff;

   background: #6AAC70; /* Pagination background on hover */

}

.pagination .current{

   padding:6px 9px 5px 9px;

   background: #6AAC70; /* Current page background */

   color:#fff;

}