<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link href="http://rainbowdesign.in/themes/Medini/css/owl.css" rel="stylesheet">
<link href="http://rainbowdesign.in/themes/Medini/css/jquery.fancybox.css" rel="stylesheet">
<section class="gallery-area section-padding">
<div class="container">
<div class="gallery-title centered">
<div class="section-title">
<h2>Our Gallery</h2>
</div>
<div class="title-text">
<p>Lorem ipsum dolor sit amet, consect etur adipis icing elit. Volupt atum ut alias ullam tempore nobis aspe lorem ipsum.</p>
</div>
</div>
</div>
<div class="container-fullid">
<div class="gallery-slider-area">
<div class="single-item-area">
<div class="img-box-area">
<figure><img src="http://rainbowdesign.in/themes/Medini/images/gallery/1.jpg" alt=""></figure>
<div class="overlay">
<div class="box">
<div class="content"> <a href="http://rainbowdesign.in/themes/Medini/images/gallery/1-1.jpg" class="lightbox-image"><i class="fa fa-plus" aria-hidden="true"></i></a>
<h5>Title Here</h5>
</div>
</div>
</div>
</div>
</div>
<div class="single-item-area">
<div class="img-box-area">
<figure><img src="http://rainbowdesign.in/themes/Medini/images/gallery/2.jpg" alt=""></figure>
<div class="overlay">
<div class="box">
<div class="content"> <a href="http://rainbowdesign.in/themes/Medini/images/gallery/2-2.jpg" class="lightbox-image"><i class="fa fa-plus" aria-hidden="true"></i></a>
<h5>Title Here</h5>
</div>
</div>
</div>
</div>
</div>
<div class="single-item-area">
<div class="img-box-area">
<figure><img src="http://rainbowdesign.in/themes/Medini/images/gallery/3.jpg" alt=""></figure>
<div class="overlay">
<div class="box">
<div class="content"> <a href="http://rainbowdesign.in/themes/Medini/images/gallery/3-3.jpg" class="lightbox-image"><i class="fa fa-plus" aria-hidden="true"></i></a>
<h5>Title Here</h5>
</div>
</div>
</div>
</div>
</div>
<div class="single-item-area">
<div class="img-box-area">
<figure><img src="http://rainbowdesign.in/themes/Medini/images/gallery/4.jpg" alt=""></figure>
<div class="overlay">
<div class="box">
<div class="content"> <a href="http://rainbowdesign.in/themes/Medini/images/gallery/4-4.jpg" class="lightbox-image"><i class="fa fa-plus" aria-hidden="true"></i></a>
<h5>Title Here</h5>
</div>
</div>
</div>
</div>
</div>
<div class="single-item-area">
<div class="img-box-area">
<figure><img src="http://rainbowdesign.in/themes/Medini/images/gallery/5.jpg" alt=""></figure>
<div class="overlay">
<div class="box">
<div class="content"> <a href="http://rainbowdesign.in/themes/Medini/images/gallery/5-5.jpg" class="lightbox-image"><i class="fa fa-plus" aria-hidden="true"></i></a>
<h5>Title Here</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<script src="http://rainbowdesign.in/themes/Medini/js/owl.carousel.min.js"></script>
<script src="http://rainbowdesign.in/themes/Medini/js/jquery.fancybox.pack.js"></script>
.gallery-area {
position: relative;
}
.gallery-area .single-item-area .img-box-area {
display: block;
overflow: hidden;
position: relative;
border: 1px solid #e5e5e5;
padding: 8px;
}
.gallery-area .single-item-area .img-box-area img {
position: relative;
width: 100%;
}
.single-item-area .img-box-area .overlay .box .content a i {
border: 2px solid #fff;
text-align: center;
color: #509E52;
display: inline-block;
font-size: 15px;
height: 55px;
line-height: 53px;
transition: all 500ms ease 0s;
width: 55px;
margin-bottom: 15px;
border-radius: 0;
}
.single-item-area:hover .img-box-area .overlay {
-webkit-transform: scale(1);
transform: scale(1);
}
.overlay .box .content {
display: table-cell;
text-align: center;
vertical-align: middle;
}
.overlay {
width: 96%;
height: 96%;
position: absolute;
top: 2%;
left: 2%;
-webkit-transform: scale(0);
transform: scale(0);
background: rgba(21, 34, 63, 0.75);
-webkit-transition: all 0.7s ease;
transition: all 0.7s ease;
}
.overlay .box {
display: table;
height: 100%;
width: 100%;
}
.gallery-area h5 {
color: #fff;
}
.gallery-area .owl-dots {
display: none !important;
}
.gallery-area .owl-theme .owl-controls {
display: block;
position: relative;
margin-top:10px;
text-align: center;
}
.gallery-area .owl-prev span, .gallery-area .owl-next span {
color: #848484;
}
.gallery-area .owl-prev:hover span, .gallery-area .owl-next:hover span {
color: #fff;
transition: all 500ms ease;
}
.section-padding {
padding: 80px 0px 80px 0px;
}
.centered {
text-align: center;
}
.section-title h2 {
position: relative;
font-weight: 700;
font-size:40px;
margin-bottom: 2px;
}
.title-text {
position: relative;
margin-bottom: 68px;
}
.title-text p {
font-size: 16px;
max-width: 650px;
color: #444;
margin:0 auto;
}
.title-text:before {
position: absolute;
content: '';
height: 5px;
border-bottom: 3px double #509E52;
width: 100px;
border-radius: 0px;
left: 0;
right: 0px;
margin: auto;
bottom: -18px;
}
@media (min-width:1200px) {
.container {
padding: 0px 0px;
}
}
(function($) {
"use strict";
//Hide Loading Box (Preloader)
$(window).on('load',function(){
var pre_loader = $('.preloader')
pre_loader.fadeOut('slow',function(){$(this).remove();});
});
//Update header style + Scroll to Top
$(window).on('scroll', function() {
if ($(window).scrollTop() > 117) {
$('.header-main').addClass('fixed-header');
$('.scroll-to-top').fadeIn(300);
} else {
$('.header-main').removeClass('fixed-header');
$('.scroll-to-top').fadeOut(300);
}
});
//Submenu Dropdown Toggle
if($('.header-main li.dropdown ul').length){
$('.header-main li.dropdown').append('<div class="dropdown-btn"><span class="fa fa-angle-down"></span></div>');
//Dropdown Button
$('.header-main li.dropdown .dropdown-btn').on('click', function() {
$(this).prev('ul').slideToggle(500);
});
//Disable dropdown parent link
$('.navigation li.dropdown > a').on('click', function(e) {
e.preventDefault();
});
}
//Accordion Box
if ($('.accordion-block').length) {
$('.accordion-block .accordion-btn').on('click', function() {
if ($(this).hasClass('active') !== true) {
$('.accordion-block .accordion-btn').removeClass('active');
}
if ($(this).next('.accordion-description').is(':visible')) {
$(this).removeClass('active');
$(this).next('.accordion-description').slideUp(500);
} else {
$(this).addClass('active');
$('.accordion-block .accordion-description').slideUp(500);
$(this).next('.accordion-description').slideDown(500);
}
});
}
// Scroll to a Specific Div
if($('.scroll-to-target').length){
$(".scroll-to-target").on('click', function() {
var target = $(this).attr('data-target');
// animate
$('html, body').animate({
scrollTop: $(target).offset().top
}, 1000);
});
}
//gallery-slider-area
$('.gallery-slider-area').owlCarousel({
loop:true,
margin:15,
nav:true,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
400:{
items:2
},
600:{
items:3
},
800:{
items:4
},
1200:{
items:5
}
}
});
// partner-slider
$('.partner-slider').owlCarousel({
loop:true,
margin:20,
nav:true,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
400:{
items:1
},
600:{
items:2
},
800:{
items:3
},
1200:{
items:5
}
}
});
//Four Column Carousel Slider
$('.four-column-carousel').owlCarousel({
loop:true,
margin:30,
nav:true,
smartSpeed: 2000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
600:{
items:2
},
800:{
items:3
},
1070:{
items:4
}
}
});
//Two Column Carousel Slider
$('.two-column-carousel').owlCarousel({
loop:true,
margin:30,
nav:true,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
480:{
items:1
},
600:{
items:1
},
800:{
items:2
},
1024:{
items:2
}
}
});
//Three Column Carousel Slider
$('.three-column-carousel').owlCarousel({
loop:true,
margin:30,
nav:true,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
480:{
items:1
},
600:{
items:2
},
800:{
items:2
},
1024:{
items:3
}
}
});
//testimonial-slider-area
$('.testimonial-slider-area').owlCarousel({
loop:true,
margin:30,
nav:true,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
480:{
items:1
},
600:{
items:2
},
800:{
items:2
},
1024:{
items:3
}
}
});
//team-slider-area
$('.team-slider-area').owlCarousel({
loop:true,
margin:30,
nav:true,
dots:false,
smartSpeed: 3000,
autoplay: 4000,
navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
responsive:{
0:{
items:1
},
480:{
items:1
},
600:{
items:2
},
800:{
items:2
},
1024:{
items:4
}
}
});
// Search Toggle Btn
if($('.toggle-search').length){
$('.toggle-search').on('click', function() {
$('.header-search-area').slideToggle(300);
});
}
//Custom Seclect Box
if($('.custom-select-box').length){
$('.custom-select-box').selectmenu().selectmenu('menuWidget').addClass('overflow');
}
//LightBox / Fancybox
if($('.lightbox-image').length) {
$('.lightbox-image').fancybox({
openEffect : 'elastic',
closeEffect : 'elastic',
helpers : {
media : {}
}
});
}
//=== Contact Form Validation ===
if($("#contact-form").length){
$("#contact-form").validate({
submitHandler: function(form) {
var form_btn = $(form).find('button[type="submit"]');
var form_result_div = '#form-result';
$(form_result_div).remove();
form_btn.before('<div id="form-result" class="alert alert-success" role="alert" style="display: none;"></div>');
var form_btn_old_msg = form_btn.html();
form_btn.html(form_btn.prop('disabled', true).data("loading-text"));
$(form).ajaxSubmit({
dataType: 'json',
success: function(data) {
if( data.status == 'true' ) {
$(form).find('.form-control').val('');
}
form_btn.prop('disabled', false).html(form_btn_old_msg);
$(form_result_div).html(data.message).fadeIn('slow');
setTimeout(function(){ $(form_result_div).fadeOut('slow') }, 6000);
}
});
}
});
}
// Fact Counter
$(window).on('scroll', function() {
if($('.fun-fact-counter').length){
$('.fun-fact-counter .column.animated').each(function() {
var $t = $(this),
n = $t.find(".count-text").attr("data-stop"),
r = parseInt($t.find(".count-text").attr("data-speed"), 10);
if (!$t.hasClass("counted")) {
$t.addClass("counted");
$({
countNum: $t.find(".count-text").text()
}).animate({
countNum: n
}, {
duration: r,
easing: "linear",
step: function() {
$t.find(".count-text").text(Math.floor(this.countNum));
},
complete: function() {
$t.find(".count-text").text(this.countNum);
}
});
}
});
}
});
// Scroll to a Specific Div
if($('.scroll-to-target').length){
$(".scroll-to-target").on('click', function() {
var target = $(this).attr('data-target');
// animate
$('html, body').animate({
scrollTop: $(target).offset().top
}, 10);
});
}
// Elements Animation
if($('.wow').length){
var wow = new WOW(
{
boxClass: 'wow', // animated element css class (default is wow)
animateClass: 'animated', // animation css class (default is animated)
offset: 0, // distance to the element when triggering the animation (default is 0)
mobile: false, // trigger animations on mobile devices (default is true)
live: true // act on asynchronously loaded content (default is true)
}
);
wow.init();
}
})(window.jQuery);