@import url(masterslider.css);
@import url(ms-vertical.css);
@import url(jquery.fancybox.css);









/*** 

====================================================================
    gallery-section Style
====================================================================

***/


.dde{
	max-width: 175px;
    border: 2px solid black;
    padding: 12px;
    margin: 79px 0 0 0;
}
 

.gallery-section{
  position: relative;
}
.gallery-section .section-title h3{
  background: url(../images/icons/bd2.html)scroll center bottom;
  background-repeat: no-repeat;
  font-size: 36px;
  color: #222222;
  font-weight: 700;
  font-family: 'Rasa', serif;
  line-height: 44px;
  margin-bottom: 25px;
}
.gallery-section .section-title p{
  font-size: 16px;
  line-height: 26px;
  color: #777777;
  font-weight: 400;
  font-family: 'Assistant', sans-serif;
  margin-bottom: 50px;
}
.gallery-section .link-btn a{
  position: relative;
  font-family: 'Rasa', serif;
  font-weight: 600;
  margin-top: 20px;
  font-size: 16px;
  color: #ffffff;
  line-height: 26px;
  height: 40px;
  padding: 7px 40px;
  background: #f8b239;
  display: inline-block;
  transition:all 500ms ease;
}
.gallery-section .link-btn a:hover{
  color: #ffffff;
  background: #181d37;
  transition:all 500ms ease;
}

.gallery-section .inner-box {
  position: relative;
  margin-bottom: 5px;
  overflow: hidden;
  display: block;
}
.gallery-section .inner-box img{
  width: 100%;
  
}
.sortable-masonry .masonry-item{
  padding:0px 15px;
}
.gallery-section .masonry-item .overlay-box {
  visibility: hidden;
  background: rgba(0, 0, 0, 0.8);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0%;
  right: 100%;
  transition: 0.5s ease;
}

.gallery-section .masonry-item:hover .overlay-box {
  visibility: visible;
  position: absolute;
  display:block;
  width: 100%;
  height: 100%;
  transition: .5s ease;
  right: 0%;
  top: -15px;
}

.gallery-section .masonry-item .overlay-inner {
  position: relative;
  top: 50%;
  margin-top: -30px;
}

.gallery-section .image-link h5{
  font-family: 'Rasa', serif;
  font-weight: 500;
  font-size: 18px;
  color: #ffffff;
  line-height: 28px;
  margin-bottom: 15px;
}
.gallery-section .image-link span{
  padding: 10px;
  border: 1px solid #f8b239;
}
.gallery-section .image-link span:before{
  margin-left: 0px;
  font-size: 14px;
  color: #ffffff;
}


/*** 

====================================================================
  Gallery Popup style
====================================================================

***/


body.popup-visible{
  overflow:hidden;
}

.gallery-box{
  position:fixed;
  left:0px;
  top:-120%;
  width:100%;
  height:100%;
  overflow:auto;
  padding:0px;
  z-index:9999;
  visibility:hidden;
  opacity:0;
  -webkit-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out; 
}

.gallery-box.now-visible{
  top:0px;
  visibility:visible;
  opacity:1;  
}

.gallery-box .bg-fade-layer{
  position:fixed;
  left:0px;
  top:0px;
  width:100%;
  height:100%;
  background:rgba(21,21,21,0.80); 
}

.gallery-box .popup-header{
  position:relative;
  padding:5px 30px;
  background: #f8b239;
  color:#ffffff;
}

.gallery-box .popup-header .btn-close{
  position:absolute;
  top:5px;
  right:30px;
  color:#ffffff;
  width:30px;
  height:30px;
  background: #181d37;
  opacity:1;
  font-size:14px;
  line-height:30px;
  padding:0px;
  display:block;
  border:none;
  z-index:1;
}

.gallery-box .popup-header .close:hover{
  background:#999999; 
}

.gallery-box .popup-header h3{
  position:relative;
  font-size:20px;
  text-align:center;
  line-height:30px;
  color:#ffffff;
  margin-bottom:0;
  font-weight:500;
  text-transform:capitalize;
}

.gallery-box .popup-container{
  margin:50px auto;
  width:auto;
  max-width:1070px;
  padding:0px 15px;
}

.gallery-box .content-outer{
  position:relative;
  padding:5px 5px;
  background:#ffffff; 
}

.vertical-slider-outer{
  position:relative;
}
.ms-tabs-vertical-template .ms-nav-next {
    background: #f8b239;
    right: 0px;
    width: 35px;
    height: 35px;
    top: 48%;
    line-height: 35px;
    position: absolute;
}
.ms-tabs-vertical-template .ms-nav-next:hover {
    background: #181d37;
}
.ms-tabs-vertical-template .ms-nav-prev {
    background: #f8b239;
    left: 0px;
    width: 35px;
    height: 35px;
    top: 48%;
    line-height: 35px;
    position: absolute;
}
.ms-tabs-vertical-template .ms-nav-prev:hover {
    background: #181d37;
}