/*===============================================
Template Name: techno - IT Solutions & Services HTML5 Template
Version: 0.1
================================================*/
/*TABLE OF CONTENTS*/
/*=====================
01. techno Main Menu Area Css
02. techno Slider Area Css
03. techno Shape Images Css
04. techno Breatcome Area Css
05. techno Feature Area Css
06. techno Service Area Css
07. techno Section TitleNAV
08. techno About Area Css
09. techno Counter Area Css
10. techno Feature Box Area Css
11. techno Team Area Css
12. techno Pricing Area Css
13. techno Portfolio Area Css
14. techno Testimonial Area Css
15. techno Call Do Action Area Css
16. techno Blog Area Css
17. techno Subscribe Area CSS
18. techno Subscribe Area CSS
19. techno Contact Now Area Css
20. techno Contact Form Area Css
21. techno GOOGLE MAP AREA CSS
22. techno Middle Footer CSS
23. techno Footer Bottom Area Css
24. techno BLOG DETAILS AREA CSS
25. techno Team Details Area Css
26. techno Skill Area Css
27. techno Error Page Area Css
25. techno Team Details Area Css
=======================*/
/*============================
techno Main Menu Area Css
==============================*/
.techno_nav_manu {
background: rgba(20,94,82,0.5);
transition: .5s;
margin-bottom: 0;
z-index: 999;
position: relative;
position: fixed;
left: 0;
right: 0;
}
.techno_nav_manu.transparent_menu {
background: transparent;
margin-bottom: -87px;
position: relative;
}
.sticky {
left: 0;
margin: auto;
top: 0;
width: 100%;
-webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
background: #2b3d4b;
transition: .5s;
}
/* logo Css*/
.logo {
}
/* techno Menu Css*/
.techno_menu {
/*text-align: right;*/
display: flex;
justify-content: flex-end;
}
.techno_menu ul {
text-align: right;
list-style: none;
display: inline-block;
}
.techno_menu > ul > li {
display: inline-block;
position: relative;
}
.techno_menu > ul > li > a {
display: block;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
position: relative;
color: #fff;
font-weight: 600;
text-transform: capitalize;
margin: 30px 10px;
font-size: 17px;
}
.white .techno_menu > ul > li > a {
color: #fff;
}
.techno_menu ul li:last-child a {
margin-right: 0px;
}
.techno_menu > ul > li.current > a {
color: #f06292;
}
/* sub menu style */
.techno_menu ul .sub-menu {
position: absolute;
left: 0;
top: 130%;
width: 217px;
text-align: left;
background: #fff;
margin: 0;
padding: 15px 0;
z-index: 9999;
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
visibility: hidden;
border-top: 2px solid #145e52;
}
.techno_menu ul li:hover > .sub-menu {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
visibility: visible;
top: 100%;
z-index: 9;
}
.techno_menu ul .sub-menu li {
position: relative;
}
.techno_menu ul .sub-menu li a {
display: block;
padding: 12px 20px;
margin: 0;
line-height: 1.3;
letter-spacing: normal;
font-size: 15px;
font-weight: 500;
text-transform: capitalize;
-webkit-transition: .1s;
-o-transition: .1s;
transition: .1s;
visibility: inherit !important;
color: #333 !important;
}
.techno_menu ul .sub-menu li:hover > a,
.techno_menu ul .sub-menu .sub-menu li:hover > a,
.techno_menu ul .sub-menu .sub-menu .sub-menu li:hover > a,
.techno_menu ul .sub-menu .sub-menu .sub-menu .sub-menu li:hover > a {
background: #145e52;
color: #fff !important;
}
/* sub menu 2 */
.techno_menu ul .sub-menu .sub-menu {
left: 100%;
top: 130%;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
visibility: hidden;
}
.techno_menu ul .sub-menu li:hover > .sub-menu {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
visibility: visible;
top: 0%;
}
/* sub menu 3 */
.techno_menu ul .sub-menu .sub-menu li {
position: relative;
}
.techno_menu ul .sub-menu .sub-menu .sub-menu {
right: 100%;
left: auto;
top: 130%;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
visibility: hidden;
}
.techno_menu ul .sub-menu .sub-menu li:hover > .sub-menu {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
visibility: visible;
top: 0%;
}
/* sub menu 4 */
.techno_menu ul .sub-menu .sub-menu .sub-menu li {
position: relative;
}
.techno_menu ul .sub-menu .sub-menu .sub-menu .sub-menu {
}
.techno_menu ul .sub-menu .sub-menu .sub-menu li:hover > .sub-menu {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
visibility: visible;
top: 0%;
}
.donate-btn-header {
display: inline-block;
margin-left: 16px;
align-self: center;
}
a.dtbtn {
-moz-user-select: none;
background: #145e52;
border: medium none;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 17px;
margin-bottom: 0;
padding: 13px 32px;
text-align: center;
text-transform: capitalize;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
vertical-align: middle;
border-radius: 5px;
border: 2px solid #145e52;
font-weight: 600;
}
a.dtbtn:hover {
border: 2px solid #00247E;
background: #00247E;
color: #fff;
}
.techno_menu li a:hover:before {
width: 101%;
}
.techno_nav_manu.sticky .logo_img, .techno_nav_manu.sticky .khalagh {
display: none;
}
.main_sticky {
display: none;
}
.techno_nav_manu.sticky .main_sticky {
display: inherit;
}
.techno_nav_manu.sticky .techno_menu li a {
color: #fff;
margin-right: 25px;
}
.techno_nav_manu.sticky a.dtbtn {
color: #145e52;
background: #fff;
border: 2px solid #fff;
}
.techno_nav_manu.sticky a.dtbtn:hover {
color: #145e52;
}
.mobile-menu.mean-container {
overflow: hidden;
}
/*====================================================
--< Techno Header Top Menu Area Css -->
======================================================*/
.header_top_menu_address_inner ul {
list-style: none;
}
.header_top_menu_address_inner ul li {
display: inline-block;
}
.header_top_menu_icon_inner ul {
list-style: none;
text-align: right;
}
.header_top_menu_icon_inner ul li {
display: inline-block;
}
.header_top_menu_address_inner ul li a i {
font-size: 16px;
margin-right: 10px;
color: #fff;
}
.header_top_menu_address_inner ul li a {
color: #fff;
font-size: 14px;
font-weight: 400;
margin-right: 15px;
}
.header_top_menu_icon_inner ul li a {
color: #fff;
font-size: 14px;
font-weight: 400;
margin: 0 5px;
}
/*====================================================
--< Techno Slider Area Css -->
======================================================*/
.slider1 {
background-image: url(../index2_files/slider-1.png.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 100vh;
}
.slider2 {
background-image: url(../index2_files/slider-2.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 100vh;
}
.slider3 {
background-image: url(assets/images/slider/slider-3.png.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 100vh;
}
.slider4 {
background-image: url(assets/images/slider/slider-5.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 900px;
}
.slider5 {
background-image: url(assets/images/slider/slider-8.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 900px;
}
.slider6 {
background-image: url(assets/images/slider/slider-4.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 900px;
position: relative;
}
.slider7 {
background-image: url(assets/images/slider/slider-6.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 900px;
position: relative;
}
.slider8 {
background-image: url(assets/images/slider/slider-9.png);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
height: 900px;
position: relative;
}
.slider_text_inner {
display: inline-block;
}
.slider_text_inner h1 {
font-size: 65px;
text-transform: none;
font-weight: 800;
color: #fff;
margin: 0;
margin: 0;
line-height: 1.1;
}
.slider_text_inner h1 span {
color: #145e52;
}
.slider_text_inner h5 {
font-size: 20px;
text-transform: uppercase;
color: #fff;
font-weight: 600;
letter-spacing: 0;
margin: 0 0 24px;
letter-spacing: 1px;
}
.slider_text_inner p {
width: 70%;
font-size: 16px;
padding: 29px 0 22px;
color: #fff;
}
.slider_text_desc p {
color: #fff;
width: 62%;
font-size: 18px;
}
.text_center .slider_text_desc p {
margin: auto;
}
/* Color Black */
.color_black .slider_text_inner h1 {
color: #232323;
}
.color_black .slider_text_desc p {
color: #616161;
}
.color_black .slider_text_inner h5 {
color: #145e52;
}
/* Button Css */
.button a {
background: #145e52;
padding: 16px 32px;
font-size: 18px;
font-weight: 500;
display: inline-block;
transition: .5s;
position: relative;
overflow: hidden;
z-index: 1;
border-radius: 5px;
color: #fff;
}
.button.two a {
padding: 14px 35px;
}
.button.three a {
background: #fff;
padding: 14px 35px;
color: #145e52;
}
.button .active {
background: #00247E;
margin-left: 25px;
}
.button .active:before {
background: #145e52;
}
.button a i {
margin-left: 5px;
}
.button a:before {
position: absolute;
content: "";
top: 0px;
height: 100%;
left: -25%;
width: 0%;
background: #00247E;
transform: skew(50deg);
transition-duration: .6s;
z-index: -1;
}
.button a:hover {
color: #fff;
}
.button a:hover:before {
width: 180%;
}
/* Video Css */
.slider-video {
position: relative;
}
.slider-video .video-icon {
position: absolute;
right: 0;
top: -165px;
}
.slider-video.two .video-icon {
left: 262px;
top: -74px;
}
.appointment .slider-video.two .video-icon {
left: 0;
top: 0;
}
.video-icon a {
width: 75px;
height: 75px;
line-height: 75px;
display: inline-block;
text-align: center;
border-radius: 500%;
position: relative;
color: #145e52;
-webkit-animation: ripple-white 1s linear infinite;
animation: ripple-blue 1s linear infinite;
-webkit-transition: .5s;
background: #fff;
font-size: 28px;
}
@-webkit-keyframes ripple-blue {
0% {
-webkit-box-shadow: 0 0 0 0 rgba(255,255,255, 0.3), 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3);
box-shadow: 0 0 0 0 rgba(255,255,255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3);
}
100% {
-webkit-box-shadow: 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
}
}
@keyframes ripple-blue {
0% {
-webkit-box-shadow: 0 0 0 0 rgba(255,255,255, 0.3), 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3);
box-shadow: 0 0 0 0 rgba(255,255,255, 0.3), 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3);
}
100% {
-webkit-box-shadow: 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3), 0 0 0 30px rgba(255,255,255, 0);
box-shadow: 0 0 0 10px rgba(255,255,255, 0.3), 0 0 0 20px rgba(255,255,255, 0.3), 0 0 0 30px rgba(255,255,255, 0);
}
}
/* Owl Nav Css */
.owl-prev {
position: absolute;
left: -60px;
top: 50%;
transform: translateY(-50%);
opacity: 1;
transition: .3s;
}
.owl-next {
position: absolute;
right: -60px;
top: 50%;
transform: translateY(-50%);
opacity: 1;
transition: .3s;
}
.owl-carousel:hover .owl-prev {
left: 30px;
}
.owl-carousel:hover .owl-next {
right: 30px;
}
.owl-next i,
.owl-prev i {
background-color: transparent;
border-radius: 100%;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
height: 60px;
width: 60px;
z-index: 1;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
line-height: 55px;
color: #fff;
border: 2px solid #FFF;
text-align: center;
}
.owl-next i:hover,
.owl-prev i:hover {
background-color: rgba(255, 255, 255, 0.2);
}
/*====================================================
--< Techno Nivo Slider Area Css -->
======================================================*/
.nivo_slider_area {
position: relative;
}
.nivo-caption {
background: rgba(0, 0, 0, 0.0);
height: 100%;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.em_slider_inner {
margin: auto;
position: absolute;
top: 50%;
left: 0;
right: 0;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 9999;
}
/* slider title */
.em-slider-title {
color: #fff;
font-size: 15px;
font-weight: 600;
margin-bottom: 23px;
text-transform: uppercase;
}
.em-slider-main-title {
color: #fff;
font-size: 120px;
font-weight: 800;
}
.em-slider-sub-title {
color: #fff;
font-size: 33px;
font-weight: 400;
}
.em-nav-slider-title-center {
color: #fff;
font-size: 55px;
font-weight: 800;
}
.em-nav-slider-title-centerspan {
color: #145e52;
}
.em-slider-up-title {
font-size: 38px;
color: #fff;
font-weight: 300;
padding-bottom: 8px;
letter-spacing: 3px;
text-transform: uppercase;
}
.em-slider-sub-em-title {
font-size: 24px;
color: #fff;
font-weight: 500;
}
.em-slider-descript {
font-size: 17px;
margin-bottom: 20px;
width: 59%;
z-index: 999;
font-weight: 400;
color: #ddd;
margin-top: 10px;
}
.text-left .em-slider-descript {
margin-left: 0;
margin-right: auto;
}
.text-center .em-slider-descript {
margin: 11px auto 28px;
}
.text-right .em-slider-descript {
margin-right: 0;
margin-left: auto;
}
.text-center {
text-align: center;
}
/* slider button */
.em-slider-button.wow.bounceInUp.em-button-button-area.animated {
padding-top: 19px;
}
.em-button-button-area a {
border: 1px solid #ccc;
color: #fff;
display: inline-block;
font-size: 15px;
margin-right: 10px;
margin-top: 12px;
padding: 15px 41px;
position: relative;
text-transform: uppercase;
-webkit-transition: all 0.5s ease 0s;
-o-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
z-index: 999;
letter-spacing: 1px;
border-radius: 5px;
}
a.em-active-button {
background: #145e52;
border-color: #145e52;
}
.em-button-button-area a:hover {
color: #fff;
background: #145e52;
border-color: #145e52;
}
a.em-active-button:hover {
background: transparent;
border-color: #fff;
}
.em-slider-half-width {
width: 50%;
}
.em-slider-left {
padding-right: 30px;
}
.em-slider-right {
padding-left: 30px;
}
.em-slider-full-width {
width: 85%;
}
.em-slider-half-width .em-slider-descript {
width: 100%;
}
/* directionNav */
.em-nivo-slider-wrapper .nivo-directionNav a {
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
height: 75px;
width: 50px;
line-height: 68px;
text-align: center;
display: block;
border-radius: 50%;
color: #145e52;
font-size: 40px;
left: 0;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
opacity: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
visibility: hidden;
border-radius: 0;
background: #fff;
margin-right: 30px;
}
.em-nivo-slider-wrapper .nivo-directionNav .nivo-prevNav {
margin-left: 30px;
}
.em-nivo-slider-wrapper .nivo-directionNav .nivo-nextNav {
left: auto;
right: 0;
}
.em-nivo-slider-wrapper .nivo-directionNav a:hover {
background: #145e52;
border-color: #145e52;
color: #fff;
}
.em-nivo-slider-wrapper:hover .nivo-directionNav a {
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
visibility: visible;
left: 50px;
}
.em-nivo-slider-wrapper:hover .nivo-directionNav .nivo-nextNav {
left: auto;
right: 50px;
}
/* controlNav */
.em-nivo-slider-wrapper .nivo-controlNav {
bottom: 50px;
padding: 0;
position: absolute;
width: 100%;
z-index: 9;
display: none;
}
.em-nivo-slider-wrapper .nivo-controlNav a {
background: #000 none repeat scroll 0 0;
border-radius: 50%;
cursor: pointer;
display: inline-block;
font-size: 14px;
height: 25px;
margin: 0 5px;
width: 25px;
color: #fff;
line-height: 25px;
}
.em-nivo-slider-wrapper .nivo-controlNav a:hover,
.em-nivo-slider-wrapper .nivo-controlNav a.active {
background: #FFA700 none repeat scroll 0 0;
opacity: 1;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.cd-headline.clip span {
display: inline-block;
padding: 0 0 0;
}
.cd-headline.clip span b {
display: inline-block;
color: #fff;
text-transform: uppercase;
}
/* Appointment Css */
.appointment {
position: relative;
z-index: 99 !important;
}
.sign-up-form-wrap {
background: #fff;
border-radius: 7px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12);
}
.form-control {
height: 54px;
background-color: #fff;
border-color: transparent;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
border: 1px solid #e6e6e6;
padding: 6px 20px;
-webkit-box-shadow: none;
box-shadow: none;
border-radius: 5px;
}
.form-group .btn {
background: #145e52;
border: 0;
display: inline-block;
text-align: center;
border-radius: 7px;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
color: #fff;
width: 100%;
height: 54px;
}
.appointment_title {
font-weight: 800;
}
.slider_bottom_shape_inner {
position: absolute;
left: 0;
bottom: -4px;
width: 100%;
z-index: -1;
}
/*
*/
.breatcome_area {
background: url(assets/images/slider/slider-10.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
height: 500px;
position: relative;
}
.breatcome_area:before {
position: absolute;
content: '';
background-image: linear-gradient(to right, rgba(12,90,219, 0.85), rgba(12,90,219, 0.80), rgba(18,85,194, 0.70), rgba(34,86,172, 0.75), rgba(38,85,163, 0.75));
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.breatcome_title {
text-align: center;
}
.breatcome_title_inner h2 {
color: #fff;
font-size: 50px;
font-weight: 700;
}
.breatcome_content ul li {
display: inline-block;
}
.breatcome_content ul li a {
color: #fff;
opacity: .7;
transition: .5s;
}
.breatcome_content ul li i {
color: #fff;
opacity: .7;
padding: 0 5px;
}
.breatcome_content ul li span {
color: #fff;
opacity: .7;
}
.breatcome_content ul li a:hover {
opacity: 1;
}
/*====================================================
--< Techno Section Title Css -->
======================================================*/
.section_sub_title h6 {
letter-spacing: 5px;
color: #145e52;
font-size: 16px;
}
.section_title.text_center {
text-align: center;
}
.section_main_title h1,
.section_main_title h2 {
font-weight: 800;
margin: 0;
}
.text_left .section_main_title h1 {
margin: 0;
letter-spacing: -1px;
}
.section_main_title h1 span {
color: #145e52;
}
.section_content_text p {
font-size: 18px;
}
.text_center .section_content_text p {
width: 75%;
margin: auto;
font-size: 19px;
}
.section_content_text.bold p {
font-size: 22px;
font-weight: 600;
}
.section_title.white .section_main_title h1,
.section_title.white .section_main_title h2 {
color: #fff;
}
.section_title.white .section_sub_title h6 {
color: #fff;
}
.section_title.white .section_content_text p {
color: #fff;
}
.section_button {
text-align: right;
}
.phone_number h5 {
letter-spacing: 1px;
font-weight: 500;
}
.em_bar {
background: #9B50DB none repeat scroll 0 0;
height: 2px;
margin: 0 auto 5px;
width: 62px;
}
.text_left .em_bar {
margin: 0;
}
.em_bar_bg {
height: 5px;
width: 90px;
background: #cbbded;
margin: 20px auto;
position: relative;
border-radius: 30px;
}
.em_bar_bg:before {
content: '';
position: absolute;
left: 0;
top: -2.7px;
height: 10px;
width: 10px;
border-radius: 50%;
background: #145e52;
-webkit-animation-duration: 3s;
animation-duration: 3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: MOVE-BG;
animation-name: MOVE-BG;
}
@-webkit-keyframes MOVE-BG {
from {
-webkit-transform: translateX(0);
transform: translateX(0);
}
to {
-webkit-transform: translateX(88px);
transform: translateX(88px);
}
}
@keyframes MOVE-BG {
from {
-webkit-transform: translateX(0);
transform: translateX(0);
}
to {
-webkit-transform: translateX(88px);
transform: translateX(88px);
}
}
/*====================================================
--< Techno Flipbox Top Feature Area Css -->
======================================================*/
.nagative_margin {
position: relative;
margin-top: -100px;
}
.nagative_margin3 {
position: relative;
margin-top: -100px;
z-index: 99;
}
.top_feature .techno_flipbox .techno_flipbox_font {
background: #fff;
border-radius: 8px;
box-shadow: 0 5px 20px rgba(0,0,0,0.10);
border: 0;
}
.top_feature .techno_flipbox .techno_flipbox_back {
background: #145e52;
box-shadow: 0 5px 20px rgba(0,0,0,0.10);
border-radius: 8px;
}
.top_feature .techno_flipbox .techno_flipbox_inner {
padding: 0 30px;
}
.top_feature .techno_flipbox .techno_flipbox_back::before {
display: none;
}
.top_feature .icon {
color: #145e52;
font-size: 45px;
display: inline-block;
line-height: 46px;
}
.top_feature .techno_flipbox .flipbox_title h3 {
font-size: 20px;
color: #232323;
font-weight: 700;
font-family: Muli;
}
/* Top Feature Style Two */
.top_feature.two .techno_flipbox .techno_flipbox_font, .top_feature.two .techno_flipbox .techno_flipbox_back {
min-height: 223px;
}
.top_feature.two .techno_flipbox .techno_flipbox_back {
background: #fff;
}
.top_feature.two .techno_flipbox .techno_flipbox_inner {
padding: 0 24px;
}
.top_feature.two .icon {
color: #fff;
font-size: 40px;
line-height: 90px;
height: 90px;
width: 90px;
background: #145e52;
border-radius: 33% 66% 70% 30%/49% 62% 38% 51% !important;
}
.top_feature.two .techno_flipbox .flipbox_title h3 {
padding-bottom: 0;
font-size: 21px;
}
.top_feature.two .techno_flipbox .techno_flipbox_back .flipbox_title h3 {
color: #232323;
font-size: 21px;
}
.top_feature.two .techno_flipbox_back .flipbox_desc p {
color: #616161;
}
/* Feature Style Three */
.feature_style_three {
position: relative;
border-radius: 10px;
}
.feature_style_three:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(41,55,66,0.6);
content: "";
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
border-radius: 10px;
}
.feature_style_tree_thumb img {
width: 100%;
border-radius: 10px;
}
.feature_style_tree_content {
position: absolute;
left: 0;
bottom: -67px;
padding: 0 50px 0 38px;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
}
.feature_style_thre_icon .icon {
color: #fff;
font-size: 50px;
}
.feature_style_three_title h4 {
color: #fff;
font-weight: 700;
}
.feature_style_three_text {
color: #fff;
opacity: 0;
transition: .3s;
}
.feature_style_three_butoon a {
color: #fff;
text-transform: uppercase;
opacity: 0;
transition: .3s;
font-size: 14px;
}
.feature_style_three:hover:before {
background: rgba(12,90,219,0.85);
}
.feature_style_three:hover .feature_style_three_text,
.feature_style_three:hover .feature_style_three_butoon a {
opacity: 1;
}
.feature_style_three:hover .feature_style_tree_content {
bottom: 45px;
}
/* Feature Style Four */
.feature_style_four {
background: #fff;
text-align: center;
box-shadow: 6px 5px 30px 0px rgba(0,0,0,0.12);
border-radius: 7px;
transition: .5s;
padding: 50px 45px;
}
.feature_style_four.active {
background: #145e52;
}
.feature_style_four_icon i {
background: #EDF4FC;
width: 130px;
height: 130px;
border-radius: 100%;
line-height: 130px;
font-size: 40px;
color: #145e52;
transition: .4s;
display: inline-block;
}
.feature_style_four_title h4 {
font-weight: 700;
transition: .5s;
}
.feature_style_four_text p {
transition: .5s;
}
.feature_style_four_button a {
transition: .5s;
}
.feature_style_four.active .feature_style_four_title h4,
.feature_style_four.active .feature_style_four_text p,
.feature_style_four.active .feature_style_four_button a {
color: #fff;
}
.feature_style_four_button a i {
margin-left: 6px;
}
.feature_style_four:hover {
background: #145e52;
transform: translateY(-10px);
}
.feature_style_four:hover .feature_style_four_title h4,
.feature_style_four:hover .feature_style_four_text p,
.feature_style_four:hover .feature_style_four_button a {
color: #fff;
}
/* Feature Style Five */
.feature_style_five {
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
text-align: center;
padding: 35px 30px 10px;
box-shadow: 0 10px 29.7px 0.3px rgba(225,225,225,.64);
position: relative;
border-radius: 0px 50px 50px 50px;
background: #fff;
}
.feature_style_five::after {
position: absolute;
content: "";
top: 0;
left: 0;
height: 100%;
width: 100%;
background-image: url(assets/images/dot.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
z-index: 1;
}
.feature_style_five_cion i {
color: #145e52;
background-color: #eff2f7;
border-radius: 0 40px 40px;
font-size: 25px;
line-height: 70px;
height: 70px;
width: 70px;
transition: .5s;
}
.feature_style_five_title h4 {
font-size: 22px;
font-weight: 700;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
}
.feature_style_five_text p {
transition: .5s;
}
.feature_style_five:hover {
background: #145e52;
transform: translateY(-10px);
}
.feature_style_five:hover .feature_style_five_title h4,
.feature_style_five:hover .feature_style_five_text p {
color: #fff;
}
/*====================================================
--< Techno Flipbox Area Css -->
======================================================*/
.flipbox_area {
position: absolute;
left: 0;
right: 0;
top: 80%;
}
.techno_flipbox_font {
/*border: 2px solid #145e52;*/
border-radius: 12px;
}
.flipbox .section_main_title h1 {
color: #fff;
}
.flipbox .section_sub_title h6 {
color: #fff;
}
.flipbox .section_title {
margin-bottom: 30px;
}
.techno_flipbox {
perspective: 1000px;
position: relative;
transform-style: preserve-3d;
-webkit-perspective: 1000px;
-webkit-transform-style: preserve-3d;
z-index: 1;
}
.techno_flipbox .techno_flipbox_font,
.techno_flipbox .techno_flipbox_back {
min-height: 250px;
height: auto;
box-shadow: 0px 1px 51.3px 5.7px rgba(137,143,156,.15);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: rotateX(0);
-webkit-transform: rotateX(0);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
/*transition: transform .7s ease, -webkit-transform .7s ease;*/
position: relative;
background: rgba(255,255,255,.5);
}
.techno_flipbox .techno_flipbox_font.last {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#23676b+0,1da58b+100 */
background: rgba(35,103,107,0.8); /* Old browsers */
background: -moz-linear-gradient(top, rgba(35,103,107,0.8) 0%, rgba(29,165,139,0.8) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(35,103,107,0.8) 0%,rgba(29,165,139,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,0,0,0.8) 0%,rgba(29,165,139,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(35,103,107,0.8)', endColorstr='rgba(29,165,139,0.8)',GradientType=0 ); /* IE6-9 */
}
.techno_flipbox .techno_flipbox_back::before {
position: absolute;
content: "";
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(to bottom,transparent -80%,#c6a981);
border-radius:12px;
/*border: 2px solid #145e52;*/
}
.icon {
font-size: 45px;
line-height: 45px;
}
.techno_flipbox .techno_flipbox_inner {
text-align: center;
padding: 0 25px;
border-radius: 12px;
position: absolute;
left: 0;
top: 50%;
width: 100%;
perspective: inherit;
-webkit-perspective: inherit;
outline: transparent solid 1px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateY(-50%) translateZ(60px) scale(0.94);
transform: translateY(-50%) translateZ(60px) scale(0.94);
z-index: 2;
}
.techno_flipbox_icon {
font-size: 45px;
text-align: center;
display: inline-block;
color: #fff;
overflow: hidden;
}
.techno_flipbox_font .flipbox_desc p {
color: #fff;
}
.techno_flipbox .flipbox_title h3 {
font-size: 22px;
padding-bottom: 13px;
text-transform: capitalize;
-webkit-transition: all 0.7s ease 0s;
transition: all 0.7s ease 0s;
color: #fff;
}
.techno_flipbox .techno_flipbox_back {
position: absolute;
top: 0;
left: 0;
width: 100%;
border-radius: 12px;
-webkit-transform: rotateX(180deg);
transform: rotateX(180deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.techno_flipbox .techno_flipbox_back .flipbox_button a {
text-transform: capitalize;
margin-top: 22px;
background: #fff;
color: #145e52;
display: inline-block;
padding: 4px 25px;
border-radius: 5px;
border: 2px solid #fff;
transition: .5s;
}
.techno_flipbox_back .flipbox_desc p {
color: #fff;
}
.techno_flipbox .techno_flipbox_back .flipbox_button a i {
display: none;
}
.techno_flipbox .techno_flipbox_back .flipbox_title h3 {
padding-bottom: 16px;
padding-top: 0;
color: #fff;
margin-bottom: 0;
}
.techno_flipbox .techno_flipbox_font .flipbox_desc,
.techno_flipbox .techno_flipbox_back .flipbox_desc {
color: #fff;
}
/* Flipbox Hover Css */
.techno_flipbox:hover .techno_flipbox_font {
-webkit-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
.techno_flipbox:hover .techno_flipbox_back {
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
}
.techno_flipbox .techno_flipbox_back .flipbox_button a:hover {
color: #fff;
border-color: #145e52;
background: #145e52;
}
.pages .techno_flipbox .techno_flipbox_font .flipbox_title h3 {
color: #444;
}
.pages .techno_flipbox .techno_flipbox_font .flipbox_title h3 .pages .techno_flipbox_font .flipbox_desc p {
color: #666;
}
.pages .techno_flipbox_font.last .flipbox_desc p, .pages .techno_flipbox .techno_flipbox_font.last .flipbox_title h3 {
color: #fff;
}
.pages .techno_flipbox_font.last .icon {
background: #fff;
}
.pages .techno_flipbox_font.last .icon {
background: #fff;
color: #145e52;
}
/*====================================================
--< Techno About Area Css -->
======================================================*/
.about_icon {
float: left;
}
.about_icon .icon {
font-size: 40px;
color: #145e52;
}
.singel-about-content {
overflow: hidden;
}
.singel-about-content.boder {
border-left: 1px solid #ddd;
}
.singel-about-content h5 {
font-weight: 700;
margin: 0;
}
.single_about_thumb_inner img {
width: 100%;
}
.about_thumb img {
width: 100%;
}
.about_skill_thumb img {
width: 100%;
}
.skill-wrapper h6 {
margin-bottom: 8px;
}
.pd_gap {
background: #fff;
padding: 18px 0 18px;
border-radius: 8px;
}
/* Experience Css */
.headingh_experience_number h1 {
font-size: 136px;
display: inline;
font-weight: 800;
color: #145e52;
float: left;
line-height: 1;
margin-top: -14px;
margin-right: 15px;
}
.heading_experience_title h2 {
font-size: 36px;
font-weight: 800;
line-height: 1;
color: #232323;
padding-top: 11px;
display: inline;
}
.heading_experience_text p {
font-size: 18px;
}
.experience .main_video {
position: relative;
margin-top: -285px;
}
/*====================================================
--< Techno Shape Images Css -->
======================================================*/
.single_slider_shape {
position: relative;
}
.single_slider_shape_image {
position: absolute;
right: -250px;
top: -499px;
z-index: 1;
}
.single_slider_shape_image img {
width: 90%;
}
.single_slider_rot_inner {
position: absolute;
bottom: -340px;
left: 50%;
}
.single_slider_rot.two .single_slider_rot_inner {
left: -45%;
}
.single_slider_sp {
position: absolute;
bottom: 370px;
left: 79%;
}
.single_slider_sp img {
width: 100%;
opacity: 0.8;
}
.single_about_shape {
position: relative;
}
.single_about_shape_thumb {
position: absolute;
bottom: -70px;
z-index: -1;
left: -94px;
}
.single_about_shape_thumb img {
width: 70%;
}
/* Home Three About Shape */
.video_thumb img {
width: 100%;
}
.video_shape_thumb1 {
position: absolute;
top: 80px;
z-index: -1;
left: -16px;
}
.video_shape_thumb2 {
position: absolute;
top: 16px;
right: 0;
z-index: -1;
}
.video_shape_thumb3 {
position: absolute;
bottom: 50px;
left: 0;
z-index: -1;
}
.video_shape_thumb4 {
position: absolute;
bottom: 83px;
right: -135px;
z-index: -1;
}
.main_video {
position: relative;
margin-top: -175px;
}
.single-panel-thumb .main_video {
position: relative;
margin-top: -325px;
}
/*====================================================
--< Techno Service Area Css -->
======================================================*/
.service_area {
padding-top: 30%;
}
.service_style_one {
background: #fff;
border-radius: 10px;
}
.service_style_one_icon i {
width: 75px;
height: 75px;
line-height: 75px;
background: #e8ecfc;
border-radius: 100%;
color: #145e52;
display: inline-block;
border-radius: 33% 66% 70% 30%/49% 62% 38% 51%;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
text-align: center;
font-size: 35px;
}
.service_style_one_title h4 {
font-weight: 700;
color: #145e52;
position: relative;
}
.service_style_one_title h4:before {
position: absolute;
content: "";
left: 0;
top: 37px;
height: 1px;
width: 100px;
background: #d1d1d1;
margin: auto;
right: 0;
}
.service_style_one_button a {
color: #616161;
border: 1px solid #e8ecfc;
padding: 5px 23px;
border-radius: 30px;
display: inline-block;
font-size: 16px;
}
.service_style_one_button a i {
margin-left: 7px;
}
.service_style_one:hover .service_style_one_button a {
background-color: #145e52;
color: #fff;
border-color: #145e52;
}
.service_style_one:hover .service_style_one_icon i {
background-color: #145e52;
color: #fff;
}
/* Service Style Two */
.service_style_two_number {
float: left;
}
.service_style_two_content {
overflow: hidden;
}
.service_style_two_number h5 {
font-weight: 700;
color: #145e52;
position: relative;
}
.service_style_two_number h5:before {
position: absolute;
left: 34px;
top: 14px;
height: 2px;
width: 32px;
content: "";
background: #145e52;
}
.service_style_two_title h4 {
font-weight: 700;
transition: .3s;
}
.service_style_two_button a {
color: #145e52;
text-transform: uppercase;
font-size: 14px;
font-weight: 600;
}
.service_style_two_button a i {
margin-left: 5px;
transition: .3s;
}
.service_style_two_title h4:hover {
color: #145e52;
}
/* Service Style Three 8*/
.service_style_three {
background: #fff;
border-radius: 7px;
box-shadow: 2px 10px 50px rgba(158,158,158,.25);
border: 2px solid transparent;
transition: .5s;
}
.service_style_three_icon i {
width: 95px;
height: 95px;
line-height: 95px;
background: #145e52;
border-radius: 100%;
color: #fff;
display: inline-block;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
text-align: center;
font-size: 30px;
}
.service_style_three_title h4 {
font-size: 22px;
font-weight: 700;
transition: .3s;
}
.service_style_three_bt_icon {
position: relative;
margin-bottom: -28px;
}
.service_style_three_bt_icon a {
width: 55px;
height: 55px;
border-radius: 100%;
border: 2px solid #145e52;
line-height: 50px;
color: #145e52;
background: #fff;
transition: .5s;
display: inline-block;
}
.service_style_three:hover {
border: 2px solid #145e52;
}
.service_style_three_title h4:hover {
color: #145e52;
}
.service_style_three:hover .service_style_three_bt_icon a {
background: #145e52;
color: #fff;
}
/* Service Style Four */
.service_style_four {
background: #fff;
border-radius: 7px;
transition: .5s;
box-shadow: 2px 10px 50px rgba(158,158,158,.25);
}
.service_style_four_icon i {
font-size: 48px;
display: inline-block;
color: #145e52;
transition: .5s;
}
.service_style_four_title h4 {
transition: .5s;
font-size: 22px;
font-weight: 700;
}
.service_style_four_text p {
transition: .5s;
}
.service_style_four_button a {
color: #145e52;
transition: .5s;
}
.service_style_four_button a i {
margin-left: 5px;
}
.service_style_four:hover {
background: #145e52;
transform: translateY(-8px);
}
.service_style_four:hover .service_style_four_icon i,
.service_style_four:hover .service_style_four_title h4,
.service_style_four:hover .service_style_four_text p,
.service_style_four:hover .service_style_four_button a {
color: #fff;
}
/* Service Style Five */
.service_style_five {
border: 1px solid #d5c7c7;
border-radius: 8px;
background: transparent;
transition: .5s;
}
.service_style_five_title h4 {
font-size: 22px;
font-weight: 700;
transition: .5s;
}
.service_style_five_icon i {
transition: .5s;
}
.service_style_five_text p {
transition: .5s;
}
.service_style_five_button a {
transition: .5s;
}
.service_style_five_button a i {
margin-left: 5px;
}
.service_style_five:hover {
border: 1px solid #145e52;
background: #145e52;
transform: translateY(-8px);
}
.service_style_five:hover .service_style_five_title h4,
.service_style_five:hover .service_style_five_icon i,
.service_style_five:hover .service_style_five_text p,
.service_style_five:hover .service_style_five_button a {
color: #fff;
}
/* Service Style Six */
.single_service_inner {
padding: 19px 0 5px;
box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06);
position: relative;
z-index: 1;
transition: .5s;
border-radius: 0 50px 50px 50px;
margin-bottom: 30px;
background: #fff;
}
.single_service_inner::before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 60px;
background: #145e52;
content: "";
z-index: -1;
border-radius: 0 30px 30px;
transition: .5s;
border: 1px transparent;
}
.single_service_icon {
float: left;
margin-left: 15px;
margin-right: 30px;
margin-top: -5px;
}
.single_service_icon i {
display: inline-block;
text-align: center;
font-size: 25px;
-webkit-transition: all 0.5s ease 0s;
-o-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
color: #fff;
}
.single_service_content h4 {
font-size: 16px;
text-align: left;
margin: 0 0 12px;
transition: .5s;
}
.right .single_service_inner_thumb {
margin-top: -130px;
margin-left: 115px;
}
.right .single_service_brg {
position: relative;
}
.right .single_service_brg_thumb {
bottom: -66px;
position: absolute;
left: 25px;
}
.left .single_service_inner_thumb {
margin-top: -144px;
margin-left: 71px;
}
.left .single_service_brg {
position: relative;
}
.left .single_service_brg_thumb {
bottom: -66px;
position: absolute;
left: -16px;
}
.single_service_inner:hover .single_service_content h4 {
color: #fff;
}
.single_service_inner:hover {
background: #145e52;
}
.single_service_inner:hover::before {
background: #fff;
}
.single_service_inner:hover .single_service_icon i {
color: #145e52;
}
/* Service Style Seven */
.service_style_seven {
box-shadow: 0 0 15px rgba(51,51,51,0.1);
transition: .5s;
}
.service_style_seven_icon {
float: left;
}
.service_style_seven_icon i {
color: #145e52;
font-size: 40px;
margin-top: 14px;
}
.service_style_seven_content {
overflow: hidden;
}
.service_style_seven_title h4 {
font-weight: 700;
}
.service_style_seven:hover {
box-shadow: 0 0 40px rgba(51,51,51,0.1);
}
/*====================================================
--< Techno Service Details Area Css -->
======================================================*/
.service-details-pn-list ul li {
margin-bottom: 2px;
transition: .5s;
list-style: none;
}
.service-details-pn-list ul li a {
position: relative;
display: block;
padding: 14px 15px 14px 18px;
background-color: #F3F6F9;
font-weight: 600;
font-size: 17px;
transition: .5s;
color: #232323;
font-family: Muli;
}
.service-details-pn-list ul li a:hover {
background: #145e52 !important;
color: #fff !important;
}
.service-details-pn-list ul li a i {
float: right;
font-size: 17px;
font-weight: 600;
position: relative;
margin-top: 5px;
}
.service-details-big-button a {
color: #ffffff;
background: #145e52;
font-family: Open Sans;
font-weight: 500;
text-transform: capitalize;
border: 0px solid #ffffff;
border-radius: 5px;
padding: 14px 35px 14px 35px;
display: block;
}
.service-details-big-button a:hover {
background: #00247e;
}
.details-big-content {
text-align: center !important;
}
.service-details-big-button a span i {
margin-left: 20px;
}
.service-details-pn-about {
position: relative;
z-index: 1;
}
.service-details-pn-about::before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
content: "";
background: rgba(12,90,219,.85);
z-index: -1;
}
.service-details-pn-about-content {
text-align: center;
}
.service-main-details-content-title h3 {
font-weight: 800;
}
.service-details-pn-about-content-title h4 {
color: #fff;
font-weight: 700;
}
.service-details-pn-about-content-text p {
color: #fff;
}
.service-details-pn-about-content-button a {
display: inline-block;
padding: 10px 30px;
background: #fff;
color: #145e52;
border-radius: 5px;
font-size: 17px;
font-weight: 700;
}
/*-- Main Service Details --*/
.service-main-details-inner-thumb img {
width: 100%;
}
.service-details-video-thumb img {
width: 100%;
}
.service-details-video .single-video {
position: relative;
}
.service-details-video .video-icon {
position: absolute;
left: 0;
bottom: 265px;
right: 0;
}
.service-details-research-button a {
color: #ffffff;
background: #145e52;
font-family: Open Sans;
font-weight: 500;
text-transform: capitalize;
border: 0px solid #ffffff;
border-radius: 5px 5px 5px 5px;
padding: 14px 35px 14px 35px;
margin-top: 15px;
transition: .5s;
}
.service-details-research-button a:hover {
background: #00247e;
}
.service-details-research-title h4 {
font-weight: 800;
}
/*====================================================
--< Techno Team Area Css -->
======================================================*/
.single_team {
overflow: hidden;
border-radius: 5px;
transition: .5s;
}
.single_team_thumb {
position: relative;
}
.single_team_thumb:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(12,90,219,0.85);
content: "";
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
opacity: 0;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
}
.single_team_icon {
position: absolute;
top: 50%;
right: -50px;
text-align: center;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
background: #fff;
width: 45px;
padding: 13px 0;
opacity: 0;
}
.single_team_icon a {
display: block;
font-size: 16px;
color: #145e52;
text-align: center;
margin: 4px 0px;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
}
.single_team_thumb img {
width: 100%;
}
.single_team_content {
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
background: #fff;
padding: 12px 20px 23px;
text-align: center;
border-bottom: 2px solid #145e52;
}
.single_team_content h4 {
font-size: 20px;
font-weight: 700;
transition: .3s;
display: block;
}
.single_team_content span {
color: #145e52;
padding-top: 2px;
}
/* Team Hover Css */
.single_team:hover {
transform: translateY(-10px);
}
.single_team:hover .single_team_icon {
opacity: 1;
right: -1px;
}
.single_team_content h4:hover {
color: #145e52;
}
.single_team:hover .single_team_thumb:before {
opacity: 1;
}
/* Team Style Three */
.team_style_three {
position: relative;
transition: .5s;
}
.team_style_three-thumb {
position: relative;
z-index: 1;
transition: .5s;
}
.team_style_three_thumb_inner {
position: relative;
z-index: 1;
transition: .5s;
overflow: hidden;
}
.team_style_three_thumb_inner:before {
position: absolute;
left: -70px;
bottom: -59px;
height: 120px;
width: 133%;
background: #fff;
content: "";
-webkit-transform: skew(-30deg);
-khtml-transform: skew(-30deg);
-moz-transform: skew(-30deg);
-ms-transform: skew(-30deg);
-o-transform: skew(-30deg);
transform: skew(-98deg);
}
.team_style_three-thumb:after {
position: absolute;
left: 0;
bottom: 4px;
height: 100%;
width: 100%;
background: #145e52;
content: "";
-webkit-transform: skew(1deg);
-khtml-transform: skew(69deg);
-moz-transform: skew(-30deg);
-ms-transform: skew(-30deg);
-o-transform: skew(-30deg);
opacity: 0;
transition: .5s;
z-index: -1;
}
.team_style_three_thumb_inner img {
width: 100%;
}
.team_style_three_content {
position: absolute;
bottom: -21px;
left: 0;
right: 18px;
z-index: 1;
padding: 15px 10px 35px 50px;
transition: .5s;
}
.team_style_three_content:before {
background: #145e52;
transition: .5s;
}
.team_style_three_content:before, .team_style_three_content:after {
content: '';
top: 0;
left: 0;
right: 50px;
bottom: 0;
position: absolute;
z-index: -2;
-webkit-transform: skew(-30deg);
-khtml-transform: skew(-30deg);
-moz-transform: skew(-30deg);
-ms-transform: skew(-30deg);
-o-transform: skew(-30deg);
transform: skew(-30deg);
transform-origin: left bottom;
-webkit-transform-origin: left bottom;
-webkit-transition: all .2s linear 0ms;
-khtml-transition: all .2s linear 0ms;
-moz-transition: all .2s linear 0ms;
-ms-transition: all .2s linear 0ms;
-o-transition: all .2s linear 0ms;
transition: all .2s linear 0ms;
}
.team_style_three_title h4 {
color: #fff;
font-size: 20px;
font-weight: 700;
margin: 0;
}
.team_style_three_sub_title {
transition: .5s;
position: absolute;
left: 51px;
top: 40px;
}
.team_style_three_sub_title span {
font-size: 14px;
color: #fff;
transition: .5s;
}
.team_style_three_icon a {
color: #fff;
display: inline-block;
margin: 5px;
}
.team_style_three_icon {
opacity: 0;
transition: .5s;
position: absolute;
left: 47px;
top: 50px;
}
.team_style_three:hover .team_style_three_icon {
opacity: 1;
top: 35px;
}
.team_style_three:hover .team_style_three-thumb:after {
opacity: 1;
-webkit-transform: rotate(-10deg);
-webkit-transform: skew(1deg);
transform: rotate(-10deg);
}
.team_style_three:hover .team_style_three_sub_title {
margin-top: -20px;
opacity: 0;
}
.team_style_three:hover .team_style_three_content:before {
background: #00247e;
transition: .5s;
}
/*====================================================
--< Techno Case Study Area Css -->
======================================================*/
.single_case_study {
overflow: hidden;
margin-bottom: 30px;
position: relative;
transition: .5s;
}
.single_case_study_thumb {
transform: scale(1.01);
transition: .5s;
}
.pdn_0 {
padding: 0;
}
.single_case_study_thumb::before {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
content: "";
background: rgba(12,90,219,0.85);
opacity: 0;
transition: .5s;
border: 3px solid #fff;
right: 0;
bottom: 0;
margin: auto;
}
.single_case_study_thumb img {
width: 100%;
}
.single_case_study_content {
position: absolute;
left: 0;
top: 70%;
right: 0;
text-align: center;
background: #fff;
width: 80%;
margin: auto;
border-radius: 5px;
padding: 20px 10px;
opacity: 0;
transition: .5s;
transform: translateY(-50%);
z-index: 1;
}
.single_case_study_icon {
text-align: center;
padding-bottom: 10px;
}
.single_case_study_content_inner {
text-align: center;
}
.single_case_study_content_inner h2 {
font-size: 22px;
}
.single_case_study_content_inner h2 a {
display: inline-block;
overflow: hidden;
font-weight: 600;
font-size: 20px;
transition: .5s;
}
.single_case_study_icon i {
background: #fff;
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
font-size: 18px;
border-radius: 5px;
color: #145e52;
transition: .5s;
}
/* Portfolio Hover */
.single_case_study:hover .single_case_study_thumb {
transform: scale(1.03);
}
.single_case_study:hover .single_case_study_content {
opacity: 1;
top: 50%;
}
.single_case_study:hover .single_case_study_thumb::before {
opacity: 1;
}
.single_case_study_content_inner h2 a:hover {
color: #145e52;
}
.single_case_study_icon i:hover {
background: #145e52;
color: #fff;
}
/* Case Study Style Two */
.case_study_style_two {
position: relative;
}
.case_study_style_two_thumb {
position: relative;
z-index: 1;
}
.case_study_style_two_thumb:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(12,90,219,0.65);
content: "";
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
border-radius: 10px;
}
.case_study_style_two_thumb img {
width: 100%;
border-radius: 10px;
}
.case_study_style_two_content {
position: absolute;
left: 0;
top: 80%;
right: 0;
background: transparent;
width: 100%;
margin: auto;
border-radius: 5px;
padding: 0 30px;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 1;
text-align: left;
}
.case_study_style_two_title h4 a {
color: #fff;
font-weight: 700;
display: block;
}
.case_study_style_two_title span {
color: #fff;
font-weight: 600;
}
.case_study_style_two_button a {
color: #fff;
}
.case_study_style_two:hover .case_study_style_two_content {
top: 70%;
}
/* Style Three */
.three .case_study_style_two_content {
top: 75%;
}
.three .case_study_style_two:hover .case_study_style_two_content {
top: 60%;
}
.three .case_study_style_two_title h4 {
font-size: 20px;
}
/*====================================================
--< Techno Case Study Details Area Css -->
======================================================*/
.single-case-study-details {
box-shadow: 0 0 30px rgba(0,0,0,0.10);
padding: 50px;
}
.case-study-details-title h3 {
font-weight: 800;
}
.case-study-details-content-inner ul li span {
font-size: 20px;
margin-right: 10px;
font-weight: 700;
}
.case-study-details-content-inner ul li {
border-bottom: 1px solid #ddd;
font-size: 18px;
font-weight: 300;
padding: 13px 0;
text-transform: capitalize;
list-style: none;
}
.case-study-details-content-inner ul li:last-child {
border-bottom: none;
}
.case-study-details-icon-text span {
font-size: 20px;
margin-right: 10px;
font-weight: 700;
float: left;
}
.case-study-details-icon-inner a {
display: inline-block;
width: 35px;
height: 35px;
background: #145e52;
color: #fff;
border-radius: 5px;
font-size: 18px;
text-align: center;
margin-right: 10px;
line-height: 35px;
}
.case-study-details-full-title h3 {
font-weight: 800;
}
.case-study-details-thumb img {
width: 100%;
}
/*====================================================
--< Techno Portfolio Area Css -->
======================================================*/
/* Portfolio Nav */
.portfolio_nav {
margin-bottom: 50px;
}
.portfolio_menu ul {
text-align: center;
list-style: none;
}
.portfolio_menu ul li {
display: inline-block;
margin: 0 14px;
cursor: pointer;
}
.portfolio_menu ul li a {
display: block;
color: #fff;
text-transform: uppercase;
position: relative;
transition: .5s;
}
.portfolio_menu ul li a:before {
position: absolute;
content: "";
left: 0;
top: 24px;
height: 2px;
width: 0%;
background: #fff;
transition: .5s;
}
.portfolio_nav ul li {
background: #f2f4ff;
border: medium none;
font-size: 16px;
line-height: 1;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
cursor: pointer;
text-transform: capitalize;
padding: 12px 27px;
font-weight: 500;
letter-spacing: 2px;
position: relative;
margin: 0 3px;
margin-bottom: 7px;
display: inline-block;
border-radius: 5px;
}
.portfolio_nav ul li:hover, .portfolio_nav ul li.current_menu_item {
color: #fff;
background: #145e52;
}
/* Single Portfolio */
.single_portfolio {
overflow: hidden;
margin-bottom: 30px;
position: relative;
transition: .5s;
}
.single_portfolio_thumb {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: .5s;
}
.single_portfolio_content {
position: absolute;
text-align: center;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
right: 20px;
bottom: 20px;
left: 20px;
opacity: 0;
background: #145e52;
margin: auto;
text-align: left;
padding: 30px 20px 30px;
border-radius: 5px;
}
.single_portfolio_icon {
text-align: center;
padding-bottom: 10px;
}
.single_portfolio_content_inner {
text-align: center;
}
.single_portfolio_content_inner h2 {
font-size: 22px;
margin: 0;
}
.single_portfolio_content_inner h2 a {
display: inline-block;
overflow: hidden;
font-weight: 600;
color: #fff;
}
.single_portfolio_icon i {
background: #fff;
height: 40px;
width: 40px;
text-align: center;
line-height: 40px;
font-size: 18px;
border-radius: 5px;
color: #135ef3;
transition: .5s;
}
.single_portfolio_thumb img {
width: 100%;
}
.single_portfolio_content_inner span {
color: #fff;
}
/* Portfolio Hover */
.single_portfolio:hover .single_portfolio_thumb {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
.portfolio_menu ul li a:hover:before {
width: 100%;
}
.single_portfolio:hover .single_portfolio_content {
opacity: 1;
bottom: 35px;
}
.single_portfolio_icon i:hover {
background: #fff;
color: #135ef3;
}
/*====================================================
--< Techno How It Work Area Css -->
======================================================*/
.single_it_work {
text-align: center;
}
.single_it_work_content_list {
position: relative;
}
.single_it_work_content_list::before {
position: absolute;
right: -75px;
top: 26px;
height: 1px;
width: 130px;
content: "";
background: #ddd;
}
.single_it_work_content_list.three::before {
display: none;
}
.single_it_work_content_list span {
background: #145e52;
border-radius: 50%;
color: #fff;
font-weight: 600;
position: relative;
height: 45px;
width: 45px;
line-height: 45px;
display: inline-block;
transition: .3s;
}
.single_work_content_title h4 {
font-size: 20px;
font-weight: 700;
}
.single_it_work_content_list span:after {
position: absolute;
left: -10px;
top: -10px;
height: 65px;
width: 65px;
content: "";
background: #145e52;
z-index: -1;
border-radius: 50%;
right: 0;
margin: auto;
opacity: 0.4;
transition: .3s;
}
.single_it_work_content_list span:before {
position: absolute;
left: -20px;
top: -20px;
height: 85px;
width: 85px;
content: "";
background: #145e52;
z-index: -1;
border-radius: 50%;
right: 0;
margin: auto;
opacity: 0.2;
transition: .3s;
}
.single_it_work:hover .single_it_work_content_list span,
.single_it_work:hover .single_it_work_content_list span:before,
.single_it_work:hover .single_it_work_content_list span:after {
transform: scale(1.1);
}
/* How It Work Style Tow */
.it_work_style_two .techno_flipbox .techno_flipbox_font, .it_work_style_two .techno_flipbox .techno_flipbox_back {
min-height: 410px;
}
.it_work_style_two .it_work_style_two .techno_flipbox .techno_flipbox_inner {
top: 50%;
}
.techno_flipbox_font .icon {
color: #fff;
font-size: 44px;
line-height: 80px;
height: 80px;
width: 80px;
/*background: #145e52;*/
background: #cd8b36;
border-radius: 33% 66% 70% 30%/49% 62% 38% 51% !important;
display: inline-block;
}
.it_work_style_two .techno_flipbox_font {
background: #ffffff;
border: 2px solid #e8ecfc;
border-radius: 7px 7px 7px 7px;
}
.it_work_style_two .techno_flipbox_font .flipbox_title h3 {
color: #444;
font-weight: 700;
font-size: 24px;
}
.it_work_style_two .techno_flipbox_font .flipbox_desc p {
color: #666;
}
.it_work_style_two .techno_flipbox .techno_flipbox_back .flipbox_button a {
background: inherit;
color: #fff;
display: inline-block;
padding: 0;
border-radius: inherit;
border: inherit;
font-size: 18px;
margin-top: 5px;
font-weight: 600;
}
.it_work_style_two .techno_flipbox .techno_flipbox_back::before {
background: inherit;
}
/*====================================================
--< Techno Pricing Area Css -->
======================================================*/
.single_pricing {
padding: 51px 40px 60px;
text-align: center;
border: 1px solid #e6e6e6;
border-radius: 8px;
transition: .5s;
}
.single_pricing.active {
border: 1px solid #145e52;
}
.pricing_title h3 {
font-size: 30px;
color: #145e52;
font-weight: 700;
}
.pricing_body {
border: 1px solid #e6e6e6;
border-radius: 8px;
transition: .5s;
}
.single_pricing.active .pricing_body {
border: 1px solid #145e52;
}
.pricing_body .featur ul li {
margin-bottom: 13px;
display: block;
}
.curencyp {
font-size: 29px;
font-weight: 500;
position: relative;
top: -15px;
color: #145e52;
}
.pricing_tk h2 {
display: inline-block;
font-size: 55px;
font-weight: 700;
color: #145e52;
}
.pricing_tk h2 span {
font-size: 19px;
font-weight: 500;
}
.order_now a {
display: inline-block;
font-size: 18px;
font-weight: 600;
padding: 16px 42px;
color: #616161;
border: 1px solid #e6e6e6;
border-radius: 5px;
transition: .5s;
background: transparent;
}
.single_pricing.active .order_now a {
color: #fff;
border: 1px solid #145e52;
background: #145e52;
}
.single_pricing:hover {
border: 1px solid #145e52;
}
.single_pricing:hover .pricing_body {
border: 1px solid #145e52;
}
.single_pricing:hover .order_now a {
background: #145e52;
color: #fff;
border: 1px solid #145e52;
}
/* Pricing Style Two */
.pricing_style2 {
text-align: center;
margin-bottom: 30px;
position: relative;
padding: 0 0 32px;
transition: .5s;
overflow: hidden;
box-shadow: 0px 8px 14.72px 1.28px rgba(207, 207, 207, 0.3);
border-radius: 10px;
}
.pricing_head_style2 {
padding: 12px 0 21px;
background: #0762f8;
}
.pricing_title_style2 h3 {
font-size: 25px;
color: #fff;
text-transform: capitalize;
padding-bottom: 5px;
}
.pricing_tk_style2 h2 {
display: inline-block;
font-size: 40px;
font-weight: 300;
text-align: center;
color: #fff;
transition: .5s;
}
.pricing_tk_style2 span {
font-size: 14px;
color: #fff;
font-weight: 400;
}
.pricing_body_style2 {
margin-top: 40px;
}
.pricing_body_style2 .featur_style2 ul li {
display: block;
font-size: 15px;
margin-bottom: 18px;
}
.pricing_body_style2 .deactive {
text-decoration: line-through;
color: #CCDCEA;
}
.pricing_style2_button {
margin-top: 33px;
}
.order_style2_now a {
background: #f5f5f5;
color: #0762f8;
padding: 18px 55px;
font-size: 18px;
font-weight: 500;
transition: .5s;
position: relative;
overflow: hidden;
z-index: 1;
border-radius: 5px;
display: inline-block;
}
.active .order_style2_now a {
background: #0762f8;
color: #fff;
}
.order_style2_now a:before {
position: absolute;
content: "";
top: 0px;
height: 100%;
left: -25%;
width: 0%;
background: #0762f8;
transform: skew(50deg);
transition-duration: .6s;
z-index: -1;
transition: .5s;
}
.pricing_style2:hover {
transform: translateY(-10px);
}
.pricing_style2:hover .order_style2_now a:before {
width: 180%;
}
.pricing_style2:hover .order_style2_now a {
color: #fff;
}
/*====================================================
--< Techno Process Area Css -->
======================================================*/
.single_process {
text-align: center;
position: relative;
transition: .5s;
margin-bottom: 30px;
}
.single_process_thumb {
display: inline-block;
border-radius: 100%;
animation: checkAnim 2s infinite;
}
.single_process_thumb img {
border-radius: 100%;
border: 10px solid #fff;
}
.single_process_number_inner {
position: relative;
}
.single_process_number_inner {
position: absolute;
left: 0;
top: 55%;
height: 100%;
width: 100%;
margin: auto;
transition: .5s;
}
.single_process_number span {
height: 50px;
width: 50px;
background: #145e52;
display: inline-block;
line-height: 50px;
border-radius: 50%;
font-size: 20px;
color: #fff;
}
.single_process_content {
padding-top: 30px;
}
.single_process_content h2 {
font-size: 22px;
font-weight: 700;
}
.single_process:hover .single_process_number_inner {
top: 40%;
}
/*====================================================
--< Techno Counter Area Css -->
======================================================*/
.cntr_bg_up {
background: #ffffff;
border-radius: 15px;
box-shadow: 11px 11px 38px rgba(0,0,0,0.2);
}
.countr_text h1 {
font-size: 40px;
font-weight: 800;
}
.counter_desc h5 {
margin-top: 6px;
color: #145e52;
}
.single_counter_icon i {
font-size: 30px;
color: #fff;
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
display: inline-block;
width: 80px;
height: 80px;
background: #145e52;
border-radius: 100%;
line-height: 80px;
}
.white .countr_text h1 {
color: #fff;
}
.white .counter_desc h5 {
color: #fff;
}
/*====================================================
--< Techno Testimonial Area Css -->
======================================================*/
.single_testimonial_content_text {
box-shadow: 0 18px 17px 0 rgba(0,0,0,.1);
padding: 32px 43px 20px;
position: relative;
background: #fff;
}
.single_testimonial_content_text:before {
content: '';
bottom: -20px;
top: auto;
border-color: #fff transparent transparent #fff;
display: block;
position: absolute;
left: 0;
margin-left: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 15px;
}
.single_testimonial_thumb {
float: left;
}
.single_testimonial_thumb img {
width: 100%;
border-radius: 50%;
margin: auto;
}
.single_testimonial_content_title h4 {
font-size: 20px;
margin-top: 30px;
font-weight: 700;
}
.single_testimonial_content_title span {
color: #145e52;
font-weight: 500;
font-size: 16px;
display: block;
padding-top: 4px;
}
.white .single_testimonial_content_title span {
color: #fff;
}
.experience_thumb img {
width: 100%;
}
@keyframes checkAnim {
0%, 100% {
box-shadow: 0 0 0 5px rgba(12,90,219, 0.8);
}
50% {
box-shadow: 0 0 0 8px rgba(12,90,219, 0.8);
}
}
/* Tesimonial Style Two */
#section-quote {
width: 100%;
position: relative;
overflow: hidden;
text-align: center;
}
#section-quote > h2 {
color: #0e1c2a;
font-family: OpenSans-Regular;
font-size: 36px;
font-weight: normal;
}
#section-quote > p {
color: #767676;
font-family: OpenSans-Light;
font-size: 18px;
text-align: center;
margin-top: 10px;
}
#section-quote .container-quote {
position: relative;
width: 100%;
margin: 55px 0 150px;
height: 135px;
-webkit-perspective: 10000px;
-moz-perspective: 10000px;
-ms-perspective: 10000px;
perspective: 10000px;
}
#section-quote .container-quote .quote {
width: 520px;
height: 100%;
position: absolute;
top: 0px;
left: 50%;
cursor: pointer;
text-align: center;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: all 1s cubic-bezier(0.5,-0.01, 0, 1.005);
-moz-transition: all 1s cubic-bezier(0.5,-0.01, 0, 1.005);
-o-transition: all 1s cubic-bezier(0.5,-0.01, 0, 1.005);
transition: all 1s cubic-bezier(0.5,-0.01, 0, 1.005);
}
#section-quote .container-quote .quote.hide-top {
opacity: 0;
-webkit-transform: translateX(-50%) translateY(-100%) rotateX(70deg);
-moz-transform: translateX(-50%) translateY(-100%) rotateX(70deg);
-ms-transform: translateX(-50%) translateY(-100%) rotateX(70deg);
-o-transform: translateX(-50%) translateY(-100%) rotateX(70deg);
transform: translateX(-50%) translateY(-100%) rotateX(70deg);
}
#section-quote .container-quote .quote.show {
opacity: 1;
-webkit-transform: translateX(-50%) translateY(0%) rotateX(0deg);
-moz-transform: translateX(-50%) translateY(0%) rotateX(0deg);
-ms-transform: translateX(-50%) translateY(0%) rotateX(0deg);
-o-transform: translateX(-50%) translateY(0%) rotateX(0deg);
transform: translateX(-50%) translateY(0%) rotateX(0deg);
}
#section-quote .container-quote .quote.hide-bottom {
opacity: 0;
-webkit-transform: translateX(-50%) translateY(100%) rotateX(-70deg);
-moz-transform: translateX(-50%) translateY(100%) rotateX(-70deg);
-ms-transform: translateX(-50%) translateY(100%) rotateX(-70deg);
-o-transform: translateX(-50%) translateY(100%) rotateX(-70deg);
transform: translateX(-50%) translateY(100%) rotateX(-70deg);
}
#section-quote .container-quote .quote p {
line-height: 28px;
display: block;
}
#section-quote .container-quote .quote .container-info {
display: inline-block;
padding-left: 40px;
position: relative;
margin-top: 20px;
text-align: left;
}
#section-quote .container-quote .quote .container-info .pp {
height: 30px;
width: 30px;
border-radius: 100%;
position: absolute;
left: 0px;
top: 50%;
border: 2px solid #fff;
box-shadow: 0 2px 3px rgba(0,0,0,0.1);
background-repeat: no-repeat;
background-position: center center;
background-size: 120%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
#section-quote .container-quote .quote-text-1 .container-info .pp {
background-image: url(assets/images/testi/1.jpg);
}
#section-quote .container-quote .quote-text-2 .container-info .pp {
background-image: url(assets/images/testi/2.jpg);
}
#section-quote .container-quote .quote-text-3 .container-info .pp {
background-image: url(assets/images/testi/3.jpg);
}
#section-quote .container-quote .quote-text-4 .container-info .pp {
background-image: url(assets/images/testi/4.jpg);
}
#section-quote .container-quote .quote-text-5 .container-info .pp {
background-image: url(assets/images/testi/5.jpg);
}
#section-quote .container-quote .quote-text-6 .container-info .pp {
background-image: url(assets/images/testi/6.jpg);
}
#section-quote .container-quote .quote-text-8 .container-info .pp {
background-image: url(assets/images/testi/8.jpg);
}
#section-quote .container-quote .quote-text-9 .container-info .pp {
background-image: url(assets/images/testi/9.jpg);
}
#section-quote .container-quote .quote-text-10 .container-info .pp {
background-image: url(assets/images/testi/10.jpg);
}
#section-quote .container-quote .quote-text-11 .container-info .pp {
background-image: url(assets/images/testi/11.jpg);
}
#section-quote .container-quote .quote-text-12 .container-info .pp {
background-image: url(assets/images/testi/12.jpg.png);
}
#section-quote .container-quote .quote-text-13 .container-info .pp {
background-image: url(assets/images/testi/13.jpg);
}
#section-quote .container-quote .quote-text-14 .container-info .pp {
background-image: url(assets/images/testi/14.jpg);
}
#section-quote .container-quote .quote .container-info .name {
color: #444;
font-size: 22px;
font-weight: 600;
}
#section-quote .container-quote .quote .container-info .job {
color: #666;
font-size: 16px;
}
#section-quote .container-pe-quote {
position: absolute;
height: 100%;
top: 0px;
z-index: 1;
}
#section-quote .container-pe-quote.left {
left: 110px;
}
#section-quote .container-pe-quote.right {
right: 80px;
}
#section-quote .container-pe-quote .pp-quote {
cursor: pointer;
position: absolute;
border-radius: 100%;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
animation-name: floating;
-webkit-animation-name: floating;
animation-iteration-count: infinite;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-transform-origin: 50% 1px;
-moz-transform-origin: 50% 1px;
-ms-transform-origin: 50% 1px;
-o-transform-origin: 50% 1px;
transform-origin: 50% 1px;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-ms-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
}
#container-general .anim-section-quote #section-quote .container-pe-quote .pp-quote {
opacity: 1;
}
#section-quote .container-pe-quote .pp-quote .img {
overflow: hidden;
border-radius: 100%;
height: 100%;
width: 100%;
background-repeat: no-repeat;
background-position: center center;
background-size: 120%;
position: relative;
z-index: 1;
}
#section-quote .container-pe-quote .pp-quote.li-quote-1 .img {
background-image: url(assets/images/testi/1.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-2 .img {
background-image: url(assets/images/testi/2.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-3 .img {
background-image: url(assets/images/testi/3.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-4 .img {
background-image: url(assets/images/testi/4.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-5 .img {
background-image: url(assets/images/testi/5.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-6 .img {
background-image: url(assets/images/testi/6.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-7 .img {
background-image: url(assets/images/testi/7.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-8 .img {
background-image: url(assets/images/testi/8.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-9 .img {
background-image: url(assets/images/testi/9.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-10 .img {
background-image: url(assets/images/testi/10.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-11 .img {
background-image: url(assets/images/testi/11.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-12 .img {
background-image: url(assets/images/testi/12.jpg.png);
}
#section-quote .container-pe-quote .pp-quote.li-quote-13 .img {
background-image: url(assets/images/testi/13.jpg);
}
#section-quote .container-pe-quote .pp-quote.li-quote-14 .img {
background-image: url(assets/images/testi/14.jpg);
}
#section-quote .container-pe-quote .pp-quote:after {
content: '';
position: absolute;
top: 50%;
left: 50%;
height: calc(100% + 5px);
width: calc(100% + 5px);
border-radius: 100%;
background-color: #fff;
-webkit-transform: translate(-50%,-50%) scale(1);
-moz-transform: translate(-50%,-50%) scale(1);
-ms-transform: translate(-50%,-50%) scale(1);
-o-transform: translate(-50%,-50%) scale(1);
transform: translate(-50%,-50%) scale(1);
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
#section-quote .container-pe-quote .pp-quote:hover:after,
#section-quote .container-pe-quote .pp-quote.active:after {
background: #145e52;
-webkit-transform: translate(-50%,-50%) scale(1.05);
-moz-transform: translate(-50%,-50%) scale(1.05);
-ms-transform: translate(-50%,-50%) scale(1.05);
-o-transform: translate(-50%,-50%) scale(1.05);
transform: translate(-50%,-50%) scale(1.05);
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
@keyframes floating {
from {
-webkit-transform: rotate(0deg) translate(-10px) rotate(0deg);
-moz-transform: rotate(0deg) translate(-10px) rotate(0deg);
-ms-transform: rotate(0deg) translate(-10px) rotate(0deg);
-o-transform: rotate(0deg) translate(-10px) rotate(0deg);
transform: rotate(0deg) translate(-10px) rotate(0deg);
}
to {
-webkit-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-moz-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-ms-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-o-transform: rotate(360deg) translate(-10px) rotate(-360deg);
transform: rotate(360deg) translate(-10px) rotate(-360deg);
}
}
@-webkit-keyframes floating {
from {
-webkit-transform: rotate(0deg) translate(-10px) rotate(0deg);
-moz-transform: rotate(0deg) translate(-10px) rotate(0deg);
-ms-transform: rotate(0deg) translate(-10px) rotate(0deg);
-o-transform: rotate(0deg) translate(-10px) rotate(0deg);
transform: rotate(0deg) translate(-10px) rotate(0deg);
}
to {
-webkit-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-moz-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-ms-transform: rotate(360deg) translate(-10px) rotate(-360deg);
-o-transform: rotate(360deg) translate(-10px) rotate(-360deg);
transform: rotate(360deg) translate(-10px) rotate(-360deg);
}
}
#section-quote .container-pe-quote .li-quote-1 {
height: 90px;
width: 90px;
left: 40px;
top: 30px;
animation-duration: 10s;
-webkit-animation-duration: 10s;
-webkit-transition-delay: 0.6s;
transition-delay: 0.6s;
}
#section-quote .container-pe-quote .li-quote-2 {
height: 63px;
width: 63px;
left: 150px;
top: 150px;
animation-duration: 12s;
-webkit-animation-duration: 12s;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
#section-quote .container-pe-quote .li-quote-3 {
height: 82px;
width: 82px;
left: -70px;
top: 180px;
animation-duration: 11s;
-webkit-animation-duration: 11s;
-webkit-transition-delay: 0.6s;
transition-delay: 0.6s;
}
#section-quote .container-pe-quote .li-quote-4 {
height: 48px;
width: 48px;
left: 80px;
top: 250px;
animation-duration: 6s;
-webkit-animation-duration: 6s;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
#section-quote .container-pe-quote .li-quote-5 {
height: 73px;
width: 73px;
left: -60px;
top: 320px;
animation-duration: 7s;
-webkit-animation-duration: 7s;
-webkit-transition-delay: 0.7s;
transition-delay: 0.7s;
}
#section-quote .container-pe-quote .li-quote-6 {
height: 63px;
width: 63px;
left: 65px;
top: 380px;
animation-duration: 5s;
-webkit-animation-duration: 5s;
-webkit-transition-delay: 0.1s;
transition-delay: 0.1s;
}
#section-quote .container-pe-quote .li-quote-12 {
height: 63px;
width: 63px;
left: -15px;
top: 460px;
animation-duration: 8s;
-webkit-animation-duration: 8s;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
#section-quote .container-pe-quote .li-quote-7 {
height: 73px;
width: 73px;
right: -15px;
top: 30px;
animation-duration: 5s;
-webkit-animation-duration: 5s;
-webkit-transition-delay: 0.7s;
transition-delay: 0.7s;
}
#section-quote .container-pe-quote .li-quote-8 {
height: 73px;
width: 73px;
right: 50px;
top: 150px;
animation-duration: 8s;
-webkit-animation-duration: 8s;
-webkit-transition-delay: 0.4s;
transition-delay: 0.4s;
}
#section-quote .container-pe-quote .li-quote-9 {
height: 48px;
width: 48px;
right: 150px;
top: 90px;
animation-duration: 7s;
-webkit-animation-duration: 7s;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
}
#section-quote .container-pe-quote .li-quote-10 {
height: 90px;
width: 90px;
right: 225px;
top: 250px;
animation-duration: 8s;
-webkit-animation-duration: 8s;
-webkit-transition-delay: 0.4s;
transition-delay: 0.4s;
}
#section-quote .container-pe-quote .li-quote-11 {
height: 52px;
width: 52px;
right: 40px;
top: 320px;
animation-duration: 7s;
-webkit-animation-duration: 7s;
-webkit-transition-delay: 0.5s;
transition-delay: 0.5s;
}
#section-quote .container-pe-quote .li-quote-13 {
height: 42px;
width: 42px;
right: 128px;
top: 380px;
animation-duration: 9s;
-webkit-animation-duration: 9s;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
#section-quote .container-pe-quote .li-quote-14 {
height: 48px;
width: 48px;
right: 108px;
top: 470px;
animation-duration: 7s;
-webkit-animation-duration: 7s;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
/*====================================================
--< Techno Tab Area Css -->
======================================================*/
.nagative_margin2 {
position: relative;
margin-top: -108px;
}
.nav-tabs .nav-item {
margin: 0 5px;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
color: #145e52;
background-color: #fff;
border-color: transparent !important;
}
.nav-tabs .nav-link {
border: 1px solid #145e52 !important;
background: #145e52;
padding: 22px 50px;
font-size: 20px;
color: #fff;
}
.nav-tabs {
border-bottom: inherit !important;
}
.nav-tabs .nav-link i {
font-size: 30px;
display: block;
text-align: center;
padding-bottom: 5px;
}
.tab_thumb img {
width: 100%;
}
.tab_content_title h4 {
font-weight: 700;
}
.tab_content_sub_text ul {
display: block;
}
.tab_content_sub_text ul li {
list-style: none;
margin-bottom: 5px;
}
/*====================================================
--< Techno Choose Us Area Css -->
======================================================*/
.choose_us .techno_flipbox .techno_flipbox_font, .choose_us .techno_flipbox .techno_flipbox_back {
min-height: 410px;
}
.choose_us .techno_flipbox .techno_flipbox_font {
position: relative;
border: 0 !important;
}
.choose_us .techno_flipbox .techno_flipbox_font::before {
position: absolute;
content: "";
left: 0;
top: 0;
width: 100%;
height: 100%;
background: linear-gradient(0deg,black 0%,rgba(255,255,255,0) 100%) !important;
}
.choose_us .techno_flipbox .techno_flipbox_inner {
top: 72%;
}
.choose_us .techno_flipbox .techno_flipbox_back .techno_flipbox_inner {
top: 50%;
}
/* Style Two */
.choose_icon_lft {
float: left;
}
.choose_icon_lft i {
color: #145e52;
height: 70px;
width: 70px;
line-height: 68px;
border: 1px solid #307cff;
border-radius: 4px 4px 4px 4px;
font-size: 30px;
text-align: center;
background: transparent;
transition: .5s;
}
.choose_content_title_lft h5 {
font-weight: 700;
}
.choose_us_content:hover .choose_icon_lft i {
background: #145e52;
color: #fff;
}
.choose_content_text_bold p {
font-size: 19px;
font-weight: 600;
color: #232323;
}
/*====================================================
--< Techno Accordion Area Css -->
======================================================*/
.main-accordion-lt {
background: #2d2d2d;
}
.acd-items.acd-arrow {
margin-left: 160px;
}
.panel-heading .panel-title a {
background: #393939;
display: block;
font-weight: 600;
padding: 10px 15px;
position: relative;
color: #fff;
font-size: 18px;
}
.faq .panel-heading .panel-title a {
background: #eff2f7;
color: #232323;
transition: .5s;
}
.faq .panel-heading .panel-title a:hover {
color: #145e52;
}
.faq .panel-body p {
color: #8a8a8a;
}
.acd-items .panel-heading {
padding: 0;
}
.panel.panel-default {
border-color: #e7e7e7;
border-radius: inherit;
box-shadow: inherit;
}
.panel-body p {
color: #cccccc;
}
.default .panel-body p {
color: #666;
}
.accordion-area .absod {
padding: 0;
}
.panel-heading.mb-3 a i {
font-size: 15px;
margin-right: 10px;
}
.panel-group.symb .panel-heading a::after {
content: "-";
font-size: 20px;
position: absolute;
right: 10px;
top: 7px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
.panel-group.symb .panel-heading a.collapsed:after {
content: "+";
font-size: 20px;
position: absolute;
right: 10px;
top: 10px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
}
.single_faq_title h4 {
font-weight: 700;
}
/*====================================================
--< Techno Contact Area Css -->
======================================================*/
.form_box input {
width: 100%;
height: 50px;
padding-left: 15px;
background: transparent;
border: 1px solid #fff;
border-radius: 5px;
color: #fff;
transition: .5s;
}
.form_box textarea {
width: 100%;
background: transparent;
padding-left: 15px;
padding-top: 20px;
height: 250px;
border: 1px solid #fff;
border-radius: 5px;
color: #fff;
transition: .5s;
}
.quote_btn button {
background: #fff;
border: 0;
display: inline-block;
text-align: center;
padding: 14px 39px;
border-radius: 7px;
transition: .3s;
}
.quote_btn button:hover {
background: #00247e;
color: #fff;
}
.appointment_form_inner {
background: #ffffff;
padding: 70px 70px 70px 70px;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 5px 30px rgba(0,0,0,0.15);
}
.appointment_title h1 {
text-align: center;
font-weight: 800;
}
.appointment_form .form_box input {
border: 1px solid #e6e6e6;
color: #495057;
}
.appointment_form .form_box textarea {
border: 1px solid #e6e6e6;
color: #495057;
}
.appointment_form .quote_btn button {
background: #145e52;
color: #fff;
}
.appointment_form .form_box input:focus,
.appointment_form .form_box textarea:focus {
color: #495057;
background-color: #fff;
border-color: #80bdff;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.main_contact_area .form_box input {
border: 1px solid #e6e6e6;
color: #495057;
background-color: #fff;
}
.main_contact_area .form_box textarea {
border: 1px solid #e6e6e6;
color: #495057;
background-color: #fff;
}
.main_contact_area .quote_btn button {
background: #145e52;
color: #fff;
}
.main_contact_area .form_box input:focus,
.main_contact_area .form_box textarea:focus {
color: #495057;
background-color: #fff;
border-color: #80bdff;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.map {
width: 100%;
margin: 0;
height: 410px;
border: 1px solid #ddd;
border-radius: 10px;
}
.google_map_area .col-lg-12 {
padding: 0;
}
/*====================================================
--< Techno Blog Area Css -->
======================================================*/
.single_contact_address {
border: 1px solid #d0e5fb;
border-radius: 5px 5px 5px 5px;
padding: 30px 25px 15px;
}
.contact_address_icon i {
font-size: 40px;
color: #145e52;
}
.contact_address_title h4 {
font-weight: 700;
}
/*====================================================
--< Techno Blog Area Css -->
======================================================*/
.single_blog {
border: 1px solid #ebebeb;
overflow: hidden;
transition: .5s;
}
.single_blog_content {
background: #fff;
}
.single_blog:hover {
border-color: transparent;
box-shadow: 0 5px 30px rgba(0,0,0,0.2);
}
.blog_page_title h3 {
font-size: 21px;
transition: .5s;
}
.blog_page_title a {
font-weight: 700;
}
.single_blog_thumb img {
width: 100%;
}
.blog_page_button a {
font-size: 15px;
transition: .5s;
color: #616161;
}
.blog_page_button a i {
margin-left: 6px;
}
.blog_page_button a:hover {
color: #145e52;
}
.blog_page_title a:hover {
color: #145e52;
}
.techno_blog_meta a {
color: #616161;
transition: .3s;
position: relative;
}
.techno_blog_meta a:before {
position: absolute;
right: -6px;
height: 14px;
width: 1px;
background: #666;
content: "";
top: 5px;
}
.techno_blog_meta a:hover {
color: #145e52;
}
.subscribe_content_title h2 {
font-size: 32px;
font-weight: 700;
}
.subscribe_form input {
font-size: 14px;
height: 65px;
padding: 5px 25px;
position: relative;
width: 100%;
background: #F6F6FC;
border: 0;
border-radius: 0;
margin-bottom: 14px;
margin: auto;
border: 0;
border-radius: 15px;
}
.subscribe_form_send button {
text-align: center;
-webkit-transition: all 0.4s ease 0s;
-o-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
border: medium none;
border-radius: 15px;
background: #145e52;
display: block;
color: #fff;
font-weight: 500;
text-transform: capitalize;
text-align: center;
margin: auto;
padding: 15px 43px;
position: absolute;
right: 20px;
top: 74%;
display: inline-block;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.subscribe_form_send button:hover {
color: #fff;
}
/* Style Blog All */
.techno_blog_meta.shado_bg {
box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.11);
padding: 10px 12px;
position: relative;
margin-top: -26px;
background: #fff;
border-radius: 5px;
}
.single_blog_thumb.el_thumb {
overflow: hidden;
}
.single_blog_thumb.el_thumb img {
transition: .5s;
overflow: hidden;
}
.single_blog:hover .single_blog_thumb.el_thumb img {
transform: scale(1.2);
}
/*====================================================
--< Techno Footer Middle Area Css -->
======================================================*/
.footer-middle {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
background: #fff;
padding-top: 30%;
}
.widget-title {
color: #fff;
font-size: 22px;
}
.company-info-desc p {
color: #fff;
}
.menu-quick-link-container ul li a {
color: #fff;
position: relative;
transition: .5s;
}
.menu-quick-link-container ul li a:before {
position: absolute;
content: "";
left: -24px;
top: 10px;
height: 1px;
width: 13px;
background: #fff;
}
.menu-quick-link-container ul li {
padding-bottom: 10px;
}
.recent-post-text a {
color: #fff;
font-weight: 500;
transition: .5s;
}
.recent-post-image {
float: left;
}
.follow-company-text a {
font-size: 16px;
transition: .5s;
}
.follow-company-text a p {
color: #fff;
transition: .5s;
}
.follow-company-text {
float: left;
}
.follow-company-icon a {
font-size: 16px;
color: #fff;
margin: 0 5px;
font-weight: 500;
display: inline-block;
transition: .5s;
}
.footer-social-info p span {
font-weight: 600 !important;
color: #fff;
}
.footer-social-info p {
color: #fff;
}
.recent-post-text span {
color: #adb0be;
}
.recent-post-item.active {
border-bottom: 1px solid #adb0be;
}
.follow-company-icon a:hover {
color: #145e52;
}
.follow-company-text a p:hover {
color: #145e52;
}
.menu-quick-link-container ul li a:hover {
color: #145e52;
}
.recent-post-text a:hover {
color: #145e52;
}
/*====================================================
--< Techno Footer Bottom Area Css -->
======================================================*/
.footer-bottom {
border-top: 1px solid rgba(255,255,255,.23);
}
.footer-bottom-content-copy p {
/*color: #fff;*/
}
.footer-bottom-right-text {
text-align: left;
}
.footer-bottom-right-text a {
/*color: #fff;*/
display: inline-block;
}
.footer-bottom-right-text .absod {
margin-left: 30px;
position: relative;
}
.footer-bottom-right-text .absod::before {
position: absolute;
content: "";
left: -17px;
top: 6px;
height: 14px;
width: 1px;
background: #495057;
transform: skew(-20deg);
}
/*====================================================
--< Techno Blog Details Area Css -->
======================================================*/
.blog-details-area {
background: #fff;
}
.blog_dtl_top_bs span {
background: #145e52;
padding: 8px 30px;
color: #fff;
border-radius: 30px;
}
.techno-blog-thumb img {
transform: scale(1.01);
transition: .5s;
width: 100%;
}
.techno-single-blog.admin:hover .techno-blog-thumb img {
transform: scale(1.2);
}
/* Blog Details Content CSS */
.blog_dtl_content {
padding: 38px 45px 45px;
-webkit-box-shadow: 0 3px 19px rgba(0,0,0,.08);
box-shadow: 0 3px 19px rgba(0,0,0,.08);
border-radius: 0 0 10px 10px;
}
.recent_post_dtls {
padding: 38px 45px 45px;
-webkit-box-shadow: 0 3px 19px rgba(0,0,0,.08);
box-shadow: 0 3px 19px rgba(0,0,0,.08);
border-radius: 0 0 10px 10px;
}
.blog_dt_title h4 {
font-weight: 700;
}
.blog_dtl_thumb img {
width: 100%;
}
.blog_dtl_content h2 {
color: #0d1218;
font-size: 35px;
padding-top: 20px;
font-weight: 700;
}
.techno-blog-meta-left {
padding: 12px 0 35px;
}
.techno-blog-meta-left span {
color: #0d1218;
margin-right: 40px;
}
.techno-blog-meta-left i {
margin-right: 10px;
}
.blog_details_dtn_icon a i {
border: 1px solid #e6e6e6;
color: #565872;
display: inline-block;
font-size: 15px;
height: 40px;
line-height: 41px;
margin: 0 9px 0 0;
text-align: center;
width: 40px;
border-radius: 5px;
}
.blog_details_dtn_icon a i:hover {
background: #145e52;
border-color: #145e52;
color: #fff;
}
.blog_dtl_content h3 {
color: #0d1218;
padding: 10px 0 20px;
font-size: 24px;
font-weight: 700;
}
.blog_details blockquote {
margin: 37px 0 36px;
font-size: 14px;
border-left: 7px solid #145e52;
background: #f7fafd;
font-style: italic;
font-weight: 500;
padding: 25px 35px 15px;
}
.signatures {
text-align: right;
font-weight: 600;
font-style: italic;
font-size: 15px;
}
/* POST REPLY CSS */
.blog_comments_section {
padding: 38px 45px 45px;
-webkit-box-shadow: 0 3px 19px rgba(0,0,0,.08);
box-shadow: 0 3px 19px rgba(0,0,0,.08);
border-radius: 0 0 10px 10px;
}
.comments_ttl > h3 {
font-size: 24px;
color: #0d1218;
font-weight: 700;
}
.comments_ttl {
margin-bottom: 37px;
}
.commentst_content p {
color: #0d1218;
}
.comments_thumb {
float: left;
margin-right: 20px;
overflow: hidden;
}
.commentst_content {
overflow: hidden;
}
.blog_comments_section .post_meta {
margin-bottom: 6px;
}
.blog_comments_section .post_meta span {
font-weight: 400;
padding-right: 15px;
color: #6d6d6d;
}
.blog_comments_section .post_meta span:hover {
color: #03a9f4;
}
.blog_comments_section .post_meta span:last-child:before {
display: none;
}
.commentst_meta_reply {
float: right;
}
.commentst_meta_reply i {
margin-right: 10px;
}
.commentst_meta_reply:hover {
color: #03a9f4;
}
.single_commentst_inner {
margin-bottom: 44px;
margin-top: 46px;
padding-left: 63px;
}
.badmin i {
margin-right: 3px;
}
/* COMMENT FORM CSS */
.blog_reply {
overflow: hidden;
margin-top: 50px;
padding: 20px 15px 37px;
box-shadow: 0 7px 16px rgba(0, 0, 0, 0.15);
}
.reply_ttl > h3 {
font-size: 24px;
color: #0d1218;
font-weight: 700;
}
.reply_ttl {
margin-bottom: 36px;
}
.blog_reply .em_contact_form {
margin-bottom: 0;
}
.blog_reply .contact_bnt button:hover {
background: #0D2352;
color: #fff;
}
/* contact title css */
.request_form_title h2 {
color: rgba(221, 221, 221, 0.79);
font-size: 18px;
font-weight: 500;
text-transform: uppercase;
padding: 47px 0 7px;
}
.request_form_title h1 {
color: rgba(255, 255, 255, 1);
font-size: 35px;
font-weight: 700;
padding-bottom: 40px;
text-transform: uppercase;
margin: 0;
}
/* techno Form Css */
.blog_reply_coment_dtl .form_box input {
border: 1px solid #e6e6e6;
color: #495057;
background-color: #fff;
}
.blog_reply_coment_dtl .form_box textarea {
border: 1px solid #e6e6e6;
color: #495057;
background-color: #fff;
}
.blog_reply_coment_dtl .quote_btn button {
background: #145e52;
color: #fff;
}
.blog_reply_coment_dtl .form_box input:focus,
.blog_reply_coment_dtl .form_box textarea:focus {
color: #495057;
background-color: #fff;
border-color: #80bdff;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.paginations {
text-align: center;
margin-top: 20px;
margin-bottom: 28px;
}
.page-numbers li {
display: inline-block;
}
.paginations a, .page-numbers span.current {
width: 35px;
height: 35px;
line-height: 35px;
display: inline-block;
font-size: 14px;
font-weight: 500;
margin: auto 5px;
border: 1px solid #ddd;
color: #888;
}
.paginations a:hover, .paginations a.current, .page-numbers span.current {
background: #145e52;
border-color: #145e52;
color: #fff;
}
.wedget_sideber_thumb img {
width: 100%;
}
.widget_about_thumb {
text-align: center;
}
.widget_about_content {
text-align: center;
}
.widget_about_content h5 {
font-weight: 700;
padding-bottom: 3px;
}
.widget_about_icon {
text-align: center;
}
.widget_about_icon a {
display: inline-block;
margin: 0 3px;
}
/*=============================
techno Team Details Area Css
=============================*/
.single_team_details {
text-align: center;
padding: 32px 0 18px;
box-shadow: 0 10px 30px 0 rgba(17,12,79,.1);
background: #fff;
margin-bottom: 30px;
}
.single_team_details_content_inner {
padding: 10px 0 15px;
}
.single_team_details_content_inner h2 {
font-size: 24px;
}
.single_team_details_content_inner span {
color: #145e52;
}
.single_team_details_icon a {
font-size: 16px;
background: #145e52;
height: 32px;
width: 32px;
display: inline-block;
text-align: center;
line-height: 32px;
color: #fff;
border-radius: 5px;
margin: 3px;
}
.single_team_details_phone {
padding-top: 20px;
}
.single_team_details_phone_icon i {
font-size: 30px;
color: #145e52;
}
.single_team_details_phone .number p {
font-size: 18px;
}
.single_team_details_overview {
margin-left: 30px;
}
.single_team_details_overview_content_text .overview_text {
font-size: 18px;
font-weight: 500;
padding-top: 15px;
padding-bottom: 5px;
}
/* Team Style Two */
.team_style_two {
position: relative;
transition: .5s;
}
.team_style_two:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(12,90,219,0.85);
content: "";
-webkit-transition: .5s;
-o-transition: .5s;
transition: .5s;
opacity: 0;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
border-radius: 100%;
}
.team_style_two_thumb img {
width: 100%;
border-radius: 100%;
}
.team_style_two_content {
position: absolute;
left: 0;
top: 62%;
transform: translateY(-50%);
text-align: center;
right: 0;
transition: .5s;
transition-delay: .3s;
opacity: 0;
}
.team_style_two_title h5 {
color: #fff;
font-weight: 700;
display: block;
padding-bottom: 5px;
}
.team_style_two_title span {
color: #fff;
}
.team_style_two_icon a {
display: inline-block;
color: #fff;
margin: 0 5px;
font-size: 14px;
}
.team_style_two:hover .team_style_two_content {
top: 50%;
opacity: 1;
}
.team_style_two:hover:before {
opacity: 1;
}
/*==========================
techno Skill Area Css
===========================*/
.skill_area {
padding: 80px 0 70px;
}
.our_skill {
margin-bottom: 30px;
}
.skill-wrapper h5 {
font-size: 18px;
padding: 15px 0 12px;
}
/*=========================
techno Brand Area Css
=========================*/
/*=========================
techno Error Page Area Css
=========================*/
.error_page_area {
padding: 65px 0 98px;
}
.single_error_inner {
text-align: center;
}
.single_error_inner h1 {
font-size: 150px;
font-weight: 800;
line-height: 1;
margin-bottom: 30px;
}
.single_error_inner h1 span {
color: #145e52;
}
.single_error_inner h2 {
padding-bottom: 16px;
font-size: 28px;
}
.single_error_button {
margin-top: 30px;
}
.single_error_button a {
background: #fff;
color: #145e52;
padding: 11px 26px;
font-size: 18px;
font-weight: 600;
display: inline-block;
transition: .5s;
position: relative;
overflow: hidden;
z-index: 1;
border-radius: 5px;
border: 2px solid #145e52;
}
.single_error_button a:before {
position: absolute;
content: "";
top: 0px;
height: 100%;
left: -25%;
width: 0%;
background: #145e52;
transform: skew(50deg);
transition-duration: .6s;
z-index: -1;
}
.single_error_button a:hover {
color: #fff;
}
.single_error_button a:hover:before {
width: 180%;
}
.input-group.error-page form {
width: 64%;
}
.input-group.error-page input:focus {
border: 2px solid #145e52 !important;
background: transparent;
}
#scrollUp {
background: #145e52 none repeat scroll 0 0;
bottom: 30px;
color: #fff;
font-size: 22px;
height: 40px;
line-height: 40px;
right: 100px;
text-align: center;
width: 40px;
border-radius: 50%;
}
/* bounce-animate */
.bounce-animate {
animation-name: float-bob;
animation-duration: 2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
-moz-animation-name: float-bob;
-moz-animation-duration: 2s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
-ms-animation-name: float-bob;
-ms-animation-duration: 2s;
-ms-animation-iteration-count: infinite;
-ms-animation-timing-function: linear;
-o-animation-name: float-bob;
-o-animation-duration: 2s;
-o-animation-iteration-count: infinite;
-o-animation-timing-function: linear;
}
@-webkit-keyframes float-bob {
0% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
50% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
100% {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
}
@-webkit-keyframes movebounce {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
50% {
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}
@keyframes movebounce {
0% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
50% {
-webkit-transform: translateY(20px);
transform: translateY(20px);
}
100% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}
@-webkit-keyframes moveleftbounce {
0% {
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
50% {
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
}
@keyframes moveleftbounce {
0% {
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
50% {
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
100% {
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
}
.rotateme {
-webkit-animation-name: rotateme;
animation-name: rotateme;
-webkit-animation-duration: 20s;
animation-duration: 20s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}
@keyframes rotateme {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes rotateme {
from {
-webkit-transform: rotate(0deg);
}
to {
-webkit-transform: rotate(360deg);
}
}
@-webkit-keyframes rotate3d {
0% {
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
100% {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
}
@keyframes rotate3d {
0% {
-webkit-transform: rotateY(0deg);
transform: rotateY(0deg);
}
100% {
-webkit-transform: rotateY(360deg);
transform: rotateY(360deg);
}
}
@keyframes animationFramesOne {
0% {
-webkit-transform: translate(0px, 0px) rotate(0deg);
transform: translate(0px, 0px) rotate(0deg);
}
20% {
-webkit-transform: translate(73px, -1px) rotate(36deg);
transform: translate(73px, -1px) rotate(36deg);
}
40% {
-webkit-transform: translate(141px, 72px) rotate(72deg);
transform: translate(141px, 72px) rotate(72deg);
}
60% {
-webkit-transform: translate(83px, 122px) rotate(108deg);
transform: translate(83px, 122px) rotate(108deg);
}
80% {
-webkit-transform: translate(-40px, 72px) rotate(144deg);
transform: translate(-40px, 72px) rotate(144deg);
}
100% {
-webkit-transform: translate(0px, 0px) rotate(0deg);
transform: translate(0px, 0px) rotate(0deg);
}
}
@-webkit-keyframes animationFramesOne {
0% {
-webkit-transform: translate(0px, 0px) rotate(0deg);
}
20% {
-webkit-transform: translate(73px, -1px) rotate(36deg);
}
40% {
-webkit-transform: translate(141px, 72px) rotate(72deg);
}
60% {
-webkit-transform: translate(83px, 122px) rotate(108deg);
}
80% {
-webkit-transform: translate(-40px, 72px) rotate(144deg);
}
100% {
-webkit-transform: translate(0px, 0px) rotate(0deg);
}
}
/**************Search Bar******************/
.h-100 {
height: 100% !important;
}
.search-container {
/*margin: 30px 0;*/
z-index: 99;
display: inline-block;
align-self: center;
}
.justify-content-center {
-ms-flex-pack: center !important;
justify-content: center !important;
}
.d-flex {
display: -ms-flexbox !important;
display: flex !important;
}
.d-inline-block {
display: inline-block;
}
.searchbar {
margin-bottom: auto;
border-radius: 30px;
padding: 0px;
border: 1px solid #fff;
}
.search_input {
color: white !important;
border: 0;
outline: 0;
background: none;
width: 0;
caret-color: transparent;
line-height: 30px !important;
transition: width 0.4s linear;
border: none !important;
padding: 0 !important;
background: none !important;
box-shadow: none !important;
margin: 0 !important;
height: auto !important;
}
.search_input::placeholder {
color: white;
}
@media (min-width: 768px) {
.searchbar:hover > .search_input {
padding: 0 10px !important;
width: 350px;
caret-color: red;
transition: width 0.4s linear;
}
.searchbar:hover > .search_icon {
background: white;
color: #145e52;
}
}
.search_icon {
height: 30px;
width: 30px;
float: left;
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
color: white;
text-decoration: none;
}
/**************End Search Bar******************/
/**************Sticky Container********************/
.sticky-container {
/*background-color: #333;*/
padding: 0px;
margin: 0px;
position: fixed;
left: -95px;
top: 35%;
width: 130px;
z-index: 99;
}
.sticky-container .sticky {
background: none;
}
.sticky-container .sticky li {
list-style-type: none;
color: #efefef;
padding: 4px 0;
margin: 0px 0px 1px 0px;
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
cursor: pointer;
background: rgba(0, 0, 0, 0.7) !important;
border-radius: 2px;
/*filter: url("data:image/svg+xml;utf8,#grayscale");
filter: gray;
-webkit-filter: grayscale(100%);*/
}
.sticky-container .sticky li span {
padding: 0 12px;
}
.sticky-container .sticky li:hover {
margin-right: -84px;
/*-webkit-transform: translateX(-115px);
-moz-transform: translateX(-115px);
-o-transform: translateX(-115px);
-ms-transform: translateX(-115px);
transform:translateX(-115px);*/
/*background-color: #8e44ad;*/
filter: url("data:image/svg+xml;utf8,#grayscale");
-webkit-filter: grayscale(0%);
}
.sticky-container .sticky li i {
margin: 5px 5px;
/*margin-left: 10px;*/
}
.sticky-container .sticky li a {
padding: 0px 12px 0;
margin: 0px;
text-transform: uppercase;
display: inline-block;
color: #fff;
font-size: 12px;
border-right: 2px solid #00adbc;
}
.dayimage{
background: url('../index2_files/slider-1.png.jpg') right;
}
.nightimage {
background: url('../index2_files/slider-2.jpg') right;
}
.mainbg {
position: fixed;
height: 100vh;
width: 100%;
background-size:cover;
animation: animatedBackground 80s ease-in-out infinite alternate;
}
@keyframes animatedBackground {
from {
background-position: 0 0;
}
to {
background-position: 100% 100%;
}
}