html, body { width: 100%; max-width: 100%; height: auto; padding: 0; margin: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { overflow-x: hidden !important; overflow-y: scroll; -webkit-tap-highlight-color: rgba(0,0,0,0.3); font-style: normal; font-weight: 400; font-size: 14px; font-family: 'Open Sans', sans-serif; line-height: 24px; letter-spacing: 0px; color: #333; }
section, .cover { background-size: cover; background-position: center center; background-repeat: no-repeat; }
::selection { color: white; }
body.no-selection ::selection { color: inherit !important; background: transparent !important; }
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 { -webkit-text-size-adjust: none; }
/* Undragable Images */
img { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -webkit-user-drag: none; }
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, p { color: inherit; font-variant-ligatures: common-ligatures; line-height: 1.4; padding: 0; margin: 0; }
h1, .h1 { font-size: 36px; }
h2, .h2 { font-size: 32px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 18px; }
h5, .h5 { font-size: 14px; }
h6, .h6 { font-size: 12px; }
ol, ul { list-style: none; padding: 0; }
a, a:hover, a:focus, button, button:hover, button:focus { text-decoration: none; color: inherit; cursor: pointer; }
* { border: 0; vertical-align: baseline; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*, *:hover, *:focus { outline: none !important; }
/* ============================================================ */
/* Font Styles */
/* Example Fonts */
.opensans { font-family: "Open Sans", "PT Sans", sans-serif; }
.raleway { font-family: 'Raleway', sans-serif; }
.dosis { font-family: 'Dosis', sans-serif; }
.montserrat { font-family: 'Montserrat', sans-serif; }
.lato { font-family: "Lato", "PT Sans", sans-serif; }
.poppins { font-family: "Poppins", "PT Sans", sans-serif; }
.merriweather { font-family: 'Merriweather', serif; }
.lora { font-family: 'Lora', serif; }
.titillium { font-family: 'Titillium Web', sans-serif; }
.anton { font-family: 'Anton', sans-serif; }
.oswald { font-family: 'Oswald', sans-serif; }
.fjalla { font-family: 'Fjalla One', sans-serif; }
.playfair { font-family: 'Playfair Display', serif; }
.droid { font-family: 'Droid Serif', serif; }
/* Styles */
.italic { font-style: italic; }
.uppercase { text-transform: uppercase; }
.capitalize { text-transform: capitalize !important; }
.transform-none { text-transform: none !important; }
.t-left, .t-left.row, .t-left > .row { text-align: left; justify-content: left; }
.t-center, .t-center.row, .t-center > .row { text-align: center; justify-content: center; }
.t-right, .t-right.row, .t-right > .row { text-align: right; justify-content: right; }
.t-justify { text-align: justify; }
.t-vertical { writing-mode: vertical-rl; }
.t-shadow { text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1); }
.light { font-weight: 300; }
.normal { font-weight: 400 !important; }
.normal-title { font-weight: 400; letter-spacing: -1.8px; }
.normal-subtitle { font-weight: 400; letter-spacing: -0.8px; }
@media only screen and (max-width: 992px)
{
.normal-title { letter-spacing: -0.8px; }
.normal-subtitle { letter-spacing: -0.5px; }
}
.medium { font-weight: 500 !important; }
.semibold-title { font-weight: 600; letter-spacing: -1.6px; }
.semibold-subtitle { font-weight: 600; letter-spacing: -0.6px; }
@media only screen and (max-width: 992px)
{
.semibold-title { letter-spacing: -0.8px; }
.semibold-subtitle { letter-spacing: -0.5px; }
}
.semibold { font-weight: 600 !important; }
.bold { font-weight: 700; }
.bolder { font-weight: 800; }
.bold-title { font-weight: 700; letter-spacing: -2.1px; line-height: 125%; }
.bold-subtitle { font-weight: 700; letter-spacing: -0.8px; text-transform: uppercase; }
@media only screen and (max-width: 992px)
{
.bold-title { letter-spacing: -0.8px; }
.bold-subtitle { letter-spacing: -0.5px; }
}
.extrabold { font-weight: 900; }
.extrabold-title { font-weight: 900; letter-spacing: -2.2px; }
.extrabold-subtitle { font-weight: 900; letter-spacing: -1.2px; }
@media only screen and (max-width: 992px)
{
.extrabold-title { letter-spacing: -0.8px; }
.extrabold-subtitle { letter-spacing: -0.5px; }
}
.no-ls { letter-spacing: 0 !important; }
.lh-normal { line-height: normal; }
.lh-xs { line-height: 90%; }
.lh-sm { line-height: 120%; }
.lh-md { line-height: 150%; }
.lh-lg { line-height: 200%; }
.lh-xl { line-height: 240%; }
@media only screen and (max-width: 768px)
{
.lh-sm-mobile { line-height: normal; }
}
.fstyle-normal { font-style: normal; }
.underline, .underline-hover:hover, .underline-hover-links a:hover, .underline-hover-all:hover * { text-decoration: underline !important; }
.overline, .overline-hover:hover, .overline-hover-links a:hover, .overline-hover-all:hover * { text-decoration: line-through !important; }
.underline-dashed { border-bottom: 1px dashed; word-spacing: -1px; }
.text-background { -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; background-size: cover; background-position: center; }
.text-shadow { text-shadow: 0px 1px 20px rgba(0, 0, 0, 0.1); }
/* Inherit Font Styles */
.paragraph { font-size: 14px; line-height: 32px; margin-bottom: 15px; }
@media only screen and (max-width: 1400px)
{
.paragraph { font-size: 13px; line-height: 23px; }
}
.lh-inherit { line-height: inherit; }
.fs-inherit { font-size: inherit; }
.fw-inherit { font-weight: inherit; }
.ff-inherit { font-family: inherit; }
.color-inherit { color: inherit; }
/* Large Texts */
.text-lg, .font-40 { font-size: 40px; }
.text-lg1, .font-50 { font-size: 50px; }
.text-lg2 { font-size: 60px; }
.text-lg3 { font-size: 80px; }
.text-lg4 { font-size: 90px; }
.text-lg5 { font-size: 120px; }
.text-lg6 { font-size: 150px; }
.font-10 { font-size: 10px !important; }
.font-11 { font-size: 11px !important; }
.font-12 { font-size: 12px !important; }
.font-13 { font-size: 13px !important; }
.font-14 { font-size: 14px !important; }
.font-15 { font-size: 15px !important; }
.font-16 { font-size: 16px !important; }
.font-17 { font-size: 17px !important; }
.font-18 { font-size: 18px !important; }
.font-19 { font-size: 19px !important; }
.font-20 { font-size: 20px !important; }
.font-21 { font-size: 21px !important; }
.font-22 { font-size: 22px !important; }
.font-23 { font-size: 23px !important; }
.font-24 { font-size: 24px !important; }
.font-25 { font-size: 25px !important; }
.font-30 { font-size: 30px !important; }
.font-35 { font-size: 35px !important; }
.font-45 { font-size: 45px !important; }
.font-55 { font-size: 55px !important; }
/* Responsive Headings */
@media only screen and (max-width: 768px)
{
.text-lg, .text-lg1, .text-lg2, .text-lg3, .text-lg4, .text-lg5, .text-lg6 { font-size: 40px; }
}
@media only screen and (max-width: 550px)
{
.text-lg, .text-lg1, .text-lg2, .text-lg3, .text-lg4, .text-lg5, .text-lg6 { font-size: 30px; }
h1, .h1 { font-size: 28px; }
h2, .h2 { font-size: 24px; }
h3, .h3 { font-size: 20px; }
}
@media only screen and (max-width: 361px)
{
.text-lg, .text-lg1, .text-lg2, .text-lg3, .text-lg4, .text-lg5, .text-lg6 { font-size: 26px; }
h1, .h1 { font-size: 25px; }
h2, .h2 { font-size: 21px; }
h3, .h3 { font-size: 18px; }
}
/* Mobile Texts */
@media only screen and (max-width: 900px)
{
.font-10-mobile { font-size: 10px !important; }
.font-11-mobile { font-size: 11px !important; }
.font-12-mobile { font-size: 12px !important; }
.font-13-mobile { font-size: 13px !important; }
.font-14-mobile { font-size: 14px !important; }
.font-15-mobile { font-size: 15px !important; }
.font-16-mobile { font-size: 16px !important; }
.font-17-mobile { font-size: 17px !important; }
.font-18-mobile { font-size: 18px !important; }
.font-19-mobile { font-size: 19px !important; }
.font-20-mobile, .text-mobile { font-size: 20px !important; }
.font-21-mobile { font-size: 21px !important; }
.font-22-mobile { font-size: 22px !important; }
.font-23-mobile { font-size: 23px !important; }
.font-24-mobile { font-size: 24px !important; }
.font-25-mobile { font-size: 25px !important; }
.text-mobile-lg { font-size: 27px !important; }
.font-30-mobile { font-size: 30px !important; }
.font-35-mobile, .text-mobile-xl { font-size: 35px !important; }
.font-40-mobile { font-size: 40px !important; }
.font-45-mobile { font-size: 45px !important; }
.font-50-mobile { font-size: 50px !important; }
.font-55-mobile, .text-mobile-xxl { font-size: 55px !important; }
.text-mobile-extreme { font-size: 120px !important; }
}
/* Text Align Center for Mobile */
@media only screen and (max-width: 768px)
{
.t-center-sm, .t-center-sm > .row, .t-center-sm.row, .t-center-mobile, .t-center-mobile > .row, .t-center-mobile.row { text-align: center !important; justify-content: center; }
}
@media only screen and (max-width: 576px)
{
.t-center-xs, .t-center-xs > .row, .t-center-xs.row { text-align: center !important; justify-content: center; }
}
/* Text Align Center for Mobile */
.badge { display: inline-block; min-width: 15px; padding: 3px 10px; font-size: 11px; margin: 0 3px; font-weight: inherit; color: #FFF; line-height: normal; text-align: center; white-space: nowrap; vertical-align: middle; background-color: #777; border-radius: 10px; }
.badge.badge-lg { padding: 5px 14px; font-size: inherit; font-weight: inherit; }
.disable-hover, .disable-hover * { pointer-events: none !important; }
.label { display: inline; padding: 0.2em 0.6em 0.3em; font-size: 75%; font-weight: 700; line-height: 1; color: #FFF; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 0.25em; }
/* Display Settings */
.white, .white-hover:hover { color: white !important; }
.rs-parallaxlevel-1 span { color: #90162D !important; }
.page-content.white { background: #90162D !important; }
.bg-white, .bg-white-hover:hover, .bg-white-focus:focus { background-color: white !important; }
.dark, .dark-hover:hover { color: #333 !important; }
.black, .black-hover:hover { color: #000 !important; }
.bg-dark, .bg-dark-hover:hover { background-color: #3E0A14 !important; }
.bg-dark1, .bg-dark1-hover:hover { background-color: #191919 !important; }
.bg-dark2, .bg-dark2-hover:hover { background-color: #161616 !important; }
.bg-dark3, .bg-dark3-hover:hover { background-color: #111 !important; }
.bg-night, .bg-night-hover:hover { background-color: #1B1C1F !important; }
.bg-night1, .bg-night1-hover:hover { background-color: #191A1C !important; }
.bg-night2, .bg-night2-hover:hover { background-color: #151718 !important; }
.bg-night3, .bg-night3-hover:hover { background-color: #111213 !important; }
.bg-black, .bg-black-hover:hover { background-color: #000 !important; }
.opacity-hover:hover, .opacity-hover-container > *:hover, .opacity-hover-links a:hover, .opacity-hover-links button:hover { opacity: 0.7 !important; }
.opacity-hover-reverse { opacity: 0.7; }
.opacity-hover-reverse:hover { opacity: 1 !important; }
.border-white, .border-white-hover:hover { border-color: white !important; }
.border-transparent, .border-transparent-hover:hover { border-color: transparent !important; }
.dark-section { background-color: #222; color: #CCC; }
.transparent, .transparent-hover:hover { background: transparent !important; }
.fullwidth, .width-full { width: 100%; }
.fullheight { height: 100% !important; }
.bodywidth { margin: 0 auto; }
.fullscreen { width: 100%; min-height: 100%; left: 0; top: 0; }
.bg-changeable { -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; }
.bg-pattern, .bg-pattern > .bg-animator:after { background-repeat: repeat !important; background-size: auto auto !important; }
.pattern:after { background-image: url(../images/pattern.png); background-repeat: repeat; background-size: auto; }
.pattern1:after { background-image: url(../images/pattern1.jpg); background-repeat: repeat; background-size: auto; }
.pattern-black:after { background-image: url(../images/pattern-black.png); background-repeat: repeat; background-size: auto; }
.pattern-white:after { background-image: url(../images/pattern-white.png); background-repeat: repeat; background-size: auto; }
.halfwidth { width: 50%; max-width: 50%; }
.width-auto { width: auto !important; }
.height-auto { height: auto; }
@media only screen and (max-width: 768px)
{
.height-auto-mobile { height: auto !important; }
.mnh-auto-mobile { min-height: auto !important; }
.relative-xs, .relative-mobile { position: relative !important; }
}
.mxw-full { max-width: 100%; }
.mxh-full { max-height: 100%; }
.relative { position: relative !important; }
.absolute { position: absolute; }
.absolute-im { position: absolute !important; }
.fixed { position: fixed; }
.fixed-im { position: fixed !important; }
.block, .block-links > a, .all-block-links a { display: block; }
.inline-block, .inline-block-links > a { display: inline-block !important; }
.block-im { display: block !important; }
.table { display: table; }
.table-im { display: table !important; }
@media only screen and (max-width: 768px)
{
.block-mobile { display: block !important; }
.inline-block-mobile { display: inline-block !important; }
}
.none { display: none !important; }
.nowrap { white-space: nowrap; }
.ws-normal { white-space: normal; }
.f-left { float: left !important; }
.f-right { float: right !important; }
.f-none { float: none !important; }
.no-padding { padding: 0 !important; }
.no-pt { padding-top: 0 !important; }
.no-pl { padding-left: 0 !important; }
.no-pr { padding-right: 0 !important; }
.no-pb { padding-bottom: 0 !important; }
.no-px { padding-left: 0 !important; padding-right: 0 !important; }
.z-index-0 { z-index: 0; }
.z-index-1 { z-index: 1; }
.z-index-2 { z-index: 2; }
.no-margin { margin: 0 !important; }
.no-mt { margin-top: 0 !important; }
.no-ml { margin-left: 0 !important; }
.no-mr { margin-right: 0 !important; }
.no-mb { margin-bottom: 0 !important; }
.no-mx { margin-left: 0 !important; margin-right: 0 !important; }
.no-margin-im { margin: 0 !important; }
@media only screen and (max-width: 768px)
{
.f-none-mobile, .f-none-sm { float: none !important; }
}
.no-pm { padding: 0; margin: 0; }
.no-pm-im { padding: 0 !important; margin: 0 !important; }
.no-radius, .no-radius-hover:hover { border-radius: 0 !important; }
.radius, .radius-hover:hover { border-radius: 5px !important; }
.radius-sm, .radius-sm-hover:hover { border-radius: 6px !important; }
.radius-md, .radius-md-hover:hover { border-radius: 12px !important; }
.radius-lg, .radius-lg-hover:hover { border-radius: 40px !important; }
.radius-xl, .radius-xl-hover:hover { border-radius: 60px !important; }
.radius-no-lt { border-top-left-radius: 0px !important; }
.radius-no-rt { border-top-right-radius: 0px !important; }
.radius-no-lb { border-bottom-left-radius: 0px !important; }
.radius-no-rb { border-bottom-right-radius: 0px !important; }
.radius-no-right { border-bottom-right-radius: 0px !important; border-top-right-radius: 0px !important; }
.radius-no-left { border-bottom-left-radius: 0px !important; border-top-left-radius: 0px !important; }
.no-border { border: none !important; }
.m-auto { margin-left: auto; margin-right: auto; }
@media only screen and (max-width: 768px)
{
.m-auto-mobile { margin-left: auto !important; margin-right: auto !important; }
}
.o-hidden { overflow: hidden; }
.o-scroll { overflow: scroll; }
.o-auto { overflow: auto; }
.o-visible { overflow: visible !important; }
.c-pointer { cursor: pointer; }
.c-default { cursor: default; }
.c-disabled { cursor: not-allowed; }
.c-move { cursor: move; }
.c-resize { cursor: ew-resize; }
.c-vertical-resize { cursor: ns-resize; }
.c-grab { cursor: grab !important; cursor: -moz-grab !important; cursor: -webkit-grab !important; }
.c-grab:active { cursor: grabbing; cursor: -moz-grabbing; cursor: -webkit-grabbing; }
.border-none, .border-none-links a { border: none !important; }
.no-border-top { border-top: none !important; }
.no-border-right { border-right: none !important; }
.no-border-bottom { border-bottom: none !important; }
.no-border-left { border-left: none !important; }
.bt-1, .bb-1, .bl-1, .br-1, .border-1, .border-2, .border-3, .border-4, .border-5 { border-style: solid; }
*[class*="bt-"], *[class*="bl-"], *[class*="br-"], *[class*="bb-"] { border-style: solid; }
.border-dotted, .b-dotted { border-style: dotted !important; }
.border-dashed, .b-dashed { border-style: dashed !important; }
.border-solid, .b-solid, .solid { border-style: solid !important; }
.bs-none, .bs-none-hover:hover, .bs-none-focus:focus { box-shadow: none !important; }
.bs-sm, .bs-sm-hover:hover, .bs-sm-focus:focus { box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1) !important; }
.box-shadow, .bs-hover:hover, .bs-focus:focus { box-shadow: 2px 10px 25px 0px rgba(0, 0, 0, 0.2) !important; }
.bs-light, .bs-light-hover:hover, .bs-light-focus:focus { box-shadow: 2px 10px 25px 0px rgba(0, 0, 0, 0.06) !important; }
.bs-md, .bs-md-hover:hover, .bs-md-focus:focus { box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.1) !important; }
.bs-lg, .bs-lg-hover:hover, .bs-lg-focus:focus { box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.2) !important; }
.bs-xl, .bs-xl-hover:hover, .bs-xl-focus:focus { box-shadow: 2px 25px 65px 5px rgba(0, 0, 0, 0.2) !important; }
.bs-inset, .bs-inset-hover:hover, .bs-inset-focus:focus { -webkit-box-shadow: 0 18px 36px -13px rgba(0,0,0,0.5) !important; -moz-box-shadow: 0 18px 36px -13px rgba(0,0,0,0.5) !important; box-shadow: 0 21px 42px -14px rgba(0, 0, 0, 0.5) !important; }
.slow { -webkit-transition: all 0.3s !important; -moz-transition: all 0.3s !important; transition: all 0.3s !important; }
.slow1 { -webkit-transition: all 0.2s !important; -moz-transition: all 0.2s !important; transition: all 0.2s !important; }
.slow-qdr { -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; -moz-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; }
.vertical-center { top: 50%; position: relative; }
.move-up-half { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.v-center, .v-center-mb { top: 50%; position: relative; will-change: transform; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
@media only screen and (max-width: 768px)
{
.v-normal-mobile, .v-normal-mb { top: 0% !important; padding-top: 15px !important; padding-bottom: 15px !important; position: relative; -webkit-transform: translateY(0%) !important; -moz-transform: translateY(0) !important; -ms-transform: translateY(0%) !important; transform: translateY(0%) !important; }
.v-center-mb { padding-top: 0 !important; padding-bottom: 0 !important; }
}
.v-top { display: table-cell; vertical-align: top !important; }
.v-middle { display: table-cell !important; vertical-align: middle !important; }
.v-bottom { display: table-cell !important; vertical-align: bottom !important; }
.vertical-col-lines { position: fixed; left: 0; top: 0; right: 0; bottom: 0; }
.vertical-col-lines div { height: 100%; padding: 0; border-right: 1px solid rgba(118, 118, 118, 0.14); }
.container-xl { height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 15px; padding-right: 15px; }
.container-lg { max-width: 1620px; height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }
body.left-side-menu-active .container-md, body.right-side-menu-active .container-md, body.left-side-menu-active .container-lg, body.right-side-menu-active .container-lg { padding-left: 15px; padding-right: 15px; }
@media only screen and (max-width: 1630px)
{
.container-lg { padding-left: 15px; padding-right: 15px; }
}
.container-md { max-width: 1440px; height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 1455px)
{
.container-md { padding-left: 15px; padding-right: 15px; }
}
.container { max-width: 1200px; height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 1441px)
{
.container { max-width: 1000px; padding-left: 15px; padding-right: 15px; }
}
.container-sm { max-width: 900px; height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 915px)
{
.container-sm { padding-left: 15px; padding-right: 15px; }
}
.container-xs { max-width: 480px; height: auto; display: block; width: 100%; margin: 0 auto; padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 495px)
{
.container-xs { padding-left: 15px; padding-right: 15px; }
}
@media only screen and (max-width: 1485px)
{
body.left-side-menu-active .container, body.right-side-menu-active .container { padding-left: 15px; padding-right: 15px; }
}
.width-calculated { margin: 0 !important; display: block !important; float: left !important; }
.bg-left, .bg-left > .bg-animator:after { background-position: left !important; }
.bg-right, .bg-right > .bg-animator:after { background-position: right !important; }
.bg-top, .bg-top > .bg-animator:after { background-position: top !important; }
.bg-bottom, .bg-bottom > .bg-animator:after { background-position: bottom !important; }
.bg-center, .bg-center > .bg-animator:after { background-position: center center !important; }
@media only screen and (max-width: 1024px)
{
.bg-left-mobile { background-position: left !important; }
.bg-right-mobile { background-position: right !important; }
.bg-top-mobile { background-position: top !important; }
.bg-bottom-mobile { background-position: bottom !important; }
.bg-center-mobile { background-position: center center !important; }
.bg-none-mobile { background-image: none !important; }
}
.bg-norepeat, .bg-norepeat > .bg-animator:after { background-repeat: no-repeat !important; }
.bg-repeatx, .bg-repeatx > .bg-animator:after { background-repeat: repeat-x !important; }
.bg-repeaty, .bg-repeaty > .bg-animator:after { background-repeat: repeat-y !important; }
.bg-repeat { background-repeat: repeat !important; }
.bg-scroll { background-attachment: scroll !important; }
.bg-normal, .bg-normal > .bg-animator:after { background-size: auto !important; }
.bg-fixed, .bg-fixed > .bg-animator:after { background-attachment: fixed !important; }
.bg-cover, .bg-cover > .bg-animator:after { background-size: cover !important; }
.bg-size-fullheight { background-size: auto 100% !important; }
.bg-default { background-color: #4B515D !important; }
.bg-primary { background-color: #4285F4 !important; }
.bg-success { background-color: #5CB85C !important; }
.bg-secondary { background-color: #D790E7 !important; }
.bg-danger { background-color: #DB2929 !important; }
.bg-warning { background-color: #F0AD4E !important; }
.bg-info { background-color: #33B5E5 !important; }
.bg-transparent { background-color: transparent !important; }
.rotate-45 { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.rotate-45-reverse { -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.rotate-90 { -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.rotate-90-reverse { -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
.cover { background-size: cover !important; }
.circle, .circle-hover:hover { border-radius: 100% !important; }
.top-50-percent { top: 50% !important; }
.left-50-percent { left: 50% !important; }
.right-50-percent { right: 50% !important; }
.bottom-50-percent { bottom: 50% !important; }
@media only screen and (max-width: 768px)
{
.calculate-height.height-auto-xs > *, .calculate-height.height-auto-mobile > * { height: auto !important; }
.calculate-width.width-auto-xs > *, .calculate-width.width-auto-mobile > * { width: auto !important; }
}
.dropcap:first-letter { color: inherit; float: left; font-family: Georgia; font-size: 65px; line-height: 50px; padding-top: 5px; padding-right: 10px; padding-left: 2px; }
.dropcap.dropcap-bg:first-letter { color: white; background-color: #333; font-size: 45px; line-height: 33px; padding: 8px 8px 8px 6px; margin-right: 8px; margin-top: 4px; }
.dropcap.dropcap-bg.dropcap-radius:first-letter { border-radius: 8px; }
.dropcap.dropcap-bg.dropcap-border:first-letter { border: 1px solid #CCC; }
.dropcap.dropcap-sm:first-letter { font-size: 30px; line-height: 22px; }
.dropcap.dropcap-lg:first-letter { font-size: 60px; line-height: 47px; }
.dropcap.dropcap-xl:first-letter { font-size: 80px; line-height: 67px; }
@media only screen and (min-width: 1025px)
{
[data-background] { opacity: 0; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }
[data-background].loaded, .slick-slider [data-background] { opacity: 1; }
}
/* Dropcap Background colors */
.dropcap.dropcap-bg.white-bg:first-letter { color: inherit; background-color: #FFF; }
.dropcap.dropcap-bg.light-bg:first-letter { color: inherit; background-color: #EEE; }
.dropcap.dropcap-bg.danger-bg:first-letter { color: white; background-color: #CC0000; }
.dropcap.dropcap-bg.warning-bg:first-letter { color: white; background-color: #FFBB33; }
.dropcap.dropcap-bg.success-bg:first-letter { color: white; background-color: #00C851; }
.dropcap.dropcap-bg.info-bg:first-letter { color: white; background-color: #33B5E5; }
.dropcap.dropcap-bg.default-bg:first-letter { color: white; background-color: #2BBBAD; }
.dropcap.dropcap-bg.primary-bg:first-letter { color: white; background-color: #4285F4; }
.dropcap.dropcap-bg.secondary-bg:first-letter { color: white; background-color: #AA66CC; }
.video-trigger { position: relative; }
.video-play-trigger { width: 100%; height: 100%; left: 0; top: 0; position: absolute; background-size: cover; background-position: center center; z-index: 15; }
.video-play-trigger span { display: block; margin: 0 auto; top: 50%; text-align: center; position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
iframe { width: 100%; }
.video-trigger iframe { min-height: 300px; }
/* Video Trigger in slider */
.video-trigger.slick-slide img, .slick-slide .video-trigger img { width: auto; height: auto; margin: 0 auto; }
.thumbnail-img { padding: 4px; display: inline-block; position: relative; width: auto; max-width: 100%; background-color: transparent; border: 1px solid #DDD; border-radius: 5px; }
.thumbnail-img.circle { border-radius: 100%; padding: 4px; }
.thumbnail-img.thumbnail-xxs { max-width: 60px; }
.thumbnail-img.thumbnail-xs { max-width: 90px; }
.thumbnail-img.thumbnail-sm { max-width: 120px; }
.thumbnail-img.thumbnail-lg { max-width: 160px; }
.thumbnail-img.circle img { border-radius: 100%; }
.img-overlay, .static-overlay { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5; background-color: rgba(0, 0, 0, 0.6); opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.img-overlay:hover, .static-overlay { opacity: 1 !important; }
.thumbnail-img .img-overlay { left: 4px; top: 4px; bottom: 4px; right: 4px; width: auto; height: auto; }
.img-overlay .overlay-wrap, .static-overlay .overlay-wrap { position: relative; left: 0; top: 0; width: 100%; height: 100%; color: white; text-align: center; display: table; }
.img-overlay .overlay-wrap > *, .static-overlay .overlay-wrap > * { display: table-cell; vertical-align: middle; }
.overlay { position: absolute !important; width: 100%; height: 100%; display: block; left: 0; top: 0; z-index: 1; background-size: cover; background-position: center center; }
.static-overlay { background-color: transparent; }
.block-img img { width: 100%; }
.block-img img[src*="loading"], .block-img img[src*="loader"] { width: auto; margin: 20px auto; display: block; }
.image-left { float: left; margin-right: 15px; margin-bottom: 10px; }
.image-right { float: right; margin-left: 15px; margin-bottom: 10px; }
.mxw-full { max-width: 100% !important; }
label { font-weight: 400; }
.text-rotator > .animated { display: inline-block; visibility: visible; }
.text-rotator.padding > .animated { padding: 10px 6px 14px; }
.text-rotator.mini-padding > .animated { padding: 0px 4px; }
pre { border: 1px solid #DDD; line-height: 25px; max-height: 400px; padding: 12px 16px; }
.sticky-keeper { position: relative; }
@media only screen and (max-width: 1000px)
{
.sticky-keeper .sticky-container { position: relative !important; top: 0 !important; width: auto !important; max-width: none !important; }
}
/* Section Colors, tones of gray, white and black */
.bg-soft { position: relative; }
.bg-soft-colored2:before, .bg-soft-gradient:before, .bg-soft-gradient1:before, .bg-soft-gradient2:before, .bg-soft-gradient3:before, .bg-soft-gradient4:before { opacity: 0.9; }
.bg-soft > *, .bg-soft-colored > *, .bg-soft-colored1 > *, .bg-soft-colored2 > *, .bg-soft-colored3 > *, .pattern > *, .pattern1 > *, .pattern-black > *, .pattern-white > * { position: relative; z-index: 2; }
.bg-soft:before, .bg-soft-colored:before, .bg-soft-colored1:before, .bg-soft-colored2:before, .bg-soft-colored3:before, .bg-soft-gradient:before, .bg-soft-gradient1:before, .bg-soft-gradient2:before, .pattern:after, .pattern1:after, .pattern-black:after, .pattern-white:after { position: absolute; display: block; left: 0px; top: 0px; right: 0px; bottom: 0px; content: ''; z-index: 1; }
/* White Tones */
.bg-soft-white:before, .bg-soft-white-hover:hover:before, .bg-soft-white9:before, .bg-soft-white9-hover:hover:before { background-color: rgba(255, 255, 255, 0.9); }
.bg-soft-white1:before, .bg-soft-white1-hover:hover:before { background-color: rgba(255, 255, 255, 0.1); }
.bg-soft-white2:before, .bg-soft-white2-hover:hover:before { background-color: rgba(255, 255, 255, 0.2); }
.bg-soft-white3:before, .bg-soft-white3-hover:hover:before { background-color: rgba(255, 255, 255, 0.3); }
.bg-soft-white4:before, .bg-soft-white4-hover:hover:before { background-color: rgba(255, 255, 255, 0.4); }
.bg-soft-white5:before, .bg-soft-white5-hover:hover:before { background-color: rgba(255, 255, 255, 0.5); }
.bg-soft-white6:before, .bg-soft-white6-hover:hover:before { background-color: rgba(255, 255, 255, 0.6); }
.bg-soft-white7:before, .bg-soft-white7-hover:hover:before { background-color: rgba(255, 255, 255, 0.7); }
.bg-soft-white8:before, .bg-soft-white8-hover:hover:before { background-color: rgba(255, 255, 255, 0.8); }
/* Dark Tones */
.bg-soft-dark:before, .bg-soft-dark-hover:hover:before, .bg-soft-dark9:before, .bg-soft-dark9-hover:hover:before { background-color: rgba(25, 25, 25, 0.9); }
.bg-soft-dark1:before, .bg-soft-dark1-hover:hover:before { background-color: rgba(25, 25, 25, 0.1); }
.bg-soft-dark2:before, .bg-soft-dark2-hover:hover:before { background-color: rgba(25, 25, 25, 0.2); }
.bg-soft-dark3:before, .bg-soft-dark3-hover:hover:before { background-color: rgba(25, 25, 25, 0.3); }
.bg-soft-dark4:before, .bg-soft-dark4-hover:hover:before { background-color: rgba(25, 25, 25, 0.4); }
.bg-soft-dark5:before, .bg-soft-dark5-hover:hover:before { background-color: rgba(25, 25, 25, 0.5); }
.bg-soft-dark6:before, .bg-soft-dark6-hover:hover:before { background-color: rgba(25, 25, 25, 0.6); }
.bg-soft-dark7:before, .bg-soft-dark7-hover:hover:before { background-color: rgba(25, 25, 25, 0.7); }
.bg-soft-dark8:before, .bg-soft-dark8-hover:hover:before { background-color: rgba(25, 25, 25, 0.8); }
.bg-soft-black:before, .bg-soft-black-hover:hover:before { background-color: rgba(0, 0, 0, 0.6); }
.bg-soft-black1:before, .bg-soft-black1-hover:hover:before { background-color: rgba(0, 0, 0, 0.9); }
/* Gray Tones */
.bg-gray, .bg-gray-hover:hover { background-color: #FCFCFC !important; }
.bg-gray1, .bg-gray1-hover:hover { background-color: #F8F8F8 !important; }
.bg-gray2, .bg-gray2-hover:hover { background-color: #F1F1F1 !important; }
.bg-gray3, .bg-gray3-hover:hover { background-color: #E4E4E4 !important; }
.bg-gray4, .bg-gray4-hover:hover { background-color: #CCC !important; }
.bg-gray5, .bg-gray5-hover:hover { background-color: #AAA !important; }
.bg-gray6, .bg-gray6-hover:hover { background-color: #999 !important; }
.bg-gray7, .bg-gray7-hover:hover { background-color: #777 !important; }
.bg-gray8, .bg-gray8-hover:hover { background-color: #555 !important; }
.bg-gray9, .bg-gray9-hover:hover { background-color: #333 !important; }
/* Gray Colors */
.gray, .gray-hover:hover { color: #FCFCFC !important; }
.gray1, .gray1-hover:hover { color: #F8F8F8 !important; }
.gray2, .gray2-hover:hover { color: #F1F1F1 !important; }
.gray3, .gray3-hover:hover { color: #E4E4E4 !important; }
.gray4, .gray4-hover:hover { color: #CCC !important; }
.gray5, .gray5-hover:hover { color: #FFFFFF !important; font-weight: bold; }
#layer-365093369.slide-title { color: #90162D !important; }
.gray6, .gray6-hover:hover { color: #999 !important; }
.gray7, .gray7-hover:hover { color: #777 !important; }
.gray8, .gray8-hover:hover { color: #FFFFFF !important; }
.gray9, .gray9-hover:hover { color: #383838 !important; }
/* Paddings, Margins */
/* Paddings */
.mini-py { padding-top: 5px !important; padding-bottom: 5px !important; }
.mini-px { padding-left: 5px !important; padding-right: 5px !important; }
.mini-pt { padding-top: 5px !important; }
.mini-pr { padding-right: 5px !important; }
.mini-pb { padding-bottom: 5px !important; }
.mini-pl { padding-left: 5px !important; }
.xxs-py { padding-top: 15px !important; padding-bottom: 15px !important; }
.xxs-px { padding-left: 15px !important; padding-right: 15px !important; }
.xxs-pt { padding-top: 15px !important; }
.xxs-pr { padding-right: 15px !important; }
.xxs-pb { padding-bottom: 15px !important; }
.xxs-pl { padding-left: 15px !important; }
.xs-py { padding-top: 30px !important; padding-bottom: 30px !important; }
.xs-px { padding-left: 30px !important; padding-right: 30px !important; }
.xs-pt { padding-top: 30px !important; }
.xs-pr { padding-right: 30px !important; }
.xs-pb { padding-bottom: 30px !important; }
.xs-pl { padding-left: 30px !important; }
.sm-py { padding-top: 50px !important; padding-bottom: 50px !important; }
.sm-px { padding-left: 50px !important; padding-right: 50px !important; }
.sm-pt { padding-top: 50px !important; }
.sm-pr { padding-right: 50px !important; }
.sm-pb { padding-bottom: 50px !important; }
.sm-pl { padding-left: 50px !important; }
.py { padding-top: 100px !important; padding-bottom: 100px !important; }
.px { padding-left: 100px !important; padding-right: 100px !important; }
.pt { padding-top: 100px !important; }
.pr { padding-right: 100px !important; }
.pb { padding-bottom: 100px !important; }
.pl { padding-left: 100px !important; }
.md-py { padding-top: 150px !important; padding-bottom: 150px !important; }
.md-px { padding-left: 150px !important; padding-right: 150px !important; }
.md-pt { padding-top: 150px !important; }
.md-pr { padding-right: 150px !important; }
.md-pb { padding-bottom: 150px !important; }
.md-pl { padding-left: 150px !important; }
.lg-py { padding-top: 200px !important; padding-bottom: 200px !important; }
.lg-px { padding-left: 200px !important; padding-right: 200px !important; }
.lg-pt { padding-top: 200px !important; }
.lg-pr { padding-right: 200px !important; }
.lg-pb { padding-bottom: 200px !important; }
.lg-pl { padding-left: 200px !important; }
.xl-py { padding-top: 250px !important; padding-bottom: 250px !important; }
.xl-px { padding-left: 250px !important; padding-right: 250px !important; }
.xl-pt { padding-top: 250px !important; }
.xl-pr { padding-right: 250px !important; }
.xl-pb { padding-bottom: 250px !important; }
.xl-pl { padding-left: 250px !important; }
.xxl-py { padding-top: 350px !important; padding-bottom: 350px !important; }
.xxl-px { padding-left: 350px !important; padding-right: 350px !important; }
.xxl-pt { padding-top: 350px !important; }
.xxl-pr { padding-right: 350px !important; }
.xxl-pb { padding-bottom: 350px !important; }
.xxl-pl { padding-left: 350px !important; }
/* Margins */
.mini-my { margin-top: 5px !important; margin-bottom: 5px !important; }
.mini-mx { margin-left: 5px !important; margin-right: 5px !important; }
.mini-mt { margin-top: 5px !important; }
.mini-mr { margin-right: 5px !important; }
.mini-mb { margin-bottom: 5px !important; }
.mini-ml { margin-left: 5px !important; }
.xxs-my { margin-top: 15px !important; margin-bottom: 15px !important; }
.xxs-mx { margin-left: 15px !important; margin-right: 15px !important; }
.xxs-mt { margin-top: 15px !important; }
.xxs-mr { margin-right: 15px !important; }
.xxs-mb { margin-bottom: 15px !important; }
.xxs-ml { margin-left: 15px !important; }
.xs-my { margin-top: 30px !important; margin-bottom: 30px !important; }
.xs-mx { margin-left: 30px !important; margin-right: 30px !important; }
.xs-mt { margin-top: 30px !important; }
.xs-mr { margin-right: 30px !important; }
.xs-mb { margin-bottom: 30px !important; }
.xs-ml { margin-left: 30px !important; }
.sm-my { margin-top: 50px !important; margin-bottom: 50px !important; }
.sm-mx { margin-left: 50px !important; margin-right: 50px !important; }
.sm-mt { margin-top: 50px !important; }
.sm-mr { margin-right: 50px !important; }
.sm-mb { margin-bottom: 50px !important; }
.sm-ml { margin-left: 50px !important; }
.my { margin-top: 100px !important; margin-bottom: 100px !important; }
.mx { margin-left: 100px !important; margin-right: 100px !important; }
.mt { margin-top: 100px !important; }
.mr { margin-right: 100px !important; }
.mb { margin-bottom: 100px !important; }
.ml { margin-left: 100px !important; }
.md-my { margin-top: 150px !important; margin-bottom: 150px !important; }
.md-mx { margin-left: 150px !important; margin-right: 150px !important; }
.md-mt { margin-top: 150px !important; }
.md-mr { margin-right: 150px !important; }
.md-mb { margin-bottom: 150px !important; }
.md-ml { margin-left: 150px !important; }
.lg-my { margin-top: 200px !important; margin-bottom: 200px !important; }
.lg-mx { margin-left: 200px !important; margin-right: 200px !important; }
.lg-mt { margin-top: 200px !important; }
.lg-mr { margin-right: 200px !important; }
.lg-mb { margin-bottom: 200px !important; }
.lg-ml { margin-left: 200px !important; }
.xl-my { margin-top: 250px !important; margin-bottom: 250px !important; }
.xl-mx { margin-left: 250px !important; margin-right: 250px !important; }
.xl-mt { margin-top: 250px !important; }
.xl-mr { margin-right: 250px !important; }
.xl-mb { margin-bottom: 250px !important; }
.xl-ml { margin-left: 250px !important; }
.xxl-my { margin-top: 350px !important; margin-bottom: 350px !important; }
.xxl-mx { margin-left: 350px !important; margin-right: 350px !important; }
.xxl-mt { margin-top: 350px !important; }
.xxl-mr { margin-right: 350px !important; }
.xxl-mb { margin-bottom: 350px !important; }
.xxl-ml { margin-left: 350px !important; }
/* Paddings, Margins for mobile */
@media only screen and (max-height: 890px)
{
.md-py { padding-top: 130px !important; padding-bottom: 130px !important; }
.lg-py { padding-top: 160px !important; padding-bottom: 160px !important; }
.xl-py { padding-top: 190px !important; padding-bottom: 190px !important; }
.xxl-py { padding-top: 270px !important; padding-bottom: 270px !important; }
}
@media only screen and (max-height: 700px)
{
.md-py { padding-top: 110px !important; padding-bottom: 110px !important; }
.lg-py { padding-top: 130px !important; padding-bottom: 130px !important; }
.xl-py { padding-top: 150px !important; padding-bottom: 150px !important; }
.xxl-py { padding-top: 230px !important; padding-bottom: 230px !important; }
}
@media only screen and (max-width: 768px)
{
.no-pm-mobile { margin: 0 !important; padding: 0 !important; }
.no-padding-mobile { padding: 0 !important; }
.no-py-mobile { padding-top: 0 !important; padding-bottom: 0 !important; }
.no-px-mobile { padding-left: 0 !important; padding-right: 0 !important; }
.no-pl-mobile { padding-left: 0 !important; }
.no-pr-mobile { padding-right: 0 !important; }
.no-pt-mobile { padding-top: 0 !important; }
.no-pb-mobile { padding-bottom: 0 !important; }
.mini-py-mobile { padding-top: 5px !important; padding-bottom: 5px !important; }
.mini-px-mobile { padding-left: 5px !important; padding-right: 5px !important; }
.mini-pt-mobile { padding-top: 5px !important; }
.mini-pr-mobile { padding-right: 5px !important; }
.mini-pb-mobile { padding-bottom: 5px !important; }
.mini-pl-mobile { padding-left: 5px !important; }
.xxs-py-mobile { padding-top: 15px !important; padding-bottom: 15px !important; }
.xxs-px-mobile { padding-left: 15px !important; padding-right: 15px !important; }
.xxs-pt-mobile { padding-top: 15px !important; }
.xxs-pr-mobile { padding-right: 15px !important; }
.xxs-pb-mobile { padding-bottom: 15px !important; }
.xxs-pl-mobile { padding-left: 15px !important; }
.xs-py-mobile { padding-top: 30px !important; padding-bottom: 30px !important; }
.xs-px-mobile { padding-left: 30px !important; padding-right: 30px !important; }
.xs-pt-mobile { padding-top: 30px !important; }
.xs-pr-mobile { padding-right: 30px !important; }
.xs-pb-mobile { padding-bottom: 30px !important; }
.xs-pl-mobile { padding-left: 30px !important; }
.sm-py-mobile { padding-top: 50px !important; padding-bottom: 50px !important; }
.sm-px-mobile { padding-left: 50px !important; padding-right: 50px !important; }
.sm-pt-mobile { padding-top: 50px !important; }
.sm-pr-mobile { padding-right: 50px !important; }
.sm-pb-mobile { padding-bottom: 50px !important; }
.sm-pl-mobile { padding-left: 50px !important; }
.py-mobile { padding-top: 100px !important; padding-bottom: 100px !important; }
.px-mobile { padding-left: 100px !important; padding-left: 100px !important; }
.pt-mobile { padding-top: 100px !important; }
.pr-mobile { padding-right: 100px !important; }
.pb-mobile { padding-bottom: 100px !important; }
.pl-mobile { padding-left: 100px !important; }
.md-py-mobile { padding-top: 150px !important; padding-bottom: 150px !important; }
.md-px-mobile { padding-left: 150px !important; padding-right: 150px !important; }
.md-pt-mobile { padding-top: 150px !important; }
.md-pr-mobile { padding-right: 150px !important; }
.md-pb-mobile { padding-bottom: 150px !important; }
.md-pl-mobile { padding-left: 150px !important; }
.lg-py-mobile { padding-top: 200px !important; padding-bottom: 200px !important; }
.lg-px-mobile { padding-left: 200px !important; padding-right: 200px !important; }
.lg-pt-mobile { padding-top: 200px !important; }
.lg-pr-mobile { padding-right: 200px !important; }
.lg-pb-mobile { padding-bottom: 200px !important; }
.lg-pl-mobile { padding-left: 200px !important; }
/* Margins */
.no-margin-mobile { margin: 0 !important; }
.no-my-mobile { margin-top: 0 !important; margin-bottom: 0 !important; }
.no-mx-mobile { margin-left: 0 !important; margin-right: 0 !important; }
.no-ml-mobile { margin-left: auto !important; }
.no-mr-mobile { margin-right: auto !important; }
.no-mt-mobile { margin-top: 0 !important; }
.no-mb-mobile { margin-bottom: 0 !important; }
.mini-my-mobile { margin-top: 5px !important; margin-bottom: 5px !important; }
.mini-mx-mobile { margin-left: 5px !important; margin-right: 5px !important; }
.mini-mt-mobile { margin-top: 5px !important; }
.mini-mr-mobile { margin-right: 5px !important; }
.mini-mb-mobile { margin-bottom: 5px !important; }
.mini-ml-mobile { margin-left: 5px !important; }
.xxs-my-mobile { margin-top: 15px !important; margin-bottom: 15px !important; }
.xxs-mx-mobile { margin-left: 15px !important; margin-right: 15px !important; }
.xxs-mt-mobile { margin-top: 15px !important; }
.xxs-mr-mobile { margin-right: 15px !important; }
.xxs-mb-mobile { margin-bottom: 15px !important; }
.xxs-ml-mobile { margin-left: 15px !important; }
.xs-my-mobile { margin-top: 30px !important; margin-bottom: 30px !important; }
.xs-mx-mobile { margin-left: 30px !important; margin-right: 30px !important; }
.xs-mt-mobile { margin-top: 30px !important; }
.xs-mr-mobile { margin-right: 30px !important; }
.xs-mb-mobile { margin-bottom: 30px !important; }
.xs-ml-mobile { margin-left: 30px !important; }
.sm-my-mobile { margin-top: 50px !important; margin-bottom: 50px !important; }
.sm-mx-mobile { margin-left: 50px !important; margin-right: 50px !important; }
.sm-mt-mobile { margin-top: 50px !important; }
.sm-mr-mobile { margin-right: 50px !important; }
.sm-mb-mobile { margin-bottom: 50px !important; }
.sm-ml-mobile { margin-left: 50px !important; }
.my-mobile { margin-top: 100px !important; margin-bottom: 100px !important; }
.mx-mobile { margin-left: 100px !important; margin-right: 100px !important; }
.mt-mobile { margin-top: 100px !important; }
.mr-mobile { margin-right: 100px !important; }
.mb-mobile { margin-bottom: 100px !important; }
.ml-mobile { margin-left: 100px !important; }
}
/* Title Strips */
.title-strips { width: 100px; height: 1px; background-color: #C4C4C4; margin: 10px auto 30px; }
.title-strips:after { content: ''; width: 70px; height: 1px; position: relative; top: 8px; left: 15px; display: block; background-color: #C4C4C4; }
.title-strips.strips-left { margin-left: 0; }
.title-strips.strips-left:after { left: 0; }
.title-strips-over { width: 230px; height: 1px; padding: 0 !important; background-color: rgba(255, 255, 255, 0.4); position: relative; margin: 14px 0; }
.t-center .title-strips-over { margin: 14px auto; }
.t-right .title-strips-over, .t-left .title-strips-over { display: inline-block; }
.title-strips-over:before { width: 115px; height: 1px; background-color: rgba(255, 255, 255, 0.4); content: ''; position: absolute; left: 0; top: 0; }
.t-center .title-strips-over:before { left: 50%; margin-left: -57px; }
.t-right .title-strips-over:before { right: 0%; left: auto; }
.t-left .title-strips-over:before { left: 0%; right: auto; margin-left: 0; }
.title-strips-over.dark { background-color: rgba(0, 0, 0, 0.2); }
.title-strips-over.dark:before { background-color: rgba(0, 0, 0, 0.3); }
/* Hr spaces */
hr { border: none; height: 1px; margin: 10px 0; }
hr.white { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(180, 180, 180, 1) 48%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(229, 229, 229, 0.3) 48%, rgba(0, 0, 0, 0) 100%); }
hr.black { background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(20, 20, 20, 0.15) 48%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(20, 20, 20, 0.15) 48%, rgba(0, 0, 0, 0) 100%); }
/* Border Styles */
.border-1 { border-width: 1px; }
.border-2 { border-width: 2px; }
.border-3 { border-width: 3px; }
.border-4 { border-width: 4px; }
.border-5 { border-width: 5px; }
.border-gray, .border-gray-hover:hover { border-color: #F1F1F1 !important; }
.border-gray1, .border-gray1-hover:hover { border-color: #EAEAEA !important; }
.border-gray2, .border-gray2-hover:hover { border-color: #E1E1E1 !important; }
.border-gray3, .border-gray3-hover:hover { border-color: #DADADA !important; }
.border-gray4, .border-gray4-hover:hover { border-color: #C1C1C1 !important; }
.border-gray5, .border-gray5-hover:hover { border-color: #A1A1A1 !important; }
.border-gray6, .border-gray6-hover:hover { border-color: #919191 !important; }
.border-gray7, .border-gray7-hover:hover { border-color: #717171 !important; }
.border-gray8, .border-gray8-hover:hover { border-color: #515151 !important; }
.border-gray9, .border-gray9-hover:hover { border-color: #313131 !important; }
.border-gray10, .border-gray10-hover:hover { border-color: #181818 !important; }
.border-dark, .border-dark-hover:hover { border-color: #212121 !important; }
.border-dark1, .border-dark1-hover:hover { border-color: #191919 !important; }
.border-dark2, .border-dark2-hover:hover { border-color: #161616 !important; }
.border-black, .border-black-hover:hover { border-color: #111 !important; }
.border-double, .border-double-hover { position: relative; border-style: solid; }
.border-double-hover:before { -webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; transition: all 0.25s ease-out; }
.border-double-hover:before, .border-double:before { content: ''; left: 0px; top: 0px; opacity: 0; right: 0px; bottom: 0px; background-color: transparent; border-width: 1px; border-style: inherit; border-color: inherit; border-radius: inherit; position: absolute; }
.border-double:before, .border-double-hover:hover:before { left: -5px; top: -5px; right: -5px; bottom: -5px; opacity: 1; }
.arrow-bottom { position: relative; }
.arrow-bottom:before { content: ''; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid; border-top-color: inherit; position: absolute; left: 50%; margin-left: -10px; top: 100%; }
/* Divider Styles */
.divider-1, .divider-2, .divider-3, .divider-4, .divider-5 { text-align: center; position: relative; overflow: hidden; }
.divider-1 > span, .divider-2 > span, .divider-3 > span, .divider-4 > span, .divider-5 > span { display: inline-block; position: relative; }
.divider-1 > span:before, .divider-1 > span:after, .divider-2 > span:before, .divider-2 > span:after, .divider-3 > span:before, .divider-3 > span:after, .divider-4 > span:before, .divider-4 > span:after, .divider-5 > span:before, .divider-5 > span:after { background-color: #DDD; content: ''; display: block; width: 9999px; left: 100%; margin-left: 30px; top: 50%; margin-top: -0.5px; height: 1px; position: absolute; }
.divider-1 > span:after, .divider-2 > span:after, .divider-3 > span:after, .divider-4 > span:after, .divider-5 > span:after { left: auto; right: 100%; margin-left: 0; margin-right: 30px; }
.divider-1.divider-white > span:before, .divider-1.divider-white > span:after, .divider-2.divider-white > span:before, .divider-2.divider-white > span:after { background-color: rgba(150, 150, 150, 0.4) !important; }
/* Divider Left */
.divider-1.divider-left, .divider-2.divider-left, .divider-3.divider-left, .divider-4.divider-left, .divider-5.divider-left { text-align: left; }
.divider-1.divider-left > span:after, .divider-2.divider-left > span:after, .divider-3.divider-left > span:after, .divider-4.divider-left > span:after, .divider-5.divider-left > span:after { display: none; }
/* Divider Right */
.divider-1.divider-right, .divider-2.divider-right, .divider-3.divider-right, .divider-4.divider-right, .divider-5.divider-right { text-align: right; }
.divider-1.divider-right > span:before, .divider-2.divider-right > span:before, .divider-3.divider-right > span:before, .divider-4.divider-right > span:before, .divider-5.divider-right > span:before { display: none; }
/* Divider 2 Styles */
.divider-2 > span:before, .divider-2 > span:after { background-color: transparent; border-color: #DDD; border-style: solid; border-width: 0px; border-top-width: 1px; border-bottom-width: 1px; height: 6px; margin-top: -3px; }
/* Divider 3 Styles */
.divider-3 > span:before, .divider-3 > span:after, .divider-4 > span:before, .divider-4 > span:after { height: 6px; background-color: transparent; background-image: url(../images/divider-3.png); background-repeat: repeat-x; margin-top: -4px; }
/* Divider 4 Styles */
.divider-4 > span:before { background-image: url(../images/divider-4.png); }
.divider-4 > span:after { background-image: url(../images/divider-4-left.png); }
/* Divider 5 Styles */
.divider-5 > span:before, .divider-5 > span:after { background-color: transparent; border-top: 1px dashed #AAA; }
/* Divider 5 Styles */
.divider-5.type2 > span:before, .divider-5.type2 > span:after { border-top: 2px dashed #AAA; margin-top: -1px; }
/* Icon-divider */
.icon-divider { position: absolute; width: 50px; height: 50px; line-height: 50px; display: block; left: 50%; top: 0; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
/* Marks */
/* Basic Mark */
.basic-mark { position: absolute; right: 10px; top: 10px; line-height: normal; padding: 3px 9px; z-index: 99; }
.basic-mark.icon-mark { right: 0px; top: -5px; padding: 0; width: 35px; height: 35px; line-height: 35px; }
.basic-mark.to-left { left: 10px; right: auto; }
.basic-mark.icon-mark.to-left { left: 0px; right: auto; }
.basic-mark.icon-mark.to-bottom { top: auto; bottom: -5px; }
.basic-mark.to-left + .basic-mark.to-left { top: 40px; }
.basic-mark.to-right + .basic-mark.to-right { top: 40px; }
/* Show&Hide elements in expander btn */
.expander-btn span { vertical-align: middle; }
.expander-btn.collapsed span#hide { display: none; }
.expander-btn:not(.collapsed) span#show { display: none; }
.expander-btn i { margin-left: 5px; font-size: 18px; vertical-align: middle; }
.expander-btn:not(.collapsed) i { -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); }
/* Animated items and backgrounds */
.bg-animated > *, .bg-animated-reverse > *, .bg-animated-vertical > * { position: relative; z-index: 2; }
.bg-animator { background-image: inherit; display: block; background-size: 0px 0px !important; overflow: hidden; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 0 !important; }
.bg-animated, .bg-animated-reverse, .bg-animated-vertical { background-size: 0px 0px !important; background-repeat: no-repeat; position: relative; }
/* Animated Backgrond */
@-webkit-keyframes BackgroundAnimation
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(80%, 0, 0); transform: translate3d(80%, 0, 0); }
}
@-moz-keyframes BackgroundAnimation
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(80%, 0, 0); transform: translate3d(80%, 0, 0); }
}
@-ms-keyframes BackgroundAnimation
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(80%, 0, 0); transform: translate3d(80%, 0, 0); }
}
.bg-animated .bg-animator:after { transform: translate3d(0, 0, 0); background-image: inherit; background-attachment: scroll; background-size: auto 100%; content: ''; position: absolute; right: 0; top: 0; width: 500%; min-width: 300vw; height: 100%; display: block; background-repeat: repeat; -webkit-animation: BackgroundAnimation 300s linear infinite; -moz-animation: BackgroundAnimation 300s linear infinite; -ms-animation: BackgroundAnimation 300s linear infinite; }
/* Animated Backgrond Reverse */
@-webkit-keyframes BackgroundAnimationReverse
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(-80%, 0, 0); transform: translate3d(-80%, 0, 0); }
}
@-moz-keyframes BackgroundAnimationReverse
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(-80%, 0, 0); transform: translate3d(-80%, 0, 0); }
}
@-ms-keyframes BackgroundAnimationReverse
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(-80%, 0, 0); transform: translate3d(-80%, 0, 0); }
}
.bg-animated-reverse .bg-animator:after { transform: translate3d(0, 0, 0); background-image: inherit; background-attachment: scroll; background-size: auto 100%; content: ''; position: absolute; left: 0; top: 0; width: 500%; min-width: 300vw; height: 100%; display: block; background-repeat: repeat; -webkit-animation: BackgroundAnimationReverse 300s linear infinite; -moz-animation: BackgroundAnimationReverse 300s linear infinite; -ms-animation: BackgroundAnimationReverse 300s linear infinite; }
/* Vertical Animated Backgrond */
@-webkit-keyframes BackgroundAnimationVertical
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(0, -70%, 0); transform: translate3d(0, -70%, 0); }
}
@-moz-keyframes BackgroundAnimationVertical
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(0, -70%, 0); transform: translate3d(0, -70%, 0); }
}
@-ms-keyframes BackgroundAnimationVertical
{
from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
to { -webkit-transform: translate3d(0, -70%, 0); transform: translate3d(0, -70%, 0); }
}
.bg-animated-vertical .bg-animator:after { transform: translate3d(0, 0, 0); background-image: inherit; background-attachment: scroll; background-size: 100% auto; content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 450%; display: block; background-repeat: repeat; -webkit-animation: BackgroundAnimationVertical 240s linear infinite; -moz-animation: BackgroundAnimationVertical 240s linear infinite; -ms-animation: BackgroundAnimationVertical 240s linear infinite; }
/* Disable background animations on mobile for save performance */
@media only screen and (max-width: 1025px)
{
.bg-animator { display: none; }
.bg-animated, .bg-animated-reverse, .bg-animated-vertical { background-size: cover !important; }
.bg-animated.bg-normal, .bg-animated-reverse.bg-normal, .bg-animated-vertical.bg-normal { background-size: auto !important; }
}
/* Animated Item Horizontal */
@-webkit-keyframes itemAnimationHorizontal
{
0% { transform: translate(-10%, 0); }
50% { transform: translate(10%, 0); }
100% { transform: translate(-10%, 0); }
}
@-moz-keyframes itemAnimationHorizontal
{
0% { transform: translate(-10%, 0); }
50% { transform: translate(10%, 0); }
100% { transform: translate(-10%, 0); }
}
@-ms-keyframes itemAnimationHorizontal
{
0% { transform: translate(-10%, 0); }
50% { transform: translate(10%, 0); }
100% { transform: translate(-10%, 0); }
}
@keyframes itemAnimationHorizontal
{
0% { transform: translate(-10%, 0); }
50% { transform: translate(10%, 0); }
100% { transform: translate(-10%, 0); }
}
.animated-item-horizontal { -webkit-animation: itemAnimationHorizontal 2.5s linear infinite; -moz-animation: itemAnimationHorizontal 2.5s linear infinite; -ms-animation: itemAnimationHorizontal 2.5s linear infinite; animation: itemAnimationHorizontal 2.5s linear infinite; animation: itemAnimationHorizontal 2.5s linear infinite; }
/* Animated Item Vertical */
@-webkit-keyframes itemAnimationVertical
{
0% { transform: translate(0, -10%); }
50% { transform: translate(0, 10%); }
100% { transform: translate(0, -10%); }
}
@-moz-keyframes itemAnimationVertical
{
0% { transform: translate(0, -10%); }
50% { transform: translate(0, 10%); }
100% { transform: translate(0, -10%); }
}
@-ms-keyframes itemAnimationVertical
{
0% { transform: translate(0, -10%); }
50% { transform: translate(0, 10%); }
100% { transform: translate(0, -10%); }
}
@keyframes itemAnimationVertical
{
0% { transform: translate(0, -10%); }
50% { transform: translate(0, 10%); }
100% { transform: translate(0, -10%); }
}
.animated-item-vertical { -webkit-animation: itemAnimationVertical 2.5s linear infinite; -moz-animation: itemAnimationVertical 2.5s linear infinite; -ms-animation: itemAnimationVertical 2.5s linear infinite; animation: itemAnimationVertical 2.5s linear infinite; animation: itemAnimationVertical 2.5s linear infinite; }
/* Animated Item Rotate */
@-webkit-keyframes itemAnimationRotate
{
0% { transform: rotate(-6deg); }
50% { transform: rotate(6deg); }
100% { transform: rotate(-6deg); }
}
@-moz-keyframes itemAnimationRotate
{
0% { transform: rotate(-6deg); }
50% { transform: rotate(6deg); }
100% { transform: rotate(-6deg); }
}
@-ms-keyframes itemAnimationRotate
{
0% { transform: rotate(-6deg); }
50% { transform: rotate(6deg); }
100% { transform: rotate(-6deg); }
}
@keyframes itemAnimationRotate
{
0% { transform: rotate(-6deg); }
50% { transform: rotate(6deg); }
100% { transform: rotate(-6deg); }
}
.animated-item-rotate { -webkit-animation: itemAnimationRotate 2.5s linear infinite; -moz-animation: itemAnimationRotate 2.5s linear infinite; -ms-animation: itemAnimationRotate 2.5s linear infinite; animation: itemAnimationRotate 2.5s linear infinite; animation: itemAnimationRotate 2.5s linear infinite; }
/* Animated Item Scale */
@-webkit-keyframes itemAnimationScale
{
0% { transform: scale(1.2); }
50% { transform: scale(1.0); }
100% { transform: scale(1.2); }
}
@-moz-keyframes itemAnimationScale
{
0% { transform: scale(1.2); }
50% { transform: scale(1.0); }
100% { transform: scale(1.2); }
}
@-ms-keyframes itemAnimationScale
{
0% { transform: scale(1.2); }
50% { transform: scale(1.0); }
100% { transform: scale(1.2); }
}
@keyframes itemAnimationScale
{
0% { transform: scale(1.2); }
50% { transform: scale(1.0); }
100% { transform: scale(1.2); }
}
.animated-item-scale { -webkit-animation: itemAnimationScale 2.5s linear infinite; -moz-animation: itemAnimationScale 2.5s linear infinite; -ms-animation: itemAnimationScale 2.5s linear infinite; animation: itemAnimationScale 2.5s linear infinite; animation: itemAnimationScale 2.5s linear infinite; }
.animated { visibility: hidden; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.animated.fast { animation-duration: 0.3s; }
.visible { visibility: visible !important; }
@media only screen and (max-width: 1024px)
{
.animated { visibility: visible; }
}
/* Gradient Background Animations */
.animated-gradient { z-index: -1; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-animation: animatedGradient 60s ease infinite; -moz-animation: animatedGradient 60s ease infinite; animation: animatedGradient 60s ease infinite; }
@-webkit-keyframes animatedGradient
{
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@-moz-keyframes animatedGradient
{
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes animatedGradient
{
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
/* Contact Form effects */
#submit_message, #error_message { font-size: 14px; height: 50px; display: none; line-height: 50px; color: #202020; font-weight: 500; left: 50%; bottom: 40px; background-color: #FFF; position: fixed; border-radius: 10px; box-shadow: 15px 30px 80px 4px rgba(0, 0, 0, 0.18); margin: 0; padding: 0 30px 0 0; border: none; cursor: pointer; width: auto; z-index: 1500; -ms-transform: translateX(-50%) translateZ(0); -webkit-transform: translateX(-50%) translateZ(0); transform: translateX(-50%) translateZ(0); -webkit-transition: bottom 0.3s, box-shadow 0.3s; -moz-transition: bottom 0.3s, box-shadow 0.3s; transition: bottom 0.3s, box-shadow 0.3s; }
#submit_message i, #error_message i { display: block; float: left; position: relative; left: -2px; color: #FFF; line-height: 50px; width: 50px; height: 50px; text-align: center; border-top-left-radius: 10px; border-bottom-left-radius: 10px; background: #C41F1F; }
#submit_message i { background: #7FB924; }
#submit_message span, #error_message span { padding-left: 10px; }
#submit_message:hover, #error_message:hover { bottom: 37px; box-shadow: 3px 5px 10px 0px rgba(0, 0, 0, 0.1); }
@media only screen and (min-width: 1450px)
{
body.left-side-menu-active #submit_message, body.left-side-menu-active #error_message { left: calc(50% + 150px); }
}
@media only screen and (max-width: 580px)
{
#submit_message, #error_message { display: none; }
}
button[type="submit"] { position: relative; overflow: hidden; }
button[type="submit"] span.loader { background-color: inherit; border-radius: inherit; }
button[type="submit"].loading span.loader:before { width: 20px; height: 20px; margin: 0 auto; content: ''; position: absolute; top: 50%; left: 50%; margin-top: -10px; margin-left: -10px; border: 1px solid rgb(255, 255, 255); border-radius: 50%; z-index: 2; border-left-color: transparent; border-right-color: transparent; animation: cssload-spin 650ms infinite linear; -o-animation: cssload-spin 650ms infinite linear; -ms-animation: cssload-spin 650ms infinite linear; -webkit-animation: cssload-spin 650ms infinite linear; -moz-animation: cssload-spin 650ms infinite linear; }
button[type="submit"].loading span.loader:after { background-color: inherit; border-radius: inherit; width: 100%; height: 100%; position: absolute; left: 0; top: 0; content: ''; z-index: 1; }
button[type="submit"].loading.dark-loading span.loader:before { border: 1px solid rgb(0, 0, 0); border-left-color: transparent; border-right-color: transparent; }
@keyframes cssload-spin
{
100% { transform: rotate(360deg); transform: rotate(360deg); }
}
@-o-keyframes cssload-spin
{
100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-ms-keyframes cssload-spin
{
100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes cssload-spin
{
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-moz-keyframes cssload-spin
{
100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
}
/* Lightbox Options */
.lg-outer .lg-thumb { margin: 0 auto; }
.lg-outer .lg-thumb-item { border: 0px solid transparent; border-radius: 0; }
.lg-outer .lg-thumb-item img { opacity: 0.8; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.lg-outer .lg-thumb-item.active img { opacity: 1; }
.lg-outer .lg-item { background: url(../images/loader2.gif) center center no-repeat; }
.lg-backdrop, .lg-outer { z-index: 1650; }
.lg-outer .lg-video { -webkit-overflow-scrolling: touch; overflow: auto; }
/* Left Right Buttons */
.lg-actions .lg-next, .lg-actions .lg-prev { padding: 25px 13px; background-color: rgba(0, 0, 0, 0.3); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.lg-actions .lg-next:hover, .lg-actions .lg-prev:hover { background-color: rgba(0, 0, 0, 0.5); color: #DDD; }
.lg-actions .lg-next:before { content: "\f105"; font-family: 'FONTAWESOME'; }
.lg-actions .lg-prev:after { content: "\f104"; font-family: 'FONTAWESOME'; }
/* Classic Colors */
.lg-toolbar .lg-icon, #lg-counter, .lg-outer .lg-thumb-outer, .lg-outer .lg-toogle-thumb { color: #CCC; }
.lg-toolbar { background-color: rgba(0, 0, 0, 0.6); }
.lg-sub-html { background-color: rgba(0, 0, 0, 0); }
.lg-backdrop { background-color: rgba(20, 20, 20, 0.8); }
body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-item.lg-complete .lg-object { border: 0px solid rgba(255, 255, 255, 0.1); }
.lg-outer .lg-thumb-outer, .lg-outer .lg-toogle-thumb { background-color: rgba(0, 0, 0, 0.2); }
.lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover { border-color: rgba(180, 180, 180, 0.5); }
/* Parallax Styles */
.parallax { background-repeat: no-repeat; background-attachment: fixed !important; background-size: cover !important; }
.bg-parallax { width: 100%; min-height: 115%; height: 80vh; position: absolute; left: 0; top: 0; background-size: cover; background-attachment: scroll !important; transform: translateZ(0); -webkit-transform: translateZ(0); background-position: center center; background-repeat: no-repeat; z-index: -1; }
.bg-parallax.horizontal-parallax { min-height: auto; height: 100%; }
.parallax.disabled { width: 100%; min-height: 100%; height: 100%; left: 0; top: 0; -webkit-transform: translateY(0px) !important; -moz-transform: translateY(0px) !important; -ms-transform: translateY(0px) !important; transform: translateY(0px) !important; }
.bg-parallax img { width: auto; min-width: 100%; height: auto; min-height: 100%; }
.bg-parallax-mobiled { width: 100%; height: 100%; min-height: 100%; background-size: cover !important; background-attachment: scroll !important; }
.bg-parallax-mobiled img { width: 100%; min-height: auto; height: auto; min-width: auto; }
@media only screen and (max-width: 500px)
{
.bg-parallax-mobiled img { width: auto; min-height: auto; height: 140%; min-width: auto; }
}
/* Fade animation for Bootstrap slider */
@media all and (transform-3d), (-webkit-transform-3d)
{
.carousel-fade .carousel-inner > .item.next, .carousel-fade .carousel-inner > .item.active.right { opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.carousel-fade .carousel-inner > .item.prev, .carousel-fade .carousel-inner > .item.active.left { opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.carousel-fade .carousel-inner > .item.next.left, .carousel-fade .carousel-inner > .item.prev.right, .carousel-fade .carousel-inner > .item.active { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.carousel-fade .carousel-inner .item { opacity: 0; transition-property: opacity; }
.carousel-fade .carousel-inner .active { opacity: 1; }
.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right { left: 0; opacity: 0; z-index: 1; }
.carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right { opacity: 1; }
.carousel-fade .carousel-control { z-index: 2; }
/* Typing Cursor Loop */
.typed-cursor { opacity: 1; font-weight: 100; -webkit-animation: blink 0.7s infinite; -moz-animation: blink 0.7s infinite; -ms-animation: blink 0.7s infinite; -o-animation: blink 0.7s infinite; animation: blink 0.7s infinite; }
@-keyframes blink
{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-webkit-keyframes blink
{
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes blink
{
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
@-ms-keyframes blink
{
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
@-o-keyframes blink
{
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}
/* Icon Types */
.fullwidth-socials a { background: #1B1B1B; color: #D1D1D1; font-size: 14px; min-width: 100px; text-transform: uppercase; display: block; float: left; text-align: center; padding: 32px 0; position: relative; overflow: hidden; -webkit-transition: background 0.4s; -moz-transition: background 0.4s; transition: background 0.4s; }
.fullwidth-socials a span { position: relative; display: block; width: 100%; height: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.fullwidth-socials a:before { position: absolute; bottom: 100%; width: 100%; height: 100%; line-height: 75px; left: 0; font-size: 25px; color: white; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.fullwidth-socials a:hover:before { bottom: 0; }
.fullwidth-socials a:hover span { -webkit-transform: translateY(400%); -moz-transform: translateY(400%); -ms-transform: translateY(400%); transform: translateY(400%); }
@media only screen and (max-width: 500px)
{
.fullwidth-socials a { width: 100% !important; }
}
.social-icon { width: 30px; height: 30px; line-height: 30px; cursor: pointer; text-align: center; display: inline-block; background-color: #555; font-size: 14px; }
.social-icon:hover, .social-icon:active, .social-icon:focus { color: white; }
.social-icon.border-icon { background-color: transparent; border-color: #FFF; border-width: 1px; border-style: solid; }
.social-icon.border-icon.border-gray6 { border-color: #999 !important; color: #666; }
.social-icon.border-icon.border-gray6:hover { border-color: transparent !important; color: #FFF; }
.icon { display: inline-block; text-align: center; }
.icon-xxs { width: 25px; height: 25px; line-height: 25px; font-size: 10px; }
.icon-xs { width: 35px; height: 35px; line-height: 35px; font-size: 12px; }
.icon-sm { width: 46px; height: 46px; line-height: 46px; font-size: 13px; }
.icon-md { width: 55px; height: 55px; line-height: 55px; font-size: 15px; }
.icon-lg { width: 75px; height: 75px; line-height: 75px; font-size: 16px; }
.icon-xl { width: 85px; height: 85px; line-height: 85px; font-size: 17px; }
.icon-xxl { width: 100px; height: 100px; line-height: 100px; font-size: 19px; }
.icon-extreme { width: 120px; height: 120px; line-height: 120px; font-size: 19px; }
*[class*="icon-"] i { line-height: inherit; }
*[class*="icon-"] { text-align: center; display: inline-block; }
@media only screen and (max-width: 768px)
{
.icon-mobile-xs { width: 30px; height: 30px; line-height: 30px; font-size: 10px !important; }
.icon-mobile-sm, .icon-mobile-md { width: 55px; height: 55px; line-height: 55px; font-size: 12px !important; }
.icon-mobile-lg { width: 70px; height: 70px; line-height: 70px; font-size: 13px !important; }
.icon-mobile-xl { width: 90px; height: 90px; line-height: 90px; font-size: 14px !important; }
}
.icon.fa-play:before { display: inline-block; -ms-transform: translateX(5%); -webkit-transform: translateX(5%); transform: translateX(5%); }
/* Animated Icons */
.icon-animated, .icon-animated1, .icon-animated-lg, .icon-animated1-lg { position: relative; }
.icon-animated:after, .icon-animated-lg:after, .icon-animated1:after, .icon-animated1-lg:after { z-index: -1; opacity: 0; background: inherit; border-radius: inherit; position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; -webkit-animation-name: icon-animate1; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; -webkit-animation-play-state: running; -webkit-animation-name: icon-animate1; animation-name: icon-animate1; -webkit-animation-duration: 1s; animation-duration: 1.3s; animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-play-state: running; animation-play-state: running; }
.icon-animated1:after { background-color: transparent !important; border-width: 2px; border-style: solid; border-color: inherit; }
@keyframes icon-animate1
{
0% { opacity: 0.5; -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); }
25% { -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0.3; }
60% { -ms-transform: scale(1.35); -webkit-transform: scale(1.35); transform: scale(1.35); opacity: 0; }
}
/* Large Effects */
.icon-animated-lg:after, .icon-animated1-lg:after { -webkit-animation-name: icon-animate-lg; animation-name: icon-animate-lg; }
@keyframes icon-animate-lg
{
0% { opacity: 0.5; -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); }
25% { -ms-transform: scale(1.35); -webkit-transform: scale(1.35); transform: scale(1.35); opacity: 0.45; }
60% { -ms-transform: scale(1.5); -webkit-transform: scale(1.5); transform: scale(1.5); opacity: 0; }
}
/* ".drop-effect" Dropdown effect */
.drop-effect { display: inline-block; max-width: 100%; }
.drop-effect button.dropdown-toggle { width: 250px; max-width: 100%; cursor: pointer; padding: 8px 18px; text-align: left; background: white; position: relative; border: 1px solid #DDD; color: #555; line-height: 25px; }
.drop-effect button.dropdown-toggle:hover { box-shadow: 2px 10px 25px 0px rgba(0, 0, 0, 0.2); }
.drop-effect button.dropdown-toggle span { position: absolute; right: 22px; top: 50%; margin-top: -3px; }
/* Drop Effect With Icon */
.drop-effect.drop-icon { display: inline-block; }
.drop-effect.drop-icon button.dropdown-toggle { width: 50px; height: 50px; line-height: 50px; letter-spacing: -0.5px; padding: 0; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* Menu Options */
.drop-effect .dropdown-menu { overflow: hidden; padding: 0; top: 0%; left: -10% !important; width: 120%; min-width: 220px; transform: translate3d(0px, 0%, 0px) !important; box-shadow: 2px 10px 25px 0px rgba(0, 0, 0, 0.2); border: none; border-radius: 10px; display: block; visibility: hidden; opacity: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.drop-effect.show .dropdown-menu { visibility: visible; opacity: 1; transform: translate3d(0px, -20%, 0px) !important; }
/* link options */
.drop-effect .dropdown-menu > li > .link { color: inherit; padding: 0px 25px; border-bottom: 1px solid #EEE; cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.drop-effect.show .dropdown-menu > li > .link { padding-top: 7px; padding-bottom: 7px; }
.drop-effect .dropdown-menu > li > .link:hover, .drop-effect .dropdown-menu > li.cbp-filter-item-active > .link { background-color: #F6F6F6; }
.drop-effect .dropdown-menu > li:last-child > .link { border-bottom: none; }
@media only screen and (max-width: 1250px)
{
.drop-effect .dropdown-menu { left: auto !important; right: 0 !important; width: 130px; min-width: auto; }
}
/* Circular Effect */
.circular-effect-to-bottom { border-bottom-left-radius: 300%; border-bottom-right-radius: 300%; height: 100%; width: 140%; left: -20%; position: relative; overflow: hidden; }
@media only screen and (max-width: 1000px)
{
.circular-effect-to-bottom { width: 200%; left: -50%; }
}
@media only screen and (max-width: 500px)
{
.circular-effect-to-bottom { width: 300%; left: -100%; }
}
/* Callouts */
.qdr-callout { margin: 30px 0; padding: 15px 30px 15px 20px; border-left: 5px solid #EEE; }
.qdr-callout p { margin-bottom: 0; }
.qdr-callout code, .qdr-callout .highlight { background-color: #FFF; }
/* BS Callouts */
.bs-callout { padding: 20px; margin: 20px 0; border: 1px solid #EEE; border-left-width: 5px; border-radius: 3px; }
.bs-callout h4 { margin-top: 0; margin-bottom: 5px; }
.bs-callout p:last-child { margin-bottom: 0; }
.bs-callout code { border-radius: 3px; }
.bs-callout + .bs-callout { margin-top: -5px; }
.bs-callout-default { border-left-color: #777; }
.bs-callout-default h4 { color: #777; }
.bs-callout-primary { border-left-color: #428BCA; }
.bs-callout-primary h4 { color: #428BCA; }
.bs-callout-success { border-left-color: #5CB85C; }
.bs-callout-success h4 { color: #5CB85C; }
.bs-callout-danger { border-left-color: #D9534F; }
.bs-callout-danger h4 { color: #D9534F; }
.bs-callout-warning { border-left-color: #F0AD4E; }
.bs-callout-warning h4 { color: #F0AD4E; }
.bs-callout-info { border-left-color: #5BC0DE; }
.bs-callout-info h4 { color: #5BC0DE; }
/* Blockquotes */
blockquote { padding: 10px 20px; margin: 0 0 20px; font-size: 17.5px; border-left: 5px solid #EEE; }
/* Scrollbar Styled */
.scrollbar-styled::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: rgba(10, 10, 10, 0.2); }
.scrollbar-styled::-webkit-scrollbar { width: 9px; background-color: #F5F5F5; }
.scrollbar-styled::-webkit-scrollbar-thumb { border-radius: 10px; background-color: #777; }
/* Quadra Columns */
.qdr-col-6 > * { float: left; width: 16.666%; padding: 15px; }
.qdr-col-5 > * { float: left; width: 20%; padding: 15px; }
.qdr-col-4 > * { float: left; width: 25%; padding: 15px; }
.qdr-col-3 > * { float: left; width: 33.333%; padding: 15px; }
.qdr-col-2 > * { float: left; width: 50%; padding: 15px; }
.qdr-col-1 > * { float: none; width: 100%; }
/* Simple responsive options for columns */
@media only screen and (max-width: 1170px)
{
.qdr-col-6, .qdr-col-5, .qdr-col-4, .qdr-col-3, .qdr-col-2, .qdr-col-1 { padding-left: 15px; padding-right: 15px; }
.container .qdr-col-6, .container .qdr-col-5, .container .qdr-col-4, .container .qdr-col-3, .container .qdr-col-2, .container .qdr-col-1 { padding-left: 0; padding-right: 0; }
}
@media only screen and (max-width: 768px)
{
.qdr-col-6 > *, .qdr-col-5 > *, .qdr-col-4 > *, .qdr-col-3 > *, .qdr-col-2 > * { width: 50% !important; margin-right: 0 !important; padding-left: 6px; padding-right: 6px; }
}
@media only screen and (max-width: 768px)
{
.qdr-col-3.boxes > * { width: 100% !important; float: none !important; text-align: center; }
}
@media only screen and (max-width: 690px)
{
.qdr-col-6 > *, .qdr-col-5 > *, .qdr-col-4 > *, .qdr-col-3 > *, .qdr-col-2 > * { width: 100% !important; margin-left: auto !important; margin-right: auto !important; float: none !important; text-align: center; }
}
/* Set columns for small screens with classes. */
/* .col-X-xxs */
@media only screen and (max-width: 360px)
{
.qdr-col-2-xxs > * { float: left !important; width: 50% !important; padding: 10px !important; }
.qdr-col-3-xxs > * { float: left !important; width: 33.333% !important; padding: 10px !important; }
}
/* .col-X-xs */
@media only screen and (max-width: 480px)
{
.qdr-col-2-xs > * { float: left !important; width: 50% !important; padding: 10px !important; }
.qdr-col-3-xs > * { float: left !important; width: 33.333% !important; padding: 10px !important; }
.qdr-col-4-xs > * { float: left !important; width: 25% !important; padding: 10px !important; }
}
/* .col-X-sm */
@media only screen and (min-width: 576px) and (max-width: 767px)
{
.qdr-col-2-sm > * { float: left !important; width: 50% !important; padding: 10px !important; }
.qdr-col-3-sm > * { float: left !important; width: 33.333% !important; padding: 10px !important; }
.qdr-col-4-sm > * { float: left !important; width: 25% !important; padding: 10px !important; }
.qdr-col-5-sm > * { float: left !important; width: 20% !important; padding: 10px !important; }
.qdr-col-6-sm > * { float: left !important; width: 16.666% !important; padding: 10px !important; }
}
/* Add an item without col */
.qdr-col-6 > .not-col, .qdr-col-5 > .not-col, .qdr-col-4 > .not-col, .qdr-col-3 > .not-col, .qdr-col-2 > .not-col, .qdr-col-1 > .not-col { width: 100%; }
/* Gaps */
.gap-50 > * { padding: 50px !important; }
.gap-40 > * { padding: 40px !important; }
.gap-30 > * { padding: 30px !important; }
.gap-25 > * { padding: 25px !important; }
.gap-24 > * { padding: 24px !important; }
.gap-23 > * { padding: 23px !important; }
.gap-22 > * { padding: 22px !important; }
.gap-21 > * { padding: 21px !important; }
.gap-20 > * { padding: 20px !important; }
.gap-19 > * { padding: 19px !important; }
.gap-18 > * { padding: 18px !important; }
.gap-17 > * { padding: 17px !important; }
.gap-16 > * { padding: 16px !important; }
.gap-15 > * { padding: 15px !important; }
.gap-13 > * { padding: 13px !important; }
.gap-12 > * { padding: 12px !important; }
.gap-11 > * { padding: 11px !important; }
.gap-10 > * { padding: 10px !important; }
.gap-9 > * { padding: 9px !important; }
.gap-8 > * { padding: 8px !important; }
.gap-7 > * { padding: 7px !important; }
.gap-6 > * { padding: 6px !important; }
.gap-5 > * { padding: 6px !important; }
.gap-4 > * { padding: 5px !important; }
.gap-3 > * { padding: 4px !important; }
.gap-2 > * { padding: 3px !important; }
.gap-1 > * { padding: 1px !important; }
.gap-0 > * { padding: 0px !important; }
@media only screen and (max-width: 640px)
{
.gap-0-sm > *, .gap-0-xs > * { padding: 0px !important; }
.gap-5-sm > *, .gap-5-xs > * { padding: 5px !important; }
.gap-10-sm > *, .gap-10-xs > * { padding: 10px !important; }
}
/* Responsive Visible Options */
/* .visible-xs small than 480px */
.visible-xs, .visible-xs-inline-block, .visible-xs-block, .visible-xs-inline { display: none; }
@media only screen and (max-width: 576px)
{
.visible-xs, .visible-xs-block { display: block !important; }
.visible-xs-inline-block { display: inline-block !important; }
.visible-xs-inline { display: inline !important; }
}
/* .visible-sm 576px - 767px */
.visible-sm, .visible-sm-inline-block, .visible-sm-block, .visible-sm-inline { display: none; }
@media only screen and (min-width: 576px) and (max-width: 767px)
{
.visible-sm, .visible-sm-block { display: block !important; }
.visible-sm-inline-block { display: inline-block !important; }
.visible-sm-inline { display: inline !important; }
}
/* .visible-md 768px - 991px */
.visible-md, .visible-md-inline-block, .visible-md-block, .visible-md-inline { display: none; }
@media only screen and (min-width: 768px) and (max-width: 991px)
{
.visible-md, .visible-md-block { display: block !important; }
.visible-md-inline-block { display: inline-block !important; }
.visible-md-inline { display: inline !important; }
}
/* .visible-lg larger than 992px */
.visible-lg, .visible-lg-inline-block, .visible-lg-block, .visible-lg-inline { display: none; }
@media only screen and (min-width: 992px)
{
.visible-lg, .visible-lg-block { display: block !important; }
.visible-lg-inline-block { display: inline-block !important; }
.visible-lg-inline { display: inline !important; }
}
/* .visible-xl larger than 1200px */
.visible-xl, .visible-xl-inline-block, .visible-xl-block, .visible-xl-inline { display: none; }
@media only screen and (min-width: 1200px)
{
.visible-xl, .visible-xl-block { display: block !important; }
.visible-xl-inline-block { display: inline-block !important; }
.visible-xl-inline { display: inline !important; }
}
/* .visible-xxl larger than 1441px */
.visible-xxl, .visible-xxl-inline-block, .visible-xxl-block, .visible-xxl-inline { display: none; }
@media only screen and (min-width: 1441px)
{
.visible-xxl, .visible-xl-block { display: block !important; }
.visible-xxl-inline-block { display: inline-block !important; }
.visible-xxl-inline { display: inline !important; }
}
/* Responsive Hidden Options */
/* .hidden-xxs */
@media only screen and (max-width: 368px)
{
.hidden-xxs { display: none !important; }
}
/* .hidden-xs */
@media only screen and (max-width: 576px)
{
.hidden-xs { display: none !important; }
}
/* .hidden-sm */
@media only screen and (max-width: 768px)
{
.hidden-sm { display: none !important; }
}
/* .hidden-md */
@media only screen and (min-width: 768px) and (max-width: 991px)
{
.hidden-md { display: none !important; }
}
/* .hidden-lg */
@media only screen and (min-width: 992px)
{
.hidden-lg { display: none !important; }
}
/* .hidden-xl */
@media only screen and (min-width: 1200px)
{
.hidden-xl { display: none !important; }
}
/* .hidden-xxl */
@media only screen and (min-width: 1441px)
{
.hidden-xxl { display: none !important; }
}
/* Mobile Positioning - Add top, left, right or bottom styles for only mobile */
@media only screen and (max-width: 768px)
{
.top-mobile-0 { top: 0 !important; }
.top-mobile-10 { top: 10px !important; }
.top-mobile-20 { top: 20px !important; }
.top-mobile-30 { top: 30px !important; }
.top-mobile-40 { top: 40px !important; }
.top-mobile-50 { top: 50px !important; }
.top-mobile-100 { top: 100px !important; }
.left-mobile-0 { left: 0 !important; }
.left-mobile-10 { left: 10px !important; }
.left-mobile-20 { left: 20px !important; }
.left-mobile-30 { left: 30px !important; }
.left-mobile-40 { left: 40px !important; }
.left-mobile-50 { left: 50px !important; }
.left-mobile-100 { left: 100px !important; }
.right-mobile-0 { right: 0 !important; }
.right-mobile-10 { right: 10px !important; }
.right-mobile-20 { right: 20px !important; }
.right-mobile-30 { right: 30px !important; }
.right-mobile-40 { right: 40px !important; }
.right-mobile-50 { right: 50px !important; }
.right-mobile-100 { right: 100px !important; }
.bottom-mobile-0 { bottom: 0 !important; }
.bottom-mobile-10 { bottom: 10px !important; }
.bottom-mobile-20 { bottom: 20px !important; }
.bottom-mobile-30 { bottom: 30px !important; }
.bottom-mobile-40 { bottom: 40px !important; }
.bottom-mobile-50 { bottom: 50px !important; }
.bottom-mobile-100 { bottom: 100px !important; }
}
/* Quadra Alerts */
.qdr-alert { display: none; position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); z-index: 1500; margin: 0; opacity: 0.9; padding: 10px 15px; }
.qdr-alert:hover { opacity: 1; }
.qdr-alert.active { display: block; }
.qdr-alert.left { left: 20px; }
.qdr-alert.top { top: 20px; }
.qdr-alert.right { right: 20px; }
.qdr-alert.bottom { bottom: 20px; }
/* Alert With Cookie */
.cookie-alert { display: none; position: fixed; z-index: 1500; width: 80%; margin: 0 auto; left: 50%; bottom: 3%; right: auto; opacity: 1; padding: 20px 40px 20px 20px !important; background: white; -ms-transform: translateX(-50%) translateZ(0); -webkit-transform: translateX(-50%) translateZ(0); transform: translateX(-50%) translateZ(0); }
.cookie-alert .close { position: absolute; right: 20px; font-size: 20px; }
body.cookie-alert-active { overflow-y: auto !important; }
.alert-dismissable .close, .alert-dismissible .close { top: 0; line-height: inherit; }
.well { min-height: 20px; padding: 19px; margin-bottom: 20px; background-color: #F5F5F5; border: 1px solid #E3E3E3; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); }
/* Hover Effects */
.qdr-hover { overflow: hidden; z-index: 1; position: relative; display: inline-block; -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); }
.qdr-hover:hover { border-color: transparent; }
.qdr-hover:after, .qdr-hover:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1; -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); }
.qdr-hover:after { -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); transform: translateX(-100%); }
.qdr-hover:before { -ms-transform: translateX(-200%); -webkit-transform: translateX(-200%); transform: translateX(-200%); }
.qdr-hover-container:hover .qdr-hover:before, .qdr-hover:hover:before { -ms-transform: translateX(0%); -webkit-transform: translateX(0%); transform: translateX(0%); -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; }
.qdr-hover-container:hover .qdr-hover:after, .qdr-hover:hover:after { -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; }
.qdr-hover-1, .qdr-hover-1-left, .qdr-hover-1-right, .qdr-hover-1-bottom { position: relative; overflow: hidden; display: inline-block; z-index: 1; }
.qdr-hover-1:before, .qdr-hover-1-left:before, .qdr-hover-1-right:before, .qdr-hover-1-bottom:before { content: ''; z-index: -1; display: block; position: absolute; top: 0; left: 0; right: 0; height: 0; -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); }
.qdr-hover-container:hover .qdr-hover-1:before, .qdr-hover-1:hover:before { height: 100%; }
/* qdr-hover-1-left Effect */
.qdr-hover-1-left:before { left: 0; right: auto; height: 100%; width: 0; }
.qdr-hover-1-left:hover:before { width: 100%; }
/* qdr-hover-1-right Effect */
.qdr-hover-1-right:before { left: auto; right: 0; height: 100%; width: 0; }
.qdr-hover-1-right:hover:before { width: 100%; }
/* qdr-hover-1-bottom Effect */
.qdr-hover-1-bottom:before { bottom: 0; top: auto; }
.qdr-hover-1-bottom:hover:before { height: 100%; }
/* .qdr-hover-2, vertical and rotate effects */
.qdr-hover-2, .qdr-hover-2-vertical, .qdr-hover-2-rotate { position: relative; z-index: 1; overflow: hidden; display: inline-block; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.qdr-hover-2:before, .qdr-hover-2-vertical:before { content: ''; position: absolute; top: 0; left: 50%; width: 0; height: 100%; z-index: -1; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.qdr-hover-2:hover::before { width: 100%; left: 0%; }
.qdr-hover-2-vertical:before { left: 0; height: 0; width: 100%; top: 50%; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; transition: all 0.25s; }
.qdr-hover-2-vertical:hover:before { height: 100%; top: 0; }
.qdr-hover-2-rotate:before { content: ''; position: absolute; z-index: -1; width: 100%; height: 0; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg); -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.qdr-hover-2-rotate:hover::before { height: 500%; }
/* .qdr-hover-3 */
.qdr-hover-3 { display: inline-block; font-family: inherit; position: relative; overflow: hidden; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.qdr-hover-3 span.qdr-details { position: relative; display: block; width: 100%; height: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -webkit-transition: transform 0.4s; -moz-transition: transform 0.4s; transition: transform 0.4s; }
.qdr-hover-3:before { position: absolute; display: inline-block; font: inherit; font-family: 'FONTAWESOME'; bottom: 100%; width: 100%; height: 100%; text-align: inherit; line-height: inherit; padding: inherit; left: 0; color: inherit; -webkit-transition: bottom 0.4s; -moz-transition: bottom 0.4s; transition: bottom 0.4s; }
.qdr-hover-3:hover:before { bottom: 0%; }
.qdr-hover-3:hover span.qdr-details { -webkit-transform: translateY(400%); -moz-transform: translateY(400%); -ms-transform: translateY(400%); transform: translateY(400%); }
/* .qdr-hover-4 */
.qdr-hover-4, .qdr-hover-4-reverse { -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; display: inline-block; }
.qdr-hover-4:hover { -webkit-transform: translateY(-4px); -moz-transform: translateY(-4px); -ms-transform: translateY(-4px); transform: translateY(-4px); }
.qdr-hover-4-reverse:hover { -webkit-transform: translateY(3px); -moz-transform: translateY(3px); -ms-transform: translateY(3px); transform: translateY(3px); }
/* .qdr-hover-5 */
.qdr-hover-5 { position: relative; }
.qdr-hover-5:before { width: 0px; height: 1px; position: absolute; bottom: 1px; left: 0; content: ''; background-color: #777; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.qdr-hover-5:hover:before { width: 100%; }
@media only screen and (max-width: 641px)
{
.qdr-hover-5:before { display: none; }
.qdr-hover-5:hover { text-decoration: underline; }
}
/* .qdr-hover-6 */
.qdr-hover-6 { position: relative; overflow: hidden !important; }
a.qdr-hover-6 { display: inline-block; }
.qdr-hover-6:after { width: 150%; height: 150%; left: -250%; top: -25%; content: ''; display: block; position: absolute; opacity: 0.4; background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 50%, rgba(0, 0, 0, 0) 100%); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 50%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 1) 50%, rgba(0, 0, 0, 0) 100%); }
.qdr-hover-6:hover:after, .qdr-hover-6-container:hover .qdr-hover-6:after { left: 100%; top: 0%; -webkit-transition: left 0.6s, top 0.6s; -moz-transition: left 0.6s, top 0.6s; transition: left 0.6s, top 0.6s; }
/* Colors */
.qdr-hover:after { background-color: #363636; }
.qdr-hover-1:before, .qdr-hover-1-left:before, .qdr-hover-1-right:before, .qdr-hover-1-bottom:before { background-color: rgba(0, 0, 0, 0.1); }
.qdr-hover-2:before, .qdr-hover-2-vertical:before { background-color: #333; }
.qdr-hover-2-rotate:before { background-color: #333; }
/* 3d Moving Effect */
.moving-container .moving { -webkit-transition: all 0.25s ease-out; -moz-transition: all 0.25s ease-out; transition: all 0.25s ease-out; }
.translatez-xs { -webkit-transform: translateZ(20px); transform: translateZ(20px); }
.translatez-sm { -webkit-transform: translateZ(40px); transform: translateZ(40px); }
.translatez-md { -webkit-transform: translateZ(50px); transform: translateZ(50px); }
.translatez-lg { -webkit-transform: translateZ(90px); transform: translateZ(90px); }
/* Click Effect */
.click-effect { overflow: hidden; position: relative; }
.ink { display: block; position: absolute; background: rgba(255, 255, 255, 0.1) !important; border-radius: 100%; -webkit-transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); transform: scale(0); }
.click-effect.dark-effect .ink { background: rgba(0, 0, 0, 0.1) !important; }
.clicked { -webkit-animation: clickEffect 0.45s linear; -moz-animation: clickEffect 0.65s linear; -ms-animation: clickEffect 0.65s linear; -o-animation: clickEffect 0.65s linear; animation: clickEffect 0.65s linear; }
@-webkit-keyframes clickEffect
{
100% { opacity: 0; -webkit-transform: scale(2.5); }
}
@-moz-keyframes clickEffect
{
100% { opacity: 0; -moz-transform: scale(2.5); }
}
@-o-keyframes clickEffect
{
100% { opacity: 0; -o-transform: scale(2.5); }
}
@keyframes clickEffect
{
100% { opacity: 0; transform: scale(2.5); }
}
/* Scale Hover */
.scaled { -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); }
@media only screen and (max-width: 860px)
{
.scaled { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
}
.scale-hover { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.scale-hover:hover { -ms-transform: scale(1.05); -webkit-transform: scale(1.05); transform: scale(1.05); }
.scale-hover img { -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.scale-hover:hover img { -ms-transform: scale(1.08); -webkit-transform: scale(1.08); transform: scale(1.08); }
.grayscale, .grayscale-hover:hover { -webkit-filter: grayscale(1); filter: grayscale(1); }
/* Buttons */
/* Button sizes */
button.disabled { opacity: 0.5; cursor: not-allowed; }
.btn:focus { box-shadow: none; }
.xs-btn { padding: 6px 26px; font-size: 11px; line-height: normal; letter-spacing: 0; }
.sm-btn { padding: 7px 29px; font-size: 12px; line-height: normal; letter-spacing: 0; }
.md-btn { padding: 8px 35px; font-size: 13px; line-height: normal; letter-spacing: -0.1px; }
.lg-btn { padding: 10px 42px; font-size: 13px; line-height: normal; letter-spacing: -0.3px; }
.xl-btn { padding: 12px 50px; font-size: 13px; line-height: normal; letter-spacing: -0.3px; }
.long-btn { padding-left: 60px; padding-right: 60px; line-height: normal; }
.quadra-btn { background-color: rgba(165, 165, 165, 0.2); border-color: rgba(255, 255, 255, 0.2); border-width: 1px; border-style: solid; padding: 10px 30px; font-size: 14px; line-height: normal; }
.border-btn { background: transparent; border: 1px solid white; }
@media only screen and (max-width: 992px)
{
.quadra-btn { padding: 9px 20px; font-size: 13px; }
.xl-btn { padding: 8px 40px; font-size: 13px; }
.lg-btn { padding: 8px 33px; font-size: 12px; }
.md-btn { padding: 7px 29px; font-size: 12px; }
.sm-btn { padding: 5px 19px; font-size: 12px; }
}
@media only screen and (max-width: 480px)
{
.quadra-btn { padding: 7px 16px; font-size: 12px; }
.xl-btn { padding: 9px 35px; font-size: 12px; }
.lg-btn { padding: 8px 27px; font-size: 11px; }
.md-btn { padding: 7px 20px; font-size: 11px; }
.sm-btn { padding: 5px 16px; font-size: 11px; }
}
/* Strip Button */
.strip-btn-container { margin-top: 30px; height: 38px; }
.strip-btn { display: inline-block; min-width: 50px; height: 1px; background-color: #545454; overflow: hidden; padding: 0 50px; text-transform: uppercase; font-size: 15px; margin-top: 20px; margin-bottom: 20px; line-height: 0px; color: transparent; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.strip-btn:focus { color: transparent; }
.strip-btn-trigger:hover .strip-btn-container .strip-btn { height: 38px; margin-top: 0; margin-bottom: 0; line-height: 38px; color: white; }
.strip-btn.light-button { background-color: #A1A1A1; }
.cbp-item.cbp-item-off .strip-btn { display: none; }
/* Soft Button */
.soft-button { padding: 9px 25px; background-color: rgba(255, 255, 255, 0.1); color: #D4D4D4; border-radius: 0; border: 1px solid rgba(255, 255, 255, 0.2); }
/* Arrows For Text Slider */
.text-slider-arrow { display: inline-block; text-align: center; width: 30px; height: 30px; line-height: 30px; cursor: pointer; -webkit-transition: all 0.4s; -moz-transition: all 0.2s; transition: all 0.4s; }
.text-slider-arrow:hover { background-color: #333; width: 50px; color: white; }
.text-slider-arrow.left:hover { margin-left: -20px; }
/* Fixed Element On Page */
.fixed-element { width: auto; position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); left: 35px; bottom: 30px; z-index: 50; }
.fixed-element.right { left: auto; right: 35px; }
/* Page right bottom */
#back-to-top, .drop-msg { width: 45px; opacity: 0.5; height: 45px; line-height: 45px; z-index: 100; display: block; position: fixed; cursor: pointer; right: 20px; bottom: 15px; border-radius: 7px; border-width: 1px; border-style: solid; text-align: center; color: #777; background: white; border-color: #DDD; -webkit-transition: transform 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; -moz-transition: transform 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; transition: transform 0.8s cubic-bezier(0.77, 0, 0.2, 1) !important; -webkit-transform: translateZ(0); transform: translateZ(0); }
body.right-mini-side-menu-active #back-to-top, body.right-mini-side-menu-active .drop-msg { right: 75px; }
#back-to-top.dark, .drop-msg.dark { color: #FFF !important; background: #252525; border-color: #343434; }
.drop-msg + #back-to-top { bottom: 70px; }
#back-to-top:hover, .drop-msg:hover { opacity: 1; }
#back-to-top:not(.modal-hiding).qfm-time, .drop-msg:not(.modal-hiding).qfm-time { -webkit-transform: translateY(-60px); -moz-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px); }
@media only screen and (max-width: 480px)
{
#back-to-top, .drop-msg { width: 45px; height: 45px; line-height: 45px; right: 10px; bottom: 10px; }
.drop-msg + #back-to-top { bottom: 65px; }
}
/* Quick Contact Form on the pages */
.quick-contact-form { position: fixed; display: none; z-index: 1051; line-height: normal; right: 20px; bottom: 90px; width: 260px; height: auto; padding: 42px 15px 50px; overflow: hidden; text-align: center; background-color: #FFF; border-top: 5px solid; border-radius: 10px; box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.15); -webkit-transition: transform 0.5s; -moz-transition: transform 0.5s; transition: transform 0.2s; -webkit-transform: translateZ(0); transform: translateZ(0); }
body.quick-contact-form-active:before { content: ''; display: none; width: 100%; height: 100%; background-color: black; position: fixed; z-index: 1004; opacity: 0.7; -webkit-transform: translateZ(0); transform: translateZ(0); }
.quick-contact-form input, .quick-contact-form textarea { display: block; font-size: 14px; width: 100%; height: auto; padding: 8px 12px; margin-bottom: 12px; border: 1px solid #DDD; -webkit-transition: box-shadow 0.5s; -moz-transition: box-shadow 0.5s; transition: box-shadow 0.5s; }
.quick-contact-form input:focus, .quick-contact-form textarea:focus { box-shadow: 2px 5px 15px rgba(0, 0, 0, 0.1); }
.quick-contact-form textarea { min-height: 80px; resize: none; }
.quick-contact-form button { display: block; width: 100%; padding: 10px 5px; outline: none; border: none; }
.quick-contact-form h5 { color: #777; }
.quick-contact-form p { color: #999; margin: 10px 0 20px; }
.quick-contact-form a { margin-top: 20px; color: #555; -webkit-transition: color 0.5s; -moz-transition: color 0.5s; transition: color 0.5s; }
.quick-contact-form input.error_warning, .quick-contact-form textarea.error_warning { border-color: #EB2E2E !important; }
.quick-contact-form.active { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px); }
.quick-contact-form.dark { background-color: #222; }
.quick-contact-form.dark input, .quick-contact-form.dark textarea { background-color: #272727; border: 1px solid #313131; color: #CCC; }
.quick-contact-form.dark h5 { color: #CCC; }
.quick-contact-form p, .quick-contact-form a { color: #AAA; }
/* Quick Contact Form responsives */
@media only screen and (max-width: 900px)
{
body.quick-contact-form-active:before { display: block; }
}
@media only screen and (max-width: 480px)
{
.quick-contact-form { padding: 35px 15px; width: 80%; left: 10%; }
}
/* Mini height screens */
@media only screen and (max-height: 480px)
{
.quick-contact-form { bottom: 3px; padding: 25px 15px; }
.quick-contact-form.active { bottom: 10px; }
.quick-contact-form p { font-size: 12px; margin: 3px 0 14px; }
.quick-contact-form input, .quick-contact-form textarea { padding: 6px 8px; font-size: 13px; }
.quick-contact-form textarea { min-height: 20px; }
.quick-contact-form button { padding: 5px; font-size: 13px; }
.quick-contact-form a { margin-top: 10px; font-size: 12px; }
}
@media only screen and (max-height: 340px)
{
.quick-contact-form { bottom: 0; padding: 7px 14px; }
.quick-contact-form.active { bottom: 5px; }
.quick-contact-form p { font-size: 12px; margin: 3px 0 10px; }
}
/* Set to right side navigation */
@media only screen and (min-width: 1450px)
{
body.right-side-menu-active .quick-contact-form { right: 320px; }
body.right-side-menu-active #back-to-top, body.right-side-menu-active .drop-msg { right: 320px; }
}
@media only screen and (min-width: 1120px) and (max-width: 1450px)
{
body.right-side-menu-active .quick-contact-form { right: 250px; }
body.right-side-menu-active #back-to-top, body.right-side-menu-active .drop-msg { right: 250px; }
}
/* Classic Inputs and Textareas */
.classic_form { font-size: inherit; background: transparent; outline: none; width: 100%; height: auto; line-height: normal; padding: 10px 13px; border: 1px solid #DDD; margin-bottom: 15px; outline: none !important; box-shadow: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.classic_form:not(.bs-focus):focus, .classic_form:not(.bs-lg-focus):focus, .classic_form:not(.bs-light-focus):focus, .classic_form:not(.bs-inset-focus):focus { box-shadow: none; }
.classic_form.form-gray { background-color: #EEE; }
.dark-section .classic_form { border-color: #555; }
.dark-section .classic_form:hover { border-color: #666; }
.dark-section .classic_form:focus { border-color: #999; }
.classic_form.big { padding: 15px; }
.classic_form:focus { border-color: #CCC; }
.classic_form.error_warning { border-color: red !important; }
.g-recaptcha { display: inline-block; width: auto !important; border: 1px solid transparent; }
.g-recaptcha.error_warning { border-color: red !important; }
@media screen and (max-width: 361px)
{
.g-recaptcha { max-width: 290px; overflow: hidden; border-right: 1px solid #CCC; }
}
textarea.classic_form { min-height: 100px; resize: none; margin-bottom: 7px; }
textarea.classic_form.big { min-height: 150px; resize: none; }
textarea.classic_form.large { min-height: 200px; resize: none; }
select.classic_form { cursor: pointer; background: url(../images/bottom_black.png) right 16px center no-repeat transparent; -webkit-appearance: none; background-size: 12px 6px; }
/* PlaceHolder Colors */
.classic_form::-webkit-input-placeholder { color: #777; }
.classic_form:-moz-placeholder { color: #777; }
.classic_form::-moz-placeholder { color: #777; }
.classic_form:-ms-input-placeholder { color: #777; }
/* PlaceHolder Colors for light */
.light-placeholder::-webkit-input-placeholder { color: #FFF !important; }
.light-placeholder:-moz-placeholder { color: #FFF !important; }
.light-placeholder::-moz-placeholder { color: #FFF !important; }
.light-placeholder:-ms-input-placeholder { color: #FFF !important; }
form .half > * { width: 46%; width: calc(50% - 10px); float: left; }
form .half > *:nth-of-type(2n), form .half > button { float: right; }
@media screen and (max-width: 640px)
{
form .half > * { float: none; width: 100%; }
form .half > *:nth-of-type(2n), form .half > button { float: none; }
.g-recaptcha { margin-bottom: 13px; }
}
/* Inputs */
.classic_checkbox { width: 110px; font-size: 14px; height: 30px; margin: 6px; position: relative; background: transparent; display: inline-block; }
.classic_checkbox label { width: 28px; height: 28px; cursor: pointer; position: absolute; left: 0; top: 0; background: white; border-radius: 5px; border: 1px solid #CCC; line-height: 28px; text-indent: 36px; white-space: nowrap; }
.classic_checkbox label:after { content: 'L'; width: 18px; color: white; text-align: center; line-height: 16px; font-weight: 900; transform: rotateY(180deg) rotateZ(-45deg); height: 18px; position: absolute; text-indent: 0; top: 4px; left: 3px; opacity: 0; }
.classic_checkbox input[type=checkbox] { visibility: hidden; }
.classic_checkbox input[type=checkbox]:checked + label:after { opacity: 1; }
.classic_checkbox input[type=checkbox]:checked + label, .classic_checkbox:hover label { border: 1px solid #4A90E2; }
.classic_checkbox input[type=checkbox]:checked + label { background: #4A90E2; }
.classic_checkbox.radio label { border-radius: 100%; text-indent: 35px; line-height: 25px; }
.classic_checkbox input[type=radio] { visibility: hidden; display: none; }
.classic_checkbox input[type=radio]:checked + label:after { opacity: 1; }
.classic_checkbox input[type=radio]:checked + label, .classic_checkbox:hover label { border: 1px solid #4A90E2; }
.classic_checkbox input[type=radio]:checked + label { background: #4A90E2; }
.classic_checkbox.over { width: 60px; text-align: center; }
.classic_checkbox.over label { position: relative; }
/* Switch Types */
input.switch[type=checkbox] { height: 0; width: 0; visibility: hidden; }
input.switch + label { cursor: pointer; text-indent: -9999px; width: 55px; height: 26px; max-width: 55px; background: transparent; display: inline-block; border-radius: 100px; position: relative; border: 1px solid #CCC; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
input.switch + label:hover { border: 1px solid #4A90E2; }
input.switch + label:after { content: ''; position: absolute; top: 3px; left: 5px; width: 18px; height: 18px; border-radius: 90px; transition: 0.3s; background: #4A90E2; }
input.switch:checked + label { background: #4A90E2; border: 1px solid #4A90E2; }
input.switch:checked + label:after { left: calc(100% - 5px); transform: translateX(-100%); background-color: #FFF; }
label.switch:active:after { width: 130px; }
.checkbox_switch * { position: relative; line-height: 25px; vertical-align: top; margin-right: 15px; }
.checkbox_switch input { margin: 0; }
/* Input Files */
.inputfile { width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1; }
.inputfile + label { width: 100%; font-size: 13px; font-weight: inherit; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; display: inline-block; overflow: hidden; padding: 0px; color: #555; border: 1px solid #DDD; background-color: #FFF; /* 10px 20px */ }
.inputfile:focus + label, .inputfile.has-focus + label, .inputfile + label:hover { border-color: #888; }
.inputfile + label span { min-width: 100px; max-width: 90%; min-height: 25px; padding: 10px 13px; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; vertical-align: top; }
.inputfile + label strong { height: 100%; color: #FFF; padding: 10px 13px; background-color: #555; display: inline-block; }
.inputfile:focus + label strong, .inputfile.has-focus + label strong, .inputfile + label:hover strong { background-color: #555; }
@media screen and (max-width: 50em)
{
.inputfile + label strong { display: block; }
}
/* Quantities */
.quantity input { width: 50px; height: 50px; border-width: 1px; cursor: pointer; border-style: solid; display: block; float: left; text-align: center; border-color: inherit; background-color: inherit; font-size: inherit; }
.quantity.quantity-sm input { width: 35px; height: 35px; }
.quantity.quantity-lg input { width: 65px; height: 50px; }
.quantity input.numbers { border-left: none; border-right: none; width: 80px; }
.quantity input.numbers::-webkit-inner-spin-button, .quantity input.numbers::-webkit-outer-spin-button { -webkit-appearance: none; }
/* Date Picker */
.datepicker { cursor: pointer; }
.picker { color: inherit; line-height: 1.1; font-size: 17px; max-width: 100%; }
.picker--opened .picker__holder { border: 1px solid #EEE; box-shadow: 0 3px 28px rgba(0, 0, 0, 0.05); }
.picker__box { padding: 1em; }
/* Border Effects For Contact Forms */
span.border-effect { position: relative; margin: 5px 0; display: block; border: 1px solid transparent; border-bottom-color: #E4E4E4; margin-bottom: 15px; }
span.border-effect span { position: absolute; background-color: #E4E4E4; display: block; }
span.border-effect .left-br, span.border-effect .right-br { width: 1px; height: 0px; bottom: 0; left: -1px; -webkit-transition: height 0.3s ease-in-out 0.60s; -moz-transition: height 0.3s ease-in-out 0.60s; transition: height 0.3s ease-in-out 0.60s; }
span.border-effect .top-br { width: 0px; height: 1px; top: 0; left: 0; -webkit-transition: width 0.3s ease-in-out 0.39s; -moz-transition: width 0.3s ease-in-out 0.39s; transition: width 0.3s ease-in-out 0.39s; }
span.border-effect.active .left-br { height: 100%; -webkit-transition: height 0.3s ease-in-out 0.2s; -moz-transition: height 0.3s ease-in-out 0.2s; transition: height 0.3s ease-in-out 0.2s; }
span.border-effect.active .top-br { width: 100%; -webkit-transition: width 0.3s ease-in-out 0.43s; -moz-transition: width 0.3s ease-in-out 0.43s; transition: width 0.3s ease-in-out 0.43s; }
span.border-effect .right-br { right: -1px; top: 0; left: auto; -webkit-transition: height 0.3s ease-in-out 0s; -moz-transition: height 0.3s ease-in-out 0s; transition: height 0.3s ease-in-out 0s; }
span.border-effect.active .right-br { height: 100%; -webkit-transition: height 0.3s ease-in-out 0.65s; -moz-transition: height 0.3s ease-in-out 0.65s; transition: height 0.3s ease-in-out 0.65s; }
/* Sliders */
/* News Slider */
.news-slider div.slick-slide { position: relative; }
.news-slider a { position: absolute; right: 4px; top: 4px; text-align: right; display: block; z-index: 5; width: auto; color: white; line-height: 22px; background-color: rgba(0, 0, 0, 0.2); padding-left: 10px; }
.news-slider a:hover { background-color: rgba(0, 0, 0, 0.4); }
.news-slider a span { display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; margin-left: 10px; }
.news-slider img { width: auto; height: auto; min-width: 100%; }
@media only screen and (max-width: 480px)
{
.news-slider a { font-size: 10px; }
}
.slick-initialized .image-slider.slick-initialized img { display: block; min-width: 100%; max-height: 100%; }
/* Slick Slider Options */
.qdr-controls, .qdr-controls-1, .qdr-controls-2, .qdr-controls-3, .qdr-controls-4 { position: relative; letter-spacing: 0 !important; }
.qdr-controls .slick-arrow, .qdr-controls-2 .slick-arrow { width: 32px; height: 60px; font-size: 0px; border: none; background-color: #151515; background-position: center center; background-repeat: no-repeat; position: absolute; z-index: 1; top: 50%; margin-top: -20px; opacity: 0; -webkit-transition: opacity 0.4s ease-in-out 0s; -moz-transition: opacity 0.4s ease-in-out 0s; transition: opacity 0.4s ease-in-out 0s; }
.qdr-controls:hover .slick-arrow, .qdr-controls-2:hover .slick-arrow { opacity: 0.6; }
.qdr-controls .slick-arrow:hover, .qdr-controls-2 .slick-arrow:hover { opacity: 1; }
.qdr-controls .slick-arrow.slick-prev { left: 10px; background-image: url(../images/white-left.png); }
.qdr-controls .slick-arrow.slick-next { right: 10px; background-image: url(../images/white-right.png); }
.qdr-controls-2 .slick-arrow.slick-prev { left: 0; background-image: url(../images/white-left.png); }
.qdr-controls-2 .slick-arrow.slick-next { right: 0; background-image: url(../images/white-right.png); }
.qdr-controls ul.slick-dots { position: absolute; width: 100%; bottom: 10px; margin: 0; }
.qdr-controls .slick-dots li { position: relative; display: inline-block; margin: 0 4px; font-size: 0; }
.qdr-controls .slick-dots li button { border: 2px solid #DDD; background: transparent; outline: none; border-radius: 100%; width: 13px; height: 13px; padding: 0 !important; position: relative; overflow: hidden; opacity: 0; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.qdr-controls:hover .slick-dots li button { opacity: 1; }
.qdr-controls .slick-dots li button:before { content: ''; position: absolute; left: 0; bottom: 0; background: #FFF; outline: none; border-radius: 100%; width: 100%; height: 0; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.qdr-controls .slick-dots li button:hover:before, .qdr-controls .slick-dots li.slick-active button:before { height: 100%; }
/* Type 2 Arrows */
.qdr-controls-1 .slick-arrow { width: 30px; height: 30px; font-size: 0px; left: 5px; bottom: 5px; border: none; background-color: rgba(45, 45, 45, 0.9); background-position: center center; background-repeat: no-repeat; position: absolute; z-index: 1; opacity: 0; -webkit-transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; }
.qdr-controls-1 .slick-arrow:hover { background-color: white; }
.qdr-controls-1:hover .slick-arrow { opacity: 1; }
.qdr-controls-1 .slick-arrow.slick-prev { background-image: url(../images/white-left.png); }
.qdr-controls-1 .slick-arrow.slick-next { background-image: url(../images/white-right.png); margin-left: 35px; }
.qdr-controls-1 .slick-arrow.slick-prev:hover { background-image: url(../images/black-left.png); }
.qdr-controls-1 .slick-arrow.slick-next:hover { background-image: url(../images/black-right.png); }
/* Type 2 Dots */
.qdr-controls-1 .slick-dots { position: absolute; bottom: 15px; right: 6px; margin: 0; }
.qdr-controls-1 .slick-dots li { font-size: 0; float: left; display: block; }
.qdr-controls-1 .slick-dots li button { width: 9px; height: 12px; margin-right: 5px; border-radius: 100%; background: white; outline: none; border: none; box-shadow: none; }
.qdr-controls-1 .slick-dots li.slick-active button { background-color: #333; }
/* Type 3 Dots */
.qdr-controls-2 .slick-dots { position: absolute; width: 100%; bottom: 0; left: 0; right: 0; text-align: center; }
.qdr-controls-2 .slick-dots li { font-size: 0; display: inline-block; }
.qdr-controls-2 .slick-dots li button { width: 25px; height: 1px; margin: 0 3px; border-radius: 0; vertical-align: middle; padding: 0; top: 0; position: relative; background: white; outline: none; border: none; box-shadow: none; }
.qdr-controls-2 .slick-dots li.slick-active button { height: 8px !important; }
.qdr-controls-2 .slick-dots:hover li button { height: 2px; }
.qdr-controls-2 .slick-dots li button:hover { height: 8px; }
/* Type 4 arrows */
.qdr-controls-3 .slick-arrow { width: 30px; height: 30px; font-size: 0px; left: 50%; bottom: -60px; border: none; background-color: rgba(255, 255, 255, 0.9); opacity: 0.5; background-position: center center; background-repeat: no-repeat; position: absolute; z-index: 1; -webkit-transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; transition: all 0.4s ease-in-out 0s; -webkit-transform: translateX(-35px); -moz-transform: translateX(-35px); -ms-transform: translateX(-35px); transform: translateX(-35px); }
.qdr-controls-3 .slick-arrow:hover { background-color: white; opacity: 1; }
.qdr-controls-3 .slick-arrow.slick-prev { background-image: url(../images/black-left.png); }
.qdr-controls-3 .slick-arrow.slick-next { background-image: url(../images/black-right.png); margin-left: 35px; }
/* Type 4 dots */
.qdr-controls-3 .slick-dots { position: absolute; width: 100%; bottom: 0; left: 0; right: 0; text-align: center; }
.qdr-controls-3 .slick-dots li { font-size: 0; display: inline-block; }
.qdr-controls-3 .slick-dots li button { width: 9px; height: 12px; margin: 0 3px; border-radius: 100%; background: white; outline: none; border: none; box-shadow: none; }
/* Strip Dots */
.strip-dots > .slick-dots { position: relative; bottom: -20px; height: 10px; text-align: center; }
.strip-dots:not(.image-slider) > .slick-dots { bottom: auto; top: 45px; }
.strip-dots > .slick-dots li { font-size: 0; display: inline-block; }
.strip-dots > .slick-dots li button { width: 30px; height: 3px; margin-right: 10px; background: white; border: none; box-shadow: none; }
.strip-dots > .slick-dots li.slick-active button { background-color: #888; }
.strip-dots.dark-dots > .slick-dots li button { background-color: #CCC; }
.strip-dots.dark-dots > .slick-dots li.slick-active button { background-color: #666; }
/* Circle Dots */
.circle-dots .slick-dots { position: relative; margin: 0px auto 0; top: 45px; display: block !important; text-align: center; }
.circle-dots .slick-dots li { font-size: 0; float: none; display: inline-block; }
.circle-dots .slick-dots li button { width: 8px; height: 8px; border: 2px solid transparent; top: 0; margin-right: 6px; border-radius: 100%; padding: 0; background: white; position: relative; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.3s; }
.circle-dots .slick-dots li.slick-active button { background: transparent; border: 2px solid #FFF; width: 12px; height: 12px; top: -2px; }
.circle-dots.dark-dots > .slick-dots li button { background-color: #9B9B9B; }
.circle-dots.dark-dots > .slick-dots li.slick-active button { background: transparent; border: 2px solid #777; }
/* Corner Arrows */
.corner-arrows button.slick-arrow { font-size: 0; font-size: 0; position: absolute; z-index: 2; bottom: 4px; width: 30px; height: 30px; border: none; background: #FFF; opacity: 1; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.corner-arrows button.slick-arrow, .corner-arrows button.slick-arrow:before { color: #7A7A7A; font-size: 20px; background-repeat: no-repeat; background-position: center center; }
/* Next */
.corner-arrows button.slick-arrow.slick-next { right: 4px; background-image: url(../images/black-right.png); }
.corner-arrows button.slick-arrow.slick-next:before { background-image: url(../images/white-right.png); }
/* Prev */
.corner-arrows button.slick-arrow.slick-prev { right: 38px; background-image: url(../images/black-left.png); }
.corner-arrows button.slick-arrow.slick-prev:before { right: 38px; background-image: url(../images/white-left.png); }
@media only screen and (max-width: 481px)
{
.slick-slide img { width: 100%; }
}
.centermode .slick-slide img { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; opacity: 0.8; }
.centermode .slick-center img { -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 1; }
/* Caret */
.caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent; }
/* Tooltips */
.tooltip-item, [data-toggle="tooltip"] { cursor: help; }
.tooltip.in { opacity: 1 !important; }
.tooltip-inner { padding: 8px; color: white; font-size: 14px; border-radius: 5px; min-width: 150px; width: auto; max-width: 450px; background-color: #333; opacity: 1; box-shadow: 8px 4px 40px -10px rgba(0, 0, 0, 0.3); }
.tooltip-inner img { max-width: 100%; }
.tooltip-inner .tooltip-texts { padding: 10px 7px; font-size: 13px; }
/* Arrow Colors */
.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before { border-top-color: #333; }
.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before { border-right-color: #333; }
.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before { border-bottom-color: #333; }
.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before { border-left-color: #333; }
/* Popover */
[data-toggle="popover"] { cursor: pointer; position: relative; }
.popover { border: none; outline: none; padding: 25px; min-width: 240px; z-index: 999; font-size: 14px; color: #7A7A7A; border-radius: 14px; box-shadow: 2px 30px 65px 5px rgba(0, 0, 0, 0.2); }
.popover .popover-header { background-color: transparent; padding: 0 0 4px 0; border: none !important; font-size: 14px; }
.popover-body { padding: 0; color: inherit; }
.popover > .arrow { display: none !important; }
.popover img { max-width: 100%; }
@media only screen and (max-width: 641px)
{
.popover { padding: 17px 15px 17px 22px; font-size: 12px; }
}
/* Hotspots */
.hotspots { position: relative; }
.hotspots img { display: block; width: 100%; height: auto; position: relative; z-index: 1; }
.hotspots img[src*="loading"] + .items .item, .hotspots img[src*="loader"] + .items .item { display: none; }
.hotspots img[src*="loading"], .hotspots img[src*="loader"] { width: auto; margin: 40px auto; display: block; }
.hotspots .items { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 2; overflow: hidden; }
.hotspots .items .item { position: absolute; font-weight: 700; display: block; }
.hotspots .items .item.center { left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); }
/* InfoCard */
[data-infocard] { position: relative; }
.hiding .infocard { visibility: hidden !important; opacity: 0 !important; }
.infocard { visibility: hidden; opacity: 0; cursor: default; width: 420px; z-index: 10; max-height: 300px; margin-top: 20px; height: auto; position: absolute; left: 0; top: 100%; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.infocard .row { margin: 0; }
.infocard.active { visibility: visible; opacity: 1; margin-top: 10px; }
.infocard.to-top { top: auto; bottom: 100%; margin-top: auto; margin-bottom: 20px; }
.infocard.to-top.active { margin-top: auto; margin-bottom: 10px; }
.infocard.to-right { left: 0% !important; }
.infocard.to-left { left: auto !important; right: 100% !important; }
@media only screen and (max-width: 768px)
{
.infocard { display: none !important; }
}
/* CoundDowns */
.countdown .countdowns { display: inline-block; margin: 0; text-align: center; }
.countdown .countdowns div { display: inline-block; padding: 15px; margin: 0 20px 10px; }
.countdown .countdowns div:first-child { margin-left: 0; }
.countdown .countdowns div:last-child { margin-right: 0; }
.countdown span.time { display: inline-block; line-height: inherit; }
.countdown span.datename { display: block; font-size: 12px; letter-spacing: -0.2px; font-family: "Open Sans", "PT Sans", sans-serif; font-weight: 600; text-transform: capitalize; }
.countdown span.dot { vertical-align: super; font-family: "Open Sans", "PT Sans", sans-serif; font-weight: 400; }
@media only screen and (max-width: 768px)
{
.countdown span.dot { display: none; }
}
/* Type1 */
.countdown.type-1 .countdowns div { background-color: #333; color: white; padding: 7px 15px 12px; border-radius: 7px; }
@media only screen and (max-width: 768px)
{
.countdown.type-1 .countdowns div { padding: 3px 6px 4px; margin-right: 3px; margin-left: 3px; }
}
/* type2 */
.countdown.type-2 .countdowns div { border: 1px solid #EEE; padding: 7px 15px 12px; border-radius: 7px; }
@media only screen and (max-width: 768px)
{
.countdown.type-2 .countdowns div { padding: 3px 6px 4px; margin-right: 3px; margin-left: 3px; }
}
/* type3 */
.countdown.type-3 .countdowns div { background-color: #2E7CDC; color: white; padding: 7px 15px 12px; border-radius: 7px; }
@media only screen and (max-width: 768px)
{
.countdown.type-3 .countdowns div { padding: 3px 6px 4px; margin-right: 3px; margin-left: 3px; }
}
/* type4 */
.countdown.type-4 span.dot { display: none; }
.countdown.type-4 .countdowns div { padding: 3px; margin-right: 3px; margin-left: 3px; }
.countdown.type-4 span.datename { display: inline-block; margin-left: 5px; }
/* SIDEBAR */
#sidebar { background-color: #272727; z-index: 1025; width: 350px; padding: 25px; color: #F6F2F0; position: fixed !important; }
#sidebar.styled { padding: 0; }
#sidebar.styled .sidebar-container { padding: 25px; }
#sidebar.top { max-height: 75%; padding: 0; }
#sidebar.bottom { max-height: 50%; padding: 0; }
#sidebar .title { color: #FFF; }
#sidebar .subtitle { margin: 40px 0 15px; }
#sidebar ul { margin: 0 0 40px 0; }
#sidebar ul li a { display: block; border-bottom: 1px solid #333; padding: 10px 0; }
#sidebar ul li a:hover { padding-left: 9px; background-color: rgba(0, 0, 0, 0.05); }
#sidebar ul li:last-child a { border-bottom: none; }
/* Body shadow when sidebar is open */
.pushable > .pusher.dimmed:after { background: rgba(22, 20, 20, 0.6); z-index: 2000; }
.pushable > .pusher { z-index: 1010 !important; }
body #sidebar.right + .pusher.dimmed { -webkit-transform: translate3d(-100px,0,0) !important; transform: translate3d(-100px, 0, 0) !important; }
body #sidebar.left + .pusher.dimmed { -webkit-transform: translate3d(100px,0,0) !important; transform: translate3d(100px, 0, 0) !important; }
/* Local Video Styles */
.videobg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; background-size: cover; z-index: -1; }
.videobg video { object-fit: cover; width: 100%; height: auto; position: absolute; top: 50%; left: 50%; min-height: 100%; z-index: -1; transform: translateX(-50%) translateY(-50%) translateZ(0); }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
/* Video radius for circular effects */
.circular-effect-to-bottom .videobg { border-bottom-left-radius: 300%; border-bottom-right-radius: 300%; }
/* Full Screen Search Form On Navigation */
.fs-searchform { z-index: 2000; width: 100%; height: 100%; position: fixed; left: 0; top: 0; visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); }
.fs-searchform .form-bg { background-color: rgba(0, 0, 0, 0.7); position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); left: 0; top: 0; z-index: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
.fs-searchform.active { visibility: visible; }
.fs-searchform.active .form-bg { opacity: 1; -webkit-transition-delay: 0s; transition-delay: 0s; }
#fs-searchform { position: relative; z-index: 1; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; opacity: 0; }
.fs-searchform.active #fs-searchform { opacity: 1; }
#fs-searchform input { width: 100%; outline: none; border: none; background-color: #121212; padding: 10px 20px 12px; position: relative; font-size: 16px; color: #C9C9C9; box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.1); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.fs-searchform.active #fs-searchform input { padding-left: 20px; }
#fs-searchform button { position: absolute; right: 10px; top: 8px; border: none; background: transparent; color: #AAA; }
#fs-searchform button i { font-size: 14px; }
/* Place Holders effects For Browsers */
#fs-searchform input::-webkit-input-placeholder { color: #888; opacity: 0; }
#fs-searchform input:-moz-placeholder { color: #888; opacity: 0; }
#fs-searchform input::-moz-placeholder { color: #888; opacity: 0; }
#fs-searchform input:-ms-input-placeholder { color: #888; opacity: 0; }
.fs-searchform.active #fs-searchform ::-webkit-input-placeholder { opacity: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.5s; }
.fs-searchform.active #fs-searchform :-moz-placeholder { opacity: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.5s; }
.fs-searchform.active #fs-searchform ::-moz-placeholder { opacity: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.5s; }
.fs-searchform.active #fs-searchform :-ms-input-placeholder { opacity: 1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.5s; }
/* Recommended Page styles and effects*/
.fs-searchform .recommended { margin: 0; opacity: 0; background: white; padding: 20px 0; box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.2); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.fs-searchform.active .recommended { opacity: 1; }
.fs-searchform .recommended .rcm-title { color: #AAA; cursor: default; padding-left: 25px; }
.fs-searchform .recommended .rcm-title::selection { background: transparent; color: inherit; }
.fs-searchform .recommended a { display: block; padding: 7px 10px 7px 40px; position: relative; left: 50px; opacity: 0; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; }
.fs-searchform.active .recommended a { left: 0; opacity: 1; }
.fs-searchform .recommended a:hover { background-color: #EEE; color: #2777DA; }
.fs-searchform.active .recommended a:nth-of-type(1) { -webkit-transition: opacity 0.3s 0.8s, left 0.3s 0s; -moz-transition: opacity 0.3s 0.0s, left 0.3s 0.0s; transition: opacity 0.3s 0.0s, left 0.3s 0.0s; }
.fs-searchform.active .recommended a:nth-of-type(2) { -webkit-transition: opacity 0.3s 0.1s, left 0.3s 0.1s; -moz-transition: opacity 0.3s 0.1s, left 0.3s 0.1s; transition: opacity 0.3s 0.1s, left 0.3s 0.1s; }
.fs-searchform.active .recommended a:nth-of-type(3) { -webkit-transition: opacity 0.3s 0.2s, left 0.3s 0.2s; -moz-transition: opacity 0.3s 0.2s, left 0.3s 0.2s; transition: opacity 0.3s 0.2s, left 0.3s 0.2s; }
.fs-searchform.active .recommended a:nth-of-type(4) { -webkit-transition: opacity 0.3s 0.3s, left 0.3s 0.3s; -moz-transition: opacity 0.3s 0.3s, left 0.3s 0.3s; transition: opacity 0.3s 0.3s, left 0.3s 0.3s; }
.fs-searchform.active .recommended a:nth-of-type(5) { -webkit-transition: opacity 0.3s 0.4s, left 0.3s 0.4s; -moz-transition: opacity 0.3s 0.4s, left 0.3s 0.4s; transition: opacity 0.3s 0.4s, left 0.3s 0.4s; }
.fs-searchform.active .recommended a:nth-of-type(6) { -webkit-transition: opacity 0.3s 0.5s, left 0.3s 0.5s; -moz-transition: opacity 0.3s 0.5s, left 0.3s 0.5s; transition: opacity 0.3s 0.5s, left 0.3s 0.5s; }
.fs-searchform.active .recommended a:nth-of-type(7) { -webkit-transition: opacity 0.3s 0.6s, left 0.3s 0.6s; -moz-transition: opacity 0.3s 0.6s, left 0.3s 0.6s; transition: opacity 0.3s 0.6s, left 0.3s 0.6s; }
/* Responsive Search form */
@media only screen and (max-width: 1185px)
{
#fs-searchform button { right: 25px; }
}
@media only screen and (max-width: 640px)
{
#fs-searchform input { font-size: 13px; }
.fs-searchform .recommended .rcm-title { padding-left: 15px; padding-bottom: 10px; }
.fs-searchform .recommended a { padding: 4px 15px; font-size: 13px; }
}
/* Basic Search Form */
.basic-search { position: relative; }
.basic-search input { margin: 0; }
.basic-search button { position: absolute; right: 7px; top: 50%; background: transparent; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
/* Mouse animate icon */
.mouse-icon { border: 2px solid #FFF; border-radius: 16px; height: 40px; width: 24px; margin: 0 auto; display: block; z-index: 10; opacity: 0.7; }
.mouse-icon .wheel { -webkit-animation-name: drop; -webkit-animation-duration: 1s; -webkit-animation-timing-function: linear; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; -webkit-animation-play-state: running; -webkit-animation-name: drop; animation-name: drop; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-play-state: running; animation-play-state: running; }
.mouse-icon .wheel { position: relative; border-radius: 10px; background: #FFF; width: 2px; height: 6px; top: 4px; margin-left: auto; margin-right: auto; }
@-webkit-keyframes drop
{
0% { top: 5px; opacity: 0; }
30% { top: 10px; opacity: 1; }
100% { top: 25px; opacity: 0; }
}
@keyframes drop
{
0% { top: 5px; opacity: 0; }
30% { top: 10px; opacity: 1; }
100% { top: 25px; opacity: 0; }
}
/* Scroll strip */
#scroll-strip { width: 1px; height: 400px; left: 100px; top: 50%; margin-top: -200px; position: fixed; z-index: 120; background-color: rgba(170, 170, 170, 0.5); overflow: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); }
#scroll-strip.right { right: 60px; left: auto; }
#scroll-strip #scroll-strip-mover { width: 100%; position: absolute; top: 0; background-color: rgba(0, 0, 0, 0.5); }
.load-with-waypoint { position: relative; }
.load-with-waypoint:before { content: ''; width: 100%; height: 100%; z-index: 25; background-color: inherit; display: block; position: absolute; right: 0; top: 0; -webkit-transition: width 1s cubic-bezier(0.77, 0, 0.2, 1) !important; -moz-transition: width 1s cubic-bezier(0.77, 0, 0.2, 1) !important; transition: width 1s cubic-bezier(0.77, 0, 0.2, 1) !important; }
.load-with-waypoint.waypoint-active:before { width: 0; }
/* Sidebar - menu */
.sidemenu .widget { width: 100%; height: auto; margin: 0 auto 60px; font-size: inherit; }
.sidemenu .widget:last-child { margin-bottom: 15px; }
.sidemenu .widget .widget-title { margin: 0 0 15px; padding-bottom: 6px; }
/* Widget Posts */
.sidemenu .widget .widget-post { margin: 0; padding: 10px; border-bottom: 1px solid rgba(100, 100, 100, 0.1); display: block; }
.sidemenu .widget .widget-post .widget-image { width: 30%; height: auto; float: left; }
.sidemenu .widget .widget-post .widget-image img { width: 100%; height: auto; }
.sidemenu .widget .widget-post .details { width: 70%; height: auto; float: left; padding-left: 15px; }
.sidemenu .widget .widget-post .details h4 { margin: 0 0 6px; padding: 0; font-size: 16px; }
.sidemenu .widget .widget-post .details p.date { margin: 0; font-size: 13px; color: #888; }
/* Listings */
.item-list-type-1 { margin: 40px auto; max-width: 90%; }
.item-list-type-1 .list-item { color: #757575; border-color: #DDD !important; display: block; width: 100%; height: auto; padding: 17px 20px; border: 1px; border-style: solid; border-top: 0px; font-size: 17px; text-transform: uppercase; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.item-list-type-1:not(.light-type) .list-item:hover { background-color: #FAFAFA !important; }
.item-list-type-1.mini, .item-list-type-1.fullwidth { max-width: 100%; }
.item-list-type-1.mini .list-item { padding: 5px 9px; }
.item-list-type-1.custom-texts .list-item { font-size: inherit; text-transform: inherit; }
.item-list-type-1 .list-item:first-child { border-top: 1px solid #DDD; }
.item-list-type-1 .list-item:nth-of-type(2n) { background-color: rgba(20, 20, 20, 0.01); }
.item-list-type-1 .list-item > div { float: left; width: 30%; }
.item-list-type-1.items-2 .list-item > div { float: left; width: 50%; }
.item-list-type-1:not(.items-2) .list-item > div:first-child { width: 20%; text-align: left; }
.item-list-type-1:not(.items-2) .list-item > div:last-child { width: 20%; text-align: right; }
.item-list-type-1 .list-item.title { padding: 30px 20px; }
.item-list-type-1 .list-item.title div { text-align: center; font-size: 22px; text-transform: uppercase; }
.item-list-type-1.light-type .list-item { border-color: #333 !important; color: #CCC; }
.item-list-type-1.light-type .list-item:nth-of-type(2n) { background-color: rgba(0, 0, 0, 0.06); }
@media only screen and (max-width: 700px)
{
.item-list-type-1 .list-item div { float: none; text-align: center !important; width: 100% !important; margin: 5px auto; }
}
/* Nav list */
.nav { display: block; }
ul.nav-list { padding: 0; text-align: left; }
ul.nav-list li { display: block; margin: 0; }
ul.nav-list li a { background-color: transparent; position: relative; color: #5A5A5A; font-weight: 400; display: block; margin: 0; padding: 8px 3px 8px 18px; border-bottom: 1px solid #EEE; font-size: 0.965em; }
ul.nav-list.list-lg li a { padding: 11px 3px 11px 18px; font-size: 1em; }
ul.nav-list.list-sm li a { padding: 6px 3px 6px 18px; font-size: 0.885em; }
ul.nav-list li a:hover { background-color: #EEE; }
ul.nav-list.underline-hover-container li a:hover { background-color: transparent; }
ul.nav-list li a:before { content: ''; display: block; border-top: 4px solid transparent; border-bottom: 4px solid transparent; border-left: 4px solid #353535; margin: -4px 0 0 -11px; top: 50%; position: absolute; width: 0px; height: 0px; }
ul.nav-list.nav-list-icons li a:before { display: none; }
ul.nav-list.nav-list-icons li a span { left: -14px; position: relative; }
/* List icons */
ul.list-icons li { padding-left: 28px; position: relative; margin-bottom: 12px; }
ul.list-icons.t-right li { padding-right: 28px; padding-left: 0; }
ul.list-icons li i { position: absolute; left: 0; top: 5px; }
ul.list-icons.t-right li i { left: auto; right: 0; }
/* Active For List Group Items */
ul.list-group > li a.active.list-group-item, ul.list-group > li a.active.list-group-item, ul.list-group > li button.active.list-group-item, ul.list-group > li button.active.list-group-item { background-color: rgba(150, 150, 150, 0.1); color: #444; }
.list-group-item > .badge { float: right; }
/* Classic List Types */
.list { padding-left: 20px; text-align: left; }
.list.list-xs li { margin-bottom: 0px; }
.list.list-sm li { margin-bottom: 5px; }
.list.list-lg li { margin-bottom: 10px; }
.list.list-xl li { margin-bottom: 16px; }
.list.list-side { padding-left: 0; }
.list.list-side > li { display: inline-block; padding-right: 10px; margin-bottom: 15px; }
.list.list-side li > .icon { width: 22px; height: 22px; background: #E8E8E8; line-height: 22px; top: -1px; margin-right: 7px; position: relative; font-size: 10px; border-radius: 100%; }
.list-circle { list-style-type: circle; }
.list-disc { list-style-type: disc; }
.list-number { list-style-type: decimal; }
.list-square { list-style-type: square; }
.list-roman { list-style-type: upper-roman; }
.list-alpha { list-style-type: lower-alpha; }
/* Border List */
ul.basic-list li { padding: 8px 0; border-color: rgba(100, 100, 100, 0.1); border-style: solid; border-bottom-width: 1px; }
ul.basic-list li i { margin-right: 10px; }
ul.basic-list.list-sm li { padding: 5px 0; }
ul.basic-list.list-lg li { padding: 15px 0; }
ul.basic-list.list-xl li { padding: 22px 0; }
ul.basic-list.border-white li { border-color: rgba(255, 255, 255, 0.1); }
ul.basic-list.no-border li { border: none !important; }
ul.basic-list li:last-child { border-bottom-width: 0; }
/* breadcrumb on titles. */
ol.breadcrumb { margin-top: 0; margin-bottom: 0; padding-bottom: 0; padding-top: 0; background: transparent; display: block; }
ol.breadcrumb li { font-size: 13px; display: inline-block; }
/* Accordions */
.accordion-toggle-link { margin: 0; border: 1px solid #DDD; display: block; width: 100%; height: auto; padding: 13px 15px; font-size: 14px; cursor: pointer; position: relative; border-radius: 6px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.accordion-toggle-link:hover { box-shadow: 0px 20px 25px rgba(0, 0, 0, 0.05); }
.accordion-toggle-link:after { content: ''; position: absolute; right: 20px; top: 50%; margin-top: -3px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #FFF; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.accordion-toggle-link.collapsed:after { border-top-color: #333; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); }
.accordion-toggle-link.collapsed { background-color: #FFF; color: #565656; }
.accordion-toggle-container { padding: 15px; }
/* Table big cols, large and no-border styles */
.table.big-cols > tbody > tr > td, .table.big-cols > tbody > tr > th, .table.big-cols > tfoot > tr > td, .table.big-cols > tfoot > tr > th, .table.big-cols > thead > tr > td, .table.big-cols > thead > tr > th { padding: 14px; }
/* Table Types */
table tr:first-child th, table tr:first-child td, table tr:first-child { border-top: none; }
table.table-noborder td, table.table-noborder th { border: none !important; }
table.table-lg td, table.table-lg th { padding: 1.2em !important; }
table.table-md td, table.table-md th { padding: 1.0em !important; }
/* Process Steps */
.process-steps li { position: relative; text-align: center; }
.process-steps li:before, .process-steps li:after { content: ''; width: 50%; top: 30px; border-top: 1px dashed #DDD; position: absolute; z-index: 0; }
.process-steps li:before { left: 0; }
.process-steps li:first-child:before, .process-steps li:last-child:after { display: none; }
.process-steps li a { display: inline-block; width: 60px; height: 60px; line-height: 60px; padding: 0; font-size: 18px; position: relative; z-index: 1; }
.process-steps li a.active { background-color: #333; color: white !important; }
.process-steps li p { margin-top: 15px; }
/* Tabs */
/* Creative Tabs */
.creative-tabs { width: auto; display: inline-block; text-align: center; font-size: 0px; line-height: 0px; }
.creative-tabs > li, .creative-tabs > div { display: inline-block; float: none; }
.creative-tabs a, .creative-tabs > div > div { display: block; border: none !important; cursor: pointer !important; }
.creative-tabs > li > a:not(.active), .creative-tabs div:not(.cbp-filter-item-active) > * { background: transparent !important; color: inherit; }
.nav.nav-tabs.creative-tabs li a.active, .creative-tabs div.cbp-filter-item-active > * { color: white; box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.2); }
@media only screen and (max-width: 481px)
{
.creative-tabs li, .creative-tabs > div { width: auto; margin: 0 0 10px; }
.creative-tabs { width: 90%; }
.creative-tabs li:last-child, .creative-tabs > div:last-child { margin-bottom: 0; }
}
/* Modern Tabs */
.modern-tabs-container { display: block; border-style: solid; }
.modern-tabs { display: inline-block; margin: 0; border-color: inherit; border-bottom: none; padding: 0; vertical-align: bottom; position: relative; z-index: 2; border-color: inherit; overflow: hidden; border-radius: 0px !important; }
.modern-tabs.nav-tabs { }
.modern-tabs > li, .modern-tabs > div { display: block; float: left; border-color: inherit; }
.modern-tabs > li a, .modern-tabs > div a { display: block; float: left; overflow: hidden; position: relative; padding: 12px 35px; border-left-width: 1px; line-height: normal; border-top-width: 1px; border-style: solid; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.modern-tabs > li > a:not(.active), .modern-tabs > div > a:not(.active) { background: transparent !important; color: inherit !important; border-left: none; border-top-right-radius: 0px; border-top-left-radius: 0px; border-color: inherit !important; }
.modern-tabs > li:nth-of-type(1) a, .modern-tabs.vertical-tabs > li > a { border-left: 1px solid; }
.modern-tabs > li:last-child a, .modern-tabs > div:last-child a { border-right: 1px solid #E1E1E1; }
.modern-tabs a, .modern-tabs > div > div { display: block; font-size: inherit; cursor: pointer !important; }
.modern-tabs:not(.vertical-tabs) a i { display: block; font-size: 35px; margin-bottom: 7px; }
.modern-tabs a i.icon { font-size: 25px; margin-bottom: 0px; padding: 10px 0; }
.modern-tabs-container + .tab-content { margin-top: 30px; }
@media only screen and (max-width: 640px)
{
.modern-tabs > li a, .modern-tabs > div a { padding: 11px 25px; }
}
/* Modern Tabs Rounded */
.modern-tabs.radius > li:first-child a, .modern-tabs.radius { border-top-left-radius: 10px !important; }
.modern-tabs.radius > li:last-child a, .modern-tabs.radius { border-top-right-radius: 10px !important; }
.modern-tabs-container.no-border .modern-tabs.radius > li:first-child a, .modern-tabs-container.no-border .modern-tabs.radius { border-bottom-left-radius: 10px !important; }
.modern-tabs-container.no-border .modern-tabs.radius > li:last-child a, .modern-tabs-container.no-border .modern-tabs.radius { border-bottom-right-radius: 10px !important; }
/* Vertical Tabs */
.modern-tabs.vertical-tabs > li, .modern-tabs.vertical-tabs > div { display: block; float: none; width: 100%; }
.modern-tabs.vertical-tabs > li a, .modern-tabs.vertical-tabs > div a { padding: 15px 20px; width: 100%; border-right-width: 1px; border-bottom-width: 0px; }
/* Vertical Tab Sizes */
.modern-tabs.vertical-tabs.tabs-sm > li a, .modern-tabs.vertical-tabs.tabs-sm > div a { padding: 18px 16px; }
.modern-tabs.vertical-tabs.tabs-xs > li a, .modern-tabs.vertical-tabs.tabs-xs > div a { padding: 14px 12px; }
@media only screen and (max-width: 481px)
{
.modern-tabs.vertical-tabs.tabs-sm > li a, .modern-tabs.vertical-tabs.tabs-sm > div a { padding: 15px 11px; }
.modern-tabs.vertical-tabs.tabs-xs > li a, .modern-tabs.vertical-tabs.tabs-xs > div a { padding: 12px 7px; }
}
.modern-tabs.vertical-tabs > li:last-child a, .modern-tabs.vertical-tabs > div:last-child a { border-bottom-width: 1px; }
.modern-tabs.vertical-tabs.radius-lg { border-radius: 50px !important; }
.modern-tabs.vertical-tabs.radius-lg > li a, .modern-tabs.vertical-tabs.radius-lg > div a { border-radius: 0; }
.modern-tabs.vertical-tabs.radius-lg > li:first-child a, .modern-tabs.vertical-tabs.radius-lg > div:first-child a { padding-top: 25px; margin-top: -1px; border-top-left-radius: 50px; border-top-right-radius: 50px; }
.modern-tabs.vertical-tabs.radius-lg > li:last-child a, .modern-tabs.vertical-tabs.radius-lg > div:last-child a { padding-bottom: 25px; margin-bottom: -1px; border-bottom-left-radius: 50px; border-bottom-right-radius: 50px; }
/* Tab Content Effect */
.tab-content.slide-effect { position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.tab-content.slide-effect .tab-pane { display: block; }
.tab-content.slide-effect .tab-pane .tab-container { width: 100%; transition-delay: 3s; position: absolute; opacity: 0; top: 0; overflow: hidden; }
.tab-content.slide-effect .tab-pane:not(.active) .tab-container { max-height: 100%; pointer-events: none; animation: tabPaneChangeEffectBack 0.6s ease; -webkit-animation: tabPaneChangeEffectBack .6s ease; backface-visibility: hidden; }
.tab-content.slide-effect .tab-pane.active .tab-container { position: relative; opacity: 1; animation: tabPaneChangeEffect 0.6s ease; -webkit-animation: tabPaneChangeEffect .6s ease; }
@-webkit-keyframes tabPaneChangeEffect
{
0% { opacity: 0; left: 25px; }
100% { opacity: 1; left: 0px; }
}
@-moz-keyframes tabPaneChangeEffect
{
0% { opacity: 0; left: 25px; }
100% { opacity: 1; left: 0px; }
}
@-ms-keyframes tabPaneChangeEffect
{
0% { opacity: 0; left: 25px; }
100% { opacity: 1; left: 0px; }
}
@-o-keyframes tabPaneChangeEffect
{
0% { opacity: 0; left: 25px; }
100% { opacity: 1; left: 0px; }
}
@keyframes tabPaneChangeEffect
{
0% { opacity: 0; left: 25px; }
100% { opacity: 1; left: 0px; }
}
@-webkit-keyframes tabPaneChangeEffectBack
{
0% { opacity: 1; left: 0px; }
100% { opacity: 1; left: -25px; }
}
@-moz-keyframes tabPaneChangeEffectBack
{
0% { opacity: 1; left: 0px; }
100% { opacity: 0; left: -25px; }
}
@-ms-keyframes tabPaneChangeEffectBack
{
0% { opacity: 1; left: 0px; }
100% { opacity: 0; left: -25px; }
}
@-o-keyframes tabPaneChangeEffectBack
{
0% { opacity: 1; left: 0px; }
100% { opacity: 0; left: -25px; }
}
@keyframes tabPaneChangeEffectBack
{
0% { opacity: 1; left: 0px; }
100% { opacity: 0; left: -25px; }
}
/* Loading Effects */
/* Square */
.loader-square { width: 30px; height: 30px; background-color: #333; margin: 0 auto; -webkit-animation: rotateplane 1.2s infinite ease-in-out; animation: rotateplane 1.2s infinite ease-in-out; }
@-webkit-keyframes rotateplane
{
0% { -webkit-transform: perspective(120px); }
50% { -webkit-transform: perspective(120px) rotateY(180deg); }
100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); }
}
@keyframes rotateplane
{
0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg); -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }
100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); }
}
/* Signal */
.loader-signal, .loader__figure { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.loader-signal { overflow: visible; padding-top: 1.5em; width: 2em; }
.loader-signal .loader__figure { height: 0; width: 0; box-sizing: border-box; border: 0 solid #FE665C; border-radius: 50%; -webkit-animation: loader-signal 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); -moz-animation: loader-signal 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); animation: loader-signal 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); }
.loader-signal .loader__label { float: left; margin-left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); margin: 0 0 0 50%; font-size: 0.875em; letter-spacing: 0.1em; line-height: 1.5em; color: #8D3B3E; white-space: nowrap; -webkit-animation: loader-signal-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); -moz-animation: loader-signal-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); animation: loader-signal-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1); }
.loader-signal .loader__figure + .loader__label { margin-top: 10px; }
@-webkit-keyframes loader-signal
{
0% { height: 0; width: 0; background-color: #FE665C; }
29% { background-color: #FE665C; }
30% { height: 2em; width: 2em; background-color: transparent; border-width: 1em; opacity: 1; }
100% { height: 2em; width: 2em; border-width: 0; opacity: 0; background-color: transparent; }
}
@-moz-keyframes loader-signal
{
0% { height: 0; width: 0; background-color: #FE665C; }
29% { background-color: #FE665C; }
30% { height: 2em; width: 2em; background-color: transparent; border-width: 1em; opacity: 1; }
100% { height: 2em; width: 2em; border-width: 0; opacity: 0; background-color: transparent; }
}
@keyframes loader-signal
{
0% { height: 0; width: 0; background-color: #FE665C; }
29% { background-color: #FE665C; }
30% { height: 2em; width: 2em; background-color: transparent; border-width: 1em; opacity: 1; }
100% { height: 2em; width: 2em; border-width: 0; opacity: 0; background-color: transparent; }
}
@-webkit-keyframes loader-signal-label
{
0% { opacity: 0.25; }
30% { opacity: 1; }
100% { opacity: 0.25; }
}
@-moz-keyframes loader-signal-label
{
0% { opacity: 0.25; }
30% { opacity: 1; }
100% { opacity: 0.25; }
}
@keyframes loader-signal-label
{
0% { opacity: 0.25; }
30% { opacity: 1; }
100% { opacity: 0.25; }
}
/* Loader Circle */
.loader-circle { position: absolute; left: 50%; top: 50%; width: 90px; height: 90px; border-radius: 50%; box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.2); margin-left: -45px; margin-top: -45px; }
.loader-line-mask { position: absolute; left: 50%; top: 50%; width: 45px; height: 90px; margin-left: -45px; margin-top: -45px; overflow: hidden; -webkit-transform-origin: 45px 45px; -moz-transform-origin: 45px 45px; -ms-transform-origin: 45px 45px; -o-transform-origin: 45px 45px; transform-origin: 45px 45px; -webkit-mask-image: -webkit-linear-gradient(top, #000000, rgba(0, 0, 0, 0)); -webkit-animation: circleRotate 1.2s infinite linear; -moz-animation: circleRotate 1.2s infinite linear; -o-animation: circleRotate 1.2s infinite linear; animation: circleRotate 1.2s infinite linear; }
.loader-line-mask .loader-line { width: 90px; height: 90px; border-radius: 50%; box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 1); }
/* Dark */
.loader-circle.dark { box-shadow: inset 0 0 0 3px rgba(0, 0, 0, 0.1); }
.loader-circle.dark + .loader-line-mask .loader-line { box-shadow: inset 0 0 0 3px rgba(60, 60, 60, 1); }
/* Keyframes for circle loader */
@-webkit-keyframes circleRotate
{
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes circleRotate
{
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(360deg); }
}
@-o-keyframes circleRotate
{
0% { -o-transform: rotate(0deg); }
100% { -o-transform: rotate(360deg); }
}
@keyframes circleRotate
{
0% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); }
}
/* Spinner */
.spinner { margin: 0 auto; width: 70px; position: relative; text-align: center; }
.spinner > div { position: absolute; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin-left: 30px; background-color: #FFF; border-radius: 100%; display: inline-block; -webkit-animation: sk-bouncedelay 2s infinite; animation: sk-bouncedelay 2s infinite; }
.spinner .spinner__item1 { -webkit-animation-delay: -0.60s; animation-delay: -0.60s; margin-left: -30px; }
.spinner .spinner__item2 { -webkit-animation-delay: -0.40s; animation-delay: -0.40s; margin-left: -10px; }
.spinner .spinner__item3 { -webkit-animation-delay: -0.20s; animation-delay: -0.20s; margin-left: 10px; }
@-webkit-keyframes sk-bouncedelay
{
0%, 80%, 100% { width: 0px; height: 0px; opacity: 0; }
40% { width: 16px; height: 16px; opacity: 1; }
}
@keyframes sk-bouncedelay
{
0%, 80%, 100% { width: 0px; height: 0px; opacity: 0; }
40% { width: 16px; height: 16px; opacity: 1; }
}
/* Square 1 */
.square1 { display: inline-block; width: 30px; height: 30px; position: relative; border: 4px solid #CCC; top: 50%; -webkit-animation: square1 4s infinite ease; animation: square1 4s infinite ease; }
.square1-inner { vertical-align: top; display: inline-block; width: 100%; background-color: #CCC; -webkit-animation: square1-inner 4s infinite ease-in; animation: square1-inner 4s infinite ease-in; }
@-webkit-keyframes square1
{
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
25% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
75% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes square1
{
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
25% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
50% { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
75% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-webkit-keyframes square1-inner
{
0% { height: 0%; }
25% { height: 0%; }
50% { height: 100%; }
75% { height: 100%; }
100% { height: 0%; }
}
@keyframes square1-inner
{
0% { height: 0%; }
25% { height: 0%; }
50% { height: 100%; }
75% { height: 100%; }
100% { height: 0%; }
}
/* Loading Effects */
.page-loader { z-index: 9750; text-align: center; position: fixed; top: 0; left: 0; width: 100%; height: 100%; -webkit-animation-duration: .2s; -moz-animation-duration: .2s; -ms-animation-duration: .2s; -o-animation-duration: .2s; animation-duration: 0.2s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; -ms-animation-fill-mode: forwards; -o-animation-fill-mode: forwards; animation-fill-mode: forwards; }
@-webkit-keyframes page-loader-fade-out
{
0% { opacity: 1; }
100% { opacity: 0; }
}
@-moz-keyframes page-loader-fade-out
{
0% { opacity: 1; }
100% { opacity: 0; }
}
@-ms-keyframes page-loader-fade-out
{
0% { opacity: 1; }
100% { opacity: 0; }
}
@-o-keyframes page-loader-fade-out
{
0% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes page-loader-fade-out
{
0% { opacity: 1; }
100% { opacity: 0; }
}
@-webkit-keyframes page-loader-fade-in
{
0% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes page-loader-fade-in
{
0% { opacity: 0; }
100% { opacity: 1; }
}
@-ms-keyframes page-loader-fade-in
{
0% { opacity: 0; }
100% { opacity: 1; }
}
@-o-keyframes page-loader-fade-in
{
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes page-loader-fade-in
{
0% { opacity: 0; }
100% { opacity: 1; }
}
.page-loader--fading-out { -webkit-animation-name: page-loader-fade-out; -moz-animation-name: page-loader-fade-out; -ms-animation-name: page-loader-fade-out; -o-animation-name: page-loader-fade-out; animation-name: page-loader-fade-out; -webkit-animation-duration: .5s; -moz-animation-duration: .5s; -ms-animation-duration: .5s; -o-animation-duration: .5s; animation-duration: 0.5s; }
.page-loader--hidden { display: none; }
.page-loader--fading-in { -webkit-animation-name: page-loader-fade-in; -moz-animation-name: page-loader-fade-in; -ms-animation-name: page-loader-fade-in; -o-animation-name: page-loader-fade-in; animation-name: page-loader-fade-in; }
/* Hamburger menu icon on the navigations */
.hamburger-menu { display: flex; align-self: center; flex-direction: column; justify-content: space-between; width: 27px; height: 14px; cursor: pointer; top: 50%; position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.hamburger-menu div { align-self: flex-end; height: 2px; width: 100%; background: #3A3A3A; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.hamburger-menu div:nth-of-type(2) { margin: 3px 0; }
.hamburger-menu .meat { width: 100%; transition: all 200ms ease-in-out; }
.hamburger-menu .bottom-bun { width: 100%; transition: all 400ms ease-in-out; }
.mobile-nb:hover .hamburger-menu div, .hamburger-menu:hover div, .menu-trigger:hover .hamburger-menu div { width: 100%; }
.mobile-nb:hover .hamburger-menu .top-bun, .hamburger-menu:hover .top-bun, .menu-trigger:hover .hamburger-menu .top-bun { animation: burger-hover 0.8s infinite ease-in-out alternate; }
.mobile-nb:hover .hamburger-menu .meat, .hamburger-menu:hover .meat, .menu-trigger:hover .hamburger-menu .meat { animation: burger-hover 0.8s infinite ease-in-out alternate forwards 150ms; }
.mobile-nb:hover .hamburger-menu .bottom-bun, .hamburger-menu:hover .bottom-bun, .menu-trigger:hover .hamburger-menu .bottom-bun { animation: burger-hover 0.8s infinite ease-in-out alternate forwards 300ms; }
@keyframes burger-hover
{
0% { width: 100%; }
50% { width: 50%; }
100% { width: 100%; }
}
/* Theme Section and Skeleton Styles */
/* ============================================================ */
/* Modern Navigation */
/* ============================================================ */
/* Navigation Most necessary options */
/* First Navigation Height */
#navigation.modern { height: 70px; line-height: 70px; will-change: transform; }
#navigation.modern .columns .logo a, #navigation.modern .columns .logo img { max-height: 50px; }
/* Hide & Show Retina Logo for device type */
body.retina-device.has-retina-logo #navigation .logo img, #navigation .logo img.retina-logo { display: none; }
#navigation .logo img, body.retina-device.has-retina-logo #navigation .logo img.retina-logo { display: block; }
@media only screen and (max-width: 640px)
{
#navigation.modern .columns .logo a, #navigation.modern .columns .logo img { max-width: 190px; }
}
/* Scrolled Navigation Height */
#navigation.modern.scrolled { height: 55px; line-height: 55px; }
#navigation.modern.scrolled .columns .logo a, #navigation.modern.scrolled .columns .logo img { max-height: 45px; }
#navigation.modern.sticky, #navigation.modern.static, #navigation.modern.static.pagetopped { position: relative; }
#navigation.modern.transparent:not(.static) { position: absolute; }
/* Navigation Options */
#navigation.modern { width: 100%; top: 0; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); position: fixed; z-index: 1001; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; transition: all 0.25s; }
.top-navigation { z-index: 1020; position: relative; }
/* Scrolled Navigation Height */
#navigation.modern.scrolled { margin-top: 0 !important; -webkit-transition-delay: 0.2s; transition-delay: 0.2s; border: none !important; }
#navigation.modern.shrink.scrolled { -webkit-transition-delay: 0s; transition-delay: 0s; }
/* Navigation Styles */
#navigation.modern .columns { width: 100%; height: 100%; position: relative; left: 0; top: 0; }
#navigation.modern .columns .logo { width: auto; height: auto; float: left; top: 50%; position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
#navigation.modern .columns .logo a { display: block; }
#navigation.modern .columns .logo img { width: auto; height: auto; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; transition: all 0.25s; }
#navigation.modern .columns .nav-menu { float: right; height: 100%; position: relative; }
#navigation.modern .columns ul { width: auto; height: 100%; position: relative; }
#navigation.modern .columns ul li { float: left; padding: 0; height: 100%; position: relative; }
#navigation.modern .columns ul li a, #navigation.modern .columns ul li button { padding: 0 16px; font-size: 12px; font-weight: 700; font-family: inherit; display: block; position: relative; background: transparent; height: 100%; line-height: inherit; border: none; z-index: 1; overflow: hidden; outline: none; -webkit-transition: color 0.2s, opacity 0.2s, background 0.2s; -moz-transition: color 0.2s, opacity 0.2s, background 0.2s; transition: color 0.2s, opacity 0.2s, background 0.2s; }
#navigation.modern.text-lg .columns ul li a { font-size: 13px; }
#navigation.modern .columns ul li a.item-noted { line-height: normal; top: 50%; height: auto; padding-bottom: 4px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
#navigation.modern .columns ul li a span.item-note { display: block; font-size: 10px; text-transform: none; font-weight: 400; line-height: 9px; }
#navigation.modern .columns ul li a.search-form-trigger { font-size: 14px; }
/* When added pagetop on page ( pagetopped class will be added to nav automatically. ) */
#navigation.modern.pagetopped { position: absolute; -webkit-transition: top 0s; -moz-transition: top 0s; transition: top 0s; visibility: visible; }
#navigation.modern.scrolled.pagetopped { visibility: hidden; position: fixed; top: -250px !important; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
#navigation.modern.scrolled.pagetopped.show { visibility: visible; top: 0 !important; }
#navigation-sticky-wrapper { z-index: 1019; }
/* Container-xl in navigation */
@media only screen and (min-width: 640px)
{
#navigation.modern .columns.container-xl { padding: 0 30px; }
}
/* Logo to center */
@media only screen and (min-width: 1120px)
{
#navigation.logo-centered .columns .logo { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
#navigation.modern .container { padding-left: 0; padding-right: 0; }
}
/* DropDown Menu */
.dropdown-toggle::after { display: none !important; }
#navigation.modern .columns ul .dropdown-menu .dropdown-toggle > a:after { position: absolute; right: 20px; top: 50%; content: "\f105"; font-size: 10px; font-family: "FONTAWESOME"; color: inherit; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
#navigation.modern .columns ul .dropdown-menu .dropdown-toggle > a:hover:after { right: 15px; }
#navigation.modern .columns ul.dropdown-menu { position: absolute !important; top: 100%; height: auto; border-radius: 0px; border: none; margin: 0; padding: 17px 0; box-shadow: none; }
#navigation.modern .columns .dropdown-menu.to-left { right: 0; left: auto; }
#navigation.modern .columns .dropdown-menu.to-right { right: auto; left: 0; }
#navigation.modern.radius-drop .columns .dropdown-menu { border-radius: 6px; }
/* More Dropdowns */
#navigation.modern .columns ul.dropdown-menu .dropdown-menu.to-left { right: 100%; left: auto; }
#navigation.modern .columns ul.dropdown-menu .dropdown-menu.to-right { right: auto; left: 100%; }
#navigation.modern .columns ul.dropdown-menu .dropdown-menu { top: -10px; }
/* Dropdown menu items */
#navigation.modern .columns ul.dropdown-menu li { padding: 0; width: 100%; display: block; float: none; }
/* Dropdown menu item styles */
#navigation.modern .columns ul.dropdown-menu li a, #navigation.modern.start-dark .columns ul.dropdown-menu li a, #navigation.modern.scrolled .columns ul.dropdown-menu li a { font-size: 12px; font-weight: 600; line-height: 30px; letter-spacing: -0.3px; padding: 4px 22px; display: block; width: 100%; height: auto; text-transform: none; min-width: 200px; }
#navigation.modern.text-lg .columns ul.dropdown-menu li a { font-size: 13px; }
#navigation.modern .columns ul.dropdown-menu li a i { display: inline-block; margin-right: 10px; }
#navigation.modern.scrolled .columns ul.dropdown-menu li hr { margin: 0; padding: 0; }
/* Mega Menu */
#navigation.modern .columns ul .mega-menu { padding: 0; width: auto; white-space: nowrap; font-weight: inherit; background-position: right top; background-repeat: no-repeat; background-size: cover; }
#navigation.modern .columns ul .mega-menu.to-left { right: -60%; left: auto !important; }
#navigation.modern .columns ul .mega-menu.to-right { left: -200%; right: auto; }
#navigation.modern .columns ul .mega-menu > li { padding: 15px 35px 15px 15px; display: block; float: none; vertical-align: top; height: auto; }
#navigation.modern .columns ul .mega-menu > li.mega-menu-img { margin: 0; padding: 0; width: 350px; height: 100%; overflow: hidden; }
#navigation.modern .columns ul .mega-menu > li.mega-menu-img + li { margin: 0; padding: 40px; }
#navigation.modern .columns ul .mega-menu > li.mega-menu-img img { width: auto; height: 100%; }
/* Megamenu columns */
#navigation.modern .columns .mega-menu .column { display: inline-block; width: auto; width: 220px; padding: 22px; position: relative; vertical-align: top; }
#navigation.modern .columns .mega-menu .column:before { display: block; content: ''; width: 1px; height: 86%; bottom: 7%; right: 0; background-color: #F0F0F0; position: absolute; background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(200, 200, 200, 1) 48%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(200, 200, 200, 0.3) 48%, rgba(0, 0, 0, 0) 100%); }
#navigation.modern .columns .mega-menu .column:last-child:before { display: none; }
/* Mega menu texts */
#navigation.modern .columns ul.dropdown-menu.mega-menu li a { font-size: 12px; font-weight: 600; letter-spacing: -0.3px; text-transform: none; padding: 5px 10px; width: 100%; min-width: 1px; }
#navigation.modern.text-lg .columns ul.dropdown-menu.mega-menu li a { font-size: 13px; }
#navigation.modern .columns .mega-menu .column-title { font-size: 10px; font-weight: 900; line-height: 20px; text-transform: uppercase; display: block; margin: 0px 15px 12px 10px; padding: 4px 0 !important; height: auto; width: 90%; }
/* Megamenu on small height devices */
@media only screen and (max-height: 700px)
{
#navigation.modern .columns ul.dropdown-menu.mega-menu li a { padding-top: 1px; padding-bottom: 1px; }
#navigation.modern .columns .mega-menu .column { padding: 6px; }
}
/* Mega menu for mini screens */
body:not(.device-lg) #navigation.modern .columns ul.dropdown-menu.mega-menu .column { max-width: 190px; }
/* Navigation Elements */
#navigation.modern .columns .nav-elements { float: right; right: 0; height: 100%; position: relative; margin-left: 12px; padding-left: 12px; }
#navigation.modern .columns .nav-menu ul li:last-child:after { display: none; }
/* External Buttons In Navigation */
#navigation.modern .columns .external-btn { line-height: normal; height: auto; padding: 9px 30px; margin: 0 0 0 12px; top: 50%; position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#navigation.modern .columns .external-btn:hover { opacity: 1 !important; }
/* Mark on nav */
#navigation span.mark, #punch-navigation span.mark { position: relative; font-size: 9px !important; display: inline !important; line-height: 9px !important; text-transform: uppercase; font-weight: 900 !important; margin-left: 10px; padding: 2px 5px; border-radius: 3px; z-index: 99; }
#navigation span.mark:before, #punch-navigation span.mark:before { content: ''; width: 0; height: 0; left: -7px; position: absolute; top: 5px; border-top: 4px solid transparent !important; border-bottom: 4px solid transparent !important; border-right-width: 4px; border-style: solid; border-right-color: inherit; border-left-color: transparent !important; }
#navigation .unvisible-logo { display: none; }
/* Modern Navigation Basic Colors - You can change them in the your demo's css file. */
/* Dark Nav Colors */
#navigation.modern.dark-nav { background: rgba(40, 40, 40, 0); }
#navigation.modern.static.dark-nav, #navigation.modern.sticky.dark-nav { background: rgba(32, 32, 32, 1); }
#navigation.modern.dark-nav.scrolled { box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.06); }
#navigation.modern.dark-nav.border:not(.scrolled) { border: 0px !important; border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important; }
#navigation.modern.dark-nav.hover:not(.scrolled):hover { background-color: rgba(22, 22, 22, 0.2); }
#navigation.modern.dark-nav .columns a, #navigation.modern.dark-nav .columns button { color: white; }
#navigation.modern.dark-nav .columns .hamburger-menu div { background-color: white; }
/* Second navigation background and text colors */
#navigation.modern.dark-nav.scrolled { background: rgba(32, 32, 32, 1); }
#navigation.modern.dark-nav.start-dark .columns ul.dropdown-menu li a, #navigation.modern.dark-nav .columns .nav-menu ul.dropdown-menu li a { color: #DDD; }
/* Dropdown colors */
#navigation.modern.dark-nav .columns .dropdown-menu { background-color: #222; box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.06); }
/* Dropdown hovers */
#navigation.modern.dark-nav .columns ul.dropdown-menu li a:hover { color: #FFF; background-color: #2F2F2F; }
#navigation.modern.dark-nav .columns ul.dropdown-menu.mega-menu li a:hover { color: white; }
/* Title and links for mega menu */
#navigation.modern.dark-nav .columns .mega-menu .column-title { color: #DDD; border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
#navigation.modern.dark-nav .columns ul.dropdown-menu.mega-menu li a { color: #D5D5D5; }
#navigation.modern.dark-nav .columns .mega-menu .column:before { background-color: #333; background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(40, 40, 40, 1) 48%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(40,4040,0.3) 48%,rgba(0,0,0,0) 100%); }
/* Title for icon color */
#navigation.modern.dark-nav .columns ul.dropdown-menu li a i { color: #A0A0A0; }
/* Title for icon color */
#navigation.modern.dark-nav .shopping-cart .subtotal div { color: #CCC; }
/* White Nav Colors */
#navigation.modern.white-nav { background: transparent; }
#navigation.modern.white-nav.border:not(.scrolled) { border: 0px !important; border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important; }
#navigation.modern.white-nav.hover:not(.scrolled):hover { background-color: rgba(22, 22, 22, 0.2); }
#navigation.modern.white-nav .columns a { color: white; }
#navigation.modern.white-nav.start-dark .columns a, #navigation.modern.white-nav .columns button #navigation.modern.static.white-nav .columns a, #navigation.modern.static.white-nav .columns button, #navigation.modern.sticky.white-nav .columns a, #navigation.modern.sticky.white-nav .columns button, #navigation.modern.white-nav .shopping-cart a, #navigation.modern.white-nav .flag-item + .dropdown-menu a { color: #444; }
#navigation.modern.white-nav .columns .hamburger-menu div { background-color: white; }
#navigation.modern.static.white-nav .columns .hamburger-menu div, #navigation.modern.sticky.white-nav .columns .hamburger-menu div { background-color: #333; }
/* Second navigation background and text colors */
#navigation.modern.white-nav.scrolled, #navigation.modern.white-nav.sticky, #navigation.modern.white-nav.box-shadow { background: rgba(255, 255, 255, 1); box-shadow: 0 1px 4px 2px rgba(0, 0, 0, 0.06) !important; }
#navigation.modern.white-nav.scrolled .columns .nav-menu > .nav > li > a, #navigation.modern.white-nav.scrolled .columns button, #navigation.modern.white-nav.scrolled .columns a, #navigation.modern.white-nav.scrolled .columns .nav-elements a { color: #333; }
#navigation.modern.white-nav.start-dark .columns a, #navigation.modern.white-nav.start-dark .columns button, #navigation.modern.sticky.white-nav .columns .nav-menu a, #navigation.modern.static.white-nav .columns a { color: #454545; }
#navigation.modern.white-nav.start-dark .columns .hamburger-menu div, #navigation.modern.white-nav.scrolled .columns .hamburger-menu div, #navigation.modern.white-nav.sticky .columns .hamburger-menu div { background-color: #3A3A3A; }
/* Dropdown colors */
#navigation.modern.white-nav .columns .dropdown-menu { background-color: white; box-shadow: 0px 15px 45px 2px rgba(0, 0, 0, 0.15); }
#navigation.modern.white-nav.start-dark .columns ul.dropdown-menu li a, #navigation.modern.white-nav .columns .nav-menu ul.dropdown-menu li a { color: #4A4A4A; }
#navigation.modern.white-nav .columns ul.dropdown-menu.mega-menu li a { color: #5A5A5A; }
/* Title for mega menu */
#navigation.modern.white-nav .columns .mega-menu .column-title { color: #666; }
/* Color for title icon */
#navigation.modern.white-nav .columns ul.dropdown-menu li a i { color: inherit; }
/* This is for jumping effect when scroll down */
#navigation.nav_up { -webkit-transform: translateY(-110%); -moz-transform: translateY(-110%); -ms-transform: translateY(-110%); transform: translateY(-110%); }
#navigation.nav_up.pagetopped { -webkit-transition: top 0s !important; -moz-transition: top 0s !important; transition: top 0s !important; }
/* Hover1 type */
#navigation.modern.hover1 .columns .nav-menu > .nav > li > a:before { height: 100%; content: ""; background-color: #DDD; left: 0; right: 0; top: 0; opacity: 0; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#navigation.modern.hover1 .columns .nav-menu > .nav > li > a:hover:before, #navigation.modern.hover1 .columns .nav-menu > .nav > li > a.active:before { opacity: 0.3; }
#navigation.modern.hover1.scrolled .columns .nav-menu > .nav > li > a:before { height: 3px; top: 100%; margin-top: -3px; left: 0; right: 0; }
/* Hover2 type */
#navigation.modern.hover2 .columns .nav-menu > .nav > li > a:before { height: 36px; content: ""; background-color: transparent; border: 1px solid #999; left: 5%; right: 5%; top: 50%; margin-top: -18px; opacity: 0; position: absolute; z-index: -1; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
#navigation.modern.hover2 .columns .nav-menu > .nav > li > a.active:before, #navigation.modern.hover2 .columns .nav-menu > .nav > li > a:hover:before { opacity: 0.3; }
#navigation.modern.hover2.scrolled .columns .nav-menu > .nav > li > a:before { height: 3px; top: 100%; margin-top: -3px; left: 0; right: 0; }
/* Hover3 type */
#navigation.modern.hover3 .columns .nav-menu > .nav > li > a:before { height: 28px; content: ""; background-color: rgba(35, 35, 35, 0.3); left: 5%; right: 5%; top: 50%; margin-top: -14px; opacity: 0; position: absolute; z-index: -1; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }
#navigation.modern.hover3 .columns .nav-menu > .nav > li > a:hover:before, #navigation.modern.dark-nav .nav-menu > .nav > li > a.active:before { opacity: 0.6; }
#navigation.modern.hover3.scrolled .columns .nav-menu > .nav > li > a:before { display: none; }
/* Hover4 type */
#navigation.modern.hover4 .columns a:hover, #navigation.modern.hover4 .columns button:hover { opacity: 0.7; }
#navigation.modern.hover4 .columns .logo a { opacity: 1 !important; }
/* You can find active color in the css/skins/color.css */
/* Hover5 type */
#navigation.modern.hover5 .columns .nav-menu > .nav > li > a:before { height: 3px; content: ""; left: 0; right: 0; bottom: 0; opacity: 0; position: absolute; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
#navigation.modern.hover5 .columns .nav-menu > .nav > li > a.active:before, #navigation.modern.hover5 .columns .nav-menu > .nav > li > a:hover:before { opacity: 1; }
/* You can find active color in the css/skins/color.css */
/* Slashes and dotted for items */
#navigation.modern.slashed .columns .nav-menu ul.nav > li > a { padding-left: 15px; padding-right: 15px; }
#navigation.modern.slashed .columns .nav-menu ul.nav > li:before { content: ""; width: 1px; height: 14px; position: absolute; top: 50%; display: block; background-color: rgba(195, 195, 195, 0.8); left: 0; margin-top: -7px; -webkit-transform: rotate(42deg); transform: rotate(42deg); }
#navigation.modern.slashed .columns .nav-menu ul.nav > li:first-child:before, #navigation.modern.dotted .columns .nav-menu ul.nav > li:first-child:before { display: none; }
#navigation.modern.slashed.scrolled .columns .nav-menu ul.nav > li:before, #navigation.modern.dotted.scrolled .columns .nav-menu ul.nav > li:before { opacity: 0.4; }
/* Slashes color to white navigation */
#navigation.modern.slashed.white-nav .columns ul.nav > li:before { background-color: rgba(145, 145, 145, 0.7); }
#navigation.modern.slashed.white-nav.scrolled .columns .nav-menu ul.nav > li:before { opacity: 1; }
/* Dotted for items */
#navigation.modern.dotted .columns .nav-menu ul.nav > li > a { padding-left: 15px; padding-right: 15px; }
#navigation.modern.dotted .columns .nav-menu ul.nav > li:before { content: ""; width: 3px; height: 3px; border-radius: 100%; position: absolute; top: 50%; display: block; background-color: rgba(222, 222, 222, 0.9); left: 0; margin-top: -1.5px; }
#navigation.modern.dotted.white-nav.scrolled .columns .nav-menu ul.nav > li:before { opacity: 1; background-color: #777; }
#navigation.modern.dotted.white-nav .columns .nav-menu ul.nav > li:before { background-color: #DDD; }
/* Shopping Cart Dropdown */
#navigation.modern .cart-item:after { display: none; }
#navigation.modern .cart-item .cart-detail { border-radius: 100%; width: 18px; height: 18px; font-weight: bolder; display: inline-block; line-height: 18px; text-align: center; color: white; font-size: 10px; }
#navigation.modern .shopping-cart { padding: 8px 20px; margin-top: 0; width: 400px; border: none; }
#navigation.modern .shopping-cart > div { margin: 7px 0; padding: 7px 0; border-bottom: 1px solid rgba(170, 170, 170, 0.2); }
#navigation.modern .shopping-cart > div:last-child { border-bottom: none; }
#navigation.modern .shopping-cart * { height: auto; line-height: normal; }
#navigation.modern .shopping-cart a { padding: 0; margin: 0; }
/* Product */
#navigation.modern .shopping-cart .product > * { height: 55px; line-height: 55px; }
/* Product IMG */
#navigation.modern .shopping-cart .product-img { float: left; width: 20%; }
#navigation.modern .shopping-cart .product-img a { padding: 0; }
#navigation.modern .shopping-cart .product-img img { height: 100%; }
/* Product NAME */
#navigation.modern .shopping-cart .product-name { float: left; width: 65%; }
#navigation.modern .shopping-cart .product-name a { padding-left: 10px; padding-top: 10px; line-height: normal; }
#navigation.modern .shopping-cart .product-name a span { display: block; font-size: 13px; }
/* Product Price */
#navigation.modern .shopping-cart .product-remove { float: left; width: 15%; text-align: center; }
/* Subtotal */
#navigation.modern .shopping-cart .subtotal div { padding: 6px 0 12px; float: left; width: 50%; }
#navigation.modern .shopping-cart .subtotal div:last-child { text-align: right; }
/* Buttons */
#navigation.modern .shopping-cart .buttons a { display: inline-block; padding: 10px 24px; float: left; text-align: center; width: 45%; width: calc(50% - 3px); }
#navigation.modern .shopping-cart .buttons a:first-child { margin-right: 5px; }
/* Flag Item */
#navigation.modern .flag-item:after { display: none; }
#navigation.modern .columns .nav-elements .flag-item { text-align: center; }
#navigation.modern .columns .nav-elements .flag-item + .dropdown-menu, #navigation.modern .columns .nav-elements .flag-item + .dropdown-menu a { min-width: 80px; width: 80px; padding: 5px 0; text-align: center; }
#navigation.modern .flag-item img { max-height: 18px; }
#navigation.modern .flag-item span { position: relative; top: 1.5px; margin-right: 3px; display: inline-block; }
/* Mobile Nav Button */
/* ============================================================ */
.mobile-nb { display: none; float: right; height: 100%; padding: 0 15px; cursor: pointer; }
.mobile-nb:active { background-color: rgba(0, 0, 0, 0.1); }
#mobile-navigation { display: none; }
#mobile-navigation-closer { display: none; z-index: 1019; position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); top: 0; right: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.4); cursor: pointer; }
@media only screen and (max-width: 1120px)
{
#pagetop { display: none; }
#mobile-navigation > * { z-index: 2 !important; }
#navigation.modern .columns .nav-menu, #navigation.modern .columns .nav-elements { display: none; }
.mobile-nb { display: block; }
#navigation .sidebar-button, #mobile-navigation .sidebar-button { display: none !important; }
#mobile-navigation { display: block; left: -260px; pointer-events: none; width: 260px; height: 100%; max-width: 80%; position: fixed; top: 0; background-color: #1A1B1D; z-index: 9999; overflow-x: hidden; overflow-y: auto; -webkit-transform: translateX(0) translateZ(0); -moz-transform: translateX(0) translateZ(0); -ms-transform: translateX(0) translateZ(0); transform: translateX(0) translateZ(0); -webkit-transition: transform 0.3s; -moz-transition: transform 0.3s; transition: transform 0.3s; }
#mobile-navigation li { display: block; }
#mobile-navigation.active { pointer-events: auto; -webkit-transform: translateX(100%) translateZ(0); -moz-transform: translateX(100%) translateZ(0); -ms-transform: translateX(100%) translateZ(0); transform: translateX(100%) translateZ(0); }
/* Navigation Logo */
#mobile-navigation .mobile-logo { width: 100%; height: auto; padding: 20px; text-align: left; margin-top: 20px; }
#navigation .unvisible-logo { display: block; }
.top-navigation .top-nav-logo { display: none; }
/* Close Buton */
#mobile-navigation .mb-close, #mobile-navigation .nav-el .search-form-trigger { position: absolute; background-color: transparent; left: 0; top: 10px; width: 45px; height: 45px; line-height: 45px; text-align: center; font-size: 15px; color: #BBB; cursor: pointer; }
#mobile-navigation .mb-close:before { content: "\f00d"; font-family: 'FONTAWESOME'; }
/* Navigation Nav */
#mobile-navigation .nav { margin-top: 27%; color: white; font-weight: 500; background-color: inherit; }
#mobile-navigation .nav li { border-top: 1px solid rgba(255, 255, 255, 0.03); }
#mobile-navigation .nav li a { font-size: 11px; padding: 0 15px !important; margin: 0 !important; display: block; line-height: 39px; position: relative; color: #EEE; font-weight: 700; }
#mobile-navigation .nav .dropdown-menu li a { font-size: 13px; }
#mobile-navigation .nav li:first-child { border-top: none; }
#mobile-navigation .column li:last-child, #mobile-navigation .column, #mobile-navigation .dropdown-menu > li { border-bottom: none !important; }
#mobile-navigation .nav li a.item-noted { padding: 12px 16px !important; line-height: 19px; }
#mobile-navigation .nav li a.item-noted span.item-note { color: #AAA; display: block; font-weight: 400; font-size: 11px; text-transform: none; line-height: 11px; margin-top: 0; }
#mobile-navigation .nav li a.item-noted i { line-height: 55px; }
/* Dropdown Menu */
#mobile-navigation .dropdown-menu { top: 0; left: 0 !important; opacity: 1; margin: 0 !important; padding: 0; background-image: none !important; position: relative; float: none; background-color: transparent; border-radius: 0; box-shadow: none; display: none; border: none; }
#mobile-navigation .nav li .dropdown-menu a { font-size: 12px; text-transform: none; font-weight: 600; color: #BBB; padding-left: 25px !important; display: block; }
#mobile-navigation .nav li .dropdown-menu .dropdown-menu a { padding-left: 35px !important; }
/* Hover and Focus colors */
#mobile-navigation a:active, #mobile-navigation a:focus, #mobile-navigation li a.active, #mobile-navigation a:hover, #mobile-navigation li a.touchme { background-color: #181919; }
#mobile-navigation a span { display: none; }
/* Navigation Elements in mobile nav */
#mobile-navigation .nav-el { margin-top: 0; background-color: inherit; }
#mobile-navigation .nav-el ul { margin-top: 0; }
#mobile-navigation .nav-el a span { display: inline-block; margin-left: 6px; font-size: 14px; position: relative; top: 2px; }
#mobile-navigation .nav-el a img { max-height: 20px; }
/* Shopping cart in mobile navigation */
#mobile-navigation .nav-el a.cart-item span { width: 20px; height: 20px; line-height: 20px; margin-left: 2px; text-align: center; border-radius: 100%; }
#mobile-navigation .nav-el a.cart-item i.fa { width: 15px; height: 100%; position: relative; display: inline-block; font-size: 17px; color: white; }
#mobile-navigation .nav-el a.cart-item i:before { content: "\f290"; }
#mobile-navigation .nav-el a.cart-item i:not(.fa) { display: none; }
/* Search Button */
#mobile-navigation .nav-el .search-form-trigger { left: auto; right: 6px; font-size: 12px; }
#mobile-navigation .nav-el .search-form-trigger i:before { content: "\f002"; }
/* External Buttons */
#mobile-navigation .nav-el .nav li a.external-btn { margin-top: 10px !important; width: 90%; left: 5%; }
/* Pagetop in mobile navigation */
#mobile-navigation .pagetop { color: #AAA; margin-top: 30px; position: relative; padding-left: 10px; bottom: 10px; z-index: 1 !important; text-align: left; width: 100%; font-weight: 600; }
#mobile-navigation .pagetop .container { padding: 0 !important; }
#mobile-navigation .pagetop .left a { display: block; font-size: 13px; }
#mobile-navigation .pagetop a span { display: inline-block; margin-right: 3px; }
#mobile-navigation .pagetop .right a, #mobile-navigation .pagetop .socials a { padding: 6px; display: inline-block; margin-top: 5px; line-height: normal; }
#mobile-navigation .pagetop .right a:hover { color: white; }
#mobile-navigation .pagetop .copyright { font-size: 13px; font-weight: 400; }
/* Disable titles on sidebar */
#mobile-navigation .dropdown-menu .column-title { display: none; }
#mobile-navigation .mega-menu > li { border: none; }
/* Dropdown buttons */
#mobile-navigation li a i { display: block; position: absolute; right: 0; top: 0; bottom: 0; width: 60px; text-align: center; line-height: inherit; color: #888; font-size: 13px; }
#mobile-navigation li a i:before { content: "\f105"; font-family: 'FONTAWESOME'; display: inline-block; line-height: inherit; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
#mobile-navigation li a.showing i:before { color: #CCC; -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); }
#navigation.no-mobile-nav + #mobile-navigation, #navigation.no-mobile-nav .mobile-nb { display: none !important; }
#mobile-navigation hr, #navigation.side-menu .search { display: none; }
}
/* Page top styles */
/* ============================================================ */
#pagetop { height: 42px; max-height: 42px; line-height: 42px; font-weight: 500; font-size: 12px; z-index: 1020; position: relative; top: 0; width: 100%; background: white; border-bottom: 1px solid #EDEDED; color: #686868; }
@media only screen and (max-width: 1120px)
{
#pagetop { z-index: 997; }
}
#pagetop .left { float: left; text-align: left; }
#pagetop .right { float: right; text-align: right; }
#pagetop .left > a { display: inline-block; margin-right: 22px; color: inherit; font-weight: inherit; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
#pagetop .left > p { line-height: inherit; color: inherit; margin-right: 22px; font-weight: inherit; }
#pagetop .right a { width: 42px; height: 100%; text-align: center; float: left; display: block; margin: 0; color: #AAA; line-height: inherit; border-right: 1px solid #EDEDED; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
#pagetop .right a:first-child { border-left: 1px solid #EDEDED; }
#pagetop .right a:hover { color: white; }
#pagetop img { max-height: 28px; }
/* #pagetop Transparent */
#pagetop.transparent { background: transparent; border-bottom: 1px solid rgba(255, 255, 255, 0.06); color: #FFF; position: absolute; }
#pagetop.transparent .right a { border-color: rgba(255, 255, 255, 0.1); color: #DDD; }
#pagetop.transparent .right a:hover { color: #FFF; }
/* #pagetop Dark */
#pagetop.dark { background: #171717; border-bottom: 1px solid rgba(255, 255, 255, 0.1); color: #DDD !important; }
#pagetop.dark .right a { border-color: rgba(255, 255, 255, 0.05); color: #DDD; }
#pagetop.dark .right a:hover { color: #FFF; }
@media only screen and (min-width: 640px)
{
#pagetop .container-xl { padding: 0 30px; }
}
/* Sticky navigation and pagetop paddings on small screens */
@media only screen and (max-width: 700px)
{
#pagetop { height: auto; max-height: none; }
#pagetop .right { display: none; }
#pagetop .left { text-align: center; float: none; margin: 0 auto; padding: 0; }
#pagetop .left a { display: block; margin: 0 auto 7px; line-height: 25px; }
#pagetop .left a:first-child { padding-top: 7px; }
}
/* Extra Navigation Styles */
/* ============================================================ */
#extranav { height: 40px; font-size: 13px; position: relative; will-change: transform; top: 0; width: 100%; display: none; padding: 0 30px; }
#extranav > * { -webkit-transition: all 0.15s; -moz-transition: all 0.15s; transition: all 0.15s; padding: 0; }
#extranav.hiding > * { -webkit-transform: translateY(-35px); -moz-transform: translateY(-35px); -ms-transform: translateY(-35px); transform: translateY(-35px); }
#extranav * { line-height: 40px; }
#extranav ul li { float: left; display: block; }
#extranav ul li a { display: block; padding: 0 20px; font-size: inherit; background: transparent; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
#extranav ul li a:hover, #extranav ul li a.active { background: rgba(0, 0, 0, 0.1); }
@media only screen and (max-width: 820px)
{
#extranav { display: none !important; }
#extranav > div { max-width: 120px; float: left; }
#extranav > .nav-menu { max-width: 80%; float: right; }
#extranav ul li a { padding: 0 10px; }
}
/* SIDE DOTTED NAVIGATION STYLES */
/* ============================================================ */
#dotted-navigation { position: relative; z-index: 1001; }
#side-dotted-navigation { color: white; width: 200px; right: 0px; margin: 0; border-radius: 20px; line-height: normal; position: fixed; height: auto; top: 50%; z-index: 1001; display: block; padding: 7px 0; -webkit-transform: translateY(-50%) translateZ(0); -moz-transform: translateY(-50%) translateZ(0); -ms-transform: translateY(-50%) translateZ(0); transform: translateY(-50%) translateZ(0); }
#side-dotted-navigation:before { content: ''; position: absolute; width: 100px; height: 350px; background: none; right: 20px; top: -50%; }
#side-dotted-navigation:after { content: ''; position: absolute; width: 20px; height: 650px; background: none; right: 20px; top: -50%; }
#side-dotted-navigation li { background-color: rgba(30, 30, 30, 1); box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.15); position: relative; overflow: hidden; display: block; width: 100%; right: 0; float: right; clear: right; border: none; }
#side-dotted-navigation li a { font-size: inherit; color: inherit; white-space: nowrap; font-weight: inherit; display: block; opacity: 1; width: 100%; padding: 11px 0 12px 30px; }
#side-dotted-navigation li a span { position: relative; z-index: 1; margin-top: 1px; }
#side-dotted-navigation li a:after { background-color: rgba(0, 0, 0, 0.1); content: ''; width: 0; height: 100%; right: 0; position: absolute; top: 0; z-index: 0; transition: width 0.3s; }
#side-dotted-navigation li:before { background-color: #BBB; width: 4px; height: 4px; display: block; content: ''; border-radius: 100%; position: absolute; left: 17px; top: 50%; margin-top: -2px; z-index: 1; }
#side-dotted-navigation li a:hover:after { width: 100%; }
#side-dotted-navigation li a:hover, #side-dotted-navigation li a:active, #side-dotted-navigation li a:focus { background-color: transparent; }
#side-dotted-navigation li:first-child, #side-dotted-navigation li:first-child a { border-top-left-radius: 10px; }
#side-dotted-navigation li:last-child, #side-dotted-navigation li:last-child a { border-bottom-left-radius: 10px; }
/* Hiding Type */
#side-dotted-navigation.spy:before, #side-dotted-navigation.spy:after { height: 400px; right: 0; }
#side-dotted-navigation.spy { background: rgba(0, 0, 0, 0.7); width: 40px; right: 20px; }
#side-dotted-navigation.spy li { width: 40px; background: transparent; box-shadow: none; }
#side-dotted-navigation.spy li:before { left: 50%; margin-left: -2.5px; }
#side-dotted-navigation.spy li:has(> a.active):before { background-color: white; }
#side-dotted-navigation.spy li a { opacity: 0; padding: 2px 0 2px 20px; }
#side-dotted-navigation li a.active { background-color: rgba(0, 0, 0, 0.3); }
/* SIDE DOTTED NAVIGATION TRANSITIO2S */
#side-dotted-navigation { -webkit-transition: background 0.28s 0s, width 0.28s 0.25s, right 0.28s 0.2s; -moz-transition: background 0.28s 0s, width 0.28s 0.25s, right 0.28s 0.3s; transition: background 0.28s 0s, width 0.28s 0.25s, right 0.28s 0.1s; }
#side-dotted-navigation li a { -webkit-transition: background 0.28s, opacity 0.28s 0.6s, padding 0.28s 0.15s; -moz-transition: background 0.28s, opacity 0.28s 0.6s, padding 0.28s 0.15s; transition: background 0.28s, opacity 0.28s 0.6s, padding 0.28s 0.15s; }
#side-dotted-navigation li:before { -webkit-transition: left 0.28s 0.4s, margin-left 0.28s 0.4s; -moz-transition: left 0.28s 0.4s, margin-left 0.28s 0.4s; transition: left 0.28s 0.4s, margin-left 0.28s 0.4s; }
/* Hiding Type */
#side-dotted-navigation.spy { -webkit-transition: background 0.28s 0.76s, width 0.28s 0.2s, right 0.28s 0.2s; -moz-transition: background 0.28s 0.76s, width 0.28s 0.2s, right 0.28s 0.2s; transition: background 0.28s 0.76s, width 0.28s 0.2s, right 0.28s 0.2s; }
#side-dotted-navigation.spy li a { -webkit-transition: opacity 0.28s, padding 0.28s 0.45s; -moz-transition: opacity 0.28s, padding 0.28s 0.45s; transition: opacity 0.28s, padding 0.28s 0.45s; }
/* Showing delays of elements */
#side-dotted-navigation li:nth-of-type(1) { transition: width 0.28s 0.2s, background 0.28s 0.2s, box-shadow 0.28s 0.2s; }
#side-dotted-navigation li:nth-of-type(2) { transition: width 0.28s 0.3s, background 0.28s 0.3s, box-shadow 0.28s 0.3s; }
#side-dotted-navigation li:nth-of-type(3) { transition: width 0.28s 0.4s, background 0.28s 0.4s, box-shadow 0.28s 0.4s; }
#side-dotted-navigation li:nth-of-type(4) { transition: width 0.28s 0.5s, background 0.28s 0.5s, box-shadow 0.28s 0.5s; }
#side-dotted-navigation li:nth-of-type(5) { transition: width 0.28s 0.6s, background 0.28s 0.6s, box-shadow 0.28s 0.6s; }
#side-dotted-navigation li:nth-of-type(6) { transition: width 0.28s 0.7s, background 0.28s 0.7s, box-shadow 0.28s 0.7s; }
#side-dotted-navigation li:nth-of-type(7) { transition: width 0.28s 0.8s, background 0.28s 0.8s, box-shadow 0.28s 0.8s; }
#side-dotted-navigation li:nth-of-type(8) { transition: width 0.28s 0.9s, background 0.28s 0.9s, box-shadow 0.28s 0.9s; }
#side-dotted-navigation li:nth-of-type(9) { transition: width 0.28s 1s, background 0.28s 1s, box-shadow 0.28s 1s; }
#side-dotted-navigation li:nth-of-type(10) { transition: width 0.28s 1.1s, background 0.28s 1s, box-shadow 0.28s 1.1s; }
#side-dotted-navigation li:nth-of-type(11) { transition: width 0.28s 1.2s, background 0.28s 1s, box-shadow 0.28s 1.2s; }
#side-dotted-navigation li:nth-of-type(12) { transition: width 0.28s 1.3s, background 0.28s 1s, box-shadow 0.28s 1.3s; }
#side-dotted-navigation li:nth-of-type(13) { transition: width 0.28s 1.4s, background 0.28s 1s, box-shadow 0.28s 1.4s; }
#side-dotted-navigation li:nth-of-type(14) { transition: width 0.28s 1.5s, background 0.28s 1s, box-shadow 0.28s 1.5s; }
#side-dotted-navigation li:nth-of-type(15) { transition: width 0.28s 1.6s, background 0.28s 1s, box-shadow 0.28s 1.6s; }
#side-dotted-navigation.spy li { transition: width 0.28s 0.3s, background 0.28s 0s; }
/* Responsive Options */
@media only screen and (max-width: 500px)
{
#side-dotted-navigation.spy li { width: 34px; }
#side-dotted-navigation.spy { width: 34px; right: 13px; }
#side-dotted-navigation.spy li a { padding: 0 0 0 20px; }
#side-dotted-navigation.spy:before, #side-dotted-navigation.spy:after { height: 200px; }
}
/* Responsive Options for mini height screens */
@media only screen and (max-height: 480px)
{
#side-dotted-navigation { top: 38%; }
#side-dotted-navigation.spy li { width: 32px; }
#side-dotted-navigation.spy { width: 32px; right: 20px; }
#side-dotted-navigation li a { padding: 9px 0 9px 23px; font-size: 10px; }
#side-dotted-navigation.spy li a { padding: 0 0 0 18px; }
#side-dotted-navigation li:before { left: 12px; }
#side-dotted-navigation.spy:before, #side-dotted-navigation.spy:after { height: 100px; }
}
/* Block Navigation
================================================== */
.block-navigation { height: 60px; line-height: 60px; z-index: 999; top: 0; padding: 0 !important; overflow: hidden; position: relative; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; transition: all 0.25s; -webkit-transform: translateZ(0); transform: translateZ(0); }
.block-navigation.top-moved { -webkit-transform: translateY(-50%) translateZ(0); -moz-transform: translateY(-50%) translateZ(0); -ms-transform: translateY(-50%) translateZ(0); transform: translateY(-50%) translateZ(0); }
.block-navigation .nav li a { padding: 0; text-align: center; position: relative; color: inherit; display: block; line-height: inherit; background-color: transparent; -webkit-transition: background 0.25s; -moz-transition: background 0.25s; transition: background 0.25s; }
.block-navigation .nav li a:hover, .block-navigation .nav li a:active, .block-navigation .nav li a.active { background-color: rgba(0, 0, 0, 0.3); }
.sticky-wrapper { position: relative; z-index: 998; }
.is-sticky .block-navigation { height: 50px; line-height: 50px; }
@media only screen and (max-width: 640px)
{
.block-navigation { padding-left: 0; padding-right: 0; border-radius: 0 !important; }
.block-navigation .nav li a { font-size: 9px; }
}
.sticky-item { -webkit-transform: translateZ(0); transform: translateZ(0); }
/* Icon Navigation
================================================== */
.icon-navigation { position: fixed; width: auto; height: auto; text-align: center; will-change: transform; line-height: normal; padding: 20px 0; z-index: 1050; -webkit-transition: opacity 0.45s; -moz-transition: opacity 0.45s; transition: opacity 0.45s; -webkit-transform: translateZ(0); transform: translateZ(0); }
.icon-navigation.passive { opacity: 0 !important; z-index: 100; }
.icon-navigation ul { margin: 0; padding: 0; }
/* Links */
.icon-navigation ul a { padding: 10px 15px; display: block; background: transparent !important; }
.icon-navigation.icon-lg ul a { padding: 13px 17px; font-size: 17px; }
.icon-navigation.icon-sm ul a { padding: 8px 14px; font-size: 13px; }
.icon-navigation ul li a.active, .icon-navigation ul li a.active:hover, .icon-navigation ul a:hover { background: rgba(0, 0, 0, 0.1) !important; }
.icon-navigation ul li.cbp-filter-item-active a { background: rgba(0, 0, 0, 0.2) !important; }
.icon-navigation ul hr { margin: 6px 0; }
/* Popovers */
.icon-navigation .popover { border: none; outline: none; padding: 12px 22px; min-width: 1px; border-radius: 7px; width: auto; white-space: nowrap; max-width: none; background-color: #222; }
.icon-navigation .popover-header { color: #FFF; background-color: #222; padding: 0; border: none; border-radius: 7px; }
.icon-navigation .popover-body { display: none; }
.icon-navigation .popover.right { margin-left: 14px; }
.icon-navigation .popover > .arrow { display: block !important; }
.bs-popover-auto[x-placement^=left] .arrow::after, .bs-popover-left .arrow::after { border-left-color: #222; }
.bs-popover-auto[x-placement^=right] .arrow::after, .bs-popover-right .arrow::after { border-right-color: #222; }
/* Hide By Scroll Effect
/* ============================================================ */
.hide-by-scroll { -webkit-transition: transform 0.45s; -moz-transition: transform 0.45s; transition: transform 0.45s; }
.hide-by-scroll.hiding { -webkit-transform: translateY(-100%) !important; -moz-transform: translateY(-100%) !important; -ms-transform: translateY(-100%) !important; transform: translateY(-100%) !important; }
.sticky-wrapper .hide-by-scroll.hiding { -webkit-transform: translateY(0%) !important; -moz-transform: translateY(0%) !important; -ms-transform: translateY(0%) !important; transform: translateY(0%) !important; }
.sticky-wrapper.is-sticky .hide-by-scroll.hiding { -webkit-transform: translateY(-100%) !important; -moz-transform: translateY(-100%) !important; -ms-transform: translateY(-100%) !important; transform: translateY(-100%) !important; }
.hide-on-home { display: none; }
/* Side Navigation
================================================== */
#navigation.side-menu { position: fixed; height: 100%; width: 300px; top: 0; z-index: 1001; line-height: 22px; border-right: 1px solid; border-color: transparent; background-size: cover; -webkit-transform: translateZ(0); transform: translateZ(0); }
#navigation.side-menu.left { left: 0; }
#navigation.side-menu.right { right: 0; border-left: 1px solid; border-color: transparent; border-right: none; }
/* Menu Width */
body.left-side-menu-active #wrapper { padding-left: 300px; }
body.right-side-menu-active #wrapper { padding-right: 300px; }
body.left-mini-side-menu-active #wrapper { padding-left: 60px; }
body.right-mini-side-menu-active #wrapper { padding-right: 60px; }
/* Logo */
#navigation.side-menu .logo { margin: 15% auto 0; padding: 0 20px; position: relative; text-align: inherit; }
#navigation.side-menu .logo img { max-width: 100%; max-height: 60px; }
@media only screen and (min-width: 1120px)
{
#navigation.side-menu.t-center .logo img, #navigation.side-menu .t-center .logo img { margin: 0 auto; }
}
/* Top Note */
#navigation.side-menu .top-note { padding: 5px 20px; margin-top: 10%; }
/* Navigation */
#navigation.side-menu .nav { font-size: 14px; margin: 23% 0 0; padding: 0; }
#navigation.side-menu .top-note + .nav-menu .nav { margin: 25% 0 0; }
#navigation.side-menu .nav li { display: block; float: none; width: 100%; margin: 0; padding: 0; position: relative; }
#navigation.side-menu .nav li a { padding: 15px 20px; margin: 0; font-size: 13px; line-height: 22px; font-weight: 700; border-bottom: 1px solid; display: block; border-color: transparent; -webkit-transition: all 0.25s; -moz-transition: all 0.25s; transition: all 0.25s; }
#navigation.side-menu.links-sm .nav li a { padding: 11px 16px; font-size: 12px; }
#navigation.side-menu .nav li a:focus { background: transparent; }
#navigation.side-menu .nav li:last-child > a { border-bottom: none; }
#navigation.side-menu .nav li a span { display: block; font-size: 10px; line-height: 13px; letter-spacing: 0; font-weight: 400; }
/* Menu Bottom */
#navigation.side-menu .menu-bottom { position: absolute; bottom: 0; width: 100%; }
/* Signature */
#navigation.side-menu .menu-bottom .signature { margin-bottom: 15%; }
#navigation.side-menu .menu-bottom .signature img { max-width: 180px; }
/* Socials */
#navigation.side-menu .socials { width: 100%; height: auto; padding: 0 10px; margin-bottom: 50px; }
#navigation.side-menu .socials a { font-size: 17px; width: 35px; height: 35px; line-height: 35px; text-align: center; display: inline-block; }
#navigation.side-menu .socials a:hover { color: white !important; }
/* Search */
#navigation.side-menu .search { position: relative; padding: 10px 22px; }
#navigation.side-menu .search input { background-color: rgba(20, 20, 20, 0.1); width: 100%; position: relative; padding: 9px 14px; line-height: normal; color: white; font-size: 12px; border-radius: 50px; border: 1px solid rgba(15, 15, 15, 0.1); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
#navigation.side-menu .search input:focus { background-color: rgba(20, 20, 20, 0.2); border: 1px solid rgba(15, 15, 15, 0.15); }
#navigation.side-menu .search ::-webkit-input-placeholder { color: rgba(200, 200, 200, 0.6); }
#navigation.side-menu .search :-moz-placeholder { color: rgba(200, 200, 200, 0.6); }
#navigation.side-menu .search ::-moz-placeholder { color: rgba(200, 200, 200, 0.6); }
#navigation.side-menu .search :-ms-input-placeholder { color: rgba(200, 200, 200, 0.6); }
/* Copyright */
#navigation.side-menu .copyright { width: 100%; padding: 15px; border-top: 1px solid transparent; font-size: 11px; font-weight: 300; }
/* Dropdown */
#navigation.side-menu .nav li.dropdown-toggle ul.dropdown-menu { left: 100%; padding: 0; top: 0; box-shadow: none; border-radius: 0; margin: 0; }
#navigation.side-menu .nav li.dropdown-toggle ul.dropdown-menu a { font-size: 11px; padding: 10px 20px; line-height: 20px; min-width: 220px; position: relative; }
#navigation.side-menu .nav li.dropdown-toggle > a:before { display: block; position: absolute; content: '\f105'; width: 25px; height: 25px; text-align: center; font-size: 10px; line-height: 25px; right: 10px; top: 50%; margin-top: -12.5px; font-family: 'FONTAWESOME'; color: #8D8D8D; }
#navigation.side-menu.left .nav.t-right li.dropdown-toggle > a:before { right: 3px; }
#navigation.side-menu.left .nav.t-right li a { padding-right: 30px; }
/* For Right side menu */
#navigation.side-menu.right .nav li.dropdown-toggle ul.dropdown-menu { right: 100%; left: auto; }
#navigation.side-menu.right .nav li.dropdown-toggle > a:before { left: 5px; right: auto; content: '\f104'; }
#navigation.side-menu.right .nav.t-left li.dropdown-toggle > a:before, #navigation.side-menu.right .t-left .nav li.dropdown-toggle > a:before { left: 0px; }
#navigation.side-menu.right .nav.t-left li a, #navigation.side-menu.right .t-left .nav li a { padding-left: 25px; }
/* Styles */
#navigation.side-menu.radius-drop .nav li.dropdown-toggle ul.dropdown-menu { border-radius: 6px; }
/* Colors */
/* White */
#navigation.side-menu.white { background-color: #FFF; border-color: #E6E6E6; }
#navigation.side-menu.white .nav li a, #navigation.side-menu.white-drop .nav li a { color: #4A4A4A; border-color: #F1F1F1; }
#navigation.side-menu.white-drop .nav .dropdown-menu { border: 1px solid #E6E6E6 !important; }
#navigation.side-menu.white .nav li a:hover, #navigation.side-menu.white .nav li > a.active { background-color: rgba(230, 230, 230, 0.5); }
#navigation.side-menu.white .socials a { color: #8D8D8D; }
#navigation.side-menu.white .copyright { color: #7C7C7C; border-color: #EEE; }
/* Dropdown Colors */
#navigation.side-menu.white .nav li.dropdown-toggle ul.dropdown-menu { background-color: #FFF; border-color: #E6E6E6; }
/* Search */
#navigation.side-menu.white .search input { background-color: rgba(240, 240, 240, 1); color: #444; border: 1px solid rgba(220, 220, 220, 1); }
#navigation.side-menu.white .search input:focus { background-color: rgba(230, 230, 230, 1); border: 1px solid rgba(200, 200, 200, 1); }
#navigation.side-menu.white .search ::-webkit-input-placeholder { color: #666; }
#navigation.side-menu.white .search :-moz-placeholder { color: #666; }
#navigation.side-menu.white .search ::-moz-placeholder { color: #666; }
#navigation.side-menu.white .search :-ms-input-placeholder { color: #666; }
/* Dark */
#navigation.side-menu.dark { background-color: #1A1A1A; border: none; }
#navigation.side-menu.dark .nav li a { color: #FFF; border-color: rgba(255, 255, 255, 0.05); }
#navigation.side-menu.dark .nav li a span { color: #DDD; }
#navigation.side-menu.dark .nav li a:hover, #navigation.side-menu.dark .nav li > a.active { background-color: rgba(0, 0, 0, 0.10); }
#navigation.side-menu.dark .socials a { color: #EEE; }
#navigation.side-menu.dark .copyright { color: #DDD; border-color: rgba(255, 255, 255, 0.07); }
#navigation.side-menu.dark .nav li a:before { color: #DDD; }
#navigation.side-menu.dark .nav li.dropdown-toggle ul.dropdown-menu { border: none; }
#navigation.side-menu.white-drop .nav li.dropdown-toggle ul.dropdown-menu { background: white !important; box-shadow: 2px 20px 45px 5px rgba(0, 0, 0, 0.2); }
#navigation.side-menu.white-drop .nav li.dropdown-toggle ul.dropdown-menu li a { color: #333; }
#navigation.side-menu.white-drop .nav li.dropdown-toggle ul.dropdown-menu li a:before { color: #666; }
/* Dropdown Colors */
#navigation.side-menu.dark .nav li.dropdown-toggle ul.dropdown-menu { background-color: #1F1F1F; border-color: #1A1A1A; }
#navigation.side-menu.dark .hamburger-menu div { background-color: #CCC; }
/* Type 2 */
#navigation.side-menu.type-2 .nav li.dropdown-toggle ul.dropdown-menu { padding: 15px 0; }
#navigation.side-menu.type-2 .nav li a:hover, #navigation.side-menu.type-2 .nav li > a.active { background-color: transparent !important; opacity: 0.7; }
#navigation.side-menu.type-2 .nav li a { border: none; }
#navigation.side-menu.type-2 .nav li a { padding: 10px 25px; font-weight: 400; }
#navigation.side-menu.type-2 .nav li.dropdown-toggle > a:before { font-size: 12px; }
#navigation.side-menu.type-2 .nav li.dropdown-toggle ul.dropdown-menu a { line-height: 15px; font-size: 12px; }
/* Customization for Revolution slider */
body.left-side-menu-active .fullscreen-container.rev_slider_wrapper, body.right-side-menu-active .fullscreen-container.rev_slider_wrapper, body.left-side-menu-active .forcefullwidth_wrapper_tp_banner > section, body.right-side-menu-active .forcefullwidth_wrapper_tp_banner > section, body.left-mini-side-menu-active .fullscreen-container.rev_slider_wrapper, body.right-mini-side-menu-active .fullscreen-container.rev_slider_wrapper { max-width: 100%; left: 0 !important; }
@media only screen and (max-width: 1450px)
{
#navigation.side-menu { width: 230px; }
body.left-side-menu-active #wrapper { padding-left: 230px; }
body.right-side-menu-active #wrapper { padding-right: 220px; }
}
@media only screen and (max-width: 1120px)
{
body.left-side-menu-active #wrapper { padding-left: 0; }
body.right-side-menu-active #wrapper { padding-right: 0; }
#navigation.side-menu .nav-menu, #navigation.side-menu .menu-bottom, #navigation.side-menu .top-note { display: none; }
#navigation.side-menu .logo img { max-height: 45px; }
#navigation.side-menu { width: 100%; height: 70px; position: fixed; top: 0; left: 0; }
#navigation.side-menu .logo { margin: 0 !important; text-align: left; float: left; width: 50%; height: 100%; display: table; }
#navigation.side-menu .logo a { display: table-cell; vertical-align: middle; }
#navigation.side-menu .mobile-nb { float: right; margin-right: 20px; }
}
@media only screen and (max-height: 860px)
{
#navigation.side-menu .logo { margin-top: 10%; }
#navigation.side-menu .nav { margin-top: 15%; }
#navigation.side-menu .nav li a { padding: 10px 16px; font-size: 12px; }
#navigation.side-menu.links-sm .nav li a { padding: 7px 16px; font-size: 11px; }
#navigation.side-menu.type-2 .nav li a { padding: 7px 25px; }
#navigation.side-menu .top-note + .nav-menu .nav { margin-top: 15%; }
#navigation.side-menu .search input { padding: 9px 14px !important; }
#navigation.side-menu .socials { margin-bottom: 25px; }
}
@media only screen and (max-height: 700px)
{
#navigation.side-menu .nav { margin-top: 10%; }
#navigation.side-menu .nav li a { padding: 8px 16px; font-size: 11px; }
#navigation.side-menu.links-sm .nav li a { padding: 6px 16px; font-size: 11px; line-height: 19px; }
#navigation.side-menu.type-2 .nav li a { padding: 5px 20px; }
#navigation.side-menu .top-note + .nav-menu .nav { margin-top: 7%; }
#navigation.side-menu .search input { padding: 8px 14px !important; }
#navigation.side-menu .socials { margin-bottom: 12px; }
}
/* Mini Side Navigation
================================================== */
.mini-side-menu { width: 60px; height: 100%; position: fixed; z-index: 90; left: 0; top: 0; background-color: #2C2C2C; -webkit-transform: translateZ(0); transform: translateZ(0); }
.mini-side-menu.right { left: auto; right: 0; }
/* Logo */
.mini-side-menu .logo { width: 100%; height: auto; margin: 0; padding: 25px 15px; text-align: center; position: absolute; }
.mini-side-menu .logo img { width: auto; max-width: 100%; height: auto; }
/* Menu Trigger */
.mini-side-menu .menu-block { width: 100%; height: auto; position: relative; top: 50%; padding: 10px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.mini-side-menu .menu-trigger { position: relative; height: 40px; width: 100%; margin-top: -20px; cursor: pointer; }
.mini-side-menu .menu-trigger .hamburger-menu { margin: 0 auto; }
/* Menu Bottom */
.mini-side-menu .menu-bottom { width: 100%; cursor: pointer; padding: 0 10px; bottom: 0; left: 0; position: absolute; height: auto; margin: 0 0 25px; text-align: center; display: table; }
.mini-side-menu .menu-bottom img { width: auto; height: auto; max-width: 100%; }
/* Unvisible Mobile Nav Button for big screens */
.mini-side-menu .mobile-nb { display: none; }
@media only screen and (max-width: 641px)
{
.mini-side-menu .menu-block { display: none; }
body.left-mini-side-menu-active #wrapper { padding-left: 0; }
body.right-mini-side-menu-active #wrapper { padding-right: 0; }
.mini-side-menu { width: 100%; height: 70px; }
.mini-side-menu .logo { float: left; width: 50%; position: relative; }
.mini-side-menu .logo { text-align: left; padding-left: 15px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.mini-side-menu .menu-bottom, .mini-side-menu .menu-trigger { display: none; }
.mini-side-menu .menu-trigger { padding: 0 30px 0 0; text-align: right; }
.mini-side-menu .mobile-nb { display: block; }
}
/* PUNCH NAVIGATION
================================================== */
.punch-navigation-items { overflow: hidden; width: 100%; height: 0%; top: 0; left: 0; position: fixed; z-index: 9999; -webkit-transform: translateZ(0); transform: translateZ(0); }
.punch-navigation-items .shadow { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.3); display: none; }
.punch-navigation-items > div.navblock { background-color: white; border-color: #FAFAFA !important; background-size: cover !important; background-position: center center; border-right: 1px; border-style: solid; height: 100%; top: -100%; position: relative; -webkit-transition: top 0.65s cubic-bezier(0.55, 0, 0.4, 1); -moz-transition: top 0.65s cubic-bezier(0.55, 0, 0.4, 1); transition: top 0.65s cubic-bezier(0.55, 0, 0.4, 1); }
.punch-navigation-items.activated { height: 100%; }
.punch-navigation-items.activated > div.navblock { top: 0; }
.punch-navigation-items.activated.closing > div.navblock { top: -100%; }
/* Navigation Block Scrollable */
.punch-navigation-items > div.navblock > div { overflow-y: auto; max-height: 55%; }
@media only screen and (min-width: 1024px)
{
.punch-navigation-items > div.navblock > div { top: 50%; position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
}
.punch-navigation-items > div.navblock > div::-webkit-scrollbar-track { border-radius: 10px; background-color: transparent; }
.punch-navigation-items > div.navblock > div::-webkit-scrollbar { width: 8px; background-color: transparent; }
.punch-navigation-items > div.navblock > div::-webkit-scrollbar-thumb { border-radius: 10px; background-color: transparent; }
.punch-navigation-items > div.navblock:hover > div::-webkit-scrollbar-thumb { background-color: #DDD; }
/* Navigation items */
.punch-navigation-items > div.navblock a { padding: 13px 6px; width: 80%; display: block; position: relative; text-align: center; border-top: 1px solid #FAFAFA; font-size: 12px; line-height: 11px; text-transform: inherit; margin: 3px auto; font-weight: 700; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.punch-navigation-items > div.navblock a.nav-title { font-size: 25px; text-transform: none; font-weight: 400; letter-spacing: -1px; cursor: default; }
.punch-navigation-items > div.navblock a.nav-subtitle { font-size: 14px; font-weight: 700; text-transform: none; letter-spacing: -1px; cursor: default; }
.punch-navigation-items > div.navblock a.link-md { font-size: 14px; line-height: 14px; text-transform: capitalize; font-weight: 900; letter-spacing: -0.6px; margin: 0 auto; }
.punch-navigation-items > div.navblock a.link-lg { font-size: 17px; line-height: 17px; text-transform: capitalize; font-weight: 900; letter-spacing: -1.2px; margin: 8px auto; }
.punch-navigation-items > div.navblock a:after, .punch-navigation-items > div.navblock a:before { position: absolute; width: 100%; height: 0%; content: ''; bottom: 50%; left: 0; background-color: #F3F3F3; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.punch-navigation-items > div.navblock a:after { bottom: auto; top: 50%; }
.punch-navigation-items > div.navblock a:hover:before, .punch-navigation-items > div.navblock a:hover:after { height: 50%; }
.punch-navigation-items > div.navblock a:hover { border-color: transparent; }
.punch-navigation-items > div.navblock a.nav-title:before, .punch-navigation-items > div.navblock a.nav-title:after, .punch-navigation-items > div.navblock a.nav-subtitle:before, .punch-navigation-items > div.navblock a.nav-subtitle:after { display: none; }
.punch-navigation-items > div.navblock > * { display: none; }
.punch-navigation-items > div.navblock span { display: block; width: 100%; margin: 6px 0 5px; border-bottom: 1px solid rgba(140, 140, 140, 1); }
.punch-navigation-items > div.navblock a:first-child, .punch-navigation-items > div.navblock hr + a { border-top: none !important; }
/* Top Elements */
.punch-navigation-items > div.bottom-elements, .punch-navigation-items > div.top-elements { position: absolute; top: 0; left: 50%; padding: 50px; width: 100%; height: 50px; z-index: 10; display: none; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.punch-navigation-items > div.bottom-elements { top: auto; bottom: 5%; }
.punch-navigation-items > div.top-elements img { max-height: 45px; }
/* Media */
@media only screen and (max-width: 1120px)
{
.punch-navigation-items { display: none !important; }
.nav-menu > div.navblock > *, .punch-navigation-items > div.navblock > * { display: block !important; opacity: 1 !important; }
#mobile-navigation .top-elements, #mobile-navigation .bottom-elements { display: none !important; }
#mobile-navigation .navblock { margin-top: 25%; background-color: inherit; }
#mobile-navigation div.navblock:last-child { margin-bottom: 25%; }
#mobile-navigation .navblock a.nav-title, #mobile-navigation .navblock a.link-lg { font-size: 13px; font-weight: bold; color: white; }
#mobile-navigation .navblock a.nav-subtitle, #mobile-navigation .navblock a.link-md { color: white; }
#mobile-navigation .navblock a { display: block !important; position: relative; color: #AAA; width: 100%; padding: 2px 20px; text-transform: uppercase; font-weight: 700; font-size: 10px; border-bottom: 1px solid rgba(100, 100, 100, 0.1); }
#mobile-navigation .navblock:first-child { margin-top: 80px; }
#mobile-navigation .navblock a.big-link { color: #CCC; font-weight: 700; }
#mobile-navigation .nav-el .hamburger-menu { display: none; }
}
/* Block delays */
.punch-navigation-items > div.navblock:nth-of-type(1) { -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s; }
.punch-navigation-items > div.navblock:nth-of-type(2) { -webkit-transition-delay: 0.15s; -moz-transition-delay: 0.15s; transition-delay: 0.07s; }
.punch-navigation-items > div.navblock:nth-of-type(3) { -webkit-transition-delay: 0.30s; -moz-transition-delay: 0.30s; transition-delay: 0.14s; }
.punch-navigation-items > div.navblock:nth-of-type(4) { -webkit-transition-delay: 0.45s; -moz-transition-delay: 0.45s; transition-delay: 0.21s; }
.punch-navigation-items > div.navblock:nth-of-type(5) { -webkit-transition-delay: 0.60s; -moz-transition-delay: 0.60s; transition-delay: 0.28s; }
.punch-navigation-items > div.navblock:nth-of-type(6) { -webkit-transition-delay: 0.75s; -moz-transition-delay: 0.75s; transition-delay: 0.35s; }
.punch-navigation-items > div.navblock:nth-of-type(7) { -webkit-transition-delay: 0.90s; -moz-transition-delay: 0.90s; transition-delay: 0.42s; }
.punch-navigation-items > div.navblock:nth-of-type(8) { -webkit-transition-delay: 1.05s; -moz-transition-delay: 1.05s; transition-delay: 0.49s; }
.punch-navigation-items > div.navblock:nth-of-type(9) { -webkit-transition-delay: 1.20s; -moz-transition-delay: 1.20s; transition-delay: 0.56s; }
/* Dark Nav and styled */
.punch-navigation-items.dark-nav > div.navblock { background-color: #1C1C1C; border-color: #1F1F1F !important; }
.punch-navigation-items.no-border > div.navblock { border-right: none !important; }
.punch-navigation-items.no-border > div.navblock a { border-top: none !important; }
.punch-navigation-items.dark-nav > div.navblock a { border-top-color: #222; }
.punch-navigation-items.dark-nav > div.navblock a:before, .punch-navigation-items.dark-nav > div.navblock a:after { background-color: rgba(120, 120, 120, 0.15); }
/* CONTENT HISTORY
/* ================================================== */
.content-history .content-body { position: relative; padding-bottom: 40px; }
.content-history .content-body:before { position: absolute; z-index: 0; left: 50%; top: 0; width: 0px; height: 100%; content: ''; border-left: 1px dashed #CCC; display: block; }
.content-history .content-body > * { position: relative; z-index: 1; }
.content-history .content-img-container { min-height: 400px; }
.content-history .history-start { width: 160px; height: 60px; line-height: 60px; text-align: center; margin: 0 auto 20px; }
.content-history .history-date, .content-history .history-end { width: 160px; height: 40px; line-height: 40px; text-align: center; margin: 70px auto 45px; }
.content-history .history-end { margin: 100px auto -20px; }
.content-history .content-img { position: absolute; width: 100%; z-index: 0; height: 100%; left: 0; top: 0; background-size: cover; background-position: center center; }
.content-history .content-details { padding: 50px 40px; }
@media only screen and (max-width: 1024px)
{
.content-history .content-img-container { height: 400px !important; position: relative; }
}
@media only screen and (max-width: 480px)
{
.content-history .content-details { height: auto !important; padding: 50px 10px; }
}
/* BOXES
/* ================================================== */
/* Type 1 */
.boxes-type-1.boxes > div > a { font-size: 28px; display: block; width: 100px; height: 100px; background-color: #FDFDFD; border: 1px solid #E7E7E7; margin: 0 auto; line-height: 100px; text-align: center; }
.boxes-type-1.boxes > div:hover a { color: white; border-color: transparent; }
.boxes-type-1.boxes h2 { font-size: 18px; text-transform: uppercase; margin: 25px 0 0; padding: 0; }
.boxes-type-1.boxes p { font-size: 15px; margin: 15px 0 0; padding: 0; }
/* Type 3 */
.boxes-type-3 div.box { margin: 8px auto; padding: 0 8px; }
.boxes-type-3 a { display: table; width: 100%; height: auto; min-height: 180px; background-size: cover; position: relative; padding: 45px 20px; border-radius: 7px; }
.boxes-type-3 .texts { display: table-cell; vertical-align: middle; z-index: 1; position: relative; }
.boxes-type-3 .texts img { width: auto; height: auto; max-height: 100%; }
.boxes-type-3 a:before { width: 100%; height: 100%; left: 0; top: 0; opacity: 0; content: ''; position: absolute; z-index: 0; background-color: #111; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.boxes-type-3 a:hover:before { opacity: 0.2; }
.boxes-type-3 h2 { margin: 0 0 10px; padding: 0; }
.boxes-type-3 p { margin: 0; padding: 0; font-size: 17px; }
/* Type 4 */
.boxes-type-4 .box { position: relative; overflow: hidden; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }
.boxes-type-4 a { display: block; position: relative; z-index: 1; padding: 180px 25px 30px; text-align: left; }
.boxes-type-4 a h3 { line-height: 32px; opacity: 0.9; margin-top: 15px; position: relative; display: inline-block; }
.boxes-type-4 a h3:before { width: 40px; height: 0px; border-top: 2px solid white; border-color: inherit; content: ''; position: absolute; left: 0; bottom: -5px; -webkit-transition: width 0.3s; -moz-transition: width 0.3s; transition: width 0.3s; }
.boxes-type-4 .box:hover a h3:before { width: 100%; }
.background-color-for-box { position: absolute; z-index: 0; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.9; }
.boxes-type-4 .box:hover { opacity: 0.9; }
/* Boxes with images */
.boxes-with-image { padding: 0 !important; }
.boxes-with-image .box { display: block; background-size: cover !important; padding: 50px 60px; position: relative; -webkit-transition: padding 0.2s; -moz-transition: padding 0.2s; transition: padding 0.2s; }
.boxes-with-image .box .texts, .boxes-with-image .texts .secret-button { position: relative; z-index: 5; -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1) !important; -moz-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1) !important; transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1) !important; }
.boxes-with-image .box .texts { -webkit-transform: translateY(20px); -moz-transform: translateY(10px); -ms-transform: translateY(20px); transform: translateY(20px); }
.boxes-with-image .box:hover .texts { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
.boxes-with-image .box h1 { background-size: cover; padding: 0; margin: 0 0 20px; }
.boxes-with-image .box p { font-size: inherit; margin: 0; color: inherit; }
.boxes-with-image .box .secret-button { display: inline-block; opacity: 0; margin-top: 20px; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); }
.boxes-with-image .box:hover .secret-button { opacity: 1; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); }
@media only screen and (max-width: 900px)
{
.boxes-with-image:not(.nav-to-custom-slider) .box { padding: 60px 20px; }
.boxes-with-image .box h1 { font-size: 25px; }
}
@media only screen and (max-width: 800px)
{
.boxes-with-image:not(.nav-to-custom-slider) .box { padding: 60px 60px; width: 100% !important; float: none; }
.boxes-with-image .box h1 { font-size: 45px; }
}
@media only screen and (max-width: 500px)
{
.boxes-with-image:not(.nav-to-custom-slider) .box { padding: 60px 30px; }
.boxes-with-image .box h1 { font-size: 35px; }
}
/* Image boxes */
.image-boxes .item { margin: 0 12px; }
@media only screen and (max-width: 480px)
{
.image-boxes .item { margin: 0; }
}
.image-boxes .item h3 { color: #6C6C6C; font-weight: inherit; margin: 35px 0 0; text-transform: uppercase; padding: 0; font-size: 20px; }
.image-boxes .item p { color: #898989; font-size: 14px; margin-top: 15px; padding-top: 0; line-height: 22px; }
/* Rotate Boxes */
.rotate-container { height: auto; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; perspective: 1000px; }
.rotate-box .front, .back { width: 100%; height: 100%; }
.rotate-box { width: 100%; height: 300px; position: relative; -webkit-transition: 0.6s; -webkit-transform-style: preserve-3d; -moz-transition: 0.6s; -moz-transform-style: preserve-3d; -o-transition: 0.8s; -o-transform-style: preserve-3d; transition: 0.8s; transform-style: preserve-3d; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; perspective: 1000px; pointer-events: none; }
.rotate-box .front, .rotate-box .back { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; perspective: inherit; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }
.rotate-box .front { z-index: 2; }
.rotate-box .back { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); }
.rotate-box .box-details { -webkit-transform: translate3d(0,-50%,75px) scale(.85); -moz-transform: translate3d(0,-50%,75px) scale(.85); -o-transform: translate3d(0,-50%,75px) scale(.85); transform: translate3d(0, -50%, 75px) scale(0.85); display: block; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; perspective: inherit; top: 50%; position: relative; text-align: center; width: 100%; }
/* Hovers */
.rotate-container:hover .rotate-box, .rotate-container.hover .rotate-box { -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); }
.rotate-container.hover1:hover .rotate-box, .rotate-container.hover1.hover .rotate-box { -webkit-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg); -o-transform: rotateY(-180deg); transform: rotateY(-180deg); }
.rotate-container.hover2:hover .rotate-box, .rotate-container.hover2.hover .rotate-box { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); }
.rotate-container.hover3:hover .rotate-box, .rotate-container.hover3.hover .rotate-box { -webkit-transform: rotateX(-180deg); -moz-transform: rotateX(-180deg); -o-transform: rotateX(-180deg); transform: rotateX(-180deg); }
/* Set the rotate for hover2 and 3 */
.rotate-container.hover2 .back, .rotate-container.hover3 .back { -webkit-transform: rotateX(-180deg); -moz-transform: rotateX(-180deg); -o-transform: rotateX(-180deg); transform: rotateX(-180deg); }
/* Prices Types
/* ================================================== */
/* Interactive Packages */
/* Container options */
.interactive-packages { border-color: #DDD !important; border-top: 1px solid; border-bottom: 1px solid; }
.interactive-packages .steps-container { max-width: 970px; margin: 0 auto; position: relative; }
/* Title Options */
.interactive-packages .rise_title span.title_selector { font-size: 40px; color: #333; }
.interactive-packages .step-titles .title { margin-bottom: 40px !important; text-align: center; margin-left: auto !important; margin-right: auto !important; font-size: 15px; text-transform: uppercase; color: #545454; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.interactive-packages .step-titles .title.active { color: #111; }
.interactive-packages .step-titles .title span { font-size: 35px; }
/* Bar and steps options */
.interactive-packages .bar { width: 100%; height: 15px; background: #CFCFCF; position: relative; padding: 0; }
.interactive-packages .progress { right: 0px !important; }
.interactive-packages .bar .interactive_bar { background: #333; position: absolute; /* Start with second package */ left: 0; top: 0; height: 100%; overflow: visible; padding: 0; margin: 0; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.interactive-packages .bar .steps { width: 100%; height: 100%; position: absolute; left: 0; top: 0; }
.interactive-packages .bar .steps .step { border-right: 1px solid rgba(211, 211, 211, 0.5); height: 100%; cursor: pointer; position: relative; }
.interactive-packages .bar .steps .step:before { width: 100%; height: 90px; content: ''; position: absolute; bottom: 0; left: 0; }
.interactive-packages .step span.step-link { position: relative; left: 50%; display: block; width: 100%; height: 100%; cursor: pointer; z-index: 2; }
.interactive-packages .step span.step-start { position: absolute; left: 0%; display: block; width: 50%; height: 100%; top: 0; cursor: pointer; z-index: 1; }
/* Triangle arrow top of the bars */
.interactive-packages .selector { position: absolute; bottom: 100%; margin-right: -6px; cursor: pointer; width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #333; }
/* Boxes */
.interactive-packages .package-boxes, .interactive-packages .package-boxes .item { margin-top: 30px; color: #7D7D7D; }
.interactive-packages .package-boxes .item .box-title { font-size: 20px; color: #666666; }
.interactive-packages .package-boxes .item .box-title span { font-size: 50px; }
.interactive-packages .package-boxes .item h2 { font-size: 20px; margin: 5px 0 15px; padding: 0; text-transform: uppercase; }
@media only screen and (max-width: 550px)
{
#qdr-packages > h1 { padding-left: 15px; padding-right: 15px; }
}
@media only screen and (max-width: 550px)
{
.interactive-packages .step-titles .title span { font-size: 20px; display: block; }
.interactive-packages .step-titles .title { font-size: 11px; }
}
/* Testimonials Types
/* ================================================== */
/* Testimonials Classic */
.testimonials { padding: 120px 0 170px; position: relative; z-index: 1; overflow: hidden; }
.testimonials .testimonials-icon { position: relative; z-index: 1; width: 60px; height: 60px; margin: 0 auto 20px; line-height: 60px; font-size: 20px; }
.testimonials .testimonials-icon:after { content: ''; position: absolute; left: 0; top: 0; width: 60px; height: 60px; background-color: rgba(0, 0, 0, 0.03); -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); }
.testimonials h2 { font-size: 25px; line-height: 38px; max-width: 920px; margin: 20px auto 25px; letter-spacing: 0; font-weight: inherit; }
.testimonials h2.title-strip:after { width: 30px; height: 1px; background: white; content: ''; position: absolute; bottom: -30px; display: inline-block; left: 50%; margin-left: -15px; opacity: 0.5; }
.testimonials p { font-size: 15px; margin: 0 auto; }
@media only screen and (max-width: 640px)
{
.testimonials h2 { font-size: 17px; line-height: 25px; }
}
/* Testimonials big version */
.testimonials.big { padding: 230px 0; }
.testimonials.extra-big { padding: 310px 0; }
.testimonials.big h1 { margin: 0 auto; padding: 0; max-width: 510px; }
.testimonials.big h3 { margin: 15px auto 0; max-width: 650px; }
.testimonials.big .t-left h1, .testimonials.big .t-left h3, .testimonials.big .t-left h4 { margin-left: 0; }
.testimonials.big .t-right h1, .testimonials.big .t-right h3, .testimonials.big .t-right h4 { margin-right: 0; margin-left: auto; }
.testimonials.big button { font-size: 18px; margin-top: 30px; line-height: 31px; font-weight: 300; background: transparent; border: none; }
.testimonials.big h4 { margin: 15px auto 0; max-width: 800px; line-height: 25px; font-size: 16px; font-weight: 300; }
@media only screen and (max-width: 1185px)
{
.testimonials.big { padding-left: 15px; padding-right: 15px; }
}
@media only screen and (max-width: 640px)
{
.testimonials.big, .testimonials.extra-big { padding: 150px 0; }
}
/* Services With Products */
/* Body for devices */
.services-with-product .mockups { position: relative; left: 0; top: 0; width: 100%; height: auto; margin: 0 auto; }
.services-with-product .mockups img { width: auto; height: auto; max-width: 90%; }
.services-with-product .services-body { width: 100%; top: 0; height: auto; position: absolute; }
/* Elements */
.services-with-product .services-body li { position: absolute; border-color: #C7C7C7; border-style: dashed; }
/* Strips for elemenets */
.services-with-product .services-body li.br-left { border-left-width: 1px; }
.services-with-product .services-body li.br-top { border-top-width: 1px; }
.services-with-product .services-body li.br-right { border-right-width: 1px; }
.services-with-product .services-body li.br-bottom { border-bottom-width: 1px; }
/* Tooltip Buttons */
.services-with-product .services-body li a { width: 30px; height: 30px; background-color: #666; display: block; position: absolute; background-position: center center; background-repeat: no-repeat; cursor: cell; background-image: url(../images/plus-white.png); }
.services-with-product .services-body li a:hover { background-color: #393939; }
/* Points */
.services-with-product .services-body li span { display: block; width: 10px; height: 10px; position: absolute; border-radius: 100%; background-color: #C7C7C7; }
@media only screen and (max-width: 1024px)
{
.services-with-product .services-body { display: none; }
}
/* Team Types
/* ================================================== */
/* Team Type 1 */
.team-type-1 { margin-top: 50px; text-align: center; }
.team-type-1 .member { padding: 0 12px; height: auto; }
@media only screen and (max-width: 480px)
{
.container .team-type-1 .member { padding: 0; }
}
.team-type-1 .member .member-image { width: 100%; overflow: hidden; }
.team-type-1 .member .member-image img { width: 100%; }
.team-type-1 .member .member-image .socials { width: auto; position: relative; top: -30px; z-index: 2; color: white; text-align: left; padding-left: 5px; }
.team-type-1 .member .member-image .socials a { width: 25px; height: 25px; display: inline-block; margin-left: 5px; line-height: 25px; text-align: center; font-size: 14px; }
.team-type-1 .member .member-name { color: #888; margin: 0 auto; padding: 0; font-size: 19px; }
.team-type-1 .member .member-position { margin: 8px auto 0; padding: 0; font-size: 13px; }
.team-type-1 .member .member-details { margin: 5px auto 0; padding: 0; color: #999; line-height: 25px; font-size: 13px; }
/* Team Type 2 */
.team-type-2 { text-align: center; }
.team-type-2 .custom-slider, .team-type-2.custom-slider { margin-top: 50px; }
.team-type-2 .member { margin: 0 15px; height: auto; position: relative; }
.team-type-2 .member img { width: 100%; height: auto; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.team-type-2 .member:hover img { opacity: 0.35; }
.team-type-2 .member .member-body { background-color: #000; position: relative; }
/* Progress Bars */
.team-type-2 .member .team-progress { position: absolute; bottom: 25px; left: 0; width: 100%; opacity: 0; overflow: hidden; }
.team-type-2 .member .team-progress .prg-bg { width: 100%; background-color: #E8E8E8; padding: 0; margin: 0; }
.team-type-2 .member .team-progress .progress-bar { height: 5px; padding: 0; float: none; margin-top: 15px; position: relative; left: 0; min-width: 40%; box-shadow: none; }
.team-type-2 .member:hover .team-progress { opacity: 1; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
/* Progress Texts */
.team-type-2 .member .team-progress h3 { font-size: 16px; color: #666; margin-top: 30px; white-space: nowrap; font-weight: normal; text-transform: uppercase; padding: 0; }
/* Member Description Texts */
.team-type-2 .member .member-description h2 { font-size: 22px; margin: 0; padding: 0; text-transform: uppercase; }
.team-type-2 .member .member-description h4 { font-size: 16px; margin: 17px auto 14px; padding: 0; text-transform: uppercase; }
.team-type-2 .member .member-description p { font-size: inherit; line-height: 22px; margin: 0; padding: 0; }
/* Member Description Styles and hover */
.team-type-2 .member .member-description { color: #858585; position: relative; width: 100%; height: auto; left: 0; padding: 20px 25px; opacity: 1; top: 0; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.team-type-2 .member:hover .member-description { color: white; }
/* Member Socials */
.team-type-2 .member .member-socials { position: absolute; bottom: 0; height: 60px; left: 0; width: 100%; text-align: center; overflow: hidden; }
.team-type-2 .member .member-socials a { display: block; width: 37px; height: 37px; line-height: 37px; color: #949596; margin: 0 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.team-type-2 .member .member-socials div { top: 100%; position: relative; display: inline-block; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.team-type-2 .member:hover .member-socials div { top: 0; }
.team-type-2 .member .member-socials a:hover { color: white; }
/* Member Social Delays */
.team-type-2 .member:hover .member-socials div:nth-of-type(1) { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.team-type-2 .member:hover .member-socials div:nth-of-type(2) { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; }
.team-type-2 .member:hover .member-socials div:nth-of-type(3) { -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }
.team-type-2 .member:hover .member-socials div:nth-of-type(4) { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; }
.team-type-2 .member:hover .member-socials div:nth-of-type(5) { -webkit-transition-delay: 0.7s; transition-delay: 0.7s; }
.team-type-2 .member:hover .member-socials div:nth-of-type(6) { -webkit-transition-delay: 0.8s; transition-delay: 0.8s; }
/* Team Type 3 */
.team-type-3 .member { margin: 0 15px; height: auto; }
.team-type-3 .member img { width: 100%; height: auto; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.team-type-3 .member:hover img { opacity: 0.35; }
.team-type-3 .member .member-body { background-color: #000; position: relative; }
/* Progress Bars */
.team-type-3 .member .team-progress { position: absolute; bottom: 20px; left: -15px; width: 100%; opacity: 1; overflow: hidden; }
.team-type-3 .member .team-progress .progress-bar { height: 40px; max-height: 40px; padding: 10px 25px; float: none; font-size: 15px; margin-top: 15px; position: relative; opacity: 1; left: 0; width: 0; min-width: 40%; box-shadow: none; -webkit-transform: translateZ(0) scale(1.0, 1.0); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.team-type-3 .member:hover .team-progress .progress-bar { opacity: 0; left: -50%; }
/* Member Description */
.team-type-3 .member .member-description { position: absolute; width: 100%; left: 0; padding: 20px; color: #F6F6F6; opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.team-type-3 .member .member-description p.icon { font-size: 18px; margin-top: -40px; display: block; }
.team-type-3 .member .member-description h2 { font-size: 25px; padding: 0; margin: 15px auto; }
.team-type-3 .member .member-description p { font-size: 15px; line-height: 22px; }
.team-type-3 .member:hover .member-description { opacity: 1; }
/* Member Socials */
.team-type-3 .member .member-socials { position: absolute; bottom: 0; height: 60px; left: 0; width: 100%; text-align: center; overflow: hidden; }
.team-type-3 .member .member-socials a { display: block; width: 37px; height: 37px; line-height: 37px; color: #949596; margin: 0 5px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.team-type-3 .member .member-socials div { top: 100%; position: relative; display: inline-block; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.team-type-3 .member:hover .member-socials div { top: 0; }
.team-type-3 .member .member-socials a:hover { color: white; }
/* Member Social Delays */
.team-type-3 .member:hover .member-socials div:nth-of-type(1) { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.team-type-3 .member:hover .member-socials div:nth-of-type(2) { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; }
.team-type-3 .member:hover .member-socials div:nth-of-type(3) { -webkit-transition-delay: 0.5s; transition-delay: 0.5s; }
.team-type-3 .member:hover .member-socials div:nth-of-type(4) { -webkit-transition-delay: 0.6s; transition-delay: 0.6s; }
.team-type-3 .member:hover .member-socials div:nth-of-type(5) { -webkit-transition-delay: 0.7s; transition-delay: 0.7s; }
/* Member Name and Position */
.team-type-3 .member > h2 { margin: 20px 0 0; font-size: 20px; color: #6C6C6C; }
.team-type-3 .member > p { font-size: 15px; color: #949494; }
/* Timeline Types
/* ================================================== */
.strip-timeline .events { width: 100%; height: auto; padding: 30px 0 90px; position: relative; margin: 20px 0 40px; overflow: hidden; }
.strip-timeline .events div { font-weight: inherit; color: #8F8F8F; font-size: 20px; opacity: 0; position: absolute; text-align: center; left: 20px; width: 100%; text-align: center; margin: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.strip-timeline .events div.active { opacity: 1; left: 0px; -webkit-transition-delay: 0.2s; /* Safari */ transition-delay: 0.2s; }
/* Dates */
.strip-timeline .dates { border-top: 1px solid #CBCBCB; position: relative; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.strip-timeline .dates div { text-transform: uppercase; font-size: 14px; color: #7B7B7B; cursor: cell; word-spacing: 0; position: relative; padding-top: 40px; letter-spacing: 0px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.strip-timeline .dates div:before { content: ''; width: 20px; height: 20px; background: #CBCBCB; position: absolute; margin: 0 auto; display: block; top: -11px; left: 50%; margin-left: -10px; z-index: 2; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
.strip-timeline .dates div:after { content: ''; width: 30px; height: 30px; background: white; border: 1px solid #CBCBCB; position: absolute; margin: 0 auto; display: block; top: -16px; left: 50%; margin-left: -15px; z-index: 1; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
/* Left and right squares for the timeline strip */
.strip-timeline .dates:before, .strip-timeline .dates:after { content: ''; display: block; position: absolute; left: 0px; width: 13px; height: 13px; background: #CBCBCB; border-radius: 100%; top: -7px; }
.strip-timeline .dates:after { left: auto; right: 0px; }
/* On Dark Backgrounds */
.strip-timeline.light-type .events div { color: #FAFAFA; }
.strip-timeline.light-type .dates { border-color: #333; }
.strip-timeline.light-type .dates div { color: #FAFAFA; }
.strip-timeline.light-type .dates div:before { background: #666; }
.strip-timeline.light-type .dates div:after { border-color: #666; background-color: #222; }
.strip-timeline.light-type .dates:before, .strip-timeline.light-type .dates:after { background: #666; }
/* Hover Colors */
.strip-timeline .dates div:hover, .strip-timeline .dates div.active { color: #777; }
.strip-timeline .dates div:hover:before, .strip-timeline .dates div.active:before { background-color: #777; }
.strip-timeline .dates div:hover:after, .strip-timeline .dates div.active:after { border-color: #777; }
@media only screen and (max-width: 750px)
{
.strip-timeline .events div { padding: 0 15px; }
.strip-timeline .dates { border: none; padding: 0 5px; }
.strip-timeline .dates:before, .strip-timeline .dates:after { display: none; }
.strip-timeline .dates div { width: 20% !important; margin: 20px 0 !important; word-spacing: 0px; }
.strip-timeline .dates div:before { top: 0px; }
.strip-timeline .dates div:after { top: -5px; }
}
@media only screen and (max-width: 450px)
{
.strip-timeline .events div { font-size: 15px; }
.strip-timeline .dates div { width: 33% !important; word-spacing: 3px; }
}
/* Skills section types
/* ================================================== */
/* Skills Type 1 */
.skills-type-1 { text-align: left; padding-bottom: 100px; margin-top: 20px; }
.skills-type-1 .item { margin-top: 30px; }
.skills-type-1 .item h3 { font-size: 20px; text-transform: uppercase; padding: 0; margin: 0 0 30px 0; color: #B7B7B7; }
.skills-type-1 .item .progress { border-radius: 0; height: 10px; background-color: #333; }
.skills-type-1 .item .progress-bar { height: 100%; overflow: hidden; }
.skills-type-1.light-type .progress { background-color: #DDD; }
.skills-type-1.progress-xl .item .progress { height: 35px; }
.skills-type-1.progress-xl .item .progress .progress-bar { line-height: 37px; padding: 0 20px; width: 0; min-width: 150px; text-align: right; }
.skills-type-1.progress-lg .item .progress { height: 20px; }
.skills-type-1.progress-sm .item .progress { height: 5px; }
/* Progress */
.progress { box-shadow: none; background-color: #EEE; }
/* Skills Type 2 */
.skills-type-2 { text-align: left; padding: 0; }
.skills-type-2 .item { margin-top: 30px; text-align: left; }
.skills-type-2 .item h3 { font-size: 16px; font-weight: inherit; text-transform: uppercase; padding: 0; margin: 0 0 10px 0; color: #B7B7B7; }
.skills-type-2.dark .item h3 { color: #555; }
.skills-type-2 .item .progress { border-radius: 0; height: 2px; background-color: #555555; margin-bottom: 10px; }
.skills-type-2.dark .item .progress { border-radius: 0; height: 2px; background-color: #CCC; margin-bottom: 10px; }
.skills-type-2 .item .progress-bar { height: 100%; }
.qdr-col-2.skills-type-2 .item { padding-left: 0; }
.qdr-col-2.skills-type-2 .item:nth-of-type(2n) { padding-left: 15px; padding-right: 0; }
@media only screen and (max-width: 690px)
{
.skills-type-2 .item { width: 100%; }
.qdr-col-2.skills-type-2 .item:nth-of-type(2n) { padding-left: 0; }
}
/* You can find gradient colors in the css/skins/yourfile path. */
.gradient-progress-bar * { position: relative; z-index: 9; line-height: inherit; }
/* Gallery types
/* ================================================== */
/* Gallery Types */
.gallery-type-1 .cbp-caption-activeWrap { background-color: rgba(0, 0, 0, 0.45); }
.gallery-type-1.slash .cbp-caption-activeWrap { width: 94%; left: 3%; height: 94%; top: 3%; }
.gallery-type-1.no-hover .cbp-caption-activeWrap { background-color: rgba(0, 0, 0, 0.1); }
/* Links */
.gallery-type-1:not(.no-hover) .cbp-caption-activeWrap a { width: 50px; margin: 0 3px; opacity: 0; height: 50px; line-height: 50px; font-size: 22px; padding: 0; color: white; border-radius: 100%; display: inline-block; position: relative; -ms-transform: scale(0.1); -webkit-transform: scale(0.1); transform: scale(0.1); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.gallery-type-1:not(.no-hover) .cbp-caption-activeWrap a:before { position: absolute; width: 100%; height: 100%; left: 0; top: 0; border-radius: 100%; content: ''; background-color: rgba(255, 255, 255, 0.1); z-index: 0; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -ms-transform: scale(0.7); -webkit-transform: scale(0.7); transform: scale(0.7); }
.gallery-type-1:not(.no-hover) .cbp-caption-activeWrap a:hover:before { -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); opacity: 1; }
.gallery-type-1:not(.no-hover) .cbp-caption-activeWrap a i { position: relative; z-index: 2; font-weight: 900; font-size: 19px; }
.gallery-type-1:not(.no-hover) .cbp-item:hover .cbp-caption-activeWrap a { opacity: 1; -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
/* Delays */
.gallery-type-1 .cbp-caption-activeWrap a:nth-of-type(1) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
.gallery-type-1 .cbp-caption-activeWrap a:nth-of-type(2) { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
.gallery-type-1 .cbp-caption-activeWrap a:nth-of-type(3) { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.gallery-type-1 .cbp-caption-activeWrap a:nth-of-type(4) { -webkit-transition-delay: 0.4s; transition-delay: 0.4s; }
.gallery-type-1:not(.no-hover) .cbp-item:hover .cbp-caption-activeWrap { opacity: 1; }
.gallery-type-1:not(.no-hover) .cbp-item img { -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; }
.gallery-type-1:not(.no-hover) .cbp-item:hover img { -ms-transform: scale(1.06); -webkit-transform: scale(1.06); transform: scale(1.06); }
/* Item options */
.gallery-type-1.with-texts .cbp-item .cbp-item-wrapper { padding-bottom: 10px; }
.gallery-type-1.with-texts .cbp-item .cbp-item-wrapper:before { content: ''; width: 100%; display: block; left: 0; top: 0; bottom: 0; right: 0; background: none; position: absolute; border: 1px solid #EEE; }
.gallery-type-1.with-texts .cbp-item .title { color: #666; font-size: 17px; padding-left: 10px; }
.gallery-type-1.with-texts .cbp-item .description { font-size: 13px; padding-left: 10px; }
.projects-white-buttons .cbp a { font-size: 11px; font-weight: bolder; text-transform: uppercase; background-color: white; margin-top: 1px; color: #333; }
.custom-texts .cbp-filter-item { font-family: inherit; font-weight: inherit; text-transform: inherit; font-size: inherit; }
/* Fix Imagine Issue */
.cbp:not(.cbp-l-grid-faq) .cbp-item-off { display: none; }
/* Mobile */
@media only screen and (max-width: 830px)
{
.gallery-type-1 .cbp-item-wrapper .cbp-caption > div { overflow: hidden; }
.gallery-type-1 .cbp-caption-activeWrap { position: relative; opacity: 1; background-color: #252525; visibility: visible; }
.gallery-type-1:not(.no-hover) .cbp-caption-activeWrap a { opacity: 1; visibility: visible; -ms-transform: scale(1); -webkit-transform: scale(1); transform: scale(1); }
}
/* Portfolio types
/* ================================================== */
/* Styled Portfolio */
.styled-portfolio .cbp-item .cbp-caption-activeWrap { background-color: rgba(24, 24, 24, 0.7); }
/* Bordered Portfolio */
.styled-portfolio.bordered-items .cbp-item .cbp-caption-activeWrap { background-color: transparent; }
.styled-portfolio.bordered-items .cbp-item .cbp-caption-activeWrap:before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: -1; background-color: rgba(32, 32, 32, 1); -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; }
/* Image Parallax */
.styled-portfolio.parallax .cbp-item .cbp-caption-defaultWrap img { display: block; position: relative; -webkit-transform: translate(0px,0px) scale(1.0); -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; transition: all 1s ease-out; }
/* Texts and icon */
.styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-title { font-weight: 600; letter-spacing: -0.4px; font-size: 18px; line-height: 35px; }
.styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-desc { font-weight: 600; letter-spacing: 0px; font-size: 11px; color: #BBB; }
.styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-title img { display: inline-block; width: auto; height: auto; position: relative; margin-bottom: 11px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
/* Hovers for large devices */
@media only screen and (min-width: 630px)
{
.styled-portfolio.bordered-items .cbp-item .cbp-caption-activeWrap:before { background-color: rgba(24, 24, 24, 0.7); }
.styled-portfolio.bordered-items .cbp-item:hover .cbp-caption-activeWrap:before { left: 20px; right: 20px; bottom: 20px; top: 20px; }
.styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-title span, .styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-desc span { opacity: 0; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; -webkit-transform: translateY(15px); -moz-transform: translateY(15px); -ms-transform: translateY(15px); transform: translateY(15px); position: relative; display: inline-block; }
.styled-portfolio .cbp-item .cbp-caption-activeWrap .cbp-l-caption-title span { -webkit-transition-delay: 0.0s; transition-delay: 0.0s; }
.styled-portfolio .cbp-item:hover .cbp-caption-activeWrap .cbp-l-caption-title + .cbp-l-caption-desc span, .styled-portfolio .cbp-item:hover .cbp-caption-activeWrap .cbp-l-caption-desc + .cbp-l-caption-title span { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
.styled-portfolio .cbp-item:hover .cbp-caption-activeWrap .cbp-l-caption-title span, .styled-portfolio .cbp-item:hover .cbp-caption-activeWrap .cbp-l-caption-desc span { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }
}
/* Parallax Portfolio */
.parallax-portfolio .item { display: block; position: relative; }
.parallax-portfolio .item:after { display: block; position: absolute; content: ''; background: rgba(20, 20, 20, 0.6); z-index: -1; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
.parallax-portfolio .item .item-overlay { opacity: 0; position: relative; z-index: 1; }
.parallax-portfolio .item:hover:after, .parallax-portfolio .item:hover .item-overlay { opacity: 1; }
.parallax-portfolio .item .item-overlay .item-icon { opacity: 0; margin: 0; padding: 0; position: relative; -webkit-transition: all 0.3s linear 0s; -moz-transition: all 0.3s linear 0s; transition: all 0.3s linear 0.4s; }
.parallax-portfolio .item .item-overlay .item-title { opacity: 0; margin: 0; padding: 0; position: relative; left: 15px; -webkit-transition: all 0.3s linear 0s; -moz-transition: all 0.3s linear 0s; transition: all 0.3s linear 0s; }
.parallax-portfolio .item .item-overlay .item-desc { opacity: 0; margin: 0; padding: 0; position: relative; left: 15px; -webkit-transition: all 0.3s linear 0.2s; -moz-transition: all 0.3s linear 0.2s; transition: all 0.3s linear 0.2s; }
.parallax-portfolio .item:hover .item-overlay .item-icon, .parallax-portfolio .item:hover .item-overlay .item-title, .parallax-portfolio .item:hover .item-overlay .item-desc { left: 0; opacity: 1; }
/* Column Portfolio */
.portfolio-column, .portfolio-column .slide { height: 100%; overflow: hidden; position: relative; display: block; }
/* Slide Image */
.portfolio-column .slide .slide-img { position: absolute; height: 100%; width: 100%; overflow: hidden; }
.portfolio-column .slide .slide-img img { min-height: 100%; width: auto; min-width: 105.5%; object-fit: cover; position: relative; -webkit-transform: translateX(-5%); -moz-transform: translateX(-5%); -ms-transform: translateX(-5%); transform: translateX(-5%); -webkit-transition: -webkit-transform 0.6s; -moz-transition: -moz-transform 0.6s; transition: transform 0.6s; }
.portfolio-column .slide:before { position: absolute; content: ''; left: 15px; top: 15px; right: 15px; bottom: 15px; background-color: rgba(15, 15, 15, 1); opacity: 0; z-index: 2; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.portfolio-column .slide:hover:before { opacity: 0.4; }
.portfolio-column .slide:hover .slide-img img { -webkit-transform: translateX(-2%); -moz-transform: translateX(-2%); -ms-transform: translateX(-2%); transform: translateX(-2%); }
/* Slide Details */
.portfolio-column .slide .details { position: absolute; left: 30px; right: 30px; top: auto; bottom: 30px; z-index: 2; padding: 15px; }
.portfolio-column .slide .details > * { opacity: 0; top: 10px; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -webkit-transition-delay: 0.0s; transition-delay: 0.0s; }
.portfolio-column .slide:hover .details > * { opacity: 1; top: 0; }
/* Delay for details */
.portfolio-column .slide:hover .details .title { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
.portfolio-column .slide:hover .details > div { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; }
.portfolio-column .slide:hover .details .description { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; }
.portfolio-column .slide:hover .details .button { -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.portfolio-column .slide .details .button:hover { -webkit-transition-delay: 0.0s; transition-delay: 0.0s; }
/* Style 2 */
.portfolio-column.style-2 .slide { -webkit-transition: width 0.5s; -moz-transition: width 0.5s; transition: width 0.25s; }
.portfolio-column.style-2 .slide:hover .slide-img img { -webkit-transform: translateX(-3%); -moz-transform: translateX(-3%); -ms-transform: translateX(-3%); transform: translateX(-3%); }
/* Style 2 On Columns */
@media only screen and (min-width: 1170px)
{
.portfolio-column.style-2.qdr-col-5:hover .slide { width: 19.5% !important; }
.portfolio-column.style-2.qdr-col-5 .slide:hover { width: 22% !important; }
.portfolio-column.style-2.qdr-col-4:hover .slide { width: 24% !important; }
.portfolio-column.style-2.qdr-col-4 .slide:hover { width: 28% !important; }
.portfolio-column.style-2.qdr-col-3:hover .slide { width: 32% !important; }
.portfolio-column.style-2.qdr-col-3 .slide:hover { width: 36% !important; }
.portfolio-column.style-2.qdr-col-2:hover .slide { width: 47% !important; }
.portfolio-column.style-2.qdr-col-2 .slide:hover { width: 53% !important; }
}
/* Active Columns for mobile */
@media only screen and (max-width: 1025px)
{
.portfolio-column .slide .details > * { opacity: 1; top: 0; }
.portfolio-column .slide:before { opacity: 1; background-color: rgba(15, 15, 15, 0.3); }
}
/* Centered Details */
.portfolio-column.centered-details .slide .details { bottom: 50%; -webkit-transform: translateY(50%); -moz-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); }
/* Style 3 */
.portfolio-column.style-3 .slide .details > * { opacity: 1; top: 0; }
.portfolio-column.style-3 .slide:before { opacity: 1; left: 0; top: 0; bottom: 0; right: 0; background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%); }
/* Works without images */
.works-without-images { padding: 0; }
.works-without-images .item-body { padding: 30px 20px; display: block; border: 1px solid #EEE; opacity: 0.5; }
.works-without-images .item-body .title img { max-width: 140px; }
.works-without-images .item-body:hover { opacity: 1; }
.works-without-images .item-body .title { padding: 0; margin: 0 0 15px 0; }
.works-without-images .item-body .desc { line-height: 22px; margin-bottom: 20px; }
.icon-arrow { width: 15%; margin: 10px 0; background-color: #AAA; display: block; height: 1px; position: relative; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.icon-arrow:before, .icon-arrow:after { width: 5px; height: 1px; transform: rotate(90deg); background-color: inherit; content: ''; display: block; position: absolute; right: -2px; top: 2px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.icon-arrow:after { top: -2px; transform: rotate(-90deg); }
.icon-arrow-trigger:hover .icon-arrow:before { transform: rotate(146deg); right: -3px; width: 16px; top: 4px; }
.icon-arrow-trigger:hover .icon-arrow:after { transform: rotate(-146deg); right: -3px; width: 16px; top: -4px; }
.icon-arrow-trigger:hover .icon-arrow { width: 50%; }
/* Modal heading color */
.cbp-popup-singlePage .cbp-popup-navigation-wrap { background-color: #2A2A2A; }
/* Hero Slider
/* ================================================== */
.hero-slider, .hero-slider .slide { position: relative; overflow: hidden; }
/* Sllide image and scale image */
.hero-slider .slide .slide-img, .hero-slider .slide .slide-img .scale-timer { position: absolute; width: 100%; height: 100% !important; max-width: 100% !important; background-attachment: scroll !important; left: 0; top: 0 !important; z-index: 2; background-position: center center; background-size: cover; }
.hero-slider .slide .slide-img .scale-timer { -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); -webkit-transition: transform 1s; -moz-transition: transform 1s; transition: transform 1s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.hero-slider .slide .slide-img .scale-timer.scaling { -ms-transform: scale(1.25); -webkit-transform: scale(1.25); transform: scale(1.25); -webkit-transition: transform 20s; -moz-transition: transform 20s; transition: transform 20s; }
.hero-slider .slide .details { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 5; }
/* Get Height for slides */
.hero-slider .slick-list, .hero-slider .slick-track { height: 100% !important; }
/* Animated items on slider */
.hero-slider .slick-slide .animated { visibility: hidden !important; animation-duration: 0.9s; -webkit-transition: visibility 0.3s; -moz-transition: visibility 0.3s; transition: visibility 0.3s; }
.hero-slider .slick-slide.slick-current .animated.visibleme { visibility: visible !important; }
.nav-to-custom-slider .slick-slide { -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; opacity: 0.5; }
.nav-to-custom-slider .slick-center { opacity: 1; }
/* Hero Slider
/* ================================================== */
.background-slider { z-index: -1; position: absolute; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; }
.background-slider .slick-list, .background-slider .slick-track { position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 !important; }
.background-slider .slide { position: relative; width: 100%; height: 100%; background-size: cover; background-position: center center; }
/* Clients Types
/* ================================================== */
/*Classic Carousel */
.clients-carousel { padding: 30px; }
.clients-carousel .cbp-caption-opacity .cbp-caption-defaultWrap { padding: 15px 10px; }
.clients-carousel .cbp-caption-opacity .cbp-caption-defaultWrap img { width: auto; height: auto; max-width: 90%; max-height: 80px; margin: 0 auto; }
.clients-carousel.dark-type .cbp-item:hover .cbp-caption { border-color: #555; }
/* Client List */
.client-list { overflow: hidden; }
.client-list li, .client-list li a { display: block; text-align: center; max-width: 100%; margin: 0 auto; padding: 0; height: auto; position: relative; }
.client-list li { border-style: inherit; border-color: inherit; }
.client-list li a { width: 80%; padding: 10px 0; opacity: 0.6; -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }
.client-list li a img { vertical-align: middle; width: 100%; max-width: 80%; margin: 0 auto; }
.client-list li a:hover { opacity: 1; }
/* Borders */
.client-list li:before { position: absolute; content: ''; top: 0; height: 100%; width: 0px; left: -1px; border-width: 0px; border-left-width: 1px; border-color: inherit; border-style: inherit; }
.client-list li:after { position: absolute; content: ''; left: 0; width: 100%; height: 1px; bottom: -1px; border-width: 0px; border-bottom-width: 1px; border-color: inherit; border-style: inherit; }
/* Carousel Lists */
.client-list.client-list-carousel li { padding-bottom: 1px; }
.client-list-carousel a { border: 1px solid transparent; }
.client-list-carousel a:hover { border: 1px solid #EEE !important; }
/* Contact Types
/* ================================================== */
/* Type 1 */
.contact-type-1 { padding-top: 100px; padding-bottom: 100px; }
.contact-type-1 * { color: #555; line-height: normal; }
.contact-type-1 .contact-title { padding: 0; margin: 0 0 60px; }
.contact-type-1 .address h3.title { margin-bottom: 50px; }
.contact-type-1 p { font-size: inherit; color: #565656; direction: ltr; line-height: 25px; margin: 10px 0 0; }
.contact-type-1 p * { margin-left: 5px; }
.contact-type-1 .qdr-callout { border-color: #46332A; }
.contact-type-1 .contact-button { border: 1px solid #CACACA; background: #FFF; border-radius: 0; padding: 13px 0; font-size: inherit; text-align: center; width: 100%; text-transform: uppercase; display: block; }
.contact-type-1 .contact-button:hover { opacity: 1 !important; border-color: transparent; }
.contact-type-1 .address { padding-right: 15px; }
/* Contact Area */
.contact-type-1 .contact #contact_form { margin-top: 40px; }
.contact-type-1 input, .contact-type-1 textarea { width: 100%; height: auto; padding: 18px 0; background: transparent; margin: 0; text-transform: uppercase; font-size: inherit; border: none; color: #848484; font-weight: inherit; resize: none; -webkit-transition: all 0.3s ease-in-out 0.60s; -moz-transition: all 0.3s ease-in-out 0.60s; transition: all 0.3s ease-in-out 0.60s; }
.contact-type-1 textarea { height: 100px; }
.contact-type-1 textarea.lg { height: 170px; }
.contact-type-1 input:focus, .contact-type-1 textarea:focus { padding-left: 10px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.contact-type-1 .error_warning { border-bottom-color: #BF1F1F !important; }
.contact-type-1 span.border-effect span { background-color: #B5B5B5; }
.contact-type-1 span.border-effect { border-bottom-color: #B5B5B5; }
.contact-type-1 ::-webkit-input-placeholder { color: #777; }
.contact-type-1 :-moz-placeholder { color: #777; }
.contact-type-1 ::-moz-placeholder { color: #777; }
.contact-type-1 :-ms-input-placeholder { color: #777; }
/* Media options for contact section */
@media only screen and (max-width: 1175px)
{
.contact-type-1 .container { padding-left: 15px; padding-right: 15px; }
}
@media only screen and (max-width: 700px)
{
.contact-type-1 .container > div.contact { margin-top: 60px; }
}
/* Contact Type 1 - Light edition */
.contact-type-1.light-type *, .contact-type-1.light-type .address p span { color: #DDD; }
.contact-type-1.light-type .qdr-callout { border-color: #46332A; }
.contact-type-1.light-type .contact-button { border: 1px solid #393736; background: #2B2928; }
.contact-type-1.light-type .contact-button:hover { opacity: 1 !important; }
.contact-type-1.light-type span.border-effect span { background-color: #444; }
.contact-type-1.light-type span.border-effect { border-bottom-color: #444; }
.contact-type-1.light-type ::-webkit-input-placeholder { color: #AAA; }
.contact-type-1.light-type :-moz-placeholder { color: #AAA; }
.contact-type-1.light-type ::-moz-placeholder { color: #AAA; }
.contact-type-1.light-type :-ms-input-placeholder { color: #AAA; }
/* Footer styles
/* ================================================== */
.classic_footer { background-color: #3E0A14; color: #8A8A8A; line-height: 170%; font-size: 14px; -webkit-transform: translateZ(0px); transform: translateZ(0px); }
.classic_footer .footer-body { padding: 60px 0 50px; }
.classic_footer .footer-body .row { width: 100%; }
@media only screen and (max-width: 1171px)
{
.classic_footer { padding-left: 15px; padding-right: 15px; }
.classic_footer .footer-bottom { margin-left: -15px; margin-right: -15px; }
}
/* Flickr */
.classic_footer #flickr_badge_wrapper .flickr_badge_image { display: inline-block; margin-right: 10px; margin-bottom: 10px; opacity: 0.7; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.classic_footer #flickr_badge_wrapper .flickr_badge_image:hover { opacity: 1; }
.classic_footer #flickr_badge_wrapper .flickr_badge_image img { width: 76px; height: 76px; }
/* Socials */
.classic_footer .social-icon { width: 40px; height: 40px; line-height: 40px; font-size: 12px; }
/* Bottom */
.classic_footer .footer-bottom { background-color: #131313; padding: 20px 0; font-size: 13px; }
.classic_footer .footer-bottom img.logo { max-height: 35px; }
.classic_footer .footer-bottom .bottoms > div { display: inline-block !important; vertical-align: middle; float: none !important; max-height: 40px; }
@media only screen and (max-width: 1025px)
{
.classic_footer .footer-bottom .bottoms > div { width: 100% !important; text-align: center; margin-bottom: 10px; height: auto; }
.classic_footer .footer-bottom .bottoms > div:last-child { margin-bottom: 0; }
}
/* From Gallery */
.classic_footer .from-gallery a { display: inline-block; width: 80px; overflow: hidden; margin: 0 5px 5px 0; opacity: 0.7; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.classic_footer .from-gallery a:hover { opacity: 1; }
/* Media options for Footer section */
@media only screen and (max-width: 900px)
{
.classic_footer > .container > div { width: 100%; margin-top: 50px; }
.classic_footer > .container > div:first-child { margin-top: 0; }
}
/* BASIC FOOTER */
.basic_footer { padding: 90px 0; text-align: center; color: #939393; letter-spacing: 0.3px; }
.basic_footer h3 { margin: 20px auto; padding: 0; }
.basic_footer h5 { margin: 0 auto; }
/* Footer Clients */
.footer-clients a { height: 70px; position: relative; text-align: center; margin: 0 10px 0 0; border: 1px solid transparent; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.footer-clients a:hover { border: 1px solid rgba(255, 255, 255, 0.1); }
.footer-clients img { max-height: 60px; width: auto; position: absolute; top: 50%; left: 50%; max-width: 90%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%, -50%); }
/* Newsletter */
.footer-newsletter input { background: #1F1F21; margin-bottom: 15px; color: #FFF; height: 40px; width: 100%; outline: none !important; border: none; box-shadow: none !important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.footer-newsletter input.error_warning { background-color: #671E1E; color: white; }
.footer-newsletter button#submit { height: 40px; width: 100%; border-radius: 4px; }
.footer-newsletter input:not(.error_warning)::-webkit-input-placeholder { color: #777; }
.footer-newsletter input:not(.error_warning):-moz-placeholder { color: #777; }
.footer-newsletter input:not(.error_warning)::-moz-placeholder { color: #777; }
.footer-newsletter input:not(.error_warning):-ms-input-placeholder { color: #777; }
/* Client Comments */
.footer-client-comments .slick-slide { margin-bottom: 20px; }
.footer-client-comments .avatar { width: 35px; height: 35px; overflow: hidden; float: left; margin-right: 10px; }
.footer-client-comments .avatar img { max-width: 100%; }
.footer-client-comments .texts { float: left; width: 70%; width: calc(100% - 60px); }
.footer-client-comments .texts h6 { margin-top: 2px; }
/* Footer Fixed */
footer.footer-fixed { position: fixed; bottom: 0; left: 0; right: 0; z-index: 0; -webkit-transform: translateZ(0); transform: translateZ(0); }
body.footer-fixed-page > section { z-index: 2; position: relative; }
@media only screen and (max-width: 1024px)
{
footer.footer-fixed { position: relative; }
footer.footer-fixed + .footer-keeper { display: none; }
}
/* Twitter Feed */
ul.twitter-list li a { display: block; margin: 10px 0; }
ul.twitter-list li a:hover { text-decoration: underline; }
ul.twitter-list li a i { margin-right: 6px; color: rgba(90, 158, 242, 1); }
ul.twitter-list li a span { display: block; margin-top: 12px; }
footer ul.twitter-list li a span { font-size: 11px; color: #444; margin-top: 5px; font-weight: bold; text-transform: uppercase; }
/* Blog Types
================================================== */
.qdr-blog .cbp-item, .qdr-blog, .qdr-blog .cbp-wrapper-outer { overflow: visible; }
.qdr-blog .cbp.cbp-updateItems { overflow-x: visible; }
.qdr-blog .cbp .cbp-item-loading { opacity: 0 !important; }
/* Blog Utilities */
.qdr-blog .blog-utilities .blog-user { display: inline-block; padding: 5px 10px; border-radius: 6px; }
.qdr-blog .blog-utilities .blog-user img { display: inline-block; width: 100%; max-width: 40px; vertical-align: middle; }
.qdr-blog .blog-utilities .blog-user p { display: inline-block; vertical-align: middle; padding-left: 5px; }
/* Radius for posts */
.qdr-blog.post-radius .cbp-item, .qdr-blog.post-radius .cbp-item .cbp-item-wrapper { border-radius: 6px; }
.qdr-blog.post-radius .cbp-item .cbp-item-wrapper { overflow: hidden; }
/* Shadow Effect */
.qdr-blog.post-shadow .cbp-item:hover { z-index: 10; }
.qdr-blog.post-shadow .cbp-item:before { position: absolute; border-radius: inherit; display: block; left: 0; top: 0; content: ''; width: 100%; height: 100%; box-shadow: 0 10px 100px -20px rgba(0, 0, 0, 0); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
.qdr-blog.post-shadow .cbp-item:hover:before { box-shadow: 0 70px 100px -20px rgba(0, 0, 0, 0.3); }
/* Shadow Effect Small */
.qdr-blog.post-shadow.post-shadow-sm .cbp-item:hover:before { box-shadow: 0 32px 100px -20px rgba(0, 0, 0, 0.15); }
/* Tags */
.tags a, .tags .tag { display: inline-block; padding: 6px 13px; background-color: #EEE; line-height: normal; margin: 3px 2px; font-size: inherit; font-weight: inherit; border-radius: 4px; color: #888; -webkit-transition: all 0.1s; -moz-transition: all 0.1s; transition: all 0.1s; }
.tags a:hover, .tags .tag:hover { color: #555; background-color: #FFF; box-shadow: 2px 10px 25px 0px rgba(0, 0, 0, 0.06); }
.tags.dark a, .tags.dark .tag { background-color: #212121; color: #FFFFFF; }
.tags.dark a:hover, .tags.dark .tag:hover { background-color: #484848; }
/* Blog Landing */
.blog-landing .post { border-width: 1px; border-style: solid; padding: 35px 15px; position: relative; }
@media only screen and (min-width: 1024px)
{
.blog-landing .post { padding: 35px; }
}
/* Post & Project Pagination
================================================== */
.post-pagination { position: relative; text-align: left; }
.post-pagination .pagination, .post-pagination .all { height: 80px; float: left; }
.post-pagination .pagination { width: 47%; overflow: hidden; text-align: left; position: relative; padding: 0 30px; margin: 0; line-height: inherit; display: block; line-height: 85%; }
/* Texts */
.post-pagination .pagination .texts { left: 40px; position: relative; }
.post-pagination .pagination.next .texts { left: auto; right: 40px; text-align: right; }
/* Icon */
.post-pagination .icon { position: absolute; opacity: 0.5; left: 40px; top: 10px; font-size: 18px; visibility: visible; }
.post-pagination .pagination.next .icon { left: auto; right: 40px; }
/* Slow Effect */
.post-pagination .post-image, .post-pagination .icon, .post-pagination .texts { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; top: 50%; will-change: transform; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
/* Image */
.post-pagination .post-image { position: absolute; left: 0; width: 45px; height: 45px; visibility: hidden; opacity: 0; }
.post-pagination .pagination.next .post-image { left: auto; right: 0; }
.post-pagination .post-image img { display: block; width: auto; max-width: 100%; }
/* Center all button */
.post-pagination .all { width: 6%; line-height: 80px; font-size: 14px; position: relative; text-align: center; border-left-width: 1px; border-right-width: 1px; border-style: solid; }
/* Hovers */
.post-pagination .pagination.prev:hover .texts { left: 60px; }
.post-pagination .pagination.prev:hover .icon { opacity: 0; visibility: hidden; left: 80px; }
.post-pagination .pagination.prev:hover .post-image { opacity: 1; visibility: visible; left: 30px; }
/* Next */
.post-pagination .pagination.next:hover .texts { right: 60px; }
.post-pagination .pagination.next:hover .icon { opacity: 0; visibility: hidden; right: 80px; }
.post-pagination .pagination.next:hover .post-image { opacity: 1; visibility: visible; right: 30px; }
@media only screen and (max-width: 641px)
{
.post-pagination { display: none; }
}
/* Pagination
================================================== */
.pagination { align-items: center; justify-content: center; }
.pagination > li > a { display: block; border: 1px solid #DDD; }
.pagination > li > a, .pagination > li > span { font-size: 12px; text-transform: uppercase; color: #888; }
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover { color: #FFF; background-color: #333; }
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover { background-color: #DEDEDE; border-color: #DEDEDE; color: inherit; }
.pagination-lg > li > a, .pagination-lg > li > span { padding: 7px 22px; }
/* if internet explorer */
body.ie-browser .pagination { display: block; }
body.ie-browser .pagination > li { display: inline-block; width: auto; }
/* Shop Styles
================================================== */
.shop .cbp { overflow: visible; }
.shop .item .product-image { -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.shop .item:hover .product-image { opacity: 0.7; }
.shop .item a.cbp-caption:before { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; background-color: transparent; border: 1px solid #DDD; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
/* Item Details */
.shop .item .details { background: transparent; margin-top: 25px; }
.shop .item .title { font-size: 18px; font-weight: 400; letter-spacing: -1.2px; }
.shop .item .subtitle { font-size: 15px; color: #999; font-weight: 400; }
.shop .item .price span { font-weight: 400; letter-spacing: -0.4px; font-size: 17px; margin-left: 10px; }
.shop .item .price span.old { text-decoration: line-through; color: #999; }
.shop .item a.add-to-cart { display: block; width: 100%; position: relative; bottom: -60px; margin-top: 18px; padding: 7px 0; opacity: 0; background-color: #F2F2F2; font-size: 14px; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.shop .item a.add-to-cart:hover { color: #FFF; background-color: #3A3A3A; }
.shop .item a.add-to-cart i { margin-right: 10px; }
.shop .item:hover a.add-to-cart { bottom: 0; opacity: 1; }
/* Shop Styled Type */
.shop.shop-styled .item:hover .product-image { top: -5px; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); }
.shop.shop-styled .item .product-image { padding-top: 15px; }
.shop.shop-styled .item a.cbp-caption:before { border: none; background-color: #FAFAFA; }
.shop.shop-styled .item a.add-to-cart { background-color: #333; color: white; }
.shop.shop-styled .item a.add-to-cart:hover { background-color: #111; }
.shop.shop-styled .item:hover a.cbp-caption:before { background-color: #FAFAFA; }
/* Shop Parallax */
.shop-parallax a.item { display: block; position: relative; }
.shop-parallax a.item:after { display: block; content: ''; width: 100%; height: 100%; left: 0; top: 0; background-color: rgba(0, 0, 0, 0.3); position: absolute; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; }
.shop-parallax a.item:hover:after { opacity: 0; }
/* Single Item */
@media screen and (max-width: 900px)
{
.shop-single .details { margin-top: 70px; }
}
.shop-single .details-icons { padding: 20px; }
.shop-single .details-icons .icon { float: left; width: 35px; height: 40px; padding-top: 5px; border-style: solid; text-align: center; font-size: 28px; color: inherit; }
.shop-single .details-icons .text { float: left; font-size: 16px; margin-left: 6px; }
.shop-single .details-icons .text span { font-size: 12px; line-height: 12px; }
/* Shop Cart */
.table-shop-cart .product-thumbnail img { max-height: 80px; }
@media screen and (max-width: 800px)
{
.shop-single .details-icons { padding: 15px 7px; }
.shop-single .details-icons .icon { width: 10px; height: 30px; font-size: 14px; }
.shop-single .details-icons .text { font-size: 12px; margin-left: 8px !important; }
.shop-single .details-icons .text span { font-size: 10px; }
.table-shop-cart .product-thumbnail img { max-height: 40px; }
}
@media screen and (max-width: 480px)
{
.table-shop-cart .product-thumbnail img { display: none; }
}
.table-shop-cart.table > tbody > tr > td { vertical-align: middle; }
/* Modal Types
================================================== */
/* Classic Modals */
.modal { overflow: hidden; z-index: 1400; -webkit-transform: translateZ(0); transform: translateZ(0); }
/* Vertical align middle for modals */
.middle-modal { text-align: left; width: auto; }
.modal .modal-dialog { -webkit-transform: translate(0,0%) !important; transform: translate(0, 0%) !important; }
.modal .modal-content { border: none; }
.modal .modal-header { display: block; }
.modal .modal-details { padding: 70px 40px; }
.modal .modal-sm .modal-details { padding: 30px 20px; }
@media screen and (max-width: 768px)
{
.modal { overflow-y: auto; }
.middle-modal .modal-details { padding: 40px 30px 20px; }
}
@media screen and (min-width: 768px)
{
.middle-modal > .modal-dialog { left: 50%; top: 50%; position: fixed !important; -webkit-transform: translateY(-50%) translateX(-50%) !important; -moz-transform: translateY(-50%) translateX(-50%) !important; -ms-transform: translateY(-50%) translateX(-50%) !important; transform: translateY(-50%) translateX(-50%) !important; }
}
.middle-modal > .container, .middle-modal > .container-sm, .middle-modal > .container-md, .middle-modal > .container-lg { padding-left: 0 !important; padding-right: 0 !important; }
.modal-backdrop { z-index: 1300; }
.modal-backdrop.in { opacity: 0.7; }
/* Modal IMG */
.modal .modal-img { overflow: hidden; position: absolute; left: 0; height: 101%; top: -1px; padding: 0; background-size: cover; background-position: center center; }
.modal .modal-img.to-right { left: auto; right: 0; }
.modal .modal-img img { width: auto; height: auto; min-height: 100%; min-width: 100%; }
.modal .slick-slider img { max-width: 100%; }
@media screen and (max-width: 1185px)
{
.middle-modal > div { width: 95%; max-width: none; padding: 0; }
}
@media screen and (max-width: 1000px)
{
.modal .modal-img { height: 100%; }
.modal .modal-img img { height: auto; width: auto; min-width: 100%; min-height: 100%; }
}
@media screen and (max-width: 768px)
{
.modal .modal-img { position: relative; height: auto; min-height: 300px; }
.modal .modal-img img { height: auto; width: auto; min-width: 100%; min-height: 100%; }
.middle-modal > div { margin-top: 15px; margin-bottom: 15px; }
}
/* Modal Promo */
.modal .modal-promo { padding: 150px 40px; max-width: 1170px; background-size: cover; background-position: center center; }
/* Slick Slider in Modal */
@media only screen and (max-width: 1024px)
{
.modal .slick-slider { background: url(../images/loader.gif) center center no-repeat; min-height: 100px; }
.modal .slick-slider .slick-list { opacity: 0; -webkit-transition: opacity 0.4s; -moz-transition: opacity 0.4s; transition: opacity 0.4s; }
.modal .slick-slider.modal-active .slick-list { opacity: 1; }
.modal .slick-slider.modal-active { background: none; }
}
/* Modal Close */
.modal .close { opacity: 1; display: block; width: 40px; height: 40px; text-align: center; border-radius: 100%; position: absolute; background-color: #FFF; top: 15px; right: 15px; color: #AAA; z-index: 20; line-height: 40px; font-weight: 100; font-size: 17px; }
/* Modal Sizes */
.modal .modal-xl { width: 100%; max-width: 1170px; height: auto; margin: 40px auto; position: relative; }
.modal .modal-lg { margin: 40px auto; }
.modal .modal-md { margin: 15px auto; }
.modal .modal-sm { margin: 40px auto; position: relative; }
@media screen and (max-width: 1185px)
{
.modal .modal-xl { width: auto; margin: 40px 15px; }
}
@media screen and (max-width: 915px)
{
.modal .modal-lg { margin: 40px 15px; }
}
@media screen and (max-width: 768px)
{
.modal .modal-sm { margin: 40px 15px; }
}
/* Quadra Fixed Modal - qfm */
#quadra_fixed_modal { visibility: hidden; position: fixed; will-change:transform; z-index: 1037; width: 100%; top: 100%; height: 100%; -webkit-transform: translateY(0) translateZ(0); -moz-transform: translateY(0) translateZ(0); -ms-transform: translateY(0) translateZ(0); transform: translateY(0) translateZ(0); overflow-x: hidden; overflow-y: hidden; }
#quadra_fixed_modal.hiding { visibility: hidden; top: 100% !important; -webkit-transform: translateY(-0px) !important; -moz-transform: translateY(-0px) !important; -ms-transform: translateY(-0px) !important; transform: translateY(0px) !important; }
#quadra_fixed_modal.hiding.force-show { visibility: visible; top: 0% !important; -webkit-transform: translateY(0px) !important; -moz-transform: translateY(0px) !important; -ms-transform: translateY(0px) !important; transform: translateY(0px) !important; }
#quadra_fixed_modal.clickable { visibility: visible; -webkit-transform: translateY(-60px); -moz-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px); }
body.qdr-modal-open { overflow: hidden; height: 100%; }
/* QFM With Side Menus */
@media screen and (min-width: 641px)
{
body.left-mini-side-menu-active #quadra_fixed_modal, body.right-mini-side-menu-active #quadra_fixed_modal { width: calc(100% - 60px); }
}
@media screen and (min-width: 1450px)
{
body.left-side-menu-active #quadra_fixed_modal, body.right-side-menu-active #quadra_fixed_modal { width: calc(100% - 300px); }
}
@media (min-width: 1120px) and (max-width: 1450px)
{
body.left-side-menu-active #quadra_fixed_modal, body.right-side-menu-active #quadra_fixed_modal { width: calc(100% - 230px); }
}
/* Open qfm */
#quadra_fixed_modal.active { top: 0%; visibility: visible; -webkit-transform: translateY(0) translateZ(0); -moz-transform: translateY(0) translateZ(0); -ms-transform: translateY(0) translateZ(0); transform: translateY(0) translateZ(0); height: 100%; overflow-y: auto; }
/* Title and Button area for the qfm */
.quadra_fixed_modal_top { position: relative; top: 0; height: 60px; line-height: 64px; cursor: pointer; }
/* Height of title at open qfm */
#quadra_fixed_modal.active .quadra_fixed_modal_top { height: 100px; line-height: 100px; }
/* Styles for title and button */
.quadra_fixed_modal_top div { width: 100%; height: 100%; padding: 0 12px; line-height: inherit; position: absolute; display: none; text-align: center; font-size: 21px; text-transform: uppercase; }
/* Visible button for start */
.quadra_fixed_modal_top #qfm_button { display: block; }
.quadra_fixed_modal_top #qfm_button i { line-height: inherit; }
.quadra_fixed_modal_top #qfm_button:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; background-color: rgba(0, 0, 0, 0.15); -webkit-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; }
.quadra_fixed_modal_top #qfm_button:hover:before { opacity: 1; }
.qfm-body { padding: 50px 15px 70px; }
/* CSS options for qfm */
#qfm_title { position: relative; border-bottom: 1px solid #DDD; }
#qfm_title i { font-size: 23px; position: absolute; width: 100px; height: 100%; right: 0; top: 0; line-height: inherit; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; }
#qfm_title i:hover { background-color: rgba(0, 0, 0, 0.03); }
/* Comp. Hide modal */
#qfm_button span.hide-modal { position: absolute; right: 0; top: 0; width: 100px; height: 100%; text-align: center; }
#qfm_button span.hide-modal:before { content: '\e082'; font-family: 'simple-line-icons'; font-size: 25px; background-color: rgba(0, 0, 0, 0.05); line-height: inherit; opacity: 0.8; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transition: background 0.3s; -moz-transition: background 0.3s; transition: background 0.3s; }
#qfm_button span.hide-modal:hover:before { background-color: rgba(22, 22, 22, 0.2); }
@media screen and (max-width: 480px)
{
.quadra_fixed_modal_top div { font-size: 17px; }
#qfm_button span.hide-modal { width: 80px; }
#qfm_title i { font-size: 17px; width: 80px; }
}
/* Faq Styles */
/* Modal body styles for faq */
.qfm-body div { font-family: inherit !important; }
#quadra_fixed_modal.faq .quadra_fixed_modal_top { border-top: 1px solid #DDD; }
#quadra_fixed_modal.faq .qfm-body .cbp-caption-expand .cbp-caption-defaultWrap { font-size: 16px; text-transform: uppercase; padding: 12px 0; }
#quadra_fixed_modal.faq .qfm-body .cbp-caption-expand .cbp-caption-defaultWrap i { margin-right: 10px; }
#quadra_fixed_modal.faq .qfm-body .cbp-caption-expand .cbp-l-caption-body { font-size: 16px; font-weight: 300; color: #555; }
/* Social Colors */
/* Background Hovers And Actives */
.mail:hover, .mail-bg { background: #404040 !important; }
.facebook:hover, .facebook-bg { background: #4B6EA8 !important; }
.twitter:hover, .twitter-bg { background: #4FD5F8 !important; }
.youtube:hover, .youtube-bg { background: #DA1818 !important; }
.vimeo:hover, .vimeo-bg { background: #96D3F0 !important; }
.pinterest:hover, .pinterest-bg { background: #D83633 !important; }
.linkedin:hover, .linkedin-bg { background: #0189C3 !important; }
.flickr:hover, .flickr-bg { background: #84979E !important; }
.dropbox:hover, .dropbox-bg { background: #1E81C2 !important; }
.instagram:hover, .instagram-bg { background: #D82950 !important; }
.tumblr:hover, .tumblr-bg { background: #345365 !important; }
.skype:hover, .skype-bg { background: #00BBF0 !important; }
.google-plus:hover, .google-plus-bg { background: #DA2200 !important; }
.twitter-square:hover, .twitter-square-bg { background: #4FD5F8 !important; }
.rss:hover, .rss-bg { background: #FB9C00 !important; }
.apple:hover, .apple-bg { background: #404040 !important; }
.windows:hover, .windows-bg { background: #0063F4 !important; }
.dribbble:hover, .dribbble-bg { background: #F2689C !important; }
.android:hover, .android-bg { background: #80DA23 !important; }
.html5:hover, .html5-bg { background: #EC6432 !important; }
.css3:hover, .css3-bg { background: #3A88D0 !important; }
.pagelines:hover, .pagelines-bg { background: #4F98DF !important; }
.gittip:hover, .gittip-bg { background: #7C6035 !important; }
/* Color Hovers */
.mail-color:hover { color: #404040 !important; }
.facebook-color:hover { color: #4B6EA8 !important; }
.twitter-color:hover { color: #4FD5F8 !important; }
.youtube-color:hover { color: #DA1818 !important; }
.vimeo-color:hover { color: #96D3F0 !important; }
.pinterest-color:hover { color: #D83633 !important; }
.linkedin-color:hover { color: #0189C3 !important; }
.flickr-color:hover { color: #84979E !important; }
.dropbox-color:hover { color: #1E81C2 !important; }
.instagram-color:hover { color: #D82950 !important; }
.tumblr-color:hover { color: #345365 !important; }
.skype-color:hover { color: #00BBF0 !important; }
.google-plus-color:hover { color: #DA2200 !important; }
.twitter-square-color:hover { color: #4FD5F8 !important; }
.rss-color:hover { color: #FB9C00 !important; }
.apple-color:hover { color: #404040 !important; }
.windows-color:hover { color: #0063F4 !important; }
.dribbble-color:hover { color: #F2689C !important; }
.android-color:hover { color: #80DA23 !important; }
.html5-color:hover { color: #EC6432 !important; }
.css3-color:hover { color: #3A88D0 !important; }
.pagelines-color:hover { color: #4F98DF !important; }
.gittip-color:hover { color: #7C6035 !important; }