/*
Template: Effacy - Creative One Page Template
Author: ThemeBite
Author URI: http://themebite.com/
Version: 1.0
Designed and Developed by: ThemeBite
*/
/*
Template: Effacy - Creative One Page Template
Author: ThemeBite
Author URI: http://themebite.com/
Version: 1.0
Designed and Developed by: ThemeBite
*/


/*
====================================
[ CSS TABLE OF CONTENT ]
------------------------------------
    1.0 - Base Styles
    2.0 - Typography
    3.0 - Global Style
    4.0 - Navigation
    5.0 - Hero Section
    6.0 - About Us Section
    7.0 - Testimonial Section
    8.0 - Creative Section
    9.0 - Awards Section
    10.0 - Pricing And Plans Section
    10.0 - Our Partners Section
    11.0 - Blog Section
    12.0 - Contact Section
    13.0 - Google Map Section
    14.0 - Footer Section
-------------------------------------
[ END CSS TABLE OF CONTENT ]
=====================================
*/

/* ============================
    Base Styles
=============================== */
body{
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
    color: #333333;
    background-color: #fff;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    -webkit-overflow-scrolling: touch;
    -webkit-font-smoothing: antialiased !important;
}


html,
body {
    width: 100%;
    height: 100%;
}


/* link styles */
a {
    color: #FF9800;
}
a,
a > * {
    outline: none;
    cursor: pointer;
    text-decoration: none;
}
a:focus,
a:hover {
    color: #FF9800;
    outline: none;
    text-decoration: none;
}
.product-card h6{
	font-size:18px !important;
	line-height:28px !important;
letter-spacing:0.3rem;
    text-transform: capitalize !important;}
 .insta-video-section {
      width: 100%;
      padding: 20px 0;
    }

    .insta-video-carousel .item {
      overflow: hidden;
      border-radius: 12px;
    }

    .insta-video-carousel video {
      width: 100%;
      height: 100%;
      aspect-ratio: 9 / 16; /* Instagram Reel ratio */
      object-fit: cover;
      display: block;
    }

/* Transition elements
/* ------------------------------ */
.navbar a,
.form-control {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease; 
}

a,
.btn {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
#qLpercentage {
    font-family: 'Roboto', sans-serif;
    font-weight: 800;
}

/* Reset Box Shadow */

.btn,
.form-control,
.form-control:hover,
.form-control:focus,
.navbar-custom .dropdown-menu {
    box-shadow: none;
}


button:focus {
    outline: none !important;
}


/* ============================
    Typography
=============================== */

h1, h2, h3, h4, h5, h6{
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    margin: 0 0 15px;
    color: #333333;
}

h1 {
    font-size: 50px;
    line-height: 65px;
}

h2 {
    font-size: 30px;
}

h3 {
    font-size: 20px;
    line-height: 25px;
    text-transform: uppercase;
}

h4 {
    font-size: 18px;
    line-height: 20px}

h5 {

}

h6 {

}
.logo {
    padding: 32px 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.is-sticky .logo {
  padding: 16px 0;
}

.logo h2{
    font-family: "Montserrat",sans-serif;
    font-size: 24px;
    padding: 0;
    text-transform: uppercase;
}


/* Button
/* ------------------------------ */
.btn {
    padding: 14px 45px;
}
.btn:focus,
button:focus {
    outline: none !important;
}



/* =-=-=-=-=-=-= List Style =-=-=-=-=-=-= */

ul {
    margin:0;
    padding:0;
    list-style: none;
}

.unorder-list {
    list-style: inherit;
}


/* Form Style
/* ------------------------------ */
.form-group {
    margin-bottom: 20px;
}
.form-control {
  background-color: transparent;
  border: 1px solid #fff;
  border-radius: 2px;
  color: #fff;
  font-size: 13px;
  font-weight: normal;
  height: 42px;
  line-height: 21px;
  padding: 10px;
  -webkit-transition: all 0.3s ease-in-out 0s;
          transition: all 0.3s ease-in-out 0s;
  letter-spacing: 1px;
  letter-spacing: 1px;
  letter-spacing: 0.1rem;
}
.form-control::-webkit-input-placeholder {
    color: #fff;
}
.form-control::-moz-placeholder {
    color: #fff;
}
.form-control:-ms-input-placeholder {
    color: #fff;
}
.form-control::placeholder {
    color: #fff;
}


/* ============================
    Global Styles
=============================== */

.section-padding {
    padding: 130px 0;
}
.morphext > .animated {
    display: inline-block;
}

.section-title {
    font-size: 30px;
    line-height: 30px;
    color: #333333;
    margin-bottom: 50px;
    text-transform: uppercase;
    letter-spacing: 3px;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
    position: relative;
}
.section-title-left {
    font-size: 30px;
    line-height: 30px;
    color: #333333;
    margin-bottom: 50px;
    text-transform: uppercase;
    letter-spacing: 3px;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
    position: relative;
}
.section-title-left:after {
  bottom: -15px;
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  width: 65px;
}
.section-title:after {
  bottom: -20px;
  content: "";
  height: 4px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  width: 65px;
}
.testimoinal-title {
    color: #fff;
    line-height: 35px;
}


.row-content{
    margin-top: 80px;
}

/*custom margin classes*/

/*margin top*/
.mt-30 {
    margin-top: 30px;
}
.mt-50 {
    margin-top: 50px;
}
.mt-80 {
    margin-top: 80px;
}
.mt-100 {
    margin-top: 100px;
}

/*margin bottom*/
.mb-30 {
    margin-bottom: 30px;
}
.mb-60 {
    margin-bottom: 60px;
}
.mb-80 {
    margin-bottom: 80px;
}

/*custom padding classes*/

.no-padding {
    padding: 0!important;
}

/*padding-bottom*/
.pb-20 {
    padding-bottom: 20px;
}
.pb-30 {
    padding-bottom: 30px;
}
.pb-50 {
    padding-bottom: 50px;
}
.pt-100 {
    padding-top: 100px;
}
.pb-100 {
    padding-bottom: 100px;
}

/*padding top bottom*/
.ptb-50 {
    padding: 50px 0;
}
.ptb-90 {
    padding: 90px 0;
}

.gutter {
    padding-left: 10px!important;
    padding-right: 10px!important;
}


/*vertical middle align*/
.vertical-middle {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    padding: 0 15px;
}


/* ============================
    Navigation
=============================== */
.header-area {
    z-index: 20;
}
.navbar-custom {
    background-color: #fff;
    border: 0;
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: 0px 3px 6px 3px rgba(0,0,0,0.06);
    z-index: 1111;
}


.navbar-custom .nav li > a {
    color: #464d58;
    font-size: 15px;
    font-weight: 500;
    padding: 35px 20px;
    position: relative;
    -webkit-transition: all 0.2s ease-in-out 0s;
            transition: all 0.2s ease-in-out 0s;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 20px;
}

.navbar-collapse {
    max-height: 340px;
}

.navbar-custom .navbar-toggle .icon-bar {
    background: #fff;
}

/* ============================
    Hero Section
=============================== */
.hero-section {
    position: relative;
    width: 100%;
    height: 100vh;
    max-height: 290px !important;

}
.slider-caption {
    left: 0;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
        -ms-transform: translate(0%, -50%);
            transform: translate(0%, -50%);
    width: 100%;
    z-index: 15;
}


.hero-parallax-bg {
    background: url("../img/bg/parallax/parallax-1.jpg") no-repeat fixed center center / cover ;
}
.hero-particle-bg {
    background: url("../img/bg/particle/particle-2.jpg") no-repeat scroll center center / cover ;
}
.text-rotator-bg {
    background: url("../img/bg/text-rotator/rotator-bg1.jpg") no-repeat fixed center center / cover ;
}
.hero-parallax-bg:before , .hero-particle-bg:before , .text-rotator-bg:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
}
.slider-caption h1 , #main-slide .item.active .slider-content h1 {
  font-size: 72px;
  letter-spacing: 3px;
  letter-spacing: 3px;
  letter-spacing: 0.2rem;
  margin-bottom: 25px;
}
.slider-caption h5 , #main-slide .item.active .slider-content h5  {
    color: #3f3f3f;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
}
.hero-parallax-bg .slider-caption h1 , .hero-parallax-bg .slider-caption h5 , .hero-particle-bg .slider-caption h1 , .hero-particle-bg .slider-caption h5 , .text-rotator-bg .slider-caption h5 {
    color: #fff;
}
.text-rotator-bg h1 {
    font-family: 'Roboto', sans-serif;
}
/* Paricle BG */
#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
}
/* Slideshow
================================================== */

/*-- Main slide --*/

#main-slide .item img{
    width: 100%;
    position: relative;
}
#main-slide .carousel-inner .item:after {
  background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
#main-slide .item.active .slider-content h1 , #main-slide .item.active .slider-content h5 {
    color: #fff;
}
#main-slide .item .slider-content {
  z-index: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 100ms;
  transition: opacity 100ms;
  text-transform: uppercase;
}
#main-slide .item.active .slider-content {
  z-index: 1;
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transition: opacity 100ms;
  transition: opacity 100ms;
  text-transform: uppercase;
}

#main-slide .slider-content{
    top: 40%;
    margin-top: -50px;
    left: 0;
    padding: 0;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    color: #fff;
}


#main-slide .carousel-control.left,
#main-slide .carousel-control.right {
    opacity: 1;
    filter: alpha(opacity=100);
    background-image: none;
    background-repeat: no-repeat;
    text-shadow: none;
}

#main-slide .carousel-control.left span {
    padding: 15px;
}

#main-slide .carousel-control.right span {
    padding: 15px;
}
#main-slide .carousel-control {
    top: 40%;
    width: 50px;
    height: 50px;
}
#main-slide .carousel-control .fa-angle-left, 
#main-slide .carousel-control .fa-angle-right{
    position: absolute;
    z-index: 5;
    display: inline-block;
}

#main-slide .carousel-control .fa-angle-left{
    left: 0;
}

#main-slide .carousel-control .fa-angle-right{
    right: 0;
}

#main-slide .carousel-control i{
    background: #000;
    line-height: 36px;
    font-size: 32px;
    padding: 15px 20px;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
}

#main-slide .carousel-control i:hover{
    color: #fff;
}

/*-- Hero Carousel Animation --*/

.carousel .item.active .animated2 {
    -webkit-animation: lightSpeedIn 1s ease-in 200ms both;
    animation: lightSpeedIn 1s ease-in 200ms both;
}

.carousel .item.active .animated3 {
    -webkit-animation: bounceInLeft 1s ease-in-out 500ms both;
    animation: bounceInLeft 1s ease-in-out 500ms both;
}

.carousel .item.active .animated4 {
    -webkit-animation: flipInX 1s ease-in 500ms both;
    animation: flipInX 1s ease-in 500ms both;
}

.carousel .item.active .animated5 {
    -webkit-animation: bounceInLeft 1s ease-in-out 100ms both;
    animation: bounceInLeft 1s ease-in-out 100ms both;
}

.carousel .item.active .animated6 {
    -webkit-animation: bounceIn 1s ease-in 500ms both;
    animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated7 {
    -webkit-animation: bounceIn 1s ease-in 500ms both;
    animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated8 {
    -webkit-animation: bounceInDown 1s ease-in 800ms both;
    animation: bounceInDown 1s ease-in 800ms both;
}

/* Carousel Fade Effect */
.carousel-fade .carousel-inner .item {
    max-height: 700px;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-transition-property: opacity;
            transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}
.carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .item:after {
    background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.carousel-fade .carousel-control {
    z-index: 20;
}


/* ============================
    About Us
=============================== */
.about-us-left {
    padding: 100px 40px 60px 107px;
}
.about-us-right {
    background: #1f1f1f none repeat scroll 0 0;
    padding: 60px 110px 60px 75px;
}
.about-us-right .media {
    margin-top: 40px;
}
.about-us-right .media::first-child {
    margin-top: 0px;
}

.about-us-right .media .fa:before {
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 30px;
    height: 60px;
    line-height: 59px;
    text-align: center;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
    width: 60px;
}
.dotted .fa:after {
    background: #5e5e5e none repeat scroll 0 0;
    content: "";
    height: 80px;
    left: 104px;
    position: absolute;
    width: 1px;
}
.about-us-right .media:hover  .fa:before {
        border: 1px solid transparent;
        color: #fff;
}
.about-us-right .media-heading {
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    margin-bottom: 15px;
}

.about-us-right .media p {
    color: #808080;
    font-size: 16px;
    line-height: 25px;
}
.about-us-right .media-body {
  padding: 0 20px;
}



/* ============================
    Our Services
=============================== */
.single-service .media .fa:before {
  border-radius: 50%;
  color: #fff;
  display: block;
  font-size: 30px;
  height: 90px;
  line-height: 87px;
  text-align: center;
  -webkit-transition: all 0.2s ease-in-out 0s;
          transition: all 0.2s ease-in-out 0s;
  width: 90px;
}
.our-services {
    margin-top: 30px;
}
.single-service .media .media-left {
  padding-right: 30px;
}
.single-service {
    margin-top: 28px;
}
.single-service .media {
    border: 2px solid #ededed;
    border-radius: 5px;
    padding: 30px 40px;
    -webkit-transition: all 0.2s ease-in-out 0s;
            transition: all 0.2s ease-in-out 0s;
}
.single-service .media-body h3 {
    position: relative;
    margin-bottom: 25px;
}
.single-service .media-body h3:after {
  background: #d9d9d9 none repeat scroll 0 0;
  bottom: -15px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 40px;
}
.single-service .media .media-body > p {
    font-size: 14px;
    line-height: 24px;
}
.single-service .media:hover {
    border: 2px solid transparent;
    cursor: pointer;
}
.single-service .media:hover .fa:before {
    background-color: #fff;
}
.single-service .media:hover h3:after {
    background: #fff;
}
.single-service .media:hover h3 , .single-service .media:hover p {
    color: #fff;
}


/* ============================
    Testimonial Section
=============================== */
.testimonial-section {
    position: relative;
    width: 100%;
    background: url("../img/bg/testimonial-bg.jpg") no-repeat scroll center center / cover;
}
.testimonial-parallax-bg {
    background: url("../img/bg/testimonial-bg.jpg") no-repeat fixed center center / cover;
}
.testimonial-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.8);
}
.testimonial-body p , .testimonial-body .client-name a b {
    color: #fff;
}
.testimonial-body p {
    line-height: 25px;
}
.testimonial-body .client-name a b {
    font-size: 16px;
    text-transform: capitalize;
}
.client-name {
  padding-top: 15px;
  position: relative;
}
.client-name:before {
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 12px;
  width: 30px;
}
.testimonial-body {
    position: relative;
    padding-top: 40px;
}
.testimonial-body:before {
  content: "";
  font-family: FontAwesome;
  font-size: 25px;
  left: 0;
  position: absolute;
  top: 0;
}
.testimonial-image img {
    box-shadow: 0px 9px 9px 0px rgba(0,0,0,0.64);
    z-index: 1111;
}
#testimonial-carousel .item img{
    display: block;
}
#testimonial-carousel {
    position: relative;
}
#testimonial-carousel .owl-controls {
    bottom: -50px;
    position: absolute;
    right: 22%;    
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev, #testimonial-carousel .owl-controls .owl-buttons .owl-next {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #88888a;
    border-radius: 100%;
    color: #88888a;
    cursor: pointer;
    display: inline-block;
    height: 32px;
    line-height: 24px;
    opacity: 1;
    filter: alpha(opacity=100);
    text-align: center;
    text-shadow: none;
    top: auto;
    width: 32px;
    -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
}


/* ============================
    Portfolio Section
=============================== */
.custom-nav ul {
    margin-top: 0;
}
.portfolio-filter-nav ul li {
    border-radius: 3px;
    display: block;
    float: left;
    margin: 0 5px 30px;
}
.portfolio-filter-nav ul li {
    color: #515151;
    font-size: 16px;
    font-weight: 500;
    padding: 5px 12px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    text-transform: uppercase;
}
.portfolio-filter-nav ul li:hover {
    cursor: pointer;
    color: #fff;
}
.portfolio-filter-nav ul li.active {
    color: #fff;
}
.portfolio-showcase {
  margin-top: 20px;
}
.portfolio-showcase #grid {
    width: 100%
}
.portfolio-showcase #grid .thumbnails {
    float: left;
    height: auto;
    margin: 0;
    width: 25%;

}
.portfolio-showcase #grid .thumbnails a {
  display: inline-block;
  float: left;
  height: 100%;
  line-height: 0;
  text-decoration: none;
  width: 100%;
  position: relative;
}
.portfolio-showcase #grid .thumbnails a img {
    display: block;
    position: relative;
    width: inherit;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}

.portfolio-button button.portfolio-btn {
    text-transform: uppercase;
    background-color: transparent;
    font-weight: 500;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.portfolio-button button.portfolio-btn:hover {
    color: #fff;
    border: 2px solid transparent;
}
.thumbnails span.portfolio-overlay {
    background: transparent none repeat scroll 0 0;
    color: #fff;
    display: block;
    height: 100%;
    position: absolute;
    text-align: center;
    top: 0;
    -webkit-transition: all 0.5s ease 0s;
            transition: all 0.5s ease 0s;
    width: 100%;

}
.thumbnails span.portfolio-overlay .fa {
    color: transparent;
    height: 30px;
    left: 50%;
    line-height: 30px;
    margin-left: -15px;
    margin-top: -15px;
    position: absolute;
    top: 60%;
    -webkit-transition: all 0.5s ease 0s;
            transition: all 0.5s ease 0s;
    width: 30px;
    font-size: 28px;
}
.thumbnails:hover span.portfolio-overlay {
    opacity: 0.9;
    filter: alpha(opacity=90);
}
.thumbnails:hover span.portfolio-overlay .fa {
    color: #fff;
    top: 50%;
}

/* Simple LightBox Arrow */
button.sl-prev .fa, button.sl-next .fa {
    font-size: 35px !important;
    font-weight: bold;
}

/* ============================
    Awards Section
=============================== */
.our-awards-section {
    background: url("../img/bg/awards-bg.jpg") no-repeat fixed center center / cover;
    width: 100%;
    position: relative;
}
.our-awards-section:before {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.7);
}

.our-awards-section strong span {
    font-family: 'Roboto', sans-serif;
    color: #fff;
    display: block;
    font-weight: 500;
    font-size: 38px;
    line-height: 48px;
}
span.count-description {
    color: #fff;
    display: block;
    font-size: 16px;
    line-height: 40px;
    text-transform: uppercase;
}
.awards-counter {
    padding: 60px 0;
}
.awards-counter .fa {
    color: #fff;
    font-size: 40px;
    margin-bottom: 20px;
}


/* ============================
    Pricing And Plans Section
=============================== */

.single-pricing-table {
    border: 1px solid #e7e7e7;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .price {
    width: 120px;
    height: 120px;
    display: inline-block;
    border: 1px solid #e3e3e3;
    border-radius: 50%;
    padding: 30px;
    margin: 30px 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .price h1 {
    font-family: 'Roboto', sans-serif;
    font-size: 23px;
    font-weight: 400;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .pricing-title h2 {
    color: #5b5b5b;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 20px;
    position: relative;
}
.single-pricing-table .pricing-title {
    margin-bottom: 30px;
}
.single-pricing-table .pricing-title h2:after {
  bottom: -10px;
  content: "";
  height: 2px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  width: 40px;
}
.single-pricing-table .package-item {
    padding: 0 30px;
}
.single-pricing-table .package-item ul li {
    border-bottom: 1px dashed #e7e7e7;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    padding: 5px 0;
}
.single-pricing-table .pricing-buttons {
    margin: 30px 0;
    position: relative;
}
.single-pricing-table .pricing-buttons button.buy-btn {
    background-color: transparent;
    border: 1px solid #9b9b9b;
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 800;
    padding: 5px 45px;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}

.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    color: #fff;
    border: 1px solid transparent;
}
.single-pricing-table:hover .price h1 , .table-active .price h1 {
    color: #fff;
}
.single-pricing-table:hover , .table-active {
    box-shadow: 0px 5px 14px -3px rgba(0,0,0,0.61);
    cursor: pointer;
}


/* ============================
    Our Partners Section
=============================== */
.our-partners-section {
box-shadow: inset 0px 2px 25px -8px rgba(0,0,0,0.76);
}

.our-partners-section .item img {
    height: 70px;
    width: 110px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.our-partners-section img:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    cursor: pointer;
}
.our-partners-section .item {
    padding: 80px 0;
}


/* ============================
    Blog Section
=============================== */
.blog-post-details .post-heading a h2 {
    text-transform: uppercase;
    color: #292929;
    font-weight: 700;
    font-size: 22px;
    letter-spacing: 1px;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}

.blog-post-details .post-heading em , .blog-post-details .post-heading em a {
    font-style: italic;
    color: #808080;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
}
.blog-post-details p {
    color: #808080;
    font-size: 16px;
}
.blog-post-details button.read-more-btn {
    border: medium none;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    padding: 5px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
}
.blog-post-details button.read-more-btn:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}
#blog-post-carousel .owl-pagination {
    bottom: 0;
    position: absolute;
    right: 32%;
}

/* ============================
    Contact Us Section
=============================== */
.contact-us-section {
    position: relative;
    width: 100%;
    background: url("../img/bg/contact-bg.jpg") no-repeat scroll center center / cover;
}
.contact-parallax-bg {
    background: url("../img/bg/contact-bg.jpg") no-repeat fixed center center / cover;
}
.contact-title , .contact-subtitle {
    color: #fff;
}
.contact-subtitle {
    position: relative;
}
.contact-us-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.6);
}
.contact-form-section {
    position: relative;
    padding: 60px 50px;
}
.contact-form-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 5px;
}
.contact-form-section button.btn-contact {
    border: 0;
    font-weight: 500;
    padding: 5px 55px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
}
.btn-contact .fa {
  padding-right: 5px;
}
.contact-form-icon {
    position: relative;
}
.contact-form-icon .fa {
  color: #ffffff;
  padding: 14px 12px;
  pointer-events: none;
  position: absolute;
}
.contact-form-icon input, .contact-form-icon textarea {
  padding-left: 35px;
}
.contact-form-section button.btn-contact:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}




/* ============================
    Google Map Section
=============================== */
.goolge-map-section .toggle-map-button button.gmap-btn {
    text-transform: uppercase;
    color: #fff;
    background: #1f1f1f;
    font-size: 16px;
    border: none;
    padding: 20px 0;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}

.goolge-map-section .toggle-map-button button.gmap-btn .fa {
    padding-left: 10px;
 }
#gmap-wrapper { 
    height: 350px;
}

/* ============================
    Footer Section
=============================== */
.footer-section {
    background: #000;
}
.footer-section .copyright-info a {
    color: #fff;
    font-size: 16px;
    letter-spacing: 1px;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}
.social-icons a .fa {
    background: #343434 none repeat scroll 0 0;
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    margin: 0 2px;
    padding: 10px 12px;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
    vertical-align: middle;
}



.sl-overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    opacity: .7;
    display: none;
    z-index: 1006
}

.sl-wrapper {
    z-index: 1000
}

.sl-wrapper button {
    border: 0;
    background: 0 0;
    font-size: 24px;
    padding: 0;
    cursor: pointer
}

.sl-wrapper button:hover {
    opacity: .7
}

.sl-wrapper .sl-close {
    display: none;
    position: fixed;
    right: 30px;
    top: 30px;
    z-index: 1015
}

.sl-wrapper .sl-counter {
    display: none;
    position: fixed;
    top: 30px;
    left: 30px;
    z-index: 1015
}

.sl-wrapper .sl-navigation {
    width: 100%;
    display: none
}

.sl-wrapper .sl-navigation button {
    position: fixed;
    top: 50%;
    margin-top: -10px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    display: block;
    z-index: 1015;
    font-family: arial sans-serif
}

.sl-wrapper .sl-navigation button.sl-next {
    right: 40px
}

.sl-wrapper .sl-navigation button.sl-prev {
    left: 40px
}

.sl-wrapper .sl-image {
    position: fixed;
    -ms-touch-action: none;
    touch-action: none;
    z-index: 10000
}

.sl-wrapper .sl-image img {
    margin: 0;
    padding: 0;
    display: block
}

.sl-wrapper .sl-image .sl-caption {
    display: none;
    padding: 10px;
    color: #fff;
    background: #000;
    opacity: .8;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.sl-wrapper .sl-image .sl-download {
    display: none;
    position: absolute;
    bottom: 5px;
    right: 5px;
    color: #fff;
    z-index: 1005
}

.sl-spinner {
    display: none;
    border: 5px solid #333;
    border-radius: 40px;
    height: 40px;
    left: 50%;
    margin: -20px 0 0 -20px;
    opacity: 0;
    position: fixed;
    top: 50%;
    width: 40px;
    z-index: 1007;
    -webkit-animation: pulsate 1s ease-out infinite;
    -moz-animation: pulsate 1s ease-out infinite;
    -ms-animation: pulsate 1s ease-out infinite;
    -o-animation: pulsate 1s ease-out infinite;
    animation: pulsate 1s ease-out infinite
}

.sl-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@-webkit-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-moz-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-o-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-ms-keyframes pulsate {

    0%,
    100% {
        opacity: 0
    }

    0% {
        transform: scale(.1)
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2)
    }
}
span {
	color: #FF9800;
}
.navbar-custom .navbar-toggle {
    background: #FF9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #FF9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #FF9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #FF9800;
}
.single-service .media .fa::before {
  background: #FF9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #FF9800;
}
.single-service .media:hover .fa::before {
    color: #FF9800;
}
.testimonial-body::before {
  color: #FF9800;
}
.client-name::before {
  background: #FF9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #FF9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #FF9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #FF9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #FF9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #FF9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #FF9800;
}
.blog-post-details .post-heading em a {
	color: #FF9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #FF9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #FF9800;
}
.social-icons a .fa:hover {
    background: #FF9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #FF9800;
    color: #FF9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color:#FF9800;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #FF9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #FF9800;
}
.contact-form-section button.btn-contact {
	background-color:#FF9800;
}
#main-slide .carousel-control i {
    color: #FF9800;
}
#main-slide .carousel-control i:hover{
    background: #FF9800;
}

span {
	color: #FF9800;
}
.navbar-custom .navbar-toggle {
    background: #FF9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #FF9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #FF9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #FF9800;
}
.single-service .media .fa::before {
  background: #FF9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #FF9800;
}
.single-service .media:hover .fa::before {
    color: #FF9800;
}
.testimonial-body::before {
  color: #FF9800;
}
.client-name::before {
  background: #FF9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #FF9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #FF9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #FF9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #FF9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #FF9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #FF9800;
}
.blog-post-details .post-heading em a {
	color: #FF9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #FF9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #FF9800;
}
.social-icons a .fa:hover {
    background: #FF9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #FF9800;
    color: #FF9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #FF9800;
}
.thumbnails:hover .portfolio-overlay {
    background-color: #FF9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #FF9800;
}
.contact-form-section button.btn-contact {
	background-color: #FF9800;
}
#main-slide .carousel-control i {
    color: #FF9800;
}
#main-slide .carousel-control i:hover{
    background: #FF9800;
}span {
	color: #1abc9c;
}
.navbar-custom .navbar-toggle {
    background: #1abc9c;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #1abc9c;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #1abc9c none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #1abc9c;
}
.single-service .media .fa::before {
  background: #1abc9c none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #1abc9c;
}
.single-service .media:hover .fa::before {
    color: #1abc9c;
}
.testimonial-body::before {
  color: #1abc9c;
}
.client-name::before {
  background: #1abc9c none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #1abc9c;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #1abc9c none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #1abc9c none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #1abc9c;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #1abc9c !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #1abc9c;
}
.blog-post-details .post-heading em a {
	color: #1abc9c !important;
}
.blog-post-details button.read-more-btn {
    background: #1abc9c none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #1abc9c;
}
.social-icons a .fa:hover {
    background: #1abc9c;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #1abc9c;
    color: #1abc9c;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #1abc9c;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #1abc9c;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #1abc9c;
}
.contact-form-section button.btn-contact {
	background-color: #1abc9c;
}
#main-slide .carousel-control i {
    color: #1abc9c;
}
#main-slide .carousel-control i:hover{
    background: #1abc9c;
}
span {
	color: #8e44ad;
}
.navbar-custom .navbar-toggle {
    background: #8e44ad;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #8e44ad;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #8e44ad none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #8e44ad;
}
.single-service .media .fa::before {
  background: #8e44ad none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #8e44ad;
}
.single-service .media:hover .fa::before {
    color: #8e44ad;
}
.testimonial-body::before {
  color: #8e44ad;
}
.client-name::before {
  background: #8e44ad none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #8e44ad;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #8e44ad none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #8e44ad none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #8e44ad;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #8e44ad !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #8e44ad;
}
.blog-post-details .post-heading em a {
	color: #8e44ad !important;
}
.blog-post-details button.read-more-btn {
    background: #8e44ad none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #8e44ad;
}
.social-icons a .fa:hover {
    background: #8e44ad;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #8e44ad;
    color: #8e44ad;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #8e44ad;
}
.thumbnails:hover .portfolio-overlay {
    background-color: #8e44ad;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #8e44ad;
}
.contact-form-section button.btn-contact {
	background-color: #8e44ad;
}
#main-slide .carousel-control i {
    color: #8e44ad;
}
#main-slide .carousel-control i:hover{
    background: #8e44ad;
}
span {
	color: #2ecc71;
}
.navbar-custom .navbar-toggle {
    background: #2ecc71;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #2ecc71;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #2ecc71 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #2ecc71;
}
.single-service .media .fa::before {
  background: #2ecc71 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #2ecc71;
}
.single-service .media:hover .fa::before {
    color: #2ecc71;
}
.testimonial-body::before {
  color: #2ecc71;
}
.client-name::before {
  background: #2ecc71 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #2ecc71;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #2ecc71 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #2ecc71 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #2ecc71;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #2ecc71 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #2ecc71;
}
.blog-post-details .post-heading em a {
	color: #2ecc71 !important;
}
.blog-post-details button.read-more-btn {
    background: #2ecc71 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #2ecc71;
}
.social-icons a .fa:hover {
    background: #2ecc71;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #2ecc71;
    color: #2ecc71;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #2ecc71;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #2ecc71;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #2ecc71;
}
.contact-form-section button.btn-contact {
	background-color: #2ecc71;
}
#main-slide .carousel-control i {
    color: #2ecc71;
}
#main-slide .carousel-control i:hover{
    background: #2ecc71;
}
@charset "UTF-8";


/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    -ms-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    -ms-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    -ms-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    -ms-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    -ms-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    -ms-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    -ms-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    -ms-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    -ms-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
}

@keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  -ms-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    -ms-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    -ms-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    -ms-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    -ms-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    -ms-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    -ms-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

@keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    -ms-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

@keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    -ms-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}
span {
	color: #ff9800;
}
.navbar-custom .navbar-toggle {
    background: #ff9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #ff9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #ff9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #ff9800;
}
.single-service .media .fa::before {
  background: #ff9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #ff9800;
}
.single-service .media:hover .fa::before {
    color: #ff9800;
}
.testimonial-body::before {
  color: #ff9800;
}
.client-name::before {
  background: #ff9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #ff9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #ff9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #ff9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #ff9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #ff9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #ff9800;
}
.blog-post-details .post-heading em a {
	color: #ff9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #ff9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #ff9800;
}
.social-icons a .fa:hover {
    background: #ff9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #ff9800;
    color: #ff9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #ff9800;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #ff9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #ff9800;
}
.contact-form-section button.btn-contact {
	background-color: #ff9800;
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */

html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */

[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */

a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */

dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */

pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

button,
input,
optgroup,
select,
textarea {
  color: inherit; /* 1 */
  font: inherit; /* 2 */
  margin: 0; /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */

button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */

input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  box-sizing: content-box; /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */

optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}
/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.3
 */

/* clearfix */
.owl-carousel .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/* display none until init */
.owl-carousel{
	display: none;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{
	float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
/*
* 	Owl Carousel Owl Demo Theme 
*	v1.3.3
*/

.owl-theme .owl-controls{
	margin-top: 10px;
	text-align: center;
}

/* Styling Next and Prev buttons */

.owl-theme .owl-controls .owl-buttons div{
	color: #FFF;
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
	margin: 5px;
	padding: 3px 10px;
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background: #869791;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
}
/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
	text-decoration: none;
}

/* Styling Pagination*/

.owl-theme .owl-controls .owl-page{
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
}
.owl-theme .owl-controls .owl-page span{
	display: block;
	width: 12px;
	height: 12px;
	margin: 5px 7px;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #869791;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
}

/* If PaginationNumbers is true */

.owl-theme .owl-controls .owl-page span.owl-numbers{
	height: auto;
	width: auto;
	color: #FFF;
	padding: 2px 10px;
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
}

/* preloading images */
.owl-item.loading{
	min-height: 150px;
	background: url(AjaxLoader.gif) no-repeat center center
}
.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing { 
    cursor:url(grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}




.product-card { 
            background: var(--white); 
            border: 1px solid #eee; 
            border-radius: 15px; 
            padding: 20px; 
            transition: 0.3s; 
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
        }
        .product-card:hover { transform: translateY(-10px); border-color: var(--primary); }
        .product-card img { width: 100%; border-radius: 10px; margin-bottom: 15px; }
        
        .btn-brand { 
            background: var(--primary); 
            color: #000; 
            font-weight: 700; 
            border: none; 
            border-radius: 8px; 
            width: 100%;
            padding: 10px;
        }

        /* Sticky Cart Icon - Bottom Right */
        .sticky-cart-btn {
            position: fixed;
            bottom: 30px;
            right: 30px;
            background: var(--primary);
            width: 65px;
            height: 65px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #000;
            font-size: 24px;
            box-shadow: 0 8px 25px rgba(255, 152, 0, 0.4);
            cursor: pointer;
            z-index: 9999;
            text-decoration: none;
        }
        .cart-count-badge {
            position: absolute;
            top: -5px;
            right: -5px;
            background: #000;
            color: #fff;
            font-size: 14px;
            font-weight: bold;
            width: 25px;
            height: 25px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Modal Details */
        .modal-content { border-radius: 20px; border: none; }
        .form-control { border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.copyright-info a{
    color:#fff !important;
}
.copyright-info a span{
    color:#FF9800 !important;
}
.product-grid-row{
      display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px; 
}
.product-grid-row::before{
    display: none !important;
}
.product-grid-row .col-sm-3 {
    padding: 0px !important;
    width: 100%;
}
.cart-item{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cart-item button{
    padding:8px 10px;
    font-size: 20px;
    color:#171717;
}
.cart-item button:nth-child(3){
    background: #FF9800;
    color:#fff;
   margin-left: 5px;
}
#cartModal input ,#cartModal  textarea{
    border:1px solid #171717;
    border-radius: 5px ;
}
#cartModal input::placeholder,#cartModal textarea::placeholder{
    color:#171717;
}
.product-card button{
    background: #ff9800;
    color:#fff;
    border-color:#ff9800;
}
.product-card img{
        width: 100% !important;
    height: 300px !important;
    object-fit: contain !important;
}
.product-card{
    border-radius: 5px !important;
}
@media(max-width:768px){
    .product-grid-row{
      display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 5px; 
}
}
/* Medium Layout: 1280px. */
@media only screen and (min-width: 992px) and (max-width: 1200px) { 
/* About Us Area */
.dotted .fa::after {
	height: 105px;
}
/* Blog Post Area */
.blog-post-details {
	margin-top: 0;
}
.blog-section .blog-post-details .post-heading {
	margin-bottom: 10px;
}
.blog-post-details button.read-more-btn {
  margin-top: 10px;
}
.blog-post-details .post-heading a h2 {
  font-size: 18px;
}
.blog-post-details p {
  font-size: 14px;
}
#blog-post-carousel .owl-pagination {
  bottom: -15px;
  right: 30%;
}

}
/* Tablet Layout: 768px. */
@media only screen and (min-width: 768px) and (max-width: 991px) { 
 
 /* Navigation Area */
 .navbar-custom .nav li > a {
  font-size: 14px;
  padding: 30px 12px;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 20px 12px;
}

/* About Us Area */
.about-us-right .media p {
  font-size: 14px;
  line-height: 20px;
}
.about-us-right .media {
  margin-top: 30px;
}
.about-us-right .media .fa::before {
  font-size: 25px;
  height: 50px;
  line-height: 50px;
  width: 50px;
}
.about-us-right .media-heading {
  margin-bottom: 8px;
}
.dotted .fa::after {
  height: 103px;
  left: 100px;
}
/* Portfolio Area */
.portfolio-filter-nav ul li {
  font-size: 15px;
  padding: 4px 10px;
}
/*Pricing Table Area*/
.single-pricing-table .pricing-buttons button.buy-btn {
  padding: 5px 30px;
}
.single-pricing-table .pricing-buttons {
  margin: 20px 0;
}
/* Blog Post Area */
#blog-post-carousel .owl-pagination {
	bottom: 0;
	position: inherit;
}
.blog-post-image figure img {
  display: block;
  margin: 0 auto;
}
.blog-post-details {
  text-align: center;
}
.blog-post-details p {
  font-size: 15px;
}
/* Gogle Map Area */
#gmap-wrapper {
  height: 300px;
}
.portfolio-showcase #grid .thumbnails {
  width: 33.33%;
}

}

/* Mobile Layout: 320px. */
@media only screen and (max-width: 767px) { 
.navbar-custom .nav li > a {
  line-height: 18px;
  padding: 12px 18px;
}
.navbar-custom li a {
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 10px 18px;
}

.logo {
  padding: 11px 12px;
}
.is-sticky .logo {
  padding: 11px 12px;
}
.slider-caption h1 {
  font-size: 35px;
  line-height: 42px;
}
.slider-caption h5 {
  font-size: 13px;
}

/* About Us */
.about-us-left , .about-us-right {
  padding: 45px 15px;
}
.section-title-left {
  letter-spacing: 0.1rem;
  margin-bottom: 35px;
}
.dotted .fa::after {
 display: none;
}
.about-us-right .media-left {
  display: block;
  float: none;
  text-align: center;
}
.about-us-right .media-body {
  text-align: center;
}
.about-us-right .media-heading {
  margin: 20px 0;
}
.about-us-right .media p {
  font-size: 15px;
  line-height: 22px;
}
.section-padding {
  padding: 70px 0;
}
.single-service .media {
  padding: 30px 10px;
}
.sub-title {
  font-size: 14px;
}
.single-service .media .media-left {
  display: block;
  float: none;
  text-align: center;
  padding: 0;
}
.single-service .media .media-body {
  text-align: center;
}
.single-service .media .fa::before {
  font-size: 25px;
  height: 70px;
  line-height: 70px;
  width: 70px;
}
.single-service .media-body h3 {
  margin-bottom: 30px;
  margin-top: 15px;
}
.single-service .media-body h3::after {
  left: 0;
  margin: 0 auto;
  right: 0;
}
.testimonial-body {
  margin-bottom: 50px; 
}
#testimonial-carousel .owl-controls {
  position: inherit;
  bottom: 0;
  right: 0;
}
.testimonial-image {
  display: none !important;
}
.portfolio-filter-nav ul li {
  font-size: 9px;
  padding: 0 3px;
}
.portfolio-button button.portfolio-btn {
  font-size: 12px;
  padding: 5px 20px;
}
.awards-counter {
  padding: 20px 0;
}
.awards-counter .fa {
  font-size: 25px;
  margin-bottom: 5px;
}
.our-awards-section strong span {
  font-size: 30px;
  line-height: 40px;
}
span.count-description {
  font-size: 14px;
  line-height: 30px;
}
.our-awards-padding {
  padding: 30px 0;
}
.single-pricing-table .price {
  height: 80px;
  padding: 8px;
  width: 80px;
  margin: 15px 0;
}
.single-pricing-table .price h1 {
  font-size: 20px;
}
.single-pricing-table .pricing-title {
  margin-bottom: 15px;
}
.single-pricing-table .pricing-buttons {
  margin: 10px 0;
}
.single-pricing-table .pricing-buttons button.buy-btn {
  font-size: 14px;
  padding: 2px 25px;
}
.single-pricing-table {
	margin-bottom: 30px;
}
/* Blog Post Area */
#blog-post-carousel .owl-pagination {
	bottom: 0;
	position: inherit;
}
.blog-post-image figure img {
  display: block;
  margin: 0 auto;
}
.blog-post-details {
  text-align: center;
}
.blog-post-details .post-heading {
	margin-bottom: 10px;
}
.blog-post-details .post-heading em, .blog-post-details .post-heading em a {
	font-size: 14px;
}
.blog-post-details p {
  font-size: 14px;
  line-height: 22px;
}
.blog-section-padding {
	margin-top: 20px;
}
.blog-post-details button.read-more-btn {
  font-size: 12px;
  margin-top: 5px;
  padding: 2px 10px;
}
.contact-form-section {
  padding: 15px;
  margin-top: 15px;
}
#contactForm .form-control {
  font-size: 12px;
  height: 30px;
  line-height: 10px;
  padding: 8px;
}
#contactForm .form-group {
  margin-bottom: 20px;
}
#contactForm .form-group textarea {
	height: 60px;
}
.contact-form-section button.btn-contact {
  font-size: 13px;
  padding: 0 30px;
  width: 100%;
}
.contact-button-padding {
	margin-top: 10px;
}
.contact-form-icon input, .contact-form-icon textarea {
  padding-left: 32px !important;
}
.contact-form-icon .fa {
  font-size: 12px;
  padding: 8px 12px;
}
.goolge-map-section .toggle-map-button button.gmap-btn {
  font-size: 12px;
  padding: 10px 0;
}
#gmap-wrapper {
  height: 300px;
}
.social-icons a .fa {
  font-size: 14px;
  padding: 5px 10px;
}
.portfolio-showcase #grid .thumbnails {
  width: 100%;
}
#main-slide .slider-content {
  top: 60%;
}
.slider-caption h1, #main-slide .item.active .slider-content h1 {
  font-size: 20px;
  line-height: 22px;
  margin-bottom: 18px;
}
.slider-caption h1, #main-slide .item.active .slider-content h5 {
  font-size: 12px;
}
#main-slide .carousel-control i {
  background: #000 none repeat scroll 0 0;
  font-size: 14px;
  padding: 0px 8px;
}
}
/* Wide Mobile Layout: 480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) { 
.portfolio-showcase #grid .thumbnails {
  width: 50%;
}
.portfolio-filter-nav ul li {
  font-size: 12px;
  padding: 5 10px;
}
}

/* ===== ADD TO CART TOAST ===== */
#cart-toast{
    position:fixed;
    bottom:50%;
    left:50%;
    transform:translateX(-50%) translateY(80px);
    background:green;
    color:#fff;
    padding:12px 22px;
    border-radius:30px;
    font-size:14px;
    opacity:0;
    transition:.4s ease;
    z-index:9999;
}
#cart-toast.show{
    opacity:1;
    transform:translateX(-50%) translateY(0);
}

/* ===== STICKY CART ANIMATION ===== */
.sticky-cart-btn.pulse{
    animation:pulseCart .4s ease;
}
@keyframes pulseCart{
    0%{transform:scale(1)}
    50%{transform:scale(1.15)}
    100%{transform:scale(1)}
}


/*
====================================
[ CSS TABLE OF CONTENT ]
------------------------------------
    1.0 - Base Styles
    2.0 - Typography
    3.0 - Global Style
    4.0 - Navigation
    5.0 - Hero Section
    6.0 - About Us Section
    7.0 - Testimonial Section
    8.0 - Creative Section
    9.0 - Awards Section
    10.0 - Pricing And Plans Section
    10.0 - Our Partners Section
    11.0 - Blog Section
    12.0 - Contact Section
    13.0 - Google Map Section
    14.0 - Footer Section
-------------------------------------
[ END CSS TABLE OF CONTENT ]
=====================================
*/

/* ============================
    Base Styles
=============================== */
body{
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
    color: #333333;
    background-color: #fff;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    -webkit-overflow-scrolling: touch;
    -webkit-font-smoothing: antialiased !important;
}


html,
body {
    width: 100%;
    height: 100%;
}


/* link styles */
a {
    color: #FF9800;
}
a,
a > * {
    outline: none;
    cursor: pointer;
    text-decoration: none;
}
a:focus,
a:hover {
    color: #FF9800;
    outline: none;
    text-decoration: none;
}


/* Transition elements
/* ------------------------------ */
.navbar a,
.form-control {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease; 
}

a,
.btn {
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
#qLpercentage {
    font-family: 'Roboto', sans-serif;
    font-weight: 800;
}

/* Reset Box Shadow */

.btn,
.form-control,
.form-control:hover,
.form-control:focus,
.navbar-custom .dropdown-menu {
    box-shadow: none;
}


button:focus {
    outline: none !important;
}


/* ============================
    Typography
=============================== */

h1, h2, h3, h4, h5, h6{
    font-family: 'Raleway', sans-serif;
    font-weight: 700;
    margin: 0 0 15px;
    color: #333333;
}

h1 {
    font-size: 50px;
    line-height: 65px;
}

h2 {
    font-size: 30px;
}

h3 {
    font-size: 20px;
    line-height: 25px;
    text-transform: uppercase;
}

h4 {
    font-size: 18px;
    line-height: 20px}

h5 {

}

h6 {

}
.logo {
    padding: 32px 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.is-sticky .logo {
  padding: 16px 0;
}

.logo h2{
    font-family: "Montserrat",sans-serif;
    font-size: 24px;
    padding: 0;
    text-transform: uppercase;
}


/* Button
/* ------------------------------ */
.btn {
    padding: 14px 45px;
}
.btn:focus,
button:focus {
    outline: none !important;
}



/* =-=-=-=-=-=-= List Style =-=-=-=-=-=-= */

ul {
    margin:0;
    padding:0;
    list-style: none;
}

.unorder-list {
    list-style: inherit;
}


/* Form Style
/* ------------------------------ */
.form-group {
    margin-bottom: 20px;
}
.form-control {
  background-color: transparent;
  border: 1px solid #fff;
  border-radius: 2px;
  color: #fff;
  font-size: 13px;
  font-weight: normal;
  height: 42px;
  line-height: 21px;
  padding: 10px;
  -webkit-transition: all 0.3s ease-in-out 0s;
          transition: all 0.3s ease-in-out 0s;
  letter-spacing: 1px;
  letter-spacing: 1px;
  letter-spacing: 0.1rem;
}
.form-control::-webkit-input-placeholder {
    color: #fff;
}
.form-control::-moz-placeholder {
    color: #fff;
}
.form-control:-ms-input-placeholder {
    color: #fff;
}
.form-control::placeholder {
    color: #fff;
}


/* ============================
    Global Styles
=============================== */

.section-padding {
    padding: 130px 0;
}
.morphext > .animated {
    display: inline-block;
}

.section-title {
    font-size: 30px;
    line-height: 30px;
    color: #333333;
    margin-bottom: 50px;
    text-transform: uppercase;
    letter-spacing: 3px;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
    position: relative;
}
.section-title-left {
    font-size: 30px;
    line-height: 30px;
    color: #333333;
    margin-bottom: 50px;
    text-transform: uppercase;
    letter-spacing: 3px;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
    position: relative;
}
.section-title-left:after {
  bottom: -15px;
  content: "";
  height: 4px;
  left: 0;
  position: absolute;
  width: 65px;
}
.section-title:after {
  bottom: -20px;
  content: "";
  height: 4px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  width: 65px;
}
.testimoinal-title {
    color: #fff;
    line-height: 35px;
}


.row-content{
    margin-top: 80px;
}

/*custom margin classes*/

/*margin top*/
.mt-30 {
    margin-top: 30px;
}
.mt-50 {
    margin-top: 50px;
}
.mt-80 {
    margin-top: 80px;
}
.mt-100 {
    margin-top: 100px;
}

/*margin bottom*/
.mb-30 {
    margin-bottom: 30px;
}
.mb-60 {
    margin-bottom: 60px;
}
.mb-80 {
    margin-bottom: 80px;
}

/*custom padding classes*/

.no-padding {
    padding: 0!important;
}

/*padding-bottom*/
.pb-20 {
    padding-bottom: 20px;
}
.pb-30 {
    padding-bottom: 30px;
}
.pb-50 {
    padding-bottom: 50px;
}
.pt-100 {
    padding-top: 100px;
}
.pb-100 {
    padding-bottom: 100px;
}

/*padding top bottom*/
.ptb-50 {
    padding: 50px 0;
}
.ptb-90 {
    padding: 90px 0;
}

.gutter {
    padding-left: 10px!important;
    padding-right: 10px!important;
}


/*vertical middle align*/
.vertical-middle {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    padding: 0 15px;
}


/* ============================
    Navigation
=============================== */
.header-area {
    z-index: 20;
}
.navbar-custom {
    background-color: #fff;
    border: 0;
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: 0px 3px 6px 3px rgba(0,0,0,0.06);
    z-index: 1111;
}


.navbar-custom .nav li > a {
    color: #464d58;
    font-size: 15px;
    font-weight: 500;
    padding: 35px 20px;
    position: relative;
    -webkit-transition: all 0.2s ease-in-out 0s;
            transition: all 0.2s ease-in-out 0s;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 20px;
}

.navbar-collapse {
    max-height: 340px;
}

.navbar-custom .navbar-toggle .icon-bar {
    background: #fff;
}

/* ============================
    Hero Section
=============================== */
.hero-section {
    position: relative;
    width: 100%;
    height: 100vh;
    max-height: 900px;

}
.slider-caption {
    left: 0;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
        -ms-transform: translate(0%, -50%);
            transform: translate(0%, -50%);
    width: 100%;
    z-index: 15;
}


.hero-parallax-bg {
    background: url("../img/bg/parallax/parallax-1.jpg") no-repeat fixed center center / cover ;
}
.hero-particle-bg {
    background: url("../img/bg/particle/particle-2.jpg") no-repeat scroll center center / cover ;
}
.text-rotator-bg {
    background: url("../img/bg/text-rotator/rotator-bg1.jpg") no-repeat fixed center center / cover ;
}
.hero-parallax-bg:before , .hero-particle-bg:before , .text-rotator-bg:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
}
.slider-caption h1 , #main-slide .item.active .slider-content h1 {
  font-size: 72px;
  letter-spacing: 3px;
  letter-spacing: 3px;
  letter-spacing: 0.2rem;
  margin-bottom: 25px;
}
.slider-caption h5 , #main-slide .item.active .slider-content h5  {
    color: #3f3f3f;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 3px;
    letter-spacing: 0.2rem;
}
.hero-parallax-bg .slider-caption h1 , .hero-parallax-bg .slider-caption h5 , .hero-particle-bg .slider-caption h1 , .hero-particle-bg .slider-caption h5 , .text-rotator-bg .slider-caption h5 {
    color: #fff;
}
.text-rotator-bg h1 {
    font-family: 'Roboto', sans-serif;
}
/* Paricle BG */
#particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 10;
}
/* Slideshow
================================================== */

/*-- Main slide --*/

#main-slide .item img{
    width: 100%;
    position: relative;
}
#main-slide .carousel-inner .item:after {
  background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
#main-slide .item.active .slider-content h1 , #main-slide .item.active .slider-content h5 {
    color: #fff;
}
#main-slide .item .slider-content {
  z-index: 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 100ms;
  transition: opacity 100ms;
  text-transform: uppercase;
}
#main-slide .item.active .slider-content {
  z-index: 1;
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transition: opacity 100ms;
  transition: opacity 100ms;
  text-transform: uppercase;
}

#main-slide .slider-content{
    top: 40%;
    margin-top: -50px;
    left: 0;
    padding: 0;
    text-align: center;
    position: absolute;
    width: 100%;
    height: 100%;
    color: #fff;
}


#main-slide .carousel-control.left,
#main-slide .carousel-control.right {
    opacity: 1;
    filter: alpha(opacity=100);
    background-image: none;
    background-repeat: no-repeat;
    text-shadow: none;
}

#main-slide .carousel-control.left span {
    padding: 15px;
}

#main-slide .carousel-control.right span {
    padding: 15px;
}
#main-slide .carousel-control {
    top: 40%;
    width: 50px;
    height: 50px;
}
#main-slide .carousel-control .fa-angle-left, 
#main-slide .carousel-control .fa-angle-right{
    position: absolute;
    z-index: 5;
    display: inline-block;
}

#main-slide .carousel-control .fa-angle-left{
    left: 0;
}

#main-slide .carousel-control .fa-angle-right{
    right: 0;
}

#main-slide .carousel-control i{
    background: #000;
    line-height: 36px;
    font-size: 32px;
    padding: 15px 20px;
    -webkit-transition: all 500ms ease;
    transition: all 500ms ease;
}

#main-slide .carousel-control i:hover{
    color: #fff;
}

/*-- Hero Carousel Animation --*/

.carousel .item.active .animated2 {
    -webkit-animation: lightSpeedIn 1s ease-in 200ms both;
    animation: lightSpeedIn 1s ease-in 200ms both;
}

.carousel .item.active .animated3 {
    -webkit-animation: bounceInLeft 1s ease-in-out 500ms both;
    animation: bounceInLeft 1s ease-in-out 500ms both;
}

.carousel .item.active .animated4 {
    -webkit-animation: flipInX 1s ease-in 500ms both;
    animation: flipInX 1s ease-in 500ms both;
}

.carousel .item.active .animated5 {
    -webkit-animation: bounceInLeft 1s ease-in-out 100ms both;
    animation: bounceInLeft 1s ease-in-out 100ms both;
}

.carousel .item.active .animated6 {
    -webkit-animation: bounceIn 1s ease-in 500ms both;
    animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated7 {
    -webkit-animation: bounceIn 1s ease-in 500ms both;
    animation: bounceIn 1s ease-in 500ms both;
}

.carousel .item.active .animated8 {
    -webkit-animation: bounceInDown 1s ease-in 800ms both;
    animation: bounceInDown 1s ease-in 800ms both;
}

/* Carousel Fade Effect */
.carousel-fade .carousel-inner .item {
    max-height: 700px;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-transition-property: opacity;
            transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right {
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    z-index: 1;
}
.carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
    opacity: 1;
    filter: alpha(opacity=100);
}
.carousel-fade .carousel-inner .item:after {
    background: rgba(0, 0, 0, 0.7) none repeat scroll 0 0;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.carousel-fade .carousel-control {
    z-index: 20;
}


/* ============================
    About Us
=============================== */
.about-us-left {
    padding: 100px 40px 60px 107px;
}
.about-us-right {
    background: #1f1f1f none repeat scroll 0 0;
    padding: 60px 110px 60px 75px;
}
.about-us-right .media {
    margin-top: 40px;
}
.about-us-right .media::first-child {
    margin-top: 0px;
}

.about-us-right .media .fa:before {
    border: 1px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 30px;
    height: 60px;
    line-height: 59px;
    text-align: center;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
    width: 60px;
}
.dotted .fa:after {
    background: #5e5e5e none repeat scroll 0 0;
    content: "";
    height: 80px;
    left: 104px;
    position: absolute;
    width: 1px;
}
.about-us-right .media:hover  .fa:before {
        border: 1px solid transparent;
        color: #fff;
}
.about-us-right .media-heading {
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    margin-bottom: 15px;
}

.about-us-right .media p {
    color: #808080;
    font-size: 16px;
    line-height: 25px;
}
.about-us-right .media-body {
  padding: 0 20px;
}



/* ============================
    Our Services
=============================== */
.single-service .media .fa:before {
  border-radius: 50%;
  color: #fff;
  display: block;
  font-size: 30px;
  height: 90px;
  line-height: 87px;
  text-align: center;
  -webkit-transition: all 0.2s ease-in-out 0s;
          transition: all 0.2s ease-in-out 0s;
  width: 90px;
}
.our-services {
    margin-top: 30px;
}
.single-service .media .media-left {
  padding-right: 30px;
}
.single-service {
    margin-top: 28px;
}
.single-service .media {
    border: 2px solid #ededed;
    border-radius: 5px;
    padding: 30px 40px;
    -webkit-transition: all 0.2s ease-in-out 0s;
            transition: all 0.2s ease-in-out 0s;
}
.single-service .media-body h3 {
    position: relative;
    margin-bottom: 25px;
}
.single-service .media-body h3:after {
  background: #d9d9d9 none repeat scroll 0 0;
  bottom: -15px;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 40px;
}
.single-service .media .media-body > p {
    font-size: 14px;
    line-height: 24px;
}
.single-service .media:hover {
    border: 2px solid transparent;
    cursor: pointer;
}
.single-service .media:hover .fa:before {
    background-color: #fff;
}
.single-service .media:hover h3:after {
    background: #fff;
}
.single-service .media:hover h3 , .single-service .media:hover p {
    color: #fff;
}


/* ============================
    Testimonial Section
=============================== */
.testimonial-section {
    position: relative;
    width: 100%;
    background: url("../img/bg/testimonial-bg.jpg") no-repeat scroll center center / cover;
}
.testimonial-parallax-bg {
    background: url("../img/bg/testimonial-bg.jpg") no-repeat fixed center center / cover;
}
.testimonial-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.8);
}
.testimonial-body p , .testimonial-body .client-name a b {
    color: #fff;
}
.testimonial-body p {
    line-height: 25px;
}
.testimonial-body .client-name a b {
    font-size: 16px;
    text-transform: capitalize;
}
.client-name {
  padding-top: 15px;
  position: relative;
}
.client-name:before {
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  top: 12px;
  width: 30px;
}
.testimonial-body {
    position: relative;
    padding-top: 40px;
}
.testimonial-body:before {
  content: "";
  font-family: FontAwesome;
  font-size: 25px;
  left: 0;
  position: absolute;
  top: 0;
}
.testimonial-image img {
    box-shadow: 0px 9px 9px 0px rgba(0,0,0,0.64);
    z-index: 1111;
}
#testimonial-carousel .item img{
    display: block;
}
#testimonial-carousel {
    position: relative;
}
#testimonial-carousel .owl-controls {
    bottom: -50px;
    position: absolute;
    right: 22%;    
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev, #testimonial-carousel .owl-controls .owl-buttons .owl-next {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #88888a;
    border-radius: 100%;
    color: #88888a;
    cursor: pointer;
    display: inline-block;
    height: 32px;
    line-height: 24px;
    opacity: 1;
    filter: alpha(opacity=100);
    text-align: center;
    text-shadow: none;
    top: auto;
    width: 32px;
    -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
}


/* ============================
    Portfolio Section
=============================== */
.custom-nav ul {
    margin-top: 0;
}
.portfolio-filter-nav ul li {
    border-radius: 3px;
    display: block;
    float: left;
    margin: 0 5px 30px;
}
.portfolio-filter-nav ul li {
    color: #515151;
    font-size: 16px;
    font-weight: 500;
    padding: 5px 12px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    text-transform: uppercase;
}
.portfolio-filter-nav ul li:hover {
    cursor: pointer;
    color: #fff;
}
.portfolio-filter-nav ul li.active {
    color: #fff;
}
.portfolio-showcase {
  margin-top: 110px;
}
.portfolio-showcase #grid {
    width: 100%
}
.portfolio-showcase #grid .thumbnails {
    float: left;
    height: auto;
    margin: 0;
    width: 25%;

}
.portfolio-showcase #grid .thumbnails a {
  display: inline-block;
  float: left;
  height: 100%;
  line-height: 0;
  text-decoration: none;
  width: 100%;
  position: relative;
}
.portfolio-showcase #grid .thumbnails a img {
    display: block;
    position: relative;
    width: inherit;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}

.portfolio-button button.portfolio-btn {
    text-transform: uppercase;
    background-color: transparent;
    font-weight: 500;
    -webkit-transition: all 0.4s ease 0s;
            transition: all 0.4s ease 0s;
}
.portfolio-button button.portfolio-btn:hover {
    color: #fff;
    border: 2px solid transparent;
}
.thumbnails span.portfolio-overlay {
    background: transparent none repeat scroll 0 0;
    color: #fff;
    display: block;
    height: 100%;
    position: absolute;
    text-align: center;
    top: 0;
    -webkit-transition: all 0.5s ease 0s;
            transition: all 0.5s ease 0s;
    width: 100%;

}
.thumbnails span.portfolio-overlay .fa {
    color: transparent;
    height: 30px;
    left: 50%;
    line-height: 30px;
    margin-left: -15px;
    margin-top: -15px;
    position: absolute;
    top: 60%;
    -webkit-transition: all 0.5s ease 0s;
            transition: all 0.5s ease 0s;
    width: 30px;
    font-size: 28px;
}
.thumbnails:hover span.portfolio-overlay {
    opacity: 0.9;
    filter: alpha(opacity=90);
}
.thumbnails:hover span.portfolio-overlay .fa {
    color: #fff;
    top: 50%;
}

/* Simple LightBox Arrow */
button.sl-prev .fa, button.sl-next .fa {
    font-size: 35px !important;
    font-weight: bold;
}

/* ============================
    Awards Section
=============================== */
.our-awards-section {
    background: url("../img/bg/awards-bg.jpg") no-repeat fixed center center / cover;
    width: 100%;
    position: relative;
}
.our-awards-section:before {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.7);
}

.our-awards-section strong span {
    font-family: 'Roboto', sans-serif;
    color: #fff;
    display: block;
    font-weight: 500;
    font-size: 38px;
    line-height: 48px;
}
span.count-description {
    color: #fff;
    display: block;
    font-size: 16px;
    line-height: 40px;
    text-transform: uppercase;
}
.awards-counter {
    padding: 60px 0;
}
.awards-counter .fa {
    color: #fff;
    font-size: 40px;
    margin-bottom: 20px;
}


/* ============================
    Pricing And Plans Section
=============================== */

.single-pricing-table {
    border: 1px solid #e7e7e7;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .price {
    width: 120px;
    height: 120px;
    display: inline-block;
    border: 1px solid #e3e3e3;
    border-radius: 50%;
    padding: 30px;
    margin: 30px 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .price h1 {
    font-family: 'Roboto', sans-serif;
    font-size: 23px;
    font-weight: 400;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.single-pricing-table .pricing-title h2 {
    color: #5b5b5b;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 20px;
    position: relative;
}
.single-pricing-table .pricing-title {
    margin-bottom: 30px;
}
.single-pricing-table .pricing-title h2:after {
  bottom: -10px;
  content: "";
  height: 2px;
  left: 0;
  margin: 0 auto;
  position: absolute;
  right: 0;
  width: 40px;
}
.single-pricing-table .package-item {
    padding: 0 30px;
}
.single-pricing-table .package-item ul li {
    border-bottom: 1px dashed #e7e7e7;
    color: #808080;
    font-size: 14px;
    font-weight: 400;
    padding: 5px 0;
}
.single-pricing-table .pricing-buttons {
    margin: 30px 0;
    position: relative;
}
.single-pricing-table .pricing-buttons button.buy-btn {
    background-color: transparent;
    border: 1px solid #9b9b9b;
    color: #5b5b5b;
    font-size: 16px;
    font-weight: 800;
    padding: 5px 45px;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}

.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    color: #fff;
    border: 1px solid transparent;
}
.single-pricing-table:hover .price h1 , .table-active .price h1 {
    color: #fff;
}
.single-pricing-table:hover , .table-active {
    box-shadow: 0px 5px 14px -3px rgba(0,0,0,0.61);
    cursor: pointer;
}


/* ============================
    Our Partners Section
=============================== */
.our-partners-section {
box-shadow: inset 0px 2px 25px -8px rgba(0,0,0,0.76);
}

.our-partners-section .item img {
    height: 70px;
    width: 110px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    -webkit-transition: all 0.4s ease-in-out 0s;
            transition: all 0.4s ease-in-out 0s;
}
.our-partners-section img:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    cursor: pointer;
}
.our-partners-section .item {
    padding: 80px 0;
}


/* ============================
    Blog Section
=============================== */
.blog-post-details .post-heading a h2 {
    text-transform: uppercase;
    color: #292929;
    font-weight: 700;
    font-size: 22px;
    letter-spacing: 1px;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}

.blog-post-details .post-heading em , .blog-post-details .post-heading em a {
    font-style: italic;
    color: #808080;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
}
.blog-post-details p {
    color: #808080;
    font-size: 16px;
}
.blog-post-details button.read-more-btn {
    border: medium none;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    padding: 5px 20px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
}
.blog-post-details button.read-more-btn:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}
#blog-post-carousel .owl-pagination {
    bottom: 0;
    position: absolute;
    right: 32%;
}

/* ============================
    Contact Us Section
=============================== */
.contact-us-section {
    position: relative;
    width: 100%;
    background: url("../img/bg/contact-bg.jpg") no-repeat scroll center center / cover;
}
.contact-parallax-bg {
    background: url("../img/bg/contact-bg.jpg") no-repeat fixed center center / cover;
}
.contact-title , .contact-subtitle {
    color: #fff;
}
.contact-subtitle {
    position: relative;
}
.contact-us-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.6);
}
.contact-form-section {
    position: relative;
    padding: 60px 50px;
}
.contact-form-section:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 5px;
}
.contact-form-section button.btn-contact {
    border: 0;
    font-weight: 500;
    padding: 5px 55px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
}
.btn-contact .fa {
  padding-right: 5px;
}
.contact-form-icon {
    position: relative;
}
.contact-form-icon .fa {
  color: #ffffff;
  padding: 14px 12px;
  pointer-events: none;
  position: absolute;
}
.contact-form-icon input, .contact-form-icon textarea {
  padding-left: 35px;
}
.contact-form-section button.btn-contact:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}




/* ============================
    Google Map Section
=============================== */
.goolge-map-section .toggle-map-button button.gmap-btn {
    text-transform: uppercase;
    color: #fff;
    background: #1f1f1f;
    font-size: 16px;
    border: none;
    padding: 20px 0;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}

.goolge-map-section .toggle-map-button button.gmap-btn .fa {
    padding-left: 10px;
 }
#gmap-wrapper { 
    height: 350px;
}

/* ============================
    Footer Section
=============================== */
.footer-section {
    background: #000;
}
.footer-section .copyright-info a {
    color: #fff;
    font-size: 16px;
    letter-spacing: 1px;
    letter-spacing: 1px;
    letter-spacing: 0.1rem;
}
.social-icons a .fa {
    background: #343434 none repeat scroll 0 0;
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    margin: 0 2px;
    padding: 10px 12px;
    -webkit-transition: all 0.3s ease-in-out 0s;
            transition: all 0.3s ease-in-out 0s;
    vertical-align: middle;
}



.sl-overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    opacity: .7;
    display: none;
    z-index: 1006
}

.sl-wrapper {
    z-index: 1000
}

.sl-wrapper button {
    border: 0;
    background: 0 0;
    font-size: 24px;
    padding: 0;
    cursor: pointer
}

.sl-wrapper button:hover {
    opacity: .7
}

.sl-wrapper .sl-close {
    display: none;
    position: fixed;
    right: 30px;
    top: 30px;
    z-index: 1015
}

.sl-wrapper .sl-counter {
    display: none;
    position: fixed;
    top: 30px;
    left: 30px;
    z-index: 1015
}

.sl-wrapper .sl-navigation {
    width: 100%;
    display: none
}

.sl-wrapper .sl-navigation button {
    position: fixed;
    top: 50%;
    margin-top: -10px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    display: block;
    z-index: 1015;
    font-family: arial sans-serif
}

.sl-wrapper .sl-navigation button.sl-next {
    right: 40px
}

.sl-wrapper .sl-navigation button.sl-prev {
    left: 40px
}

.sl-wrapper .sl-image {
    position: fixed;
    -ms-touch-action: none;
    touch-action: none;
    z-index: 10000
}

.sl-wrapper .sl-image img {
    margin: 0;
    padding: 0;
    display: block
}

.sl-wrapper .sl-image .sl-caption {
    display: none;
    padding: 10px;
    color: #fff;
    background: #000;
    opacity: .8;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}

.sl-wrapper .sl-image .sl-download {
    display: none;
    position: absolute;
    bottom: 5px;
    right: 5px;
    color: #fff;
    z-index: 1005
}

.sl-spinner {
    display: none;
    border: 5px solid #333;
    border-radius: 40px;
    height: 40px;
    left: 50%;
    margin: -20px 0 0 -20px;
    opacity: 0;
    position: fixed;
    top: 50%;
    width: 40px;
    z-index: 1007;
    -webkit-animation: pulsate 1s ease-out infinite;
    -moz-animation: pulsate 1s ease-out infinite;
    -ms-animation: pulsate 1s ease-out infinite;
    -o-animation: pulsate 1s ease-out infinite;
    animation: pulsate 1s ease-out infinite
}

.sl-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@-webkit-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-moz-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-o-keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2);
        opacity: 0
    }
}

@-ms-keyframes pulsate {

    0%,
    100% {
        opacity: 0
    }

    0% {
        transform: scale(.1)
    }

    50% {
        opacity: 1
    }

    100% {
        transform: scale(1.2)
    }
}
span {
	color: #FF9800;
}
.navbar-custom .navbar-toggle {
    background: #FF9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #FF9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #FF9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #FF9800;
}
.single-service .media .fa::before {
  background: #FF9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #FF9800;
}
.single-service .media:hover .fa::before {
    color: #FF9800;
}
.testimonial-body::before {
  color: #FF9800;
}
.client-name::before {
  background: #FF9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #FF9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #FF9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #FF9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #FF9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #FF9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #FF9800;
}
.blog-post-details .post-heading em a {
	color: #FF9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #FF9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #FF9800;
}
.social-icons a .fa:hover {
    background: #FF9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #FF9800;
    color: #FF9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color:#FF9800;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #FF9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #FF9800;
}
.contact-form-section button.btn-contact {
	background-color:#FF9800;
}
#main-slide .carousel-control i {
    color: #FF9800;
}
#main-slide .carousel-control i:hover{
    background: #FF9800;
}

span {
	color: #FF9800;
}
.navbar-custom .navbar-toggle {
    background: #FF9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #FF9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #FF9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #FF9800;
}
.single-service .media .fa::before {
  background: #FF9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #FF9800;
}
.single-service .media:hover .fa::before {
    color: #FF9800;
}
.testimonial-body::before {
  color: #FF9800;
}
.client-name::before {
  background: #FF9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #FF9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #FF9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #FF9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #FF9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #FF9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #FF9800;
}
.blog-post-details .post-heading em a {
	color: #FF9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #FF9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #FF9800;
}
.social-icons a .fa:hover {
    background: #FF9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #FF9800;
    color: #FF9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #FF9800;
}
.thumbnails:hover .portfolio-overlay {
    background-color: #FF9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #FF9800;
}
.contact-form-section button.btn-contact {
	background-color: #FF9800;
}
#main-slide .carousel-control i {
    color: #FF9800;
}
#main-slide .carousel-control i:hover{
    background: #FF9800;
}span {
	color: #1abc9c;
}
.navbar-custom .navbar-toggle {
    background: #1abc9c;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #1abc9c;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #1abc9c none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #1abc9c;
}
.single-service .media .fa::before {
  background: #1abc9c none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #1abc9c;
}
.single-service .media:hover .fa::before {
    color: #1abc9c;
}
.testimonial-body::before {
  color: #1abc9c;
}
.client-name::before {
  background: #1abc9c none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #1abc9c;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #1abc9c none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #1abc9c none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #1abc9c;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #1abc9c !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #1abc9c;
}
.blog-post-details .post-heading em a {
	color: #1abc9c !important;
}
.blog-post-details button.read-more-btn {
    background: #1abc9c none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #1abc9c;
}
.social-icons a .fa:hover {
    background: #1abc9c;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #1abc9c;
    color: #1abc9c;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #1abc9c;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #1abc9c;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #1abc9c;
}
.contact-form-section button.btn-contact {
	background-color: #1abc9c;
}
#main-slide .carousel-control i {
    color: #1abc9c;
}
#main-slide .carousel-control i:hover{
    background: #1abc9c;
}
span {
	color: #8e44ad;
}
.navbar-custom .navbar-toggle {
    background: #8e44ad;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #8e44ad;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #8e44ad none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #8e44ad;
}
.single-service .media .fa::before {
  background: #8e44ad none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #8e44ad;
}
.single-service .media:hover .fa::before {
    color: #8e44ad;
}
.testimonial-body::before {
  color: #8e44ad;
}
.client-name::before {
  background: #8e44ad none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #8e44ad;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #8e44ad none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #8e44ad none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #8e44ad;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #8e44ad !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #8e44ad;
}
.blog-post-details .post-heading em a {
	color: #8e44ad !important;
}
.blog-post-details button.read-more-btn {
    background: #8e44ad none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #8e44ad;
}
.social-icons a .fa:hover {
    background: #8e44ad;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #8e44ad;
    color: #8e44ad;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #8e44ad;
}
.thumbnails:hover .portfolio-overlay {
    background-color: #8e44ad;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #8e44ad;
}
.contact-form-section button.btn-contact {
	background-color: #8e44ad;
}
#main-slide .carousel-control i {
    color: #8e44ad;
}
#main-slide .carousel-control i:hover{
    background: #8e44ad;
}
span {
	color: #2ecc71;
}
.navbar-custom .navbar-toggle {
    background: #2ecc71;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #2ecc71;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #2ecc71 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #2ecc71;
}
.single-service .media .fa::before {
  background: #2ecc71 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #2ecc71;
}
.single-service .media:hover .fa::before {
    color: #2ecc71;
}
.testimonial-body::before {
  color: #2ecc71;
}
.client-name::before {
  background: #2ecc71 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #2ecc71;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #2ecc71 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #2ecc71 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #2ecc71;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #2ecc71 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #2ecc71;
}
.blog-post-details .post-heading em a {
	color: #2ecc71 !important;
}
.blog-post-details button.read-more-btn {
    background: #2ecc71 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #2ecc71;
}
.social-icons a .fa:hover {
    background: #2ecc71;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #2ecc71;
    color: #2ecc71;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #2ecc71;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #2ecc71;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #2ecc71;
}
.contact-form-section button.btn-contact {
	background-color: #2ecc71;
}
#main-slide .carousel-control i {
    color: #2ecc71;
}
#main-slide .carousel-control i:hover{
    background: #2ecc71;
}
@charset "UTF-8";


/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  60% {
    -webkit-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  50% {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    transform: rotate(15deg);
  }

  40% {
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  60% {
    -webkit-transform: rotate(5deg);
    -ms-transform: rotate(5deg);
    transform: rotate(5deg);
  }

  80% {
    -webkit-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg);
    -ms-transform: scale(0.9) rotate(-3deg);
    transform: scale(0.9) rotate(-3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg);
    -ms-transform: scale(1.1) rotate(3deg);
    transform: scale(1.1) rotate(3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg);
    -ms-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
  }

  100% {
    -webkit-transform: scale(1) rotate(0);
    -ms-transform: scale(1) rotate(0);
    transform: scale(1) rotate(0);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg);
    -ms-transform: translateX(-25%) rotate(-5deg);
    transform: translateX(-25%) rotate(-5deg);
  }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg);
    -ms-transform: translateX(20%) rotate(3deg);
    transform: translateX(20%) rotate(3deg);
  }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg);
    -ms-transform: translateX(-15%) rotate(-3deg);
    transform: translateX(-15%) rotate(-3deg);
  }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg);
    -ms-transform: translateX(10%) rotate(2deg);
    transform: translateX(10%) rotate(2deg);
  }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg);
    -ms-transform: translateX(-5%) rotate(-1deg);
    transform: translateX(-5%) rotate(-1deg);
  }

  100% {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    -ms-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px);
  }

  80% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px);
    -ms-transform: translateX(30px);
    transform: translateX(30px);
  }

  80% {
    -webkit-transform: translateX(-10px);
    -ms-transform: translateX(-10px);
    transform: translateX(-10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  80% {
    -webkit-transform: translateX(10px);
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }
}

@keyframes bounceOut {
  0% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }

  25% {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
  }

  100% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  0% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  100% {
    -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  -ms-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg);
    -ms-transform: perspective(400px) rotateX(-10deg);
    transform: perspective(400px) rotateX(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg);
    -ms-transform: perspective(400px) rotateX(10deg);
    transform: perspective(400px) rotateX(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg);
    -ms-transform: perspective(400px) rotateY(-10deg);
    transform: perspective(400px) rotateY(-10deg);
  }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg);
    -ms-transform: perspective(400px) rotateY(10deg);
    transform: perspective(400px) rotateY(10deg);
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    -ms-transform: perspective(400px) rotateX(0deg);
    transform: perspective(400px) rotateX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    -ms-transform: perspective(400px) rotateX(90deg);
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    -ms-transform: perspective(400px) rotateY(0deg);
    transform: perspective(400px) rotateY(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    -ms-transform: perspective(400px) rotateY(90deg);
    transform: perspective(400px) rotateY(90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    -ms-transform: translateX(-20%) skewX(30deg);
    transform: translateX(-20%) skewX(30deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    -ms-transform: translateX(0%) skewX(-15deg);
    transform: translateX(0%) skewX(-15deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    -ms-transform: translateX(0%) skewX(0deg);
    transform: translateX(0%) skewX(0deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    -ms-transform: translateX(100%) skewX(-30deg);
    transform: translateX(100%) skewX(-30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    -ms-transform: rotate(-200deg);
    transform: rotate(-200deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: rotate(200deg);
    -ms-transform: rotate(200deg);
    transform: rotate(200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }

  100% {
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes slideOutLeft {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes slideOutRight {
  0% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes slideOutUp {
  0% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    -ms-transform: rotate(80deg);
    transform: rotate(80deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40% {
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    -ms-transform: rotate(60deg) translateY(0);
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
    -webkit-transform: translateY(700px);
    -ms-transform: translateY(700px);
    transform: translateY(700px);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

@keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg);
    -ms-transform: translateX(-100%) rotate(-120deg);
    transform: translateX(-100%) rotate(-120deg);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

@keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg);
    -ms-transform: translateX(100%) rotate(120deg);
    transform: translateX(100%) rotate(120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}
span {
	color: #ff9800;
}
.navbar-custom .navbar-toggle {
    background: #ff9800;
}
.navbar-custom .nav > li > a:focus,
.navbar-custom .nav > li > a:hover,
.navbar-custom .nav > li.active > a,
.navbar-custom .nav .open > a,
.navbar-custom .nav .open > a:focus,
.navbar-custom .nav .open > a:hover {
    background-color: #ff9800;
    color: #fff;
}
.section-title-left::after , .section-title::after , .single-pricing-table .pricing-title h2::after {
  background: #ff9800 none repeat scroll 0 0;

}
.about-us-right .media:hover  .fa::before {
    background-color: #ff9800;
}
.single-service .media .fa::before {
  background: #ff9800 none repeat scroll 0 0;
}
.single-service .media:hover {
    background-color: #ff9800;
}
.single-service .media:hover .fa::before {
    color: #ff9800;
}
.testimonial-body::before {
  color: #ff9800;
}
.client-name::before {
  background: #ff9800 none repeat scroll 0 0;
}
#testimonial-carousel .owl-controls .owl-buttons .owl-prev:hover , #testimonial-carousel .owl-controls .owl-buttons .owl-next:hover {
	background: #ff9800;
	border: 1px solid transparent;
	color: #fff;
}
.portfolio-filter-nav ul li:hover {
    background: #ff9800 none repeat scroll 0 0;
}
.portfolio-filter-nav ul li.active {
    background: #ff9800 none repeat scroll 0 0;
}
.single-pricing-table:hover .price , .single-pricing-table:hover .pricing-buttons button.buy-btn , .table-active .price {
    background-color: #ff9800;
}
 .table-active .pricing-buttons button.buy-btn {
    background-color: #ff9800 !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}
.our-partners-section {
	background-color: #ff9800;
}
.blog-post-details .post-heading em a {
	color: #ff9800 !important;
}
.blog-post-details button.read-more-btn {
    background: #ff9800 none repeat scroll 0 0;
}
.form-control:focus {
    border-color: #ff9800;
}
.social-icons a .fa:hover {
    background: #ff9800;
}
.portfolio-button button.portfolio-btn {
    border: 2px solid #ff9800;
    color: #ff9800;
}
.portfolio-button button.portfolio-btn:hover {
    background-color: #ff9800;
}
.thumbnails:hover span.portfolio-overlay {
    background-color: #ff9800;
}
button.sl-prev .fa, button.sl-next .fa {
    color: #ff9800;
}
.contact-form-section button.btn-contact {
	background-color: #ff9800;
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */

html {
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */

[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */

a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */

dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */

pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

button,
input,
optgroup,
select,
textarea {
  color: inherit; /* 1 */
  font: inherit; /* 2 */
  margin: 0; /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */

button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */

input[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  box-sizing: content-box; /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
  border: 0; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */

optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}
/* 
 * 	Core Owl Carousel CSS File
 *	v1.3.3
 */

/* clearfix */
.owl-carousel .owl-wrapper:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/* display none until init */
.owl-carousel{
	display: none;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{
	float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
	cursor: pointer;
}
/*
* 	Owl Carousel Owl Demo Theme 
*	v1.3.3
*/

.owl-theme .owl-controls{
	margin-top: 10px;
	text-align: center;
}

/* Styling Next and Prev buttons */

.owl-theme .owl-controls .owl-buttons div{
	color: #FFF;
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
	margin: 5px;
	padding: 3px 10px;
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	background: #869791;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
}
/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
	text-decoration: none;
}

/* Styling Pagination*/

.owl-theme .owl-controls .owl-page{
	display: inline-block;
	zoom: 1;
	*display: inline;/*IE7 life-saver */
}
.owl-theme .owl-controls .owl-page span{
	display: block;
	width: 12px;
	height: 12px;
	margin: 5px 7px;
	filter: Alpha(Opacity=50);/*IE7 fix*/
	opacity: 0.5;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	background: #869791;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
	filter: Alpha(Opacity=100);/*IE7 fix*/
	opacity: 1;
}

/* If PaginationNumbers is true */

.owl-theme .owl-controls .owl-page span.owl-numbers{
	height: auto;
	width: auto;
	color: #FFF;
	padding: 2px 10px;
	font-size: 12px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
}

/* preloading images */
.owl-item.loading{
	min-height: 150px;
	background: url(AjaxLoader.gif) no-repeat center center
}
.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* mouse grab icon */
.grabbing { 
    cursor:url(grabbing.png) 8 8, move;
}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}




.product-card { 
            background: var(--white); 
            border: 1px solid #eee; 
            border-radius: 15px; 
            padding: 20px; 
            transition: 0.3s; 
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
        }
        .product-card:hover { transform: translateY(-10px); border-color: var(--primary); }
        .product-card img { width: 100%; border-radius: 10px; margin-bottom: 15px; }
        
        .btn-brand { 
            background: var(--primary); 
            color: #000; 
            font-weight: 700; 
            border: none; 
            border-radius: 8px; 
            width: 100%;
            padding: 10px;
        }

        /* Sticky Cart Icon - Bottom Right */
        .sticky-cart-btn {
            position: fixed;
            bottom: 30px;
            right: 30px;
            background: #ff9800;
            width: 65px;
            height: 65px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 24px;
            box-shadow: 0 8px 25px rgba(255, 152, 0, 0.4);
            cursor: pointer;
            z-index: 9999;
            text-decoration: none;
        }
        .cart-count-badge {
            position: absolute;
            top: -5px;
            right: -5px;
            background: #000;
            color: #fff;
            font-size: 14px;
            font-weight: bold;
            width: 25px;
            height: 25px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Modal Details */
        .modal-content { border-radius: 20px; border: none; }
        .form-control { border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.copyright-info a{
    color:#fff !important;
}
.copyright-info a span{
    color:#FF9800 !important;
}
.product-grid-row{
      display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px; 
}
.product-grid-row::before{
    display: none !important;
}
.product-grid-row .col-sm-3 {
    padding: 0px !important;
    width: 100%;
}
.cart-item{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cart-item button{
    padding:8px 10px;
    font-size: 20px;
    color:#171717;
}
.cart-item button:nth-child(3){
    background: #FF9800;
    color:#fff;
   margin-left: 5px;
}
#cartModal input ,#cartModal  textarea{
    border:1px solid #171717;
	color:#000 !important;
    border-radius: 5px ;
}
#cartModal input::placeholder,#cartModal textarea::placeholder{
    color:#171717;
}
.product-card button{
    background: #ff9800;
    color:#fff;
    border-color:#ff9800;
}
.product-card img{
        width: 100% !important;
    height: 300px !important;
    object-fit: contain !important;
}
.product-card{
    border-radius: 5px !important;
}
@media(max-width:768px){
    .product-grid-row{
      display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 5px; 
}
}
/* Medium Layout: 1280px. */
@media only screen and (min-width: 992px) and (max-width: 1200px) { 
/* About Us Area */
.dotted .fa::after {
	height: 105px;
}
/* Blog Post Area */
.blog-post-details {
	margin-top: 0;
}
.blog-section .blog-post-details .post-heading {
	margin-bottom: 10px;
}
.blog-post-details button.read-more-btn {
  margin-top: 10px;
}
.blog-post-details .post-heading a h2 {
  font-size: 18px;
}
.blog-post-details p {
  font-size: 14px;
}
#blog-post-carousel .owl-pagination {
  bottom: -15px;
  right: 30%;
}

}
/* Tablet Layout: 768px. */
@media only screen and (min-width: 768px) and (max-width: 991px) { 
 
 /* Navigation Area */
 .navbar-custom .nav li > a {
  font-size: 14px;
  padding: 30px 12px;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 20px 12px;
}

/* About Us Area */
.about-us-right .media p {
  font-size: 14px;
  line-height: 20px;
}
.about-us-right .media {
  margin-top: 30px;
}
.about-us-right .media .fa::before {
  font-size: 25px;
  height: 50px;
  line-height: 50px;
  width: 50px;
}
.about-us-right .media-heading {
  margin-bottom: 8px;
}
.dotted .fa::after {
  height: 103px;
  left: 100px;
}
/* Portfolio Area */
.portfolio-filter-nav ul li {
  font-size: 15px;
  padding: 4px 10px;
}
/*Pricing Table Area*/
.single-pricing-table .pricing-buttons button.buy-btn {
  padding: 5px 30px;
}
.single-pricing-table .pricing-buttons {
  margin: 20px 0;
}
/* Blog Post Area */
#blog-post-carousel .owl-pagination {
	bottom: 0;
	position: inherit;
}
.blog-post-image figure img {
  display: block;
  margin: 0 auto;
}
.blog-post-details {
  text-align: center;
}
.blog-post-details p {
  font-size: 15px;
}
/* Gogle Map Area */
#gmap-wrapper {
  height: 300px;
}
.portfolio-showcase #grid .thumbnails {
  width: 33.33%;
}

}

/* Mobile Layout: 320px. */
@media only screen and (max-width: 767px) { 
.navbar-custom .nav li > a {
  line-height: 18px;
  padding: 12px 18px;
}
.navbar-custom li a {
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
}
.is-sticky .navbar-custom .nav li > a {
  padding: 10px 18px;
}

.logo {
  padding: 11px 12px;
}
.is-sticky .logo {
  padding: 11px 12px;
}
.slider-caption h1 {
  font-size: 35px;
  line-height: 42px;
}
.slider-caption h5 {
  font-size: 13px;
}

/* About Us */
.about-us-left , .about-us-right {
  padding: 45px 15px;
}
.section-title-left {
  letter-spacing: 0.1rem;
  margin-bottom: 35px;
}
.dotted .fa::after {
 display: none;
}
.about-us-right .media-left {
  display: block;
  float: none;
  text-align: center;
}
.about-us-right .media-body {
  text-align: center;
}
.about-us-right .media-heading {
  margin: 20px 0;
}
.about-us-right .media p {
  font-size: 15px;
  line-height: 22px;
}
.section-padding {
  padding: 70px 0;
}
.single-service .media {
  padding: 30px 10px;
}
.sub-title {
  font-size: 14px;
}
.single-service .media .media-left {
  display: block;
  float: none;
  text-align: center;
  padding: 0;
}
.single-service .media .media-body {
  text-align: center;
}
.single-service .media .fa::before {
  font-size: 25px;
  height: 70px;
  line-height: 70px;
  width: 70px;
}
.single-service .media-body h3 {
  margin-bottom: 30px;
  margin-top: 15px;
}
.single-service .media-body h3::after {
  left: 0;
  margin: 0 auto;
  right: 0;
}
.testimonial-body {
  margin-bottom: 50px; 
}
#testimonial-carousel .owl-controls {
  position: inherit;
  bottom: 0;
  right: 0;
}
.testimonial-image {
  display: none !important;
}
.portfolio-filter-nav ul li {
  font-size: 9px;
  padding: 0 3px;
}
.portfolio-button button.portfolio-btn {
  font-size: 12px;
  padding: 5px 20px;
}
.awards-counter {
  padding: 20px 0;
}
.awards-counter .fa {
  font-size: 25px;
  margin-bottom: 5px;
}
.our-awards-section strong span {
  font-size: 30px;
  line-height: 40px;
}
span.count-description {
  font-size: 14px;
  line-height: 30px;
}
.our-awards-padding {
  padding: 30px 0;
}
.single-pricing-table .price {
  height: 80px;
  padding: 8px;
  width: 80px;
  margin: 15px 0;
}
.single-pricing-table .price h1 {
  font-size: 20px;
}
.single-pricing-table .pricing-title {
  margin-bottom: 15px;
}
.single-pricing-table .pricing-buttons {
  margin: 10px 0;
}
.single-pricing-table .pricing-buttons button.buy-btn {
  font-size: 14px;
  padding: 2px 25px;
}
.single-pricing-table {
	margin-bottom: 30px;
}
/* Blog Post Area */
#blog-post-carousel .owl-pagination {
	bottom: 0;
	position: inherit;
}
.blog-post-image figure img {
  display: block;
  margin: 0 auto;
}
.blog-post-details {
  text-align: center;
}
.blog-post-details .post-heading {
	margin-bottom: 10px;
}
.blog-post-details .post-heading em, .blog-post-details .post-heading em a {
	font-size: 14px;
}
.blog-post-details p {
  font-size: 14px;
  line-height: 22px;
}
.blog-section-padding {
	margin-top: 20px;
}
.blog-post-details button.read-more-btn {
  font-size: 12px;
  margin-top: 5px;
  padding: 2px 10px;
}
.contact-form-section {
  padding: 15px;
  margin-top: 15px;
}
#contactForm .form-control {
  font-size: 12px;
  height: 30px;
  line-height: 10px;
  padding: 8px;
}
#contactForm .form-group {
  margin-bottom: 20px;
}
#contactForm .form-group textarea {
	height: 60px;
}
.contact-form-section button.btn-contact {
  font-size: 13px;
  padding: 0 30px;
  width: 100%;
}
.contact-button-padding {
	margin-top: 10px;
}
.contact-form-icon input, .contact-form-icon textarea {
  padding-left: 32px !important;
}
.contact-form-icon .fa {
  font-size: 12px;
  padding: 8px 12px;
}
.goolge-map-section .toggle-map-button button.gmap-btn {
  font-size: 12px;
  padding: 10px 0;
}
#gmap-wrapper {
  height: 300px;
}
.social-icons a .fa {
  font-size: 14px;
  padding: 5px 10px;
}
.portfolio-showcase #grid .thumbnails {
  width: 100%;
}
#main-slide .slider-content {
  top: 60%;
}
.slider-caption h1, #main-slide .item.active .slider-content h1 {
  font-size: 20px;
  line-height: 22px;
  margin-bottom: 18px;
}
.slider-caption h1, #main-slide .item.active .slider-content h5 {
  font-size: 12px;
}
#main-slide .carousel-control i {
  background: #000 none repeat scroll 0 0;
  font-size: 14px;
  padding: 0px 8px;
}
}
/* Wide Mobile Layout: 480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) { 
.portfolio-showcase #grid .thumbnails {
  width: 50%;
}
.portfolio-filter-nav ul li {
  font-size: 12px;
  padding: 5 10px;
}

}