/* * * CUSTOM.CSS * * + TYPOGRAPHY * + HEADLINES * + TEXT PARALLAX * + ALERTS * + LISTS * + BUTTONS * + DIVIDERS * + TEXT BOXES * + IMAGES GALLERY * + IMAGES BOXES * + OVERLAPPING * + LOGOS * + ACCORDION * + TABS * + GOOGLE MAPS * + SOCIAL MEDIA * + PIE CHARTS * + PROGRESS BARS * + COUNTERS * + COUNTDOWN * + PROCESS STEPS * + TIMELINE * + PRICE PLAN * + TESTIMONIALS * + ISOTOPE * + FILTER * + PAGINATION * + FULL SECTIONS * + VIDEO PLAYER * + SCROLL UP * + SLIDERS * + ANIMATIONS * + WIDGETS */ /*********************************************************************************** * + TYPOGRAPHY ***********************************************************************************/ body { font: 14px/24px "Open Sans", Arial, sans-serif; /* [disabled]font-weight: 400; */ background-color: #fff; color: #525252; } h1, h2, h3, h4, h5, h6 { margin: 0; color: #242424; font-family: "Montserrat", Arial, sans-serif; font-weight: 400; } h1 { margin-bottom: 14px; font-size: 36px; line-height: 48px; } h2 { margin-bottom: 12px; font-size: 30px; line-height: 40px; } h3 { margin-bottom: 10px; font-size: 24px; line-height: 34px; } h4 { margin-bottom: 8px; font-size: 18px; line-height: 26px; } h5 { margin-bottom: 6px; font-size: 16px; line-height: 24px; } h6 { margin-bottom: 4px; font-size: 14px; line-height: 22px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #242424; text-decoration: none; -webkit-transition: all 0.3s; transition: all 0.3s; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { text-decoration: none; } p { margin-bottom: 20px; } a { color: #00cee0; } a:hover, a:focus { outline: 0; color: #00cee0; } img { max-width: 100%; } ul, ol { padding: 0; list-style-position: inside; } li > ul, li > ol { margin-bottom: 0; margin-left: 20px; } dl { margin-bottom: 20px; } .last { margin-bottom: 0; } .no-margin-bottom { margin-bottom: 0; } .text-italic { font-family: "Volkhov", Arial, sans-serif; font-style: italic; } .text-default-color { color: #00cee0; } .text-highlight { padding: 5px 15px; background-color: #00cee0; color: #fff; } .dropcap { float: left; font-family: "Montserrat", Arial, sans-serif; font-size: 36px; line-height: 42px; font-weight: 700; margin-right: 10px; } blockquote { padding: 0; border-left: none; font-family: "Volkhov", Arial, sans-serif; font-size: 15px; font-style: italic; } blockquote footer { font-family: "Montserrat", Arial, sans-serif; font-size: 14px; font-weight: 700; font-style: normal; color: inherit; } blockquote footer small { font-family: "Volkhov", Arial, sans-serif; font-size: 14px; font-weight: 400; font-style: italic; } blockquote footer:before, blockquote footer small:before { content: none; } label { font-weight: normal; } input, select, textarea { display: block; max-width: 100%; padding: 8px 15px; border: 2px solid #efefef; margin-bottom: 15px; background-color: #fff; color: #525252; } select { width: 100%; } ::-moz-placeholder { color: #242424; font-family: "Volkhov", Arial, sans-serif; font-style: italic; } ::-webkit-input-placeholder { color: #242424; font-family: "Volkhov", Arial, sans-serif; font-style: italic; } :-ms-input-placeholder { color: #242424; font-family: "Volkhov", Arial, sans-serif; font-style: italic; } textarea:focus, input[type="url"]:focus, input[type="tel"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="week"]:focus, input[type="month"]:focus, input[type="text"]:focus, input[type="color"]:focus, input[type="email"]:focus, input[type="image"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="password"]:focus { border-color: #d3d3d3; box-shadow: none; outline: 0; } input[type="checkbox"]:focus, input[type="radio"]:focus { outline: none; } button, input[type="reset"], input[type="submit"], input[type="button"] { padding: 10px 25px; border: none; background: #00cee0; color: #fff; font-family: "Montserrat", Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; -webkit-transition: all 0.3s; transition: all 0.3s; } button:hover, input[type="reset"]:hover, input[type="submit"]:hover, input[type="button"]:hover { background-color: #e5f0f6; color: #242424; } input[type="reset"]:focus, input[type="submit"]:focus, input[type="button"]:focus { box-shadow: none; outline: 0; } /*********************************************************************************** * + HEADLINES ***********************************************************************************/ /* HEADLINE */ .headline { position: relative; padding-bottom: 10px; margin-bottom: 70px; text-align: center; visibility: visible !important; } .headline:after { position: absolute; top: 100%; left: 50%; display: block; width: 0; height: 0; border-left: 2px solid #00cee0; margin-left: -1px; content: ""; -webkit-transition: all 0.5s; transition: all 0.5s; } .headline p, .headline h2 { margin-bottom: 0; } .headline h2 { font-weight: 700; } .headline p { color: #9f9f9f; font-family: "Volkhov", Arial, sans-serif; font-style: italic; } .headline.headline-animation:after { height: 20px; } .headline.text-left { text-align: left; } .headline.text-left:after { left: 0; margin-left: 0; } /* HEADLINE 2 */ .headline-2 { margin-bottom: 40px; } .headline-2:after { display: block; width: 60px; border-bottom: 2px solid #242424; margin-top: 30px; content: ""; } .headline-2 h1 { margin-bottom: 20px; line-height: 36px; font-weight: 700; letter-spacing: 1px; } .headline-2 p { margin-bottom: 0; font-family: "Volkhov", Arial, sans-serif; font-size: 18px; line-height: 27px; font-style: italic; } .headline-2.text-center:after { margin: 30px auto 0; } /* TITLE */ .title { margin-bottom: 20px; } .title:after { display: block; width: 80px; border-bottom: 2px solid #00cee0; margin-top: 10px; content: ""; } .title > *:last-child { margin-bottom: 0; } .title h4 { font-weight: 700; } .title.text-center:after { margin: 10px auto 0; } /*********************************************************************************** * + TEXT PARALLAX ***********************************************************************************/ .text-parallax { background: repeat top left; } .text-parallax-content { overflow: hidden; background: #fff; color: #240e35; font-size: 72px; line-height: 64px; font-weight: 700; mix-blend-mode: lighten; text-align: center; text-transform: uppercase; } @media (max-width: 767px) { .text-parallax-content { font-size: 48px; line-height: 42px; } } /*********************************************************************************** * + ALERTS ***********************************************************************************/ .alert { padding: 15px 30px; border: none; border-radius: 0; color: #240e35; font-size: 16px; text-align: center; } .alert.alert-info { background-color: #e5f0f6; } .alert.alert-danger { background-color: #ef494f; color: #fff; } .alert.alert-success { background-color: #00cee1; color: #fff; } .alert.alert-warning { background-color: #fddb01; } h1.error { margin: 100px 0 50px; color: #00cee0; font-size: 112px; font-weight: 700; text-align: center; } /*********************************************************************************** * + LISTS ***********************************************************************************/ /* ARROW LIST */ .arrow-list { list-style: none; margin-bottom: 20px; } .arrow-list li { margin-bottom: 5px; } .arrow-list li:last-child { margin-bottom: 0; } .arrow-list li:before { margin-right: 10px; font-family: "FontAwesome"; content: "\f105"; } /* CHECH LIST */ .check-list { list-style: none; margin-bottom: 20px; } .check-list li { padding: 10px 20px; margin-bottom: 5px; -webkit-transition: all 0.3s; transition: all 0.3s; } .check-list li a { color: #525252; -webkit-transition: all 0.3s; transition: all 0.3s; } .check-list li a:hover { text-decoration: none; color: #fff; } .check-list li:last-child { margin-bottom: 0; } .check-list li:before { margin-right: 10px; font-family: "FontAwesome"; content: "\f046"; } .check-list li:hover { background-color: #00cee0; color: #fff; } .check-list li:hover a { color: #fff; } /*********************************************************************************** * + BUTTONS ***********************************************************************************/ /* DEFAULT BUTTON */ .btn { position: relative; z-index: 1; padding: 10px 25px; margin-bottom: 20px; border: none; border-radius: 0; background-color: #00193A; color: #fff; font-family: "Montserrat", Arial, sans-serif; font-size: 10px; letter-spacing: 0.5px; text-transform: uppercase; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .btn + .btn { margin-left: 20px; } .btn:after { position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0; background-color: #e5f0f6; content: ""; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .btn:focus, .btn:active { color: #fff; outline: 0 !important; box-shadow: none; } .btn, .btn:focus, .btn:active, .btn:active:hover { background-color: #00193A; } .btn:hover:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .btn:hover { background-color: #e5f0f6; color: #242424; } .btn-xs { padding: 8px 15px; font-size: 8px; } .btn-sm { padding: 12px 30px; font-size: 12px; } .btn-lg { padding: 14px 35px; font-size: 14px; } .btn i { margin-right: 5px; margin-left: -5px; } /* BLACK BUTTON */ .btn.btn-black { background-color: #1c2239; } /* BUTTON LINK */ .btn-link { position: relative; display: inline-block; color: #242424; font-family: "Montserrat", Arial, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.2px; text-transform: uppercase; -webkit-transition: all 0.3s; transition: all 0.3s; } .btn-link:after { display: block; border-bottom: 2px solid #00cee0; content: ""; } .btn-link:before { position: absolute; bottom: 0; left: 0; display: block; width: 0; border-bottom: 2px solid #242424; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .btn-link:hover, .btn-link:focus { color: #242424; text-decoration: none; } .btn-link:hover:before { width: 100%; } /*********************************************************************************** * + DIVIDERS ***********************************************************************************/ .hr { border-top: 1px solid #e5f0f6; margin: 30px 0; } .hr.default-color { border-top-color: #00cee0; } .hr.dashed { border-top-style: dashed; } /*********************************************************************************** * + TEXT BOXES ***********************************************************************************/ .text-box { margin-bottom: 40px; padding: 60px 40px; background-color: #525252; color: #fff; } .text-box.rounded { border-radius: 20px; } .text-box > *:last-child { margin-bottom: 0; } .text-box.default { background-color: #00cee0; } .text-box.default .title h4 { color: inherit; } .text-box.default .title:after { border-color: inherit; } .text-box.default .btn { background-color: #fff; color: #00cee0; } @media (min-width: 1200px) { .text-box { padding: 120px 80px; } } @media (min-width: 768px) and (max-width: 991px) { .text-box { padding: 30px 20px; } } /*********************************************************************************** * + IMAGES GALLERY ***********************************************************************************/ .images-gallery { margin: -3px -3px 20px; list-style: none; } .images-gallery li { float: left; width: 50%; padding: 3px; } .images-gallery:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /*********************************************************************************** * + IMAGES BOXES ***********************************************************************************/ .image-box { margin-bottom: 50px; } .image-box > img { display: block; margin-bottom: 40px; } .image-box .btn { margin-top: 20px; } /*********************************************************************************** * + OVERLAPPING ***********************************************************************************/ .overlap-img { position: relative; z-index: -1; margin-top: -70px; } .overlap-section {} .overlap-section ul { list-style: none; } .overlap-section ul li { position: relative; top: 0; display: inline-block; vertical-align: top; } .overlap-section ul li + li { margin-left: -150px; vertical-align: bottom; } .overlap-section ul li .image-box { margin-bottom: 0; } @media (min-width: 1200px) { .overlap-section ul li + li { margin-left: -100px; } } @media (min-width: 768px) and (max-width: 991px) { .overlap-img { margin-top: 0; } .overlap-section ul li + li { margin-left: -250px; } } @media (max-width: 767px) { .overlap-img { margin-top: 0; } .overlap-section ul li { display: block; width: auto; margin-bottom: 50px; } .overlap-section ul li + li { margin-left: 0; } .overlap-section ul li:last-child { margin-bottom: 0; } } /*********************************************************************************** * + LOGOS ***********************************************************************************/ .logos-list { border-top: 1px dashed #d3d3d3; border-bottom: 1px dashed #d3d3d3; margin: 70px 0; list-style: none; } .logos-list + .logos-list { border-top: none; margin-top: -70px; } .logos-list li { position: relative; float: left; width: 20%; padding: 50px 0; text-align: center; -webkit-transition: all 0.3s; transition: all 0.3s; } .logos-list li:after { position: absolute; top: -40px; right: 0; bottom: -40px; border-right: 1px dashed #d3d3d3; content: ""; } .logos-list li:last-child:after { border-right: none; } .logos-list li:hover { background-color: #f5f8fa; } .logos-list:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } @media (min-width: 768px) and (max-width: 991px) { .logos-list li img { max-width: 75%; } } @media (max-width: 767px) { .logos-list { border-right: 1px dashed #d3d3d3; border-left: 1px dashed #d3d3d3; } .logos-list li { float: none; width: 100%; border-bottom: 1px dashed #d3d3d3; } .logos-list li:last-child { border-bottom: none; } .logos-list li:after { display: none; } } /*********************************************************************************** * + ACCORDION ***********************************************************************************/ .panel { background-color: transparent; box-shadow: none; } .panel-heading { padding: 0; border: none; border-radius: 0; margin-bottom: 15px; background-color: transparent; } .panel-title a, .panel-title a:focus { position: relative; display: block; padding: 15px 50px 12px 20px; border-bottom: 2px solid #f5f8fa; color: #242424; text-decoration: none; } .panel-title a:before { position: absolute; right: 0; bottom: 0; width: 42px; height: 42px; font-family: "Open Sans", Arial, sans-serif; background-color: #f5f8fa; color: #242424; font-size: 18px; line-height: 42px; font-weight: 400; text-align: center; content: "+"; -webkit-transition: all 0.3s; transition: all 0.3s; } .panel-title a:hover, .panel-title a[aria-expanded="true"] { border-bottom-color: #00cee0; color: #00cee0; } .panel-title a[aria-expanded="true"]:before { background-color: #00cee0; color: #fff; content: "-"; } .panel-title a:hover:before { background-color: #00cee0; color: #fff; } .panel-group .panel + .panel { margin-top: 0; } .panel-group .panel-heading + .panel-collapse > .list-group, .panel-group .panel-heading + .panel-collapse > .panel-body { padding: 15px 40px 15px 20px; border-top: 2px solid #00cee0; border: none; } .panel-body > *:last-child { margin-bottom: 0; } /*********************************************************************************** * + TABS ***********************************************************************************/ .tabs { margin-bottom: 50px; } .nav-tabs { border-bottom: none; } .nav-tabs > li > a { padding: 12px 25px; border: none; border-radius: 0; background-color: #f5f8fa; color: #242424; font: 14px "Montserrat", Arial, sans-serif; letter-spacing: 0.25px; -webkit-transition: all 0.3s; transition: all 0.3s; } .nav-tabs > li > a:hover, .nav-tabs > li > a:focus { border: none; background-color: transparent; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { border: none; color: #242424; } .tab-content { margin: 45px 0; } .tab-content .tab-pane > *:last-child { margin-bottom: 0; } .tab-content:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /* TABS STYLE 1 */ .tabs.style-1 .nav-tabs > li > a { border-top: 2px solid #f5f8fa; } .tabs.style-1 .nav-tabs > li > a:hover, .tabs.style-1 .nav-tabs > li > a:focus { border-top: 2px solid #f5f8fa; } .tabs.style-1 .nav-tabs > li.active > a, .tabs.style-1 .nav-tabs > li.active > a:hover, .tabs.style-1 .nav-tabs > li.active > a:focus { border-top: 2px solid #00cee0; } /* TABS STYLE 2 */ .tabs.style-2 .nav-tabs { margin-bottom: 60px; } .tabs.style-2 .nav-tabs > li { margin-top: 1px; margin-bottom: 1px; } .tabs.style-2 .nav-tabs > li > a:focus { background-color: #f5f8fa; } .tabs.style-2 .nav-tabs > li > a:hover, .tabs.style-2 .nav-tabs > li.active > a, .tabs.style-2 .nav-tabs > li.active > a:hover, .tabs.style-2 .nav-tabs > li.active > a:focus { background-color: #00cee0; color: #fff; } /* TABS STYLE 3 */ .tabs.style-3 .nav-tabs { border-bottom: 1px solid #d3d3d3; margin-bottom: 80px; text-align: center; } .tabs.style-3 .nav-tabs > li { float: none; display: inline-block; } .tabs.style-3 .nav-tabs > li > a { position: relative; padding: 0; padding-bottom: 15px; margin: 0 25px; background-color: transparent; color: #d3d3d3; font-weight: 700; text-transform: uppercase; } .tabs.style-3 .nav-tabs > li > a:after { position: absolute; bottom: 0; left: 0; display: block; width: 0; border-bottom: 2px solid #00cee0; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .tabs.style-3 .nav-tabs > li > a > i { display: block; margin-bottom: 15px; font-size: 32px; line-height: 32px; } .tabs.style-3 .nav-tabs > li > a:hover, .tabs.style-3 .nav-tabs > li.active > a { color: #242424; } .tabs.style-3 .nav-tabs > li.active > a:after { width: 100%; } /* TABS STYLE 4 */ .tabs.style-4 .nav-tabs { margin-top: 50px; margin-bottom: 120px; } .tabs.style-4 .nav-tabs > li { width: 16.6666667%; } .tabs.style-4 .nav-tabs > li > a { position: relative; background-color: transparent; font-size: 24px; font-weight: 700; vertical-align: top; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .tabs.style-4 .nav-tabs > li > a:hover, .tabs.style-4 .nav-tabs > li.active > a, .tabs.style-4 .nav-tabs > li.active > a:hover, .tabs.style-4 .nav-tabs > li.active > a:focus { color: #00cee0; } .tabs.style-4 .nav-tabs > li > a:after { display: block; width: 100%; border-bottom: 2px solid #d3d3d3; margin-top: 5px; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .tabs.style-4 .nav-tabs > li > a:hover:after, .tabs.style-4 .nav-tabs > li.active > a:after { border-bottom-color: #00cee0; } .tabs.style-4 .nav-tabs > li.active > a:after { width: 150%; } .tabs.style-4 .tab-content { text-align: center; } @media (min-width: 768px) and (max-width: 991px) { .tabs.style-3 .nav-tabs > li > a { margin: 0 15px; } } @media (max-width: 767px) { .nav-tabs > li { float: none; display: block; } .tabs.style-3 .nav-tabs > li { width: 100%; margin-bottom: 30px; } .tabs.style-3 .nav-tabs > li a:after { display: none; } .tabs.style-4 .nav-tabs { margin-bottom: 50px; } .tabs.style-4 .nav-tabs > li { width: 100%; } .tabs.style-4 .nav-tabs > li > a { padding: 10px 0; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } .tabs.style-4 .nav-tabs > li.active > a:after { width: 100%; } } /*********************************************************************************** * + GOOGLE MAPS ***********************************************************************************/ .map { height: 660px; margin-bottom: 100px; } .map img { max-width: none; } @media (max-width: 767px) { .map { height: 400px !important; } } /*********************************************************************************** * + SOCIAL MEDIA ***********************************************************************************/ .social-media { margin-bottom: 20px; } .social-media a { display: inline-block; width: 32px; height: 32px; border: 2px solid #242424; border-radius: 50%; border-radius: 50%; margin: 5px 10px 5px 0; color: #242424; font-size: 14px; line-height: 28px; text-align: center; text-decoration: none; -webkit-transition: all 0.3s; transition: all 0.3s; } .social-media a:last-child { margin-right: 0; } .social-media a:hover { color: #fff; } .social-media a.facebook:hover { background-color: #0e59a0 !important; border-color: #0e59a0 !important; } .social-media a.twitter:hover { background-color: #0ea4ff !important; border-color: #0ea4ff !important; } .social-media a.dribbble:hover { background-color: #ea73a0 !important; border-color: #ea73a0 !important; } .social-media a.pinterest:hover { background-color: #d73532 !important; border-color: #d73532 !important; } .social-media a.google:hover { background-color: #da4835 !important; border-color: #da4835 !important; } .social-media a.tumblr:hover { background-color: #2a445f !important; border-color: #2a445f !important; } .social-media a.instagram:hover { background-color: #82685a !important; border-color: #82685a !important; } .social-media a.rss:hover { background-color: #f79638 !important; border-color: #f79638 !important; } .social-media a.linkedin:hover { background-color: #018faf !important; border-color: #018faf !important; } .social-media a.skype:hover { background-color: #00b0f6 !important; border-color: #00b0f6 !important; } .social-media a.flickr:hover { background-color: #0061db !important; border-color: #0061db !important; } .social-media a.vimeo:hover { background-color: #4cb2d9 !important; border-color: #4cb2d9 !important; } .social-media a.github:hover { background-color: #3b3b3b !important; border-color: #3b3b3b !important; } .social-media a.youtube:hover { background-color: #cc181e !important; border-color: #cc181e !important; } .social-media a.windows:hover { background-color: #6dc2e9 !important; border-color: #6dc2e9 !important; } .social-media a.dropbox:hover { background-color: #007ee5 !important; border-color: #007ee5 !important; } .social-media a.xing:hover { background-color: #026566 !important; border-color: #026566 !important; } .social-media a.adn:hover { background-color: #1ea076 !important; border-color: #1ea076 !important; } .social-media a.android:hover { background-color: #98cb02 !important; border-color: #98cb02 !important; } .social-media a.apple:hover { background-color: #a6b1b7 !important; border-color: #a6b1b7 !important; } .social-media a.behance:hover { background-color: #2d9ad2 !important; border-color: #2d9ad2 !important; } .social-media a.bitbucket:hover { background-color: #214f81 !important; border-color: #214f81 !important; } .social-media a.bitcoin:hover { background-color: #f7931b !important; border-color: #f7931b !important; } .social-media a.codepan:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.css3:hover { background-color: #3289ce !important; border-color: #3289ce !important; } .social-media a.delicious:hover { background-color: #3399fe !important; border-color: #3399fe !important; } .social-media a.deviantart:hover { background-color: #c8da30 !important; border-color: #c8da30 !important; } .social-media a.digg:hover { background-color: #0080c2 !important; border-color: #0080c2 !important; } .social-media a.drupal:hover { background-color: #0077b9 !important; border-color: #0077b9 !important; } .social-media a.empire:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.foursquare:hover { background-color: #daecb0 !important; border-color: #daecb0 !important; } .social-media a.git:hover { background-color: #f34f29 !important; border-color: #f34f29 !important; } .social-media a.gitti:hover { background-color: #634c3e !important; border-color: #634c3e !important; } .social-media a.hacker-news:hover { background-color: #f18642 !important; border-color: #f18642 !important; } .social-media a.html5:hover { background-color: #e54c1f !important; border-color: #e54c1f !important; } .social-media a.joomla:hover { background-color: #016fb9 !important; border-color: #016fb9 !important; } .social-media a.jsfiddle:hover { background-color: #4679a4 !important; border-color: #4679a4 !important; } .social-media a.linux:hover { background-color: #fece0e !important; border-color: #fece0e !important; } .social-media a.maxcdn:hover { background-color: #f36f20 !important; border-color: #f36f20 !important; } .social-media a.openid:hover { background-color: #fe6101 !important; border-color: #fe6101 !important; } .social-media a.pagelines:hover { background-color: #3783e3 !important; border-color: #3783e3 !important; } .social-media a.pied-piper:hover { background-color: #0c7b48 !important; border-color: #0c7b48 !important; } .social-media a.qq:hover { background-color: #23286c !important; border-color: #23286c !important; } .social-media a.rebel:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.reddit:hover { background-color: #cee3f8 !important; border-color: #cee3f8 !important; } .social-media a.renren:hover { background-color: #0d81e4 !important; border-color: #0d81e4 !important; } .social-media a.share:hover { background-color: #252525 !important; border-color: #252525 !important; } .social-media a.slack:hover { background-color: #453744 !important; border-color: #453744 !important; } .social-media a.soundcloud:hover { background-color: #fe4e00 !important; border-color: #fe4e00 !important; } .social-media a.spotify:hover { background-color: #80bb41 !important; border-color: #80bb41 !important; } .social-media a.stack-exchange:hover { background-color: #265a93 !important; border-color: #265a93 !important; } .social-media a.stackoverflow:hover { background-color: #fea501 !important; border-color: #fea501 !important; } .social-media a.steam:hover { background-color: #191919 !important; border-color: #191919 !important; } .social-media a.stumbleupon:hover { background-color: #f04f23 !important; border-color: #f04f23 !important; } .social-media a.tencent-weibo:hover { background-color: #0063a7 !important; border-color: #0063a7 !important; } .social-media a.trello:hover { background-color: #226784 !important; border-color: #226784 !important; } .social-media a.vine:hover { background-color: #00b081 !important; border-color: #00b081 !important; } .social-media a.vk:hover { background-color: #50769d !important; border-color: #50769d !important; } .social-media a.wechat:hover { background-color: #a4dc31 !important; border-color: #a4dc31 !important; } .social-media a.weibo:hover { background-color: #d82828 !important; border-color: #d82828 !important; } .social-media a.wordpress:hover { background-color: #454442 !important; border-color: #454442 !important; } .social-media a.yahoo:hover { background-color: #4b04a8 !important; border-color: #4b04a8 !important; } .social-media a.ftpx:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.amazon:hover { background-color: #ff9900 !important; border-color: #ff9900 !important; } .social-media a.angellist:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.btc:hover { background-color: #f7931b !important; border-color: #f7931b !important; } .social-media a.black-tie:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.bluetooth:hover { background-color: #0a3d91 !important; border-color: #0a3d91 !important; } .social-media a.buysellads:hover { background-color: #ba0202 !important; border-color: #ba0202 !important; } .social-media a.cc-amex:hover { background-color: #016dd2 !important; border-color: #016dd2 !important; } .social-media a.cc-diners-club:hover { background-color: #0069aa !important; border-color: #0069aa !important; } .social-media a.cc-discover:hover { background-color: #f88737 !important; border-color: #f88737 !important; } .social-media a.cc-jcb:hover { background-color: #29166f !important; border-color: #29166f !important; } .social-media a.cc-mastercard:hover { background-color: #fe9611 !important; border-color: #fe9611 !important; } .social-media a.paypal:hover { background-color: #012069 !important; border-color: #012069 !important; } .social-media a.cc-stripe:hover { background-color: #49b802 !important; border-color: #49b802 !important; } .social-media a.cc-visa:hover { background-color: #1b4da2 !important; border-color: #1b4da2 !important; } .social-media a.chrome:hover { background-color: #edcd16 !important; border-color: #edcd16 !important; } .social-media a.codepen:hover { background-color: #1b1c1b !important; border-color: #1b1c1b !important; } .social-media a.codiepie:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.connectdevelop:hover { background-color: #023cb0 !important; border-color: #023cb0 !important; } .social-media a.contao:hover { background-color: #e4790f !important; border-color: #e4790f !important; } .social-media a.dashcube:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.edge:hover { background-color: #2c74be !important; border-color: #2c74be !important; } .social-media a.expeditedssl:hover { background-color: #2e2e2e !important; border-color: #2e2e2e !important; } .social-media a.firefox:hover { background-color: #df731b !important; border-color: #df731b !important; } .social-media a.fonticons:hover { background-color: #1d1e2a !important; border-color: #1d1e2a !important; } .social-media a.fort-awesome:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.forumbee:hover { background-color: #85ac2f !important; border-color: #85ac2f !important; } .social-media a.get-pocket:hover { background-color: #e84352 !important; border-color: #e84352 !important; } .social-media a.gg:hover { background-color: #fd0002 !important; border-color: #fd0002 !important; } .social-media a.gratipay:hover { background-color: #653614 !important; border-color: #653614 !important; } .social-media a.houzz:hover { background-color: #9bc545 !important; border-color: #9bc545 !important; } .social-media a.internet-explorer:hover { background-color: #00bcf2 !important; border-color: #00bcf2 !important; } .social-media a.ioxhost:hover { background-color: #f6a814 !important; border-color: #f6a814 !important; } .social-media a.lastfm:hover { background-color: #e2152b !important; border-color: #e2152b !important; } .social-media a.leanpub:hover { background-color: #231f20 !important; border-color: #231f20 !important; } .social-media a.meanpath:hover { background-color: #538dd6 !important; border-color: #538dd6 !important; } .social-media a.medium:hover { background-color: #00ab6c !important; border-color: #00ab6c !important; } .social-media a.mixcloud:hover { background-color: #040204 !important; border-color: #040204 !important; } .social-media a.modx:hover { background-color: #8ed547 !important; border-color: #8ed547 !important; } .social-media a.odnoklassniki:hover { background-color: #f68634 !important; border-color: #f68634 !important; } .social-media a.opencart:hover { background-color: #00c1f2 !important; border-color: #00c1f2 !important; } .social-media a.opera:hover { background-color: #e81617 !important; border-color: #e81617 !important; } .social-media a.optin-monster:hover { background-color: #8ed31e !important; border-color: #8ed31e !important; } .social-media a.product-hunt:hover { background-color: #d6573d !important; border-color: #d6573d !important; } .social-media a.reddit:hover { background-color: #ff4500 !important; border-color: #ff4500 !important; } .social-media a.safari:hover { background-color: #2973d9 !important; border-color: #2973d9 !important; } .social-media a.scribd:hover { background-color: #382d29 !important; border-color: #382d29 !important; } .social-media a.sellsy:hover { background-color: #006ca2 !important; border-color: #006ca2 !important; } .social-media a.shirtsinbulk:hover { background-color: #dd3a26 !important; border-color: #dd3a26 !important; } .social-media a.simplybuilt:hover { background-color: #322f34 !important; border-color: #322f34 !important; } .social-media a.skyatlas:hover { background-color: #01aebe !important; border-color: #01aebe !important; } .social-media a.slideshare:hover { background-color: #13999a !important; border-color: #13999a !important; } .social-media a.stack-overflow:hover { background-color: #ef532a !important; border-color: #ef532a !important; } .social-media a.tripadvisor:hover { background-color: #1e892f !important; border-color: #1e892f !important; } .social-media a.twitch:hover { background-color: #6441a5 !important; border-color: #6441a5 !important; } .social-media a.usb:hover { background-color: #000 !important; border-color: #000 !important; } .social-media a.viacoin:hover { background-color: #2376a2 !important; border-color: #2376a2 !important; } .social-media a.whatsapp:hover { background-color: #44c254 !important; border-color: #44c254 !important; } .social-media a.wikipedia:hover { background-color: #0c0c0c !important; border-color: #0c0c0c !important; } .social-media a.y-combinator:hover { background-color: #ff6501 !important; border-color: #ff6501 !important; } .social-media a.yelp:hover { background-color: #bf311b !important; border-color: #bf311b !important; } .social-media a.email:hover { background-color: #689c49 !important; border-color: #689c49 !important; } .social-media.default-color a:hover { background-color: #00cee0 !important; border-color: #00cee0 !important; } /*********************************************************************************** * + PIE CHARTS ***********************************************************************************/ .pie-chart-container { margin-bottom: 50px; text-align: center; } .pie-chart { position: relative; margin-bottom: 15px; } .pie-chart canvas { max-width: 100%; } .pie-chart-percent { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .pie-chart-details {} .pie-chart-details h6 { margin-bottom: 0; font-weight: 700; } .pie-chart-details p { color: #9f9f9f; font-family: "Volkhov", Arial, sans-serif; font-style: italic; } /*********************************************************************************** * + PROGRESS BARS ***********************************************************************************/ .progress { overflow: visible; height: 4px; border-radius: 0; margin-bottom: 20px; background-color: #efefef; box-shadow: none; } .progress-bar { position: relative; background-color: #00cee0; box-shadow: none; } .progress-bar span { position: absolute; top: -27px; right: 0; color: #242424; font: 14px "Montserrat", Arial, sans-serif; font-weight: 700; } .progress-bar-title { margin-bottom: 5px; color: #242424; font-family: "Montserrat", Arial, sans-serif; font-weight: 700; text-transform: uppercase; } /*********************************************************************************** * + COUNTERS ***********************************************************************************/ .counter { margin-bottom: 50px; text-align: center; } .counter-value { font: 60px/60px "Montserrat", Arial, sans-serif; letter-spacing: 0.5px; font-weight: 700; } .counter-value:after { display: block; width: 40px; border-bottom: 4px solid #00cee0; margin: 10px auto 15px; content: ""; } .counter-details { font: 18px "Montserrat", Arial, sans-serif; font-weight: 700; letter-spacing: 0.25px; } @media (min-width: 768px) and (max-width: 991px) { .counter-value { font-size: 48px; line-height: 48px; } } /*********************************************************************************** * + COUNTDOWN ***********************************************************************************/ .countdown { margin: 50px 0 100px; color: #242424; } .countdown > div { position: relative; float: left; width: 25%; font-family: "Montserrat", Arial, sans-serif; text-align: center; } .countdown .counter { width: 110px; height: 110px; margin: 0 auto 40px; border: 3px solid #00cee0; border-radius: 50%; font-size: 24px; line-height: 110px; } .countdown > div > span { display: block; font-size: 14px; font-weight: 700; } .countdown:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } @media (max-width: 767px) { .countdown > div { width: 100%; margin-bottom: 50px; } .countdown > div:last-child { margin-bottom: 0; } .countdown .counter { margin-bottom: 20px; } } /*********************************************************************************** * + PROCESS STEPS ***********************************************************************************/ .process-steps { margin: 50px 0; } .process-steps .step { position: relative; padding-bottom: 25px; padding-left: 40px; } .process-steps .step:before { position: absolute; top: 8px; left: 0; display: inline-block; border: 4px solid #242424; border-radius: 50%; content: ""; } .process-steps .step:after { position: absolute; top: 8px; left: 3px; height: 100%; border-left: 2px solid #242424; content: ""; } .process-steps.step:last-child { padding-bottom: 0; } .process-steps .step:last-child:after { display: none; } .process-steps .step > a { position: relative; display: inline-block; color: #242424; font: 16px "Montserrat", Arial, sans-serif; text-decoration: none; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition: all 0.3s; transition: all 0.3s; } .process-steps .step > a:hover, .process-steps .step > a.opened { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .process-steps .step > a:before { position: absolute; top: 2px; left: -37px; display: block; border: 7px solid rgba(0, 0, 0, 0.5); border-radius: 50%; content: ""; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .process-steps .step > a.opened:before { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .process-steps .step-details { display: none; margin-top: 20px; } .process-steps .step-details > *:last-child { margin-bottom: 0; } /*********************************************************************************** * + TIMELINE ***********************************************************************************/ .timeline { margin-bottom: 50px; list-style: none; } .timeline > li { position: relative; padding-bottom: 50px; } .timeline > li:before { position: absolute; top: 130px; bottom: 0; left: 50%; border-left: 2px solid #efefef; margin-left: -1px; content: ""; } .timeline > li:last-child:before { display: none; } .timeline h4 { margin-bottom: 20px; font-weight: 700; } .timeline .awards { color: #9f9f9f; font-family: "Volkhov", Arial, sans-serif; font-style: italic; list-style: none; -webkit-transition: color 0.3s; transition: color 0.3s; } .timeline .awards li { margin-bottom: 5px; } .timeline .awards li:last-child { margin-bottom: 0; } .timeline .period { position: relative; z-index: 1; width: 84px; height: 84px; padding: 10px; border: 9px solid #f5f8fa; border-radius: 50%; margin: 25px auto 0; font-family: "Volkhov", Arial, sans-serif; font-style: italic; text-align: center; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .timeline .period:after { position: absolute; z-index: -1; top: 50%; left: 50%; width: 68px; height: 68px; border-radius: 50%; margin: -34px 0 0 -34px; background-color: #00cee0; content: ""; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .timeline > li:hover .awards { color: #242424; } .timeline > li:hover .period { padding: 17px; border-width: 2px; color: #fff; -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .timeline > li:hover .period:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } @media (max-width: 767px) { .timeline > li:before { display: none; } .timeline > li .period { margin-bottom: 20px; } .timeline li .text-right { text-align: left; } } /*********************************************************************************** * + PRICE PLAN ***********************************************************************************/ .price-plan-list { position: relative; z-index: 1; border-top: 3px solid #00cee0; margin-bottom: 50px; list-style: none; } .price-plan-list > li { float: left; width: 25%; background-color: #fff; color: #525252; text-align: center; } .price-plan-list > li .price-plan { border: none; } .price-plan-list > li:nth-child(even) { background-color: #e5f0f6; } .price-plan-list > li:nth-child(even) .btn:after { background-color: #f5f8fa; } .price-plan-list.items-3 > li { width: 33.333333%; } .price-plan-list.items-4 > li { width: 25%; } .price-plan { padding: 0 20px 50px; border: 1px solid #efefef; text-align: center; } .price-plan-header { position: relative; z-index: 1; padding: 30px 0 70px; margin: 0 -20px; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .price-plan-header:before { position: absolute; z-index: -1; top: 0; right: 0; left: 0; height: 0; background-color: #00cee0; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .price-plan-header:after { position: absolute; bottom: 40px; left: 50%; height: 25px; border-left: 2px solid #00cee0; margin-left: -1px; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .price-plan-header h3 { margin-bottom: 15px; font-weight: 700; -webkit-transition: all 0.3s; transition: all 0.3s; } .price-plan-header h1 { color: #00cee0; font-weight: 700; -webkit-transition: all 0.3s; transition: all 0.3s; } .price-plan-header h1 small { color: #9f9f9f; font-family: "Volkhov", Arial, sans-serif; font-size: 18px; font-style: italic; -webkit-transition: all 0.3s; transition: all 0.3s; } .price-plan > ul { margin-bottom: 70px; list-style: none; } .price-plan > ul li { margin-bottom: 10px; } .price-plan > ul li:last-child { margin-bottom: 0; } .price-plan:hover .price-plan-header:before { height: 75%; } .price-plan:hover .price-plan-header h1, .price-plan:hover .price-plan-header h3, .price-plan:hover .price-plan-header h1 small { color: #fff; } .price-plan:hover .price-plan-header:after { height: 0; } .price-plan-list:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } @media (min-width: 768px) and (max-width: 991px) { .price-plan-header h1 { font-size: 28px; } .price-plan-header h1 small { font-size: 14px; } } @media (max-width: 767px) { .price-plan-list > li { float: none; width: 100%; margin-bottom: 50px; } .price-plan-list > li:last-child { margin-bottom: 0; } .price-plan-list.items-3 > li, .price-plan-list.items-4 > li { width: 100%; } } /*********************************************************************************** * + TESTIMONIALS ***********************************************************************************/ .testimonial { margin-bottom: 30px; margin-top: 80px; text-align: center; } .testimonial > img { display: inline-block; border-radius: 50%; margin-bottom: 50px; } .testimonial blockquote { padding: 0; border: none; margin-bottom: 40px; } .testimonial > h4 { font-weight: 700; margin-bottom: 0; } .testimonial > p { font-family: "Volkhov", Arial, sans-serif; font-style: italic; margin-bottom: 0; } /*********************************************************************************** * + ISOTOPE ***********************************************************************************/ .isotope { margin-bottom: 100px; } .isotope.gutter { margin: -15px -15px 100px; } .isotope .isotope-item { float: left; width: 25%; } .isotope.gutter .isotope-item { padding: 15px; } .isotope.col-2 .isotope-item { width: 50%; } .isotope.col-3 .isotope-item { width: 33.3333333%; } .isotope.col-4 .isotope-item { width: 33.3333333%; } .isotope .item-width-1 { width: 50%; } .isotope .item-width-2 { width: 100%; } .isotope .portfolio-item { margin-bottom: 0; } @media (min-width: 1200px) { .isotope.col-4 .isotope-item { width: 25%; } } @media (min-width: 768px) and (max-width: 991px) { .isotope.col-3 .isotope-item, .isotope.col-4 .isotope-item { width: 50%; } } @media (max-width: 767px) { .isotope .isotope-item { float: none; width: 100%; } .isotope.col-2 .isotope-item, .isotope.col-3 .isotope-item, .isotope.col-4 .isotope-item { width: 100%; } } /*********************************************************************************** * + FILTER ***********************************************************************************/ .filter { margin-bottom: 50px; list-style: none; } .filter li { display: inline-block; margin-right: 40px; } .filter li:last-child { margin-right: 0; } .filter li a { display: inline-block; color: #242424; font-family: "Montserrat", Arial, sans-serif; font-size: 12px; line-height: 20px; font-weight: 700; letter-spacing: 0.5px; text-decoration: none; text-transform: uppercase; -webkit-transition: all 0.3s; transition: all 0.3s; } .filter li a:after { display: block; width: 0; border-bottom: 2px solid #00cee0; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .filter li a:hover:after, .filter li a.active:after { width: 100%; } @media (max-width: 767px) { .filter li { display: block; margin-bottom: 10px; } .filter li:last-child { margin-bottom: 0; } } /*********************************************************************************** * + PAGINATION ***********************************************************************************/ .pagination { display: block; margin-top: 0; margin-bottom: 50px; } .pagination li { display: inline-block; margin-right: 7px; } .pagination li:last-child { margin-right: 0; } .pagination li a { display: block; width: 28px; height: 28px; padding: 0; border: none; background-color: transparent; color: #9f9f9f; font-family: "Montserrat", Arial, sans-serif; line-height: 28px; text-align: center; -webkit-transition: all 0.3s; transition: all 0.3s; } .pagination li.prev a, .pagination li.next a { background-color: #f5f8fa; color: #242424; } .pagination > li:last-child > a, .pagination > li:first-child > a, .pagination > li:last-child > span, .pagination > li:first-child > span { border-radius: 0; } .pagination li a:hover, .pagination li.active a, .pagination li.active a:hover { background-color: #00cee0; color: #fff; } /*********************************************************************************** * + FULL SECTIONS ***********************************************************************************/ .full-section { position: relative; overflow: hidden; z-index: 1; padding: 50px 0; margin-bottom: 100px; background: no-repeat center center; } .full-section-overlay-color { position: absolute; z-index: 2; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; opacity: 0.75; } .full-section-container { position: relative; z-index: 4; } .full-screen { margin-bottom: -50px; } .full-screen .full-section-container { position: absolute; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .parallax { background-attachment: fixed !important; -webkit-background-size: cover !important; background-size: cover !important; } .multilayer-parallax { position: absolute; z-index: 3; top: 0; left: 0; width: 100%; height: 100%; } .multilayer-parallax .parallax-layer { position: absolute; top: 0; left: 0; } .full-section.dark-section { background-color: #1c2239; color: #fff; } .full-section.dark-section a, .full-section.dark-section h1, .full-section.dark-section h2, .full-section.dark-section h3, .full-section.dark-section h4, .full-section.dark-section h5, .full-section.dark-section h6 { color: inherit; } .full-section.dark-section a:hover { color: #00cee0; } .full-section.dark-section .check-list li a:hover { color: #fff; } .full-section.dark-section .headline-2:after { border-color: inherit; } .full-section.dark-section .btn-link:before { border-bottom-color: #fff; } .full-section.dark-section .btn-link:hover, .full-section.dark-section .btn-link:focus { color: inherit; } .full-section.dark-section .image-box.bordered:after { border-color: inherit; } .full-section.dark-section .nav-tabs > li > a { color: #242424; } .full-section.dark-section .nav-tabs > li > a:hover, .full-section.dark-section .tabs.style-3 .nav-tabs > li > a:hover, .full-section.dark-section .tabs.style-3 .nav-tabs > li.active > a, .full-section.dark-section .tabs.style-4 .nav-tabs > li > a:hover, .full-section.dark-section .tabs.style-4 .nav-tabs > li.active > a { color: #00cee0; } .full-section.dark-section .tabs.style-2 .nav-tabs > li > a:hover { color: #fff; } .full-section.dark-section .tabs.style-3 .nav-tabs > li > a, .full-section.dark-section .tabs.style-4 .nav-tabs > li > a { color: inherit; } .full-section.dark-section .social-media a { border-color: inherit; } .full-section.dark-section .social-media a:hover { color: #fff; } .full-section.dark-section .progress-bar span, .full-section.dark-section .progress-bar-title { color: inherit; } .full-section.dark-section .counter-value:after { border-color: inherit; } .full-section.dark-section .countdown { color: inherit; } .full-section.dark-section .process-steps .step:before, .full-section.dark-section .process-steps .step:after { border-color: inherit; } .full-section.dark-section .process-steps .step > a.opened:before { border-color: rgba(255, 255, 255, 0.5); } .full-section.dark-section .process-steps .step a:hover { color: inherit; } .full-section.dark-section .timeline > li:hover .awards { color: inherit; } .full-section.dark-section .price-plan-header h1 { color: #00cee0; } .full-section.dark-section .price-plan:hover .price-plan-header h1 { color: #fff; } .full-section.dark-section .price-plan .btn { color: #fff; } .full-section.dark-section .price-plan .btn:hover { color: #00cee0; } .full-section.dark-section .pagination li a:hover { color: #fff; } .full-section.dark-section .about-me:hover, .full-section.dark-section .about-me:hover .about-me-details p, .full-section.dark-section .about-me:hover .about-me-details h4 { color: inherit; } .full-section.dark-section .about-me:hover .social-links { border-top-color: inherit; } .full-section.dark-section .service-box.style-1:hover { color: #242424; } .full-section.dark-section .service-box.style-1.dark:hover { color: #fff; } .full-section.dark-section .service-box.style-2 a:hover { color: inherit; } .full-section.dark-section .service-box.style-5 a:hover { color: inherit; } .full-section.dark-section .portfolio-item-hover a:hover { color: #242424; } .full-section.dark-section .portfolio-item:hover .portfolio-item-thumbnail + .portfolio-item-description { border: none; background-color: #fff; color: #242424; } .full-section.dark-section .widget-recent-posts ul li .post-title, .full-section.dark-section .widget-recent-posts ul li .post-date a { color: inherit; } .full-section.dark-section .widget-recent-posts ul li .post-title:hover { color: #00cee0; } .full-section.dark-section .widget-tags a { color: #242424; } .full-section.dark-section .widget-tags a:hover { color: #fff; } /* BACKROUNDS AND STYLE FOR FULL SECTIONS */ #section-1 { padding: 170px 0 150px; margin-top: 50px; background-image: url(../../images/backgrounds/bg-1.jpg); } #section-1:after { position: absolute; top: 0; right: 0; bottom: 0; width: 55%; margin-right: -100px; background-color: #00193A; opacity: 0.8; content: ""; -webkit-transform: skew(-10deg); -ms-transform: skew(-10deg); transform: skew(-10deg); } #section-1 .headline-2 h1 { font-size: 32px; line-height: 42px; } #section-2 { margin-top: 50px; margin-bottom: 0px; background-image: url(../../images/backgrounds/bg-2.jpg); } #section-3 { padding: 100px 0 80px; margin-top: 50px; margin-bottom: 0; background-color: #f5f8fa; } #section-4 { overflow: visible; padding: 100px 0 60px; background-color: #00cee0; } #section-4 > img { position: absolute; right: 7%; top: 0; } #section-5 { margin-top: 80px; border-bottom: 1px solid #fff; margin-bottom: -50px; background-color: #000F1E; } #section-6 { padding: 180px 0 130px; margin-top: 50px; background-image: url(../../images/backgrounds/bg-3.jpg); } #section-7 { overflow: visible; padding: 150px 0 100px; margin-top: 200px; margin-bottom: -80px; background-color: #f5f8fa; } #section-7 > img { position: absolute; bottom: 0; left: 0; -webkit-transform: translateX(-25%); -ms-transform: translateX(-25%); transform: translateX(-25%); } #section-8 h1 { margin: 40px 0; color: #00cee0; font-size: 60px; font-weight: 700; text-transform: uppercase; } #section-8 i { display: block; padding: 100px 0; background-color: #1c2239; color: #00cee0; font-size: 150px; text-align: center; } #section-9 { background-image: url(../../images/backgrounds/bg-3.jpg); } #section-9 h1 { margin: 50px 0 20px; color: #00cee0; font-size: 60px; font-weight: 700; text-transform: uppercase; } #section-10 { padding: 100px 0 80px; margin-top: 80px; margin-bottom: -80px; background-image: url(../../images/backgrounds/bg-2.jpg); } @media (min-width: 768px) and (max-width: 991px) { #section-1:after { width: 75%; } #section-7 { margin-top: 100px; } } @media (max-width: 767px) { .full-screen { -webkit-background-size: cover; background-size: cover; } .full-screen .full-section-container { position: relative; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } #section-8 h1 { font-size: 36px; } #section-9 h1 { font-size: 36px; } #section-1:after { width: 100%; margin-right: 0; -webkit-transform: skew(0); -ms-transform: skew(0); transform: skew(0); } #section-7 { margin-top: 100px; } } /*********************************************************************************** * + VIDEO PLAYER ***********************************************************************************/ #local-video-section, #youtube-video-section { position: absolute; z-index: 1; overflow: hidden; top: 0; width: 100%; height: 100%; } #video-section { height: 715px; padding: 0; margin-top: 50px; background-image: url(../../images/backgrounds/bg-2.jpg); } .youtube-player { display: none; } #video-section .full-section-container { position: absolute; z-index: 2; top: 50%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } #local-video-section video { width: 100%; } /*********************************************************************************** * + SCROLL UP ***********************************************************************************/ #scroll-up { position: fixed; z-index: 8000; bottom: 50px; right: 50px; display: none; width: 46px; height: 46px; border-radius: 50%; background-color: #1c1d1d; color: #fff; font-size: 24px; line-height: 42px; text-align: center; text-decoration: none; cursor: pointer; -webkit-transition: all 0.3s; transition: all 0.3s; } #scroll-up:hover { background-color: #00cee0; } @media (max-width: 767px) { #scroll-up { right: 20px; bottom: 20px; } } /*********************************************************************************** * + SLIDERS ***********************************************************************************/ /* REVOLUTION SLIDER */ .rev_slider_wrapper { margin-bottom: 100px; height: 650px; } .rev_slider ul, .rev_slider ul li { overflow: visible !important; } /* ARROWS */ .tp-leftarrow.custom, .tp-rightarrow.custom { width: 40px; height: 40px; border-radius: 50%; background: #242424 no-repeat center center; -webkit-transition: all 0.3s; transition: all 0.3s; } .tp-leftarrow.custom:hover, .tp-rightarrow.custom:hover { background-color: #00cee0; } /* BULLETS */ .tp-bullets.custom .tp-bullet { width: 8px; height: 8px; border-radius: 50%; border: 2px solid #fff; background-color: #242424; -webkit-transition: background-color 0.3s, color 0.3s; transition: background-color 0.3s, color 0.3s; } .tp-bullets.custom .tp-bullet:hover, .tp-bullets.custom .tp-bullet.selected { border-color: #fff; background-color: #00cee0; } /* TYPOGRAPHY */ .tp-caption.text { color: #00cee0; font-family: "Montserrat", Arial, sans-serif; font-size: 18px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; } .tp-caption.title { color: #242424; font-family: "Montserrat", Arial, sans-serif; font-size: 60px; line-height: 56px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; } .tp-caption.title-white { color: #fff; font-family: "Montserrat", Arial, sans-serif; font-size: 72px; line-height: 72px; font-weight: 700; letter-spacing: 0.25px; text-transform: uppercase; } .tp-caption.title-mute { color: #cce3ef; font-family: "Montserrat", Arial, sans-serif; font-size: 72px; line-height: 72px; font-weight: 700; letter-spacing: 0.25px; text-align: right; text-transform: uppercase; } .tp-caption.title-bordered { padding: 40px; border: 5px solid #fff; color: #fff; font-family: "Montserrat", Arial, sans-serif; font-size: 60px; line-height: 60px; letter-spacing: 10px; text-transform: uppercase; } .tp-caption.title:after { display: none; } .tp-caption.small-title { color: #242424; font-family: "Montserrat", Arial, sans-serif; font-size: 36px; line-height: 36px; font-weight: 700; letter-spacing: 2px; } .tp-caption.text-2 { color: #242424; font-family: "Volkhov", Arial, sans-serif; font-size: 18px; line-height: 30px; font-style: italic; } .tp-caption.text-white { color: #fff; font-family: "Volkhov", Arial, sans-serif; font-size: 18px; line-height: 30px; font-style: italic; } .tp-caption.text-highlight { padding: 5px 10px; background-color: #00cee0; color: #fff; font-family: "Montserrat", Arial, sans-serif; font-size: 24px; font-weight: 700; text-transform: uppercase; } .tp-caption.rectangle { display: none!important; width: 590px; height: 475px; background-color: rgba(255, 255, 255, 0.4); } @media (min-width: 1200px) { .tp-caption.rectangle { width: 590px; position: relative; margin-left: 250px!important; } } @media (min-width: 768px) and (max-width: 991px) { .tp-leftarrow.custom, .tp-rightarrow.custom { display: none; } .tp-caption.rectangle { width: 300px; height: 350px; } } @media (max-width: 767px) { .tp-leftarrow.custom, .tp-rightarrow.custom { display: none; } .tp-bullets.custom { top: auto !important; bottom: -35px !important; } .tp-caption .btn { padding: 5px 15px; font-size: 6px; } .tp-caption.rectangle { width: 130px; height: 150px; } } @media (min-width: 480px) and (max-width: 767px) { .tp-caption.rectangle { width: 180px; height: 190px; } } /* OWL Carousel */ .owl-carousel { margin-bottom: 50px; } .owl-carousel:hover { cursor: -webkit-grab; cursor: grab; } .owl-carousel .grabbing { cursor: -webkit-grabbing; cursor: grabbing; } .owl-pagination { position: absolute; bottom: -30px; left: 0; width: 100%; text-align: center; } .owl-page { display: inline-block; width: 8px; height: 8px; border: 2px solid #d3d3d3; border-radius: 50%; margin-right: 5px; background-color: transparent; } .owl-page:hover, .owl-page.active { border-color: #00cee0; } .owl-page:last-child { margin-right: 0; } .owl-prev, .owl-next { position: absolute; top: 50%; width: 32px; height: 32px; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.3s; transition: all 0.3s; } .owl-prev { left: -50px; } .owl-next { right: -50px; } .owl-prev:before, .owl-next:before { font-family: "FontAwesome"; font-size: 24px; } .owl-prev:before { content: "\f104"; } .owl-next:before { content: "\f105"; } .owl-prev:hover, .owl-next:hover { opacity: 0.5; } /* IMAGES SLIDER */ .images-slider { text-align: center; } /* LATEST POSTS SLIDER */ .latest-posts-slider { margin-bottom: 20px; } .latest-posts-slider-navigation { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; text-transform: uppercase; } .latest-posts-slider-navigation .prev, .latest-posts-slider-navigation .next { line-height: 20px; -webkit-transition: all 0.3s; transition: all 0.3s; } .latest-posts-slider-navigation .prev:after, .latest-posts-slider-navigation .next:after { display: block; width: 0; border-bottom: 1px solid #00cee0; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .latest-posts-slider-navigation .prev { float: left; } .latest-posts-slider-navigation .next { float: right; } .latest-posts-slider-navigation .prev:hover, .latest-posts-slider-navigation .next:hover { color: #242424; cursor: pointer; } .latest-posts-slider-navigation .prev:hover:after, .latest-posts-slider-navigation .next:hover:after { width: 100%; } .latest-posts-slider-navigation:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /* PORTFOLIO SLIDER */ .portfolios-slider { margin: 20px 0 50px; } .portfolios-slider .portfolios-item { margin-bottom: 0; } /* TESTIMONIALS SLIDER */ .testimonials-slider-container { position: relative; } .testimonials-slider-navigation { font-family: "Montserrat", Arial, sans-serif; font-size: 12px; text-transform: uppercase; } .testimonials-slider-navigation .prev, .testimonials-slider-navigation .next { position: absolute; top: 50%; line-height: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 0.3s; transition: all 0.3s; } .testimonials-slider-navigation .prev:after, .testimonials-slider-navigation .next:after { display: block; width: 0; border-bottom: 1px solid #00cee0; content: ""; -webkit-transition: all 0.3s; transition: all 0.3s; } .testimonials-slider-navigation .prev { left: -100px;; } .testimonials-slider-navigation .next { right: -100px; } .testimonials-slider-navigation .prev:hover, .testimonials-slider-navigation .next:hover { cursor: pointer; } .testimonials-slider-navigation .prev:hover:after, .testimonials-slider-navigation .next:hover:after { width: 100%; } .testimonials-slider .owl-pagination { display: none; } /* LOGOS SLIDER */ .logos-slider { text-align: center; } @media (min-width: 768px) and (max-width: 991px) { .testimonials-slider .owl-pagination { display: block; } .testimonials-slider-navigation { display: none; } } @media (max-width: 767px) { .testimonials-slider .owl-pagination { display: block; } .testimonials-slider-navigation { display: none; } } /*********************************************************************************** * + ANIMATIONS ***********************************************************************************/ .wow { visibility: hidden; } .wow.animated { visibility: visible; } /*********************************************************************************** * + WIDGETS ***********************************************************************************/ .widget { margin-bottom: 75px; } .widget > *:last-child { margin-bottom: 0; } .widget-title { margin-bottom: 35px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; } .widget-title:after { display: block; width: 80px; border-bottom: 2px solid #00cee0; margin-top: 8px; content: ""; } /* WIDGET TEXT */ .widget-text {} .widget-text div > *:last-child { margin-bottom: 0; } .widget-text .about { margin-bottom: -125px; } @media (max-width: 767px) { .widget-text .about { margin-bottom: 0; } } /* WIDGET SERACH */ .widget-search {} .widget-search form { position: relative; } .widget-search #s { width: 100%; height: 45px; padding-right: 45px; border-color: #e5f0f6; background-color: #e5f0f6; } .widget-search #s:focus { background-color: #fff; } .widget-search input[type="submit"] { position: absolute; top: 0; right: 0; height: 45px; border: none; background: url(../images/search.png) no-repeat center center; } /* WIDGET CATEGORIES */ .widget-categories {} .widget-categories ul { margin-bottom: 0; list-style: none; } .widget-categories ul li { padding-bottom: 10px; border-bottom: 1px dashed #d3d3d3; margin-bottom: 10px; } .widget-categories ul li:after { float: right; color: #00cee0; font-family: "FontAwesome"; font-size: 12px; content: "\f054"; } .widget-categories ul li:last-child { padding-bottom: 0; border-bottom: none; margin-bottom: 0; } .widget-categories ul li a { color: #525252; letter-spacing: 0.25px; -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-categories ul li a:hover { color: #00cee0; text-decoration: none; } /* WIDGET CATEGORIES DROPDOWN */ .widget-categories-dropdown {} /* WIDGET ARCHIVES */ .widget-archives {} .widget-archives ul { margin-bottom: 0; list-style: none; } .widget-archives ul li { padding-bottom: 10px; border-bottom: 1px dashed #d3d3d3; margin-bottom: 10px; } .widget-archives ul li:after { float: right; color: #00cee0; font-family: "FontAwesome"; font-size: 12px; content: "\f054"; } .widget-archives ul li:last-child { padding-bottom: 0; border-bottom: none; margin-bottom: 0; } .widget-archives ul li a { color: #525252; letter-spacing: 0.25px; -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-archives ul li a:hover { color: #00cee0; text-decoration: none; } /* WIDGET ARCHIVES DROPDOWN */ .widget-archives-dropdown {} /* WIDGET PAGES */ .widget-pages {} .widget-pages ul { list-style: none; margin-bottom: 20px; } .widget-pages ul li { margin-bottom: 10px; } .widget-pages ul li:last-child { margin-bottom: 0; } .widget-pages ul li a { color: #525252; -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-pages ul li a:before { margin-right: 10px; font-family: "FontAwesome"; content: "\f105"; } .widget-pages ul li a:hover { color: #00cee0; text-decoration: none; } /* WIDGET METADATA */ .widget-metadata {} .widget-metadata ul { list-style: none; margin-bottom: 20px; } .widget-metadata ul li { margin-bottom: 10px; } .widget-metadata ul li:last-child { margin-bottom: 0; } .widget-metadata ul li a { color: #525252; -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-metadata ul li a:before { margin-right: 10px; font-family: "FontAwesome"; content: "\f105"; } .widget-metadata ul li a:hover { color: #00cee0; text-decoration: none; } /* WIDGET TAGS */ .widget-tags {} .widget-tags a { position: relative; z-index: 1; display: inline-block; padding: 8px 20px; margin-bottom: 8px; margin-right: 5px; background-color: #e5f0f6; color: #242424; font-size: 12px; letter-spacing: 0.25px; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-tags a:last-child { margin-right: 0; } .widget-tags a:after { position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0; background-color: #00cee0; content: ""; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-tags a:hover:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .widget-tags a:hover { background-color: #00cee0; color: #fff; text-decoration: none; } @media (min-width: 768px) and (max-width: 991px) { .widget-tags a { padding: 5px 15px; } } /* WIDGET NEWSLETTER */ .widget-newsletter {} .widget-newsletter form {} .widget-newsletter input[type="email"] { width: 100%; } .widget-newsletter input[type="submit"] {} /* WIDGET RECENT POSTS */ .widget-recent-posts {} .widget-recent-posts ul { list-style: none; } .widget-recent-posts ul li { margin-bottom: 30px; } .widget-recent-posts ul li:last-child { margin-bottom: 0; } .widget-recent-posts ul li img { display: block; margin-bottom: 20px; } .widget-recent-posts ul li .post-title { color: #242424; font-family: "Montserrat", Arial, sans-serif; font-weight: 700; -webkit-transition: all 0.3s; transition: all 0.3s; } .widget-recent-posts ul li .post-title:hover { color: #00cee0; text-decoration: none; } .widget-recent-posts ul li .post-date { margin-bottom: 0; font-family: "Volkhov", Arial, sans-serif; font-size: 12px; font-style: italic; } .widget-recent-posts ul li .post-date a { color: #525252; } /* WIDGET RECENT COMMENTS */ .widget-recent-comments {} .widget-recent-comments ul { margin-bottom: 0; list-style: none; } .widget-recent-comments ul li { margin-bottom: 10px; } .widget-recent-comments ul li:last-child { margin-bottom: 0; } /* WIDGET CALENDAR */ .widget-calendar {} .widget-calendar table { width: 100%; text-align: center; } .widget-calendar table th, .widget-calendar table td { padding: 5px; border-top: 1px solid #d3d3d3; border-left: 1px solid #d3d3d3; text-align: center; } .widget-calendar table th:last-child, .widget-calendar table td:last-child { border-right: 1px solid #d3d3d3; } .widget-calendar table tr:last-child td { border-bottom: 1px solid #d3d3d3; } .widget-calendar table tfoot td, .widget-calendar table tfoot td:last-child, .widget-calendar table tfoot tr:last-child td { border: none; } .widget-calendar table td#today { background-color: #00cee0; color: #fff; } /* WIDGET FLICKR */ .widget-flickr {} .flickr-photos { margin: -5px; } .flickr_badge_image { float: left; padding: 5px; } .flickr_badge_image img { width: 80px; height: auto; } .flickr-photos:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } @media (min-width: 768px) and (max-width: 991px) { .flickr_badge_image img { width: 70px; } } /* WIDGET CONTACT */ .widget-contact {} .widget-contact ul { margin-bottom: 0; list-style: none; } .widget-contact ul li { position: relative; margin-bottom: 25px; } .widget-contact ul li:last-child { margin-bottom: 0; } .widget-contact ul li span { display: block; padding-left: 25px; margin-bottom: 10px; font-family: "Montserrat", Arial, sans-serif; } .widget-contact ul li a { color: #525252; } .widget-contact ul li.email:before, .widget-contact ul li.phone:before, .widget-contact ul li.address:before { position: absolute; top: -1px; left: 0; margin-right: 5px; color: #00cee0; font-family: "FontAwesome"; font-size: 18px; } .widget-contact ul li.email:before { content: "\f003"; } .widget-contact ul li.phone:before { font-size: 24px; content: "\f10b"; } .widget-contact ul li.address:before { font-size: 20px; content: "\f041"; } /* WIDGET SOCIAL */ .widget-social {} .widget-social .social-media { margin-bottom: 0; }