body {
 
  padding-bottom: 3rem;
  color: #ffffff;
}

footer a { color: #cccccc; text-decoration: none; }
footer { text-align: center; }
.pt-6 { padding-top: 100px; }
.carousel {
  margin-bottom: 4rem;
}
.fancybox-active{
  height: 100% !important;
}
.hidden_desk{ display: none; }

.btn-success {
	background: #22b573 !important;
}
.work { min-height: 400px; }
.link-white a{ color:#fff !Important; }
.slides p { margin-bottom: 0px !Important; font-size: 19px;  }
.slides li { list-style-type: none; text-align: center; margin-bottom: 25px; }
.slides li span {color: #ffbf00; font-size: 26px; }
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel-item {
  height: 32rem;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 32rem;
}


/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: 400;
}
/* rtl:begin:ignore */
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}
/* rtl:end:ignore */


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  /* rtl:remove */
  letter-spacing: -.05rem;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}



.feature {
  margin-bottom: 50px; }
  .feature-content {
    padding: 0 15px;
    margin-top: 30px; }
  .feature .icon {
    color: #e84545;
    font-size: 60px; }

/* ==========================================================================
	$Works
========================================================================== */
.work {
  -moz-box-shadow: 0 0 0 1px #fff;
  -webkit-box-shadow: 0 0 0 1px #fff;
  box-shadow: 0 0 0 1px #fff;
  min-height: 350px;
  overflow: hidden;
  position: relative;
  background-size: 100%;
  background-position: center center;
  
  
  }

.price-sec{
    background: #f9f8fa;
}

#price-slider{
    text-align: center;
}

.price-item{
    padding: 32px 22px;
    border-radius: 10px;
    max-width: 380px;
    margin: 80px 0 0 0;
    background: #fff;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.price{
    position: relative;
    display: inline-block;
    float: left;
    margin-right: 15px;
	margin-top: -20px;
}

.price-tag{
    padding: 15px 0;
    text-align:left;
    border-top: 2px solid rgba(111, 123, 133, 0.18);
    border-bottom: 2px solid rgba(111, 123, 133, 0.18);
}
.price-text{
    font-size: 13px !important;
    font-weight: 300;
   
   
}

.blocks .col-md-4 .block {
    margin-bottom: 25px;
    outline: 1px solid #ddd;
    margin: 6px;
    padding: 15px;
	background: #fff;
}

.price .sign{
    font-size: 32px  !important;
    font-weight: 500;
    vertical-align: super;
    padding-right: 5px;
}
.price .currency{
    font-size: 50px  !important;
    font-weight: 400;
    letter-spacing: -2px;
	display: inline;
    padding: 0;
    vertical-align: middle;
}
.price .month{
    font-size: 14px;
    font-weight: 300;
    display: block;
    text-align: right;
    padding-right: 8px;
    padding-top: 8px;
}
ul.packages{
    padding:20px 0;
    margin: 0;
}
ul.packages li {
    font-size: 13px;
    font-weight: 400;
    line-height: 40px;
    list-style-type: none;
    color: #161922;
}
ul.packages li i {
    display: inline-block;
    width: 24px;
    padding-right: 5px;
}

ul.packages li i.fa-check{
    color: #ff573b;
}

ul.packages li i.fa-times{
    color: #e04645;
}

  
.bg-white { color: #000 !important; background: #f9f8fa !important; }
strong {
    margin-left: 14px;
    margin-right: 14px;
}
  .text-center{ text-align: center; }
.work2 {

  min-height: 200px !important;
  }  
  .work .overlay {
   background: rgba(0, 0, 0, 0.5);
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    -moz-transition: opacity, 0.3s;
    -o-transition: opacity, 0.3s;
    -webkit-transition: opacity, 0.3s;
    transition: opacity, 0.3s; }
  .work .overlay-caption {
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%); 
	
	}
  .work , .work p, .work img {
    -moz-transition: all, 0.5s;
    -o-transition: all, 0.5s;
    -webkit-transition: all, 0.5s;
    transition: all, 0.5s; }
  .work h5, .work p {
    color: #fff;
    margin: 0;
    opacity: 0; }
  .work h5 {
    margin-bottom: 5px;
    -moz-transform: translate3d(0, -200%, 0);
    -ms-transform: translate3d(0, -200%, 0);
    -webkit-transform: translate3d(0, -200%, 0);
    transform: translate3d(0, -200%, 0); }
  .work p {
    -moz-transform: translate3d(0, 200%, 0);
    -ms-transform: translate3d(0, 200%, 0);
    -webkit-transform: translate3d(0, 200%, 0);
    transform: translate3d(0, 200%, 0); }

.work:hover  {
  
  background-size: 120%;

  }
.work-box:hover .overlay {
  opacity: 1; }
  .work-box:hover .overlay h5, .work-box:hover .overlay p {
    opacity: 1;
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); }



#portfolio section {
	border: 2px solid #888888;
    margin-bottom: 20px;
    padding: 10px;
    box-shadow: 2px 2px 1px;
}




.masonry {
  transition: all .5s ease-in-out;
  column-gap: 30px;
  column-fill: initial;
}

/* Masonry item */
.masonry .brick {
  margin-bottom: 30px;
  display: inline-block; /* Fix the misalignment of items */
  vertical-align: top; /* Keep the item on the very top */
}
@media only screen and (min-width: 600px) {
.brick { min-width: calc(100% /3); min-height: 400px;   }

}


/* Masonry image effects */
.masonry .brick img {
  transition: all .5s ease-in-out;
  backface-visibility: hidden; /* Remove Image flickering on hover */
}

.masonry .brick:hover img {
  opacity: .75;
}



/* Gutterless masonry */
.masonry.gutterless {
  column-gap: 0;
}

.masonry.gutterless .brick {
  margin-bottom: 0;
}

/* Masonry on tablets */
@media only screen and (min-width: 400px) and (max-width: 1023px) {
  .group-banner-masonry .grid-sizer,
.banner-masonry-item{
    width: calc(100% / 2);
	padding: 6px;
}	
	
.btn-green { display: block; width: 100%;
margin-bottom: 8px; }
	
  .masonry {
    column-count: 2;
  }
}       

/* Masonry on big screens */
@media only screen and (min-width: 1024px) {

.group-banner-masonry .grid-sizer,
.banner-masonry-item{
    width: calc(100% / 7);
	padding: 6px;
}


  .masonry {
    column-count: 3;
  }
}

.img-fluid { max-width: 100% !Important; }
@keyframes wiggle {
    0% { transform: rotate(0deg); }
   80% { transform: rotate(0deg); }
   85% { transform: rotate(5deg); }
   95% { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}

.wiggle {
  display: inline-block;
  animation: wiggle 1.5s ;
}

.wiggle:hover {
  animation: none;
}

  
.bg-wh {background: #fff !important; }
.hidden_mobs { position: fixed; right: 50px; z-index: 9999; }
.hidden_mobs a { -webkit-border-radius: 0; 
-moz-border-radius: 0;
border-radius: 0;  }
@media only screen and (max-width: 1024px) { 
	.hidden_mob { display: none; }
	.hidden_desk { display: block; width: 100%; position: fixed; bottom: 0px;  }
	.hidden_desk1 { width: 50%; left: 0px;  }
	.hidden_desk2 { width: 50%; right: 0px;  }
	.hidden_desk button { width: 100%;  -webkit-border-radius: 0; 
-moz-border-radius: 0;
border-radius: 0;  background: #111111; color: #fff;  }
}


  
#vaisu {
	font-size: 59px;
	position: fixed;
	bottom: 20px;   
	left: 20px;  
	color: #333333;
	cursor: pointer;
}