/*------------------------------------------------------------------
[Master Stylesheet]

Project:     CreativeTime
Author:      AbsharBY
Version:     1.0
Website:     http://abshar.by/CreativeTime

[Table of contents]

1. Reset (reset stylesheet)
2. Varibles (fonts, sizes, colors)
3. layout GRID system (from Bootstrap)
4. Typography elements (headings, separators, text elements)
5. Components (buttons, icons, icon with text, image with text, team, call to action, accordion & tabs)
6. Interactive (contact form, countdown, counters, sliders, google maps)
7. Gallery
8. Animate
9. Blog style
10. Base style (body, html)
11. Header (logo, menu)
12. Pages
13. Footer
14. Color style (all colors)
15. Media (media queries )
-------------------------------------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

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

textarea, input, button, select { font-family: inherit; font-size: inherit; }

html { -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; }

/*------------------------------------------------------------------
[2. Varibles ]

/** FONT VARS **/
/** COLOR VARS **/
/** MAIN VARS **/
/*---------------------------
/* 5 Columns */
.col-xs-15, .col-sm-15, .col-md-15, .col-lg-15 { position: relative; min-height: 1px; padding-right: 10px; padding-left: 10px; }

.col-xs-15 { width: 20%; float: left; }

@media (min-width: 768px) { .col-sm-15 { width: 20%; float: left; } }
@media (min-width: 992px) { .col-md-15 { width: 20%; float: left; } }
@media (min-width: 1200px) { .col-lg-15 { width: 20%; float: left; } }
.clearfix, .clearfix:before, .clearfix:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after { content: " "; display: table; }

.clearfix:after, .container:after, .container-fluid:after, .row:after { clear: both; }

.center-block { display: block; margin-left: auto; margin-right: auto; }

.pull-right { float: right !important; }

.pull-left { float: left !important; }

.text-right { text-align: right; }

.text-left { text-align: left; }

.text-center { text-align: center; }

.margin20 { margin: 20px 0; }

.margin40 { margin: 40px 0; }

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.height40vh { height: 40vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.height50vh { height: 50vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.height60vh { height: 60vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.height70vh { height: 70vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.height80vh { height: 80vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.height100vh { height: 100vh; background-repeat: no-repeat; background-position: 50% 0; background-size: cover; overflow: hidden; }

.small-space { height: 10px; }

.medium-space { height: 15px; }

.large-space { height: 20px; }

.m-top-50 { margin-top: 50px !important; }

.m-bottom-50 { margin-bottom: 50px !important; }

.m-top-40 { margin-top: 40px !important; }

.m-bottom-40 { margin-bottom: 40px !important; }

.m-top-30 { margin-top: 30px !important; }

.m-bottom-30 { margin-bottom: 30px !important; }

.m-top-20 { margin-top: 20px !important; }

.m-bottom-20 { margin-bottom: 20px !important; }

.m-top-10 { margin-top: 10px !important; }

.m-bottom-10 { padding-bottom: 10px !important; }

.m-top-5 { margin-top: 5px !important; }

.m-bottom-5 { padding-bottom: 5px !important; }

.p-top-40 { padding-top: 40px !important; }

.p-bottom-50 { padding-bottom: 50px !important; }

.p-top-120 { padding-top: 120px !important; }

.dark-bg { background-color: #414141; }

.block-padding { padding: 10px 0; }

a:hover { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

/** TYPOGRAPHY **/
h1, h2, h3, h4, h5, h6 { font-family: "Varela Round", Arial, sans-serif; color: #414141; line-height: 1.4em; text-transform: capitalize; z-index: 11; }

h1 { font-size: 24px; font-weight: 400; letter-spacing: 3px; }

h2 { font-size: 25px; font-weight: 400; letter-spacing: 3px; }

h3 { font-size: 23px; font-weight: 400; letter-spacing: 3px; }

h4 { font-size: 21px; font-weight: 400; letter-spacing: 2px; }

h5 { font-size: 17px; font-weight: 400; letter-spacing: 2px; }

h6 { font-size: 17px; font-weight: 300; }

blockquote.style-1 { border-left: 5px solid #003399; padding: 10px 20px; margin: 0 0 20px; font-size: 12px; background: #eee; }

blockquote.style-1 span.author { color: #414141; text-transform: uppercase; display: block; font-size: 12px; margin-top: 15px; margin-bottom: 5px; text-align: right; font-weight: bold; }

blockquote.style-2 { border: 2px solid #ddd; padding: 20px 20px 10px 45px; margin: 0 0 20px; font-size: 12px; position: relative; }

blockquote.style-2:before { content: " “ "; color: #414141; font-size: 46px; display: inline-block; font-family: "Varela Round", Arial, sans-serif; position: absolute; left: 13px; line-height: 1.4; top: 12px; }

blockquote.style-2 span.author { color: #414141; display: block; font-size: 13px; margin-top: 10px; margin-bottom: 5px; text-align: right; font-weight: bold; }

span.dropcap-1 { display: block; float: left; font-size: 36px; padding: 0; margin: 0; margin: 0px 8px 0 0; text-transform: uppercase; line-height: 1; font-family: "Varela Round", Arial, sans-serif; color: #414141; background: #eee; padding: 2px 4px; }

span.dropcap-2 { display: block; float: left; font-size: 40px; padding: 0; margin: 0; margin: 0px 8px 0 0; text-transform: uppercase; line-height: 1; font-family: "Varela Round", Arial, sans-serif; color: #003399; }

ul.list-1 li:before { content: ' '; width: 8px; height: 8px; margin-right: 12px; font-weight: normal; vertical-align: top; display: inline-block; vertical-align: 0px; background: #848687; }

ul.list-2 li:before { content: ' '; width: 8px; height: 8px; border-radius: 50%; margin-right: 12px; font-weight: normal; vertical-align: top; display: inline-block; vertical-align: 0px; border: 1px solid #003399; }

ul.list-3 li:before { font-family: 'Pe-icon-7-stroke'; content: "\e684"; color: #414141; border-radius: 50%; font-weight: normal; vertical-align: top; display: inline-block; font-size: 26px; line-height: 0.9; position: relative; right: 7px; width: 22px; }

hr.style-1 { border: 0; height: 1px; background: #848687; }

hr.style-2 { border: 0; height: 4px; background-image: -webkit-linear-gradient(left, #f0f0f0, #414141, #f0f0f0); background-image: -moz-linear-gradient(left, #f0f0f0, #414141, #f0f0f0); background-image: -ms-linear-gradient(left, #f0f0f0, #414141, #f0f0f0); background-image: -o-linear-gradient(left, #f0f0f0, #414141, #f0f0f0); }

hr.style-3 { border: 0; height: 5px; background-image: -webkit-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); background-image: -moz-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); background-image: -ms-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); background-image: -o-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); }

hr.style-4 { border: 0; height: 3px; background: #848687; text-align: center; }

hr.style-4:after { font-family: 'Pe-icon-7-stroke'; content: "\e643"; display: inline-block; position: relative; top: -15px; padding: 0 10px; background: #fff; color: #414141; font-size: 20px; }

.separator { text-align: center; border-bottom: 1px solid #000; line-height: 0.1em; margin: 10px 0 20px; }

.separator span { background: #fff; padding: 0 10px; }

/** BUTTON **/
.btn { display: inline-block; position: relative; outline: 0; box-sizing: border-box; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; border: none; font-family: "Varela Round", Arial, sans-serif; border-radius: 4px; }

.btn.btn-small { font-size: 11px; line-height: 31px; padding: 0 16px; }

.btn.btn-medium { font-size: 12px; line-height: 36px; padding: 0 18px; }

.btn.btn-large { font-size: 14px; line-height: 42px; padding: 0 30px; }

.btn.btn-1 { color: #414141; }

.btn.btn-1:hover { color: #848687; }

.btn.btn-2 { border: 1px solid #414141; color: #414141; }

.btn.btn-2:hover { border: 1px solid #848687; color: #848687; }

.btn.btn-3 { border: 1px solid #414141; background: #414141; color: #eee; }

.btn.btn-3:hover { border: 1px solid #848687; color: #848687; }

.btn.btn-4 { color: #eee; }

.btn.btn-4:hover { color: #848687; }

.btn.btn-5 { border: 1px solid #eee; color: #eee; }

.btn.btn-5:hover { border: 1px solid #848687; color: #848687; }

.btn.btn-6 { border: 1px solid #eee; background: #eee; color: #414141; }

.btn.btn-6:hover { border: 1px solid #848687; color: #848687; }

.btn.btn-7 { color: #003399; }

.btn.btn-7:hover { color: #ff9933; }

.btn-8 { color: #414141; border: 1px solid transparent; background-size: 200% auto; -moz-border-image: -moz-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); -webkit-border-image: -webkit-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image-slice: 1; }

.btn-8:hover { background-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.btn-9 { color: #fff; background: #003399; }

.btn-9:hover { background: #f48000; }

/** INFOGRAPHY **/
.infography-1 { padding: 20px 0px 20px 20px; position: relative; }

.infography-1 .infography-icon { float: left; }

.infography-1 .infography-icon i { display: inline-block; font-size: 40px; margin: 5px; width: 70px; height: 70px; line-height: 70px; text-align: center; border-radius: 50%; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1); -ms-transition: all 500ms ease-in; -ms-transform: scale(1); -moz-transition: all 500ms ease-in; -moz-transform: scale(1); transition: all 500ms ease-in; transform: scale(1); }

.infography-1 .infography-text { padding-left: 80px; text-align: left; margin-top: 15px !important; }

.infography-1:hover i { color: #003399; z-index: 2; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1.2); -ms-transition: all 500ms ease-in; -ms-transform: scale(1.2); -moz-transition: all 500ms ease-in; -moz-transform: scale(1.2); transition: all 500ms ease-in; transform: scale(1.2); }

.infography-1 .infography-text p { color: #848687; }

.infography-2 { margin: 0 20px 30px 20px; }

.infography-2 .infography-title { margin: 5px 0 30px 0; }

.infography-2 .infography-title:after { content: " "; width: 70px; height: 4px; display: inline-block; box-sizing: border-box; background-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); margin-top: 10px; }

.infography-2.infography i { display: inline-block; font-size: 52px; margin: 5px; width: 70px; height: 70px; line-height: 70px; text-align: center; border-radius: 50%; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1); -ms-transition: all 500ms ease-in; -ms-transform: scale(1); -moz-transition: all 500ms ease-in; -moz-transform: scale(1); transition: all 500ms ease-in; transform: scale(1); }

.infography-2.infography:hover i { color: #003399; z-index: 2; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1.2); -ms-transition: all 500ms ease-in; -ms-transform: scale(1.2); -moz-transition: all 500ms ease-in; -moz-transform: scale(1.2); transition: all 500ms ease-in; transform: scale(1.2); }

.infography-3 { margin: 0 20px 30px 20px; }

.infography-3 .infography-title { margin: 20px 0; }

.infography-3.infography i { display: inline-block; font-size: 38px; margin: 5px; width: 70px; height: 70px; line-height: 70px; text-align: center; border-radius: 50%; background: #003399; box-sizing: border-box; background-size: 200% auto; background-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); color: #eee; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1); -ms-transition: all 500ms ease-in; -ms-transform: scale(1); -moz-transition: all 500ms ease-in; -moz-transform: scale(1); transition: all 500ms ease-in; transform: scale(1); }

.infography-3.infography:hover i { color: #eee; z-index: 2; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1.2); -ms-transition: all 500ms ease-in; -ms-transform: scale(1.2); -moz-transition: all 500ms ease-in; -moz-transform: scale(1.2); transition: all 500ms ease-in; transform: scale(1.2); }

.infography-4.infography img { border: 1px solid #ddd; }

.infography-4 .infography-title { margin: 20px 0; }

/** ICON **/
.icon-container { text-align: center; margin: 20px 0; }

.icon-container i { color: #414141; margin: 0 0 15px 0; display: block; font-size: 22px; }

.icon-container:hover i { color: #003399; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

/** CALL TO ACTION **/
.ctoa { padding: 60px 40px; }

.ctoa p { font-size: 17px; background: rgba(255, 255, 255, 0.4); padding: 10px; }

.ctoa-border { border: 2px solid transparent; background-size: 200% auto; -moz-border-image: -moz-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); -webkit-border-image: -webkit-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image-slice: 1; }

.ctoa-bg { background: #eee; }

.color-white, .color-white h1, .color-white h2, .color-white h3 { color: #eee !important; }

/** TABS & ACCORDION **/
.accordion-element .inner { padding: 10px; overflow: hidden; display: none; }

.accordion-element li { margin: 0 0 10px 0; }

.accordion-element a.toggle { width: 100%; display: block; font-size: 11px; line-height: 43px; padding: 0 23px; transition: background .3s ease; text-decoration: none; background-color: #fff; font-family: "Varela Round", Arial, sans-serif; text-transform: uppercase; letter-spacing: 2px; }

.accordion-element.style-1 a.toggle { background: #414141; color: #eee; }

.accordion-element.style-1 a.toggle:hover { background: #848687; }

.accordion-element.style-1 .inner { border: 1px solid #ddd; }

.accordion-element.style-2 a.toggle { border: 1px solid #848687; color: #848687; }

.accordion-element.style-2 a.toggle:hover { border: 1px solid #414141; color: #414141; }

ul.tab-element-tabs { margin: 0px; padding: 0px; list-style: none; display: inline-block; }

ul.tab-element-tabs li { background: none; display: inline-block; font-size: 13px; line-height: 43px; padding: 0 23px; cursor: pointer; border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; border-radius: 3px 3px 0 0; background: #fff; font-family: "Varela Round", Arial, sans-serif; color: #848687; text-transform: uppercase; }

.tab-element .tab-content { display: none; padding: 15px 0; border-radius: 3px; background-color: #fff; }

.tab-element .tab-content.current { display: inherit; }

.tab-element.style-1 li { padding: 0 23px 0 0; }

.tab-element.style-1 li.current, .tab-element.style-1 li:hover { color: #414141; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.tab-element.style-2 ul.tab-element-tabs { border: 2px solid transparent; background-size: 200% auto; -moz-border-image: -moz-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); -webkit-border-image: -webkit-linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); border-image-slice: 1; }

.tab-element.style-2 li.current, .tab-element.style-2 li:hover { color: #003399; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.tab-element.style-3 ul.tab-element-tabs { border-bottom: 2px solid #848687; }

.tab-element.style-3 li { position: relative; top: 2px; }

.tab-element.style-3 li.current, .tab-element.style-3 li:hover { color: #414141; border-bottom: 2px solid #003399; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

/** PROGRESS BAR **/
.pb { list-style: none; margin: 0; padding: 10px; }

.pb .pb-item { margin-bottom: 1em; position: relative; }
.pb .pb-item p { color: #fff; left: 1em; line-height: 0.5; position: absolute; top: 1em; letter-spacing: 2px; text-transform: uppercase; }
.pb .pb-item ::-webkit-progress-value { -webkit-animation: bar-fill 3s; width: 0px; }

.pb progress, progress[role] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-size: auto; height: 33px; width: 100%; }

.pb progress::-webkit-progress-value { background-size: 200% auto; background-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); }

.pb progress::-moz-progress-bar { background-size: 200% auto; background-image: linear-gradient(to right, #003399 0%, #ff9933 51%, #003399 100%); }

@-webkit-keyframes bar-fill { 0% { width: 0; } }

@keyframes bar-fill { 0% { width: 0; } }

.pb-2 { list-style: none; margin: 0; padding: 10px; }

.pb-2 .pb-item { margin-bottom: 1em; position: relative; }
.pb-2 .pb-item p { letter-spacing: 2px; text-transform: uppercase; }
.pb-2 .pb-item ::-webkit-progress-value { -webkit-animation: bar-fill 3s; width: 0px; }

.pb-2 progress, progress[role] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-size: auto; height: 10px; width: 100%; }

.pb-2 progress::-webkit-progress-value { background: #414141; }

.pb-2 progress::-moz-progress-bar { background: #414141; }

@-webkit-keyframes bar-fill { 0% { width: 0; } }

@keyframes bar-fill { 0% { width: 0; } }

/** FORM **/
.form-group { margin-bottom: 20px; }

.form-group label { display: block; margin-bottom: 3px; letter-spacing: 1px; font-family: "Varela Round", Arial, sans-serif; font-size: 12px; }

.form-group label span { margin-right: 3px; font-weight: bold; }

.form-group input { width: 100%; padding: 6px 15px; height: 40px; line-height: 30px; font-size: 12px; border: 1px solid #848687; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.form-group textarea { width: 100%; padding: 6px 15px; height: 170px; line-height: 30px; font-size: 12px; border: 1px solid #848687; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.contact-form-parallax { position: relative; padding: 100px 0 70px; }

label.error { font-size: 10px; padding: 5px 10px; text-align: left; font-family: "Varela Round", Arial, sans-serif; color: #003399; margin: 4px 2px; }

/** TESTIMONIAL **/
.testimonial-1 .testimonial-item { max-width: 600px; margin: 30px auto; }

.testimonial-1 .testimonial-image { text-align: center; }

.testimonial-1 .testimonial-image img { width: 100px; border-radius: 50%; display: inline-block; border: 2px solid #ddd; -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1); -ms-transition: all 500ms ease-in; -ms-transform: scale(1); -moz-transition: all 500ms ease-in; -moz-transform: scale(1); transition: all 500ms ease-in; transform: scale(1); }

.testimonial-1 .testimonial-item:hover img { -webkit-transition: all 500ms ease-in; -webkit-transform: scale(1.2); -ms-transition: all 500ms ease-in; -ms-transform: scale(1.2); -moz-transition: all 500ms ease-in; -moz-transform: scale(1.2); transition: all 500ms ease-in; transform: scale(1.3); }

.testimonial-1 p.testimonial-person { margin: 30px 0 0 0; color: #414141; font-weight: bold; text-transform: uppercase; }

.testimonial-1 p.testimonial-person span { color: #003399; }

.owl-carousel .owl-dots .owl-dot span { width: 24px; height: 5px; margin: 5px 4px; background: #ddd; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; }

.owl-carousel .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent; }

.owl-carousel .owl-dots .owl-dot { display: inline-block; }

.owl-carousel .owl-dots .owl-dot.active span { background: #003399; }

.owl-nav { position: absolute; top: 0; bottom: 0; margin: auto; height: 30px; left: 0; display: block; width: 100%; }

.owl-carousel:hover .owl-nav .owl-prev, .owl-carousel:hover .owl-nav .owl-next { color: #848687; -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; transition: all 0.7s ease; }

.owl-carousel .owl-nav .owl-next { right: 20px; display: inline-block; font-size: 24px; float: right; padding: 0 15px; color: transparent; line-height: 0; }

.owl-carousel .owl-nav .owl-prev { left: 20px; display: inline-block; font-size: 24px; padding: 0 15px; color: transparent; line-height: 0; }

.testimonial-2 .testimonial-item { max-width: 500px; margin: 30px auto; }

.testimonial-2 .testimonial-image { position: relative; }

.testimonial-2 .testimonial-image p.testimonial-person { position: absolute; bottom: 20px; color: #eee; width: 100%; text-align: center; background: rgba(29, 29, 29, 0.6); padding: 10px; font-weight: bold; text-transform: uppercase; }

.testimonial-3 .testimonial-item { padding: 30px; }

.testimonial-3 .testimonial-image i { font-size: 32px; }

.testimonial-3 .testimonial-item:hover .testimonial-image i { color: #003399; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.testimonial-3 p.testimonial-person { margin: 30px 0 0 0; color: #414141; font-weight: bold; text-transform: uppercase; }

/** COUNTER **/
.counter-item { margin: 60px 0; }

.counter-item i { margin: 0 0 30px 0; font-size: 38px; display: inline-block; }

.counter-value { font-size: 24px; font-weight: normal; font-family: "Varela Round", Arial, sans-serif; line-height: 0.8; color: #414141; }

.counter-text { font-weight: normal; margin-top: 10px; font-family: "Varela Round", Arial, sans-serif; font-size: 14px; }

.counter-parallax { position: relative; padding: 70px 0; }

.counter-parallax .counter-value { color: #fff; }

.text-countdown { font-size: 34px; }

.text-countdown span, .day-countdown span { color: #414141; font-weight: bold; }

.day-countdown { font-size: 34px; }

.countdown-text { font-family: "Varela Round", Arial, sans-serif !important; }

.countdown-section { width: 14%; display: inline-block; font-family: "Varela Round", Arial, sans-serif; color: #414141; font-size: 30px; }

.countdown-section span { font-size: 12px; text-transform: uppercase; display: inline-block; color: #848687; margin: 30px 0 0 0; }

.countdown-amount { line-height: 0; }

/** TEAM **/
.team-item { position: relative; overflow: hidden; line-height: 0; }

.team-item * { -webkit-box-sizing: border-box; box-sizing: border-box; }

.team-item img { width: 100%; }

.team-item .team-caption { position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; background: rgba(29, 29, 29, 0.6); color: #eee; padding: 13px 10px 28px 10px; }

.team-item .team-caption h6 { color: #eee; margin-bottom: 13px; text-transform: uppercase; }

[class*=" imghvr-"] figcaption, [class^="imghvr-"] figcaption { background: rgba(29, 29, 29, 0.6); }

/** INFOGRAPHY **/
/** Image with text **/
.image-text-div { position: relative; }

.image-text-icon { position: absolute; bottom: -13px; z-index: 1; width: 100%; }

.image-text { margin-bottom: 40px; }

.image-text img { margin-bottom: 10px; }

.image-text-clr .image-text-title { margin: 25px 0 15px 0; }

.image-text-title { margin: 5px 0 15px 0; }

.image-text i { display: inline-block; font-size: 34px; margin: 5px; width: 50px; height: 50px; line-height: 50px; text-align: center; border-radius: 3px; }

.image-text:hover i { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; }

.image-text.image-text-clr i { color: #fff; }

.image-text-left { float: left; }

.image-text-left-content { padding-left: 80px; text-align: left; }

.image-text-important { margin: 20px 0; font-weight: bold; }

/*------------------------------------------------------------------
[10. Base style ]
----------------------------------------------*/
body { font-family: "Open Sans", sans-serif; font-size: 13px; min-width: 320px; line-height: 1.6; letter-spacing: 1px; -webkit-font-smoothing: antialised; overflow-x: hidden; color: #414141; }

html, body { height: 100%; margin: 0; padding: 0; }

a { color: #003399; text-decoration: none; }

a:hover, a:focus, a:active { text-decoration: none !important; }

/** Loader **/
#loader { height: 100%; width: 100%; background: #eee; position: fixed; left: 0; top: 0; z-index: 111111; }

.loader { width: 220px; height: 120px; display: inline-block; box-sizing: border-box; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; text-align: center; }

.loader span { font-size: 18px; font-family: "Varela Round", Arial, sans-serif; letter-spacing: 3px; color: #003399; }

.spinner { margin: 0 auto 20px auto; width: 50px; height: 40px; text-align: center; font-size: 10px; }

.spinner > div { background-color: #FF9933; height: 100%; width: 6px; display: inline-block; -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; animation: sk-stretchdelay 1.2s infinite ease-in-out; }

.spinner .rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }

.spinner .rect3 { -webkit-animation-delay: -1s; animation-delay: -1s; }

.spinner .rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }

.spinner .rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }

@-webkit-keyframes sk-stretchdelay { 0%, 40%, 100% { -webkit-transform: scaleY(0.4); }
  20% { -webkit-transform: scaleY(1); } }

@keyframes sk-stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); }
  20% { transform: scaleY(1); -webkit-transform: scaleY(1); } }

/** HEADER **/
.top-header { background-color: #414141; color: rgba(255, 255, 255, 0.8); padding: 4px 0; font-size: 12px; }

.header { padding: 10px 0; background-color: #d2f2ff; }

.logo { line-height: 0; display: inline-block; float: left; }

.logo img { width: 180px; }

.slogan { float: left; margin-left: 10px; padding-left: 10px; margin-top: 10px; border-left: 2px solid #848687; color: #414141; }

.navigation-block .line-color { position: absolute; top: 0; left: 0; display: inline-block; width: 100%; height: 3px; content: ''; background: #b6b6b6; background-color: #b6b6b6; font-size: 0; line-height: 0; text-align: center; white-space: nowrap; }

.navigation-block .line-color { background-color: #67b0d6; }

.navigation-block .line-color span { width: 13%; }

.navigation-block .line-color span { background-color: #c877db; }

.navigation-block .line-color span + span { background-color: #55cbd9; }

.navigation-block .line-color span + span + span { background-color: #70e1cf; }

.navigation-block .line-color span + span + span + span { background-color: #9ed178; }

.navigation-block .line-color span + span + span + span + span { background-color: #f4e47a; }

.navigation-block .line-color span + span + span + span + span + span { background-color: #d984b2; }

.navigation-block .line-color span + span + span + span + span + span + span { background-color: #7dc3de; }

.navigation-block .line-color span + span + span + span + span + span + span + span { background-color: #cf98de; }

.navigation-block .line-color span { position: relative; display: inline-block; vertical-align: top; width: 228px; height: 100%; content: ''; background: #c575da; background-color: #c575da; }

.navigation-block { position: relative; -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.07); -moz-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.07); box-shadow: 0 4px 4px rgba(0, 0, 0, 0.07); }

.nav-search-icon { color: #fff; }

.nav-menu > li > a { color: #414141; }

.nav-menu > li:hover > a, .nav-menu > li.active > a, .nav-menu > li.focus > a { color: #414141; }

.megamenu-panel { background-color: #414141; }

.header-btns li { float: right; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-top: 12px; }

.header-btns li:hover { opacity: 0.8; }

.header-btns span { font-size: 15px; line-height: 0; position: relative; top: 1px; }

.header-phones, .header-btns { float: right; }

.header-phones { color: #414141; }

.header-btns a { color: #eee; padding: 12px 16px; font-size: 12px; line-height: 14px; letter-spacing: 1.2px; text-transform: uppercase; display: inline-block; }

.color-1 { background-color: #cf98de; color: #eee; }

.color-2 { background-color: #55cbd9; color: #eee; }

.color-3 { background-color: #f48000; color: #eee; }

.grey-bg { background-color: #eee; }

.blue-bg { background-color: #d2f2ff; }

.page-head { position: relative; color: #eee; }

.page-head-wrap { position: absolute; top: 0; display: block; width: 100%; height: 100%; }

.page-head-inner { position: absolute; display: table; height: 100%; width: 100%; }

.page-head-caption { display: table-cell; vertical-align: middle; width: 100%; }

.page-head-caption h1 { font-size: 30px; color: #eee; }

h1.big-title { font-size: 40px !important; }

h1.big-title span { text-transform: uppercase; background-image: -webkit-linear-gradient(left, #003399, #ff9933, #003399); /* For Chrome and Safari */ background-image: -moz-linear-gradient(left, #003399, #ff9933, #003399); /* For old Fx (3.6 to 15) */ background-image: -ms-linear-gradient(left, #003399, #ff9933, #003399); /* For pre-releases of IE 10*/ background-image: -o-linear-gradient(left, #003399, #ff9933, #003399); /* For old Opera (11.1 to 12.0) */ background-image: linear-gradient(to right, #003399, #ff9933, #003399); /* Standard syntax; must be last */ color: transparent; background-size: 200% auto; -webkit-background-clip: text; background-clip: text; }

.ii-0 i { color: #cf98de; }

.ii-1 i { color: #55cbd9; }

.ii-2 i { color: #9ed178; }

.ii-3 i { color: #f6846a; }

.catalog-item img { height: 40px; }

.row-centered { text-align: center; }

.col-centered { display: inline-block; /* reset the text-align */ text-align: left; /* inline-block space fix */ margin-right: -4px; text-align: center; }

.main-page-about h1 { margin-bottom: 10px; }

.catalog-item { text-align: center; border: 2px solid #eee; padding: 25px 10px 10px 10px; border-radius: 6px; margin-bottom: 20px; }

.catalog-item:hover { border: 2px solid #d2f2ff; }

.catalog-item p { height: 60px; margin: 10px 10px 0 10px; }

.popular { margin: 30px 0 0 0; }

.border-bottom { border-bottom: 1px solid #ddd; }

.popular-item { border: 1px solid #ddd; padding-top: 10px; border-radius: 6px; }

.popular-item:hover { border: 1px solid #67b0d6; }

.popular-item img { width: 100%; margin-bottom: 10px; }

.popular-item p.price { font-weight: bold; margin: 5px 0 10px; text-transform: uppercase; }

.popular-item p.title { height: 83px; }

a.cart-btn { color: #eee; background-color: #67b0d6; border-color: #67b0d6; display: block; padding: 6px; }

a.cart-btn:hover { background-color: #9ed178; border-color: #9ed178; }

.parallax-container { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }

.blend-bg { background-blend-mode: multiply; background-color: rgba(0, 0, 0, 0.3); }

.main-page-catalog { margin: 20px 0 50px 0; }

.main-page-about-img img { width: 100%; }

.owl-dots { position: absolute; bottom: 0; width: 100%; }

.nav-menu-social a { font-size: 18px !important; padding: 12px 15px !important; }

p.mockphone { opacity: 0; height: 0px; margin: 0; position: relative; bottom: 30px; }

label.error { background-color: #f48000; color: #fff; }

.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) { width: 100%; }

.btn-default { background-color: #e6e6e6; border-color: #adadad; }

a:focus, a { outline: 0; }

.info-block { margin: 140px 30px; text-align: center; }

.visualtext p { margin-bottom: 15px; color: #414141; }

.catalog-sidebar { margin-bottom: 30px; text-align: center; }

.catalog-sidebar li { margin-bottom: 10px; }

.catalog-sidebar a { border: 2px solid #eee; display: block; padding: 8px; border-radius: 4px; }

.catalog-sidebar a:hover { border: 2px solid #d2f2ff; }

.catalog-sidebar img { width: 90%; }

ul.cat-list { list-style-type: lupper-roman; }

ul.cat-list li { margin-bottom: 10px; padding-left: 10px; }

ul.cat-list li a { text-transform: uppercase; }

.blog-post-item { position: relative; background-position: 50% 0; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }

.height250 { height: 250px; margin-bottom:20px; }

.padding-small { padding: 0 10px; }

/** FOOTER **/
.dark-footer { background-color: #d2f2ff; }

.dark-footer a { color: #f48000; }

.menu-footer ul li { display: inline-block; margin: 3px 10px; }

.dark-footer a:hover { opacity: 0.7; }

.bottom-footer p { margin: 12px 0 6px 0; }

.footer-item { padding: 20px 0; }

.footer-title { color: #414141; text-transform: uppercase; font-weight: bold; margin-bottom: 20px; font-size: 16px; }

/*------------------------------------------------------------------
[15. Media ]
----------------------------------------------*/
/** MEDIA MAX WIDTH 400px **/
@media (max-width: 400px) { .visualtext img { width: 100% !important; } }
/** MEDIA MAX WIDTH 768px **/
/** MEDIA MAX WIDTH 992px **/
/** MEDIA MAX WIDTH 1200px **/