/*

Theme Name: Dotted

Theme URI: http://demo.oceanthemes.net/dotted

Author: OceanThemes

Author URI: http://oceanthemes.net/

Description: Introducing dotted the best premium website template for Freight, Logistics & Transportation. Dotted is easy to use, it provides everything you need to create great looking website. With dotted you can impress your customer by it's professional design and the interactivity. dotted built with latest website technology to ensure your website is looks nice on desktop and mobile. Get dotted now!

Version: 1.0.6

License: GNU General Public License v2 or later

License URI: http://www.gnu.org/licenses/gpl-2.0.html

Text Domain: dotted

Domain Path: /languages

Tags:  one-column, two-columns, right-sidebar,  custom-header, custom-menu, editor-style, featured-images, microformats, post-formats,  sticky-post, translation-ready



This theme, like WordPress, is licensed under the GPL.

Use it to make something cool, have fun, and share what you've learned with others.



Redux Theme is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.

Underscores is distributed under the terms of the GNU GPL v2 or later.



Normalizing styles have been helped along thanks to the fine work of

Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/

*/

/*------------------------------------------------------------------

/*!



[ DOTTED Stylesheet ]



Project:  Dotted Multipurpose HTML Template

Version:  1.0

Last change:  05/06/2016 [release]

Assigned to:  RivaThemes

Primary use:  Online 



[Table of contents]



1. Top bar / .topbar

2. Header / header

3. Navigation / .navi-level-1 

4. Blog / .lastest-blog-container

5. Sidebar / .main-sidebar

6. Search / .modal-search

7. Sub Header / .sub-header

8. Footer / footer

*/

/* #RESET CSS */





.wp-caption-text,

.gallery-caption,

.bypostauthor{



}

.wp-caption {

  max-width: 100%;

}

img.aligncenter {

  margin-left: auto;

  margin-right: auto !important;

  display: block;

  clear: both;

  margin-top: 5px;

  width: auto !important;

}

.aligncenter {

  margin-left: auto;

  margin-right: auto;

  display: block;

  clear: both;

}

img.alignleft {

  margin: 5px 20px 20px 0;

  float: left;

  width: auto !important;

}

.alignleft {

  margin: 5px 10px 20px 0;

  float: left;

}

img.alignright {

  margin: 5px 0 20px 20px;

  float: right;

  width: auto !important;

}

.alignright {

  margin: 5px 0 20px 20px;

  float: right;

}

.transparent {

  z-index: 1;

  display: block;

  padding: 100px 0;

  position: relative;

}

.sticky .post {

  padding: 20px;

  background: #eee;

}

#main_content .sticky .post h2 {

  font-weight: bold;

}

/* Text meant only for screen readers. */

.screen-reader-text {

  clip: rect(1px, 1px, 1px, 1px);

  position: absolute !important;

  height: 1px;

  width: 1px;

  overflow: hidden;

}

.screen-reader-text:focus {

  background-color: #f1f1f1;

  border-radius: 3px;

  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);

  clip: auto !important;

  color: #21759b;

  display: block;

  font-size: 14px;

  font-size: 0.875rem;

  font-weight: bold;

  height: auto;

  left: 5px;

  line-height: normal;

  padding: 15px 23px 14px;

  text-decoration: none;

  top: 5px;

  width: auto;

  z-index: 100000;

  /* Above WP toolbar. */

}

pre,

img {

  max-width: 100%;

}

.textwidget img {

  height: auto;

}

.btn {

  color: #fff;

}

.btn-default {

  color: inherit;

}

.widget_calendar table,

.widget select {

  width: 100%;

}

.widget select {
padding: 5px 5px;
color: #333 !important;

}

.widget_calendar table td,

.widget_calendar table th {

  padding: 9px 6px;

  text-align: center;

  border: 1px solid #ddd;

}

.rsswidget {

  color: #fff;

}

.recentcomments > a {

  font-style: italic;

}

.attachment-post-thumbnail {

  height: auto;

}

.widget ul {

  list-style: none;

}

.widget ul ul {

  padding-left: 20px;

  text-align: left;

}

.widget_nav_menu ul {

  padding-left: 0;

  text-align: left;

}



/* Typography

----------------------------------------------------------*/

h1 {

  font-size: 40px;

  line-height: 1.2;

  margin-top: 0;

}

h2 {

  font-size: 25px;

  line-height: 1.2;

  margin-top: 0; font-weight:400;

}

h3 {

  font-size: 24px;

  line-height: 1.2;

  margin-top: 0;

}

h4 {

  font-size: 18px;

  line-height: 1.2;

  margin-top: 0;

}

h5 {

  font-size: 15px;

  line-height: 1.2;

  margin-top: 0;

}

h6 {

  font-size: 12px;

  line-height: 1.2;

  margin-top: 0;

}

h1,

h2,

h3,

h4,

h5,

h6 {


  font-family: inherit;
    font-weight: 400;
    line-height: 1.1;
    color: #444444;

}

h3,

h4 {

  font-weight: 300;

}

h6 {

  color: #555;

}



a {

  text-decoration: none;

  transition: .3s;

}

a:hover {

  text-decoration: none;

}

a:hover,

a:focus {

  outline: none;

  text-decoration: none;

}

ul{
list-style-position: inside;
  padding: 0;

  margin: 0;

}



body {

  font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;

    color: #666666;

  font-size: 16px;

  line-height: 25px;    -webkit-font-smoothing: antialiased;
    letter-spacing: .1px;
    text-rendering: optimizeLegibility;

}



section {

  padding: 50px 0;

}

section.parallax{

  background-attachment: fixed;

  background-position: top center!important;background-image: url(bg.jpg);

}

/* ==========================================================================

   Bootstrap Custom

   ========================================================================== */

@media (min-width: 1200px) {

  .container {

    width: 1200px;

  }

}



::selection {

  background: #fbaa35;

  color: #fff;

  /* WebKit/Blink Browsers */

}

::-moz-selection {

  background: #fbaa35;

  color: #fff;

  /* Gecko Browsers */

}

/* Main Button Style

----------------------------------------------------------*/

/* Icon Social

----------------------------------------------------------*/

/* Button

----------------------------------------------------------*/

/*reset btn bootstrap */

.reset-btn {

  border: 0;

  outline: none;

  background: 0;

  -webkit-box-shadow: none;

  box-shadow: none;

}

/*button*/

.ot-btn {

  font-size: 13px;

  text-align: center;

  padding: 7px 20px 8px;

  outline: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  display: inline-block;

}

.btns .ot-btn{

  margin-right: 10px;

}

.ot-btn:hover,

.ot-btn:focus {

  text-decoration: none;

}

/*Style*/

.btn-rounded {

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.btn-pill {

  -webkit-border-radius: 25px;

  border-radius: 25px;

}

.block-btn {

  display: block;

}

/*Size*/

.ot-lg {

  padding: 10px 30px;

  font-size: 15px;

}

.ot-ex {

  padding: 13px 40px;

  font-size: 18px;

}

.btn-main-color {

  background: #fbaa35;

  color: #fff;

}

.btn-main-color i{

  margin-left: 5px;

  font-size: 14px;

}

.btn-main-color:hover,

.btn-main-color:focus {

  background: #222;

  color: #fff;

}

.btn-sub-color {

  background: #222;

  color: #fff;

}

.btn-sub-color:hover,

.btn-sub-color:focus {

  background: #fbaa35;

  color: #fff;

}

.btn-border-main-color {

  background: transparent;

  color: #fbaa35;

  border: 1px solid #fbaa35;

}

.btn-border-main-color:hover,

.btn-border-main-color:focus {

  background: transparent;

  color: #222;

  border-color: #222;

}

.btn-border-sub-color {

  background: transparent;

  color: #222;

  border: 1px solid #222;

}

.btn-border-sub-color:hover,

.btn-border-sub-color:focus {

  background: transparent;

  color: #fbaa35;

  border-color: #fbaa35;

}

.strong-btn {

  border-width: 2px;

  font-weight: 600;

}

.ot-btn i {

  margin-left: 5px;

  font-size: 14px;

}

.ot-btn i.fa-angle-right{

  font-size: 18px;

}

.iconbox .ot-btn i{

  font-size: 13px;

}

/* ==========================================================================

   Main Navi

   ========================================================================== */

.navi-level-1 {

  font-size: 21px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  text-transform: uppercase;

}

.navi-level-1 li {

  display: inline-block;

  position: relative;border-right: 1px solid #fff;

}

.navi-level-1 li:last-child{ border:none;}

.navi-level-1 a {

  line-height: 30px;

  padding: 5px 20px;

  display: block;

  position: relative;

}

.navi-level-1 > li > a {

  color: #222;

}

.navi-level-1 a:after {

  content: "|";

  font-family: "FontAwesome";

  position: absolute;

  right: -3px;

  top: 50%;

  margin-top: -17px;

  display: block;

  color: #ddd;

}

.ver2 .navi-level-1 a:after{

  content: "\f111";

  right: -4px;

  font-size: 7px;

  margin-top: -14px;

  color: #fbaa35;

}

.ver3 .navi-level-1 a:after{

  content: "\f10c";

  right: -4px;

  font-size: 9px;

  margin-top: -14px;

  color: #fbaa35;

}

.navi-level-1 li:last-child a:after {

  display: none;

}

.navi-level-1 .fadeInUp {

  -webkit-animation-duration: .3s;

  animation-duration: .3s;

}

@keyframes fadeInUp {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 55px, 0);

    transform: translate3d(0, 55px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.navi-level-1 li:last-child ul.dropdown-menu {

  right: 0;

  left: auto;

}

.header-v1 .dropdown-menu {

  padding: 0;

}

.dropdown-menu {

  float: none;

  background: transparent;

  border: 0;

  -webkit-border-radius: 0;

  border-radius: 0;

  -webkit-box-shadow: none;

  box-shadow: none;

  margin-top: 20px;

  padding: 0;

  height: auto;

  min-width: 215px;

  display: block;

  position: absolute;

  top: 100%;

  left: 0;

  z-index: 99999;

  visibility:hidden;

  opacity: 0;

  transition: 0.3s;

}

.navi-level-1 li:hover > .dropdown-menu{

  opacity: 1;

  visibility: visible;

  margin-top: 0;

}

.dropdown-menu li {

  display: block;

  position: relative;

  width: 100%;

}

.dropdown-menu li a {

  display: block;

  padding: 10px 20px;

  width: 100%;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-size: 13px;

  background: #2e2d26;

  border-top: 1px solid rgba(0, 0, 0, 0.3);

  white-space: normal;

  color: #fff;

  line-height: 30px;

  text-transform: none;

  font-family: "Lato", Arial, sans-serif;

}

.header-v1 .dropdown-menu li a{

  border-top: none;

  border-bottom: 1px solid rgba(0, 0, 0, 0.3);

}

.dropdown-menu li a:after {

  display: none;

}

.dropdown-menu li a:hover {

  background: #fbaa35;

  color: #fff;

}

.dropdown-menu li:last-child {

  border-bottom: none;

}

.dropdown-menu-dark {

  height: auto;

  min-width: 215px;

  display: block;

  position: absolute;

  top: 100%;

  left: 0;

  z-index: 99999;

  display: none;

}

.dropdown-menu-dark li {

  display: block;

  position: relative;

  width: 100%;

}

.dropdown-menu-dark li a {

  display: block;

  padding: 10px 20px;

  width: 100%;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-size: 13px;

}

.dropdown-menu-dark li a:after {

  display: none;

}

.dropdown-menu-dark li a:hover {

  color: #fff;

  background: transparent;

}

.dropdown-menu-dark li:last-child {

  border-bottom: none;

}

.dropdown-menu > li ul {

  height: auto;

  min-width: 215px;

  display: block;

  position: absolute;

  top: 0!important;

  left: 100%!important;

  z-index: 99999;

}

.dropdown-menu > li ul li {

  display: block;

  position: relative;

  width: 100%;

  background: #444;

}

.dropdown-menu > li ul li a {

  display: block;

  padding: 10px 20px;

  width: 100%;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-size: 13px;

  background: #2e2d26;

  border-bottom: 1px solid rgba(0, 0, 0, 0.3);

}

.dropdown-menu > li ul li a:after {

  display: none;

}

.dropdown-menu > li ul li a:hover {

  background: #fbaa35;

  color: #fff;

}

.dropdown-menu > li ul li:last-child {

  border-bottom: none;

}

.open-navi-2,

.open-navi-3 {

  display: block!important;

}

.dropdown-menu > li.active > a,

.dropdown-menu > .active > a, 

.dropdown-menu > .active > a:hover, 

.dropdown-menu > .active > a:focus {

  background: #fbaa35;

}



.navi-warp-h2 .navi-level-1 > li > a {

  color: #fff;

}

.navi-warp-h2 .navi-level-1 > li > a:hover{

  opacity: 0.9;

}

.navi-warp-h2 .navi-level-1 a:after {

  color: #eee;

}

.header-v3 .navi-level-1 > li > a {

  color: #444;

}

.header-v3 .navi-level-1 a:after {

  background: #ddd;

}

.header-v1 .navi-level-1 > li > a:focus,

.header-v1 .navi-level-1 > li > a:hover {

  color: #fbaa35;

}

.navi-warp-h2 .navi-level-1 > li > a:focus{

  color: #fff;

}

/* ==========================================================================

   Navi Seperator Style

   ========================================================================== */

.line-seperator .navi-level-1 > li > a:after {

  content: "/";

  background: transparent;

  top: 5px;

  color: #ddd;

}

.no-seperator .navi-level-1 > li > a:after {

  display: none;

}

/* ==========================================================================

   Sub Navi

   ========================================================================== */

.subnavi {

  font-size: 12px;

  font-family: 'Lato', sans-serif;

  font-weight: 400;

  float: left;

}

.subnavi a {

  color: #fff;

  text-transform: capitalize;

  line-height: 30px;

  padding: 0 7px;

  position: relative;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.subnavi a:after {

  content: "";

  width: 1px;

  height: 8px;

  position: absolute;

  right: -2px;

  top: 4px;

  background: rgba(255, 255, 255, 0.4);

  display: block;

}

.subnavi a:hover {

  color: #eee;

}

.subnavi li {

  display: inline-block;

}

.subnavi li:last-child a:after {

  display: none;

}

/* ==========================================================================

   Top bar

   ========================================================================== */

.topbar-1 {

  width: 100%;

  height: 40px;

  background: #444;

}

.topbar-1 .topbar-1-inner {

  width: 100%;

  max-width: 1170px;

  margin: 0 auto;

  height: 40px;

  padding: 5px 0;

}

.topbar-info span{

  font-weight: bold;

}

.topbar-info li {

  display: inline-block;

  font-size: 12px;

  font-family: 'Lato', sans-serif;

}

.topbar-info-1 {

  float: right;

}

.topbar-info-1 li {

  line-height: 30px;

  color: #eee;

  margin-left: 25px;

}

.topbar-info-1 li a {

  color: #eee;

}

.topbar-info-2 {

  float: right;margin-top:25px;
width: auto;

}

.topbar-info-2 li {

 margin-right: 0px;

float: left;

width: 100%;

text-align: right;    font-weight: bold;
    font-size: 16px;

}



.topbar-info-2 li a {

  color: #000;

}

 .topbar-info-2 li.email-link a {color: #fbaa35;}

.topbar-info-3 {

  float: right;

}

.topbar-info-3 li {

  line-height: 30px;

  color: #444;

  margin-right: 25px;

}

.topbar-info-3 li span {

  color: #999;

}

.topbar-info-3 li a {

  color: #999;

}

/* ==========================================================================

   Logo

   ========================================================================== */

h1.logo {

  margin: 0;

}

.logo-1 {

  float: left;

}

.logo-1 img {

  margin: 20px 0;    width: 150px;

}

.slogan-1 {

  text-transform: uppercase;

  font-size: 11px;

}

/* ==========================================================================

   Header

   ========================================================================== */

.header-line {

  height: 5px;

  background: #eee;

  width: 100%;

  clear: both;

}

.top-header-line {

  height: 3px;

  background: #444;

  width: 100%;

}

.top-header-line .top-header-line-inner {

  height: 3px;

  width: 100%;

  max-width: 1170px;

  margin: 0 auto;

}

/* 

   Header V1

   ========================================================================== */

.header-v1 {

  width: 100%;

  border-bottom: 1px solid #e5e5e5;

  float: left;

}

.header-v1-inner {

  width: 100%;

  margin: 0 auto;

  max-width: 1170px;

}

.header-v1-inner ul.navi-level-1 .dropdown-menu > li ul {

  padding-top: 0!important;

}

.navi-right {

  float: right;

  list-style: none;

}

.navi-right > li {

  display: inline-block;

  margin-left: 10px;

  position: relative;

  padding: 20px 0;

}

.header-v1 .navi-level-1 > li > a {

  padding: 42px 20px;

}
.header-v1.is_stuck .navi-level-1 > li > a {
    padding: 34px 20px;}
	
	.header-v1.is_stuck .logo .img-responsive {margin: 10px 0 10px 0;}

.none .navi-level-1 > li > a{

  padding-left: 15px;

  padding-right: 15px;

}

.navi-right > li > a {

  line-height: 40px;

  width: 40px;

  height: 40px;

  display: block;

  border-width: 1px;

  border-style: solid;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  text-align: center;

}

.navi-right > li > a i {

  font-size: 18px;

}

.navi-right > li > a:hover,

.navi-right > li > a:focus {

  background: #fbaa35;

  color: #fff;

}

.form-search-navi{

  border-top: 3px solid #fbaa35;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.175);

}

.navi-right .fadeInUp {

  -webkit-animation-duration: .3s;

  animation-duration: .3s;

}

@keyframes fadeInUp {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 55px, 0);

    transform: translate3d(0, 55px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}



/* Modal Search Box

  ----------------------- */



.modal-backdrop.in{

  display: none;

}



.search-button .modal {

  overflow: hidden;

}

.modal {

  background: rgba(0, 0, 0, 0.9);

  z-index: 500000;

  overflow: hidden;

}

.modal-content {

  background: transparent;

  -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.5);

          box-shadow: 0 0px 0px rgba(0, 0, 0, 0.5);

  border: 0px solid rgba(0, 0, 0, 0.2);

}

.modal-dialog {

  margin: 0 auto;

  text-align: center;

  position: absolute;

  top: 48%;

  left: 50%;

  margin-left: -300px;

}

.modal-body {

  padding: 0px;

}

.modal-body .search-form {

  width: 555px;

  display: inline-block;

  position: relative;

  margin-top: -60px;

}

.modal-body .search-form input[type="search"] {

  border: none;

  border-bottom: 3px solid #fbaa35;

  font-size: 36px;

  line-height: 36px;

  font-weight: 300;

  width: 100%;

  background: transparent;

  color: #fff;

  padding: 10px 0px;

}

.modal-body .search-form input[type="search"]:focus {

  outline: none;

}

.modal-body .search-form .search-submit {

  position: absolute;

  right: 0;

  top: 13px;

  border: none;

  background: transparent;

  outline: none;

  color: #aaa;

  font-size: 30px;

}

.modal-body .search-form .search-submit:hover{

  color: #eee;

}

.modal .close {

  background: #fbaa35 none repeat scroll 0 0;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  color: #fff;

  font-weight: normal;

  height: 30px;

  line-height: 30px;

  opacity: 1;

  position: absolute;

  right: 25px;

  top: 25px;

  width: 30px;

  z-index: 100000;

  font-family: arial;

  font-size: 16px;

  outline: none;

}





.nav-r {

  float: right;

}

.nav-l {

  float: left;

}

.header-v1.is_stuck {

  background: #fff;

  z-index: 999999;

}

/* 

   Header V2

   ========================================================================== */

.header-v2 {

  overflow: hidden;

  width: 100%;

  background: #fff;-webkit-box-shadow: 0 6px 16px rgba(0,0,0,0.2);
box-shadow: 0 6px 16px rgba(0,0,0,0.2);

}

.header-v2-inner {

  width: 100%;

  margin: 0 auto;

  max-width: 1170px;

}

.logo-2 {

  float: left; width:10%;

}

.logo-2 img {

margin: 0px 0 0px !important;max-width:100px;

}

.navi-warp-h2 {

  width: 100%;

  background: #444;

  height: 50px;

}

.navi-warp-h2-inner {

  width: 100%;

  max-width: 1170px;

  margin: 0 auto;

  height: 100%;

}

.navi-warp-h2-inner nav {

  padding: 5px 0;

}

.navi-right-2 {

  float: right;

  list-style: none;

}

.navi-right-2 > li {

  display: inline-block;

  margin-left: 1px;

  position: relative;

}

.navi-right-2 > li > a {

  line-height: 50px;

  width: 50px;

  height: 50px;

  display: block;

  text-align: center;

  background: rgba(0, 0, 0, 0.05);

  color: #fff;

  font-size: 18px;

}

.navi-right-2 > li > a:hover,

.navi-right-2 > li > a:focus {

  background: #fff;

  color: #fbaa35;

}

.navi-right-2 .cart-button .dropdown-cart{

  border-top-color: #fff;

}

.navi-right-2 .fadeInUp {

  -webkit-animation-duration: .3s;

  animation-duration: .3s;

}

@keyframes fadeInUp {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 55px, 0);

    transform: translate3d(0, 55px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.navi-right-2 .open-search-input {

  top: 100%;

}

.navi-warp-h2-inner .dropdown-menu {

  top: -webkit-calc(100%);

  top: calc(100%);

}

.navi-warp-h2 .navi-level-1 a {

  padding-top: 10px;

  padding-bottom: 10px;padding-left: 30px;
padding-right: 30px;

}

.navi-warp-h2 .nav-l {

  padding: 0;

}

.stick-warp-2,

.navi-warp-h2 {

  -webkit-transition: .2s;

  transition: .2s;

}

.stick-warp-2.is_stuck {

  z-index: 999999;

}

/* 

   Header V3

   ========================================================================== */

.header-v3 {

  width: 100%;

  position: relative;

  background: #fff;

  float: left;

}

.header-v3-inner {

  width: 100%;

  margin: 0 auto;

  max-width: 1170px;

}

.logo-3 {

  line-height: 25px;

  float: left;

  display: block;

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

}

.logo-3 img,

.logo-3 p {

  display: inline-block;

}

.logo-3 p {

  margin: 0;

  vertical-align: middle;

}

.logo-3 span {

  margin: 0 20px;

  display: inline-block;

  width: 2px;

  height: 25px;

  vertical-align: bottom;

}

.header-v3 .navi-level-1 a:after {

  margin-top: -12px;

}

.header-v3 .navi-right li {

  padding: 0;

}

.header-v3 .navi-level-1 > li > a {

  padding-top: 5px;

  padding-bottom: 15px;

}

.header-v3 .social,

.header-v3 .topbar-info,

.header-v3 .nav-r {

  -webkit-transition: all .3s;

  transition: all .3s;

}

.stick-warp-3.is_stuck {

  z-index: 99999;

}

.stick-warp-3.is_stuck .header-v3 {

  padding: 0;

  height: 80px;

  -webkit-transition: all .3s;

  transition: all .3s;

}

.stick-warp-3.is_stuck .social,

.stick-warp-3.is_stuck .topbar-info {

  opacity: 0;

  margin-top: -100px;

  -webkit-transition: all .3s;

  transition: all .3s;

}

.stick-warp-3.is_stuck .nav-r {

  -webkit-transition: all .3s;

  transition: all .3s;

}

/* ==========================================================================

   Sub Header

   ========================================================================== */

.breadcrumb {

  background: transparent;

  text-align: right;

  margin: 0;

  padding: 0;

  line-height: 36px;

  color: #444;

}

.breadcrumb i {

  margin: 0 15px;

  color: #999;

}

.breadcrumb li,

.breadcrumb a {

  color: #999;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.breadcrumb a:hover {

  color: #444;

}

.title-subheader {

  margin-bottom: 0;

  line-height: 36px;    text-align: center;
    margin-bottom: 50px;color: #f7a73a;

}

.breadcrumb > li + li::before {

  content: "";

}

.breadcrumb > li + li + li::before {

  content: "\f101";

  color: inherit;

  font-family: 'FontAwesome';

}

.sub-header-border {

  border-bottom: 1px solid #e5e5e5;

  padding: 150px 100px 100px 100px; background: url(Main-inner-pages-packers.jpg);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;

}


.home .sub-header-border { display:none;}



.sub-header-2 {

  background: url(images/Header/bg-sub-header.jpg) no-repeat fixed;

}

.sub-header-2 .sub-header-warp {

  padding: 50px 0;

  overflow: hidden;

}

.sub-header-2 .sub-header-warp .title-subheader {



}

.sub-header-2 .sub-header-warp .breadcrumb li,

.sub-header-2 .sub-header-warp .breadcrumb a {

  color: #777;

  font-size: 14px;

}

.sub-header-2 .sub-header-warp .breadcrumb a:hover {

  color: #222;

}

.sub-header-2 .sub-header-warp .breadcrumb > .active {

  color: #222;

}



.sub-header-3 {

  background-color: #f2f2f2;

}

.sub-header-3 .sub-header-warp {

  padding: 30px 0 35px 0;

  overflow: hidden;

}

.sub3 .breadcrumb {

  padding: 8px 15px 7px 0;

  float: left;

}



/* ==========================================================================

   Stick Navi HightLight

   ========================================================================== */

.mPS2id-highlight span {

  color: #fbaa35;

}

/* ==========================================================================

   Desktop Verison Demo

   ========================================================================== */

.dskt-padding-55 {

  padding: 55px 0;

}

.dskt-padding-bottom-0 {

  padding-bottom: 0;

}

.desk-no-padding-left {

  padding-left: 0;

}

.relative {

  position: relative;

}

.overflow-hidden {

  overflow: hidden;

}

#page {

  background: #fff;

}

/* ==========================================================================

   Button Mobile Menu

   ========================================================================== */

.btn-menu-mobile {

  display: none;

  float: right;

  color: #000!important;

  position: absolute;

  top: 70%;

  right: 15px;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  font-size: 18px;

  margin-top: -6px;

}

/* ==========================================================================

   Spaces

   ========================================================================== */

.div18 {

  display: inline-block;

  clear: both;

  width: 100%;

  height: 18px;

}

.div70 {

  display: inline-block;

  clear: both;

  width: 100%;

  height: 70px;

}

.no-padding {

  padding: 0;

}

.sm-padding {

  padding: 35px 0;

}

.border-top-section {

  border: 1px solid #e5e5e5;

}

.m-tb-20 {

  width: 100%;

  margin: 20px 0;

}

.m-t-10 {

  margin-top: 10px;

}

.m-t-20 {

  margin-top: 20px;

}

.line {

  border-bottom: 1px solid #e5e5e5;

}

.clearboth {

  display: inline-block;

  width: 100%;

  clear: both;

}

/* ==========================================================================

   Typography

   ========================================================================== */

.text-cap {

  text-transform: capitalize;

}

.text-up {

  text-transform: uppercase;

}
h4.text-up {
 color:#2996cf !important ;

}
.white-text,

.white-text:focus {

  color: #fff;

}

.dark-text {

  color: #222;

}

.soft-grey-text {

  color: #999;

}

/* ==========================================================================

   background & Overlay

   ========================================================================== */

.bg-light-grey {

  background: #f2f2f2;

}

.bg-mid-grey {

  background-color: rgba(34, 34, 34, 0.8);

}

.bg-dark-grey {

  background: #222;

}

.bg-overlay-img-1 {

  background: no-repeat fixed;

  -webkit-background-size: cover;

  background-size: cover;

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 0;

  width: 100%;

}

section.bg-twitter {

  background-position: bottom center!important;

}

.bg-white {

  background: #fff;

}

.bg-overlay-img-2 {

  background: no-repeat fixed;

  -webkit-background-size: cover;

  background-size: cover;

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 0;

  width: 100%;

}

.bg-overlay-color {

  background: rgba(222, 177, 82, 0.8);

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 0;

  width: 100%;

  height: 100%;

}

/* ==========================================================================

   #PAGE LOAD

   ========================================================================== */

body.royal_loader {

  background: none;

  visibility: hidden;

}

#royal_preloader {

  width: 100%;

  height: 100%;

  font-family: Arial;

  font-size: 12px;

  visibility: visible;

  position: fixed;

  top: 0px;

  right: 0px;

  bottom: 0px;

  left: 0px;

  z-index: 9999999999;

  -webkit-transition: opacity 0.2s linear 0.8s;

  transition: opacity 0.2s linear 0.8s;

}

#royal_preloader.complete {

  opacity: 0;

}

#royal_preloader .background {

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0px;

  bottom: 0px;

  left: 0px;

  right: 0px;

  background-color: #000000;

  -webkit-transition: background 0.5s linear;

  transition: background 0.5s linear;

}

#royal_preloader.number .name {

  position: absolute;

  top: 20%;

  left: 0px;

  right: 0px;

  text-transform: uppercase;

  color: #EEEEEE;

  text-align: center;

  opacity: 0;

  -webkit-transition: -webkit-transform 0.3s linear;

  transition: transform 0.3s linear;

  -webkit-animation: fly 0.3s;

  animation: fly 0.3s;

}

#royal_preloader.number .percentage {

  color: #FFFFFF;

  font-family: Impact, Arial;

  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);

  text-align: center;

  margin: -90px 0px 0px -90px;

  background-image: url('../images/loader.gif');

  background-repeat: no-repeat;

  background-position: 50% 0;

  padding-top: 80px;

  width: 180px;

  position: absolute;

  font-size: 50px;

  top: 50%;

  left: 50%;

  -webkit-transition: all 0.3s linear 0.5s;

  transition: all 0.3s linear 0.5s;

}

#royal_preloader.text .loader {

  position: absolute;

  text-shadow: 0 0 15px rgba(0, 0, 0, 0.3);

  text-transform: uppercase;

  text-align: center;

  top: 50%;

  left: 50%;

  width: 240px;

  margin-left: -60px;

  height: 60px;

  line-height: 60px;

  margin-top: -30px;

  font-size: 30px;

  white-space: nowrap;

}

#royal_preloader.text .loader div {

  position: absolute;

  top: 0px;

  right: 0px;

  bottom: 0px;

  left: 0%;

  background-color: #000000;

  opacity: 0.7;

  filter: alpha(opacity=70);

  -webkit-transition: left 0.3s linear;

  transition: left 0.3s linear;

}

#royal_preloader.logo .loader {

  width: 120px;

  height: 120px;

  position: absolute;

  left: 50%;

  top: 50%;

  margin: -74px 0px 0px -60px;

  -webkit-background-size: 100% auto;

  background-size: 100% auto;

  overflow: hidden;

  background-position: 50% 50%;

  background-repeat: no-repeat;

  /*background-size: cover;*/

}

#royal_preloader.logo .loader div {

  position: absolute;

  bottom: 0%;

  left: 0px;

  right: 0px;

  height: 100%;

  opacity: 0.7;

  filter: alpha(opacity=70);

  -webkit-transition: bottom 0.3s linear;

  transition: bottom 0.3s linear;

}

#royal_preloader.logo .percentage {

  position: absolute;

  width: 80px;

  height: 30px;

  line-height: 30px;

  font-family: 'Open Sans', sans-serif;

  font-weight: 400;

  font-size: 18px;

  letter-spacing: 2px;

  top: 50%;

  left: 50%;

  margin: 53px 0px 0px -40px;

  color: #fff;

  text-align: center;

}

@-webkit-keyframes fly {

  0% {

    opacity: 0;

    top: 50%;

  }

  20% {

    opacity: 1;

    top: 40%;

  }

  100% {

    opacity: 0;

    top: 20%;

  }

}

@keyframes fly {

  0% {

    opacity: 0;

    top: 50%;

  }

  20% {

    opacity: 1;

    top: 40%;

  }

  100% {

    opacity: 0;

    top: 20%;

  }

}

/* ==========================================================================

   Head Line

   ========================================================================== */

.headline {

  height: 3px;

  background: #222;

}

.headline .headline-inner {

  display: block;

  max-width: 1170px;

  width: 100%;

  margin: 0 auto;

  height: 3px;

}

/* ==========================================================================

   Social

   ========================================================================== */

.social li {

  display: inline-block;

}

.social-1 {

  float: right;

  margin-left: 25px;

}

.social-1 li a {

  display: block;

  width: 24px;

  height: 24px;

  line-height: 24px;

  text-align: center;

  background: rgba(255, 255, 255, 0.5);

  -webkit-border-radius: 50%;

  border-radius: 50%;

  margin: 3px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.social-1 li a:hover {

  background: #ffffff;

}

.social-2 {

  float: right;

  margin-top: 20px;

}

.social-2 li a {

  display: block;

  width: 24px;

  height: 24px;

  line-height: 24px;

  text-align: center;

  background: rgba(0, 0, 0, 0.3);

  -webkit-border-radius: 50%;

  border-radius: 50%;

  margin: 3px;

  color: #fff;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.social-2 li a:hover {

  background: rgba(0, 0, 0, 0.8);

}

.social-3 {

  float: right;

}

.social-3 li a {

  display: block;

  width: 24px;

  height: 24px;

  line-height: 24px;

  text-align: center;

  margin: 3px;

  color: #333;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 50%;

  border-radius: 50%;

}

.social-3 li a:hover {

  background: rgba(0, 0, 0, 0.8);

  color: #fff;

}

.social-f1 {

  margin-top: 20px;

}

.widget .social-f1 li a {

  display: block;

  width: 24px;

  height: 24px;

  line-height: 24px;

  text-align: center;

  background: rgba(255, 255, 255, 0.3);

  -webkit-border-radius: 50%;

  border-radius: 50%;

  margin: 3px;

  color: #222;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.social-f1 li a:hover {

  background: #ffffff;

}

.social-fr {

  float: right;

}

.social-fr li a {

  display: block;

  width: 24px;

  height: 24px;

  line-height: 24px;

  text-align: center;

  background: rgba(255, 255, 255, 0.3);

  -webkit-border-radius: 50%;

  border-radius: 50%;

  margin: 3px;

  color: #222;

}

.social-fr li a:hover {

  background: #ffffff;

}

.social3-warp {

  clear: both;

  margin-top: 40px;

  width: 100%;

  display: inline-block;

}

.social-f3 {

  clear: both;

  width: 100%;

  display: inline-block;

  margin-top: 40px;

}

.social-f3 li a {

  width: 40px;

  height: 40px;

  color: #fff;

  background: #3a3a3a;

  margin-right: 5px;

  margin-bottom: 5px;

  display: inline-block;

  text-align: center;

  line-height: 40px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.social-f3 li a:hover {

  background: #fff;

  color: #222;

}

.social-single-team li a {

  display: block;

  width: 30px;

  height: 30px;

  line-height: 30px;

  text-align: center;

  margin: 15px 10px 0 0;

  color: #fff;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  background: #222;

  font-size: 0;

}

.social-single-team li a i{

  font-size: 14px;

  line-height: 30px;

}

.social-single-team li a:hover {

  background: #fbaa35;

  color: #fff;

}

.about-single-team-sum {

  min-height: 370px;

}

.about-single-team .personal-title {

  margin-top: 0;

  margin-bottom: 30px;

}

.form-single-team {

  margin-top: 28px;

}

.form-team-single-warp {

  width: 100%;

}

.form-team-single-warp .form-group {

  width: 100%;

}

.form-team-single-warp .form-control {

  width: 100%;

  margin-bottom: 30px;

  height: 40px;

  line-height: 40px;

  background: #f2f2f2;

  border: 1px solid #e5e5e5;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.form-team-single-warp .form-control:focus {

  background: #fff;

  color: #444;

}

.form-team-single-warp .ot-btn {

  display: block;

  width: 100%;

  border: 0;

  color: #fff;

  padding-top: 10px;

  padding-bottom: 10px;

}

.form-team-single-warp textarea.form-control {

  width: 100%;

  background: #f2f2f2;

  min-height: 100px;

  resize: vertical;

  border: 1px solid #e5e5e5;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.form-team-single-warp textarea.form-control:focus {

  background: #fff;

  color: #444;

  border-color: #fbaa35;

}

.customNavigation-skill {

  margin-top: 30px;

}

.skill-warp {

  clear: both;

}

.progress.vertical .progress-bar {

  -webkit-transition: height 1s ease-in-out;

  transition: height 1s ease-in-out;

}

.chart-v-item {

  height: 360px;

  display: block;

  width: 100px;

  position: relative;

  display: inline-block;

  margin-top: 45px;

  padding-bottom: 40px;

}

.chart-v-item .progress.vertical .progress-bar {

  width: 60px;

  left: 20px;

}

.chart-v-item:last-child {

  margin-right: 0;

}

.progress.progress-v {

  width: 100%;

  border: 0;

  -webkit-border-radius: 0;

  border-radius: 0;

  background: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  margin: 0;

}

.label-v {

  color: #666;

  font-size: 13px;

  width: 100%;

  display: block;

  color: #666666;

  text-align: center;

  padding: 0;

  font-weight: normal;

  float: left;

  margin-top: 10px;

}

.percent-v {

  position: absolute;

  left: 20px;

  -webkit-transform: translateY(-10px);

  -ms-transform: translateY(-10px);

  transform: translateY(-10px);

}

.chart-home-2 {

  margin-top: 32px;

}

.chart-home-2 .chart-h-item {

  margin-bottom: 7px;

}

.demo-skill-2-warp {

  display: inline-block;

  width: 100%;

  clear: both;

}

/* ==========================================================================

   Icon box

   ========================================================================== */

.iconbox-set-1-warp,

.iconbox-set-2-warp {

  margin-top: 70px;

}

.iconbox-set-1 {

  padding: 30px 20px;

  border: 1px solid #e5e5e5;

  text-align: center;

}

.iconbox-set-1 h4 {

  margin-top: 20px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300; color:#fff;

}

.iconbox-set-1 a {

  margin-top: 12px;

}



.iconbox-set-1 p {

  margin-top: 20px;

}

.iconbox-set-1:hover .icon-1 {

  

}

.icon-1 {

  width: 120px;

  height: 120px;

  border-width: 10px;

  border-style: solid;

  border-color: #e5e5e5;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  line-height: 120px;

  text-align: center;

  margin: 0 auto;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.icon-1 i {

  font-size: 44px;

  color: #fbaa35;

}

.des-text {

  font-size: 15px;

}

.iconbox-set-2 {

  padding: 30px 20px;

  border: 1px solid #e5e5e5;

  position: relative;

  float: left;

  width: 100%;

}

.iconbox-set-2 h4 {

  margin-top: 10px;

  margin-left: 150px;

}

.iconbox-set-2 p.sub-text {

  margin-left: 150px;

  display: inline-block;

  float: left;

  margin-bottom: 0;

  color: #999;

  font-size: 12px;

}

.iconbox-set-2 a {

  margin-top: 12px;

  margin-left: 150px;

  display: inline-block;

  float: left;

  margin-top: 0;

}

.iconbox-set-2 .ot-btn {

  margin-top: 20px;

}

.iconbox-set-2 .icon-1 {

  position: absolute;

  top: 30px;

  left: 30px;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.iconbox-set-2:hover .icon-1 {

  background-color: #2e2d26;

}

.iconbox-set-3 {

  position: relative;

  margin: 15px 0;

  float: left;

  width: 100%;

}

.iconbox-set-3 h4 {

  margin-left: 90px;

  margin-top: 0;

}

.iconbox-set-3 p {

  margin-top: 12px;

  margin-left: 90px;

  display: inline-block;

  float: left;

  margin-top: 0;

}

.icon-2 {

  position: absolute;

  top: 0px;

  left: 0px;

  width: 70px;

  height: 70px;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  border-width: 1px;

  border-style: solid;

  line-height: 72px;

  text-align: center;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.icon-2 i {

  font-size: 22px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.iconbox {

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.iconbox:hover {

  background: #fbfbfb;

}

.iconbox .hover-text-theme {

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.iconbox:hover .hover-text-theme {

  color: #fbaa35;

}

.iconbox-set-3:hover .icon-2 {

  background: #fbaa35;

}

.iconbox-set-3:hover .icon-2 i {

  color: #fff!important;

}

/* ==========================================================================

   Customnaivgation Owl

   ========================================================================== */

a.btn-1 {

  border-width: 2px;

  border-style: solid;

  border-color: #222;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  color: #222;

}

.customNavigation-1 {

  display: inline-block;

  width: auto;

  margin-left: 20px;

}

.customNavigation-1 a .fa{color:#1d369a !important;}

.relate-post .customNavigation-1{

  display: none;

}

.show-nav .customNavigation-1{

  display: inline-block;

}

.customNavigation-1 a.btn-1 {

  position: relative;

  width: 24px;

  height: 24px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  margin: 0 1px;

  text-align: center;

  cursor: pointer;

  font-size: 13px;

  font-weight: bold;

  vertical-align: top;

}

.customNavigation-1 a.btn-1 .fa-chevron-left {

  margin-left: -2px;

}

.customNavigation-1 a.btn-1 .fa-chevron-right {

  margin-right: -2px;

}

.customNavigation-2 {

  position: absolute;

  right: 0;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  width: auto;

  margin-left: 20px;

  z-index: 9;

}

.customNavigation-2 a.btn-1 {

  position: relative;

  width: 24px;

  height: 24px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  margin: 0 3px;

  text-align: center;

  cursor: pointer;

  font-size: 13px;

  font-weight: bold;

  vertical-align: top;

}

.customNavigation-2 a.btn-1 .fa-chevron-left {

  margin-left: -2px;

}

.customNavigation-2 a.btn-1 .fa-chevron-right {

  margin-right: -2px;

}

.customNavigation-3 {

  display: inline-block;

  width: auto;

  margin-left: 20px;

}

.customNavigation-3 a.btn-1 {

  position: relative;

  width: 24px;

  height: 24px;

  border: 2px solid #fff;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  color: #fff;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  margin: 0 3px;

  text-align: center;

  cursor: pointer;

  font-size: 13px;

  font-weight: bold;

  vertical-align: top;

}

.customNavigation-3 a.btn-1 .fa-chevron-down {

  margin-left: 0px;

  margin-top: -2px;

}

.customNavigation-3 a.btn-1 .fa-chevron-up {

  margin-right: 0px;

  margin-top: -2px;

}

.customNavigation-3 a.btn-1:hover {

  border-color: #fbaa35;

  color: #fbaa35;

}

.customNavigation-4 {

  position: absolute;

  right: 0;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  width: 24px;

  margin-left: 20px;

  z-index: 9;

}

.customNavigation-4 a.btn-1 {

  position: relative;

  width: 24px;

  height: 24px;

  line-height: 19px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  margin: 3px 0px;

  text-align: center;

  cursor: pointer;

  font-size: 13px;

  font-weight: bold;

}

.customNavigation-4 a.btn-1 .fa-chevron-up {

  margin-left: 1px;

}

.customNavigation-4 a.btn-1 .fa-chevron-down {

  margin-left: 1px;

}

.customNavigation-5 {

  margin-left: 0;

  margin: 0 auto;

  float: none;

  text-align: center;

  display: block;

  margin-top: 30px;

}

/* ==========================================================================

   Title

   ========================================================================== */

.title-inline {

  float: left;

  display: inline-block;

  margin-bottom: 0;

  line-height: 1;

}

.relate-post .title-inline{

  float: none;

}

.show-nav .title-inline{

  float: left;

}

.title-center {

  text-align: center;

}

.des-text2 {

  padding-top: 26px;

}

.title-landing {

  margin-bottom: 38px;

}

/* ==========================================================================

   Lightbox

   ========================================================================== */

.overlay-1 {

  background: rgba(34, 34, 34, 0.9);

  opacity: 0;

  position: absolute;

  top: 0;

  left: 0;

  width: -webkit-calc(80%);

  width: calc(80%);

  border: 10px solid #fbaa35;

  height: -webkit-calc(80%);

  height: calc(80%);

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  z-index: 9;

}

.overlay-1 .fa {

  position: absolute;

  top: 50%;

  left: 50%;

  display: block;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  background: #fff;

  color: #444;

  line-height: 28px;

  border: 3px solid #ccc;

  text-align: center;

  width: 34px;

  height: 34px;

  opacity: 0;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.overlay-1 .fa-expand {

  -webkit-transform: translate(-84px, -50%);

  -ms-transform: translate(-84px, -50%);

  transform: translate(-84px, -50%);

}

.overlay-1 .fa-link {

  -webkit-transform: translate(50px, -50%);

  -ms-transform: translate(50px, -50%);

  transform: translate(50px, -50%);

}

.project-lightbox-warp img {

  display: none;

}

/* ==========================================================================

   Lastest Project

   ========================================================================== */

.lastest-project-warp {

  clear: both;

  margin-top: 20px;

  display: block;

  width: 100%;

  float: left;

}

.project-item {

  border: 1px solid #e5e5e5;

  background: #fff;

}

.project-item h4 {

  font-size: 16px;

  text-align: center;

  margin-top: 16px;

  margin-bottom: 12px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.project-item h4 a{

  color: #444;

}

.project-item h4 a:hover{

  color: #000;

}

.project-item p {

  text-align: center;

  margin-bottom: 20px;

  color: #fbaa35;

  text-transform: lowercase;

}

.project-item img {

  padding: 9px;

  border-bottom: 1px solid #e5e5e5;

}

.project-item p a {

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.project-item:hover .overlay-1 {

  opacity: 1;

}

.project-item:hover .overlay-1 .fa {

  opacity: 1;

}

.project-item:hover .overlay-1 .fa-link {

  -webkit-transform: translate(10px, -50%);

  -ms-transform: translate(10px, -50%);

  transform: translate(10px, -50%);

}

.project-item:hover .overlay-1 .fa-expand {

  -webkit-transform: translate(-44px, -50%);

  -ms-transform: translate(-44px, -50%);

  transform: translate(-44px, -50%);

}

.project-item-img-container {

  position: relative;

  width: 100%;

  height: auto;

  display: block;

}

.owl-project .owl-wrapper-outer {

  width: 100%;

}

.owl-project{

  width: auto;

}

.owl-project .item{

  padding: 0 15px;

}

/* ==========================================================================

   Page Portfolio

   ========================================================================== */

.portfolio-warp {

  overflow: hidden;

}

.list-portfolio-warp {

  clear: both;

}

.element-item{

  padding: 15px;

}

.no-padding.row{

  margin: 0;

}

.no-padding .element-item,

.no-padding .item{

  padding: 0;

}



.portfolio-4-col .element-item {

  width: 25%;

}

.filter-portfolio-warp {

  width: 100%;

  float: left;

  clear: both;

  margin-bottom: 30px;

}

.project-style-1 {

  border: 1px solid #e5e5e5;

  -webkit-border-radius: 3px;

  border-radius: 3px;

  float: left;

}

.project-style-1 a {

  float: left;

  padding: 8px 20px;

  opacity: .8;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  position: relative;

  font-family: 'Oswald', sans-serif;

  font-size: 16px;

  margin: 0;

  font-weight: 300;

  color: #444;

}

.project-style-1 a:hover {

  opacity: 1;

  background: #f2f2f2;

}



.project-style-1 a.current {

  opacity: 1;

  background: #fbaa35;

  color: #fff;

}

.project-style-1 a + a {

  border-left: 1px solid #e5e5e5;

}

.project-style-2 {

  border: 1px solid #e5e5e5;

  -webkit-border-radius: 3px;

  border-radius: 3px;

  float: left;

  background: #fff;

}

.project-style-2 a {

  display: inline-block;

  float: left;

  padding: 8px 20px;

  opacity: .5;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  position: relative;

}

.project-style-2 a:hover {

  opacity: 1;

  background: #fbaa35;

}

.project-style-2 a:hover h4 {

  color: #fff;

}

.project-style-2 a h4 {

  font-family: 'Oswald', sans-serif;

  font-size: 16px;

  margin: 0;

  color: #000;

}

.project-style-2 a.current {

  opacity: 1;

  background: #fbaa35;

}

.project-style-2 a.current h4 {

  color: #fff;

}

.project-style-2 a + a {

  border-left: 1px solid #e5e5e5;

}

/* Landing Project */



.no-gutter .project-item {

  margin: 0;

  width: 100%;

  border: 0!important;

  position: relative;

}

.no-gutter .project-item .overlay-1 .fa {

  top: 40%;

}

.no-gutter .project-item img {

  padding: 0;

  border: none;

}

.no-gutter .project-item h4,

.no-gutter .project-item p {

  display: block;

  position: absolute;

}

.no-gutter .project-item h4 a{

  color: #fff;

}

.no-gutter .project-item h4 a:hover{

  color: #fbaa35;

}

.no-gutter .project-item h4 {

  bottom: 45px;

  color: #ffffff;

  left: 50%;

  -webkit-transform: translate(-50%, 100px);

  -ms-transform: translate(-50%, 100px);

  transform: translate(-50%, 100px);

  opacity: 0;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  width: 80%;

}

.no-gutter .project-item p {

  bottom: 5px;

  left: 50%;

  -webkit-transform: translate(-50%, 100px);

  -ms-transform: translate(-50%, 100px);

  transform: translate(-50%, 100px);

  color: #ddd;

  opacity: 0;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-transition-delay: .1s;

  transition-delay: .1s;

}

.no-gutter .project-item p a {

  color: #fff;

}

.no-gutter .project-item p a:hover {

  color: #fbaa35;

}

.no-gutter .project-item:hover h4,

.no-gutter .project-item:hover p {

  opacity: 1;

  -webkit-transform: translate(-50%, 0);

  -ms-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

}



.cate-project span:last-child{

  display: none;

}

/* ==========================================================================

   Testimonial 

   ========================================================================== */

.owl-testimonial-1 {

  float: left;

  clear: both;

  margin-bottom: 45px;

}

.arrow-down {

  width: 0;

  height: 0;

  border-left: 12px solid transparent!important;

  border-right: 12px solid transparent!important;

  border-top-width: 14px;

  border-top-style: solid;

  position: relative;

  left: 50%;

  -webkit-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  transform: translateX(-50%);

  float: left;

}

.testimonial-1-item {

  padding: 40px  70px;

  font-style: italic;

  display: block;

  width: 100%;

  position: relative;

  background: #222;

  border-bottom-width: 3px;

  border-bottom-style: solid;

}

.testimonial-1-item i {

  position: absolute;

  top: 15px;

  left: 15px;

  font-size: 50px;

  color: #333;

  opacity: .5;

}

.testimonial-1-item blockquote {

  border: 0;

  text-align: center;

  margin: 0;

  padding: 0;

  background: transparent;

}

.testimonial-1-item blockquote p{

  font-size: 18px;

  color: #999;

}

.testimonial-1-item footer {

  margin-top: 20px;

  padding: 0;

  font-size: 14px;

  font-style: normal;

}

blockquote {

  color: #f3f3f3;

}

.owl-testimonial-1 .owl-controls {

  position: absolute;

  width: 100%;

  bottom: -45px;

  text-align: center;

}

.owl-page {

  cursor: pointer;

  width: 10px;

  height: 10px;

  display: inline-block;

  background: #fff;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  margin: 0 5px;

}

.title-testi,

.title-clients{

  margin-bottom: 35px;

}

.owl-testimonial-2 {

  display: inline-block;

  float: left;

  clear: both;

  margin-bottom: 15px;

}

.testimonial-2-item {

  padding: 40px ;

  font-style: italic;

  display: block;

  width: 100%;

  position: relative;

  background: #444;

  border-bottom-width: 3px;

  border-bottom-style: solid;

}

.testimonial-2-item i {

  position: absolute;

  top: 13px;

  left: 15px;

  z-index: 0;

  font-size: 45px;

  color: #3a3a3a;

}

.testimonial-2-item blockquote {

  border: 0;

  text-align: center;

  margin: 0;

  padding: 0;

  background: transparent;

  color: #c1c1c1;

  position: relative;

}

.testimonial-2-item blockquote {

  font-size: 16px;

}

.thumb-owl-testimonial-2 {

  display: inline-block;

  width: 100%;

  clear: both;

}

.thumb-owl-testimonial-2 .owl-item.synced .thumb-owl-2 .avatar-owl-2 {

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  border-color: #fbaa35;

}

.thumb-owl-testimonial-2 .thumb-owl-2 {

  margin-top: 0;

}

.thumb-owl-2 {

  cursor: pointer;

  margin-top: 25px;

}

.thumb-owl-2 .avatar-owl-2 {

  width: 70px;

  height: 70px;

  display: block;

  float: left;

  border-radius: 50%;

  overflow: hidden;

}

.thumb-owl-2 .avatar-owl-2 img {

  width: 100%;

}

.thumb-owl-2 .info-client {

  padding-left: 90px;

  text-transform: capitalize;

}

.thumb-owl-2 .info-client h4 {

  color: #444;

  font-size: 16px;

  padding-top: 10px;

  margin-bottom: 3px;

}



.arrow-down-l {

  width: 0;

  height: 0;

  border-left: 12px solid transparent!important;

  border-right: 12px solid transparent!important;

  border-top-width: 14px;

  border-top-style: solid;

  position: relative;

  left: 30px;

  float: left;

}

.owl-testimonial-3 {

  float: left;

  clear: both;

}

.testimonial-item {

  font-style: italic;

  position: relative;

  overflow: hidden;

}

.owl-carousel .testimonial-item {

  min-height: 105px;

}

.testimonial-item .avatar {

  width: 105px;

  height: 105px;

  padding: 10px;

  border: 1px solid #e5e5e5;

  position: absolute;

  top: 0;

  left: 0;

}

.testimonial-item blockquote {

  border: 0;

  margin: 0;

  background: none;

  margin-left: 125px;

  padding: 0;

  float: left;

  color: #999;

}

.testimonial-item blockquote,

.testimonial-item footer {

  font-size: 14px;

}

.testimonial-item footer {

  margin-top: 20px;

  font-family: 'Oswald', sans-serif;

  font-size: 16px;

  font-weight: 300;

  color: #444;

  font-style: normal;

  padding: 0;

  background: transparent;

}

.testimonial-item footer cite {

  font-style: normal;

}

span.quote-square {

  display: inline-block;

  padding: 3px 12px;

  color: #fff;

  font-size: 12px;

  margin-right: 10px;

  margin-bottom: 5px;

  float: left;

  position: relative;

  overflow: visible;

}

.arrow-down-l-2 {

  width: 0;

  height: 0;

  border-left: 1px solid transparent !important;

  border-right: 8px solid transparent !important;

  border-top-width: 7px;

  border-top-style: solid;

  left: 5px;

  bottom: -7px;

  float: left;

  position: absolute;

}

/* Testimonial 3 Cols Page */

.testimonial-3-col-warp {

  margin-top: 40px;

  display: inline-block;

}

.testimonial-2-col-warp {

  margin-top: 40px;

  display: inline-block;

}

.testimonial-2-col-warp .testimonial-3-item {

  min-height: 160px;

}

/* Testimonial with Avatar */

.owl-with-avatar footer {

  margin-top: 20px;

  padding: 0;

  background: transparent;

  text-align: center;

}

/* ==========================================================================

   Partner

   ========================================================================== */

.partner-warp {

  clear: both;

  margin-top: 35px;

  display: block;

  width: 100%;

  float: left;

}

/* ==========================================================================

   Blog

   ========================================================================== */



.owl-blog{

  width: auto;

  margin: 0 -15px;

}

.blog-item {

  border: 1px solid #e5e5e5;

  display: block;

  overflow: hidden;

}

.img-demo-blog {

  display: inline-block;

  float: left;

  width: 170px;

  height: 170px;

  padding: 10px;

  border-right: 1px solid #e5e5e5;

  background: #fff;

}

.img-demo-blog img {

  width: 100%;

  max-width: 100%;

}

.blog-sum-warp {

  width: -webkit-calc(100% - 169px);

  width: calc(100% - 169px);

  min-height: 100%;

  float: left;

  border-left:1px solid #e5e5e5;

  margin-left: -1px;

}

.wid100.blog-sum-warp{

  width: 100%;

}

.blog-sum-inner {

  width: 100%;

  padding: 10px;

  position: relative;

  padding-left: 65px;

  min-height: 120px;

}

.blog-data {

  display: block;

  position: absolute;

  top: 10px;

  left: 10px;

  height: 110px;

  width: 40px;

}

.blog-data .date-time,

.blog-data .blog-type {

  width: 100%;

  height: 50%;

}

.blog-item .blog-footer{

  margin-top: 9px;

  position: static;

}

.blog-data .blog-type {

  background: #444;

  position: relative;

  color: #fff;

  line-height: 55px;

  text-align: center;

  font-size: 20px;

}

.blog-data .blog-type img {

  display: block;

  position: absolute;

  left: 50%;

  top: 50%;

  -webkit-transform: translate(-50%, -50%);

  -ms-transform: translate(-50%, -50%);

  transform: translate(-50%, -50%);

}

.blog-data .date-time {

  color: #fff;

  text-align: center;

  font-weight: 400;

  font-size: 18px;

  font-family: 'Oswald', sans-serif;

  padding: 7px 0;

}

.blog-data .date-time .date {

  line-height: 16px;

}

.blog-data .date-time .month {

  font-size: 13px;

  clear: both;

  display: block;

  width: 100%;

}

.blog-footer {

  width: 100%;

  float: left;

  padding: 10px;

  min-height: 38px;

  background: #f2f2f2;

  position: absolute;

  bottom: 0;

  font-size: 11px;

  border-top-width: 2px;

  border-top-style: solid;

}

.blog-footer ul {

  list-style: none;

  overflow: hidden;

}

.blog-footer ul li {

  float: left;

  padding: 0 7px;

  position: relative;

  font-style: italic;

}

.blog-footer ul li:after {

  display: block;

  width: 1px;

  position: absolute;

  content: "";

  height: 9px;

  background: rgba(0, 0, 0, 0.2);

  top: 6px;

  right: -1px;

}

.blog-footer a {

  color: #444;

}

.blog-footer a:hover{

  color: #fbaa35;

}

.blog-footer li:last-child:after {

  display: none;

}



.owl-blog .item{

  padding: 0 15px;

}

.blog2-item {

  border: none;

  float: left;

  width: 100%;

  margin-bottom: 20px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.blog2-item h3 {

  font-size: 16px;

  color: #fff;

  margin-top: 10px;

}

.blog2-img {

  width: 90px;

  height: 90px;

  padding: 10px;

  border-right: 1px solid rgba(225, 225, 225, 0.1);

  position: relative;

  float: left;

}

.no-thumb .blog2-img{

  width: 0;

  padding: 0;

  border: none;

}

.blog2-detail {

  padding-left: 100px;

  padding-right: 10px;

  min-height: 80px;

}

.no-thumb .blog2-detail{

  padding: 0 10px 10px;

}

.blog2-warp {

  clear: both;

  display: inline-block;

  float: left;

  width: 100%;

  margin-bottom: 15px;

}

.blog2-detail p{

  margin-bottom: 0;

}



.hover-text-theme a{

  color: #444;

}

footer .hover-text-theme a{

  color: #fff;

}

.hover-text-theme a:hover{

  color: #fbaa35;

}



/* ==========================================================================

    Call To Action

   ========================================================================== */

.call1 {

  display: block;

  width: 100%;

  background: #fff;

  position: relative;

  padding: 30px;

}

.call1 h3 {

  padding-right: 200px;

}

.call-action p{

  margin-bottom: 0;

}

.call1 p {

  padding-right: 200px;

}

.call1 .ot-btn {

  position: absolute;

  top: 50%;

  right: 30px;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

}

.call2 {

  display: block;

  width: 100%;

  position: relative;

  padding: 40px 30px;

}

.call2 h3 {

  color: #fff;

  padding-right: 200px;

}

.call2 p {

  color: #999;

  padding-right: 200px;

}

.call2 .ot-btn {

  position: absolute;

  top: 50%;

  right: 30px;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  padding-top: 7px;

  padding-bottom: 8px;

}

.call2 .ot-btn:hover {

  background: #fff!important;

  color: #444!important;

}

.call3 {

  text-align: center;

}

.call3 h3 {

  text-align: center;

  margin-bottom: 30px;

}

.call3 h3 b{

  font-weight: 400;

}

.call3 .sub-heading-call3 {

  color: #fbaa35;

  margin-bottom: 25px;

}

.group-call-btn {

  width: 100%;

  display: inline-block;

  text-align: center;

  margin-top: 35px;

}

.group-call-btn .ot-btn {

  padding-bottom: 8px;

  padding-top: 8px;

  margin: 0 5px;

  min-width: 125px;

}

.group-call-btn .ot-btn i{

  font-size: 17px;

}

/* ==========================================================================

   Feature

   ========================================================================== */

.feature-des-text {

  padding-top: 20px;

}

.discover {

  display: inline-block;

  width: 100%;

  margin-top: 30px;

}

.discover img {

  max-width: 200px;

  display: inline-block;

  float: left;

}

.discover ul.feature {

  display: block;

  float: left;

  width: -webkit-calc(-130%);

  width: calc(-130%);

  margin-left: 10px;

}

.discover ul.feature li {

  color: #444;

  display: inline-block;

  float: left;

  width: 50%;

  font-size: 16px;

  line-height: 30px;

  padding: 0 10px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

}

.discover ul.feature li i {

  margin-right: 5px;

}

.discover .ot-btn {

  margin-left: 20px;

  margin-top: 30px;

  padding-top: 10px;

  padding-bottom: 10px;

}

.discover2 {

  display: inline-block;

  width: 100%;

  margin-top: 30px;

}

ul.feature {

  display: block;

  overflow: hidden;

  margin-top: 20px;

}

ul.features2{

  margin-top: 0;

}

ul.feature li {

  color: #444;

  display: inline-block;

  float: left;

  width: 50%;

  font-size: 16px;

  line-height: 34px;

  padding-right: 10px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

}

ul.feature li i {

  margin-right: 5px;

}





.service-box h3{

  margin: 15px 0;

}

.service-box a{

  margin-top: 10px;

  display: inline-block;

}

.service-box a:hover{

  color: #444;

}



/* 

   Tab + Accrodion

   ========================================================================== */

.panel {

  border: 0;

}

.panel-custom {

  margin: 0;

  -webkit-border-radius: 0;

  border-radius: 0;

  border-width: 1px;

  border-style: solid;

  border-left: 0;

  border-top-color: #e5e5e5!important;

  border-right-color: #e5e5e5!important;

  border-bottom: 0;

}

.panel-custom .panel-heading {

  padding: 0;

  -webkit-border-radius: 0;

  border-radius: 0;

  border-bottom: 0;

}

.panel-custom .panel-heading h4 {

  font-size: 16px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  margin-bottom: 0;

}

.panel-custom .panel-heading h4 i {

  margin-right: 10px;

}

.panel-custom .panel-heading a {

  padding: 15px 20px;

  color: #444;

  display: block;

  width: 100%;

  border-left-width: 3px;

  border-left-style: solid;

  border-left-color: #fbaa35;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.panel-custom .panel-heading a.collapsed {

  border-left-color: #444;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.panel-custom .panel-body {

  border-top: 1px solid #e5e5e5!important;

  padding: 15px 20px;

}

.panel-custom:last-child {

  border-bottom: 1px solid #e5e5e5!important;

}

.panel-collapse {

  border-left-width: 3px;

  border-left-style: solid;

  border-left-color: #444;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.panel-collapse.collapse.in {

  border-left-color: #fbaa35;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

/* ==========================================================================

   Owl Partner

   ========================================================================== */

.owl-partner {

  border-left: 1px solid #e5e5e5;

  border-right: 1px solid #e5e5e5;

}

.owl-partner .item {

  border: 1px solid #e5e5e5;

  margin-left: -1px;

}

.owl-partner img {

  max-width: 150px;

  display: block;

  margin: 0 auto;

  padding: 25px 5px;

  opacity: .7;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.owl-partner img:hover {

  opacity: 1;

}

/* ==========================================================================

   Bx Slider

   ========================================================================== */

.bx-wrapper .bx-viewport {

  background-color: transparent;

  border: 0;

  -webkit-box-shadow: none;

  box-shadow: none;

}

.widget .blog2-item h3 {

  margin-bottom: 10px;

  font-size: 14px;

}

.bx-wrapper {

  max-width: 100%!important;

}

.bx-wrapper li {

  width: 100%!important;

}

/* ==========================================================================

   Twitter Widget 

   ========================================================================== */

.twitter-warp {

  position: relative;

}

.twitter1-warp {

  min-height: 68px;

  width: -webkit-calc(100% - 100px);

  width: calc(100% - 100px);

  padding-left: 100px;

}

.twitter-widget-1 ul {

  display: inline-block;

  width: -webkit-calc(100% - 30px);

  width: calc(100% - 30px);

  font-size: 16px;

  list-style: none;

}

.twitter-widget-1 ul img {

  display: none;

}

.twitter-widget-1 ul a {

  color: #444;

  margin-right: 10px;

}

.twitter-widget-1 p.tweet{

  font-style: italic;

  font-size: 15px;

}

.bg-dark {

  color: #aaa;

}

.nav-dark a.btn-1{

  color: #fff;

  border-color: #fff;

}

.nav-dark a.btn-1:hover{

  color: #fbaa35;

  border-color: #fbaa35;

}

.bg-dark ul a{

  color: #eee;

}

.twitter-widget-1 ul a:hover {

  color: #fbaa35;

}

.twitter-widget-1 ul .interact {

  display: none;

}

.twitter-widget-1 ul .timePosted a {

  color: #fbaa35;

  text-align: right;

  margin-top: 10px;

  font-size: 12px;

}

.twitter-logo-fix {

  width: 68px;

  height: 68px;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  border-width: 6px;

  border-style: solid;

  border-color: #fbaa35;

  display: inline-block;

  float: left;

  line-height: 56px;

  text-align: center;

  font-size: 36px;

}

.twitter-widget-2 {

  font-size: 13px;

  color: #999;

  margin-top: 0px;

}

.twitter-widget-2 li {

  min-height: 180px;

  padding-left: 50px;

}

.twitter-widget-2 a {

  color: #fff;

}

.twitter-widget-2 a:hover {

  color: #fbaa35;

}

.twitter-widget-2 img {

  display: none;

}

.twitter-widget-2 .interact {

  display: none;

}

.twitter-widget-2 .timePosted {

  text-align: right;

  font-style: italic;

  font-size: 12px;

  margin-top: 10px;

}

.twitter-widget-2 .timePosted a {

  color: #fbaa35;

}

.twitter-widget-2 ul > li:before {

  content: "\f099";

  font-family: 'FontAwesome';

  font-size: 36px;

  color: #00aced;

  position: absolute;

  top: 7px;

  left: 0px;

}

.icon-twitter-3 {

  width: 68px;

  height: 68px;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  border-width: 2px;

  border-style: solid;

  border-color: #fbaa35;

  color: #fbaa35;

  display: block;

  line-height: 68px;

  text-align: center;

  font-size: 36px;

  margin: 0 auto 25px;

}

.twitter-owl-warp {

  color: #999;

}

.twitter-owl-warp.bg-dark {

  color: #aaa;

}

.twitter-owl-warp ul {

  list-style: none!important;

}

.twitter-owl-warp li {

  max-width: 760px;

  padding: 0 15px;

  margin: 0 auto;

  display: block;

}

.twitter-owl-warp a {

  color: #444;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.bg-dark a{

  color: #eee;

}

.twitter-owl-warp .owl-page {

  background: #444;

}

.bg-dark .owl-page{

  background: #eee;

}

.twitter-owl-warp .owl-page.active {

  background: #fbaa35;

}

.twitter-owl-warp a:hover {

  color: #fbaa35;

}

.twitter-owl-warp .timePosted,

.twitter-owl-warp .interact,

.twitter-owl-warp .tweet {

  text-align: center;

}

.twitter-owl-warp .timePosted a {

  display: inline-block;

  margin: 25px auto;

  padding: 7px 25px;

  color: #fff;

  background: #fbaa35;

}

.twitter-owl-warp .timePosted a:hover{

  background: #444;

}

.twitter-owl-warp .interact a {

  margin: 0 15px;

}

.twitter-owl-warp .owl-controls {

  text-align: center;

  margin-top: 25px;

}



/* ==========================================================================

   Tab responsive

   ========================================================================== */

.tab1 {

  border-bottom: 0;

  position: relative;

  border-right: 1px solid #e5e5e5;

}

.tab1:before {

  display: block;

  content: "";

  width: 100%;

  height: 4px;

  background: #444;

  top: 0px;

  position: absolute;

  left: 0;

}

.tab1 > li > a {

  border: 0;

  border-left: 1px solid #e5e5e5!important;

  -webkit-border-radius: 0;

  border-radius: 0;

  border-top-width: 4px;

  border-top-style: solid;

  border-top-color: #444;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  margin-right: 0;

  float: left;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.tab1 > li > a h4 {

  color: #999;

}

.tab1 > li:last-child > a {

  border-right: 1px solid #e5e5e5;

}

.tab-content-1 {

  padding: 20px;

  border: 1px solid #e5e5e5;

  float: left;

  width: 100%;

}

.tab-content-1 .img-tab-demo {

  float: left;

}

.tab-content-1 .tab-text-warp {

  padding-left: 280px;

}

.tab1 > li.active > a,

.tab1 > li.active > a:hover,

.tab1 > li.active > a:focus {

  border-bottom: 1px solid #e5e5e5;

  border-top-width: 4px;

  border-top-color: #fbaa35;

  border-right: 0;

  border-bottom: 0;

}

.tab1 > li.active > a h4,

.tab1 > li.active > a:hover h4,

.tab1 > li.active > a:focus h4 {

  color: #444;

}

.tab1 > li > a:hover,

.tab1 > li > a:focus {

  border-left-color: #e5e5e5!important;

  border-right-color: #e5e5e5!important;

  border-top-color: #fbaa35;

  background: none;

}

.tab1 > li > a:hover h4,

.tab1 > li > a:focus h4 {

  color: #444;

}

.tab1 > li:last-child.active > a {

  border-right: 1px solid #e5e5e5;

}

.tab2 > li > a {

  padding: 10px 25px;

}

.tab-content-2 {

  padding: 20px;

  padding-bottom: 0;

}

.nav-tabs > li {

  margin-bottom: 0;

}

p.rate .fa-star {

  color: #fbaa35;

}

.tab-content-2 {

  padding: 20px;

  border: 1px solid #e5e5e5;

  float: left;

  width: 100%;

}

.tab-content-2 .tab-text-warp {

  padding-left: 0px;

}

/* ==========================================================================

   Form Subcribe

   ========================================================================== */

.subcribe-warp {

  width: 100%;

  display: inline-block;

  padding: 40px 15px;

}

.subcribe1-warp h4 {

  font-size: 18px;

  line-height: 18px;

  margin-bottom: 5px;

}

.subcribe1 .form-control {

  height: 40px;

  -webkit-box-shadow: none;

  box-shadow: none;

  border: 0;

  width: -webkit-calc(100% - 25px);

  width: calc(100% - 25px);

}

.subcribe1 .form-group {

  width: -webkit-calc((100% - 227px)/2);

  width: calc((100% - 227px)/2);

}

.subcribe1 .btn {

  background: transparent;

  border: 2px solid #fff;

  color: #fff;

  width: 100%;

  max-width: 220px;

  font-family: 'Oswald', sans-serif;

  font-size: 16px;

  font-weight: 300;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  line-height: 34px;

  padding: 0;

  outline: none!important;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.subcribe1 button i {

  font-size: 11px;

  display: inline-block;

  vertical-align: 3px;

  margin-left: 5px;

}

.subcribe1 .btn:hover,

.subcribe1 .btn:focus {

  background: #fff;

  color: #444;

  border: 2px solid #fff;

}

.mc4wp-error{

  color: red;

  margin-top: 10px;

}

.mc4wp-success{

  color: #237a91;

  padding: 10px;

  background: #fff;

  border-radius: 20px;

  text-align: center;

}

/* ==========================================================================

   About Page

   ========================================================================== */

/* 

   Owl Core Feature

   ========================================================================== */

.core-feature-warp {

  clear: both;

  margin-top: 15px;

  float: left;

  width: 100%;

}

.owl-core-feature .iconbox-set-3 {

  padding-right: 15px;

}

/* 

   Our Skill

   ========================================================================== */

.additional-text {

  margin-top: 30px;

}

.additional-text .ot-btn {

  margin-top: 25px;

  padding-top: 10px;

  padding-bottom: 10px;

}

.progress-warp {

  clear: both;

  margin-top: 20px;

  float: left;

  width: 100%;

}

.chart-h-item h4 {

  font-family: 18px;

  text-indent: 10px;

}

.chart-h-item .percent-h {

  margin-left: 10px;

}

.progress-h {

  border: 1px solid #e5e5e5;

  padding: 10px;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-border-radius: 0;

  border-radius: 0;

  height: 30px;

  background: transparent;

  position: relative;

}

.progress-h:before {

  content: "";

  background: #444;

  height: 10px;

  width: -webkit-calc(100% - 20px);

  width: calc(100% - 20px);

  top: 10px;

  left: 10px;

  position: absolute;

}

.progress-h .progress-bar {

  line-height: 30px;

  height: 10px;

  position: absolute;

  overflow: hidden;

}

.progress-bar {

  -webkit-transition: width 1s ease-in-out;

  transition: width 1s ease-in-out;

}

.demo-skill {

  display: block;

  position: absolute;

  top: -30px;

  width: 340px;

  -webkit-filter: drop-shadow(-7px 5px 4px rgba(0, 0, 0, 0.5));

  filter: drop-shadow(-7px 5px 4px rgba(0, 0, 0, 0.5));

  left: 70px;

}

/* ==========================================================================

   Our Team

   ========================================================================== */

.team-warp {

  clear: both;

  margin-top: 20px;

  display: block;

  width: 100%;

  float: left;

}

.owl-item .item .team-item {

  width: -webkit-calc(70%);

  width: calc(70%);

}

.team-item {

  width: 100%;

  border: 1px solid #e5e5e5;

  background: #fff;

}



.team-slider .steam{

  padding: 0 15px;

}

.team-slider .owl-pagination{

  text-align: center;

  margin-top: 25px;

}

.team-slider .owl-page{

  background: #444;

}

.team-slider .owl-page.active{

  background: #fbaa35;

}

.team-item h4 {

  font-size: 18px;

  text-align: center;

  margin-top: 16px;

  margin-bottom: 4px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.team-item p {

  text-align: center;

  margin-bottom: 15px;

}

.team-item img {

  padding: 9px;

  border-bottom: 1px solid #e5e5e5;

}

.team-item p a {

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.team-item:hover .overlay-1 {

  border-color: #fbaa35;

  opacity: 1;

}

.team-item:hover .overlay-1 .fa {

  opacity: 1;

}

.team-item:hover .overlay-1 .fa-link {

  -webkit-transform: translate(10px, -50%);

  -ms-transform: translate(10px, -50%);

  transform: translate(10px, -50%);

}

.team-item:hover .overlay-1 .fa-expand {

  -webkit-transform: translate(-44px, -50%);

  -ms-transform: translate(-44px, -50%);

  transform: translate(-44px, -50%);

}

.team-info {

  text-align: center;

  padding: 0 15px;

}

.team-social-warp {

  display: block;

  clear: both;

  width: 100%;

  background: #f2f2f2;

  height: 40px;

  border-top-width: 2px;

  border-top-style: solid;

  border-top-color: transparent;

  text-align: center;

  line-height: 38px;

}

.team-social-warp a {

  color: #444;

  font-size: 18px;

  margin: 0 7px;

}

.team-item-img-container {

  position: relative;

}

.overlay-1 {

  background: rgba(34, 34, 34, 0.85);

  opacity: 0;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  z-index: 0;

}

.overlay-1 .fa {

  position: absolute;

  top: 50%;

  left: 50%;

  display: block;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  background: #fff;

  color: #444;

  line-height: 28px;

  border: 3px solid #ccc;

  text-align: center;

  width: 34px;

  height: 34px;

  opacity: 0;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.overlay-1 .fa-expand {

  -webkit-transform: translate(-84px, -50%);

  -ms-transform: translate(-84px, -50%);

  transform: translate(-84px, -50%);

}

.overlay-1 .fa-link {

  -webkit-transform: translate(50px, -50%);

  -ms-transform: translate(50px, -50%);

  transform: translate(50px, -50%);

}

.team-item img {

  -webkit-filter: contrast(0.9);

  filter: contrast(0.9);

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.team-item:hover img {

  -webkit-filter: contrast(1.2);

  filter: contrast(1.2);

}

.hidden-control-owl .owl-controls {

  display: none!important;

}

.owl-team .owl-pagination {

  text-align: center;

  margin-top: 25px;

}

.owl-team .owl-page {

  background: #999;

}

.owl-team .owl-page.active {

  background: #fbaa35;

}

.team-warp-landing {

  margin-top: 0;

}

.team-item.team-circle {

  border: 0;

}

.team-item.team-circle img {

  -webkit-border-radius: 50%;

  border-radius: 50%;

  border: 0;

}

.team-item.team-circle .team-social-warp {

  background-color: #fff;

  border: 0;

}

.team-item.team-circle .team-social-warp a {

  display: inline-block;

}

.team-item.team-circle .overlay-1 {

  -webkit-border-radius: 50%;

  border-radius: 50%;

}

/* Team Single */

h3.personal-title {

  margin: 30px 0 10px 0;

}

.personal-information {

  list-style: none;

  padding: 0;

  margin: 0;

  display: inline-block;

  width: 100%;

}

.personal-information li {

  display: inline-block;

  width: 100%;

  border-bottom: 1px solid #e5e5e5;

  padding: 10px 0;

}

.personal-information li span {

  min-width: 70px;

  display: inline-block;

}

.personal-avatar {

  width: 100%;

  padding: 9px;

  border: 1px solid #e5e5e5;

}

.personal-avatar img {

  width: 100%;

  max-width: 100%;

}

.quote-single {

  font-size: 16px;

  color: #444;

}

/* ==========================================================================

   Blog Style

   ========================================================================== */

.main-page {

  width: 75%;

  padding-right: 15px;

  padding-left: 15px;

  float: left;

}

.sidebar-page {

  float: left;

  padding-left: 15px;

  padding-right: 15px;

  width: 25%;position: sticky;
top: 0;

}

.sidebar-page .widget li a {
    color: #000;
}

.item-blog {

  clear: both;

  margin-bottom: 70px;

}

.blog-feature-warp {

  padding: 9px;

  border: 1px solid #e5e5e5;

}

.blog-feature-warp img {

  max-width: 100%;

}

.blog-feature-warp iframe {

  width: 100%;

  max-width: 100%;

}

.blog-single-feature-img .blog-feature-warp {

  width: 100%;

}

.blog-feature-content-inner {

  overflow: hidden;

  border-top: 1px solid #e5e5e5;

  margin-top: -1px;

}

.blog-footer-2 {

  width: 100%;

  padding: 10px;

  min-height: 38px;

  background: #f2f2f2;

  font-size: 12px;

  border-top-width: 2px;

  border-top-style: solid;

  overflow: hidden;

}

.blog-footer-2 ul {

  list-style: none;

  float: left;

}

.blog-footer-2 ul li {

  display: inline-block;

  float: left;

  padding: 0 7px;

  position: relative;

}

.blog-footer-2 ul li:after {

  display: block;

  width: 1px;

  position: absolute;

  content: "";

  height: 8px;

  background: rgba(0, 0, 0, 0.3);

  top: 6px;

  right: -1px;

}

.blog-footer-2 ul.social-share {

  float: right;

}

.blog-footer-2 a {

  color: #444;

}

.blog-footer-2 li:last-child:after {

  display: none;

}

ul.social-share {

  list-style: none;

}

ul.social-share li {

  display: inline-block;

  padding: 0 5px;

  position: relative;

}

ul.social-share li a {

  font-size: 13px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

ul.social-share li a:hover {

  color: #fbaa35;

}

ul.social-share li:after {

  display: none;

}

.blog-feature-content {

  border: 1px solid #e5e5e5;

  border-top: 0;

}

.blog-feature-content .blog-data {

  position: static;

  display: inline-block;

  margin: 9px;

  float: left;

}

.blog-feature-content .blog-text {

  float: left;

  width: -webkit-calc(100% - 58px);

  width: calc(100% - 58px);

  padding: 9px;

}

.timeline-panel .blog-feature-content .blog-text{

  width: 100%;

}

.blog-feature-content .blog-text h4 a {

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.hover-text-theme{

  color: #444;

}

.readmore {

  color: #444;

  display: inline-block;

}

.blog-video-popup {

  position: relative;

  width: 100%;

  height: 100%;

  float: left;

  display: block;

  border: 1px solid #e5e5e5;

}

.blog-video-popup .blog-feature-warp {

  width: 40%;

  display: inline-block;

  float: left;

  border-top: 0;

  border-left: 0;

  border-bottom: 0;

  position: relative;

}

.blog-video-popup .blog-feature-content {

  width: 60%;

  display: inline-block;

  float: left;

  border: 0;

  padding-bottom: 42px;

}

.blog-video-popup .blog-data {

  position: static;

  display: inline-block;

  margin: 9px;

  float: left;

}

.blog-video-popup .blog-text {

  display: inline-block;

  width: -webkit-calc(100% - 58px);

  width: calc(100% - 58px);

  float: left;

  padding: 9px;

  padding-left: 10px;

}

.blog-video-popup .blog-text h4 {

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.blog-video-popup .blog-footer-2 {

  position: absolute;

  bottom: 0;

  right: 0;

  width: 60%;

}

.overlay-btn-video {

  background: rgba(0, 0, 0, 0.1) url("images/Icon/btn-play.png") center center no-repeat;

  position: absolute;

  top: 0;

  left: 0;

  display: block;

  width: 100%;

  height: 100%;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.overlay-btn-video:hover {

  background-color: rgba(0, 0, 0, 0.5);

}

.blog-gallery-feature-img .blog-feature-warp {

  position: relative;

}

.blog-gallery-feature-img .blog-feature-warp .prev-image {

  width: 20px;

  height: 37px;

  background: url("images/Icon/Left.png") no-repeat;

  display: block;

  position: absolute;

  left: 24px;

  top: 50%;

  -webkit-transform: translateY(-18px);

  -ms-transform: translateY(-18px);

  transform: translateY(-18px);

  z-index: 9;

  opacity: .1;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  cursor: pointer;

}

.blog-gallery-feature-img .blog-feature-warp .prev-image:hover {

  opacity: .9;

}

.blog-gallery-feature-img .blog-feature-warp .next-image {

  width: 20px;

  height: 37px;

  background: url("images/Icon/Right.png") no-repeat;

  display: block;

  position: absolute;

  right: 24px;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  z-index: 9;

  opacity: .1;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  cursor: pointer;

}

.blog-gallery-feature-img .blog-feature-warp .next-image:hover {

  opacity: .9;

}

.blog-gallery-feature-img .blog-feature-warp:hover .prev-image,

.blog-gallery-feature-img .blog-feature-warp:hover .next-image {

  opacity: .9;

}

.pagination-blog{

  clear: both;

  font-family: "Oswald";

}

.pagination-blog li a {

  font-size: 16px;

  padding: 5px 15px;

  border: 1px solid #e5e5e5;

  margin-right: 5px;

  margin-bottom: 5px;

  color: #444;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.pagination-blog li a:hover {

  background: #f2f2f2;

  font-size: 16px;

  padding: 5px 15px;

  border: 1px solid #e5e5e5;

  margin-right: 5px;

  margin-bottom: 5px;

  color: #444;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.pagination-blog li span {

  background: #f2f2f2;

  font-size: 16px;

  padding: 5px 15px;

  border: 1px solid #e5e5e5;

  margin-right: 5px;

  margin-bottom: 5px;

  color: #444;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.pagination-blog li span:hover {

  background-color: #f2f2f2;

  font-size: 16px;

  padding: 5px 15px;

  border: 1px solid #e5e5e5;

  margin-right: 5px;

  margin-bottom: 5px;

  color: #444;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}



.owl-blog-landing {

  width: auto;

  margin: 0 -15px;

}

.owl-blog-landing .item-blog {

  border: 1px solid #e5e5e5;

  margin: 15px;

  background: #fff;

}

.owl-blog-landing .owl-pagination {

  text-align: center;

  margin-top: 25px;

}

.owl-blog-landing .owl-page {

  background: #999;

}

.owl-blog-landing .owl-page.active {

  background: #fbaa35;

}

/* ==========================================================================

   Main SideBar

   ========================================================================== */

.widget {

  margin-bottom: 50px;

}

footer .widget{

  margin-bottom: 20px;

}

.widget h3 {

  margin-bottom: 20px;

}

.main-sidebar .widget li{

  border-bottom: 1px solid #e5e5e5;

  padding: 10px 0;

  line-height: inherit;

}

.widget li a{

  color: #fbaa35;

}

.widget li a:hover{

  color: #fbaa35;

}

.widget-search form {

  position: relative;

}

.widget-search form button {

  position: absolute;

  top: 0;

  right: 0;

  height: 100%;

  width: 50px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-size: 18px;

}

.widget-search form button:hover {

  color: #fbaa35;

}

.widget-search .form-group {

  width: 100%;

  border: 0;

  background: #f2f2f2;

  -webkit-border-radius: 0;

  border-radius: 0;

  outline: none;

  -webkit-box-shadow: 0;

  box-shadow: 0;

  height: 40px;

  line-height: 40px;

}

.widget-search .form-control {

  border: 0;

  width: 100%;

  background: #f2f2f2;

  -webkit-border-radius: 0;

  border-radius: 0;

  outline: none;

  -webkit-box-shadow: 0;

  box-shadow: 0;

  -webkit-box-shadow: none;

  box-shadow: none;

  height: 40px;

  line-height: 40px;

  padding-right: 50px;

}

.widget_categories ul.category {

  list-style: none;

}

.widget_categoriesul.category li {

  border-bottom: 1px solid #e5e5e5;

  position: relative;

}

.widget_categories ul li:before {

  content: "\f115";

  font-family: 'FontAwesome';

  font-size: 15px;

  color: #999;

  margin-right: 10px;

}

.widget_categories ul.category li a {

  font-size: 13px;

  color: #444;

  padding: 10px 0;

  display: inline-block;

  text-indent: 10px;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.widget_categories ul.category li .count {

  float: right;

  display: block;

  width: 28px;

  height: 28px;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  border: 1px solid #f2f2f2;

  text-align: center;

  line-height: 26px;

  margin: 5px 0;

  color: #999;

}

.widget-category ul.category li:hover a {

  color: #fbaa35;

}

.widget-tabs {

  display: inline-block;

  width: 100%;

}

.item-blog-sidebar {

  border: 1px solid #e5e5e5;

  min-height: 85px;

  margin-bottom: 20px;

}

.item-blog-sidebar .blog-feature-warp {

  width: 85px;

  height: 85px;

  padding: 10px;

  border: 0;

  border-right: 1px solid #e5e5e5;

  float: left;

}

.item-blog-sidebar .blog-feature-content {

  width: -webkit-calc(100% - 85px);

  width: calc(100% - 85px);

  display: inline-block;

  border: 0;

  padding: 6px 10px;

}

.item-blog-sidebar .blog-feature-content.none-img{

  width: 100%;

}

.item-blog-sidebar .blog-feature-content a h4 {

  margin-top: 5px;

  margin-bottom: 5px;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.widget-accordion h3 {

  margin-bottom: 30px;

}

.widget-text .ot-btn {

  margin-top: 25px;

}



.widget_recentpost_widget li{

  border: 1px solid #e5e5e5;

  padding: 0!important;

  line-height: inherit;

  margin-bottom: 10px;

  min-height: 70px;

}

.post-preview-small{

  position: relative;

  padding-left: 60px;

}

.no-thumb .post-preview-small{

  padding-left: 0;

}

.post-preview-small figure{

  position: absolute;

  top: 0;

  left: 0;

  padding: 10px;

  border-right: 1px solid #e5e5e5;

}

.no-thumb .post-preview-small figure{

  padding: 0;

}

.right-post {

  min-height: 40px;

  padding: 10px 20px;

}

.right-post h4{

  font-family: 'Lato', sans-serif;

  font-weight: 400;

  margin-bottom: 8px;

  line-height: 1;

}

footer .right-post a{

  color: #eee;

}

footer .widget_recentpost_widget li{

  padding-bottom: 20px;

}

.right-post .meta{

  font-size: 12px;

  margin-bottom: 0;

}

.right-post .meta i{

  margin-right: 3px;

}

.post-preview-small .right-post a{

  font-size: 14px;

}



.taglist{

  margin-top: 10px;

}

.taglist a{

  color: #444;

}



.tagcloud {

  list-style: none;

  display: inline-block;

  width: 100%;

}

.tagcloud li{

  border: none;

  display: inline-block;

  padding: 0;

  margin: 0 3px 5px;

}

.tagcloud li a {

  display: block;

  line-height: 28px;

  padding: 0 20px;

  background: #3a3a3a;

  color: #999;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-style: italic;

}

.tagcloud li a:hover {

  background: #333;

  color: #fff;

}



.main-sidebar .textwidget p{

  margin-bottom: 15px;

}

/* ==========================================================================

   Single Blog

   ========================================================================== */

.single-blog-warp .item-blog {

  margin-bottom: 50px;

}

.single-feature-blog .blog-text {

  padding-left: 10px;

  padding-right: 10px;

  padding-bottom: 30px;

}

.single-feature-blog .blog-text .sapo {

  font-size: 16px;

  margin-bottom: 25px;

  margin-top: 10px;

  display: inline-block;

  width: 100%;

}

.single-feature-blog .blog-text h4{

  margin-bottom: 20px;

}

.single-feature-blog .blog-text p {

  line-height: 20px;

  margin-bottom: 15px;

}

blockquote {

  background: #f2f2f2;

  color: #444;

  padding: 25px;

  padding-bottom: 10px;

  margin: 20px 0;

  border-color: #fbaa35;

}

blockquote p {

  font-size: 15px;

  font-style: italic;

}

blockquote i.fa-quote-left {

  font-size: 30px;

  float: left;

}

.pagination-single-blog {

  display: inline-block;

  width: 100%;

}

.pagination-single-blog li:last-child {

  float: right;

}

/* Author */

.author-warp {

  border: 1px solid #e5e5e5;

  min-height: 170px;

  margin: 40px 0 70px 0;

}

.author-warp .author-avatar-warp {

  width: 170px;

  height: 170px;

  padding: 10px;

  border: 0;

  border-right: 1px solid #e5e5e5;

  float: left;

}

.author-warp .author-info {

  width: -webkit-calc(-70%);

  width: calc(-70%);

  display: inline-block;

  border: 0;

  padding: 15px;

}

.author-warp .author-info h4 {

  margin-top: 5px;

  margin-bottom: 5px;

}

.author-warp .author-info h5.job-author {

  font-size: 16px;

  font-weight: 300;

}



.nav-links{

  display: inline-block;

  width: 100%;

  margin-bottom: 50px;

}

.nav-links a{

  color: #444;

  text-transform: uppercase;

  font-size: 16px;

  padding: 6px 10px;

  border: 1px solid #e5e5e5;

  border-radius: 3px;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  display: block;

}

.nav-links a:hover{

  color: #fff;

  background: #fbaa35;

}

.nav-links a i{

  font-size: 23px;

  margin-right: 3px;

}

.nav-links .nav-previous{

  float: left;

}

.nav-links .nav-next{

  float: right;

}

.nav-links .nav-next i{

  margin-left: 3px;

  margin-right: 0;

}

/* ==========================================================================

   Relate Blog OWL

   ========================================================================== */

.owl-relate-blog .item-blog-sidebar {

  margin-left: 30px;

}

.owl-relate-blog .item-blog-sidebar h4{

  margin-bottom: 5px;

}

.owl-relate-blog p{

  margin-bottom: 0;

}

.relate-post {

  overflow: hidden;

  margin-bottom: 40px;

}

.relate-blog-warp {

  clear: both;

  margin-top: 30px;

  display: block;

  margin-left: -30px;

}

/* Comment Area */



.comment-area ul,

.comment-area ol{

  list-style: none;

  padding: 0;

}

.comment-area ul{

  padding-left: 40px;

}

.comment-list{

  margin-bottom: 40px;

}

.comment-item {

  border: 1px solid #e5e5e5;

  margin-bottom: 30px;

}

.comment-list-item .com2 {

  width: 92%;

}

.comment-list-item .com3 {

  width: 84%;

}

.header-comment {

  border-bottom: 1px solid #e5e5e5;

  display: inline-block;

  width: 100%;

  position: relative;

}

.header-comment .avatar-comment {

  padding: 10px;

  border-right: 1px solid #e5e5e5;

  float: left;

}

.header-comment .avatar-comment img {

  width: 54px;

  height: 54px;

}

.header-comment .comment-reply-link {

  position: absolute;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  right: 15px;

  font-size: 13px;

  text-align: center;

  padding: 5px 24px;

  outline: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  display: inline-block;

  background: #222;

  color: #fff;

  border-radius: 3px;

  text-transform: uppercase;

}

.header-comment .comment-reply-link:hover{

  background: #fbaa35;

}

.header-comment p {

  padding-left: 94px;

  color: #444;

}

.header-comment p.author-name {

  margin-top: 15px;

}

.body-comment {

  padding: 15px;

}

.comment-count {

  margin-top: 35px;

  margin-bottom: 25px;

}

.comment-count span {

  color: #444;

}

.comment-form-warp {

  clear: both;

  display: inline-block;

  width: 100%;

}

.comment-form-warp form {

  display: inline-block;

  width: 100%;

  margin-top: 20px;

}



.comment-author{

  padding: 0 10px 0 0;

}

.comment-email{

  padding: 0 0 0 10px;

}

.left-form-comment {

  width: 31%;

  float: left;

}

.left-form-comment .form-group {

  width: 100%;

}

.comment-form .form-control {

  width: 100%;

  margin-bottom: 25px;

  height: 40px;

  line-height: 40px;

  background: #f2f2f2;

  border: 1px solid #e5e5e5;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.left-form-comment .form-control:focus {

  background: #fff;

  color: #444;

}

.form-submit .ot-btn {

  border: 0;

  color: #fff;

  padding-top: 10px;

  padding-bottom: 10px;

}

.form-submit .ot-btn:hover{

  background: #444;

}

.left-form-comment .wpcf7-submit{

  border: none;

  display: block;

  width: 100%;

  padding: 10px;

  font-size: 14px;

}

.right-form-comment {

  width: 69%;

  float: left;

  padding-right: 30px;

}

.comment-form .comment-mess textarea,

.right-form-comment textarea {

  width: 100%;

  background: #f2f2f2;

  border-color: #e5e5e5;

  height: 170px;

  line-height: inherit;

  resize: vertical;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  -webkit-border-radius: 3px;

  border-radius: 3px;

  outline: none;

}

.right-form-comment textarea{

}

.right-form-comment textarea.form-control:focus,

.comment-form .form-control:focus{

  background: #fff;

  color: #444;

  border-color: #fbaa35;

  box-shadow: none;

}

.comment-reply-title a{

  color: #fbaa35;

  font-size: 13px;

  text-transform: lowercase;

  font-weight: 300;

}

.comment-item .comment-respond{

  padding: 20px;

}

.logged-in-as a{

  color: #888;

  margin-bottom: 10px;

  display: inline-block;

}





/* ==========================================================================

   Single Portfolio

   ========================================================================== */

.single-portfolio-warp {

  display: inline-block;

  width: 100%;

  margin-bottom: 50px;

}

.owl-gallery-portfolio-post {

  position: relative;

}

.owl-gallery-portfolio-post .owl-controls {

  position: absolute;

  bottom: 15px;

  width: 100%;

  display: block;

  text-align: center;

  margin: 0 5px;

}

.owl-gallery-portfolio-post .owl-controls .owl-page {

  background: #444;

  width: 15px;

  height: 15px;

}

.owl-gallery-portfolio-post .owl-controls .owl-page.active {

  background: #fbaa35;

}

.portfolio-feature-warp {

  position: relative;

  padding: 10px;

  border: 1px solid #e5e5e5;

}

.portfolio-feature-warp img {

  width: 100%;

  max-width: 100%;

}

.portfolio-feature-warp .prev-portfolio-image {

  width: 70px;

  height: 70px;

  background: url("images/Icon/prev.png");

  display: block;

  position: absolute;

  left: 9px;

  top: 50%;

  -webkit-transform: translateY(-35px);

  -ms-transform: translateY(-35px);

  transform: translateY(-35px);

  z-index: 9;

  opacity: .1;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  cursor: pointer;

}

.portfolio-feature-warp .prev-portfolio-image:hover {

  opacity: .9;

}

.portfolio-feature-warp .next-portfolio-image {

  width: 70px;

  height: 70px;

  background: url("images/Icon/next.png");

  display: block;

  position: absolute;

  right: 9px;

  top: 50%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  z-index: 9;

  opacity: .1;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

  cursor: pointer;

}

.portfolio-feature-warp .next-portfolio-image:hover {

  opacity: .9;

}

.portfolio-feature-warp:hover .prev-image,

.portfolio-feature-warp:hover .next-image {

  opacity: .9;

}

.portfolio-feature-content {

  width: 100%;

}



.porfolio-info-col h3 {

  margin-bottom: 25px;

}

.col-description .ot-btn {

  margin-top: 30px;

}

.col-description ul.social-share {

  float: left;

  margin: 15px 0 0 0;

}

.col-description ul.social-share li {

  padding: 0 10px 0 0;

}

.col-description ul.social-share a {

  color: #222;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.col-description ul.social-share a:hover {

  color: #fbaa35;

}

.col-detail p {

  border-bottom: 1px solid #e5e5e5;

  padding-bottom: 12px;

  margin-bottom: 12px;

  color: #444;

}

.col-detail p span {

  color: #999;

  margin-right: 10px;

}

.col-skill p {

  border-bottom: 1px solid #e5e5e5;

  padding-bottom: 12px;

  margin-bottom: 12px;

  color: #444;

}

.col-skill p i {

  color: #fbaa35;

  margin-right: 10px;

}

/* 

   Relate Project

   ========================================================================== */



.relate-project{

  margin-bottom: 70px;

}

.relate-portfolio-warp {

  clear: both;

  margin-top: 35px;

  display: block;

}

.relate-portfolio-warp .item{

  padding: 0 15px;

}

/* ==========================================================================

   Contact

   ========================================================================== */

.left-contact h3,

.right-contact h3 {

  margin-bottom: 30px;

}

.address-info {

  margin-top: 10px;

  display: inline-block;

  width: 100%;

}

.address-info p {

  font-size: 16px;

  font-family: "Oswald";

  color: #444;

  font-weight: 300;

  margin-bottom: 20px;

}

.address-info p i {

  margin-right: 10px;

  font-size: 20px;

}

/* contact form landing */

.form-inline .contact-form-landing .form-control {

  width: 100%;

  -webkit-box-shadow: none;

  box-shadow: none;

  -webkit-border-radius: 0;

  border-radius: 0;

  height: 50px;

  border: 1px solid #e6e6e6;

  outline: none;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.form-inline .contact-form-landing .form-control:focus {

  border-color: #fbaa35;

}

.form-inline .contact-form-landing .form-textarea {

  width: 100%;

  margin-top: 30px;

}

.form-inline .contact-form-landing textarea.form-control {

  width: 100%;

  height: auto;

}

.btn-submit-landing {

  border: 0;

  outline: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  margin-left: 15px;

  margin-top: 30px;

}

.contact-2-comment-form {

  margin-top: 0;

}

.address-info-contact-2 p:first-child {

  margin-top: 0;

}



span.wpcf7-not-valid-tip{

  clear: both;

  margin-top: -15px;

}

div.wpcf7-response-output{

  clear: both;margin: 0;

}

/* ==========================================================================

   FAQs

   ========================================================================== */

.faq-heading {

  font-size: 18px;

  color: #fbaa35;

  font-style: italic;

  font-weight: 400;

  margin-bottom: 25px;

}

.faq-panel {

  margin-top: 25px;

  clear: both;

}

.widget-support .content-support {

  padding: 40px;

}

.widget-support .content-support h4 {

  color: #fff;

  font-size: 24px;

  margin-bottom: 40px;

}

.widget-support .content-support .ot-btn {

  margin-top: 25px;

}

.need-sp h4{

  margin-bottom: 15px;

}

.need-sp .ot-btn{

  margin-top: 15px;

}

/* ==========================================================================

   Services

   ========================================================================== */

.services-heading {

  font-size: 18px;

  color: #fbaa35;

  font-style: italic;

  font-weight: 400;

  margin-bottom: 25px;

}

.service-warp-text h3 {

  margin-bottom: 40px;

}

.service-warp-text .ot-btn {

  margin-top: 25px;

}

/* ==========================================================================

   404 Page

   ========================================================================== */



.page404 {

  padding: 100px 0 140px;

  font-size: 14px;

}

.page404 h2 {

  font-size: 100px;

}

.page404 .color-theme {

  font-size: 38px;

  font-weight: 300;

  line-height: 1.6;

}

.page404 .widget-search{

  margin-bottom: 20px;

}

.page404 .search-404 {

  margin: 20px auto;

  max-width: 400px;

}

.page404 .search-404 form {

  margin-top: 20px;

  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);

          box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);

}

.page404 a {

  margin-top: 5px;

}





.full-height {

  height: 100vh;

}

.section {

  position: relative;

  width: 100%;

}

.hero-wrap {

  position: absolute;

  left: 0;

  top: 50%;

  width: 100%;

  z-index: 10;

  text-align: center;

  margin: 0 auto;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

}

.bg404 {

  background: url("images/404/1.jpg") no-repeat;

  -webkit-background-size: cover;

  background-size: cover;

  background-attachment: fixed;

}

.overlay-404 {

  background: #303335;

  opacity: .8;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

}

.hero-wrap-404 .heading-404 {

  font-size: 48px;

  text-transform: capitalize;

  font-weight: bold;

  line-height: 64px;

  margin-bottom: 25px;

  color: #fff;

}

.hero-wrap-404 .sub-heading-404 {

  color: #fff;

  margin-bottom: 30px;

}

.hero-wrap-404 a {

  color: #fff;

}

.btn-goback404 {

  display: inline-block;

  clear: both;

  margin: 25px auto;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.btn-goback404:hover {

  color: #fbaa35;

}

.search404 {

  max-width: 500px;

  margin: 0 auto;

}

.search404 .form-control {

  height: 40px;

  -webkit-box-shadow: none;

  box-shadow: none;

  border: 0;

  width: -webkit-calc(75%);

  width: calc(75%);

}

.search404 .form-group {

  width: -webkit-calc(-127%);

  width: calc(-127%);

}

.search404 button {

  background: transparent;

  border: 2px solid #fff;

  color: #fff;

  width: 100%;

  max-width: 150px;

  font-family: 'Oswald', sans-serif;

  font-size: 16px;

  font-weight: 300;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  line-height: 34px;

  padding: 0;

  outline: none!important;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.search404 button i {

  font-size: 15px;

  display: inline-block;

  vertical-align: 3px;

  margin-left: 5px;

}

.search404 button:hover,

.search404 button:focus {

  background: #fff;

  color: #444;

  border: 2px solid #fff;

}

/* ==========================================================================

   Coming Soon

   ========================================================================== */

.full-height {

  height: 100vh;

}

.section {

  position: relative;

  width: 100%;

}

.hero-wrap {

  position: absolute;

  left: 0;

  top: 50%;

  width: 100%;

  z-index: 10;

  text-align: center;

  margin: 0 auto;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

}

.bgcms {

  background: url("images/ComingSoon/1.jpg") no-repeat;

  -webkit-background-size: cover;

  background-size: cover;

  background-attachment: fixed;

}

.overlay-cms {

  background: #303335;

  opacity: .8;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

}

.hero-wrap-cms .heading-cms {

  font-size: 48px;

  text-transform: capitalize;

  font-weight: bold;

  line-height: 64px;

  margin-bottom: 25px;

  color: #fff;

}

.hero-wrap-cms .sub-heading-cms {

  color: #fff;

}

.hero-wrap-cms a {

  color: #fff;

}

.dotted-countdown {

  display: inline-block;

  margin: 40px 0px;

  background-color: rgba(255, 255, 255, 0.1);

  padding: 40px 20px;

  width: 100%;

  max-width: 650px;

}

.countdown {

  list-style: none;

  width: 100%;

}

.countdown li {

  width: 25%;

  display: inline-block;

  float: left;

  text-align: center;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  padding: 0px 20px;

}

.countdown li span,

.countdown li p {

  background: #222;

  padding: 20px 0;

  display: inline-block;

  width: 100%;

  position: relative;

}

.countdown li span {

  font-size: 24px;

  font-weight: bold;

  color: #fff;

  text-transform: uppercase;

}

.countdown li p {

  color: #fff;

  text-transform: uppercase;

  font-size: 11px;

}

.countdown li span:before {

  display: block;

  content: "";

  background: #fbaa35;

  width: 60%;

  height: 2px;

  position: absolute;

  left: 20%;

  bottom: 0;

}

.social-big-white {

  display: inline-block;

  width: 100%;

  margin-top: 15px;

}

.social-big-white li {

  margin: 0px 20px;

  font-size: 24px;

  margin-top: 20px;

  display: inline-block;

}

.social-big-white li a {

  color: #fff;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.social-big-white li a:hover {

  color: #fbaa35;

}

/* ==========================================================================

   Typography

   ========================================================================== */

.column_container {

  margin-bottom: 40px;

}

.main-page-typography h1,

.main-page-typography h2,

.main-page-typography h3,

.main-page-typography h4,

.main-page-typography h5,

.main-page-typography h6 {

  font-weight: 400;

}

.main-page-typography h2{

  font-size: 32px;

}



.icon-box.small .icon {

  height: 46px;

  width: 46px;

}

.icon-box .icon {

  position: absolute;

}

.icon {

  margin-bottom: 16px;

}

.icon-box.small > h3 {

  font-size: 24px;

  margin: 0 12px 10px 60px;

}

.icon-box.small > p {

  margin: 0 0 0px 60px;

  font-size: 14px;

  line-height: 1.6;

}

.icon-box.clean.small .icon i {

  font-size: 36px;

  color: #222;

}

.icon-box.small > span {

  margin: 25px 0 0px 60px;

  font-size: 42px;

  font-weight: 900;

  color: #222;

  display: block;

}

.icon-box.clean.small .icon-grey i {

  font-size: 36px;

  color: #f1f1f1!important;

}

.white-text h3,

.white-text span {

  color: #fff!important;

}

/* ==========================================================================

   Pricing Table

   ========================================================================== */

.pricing-set-1 {

  margin-top: 40px;

  display: inline-block;

  width: 100%;

}

.pricing-table {

  border: 1px solid #e6e6e6;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  background-color: #ffffff;

  margin-bottom: 20px;

  position: relative;

  z-index: 1;

  -webkit-transition: -webkit-box-shadow 0.4s ease;

  transition: box-shadow 0.4s ease;

}

.pricing-table p{

  margin-bottom: 0;

}

.pricing-table header {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  padding: 30px;

  border-bottom-width: 1px;

  border-bottom-style: solid;

  border-bottom-color: #e6e6e6;

}

.pricing-table header p.title {

  margin: 0px;

  background: rgba(0, 0, 0, 0.1);

  font-size: 1.2em;

  text-transform: uppercase;

  font-weight: bold;

  line-height: 35px;

  color: #222222;

  padding-left: 20px;

}

.pricing-table.featured header p.title,

.pricing-table.featured header .price p.condition{

  color: #eee;

}

.pricing-table header .price {

  width: 100%;

  margin-top: 40px;

}

.pricing-table header .price p.value {

  color: #fff;

  font-size: 3em;

  font-weight: bold;

  display: inline-block;

}

.pricing-table header .price p.condition {

  color: #222222;

  font-weight: bold;

  text-transform: uppercase;

  margin-top: 10px;

}

.pricing-table .content {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  padding: 30px;

}

.pricing-table .content ul {

  list-style: none;

}

.pricing-table .content p {

  margin: 0px;

  margin-bottom: 20px;

}



.pricing-table .content ul li {

  border-bottom-width: 1px;

  border-bottom-style: solid;

  border-bottom-color: #e6e6e6;

  line-height: 3em;

}

.pricing-table .content ul li i.fa {

  color: #fbaa35;

  margin-right: 5px;

}

.pricing-table .fplan {

  border-top-width: 1px;

  border-top-style: solid;

  border-top-color: #e6e6e6;

  background: #fff;

  padding: 25px 0 25px 30px;

}

.pricing-table .fplan .ot-btn {

  padding: 12px 30px;

  font-size: 15px;

}

.pricing-table.featured header {

  background-color: #fbaa35;

  padding-top: 30px;

}

.pricing-table.featured footer .ot-btn {

  background: #222;

}



.pricing-table header .price p.value {

  color: #fbaa35;

}

.pricing-table.featured header .price p.value {

  color: #fff;

}

.pricing-table:hover {

  z-index: 100;

  -webkit-box-shadow: #aeb3b6 0px 0px 15px;

  box-shadow: #aeb3b6 0px 0px 15px;

}

.pricing-table.featured {

  -webkit-box-shadow: #aeb3b6 0px 0px 15px;

  box-shadow: #aeb3b6 0px 0px 15px;

  border: 0px;

  z-index: 10;

}

/*set 2*/

.pricing-set-2 {

  margin-top: 40px;

  display: inline-block;

  width: 100%;

}



.pricing-tables-group-item {

  width: auto;

  float: left;

  text-align: center;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.fborder .details,

.fborder .buy,

.fborder .desc{

  border-left: 1px solid #e6e6e6;

}

.fborder p.title,

.fborder p.price{

  border-left: 1px solid rgba(0, 0, 0, 0.1);

}

.pricing-tables-group-item p.title {

  line-height: 3em;

  font-size: 22px;

  background-color: #303335;

  color: #fff;

  text-transform: uppercase;

  font-weight: bold;

  font-weight: 400;

  border-right: 1px solid rgba(0, 0, 0, 0.1);

}

.pricing-tables-group-item p.price {

  background-color: #414446;

  color: #fff;

  padding: 20px 0px;

  border-right: 1px solid rgba(0, 0, 0, 0.1);

}

.pricing-tables-group-item p {

  width: 100%;

  float: left;

  margin: 0px;

  padding: 0px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.pricing-tables-group-item p.desc {

  padding: 10px 0px;

  font-style: italic;

  border-bottom: 1px solid #e6e6e6;

  border-right: 1px solid #e6e6e6;

}

.pricing-tables-group-item .details {

  width: 100%;

  float: left;

  margin: 0px;

  padding: 0px;

  border-right: 1px solid #e6e6e6;

}

.pricing-tables-group-item p.buy {

  padding: 20px 0px;

  border-bottom: 1px solid #e6e6e6;

  border-right: 1px solid #e6e6e6;

}

.pricing-tables-group-item .details ul {

  list-style: none;

}

.pricing-tables-group-item .details li {

  width: 100%;

  float: left;

  margin: 0px;

  padding: 10px 0px;

  border-bottom-width: 1px;

  border-bottom-color: #e6e6e6;

  border-bottom-style: solid;

}

.pricing-tables-group-item p.buy a {

  padding: 10px 40px;

}

.pricing-tables-group-item.featured p.title {

  background: #fbaa35;

}

.pricing-tables-group-item.featured p.price {

  background: #5a951e;

}

.landing-pricing-table-warp {

  margin-top: 20px;

}

/* ==========================================================================

   Icon Box

   ========================================================================== */

.iconbox-set-3-demo {

  display: inline-block;

  width: 100%;

  margin-top: 40px;

}

/* ==========================================================================

   Reward

   ========================================================================== */

.reward-item {

  position: relative;

  min-height: 262px;

  padding: 20px;

  padding-left: 120px;

  margin: 40px 0;

  margin-bottom: 0;

  border: 1px solid #e5e5e5;

  background: #fff;

}

.reward-item .reward-item p {

  margin: 10px 0px;

}

.reward-item figure {

  position: absolute;

  left: 10px;

  top: 20px;

  width: 100px;

  text-align: center;

}

.reward-item figure img {

  max-width: 80px;

}

.reward-item p.title {

  margin-top: 0px;

  color: #222222;

  font-weight: 600;

  text-transform: capitalize;

  font-size: 18px;

  margin-bottom: 15px;

}

.reward-item p.date {

  color: #fbaa35;

  font-size: 13px;

  font-style: italic;

  margin-bottom: 15px;

}

/* ==========================================================================

    Element

   ========================================================================== */

.warp-element {

  margin-bottom: 40px;

}

.warp-element h3 {

  margin-bottom: 25px;

}

.warp-element .ot-btn {

  margin-right: 10px;

  margin-bottom: 10px;

}

.group-partner{

  display: inline-block;

  width: 100%;

}

.logo-group-item {

  width: 25%;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  border: 1px solid #e5e5e5;

  display: inline-block;

  float: left;

  margin-bottom: -1px;

  margin-right: -1px;

}

.logo-group-item img {

  max-width: 65%;

  display: block;

  margin: 25px auto;

  opacity: .8;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.logo-group-item img:hover {

  opacity: 1;

}







/* ==========================================================================

   Time Line Layout

   ========================================================================== */

.timeline {

  list-style: none;

  position: relative;

  overflow: hidden;

}

.timeline:before {

  top: 0;

  bottom: 0;

  position: absolute;

  content: " ";

  width: 3px;

  background-color: #eeeeee;

  left: 50%;

  margin-left: -1.5px;

  height: -webkit-calc(100% - 27px);

  height: calc(100% - 27px);

}

.timeline > li {

  margin-bottom: 90px;

  position: relative;

  width: 50%;

  float: left;

  clear: left;

}

.timeline > li:last-child{

  margin-bottom: 30px;

}

.timeline > li:before,

.timeline > li:after {

  content: " ";

  display: table;

}

.timeline > li:after {

  clear: both;

}

.timeline > li:before,

.timeline > li:after {

  content: " ";

  display: table;

}

.timeline > li:after {

  clear: both;

}

.timeline > li > .timeline-panel {

  width: -webkit-calc(100% - 40px);

  width: calc(100% - 40px);

  float: left;

  border: 1px solid #d4d4d4;

  /*border-radius: 2px;*/

  /*padding: 20px;*/

  position: relative;

  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);

  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);

}

.timeline-panel .item-blog {

  margin-bottom: 0;

}

.timeline-panel .blog-feature-warp {

  border: 0;

}

.timeline .blog-feature-content{

  border: none;

}

.timeline-panel .blog-feature-content-inner {

  padding: 10px;

}

.timeline-panel .blog-video-popup {

  border: 0;

}

.timeline-panel .blog-video-popup .blog-feature-warp {

  width: 100%;

}

.timeline-panel .blog-video-popup .blog-feature-content {

  width: 100%;

}

.timeline-panel .blog-video-popup .blog-footer-2 {

  width: 100%;

  padding: 10px;

  min-height: 38px;

  background: #f2f2f2;

  font-size: 12px;

  border-top-width: 2px;

  border-top-style: solid;

  position: static;

}

.timeline-panel .blog-embed-video-feature {

  width: 100%;

}

.timeline-panel .overlay-btn-video {

  background: rgba(255, 255, 255, 0) url("images/Icon/btn-play.png") center center no-repeat;

}

.timeline > li > .timeline-panel:before {

  position: absolute;

  top: 26px;

  right: -15px;

  display: inline-block;

  border-top: 15px solid transparent;

  border-left: 15px solid #ccc;

  border-right: 0 solid #ccc;

  border-bottom: 15px solid transparent;

  content: " ";

}

.timeline > li > .timeline-panel:after {

  position: absolute;

  top: 27px;

  right: -14px;

  display: inline-block;

  border-top: 14px solid transparent;

  border-left: 14px solid #fff;

  border-right: 0 solid #fff;

  border-bottom: 14px solid transparent;

  content: " ";

}

.timeline > li > .blog-data {

  position: absolute;

  top: 0;

  right: 0;

  left: auto;

  -webkit-transform: translateX(50%);

  -ms-transform: translateX(50%);

  transform: translateX(50%);

}

.timeline > li.timeline-inverted > .timeline-panel {

  float: right;

}

.timeline > li.timeline-inverted > .timeline-panel:before {

  border-left-width: 0;

  border-right-width: 15px;

  left: -15px;

  right: auto;

}

.timeline > li.timeline-inverted > .timeline-panel:after {

  border-left-width: 0;

  border-right-width: 14px;

  left: -14px;

  right: auto;

}

.timeline-body > ul {

  padding: 20px;

  margin-bottom: 0;

}

.timeline > li.timeline-inverted {

  float: right;

  clear: right;

  margin-top: 60px;

  margin-bottom: 30px;

}

.timeline > li:nth-child(2) {

  margin-top: 140px;

}

.timeline > li.timeline-inverted > .blog-data {

  position: absolute;

  top: 0;

  left: 0;

  right: auto;

  -webkit-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  transform: translateX(-50%);

}

/* Time Line One Side */

.timeline-1-side {

  list-style: none;

  padding-left: 20px;

  position: relative;

}

.timeline-1-side:before {

  top: 0;

  bottom: 0;

  position: absolute;

  content: " ";

  width: 3px;

  background-color: #eeeeee;

  left: 20px;

}

.timeline-1-side .blog-feature-content .blog-text{

  width: 100%;

}

.timeline-1-side > li {

  margin-bottom: 30px;

  position: relative;

}

.timeline-1-side > li:before,

.timeline-1-side > li:after {

  content: " ";

  display: table;

}

.timeline-1-side > li:after {

  clear: both;

}

.timeline-1-side > li:before,

.timeline-1-side > li:after {

  content: " ";

  display: table;

}

.timeline-1-side > li:after {

  clear: both;

}

.timeline-1-side > li > .timeline-panel {

  width: -webkit-calc(100% - 40px);

  width: calc(100% - 40px);

  float: right;

  border: 1px solid #d4d4d4;

  position: relative;

  -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);

  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.175);

}

.timeline-1-side .blog-feature-content{

  border: none;

}

.timeline-1-side .timeline-panel .item-blog {

  margin-bottom: 0;

}

.timeline-1-side .timeline-panel .blog-feature-warp {

  border: 0;

}

.timeline-1-side .timeline-panel .blog-feature-content-inner {

  padding: 10px;

}

.timeline-1-side .timeline-panel .blog-video-popup {

  border: 0;

}

.timeline-1-side .timeline-panel .blog-video-popup .blog-feature-warp {

  width: 100%;

}

.timeline-1-side .timeline-panel .blog-video-popup .blog-feature-content {

  width: 100%;

}

.timeline-1-side .timeline-panel .blog-video-popup .blog-footer-2 {

  width: 100%;

  padding: 10px;

  min-height: 38px;

  background: #f2f2f2;

  font-size: 12px;

  border-top-width: 2px;

  border-top-style: solid;

  position: static;

}

.timeline-1-side .timeline-panel .blog-embed-video-feature {

  width: 100%;

}

.timeline-1-side .timeline-panel .overlay-btn-video {

  background: rgba(255, 255, 255, 0) url("images/Icon/btn-play.png") center center no-repeat;

}

.timeline-1-side > li > .timeline-panel:before {

  position: absolute;

  top: 26px;

  left: -15px;

  display: inline-block;

  border-top: 15px solid transparent;

  border-right: 15px solid #ccc;

  border-left: 0 solid #ccc;

  border-bottom: 15px solid transparent;

  content: " ";

}

.timeline-1-side > li > .timeline-panel:after {

  position: absolute;

  top: 27px;

  left: -14px;

  display: inline-block;

  border-top: 14px solid transparent;

  border-right: 14px solid #fff;

  border-left: 0 solid #fff;

  border-bottom: 14px solid transparent;

  content: " ";

}

.timeline-1-side > li > .blog-data {

  position: absolute;

  top: 0;

  left: 0;

  -webkit-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  transform: translateX(-50%);

}

.timeline-1-side-body > ul {

  padding: 20px;

  margin-bottom: 0;

}

@media (max-width: 767px) {

  ul.timeline {

    padding-right: 15px;

  }

  ul.timeline:before {

    left: 40px;

  }

  ul.timeline > li {

    margin-bottom: 20px;

    position: relative;

    width: 100%;

    float: left;

    clear: left;

  }

  ul.timeline > li > .timeline-panel {

    width: -webkit-calc(100% - 80px);

    width: calc(100% - 80px);

  }

  ul.timeline > li.timeline-inverted > .blog-data {

    position: absolute;

    top: 0;

    right: auto;

    left: 0;

    -webkit-transform: translateX(50%);

    -ms-transform: translateX(50%);

    transform: translateX(50%);

  }

  ul.timeline > li > .blog-data {

    position: absolute;

    top: 0;

    right: auto;

    left: 0;

    -webkit-transform: translateX(50%);

    -ms-transform: translateX(50%);

    transform: translateX(50%);

  }

  ul.timeline > li > .timeline-panel {

    float: right;

  }

  ul.timeline > li > .timeline-panel:before {

    border-left-width: 0;

    border-right-width: 15px;

    left: -15px;

    right: auto;

  }

  ul.timeline > li > .timeline-panel:after {

    border-left-width: 0;

    border-right-width: 14px;

    left: -14px;

    right: auto;

  }

  .timeline > li.timeline-inverted {

    float: left;

    clear: left;

    margin-top: 30px;

    margin-bottom: 30px;

  }

  .team-item{

    max-width: 400px;

    margin: 0 auto 30px;

  }

  .breadcrumb{

    text-align: left;

    margin-top: 10px;

  }

}

/* ==========================================================================

   masonry layout

   ========================================================================== */

.masonry-warp-1 {

  width: 100%;

  overflow: hidden;

}

.main-page .full-masonry-layout .grid-item {

  width: -webkit-calc(50% - 15px);

  width: calc(50% - 15px);

}

.full-masonry-layout {

  width: -webkit-calc(100% + 15px);

  width: calc(100% + 15px);

}

.full-masonry-layout .item-blog {

  margin-bottom: 0;

}

.full-masonry-layout .grid-item,

.full-masonry-layout .grid-sizer {

  width: -webkit-calc(18.3333%);

  width: calc(18.3333%);

  margin-bottom: 15px;

}

.full-masonry-layout .blog-video-popup .blog-feature-warp {

  width: 100%;

}

.full-masonry-layout .blog-video-popup .blog-feature-content {

  width: 100%;

  border-top: 1px solid #e5e6e6;

}

.full-masonry-layout .blog-video-popup .blog-footer-2 {

  width: 100%;

  padding: 10px;

  min-height: 38px;

  background: #f2f2f2;

  font-size: 12px;

  border-top-width: 2px;

  border-top-style: solid;

  position: static;

}

.full-masonry-layout .blog-embed-video-feature {

  width: 100%;

}

.full-masonry-layout .overlay-btn-video {

  background: rgba(255, 255, 255, 0) url("images/Icon/btn-play.png") center center no-repeat;

}

/* 

   Backtotop

   ========================================================================== */

.fixbtt {

  display: none;

  position: fixed;

  text-align: center;

  right: 30px;

  bottom: 30px;

  color: #fff;

  cursor: pointer;

  -webkit-border-radius: 2px;

  border-radius: 2px;

  z-index: 10000;

  height: 40px;

  width: 40px;

  line-height: 40px;

  background-color: rgba(0, 0, 0, 0.4);

  background-repeat: no-repeat;

  background-position: center;

  -webkit-transition: background-color 0.1s linear;

  transition: background-color 0.1s linear;

}

.fixbtt:hover {

  background-color: #fbaa35;

  color: #fff;

}

.center-btt {

  position: absolute!important;

  top: -35px;

  left: 50%;

  -webkit-transform: translate(-50%, 0);

  -ms-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  color: #fff;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  width: 70px!important;

  height: 70px!important;

  line-height: 95px!important;

  font-size: 25px;

  -webkit-border-radius: 50%!important;

  border-radius: 50%!important;

  text-align: center;

  cursor: pointer;

}

.center-btt:hover {

  color: #fff;

}

.header-v1 .navi-level-1 > li.active > a {

    padding-left: 15px;
    padding-right: 15px;
    background-color: #2996cf;
    color: #fff;

}

/* ==========================================================================

   Footer

   ========================================================================== */

footer {

  padding: 20px 0 0px;

  background: #222;

  background-size: cover;

  background-position: top center;

  background-repeat: no-repeat;

  background-attachment: fixed;color: #fff;

}

footer .widget h3 {

  color:#fbaa35;

  margin-bottom: 30px;

}

.widget-footer {

  margin-bottom: 0;

}

.widget-footer-blog {

  display: inline-block;

  width: 100%;

  float: left;

}

.widget-footer-blog .ot-btn {

  float: left;

}

.useful-link {

  display: block;

  list-style: none;

  width: 100%;

  clear: both;

}

.useful-link li {

  display: block;

  width: 100%;

  border-bottom: 1px solid rgba(255, 255, 255, 0.1);

  padding: 12px 0;

}

.useful-link li:first-child{

  padding-top: 0;

}

.useful-link li a {

  color: #999;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}

.useful-link li a:hover {

  color: #fff;

}

.useful-link li:last-child {

  border: 0;

}

.footer-v1 .text-about {

  margin-top: 14px;

}

.footer-v1 .ot-btn:hover {

  background: #fff;

  color: #444;

}



.footer-v1 .contact-f1 a {

  color: #999;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

}

.footer-v1 .contact-f1 a:hover {

  color: #fff;

}

.footer-v1 .contact-f1 img {

  width: 100%;

  max-width: 100%;

  margin-top: 25px;

}

.footer-v1 .contact-f2 {

  display: block;

  width: 100%;

  clear: both;

  margin-top: 12px;

  float: left;

}

.footer-v1 .contact-f2 ul {

  list-style: none;

}

.footer-v1 .contact-f2 ul li {

  display: inline-block;

  width: 100%;

  padding: 12px 0;

  color: #999;

  border-bottom: 1px solid rgba(255, 255, 255, 0.1);

}

.footer-v1 .contact-f2 ul li a {

  color: #999;

  -webkit-transition: slow;

  transition: slow;

}

.footer-v1 .contact-f2 ul li a:hover {

  color: #fff;

}

.footer-v1 .contact-f2 ul li i {

  color: #fbaa35;

  margin-right: 5px;

}

.footer-v1 .contact-f2 ul li:last-child {

  border: 0;

}

.logo-footer{

  margin-bottom: 30px;

}

.footer-v2 .title-warp {

  display: block;

  width: 100%;

  margin-bottom: 35px;

}

.footer-v2 .flickr-warp {

  list-style: none;

  padding: 0;

  margin: 0;

  width: 100%;

  display: block;

  float: left;

}

.footer-v2 .flickr-warp img {

  display: inline-block;

  width: 75px;

  height: 75px;

  float: left;

  margin: 0px 5px 5px 0;

}



.footer-v3 {

  position: relative;

  overflow-y: hidden;

}

.footer-v3 .widget-footer-list-link {

  width: 25%;

  padding-right: 30px;

  display: inline-block;

  float: left;

}

.contact-f2 {

  clear: both;

  margin-top: 40px;

}

.contact-form-2 .form-control {

  height: 40px;

  -webkit-box-shadow: none;

  box-shadow: none;

  width: -webkit-calc(85%);

  width: calc(85%);

  background: transparent;

  border: 1px solid rgba(255, 255, 255, 0.1);

}

.contact-form-2 .form-control:focus {

  background: #3a3a3a;

  color: #fff;

}

.contact-form-2 input ::-webkit-input-placeholder {

  color: #666;

}

.contact-form-2 input:-moz-placeholder {

  /* Firefox 18- */

  color: #666;

}

.contact-form-2 input::-moz-placeholder {

  /* Firefox 19+ */

  color: #666;

}

.contact-form-2 input:-ms-input-placeholder {

  color: #666;

}

.contact-form-2 .form-group {

  width: 50%;

  float: right;

  text-align: right;

}

.contact-form-2 .form-group:first-child {

  float: left;

  text-align: left;

}

.contact-form-2 textarea {

  width: 100%;

  background: transparent;

  -webkit-box-shadow: none;

  box-shadow: none;

  border: 1px solid rgba(255, 255, 255, 0.1);

  margin-top: 30px;

  padding: 6px 12px;

  resize: vertical;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.contact-form-2 textarea:focus {

  background: #3a3a3a;

  color: #fff;

}

.contact-form-2 button {

  color: #fff;

  border: 0;

  font-family: 'Oswald', sans-serif;

  padding: 2px 20px;

  font-size: 16px;

  font-weight: 300;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  line-height: 36px;

  outline: none!important;

  -webkit-transition: all 0.3s;

  transition: all 0.3s;

  float: right;

  margin-top: 30px;

  -webkit-border-radius: 3px;

  border-radius: 3px;

}

.contact-form-2 button i {

  font-size: 11px;

  display: inline-block;

  vertical-align: 3px;

  margin-right: 10px;

}

.contact-form-2 button:hover,

.contact-form-2 button:focus {

  background: #fff!important;

  color: #444;

}

/* ==========================================================================

   Copyright

   ========================================================================== */

#copyright-1 {

  background: #1d1d1d;

}

.warp-copyright-1 {

  display: block;

  padding: 15px 0 10px 0;

  width: 100%;

  float: left;

  color: #c1c1c1;

}

ul.copyright-1 {

  float: left;

  list-style: none;

  text-transform: uppercase;

}

.copyright-1 li {

  display: inline-block;

  padding: 0 15px;

  position: relative;

}

.copyright-1 li a {

  color: #c1c1c1;

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

}

.copyright-1 li a:hover {

  color: #fff;

}

.copyright-1 li:after {

  content: "|";

  position: absolute;

  top: 0;

  right: 0;

  width: 1px;

}

.copyright-1 li:first-child {

  padding-left: 0;

}

.copyright-1 li:last-child:after {

  display: none;

}

.text-copyright-1 {

  float: right;

  margin-bottom: 0;

  font-size: 12px;

}

.text-copyright-1 a {

  color: #fff;

}

.warp-copyright-2 {

  border-top-width: 2px;

  border-top-style: solid;

  border-top-color: transparent;

  padding: 30px 0;

  display: block;

  float: left;

  width: 100%;

}

.text-copyright-2 {

  float: left;

}

.text-copyright-2 a {

  color: #fff;

}



/*Layer Slider*/



div.ls-overflow-visible{

  overflow: hidden!important;

}

div.mm-page{

  overflow: visible!important;

}

.text-block-2 {

  background-color: rgba(255, 255, 255, 0.12);

  -webkit-box-sizing: border-box;

     -moz-box-sizing: border-box;

          box-sizing: border-box;

  padding: 40px;

}

.text-block-2 h4 {

  font-size: 36px;

  font-weight: 300;

  font-family: 'Oswald', sans-serif;

  color: #fff;

  margin-bottom: 15px;

}

.text-block-2 p {

  color: #eee;

  line-height: 1.6;

  white-space: normal;

}

.text-block-2 .ot-btn {

  padding-top: 10px;

  padding-bottom: 10px;

  -webkit-transition: background-color 0.3s !important;

          transition: background-color 0.3s !important;

  margin-top: 20px;

}

.text-block-2 a{

  transition: none;

}

.typo-2{

  color: #000;

  font-size: 15px;

}

.typo-2 i{

  margin-right: 5px;

}



/* ==========================================================================

   Revolution Slider

   ========================================================================== */

.tparrows {

  width: 70px;

  height: 70px;

}

.tparrows::before {

  width: 32px;

  height: 32px;

  border: 2px solid #fff;

  -webkit-border-radius: 50%;

  border-radius: 50%;

  line-height: 28px;

  margin-left: 17px;

  margin-top: 17px;

  font-weight: bold;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}

.tp-leftarrow {

  -webkit-transform: matrix(1, 0, 0, 1, 0, -35) !important;

  -ms-transform: matrix(1, 0, 0, 1, 0, -35) !important;

  transform: matrix(1, 0, 0, 1, 0, -35) !important;

}

.tp-rightarrow {

  -webkit-transform: matrix(1, 0, 0, 1, -70, -35) !important;

  -ms-transform: matrix(1, 0, 0, 1, -70, -35) !important;

  transform: matrix(1, 0, 0, 1, -70, -35) !important;

}



/* ==========================================================================

   Animate.css

   ========================================================================== */

.animated {

  -webkit-animation-duration: 1s;

  animation-duration: 1s;

  -webkit-animation-fill-mode: both;

  animation-fill-mode: both;

}

.animated.infinite {

  -webkit-animation-iteration-count: infinite;

  animation-iteration-count: infinite;

}

.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;

}

@-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 rubberBand {

  0% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

  30% {

    -webkit-transform: scaleX(1.25) scaleY(0.75);

    transform: scaleX(1.25) scaleY(0.75);

  }

  40% {

    -webkit-transform: scaleX(0.75) scaleY(1.25);

    transform: scaleX(0.75) scaleY(1.25);

  }

  60% {

    -webkit-transform: scaleX(1.15) scaleY(0.85);

    transform: scaleX(1.15) scaleY(0.85);

  }

  100% {

    -webkit-transform: scale(1);

    transform: scale(1);

  }

}

@keyframes rubberBand {

  0% {

    -webkit-transform: scale(1);

    -ms-transform: scale(1);

    transform: scale(1);

  }

  30% {

    -webkit-transform: scaleX(1.25) scaleY(0.75);

    -ms-transform: scaleX(1.25) scaleY(0.75);

    transform: scaleX(1.25) scaleY(0.75);

  }

  40% {

    -webkit-transform: scaleX(0.75) scaleY(1.25);

    -ms-transform: scaleX(0.75) scaleY(1.25);

    transform: scaleX(0.75) scaleY(1.25);

  }

  60% {

    -webkit-transform: scaleX(1.15) scaleY(0.85);

    -ms-transform: scaleX(1.15) scaleY(0.85);

    transform: scaleX(1.15) scaleY(0.85);

  }

  100% {

    -webkit-transform: scale(1);

    -ms-transform: scale(1);

    transform: scale(1);

  }

}

.rubberBand {

  -webkit-animation-name: rubberBand;

  animation-name: rubberBand;

}

@-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;

}

@-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(0.3);

    transform: scale(0.3);

  }

  50% {

    opacity: 1;

    -webkit-transform: scale(1.05);

    transform: scale(1.05);

  }

  70% {

    -webkit-transform: scale(0.9);

    transform: scale(0.9);

  }

  100% {

    opacity: 1;

    -webkit-transform: scale(1);

    transform: scale(1);

  }

}

@keyframes bounceIn {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    -ms-transform: scale(0.3);

    transform: scale(0.3);

  }

  50% {

    opacity: 1;

    -webkit-transform: scale(1.05);

    -ms-transform: scale(1.05);

    transform: scale(1.05);

  }

  70% {

    -webkit-transform: scale(0.9);

    -ms-transform: scale(0.9);

    transform: scale(0.9);

  }

  100% {

    opacity: 1;

    -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(0.95);

    transform: scale(0.95);

  }

  50% {

    opacity: 1;

    -webkit-transform: scale(1.1);

    transform: scale(1.1);

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    transform: scale(0.3);

  }

}

@keyframes bounceOut {

  0% {

    -webkit-transform: scale(1);

    -ms-transform: scale(1);

    transform: scale(1);

  }

  25% {

    -webkit-transform: scale(0.95);

    -ms-transform: scale(0.95);

    transform: scale(0.95);

  }

  50% {

    opacity: 1;

    -webkit-transform: scale(1.1);

    -ms-transform: scale(1.1);

    transform: scale(1.1);

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    -ms-transform: scale(0.3);

    transform: scale(0.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(-100px);

    transform: translateY(-100px);

  }

  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(-100px);

    -ms-transform: translateY(-100px);

    transform: translateY(-100px);

  }

  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(100px);

    transform: translateX(100px);

  }

  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(100px);

    -ms-transform: translateX(100px);

    transform: translateX(100px);

  }

  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(-100px);

    transform: translateX(-100px);

  }

  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(-100px);

    -ms-transform: translateX(-100px);

    transform: translateX(-100px);

  }

  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(100px);

    transform: translateY(100px);

  }

  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(100px);

    -ms-transform: translateY(100px);

    transform: translateY(100px);

  }

  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(-100px);

    transform: translateY(-100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    transform: translateY(0);

  }

}

@keyframes fadeInDown {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-100px);

    -ms-transform: translateY(-100px);

    transform: translateY(-100px);

  }

  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(-100px);

    transform: translateX(-100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

}

@keyframes fadeInLeft {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    -ms-transform: translateX(-100px);

    transform: translateX(-100px);

  }

  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(100px);

    transform: translateX(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

}

@keyframes fadeInRight {

  0% {

    opacity: 0;

    -webkit-transform: translateX(100px);

    -ms-transform: translateX(100px);

    transform: translateX(100px);

  }

  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(100px);

    transform: translateY(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    transform: translateY(0);

  }

}

@keyframes fadeInUp {

  0% {

    opacity: 0;

    -webkit-transform: translateY(100px);

    -ms-transform: translateY(100px);

    transform: translateY(100px);

  }

  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(100px);

    transform: translateY(100px);

  }

}

@keyframes fadeOutDown {

  0% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateY(100px);

    -ms-transform: translateY(100px);

    transform: translateY(100px);

  }

}

.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(-100px);

    transform: translateX(-100px);

  }

}

@keyframes fadeOutLeft {

  0% {

    opacity: 1;

    -webkit-transform: translateX(0);

    -ms-transform: translateX(0);

    transform: translateX(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateX(-100px);

    -ms-transform: translateX(-100px);

    transform: translateX(-100px);

  }

}

.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(100px);

    transform: translateX(100px);

  }

}

@keyframes fadeOutRight {

  0% {

    opacity: 1;

    -webkit-transform: translateX(0);

    -ms-transform: translateX(0);

    transform: translateX(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateX(100px);

    -ms-transform: translateX(100px);

    transform: translateX(100px);

  }

}

.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(-100px);

    transform: translateY(-100px);

  }

}

@keyframes fadeOutUp {

  0% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateY(-100px);

    -ms-transform: translateY(-100px);

    transform: translateY(-100px);

  }

}

.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(-360deg) scale(1);

    transform: perspective(400px) translateZ(0) rotateY(-360deg) scale(1);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  40% {

    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);

    transform: perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  50% {

    -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);

    transform: perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  80% {

    -webkit-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(0.95);

    transform: perspective(400px) translateZ(0) rotateY(0deg) scale(0.95);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  100% {

    -webkit-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(1);

    transform: perspective(400px) translateZ(0) rotateY(0deg) scale(1);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

}

@keyframes flip {

  0% {

    -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-out;

    animation-timing-function: ease-out;

  }

  40% {

    -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-out;

    animation-timing-function: ease-out;

  }

  50% {

    -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-in;

    animation-timing-function: ease-in;

  }

  80% {

    -webkit-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(0.95);

    -ms-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(0.95);

    transform: perspective(400px) translateZ(0) rotateY(0deg) scale(0.95);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  100% {

    -webkit-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(1);

    -ms-transform: perspective(400px) translateZ(0) rotateY(0deg) scale(1);

    transform: perspective(400px) translateZ(0) rotateY(0deg) 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 slideInUp {

  0% {

    opacity: 0;

    -webkit-transform: translateY(2000px);

    transform: translateY(2000px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    transform: translateY(0);

  }

}

@keyframes slideInUp {

  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);

  }

}

.slideInUp {

  -webkit-animation-name: slideInUp;

  animation-name: slideInUp;

}

@-webkit-keyframes slideOutDown {

  0% {

    -webkit-transform: translateY(0);

    transform: translateY(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateY(2000px);

    transform: translateY(2000px);

  }

}

@keyframes slideOutDown {

  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);

  }

}

.slideOutDown {

  -webkit-animation-name: slideOutDown;

  animation-name: slideOutDown;

}

@-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);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1;

  }

  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);

    -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;

    opacity: 1;

  }

  100% {

    -webkit-transform: translateY(700px);

    -ms-transform: translateY(700px);

    transform: translateY(700px);

    opacity: 0;

  }

}

.hinge {

  -webkit-animation-name: hinge;

  animation-name: hinge;

}

@-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;

}

@-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;

}

@-webkit-keyframes zoomIn {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    transform: scale(0.3);

  }

  50% {

    opacity: 1;

  }

}

@keyframes zoomIn {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    -ms-transform: scale(0.3);

    transform: scale(0.3);

  }

  50% {

    opacity: 1;

  }

}

.zoomIn {

  -webkit-animation-name: zoomIn;

  animation-name: zoomIn;

}

@-webkit-keyframes zoomInDown {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(-2000px);

    transform: scale(0.1) translateY(-2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(60px);

    transform: scale(0.475) translateY(60px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

@keyframes zoomInDown {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(-2000px);

    -ms-transform: scale(0.1) translateY(-2000px);

    transform: scale(0.1) translateY(-2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(60px);

    -ms-transform: scale(0.475) translateY(60px);

    transform: scale(0.475) translateY(60px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

.zoomInDown {

  -webkit-animation-name: zoomInDown;

  animation-name: zoomInDown;

}

@-webkit-keyframes zoomInLeft {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(-2000px);

    transform: scale(0.1) translateX(-2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(48px);

    transform: scale(0.475) translateX(48px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

@keyframes zoomInLeft {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(-2000px);

    -ms-transform: scale(0.1) translateX(-2000px);

    transform: scale(0.1) translateX(-2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(48px);

    -ms-transform: scale(0.475) translateX(48px);

    transform: scale(0.475) translateX(48px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

.zoomInLeft {

  -webkit-animation-name: zoomInLeft;

  animation-name: zoomInLeft;

}

@-webkit-keyframes zoomInRight {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(2000px);

    transform: scale(0.1) translateX(2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(-48px);

    transform: scale(0.475) translateX(-48px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

@keyframes zoomInRight {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(2000px);

    -ms-transform: scale(0.1) translateX(2000px);

    transform: scale(0.1) translateX(2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(-48px);

    -ms-transform: scale(0.475) translateX(-48px);

    transform: scale(0.475) translateX(-48px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

.zoomInRight {

  -webkit-animation-name: zoomInRight;

  animation-name: zoomInRight;

}

@-webkit-keyframes zoomInUp {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(2000px);

    transform: scale(0.1) translateY(2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(-60px);

    transform: scale(0.475) translateY(-60px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

@keyframes zoomInUp {

  0% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(2000px);

    -ms-transform: scale(0.1) translateY(2000px);

    transform: scale(0.1) translateY(2000px);

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  60% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(-60px);

    -ms-transform: scale(0.475) translateY(-60px);

    transform: scale(0.475) translateY(-60px);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

}

.zoomInUp {

  -webkit-animation-name: zoomInUp;

  animation-name: zoomInUp;

}

@-webkit-keyframes zoomOut {

  0% {

    opacity: 1;

    -webkit-transform: scale(1);

    transform: scale(1);

  }

  50% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    transform: scale(0.3);

  }

  100% {

    opacity: 0;

  }

}

@keyframes zoomOut {

  0% {

    opacity: 1;

    -webkit-transform: scale(1);

    -ms-transform: scale(1);

    transform: scale(1);

  }

  50% {

    opacity: 0;

    -webkit-transform: scale(0.3);

    -ms-transform: scale(0.3);

    transform: scale(0.3);

  }

  100% {

    opacity: 0;

  }

}

.zoomOut {

  -webkit-animation-name: zoomOut;

  animation-name: zoomOut;

}

@-webkit-keyframes zoomOutDown {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(-60px);

    transform: scale(0.475) translateY(-60px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(2000px);

    transform: scale(0.1) translateY(2000px);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

  }

}

@keyframes zoomOutDown {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(-60px);

    -ms-transform: scale(0.475) translateY(-60px);

    transform: scale(0.475) translateY(-60px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(2000px);

    -ms-transform: scale(0.1) translateY(2000px);

    transform: scale(0.1) translateY(2000px);

    -webkit-transform-origin: center bottom;

    -ms-transform-origin: center bottom;

    transform-origin: center bottom;

  }

}

.zoomOutDown {

  -webkit-animation-name: zoomOutDown;

  animation-name: zoomOutDown;

}

@-webkit-keyframes zoomOutLeft {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(42px);

    transform: scale(0.475) translateX(42px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(-2000px);

    transform: scale(0.1) translateX(-2000px);

    -webkit-transform-origin: left center;

    transform-origin: left center;

  }

}

@keyframes zoomOutLeft {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(42px);

    -ms-transform: scale(0.475) translateX(42px);

    transform: scale(0.475) translateX(42px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(-2000px);

    -ms-transform: scale(0.1) translateX(-2000px);

    transform: scale(0.1) translateX(-2000px);

    -webkit-transform-origin: left center;

    -ms-transform-origin: left center;

    transform-origin: left center;

  }

}

.zoomOutLeft {

  -webkit-animation-name: zoomOutLeft;

  animation-name: zoomOutLeft;

}

@-webkit-keyframes zoomOutRight {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(-42px);

    transform: scale(0.475) translateX(-42px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(2000px);

    transform: scale(0.1) translateX(2000px);

    -webkit-transform-origin: right center;

    transform-origin: right center;

  }

}

@keyframes zoomOutRight {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateX(-42px);

    -ms-transform: scale(0.475) translateX(-42px);

    transform: scale(0.475) translateX(-42px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateX(2000px);

    -ms-transform: scale(0.1) translateX(2000px);

    transform: scale(0.1) translateX(2000px);

    -webkit-transform-origin: right center;

    -ms-transform-origin: right center;

    transform-origin: right center;

  }

}

.zoomOutRight {

  -webkit-animation-name: zoomOutRight;

  animation-name: zoomOutRight;

}

@-webkit-keyframes zoomOutUp {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(60px);

    transform: scale(0.475) translateY(60px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(-2000px);

    transform: scale(0.1) translateY(-2000px);

    -webkit-transform-origin: center top;

    transform-origin: center top;

  }

}

@keyframes zoomOutUp {

  40% {

    opacity: 1;

    -webkit-transform: scale(0.475) translateY(60px);

    -ms-transform: scale(0.475) translateY(60px);

    transform: scale(0.475) translateY(60px);

    -webkit-animation-timing-function: linear;

    animation-timing-function: linear;

  }

  100% {

    opacity: 0;

    -webkit-transform: scale(0.1) translateY(-2000px);

    -ms-transform: scale(0.1) translateY(-2000px);

    transform: scale(0.1) translateY(-2000px);

    -webkit-transform-origin: center top;

    -ms-transform-origin: center top;

    transform-origin: center top;

  }

}

.zoomOutUp {

  -webkit-animation-name: zoomOutUp;

  animation-name: zoomOutUp;

}

.fadeInUp2 {

  -webkit-animation-name: fadeInUp2;

  animation-name: fadeInUp2;

}

@-webkit-keyframes fadeInUp2 {

  0% {

    opacity: 0;

    -webkit-transform: translateY(100px);

    transform: translateY(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    transform: translateY(0);

  }

}

@keyframes fadeInUp2 {

  0% {

    opacity: 0;

    -webkit-transform: translateY(100px);

    -ms-transform: translateY(100px);

    transform: translateY(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -ms-transform: translateY(0);

    transform: translateY(0);

  }

}





/*PRELOADER*/

.images-preloader {

  position: fixed;

  z-index: 999999999;

  background-color: #fff;

  width: 100%;

  height: 100%;

}

.preloader4 {

  width: 35px;

  height: 35px;

  display: inline-block;

  padding: 0px;

  -webkit-border-radius: 100%;

          border-radius: 100%;

  border: 3px solid;

  border-top-color: rgba(0,0,0,0.6);

  border-bottom-color: #fbaa35;

  border-left-color: #fbaa35;

  border-right-color: #fbaa35;

  -webkit-animation: preloader4 0.8s linear infinite;

  animation: preloader4 0.8s linear infinite;

  text-align: center;

  position: absolute;

  top: 50%;

  left: 50%;

  margin-left: -10px;

  margin-top: -10px;

}

@keyframes preloader4 {

  from {

    -webkit-transform: rotate(0deg);

            transform: rotate(0deg);

  }

  to {

    -webkit-transform: rotate(360deg);

            transform: rotate(360deg);

  }

}

@-webkit-keyframes preloader4 {

  from {

    -webkit-transform: rotate(0deg);

  }

  to {

    -webkit-transform: rotate(360deg);

  }

}





/* ==========================================================================

   Option Switch

   ========================================================================== */

.boxed {

  max-width: 1230px;

  width: 100%;

  margin: 0 auto;

  position: relative;

  -webkit-border-radius: 5px;

  border-radius: 5px;

}

.boxed:before {

  position: absolute;

  width: 100%;

  height: -webkit-calc(70%);

  height: calc(70%);

  -webkit-border-radius: 0.1px;

  border-radius: 0.1px;

  z-index: -1;

  bottom: 10px;

  content: "";

  -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);

  box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);

  display: block;

}

/* ==========================================================================

   Theme

   ========================================================================== */

.bg-theme {

  background: #fbaa35; display:none;

}

.bg-theme-callback {

  background: #fbaa35;

}

.color-theme {

  color: #fbaa35;

}

.border-color-theme {

  border-color: #fbaa35;

}

.bg-hover-theme:hover {

  background: #fbaa35;

}

.hover-text-theme:hover {

  color: #fbaa35;

}

.hover-border-theme:hover {

  border-color: #fbaa35;

}

.hover-text-dark:hover,

.hover-text-dark:focus {

  color: #222;

}

.bg-sub {

  background: #222;

}

.bg-sub-theme-callback {

  background: #222;

}

.bg-sub-theme-callback:hover {

  background: #fbaa35;

}

.container .container{

  width: 100%;

}

div .wpb_button, div .wpb_content_element, div ul.wpb_thumbnails-fluid>li{

  margin-bottom: 0;

}

.w100 .row{

  margin: 0;

}



/*Accrodion*/

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel.vc_active .vc_tta-panel-heading,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-heading,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-heading:focus, 

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-heading:hover,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-body,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab>a,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active>a,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab>a:focus, 

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab>a:hover,

div.vc_tta-color-grey.vc_tta-style-classic.vc_tta-tabs .vc_tta-panels .vc_tta-panel-body{



  background: #fff;

}

div.vc_tta.vc_general .vc_tta-panel-title > a{

  font-size: 16px;

  line-height: 1.4;

}

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-title>a{

  color: #444;

}

div.vc_tta-color-grey.vc_tta-accordion .vc_tta-panel .vc_tta-panel-heading,

div.vc_tta-color-grey.vc_tta-accordion .vc_tta-panel .vc_tta-panel-body{

  border-left: 3px solid #444;

}

div.vc_tta-color-grey.vc_tta-accordion .vc_tta-panel.vc_active .vc_tta-panel-heading,

div.vc_tta-color-grey.vc_tta-accordion .vc_tta-panel.vc_active .vc_tta-panel-body{

  border-left: 3px solid #fbaa35;

}

div.vc_tta-color-grey.vc_tta-style-classic.vc_tta-tabs .vc_tta-panels .vc_tta-panel-body,

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab>a{

  border-color: #f0f0f0!important;

}

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab{

  border-top: 3px solid #444;

}

div.ot-tab.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab{

  width: calc( 100% / 3 );

}

div.ot-tab.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab:last-child{

  border-right: 1px solid;

}

div.vc_tta-color-grey.vc_tta-style-classic .vc_tta-tab.vc_active{

  border-top: 3px solid #fbaa35;

}

div.ot-tab.vc_tta.vc_tta-style-classic .vc_tta-tabs-list{

  margin-right: -5px;

}

div.vc_tta-container{

  margin-bottom: 0;

}

.vc_tta-tab .vc_tta-title-text{

  font-family: 'Oswald', sans-serif;

  font-weight: 300;

  font-size: 18px;

}

.wpb_layerslider_element {

  overflow: hidden;

}

section.vc_row{

  margin: 0;

}



.wpb_row.vc_row-o-equal-height .vc_column_container {

  display: flex;

}

.wpb_row.vc_row-o-equal-height .row {

  box-sizing: border-box;

  display: flex;

  flex-wrap: wrap;

}

.wpb_row.vc_row-o-equal-height .vc_column_container {

    -moz-box-align: stretch;

    align-items: stretch;

}

.wpb_row.vc_row-o-content-middle .vc_column_container .vc_column-inner {

    -moz-box-pack: center;

    justify-content: center;

}

.wpb_row.vc_row-flex .vc_column_container .vc_column-inner {

    -moz-box-flex: 1;

    display: flex;

    flex-direction: column;

    flex-grow: 1;

}

.wpb_row.vc_row-o-content-bottom .vc_column_container .vc_column-inner {

    -moz-box-pack: end;

    justify-content: flex-end;

}

.wpb_row.vc_row-o-content-top .vc_column_container .vc_column-inner {

    -moz-box-pack: start;

    justify-content: flex-start;

}



#custom_html-2{ text-align:right;}



a .fa { color:#fff;}



textarea{ height:100px!important;}

.custom-icon-box{margin-top:65px!important;}

.custom-icon-box .icon-1 {position: absolute;
top: -50px;
left: 30%;border-width: 0px; background:#000;}

.custom-icon-box h4{ color:#fff!important;}
.custom-icon-box .iconbox { padding: 70px 0px 30px; border: none !important;background-color: #000;}

.custom-icon-box .iconbox i.fa{ color:#fff;}
.vc_btn3.vc_btn3-color-juicy-pink, .vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
    color: #fff;
    background-color: #2996cf !important;
}

.vc_gitem-post-data-source-post_title h4{ color:#2996cf !important;}


.move-custom-form input, .move-custom-form button, .move-custom-form select, .move-custom-form textarea {
    width: 100%;
    font-size: 16px;
    padding: 10px;height: 40px;
}

input[type="submit"]{line-height: 20px;
border: 0px;
background: #1d369a;
color: #fff!important;}

input:hover[type="submit"]{background:#fbaa35;}

.move-custom-form .ls-layer{ height:auto !important;}

.footer-top-box{background:url(https://www.packzia.in/wp-content/themes/dotted/footer-bg.jpg); padding: 50px 0px;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;}
.footer-top-box h3{text-align: center;
font-size: 30px;
margin: 20px;color: #fff;

}

footer .widget{ list-style:none;}

footer ul.menu li{margin-bottom: 10px;
 color:#fff ;font-weight: 300;}
footer ul.menu li a{ color:#fff;}
footer a:hover{  color: #ccc !important;}
footer p, footer p a {
    font-weight: 300;
    color: #fff;}

.footer-top-box ul.menu li, .footer-top-box ul.menu li a{ color: #eee;
font-size: 15px;}
 .footer-top-box ul.menu li a strong {
    font-weight: 300;

}

 .footer-top-box ul.menu li{border-bottom: 1px dotted #666;padding-left: 20px !important;}
 a.btn-menu-mobile .fa {
    color: #000;
    font-size: 30px;float: left; width:100%;
}

.mm-menu em.mm-counter {
    display: none !important;
}


.sidebar-page .widget li, .footer-top-box ul.menu li{float: left; width:100%;list-style-position: inside;background-image:url(https://www.packzia.in/wp-content/themes/dotted/li-icon.png); background-size:10px;  background-position:left center; background-repeat:no-repeat; padding-left:10px;}
.sidebar-page .widget li{ background:none;padding-left: 0px;}

.footer-top-box ul.menu li a:hover, .sidebar-page .widget li a:hover {margin-left:5px !important; color:#2996cf;}


.blue-box .iconbox,.black-box .iconbox .icon-1{background:#2996cf;}
.black-box .iconbox, .blue-box .iconbox .icon-1{background: #666666;}
.exporter-box p{ color:#fff !important;}
.exporter-box input[type="submit"]{ margin-top:5px;}
button, input, optgroup, select, textarea {color: #333 !important;
    width: 100%;
    padding: 5px; margin-bottom: 5px;height: 38px;
    float: left; width:100%;}
	

	label { float:left; width:100%;}


.mobile-banner{ display:none;}


.custom-heading-box{ margin-bottom:30px !important;}
.custom-heading-box h2{font-size: 25px !important;
font-weight: normal;
text-transform: uppercase;
color: #fbaa35 !important;}

.custom-heading-box img{margin-top: -10px !important;}
.main-page article h2{ font-size:25px; color:#fbaa35;padding: 15px 0px;}

.iconbox h2{ font-size:20px; font-weight:300; text-transform:uppercase;}

.folder-box{ margin-top:30px !important;} 
#sidebar .widget h3, .custom-title1{
    margin-bottom: 20px;padding-top: 15px;color: #000;}
	
	#text-3{ margin-bottom:0px !important;}
	
	.blue-text{ color:#1d369a;}
	
	.call-us{ font-size:14px; font-weight:bold; }
	
	
	div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {

    border: 2px solid #f7e700;
    background: #ccc !important;

}

.menu-item-924 a{background: #2996cf;
color: #fff !important;
border-radius: 10%;
padding: 10px 30px !important;
margin-left: 10px;}
	
	
	.get-quote-butt{ display:none;}
	
	
	h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight:300;}
.blog-text img.attachment-post-thumbnail{ width:100%; margin-bottom:20px;
}


#main-content a .fa {
    color: #000;
}

.custom-header-box{float: left;
list-style: none;
width: 43%;
text-align: left;
padding-top: 34px;}
.custom-header-box #text-6{margin-bottom:0px;margin-top: 10px;}

#stick{ margin-bottom:0px;}

.wpb-js-composer .vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel.vc_active .vc_tta-panel-title > a {
    color: #fff !important;
    background-color: #fbaa35;
}


.wpb-js-composer .vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel.vc_active .vc_tta-panel-title > a i.vc_tta-controls-icon-plus{ color:#fff !important;}

.copyright-box{ background:#000; text-align:center; width:100%; padding:10px; float:left; color:#fff}

.custom-heading{margin-bottom: 20px; text-align:center;border: 1px dotted #fbaa35; color:#000;
padding: 20px 0px; background-image: url(header-bg.jpg);}
.page .main-page table{ width:100%; margin:20px 0px;}

.page .main-page table tr:nth-child(2n+1) {
    background:#efefef;
}
.page .main-page table td{
    text-align: left;
    border: 1px solid #ccc;
	 padding: 5px 10px;
}

/*#subheader button, #subheader input, #subheader optgroup, #subheader select, #subheader textarea {
    width: 15%;
    line-height: 30px;
    height: 40px;
    margin: 5px;
    z-index: 1200;
}*/

#text-6 form .col-md-2{ width:100%;}

#custom_html-3{ margin-bottom:0px;}

.product-section-home .wpb_single_image .vc_single_image-wrapper {
    display: inline-block;
    vertical-align: top;
    max-width: 100%;
    background: #1d369a;
    border-radius: 50%;
    height: 80px;
    width: 80px;
    padding: 20px 15px;
    line-height: 36px;
}


.wpb-js-composer .vc_tta-color-orange.vc_tta-style-modern .vc_tta-panel .vc_tta-panel-heading {
    border-color:#2429c9 !important;
    background-color: #2429c9 !important;
    text-transform: uppercase;float: left;
width: 100%;
}

.wpb-js-composer .vc_tta-color-orange.vc_tta-style-modern .vc_tta-panel .vc_tta-panel-heading {
    border-color: #f6b859;
    background-color: #f7be68;
}
.wpb-js-composer .vc_tta-color-orange.vc_tta-style-modern .vc_tta-panel.vc_active .vc_tta-panel-title > a {
    color: #fff !important;
	background:#1d369a !important; border-color:#1d369a !important;
}


.wpb-js-composer .vc_tta-color-orange.vc_tta-style-modern .vc_active .vc_tta-panel-heading .vc_tta-controls-icon::after, .wpb-js-composer .vc_tta-color-orange.vc_tta-style-modern .vc_active .vc_tta-panel-heading .vc_tta-controls-icon::before {

    border-color: #fff !important;

}
#sidebar form .col-md-2{ width:100%;}
.desktop-banner{padding: 150px 100px 100px 100px !important; }
.how-it-work h3{ color:#fff;}
#sliderpost_widget-2 .blog2-detail p {display:none;}

.how-it-work-section .wpb_single_image::after {
    background: rgba(0, 0, 0, 0) url(process_after.png) no-repeat scroll 0 0;
    content: "";
    height: 100%;
    left: -12%;
    position: absolute;
   top: 60px;
    width: 100%;
}


.how-it-work-section .vc_col-sm-3:first-child .wpb_single_image::after { display:none;}
h3 strong{ font-weight:300;}

.wpcf7-form-control-wrap {
    float: left;
    width: 100%;
}
#recent-posts-2 li{ margin-bottom:20px;}
#recent-posts-2 li a{ color:#fff;font-weight: 300;
width: 100%;
float: left;}
#recent-posts-2 li .post-date{font-size: 12px;
font-weight: 300;}



/* Responsive

----------------------------------------------------------*/

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */

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

  body #page, body #page.ot-boxed{

    margin: 0;

  }

}





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

  header,

  .header-v1,

  .header-v2,

  .header-v3 {

    padding-left: 15px;

    padding-right: 15px;

  }

  .topbar-1 .topbar-1-inner{

    padding-left: 15px; 

    padding-right: 15px; 

  }

  .iconbox-set-2 {

    text-align: center;

  }

  .iconbox-set-2 .icon-1 {

    position: static;

    margin-bottom: 25px;

  }

  .iconbox-set-2 h4,

  .iconbox-set-2 p.sub-text {

    float: none;

    margin-left: 0;

    display: block;

  }

  .iconbox-set-2 .ot-btn {

    float: none;

    margin-left: 0;

  }

  .panel-group {

    margin-bottom: 30px;

  }

  .team-warp-page .team-item {

    margin: 15px 0;

  }

  .team-warp-page .team-item-img-container img {

    width: 100%;

    max-width: 100%;

  }

  .blog2-warp {

    height: 170px;

    overflow: hidden;

  }

  .twitter-widget-2 li {

    min-height: auto;

  }

}

/* Medium Devices, Desktops */

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

  .btn-menu-mobile {

    display: inline-block;

  }

  header {

    position: relative;

  }

  .header-v1 .nav-r,

  .header-v1 ul.navi-right {

    display: none;

  }

  .header-v2 {

    position: relative;

  }

  .header-v2 .topbar-info{

    margin-right: 70px;

  }

  .header-v2 .social {

    display: none;

  }

  .navi-warp-h2 {

    display: none;

  }

  .header-v3 {

    height: 80px;

  }

  .header-v3 .navi-right,

  .header-v3 .nav-r,

  .header-v3 .social-3,

  .header-v3 .topbar-info,

  .header-v3 .div18 {

    display: none;

  }

  .subnavi{

    display: none;

  }

  .topbar-info-1{

    float: left;

  }

  .topbar-info-1 li{

    margin-left: 0;

    margin-right: 20px;

  }

  .iconbox {

    margin-bottom: 15px;

  }

  .discover {

    margin-bottom: 30px;

  }

  .blog2-item {

    display: inline-block;

    width: 100%;

    clear: both;

  }

  .blog2-item .blog2-detail {

    display: inline-block;

    float: right;

    padding-left: 15px;

    width: -webkit-calc(100% - 100px);

    width: calc(100% - 100px);

  }

  .main-page {

    width: 100%;

    margin-bottom: 25px;

  }

  .sidebar-page {

    width: 100%;

  }

  .owl-blog {

    float: none;

    margin-bottom: 40px;

  }

  .img-tab-demo {

    margin: 25px auto;

    margin-top: 10px;

    display: block;

  }

  .tab1 {

    clear: both;

  }

  .reward-item {

    height: auto;

    min-height: auto;

  }

  .demo-skill {

    display: none;

  }

  .icon-box.effect {

    text-align: center;

  }

  .icon-box.effect h3,

  .icon-box.effect p,

  .icon-box.effect span {

    margin-left: 0;

  }

  .icon-box.small .icon {

    position: static;

    margin: 50px auto;

    margin-bottom: 5px;

    padding: 0;

  }

  .about-single-team {

    margin-top: 30px;

  }

  .widget-footer-blog {

    float: none;

  }

  .widget-footer {

    clear: both;

    margin-bottom: 30px;

  }

  .widget-footer .social-f1 {

    float: none;

    display: inline-block;

    width: 100%;

  }

  .widget-footer .contact-f1 img {

    max-width: 200px;

    margin: 30px 0;

    display: block;

  }

  .blog2-warp {

    height: 220px;

    overflow: hidden;

  }
    .custom-heading-box{ margin-top:30px !important;float: left;
width: 100%;}
  .custom-heading-box img{ display:none;}

.move-custom-form input, .move-custom-form button, .move-custom-form select, .move-custom-form textarea {
   
    margin-bottom: 5px !important;
}
.mobile-banner form .row .col-md-2{ float: left !important;
width: 100% !important;}

/*#content .wpb_alert p:last-child, #content .wpb_text_column :last-child, #content .wpb_text_column p:last-child, .wpb_alert p:last-child, .wpb_text_column :last-child, .wpb_text_column p:last-child {
    float: left;
    width: 100%;
}*/

.menu-item-924{ display:none !important;}



#wpcf7-f675-p14-o1{background-color: rgba(0,0,0,0.5);}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
   
    float: left;
    width: 100%;
}

.custom-icon-box .iconbox {
    padding: 70px 0px 30px;
    border: none !important;
    float: left;
    width: 100%;
}
.exporter-box p { text-align: center !important;}

.custom-icon-box .icon-1 {left: 40%;}

.vc_col-sm-3 {
    width: 50% !important;
    float: left;
}

#subheader button, #subheader input, #subheader optgroup, #subheader select, #subheader textarea {
    width:100%;
}

.sub-header-border {padding: 30px 0;}
.container {
    width: auto;
}

.custom-header-box {width: 40%;}

section {
    padding: 20px 0;}


}


/* Small Devices, Tablets */

@media only screen and (max-width: 767px) {
	
	.vc_col-sm-3 {
    width: 100% !important;margin-bottom: 30px !important;}

  .topbar-1, .topbar-1 .topbar-1-inner{

    height: auto; text-align:center;

  }

  .topbar-1 .social-1,

  .topbar-1 .topbar-info {

    float: none;

    margin-left: 0;

  }

  .header-v2 .topbar-info-2{

    display: none;

  }
  
  .topbar-1 .social, .topbar-1 .email-link{ display:none;}
  
  
.logo .img-responsive {
width: 60px;
}
  .sub-header-warp {

    padding: 0 15px;

  }

  .header-iconbox {

    padding-left: 15px;

    padding-right: 15px;

  }

  /* Slider 1 */

  .slider1 p {

    display: none;

  }

  .slider1 .ls-nav-prev,

  .slider1 .ls-nav-next {

    display: none !important;

  }

  .slider2 h3,

  .slider2 p {

    display: none;

  }

  .slider2 .ls-nav-prev,

  .slider2 .ls-nav-next {

    display: none !important;

  }

  .slider3 p {

    display: none;

  }

  .slider3 h4 {

    font-size: 28px;

  }

  .slider3 .ot-btn {

    margin-top: 0;

  }

  .slider5 p {

    display: none;

  }

  .twitter1-warp {

    width: -webkit-calc(100% - 45px);

    width: calc(100% - 45px);

    height: 110px;

  }

  .panel-group {

    clear: both;

  }

  .panel-group .panel {

    border: 1px solid #ddd;

  }

  .testimonial-3-warp {

    display: inline-block;

    width: 100%;

  }

  .call1 h3 {

    padding: 0;

  }

  .call1 .ot-btn {

    position: static;

    margin-top: 25px;

    -webkit-transform: none;

    -ms-transform: none;

    transform: none;

  }

  .call1 p {

    padding-right: 0px;

  }

  .call2 h3,

  .call2 p {

    padding-right: 0;

  }

  .call2 .ot-btn {

    position: static;

    -webkit-transform: none;

    -ms-transform: none;

    transform: none;

    margin-top: 25px;

  }

  .call3 {

    padding: 0 15px;

  }

  .group-call-btn .ot-btn {

    margin-bottom: 25px;

  }

  .list-portfolio-warp {

    width: 100%;

    margin-left: 0;

  }

  .portfolio-3-col .element-item {

    width: 50%;

  }

  .portfolio-4-col .element-item {

    width: 50%;

  }

  .filter-portfolio-warp {

    padding: 0 15px;

  }

  .portfolio-feature-content .porfolio-info-col {

    width: 100%;

    margin-bottom: 25px;

  }

  .subcribe1 {

    margin-top: 25px;

  }

  .subcribe1 .form-group {

    width: 100%;

  }

  .bg-overlay-img-1 {

    background-position: 0 0!important;

    -webkit-background-size: auto 100%!important;

    background-size: auto 100%!important;

  }

  .blog-video-popup .blog-feature-warp {

    width: 100%;

  }

  .img-tab-demo {

    margin: 25px auto;

    margin-top: 10px;

    display: block;

  }

  .discover ul.feature li {

    width: 100%;

  }

  .blog-footer-2 {

    height: auto;

    min-height: auto;

    display: inline-block;

  }

  .blog-video-popup .blog-feature-content {

    width: 100%;

  }

  .blog-video-popup .blog-footer-2 {

    width: 100%;

  }

  /* 

     page service

     ========================================================================== */

  .main-services-warp,

  .heading-services {

    padding: 0 15px;

  }

  .hero-wrap-404 .heading-404 {

    font-size: 32px;

    line-height: 40px;

  }

  .search404 .form-group {

    width: 100%;

  }

  .search404 .form-control {

    margin-left: 5%;

    width: 90%;

  }

  .pricing-tables-group-item {

    width: 50%!important;

  }

  .product-item {

    width: 50%;

    float: left;

  }

  .left-header-shop {

    width: 100%;

    margin-bottom: 25px;

  }

  .order-select {

    width: 50%;

    padding-left: 0;

  }

  .order-select {

    padding-right: 15px;

  }

  .right-checkout,

  .left-checkout {

    width: 100%;

    margin-bottom: 25px;

  }

  .form-coupon-input {

    display: inline-block;

  }

  .review-product,

  .additional-product {

    margin-bottom: 25px;

    width: 100%;

    padding: 0 15px;

  }

  /*Group Logo*/

  .logo-group-item {

    width: 50%;

  }

  .logo-group-item:nth-child(2n+2) {

    border-right-color: transparent;

  }

  .logo-group-item:nth-child(5),

  .logo-group-item:nth-child(6) {

    border-bottom: 1px solid #e5e5e5;

  }

  .portfolio-feature-content .col-description ul.social-share {

    float: none;

    display: block;

    width: 100%;

  }

  .portfolio-feature-content .col-description .ot-btn {

    clear: both;

  }

  .full-masonry-layout {

    width: 100%;

  }

  .main-page .full-masonry-layout .grid-item {

    width: 100%;

  }

  .full-masonry-layout .grid-item,

  .full-masonry-layout .grid-sizer {

    width: 100%;

  }

  .left-form-comment,

  .right-form-comment {

    width: 100%;

    padding: 0;

  }

  .right-form-comment {

    margin-bottom: 25px;

  }

  ul.copyright-1 {

    display: none;

  }

  .text-copyright-1 {

    text-align: center;

    float: none;

  }

  .desk-no-padding-left {

    padding-left: 15px;

  }

  .footer-v3 .widget-footer-list-link {

    width: 100%;

    margin-bottom: 15px;

  }




.blue-box, .black-box{ margin-bottom:60px !important;}
.custom-icon-box {
    margin-top: 0px !important;
}
.vc_custom_1560831328194{ margin-top:30px !important;}
.get-quote-butt {
    display: block;
    background:#1d369a;
    color: #fff !important;
    border-radius: 10%;
    padding: 5px 20px !important;
    margin-left: 270px;
    position: relative;
    margin-bottom: -124px; display:none;
   
	
	
    float: left;
    margin-top: 56px;z-index: 10000;
}

.footer-top-box h3 { font-size:25px;width: auto;}

h1 {
    font-size: 28px;}
	.title-subheader { margin-bottom:10px; font-size:30px;}
#custom_html-2, #text-2 { text-align:center !important;}

footer { padding-bottom:0px;}

.iconbox-set-3 p {
    margin-top: 12px;
    margin-left: 0px;
    display: block;
    float: left;
    margin-top: 0;
    text-align: center;
    clear: both;
    width: 100%;
}
	
.icon-2 {
    position: relative;
    margin-left: 40%;}
	.iconbox-set-3 { text-align:center;}
	
	.welcome-img{ display:none;}
	.wpb_single_image .vc_figure {margin: 20px 0px 0px;}
	
	.custom-header-box {margin-left: 0%;
display: block;
padding-top: 17px;
text-align: left;
padding-left: 0px;}


#subheader button, #subheader input, #subheader optgroup, #subheader select, #subheader textarea {
   
    height: 40px;
margin: 10px 0;
}

.col-md-2{ float:left; width:100%;}

.desktop-banner{ padding:20px 20px !important;}

.desktop-banner .wpb_content_element {
    margin-bottom: 30px !important;
float: left !important;
}

.product-section-home .wpb_single_image.vc_align_center{ margin-top:30px !important;}



.wpb-js-composer .vc_tta-container {
    float: left;
}
	.wpb-js-composer .vc_tta.vc_tta-gap-10 .vc_tta-panel:not(:last-child):not(.vc_active) .vc_tta-panel-heading {
    margin-bottom: 10px;
    float: left;
    width: 100%;
}

.how-it-work .wpb_single_image.vc_align_center {
    margin-bottom: 30px !important;
}

.customNavigation-1 {margin-top: 20px;}

footer .widget {
    float: left;
    width: 100%;
}

.page .main-page .custome-tabel-box{overflow: auto;
float: left;
width: 100%;}
.page .main-page table{ width:360px;}
	
}

/*Custom*/

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

  .blog-footer {

    position: static;

  }
  
  .get-quote-butt { margin-left: 5%;
margin-top: 30px;
display: block;
position: relative;
float: left;
width: 91%;
clear: both;
top: -25px;
border-radius: 0px;
margin-right: 5%;
text-align: center;}
  
  .custom-icon-box .icon-1 {left: 32%;}
  .topbar-1, .header-v2 {
    padding-top: 45px;
}

.how-it-work-section .vc_col-sm-3 .wpb_single_image::after { display:none;}

}

/* Extra Small Devices, Phones */

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

  /* Reset */

  /* LAYOUT */

  .product {

    width: 100%;

  }

  .order-select {

    width: 100%;

    padding-left: 0;

    margin-bottom: 15px;

  }

  .order-select {

    padding-right: 0;

  }

  .discover2 ul.feature li {

    width: 100%;

  }

  .discover ul.feature {

    width: 100%;

    margin-top: 25px;

  }

  .discover {

    margin-bottom: 30px;

  }

  .discover img {

    margin: 10px auto;

    float: none;

    display: block;

  }

  .img-demo-blog,

  .blog-sum-warp {

    width: 100%;

    height: auto;

  }

  .twitter-logo-fix {

    width: 25px;

    height: 25px;

    -webkit-border-radius: 50%;

    border-radius: 50%;

    border-width: 1px;

    border-style: solid;

    border-color: #fbaa35;

    display: inline-block;

    float: left;

    line-height: 25px;

    text-align: center;

    font-size: 15px;

  }
  .custom-header-box {margin-left:0%;}
  
   .custom-header-box img{width: 82px;}

  .twitter1-warp {

    padding-left: 30px;

  }

  .twitter-widget-1 ul li .tweets_txt {

    font-size: 13px;

  }

  .twitter-widget-1 ul li .tweets_txt li,

  .twitter-widget-1 ul li .tweets_txt a,

  .twitter-widget-1 ul li .tweets_txt p {

    font-size: 13px;

  }

  .iconbox-set-2 .icon-1 {

    position: static;

  }

  .iconbox-set-2 h4,

  .iconbox-set-2 .ot-btn,

  .iconbox-set-2 p.sub-text {

    margin-left: 0;

    text-align: center;

    float: none;

    display: block;

  }

  .iconbox-set-2 h4 {

    margin-top: 15px;

  }

  .countdown li {

    width: 80%;

    margin: 10px auto;

    float: none;

  }

  .hero-wrap-cms .heading-cms {

    font-size: 32px;

  }

  .bgcms,

  .overlay-cms {

    height: 100%;

  }

  .hero-wrap-cms {

    position: relative;

    -webkit-transform: none;

    -ms-transform: none;

    transform: none;

  }

  .portfolio-3-col .element-item {

    width: 100%;

  }

  .portfolio-4-col .element-item {

    width: 100%;

  }

  .pricing-tables-group-item {

    width: 100%!important;

  }

  .header-comment .ot-btn {

    position: static;

    margin: 15px;

    -webkit-transform: none;

    -ms-transform: none;

    transform: none;

  }

  .social-fr {

    display: none;

  }

  .text-copyright-2 {

    float: none;

    text-align: center;

  }

}

/* Smallest Devices, Phones */

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

  /* Slider */

  .slider-home-2 .heading-1 {

    font-size: 20px!important;

  }

  .slider-home-2 .heading-2 {

    font-size: 13px!important;

  }

  .slider-home-3 .heading-3 {

    font-size: 13px!important;

  }

  .slider-home-3 .heading-4 {

    font-size: 20px!important;

  }

  /* Footer Navi */

  .footer-v1 nav ul li a::after {

    display: none;

  }

}