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

/*------- Common CSS Starts -------*/

body.active { overflow: hidden; }
.container-fluid { padding: 15px 15px 0; }
.section-heading > h2 { font-size: 2.4rem; margin-bottom: 25px; }
.section-heading > h2::before,
.section-heading > h2::after { display: none; }
p { font-size: 1.6rem; text-align: justify; }
.dvs-slick-slider .slick-prev { height: 30px; left: -5px; width: 30px; z-index: 8; }
.dvs-slick-slider .slick-next { height: 30px; right: -5px; width: 30px; z-index: 8; }
.dvs-slick-slider .slick-prev::before,
.dvs-slick-slider .slick-next::before { font-size: 3rem; }
.d-block-mobile { display: block; }

/*------- Common CSS Ends -------*/

/*------- Coming Soon Page Starts -------*/

.bg-coming-soon::after { height: 35vh; }
.coming-soon-logo > img { width: 120px; }
.coming-soon-text > h1 { font-size: 3.6rem; letter-spacing: 4px; }
.coming-soon-contact-address { bottom: 15%; }
.coming-soon-contact-address > h4,
.coming-soon-contact-address > h5 { font-size: 1.6rem; width: 90%; }
.coming-soon-camera { bottom: -15px; left: -15px; }
.coming-soon-camera > img { width: 125px; }

/*------- Coming Soon Page Ends -------*/

/*------- Home Page Starts -------*/

  /*------- Mobile Header Section Starts -------*/

.bg-header-mobile { background-color: transparent; display: block; left: 0; padding: 15px 15px 10px; position: absolute; top: 0; width: 100%; z-index: 10; }
.header-logo-mobile { display: -webkit-inline-flex; display: -webkit-inline-box; display: inline-flex; }
.header-logo-mobile > a { display: inline-block; }
.header-logo-mobile > a > img { height: 60px; }

    /*------- Mobile Hamburger Menu Section Starts -------*/

.burger-menu { background-color: transparent; cursor: pointer; height: 50px; margin-left: auto; position: relative; width: 50px; }
.burger-menu span { background-color: #000000; height: 2px; left: 50%; position: absolute; top: 50%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: 0.5s linear 0.5s; -moz-transition: 0.5s linear 0.5s; -ms-transition: 0.5s linear 0.5s; -o-transition: 0.5s linear 0.5s; transition: 0.5s linear 0.5s; width: 25px; }
.burger-menu span::before,
.burger-menu span::after { background-color: #000000; content: ""; height: 2px; position: absolute; top: 10px; -webkit-transition: 0.5s linear; -moz-transition: 0.5s linear; -ms-transition: 0.5s linear; -o-transition: 0.5s linear; transition: 0.5s linear; width: 25px; }
.burger-menu span::before { top: -10px; }
.burger-menu.active span { background-color: transparent; -webkit-transition: 0s linear; -moz-transition: 0s linear; -ms-transition: 0s linear; -o-transition: 0s linear; transition: 0s linear; }
.burger-menu.active span::before { background-color: #ffffff; top: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.burger-menu.active span::after { background-color: #ffffff; top: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }

    /*------- Mobile Hamburger Menu Section Ends -------*/

  /*------- Mobile Header Section Ends -------*/

  /*------- Mobile Menu Section Starts -------*/

.fixed-mobile-menu { display: block; }
.fixed-mobile-menu::before {
  background-color: #000000;
  content: "";
  height: 0;
  left: 0;
  position: fixed;
  top: 0;
  -webkit-transition: 1s ease 1s;
  -moz-transition: 1s ease 1s;
  -ms-transition: 1s ease 1s;
  -o-transition: 1s ease 1s;
  transition: 1s ease 1s;
  width: 100%;
  z-index: 9;
}
.fixed-mobile-menu::after {
  background-color: #000000;
  bottom: 0;
  content: "";
  height: 0;
  left: 0;
  position: fixed;
  -webkit-transition: 1s ease 1s;
  -moz-transition: 1s ease 1s;
  -ms-transition: 1s ease 1s;
  -o-transition: 1s ease 1s;
  transition: 1s ease 1s;
  width: 100%;
  z-index: 9;
}
.fixed-mobile-menu.active::before,
.fixed-mobile-menu.active::after {
  height: 50%;
  -webkit-transition: 1s ease;
  -moz-transition: 1s ease;
  -ms-transition: 1s ease;
  -o-transition: 1s ease;
  transition: 1s ease;
}
.menu-listing-header { left: 50%; opacity: 0; position: fixed; top: 45%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); -webkit-transition: 1s ease 0s; -moz-transition: 1s ease 0s; -ms-transition: 1s ease 0s; -o-transition: 1s ease 0s; transition: 1s ease 0s; visibility: hidden; z-index: 11; }
.menu-listing-header.active { opacity: 1; top: 50%; -webkit-transition: 1s ease 1s; -moz-transition: 1s ease 1s; -ms-transition: 1s ease 1s; -o-transition: 1s ease 1s; transition: 1s ease 1s; visibility: visible; }
.menu-listing-header > li { display: block; margin-bottom: 20px; }
.menu-listing-header > li:last-child { margin-bottom: 0; }
.menu-listing-header > li > a { color: #ffffff; display: block; font: 1.8rem/1.2 "Cocomat-Light"; text-transform: uppercase; }
.menu-listing-header > li.active > a,
.menu-listing-header > li > a:hover { color: #ffc107; }

  /*------- Mobile Menu Section Ends -------*/

  /*------- Header Section Starts -------*/

.bg-header { display: none; }

  /*------- Header Section Ends -------*/

  /*------- Our Services Section Starts -------*/

.our-services-img-info-home { height: 300px; margin: 0 auto 30px; width: 300px; }
.our-services-img-info-home > img { height: 300px; width: 300px; }
.our-services-info-home > h4 > a { font-size: 1.8rem; margin-bottom: 20px; padding: 15px; }

  /*------- Our Services Section Ends -------*/

  /*------- Our Team Section Starts -------*/

.our-team-img-info-home { margin-bottom: 30px; }
.our-team-info-home { background-color: #cccccc; margin: 0 30px; padding: 15px; }
.our-team-info-home > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-home > h5 { font-size: 1.8rem; }

  /*------- Our Team Section Ends -------*/

  /*------- Our Blog Section Starts -------*/

.bg-our-blogs-home { padding: 15px; }
.box-blog-info-home > p > span:last-child { display: block; margin-top: 10px; padding-left: 0; }
.box-blog-info-home > h6 { font-size: 1.6rem; }

  /*------- Our Blog Section Ends -------*/

  /*------- Footer Section Starts -------*/

.bg-footer { padding: 15px; }
.footer-info > p { font-size: 1.6rem; text-align: left; }
.footer-info > h2 { font-size: 3rem; margin-bottom: 20px; text-align: left; }
.footer-info > h2 > span { display: inline; }
.read-more-wwu-foo > a { margin: 15px 0 30px; }
.footer-contact-info > p:first-child { font-size: 2rem; margin-bottom: 20px; }
.footer-contact-info > p:nth-child(2),
.footer-contact-info > p:nth-child(3) { font-size: 1.6rem; }
.footer-contact-info > p:nth-child(3) { margin-bottom: 20px; }
.footer-contact-info h4 { font-size: 1.8rem; margin-bottom: 15px; padding-bottom: 15px; }
.footer-social-listing { margin-top: 20px; }
.footer-social-listing > li > a { font-size: 1.6rem; }
.footer-address-border-right { border-right: 0; margin-bottom: 20px; }

  /*------- Footer Section Ends -------*/

/*------- Home Page Ends -------*/

/*------- About Page Starts -------*/

  /*------- About Us Section Starts -------*/

.about-section-heading-ap > h2 { margin-bottom: 30px; }
.about-logo-ap { margin: 0 auto 30px; }
.about-logo-ap > img { margin: 0 auto 30px; width: 100px; }
.about-info-ap > p { margin-bottom: 20px; }
.social-listing-ap > li > a { font-size: 1.6rem; }

  /*------- About Us Section Ends -------*/

  /*------- Team Section Starts -------*/

.bg-team-ap { padding: 30px 15px 0; }
.our-team-img-info-ap { margin-bottom: 20px; }
.our-team-info-ap > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-ap > h5 { font-size: 1.8rem; }
.our-team-info-ap > h5 > span { display: block; margin-top: 5px; }
.our-team-desc-ap > p { margin-bottom: 15px; }
.our-team-desc-ap > p:first-child { margin-top: 30px; }
.our-team-desc-ap > p:last-child { margin-bottom: 30px; }

  /*------- Team Section Ends -------*/

  /*------- Clients Section Starts -------*/

.col-offset-1-point-5 { margin-left: 25%; }
.clients-images-ap { margin-bottom: 20px; }

  /*------- Clients Section Ends -------*/

/*------- About Page Ends -------*/

/*------- Work Page Starts -------*/

  /*------- Short Films Section Starts -------*/

.short-films-section-heading-wp > h2::before { width: 35%; }
.short-films-section-heading-wp > h2::after { width: 35%; }
.corporate-films-section-heading-wp > h2::before { width: 30%; }
.corporate-films-section-heading-wp > h2::after { width: 30%; }
.documentaries-section-heading-wp > h2::before { width: 33%; }
.documentaries-section-heading-wp > h2::after { width: 33%; }
.interior-design-films-section-heading-wp > h2::before { width: 27%; }
.interior-design-films-section-heading-wp > h2::after { width: 27%; }
.add-films-section-heading-wp > h2::before { width: 38%; }
.add-films-section-heading-wp > h2::after { width: 38%; }
.stop-motion-films-section-heading-wp > h2::before { width: 29%; }
.stop-motion-films-section-heading-wp > h2::after { width: 29%; }
.twod-animation-section-heading-wp > h2::before { width: 35%; }
.twod-animation-section-heading-wp > h2::after { width: 35%; }
.photography-section-heading-wp > h2::before { width: 35%; }
.photography-section-heading-wp > h2::after { width: 35%; }
.music-section-heading-wp > h2::before { width: 42%; }
.music-section-heading-wp > h2::after { width: 42%; }
.bts-section-heading-wp > h2::before { width: 44%; }
.bts-section-heading-wp > h2::after { width: 44%; }
.box-short-films-img-wp > img { padding: 10px; width: 100%; }

  /*------- Short Films Section Ends -------*/

/*------- Work Page Ends -------*/

/*------- Blog Details Page Starts -------*/

.blog-details-info-bdp > p { margin-bottom: 15px; }
.blog-details-info-bdp > div > h2 { margin-bottom: 15px; }
.blog-details-info-bdp > h5 { font-size: 1.8rem; margin-bottom: 15px; }
.blog-details-info-bdp > img { margin-bottom: 15px; }
.blog-details-info-bdp > h3 { font-size: 2.4rem; margin-bottom: 15px; }

/*------- Blog Details Page Ends -------*/

/*------- Contact Us Page Starts -------*/

  /*------- Contact Form Section Starts -------*/

.bg-contact-form-info-cp { padding: 15px; }
.contact-form-info-heading > h4 { font-size: 2.2rem; }
.contact-listing-cp > li { margin: 0 0 40px 0; }
.contact-listing-cp > li > span:first-child { margin: 0 auto 30px; }
.box-form-cp { margin-bottom: 20px; padding: 20px; }
.display-map-home { margin-top: 20px; }

  /*------- Contact Form Section Ends -------*/

/*------- Contact Us Page Ends -------*/

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

/*------- Common CSS Starts -------*/

.container-fluid { padding: 30px 15px 0; }
.section-heading > h2 { font-size: 3rem; margin-bottom: 30px; }
.section-heading > h2::before,
.section-heading > h2::after { display: none; }
.dvs-slick-slider .slick-prev { height: 30px; left: -10px; width: 30px; }
.dvs-slick-slider .slick-next { height: 30px; right: -10px; width: 30px; }
.dvs-slick-slider .slick-prev::before,
.dvs-slick-slider .slick-next::before { font-size: 4rem; }

/*------- Common CSS Ends -------*/

/*------- Coming Soon Page Starts -------*/

.bg-coming-soon::after { height: 50vh; }
.coming-soon-logo > img { width: 120px; }
.coming-soon-text > h1 { font-size: 7rem; letter-spacing: 7px; }
.coming-soon-contact-address > h4,
.coming-soon-contact-address > h5 { font-size: 1.8rem; width: 90%; }
.coming-soon-camera { bottom: -30px; left: -30px; }
.coming-soon-camera > img { width: 120px; }

/*------- Coming Soon Page Ends -------*/

/*------- Home Page Starts -------*/

  /*------- Header Section Starts -------*/

.bg-header { padding: 15px; }
.header-logo > a > img { width: 100px; }
.menu-listing-desktop > li { margin-right: 50px; }

  /*------- Header Section Ends -------*/

  /*------- Our Services Section Starts -------*/

.our-services-img-info-home { height: 300px; width: 300px; }
.our-services-img-info-home > img { height: 300px; width: 300px; }
.our-services-info-home > h4 > a { font-size: 2.4rem; }

  /*------- Our Services Section Ends -------*/

  /*------- Our Team Section Starts -------*/

.our-team-info-home { background-color: #cccccc; margin: 0 30px; padding: 15px; }
.our-team-info-home > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-home > h5 { font-size: 1.8rem; }

  /*------- Our Team Section Ends -------*/

  /*------- Our Blog Section Starts -------*/

.bg-our-blogs-home { padding: 30px 15px; }
.box-blog-info-home > p > span:last-child { display: block; margin-top: 10px; padding-left: 0; }
.box-blog-info-home > h6 { font-size: 1.6rem; }

  /*------- Our Blog Section Ends -------*/

  /*------- Footer Section Starts -------*/

.bg-footer { padding: 30px 15px; }
.footer-info > p { font-size: 1.8rem; }
.footer-info > h2 { font-size: 4rem; margin-bottom: 10px; }
.read-more-wwu-foo > a { margin: 15px 0 0; }
.footer-contact-info > p:first-child { margin-bottom: 15px; }
.footer-contact-info > p:nth-child(2),
.footer-contact-info > p:nth-child(3) { font-size: 1.8rem; }
.footer-social-listing > li > a { font-size: 1.8rem; }
.footer-address-border-right { border-right: 0; margin-bottom: 40px; }

  /*------- Footer Section Ends -------*/

/*------- Home Page Ends -------*/

/*------- About Page Starts -------*/

  /*------- About Us Section Starts -------*/

.about-section-heading-ap > h2 { margin-bottom: 30px; }
.about-logo-ap > img { margin: 0 auto; }
.about-info-ap > p { margin-bottom: 30px; text-align: justify; }

  /*------- About Us Section Ends -------*/

  /*------- Team Section Starts -------*/

.bg-team-ap { padding: 30px 15px 0; }
.our-team-img-info-ap { margin-bottom: 15px; }
.our-team-info-ap > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-ap > h5 { font-size: 1.8rem; }
.our-team-info-ap > h5 > span { display: block; margin-top: 5px; }
.our-team-desc-ap > p { margin-bottom: 15px; text-align: justify; }
.our-team-desc-ap > p:last-child { margin-bottom: 30px; }

  /*------- Team Section Ends -------*/

/*------- About Page Ends -------*/

/*------- Work Page Starts -------*/

  /*------- Short Films Section Starts -------*/

.bg-bts-wp { padding: 30px 15px 30px; }

  /*------- Short Films Section Ends -------*/

/*------- Work Page Ends -------*/

/*------- Contact Us Page Starts -------*/

  /*------- Contact Form Section Starts -------*/

.bg-contact-form-info-cp { padding: 15px; }
.contact-form-info-heading > h4 { font-size: 2.4rem; }
.contact-listing-cp { display: block; }
.contact-listing-cp > li { margin: 0 0 50px 0; }
.contact-listing-cp > li > span:first-child { margin: 0 auto 30px; }
.box-form-cp { padding: 20px; }
.display-map-home { margin-top: 85px; }
.display-map { height: 390px; }

  /*------- Contact Form Section Ends -------*/

/*------- Contact Us Page Ends -------*/

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

/*------- Common CSS Starts -------*/

.container-fluid { padding: 30px 15px 0; }
.section-heading > h2 { font-size: 3rem; margin-bottom: 30px; }
.section-heading > h2::before,
.section-heading > h2::after { display: none; }
.dvs-slick-slider .slick-prev { height: 30px; left: -10px; width: 30px; }
.dvs-slick-slider .slick-next { height: 30px; right: -10px; width: 30px; }
.dvs-slick-slider .slick-prev::before,
.dvs-slick-slider .slick-next::before { font-size: 4rem; }

/*------- Common CSS Ends -------*/

/*------- Coming Soon Page Starts -------*/

.bg-coming-soon::after { height: 50vh; }
.coming-soon-logo > img { width: 120px; }
.coming-soon-text > h1 { font-size: 7rem; letter-spacing: 7px; }
.coming-soon-contact-address > h4,
.coming-soon-contact-address > h5 { font-size: 1.8rem; width: 90%; }
.coming-soon-camera { bottom: -30px; left: -30px; }
.coming-soon-camera > img { width: 120px; }

/*------- Coming Soon Page Ends -------*/

/*------- Home Page Starts -------*/

  /*------- Header Section Starts -------*/

.bg-header { padding: 15px; }
.header-logo > a > img { width: 100px; }
.menu-listing-desktop > li { margin-right: 50px; }

  /*------- Header Section Ends -------*/

  /*------- Our Services Section Starts -------*/

.our-services-img-info-home { height: 300px; width: 300px; }
.our-services-img-info-home > img { height: 300px; width: 300px; }
.our-services-info-home > h4 > a { font-size: 2.4rem; }

  /*------- Our Services Section Ends -------*/

  /*------- Our Team Section Starts -------*/

.our-team-info-home { background-color: #cccccc; margin: 0 30px; padding: 15px; }
.our-team-info-home > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-home > h5 { font-size: 1.8rem; }
.our-team-info-home > h5 > span { display: block; margin-top: 5px; }

  /*------- Our Team Section Ends -------*/

  /*------- Our Blog Section Starts -------*/

.box-blog-info-home > p > span:last-child { display: block; margin-top: 10px; padding-left: 0; }
.box-blog-info-home > h6 { font-size: 1.6rem; }

  /*------- Our Blog Section Ends -------*/

  /*------- Footer Section Starts -------*/

.bg-footer { padding: 30px 15px; }
.footer-info > p { font-size: 1.8rem; }
.footer-info > h2 { font-size: 4rem; margin-bottom: 10px; }
.read-more-wwu-foo > a { margin: 15px 0 0; }
.footer-contact-info > p:first-child { margin-bottom: 15px; }
.footer-contact-info > p:nth-child(2),
.footer-contact-info > p:nth-child(3) { font-size: 1.8rem; }
.footer-social-listing > li > a { font-size: 1.8rem; }
.footer-address-border-right { border-right: 0; margin-bottom: 40px; }

  /*------- Footer Section Ends -------*/

/*------- Home Page Ends -------*/

/*------- About Page Starts -------*/

  /*------- About Us Section Starts -------*/

.about-section-heading-ap > h2 { margin-bottom: 30px; }
.about-logo-ap > img { margin: 0 auto; }
.about-info-ap > p { margin-bottom: 30px; text-align: justify; }

  /*------- About Us Section Ends -------*/

  /*------- Team Section Starts -------*/

.bg-team-ap { padding: 30px 15px 0; }
.our-team-img-info-ap { margin-bottom: 15px; }
.our-team-info-ap > h4 { font-size: 2.4rem; margin-bottom: 10px; }
.our-team-info-ap > h5 { font-size: 1.8rem; }
.our-team-info-ap > h5 > span { display: block; margin-top: 5px; }
.our-team-desc-ap > p { margin-bottom: 15px; text-align: justify; }
.our-team-desc-ap > p:last-child { margin-bottom: 30px; }

  /*------- Team Section Ends -------*/

  /*------- Our Blog Section Starts -------*/

.bg-our-blogs-home { padding: 30px 15px; }

  /*------- Our Blog Section Ends -------*/

/*------- About Page Ends -------*/

/*------- Work Page Starts -------*/

  /*------- Short Films Section Starts -------*/

.bg-bts-wp { padding: 30px 15px 30px; }

  /*------- Short Films Section Ends -------*/

/*------- Work Page Ends -------*/

/*------- Contact Us Page Starts -------*/

  /*------- Contact Form Section Starts -------*/

.bg-contact-form-info-cp { padding: 30px 15px; }
.contact-form-info-heading > h4 { font-size: 2.4rem; }
.box-form-cp { padding: 20px; }
.display-map-home { margin-top: 85px; }
.display-map { height: 390px; }

  /*------- Contact Form Section Ends -------*/

/*------- Contact Us Page Ends -------*/

}