@charset "utf-8"; /*------------------------------------------------------------------




BREE CHANGED FONTS AND RELATIVE PATHS, COMMENTED OUT FONT AND ICON RESOURCES
ALSO COPIED CONTENTS OF style-responsive.css
ALSO COPIED CONTENTS OF animate.min.css
ALSO COPIED CONTENTS OF vertical-rhythm.min.css


[Master Stylesheet]

Project: Rhythm
Version: 3.2
Last change: 28 Jyle 2021
Primary use: MultiPurpose Template  
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
COMMENTED OUT SINCE USING OTHER FONTS AND ICON CDN
@import "font-awesome.min.css"; @import "et-line.css"; @import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,300,700); @import url(https://fonts.googleapis.com/css?family=Dosis:300,400,700); -------------------------------------------------------------------*/


/*------------------------------------------------------------------
[Table of contents]

1. Common styles
2. Page loader / .page-loader
3. Typography
4. Buttons
5. Forms fields
6. Home sections / .home-section
    6.1. Home content
    6.2. Scroll down icon
    6.3. Headings styles
7. Compact bar / .nav-bar-compact
8. Classic menu bar / .main-nav
9. Sections styles / .page-section, .small-section, .split-section
10. Alternative services / .alt-service-grid
11. Team / .team-grid
12. Features
13. Benefits (Process)
14. Counters
15. Portfolio / #portfolio
    15.1. Works filter
    15.2. Works grid
    15.3. Works full view
16. Banner section
17. Testimonial
    17.1. Logotypes
18. Post previews (news section)
19. Newsletter
20. Contact section
    20.1. Contact form
21. Bottom menu / .bot-menu
22. Google maps  /.google-map
23. Footer / .footer
24. Blog
    24.1. Pagination
    24.2. Comments
    24.3. Sidebar
25. Shop
26. Pricing
27. Shortcodes
    27.1. Owl Carousel
    27.2. Tabs
    27.3. Tabs minimal
    27.4. Alert messages
    27.5. Accordion
    27.6. Toggle
    27.7. Progress bars
    27.8. Font icons examples
    27.9. Intro page
28. Special demos
29. Skip to Content Link
30. Improve the readability
31. Wow animation fix
32. Morphext


/*------------------------------------------------------------------
# [Color codes]

# Black (active elements, links, text) #111
# Gray (text) #777
# Dark #111
# Dark Lighter #252525
# Gray BG #f4f4f4
# Gray BG Lighter #f8f8f8
# Mid grey #5f5f5f
# Borders #e9e9e9

# */


/*------------------------------------------------------------------
[Typography]

Body:               14px/1.6 "Josefin Sans", arial, sans-serif; Headers:            "Atkinson Hyperlegible", arial, sans-serif; Serif:              "Times New Roman", Times, serif; Section Title:      35px/1.3 "Josefin Sans", arial, sans-serif; Section Heading:    24px/1.3 "Josefin Sans", arial, sans-serif; Section Text:       15px/1.7 "Josefin Sans", arial, sans-serif; -------------------------------------------------------------------*/


/* ==============================
   Common styles ============================== */
  
.align-center {text-align:center !important;} .align-left {text-align:left !important;} .align-right {text-align:right !important;} .text-justify {text-align: justify !important;} .left{float:left !important;} .right{float:right !important;} .relative{position:relative;} .hidden{display:none;} .inline-block{display:inline-block;} .white {color: #fff !important;} .black {color: #111 !important;} .color {color: #e41919 !important;} .glass {opacity: .5;} .image-fullwidth img {width: 100%;} .stick-fixed {position: fixed !important; top: 0; left: 0;} .round {-webkit-border-radius: 2px !important; -moz-border-radius: 2px !important; border-radius: 2px !important;} ::-moz-selection {color: #fff; background:#000;} ::-webkit-selection {color: #fff; background:#000;} ::selection {color: #fff; background:#000;} .animate, .animate * {-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .no-animate, .no-animate * {-webkit-transition: 0 none !important; -moz-transition: 0 none !important; -ms-transition: 0 none !important; -o-transition: 0 none !important; transition:0 none !important;} .shadow {-webkit-box-shadow: 0px 3px 50px rgba(0, 0, 0, .15); -moz-box-shadow: 0px 3px 50px rgba(0, 0, 0, .15); box-shadow: 0px 3px 50px rgba(0, 0, 0, .15);} .white-shadow {-webkit-box-shadow: 0px 0px 200px rgba(255, 255, 255, .2); -moz-box-shadow: 0px 0px 200px rgba(255, 255, 255, .2); box-shadow: 0px 0px 200px rgba(255, 255, 255, .2);} .clearlist, .clearlist li {list-style: none; padding: 0; margin: 0; background: none;} .full-wrapper {margin: 0 2%;} @media (min-width: 768px) {.container {width: 750px;} } @media (min-width: 992px) {.container {width: 970px;} } @media (min-width: 1200px) {.container {width: 1170px;} } .container-fluid {max-width: 1170px; margin: 0 auto; padding: 0 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .container-1400 {max-width: 1400px; margin: 0 auto; padding-left: 2%; padding-right: 2%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} :root {scroll-behavior: auto;} html {overflow-y: scroll; -ms-overflow-style: scrollbar;} html, body {height: 100%; -webkit-font-smoothing: antialiased;} .page {overflow: hidden;} .body-masked {display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #fff url(/art_theme/images/loader.gif) no-repeat center center; z-index: 100000;} .mask-delay {-webkit-animation-delay: 0.75s; -moz-animation-delay: 0.75s; animation-delay: 0.75s;} .mask-speed {-webkit-animation-duration: 0.25s !important; -moz-animation-duration: 0.25s !important; animation-duration: 0.25s !important;} iframe {border: none;} a, b, div, ul, li {-webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; -moz-outline-: none;} a:focus:not(.focus-visible), a:active, section:focus, div:active, div:focus {-moz-outline: none; outline: none;} a:focus.focus-visible, button:focus.focus-visible, div:focus.focus-visible {-moz-outline: 2px dotted #36a367 !important; outline: 2px dotted #36a367 !important; outline-offset: 0 !important;} img:not([draggable]), embed, object, video {max-width: 100%; height: auto;} /* ==============================
   Page loader ============================== */


.page-loader {display:block; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #fefefe; z-index: 100000;} .loader {width: 50px; height: 50px; position: absolute; top: 50%; left: 50%; margin: -25px 0 0 -25px; font-size: 10px; text-indent: -12345px; border-top: 1px solid rgba(0,0,0, 0.08); border-right: 1px solid rgba(0,0,0, 0.08); border-bottom: 1px solid rgba(0,0,0, 0.08); border-left: 1px solid rgba(0,0,0, 0.5); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-animation: spinner 700ms infinite linear; -moz-animation: spinner 700ms infinite linear; -ms-animation: spinner 700ms infinite linear; -o-animation: spinner 700ms infinite linear; animation: spinner 700ms infinite linear; will-change: transform; z-index: 100001;} @-webkit-keyframes spinner {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);} } @-moz-keyframes spinner {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);} } @-o-keyframes spinner {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);} } @keyframes spinner {0% {-webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg);} } /* ==============================
   Typography ============================== */

body {color: #111; font-size: 14px; font-family: "Josefin Sans", arial, sans-serif; line-height: 1.6; -webkit-font-smoothing: antialiased;} a {color: #111; text-decoration: underline;} a:hover {color: #888; text-decoration: underline;} h1,h2,h3,h4,h5,h6 {margin-bottom: 1.3em; line-height: 1.4; font-weight: 400;} h1, .h1 {font-size: 32px;} h2, .h2 {font-size: 28px;} h3, .h3 {font-size: 24px;} h4, .h4 {font-size: 18px;} h5, .h5 {font-size: 14px;} h6, .h6 {font-size: 12px; font-weight: 700;} p {margin: 0 0 2em 0;} ul, ol {margin: 0 0 1.5em 0;} blockquote {margin: 3em 0 3em 0; padding: 0; border: none; background: none; font-style: normal; line-height: 1.7; color: #777;} blockquote p {margin-bottom: 1em; font-size: 24px; font-weight: 300; font-style: normal; line-height: 1.6;} blockquote footer {font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: 2px;} dl dt {margin-bottom: 5px;} dl dd {margin-bottom: 15px;} pre {background-color: #f9f9f9; border-color: #ddd;} hr {background-color: #000; opacity: .08;} hr.white {background-color: #fff} .uppercase {text-transform: uppercase; letter-spacing: 1px;} .font-alt {font-family: "Atkinson Hyperlegible", arial, sans-serif; text-transform: uppercase; letter-spacing: 0.2em;} .serif {font-family: "Times New Roman", Times, serif; font-style: italic; font-weight: normal;} .normal {font-weight: normal;} .strong, strong {font-weight: 700 !important;} .lead {margin: 1em 0 2em 0; font-size: 140%; line-height: 1.6;} .text {font-size: 16px; font-weight: 300; color: #5f5f5f; line-height: 1.8;} .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 {color: #111;} .dropcap {float: left; font-size: 3em; line-height: 1; padding: 2px 8px 2px 0;} .table td {border-color: #ddd;} .table tr:first-child td {border-top: 1px solid #ddd;} .big-icon {display: block; width: 90px; height: 90px; margin: 0 auto 20px; border: 3px solid #fff; text-align: center; line-height: 88px; font-size: 32px; color: rgba(255,255,255, .97); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .big-icon .fa-play {position: relative; left: 4px;} .big-icon.big-icon-rs {border: none; width: auto; height: auto; font-size: 96px;} .big-icon-link {display: inline-block; text-decoration: none;} .big-icon-link:hover {border-color: transparent !important;} .big-icon-link:hover .big-icon {border-color: #fff; color: #fff; -webkit-transition: 0 none !important; -moz-transition: 0 none !important; -ms-transition: 0 none !important; -o-transition: 0 none !important; transition:0 none !important;} .big-icon-link:active .big-icon {-webkit-transform: scale(0.99); -moz-transform: scale(0.99); -o-transform: scale(0.99); -ms-transform: scale(0.99); transform: scale(0.99);} .wide-heading {display: block; margin-bottom: 10px; font-size: 48px; font-weight: 400; letter-spacing: 0.4em; text-align: center; text-transform: uppercase; opacity: .9; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .big-icon-link:hover, .big-icon-link:hover .wide-heading {color: #fff; text-decoration: none;} .sub-heading {font-size: 16px; font-style: italic; text-align: center; line-height: 1.3; color: rgba(255,255,255, .75);} .big-icon.black {color: #000; border-color: rgba(0,0,0, .75);} .big-icon-link:hover .big-icon.black {color: #000; border-color: #000;} .wide-heading.black {color: rgba(0,0,0, .87);} .big-icon-link.black:hover, .big-icon-link:hover .wide-heading.black {color: #000; text-decoration: none;} .sub-heading.black {color: rgba(0,0,0, .75);} /* ==============================
   Buttons ============================== */
  
.btn-mod, a.btn-mod {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 4px 13px; color: #fff; background: rgba(34,34,34, .9); border: 2px solid transparent; font-size: 11px; font-weight: 400; text-transform: uppercase; text-decoration: none; letter-spacing: 2px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .btn-mod:hover, .btn-mod:focus, a.btn-mod:hover, a.btn-mod:focus {font-weight: 400; color: rgba(255,255,255, .85); background: rgba(0,0,0, .7); text-decoration: none; outline: none; border-color: transparent; -webkit-box-shadow: none; box-shadow: none;} .btn-mod:active {cursor: pointer !important; outline: none !important;} .btn-mod.btn-small {height: auto; padding: 6px 17px; font-size: 11px; letter-spacing: 1px;} .btn-mod.btn-medium {height: auto; padding: 8px 37px; font-size: 12px;} .btn-mod.btn-large {height: auto; padding: 12px 45px; font-size: 13px;} .btn-mod.btn-glass {color: rgba(255,255,255, .75); background: rgba(0,0,0, .40);} .btn-mod.btn-glass:hover, .btn-mod.btn-glass:focus {color: rgba(255,255,255, 1); background: rgba(0,0,0, 1);} .btn-mod.btn-border {color: #151515; border: 2px solid #151515; background: transparent;} .btn-mod.btn-border:hover, .btn-mod.btn-border:focus {color: #fff; border-color: transparent; background: #000;} .btn-mod.btn-border-c {color: #e41919; border: 2px solid #e41919; background: transparent;} .btn-mod.btn-border-c:hover, .btn-mod.btn-border-c:focus {color: #fff; border-color: transparent; background: #e41919;} .btn-mod.btn-border-w {color: #fff; border: 2px solid rgba(255,255,255, .75); background: transparent;} .btn-mod.btn-border-w:hover, .btn-mod.btn-border-w:focus {color: #111; border-color: transparent; background: #fff;} .btn-mod.btn-w {color: #111; background: rgba(255,255,255, .8);} .btn-mod.btn-w:hover, .btn-mod.btn-w:focus {color: #111; background: #fff;} .btn-mod.btn-w-color {color: #e41919; background: #fff;} .btn-mod.btn-w-color:hover, .btn-mod.btn-w-color:focus {color: #151515; background: #fff;} .btn-mod.btn-gray {color: #777; background: #e5e5e5;} .btn-mod.btn-gray:hover, .btn-mod.btn-gray:focus {color: #444; background: #d5d5d5;} .btn-mod.btn-color {color: #fff; background: #e41919;} .btn-mod.btn-color:hover, .btn-mod.btn-color:focus {color: #fff; background: #e41919; opacity: .85;} .btn-mod.btn-circle {-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;} .btn-mod.btn-round {-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;} .btn-icon {position: relative; border: none; overflow: hidden;} .btn-icon.btn-small {overflow: hidden;} .btn-icon > span {width: 100%; height: 50px; line-height: 50px; margin-top: -25px; position: absolute; top: 50%; left: 0; color: #777; font-size: 48px; opacity: .2; -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .btn-icon:hover > span {opacity: 0; -webkit-transform: scale(2); -moz-transform: scale(2); -o-transform: scale(2); -ms-transform: scale(2); transform: scale(2);} .btn-icon > span.white {color: #fff;} .btn-icon > span.black {color: #000;} .btn-full {width: 100%;} /* ==============================
   Forms fields ============================== */

.form input[type="text"], .form input[type="email"], .form input[type="number"], .form input[type="url"], .form input[type="search"], .form input[type="tel"], .form input[type="password"], .form input[type="date"], .form input[type="color"], .form select {display: inline-block; height: 27px; vertical-align: middle; font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; color: #777; border: 1px solid rgba(0,0,0, .1); padding-left: 7px; padding-right: 7px; -webkit-border-radius: 0.1px; -moz-border-radius: 0.1px; border-radius: 0.1px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000); appearance: auto; -moz-appearance: auto; -webkit-appearance: auto;} .form select {font-size: 12px;} .form select[multiple] {height: auto;} .form input[type="text"]:hover, .form input[type="email"]:hover, .form input[type="number"]:hover, .form input[type="url"]:hover, .form input[type="search"]:hover, .form input[type="tel"]:hover, .form input[type="password"]:hover, .form input[type="date"]:hover, .form input[type="color"]:hover, .form select:hover {border-color: rgba(0,0,0, .2);} .form input[type="text"]:focus, .form input[type="email"]:focus, .form input[type="number"]:focus, .form input[type="url"]:focus, .form input[type="search"]:focus, .form input[type="tel"]:focus, .form input[type="password"]:focus, .form input[type="date"]:focus, .form input[type="color"]:focus, .form select:focus {color: #111; border-color: rgba(0,0,0, .7); -webkit-box-shadow: 0 0 3px rgba(0,0,0, .3); -moz-box-shadow: 0 0 3px rgba(0,0,0, .3); box-shadow: 0 0 3px rgba(0,0,0, .3); outline: none;} .form input[type="text"].input-lg, .form input[type="email"].input-lg, .form input[type="number"].input-lg, .form input[type="url"].input-lg, .form input[type="search"].input-lg, .form input[type="tel"].input-lg, .form input[type="password"].input-lg, .form input[type="date"].input-lg, .form input[type="color"].input-lg, .form select.input-lg {height: 48px; padding-left: 15px; padding-right: 15px; font-size: 13px;} .form input[type="text"].input-md, .form input[type="email"].input-md, .form input[type="number"].input-md, .form input[type="url"].input-md, .form input[type="search"].input-md, .form input[type="tel"].input-md, .form input[type="password"].input-md, .form input[type="date"].input-md, .form input[type="color"].input-md, .form select.input-md {height: 39px; padding-left: 13px; padding-right: 13px; font-size: 12px;} .form input[type="text"].input-sm, .form input[type="email"].input-sm, .form input[type="number"].input-sm, .form input[type="url"].input-sm, .form input[type="search"].input-sm, .form input[type="tel"].input-sm, .form input[type="password"].input-sm, .form input[type="date"].input-sm, .form input[type="color"].input-sm, .form select.input-sm {height: 32px; padding-left: 10px; padding-right: 10px;} .form textarea {font-size: 12px; font-weight: 400; text-transform: uppercase !important; letter-spacing: 1px; color: #777; border-color: rgba(0,0,0, .1); outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;} .form textarea:hover {border-color: rgba(0,0,0, .2);} .form textarea:focus {color: #111; border-color: rgba(0,0,0, .7); -webkit-box-shadow: 0 0 3px rgba(21,21,21, .3); -moz-box-shadow: 0 0 3px rgba(21,21,21, .3); box-shadow: 0 0 3px rgba(21,21,21, .3);} .form .form-group {margin-bottom: 10px;} .form input.error {border-color: #e41919;} .form div.error {margin-top: 20px; padding: 13px 20px; text-align: center; background: rgba(228,25,25, .75); color: #fff;} .form div.error a, .form div.error a:hover {color: #fff;} .form div.success {margin-top: 20px; padding: 13px 20px; text-align: center; background: rgba(50,178,95, .75); color: #fff;} .form-tip {font-size: 11px; color: #aaa;} .form-tip .fa {font-size: 12px;} /* ==============================
   Home sections ============================== */
  
/*
 * Header common styles
 */

.home-section {width: 100%; display: block; position: relative; overflow: hidden; background-repeat: no-repeat; background-attachment: fixed; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .home-content {display: table; width: 100%; height: 100%; text-align: center;} /* Home content */

.home-content {position: relative;} .home-text {display: table-cell; height: 100%; vertical-align: middle;} /* Scroll down icon */

@-webkit-keyframes scroll-down-anim {0% {bottom: 2px;} 50% {bottom: 7px;} 100% {bottom: 2px;} } @-moz-keyframes scroll-down-anim {0% {bottom: 2px;} 50% {bottom: 7px;} 100% {bottom: 2px;} } @-o-keyframes scroll-down-anim {0% {bottom: 2px;} 50% {bottom: 7px;} 100% {bottom: 2px;} } @keyframes scroll-down-anim {0% {bottom: 2px;} 50% {bottom: 7px;} 100% {bottom: 2px;} } .scroll-down {width: 40px; height: 40px; margin-left: -20px; position: absolute; bottom: 20px; left: 50%; text-align: center; text-decoration: none; -webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940);} .scroll-down:before {display: block; content: ""; width: 20px; height: 20px; margin: 0 0 0 -10px; position: absolute; bottom: 0; left: 50%; background: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); z-index: 1;} .scroll-down:hover:before {opacity: .6;} .scroll-down-icon {display: block; width: 10px; height: 10px; margin-left: -5px; position: absolute; left: 50%; bottom: 4px; color: #111; font-size: 15px; -webkit-animation: scroll-down-anim 1s infinite; -moz-animation: scroll-down-anim 1s infinite; -o-animation: scroll-down-anim 1s infinite; animation: scroll-down-anim 1s infinite; z-index: 2;} /*
 * HTML5 BG VIdeo
 */

.bg-video-wrapper {position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; z-index: 0;} .bg-video-overlay {position: absolute; width: 100%; height: 100%; top: 0px; left: 0px;} .bg-video-wrapper video {max-width: inherit; height: inherit; z-index: 0;} a.bg-video-button-muted {display:block; width: 1em; height: 1em; position: absolute; bottom: 15px; left: 15px; font-size: 28px; line-height: 1; color: #fff; opacity: .75; z-index: 1000;} /* 
 * Headings styles
 */


.hs-wrap {max-width: 570px; margin: 0 auto; padding: 47px 30px 53px; position: relative; text-align: center; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid rgba(255,255,255, .5);} .hs-wrap-1 {max-width: 350px; margin: 0 auto; position: relative; text-align: center; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} .hs-line-1 {margin-top: 0; position: relative; text-transform: uppercase; font-size: 30px; font-weight: 400; letter-spacing: 51px; color: #fff; opacity: .9;} .hs-line-2 {margin-top: 0; position: relative; font-size: 72px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.085em; line-height: 1.3; color: rgba(255,255,255, .85);} .hs-line-3 {margin-top: 0; position: relative; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: rgba(255,255,255, .7);} .hs-line-4 {margin-top: 0; position: relative; font-size: 14px; font-weight: 400; text-transform: uppercase; letter-spacing: 3px; color: rgba(255,255,255, .85);} .hs-line-5 {margin-top: 0; position: relative; font-size: 62px; font-weight: 400; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.32em; opacity: .85;} .hs-line-6 {margin-top: 0; position: relative; font-size: 19px; font-weight: 300; line-height: 1.2; opacity: .35;} .hs-line-6.no-transp {opacity: 1;} .hs-line-7 {margin-top: 0; position: relative; font-size: 64px; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; line-height: 1.2;} .hs-line-8 {margin-top: 0; position: relative; font-size: 16px; font-weight: 400; letter-spacing: 0.3em; line-height: 1.2; opacity: .75;} .hs-line-8.no-transp {opacity: 1;} .hs-line-9 {margin-top: 0; position: relative; font-size: 96px; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; line-height: 1.2;} .hs-line-10 {margin-top: 0; display: inline-block; position: relative; padding: 15px 24px; background: rgba(0,0,0, .75); font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 2px; color: rgba(255,255,255, .85);} .hs-line-10 > span {margin: 0 10px;} .hs-line-10.highlight {background: #e41919; opacity: .65;} .hs-line-10.transparent {background: none; color: #aaa; padding: 0;} .hs-line-11 {margin-top: 0; position: relative; font-size: 30px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.5em; line-height: 1.8; opacity: .9;} .hs-line-12 {margin-top: 0; position: relative; font-size: 80px; font-weight: 400; line-height: 1.2; text-transform: uppercase; letter-spacing: 0.4em;} .hs-line-13 {margin-top: 0; position: relative; font-size: 96px; font-weight: 400; line-height: 1; text-transform: uppercase; letter-spacing: 0.3em;} .hs-line-14 {margin-top: 0; position: relative; font-size: 48px; font-weight: 400; line-height: 1.4; text-transform: uppercase; letter-spacing: 0.7em;} .hs-line-15 {margin-top: 0; position: relative; font-size: 36px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; line-height: 1.3;} .no-transp {opacity: 1 !important;} .fullwidth-galley-content {position: absolute; top: 0; left: 0; width: 100%; z-index: 25;} /* ==============================
   Top bar ============================== */
  
.top-bar {min-height: 40px; background: #fbfbfb; border-bottom: 1px solid rgba(0,0,0, .05); font-size: 11px; letter-spacing: 1px;} /*
 * Top links
 */

.top-links {list-style: none; margin: 0; padding: 0; text-transform: uppercase;} .top-links li {float: left; border-left: 1px solid rgba(0,0,0, .05);} .top-links li:last-child {border-right: 1px solid rgba(0,0,0, .05);} .top-links li .fa {font-size: 14px; position: relative; top: 1px;} .top-links li .tooltip {text-transform: none; letter-spacing: normal; z-index: 2003;} .top-links li a {display: block; min-width: 40px; height: 40px; line-height: 40px; padding: 0 10px; text-decoration: none; text-align: center; color: #999; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .top-links li a:hover {color: #555; background-color: rgba(0,0,0, .02);} /*
 * Top bar dark
 */

.top-bar.dark {background-color: #333; border-bottom: none;} .top-bar.dark .top-links li, .top-bar.dark .top-links li:last-child {border-color: rgba(255,255,255, .07);} .top-bar.dark .top-links li a {color: #aaa;} .top-bar.dark .top-links li a:hover {color: #ccc; background-color: rgba(255,255,255, .05);} /* ==============================
   Classic menu bar ============================== */


/* Logo (in navigation panel)*/

.nav-logo-wrap {float: left; margin-right: 20px;} .nav-logo-wrap .logo {display: table-cell; vertical-align: middle; max-width: 118px; height: 75px; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .nav-logo-wrap .logo img {max-height: 100%;} .nav-logo-wrap .logo:before, .nav-logo-wrap .logo:after {display: none;} .logo, a.logo:hover {font-family: "Atkinson Hyperlegible", arial, sans-serif; font-size: 18px; font-weight: 400 !important; text-transform: uppercase; letter-spacing: 0.2em; text-decoration: none; color: rgba(0,0,0, .9);} /*
 * Desktop nav
 */

.main-nav {width: 100%; height: 75px !important; position: relative; top: 0; left: 0; text-align: left; background: rgba(255,255,255, .97); -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.05); -moz-box-shadow: 0 1px 0 rgba(0,0,0,.05); box-shadow:  0 1px 0 rgba(0,0,0,.05); z-index: 1030; -webkit-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: height 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .small-height {height: 55px !important;} .small-height .inner-nav ul li a {height: 55px !important; line-height: 55px !important;} .inner-nav {display: inline-block; position: relative; float: right;} .inner-nav ul {float: right; margin: auto; font-size: 11px; font-weight: 400; letter-spacing: 1px; text-transform: uppercase; text-align: center; line-height: 1.3;} .inner-nav ul li {float: left; margin-left: 30px; position: relative;} .inner-nav ul li a {color: #777; letter-spacing: 2px; display: inline-block; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .inner-nav ul > li:first-child > a{} .inner-nav ul li a:hover, .inner-nav ul li a.active {color: #000; text-decoration: none;} /* Menu sub */

.mn-sub {display: none; width: 200px; position: absolute; top: 100%; left: 0; padding: 0; background: rgba(30,30,30, .97);} .mn-sub li {display: block; width: 100%; margin: 0 !important;} .inner-nav ul li .mn-sub li a {display: block; width: 100%; height: auto !important; line-height: 1.3 !important; position: relative; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 11px 15px; font-size: 13px; text-align: left; text-transform: none; border-left: none; border-right: none; letter-spacing: 0; color: #b0b0b0 !important; outline-offset: -2px !important; cursor: pointer;} .mobile-on .mn-has-multi > li:last-child > a {border-bottom: 1px solid rgba(255,255,255, .065) !important;} .mn-sub li a:hover, .inner-nav ul li .mn-sub li a:hover, .mn-sub li a.active {background: rgba(255,255,255, .09); color: #f5f5f5 !important;} .mn-sub li ul {left: 100%; right: auto; top: 0; border-left: 1px solid rgba(255,255,255, .07);} .inner-nav > ul > li:last-child .mn-sub, .inner-nav li .mn-sub.to-left {left: auto; right: 0;} .inner-nav > ul > li:last-child .mn-sub li ul, .inner-nav > li:last-child .mn-sub li ul, .inner-nav li .mn-sub li ul.to-left {left: auto; right: 100%; top: 0; border-left: none; border-right: 1px solid rgba(255,255,255, .07);} .mobile-on .inner-nav li:last-child .mn-sub li ul {left: auto; right: auto; top: 0;} .mn-wrap {padding: 8px;} /* Menu sub multi */

.mn-has-multi {width: auto !important; padding: 15px; text-align: left; white-space: nowrap;} .mn-sub-multi {width: 190px !important; overflow: hidden; white-space: normal; float: none !important; display: inline-block !important; vertical-align: top;} .mn-sub-multi > ul {width: auto; margin: 0; padding: 0; float: none;} .mn-group-title {font-weight: 700; text-transform: uppercase; color: #fff !important;} .mn-group-title:hover {background: none !important;} .mobile-on .mn-sub-multi > ul {left: auto; right: auto; border: none;} .mobile-on .mn-sub-multi {display: block; width: 100% !important;} .mobile-on .mn-sub-multi > ul > li:last-child > a {border: none !important;} .mobile-on .mn-sub:not(.mn-has-multi) > li:last-child > a {border: none !important;} .mobile-on .mn-sub-multi:last-child > ul {border-bottom: none !important;} /*
 * Mobile nav
 */

.mobile-on .desktop-nav {display: none; width: 100%; position: absolute; top: 100%; left: 0; padding: 0 15px; z-index: 100;} .mobile-on .full-wrapper .desktop-nav {padding: 0;} .mobile-on .desktop-nav ul {width: 100%; float: none; background: rgba(18,18,18, .97); position: relative; overflow-x: hidden;} .mobile-on .desktop-nav > ul {overflow-y: auto;} .mobile-on .desktop-nav ul li {display: block; float: none !important; overflow: hidden;} .mobile-on .desktop-nav ul li ul {padding: 0; border-bottom: 1px solid rgba(255,255,255, .1);} .mobile-on .desktop-nav ul li a {display: block; width: 100%; height: 38px !important; line-height: 38px !important; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 10px; text-align: left; border-left: none; border-right: none; border-bottom: 1px solid rgba(255,255,255, .065); color: #999; letter-spacing: 1px; cursor: pointer;} .mobile-on .desktop-nav ul li a:hover, .mobile-on .desktop-nav ul li a.active {background: rgba(255,255,255, .03); color: #ddd;} .mobile-on .desktop-nav ul li a:focus {outline-offset: -2px !important;} /* Menu sub */

.mobile-on .mn-has-sub > .fa {display: block; width: 18px; height: 18px; font-size: 14px; line-height: 16px; position: absolute; top: 50%; right: 10px; margin-top: -8px; text-align: center; border: 1px solid rgba(255,255,255, .1); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;} .mobile-on .js-opened > .mn-has-sub > .fa {border-color: rgba(255,255,255, .4); line-height: 14px;} .mobile-on .inner-nav li {margin: 0 !important;} .mobile-on .mn-sub {display: none; opacity: 0; position: relative; left: 0 !important; right: 0; top: 0; bottom: 0; border-left: none !important; border-right: none !important; border-top: none ; z-index: 10;} .mobile-on .mn-sub li {padding-left: 10px;} .inner-nav li.js-opened .mn-sub {opacity: 1;} .mobile-nav {display: none; float: right; vertical-align: middle; font-size: 11px; font-weight: 400; text-transform: uppercase; border-left: 1px solid rgba(0,0,0, .05); border-right: 1px solid rgba(0,0,0, .05); cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -webkit-transition-property: background, color, height, line-height; -moz-transition-property: background, color, height, line-height; -o-transition-property: background, color, height, line-height; transition-property:  background, color, height, line-height;} .mobile-nav:hover, .mobile-nav.active {background: #fff; color: #777;} .mobile-nav:active {-webkit-box-shadow: 0 0 35px rgba(0,0,0,.05) inset; -moz-box-shadow: 0 0 35px rgba(0,0,0,.05) inset; box-shadow: 0 0 35px rgba(0,0,0,.05) inset;} .no-js .mobile-nav {width: 55px; height: 55px;} .mobile-on .mobile-nav {display: table;} .mobile-nav .fa {height: 100%; display: table-cell; vertical-align: middle; text-align: center; font-size: 21px;} /* Menu sub multi */

.mobile-on .mn-has-multi {width: auto; padding: 0; text-align: left; white-space: normal;} .mobile-on .mn-sub {width: 100%; float: none; position: relative; overflow-x: hidden;} /*
 * Dark panel style
 */

.main-nav.dark {background-color: rgba(10,10,10, .95); -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow:  none;} .main-nav.dark .inner-nav ul > li > a {color: rgba(255,255,255, .7);} .main-nav.dark .inner-nav ul > li > a:hover, .main-nav.dark .inner-nav ul > li > a.active {color: #fff;} .main-nav.dark .mobile-nav {background-color: transparent; border-color: transparent; color: rgba(255,255,255, .9);} .main-nav.dark .mobile-nav:hover, .main-nav.dark .mobile-nav.active {color: #fff;} .main-nav.mobile-on.dark .inner-nav {border-top: 1px solid rgba(100,100,100, .4);} .main-nav.dark .logo, .main-nav.dark a.logo:hover {font-size: 18px; font-weight: 800; text-transform: uppercase; text-decoration: none; color: rgba(255,255,255, .9);} .main-nav.dark .mn-sub {-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow:  none;} .main-nav.dark .mn-soc-link {border: 1px solid rgba(255,255,255, .2);} .main-nav.dark .mn-soc-link:hover {border: 1px solid rgba(255,255,255, .3);} /*
 * Transparent panel style
 */

.main-nav.transparent {background: transparent !important;} .main-nav.js-transparent {-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} /* 
 * Centered menu 
 */

.mn-centered {text-align: center;} .mn-centered .inner-nav {float: none;} .mn-centered .inner-nav > ul {float: none; display: inline-block; margin-left: auto; margin-right: auto;} .mn-centered .inner-nav > ul > li:first-child {margin-left: 0;} .mn-centered .mobile-nav {float: none; margin-left: auto; margin-right: auto;} /* 
 * Aligned left menu 
 */

.mn-align-left{} .mn-align-left .inner-nav {float: none; width: 100%;} .mn-align-left .inner-nav > ul {float: none; margin-left: auto; margin-right: auto;} .mn-align-left .inner-nav > ul > li:first-child {margin-left: 0;} .mn-align-left .mobile-nav {float: none; margin-left: auto; margin-right: auto;} /*
 * Menu social links
 */

.mn-soc-link {width: 34px; height: 34px; line-height: 33px; text-align: center; font-size: 12px; display: inline-block; border: 1px solid rgba(0,0,0, .1); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .mn-soc-link:hover {border: 1px solid rgba(0,0,0, .25);} .main-nav .tooltip {font-size: 12px; text-transform: none; letter-spacing: 0;} /* ==============================
   Fullscreen menu ============================== */
 
 .fm-logo-wrap {position: absolute; top: 30px; left: 30px; height: 54px; z-index: 1030;} .fm-logo-wrap .logo {display: block; max-width: 200px; position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fm-button {display: block; position: fixed; top: 30px; right: 30px; width: 54px; height: 54px; background: #111; opacity: .85; text-indent: -12345px; z-index: 1030; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fm-button:hover {opacity: 1;} .fm-button span {display: block; width: 22px; height: 2px; background: #fff; position: absolute; top: 50%; left: 50%; margin: -1px 0 0 -11px; -webkit-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fm-button span:before, .fm-button span:after {content: ""; display: block; width: 100%; height: 2px; background: #fff; position: absolute; top: -6px; left: 0; -webkit-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -webkit-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -moz-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -moz-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -o-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -o-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -ms-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -ms-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s;} .fm-button span:after {top: auto; bottom: -6px;} /* Active menu button */

.fm-button.active {background: #222; z-index: 2001;} .fm-button.active span {background: transparent;} .fm-button.active span:before {top: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .fm-button.active span:after {bottom: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg);} /* Menu wrapper */

.fm-wrapper {display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; padding: 50px 30px; overflow-x: hidden; overflow-y: auto; background: rgba(10,10,10, .97); z-index: 2000; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} .fm-wrapper-sub {display: table; width: 100%; height: 100%; opacity: 0; -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -o-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.1s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fm-wrapper-sub.js-active {opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -o-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);} .fm-wrapper-sub-sub {display: table-cell; text-align: center; vertical-align: middle;} .fm-menu-links, .fm-menu-links ul {margin: 0; padding: 10px 0; line-height: 1.3; text-align: center;} .fm-menu-links ul.fm-sub {padding: 0;} .fm-menu-links a {display: block; position: relative; margin: 0; padding: 15px 20px; color: #999; font-size: 17px; letter-spacing: 2px; font-weight: 400; text-transform: uppercase; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: rgba(255,255,255, .1); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); z-index: 11;} .no-touch .fm-menu-links a:hover, .fm-menu-links a:active, .fm-menu-links li.js-opened > a {color: #d5d5d5; text-decoration: none;} .fm-menu-links li {margin: 0; padding: 0; position: relative;} .fm-menu-links li > a:active, .fm-menu-links li.active > a, .fm-menu-links li a.active {color: #f5f5f5;} .fm-menu-links li.js-opened:before {display: none;} .no-touch .fm-menu-links li.js-opened > a:hover, .fm-menu-links li.js-opened > a:active {color: #fff;} .fm-has-sub{} .fm-has-sub .fa {font-size: 14px;} .js-opened > .fm-has-sub > .fa {color: #fff;} .fm-sub {display: none; opacity: 0; position: relative;} .fm-sub > li > a {padding-left: 20px; padding-right: 20px; padding-top: 5px; padding-bottom: 5px; font-size: 13px; font-weight: 400;} .fm-menu-links li.js-opened .fm-sub {opacity: 1;} .fm-search {width: 320px;} .fm-search input.search-field {background: transparent; color: #555; text-align: center; border: none; border-bottom: 1px solid rgba(255,255,255, .2);} .fm-search input.search-field:hover {border: none; border-bottom: 1px solid rgba(255,255,255, .4);} .fm-search input.search-field:focus {color: #999; border-color: rgba(255,255,255, .7);} .fm-search .search-button:hover {color: #fff;} /* Social links */

.fm-social-links {padding: 10px; font-size: 14px; text-align: center;} .fm-social-links > a {display: inline-block; margin: 0 2px; width: 34px; height: 34px; line-height: 34px; border: 1px solid rgba(255,255,255, .15); text-align: center; text-decoration: none; color: #555; -webkir-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fm-social-links > a:hover {border-color: rgba(255,255,255, .3); color: #999;} /* ==============================
   Sections styles ============================== */

/*
 * Common
 */

.page-section, .small-section {width: 100%; display: block; position: relative; overflow: hidden; background-attachment: fixed; background-repeat: no-repeat; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 140px 0;} .small-section {padding: 70px 0;} .small-title {padding: 0; margin: 0 0 30px 0; text-transform: uppercase; font-size: 18px; font-weight: 300; letter-spacing: 0.3em;} .section-icon {margin-bottom: 7px; text-align: center; font-size: 32px;} .small-title .serif {text-transform: none; font-weight: 400;} .small-title.white {color: #fff;} .bg-scroll {background-attachment: scroll !important;} .bg-pattern {background-repeat: repeat; background-size: auto;} .bg-pattern-over:before, .bg-pattern-over .YTPOverlay:after {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: repeat; background-size: auto; background-image: url(/art_theme/images/pattern-bg-2.png);} .bg-gray {background-color: #f4f4f4;} .bg-gray-lighter {background-color: #f8f8f8;} .bg-dark, .bg-dark-lighter, .bg-dark-alfa-30, .bg-dark-alfa-50, .bg-dark-alfa-70, .bg-dark-alfa-90, .bg-dark-alfa, .bg-color, .bg-color-lighter, .bg-color-alfa-30, .bg-color-alfa-50, .bg-color-alfa-70, .bg-color-alfa-90, .bg-color-alfa {color: #fff;} .bg-dark a, .bg-dark-lighter a, .bg-dark-alfa-30 a, .bg-dark-alfa-50 a, .bg-dark-alfa-70 a, .bg-dark-alfa-90 a, .bg-dark-alfa a, .bg-color a, .bg-colorlighter a, .bg-color-alfa-30 a, .bg-color-alfa-50 a, .bg-color-alfa-70 a, .bg-color-alfa-90 a, .bg-color-alfa a {color: rgba(255,255,255, .8); padding-bottom: 3px; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .bg-dark a:hover, .bg-dark-lighter a:hover, .bg-dark-alfa-30 a:hover, .bg-dark-alfa-50 a:hover, .bg-dark-alfa-70 a:hover, .bg-dark-alfa-90 a:hover, .bg-dark-alfa a:hover, .bg-color a:hover, .bg-color-lighter a:hover, .bg-color-alfa-30 a:hover, .bg-color-alfa-50 a:hover, .bg-color-alfa-70 a:hover, .bg-color-alfa-90 a:hover, .bg-color-alfa a:hover {color: rgba(255,255,255, 1); text-decoration: none;} .bg-color .text, .bg-color-lighter .text, .bg-color-alfa-30 .text, .bg-color-alfa-50 .text, .bg-color-alfa-70 .text, .bg-color-alfa-90 .text, .bg-color-alfa .text, .bg-color .section-text, .bg-color-lighter .section-text, .bg-color-alfa-30 .section-text, .bg-color-alfa-50 .section-text, .bg-color-alfa-70 .section-text, .bg-color-alfa-90 .section-text, .bg-color-alfa .section-text {color: rgba(255,255,255, .75);} .bg-color .white, .bg-color-lighter .white, .bg-color-alfa-30 .white, .bg-color-alfa-50 .white, .bg-color-alfa-70 .white, .bg-color-alfa-90 .white, .bg-color-alfa .white {color: #fff;} .bg-dark {background-color: #111;} .bg-dark-lighter {background-color: #252525;} .bg-dark-alfa:before, .bg-dark-alfa .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(17,17,17, .97);} .bg-dark-alfa-30:before, .bg-dark-alfa-30 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(34,34,34, .3);} .bg-dark-alfa-50:before, .bg-dark-alfa-50 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(34,34,34, .5);} .bg-dark-alfa-70:before, .bg-dark-alfa-70 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(17,17,17, .7);} .bg-dark-alfa-90:before, .bg-dark-alfa-90 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(3,3,3, .9);} .bg-light-alfa:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(252,252,252, .97);} .bg-light-alfa-30:before, .bg-light-alfa-30 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(252,252,252, .30);} .bg-light-alfa-50:before, .bg-light-alfa-50 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(252,252,252, .50);} .bg-light-alfa-70:before, .bg-light-alfa-70 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(252,252,252, .7);} .bg-light-alfa-90:before, .bg-light-alfa-90 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(252,252,252, .9);} .bg-color {background-color: #e41919;} .bg-color-alfa:before, .bg-color-alfa .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #e41919; opacity: .97;} .bg-color-alfa-30:before, .bg-color-alfa-30 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #e41919; opacity: .3;} .bg-color-alfa-50:before, .bg-color-alfa-50 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #e41919; opacity: .5;} .bg-color-alfa-70:before, .bg-color-alfa-70 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #e41919; opacity: .7;} .bg-color-alfa-90:before, .bg-color-alfa-90 .YTPOverlay:before {content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #e41919; opacity: .9;} .bg-orange {background-color: #f47631 !important;} .bg-yellow {background-color: #ffce02 !important;} .bg-cyan {background-color: #27c5c3 !important;} .bg-green {background-color: #58bf44 !important;} .bg-blue {background-color: #43a5de !important;} .bg-purple {background-color: #375acc !important;} .bg-red {background-color: #e13939 !important;} .section-title {margin-bottom: 15px; font-size: 18px; font-weight: 400; text-transform: uppercase; text-align: center; letter-spacing: 0.5em; line-height: 1.4;} .section-more {margin-top: 7px; color: #999; font-size: 11px; font-weight: 400; letter-spacing: 0.4em; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .section-more:hover {text-decoration: none; color: #000;} .section-more .fa {font-size: 12px;} .section-heading {margin-bottom: 15px; font-size: 24px; font-weight: 400; text-transform: uppercase; text-align: center; letter-spacing: 0.5em; line-height: 1.3;} .section-line {width: 55px; height: 1px; margin: 30px auto; background: #111;} .section-text {font-size: 15px; font-weight: 300; color: #777; line-height: 1.7;} .section-text blockquote {margin-top: -5px;} .section-bot-image {margin: 140px 0 -140px; text-align: center; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0);} .image-fullwidth img {width: 100%;} /* Breadcrumbs */

.mod-breadcrumbs {margin-top: -5px; font-size: 11px; font-weight: 400; letter-spacing: 0.4em; text-decoration: none; text-transform: uppercase; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .mod-breadcrumbs span {opacity: .65;} .mod-breadcrumbs a {text-decoration: none;} .mod-breadcrumbs a:hover {text-decoration: none;} .mod-breadcrumbs .fa {font-size: 12px;} .mod-breadcrumbs-mini {text-align: left;} .home-bot-image {width: 100%; position: absolute; bottom:0; left: 0; text-align: center;} .fixed-height-large, .fixed-height-medium, .fixed-height-small {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .fixed-height-large {min-height: 800px;} .fixed-height-medium {min-height: 700px;} .fixed-height-small {min-height: 600px;} /*
 * Split section
 */

.split-section {width: 100%; display: block; position: relative; overflow: hidden; background-attachment: fixed; background-repeat: no-repeat; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .split-section-headings {width: 50%; position: relative; overflow: hidden; text-align: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .ssh-table {width: 100%; min-height: 500px; display: table;} .ssh-cell {display: table-cell; padding-left: 10px; padding-right: 10px; vertical-align: middle; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .split-section-content {width: 50%; position: relative; overflow: hidden; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .split-section-wrapper {padding: 0 80px;} /* ==============================
   Alternative services ============================== */

.alt-services-image {text-align: center;} .alt-services-image > img {display: block; width: 100%;} .alt-service-item {margin: 0; position: relative; padding-left: 55px; padding-top: 3px; font-size: 13px; font-weight: 300; color: #777; -webkit-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg); -moz-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg); -o-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg); -ms-transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg); transform: perspective(500px) rotateX(0deg) rotateY(0deg) rotateZ(0deg); -webkit-transition: all 0.3s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.3s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.3s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.3s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.3s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .alt-service-icon {width: 40px; height: 40px; position: absolute; top: 0; left: 0; line-height: 40px; text-align: center; font-size: 28px; color: #111; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .alt-services-title {margin: 0 0 10px 0; padding: 0; font-size: 15px; font-weight: 400; color: #111;} /* ==============================
   Team ============================== */

.team-grid{} .team-item{} .team-item-image {position: relative; overflow: hidden;} .team-item-image img {width: 100%;} .team-item-image:after {content: " "; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: transparent; z-index: 1; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .team-item-detail {opacity: 0; width: 100%; position: absolute; top: 50%; left: 0; padding: 20px 23px 55px; font-size: 14px; font-weight: 300; color: #777; text-align: center; z-index: 2; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .team-item-descr {color: #777; text-align:center; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .team-item-name {margin-top: 23px; font-size: 15px; text-transform: uppercase; letter-spacing: 0.4em;} .team-item-role {margin-top: 4px; font-size: 12px; text-transform: uppercase; letter-spacing: 0.4em; color: #aaa;} .team-social-links {font-size: 14px; cursor: pointer;} .team-social-links a {display: inline-block; padding: 3px 7px; color: rgba(0,0,0, .4); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} /* Hover state */
.no-mobile .team-item:hover .team-item-image:after {background: rgba(255,255,255, .93);} .no-mobile .team-item:hover .team-item-detail {opacity: 1;} .no-mobile .team-item:hover .team-item-descr {color: #111;} .no-mobile .team-social-links a:hover {color: rgba(0,0,0, .75);} /* Mobile touch */
.team-item.js-active .team-item-image:after {background: rgba(255,255,255, .93);} .team-item.js-active .team-item-detail {opacity: 1;} .team-item.js-active .team-item-descr {color: #111;} .team-item.js-active .team-social-links a:hover {color: rgba(0,0,0, .75);} /* ==============================
   Features ============================== */

.features-item {padding: 15px; text-align: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .features-icon {font-size: 48px; line-height: 1.3; color: rgba(255,255,255, .9);} .features-title {margin-bottom: 3px; font-size: 18px; font-weight: 400; text-transform: uppercase; color: rgba(255,255,255, .9);} .features-descr {font-size: 15px; font-weight: 300; color: rgba(255,255,255, .75);} .features-icon.black {color: rgba(0,0,0, .9);} .features-title.black {color: rgba(0,0,0, .9);} .features-descr.black {color: rgba(0,0,0, .75);} /* ==============================
   Alt features ============================== */

.alt-features-grid {margin-top: -70px;} .alt-features-item {margin-top: 70px;} .alt-features-icon {padding-top: 10px; font-size: 48px; line-height: 1.3; color: #111;} .alt-features-icon img {width: 100%;} .alt-features-title {margin: 21px 0; font-size: 14px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.4em;} .alt-features-descr {color: #777; font-size: 14px; font-weight: 300; line-height: 1.86} /* ==============================
   Benefits ============================== */

.benefits-grid {margin: 0 0 -40px -20px; text-align: center; vertical-align: top;} .benefit-item {display: inline-block; width: 264px; margin: 0 0 40px 20px; padding: 15px; position: relative; overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; vertical-align: top; cursor: default;} .benefit-number {width: 100%; position: absolute; top: 0; left: -50px; font-size: 120px; font-weight: 700; text-align: center; line-height: 1; color: rgba(0,0,0, .025); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .benefit-icon {position: relative; margin-bottom: 6px; font-size: 32px;} .benefit-title {position: relative; margin: 0 0 17px 0; padding: 0; font-size: 14px; text-transform: uppercase;} .benefits-descr {position: relative; font-size: 13px; font-weight: 300; color: #777;} .benefit-item:after {content: " "; display: block; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; background: rgba(0,0,0, .015); opacity: 0; -webkit-transition: all 0.37s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -o-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5);} .benefit-item:hover:after {opacity: 1; -webkit-transform: none; -moz-transform: none; -o-transform: none; -ms-transform: none; transform: none;} .benefit-item:hover .benefit-number {color: rgba(0,0,0, .035); -webkit-transform: scale(0.75); -moz-transform: scale(0.75); -o-transform: scale(0.75); -ms-transform: scale(0.75); transform: scale(0.75);} /* ==============================
   Counters ============================== */

.count-wrapper {padding: 40px 20px; border: 1px solid rgba(0,0,0, .09);} .count-number {font-size: 48px; font-weight: 300; line-height: 1.3; text-align: center;} .count-descr {color: #999; font-size: 11px; text-align:center;} .count-descr .fa {font-size: 14px;} .count-title {margin-top: -1px; font-size: 13px;} .count-separator {height: 30px; clear: both; float: none; overflow: hidden;} /* ==============================
   Portfolio ============================== */


/*
 * Works filter
 */

.works-filter {list-style: none; padding: 0; margin: 0 0 45px 0; font-size: 13px; text-transform: uppercase; text-align: center; letter-spacing: 0.4em; color: #555; cursor: default;} .works-filter a {display: inline-block; margin: 0 27px; color: #999; text-decoration: none; -webkit-transition: all 0.37s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); cursor: pointer;} .works-filter a:hover {color: #111; text-decoration: none;} .works-filter a.active {color: #111; cursor: default;} .works-filter a.active:hover {color: #111;} /*
 * Works grid 
 */

.works-grid {list-style: none; margin: 0; padding: 0;} .work-item {width: 25%; float: left; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .work-grid-2 .work-item {width: 50%;} .work-grid-3 .work-item {width: 33.333%;} .container .work-grid-3 .work-item {width: 33.2%;} .work-grid-5 .work-item {width: 20%;} .works-grid.work-grid-gut {margin: 0 0 0 -10px;} .works-grid.work-grid-gut .work-item {padding: 0 0 10px 10px;} .work-item > a {display: block; padding: 0 0 84px 0; position: relative; -moz-box-sizing: border-box; box-sizing: border-box; text-decoration: none;} .work-item a, .work-item a:hover {color: #111; border: none;} .work-img {position: relative; overflow: hidden; -webkit-transform: translateZ(0); transform: translateZ(0);} .work-img img {width: 100%; display: block; overflow: hidden;} .work-intro {width: 100%; height: 100%; padding: 20px 20px 0 20px; -webkit-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: absolute; text-align: center; overflow: hidden;} .work-title {margin: 0 0 8px 0; padding: 20px; font-size: 16px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; line-height: 1.2;} .work-descr {font-size: 14px; text-align: center; text-transform: uppercase; color: #aaa; line-height: 1.2;} .works-grid.hide-titles .work-item > a {overflow: hidden; padding: 0;} .works-grid.hide-titles .work-item .work-intro {opacity: 0; bottom: -94px;} .works-grid.hide-titles .work-item:hover .work-intro {opacity: 1;} /* Work item hover state */

.work-intro {-webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .work-item:hover .work-intro {/*bottom: auto;*/
    /*top: 50%;*/
    color: #fff; -webkit-transform: translateY(-99px); -moz-transform: translateY(-99px); transform: translateY(-99px); z-index: 3;} .work-item:hover .work-title {color: #ccc;} .work-item:hover .work-descr {color: #999;} .work-item .work-img:after {content: " "; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(250,250,250, 0); -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .work-item:hover .work-img:after {background: rgba(20,20,20, .85);} .works-grid.hover-color .work-item:hover .work-intro, .works-grid.hover-color .work-item:hover .work-title, .works-grid.hover-color .work-item:hover .work-descr {color: #fff;} .works-grid.hover-color .work-item:hover .work-img:after {background: #e41919; opacity: .73;} .works-grid.hover-white .work-item:hover .work-intro, .works-grid.hover-white .work-item:hover .work-title, .works-grid.hover-white .work-item:hover .work-descr {color: #000;} .works-grid.hover-white .work-item:hover .work-img:after {background: rgba(250,250,250, .9);} .work-item .work-img > img {-webkit-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .work-item:hover .work-img > img {-webkit-transform: scale(1.05); -moz-transform: scale(1.05); -o-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);} /*
 * Works full view
 */

.work-full {display: none; width: 100%; height: 100%; background: #fff; z-index: 10000;} .work-full-load {padding-top: 60px;} .work-loader {position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: #fff; z-index: 10001;} .work-loader:after {display: block; content: " "; width: 16px; height: 16px; position: absolute; left: 50%; top: 50%; margin: -8px 0 0 -8px; background: url(/art_theme/images/loader.gif) no-repeat;} /* Work navigation */

.work-navigation {width: 100%; background: #fff; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; z-index: 99;} .work-navigation .fa {font-size: 12px; vertical-align: middle;} .work-navigation .fa-times {font-size: 16px; margin-top: -2px;} .work-navigation a {display: block; float: left; width: 33.33333%; overflow: hidden; vertical-align: middle; text-decoration: none; white-space: nowrap; cursor: default;} .work-navigation a, .work-navigation a:visited {color: #555;} .work-navigation a:hover {color: #111;} .work-navigation a span {display: inline-block; height: 60px; line-height: 59px; padding: 0 4%; background: #fff; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out;} .work-navigation span:hover {background: #f7f7f7;} .work-back-link {margin: 20px 0 0; display: block; background: #fff; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: #151515;} .work-prev {text-align: left;} .work-all {text-align: center;} .work-next {text-align: right;} .work-container {padding: 50px 0;} .work-full-title {margin: 0 0 10px 0; padding: 0; font-size: 24px; font-weight: 700; text-transform: uppercase; text-align: center; letter-spacing: 1px;} .work-full-media {margin-top: 30px;} .work-full-media img {max-width: 100%; height: auto;} .work-full-text {text-align: left; font-size: 13px; color: #777;} .work-full-text h6 {margin-top: 5px;} .work-detail {font-weight: 400;} .work-detail p:last-child {margin-bottom: 0;} .work-full-detail {font-size: 11px; color: #777; letter-spacing: 1px; text-transform: uppercase;} .work-full-detail p {padding: 4px 0; margin: 0; border-top: 1px solid rgba(0,0,0, .05);} .work-full-detail p:last-child {border-bottom: 1px solid rgba(0,0,0, .05);} .work-full-detail p strong {width: 100px; display: inline-block;} .work-full-action {margin-top: 30px; padding-top: 30px; border-top: 1px solid #eaeaea; text-align: center;} /* ==============================
   Banner section ============================== */

.banner-section {overflow: visible; border-bottom: 1px solid transparent;} .banner-heading {margin-top: 0; margin-bottom: 20px; font-size: 18px; font-weight: 300; letter-spacing: 0.3em; text-transform: uppercase; color: rgba(255,255,255, 0.9);} .banner-decription {margin-bottom: 35px; font-size: 15px; font-weight: 300; color: rgba(255,255,255, .7);} .banner-image {margin: -40px 0 0 0; text-align: right;} .banner-image img{} /* ==============================
   Testimonial ============================== */

.testimonial {margin: 0; padding: 0; background: none; border: none; text-align: center; font-family: "Josefin Sans", arial, sans-serif; font-size: 18px; font-style: normal; font-weight: 300; letter-spacing: 0; opacity: .85;} .testimonial p {font-size: 18px;} .testimonial-author{} /*
 * Logotypes
 */

.logo-item {height: 80px; text-align: center; opacity: .75; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .logo-item:hover {opacity: 1;} .logo-item img {position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);} /* ==============================
   Post previews ============================== */

.post-grid{} .post-prev-img {margin-bottom: 23px; position: relative;} .post-prev-img a {-webkit-transition: all 0.2s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.2s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.2s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.2s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.2s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .post-prev-img a:hover {opacity: .85;} .post-prev-img img {width: 100%;} .post-prev-title {margin-bottom: 6px; font-size: 15px; text-transform: uppercase; letter-spacing: 0.2em;} .post-prev-title a {color: #777; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .post-prev-title a:hover {color: #111;} .post-prev-info, .post-prev-info a {margin-bottom: 15px; font-size: 11px; text-decoration: none; color: #aaa; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .post-prev-info a:hover {color: #111;} .post-prev-text {margin-bottom: 22px; color: #777; font-size: 15px; font-weight: 300; line-height: 1.75;} /* ==============================
   Newsletter ============================== */

.newsletter-label {margin-bottom: 15px; font-size: 16px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.3em;} .form input.newsletter-field {max-width: 293px;} .form input.newsletter-field:hover{} .form input.newsletter-field:focus{} .form input.newsletter-field::-webkit-input-placeholder {color: #777;} .form input.newsletter-field:focus::-webkit-input-placeholder {color: #111;} .form input.newsletter-field:-moz-placeholder {color: #777;} .form input.newsletter-field:focus:-moz-placeholder {color: #111;} .form input.newsletter-field::-moz-placeholder {color: #777;} .form input.newsletter-field:focus::-moz-placeholder {color: #111;} .form input.newsletter-field:-ms-input-placeholder {color: #777;} .form input.newsletter-field:focus:-ms-input-placeholder {color: #111;} /* ==============================
   Contact section ============================== */

.contact-item {position: relative; padding-left: 44px; color: #444; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .contact-item a {color: #444; text-decoration: none;} .contact-item a:hover {color: #000; text-decoration: none;} .ci-icon {width: 23px; height: 23px; position: absolute; top: 10px; left: 3px; color: #fff; text-align: center; line-height: 23px;} .ci-icon:before {content: " "; width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; background: #111; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .ci-icon i, .ci-icon span {position: relative;} .ci-title {margin-bottom: 1px; color: #777; font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.3em;} .ci-text {font-size: 15px; font-weight: 300;} /*
 * Contact form
 */

.cf-left-col {width: 49.4%; float: left; margin-right: 1.2%;} .cf-right-col {width: 49.4%; float: left;} .contact-form .form-group {margin-bottom: 10px;} /* ==============================
   Google maps  ============================== */

.google-map {position: relative; background: #111;} .google-map > iframe {display: block; width:100%; height: 410px; position: relative; background-color: #111 !important; z-index: 1;} .gm-style-cc {display: none !important;} .gm-style-iw div {color: #777;} .map-section {width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; padding: 0 !important; background: rgba(17,17,17, .91); z-index: 2; cursor: pointer; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .map-section:hover {background: rgba(17,17,17, .90);} .map-toggle {width: 200px; height: 100px; position: absolute; top: 50%; left: 50%; margin: -50px 0 0 -100px; color: #fff; text-align: center;} .mt-icon {width: 27px; height: 27px; line-height: 27px; margin: 6px auto 25px; position: relative; color: #111; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .mt-icon:before {content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .mt-icon i, .mt-icon span {position: relative;} .mt-text {margin-left: 12px; font-size: 16px; text-transform: uppercase; letter-spacing: 0.3em; color: rgba(255,255,255, .75);} .mt-close {display: none;} /* Map opened */

.map-section.js-active {height: 25px; background: rgba(17,17,17, .75);} .map-section.js-active .mt-text {font-size: 14px;} .map-section.js-active:hover {background: rgba(17,17,17, .85);} .map-section.js-active .mt-icon {opacity: 0;} .map-section.js-active .mt-text {position: relative; top: -20px;} /* ==============================
   Footer ============================== */

.footer {text-align: center; font-size: 12px;} .footer a {color: #888; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .footer a:hover {color: #111; text-decoration: underline;} .footer-copy {margin-bottom: 5px; text-transform: uppercase; letter-spacing: 0.5em;} .footer-made {font-size: 11px; color: #999;} .footer-social-links {font-size: 14px;} .footer-social-links a {width: 25px; height: 25px; line-height: 25px !important; position: relative; margin: 0 6px; text-align: center; display: inline-block; color: #111; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .footer-social-links a i, .footer-social-links a span[class^=icon] {position: relative; top: 0; left: 0;} .footer-social-links a:before {content: ""; display: inline-block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 1px solid #111; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .footer-social-links a:hover {color: #fff;} .footer-social-links a:hover:before {background: #111;} a.link-to-top {position: absolute; bottom: 20px; right: 20px; width: 40px; height: 40px; line-height: 40px; text-align: center; color: rgba(0,0,0, .2); font-size: 48px;} /* ==============================
   Blog ============================== */

.blog-item {margin-bottom: 80px; position: relative;} .blog-item-date {width: 100px; padding: 10px; position: absolute; top: 0px; left: -130px; font-size: 12px; font-weight: 300; letter-spacing: 1px; line-height: 1.2; text-transform: uppercase; text-align: center; color: #999; border-right: 1px solid #eee;} .date-num {display: block; margin-bottom: 3px; font-size: 18px; font-weight: 400; color: #555;} .blog-media {margin-bottom: 30px;} .blog-media img, .blog-media .video, .blog-media iframe {width: 100%;} .blog-item-title {margin: 0 0 .5em 0; padding: 0; font-size: 24px; font-weight: 400; text-transform: uppercase;} .blog-item-title a {color: #111; text-decoration: none;} .blog-item-title a:hover {color: #777; text-decoration: none;} .blog-item-data {margin-bottom: 30px; text-transform: uppercase; font-size: 11px; letter-spacing: 1px; color: #aaa;} .separator {margin: 0 5px;} .blog-item-data a {color: #aaa; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-item-data a:hover {color: #000; text-decoration: none;} .blog-post-data {margin-top: 10px; text-transform: uppercase; font-size: 11px; letter-spacing: 1px; color: #aaa;} .blog-item-body {font-size: 16px; font-weight: 300; color: #5f5f5f; line-height: 1.8;} .blog-item-body h1, .blog-item-body h2, .blog-item-body h3, .blog-item-body h4, .blog-item-body h5, .blog-item-body h6 {margin: 1.3em 0 0.5em 0;} .blog-item-more {border: 1px solid #eaeaea; padding: 5px 10px; font-size: 12px; font-weight: 400; text-transform: uppercase; color: #777; letter-spacing: 1px; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-item-more:hover {text-decoration: none; border-color: #111;} a.blog-item-more {color: #777; text-decoration: none;} a.blog-item-more:hover {color: #111;} .blog-item-q {background: none; border: none; padding: 0; margin: 1em 0;} .blog-item-q p {position: relative; background: #f8f8f8; padding: 17px 20px; font-size: 18px; font-weight: 400; font-style: normal; letter-spacing: 0;} .blog-item-q p a {color: #555; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-item-q:hover a, .blog-item-q p a:hover {text-decoration: none; color: #777;} .blog-item-q p:before, .blog-item-q p:after {-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-item-q p:before {content: '"'; position: absolute; top: 10px; left: 10px;} .blog-item-q p:after {content: '"';} .blog-item-q p:hover:before, .blog-item-q p:hover:after {color: #777;} .blog-page-title {margin-bottom: 30px; padding-bottom: 10px; border-bottom: 1px solid #eee;} /*
 * Pagination
 */

.pagination {font-size: 13px; font-family: "Josefin Sans", arial, sans-serif;} .pagination a {display: inline-block; min-width: 30px; -moz-box-sizing: border-box; box-sizing: border-box; padding: 7px 14px; border: 1px solid #eaeaea; color: #999; font-size: 13px; font-weight: 400; text-transform: uppercase; text-align: center; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .pagination .fa {margin-top: 1px; font-size: 16px;} .pagination a:hover {text-decoration: none; border-color: #bbb; color: #444;} .pagination a.active, .pagination a.active:hover {border-color: #bbb; color: #444; cursor: default;} .pagination a.no-active, .pagination a.no-active:hover {border-color: #efefef; color: #bbb; cursor: default;} /*
 * Comments
 */
.comment-list{} .comment-item {padding-top: 30px !important; border-top: 1px dotted #e9e9e9; font-size: 14px; overflow: hidden;} .comment-item:first-child {padding-top: 0; border-top: none;} .media-body {overflow: hidden;} .comment-avatar {width: 50px; margin-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;} .comment-item-data {margin: 0 0 5px; text-transform: uppercase; font-family: "Josefin Sans", arial, sans-serif; font-size: 12px; color: #777;} .comment-item-data a {color: #777; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .comment-item-data a:hover {color: #000; text-decoration: none;} .comment-author {display: inline-block; margin-right: 20px; font-size: 11px; font-weight: 700;} .comment-author a {color: #999;} /*
 * Sidebar
 */

.sidebar {margin-top: 10px;} .widget {margin-bottom: 60px;} .widget .img-left {margin: 0 10px 10px 0;} .widget .img-right {margin: 0 0 10px 10px;} .widget-title {margin-bottom: 20px; padding-bottom: 5px; text-transform: uppercase; font-size: 14px; font-weight: 400; color: #777; border-bottom: 1px solid #ccc;} .widget-body {font-size: 13px; color: #777;} .widget-text {line-height: 1.7;} /* Search widget */

.search-wrap {position: relative;} .search-field {width: 100% !important; height: 40px !important; -moz-box-sizing: border-box; box-sizing: border-box;} .search-button {width: 42px; height: 40px; line-height: 38px; margin-top: -20px; position: absolute; top: 50%; right: 1px; overflow: hidden; background: transparent; border: none; outline: none; color: #999; font-size: 14px;} .search-button:hover {color: #111;} .search-button:hover + .search-field {border-color: #ccc;} /* Widget menu */

.widget-menu {font-size: 13px;} .widget-menu li {padding: 5px 0;} .widget-menu li a {color: #555; text-decoration: none; padding-bottom: 2px; border-bottom: 1px solid transparent; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .widget-menu li a:hover, .widget-menu li a.active {color: #999;} .widget-menu li small {font-size: 11px; color: #aaa;} /* Widget tags */

.tags{} .tags a {display: inline-block; margin: 0 2px 5px 0; padding: 5px 7px; border: 1px solid #e9e9e9; color: #777; font-size: 11px; font-weight: 400; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .tags a:hover {text-decoration: none; border-color: #333; color: #111;} /* Comments */
.widget-comments {color: #aaa;} .widget-comments li {padding: 12px 0; border-bottom: 1px dotted #eaeaea;} .widget-comments li a {color: #555; text-decoration: none; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .widget-comments li a:hover {color: #999;} /* Posts */
.widget-posts {color: #aaa;} .widget-posts li {font-size: 12px; padding: 12px 0; border-bottom: 1px dotted #eaeaea;} .widget-posts li a {font-size: 13px; display: block; color: #555; text-decoration: none; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .widget-posts li a:hover {color: #999;} .widget-posts-img {float: left; margin: 0 7px 0 0;} .widget-posts-descr {overflow: hidden;} /* ==============================
   Shop ============================== */
  
.shopping-cart-table{} .shopping-cart-table a {text-decoration: none;} table.shopping-cart-table tr th, table.shopping-cart-table tr td {vertical-align: middle;} /* ==============================
   Pricing ============================== */

.pricing-item {margin: 0 0 30px; position: relative; text-align: center;} .pricing-item-inner {border: 1px solid #eaeaea; vertical-align: middle; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .pricing-item-inner:hover {border-color: #aaa;} .main .pricing-item-inner {border-color: #aaa;} .pricing-wrap {position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 30px 20px; text-align: center; overflow: hidden;} .pricing-icon {padding-top: 10px; padding-bottom: 5px; position: relative; font-size: 32px; z-index: 1;} .pricing-title {position: relative; margin-bottom: 40px; font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; z-index: 1;} .pr-list {margin: 0 -20px 30px; padding: 0; color: #777; font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 2px;} .pr-list li {padding: 12px 20px; list-style: none; border-bottom: 1px solid #f1f1f1;} .pr-list li:first-child {border-top: 1px solid #f1f1f1;} .pricing-num {font-size: 40px; font-weight: 300; line-height: 1;} .pricing-num sup {font-family: "Josefin Sans", arial, sans-serif; font-size: 18px; font-weight: 400; position: relative; top: -20px; left: -3px; margin-left: -7px;} .pr-button {margin: 30px -20px 0; padding-top: 30px; border-top: 1px solid #f1f1f1;} .pr-per {color: #999; font-size: 12px;} /* ==============================
   Shortcodes ============================== */

.margin-block {margin-bottom: 30px;} /*
 * Owl Carousel
 */

.owl-carousel {overflow: hidden;} .owl-buttons {position: static;} .owl-prev, .owl-next {opacity: 0; display: block; position: absolute; top: 50%; margin-top: -50px; width: 105px; height: 105px; line-height: 105px; font-size: 16px; text-align: center; color: #111; z-index: 6; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .owl-prev {left: -50px;} .owl-next {right: -50px;} .owl-prev:before, .owl-next:before {content: ""; display: block; width: 66%; height: 66%; position: absolute; top: 17px; left: 0; background: #fff; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); -moz-box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .owl-next:before {left: auto; right: 0;} .owl-prev .fa, .owl-next .fa {position: relative;} .owl-prev:hover, .owl-next:hover {-webkit-transition: 0 none !important; -moz-transition: 0 none !important; -ms-transition: 0 none !important; -o-transition: 0 none !important; transition:0 none !important;} .owl-prev:hover:before, .owl-next:hover:before {opacity: 0.87;} .owl-prev:active:before, .owl-next:active:before {opacity: 0.6;} .owl-carousel:hover .owl-prev {opacity: 1; left: -35px;} .owl-carousel:hover .owl-next {opacity: 1; right: -35px;} .owl-carousel .owl-prev:focus {opacity: 1; left: -35px;} .owl-carousel .owl-next:focus {opacity: 1; right: -35px;} .owl-pagination {display: block; width: 100%; position: absolute; bottom: 30px; left: 0; text-align: center;} .owl-page {display: inline-block; padding: 6px 4px; position: relative;} .owl-page span {width: 6px; height: 6px; display: block; background: rgba(255,255,255, .7); position: relative; z-index: 1000 !important; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); -moz-box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); box-shadow: 1px 1px 0px rgba(0, 0, 0, .1); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .owl-page:hover span {background: rgba(255,255,255, 1);} .owl-page.active span {background: transparent; bordeR: 1px solid rgba(255,255,255, .8); -webkit-transform: scale(1.3333333); -moz-transform: scale(1.3333333); -o-transform: scale(1.3333333); -ms-transform: scale(1.3333333); transform: scale(1.3333333);} .item-carousel .owl-prev {left: -125px;} .item-carousel .owl-next {right: -125px;} .item-carousel.owl-carousel:hover .owl-prev, .item-carousel.owl-carousel .owl-prev:focus, .small-item-carousel.owl-carousel:hover .owl-prev, .small-item-carousel.owl-carousel .owl-prev:focus {opacity: 0; position: absolute !important; height: 1px; width: 1px; overflow: hidden;} .item-carousel.owl-carousel:hover .owl-next, .item-carousel.owl-carousel .owl-next:focus, .small-item-carousel.owl-carousel:hover .owl-next, .small-item-carousel.owl-carousel .owl-next:focus {opacity: 0; position: absolute !important; height: 1px; width: 1px; overflow: hidden;} .item-carousel {margin-bottom: -50px; padding-bottom: 50px;} .item-carousel .owl-pagination {bottom: 0;} .work-full-slider .owl-pagination, .content-slider .owl-pagination {bottom: 15px;} .single-carousel, .small-item-carousel {margin-bottom: 35px;} .single-carousel .owl-pagination, .small-item-carousel .owl-pagination {position: relative; left: 0; top: 35px; margin: 0;} .single-carousel.black .owl-page span, .small-item-carousel.black .owl-page span {background: rgba(0,0,0, .15); -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .single-carousel.black .owl-page:hover span, .small-item-carousel.black .owl-page:hover span {background: rgba(0,0,0, .4);} .single-carousel.black .owl-page.active span, .small-item-carousel.black .owl-page.active span {background: rgba(0,0,0, .4);} .single-carousel.black .owl-prev, .single-carousel.black .owl-next, .small-item-carousel.black .owl-prev, .small-item-carousel.black .owl-next {color: rgba(0,0,0, .2); text-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .single-carousel.black .owl-prev:hover, .single-carousel.black .owl-next:hover, .small-item-carousel.black .owl-prev:hover, .small-item-carousel.black .owl-next:hover {color: rgba(0,0,0, .35);} .single-carousel .owl-prev, .small-item-carousel .owl-prev {left: -125px;} .single-carousel .owl-next, .small-item-carousel .owl-next {right: -125px;} section:hover .single-carousel .owl-prev, section:hover .small-item-carousel .owl-prev {opacity: 1; left: -80px;} section:hover .single-carousel .owl-next, section:hover .small-item-carousel .owl-next {opacity: 1; right: -80px;} .black-arrows .owl-prev, .black-arrows .owl-next {color: #fff;} .black-arrows .owl-prev:before, .black-arrows .owl-next:before {background: rgba(0,0,0, 1);} /*
 * Tabs
 */

.tpl-tabs {border-color: #e5e5e5; font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 1px;} .tpl-tabs > li > a, .tpl-tabs > li > a:hover {text-decoration: none; color: #777; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important;} .tpl-tabs > li > a:hover {background-color: #f5f5f5;} .tpl-tabs li.active a {color: #000;} .tpl-tabs-cont {padding: 30px 0; color: #777; line-height: 1.8;} /*
 * Tabs minimal
 */

.tpl-minimal-tabs {display: inline-block; font-size: 12px; font-weight: 400; text-transform: uppercase; text-align: center; letter-spacing: 1px; border: none;} .tpl-minimal-tabs > li {display: inline-block; padding: 0 30px; background: none !important;} .tpl-minimal-tabs > li > a {padding: 6px 20px 5px; text-decoration: none; color: #000; background: none; border: 1px solid transparent; -webkit-border-radius: 20px !important; -moz-border-radius: 20px !important; border-radius: 20px !important;} .tpl-minimal-tabs > li > a:hover {background: none; border-color: #e9e9e9; color: #777;} .tpl-minimal-tabs li a.active, .tpl-minimal-tabs li a.active:hover {border: 1px solid #222 !important; background: none !important; color: #000; cursor: default;} /*
 * Tabs Alternative
 */

.tpl-alt-tabs {display: block; font-size: 14px; font-weight: 400; text-transform: uppercase; text-align: center; letter-spacing: 0.4em; border: none;} .tpl-alt-tabs > li {width: 215px; display: inline-block; vertical-align: top; float: none; padding: 0; background: none !important;} .tpl-alt-tabs > li > a {text-decoration: none; color: #a3a3a3; background: none !important; border: none !important; -webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940);} .tpl-alt-tabs > li > a:hover {background: none; color: #111;} .tpl-alt-tabs li.active a, .tpl-alt-tabs li.active a:hover, .tpl-alt-tabs li.active a:focus {cursor: default; color: #111;} .alt-tabs-icon {display: block; margin-bottom: 12px; font-size: 48px; letter-spacing: 0;} .tpl-minimal-tabs-cont{} /*
 * Alert messages
 */

.alert {margin: 0 auto 10px; border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;} .success {border-color: #a9e2c2; color: #36a367;} .info {border-color: #9ecdfc; color: #297ad3;} .notice {border-color: #f9ce75; color: #e9a00a;} .error {border-color: #ffbbbb; color: #e33131;} /*
 * Accordion
 */

.accordion > dt {margin-bottom: 10px; font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em;} .accordion > dt > a {display: block; position: relative; color: #777; text-decoration: none; padding: 14px 20px; border: 1px solid #e5e5e5; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .accordion > dt > a:hover {text-decoration: none; border-color: #ddd; background-color: #fcfcfc; color: #444;} .accordion > dt > a.active {color: #000; border-color: #ddd; background-color: #fcfcfc; cursor: default;} .accordion > dt > a:after {content: "\f107"; width: 15px; height: 15px; margin-top: -8px; position: absolute; top: 50%; right: 10px; font-family: 'FontAwesome'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; font-size: 15px; line-height: 15px; text-align: center; color: #999; -webkit-font-smoothing: antialiased; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .accordion > dt > a.active:after, .accordion > dt > a.active:hover:after {content: "\f106"; color: #111;} .accordion > dt > a:hover:after {color: #444;} .accordion > dd {margin-bottom: 10px; padding: 10px 20px 20px; font-size: 14px; line-height: 1.8; color: #777;} /*
 * Toggle
 */

.toggle > dt {margin-bottom: 10px; font-size: 13px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em;} .toggle > dt > a {display: block; position: relative; color: #777; text-decoration: none; padding: 14px 20px; border: 1px solid #e5e5e5; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .toggle > dt > a:hover {text-decoration: none; border-color: #ddd; background-color: #fcfcfc; color: #444;} .toggle > dt > a.active {color: #000; border-color: #ddd; background-color: #fcfcfc;} .toggle > dt > a:after {content: "\f107"; width: 15px; height: 15px; margin-top: -8px; position: absolute; top: 50%; right: 10px; font-family: 'FontAwesome'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; font-size: 15px; line-height: 15px; text-align: center; color: #999; -webkit-font-smoothing: antialiased; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .toggle > dt > a.active:after, .toggle > dt > a.active:hover:after {content: "\f106"; color: #111;} .toggle > dt > a:hover:after {color: #444;} .toggle > dd {margin-bottom: 10px; padding: 10px 20px 20px; font-size: 14px; line-height: 1.8; color: #777;} /*
 * Progress bars
 */

.tpl-progress {margin-top: 10px; margin-bottom: 50px; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; overflow: visible; height: 2px; background: #f0f0f0; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .tpl-progress .progress-bar {padding-top: 2px; position: relative; overflow: visible; background-color: #222; font-size: 11px; color: #000; text-align: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} .tpl-progress .progress-bar > div {position: relative; top: 10px;} .tpl-progress .progress-bar > span {display: inline-block; min-width: 24px; height: 24px; padding: 0 3px; position: absolute; top: 0px; right: -5px; text-align: center; line-height: 23px; letter-spacing: 0; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;} .progress-color .progress-bar {background-color: #e41919; color: #e41919;} .progress-color .progress-bar > span {background-color: #e41919; color: #fff;} /* Alt bar */
.tpl-progress-alt {height: 18px; line-height: 18px; margin-bottom: 20px; background: #f2f2f2; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;} .tpl-progress-alt .progress-bar {padding-left: 5px; padding-right: 5px; position: relative; overflow: visible; background-color: #222; font-size: 11px; text-transform: uppercase; letter-spacing: 2px; color: #fff; text-align: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} .highlight pre {border-color: #eaeaea; background: #fcfcfc; color: #555; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;} /*
 * Font icons examples
 */

.fa-examples {color: #555; margin-left: 1px;} .fa-examples > div {padding: 0; border: 1px solid #e5e5e5; margin: -1px 0 0 -1px; font-size: 13px;} .fa-examples > div:hover {background: #f0f0f0; color: #000;} .fa-examples > div > i {display: inline-block; margin-right: 5px; min-width: 40px; min-height: 40px; border-right: 1px solid #f1f1f1; line-height: 40px; text-align: center; font-size: 14px;} .fa-examples > div > .muted {margin-left: 5px; color: #999; font-size: 12px;} .fa-sm {width: 20px; font-size: 14px;} .et-examples {color: #555; margin-left: 1px; vertical-align: middle;} .et-examples .box1 {display: block; width: 33%; float: left; padding: 0; border: 1px solid #e5e5e5; margin: -1px 0 0 -1px; font-size: 13px;} 

@media only screen and (max-width: 1024px) {.et-examples .box1 {width: 50%;} } 
@media only screen and (max-width: 480px) {.et-examples .box1 {width: 100%;} } 

.et-examples .box1:hover {background: #f8f8f8; color: #111;} .et-examples .box1 > span {display: inline-block; margin-right: 5px; min-width: 70px; min-height: 70px; border-right: 1px solid #f1f1f1; line-height:70px; text-align: center; font-size: 32px;} /* ==============================
   Intro page ============================== */

.intro-image {width:100%;} .intro-label {position: absolute; top:7px; right: 10px; font-size: 17px; text-transform: uppercase; letter-spacing: 0.1em;} .label-new {background: #f32929; color: white; padding: 2px 3px; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;} .label-for-button {position: absolute; top: -5px; right: -5px;} .intro-label-round {width: 50px; height: 50px; position: absolute; top:-5px; right: -5px; color: rgba(255,255,255, .85); font-size: 11px; font-weight: 700; text-transform: uppercase; text-align: center; letter-spacing: 1px; line-height: 50px; background: #f32929; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;} .buy-button {display: inline-block; width: 50px; height: 50px; padding: 8px 0; position: fixed; bottom: 55px; right: 15px; color: #ffffff; text-align: center; text-decoration: none; line-height: 1.2; z-index: 100; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .buy-button:before {content: ""; display: block; width: 100%; height: 100%; position: absolute; top:0; left: 0; background: #58bf44; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;} .buy-button:hover, .buy-button:focus {color: #ffffff; text-decoration: none; -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2);} .buy-button i {position: relative; left: -1px;} .buy-button span {display: block; position: relative; margin-top: 1px; font-size: 11px; letter-spacing: 1px; font-weight: bold; text-transform: uppercase;} /* ==============================
   Special demos ============================== */

/*
 * Magazine
 */

.magazine-logo-text {margin-top: 0; position: relative; font-size: 25px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; line-height: 1.8;} .blog-posts-carousel-item {padding-bottom: 20px;} .blog-posts-carousel-item .post-prev-title, .blog-posts-carousel-item .post-prev-info {padding: 0 10px;} .blog-post-prev-small {color: #aaa; font-size: 12px; padding: 12px 0; border-top: 1px dotted #eaeaea;} .blog-post-prev-small a {font-size: 13px; display: block; color: #555; text-decoration: none; -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-post-prev-small a:hover {color: #999;} .blog-posts-carousel-alt li img {-webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-posts-carousel-alt li:hover img {-webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-transition: all 5s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 5s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 5s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 5s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 5s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-slide-info {width: 100%; padding: 30px 30px 30px 30px; position: absolute; bottom: 0; left: 0; text-transform: uppercase; text-align: center; font-size: 11px; letter-spacing: 1px; color: rgba(255,255,255, .75); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, .5))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); background: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); background: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .3)); background-color: rgba(0, 0, 0, 0); background: rgba(0,0,0, .65);} .blog-slide-title {margin-bottom: 6px; font-size: 16px; text-transform: uppercase; letter-spacing: 0.2em;} .blog-slide-title a {display: block; color: rgba(255,255,255, .85); text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.300, 0.100, 0.580, 1.000);} .blog-slide-title a:hover {color: rgba(255,255,255, 1);} .blog-slide-data {text-transform: uppercase; font-size: 11px; letter-spacing: 1px;} .blog-slide-data a {color: rgba(255,255,255, .65); text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .blog-slide-data a:hover {color: rgba(255,255,255, 1); text-decoration: none;} /*
 * Landing
 */

.play-video-link {text-decoration: none; text-transform: uppercase; font-size: 14px; color: #111;} .play-video-link:hover, .play-video-link:focus {color: #777; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .play-video-link .fa {vertical-align: middle;} .download-button {display: inline-block; position: relative; padding: 13px 20px 13px 55px; border: 2px solid #111; text-align: left; text-decoration: none; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .download-button:hover, .download-button:focus {text-decoration: none; color: #111; opacity: .6;} .db-icon {width: 40px; height: 40px; position: absolute; top: 10px; left: 10px; font-size: 28px; line-height: 40px; text-align: center;} .db-title {display: block; font-size: 12px; letter-spacing: 1px; font-weight: 700; text-transform: uppercase;} .db-descr {display: block; font-size: 11px; color: #777; font-weight: 400;} /*
 * Photography 1
 */

.fullwidth-slideshow {cursor: grab; cursor: -webkit-grab; cursor: -moz-grab;} .fullwidth-slideshow-pager-wrap {cursor: default; width: 100%; position: absolute; bottom: 0; left: 0; padding: 60px 0 20px 0; z-index: 25; background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, .65))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .65)); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .65)); background: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .65)); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .65)); background: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .65)); background-color: rgba(0, 0, 0, 0);} .fullwidth-slideshow-pager-wrap .owl-item {opacity: .7; -webkit-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .fullwidth-slideshow-pager-wrap .owl-item:hover, .fullwidth-slideshow-pager-wrap .owl-item:focus {opacity: 1; outline-offset: -2px !important;} .fullwidth-slideshow-pager-wrap .owl-item.synced {opacity: 1;} .fsp-item {margin: 0 2px; cursor: pointer;} .fsp-item:active {-webkit-transform: scale(0.98); -moz-transform: scale(0.98); -o-transform: scale(0.98); -ms-transform: scale(0.98); transform: scale(0.98);} .fsp-item img {width: 100%; -webkit-border-radius: 2px; -moz-border-radius: 2px; -border-radius: 2px; -webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, .75); -moz-box-shadow: 0px 1px 5px rgba(0, 0, 0, .75); box-shadow: 0px 1px 5px rgba(0, 0, 0, .75);} /*
 * Photography 2
 */

.side-panel-is-left {margin-left: 270px;} .sp-overlay {display: none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(10,10,10, .85); cursor:crosshair; z-index: 1030;} .side-panel {position: fixed; top: 0; left: 0; width: 270px; height: 100%; padding-bottom: 60px; overflow-y: auto; color: rgba(255,255,255, .65); background: #151515; text-align: center; z-index: 1031; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .sp-close-button {display: none; position: absolute; top: 20px; right: 20px; width: 36px; height: 36px; border: 1px solid rgba(255,255,255, .5); opacity: .5; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.17s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .sp-close-button:hover {opacity: .75; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .sp-close-button:before {content: ""; position: absolute; top: 50%; left: 50%; width:14px; height: 2px; margin: -1px 0 0 -7px; background: #fff;} .sp-close-button:after {content: ""; position: absolute; top: 50%; left: 50%; width:2px; height: 14px; margin: -7px 0 0 -1px; background: #fff;} /* Responsive menu button */

.sp-button {display: none; position: fixed; top: 20px; left: 20px; width: 54px; height: 54px; background: #111; opacity: .85; text-indent: -12345px; z-index: 1030; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: opacity 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .sp-button:hover {opacity: 1;} .sp-button span {display: block; width: 22px; height: 2px; background: #fff; position: absolute; top: 50%; left: 50%; margin: -1px 0 0 -11px; -webkit-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .sp-button span:before, .sp-button span:after {content: ""; display: block; width: 100%; height: 2px; background: #fff; position: absolute; top: -6px; left: 0; -webkit-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -webkit-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -moz-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -moz-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -o-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -o-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; -ms-transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), -ms-transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s; transition: top 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), bottom 0.07s cubic-bezier(0.000, 0.000, 0.580, 1.000), transform 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000) 0.07s;} .sp-button span:after {top: auto; bottom: -6px;} /* Logo */
 .sp-logo-wrap{} .sp-logo-wrap .logo {display: block; padding: 30px; text-align: center; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .sp-logo-wrap .logo img {max-width: 100%;} /* Menu */

.sp-wrapper{} .sp-menu-links, .sp-menu-links ul {margin: 0; padding: 10px 0; line-height: 1.3; text-align: center;} .sp-menu-links ul.sp-sub {padding: 0;} .sp-menu-links a {display: block; position: relative; margin: 0; padding: 15px 20px; color: #999; font-size: 14px; letter-spacing: 2px; font-weight: 400; text-transform: uppercase; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: rgba(255,255,255, .1); -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); z-index: 11;} .no-touch .sp-menu-links a:hover, .sp-menu-links a:active, .sp-menu-links li.js-opened > a {color: #d5d5d5; text-decoration: none;} .no-touch .sp-menu-links a:hover {background-color: rgba(255,255,255, .05);} .sp-menu-links li {margin: 0; padding: 0; position: relative;} .sp-menu-links li > a:active, .sp-menu-links li a.active {color: #f5f5f5;} .sp-menu-links li.js-opened:before {display: none;} .no-touch .sp-menu-links li.js-opened > a:hover, .sp-menu-links li.js-opened > a:active {color: #fff;} .sp-has-sub{} .sp-has-sub .fa {font-size: 14px;} .js-opened > .sp-has-sub > .fa {color: #fff;} .sp-sub {display: none; opacity: 0; position: relative;} .sp-sub > li > a {padding-left: 20px; padding-right: 20px; padding-top: 5px; padding-bottom: 5px; font-size: 13px; font-weight: 400;} .sp-menu-links li.js-opened .sp-sub {opacity: 1;} .sp-search {width: 100%;} .sp-search input.search-field {background: transparent; color: #555; text-align: center; border: none; border-bottom: 1px solid rgba(255,255,255, .2);} .sp-search input.search-field:hover {border: none; border-bottom: 1px solid rgba(255,255,255, .4);} .sp-search input.search-field:focus {color: #999; border-color: rgba(255,255,255, .7);} .sp-search .search-button:hover {color: #fff;} /* Social links */

.sp-social-links {position: fixed; bottom: 0; left: 0; width: inherit; padding: 10px 10px 30px 10px; font-size: 14px; text-align: center; background: transparent; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; z-index: 1032;} .sp-social-links > a {display: inline-block; margin: 0 2px; width: 34px; height: 34px; line-height: 34px; border: 1px solid rgba(255,255,255, .15); text-align: center; text-decoration: none; color: #555; -webkir-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);} .sp-social-links > a:hover {border-color: rgba(255,255,255, .3); color: #999;} /* White side panel */

.side-panel.white {color: rgba(0,0,0, .65) !important; background: #fafafa; border-right: 1px solid rgba(0,0,0, .07);} .side-panel.white .sp-close-button {border: 1px solid rgba(0,0,0, .5);} .side-panel.white .sp-close-button:before {background: #000;} .side-panel.white .sp-close-button:after {background: #000;} .side-panel.white .sp-menu-links a {color: #777; -webkit-tap-highlight-color: rgba(0,0,0, .05);} .side-panel.white .sp-menu-links li {border-top: 1px solid rgba(0,0,0, .04);} .side-panel.white .sp-menu-links li:last-child {border-bottom: 1px solid rgba(0,0,0, .04);} .no-touch .side-panel.white .sp-menu-links a:hover, .side-panel.white .sp-menu-links a:active, .side-panel.white .sp-menu-links li.js-opened > a {color: #111; text-decoration: none;} .no-touch .side-panel.white .sp-menu-links a:hover {background-color: rgba(0,0,0, .03);} .side-panel.white .sp-menu-links li > a:active, .side-panel.white .sp-menu-links li a.active {color: #111;} .no-touch .side-panel.white .sp-menu-links li.js-opened > a:hover, .side-panel.white .sp-menu-links li.js-opened > a:active {color: #111;} .side-panel.white .js-opened > .sp-has-sub > .fa {color: #333;} .side-panel.white .sp-sub > li {border: none!important;} .side-panel.white .sp-social-links > a {border: 1px solid rgba(0,0,0, .15); color: rgba(0,0,0, .4);} .side-panel.white .sp-social-links > a:hover {border-color: rgba(0,0,0, .3); color: rgba(0,0,0, .75);} /* Photo Tilt effect */

.tilt-wrap {width: 100%; position: relative;} .tilt {overflow: visible; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0 auto;} .tilt__back, .tilt__front {width: 100%; height: 100%; background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; -webkit-backface-visibility: hidden; backface-visibility: hidden;} .tilt__back {position: relative;} .tilt__front {position: absolute; top: 0; left: 0;} /*
 * Coming soon page
 */

.countdown {display: inline-block;} .countdown > li {float: left; margin: 0 30px;} .countdown-number {position: relative; display: block; width: 94px; height: 94px; color: #111; font-size: 36px; text-align: center; line-height: 84px;} .countdown-number > span {position: relative; z-index: 2;} .countdown-number > b {display: block; width: 100%; position: absolute; bottom: 20px; left: 0; font-size: 10px; font-weight: 400; text-transform: uppercase; letter-spacing: 1px; line-height: 1; color: #999; z-index: 2;} .countdown-number:before {content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(255,255,255, .95); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); z-index: 1;} /* Dark Timer */

.countdown.dark .countdown-number {color: #fff;} .countdown.dark .countdown-number > b {color: #aaa;} .countdown.dark .countdown-number:before {background: rgba(0,0,0, .8);} /* ==============================
   Skip to Content Link ============================== */
  
.skip-to-content {position: absolute; top: 3px; left: 3px; padding: 20px 40px; color: #ffffff; background: #111; -webkit-transform: translateY(-150%); -moz-transform: translateY(-150%); -ms-transform: translateY(-150%); transform: translateY(-150%); z-index:100000;} .skip-to-content:hover, .skip-to-content:focus, .skip-to-content.focus-visible {color: #ffffff; opacity: 1; background: #000; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);} /* ==============================
   Improve the readability ============================== */

.section-text, .text, .banner-decription, .alt-features-descr, .post-prev-text, .ci-text, .team-item-detail, .alt-service-item, .benefits-descr, .features-descr, .blog-item-body {font-weight: 400;} .blog-item-body {color: #555555;} /* ==============================
   Wow animation fix ============================== */
  
.wow {opacity: 0.01;} .wow.animated, .mobile .wow {opacity: 1;} /* ==============================
   Morphext ============================== */

.morphext > .animated {display: inline-block; -webkit-animation-duration: 1s; animation-duration: 1s; }

/*------------------------------------------------------------------
[Responsive Stylesheet]

Project: Rhythm
Version: 2.16
Primary use: MultiPurpose Template  
-------------------------------------------------------------------*/


/*------------------------------------------------------------------
[Table of contents]

1. Small desktop
2. Tablet landskape
3. Tablet Portrait
4. Phone
5. Small Phone
6. Max Height 768
7. IOS Background Fix
8. Print Styles Fix
-------------------------------------------------------------------*/


/* ==============================
   Small desktop
   ============================== */

@media only screen and (max-width: 1366px){ .inner-nav ul li{ margin-left: 25px; }
	
}  

@media only screen and (max-width: 1200px){ .hs-wrap{ max-width: 540px; }
    .hs-line-1{ letter-spacing: 40px; }
    .hs-line-2{ font-size: 68px; }
    .hs-line-12{ font-size: 70px; letter-spacing: 0.3em; }
    .hs-line-13{ font-size: 78px; letter-spacing: 0.195em; }
    
    .alt-service-grid{ margin-top: -40px; } 
    .alt-service-item{ margin-top: 40px; padding-left: 48px; }
    .alt-services-title{ font-size: 14px; margin-bottom: 5px; }
    .alt-services-image{ margin-top: 10px; }
    
    .work-grid-5 .work-item{ width: 25%; }
    
    .mod-breadcrumbs-mini{ text-align: right; }
    
}
@media only screen and (max-width: 1199px){ .tpl-alt-tabs{ font-size: 13px; letter-spacing: 0.2em; }
    .tpl-alt-tabs > li{ width: 170px; }
    
    .split-section-wrapper{ padding: 0 50px; }
    
}

/* ==============================
   Tablet landskape
   ============================== */

@media only screen and (max-width: 1024px){ .hs-wrap{ max-width: 480px; padding-top: 37px; padding-bottom: 43px; }
    
    .hs-line-1{ letter-spacing: 30px; }
    .hs-line-2{ font-size: 60px; }

    .hs-line-9{ font-size: 71px; } 
    .hs-line-10{ padding: 10px 14px; letter-spacing: 1px; }
    .hs-line-10 > span{ margin: 0 1px; }
    
    .benefit-item{ width: 300px; padding: 15px 32px; }

    .page-section{ padding: 120px 0; }
    .page-section, .home-section, .small-section{ background-attachment: scroll; }
    
    .owl-pagination{ bottom: 25px; }
    .section-bot-image{ margin: 120px 0 -120px; }
    
    
    .lp-item{ width: 50%; }
    .lp-item:nth-child(4n + 5){ clear: none; }
    .lp-item:nth-child(2n + 3){ clear:left; }
    .lp-title, .lp-author{ font-size: 13px; }

}
  
@media only screen and (max-width: 992px){ .hs-line-1{ letter-spacing: 23px; }
    .hs-line-13{ letter-spacing: 0.17em; }
    
    .mod-breadcrumbs:not(.align-center):not(.mod-breadcrumbs-mini){ text-align: left !important; }
    
    .tpl-alt-tabs > li{ width: 200px; }
      
    .split-section-headings,
    .split-section-headings.left,
    .split-section-headings.right,
    .split-section-content,
    .split-section-content.left,
    .split-section-content.right{ float: none !important; width: auto; }
    
    .split-section-headings .section-title{ font-size: 35px; letter-spacing: 5px; }
    
    .banner-text{ text-align: center; } 
    
    .banner-image{ margin: 40px 0; }

    .team-item-name{ font-size: 13px; }
    
    .features-icon{ font-size: 64px; } 
    .features-title{ font-size: 20px; }
    .features-descr{ font-size: 14px; }
    
    .work-item,
    .work-grid-3 .work-item,
    .container .work-grid-3 .work-item,
    .work-grid-5 .work-item{ width: 50%; }
     
    
    .blog-item-date{ border:none; }
    
    
    .countdown > li{ margin: 0 20px; }
    .countdown-number{ width: 74px; height: 74px; font-size: 24px; line-height: 64px; }
    .countdown-number > b{ bottom: 18px; }   
    
}
  
  
/* ==============================
   Tablet Portrait
   ============================== */
  
@media only screen and (max-width: 768px){ 
    
 #work-grid.works-grid.work-grid-4  .work-item {width: 33%; }
    
    .hs-wrap{ max-width: 400px; }
    .hs-line-2{ font-size: 50px; }
    
    .hs-line-7{ font-size: 50px; }
    
    .page-section{ padding: 80px 0; }    
    .small-section{ padding: 50px 0; }
    .small-title{ font-size: 18px; }
    
    .owl-pagination{ bottom: 17px; }
    
    .section-bot-image{ margin: 70px 0 -70px; }
    
    
    .tpl-minimal-tabs > li{ padding: 0 5px; }
    
        
    .benefit-item{ width: 264px; }
    
    .count-descr{ margin-bottom: 30px; }    
    
    .alt-service-grid{ margin-top: -30px; }
    .alt-service-item{ margin-top: 30px; }

    .works-filter a{ padding-left: 10px; padding-right: 10px; margin: 4px; }
    
    .blog-item{ margin-bottom: 50px; }
    .blog-item-date{ top: 0; left: -100px; }
    .blog-item-title{ font-size: 20px; }
    .blog-item-title .small{ font-size: 15px; }
    .blog-item-body{ font-size: 14px; }
    .blog-media{ margin-bottom: 15px; }
    .blog-item-body .small{ font-size: 13px; }

    .google-map > iframe{ height: 300px; }
    
    .fm-logo-wrap{ top: 17px; left: 17px; }
    .fm-button{ top: 17px; right: 17px; }

}

@media only screen and (max-width: 767px){ .hs-wrap{ max-width: 320px; padding-top: 27px; padding-bottom: 33px; }
    .hs-line-1{ font-size: 24px; }
    .hs-line-2{ font-size: 36px; }    
    .hs-line-3{ font-size: 13px; }
    .hs-image{ display: none; }
    
    .hs-wrap-1{ max-width: 240px; }    
    .hs-line-5{ font-size: 44px; letter-spacing: 0.28em; }
    .hs-line-6{ font-size: 16px; }
    .hs-line-7{ font-size: 32px; }
    
    .hs-line-9{ font-size: 48px; } 
    .hs-line-10{ padding: 5px 8px; font-size: 11px; letter-spacing: 1px; }
    .hs-line-10 > span{ margin: 0; }
    
    .hs-line-11{ font-size: 24px; }
    
    .hs-line-12{ font-size: 44px; }
    .hs-line-13{ font-size: 60px; letter-spacing: 0.1em; }
    .hs-line-14{ font-size: 24px; letter-spacing: 0.3em; }
    .hs-line-15{ font-size: 32px; }
    
    .team-item{ max-width: 370px; margin-left: auto; margin-right: auto; }
    
    .alt-features-grid{ margin-top: -30px; } 
    .alt-features-item{ margin-top: 30px; }

    .benefit-item{ width: 230px; padding: 0; }
    
    .benefit-item:hover:after{ display: none; }
    
    .wide-heading{ font-size: 32px; letter-spacing: 2px; }
    
    .works-filter a{ padding-left: 10px; padding-right: 10px; margin: 4px; width: 46%; font-size: 11px; }    
    
    .blog-item-date{ width: auto; position: relative; top: auto; left: auto; padding: 0; text-align: left; }
    .date-num{ display: inline !important; margin: 0 5px 10px 0; }
    .sidebar{ margin-top: 50px; } 
    
    blockquote p{ font-size: 20px; }
    
    blockquote footer{ margin-top: 0; font-size: 12px; }   

    .banner-content{ text-align: center; } 
    .banner-image{ text-align: center; }
    
    
    .cf-left-col,
    .cf-right-col{ width: auto; margin-right: 0; float: none; }
    
    .section-more,
    .section-more.left,
    .section-more.right{ float: none !important; display: block; }
    
    .big-icon{ width: 60px; height: 60px; line-height: 56px; font-size: 24px; margin-bottom: 0; }
    
    .blog-slide-info{ padding: 10px; }
    .blog-slide-title{ font-size: 12px; }
    .blog-slide-data{ display: none; }
    
    .top-bar{ min-height: 0; }
    .top-links{ float: none !important; padding: 5px 0; text-align: center; }
    .top-links li,
    .top-links li:last-child{ float: none; border:none; display: inline-block; }
    .top-links li a{ display: inline-block; min-width: 0; height: auto; line-height: 1; padding: 0 5px; }
    .top-links li a:hover,
    .top-bar.dark .top-links li a:hover{ background: none; }
    
    .side-panel{ padding-bottom: 20px; }
    .sp-logo-wrap{ max-width: 100px; margin: 0 auto; }
    .sp-logo-wrap .logo{ padding: 20px 0 0 0; }
    .sp-menu-links a{ padding-top: 10px; padding-bottom: 10px; }
    .sp-social-links{ width: auto; position: static; padding-bottom: 10px; }
    
    .countdown > li{ margin: 0 10px 20px; }
    .countdown-number{ width: 44px; height: 44px; font-size: 20px; line-height: 44px; }
    .countdown-number > b{ bottom: -20px; font-size: 9px; color: rgba(255,255,255, .85); } 
    .text-mobile{ font-size: 110%; line-height: 1.2; }
}


/* ==============================
   Phone
   ============================== */
  
@media only screen and (max-width: 480px){ .btn-mod.btn-large{ padding: 8px 15px; font-size: 13px; }
    .form input[type="text"].input-lg,
    .form input[type="email"].input-lg,
    .form input[type="number"].input-lg,
    .form input[type="url"].input-lg,
    .form input[type="search"].input-lg,
    .form input[type="tel"].input-lg,
    .form input[type="password"].input-lg,
    .form input[type="date"].input-lg,
    .form input[type="color"].input-lg,
    .form select.input-lg{ height: 38px; }
    .hs-line-1{ font-size: 20px; letter-spacing: 18px; }
    .hs-line-2{ font-size: 28px; }
    .hs-line-6{ font-size: 15px; }
    .hs-line-7{ font-size: 28px; }
    .hs-line-8{ font-size: 12px; } 
    .hs-line-9{ font-size: 42px; } 
    .hs-line-11{ font-size: 20px; letter-spacing: 0.2em; } 
    .hs-line-12{ font-size: 32px; }
    .hs-line-13{ font-size: 30px; letter-spacing: 0.1em; }
    
    .hs-line-15{ font-size: 24px; }
   
   .scroll-down{ bottom: 10px; height: 34px; line-height: 34px; }
    .scroll-down-icon{ width: 22px; margin-left: -11px; }    
    .scroll-down span{ display: none; }
    
    .nav-bar-compact{ top: 0; left: 0; }
    
    
    .page-section{ padding: 60px 0; }
    .small-section{ padding: 30px 0; }
    
    .owl-pagination{ bottom: 10px; }    
    
    .owl-prev, .owl-next{ display: none; }
    .owl-page{ padding-left: 8px; padding-right: 8px; }
    
    .section-bot-image{ margin: 50px 0 -50px; }
    
    .section-title,
    .split-section-headings .section-title,
    .wide-heading{ font-size: 24px; letter-spacing: 2px; }    
    .section-heading,
    .sub-heading{ font-size: 15px; } 
    .section-text{ font-size: 15px; line-height: 1.7; }
    
    .tpl-minimal-tabs > li{ padding: 0; }
    .tpl-minimal-tabs > li > a{ padding: 6px 10px 5px; }
    .tpl-alt-tabs{ font-size: 12px; letter-spacing: 0.1em; }
    .tpl-alt-tabs > li{ width: 120px; }
    .alt-tabs-icon{ font-size: 32px; }
    
    .work-container{ padding: 30px 0; }
    .margin-bot{ margin-bottom: 30px; }
    
    .section-text, 
    .text{ line-height: 1.7; }
        
    .count-number{ font-size: 32px; }
    .count-title{ font-size: 12px; }

    
    .works-filter a{ width: 100%; margin-left: 0; margin-right: 0; }    
    
    
     #work-grid.works-grid.work-grid-4  .work-item {width: 50%; }
    
    .work-item,
    .work-grid-2 .work-item,
    .work-grid-3 .work-item,
    .container .work-grid-3 .work-item,
    .work-grid-5 .work-item{ width: 100%; }    
    
    .work-full-text{ margin-top: 30px; }
    .work-full-title{ font-size: 20px; }
    
    .blog-container{ margin-top: 30px; margin-bottom: 30px; }
    
    .blog-item-title{ font-size: 16px; }

    .blog-item-q p{ font-size: 16px; }
    .comment-avatar{ width: 30px; margin-top: 7px; }
    
    .comment-item{ font-size: 13px; }
    
    .separ-space{ display: block; height: 10px; }
    
    
    .bot-menu-item{ font-size: 16px; }
    
    .google-map > iframe{ height: 300px; }
    
   .fixed-height-small{ min-height: 300px; }
    .fixed-height-medium{ min-height: 350px; }
    .fixed-height-large{ min-height: 400px; }
    
    .tpl-tabs > li{ display: block; float: none; width: 100%; }
    .tpl-tabs > li.active a{ background: #f5f5f5 !important; }
    
    .fm-menu-links a{ font-size: 14px; }
    .fm-search{ width: 200px; }
}


/* ==============================
   Small Phone
   ============================== */
  
@media only screen and (max-width: 319px){ .nav-social-links{ display: none; }
    
        
     #work-grid.works-grid.work-grid-4  .work-item {width: 100%; }
}


/* ==============================
   Max Height 768
   ============================== */

@media only screen and (max-height: 767px){ .sp-social-links{ padding-bottom: 10px; position: static; width: auto; }
}


/* ==============================
   IOS Background Fix
   ============================== */
  
.mobile .page-section, .mobile .home-section, .mobile .small-section{ background-attachment: scroll; }

/*
 * iPad Pro
 */

@media only screen and (min-width: 1024px) and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5){ html:not(.no-touch) .page-section, html:not(.no-touch) .home-section, html:not(.no-touch) .small-section{ background-attachment: scroll; }
}


/* ==============================
   Print Styles Fix
   ============================== */
  
@media print{ .main-nav{ display: none; }
    .buy-button{ display: none; }
    img{ display: block; }
}


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

Copyright (c) 2014 Daniel Eden
*/ .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%, 100%, 20%, 53%, 80% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    40%, 43% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}
@keyframes bounce {
    0%, 100%, 20%, 53%, 80% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    40%, 43% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        transition-timing-function: cubic-bezier(0.755, .050, .855, .060);
        -webkit-transform: translate3d(0, -15px, 0);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -4px, 0);
        transform: translate3d(0, -4px, 0)
    }
}
.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    -webkit-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom
}
@-webkit-keyframes flash {
    0%, 100%, 50% {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}
@keyframes flash {
    0%, 100%, 50% {
        opacity: 1
    }
    25%, 75% {
        opacity: 0
    }
}
.flash {
    -webkit-animation-name: flash;
    animation-name: flash
}
@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
@keyframes pulse {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    50% {
        -webkit-transform: scale3d(1.05, 1.05, 1.05);
        transform: scale3d(1.05, 1.05, 1.05)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}
@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
@keyframes rubberBand {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1)
    }
    50% {
        -webkit-transform: scale3d(1.15, .85, 1);
        transform: scale3d(1.15, .85, 1)
    }
    65% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    75% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}
@-webkit-keyframes shake {
    0%, 100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}
@keyframes shake {
    0%, 100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
}
.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}
@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg)
    }
    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg)
    }
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg)
    }
    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg)
    }
    100% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg)
    }
}
@keyframes swing {
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg)
    }
    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg)
    }
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg)
    }
    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg)
    }
    100% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 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: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
@keyframes tada {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    10%, 20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}
@-webkit-keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
@keyframes wobble {
    0% {
        -webkit-transform: none;
        transform: none
    }
    15% {
        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
    }
    30% {
        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
    }
    45% {
        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
    }
    60% {
        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
    }
    75% {
        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}
@-webkit-keyframes bounceIn {
    0%, 100%, 20%, 40%, 60%, 80% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1)
    }
}
@keyframes bounceIn {
    0%, 100%, 20%, 40%, 60%, 80% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        -webkit-transform: scale3d(.97, .97, .97);
        transform: scale3d(.97, .97, .97)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}
.bounceIn {
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}
@-webkit-keyframes bounceInDown {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
@keyframes bounceInDown {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -3000px, 0);
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, 5px, 0);
        transform: translate3d(0, 5px, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}
@-webkit-keyframes bounceInLeft {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
@keyframes bounceInLeft {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0);
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0);
        transform: translate3d(25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(5px, 0, 0);
        transform: translate3d(5px, 0, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}
@-webkit-keyframes bounceInRight {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
@keyframes bounceInRight {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0);
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0)
    }
    90% {
        -webkit-transform: translate3d(-5px, 0, 0);
        transform: translate3d(-5px, 0, 0)
    }
    100% {
        -webkit-transform: none;
        transform: none
    }
}
.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}
@-webkit-keyframes bounceInUp {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}
@keyframes bounceInUp {
    0%, 100%, 60%, 75%, 90% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 3000px, 0);
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    75% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    90% {
        -webkit-transform: translate3d(0, -5px, 0);
        transform: translate3d(0, -5px, 0)
    }
    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }
}
.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}
@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}
@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9, .9, .9);
        transform: scale3d(.9, .9, .9)
    }
    50%, 55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
}
.bounceOut {
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}
@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}
@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0, 10px, 0);
        transform: translate3d(0, 10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
        transform: translate3d(0, -20px, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}
.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}
@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}
@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}
.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}
@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}
@keyframes bounceOutRight {
    20% {
        opacity: 1;
        -webkit-transform: translate3d(-20px, 0, 0);
        transform: translate3d(-20px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}
.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}
@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}
@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0, -10px, 0);
        transform: translate3d(0, -10px, 0)
    }
    40%, 45% {
        opacity: 1;
        -webkit-transform: translate3d(0, 20px, 0);
        transform: translate3d(0, 20px, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}
.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: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}
@-webkit-keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}
@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}
@-webkit-keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}
@-webkit-keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}
@-webkit-keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.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
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}
@keyframes fadeOutDown {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0)
    }
}
.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}
@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}
@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 2000px, 0);
        transform: translate3d(0, 2000px, 0)
    }
}
.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}
@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}
@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0)
    }
}
.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}
@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}
@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(-2000px, 0, 0);
        transform: translate3d(-2000px, 0, 0)
    }
}
.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}
@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}
@keyframes fadeOutRight {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0)
    }
}
.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}
@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}
@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(2000px, 0, 0);
        transform: translate3d(2000px, 0, 0)
    }
}
.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}
@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}
@keyframes fadeOutUp {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0)
    }
}
.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}
@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}
@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2000px, 0);
        transform: translate3d(0, -2000px, 0)
    }
}
.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}
@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}
@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
        transform: perspective(400px) scale3d(.95, .95, .95);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}
.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-animation-name: flip;
    animation-name: flip
}
@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}
@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}
.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}
@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}
@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}
.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}
@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    100% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}
@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    100% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}
.flipOutX {
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-animation-duration: .75s;
    animation-duration: .75s;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}
@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1
    }
    100% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0
    }
}
@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
    30% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1
    }
    100% {
        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0
    }
}
.flipOutY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY;
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}
@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1
    }
    100% {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg);
        opacity: 1
    }
    100% {
        -webkit-transform: none;
        transform: none;
        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% {
        opacity: 1
    }
    100% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}
@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }
    100% {
        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
        transform: translate3d(100%, 0, 0) 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;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes rotateIn {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, -200deg);
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: none;
        transform: none;
        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: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        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: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        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: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: none;
        transform: none;
        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: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
@keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -90deg);
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }
}
.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}
@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0
    }
}
@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate3d(0, 0, 1, 200deg);
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0
    }
}
.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}
@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
}
@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, 45deg);
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
}
.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}
@-webkit-keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}
@keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}
.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}
@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}
@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate3d(0, 0, 1, -45deg);
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}
.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}
@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0
    }
}
@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }
    100% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate3d(0, 0, 1, 90deg);
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0
    }
}
.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}
@-webkit-keyframes hinge {
    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: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%, 80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -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: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}
@keyframes hinge {
    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: rotate3d(0, 0, 1, 80deg);
        transform: rotate3d(0, 0, 1, 80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%, 80% {
        -webkit-transform: rotate3d(0, 0, 1, 60deg);
        transform: rotate3d(0, 0, 1, 60deg);
        -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: translate3d(0, 700px, 0);
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}
.hinge {
    -webkit-animation-name: hinge;
    animation-name: hinge
}
@-webkit-keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@keyframes rollIn {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
    }
    100% {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}
@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
    }
}
@keyframes rollOut {
    0% {
        opacity: 1
    }
    100% {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
    }
}
.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}
@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}
@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    50% {
        opacity: 1
    }
}
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}
@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}
@-webkit-keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}
@-webkit-keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}
@-webkit-keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}
@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    100% {
        opacity: 0
    }
}
@keyframes zoomOut {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }
    100% {
        opacity: 0
    }
}
.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}
@-webkit-keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown
}
@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}
@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
        transform: scale(.1) translate3d(-2000px, 0, 0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}
.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}
@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}
@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
        transform: scale(.1) translate3d(2000px, 0, 0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}
.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}
@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
}
.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}
@-webkit-keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@keyframes slideInDown {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}
@-webkit-keyframes slideInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}
@keyframes slideInLeft {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}
.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}
@-webkit-keyframes slideInRight {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}
@keyframes slideInRight {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}
.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}
@-webkit-keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}
@keyframes slideInUp {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        visibility: visible
    }
    100% {
        -webkit-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% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}
@keyframes slideOutDown {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}
.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}
@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}
@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}
.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}
@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}
@keyframes slideOutRight {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}
.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}
@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}
@keyframes slideOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    100% {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}
.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}






.mt-0{margin-top:0!important}.mt-10{margin-top:10px!important}.mt-20{margin-top:20px!important}.mt-30{margin-top:30px!important}.mt-40{margin-top:40px!important}.mt-50{margin-top:50px!important}.mt-60{margin-top:60px!important}.mt-70{margin-top:70px!important}.mt-80{margin-top:80px!important}.mt-90{margin-top:90px!important}.mt-100{margin-top:100px!important}.mt-110{margin-top:110px!important}.mt-120{margin-top:120px!important}.mt-130{margin-top:130px!important}.mt-140{margin-top:140px!important}.mb-0{margin-bottom:0!important}.mb-10{margin-bottom:10px!important}.mb-20{margin-bottom:20px!important}.mb-30{margin-bottom:30px!important}.mb-40{margin-bottom:40px!important}.mb-50{margin-bottom:50px!important}.mb-60{margin-bottom:60px!important}.mb-70{margin-bottom:70px!important}.mb-80{margin-bottom:80px!important}.mb-90{margin-bottom:90px!important}.mb-100{margin-bottom:100px!important}.mb-110{margin-bottom:110px!important}.mb-120{margin-bottom:120px!important}.mb-130{margin-bottom:130px!important}.mb-140{margin-bottom:140px!important}.pt-0{padding-top:0!important}.pt-10{padding-top:10px!important}.pt-20{padding-top:20px!important}.pt-30{padding-top:30px!important}.pt-40{padding-top:40px!important}.pt-50{padding-top:50px!important}.pt-60{padding-top:60px!important}.pt-70{padding-top:70px!important}.pt-80{padding-top:80px!important}.pt-90{padding-top:90px!important}.pt-100{padding-top:100px!important}.pt-110{padding-top:110px!important}.pt-120{padding-top:120px!important}.pt-130{padding-top:130px!important}.pt-140{padding-top:140px!important}.pb-0{padding-bottom:0!important}.pb-10{padding-bottom:10px!important}.pb-20{padding-bottom:20px!important}.pb-30{padding-bottom:30px!important}.pb-40{padding-bottom:40px!important}.pb-50{padding-bottom:50px!important}.pb-60{padding-bottom:60px!important}.pb-70{padding-bottom:70px!important}.pb-80{padding-bottom:80px!important}.pb-90{padding-bottom:90px!important}.pb-100{padding-bottom:100px!important}.pb-110{padding-bottom:110px!important}.pb-120{padding-bottom:120px!important}.pb-130{padding-bottom:130px!important}.pb-140{padding-bottom:140px!important}@media only screen and (max-width:1199px){.mt-lg-0{margin-top:0!important}.mt-lg-10{margin-top:10px!important}.mt-lg-20{margin-top:20px!important}.mt-lg-30{margin-top:30px!important}.mt-lg-40{margin-top:40px!important}.mt-lg-50{margin-top:50px!important}.mt-lg-60{margin-top:60px!important}.mt-lg-70{margin-top:70px!important}.mt-lg-80{margin-top:80px!important}.mt-lg-90{margin-top:90px!important}.mt-lg-100{margin-top:100px!important}.mt-lg-110{margin-top:110px!important}.mt-lg-120{margin-top:120px!important}.mt-lg-130{margin-top:130px!important}.mt-lg-140{margin-top:140px!important}.mb-lg-0{margin-bottom:0!important}.mb-lg-10{margin-bottom:10px!important}.mb-lg-20{margin-bottom:20px!important}.mb-lg-30{margin-bottom:30px!important}.mb-lg-40{margin-bottom:40px!important}.mb-lg-50{margin-bottom:50px!important}.mb-lg-60{margin-bottom:60px!important}.mb-lg-70{margin-bottom:70px!important}.mb-lg-80{margin-bottom:80px!important}.mb-lg-90{margin-bottom:90px!important}.mb-lg-100{margin-bottom:100px!important}.mb-lg-110{margin-bottom:110px!important}.mb-lg-120{margin-bottom:120px!important}.mb-lg-130{margin-bottom:130px!important}.mb-lg-140{margin-bottom:140px!important}.pt-lg-0{padding-top:0!important}.pt-lg-10{padding-top:10px!important}.pt-lg-20{padding-top:20px!important}.pt-lg-30{padding-top:30px!important}.pt-lg-40{padding-top:40px!important}.pt-lg-50{padding-top:50px!important}.pt-lg-60{padding-top:60px!important}.pt-lg-70{padding-top:70px!important}.pt-lg-80{padding-top:80px!important}.pt-lg-90{padding-top:90px!important}.pt-lg-100{padding-top:100px!important}.pt-lg-110{padding-top:110px!important}.pt-lg-120{padding-top:120px!important}.pt-lg-130{padding-top:130px!important}.pt-lg-140{padding-top:140px!important}.pb-lg-0{padding-bottom:0!important}.pb-lg-10{padding-bottom:10px!important}.pb-lg-20{padding-bottom:20px!important}.pb-lg-30{padding-bottom:30px!important}.pb-lg-40{padding-bottom:40px!important}.pb-lg-50{padding-bottom:50px!important}.pb-lg-60{padding-bottom:60px!important}.pb-lg-70{padding-bottom:70px!important}.pb-lg-80{padding-bottom:80px!important}.pb-lg-90{padding-bottom:90px!important}.pb-lg-100{padding-bottom:100px!important}.pb-lg-110{padding-bottom:110px!important}.pb-lg-120{padding-bottom:120px!important}.pb-lg-130{padding-bottom:130px!important}.pb-lg-140{padding-bottom:140px!important}}@media only screen and (max-width:991px){.mt-md-0{margin-top:0!important}.mt-md-10{margin-top:10px!important}.mt-md-20{margin-top:20px!important}.mt-md-30{margin-top:30px!important}.mt-md-40{margin-top:40px!important}.mt-md-50{margin-top:50px!important}.mt-md-60{margin-top:60px!important}.mt-md-70{margin-top:70px!important}.mt-md-80{margin-top:80px!important}.mt-md-90{margin-top:90px!important}.mt-md-100{margin-top:100px!important}.mt-md-110{margin-top:110px!important}.mt-md-120{margin-top:120px!important}.mt-md-130{margin-top:130px!important}.mt-md-140{margin-top:140px!important}.mb-md-0{margin-bottom:0!important}.mb-md-10{margin-bottom:10px!important}.mb-md-20{margin-bottom:20px!important}.mb-md-30{margin-bottom:30px!important}.mb-md-40{margin-bottom:40px!important}.mb-md-50{margin-bottom:50px!important}.mb-md-60{margin-bottom:60px!important}.mb-md-70{margin-bottom:70px!important}.mb-md-80{margin-bottom:80px!important}.mb-md-90{margin-bottom:90px!important}.mb-md-100{margin-bottom:100px!important}.mb-md-110{margin-bottom:110px!important}.mb-md-120{margin-bottom:120px!important}.mb-md-130{margin-bottom:130px!important}.mb-md-140{margin-bottom:140px!important}.pt-md-0{padding-top:0!important}.pt-md-10{padding-top:10px!important}.pt-md-20{padding-top:20px!important}.pt-md-30{padding-top:30px!important}.pt-md-40{padding-top:40px!important}.pt-md-50{padding-top:50px!important}.pt-md-60{padding-top:60px!important}.pt-md-70{padding-top:70px!important}.pt-md-80{padding-top:80px!important}.pt-md-90{padding-top:90px!important}.pt-md-100{padding-top:100px!important}.pt-md-110{padding-top:110px!important}.pt-md-120{padding-top:120px!important}.pt-md-130{padding-top:130px!important}.pt-md-140{padding-top:140px!important}.pb-md-0{padding-bottom:0!important}.pb-md-10{padding-bottom:10px!important}.pb-md-20{padding-bottom:20px!important}.pb-md-30{padding-bottom:30px!important}.pb-md-40{padding-bottom:40px!important}.pb-md-50{padding-bottom:50px!important}.pb-md-60{padding-bottom:60px!important}.pb-md-70{padding-bottom:70px!important}.pb-md-80{padding-bottom:80px!important}.pb-md-90{padding-bottom:90px!important}.pb-md-100{padding-bottom:100px!important}.pb-md-110{padding-bottom:110px!important}.pb-md-120{padding-bottom:120px!important}.pb-md-130{padding-bottom:130px!important}.pb-md-140{padding-bottom:140px!important}}@media only screen and (max-width:767px){.mt-sm-0{margin-top:0!important}.mt-sm-10{margin-top:10px!important}.mt-sm-20{margin-top:20px!important}.mt-sm-30{margin-top:30px!important}.mt-sm-40{margin-top:40px!important}.mt-sm-50{margin-top:50px!important}.mt-sm-60{margin-top:60px!important}.mt-sm-70{margin-top:70px!important}.mt-sm-80{margin-top:80px!important}.mt-sm-90{margin-top:90px!important}.mt-sm-100{margin-top:100px!important}.mt-sm-110{margin-top:110px!important}.mt-sm-120{margin-top:120px!important}.mt-sm-130{margin-top:130px!important}.mt-sm-140{margin-top:140px!important}.mb-sm-0{margin-bottom:0!important}.mb-sm-10{margin-bottom:10px!important}.mb-sm-20{margin-bottom:20px!important}.mb-sm-30{margin-bottom:30px!important}.mb-sm-40{margin-bottom:40px!important}.mb-sm-50{margin-bottom:50px!important}.mb-sm-60{margin-bottom:60px!important}.mb-sm-70{margin-bottom:70px!important}.mb-sm-80{margin-bottom:80px!important}.mb-sm-90{margin-bottom:90px!important}.mb-sm-100{margin-bottom:100px!important}.mb-sm-110{margin-bottom:110px!important}.mb-sm-120{margin-bottom:120px!important}.mb-sm-130{margin-bottom:130px!important}.mb-sm-140{margin-bottom:140px!important}.pt-sm-0{padding-top:0!important}.pt-sm-10{padding-top:10px!important}.pt-sm-20{padding-top:20px!important}.pt-sm-30{padding-top:30px!important}.pt-sm-40{padding-top:40px!important}.pt-sm-50{padding-top:50px!important}.pt-sm-60{padding-top:60px!important}.pt-sm-70{padding-top:70px!important}.pt-sm-80{padding-top:80px!important}.pt-sm-90{padding-top:90px!important}.pt-sm-100{padding-top:100px!important}.pt-sm-110{padding-top:110px!important}.pt-sm-120{padding-top:120px!important}.pt-sm-130{padding-top:130px!important}.pt-sm-140{padding-top:140px!important}.pb-sm-0{padding-bottom:0!important}.pb-sm-10{padding-bottom:10px!important}.pb-sm-20{padding-bottom:20px!important}.pb-sm-30{padding-bottom:30px!important}.pb-sm-40{padding-bottom:40px!important}.pb-sm-50{padding-bottom:50px!important}.pb-sm-60{padding-bottom:60px!important}.pb-sm-70{padding-bottom:70px!important}.pb-sm-80{padding-bottom:80px!important}.pb-sm-90{padding-bottom:90px!important}.pb-sm-100{padding-bottom:100px!important}.pb-sm-110{padding-bottom:110px!important}.pb-sm-120{padding-bottom:120px!important}.pb-sm-130{padding-bottom:130px!important}.pb-sm-140{padding-bottom:140px!important}}@media only screen and (max-width:575px){.mt-xs-0{margin-top:0!important}.mt-xs-10{margin-top:10px!important}.mt-xs-20{margin-top:20px!important}.mt-xs-30{margin-top:30px!important}.mt-xs-40{margin-top:40px!important}.mt-xs-50{margin-top:50px!important}.mt-xs-60{margin-top:60px!important}.mt-xs-70{margin-top:70px!important}.mt-xs-80{margin-top:80px!important}.mt-xs-90{margin-top:90px!important}.mt-xs-100{margin-top:100px!important}.mt-xs-110{margin-top:110px!important}.mt-xs-120{margin-top:120px!important}.mt-xs-130{margin-top:130px!important}.mt-xs-140{margin-top:140px!important}.mb-xs-0{margin-bottom:0!important}.mb-xs-10{margin-bottom:10px!important}.mb-xs-20{margin-bottom:20px!important}.mb-xs-30{margin-bottom:30px!important}.mb-xs-40{margin-bottom:40px!important}.mb-xs-50{margin-bottom:50px!important}.mb-xs-60{margin-bottom:60px!important}.mb-xs-70{margin-bottom:70px!important}.mb-xs-80{margin-bottom:80px!important}.mb-xs-90{margin-bottom:90px!important}.mb-xs-100{margin-bottom:100px!important}.mb-xs-110{margin-bottom:110px!important}.mb-xs-120{margin-bottom:120px!important}.mb-xs-130{margin-bottom:130px!important}.mb-xs-140{margin-bottom:140px!important}.pt-xs-0{padding-top:0!important}.pt-xs-10{padding-top:10px!important}.pt-xs-20{padding-top:20px!important}.pt-xs-30{padding-top:30px!important}.pt-xs-40{padding-top:40px!important}.pt-xs-50{padding-top:50px!important}.pt-xs-60{padding-top:60px!important}.pt-xs-70{padding-top:70px!important}.pt-xs-80{padding-top:80px!important}.pt-xs-90{padding-top:90px!important}.pt-xs-100{padding-top:100px!important}.pt-xs-110{padding-top:110px!important}.pt-xs-120{padding-top:120px!important}.pt-xs-130{padding-top:130px!important}.pt-xs-140{padding-top:140px!important}.pb-xs-0{padding-bottom:0!important}.pb-xs-10{padding-bottom:10px!important}.pb-xs-20{padding-bottom:20px!important}.pb-xs-30{padding-bottom:30px!important}.pb-xs-40{padding-bottom:40px!important}.pb-xs-50{padding-bottom:50px!important}.pb-xs-60{padding-bottom:60px!important}.pb-xs-70{padding-bottom:70px!important}.pb-xs-80{padding-bottom:80px!important}.pb-xs-90{padding-bottom:90px!important}.pb-xs-100{padding-bottom:100px!important}.pb-xs-110{padding-bottom:110px!important}.pb-xs-120{padding-bottom:120px!important}.pb-xs-130{padding-bottom:130px!important}.pb-xs-140{padding-bottom:140px!important}}@media only screen and (max-width:480px){.mt-xxs-0{margin-top:0!important}.mt-xxs-10{margin-top:10px!important}.mt-xxs-20{margin-top:20px!important}.mt-xxs-30{margin-top:30px!important}.mt-xxs-40{margin-top:40px!important}.mt-xxs-50{margin-top:50px!important}.mt-xxs-60{margin-top:60px!important}.mt-xxs-70{margin-top:70px!important}.mt-xxs-80{margin-top:80px!important}.mt-xxs-90{margin-top:90px!important}.mt-xxs-100{margin-top:100px!important}.mt-xxs-110{margin-top:110px!important}.mt-xxs-120{margin-top:120px!important}.mt-xxs-130{margin-top:130px!important}.mt-xxs-140{margin-top:140px!important}.mb-xxs-0{margin-bottom:0!important}.mb-xxs-10{margin-bottom:10px!important}.mb-xxs-20{margin-bottom:20px!important}.mb-xxs-30{margin-bottom:30px!important}.mb-xxs-40{margin-bottom:40px!important}.mb-xxs-50{margin-bottom:50px!important}.mb-xxs-60{margin-bottom:60px!important}.mb-xxs-70{margin-bottom:70px!important}.mb-xxs-80{margin-bottom:80px!important}.mb-xxs-90{margin-bottom:90px!important}.mb-xxs-100{margin-bottom:100px!important}.mb-xxs-110{margin-bottom:110px!important}.mb-xxs-120{margin-bottom:120px!important}.mb-xxs-130{margin-bottom:130px!important}.mb-xxs-140{margin-bottom:140px!important}.pt-xxs-0{padding-top:0!important}.pt-xxs-10{padding-top:10px!important}.pt-xxs-20{padding-top:20px!important}.pt-xxs-30{padding-top:30px!important}.pt-xxs-40{padding-top:40px!important}.pt-xxs-50{padding-top:50px!important}.pt-xxs-60{padding-top:60px!important}.pt-xxs-70{padding-top:70px!important}.pt-xxs-80{padding-top:80px!important}.pt-xxs-90{padding-top:90px!important}.pt-xxs-100{padding-top:100px!important}.pt-xxs-110{padding-top:110px!important}.pt-xxs-120{padding-top:120px!important}.pt-xxs-130{padding-top:130px!important}.pt-xxs-140{padding-top:140px!important}.pb-xxs-0{padding-bottom:0!important}.pb-xxs-10{padding-bottom:10px!important}.pb-xxs-20{padding-bottom:20px!important}.pb-xxs-30{padding-bottom:30px!important}.pb-xxs-40{padding-bottom:40px!important}.pb-xxs-50{padding-bottom:50px!important}.pb-xxs-60{padding-bottom:60px!important}.pb-xxs-70{padding-bottom:70px!important}.pb-xxs-80{padding-bottom:80px!important}.pb-xxs-90{padding-bottom:90px!important}.pb-xxs-100{padding-bottom:100px!important}.pb-xxs-110{padding-bottom:110px!important}.pb-xxs-120{padding-bottom:120px!important}.pb-xxs-130{padding-bottom:130px!important}.pb-xxs-140{padding-bottom:140px!important}}