/* Nordic HTML Template *//************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header
5. Main Slider
6. About Section
7. Services Section
8. Projects Section
9. Testimonial Section
10. Clients Section
11. Pricing Section
12. Blog Section
13. Main Footer
14. Page Title Section
15. Team Section
16. Project Detail Section
17. Our Blogs
18. Blogs Widgets
19. Map Section
20. Contact Form Section
**********************************************//*
font-family: 'Heebo', sans-serif;
font-family: 'Inter', sans-serif;
*/
@import url('animate.css');
@import url('owl.css');
@import url('elegenticon.css');
@import url('linearicons.css');
@import url('ionicons.css');
@import url('jquery-ui.css');
@import url('animation.css');
@import url('icofont.min.css');
@import url('themify-icons.css');
@import url('simple-line-icons.css');
@import url('fontawesome.min.css');
@import url('jquery.fancybox.min.css');
@import url('jquery.mCustomScrollbar.min.css');
/***
====================================================================
Reset
====================================================================
***/
*
{
margin: 0;
padding: 0;
border: none;
outline: none;
}/* @font-face {
font-family: 'FontAwesome';
src: url('/fonts/fontawesome-webfont.eot?v=4.6.1');
src: url('/fonts/fontawesome-webfont.eot?') format('embedded-opentype'), url('/fonts/fontawesome-webfont.woff2?v=4.6.1') format('woff2'), url('/fonts/fontawesome-webfont.woff?v=4.6.1') format('woff'), url('/fonts/fontawesome-webfont.ttf?v=4.6.1') format('truetype'), url('/fonts/fontawesome-webfont.svg?v=4.6.1') format('svg');
font-weight: normal;
font-style: normal;
} */
@font-face
{
font-family: "icofont";
src: url("/fonts/icofont.eot?");
src: url("/fonts/icofont.eot?") format("embedded-opentype"),url("/fonts/icofont.woff") format("woff"),url("/fonts/icofont.ttf") format("truetype"),url("/fonts/icofont.svg") format("svg");
font-weight: 400;
font-style: normal;
}
@font-face
{
font-family: "simple-line-icons";
src: url("/fonts/simple-Line-Icons.eot?");
src: url("/fonts/simple-Line-Icons.eot?") format("embedded-opentype"),url("/fonts/simple-Line-Icons.woff") format("woff"),url("/fonts/simple-Line-Icons.ttf") format("truetype"),url("/fonts/simple-Line-Icons.svg") format("svg");
font-weight: 400;
font-style: normal;
}
@font-face
{
font-family: 'themify';
src: url('/fonts/themify.eot?-fvbane');
src: url('/fonts/themify.eot?') format('embedded-opentype'),url('/fonts/themify.woff?-fvbane') format('woff'),url('/fonts/themify.ttf?-fvbane') format('truetype'),url('/fonts/themify.svg?-fvbane') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face
{
font-family: "SignericaMedium";
src: url("/fonts/SignericaMedium.eot?");
src: url("/fonts/SignericaMedium.eot?") format("embedded-opentype"),url("/fonts/SignericaMedium.woff") format("woff"),url("/fonts/SignericaMedium.ttf") format("truetype"),url("/fonts/SignericaMedium.svg") format("svg");
font-weight: 400;
font-style: normal;
}
@font-face
{
font-family: "SignericaMedium";
src: url("/fonts/SignericaMedium.eot?");
src: url("/fonts/SignericaMedium.eot?") format("embedded-opentype"),url("/fonts/SignericaMedium.woff") format("woff"),url("/fonts/SignericaMedium.ttf") format("truetype"),url("/fonts/SignericaMedium.svg") format("svg");
font-weight: 400;
font-style: normal;
}
@font-face
{
font-family: "ionicons.eot";
src: url("/fonts/ionicons.eot?");
src: url("/fonts/ionicons.eot?") format("embedded-opentype"),url("/fonts/ionicons.woff") format("woff"),url("/fonts/ionicons.ttf") format("truetype"),url("/fonts/ionicons.svg") format("svg");
font-weight: 400;
font-style: normal;
}/***
====================================================================
Global Settings
====================================================================
***/
body
{
font-family: 'Inter',sans-serif;
font-size: 14px;
color: #777;
line-height: 1.7em;
font-weight: 400;
background: #fff;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
}
.bordered-layout .page-wrapper
{
padding: 0 50px 0;
}
a
{
text-decoration: none;
cursor: pointer;
color: #ffe1a0;
}
button, a:hover, a:focus, a:visited
{
text-decoration: none;
outline: none!important;
}
h1, h2, h3, h4, h5, h6
{
position: relative;
font-weight: normal;
margin: 0;
background: none;
line-height: 1.6em;
font-family: 'Inter',sans-serif;
}
.pull-left
{
float: left;
}
.pull-right
{
float: right;
}/* Typography */
h1
{
font-size: 100px;
}
h2
{
font-size: 42px;
}
h3
{
font-size: 36px;
}
h4
{
font-size: 24px;
}
h5
{
font-size: 20px;
}
h6
{
font-size: 18px;
}
textarea
{
overflow: hidden;
}
p
{
position: relative;
line-height: 1.8em;
}
.auto-container
{
position: static;
max-width: 1200px;
padding: 0 15px;
margin: 0 auto;
}
.medium-container
{
max-width: 850px;
}
.page-wrapper
{
position: relative;
margin: 0 auto;
width: 100%;
min-width: 300px;
}
ul, li
{
list-style: none;
padding: 0;
margin: 0;
}
img
{
display: inline-block;
max-width: 100%;
}
.theme-btn
{
display: inline-block;
transition: all .3s ease;
-moz-transition: all .3s ease;
-webkit-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
}
.centered
{
text-align: center;
}/*Btn Style One*/
.btn-style-one
{
position: relative;
display: inline-block;
font-size: 18px;
line-height: 30px;
color: #fff;
padding: 15px 40px;
font-weight: 400;
overflow: hidden;
border-radius: 0;
background-color: #73aae5;
text-transform: uppercase;
font-family: 'Inter',sans-serif;
}
.btn-style-one:before
{
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
background-color: #262626;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
-webkit-transform: scale(.2,1);
transform: scale(.2,1);
}
.btn-style-one i
{
position: relative;
top: 1px;
margin-left: 4px;
}
.btn-style-one .txt
{
position: relative;
z-index: 1;
}
.btn-style-one:hover::before
{
opacity: 1;
-webkit-transform: scale(1,1);
transform: scale(1,1);
}
.btn-style-one:hover
{
color: #fff;
}/* Btn Style Two */
.btn-style-two
{
position: relative;
display: inline-block;
font-size: 14px;
line-height: 30px;
color: #000;
padding: 11px 32px;
font-weight: 400;
overflow: hidden;
border-radius: 0;
background-color: #fff;
text-transform: uppercase;
border: 1px solid #969696;
}
.btn-style-two:before
{
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
background-color: #ffe1a0;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
-webkit-transform: scale(.2,1);
transform: scale(.2,1);
}
.btn-style-two i
{
position: relative;
top: 1px;
margin-left: 4px;
}
.btn-style-two .txt
{
position: relative;
z-index: 1;
}
.btn-style-two:hover::before
{
opacity: 1;
-webkit-transform: scale(1,1);
transform: scale(1,1);
}
.btn-style-two:hover
{
color: #000;
border-color: #ffe1a0;
}/* Btn Style Three */
.btn-style-three
{
position: relative;
display: inline-block;
font-size: 18px;
line-height: 30px;
color: #ffe1a0;
padding: 10px 60px;
font-weight: 700;
overflow: hidden;
border-radius: 50px;
background: none;
border: 1px solid #ffe1a0;
text-transform: capitalize;
}
.btn-style-three:before
{
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
background-color: #ffe1a0;
-webkit-transition: all .4s;
-moz-transition: all .4s;
-o-transition: all .4s;
transition: all .4s;
-webkit-transform: scale(.2,1);
transform: scale(.2,1);
}
.btn-style-three .txt
{
position: relative;
z-index: 1;
}
.btn-style-three:hover::before
{
opacity: 1;
-webkit-transform: scale(1,1);
transform: scale(1,1);
}
.btn-style-three:hover
{
color: #fff;
}/* Social Icon One */
.social-icon-one
{
position: relative;
display: block;
}
.social-icon-one li
{
position: relative;
margin-left: 9px;
display: inline-block;
}
.social-icon-one li a
{
position: relative;
width: 32px;
height: 32px;
display: block;
font-size: 14px;
line-height: 32px;
color: #ccc;
text-align: center;
border-radius: 2px;
background-color: #333;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}
.social-icon-one li a:hover
{
color: #333;
background-color: #feec42;
}
.theme_color
{
color: #ffe1a0;
}
img
{
display: inline-block;
max-width: 100%;
height: auto;
}/***
====================================================================
Scroll To Top style
====================================================================
***/
.scroll-to-top
{
position: fixed;
bottom: 85px;
right: 15px;
width: 60px;
height: 60px;
color: #fff;
font-size: 24px;
text-transform: uppercase;
line-height: 60px;
text-align: center;
z-index: 100;
cursor: pointer;
background: #0a0a0a;
display: none;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.scroll-to-top:hover
{
color: #fff;
background: #73aae5;
}/***
====================================================================
Section Title
====================================================================
***/
.sec-title
{
position: relative;
margin-bottom: 60px;
}
.sec-title .title
{
position: relative;
color: #666;
font-size: 18px;
line-height: 1.8em;
letter-spacing: 1px;
margin-bottom: 25px;
text-transform: uppercase;
}
.sec-title h2
{
position: relative;
color: #000;
font-weight: 400;
line-height: 1.2em;
}
.sec-title .text
{
position: relative;
color: #666;
font-size: 18px;
line-height: 1.8em;
margin-top: 20px;
}
.sec-title.centered
{
text-align: center!important;
}
.sec-title.light .title
{
color: #ffe1a0;
background-color: #fff;
}
.sec-title.light h2
{
color: #fff;
}/* List Style One */
.list-style-one
{
position: relative;
z-index: 1;
}
.list-style-one li
{
position: relative;
color: #666;
font-size: 16px;
font-weight: 400;
margin-bottom: 6px;
padding-left: 30px;
line-height: 1.8em;
}
.list-style-one li:before
{
position: absolute;
left: 0;
top: 10px;
width: 7px;
height: 7px;
content: '';
display: block;
font-weight: 400;
border-radius: 50px;
background-color: #666;
}/***
====================================================================
Main Header style
====================================================================
***/
.main-header
{
position: absolute;
z-index: 999;
width: 100%;
-ms-animation-duration: 500ms;
-moz-animation-duration: 500ms;
-op-animation-duration: 500ms;
-webkit-animation-duration: 500ms;
animation-duration: 500ms;
}
.main-header .outer-container
{
position: relative;
padding: 0 60px;
}
.main-header .main-box
{
position: relative;
padding: 0 0;
left: 0;
top: 0;
width: 100%;
background: none;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-header .header-upper
{
position: relative;
z-index: 1;
transition: all 300ms ease;
-moz-transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.main-header .header-upper .inner-container
{
position: relative;
}
.main-header .header-upper .outer-box .nav-toggler
{
position: relative;
font-size: 28px;
color: #ff9600;
cursor: pointer;
display: inline-block;
}
.main-header.fixed-header .main-menu .navigation>li.current>a, .main-header.fixed-header .main-menu .navigation>li:hover>a
{
color: #73aae5;
}/* Search Box Outer */
.main-header .header-upper .search-box-outer
{
position: relative;
float: left;
}
.main-header .header-upper .language-list
{
position: relative;
padding: 58px 0;
float: left;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-header .header-upper .language-list li
{
position: relative;
margin-right: 25px;
display: inline-block;
}
.main-header .header-upper .language-list li a
{
position: relative;
color: #fff;
font-weight: 400;
font-size: 14px;
text-transform: uppercase;
transition: all 300ms ease;
-moz-transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.main-header .header-upper .language-list li:last-child
{
margin-right: 0;
}
.main-header .header-upper .language-list li a:hover
{
color: #fff;
}
.main-header.fixed-header .header-upper .language-list
{
padding: 33px 0;
}
.main-header.header-style-two .header-upper .language-list li a:hover
{
color: #ccc;
}
.header-style-two.alternate
{
position: relative;
}
.main-header.header-style-two.fixed-header .header-upper
{
background-color: #fff;
border-bottom: 1px solid rgba(0,0,0,.1);
}
.main-header.header-style-two .header-upper .outer-box .mobile-nav-toggler, .header-style-two .header-upper .language-list li a, .header-style-two .main-menu .navigation>li>a
{
color: #000;
}
.header-style-two .main-menu .navigation>li:before
{
background-color: #000;
}/* Sticky Header */
.sticky-header
{
position: fixed;
opacity: 0;
visibility: hidden;
left: 0;
top: 0;
width: 100%;
padding: 0 0;
background: #222;
z-index: 0;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.sticky-header .logo
{
padding: 8px 0 8px;
}
.fixed-header .sticky-header
{
z-index: 999;
opacity: 1;
visibility: visible;
-ms-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-op-animation-name: fadeInDown;
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
-ms-animation-duration: 500ms;
-moz-animation-duration: 500ms;
-op-animation-duration: 500ms;
-webkit-animation-duration: 500ms;
animation-duration: 500ms;
-ms-animation-timing-function: linear;
-moz-animation-timing-function: linear;
-op-animation-timing-function: linear;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-ms-animation-iteration-count: 1;
-moz-animation-iteration-count: 1;
-op-animation-iteration-count: 1;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
}
.sticky-header .main-menu .navigation>li>a
{
padding: 23px 0!important;
color: #fff!important;
}
.sticky-header .main-menu .navigation>li>a:after
{
display: none;
}
.main-header .nav-outer
{
position: static;
padding-left: 100px;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-header .header-upper .logo-box
{
position: relative;
z-index: 10;
padding: 43px 0;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-header .header-upper .logo-box .logo
{
position: relative;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-header .header-upper .outer-box
{
position: absolute;
right: 0;
margin-left: 0;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu
{
position: relative;
float: left;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navbar-collapse
{
padding: 0;
display: block;
}
.main-menu .navigation
{
position: static;
margin: 0;
width: 100%;
}
.main-menu .navigation>li
{
position: relative;
float: none;
display: inline-block;
margin-right: 40px;
text-align: left;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li:before
{
position: absolute;
content: '';
left: 0;
bottom: 55px;
right: 0;
height: 1px;
opacity: 0;
background-color: #fff;
transform: scale(.2,1);
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li.current::before, .main-menu .navigation>li:hover::before
{
transform: scale(1,1);
opacity: 1;
background-color: #73aae5;
}
.main-menu .navigation>li:last-child
{
margin-right: 0;
}
.main-header .header-upper .upper-right
{
position: relative;
}
.main-menu .navigation>li>a
{
position: relative;
display: block;
color: #fff;
text-align: center;
line-height: 30px;
text-transform: uppercase;
letter-spacing: 0;
opacity: 1;
font-weight: 400;
padding: 55px 0;
font-size: 14px;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li:hover>a, .main-menu .navigation>li.current>a
{
color: #73aae5;
}
.main-menu .navigation>li:hover>a, .main-menu .navigation>li.current>a, .main-header.light-version .main-menu .navigation>li:hover>a, .main-header.light-version .main-menu .navigation>li.current>a
{
opacity: 1;
}
.main-menu .navigation>li>ul
{
position: absolute;
left: -30px;
top: 100%;
width: 230px;
z-index: 100;
display: none;
opacity: 0;
visibility: hidden;
transition: all 900ms ease;
-moz-transition: all 900ms ease;
-webkit-transition: all 900ms ease;
-ms-transition: all 900ms ease;
-o-transition: all 900ms ease;
padding: 20px 15px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,.1);
}
.main-menu .navigation>li>ul.from-right
{
left: auto;
right: 0;
}
.main-menu .navigation>li>ul>li
{
position: relative;
width: 100%;
}
.main-menu .navigation>li>ul>li>a
{
position: relative;
display: block;
padding: 6px 18px;
line-height: 24px;
font-weight: 500;
font-size: 15px;
text-transform: capitalize;
color: #222;
padding-left: 10px;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li>ul>li>a:before
{
position: absolute;
top: -6px;
left: 8px;
color: transparent;
content: '.';
text-shadow: 0 0 transparent;
font-size: 2em;
line-height: 1em;
-webkit-transition: text-shadow .3s,color .3s;
-moz-transition: text-shadow .3s,color .3s;
transition: text-shadow .3s,color .3s;
pointer-events: none;
animation: opacitychange 1s ease-in-out infinite;
}
.main-menu .navigation>li>ul>li:hover>a::before
{
opacity: 1;
color: #000;
text-shadow: 8px 0 #ccc,-8px 0 #ccc;
}
.main-menu .navigation>li>ul>li:hover>a
{
color: #111;
padding-left: 30px;
}
.main-menu .navigation>li>ul>li.dropdown>a:after
{
font-family: 'Font Awesome 5 Free';
content: "";
position: absolute;
right: 10px;
top: 10px;
width: 10px;
height: 20px;
display: block;
color: #253d4a;
line-height: 20px;
font-size: 16px;
font-weight: normal;
text-align: center;
z-index: 5;
font-weight: 800;
}
.main-menu .navigation>li>ul>li.dropdown:hover>a:after
{
color: #222;
}
.main-menu .navigation>li>ul>li>ul
{
position: absolute;
left: 120%;
top: 0%;
width: 230px;
z-index: 100;
display: none;
transition: all 900ms ease;
-moz-transition: all 900ms ease;
-webkit-transition: all 900ms ease;
-ms-transition: all 900ms ease;
-o-transition: all 900ms ease;
padding: 20px 15px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,.1);
}
.main-menu .navigation>li>ul>li>ul.from-right
{
left: auto;
right: 0;
}
.main-menu .navigation>li>ul>li>ul>li
{
position: relative;
width: 100%;
}
.main-menu .navigation>li>ul>li>ul>li>a
{
position: relative;
display: block;
padding: 6px 18px;
line-height: 24px;
font-weight: 500;
font-size: 15px;
text-transform: capitalize;
color: #222;
padding-left: 10px;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li>ul>li>ul>li>a:before
{
position: absolute;
top: -6px;
left: 8px;
color: transparent;
content: '.';
text-shadow: 0 0 transparent;
font-size: 2em;
line-height: 1em;
-webkit-transition: text-shadow .3s,color .3s;
-moz-transition: text-shadow .3s,color .3s;
transition: text-shadow .3s,color .3s;
pointer-events: none;
animation: opacitychange 1s ease-in-out infinite;
}
.main-menu .navigation>li>ul>li>ul>li:hover>a::before
{
opacity: 1;
color: #000;
text-shadow: 8px 0 #ffe1a0,-8px 0 #ffe1a0;
}
.main-menu .navigation>li>ul>li>ul>li:hover>a
{
color: #ffe1a0;
padding-left: 30px;
}
.main-menu .navigation>li>ul>li>ul>li.dropdown>a:after
{
font-family: 'FontAwesome';
content: "";
position: absolute;
right: 10px;
top: 11px;
width: 10px;
height: 20px;
display: block;
color: #272727;
line-height: 20px;
font-size: 16px;
font-weight: normal;
text-align: center;
z-index: 5;
}
.main-menu .navigation>li>ul>li>ul>li.dropdown:hover>a:after
{
color: #fff;
}
.main-menu .navigation>li.dropdown:hover>ul
{
visibility: visible;
opacity: 1;
top: 100%;
left: 0;
}
.main-menu .navigation li>ul>li.dropdown:hover>ul
{
visibility: visible;
opacity: 1;
top: 0;
left: 107%;
transition: all 300ms ease;
-moz-transition: all 300ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.main-menu .navbar-collapse>ul li.dropdown .dropdown-btn
{
position: absolute;
right: 10px;
top: 6px;
width: 30px;
height: 30px;
text-align: center;
color: #fff;
line-height: 28px;
border: 1px solid #fff;
background-size: 20px;
cursor: pointer;
z-index: 5;
display: none;
}
.main-header .header-upper .outer-box .social-icon-one
{
position: relative;
float: left;
}
.main-header.fixed-header .header-upper
{
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 9999;
width: 100%;
padding-top: 0;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
background-color: #111;
}
.main-header.fixed-header .header-upper .logo-box
{
padding: 10px 0;
}
.main-header.fixed-header .main-menu .navigation>li>a
{
padding: 30px 0;
}
.main-header .header-upper .outer-box .sidebar-btn
{
position: relative;
width: 52px;
height: 52px;
float: left;
color: #fff;
font-size: 18px;
margin-left: 14px;
cursor: pointer;
line-height: 52px;
text-align: center;
border-radius: 50px;
background-color: #05db56;
}
.main-menu .navigation>li>ul>li>ul>li>ul
{
position: absolute;
left: 100%;
top: 100%;
width: 210px;
z-index: 100;
display: none;
opacity: 0;
text-align: left;
visibility: hidden;
transition: all 900ms ease;
-moz-transition: all 900ms ease;
-webkit-transition: all 900ms ease;
-ms-transition: all 900ms ease;
-o-transition: all 900ms ease;
padding: 0 0;
background-color: #1e1e1e;
box-shadow: 0 0 10px rgba(0,0,0,.1);
}
.main-menu .navigation>li>ul>li>ul>li>ul>li
{
position: relative;
width: 100%;
border-bottom: 1px solid rgba(255,255,255,.1);
}
.main-menu .navigation>li>ul>li>ul>li>ul>li>a
{
position: relative;
padding: 10px 18px;
display: block;
line-height: 20px;
font-weight: 400;
font-size: 12px;
color: rgba(255,255,255,.5);
letter-spacing: 1px;
text-transform: uppercase;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-menu .navigation>li>ul>li>ul>li.dropdown:hover>ul
{
visibility: visible;
opacity: 1;
border-top: 0!important;
-moz-transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
}
.main-menu .navigation>li>ul>li>ul>li>ul>li>a:hover
{
background-color: #ffe1a0;
color: #fff;
}
.main-header .header-upper .outer-box .menu-toggler
{
position: relative;
float: right;
cursor: pointer;
color: #fff;
font-size: 28px;
margin-left: 30px;
padding-left: 30px;
}
.main-header .header-upper .outer-box .menu-toggler:before
{
position: absolute;
content: '';
left: 0;
top: 5px;
width: 1px;
height: 20px;
border-left: 1px solid rgba(255,255,255,.3);
}/***
====================================================================
Mobile Menu
====================================================================
***/
.main-header .nav-outer .mobile-nav-toggler
{
position: relative;
float: right;
font-size: 40px;
line-height: 50px;
cursor: pointer;
color: #222;
display: none;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}/* Mobile Nav Toggler */
.main-header .header-upper .outer-box .mobile-nav-toggler
{
position: relative;
float: left;
font-size: 14px;
cursor: pointer;
color: #fff;
line-height: 1em;
font-weight: 600;
padding: 55px 0;
margin-left: 150px;
text-transform: uppercase;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.main-header .header-upper .outer-box .mobile-nav-toggler .icon
{
position: relative;
margin-left: 20px;
font-size: 24px;
line-height: 1em;
}
.main-header.fixed-header .header-upper .outer-box .mobile-nav-toggler
{
padding: 33px 0 33px;
}
.mobile-menu
{
position: fixed;
right: 0;
top: 0;
width: 300px;
padding-right: 30px;
max-width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
z-index: 999999;
}
.mobile-menu .nav-logo
{
position: relative;
padding: 20px 20px;
text-align: left;
}
.mobile-menu .nav-logo img
{
max-width: 200px;
}
.mobile-menu-visible
{
overflow: hidden;
}
.mobile-menu-visible .mobile-menu
{
opacity: 1;
visibility: visible;
}
.mobile-menu .menu-backdrop
{
position: fixed;
right: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
background: rgba(0,0,0,.9);
-webkit-transform: translateX(101%);
-ms-transform: translateX(101%);
transform: translateX(101%);
}
.mobile-menu-visible .mobile-menu .menu-backdrop
{
opacity: 1;
visibility: visible;
-webkit-transition: all .7s ease;
-moz-transition: all .7s ease;
-ms-transition: all .7s ease;
-o-transition: all .7s ease;
transition: all .7s ease;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
.mobile-menu .menu-box
{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
max-height: 100%;
overflow-y: auto;
background: #fff;
padding: 0 0;
z-index: 5;
opacity: 0;
visibility: hidden;
border-radius: 0;
-webkit-transform: translateX(101%);
-ms-transform: translateX(101%);
transform: translateX(101%);
}
.mobile-menu-visible .mobile-menu .menu-box
{
opacity: 1;
visibility: visible;
-webkit-transition: all .7s ease 500ms;
-moz-transition: all .7s ease 500ms;
-ms-transition: all .7s ease 500ms;
-o-transition: all .7s ease 500ms;
transition: all .7s ease 500ms;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
.mobile-menu .close-btn
{
position: absolute;
right: 10px;
top: 34px;
line-height: 30px;
width: 30px;
text-align: center;
font-size: 24px;
color: #000;
cursor: pointer;
z-index: 10;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
-webkit-transform: translateY(-50px);
-ms-transform: translateY(-50px);
transform: translateY(-50px);
}
.mobile-menu-visible .mobile-menu .close-btn
{
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
.mobile-menu .close-btn:hover
{
opacity: .5;
}
.mobile-menu .navigation
{
position: relative;
display: block;
width: 100%;
border-top: 1px solid rgba(0,0,0,.1);
}
.mobile-menu .navigation li
{
position: relative;
display: block;
border-bottom: 1px solid rgba(0,0,0,.1);
}
.mobile-menu .navigation li>ul>li:last-child
{
border-bottom: none;
}
.mobile-menu .navigation li>ul>li:first-child
{
border-top: 1px solid rgba(0,0,0,.1);
}
.mobile-menu .navigation li>a
{
position: relative;
display: block;
line-height: 24px;
padding: 14px 20px;
font-size: 15px;
color: #404040;
font-weight: 600;
text-transform: uppercase;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.mobile-menu .navigation li:hover>a, .mobile-menu .navigation li.current>a
{
color: #000;
}
.mobile-menu .navigation li.dropdown .dropdown-btn
{
position: absolute;
right: 0;
top: 0;
width: 100%;
height: 50px;
text-align: center;
font-size: 16px;
line-height: 52px;
color: #404040;
cursor: pointer;
z-index: 5;
}
.mobile-menu .navigation li.dropdown .dropdown-btn span
{
position: absolute;
right: 0;
top: 3px;
height: 44px;
width: 50px;
line-height: 44px;
}
.mobile-menu .navigation li.dropdown .dropdown-btn span:after
{
content: '';
position: absolute;
left: 0;
top: 10px;
width: 1px;
height: 24px;
border-left: 1px solid rgba(0,0,0,.1);
}
.mobile-menu .navigation li>ul, .mobile-menu .navigation li>ul>li>ul
{
display: none;
}
.sticky-header .navbar-header
{
display: none;
}
.sticky-header .mobile-nav-toggler
{
display: none;
}/*Custom Select*/
.form-group .ui-selectmenu-button.ui-button
{
width: 100%;
font-size: 18px;
font-style: normal;
height: 46px;
padding: 10px 0 10px 0;
line-height: 26px;
color: #999;
border: none;
border-radius: 0;
background: #fff;
border-bottom: 1px solid #ccc;
}
.form-group .ui-button .ui-icon
{
background: none;
position: relative;
top: 2px;
text-indent: 0;
color: #333;
}
.form-group .ui-button .ui-icon:before
{
font-family: 'Font Awesome 5 Free';
content: "";
position: absolute;
right: 0;
top: 2px!important;
top: 13px;
width: 10px;
height: 20px;
display: block;
color: #000;
line-height: 20px;
font-size: 16px;
font-weight: normal;
text-align: center;
z-index: 5;
font-weight: 800;
}
.ui-menu .ui-menu-item
{
font-size: 14px;
}
.ui-menu .ui-menu-item:last-child
{
border: none;
}
.ui-state-active, .ui-widget-content .ui-state-active
{
background: #0152e9;
border-color: #0152e9;
}
.ui-menu .ui-menu-item-wrapper
{
position: relative;
display: block;
padding: 8px 20px;
font-size: 14px;
line-height: 24px;
}
.ui-menu-item:hover
{
background-color: #0152e9;
}/***
====================================================================
Banner Section
====================================================================
***/
.banner-section
{
position: relative;
}
.banner-section .mouse-btn-down
{
position: absolute;
left: 50%;
margin-left: -20px;
bottom: 20px;
width: 30px;
height: 68px;
cursor: pointer;
display: block;
z-index: 1;
cursor: pointer;
}/* Chevron */
.chevron
{
position: absolute;
width: 28px;
height: 8px;
opacity: 0;
transform: scale3d(.5,.5,.5);
animation: move 3s ease-out infinite;
}
.chevron:first-child
{
animation: move 3s ease-out 1s infinite;
}
.chevron:nth-child(2)
{
animation: move 3s ease-out 2s infinite;
}
.chevron:before, .chevron:after
{
content: ' ';
position: absolute;
top: 0;
height: 100%;
width: 51%;
background: #73aae5;
}
.chevron:before
{
left: 0;
transform: skew(0deg,30deg);
}
.chevron:after
{
right: 0;
width: 50%;
transform: skew(0deg,-30deg);
}
@keyframes move
{
25%
{
opacity: 1;
}
33%
{
opacity: 1;
transform: translateY(30px);
}
67%
{
opacity: 1;
transform: translateY(40px);
}
100%
{
opacity: 0;
transform: translateY(55px) scale3d(.5,.5,.5);
}
}
@keyframes pulse
{
to
{
opacity: 1;
}
}
.banner-section .slide
{
position: relative;
overflow: hidden;
padding-top: 250px;
padding-bottom: 100px;
background-size: cover;
}
.banner-section .slide-year
{
position: absolute;
left: 50px;
color: #fff;
font-size: 14px;
line-height: 1em;
text-transform: uppercase;
}
.banner-section .social-box
{
position: absolute;
left: 50px;
bottom: 110px;
z-index: 1;
}
.banner-section .social-box li
{
position: relative;
margin-top: 22px;
}
.banner-section .social-box li a
{
position: relative;
color: #fff;
font-size: 18px;
line-height: 1em;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.banner-section .social-box li a:hover
{
color: #ffe1a0;
}
.banner-section .info
{
position: absolute;
right: 60px;
bottom: 90px;
z-index: 1;
color: #fff;
}
.banner-section .info a
{
position: relative;
color: #fff;
font-size: 14px;
text-transform: uppercase;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.banner-section .info a:hover
{
color: #73aae5;
}
.banner-section .content-boxed
{
position: relative;
}
.banner-section .content-boxed .inner-boxed
{
position: relative;
}
.banner-section .content-boxed .slide-number
{
position: relative;
color: #fff;
font-size: 60px;
font-weight: 400;
line-height: 1em;
padding-top: 25px;
margin-bottom: 220px;
display: inline-block;
border-top: 5px solid #73aae5;
font-family: 'Inter',sans-serif;
}
.banner-section .content-boxed .title
{
position: relative;
color: #fff;
font-weight: 400;
line-height: 1.7em;
opacity: 0;
font-size: 18px;
letter-spacing: 2px;
transform: scaleY(0);
letter-spacing: 5px;
transform-origin: top;
text-transform: uppercase;
-webkit-transition: all 1000ms ease;
-moz-transition: all 100ms ease;
-ms-transition: all 1000ms ease;
-o-transition: all 1000ms ease;
transition: all 1000ms ease;
}
.banner-section .active .content-boxed .title
{
opacity: 1;
transform: scaleY(1);
-webkit-transition-delay: 300ms;
-moz-transition-delay: 300ms;
-ms-transition-delay: 300ms;
-o-transition-delay: 300ms;
transition-delay: 300ms;
}
.banner-section .content-boxed h1
{
position: relative;
color: #fff;
font-weight: 400;
line-height: 1em;
opacity: 0;
margin-top: 40px;
transform: scaleY(0);
transform-origin: top;
-webkit-transition: all 1000ms ease;
-moz-transition: all 100ms ease;
-ms-transition: all 1000ms ease;
-o-transition: all 1000ms ease;
transition: all 1000ms ease;
}
.banner-section .active .content-boxed h1
{
opacity: 1;
transform: scaleY(1);
-webkit-transition-delay: 600ms;
-moz-transition-delay: 600ms;
-ms-transition-delay: 600ms;
-o-transition-delay: 600ms;
transition-delay: 600ms;
}
.banner-section .owl-dots
{
position: absolute;
right: 80px;
top: 300px;
}
.banner-section .owl-dots .owl-dot
{
position: relative;
width: 14px;
height: 14px;
margin-bottom: 25px;
border-radius: 50px;
background-color: rgba(255,255,255,.35);
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.banner-section .owl-dots .owl-dot.active, .banner-section .owl-dots .owl-dot:hover
{
background-color: #fff;
}
.banner-section .owl-nav
{
display: none;
}/***
====================================================================
About Section
====================================================================
***/
.about-section
{
position: relative;
padding: 150px 0 110px;
}
.about-section .section-year-title
{
position: absolute;
left: 50px;
top: 170px;
color: #999;
font-size: 14px;
text-transform: uppercase;
transform: rotate(-90deg);
}
.about-section .image-column
{
position: relative;
}
.about-section .image-column .inner-column
{
position: relative;
}
.about-section .image-column .image
{
position: relative;
display: inline-block;
}
.about-section .image-column .inner-column .pattern-layer
{
position: absolute;
right: 70px;
top: 75px;
width: 336px;
height: 336px;
}
.about-section .content-column
{
position: relative;
}
.about-section .content-column .sec-title
{
margin-bottom: 30px;
}
.about-section .content-column .inner-column
{
position: relative;
padding-left: 90px;
}
.about-section .content-column .bold-text
{
position: relative;
color: #666;
font-size: 24px;
line-height: 1.4em;
margin-bottom: 50px;
}
.about-section .content-column p
{
position: relative;
color: #666;
font-size: 14px;
line-height: 1.8em;
margin-bottom: 80px;
}/***
====================================================================
Fluid Section One
====================================================================
***/
.fluid-section-one
{
position: relative;
overflow: hidden;
padding: 0 0 0;
}
.fluid-section-one .pattern-layer
{
position: absolute;
left: -200px;
top: 0;
width: 336px;
height: 336px;
}
.fluid-section-one .outer-container
{
position: relative;
min-height: 250px;
}
.fluid-section-one .image-column
{
position: absolute;
right: 0;
top: 0;
width: 44%;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.fluid-section-one .image-column .image-box
{
position: relative;
display: none;
}
.fluid-section-one .image-column .image-box img
{
position: relative;
display: block;
width: 100%;
}
.fluid-section-one .content-column
{
position: relative;
float: left;
width: 50%;
z-index: 1;
}
.fluid-section-one .content-column .inner-column
{
position: relative;
max-width: 600px;
width: 100%;
float: right;
padding: 0 100px 0 15px;
}
.fluid-section-one .content-column .blocks-outer
{
position: relative;
}/* Service Box */
.service-box
{
position: relative;
margin-bottom: 30px;
}
.service-box:last-child
{
margin-bottom: 0;
}
.service-box .inner-box
{
position: relative;
padding: 30px 50px;
border: 1px solid #d9d9d9;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.service-box .inner-box:before
{
position: absolute;
content: '';
left: -1px;
top: 0;
bottom: 0;
width: 5px;
opacity: 0;
background-color: #73aae5;
transform: scale(1,.2);
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.service-box .inner-box:hover::before
{
opacity: 1;
transform: scale(1,1);
}
.service-box .inner-box:hover
{
box-shadow: 0 10px 20px rgba(0,0,0,.1);
}
.service-box .inner-box .content
{
position: relative;
padding-left: 120px;
}
.service-box .inner-box .content .icon
{
position: absolute;
left: 0;
top: 15px;
color: #000;
font-size: 54px;
line-height: 1em;
display: inline-block;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.service-box .inner-box:hover .content .icon
{
-webkit-transform: scale(-1) rotate(180deg);
-moz-transform: scale(-1) rotate(180deg);
-ms-transform: scale(-1) rotate(180deg);
-o-transform: scale(-1) rotate(180deg);
transform: scale(-1) rotate(180deg);
}
.service-box .inner-box .content h5
{
position: relative;
font-weight: 400;
line-height: 1.3em;
text-transform: uppercase;
}
.service-box .inner-box .content h5 a
{
position: relative;
color: #000;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.service-box .inner-box:hover .content h5 a
{
color: #000;
text-decoration: underline;
}
.service-box .inner-box .content p
{
position: relative;
color: #666;
line-height: 1.9em;
margin-top: 10px;
font-size: 14px;
margin-bottom: 0;
}/***
====================================================================
Projects Section
====================================================================
***/
.projects-section
{
position: relative;
padding: 150px 0 0;
}
.projects-section .sec-title .projects
{
position: relative;
color: #666;
font-size: 18px;
padding-top: 15px;
display: inline-block;
text-transform: uppercase;
}
.projects-section .outer-container
{
position: relative;
overflow: hidden;
}
.projects-section .owl-dots
{
position: relative;
text-align: center;
}
.projects-section .owl-dots .owl-dot
{
position: relative;
width: 10px;
height: 10px;
margin: 0 10px;
margin-top: 60px;
border-radius: 50px;
display: inline-block;
background-color: #ccc;
transition: all 300ms ease;
-moz-transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.projects-section .owl-dots .owl-dot:hover, .projects-section .owl-dots .owl-dot.active
{
background-color: #73aae5;
}
.projects-section .owl-nav
{
display: none;
}/* Gallery Block */
.gallery-block
{
position: relative;
margin-bottom: 30px;
}
.gallery-block .inner-box
{
position: relative;
}
.gallery-block .inner-box .image
{
position: relative;
}
.gallery-block .inner-box .image .arrow
{
position: absolute;
right: 40px;
top: 30px;
z-index: 2;
opacity: 0;
color: #000;
font-size: 48px;
line-height: 1em;
display: inline-block;
transition: all 300ms ease;
-moz-transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.gallery-block .inner-box:hover .image .arrow
{
opacity: 1;
}
.gallery-block .inner-box .image:before
{
position: absolute;
content: '';
left: 0;
height: 60%;
right: 0;
bottom: 0;
z-index: 1;
opacity: .6;
background-image: -ms-linear-gradient(top,rgba(255,255,255,0) 0%,#000 100%);
background-image: -moz-linear-gradient(top,rgba(255,255,255,0) 0%,#000 100%);
background-image: -o-linear-gradient(top,rgba(255,255,255,0) 0%,#000 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,0)),color-stop(100,#000));
background-image: -webkit-linear-gradient(top,rgba(255,255,255,0) 0%,#000 100%);
background-image: linear-gradient(to bottom,rgba(255,255,255,0) 0%,#000 100%);
}
.gallery-block .inner-box .image img
{
position: relative;
width: 100%;
display: block;
}
.gallery-block .inner-box .image .overlay-box
{
position: absolute;
left: 0;
bottom: 0;
right: 0;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.gallery-block .inner-box .image .hover-color-layer
{
position: absolute;
content: '';
left: 0;
top: 0;
width: 0%;
height: 100%;
z-index: 1;
background-color: #73aae5;
transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
}
.gallery-block .inner-box:hover .image .hover-color-layer
{
width: 100%;
}
.gallery-block .inner-box .image .overlay-box .content
{
position: relative;
z-index: 2;
padding: 0 20px 40px 40px;
}
.gallery-block .inner-box .image .overlay-box .category
{
position: relative;
font-size: 14px;
color: #fff;
text-transform: uppercase;
transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
}
.gallery-block .inner-box:hover .image .overlay-box .category
{
color: #000;
}
.gallery-block .inner-box:hover .image .overlay-box h3 a
{
color: #000;
}
.gallery-block .inner-box .image .overlay-box h3
{
position: relative;
font-weight: 400;
line-height: 1.2em;
margin-top: 12px;
}
.gallery-block .inner-box .image .overlay-box h3 a
{
position: relative;
color: #fff;
transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
}/***
====================================================================
Testimonial Section
====================================================================
***/
.testimonial-section
{
position: relative;
padding-top: 120px;
}
.testimonial-section.style-two
{
margin-top: 160px;
background-color: #eef2f2;
}
.testimonial-section .sec-title
{
margin-bottom: 70px;
}
.testimonial-section .owl-nav
{
position: absolute;
right: 0;
top: -105px;
}
.testimonial-section .owl-nav .owl-prev, .testimonial-section .owl-nav .owl-next
{
position: relative;
color: #999;
font-size: 36px;
margin-left: 30px;
font-weight: 300;
display: inline-block;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.testimonial-section .owl-nav .owl-prev:hover, .testimonial-section .owl-nav .owl-next:hover
{
color: #000;
}
.testimonial-block
{
position: relative;
margin-bottom: 30px;
}
.testimonial-block .inner-box
{
position: relative;
padding: 25px 32px 35px;
border: 1px solid #e1e1e1;
background-color: #fff;
}
.testimonial-block .inner-box:before
{
position: absolute;
content: '';
left: 0;
top: 0;
right: 0;
height: 5px;
opacity: 0;
transform: scale(.3,1);
background-color: #73aae5;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.testimonial-block .inner-box:hover::before
{
opacity: 1;
transform: scale(1,1);
}
.testimonial-block .inner-box .quote
{
position: relative;
font-size: 60px;
color: #ffe1a0;
line-height: 1em;
text-align: right;
margin-right: -10px;
}
.testimonial-block .inner-box .author
{
position: relative;
color: #263a4f;
font-size: 18px;
font-weight: 500;
margin-top: 0;
font-family: 'Heebo',sans-serif;
}
.testimonial-block .inner-box .author span
{
position: relative;
font-weight: 400;
color: #8d9aa8;
font-size: 14px;
}
.testimonial-block .inner-box p
{
position: relative;
color: #8d9aa8;
font-size: 14px;
line-height: 1.8em;
margin-top: 15px;
margin-bottom: 0;
}/***
====================================================================
Sponsors Section
====================================================================
***/
.sponsors-section
{
position: relative;
padding: 60px 0 130px;
}
.sponsors-section.style-two
{
background-color: #eef2f2;
padding-bottom: 90px;
}
.sponsors-section .owl-nav, .sponsors-section .owl-dots
{
display: none;
}
.sponsors-section .image-box
{
position: relative;
opacity: .25;
filter: grayscale(100%);
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.sponsors-section .image-box:hover
{
opacity: 1;
filter: grayscale(0%);
}/***
====================================================================
Pricing Section
====================================================================
***/
.pricing-section
{
position: relative;
overflow: hidden;
padding-top: 130px;
background-color: #eef2f2;
}
.pricing-section .inner-container
{
position: relative;
padding-bottom: 100px;
border-bottom: 1px solid #e2e2e2;
}
.pricing-section .lower-text
{
position: relative;
color: #666;
font-size: 18px;
font-weight: 400;
text-align: center;
margin-top: 60px;
}
.pricing-section .lower-text a
{
position: relative;
color: #09f;
font-size: 18px;
text-decoration: underline;
}
.pricing-section .pricing-tabs .tabs-content
{
position: relative;
border-radius: 0;
background-color: #fff;
}
.pricing-section .pricing-tabs .tabs-content .tab
{
position: relative;
display: none;
transition: all 600ms ease;
-moz-transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
transform: translateY(60px);
}
.pricing-section .pricing-tabs .tabs-content .tab .content>.row
{
margin: 0;
}
.pricing-section .pricing-tabs .tabs-content .tab.active-tab
{
display: block;
transform: translateY(0);
}
.pricing-section .price-block
{
padding: 0;
float: left;
border-right: 1px solid #e6e9ec;
}
.pricing-section .price-block:last-child
{
border-right: 0;
}
.pricing-tabs
{
position: relative;
}
.pricing-tabs .title-column
{
position: relative;
text-align: center;
margin-bottom: 45px;
}
.pricing-tabs .tab-buttons
{
position: relative;
margin-top: 13px;
text-align: center;
display: inline-block;
}
.pricing-tabs .tab-buttons .tab-btn
{
position: relative;
color: #999;
font-size: 14px;
font-weight: 400;
float: left;
cursor: pointer;
margin: 0 20px;
line-height: 24px;
text-transform: capitalize;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-tabs .tab-buttons .tab-btn.monthly:before
{
position: absolute;
content: '';
right: -44px;
top: 0;
width: 24px;
height: 24px;
z-index: 1;
display: inline-block;
}
.pricing-tabs .tab-buttons .tab-btn.yearly:before
{
position: absolute;
content: '';
left: -44px;
top: 0;
width: 24px;
height: 24px;
display: inline-block;
}
.pricing-tabs .tab-buttons .boll
{
position: relative;
width: 46px;
height: 24px;
padding: 4px 3px 2px;
border-radius: 50px;
float: left;
text-align: left;
background-color: #690;
box-shadow: 0 10px 15px rgba(0,0,0,.15);
}
.pricing-tabs .tab-buttons .boll .round
{
position: relative;
top: -1px;
width: 16px;
height: 16px;
border-radius: 50px;
display: inline-block;
background-color: #f6f8f4;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.pricing-tabs .tab-buttons .boll .round.boll-right
{
transform: translateX(24px);
}
.pricing-tabs .tab-buttons .tab-btn:hover, .pricing-tabs .tab-buttons .tab-btn.active-btn
{
color: #000;
}
.price-block
{
position: relative;
}
.price-block .inner-box
{
position: relative;
padding: 35px 30px 45px 45px;
}
.price-block .inner-box .title
{
position: relative;
color: #999;
font-size: 14px;
letter-spacing: 1px;
text-transform: uppercase;
}
.price-block .inner-box .price
{
position: relative;
color: #690;
font-size: 36px;
font-weight: 400;
line-height: 1.3em;
margin-top: 18px;
margin-bottom: 15px;
}
.price-block .inner-box .price span
{
position: relative;
color: #000;
font-size: 20px;
}
.price-block .inner-box .text
{
position: relative;
color: #666;
font-size: 14px;
line-height: 1.8em;
padding-bottom: 25px;
margin-bottom: 28px;
border-bottom: 1px dashed #ccc;
}
.price-block .inner-box .price-list
{
position: relative;
min-height: 210px;
}
.price-block .inner-box .price-list li
{
position: relative;
color: #000;
font-size: 16px;
margin-bottom: 14px;
padding-left: 30px;
}
.price-block .inner-box .price-list li:before
{
position: absolute;
content: 'R';
left: 0;
top: 0;
color: #690;
font-size: 16px;
font-family: 'ElegantIcons';
}
.price-block .inner-box .price-list li:last-child
{
margin-bottom: 0;
}/***
====================================================================
Press Section
====================================================================
***/
.press-section
{
position: relative;
overflow: hidden;
padding-top: 130px;
padding-bottom: 170px;
background-color: #eef2f2;
}
.press-section .sec-title .blogs
{
position: relative;
color: #666;
font-size: 18px;
padding-top: 15px;
display: inline-block;
text-transform: uppercase;
}
.press-image-block
{
position: relative;
margin-bottom: 30px;
}
.press-image-block .inner-box
{
position: relative;
}
.press-image-block .inner-box .image
{
position: relative;
}
.press-image-block .inner-box .image img
{
position: relative;
width: 100%;
display: block;
}
.press-section .press-block:nth-child(3) .inner-box .post-date
{
margin-bottom: 103px;
}/* Press Block */
.press-block
{
position: relative;
margin-bottom: 30px;
}
.press-block .inner-box
{
position: relative;
padding: 37px 45px;
background-color: #fff;
}
.press-block .inner-box .post-date
{
position: relative;
color: #ccc;
font-size: 72px;
font-weight: 400;
line-height: 80px;
margin-bottom: 70px;
}
.press-block .inner-box .post-date span
{
position: relative;
color: #999;
font-weight: 400;
font-size: 12px;
display: block;
line-height: 1em;
margin-top: 5px;
text-transform: uppercase;
}
.press-block .inner-box .title
{
position: relative;
color: #cbaf71;
font-size: 14px;
font-weight: 400;
text-transform: uppercase;
}
.press-block .inner-box h4
{
position: relative;
color: #000;
font-weight: 400;
line-height: 1.4em;
margin-top: 12px;
}
.press-block .inner-box h4 a
{
position: relative;
color: #000;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.press-block .inner-box h4 a:hover
{
color: #cbaf71;
}/***
====================================================================
Main Footer
====================================================================
***/
.main-footer
{
position: relative;
padding-top: 120px;
}
.main-footer.style-two
{
border-top: 1px solid #dbdbdb;
}
.main-footer .outer-container
{
position: relative;
padding: 0 40px;
}
.main-footer .footer-column
{
position: relative;
width: 21%;
float: left;
padding: 0 15px;
margin-bottom: 30px;
}
.main-footer .footer-column:first-child
{
width: 15%;
}
.main-footer h3
{
position: relative;
font-weight: 400;
color: #000;
font-size: 30px;
line-height: 1.3em;
margin-bottom: 28px;
}
.main-footer .contact-widget ul li
{
position: relative;
color: #666;
font-size: 14px;
max-width: 300px;
line-height: 1.9em;
margin-bottom: 15px;
text-transform: uppercase;
}
.main-footer .contact-widget ul li a
{
position: relative;
color: #666;
overflow-wrap: break-word;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-footer .contact-widget ul li a:hover
{
color: #000;
}/* Link Widget */
.main-footer .link-widget ul li
{
position: relative;
color: #666;
font-size: 14px;
margin-bottom: 10px;
text-transform: uppercase;
}
.main-footer .link-widget ul li a
{
position: relative;
color: #666;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-footer .link-widget ul li a:hover
{
color: #000;
padding-left: 15px;
}
.main-footer .footer-bottom
{
position: relative;
padding: 30px 0;
margin-top: 85px;
border-top: 1px solid #f0f0f0;
}/* Copyright Column */
.main-footer .copy-column
{
position: relative;
}
.main-footer .copy-column .copyright
{
position: relative;
color: #999;
font-size: 14px;
font-weight: 400;
}
.main-footer .copy-column .copyright a
{
position: relative;
}
.main-footer .copy-column .copyright span
{
position: relative;
color: #000;
font-weight: 700;
text-transform: uppercase;
}
.main-footer .copy-column .copyright i
{
position: relative;
color: #f53400;
font-size: 16px;
}/* Pages Column */
.main-footer .pages-column
{
position: relative;
}
.main-footer .pages-column .page-nav
{
position: relative;
text-align: center;
}
.main-footer .pages-column .page-nav li
{
position: relative;
margin: 0 6px;
display: inline-block;
}
.main-footer .pages-column .page-nav li a
{
position: relative;
color: #000;
font-size: 14px;
text-transform: uppercase;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-footer .pages-column .page-nav li a:hover
{
color: #0cf;
}/* Language Column */
.main-footer .language-column
{
position: relative;
}
.main-footer .language-column ul
{
position: relative;
text-align: right;
}
.main-footer .language-column ul li
{
position: relative;
margin-left: 30px;
display: inline-block;
}
.main-footer .language-column ul li a
{
position: relative;
color: #8d9aa8;
font-size: 14px;
text-transform: uppercase;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.main-footer .language-column ul li a:hover
{
color: #263a4f;
}/***
====================================================================
Page Banner Section
====================================================================
***/
.page-banner-section
{
position: relative;
padding: 600px 0 80px;
background-attachment: fixed;
background-size: cover;
}
.page-banner-section .auto-container
{
position: relative;
}
.page-banner-section .title
{
position: relative;
color: #fff;
font-weight: 400;
font-size: 18px;
letter-spacing: 1px;
margin-bottom: 30px;
line-height: 1.6em;
text-transform: uppercase;
}
.page-banner-section h1
{
position: relative;
color: #fff;
font-weight: 400;
line-height: 1.1em;
text-transform: capitalize;
}
.page-banner-section .mail-box
{
position: absolute;
right: 15px;
bottom: 10px;
color: #fff;
font-size: 14px;/* text-transform:uppercase; */
}
.page-banner-section.style-two
{
padding-top: 270px;
}
.page-banner-section.style-two .title
{
padding-top: 35px;
margin-bottom: 310px;
}
.page-banner-section.style-two .title:before
{
position: absolute;
content: '';
left: 0;
top: 0;
width: 80px;
height: 4px;
border-radius: 2px;
background-color: #73aae5;
}
.page-banner-section.style-two .banner-year
{
position: absolute;
left: 60px;
color: #fff;
font-size: 14px;
line-height: 1em;
text-transform: uppercase;
}/***
====================================================================
Team Section
====================================================================
***/
.team-section
{
position: relative;
padding: 100px 0 120px;
}
.team-section .row
{
margin: 0 -35px;
}
.team-section .team-block
{
padding: 0 35px;
}
.team-block
{
position: relative;
margin-bottom: 30px;
}
.team-block .inner-box
{
position: relative;
}
.team-block .inner-box .image
{
position: relative;
border-radius: 3px;
overflow: hidden;
background-color: #111;
}
.team-block .inner-box .image img
{
position: relative;
width: 100%;
display: block;
transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
}
.team-block .inner-box:hover .image img
{
opacity: .7;
}
.team-block .inner-box .image .social-icons
{
position: absolute;
right: -250px;
bottom: 12px;
border-radius: 2px;
padding: 10px 20px 8px;
background-color: #fff;
transition: all 600ms ease;
-webkit-transition: all 600ms ease;
-ms-transition: all 600ms ease;
-o-transition: all 600ms ease;
}
.team-block .inner-box:hover .image .social-icons
{
right: 12px;
}
.team-block .inner-box .image .social-icons li
{
position: relative;
margin-right: 15px;
display: inline-block;
}
.team-block .inner-box .image .social-icons li:last-child
{
margin-right: 0;
}
.team-block .inner-box .image .social-icons li a
{
position: relative;
color: #999;
font-size: 16px;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.team-block .inner-box .image .social-icons li a:hover
{
color: #000;
}
.team-block .inner-box .lower-content
{
position: relative;
padding: 25px 0 0;
}
.team-block .inner-box .lower-content h4
{
position: relative;
font-weight: 400;
line-height: 1.3em;
font-size: 24px;
}
.team-block .inner-box .lower-content h4 a
{
position: relative;
color: #000;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.team-block .inner-box:hover .lower-content h4 a
{
color: #caac6b;
}
.team-block .inner-box .lower-content .designation
{
position: relative;
color: #666;
font-size: 14px;
margin-top: 6px;
}/***
====================================================================
Page Title Section Two
====================================================================
***/
.page-title-two-section
{
position: relative;
padding: 240px 0 90px;
}
.page-title-two-section h1
{
position: relative;
font-weight: 400;
font-size: 60px;
line-height: 1em;
color: #000;
text-transform: capitalize;
}
.page-title-two-section .page-breadcrumb
{
position: relative;
margin-bottom: 50px;
}
.page-title-two-section .page-breadcrumb li
{
position: relative;
color: #000;
font-size: 18px;
padding-right: 15px;
margin-right: 10px;
display: inline-block;
text-transform: uppercase;
}
.page-title-two-section .page-breadcrumb li:before
{
position: absolute;
content: '/';
right: -3px;
top: 0;
color: #999;
}
.page-title-two-section .page-breadcrumb li:last-child
{
padding-right: 0;
margin-right: 0;
}
.page-title-two-section .page-breadcrumb li:last-child::before
{
display: none;
}
.page-title-two-section .page-breadcrumb li a
{
position: relative;
color: #999;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.page-title-two-section .page-breadcrumb li a:hover
{
color: #000;
}/***
====================================================================
Gallery Section
====================================================================
***/
.gallery-page-section
{
position: relative;
padding: 0 0 10px;
margin-top: -130px;
}
.gallery-page-section .outer-section
{
position: relative;
padding: 0 0;
overflow: hidden;
}
.gallery-page-section .filters
{
margin-bottom: 150px;
}
.gallery-page-section .filters .filter-tabs
{
position: relative;
text-align: right;
}
.gallery-page-section .filters li
{
position: relative;
display: inline-block;
color: #999;
padding: 0 0;
cursor: pointer;
font-size: 16px;
font-weight: 400;
margin-left: 40px;
padding-bottom: 5px;
text-transform: uppercase;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.gallery-page-section .filters .filter.active, .gallery-page-section .filters .filter:hover
{
color: #000;
}
.gallery-page-section .gallery-item
{
margin-bottom: 40px;
}
.gallery-page-section .row
{
margin: 0 -2px;
}
.gallery-page-section .gallery-block
{
padding: 0 2px;
margin-bottom: 4px;
}
.gallery-block.mix
{
display: none;
}/***
====================================================================
Project Detail Section
====================================================================
***/
.project-detail-section
{
position: relative;
padding: 120px 0 100px;
}
.project-detail-section .upper-box
{
position: relative;
margin-bottom: 80px;
}
.project-detail-section .upper-box .back-projects
{
position: relative;
color: #000;
font-size: 14px;
margin-bottom: 55px;
display: inline-block;
text-transform: uppercase;
}
.project-detail-section .upper-box .back-projects .icon
{
position: relative;
top: 4px;
margin-right: 10px;
font-size: 20px;
line-height: 1em;
}
.project-detail-section .upper-box ul
{
position: relative;
}
.project-detail-section .upper-box ul li
{
position: relative;
color: #999;
font-size: 16px;
margin-bottom: 8px;
}
.project-detail-section .upper-box ul li span
{
position: relative;
color: #000;
}
.project-detail-section h3
{
position: relative;
color: #000;
margin-bottom: 40px;
text-transform: capitalize;
}
.project-detail-section p
{
position: relative;
color: #666;
font-size: 18px;
margin-bottom: 80px;
text-transform: capitalize;
}
.project-detail-section .carousel-box
{
position: relative;
}
.project-detail-section .carousel-box .owl-dots
{
position: absolute;
left: 0;
bottom: 30px;
right: 0;
text-align: center;
}
.project-detail-section .carousel-box .owl-dots .owl-dot
{
position: relative;
width: 9px;
height: 9px;
margin: 0 10px;
border-radius: 50px;
display: inline-block;
background-color: #a19b97;
transition: all 300ms ease;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
}
.project-detail-section .carousel-box .owl-dots .owl-dot.active, .project-detail-section .carousel-box .owl-dots .owl-dot:hover
{
background-color: #fff;
}
.project-detail-section .carousel-box .owl-nav
{
position: absolute;
left: -60px;
top: 50%;
right: -60px;
margin-top: -32px;
}
.project-detail-section .carousel-box .owl-nav .owl-prev
{
position: absolute;
left: 0;
color: #8d9aa8;
font-size: 60px;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.project-detail-section .carousel-box .owl-nav .owl-next
{
position: absolute;
right: 0;
color: #8d9aa8;
font-size: 60px;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.project-detail-section .carousel-box .owl-nav .owl-prev:hover, .project-detail-section .carousel-box .owl-nav .owl-next:hover
{
color: #000;
}/***
====================================================================
Reservation Section
====================================================================
***/
.reservation-section
{
position: relative;
padding-bottom: 190px;
}
.reservation-section .inner-container
{
position: relative;
z-index: 1;
padding: 45px 50px 30px;
border: 1px solid #dfdfdf;
background-color: #fff;
}/* Reservation Form */
.reservation-form .form-group
{
position: relative;
margin-bottom: 30px;
}
.reservation-form .form-group input[type="text"], .reservation-form .form-group input[type="password"], .reservation-form .form-group input[type="tel"], .reservation-form .form-group input[type="email"], .reservation-form .form-group select
{
position: relative;
display: block;
width: 100%;
color: #999;
line-height: 28px;
padding: 10px 0;
height: 50px;
font-size: 16px;
border-radius: 0;
background-color: #fff;
border-bottom: 1px solid #e2e2e2;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.reservation-form .form-group input[type="text"]:focus, .reservation-form .form-group input[type="password"]:focus, .reservation-form .form-group input[type="tel"]:focus, .reservation-form .form-group input[type="email"]:focus, .reservation-form .form-group select:focus, .reservation-form .form-group textarea:focus
{
border-color: #ffe1a0;
}
.reservation-form .form-group textarea
{
position: relative;
display: block;
width: 100%;
line-height: 24px;
padding: 15px 0;
color: #999;
height: 170px;
resize: none;
font-size: 16px;
border-radius: 0;
background-color: #fff;
border-bottom: 1px solid #e2e2e2;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.reservation-form .theme-btn
{
cursor: pointer;
font-size: 14px;
letter-spacing: 0;
margin-top: 20px;
}/* Contact Form */
.contact-form .form-group
{
position: relative;
margin-bottom: 20px;
}
.contact-form .form-group input[type="text"], .contact-form .form-group input[type="password"], .contact-form .form-group input[type="tel"], .contact-form .form-group input[type="email"], .contact-form .form-group select
{
position: relative;
display: block;
width: 100%;
color: #000;
line-height: 28px;
padding: 10px 0;
height: 50px;
font-size: 16px;
border-radius: 0;
background-color: #fff;
border-bottom: 1px solid #e2e2e2;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-form .form-group input[type="text"]:focus, .contact-form .form-group input[type="password"]:focus, .contact-form .form-group input[type="tel"]:focus, .contact-form .form-group input[type="email"]:focus, .contact-form .form-group select:focus, .contact-form .form-group textarea:focus
{
border-color: #111;
}
.contact-form .form-group textarea
{
position: relative;
display: block;
width: 100%;
line-height: 24px;
padding: 15px 0;
color: #000;
height: 160px;
resize: none;
font-size: 16px;
border-radius: 0;
background-color: #fff;
border-bottom: 1px solid #e2e2e2;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-form .theme-btn
{
cursor: pointer;
font-size: 14px;
letter-spacing: 0;
margin-top: 22px;
}
.contact-form input.error, .contact-form select.error, .contact-form textarea.error
{
border-color: #f00!important;
}
.contact-form label.error
{
display: block;
line-height: 24px;
padding: 5px 0 0;
margin: 0;
text-transform: uppercase;
font-size: 12px;
color: #f00;
font-weight: 500;
}
.new-projects-section
{
position: relative;
background-color: #eeeef3;
}
.new-projects-section .image-layer
{
position: absolute;
right: 0;
top: 0;
width: 50%;
height: 100%;
}
.new-projects-section .post
{
position: relative;
padding: 50px 0;
}
.new-projects-section a
{
position: relative;
color: #000;
font-size: 18px;
font-weight: 600;
letter-spacing: 10px;
text-transform: uppercase;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.new-projects-section .post.next a
{
color: #fff;
}
.new-projects-section a:hover
{
color: #000;
}/***
====================================================================
Sidebar Page Container
====================================================================
***/
.sidebar-page-container
{
position: relative;
padding: 20px 0 90px;
}
.sidebar-page-container.style-two
{
padding-top: 170px;
padding-bottom: 0;
}
.sidebar-page-container .content-side, .sidebar-page-container .sidebar-side
{
margin-bottom: 30px;
}
.sidebar-page-container .sidebar-side .padding-left
{
padding-left: 70px;
}
.sticky-top
{
top: 110px;
z-index: 1;
}
.sidebar-widget
{
position: relative;
margin-bottom: 55px;
}
.sidebar-widget:last-child
{
margin-bottom: 0;
}
.sidebar-title
{
position: relative;
margin-bottom: 25px;
}
.sidebar-title h6
{
position: relative;
color: #999;
font-weight: 400;
font-size: 14px;
text-transform: uppercase;
}/* Search Box Widget */
.sidebar .search-box .form-group
{
position: relative;
margin: 0;
}
.sidebar .search-box .form-group input[type="text"], .sidebar .search-box .form-group input[type="search"]
{
position: relative;
line-height: 30px;
padding: 10px 50px 10px 20px;
border: 1px solid #c0c0c0;
background: #fff;
display: block;
font-size: 14px;
width: 100%;
height: 50px;
color: #8d9aa8;
border-radius: 0;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.sidebar .search-box .form-group button
{
position: absolute;
right: 0;
top: 0;
height: 50px;
width: 50px;
display: block;
font-size: 16px;
color: #222;
font-weight: 300;
line-height: 52px;
background: none;
border-radius: 0;
cursor: pointer;
}
.sidebar .search-box .form-group input::-webkit-input-placeholder
{
color: #333;
}/* Post Widget */
.sidebar .popular-posts .widget-content
{
position: relative;
}
.sidebar .popular-posts .post
{
position: relative;
font-size: 16px;
color: #000;
margin-bottom: 12px;
}
.sidebar .popular-posts .post:last-child
{
margin-bottom: 0;
}
.sidebar .popular-posts .post .text
{
position: relative;
font-size: 16px;
font-weight: 400;
color: #000;
line-height: 1.7em;
}
.sidebar .popular-posts .post .text a
{
color: #000;
transition: all .3s ease;
-moz-transition: all .3s ease;
-webkit-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
}
.sidebar .popular-posts .post a:hover
{
text-decoration: underline;
}/* Recent Comment */
.recent-comment .comment
{
position: relative;
color: #000;
font-size: 16px;
line-height: 1.6em;
margin-bottom: 12px;
}
.recent-comment .comment span
{
position: relative;
color: #999;
}
.recent-comment .comment a
{
position: relative;
color: #000;
text-decoration: underline;
}
.recent-comment .comment i
{
position: relative;
margin-right: 6px;
font-size: 24px;
line-height: 1em;
}/* Categories Widget */
.categories-widget ul li
{
position: relative;
margin-bottom: 7px;
}
.categories-widget ul li a
{
position: relative;
color: #000;
font-size: 16px;
}
.categories-widget ul li a:hover
{
text-decoration: underline;
}/* Tags Widget */
.tags-widget ul li
{
position: relative;
margin-bottom: 7px;
display: inline-block;
}
.tags-widget ul li a
{
position: relative;
color: #000;
font-size: 16px;
}
.tags-widget ul li a:hover
{
text-decoration: underline;
}
.news-block
{
position: relative;
margin-bottom: 50px;
}
.news-block .inner-box
{
position: relative;
}
.news-block .inner-box .image
{
position: relative;
}
.news-block .inner-box .image img
{
position: relative;
width: 100%;
display: block;
}
.news-block .inner-box .lower-content
{
position: relative;
padding-top: 25px;
}
.news-block .inner-box .lower-content h3
{
position: relative;
font-weight: 400;
line-height: 1.3em;
}
.news-block .inner-box .lower-content h3 a
{
position: relative;
color: #000;
}
.news-block .inner-box .lower-content .post-info
{
position: relative;
color: #999;
font-size: 14px;
margin-top: 10px;
}
.news-block .inner-box .lower-content .post-info span
{
position: relative;
color: #000;
}
.news-block .inner-box .lower-content p
{
position: relative;
color: #666;
font-size: 14px;
font-weight: 400;
line-height: 1.9em;
margin-top: 18px;
margin-bottom: 0;
}
.news-block.style-two .inner-box .lower-content h3
{
font-size: 24px;
}/***
====================================================================
Styled Pagination
====================================================================
***/
.pagination-outer
{
text-align: center;
margin-top: 60px;
}
.styled-pagination
{
position: relative;
display: inline-block;
}
.styled-pagination li
{
position: relative;
color: #000;
font-size: 16px;
font-weight: 400;
margin: 0 8px 0;
display: inline-block;
}
.styled-pagination li a
{
position: relative;
color: #000;
font-size: 16px;
font-weight: 400;
display: inline-block;
background: none;
transition: all .3s ease;
-moz-transition: all .3s ease;
-webkit-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
}
.styled-pagination li.active a, .styled-pagination li:hover a
{
color: #f90;
}
.styled-pagination li.prev a, .styled-pagination li.next a
{
top: 6px;
color: #ccc;
font-size: 24px;
line-height: 1em;
transition: all .3s ease;
-moz-transition: all .3s ease;
-webkit-transition: all .3s ease;
-ms-transition: all .3s ease;
-o-transition: all .3s ease;
}
.styled-pagination li.prev a:hover, .styled-pagination li.next a:hover
{
color: #111;
}
.blog-detail
{
position: relative;
}
.blog-detail .inner-box
{
position: relative;
}
.blog-detail .inner-box .bold-text
{
position: relative;
color: #000;
font-size: 24px;
font-weight: 700;
line-height: 1.5em;
margin-bottom: 20px;
text-indent: 2em;
}
.blog-detail .inner-box p
{
position: relative;
color: #666;
font-size: 16px;
font-weight: 400;
line-height: 1.7em;
margin-bottom: 18px;
text-indent: 2em;
}
.blog-detail .inner-box .image
{
position: relative;
margin-top: 50px;
margin-bottom: 50px;
}
.blog-detail .inner-box .image img
{
position: relative;
width: 100%;
display: block;
}
.blog-detail .inner-box h4
{
position: relative;
color: #000;
font-size: 24px;
font-weight: 700;
margin-bottom: 20px;
}
.blog-detail .inner-box blockquote
{
position: relative;
margin: 80px 0 70px;
padding-left: 105px;
}
.blog-detail .inner-box blockquote .blockquote-text
{
position: relative;
color: #000;
font-weight: 400;
font-size: 24px;
line-height: 1.5em;
}
.blog-detail .inner-box blockquote .blockquote-text .quote
{
position: absolute;
left: -20px;
top: -10px;
color: #000;
font-size: 16px;
line-height: 1em;
}/*post share options*/
.blog-detail .inner-box .post-share-options
{
position: relative;
margin-top: 70px;
padding-bottom: 60px;
border-bottom: 1px solid #ddd;
}
.blog-detail .inner-box .post-share-options .tags a
{
position: relative;
color: #999;
font-size: 14px;
font-weight: 400;
line-height: 1em;
margin-right: 4px;
padding: 10px 20px;
display: inline-block;
border: 1px solid #d7d7d7;
text-transform: capitalize;
transition: all 500ms ease;
-moz-transition: all 500ms ease;
-webkit-transition: all 500ms ease;
-ms-transition: all 500ms ease;
-o-transition: all 500ms ease;
}
.blog-detail .inner-box .post-share-options .tags a:hover
{
color: #111;
border-color: #ffe1a0;
background-color: #ffe1a0;
}/* Related Projects */
.related-projects
{
position: relative;
margin-top: 75px;
}
.related-projects .title-box
{
position: relative;
margin-bottom: 35px;
}
.related-projects .title-box h3
{
position: relative;
color: #000;
font-weight: 400;
line-height: 1.3em;
font-size: 30px;
}
.sidebar-page-container .lower-section
{
position: relative;
margin-top: 40px;
padding: 120px 0 140px;
background-color: #eef1f3;
}
.sidebar-page-container .lower-section .comment-form
{
position: relative;
max-width: 770px;
}/* Comment Form */
.comment-form .group-title
{
position: relative;
margin-bottom: 40px;
}
.comment-form .group-title h3
{
position: relative;
color: #000;
font-weight: 400;
font-size: 30px;
}
.comment-form .group-title .text
{
position: relative;
color: #666;
font-weight: 400;
font-size: 14px;
margin-top: 6px;
}
.comment-form .form-group
{
position: relative;
margin-bottom: 30px;
}
.comment-form .form-group:last-child
{
margin-bottom: 0;
}
.comment-form .form-group input[type="text"], .comment-form .form-group input[type="password"], .comment-form .form-group input[type="tel"], .comment-form .form-group input[type="email"], .comment-form .form-group select
{
position: relative;
display: block;
width: 100%;
color: #222;
line-height: 28px;
padding: 10px 20px;
height: 50px;
font-size: 14px;
border-radius: 0;
background-color: #fff;
border: 1px solid transparent;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.comment-form .form-group input[type="text"]:focus, .comment-form .form-group input[type="password"]:focus, .comment-form .form-group input[type="tel"]:focus, .comment-form .form-group input[type="email"]:focus, .comment-form .form-group select:focus, .comment-form .form-group textarea:focus
{
border-color: #111;
}
.comment-form .form-group textarea
{
position: relative;
display: block;
width: 100%;
line-height: 24px;
padding: 15px 20px;
color: #222;
height: 210px;
resize: none;
font-size: 14px;
border-radius: 0;
background-color: #fff;
border: 1px solid transparent;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.comment-form .theme-btn
{
cursor: pointer;
font-size: 14px;
margin-top: 15px;
}/***
====================================================================
Map Section
====================================================================
***/
.map-section
{
position: relative;
}
.map-section iframe
{
position: relative;
width: 100%;
height: 620px;
}/***
====================================================================
Contact Page Section
====================================================================
***/
.contact-page-section
{
position: relative;
padding: 140px 0 150px;
}
.contact-page-section .info-column
{
position: relative;
}
.contact-page-section .info-column .inner-column
{
position: relative;
}
.contact-page-section .info-column h2
{
position: relative;
color: #000;
font-weight: 400;
line-height: 1.2em;
font-size: 48px;
margin-bottom: 60px;
}
.contact-page-section .info-column h3
{
position: relative;
font-size: 30px;
font-weight: 600;
color: #000;
line-height: 1.2em;
margin-bottom: 25px;
}
.contact-page-section .info-column h3 span
{
position: relative;
font-weight: 400;
color: #999;
}
.contact-page-section .info-column ul
{
position: relative;
margin-bottom: 90px;
}
.contact-page-section .info-column ul li
{
position: relative;
margin-bottom: 15px;
color: #666;
font-size: 14px;
line-height: 1.9em;
}
.contact-page-section .info-column ul li:last-child
{
margin-bottom: 0;
}
.contact-page-section .info-column ul li a
{
position: relative;
color: #666;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-page-section .info-column ul li a:hover
{
color: #000;
}
.contact-page-section .info-column .map-direction
{
position: relative;
color: #000;
font-size: 14px;
padding: 13px 26px;
border: 1px solid #999;
text-transform: uppercase;
-webkit-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
-moz-transition: all 300ms ease;
transition: all 300ms ease;
}
.contact-page-section .info-column .map-direction .arrow
{
position: relative;
font-size: 20px;
top: 2px;
margin-left: 5px;
}
.contact-page-section .info-column .map-direction:hover
{
color: #fff;
border-color: #111;
background-color: #111;
}
.contact-page-section .form-column
{
position: relative;
}
.contact-page-section .form-column .inner-column
{
position: relative;
}
.contact-page-section .form-column h6
{
position: relative;
color: #000;
font-weight: 400;
line-height: 1.2em;
font-size: 18px;
margin-top: 25px;
margin-bottom: 80px;
text-transform: uppercase;
}