?
| Current Path : /home/webyoo/www/backup/allback/docteur-site/cv/sym/a/events/crm/medical/css/ |
| Current File : /home/webyoo/www/backup/allback/docteur-site/cv/sym/a/events/crm/medical/css/style.css |
/* ===================================
About
====================================== */
/*
Theme Name: MegaOne | Medical
Theme URI:
Author: Themes Industry
Author URI:
Description: One Page Parallax Template
Tags: one page, multipurpose, parallax, creative, html5
*/
/* ===================================
Table of Content
====================================== */
/* - Fonts
- General
- Social Icon Hover
- Slider
- Header And Navigation
- features
- About
- Bars
- Contact Us
- Department
- Counters
- Portfolio
- Testimonials
- Blog Pages
- Footer
- Loader
- Media Queries */
@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap');
/* font family */
.alt-font { font-family: 'Roboto', sans-serif;}
.main-font { font-family: 'Poppins', sans-serif;}
a{outline: none; text-decoration: none;}
a:focus, a:active, button:focus, button:active, .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {outline: none;text-decoration: none; }
.pt-180 {padding-top: 180px;}
.pb-60 {padding-bottom: 60px!important;}
.theme-dark {color: #484b59;}
.bg-drk {background-color: #484b59 !important;}
.drk-blu {
color: #0284d0;}
.light-blu {color: #39c5de;}
body {font-size: 14px;
color: #7e8186;
font-family: 'Roboto', sans-serif;
line-height: 24px;
font-weight: 400;
position: relative;
-webkit-transition: all 300ms ease-in-out;
-o-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out;
right: 0;
}
body.pushmenu-push-toLeft {
right: 20%;
-webkit-transition: all 300ms linear;
-o-transition: all 300ms linear;
transition: all 300ms linear;
}
header a.logo {display: inline-block; vertical-align: middle;line-height: 0;}
header a.logo img {max-height:35px; max-width: 150px; vertical-align: sub;}
section {padding: 120px 0px 120px 0px;}
ol, ul {margin: 0; padding: 0; list-style: none;}
/* ===================================
Social Icon Hover
====================================== */
/*icon bg hover */
.facebook-bg-hvr:hover{background:#4267B2 !important;color: #fff !important; border: 1px solid transparent !important;}
.twitter-bg-hvr:hover{background:#1DA1F2 !important;color: #fff !important; border: 1px solid transparent !important;}
.instagram-bg-hvr:hover{background: -webkit-gradient(linear, left top, left bottom, from(#aa2fb5), color-stop(93%, #f1762c))!important;background: -o-linear-gradient(top, #aa2fb5 0%, #f1762c 93%)!important;background: linear-gradient(to bottom, #aa2fb5 0%, #f1762c 93%)!important;color: #fff !important;}
.linkedin-bg-hvr:hover{background:#0077B5 !important;color: #fff !important; border: 1px solid transparent !important;}
.pinterest-bg-hvr:hover{background:#BD081C !important;color: #fff !important; border: 1px solid transparent !important;}
.google-bg-hvr:hover{background:#DB4437 !important;color: #fff !important; border: 1px solid transparent !important;}
.mail-bg-hvr:hover{background:#c32aa3 !important;color: #fff !important;border: 1px solid #c32aa3 !important;}
/*icon text hover */
.facebook-text-hvr:hover{color:#4267B2 !important;}
.twitter-text-hvr:hover{color:#1DA1F2 !important;}
.instagram-text-hvr:hover{color:#aa2fb5 !important;}
.linkedin-text-hvr:hover{color:#0077B5 !important;}
.pinterest-text-hvr:hover{color:#BD081C !important;}
.google-text-hvr:hover{color:#DB4437 !important;}
.mail-text-hvr:hover{color:#c32aa3 !important;}
.form-control::-webkit-input-placeholder
{opacity: 1; font-family: 'Roboto', sans-serif;}
.form-control::-moz-placeholder
{opacity: 1; font-family: 'Roboto', sans-serif;}
.form-control:-ms-input-placeholder
{opacity: 1; font-family: 'Roboto', sans-serif;}
.form-control::-ms-input-placeholder
{opacity: 1; font-family: 'Roboto', sans-serif;}
.form-control::placeholder
{opacity: 1; font-family: 'Roboto', sans-serif;}
.form-control:-ms-input-placeholder
{ font-family: 'Roboto', sans-serif;} .form-control::-ms-input-placeholder {color: #ffffff; font-family: 'Roboto', sans-serif;}
.btn {display:inline-block; border:2px solid transparent; letter-spacing: .5px; line-height: inherit; border-radius: 0; text-transform:capitalize; width: auto; font-family: 'Roboto', sans-serif; font-weight: 400;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;}
/* button size */
.btn.btn-very-small {font-size:9px; padding: 1px 17px; line-height: 22px;}
.btn.btn-small {font-size:11px; padding: 4px 24px;}
.btn.btn-medium {font-size:12px; padding: 6px 25px 5px;}
.btn.btn-large {font-size:13px; padding: 9px 34px !important; line-height: 25px}
.btn.btn-extra-large {font-size:15px; padding: 12px 40px 13px; line-height: 25px}
.btn-dual .btn {margin: 0 10px; }
.btn i {margin-left: 6px; vertical-align: middle; position: relative; top:-1px}
/* button background */
.btn.btn-white {background:#ffffff; border-color: #ffffff; color: #232323; font-size: 15px;}
.btn.btn-white:hover, .btn.btn-white:focus {background: transparent; color: #fff; font-size: 15px;}
.btn.btn-white-only {background:#ffffff; border-color: #ffffff; color: #232323; font-size: 15px;}
.btn.btn-white-only:hover, .btn.btn-white-only:focus {background: #232323; color: #fff; font-size: 15px;}
.btn.btn-black {background:#000000; border-color: #000000; color: #fff; font-size: 15px;}
.btn.btn-black:hover, .btn.btn-black:focus {background: transparent; color: #000; font-size: 15px;}
.btn.btn-pak {background-color: #439f76; border-color: #FFFFFF; color:#FFFFFF; font-size: 15px;}
.btn.btn-pak:hover, .btn.btn-pak:focus {background-color: #FFFFFF;border-color: #439f76; color: #439f76;font-size: 15px; }
.btn.btn-sky {background-color: #384141; border-color: #FFFFFF; color:#FFFFFF; font-size: 15px;}
.btn.btn-sky:hover, .btn.btn-sky:focus {background-color: #FFFFFF; border-color: #384141; color: #384141;font-size: 15px; }
.btn.btn-pink {background-color: #e23939; border-color: #FFFFFF; color:#FFFFFF; font-size: 15px;}
.btn.btn-pink:hover, .btn.btn-pink:focus {background-color: #FFFFFF; border-color: #e23939; color: #e23939;font-size: 15px; }
.btn.btn-green {background-color: #53be53; border-color: #53be53; color:#FFFFFF; font-size: 15px;}
.btn.btn-green:hover, .btn.btn-green:focus {background: transparent; color: #53be53;font-size: 15px; }
.btn.btn-blackish {background:#384141; border-color: #384141; color: #fff;font-size: 15px;}
.btn.btn-blackish:hover, .btn.btn-black:focus {background: transparent; color: #384141;font-size: 15px;}
.btn.btn-blue {background:#39c5de; border-color: #39c5de; color: #fff;font-size: 15px;}
.btn.btn-blue:hover, .btn.btn-black:focus {background: transparent; color: #39c5de !important;font-size: 15px;}
.btn.btn-white-blue {background:#ffffff; border-color: #ffffff; color: #484b59;font-size: 15px;}
.btn.btn-white-blue:hover, .btn.btn-black:focus {border-color: #39c5de; background: #39c5de; color: #ffffff !important;font-size: 15px;}
.btn.btn-green-blue {background:#53be53; border-color: #53be53; color: #fff;font-size: 15px;}
.btn.btn-green-blue:hover, .btn.btn-green-blue:focus {background-color: #24c4f4; border-color: #24c4f4; color: #FFFFFF;font-size: 15px;}
/* button transparent */
.btn.btn-transparent-white {background: transparent; border-color: #ffffff; color: #ffffff}
.btn.btn-transparent-white:hover, .btn.btn-transparent-white:focus {background: #ffffff; border-color: #ffffff; color: #232323}
.btn.btn-white-green {background: #FFFFFF; border-color: #ffffff; color: #384141}
.btn.btn-transparent-white:hover, .btn.btn-transparent-white:focus {background: #ffffff; border-color: #ffffff; color: #232323}
.btn.btn-transparent-green {background-color: transparent; border-color: #53be53; color:#53be53; font-size: 15px;}
.btn.btn-transparent-green:hover, .btn.btn-transparent-green:focus {background: #53be53; color: #FFFFFF;font-size: 15px; }
.btn.btn-transparent-blue {background-color: transparent; border-color: #39c5de; color:#39c5de; font-size: 15px;}
.btn.btn-transparent-blue:hover, .btn.btn-transparent-green:focus {background: #39c5de; color: #FFFFFF;font-size: 15px; }
.btn.btn-transparent-black {background: transparent; border-color: #000000; color: #000000}
.btn.btn-transparent-black:hover, .btn.btn-transparent-black:focus {background: #000000; border-color: #000000; color: #ffffff}
/*-- gradient btn --*/
.btn.btn-white {background:#ffffff; border-color: #ffffff; color: #232323; font-size: 15px;}
.btn.btn-white:hover, .btn.btn-white:focus {background: transparent; color: #fff; font-size: 15px;}
.btn.btn-white-only {background:#ffffff; border-color: #ffffff; color: #232323; font-size: 15px;}
.btn.btn-white-only:hover, .btn.btn-white-only:focus {background: #232323; color: #fff; font-size: 15px;}
.btn.btn-black {background:#212331; border-color: #FFFFFF; color: #fff; font-size: 15px;}
.btn.btn-black:hover, .btn.btn-black:focus {background: #FFFFFF; color: #212331; font-size: 15px;}
.btn.btn-school {background:#0375b4; border-color: #FFFFFF; color: #fff; font-size: 15px;}
.btn.btn-school:hover, .btn.btn-school:focus {background: #FFFFFF; border-color: #0375b4; color: #0375b4; font-size: 15px;}
.btn.btn-green {background-color: #53be53; border-color: #53be53; color:#FFFFFF; font-size: 15px;}
.btn.btn-green:hover, .btn.btn-green:focus {background: transparent; color: #53be53;font-size: 15px; }
.btn.btn-blackish {background:#384141; border-color: #384141; color: #fff;font-size: 15px;}
.btn.btn-blackish:hover, .btn.btn-black:focus {background: transparent; color: #384141;font-size: 15px;}
.btn.btn-red {background:#cc2028; border-color: #FFFFFF; color: #fff;font-size: 15px;}
.btn.btn-red:hover, .btn.btn-black:focus {background: #FFFFFF; color: #cc2028;font-size: 15px;}
.btn.btn-x-green {background:#14a76c; border-color: #FFFFFF; color: #fff;font-size: 15px;}
.btn.btn-x-green:hover, .btn.btn-black:focus {background: #FFFFFF; color: #14a76c;font-size: 15px;}
.btn.btn-yellow {background:#f2c900; border-color: #FFFFFF; color: #fff;font-size: 15px;}
.btn.btn-yellow:hover, .btn.btn-yellow:focus {border-color: #f2c900; background: #FFFFFF; color: #f2c900 !important;font-size: 15px;}
.btn.btn-blue {background:#39c5de; border-color: #39c5de; color: #fff;font-size: 15px;}
.btn.btn-blue:hover, .btn.btn-black:focus {background: #0284d0; color: #FFFFFF !important; border-color:#0284d0; font-size: 15px;}
.btn.btn-drk-blue {background:#0284d0; border-color: #0284d0; color: #fff;font-size: 15px;}
.btn.btn-drk-blue:hover, .btn.btn-drk-blue:focus {background: #39c5de; color: #FFFFFF !important; border-color:#39c5de; font-size: 15px;}
.btn.btn-green-blue {background:#53be53; border-color: #53be53; color: #fff;font-size: 15px;}
.btn.btn-green-blue:hover, .btn.btn-green-blue:focus {background-color: #24c4f4; border-color: #24c4f4; color: #FFFFFF;font-size: 15px;}
.btn.btn-black-yellow {background:#212331; border-color: #212331; color: #fff;font-size: 15px;}
.btn.btn-black-yellow:hover, .btn.btn-black-yellow:focus {background-color: #f2c900; border-color: #f2c900; color: #FFFFFF;font-size: 15px;}
.btn.btn-school-yellow {background: #0375b4; border-color: #0375b4; color: #fff;font-size: 15px;}
.btn.btn-school-yellow:hover, .btn.btn-school-yellow:focus {background-color: #f2c900; border-color: #f2c900; color: #FFFFFF;font-size: 15px;}
.btn.btn-blue-pink {background:#384141; border-color: #384141; color: #fff;font-size: 15px;}
.btn.btn-blue-pink:hover, .btn.btn-blue-pink:focus {background-color: #e23939; border-color: #e23939; color: #FFFFFF;font-size: 15px;}
/* button transparent */
.btn.btn-green-gradient {
background: -o-linear-gradient(left, #53be53, #24c4f4);
background: -webkit-gradient(linear, left top, right top, from(#53be53), to(#24c4f4));
background: linear-gradient(90deg, #53be53, #24c4f4); ; border-color: #FFFFFF; color:#FFFFFF; font-size: 15px;}
.btn.btn-green-gradient:hover, .btn.btn-green-gradient:focus {
background: -o-linear-gradient(left, #24c4f4, #53be53);
background: -webkit-gradient(linear, left top, right top, from(#24c4f4), to(#53be53));
background: linear-gradient(90deg, #24c4f4, #53be53);; color: #FFFFFF;font-size: 15px; }
/* button rounded */
.btn.btn-rounded {border-radius: 50px}
.btn.btn-rounded.btn-very-small {padding: 2px 23px 1px;}
.btn.btn-rounded.btn-small {padding: 5px 29px;}
.btn.btn-rounded.btn-medium {padding: 6px 32px;}
.btn.btn-rounded.btn-large {padding: 9px 38px;}
.btn.btn-rounded.btn-extra-large {padding: 12px 45px 13px;}
/*=============================
loader start
==============================*/
.loader { position: fixed;
width: 100%;
overflow: hidden;
height: 100vh;
z-index: 9999;
background: white}
.indicator {
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%) scale(4);
-ms-transform: translate(-50%, -50%) scale(4);
transform: translate(-50%, -50%) scale(4);
}
.indicator svg polyline {
fill: none;
stroke-width: 0.5;
-webkit-transform: scale(2);
-ms-transform: scale(2);
transform: scale(2);
stroke-linecap: round;
stroke-linejoin: round;
}
.indicator svg polyline#back {
stroke: rgba(57, 197, 222, 0.3);
}
.indicator svg polyline#front {
stroke: #39c5de;
stroke-dasharray: 12, 36;
stroke-dashoffset: 48;
-webkit-animation: dash 1s linear infinite;
animation: dash 1s linear infinite;
}
.cta {
position: fixed;
bottom: 20px;
right: 30px;
color: #222;
font-weight: bold;
}
@-webkit-keyframes dash {
62.5% {
opacity: 0;
}
to {
stroke-dashoffset: 0;
}
}
@keyframes dash {
62.5% {
opacity: 0;
}
to {
stroke-dashoffset: 0;
}
}
/*=============================
loader ends
==============================*/
/* ===================================
Custom
====================================== */
.center-block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
/*==============================
pre loader
===============================*/
/*==============================
pre loader
===============================*/
/* nav top default */
.navbar-top-default{
position: absolute;
top: 0;
z-index: 99;
overflow: hidden;
height: 90px;
width: 100%;
-webkit-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
}
.navbar-top-default .navbar-nav .nav-link {
font-family: 'Poppins', sans-serif;
font-size: 14px;
color: #2e3242;
font-weight: 500;
padding: 0 0 0;
margin-right: 1.1rem;
margin-left: 1.1rem;
text-transform: capitalize;
}
/* Nav Radius Hover Effect */
.nav-radius .navbar-nav .nav-link {
padding: 0.6rem 1.3rem;
border-radius: 36px;
}
.nav-radius .navbar-nav .nav-link.active {
background: #0284d0;
color: #ffffff !important;
}
.nav-radius .navbar-nav .nav-link.active:hover {
color: #ffffff;
}
.nav-radius .navbar-nav .nav-link {
margin: 0 0.1rem;
}
.header-appear .navbar-top-default {
height: 80px;
position: fixed;
z-index: 999;
background: #ffffff;
-webkit-animation-name: animationFade;
animation-name: animationFade;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.35);
}
@-webkit-keyframes animationFade {
from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
to { opacity: 1; -webkit-transform: none; transform: none; }
}
@keyframes animationFade {
from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);
}
to { opacity: 1; -webkit-transform: none; transform: none; }
}
.rev_slider_wrapper {
left: auto!important;}
.search {vertical-align: sub;}
.open_search {
cursor: pointer;
color: #39c5de;
display: inline-block;
padding: 10px;
font-size: 18px;
position: relative;
}
.search_block {
opacity: 0;
display: none;
text-align: center;
height: 0;
position: fixed;
top: 50%;
left: 40%;
margin-top: -41px;
margin-left: -150px;
}
.search_block.visible {
opacity: 1;
display: inline-block;
height: auto;
}
.search_block.visible .search_box {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
.search_block .overlayer {
background-color: rgb(57, 197, 222);
position: fixed;
cursor: url("../img/overlay-close.png"), auto;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
input, select, textarea {background-color: #39c5de; font-size: 20px;}
textarea::-webkit-input-placeholder {color: #FFFFFF !important;}
textarea::-moz-placeholder {color: #FFFFFF !important;}
textarea:-ms-input-placeholder {color: #FFFFFF !important;}
textarea::-ms-input-placeholder {color: #FFFFFF !important;}
.inner input, select, textarea::placeholder {color: #FFFFFF !important;}
input::-webkit-input-placeholder {
color: #FFFFFF !important;
}
input:-moz-placeholder { /* Firefox 18- */
color: #FFFFFF !important;
}
input::-moz-placeholder { /* Firefox 19+ */
color: #FFFFFF !important;
}
input:-ms-input-placeholder {
color: #FFFFFF !important;
}
.search_box {
background-color: #39C5DE;
opacity: 0;
display: inline-block;
padding: 10px;
position: relative;
text-align: center;
top: -120px;
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
-webkit-transition: all 0.4s ease 0s;
-o-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
z-index: 10;
}
.search_box .search_input {
border: 3px solid #39C5DE;
border-bottom: 1px solid;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
height: 80px;
line-height: 2;
font-family: 'Poppins', sans-serif;
min-width: 700px;
outline: medium none;
padding: 10px 10px 10px 0px;
width: 700px;
-webkit-transition: all 0.45s ease 0s;
-o-transition: all 0.45s ease 0s;
transition: all 0.45s ease 0s;
-webkit-appearance: none;
border-radius: 0;
}
.search-form .search-input {
font-size: 30px;
font-family: 'Poppins', sans-serif;
font-weight: 200;
}
#search ::-webkit-input-placeholder {
color: #FFFFFF;
opacity: 1;
}
#search ::-moz-placeholder {
color: #FFFFFF;
opacity: 1;
}
#search :-ms-input-placeholder {
color: #FFFFFF;
opacity: 1;
}
#search ::-ms-input-placeholder {
color: #FFFFFF;
opacity: 1;
}
#search ::placeholder {
color: #FFFFFF;
opacity: 1;
}
.search_icon {
background-color: transparent;
border: medium none;
color: #FFFFFF;
font-size: 28px;
left: 93%;
line-height: 38PX;
padding: 8px;
position: absolute;
top: 28px;
}
.search_icon:hover {color: #FFFFFF;}
.search_icon:focus {color: #FFFFFF;}
::-webkit-input-placeholder {
color: #999;
font-style: normal;
}
:-moz-placeholder {
/* Firefox 18- */
color: #999;
font-style: normal;
}
::-moz-placeholder {
/* Firefox 19+ */
color: #999;
font-style: normal;
}
:-ms-input-placeholder {
color: #999;
font-style: normal;
}
input, select, textarea {margin :0;}
/* ===================================
revicon
====================================== */
.revicon {
top: 50%;
position: absolute;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left: 40px;
z-index: 11;
}
/* ===================================
Side Menu
====================================== */
.side-menu {
width: 25%;
position: fixed;
right: -1px;
top: 0;
background: #0284d0;
z-index: 1032;
height: 100%;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
-webkit-transition: -webkit-transform .5s ease;
transition: -webkit-transform .5s ease;
-o-transition: -o-transform .5s ease;
-o-transition: transform .5s ease;
transition: transform .5s ease;
transition: transform .5s ease, -webkit-transform .5s ease;
overflow: hidden;
}
.side-menu.left {
left: 0; right: auto;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
.side-menu.before-side {
width: 280px;
}
.side-menu.side-menu-active,
.side-menu.before-side{
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.pul-menu .side-menu.side-menu-active {
visibility: visible; opacity: 1;
}
.side-menu .navbar-brand {
margin: 0 0 2.5rem 0;
}
/*Side overlay*/
#close_side_menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
-webkit-transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
-o-transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
transition: opacity 300ms cubic-bezier(0.895, 0.03, 0.685, 0.22);
display: none;
z-index: 1031;
opacity: 0.4;
}
/*side clode btn*/
.side-menu .btn-close {
height: 33px;
width: 33px;
display: inline-block;
text-align: center;
position: absolute;
top: 30px;
right: 15px;
cursor: pointer;
}
.side-menu.before-side .btn-close{
display: none;
}
.side-menu .btn-close::before, .side-menu .btn-close::after {
position: absolute;
left: 16px;
content: ' ';
height: 24px;
width: 2px;
background: #fff;
top: 5px;
}
.side-menu .btn-close:before {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.side-menu .btn-close:after {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
/*side open btn*/
.sidemenu_btn {position: absolute; right:20px;}
.sidemenu_btn.left {
left: 15px;
right: auto;
}
.sidemenu_btn span {
height: 2px;
width: 30px;
background: #484b59;
display: block;
}
.header-appear .navbar-simple .sidemenu_btn span{
background:#666666;
}
.header-appear .navbar-gradient .sidemenu_btn span{
background: #FFFFFF;
}
.sidemenu_btn span:nth-child(2) {
margin: 4px 0;
}
.side-menu .inner-wrapper {
padding: 3.5rem 5rem;
height: 100%;
position: relative;
overflow-y: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: left;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.pul-menu.pushwrap .side-menu .inner-wrapper{
padding: 3.5rem 2.5rem;
}
.side-menu .side-nav {
margin-bottom: 30px;
display: block;
}
.side-nav .navbar-nav .nav-item{
display: block;
margin: 10px 0; padding: 0 !important;
opacity: 0;
-webkit-transition: all 0.8s ease 500ms;
-o-transition: all 0.8s ease 500ms;
transition: all 0.8s ease 500ms;
-webkit-transform: translateY(30px);
-ms-transform: translateY(30px);
transform: translateY(30px);
}
.side-nav .navbar-nav .nav-item:first-child {
-webkit-transition-delay: .1s;
-o-transition-delay: .1s;
transition-delay: .1s;
}
.side-nav .navbar-nav .nav-item:nth-child(2){
-webkit-transition-delay: .2s;
-o-transition-delay: .2s;
transition-delay: .2s;
}
.side-nav .navbar-nav .nav-item:nth-child(3) {
-webkit-transition-delay: .3s;
-o-transition-delay: .3s;
transition-delay: .3s;
}
.side-nav .navbar-nav .nav-item:nth-child(4) {
-webkit-transition-delay: .4s;
-o-transition-delay: .4s;
transition-delay: .4s;
}
.side-nav .navbar-nav .nav-item:nth-child(5) {
-webkit-transition-delay: .5s;
-o-transition-delay: .5s;
transition-delay: .5s;
}
.side-nav .navbar-nav .nav-item:nth-child(6) {
-webkit-transition-delay: .6s;
-o-transition-delay: .6s;
transition-delay: .6s;
}
.side-nav .navbar-nav .nav-item:nth-child(7) {
-webkit-transition-delay: .7s;
-o-transition-delay: .7s;
transition-delay: .7s;
}
.side-nav .navbar-nav .nav-item:nth-child(8) {
-webkit-transition-delay: .8s;
-o-transition-delay: .8s;
transition-delay: .8s;
}
.side-nav .navbar-nav .nav-item:nth-child(9) {
-webkit-transition-delay: .9s;
-o-transition-delay: .9s;
transition-delay: .9s;
}
.side-menu.side-menu-active .side-nav .navbar-nav .nav-item {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
.side-nav .navbar-nav .nav-link {
display: inline-table;
color: #fff;
padding: 2px 0 3px 0 !important;
font-family: 'Poppins', sans-serif;
font-size: 15px;
font-weight: 400;
line-height: normal;
position: relative;
border-radius: 0;
}
.side-nav .navbar-nav .nav-link::after{
content: "";
position: absolute;
background: #fff;
display: inline-block;
width: 0;
height: 3px;
bottom: 0; left: 0;
overflow: hidden;
-webkit-transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
-o-transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
transition: all 0.5s cubic-bezier(0, 0, 0.2, 1);
}
.side-nav .navbar-nav .nav-link:hover::after,
.side-nav .navbar-nav .nav-link:focus::after,
.side-nav .navbar-nav .nav-link.active::after {
width: 100%;
}
.side-nav .navbar-nav .nav-link.active {
background: transparent;
}
.side-menu p{
font-size: 13px;
margin-top: .5rem;
margin-bottom: 0;
}
.social-icons-simple{
margin-bottom: 0;
margin-left: -10px;
}
.social-icons-simple li{
display: inline-block;
}
.social-icons-simple li a {
display: block;
font-size: 16px;
height: 36px;
line-height: 38px;
border: 1px solid transparent;
text-align: center;
width: 36px;
color: #FFFFFF;
border-radius: 50%;
position: relative;
z-index: 1;
overflow: hidden;
-webkit-transition: background-color .5s ease;
-o-transition: background-color .5s ease;
transition: background-color .5s ease;
}
.social-icons-simple.darkcolor li a{
color: #000;
}
.social-icons-simple.whitecolor li a{
color: #fff;
}
.social-icons-simple li a:hover{
background-color:#FFFFFF;
}
.social-icons-simple li.animated-wrap a:hover{
background-color: transparent;
color: #ffffff;
}
/* ===================================
rev bullets
====================================== */
.hermes.tp-bullets{
height: auto !important;
width: auto !important;
text-align: center;
display: inline-block;
position: relative;
}
.hermes .tp-bullet{
position:relative;
display: contents;
background: transparent;
cursor: pointer;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.hermes .tp-bullet .tp-bullet-inner{
width: 18px;
height: 18px;
position:relative;
border: 4px solid #fff;
border-radius: 50%;
background: transparent;
cursor: pointer;
-webkit-box-sizing: content-box;
box-sizing: content-box;
-webkit-transform: scale(0.6);
-ms-transform: scale(0.6);
transform: scale(0.6);
-webkit-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.hermes .tp-bullet.selected .tp-bullet-inner{
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
background: transparent;
-webkit-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.hermes .tp-bullet .tp-bullet-inner::before{
content: '';
position: absolute;
width: 60%;
height: 60%;
background: #24ccd5;
top: 50%;
left: 50%;
-webkit-transform: translate(-50% , -50%);
-ms-transform: translate(-50% , -50%);
transform: translate(-50% , -50%);
border-radius: 50%;
opacity: 0;
visibility: hidden;
display: none;
}
.hermes .tp-bullet.selected .tp-bullet-inner::before{
opacity: 1;
visibility: visible;
display: block;
}
.hermes .tp-bullet:not(:last-child) .tp-line{
height: 20px;
-webkit-transform: scaleY(1.4);
-ms-transform: scaleY(1.4);
transform: scaleY(1.4);
width: 3px;
background: #fff;
display: block;
margin: 0 auto;
pointer-events: none;
}
/* ===================================
feature box
====================================== */
.feature-icon {font-size: 40px; margin-bottom: 20px; max-width: 30px; margin-left: auto; margin-right: auto;}
.feature-content{
position: relative;
top: -110px;
margin-bottom: -170px;
}
.feature-content .feature-col{
color: #fff;
display: -ms-flexbox!important;
display: -webkit-box!important;
display: flex!important;
-ms-flex-align: center!important;
-webkit-box-align: center!important;
align-items: center!important;
min-height: 240px;
vertical-align: middle;
}
.feature-content .feature-col-1{
color: #39C5DE;
display: -ms-flexbox!important;
display: -webkit-box!important;
display: flex!important;
-ms-flex-align: center!important;
-webkit-box-align: center!important;
align-items: center!important;
min-height: 240px;
vertical-align: middle;
}
.feature-content .feature-col-2{
color: #0284d0;
display: -ms-flexbox!important;
display: -webkit-box!important;
display: flex!important;
-ms-flex-align: center!important;
-webkit-box-align: center!important;
align-items: center!important;
min-height: 240px;
vertical-align: middle;
}
.feature-content .feature-col-3{
color: #484b59;
display: -ms-flexbox!important;
display: -webkit-box!important;
display: flex!important;
-ms-flex-align: center!important;
-webkit-box-align: center!important;
align-items: center!important;
min-height: 240px;
vertical-align: middle;
}
.feature-content .feature-col-1 > .box{
padding: 0 20px;
vertical-align: middle;
width: 100%;
min-height: 340px;
}
.feature-content .feature-col-2 > .box{
padding: 0 20px;
vertical-align: middle;
width: 100%;
min-height: 340px;
}
.feature-content .feature-col-3 > .box{
padding: 0 20px;
vertical-align: middle;
width: 100%;
min-height: 340px;
}
.back:hover {
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .12);
box-shadow: 0 0 10px rgba(0, 0, 0, .1);
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
/*.flip-box {margin: 0px 15px 0px 15px;}*/
.feature-content .feature-col-1.one-1{
background: #ffffff;
}
.feature-content .feature-col-2.two-2{
background: #ffffff;
}
.feature-content .feature-col-3.three-3{
background: #ffffff;
}
.feature-content .feature-col.one{
background: #39c5de;
}
.feature-content .feature-col.two{
background: #0284d0;
}
.feature-content .feature-col.three{
background: #484b59;
}
.feature-content .feature-col > .box{
padding: 0 20px;
vertical-align: middle;
width: 100%;
min-height: 340px;
}
.mb-10px {
margin-bottom: 10px;
}
.mb-30px {
margin-bottom: 30px;
}
.mb-35px {
margin-bottom: 35px;
}
/* features */
.feature-item {
display: table;
margin: 30px 0 0;
max-width: 450px;
text-align: left;
}
.feature-item .icon {
text-align: center;
position: relative;
z-index: 1;
font-size: 40px;
}
.laptop-features-icon {
display: table-cell;
vertical-align: top;
width: 41px;
-webkit-transition: all 1.2s;
-o-transition: all 1.2s;
transition: all 1.2s;
}
.features-content {
display: table-cell;
padding-left: 15px;
}
/* features 2 Boxes with image Section */
.blog-three-block {
width: 100%;
height: 100%;
overflow: hidden;
}
.features-one {
text-align: center;
height: 100%;
width: 100%;
padding: 78px 45px;
z-index: 0;
position: relative;
background: #ffffff;
color: #2b2b2b;
}
.features-one i {
font-size: 40px;
width: 43px;
height: 34px;
display: inline-block;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
-webkit-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
}
.features-one:hover i {
-webkit-transform: scale(1.4);
-ms-transform: scale(1.4);
transform: scale(1.4);
}
.features-one h5 {
margin: 20px 0 14px;
}
.time-line {height: 2px; width: 40px; background-color: #4997e4; display: inline-block; }
/* ===================================
About
====================================== */
.main-title {
position: relative;
text-align: center;
}
.family {color:#39c5de;}
.main-title h5 {
font-family: 'Roboto', sans-serif;
font-weight: 400;
margin-bottom: 1.5rem;
text-transform: capitalize;
color: #0284d0;
}
.main-title h2 {
text-transform: capitalize;
font-weight: 300;
color: #484b59;
font-size: 48px;
line-height: 1.2;
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.main-title p {
max-width: 720px;
margin: 0 auto;
}
.main-title.style-two {
position: relative;
text-align: center;
}
.main-title.style-two h5 {
font-family: 'roboto', sans-serif;
font-weight: 400;
margin-bottom: 1.5rem;
font-size: 20px;
text-transform: initial;
color: #0284d0;
}
.main-title.style-two h2 {
font-size: 48px;
font-family: 'Poppins', sans-serif;
text-transform: initial;
font-weight: 500;
color: #484b59;
line-height: 1.2;
max-width: 700px;
}
.main-title.style-two p {
color: #797979;
max-width: 720px;
margin: 0 auto;
font-size: 16px;
}
/* ===================================
Bars
====================================== */
.prog-item {
margin-bottom: 25px;
}
.prog-item p {
font-size: 14px;
margin-bottom: 5px;
color: #7e8186;
}
.prog-item .skills-progress {
width: 100%;
height: 10px;
position: relative;
background: rgb(238, 238, 238);
}
.prog-item .skills-progress span {
position: absolute;
left: 0px;
top: 0px;
height: 100%;
width: 10%;
-webkit-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
}
.prog-item .skills-progress span::after {
content: attr(data-value);
position: absolute;
top: -30px;
right: 0px;
font-size: 13px;
font-weight: 600;
color: #39c5de;
}
.bar-dark{
background: #0284d0;}
.bar-light {
background: #39c5de;}
.skills{
text-align: left;
}
/* ===================================
medical form
====================================== */
.form-bg { background: url("../img/form-bg.jpg") no-repeat;
background-attachment: inherit;
background-size: cover;
background-position: top center;
}
.form-title h2 {font-size: 48px;
color: #ffffff;
font-family: 'Poppins', sans-serif;
margin-bottom: 20px;
font-weight: 400;
text-align: right;
}
.form-control.message {
height: 100px; line-height: 1.5;}
.appointment-box {max-width: 540px; text-align: left; margin-left: auto;}
.form-para {font-size: 13px;font-family: 'roboto', sans-serif; color: #ffffff; margin-bottom: 30px; text-align: right; font-weight:300;}
/*-------------------------
Appointment card
-------------------------*/
/*--------------------------------
From CSS
--------------------------------*/
.form-control {
border: 1px solid #c2c4ca;
padding: 0 0 0 10px;
line-height: 50px;
height: 50px;
border-radius: 3px;
color: #ffffff!important;
font-size: 13px;
z-index: 9;
}
.form-control {background-color: #6280a37a;}
.select2-container .select2-selection--single .select2-selection__rendered {font-size: 13px; background-color: #6280a37a; font-weight: 400;}
.form-control:focus {background-color: #42969e00;}
.form-control::-webkit-input-placeholder{
font-style: normal;
}
.form-control::-moz-placeholder{
font-style: normal;
}
.form-control:-ms-input-placeholder{
font-style: normal;
}
.form-control::-ms-input-placeholder{
font-style: normal;
}
.form-control::placeholder{
font-style: normal;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
border: 1px solid #24c4f4;
background: #24c4f4;
color: #ffffff;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
border-color: transparent transparent #888 transparent;
border-width: thick;
}
.m-label {
right: 20px;
font-size: 16px;
color: #a3a8b8;
margin: 0;
top: 10px;
}
.select2-container--default .select2-selection--single {border: 1px solid #c2c4ca;}
.form-control[type=text]:focus {
border-color: #a1b5f7;
-webkit-box-shadow: none;
box-shadow: none;
}
.form-control[type=text]:focus {
border-color: #80bdff;
-webkit-box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
border: 1px solid #aaa;
color: #ffffff;
background-color: #5679a3;
}
.select2-container--focus .select2-selection {
border-color: #a1b5f7 !important;
}
.select2-selection__rendered {
line-height: 50px !important;
color: #ffffff !important;
}
.select2-container .select2-selection--single {
height: 50px !important;
}
.select2-container {
width: 255px!important;}
.select2-container--default .select2-selection--single .select2-selection__arrow {
top: 13px!important;
right: 15px;
}
.select2-selection {
background: transparent !important;
}
.ui-datepicker .ui-datepicker-next-hover{
top:2px;
right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover{
top: 2px;
left: 2px;
}
.ui-corner-all{
border-color: #ccc !important;
}
.appoint-card .select2-selection__arrow {
display: none !important;
}
.appoint-card p {
font-family: 'Poppins', sans-serif;
font-size: 17px;
}
.appoint-card {
padding-left: 50px;
padding-right: 80px;
overflow: hidden;
top: 140px;
margin-top: -140px;
-webkit-transition: all .30s linear;
-o-transition: all .30s linear;
transition: all .30s linear;
-webkit-transform-origin: top;
-ms-transform-origin: top;
transform-origin: top;
}
.perspective--400 {
-webkit-perspective: 1000px;
perspective: 1000px;
}
.appoint-card:hover {
-webkit-transform: rotateX(3deg);
transform: rotateX(3deg);
}
.appoint-card img {
position: absolute;
top: 22px;
max-width: 300px;
}
.appointment-wrapper i {
font-size: 30px;
}
.message {height: 100px;}
.message::-webkit-input-placeholder {line-height: 30px;}
.message::-moz-placeholder {line-height: 30px;}
.message:-ms-input-placeholder {line-height: 30px;}
.message::-ms-input-placeholder {line-height: 30px;}
.message::placeholder {line-height: 30px;}
/*type-3*/
.appoint-card.type-3 {
top: 0;
margin-top: 0;
}
.calender-line {height:30px; width: 2px; background-color: #bfcbd9; display: inline-block; }
.calender-icon {
vertical-align: top;
margin-top: 7px;
color: #c0cbd9;
margin-left: 10px;
}
.sex-icon { vertical-align: top;
margin-top: 7px;
margin-left: 30px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: rgb(192, 203, 217) transparent transparent transparent !important;
}
/* ===================================
department
====================================== */
.department-sub {font-size: 16px; margin-bottom: 20px;
color: #7e8186; }
.title-clr {color: #0284d0; }
.department-title h2 {font-size: 48px; margin-bottom: 80px; font-weight: 400; color: #3c3f46;
font-family: 'Poppins', sans-serif;
}
.feature-item{
text-align: right;
cursor: pointer;
}
.feature-item .feature-heading{
color: #3c3f46;
font-family: 'Poppins', sans-serif;
font-size: 19px;
margin-bottom: 10px;
line-height: 1.2;
font-weight: 400;
}
.feature-txt {text-align: left; display: table-cell; vertical-align: middle;}
.feature-item .icon {
background-color: #00bcd4;
width: 70px;
height: 70px;
max-width: 70px;
min-width: 70px;
text-align: center;
display: table;
position: relative;
border-radius: 50%;
z-index: 1;
font-size: 26px;
line-height: 70px;
color: #fff;
margin: 0 15px 15px;
-webkit-transition: all .3s ease;
-o-transition: all .3s ease;
-webkit-transition: all .6s ease;
-o-transition: all .6s ease;
transition: all .6s ease;
}
.feature-item .icon-2 {
background-color: #0284d0;
width: 70px;
height: 70px;
max-width: 70px;
min-width: 70px;
text-align: center;
display: table;
position: relative;
border-radius: 50%;
z-index: 1;
font-size: 26px;
line-height: 70px;
color: #fff;
margin: 0 15px 15px;
-webkit-transition: all .3s ease;
-o-transition: all .3s ease;
-webkit-transition: all .6s ease;
-o-transition: all .6s ease;
transition: all .6s ease;
}
.feature-item:hover .icon{
background-color:#0284d0;
-webkit-transform: rotateY(-180deg);
transform: rotateY(-180deg);
}
.feature-item:hover .icon-2{
background-color:#00bcd4;
-webkit-transform: rotateY(-180deg);
transform: rotateY(-180deg);
}
/* ===================================
Counters
====================================== */
.bg-counter { background: url(../img/counter-bg.jpg) no-repeat;
background-attachment: fixed;
background-size: cover;
background-position: center center;
width: 100%;
}
.serial-box {text-align: center; }
.serial-box p {color: #ffffff; font-size: 18px; font-family: 'Roboto', sans-serif;}
.serial-box span {font-size: 40px; font-family: 'Poppins', sans-serif; color: #ffffff; text-align: center;}
.count-line {width: 30px; margin: 10px auto 15px auto;
height: 2px; background-color:#39c5de; }
/* ===================================
End Counters
====================================== */
/*=================================
Portfolio
==================================*/
.portfolio-title h2 {
font-size: 48px;
margin-bottom: 20px;
font-weight: 400;
font-family: 'Poppins', sans-serif;
color: #3c3f46;
}
.portfolio-subtitle {
font-size: 16px;
margin-bottom: 40px;
color: #7e8186;
}
.port {text-align: center; margin: 0 auto; max-width: 600px; }
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
background-color: #39c5de;
font-family: 'Poppins', sans-serif;
font-size: 14px;
}
.owl-carousel .owl-stage-outer {cursor: pointer;}
.nav-pills .nav-link {margin-left: 10px; border: 1px solid #e1e1e1;
font-family: 'Poppins', sans-serif;
color: #3c3f46;}
.da-thumbs li {
margin: 1px;
width: 33.1%;
position: relative;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
.da-thumbs{
z-index: 1;
list-style: none;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.da-thumbs>li{
display: block;
position: relative;
}
.da-thumbs >li {
overflow: hidden;
}
.da-thumbs >li .overlay h4 {
color: #ffffff;
font-size: 22px;
font-family: 'Poppins', sans-serif;
}
.da-thumbs >li .overlay {
position: absolute;
background: rgba(57, 197, 222, 0.81);
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
height: 100%;
top: 100%;
z-index: 2;
}
.nav-pills .nav-link {border-radius: 0px;}
.search-icon { border: 1px solid white;
border-radius: 50%;
display: inline-block;
color: #ffffff;
padding: 5px 10px;
margin-bottom: 10px;
}
/*===================================
end Portfolio
======================================*/
/*===================================
testimonial
======================================*/
.bg-testimonial {background-color: #39c5de;}
.testimonial-title h2 {
font-size: 48px;
margin-bottom: 20px;
color: #ffffff;
font-weight: 300;
font-family: 'Poppins', sans-serif;
}
.testimonial-subtitle {
font-size: 16px;
margin-bottom: 80px;
color: #ffffff;
}
.test {text-align: center;
margin: 0 auto; max-width: 600px;}
.testimonial-item:hover{
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
max-width: 560px;
margin: 0 15px;
text-align: center;
background-color: #0284d0;
padding: 50px 30px;
}
.testimonial-item:hover h5 {
color: #ffffff;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item:hover p {
color: #ffffff;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item{
max-width: 560px;
margin: 0 15px;
text-align: center;
background-color: #ffffff;
padding: 50px 30px;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item:hover .testimonial-icon {
font-size: 1.625rem;
margin-bottom: 1.625rem;
color: #ffffff;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item .testimonial-icon {
font-size: 1.625rem;
margin-bottom: 1.625rem;
color: #39c5de;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item .testimonial-image{
position: relative;
overflow: hidden;
max-width: 50px;
border: 1px solid #d9d9d9;
padding: 3px;
margin: 0 auto 1rem auto;
border-radius: 50px;
}
.testimonial-item:hover .destination{
font-size: 13px;
font-weight: 400;
color: #ffffff;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
.testimonial-item .destination{
font-size: 13px;
font-weight: 400;
color: #616161;
-webkit-transition: all .3s ease-in-out !important;
-o-transition: all .3s ease-in-out !important;
transition: all .3s ease-in-out !important;
}
#testimonial_slider .owl-dots{
position: relative;
display: block;
text-align: center;
width: 100%;
}
#testimonial_slider .owl-dots .owl-dot {
background-color: transparent;
height: 10px;
border: 1px solid #ffffff;
width: 10px;
margin-top: 40px;
margin-right: 10px;
border-radius: 50%;
}
#testimonial_slider .owl-dots .owl-dot.active{
background: #FFFFFF;
height: 10px;
border: 1px solid #ffffff;
width: 10px;
border-radius: 50%;
}
/*===================================
end testimonial
======================================*/
/* ===================================
Blog PAGES
====================================== */
.blog-banner{
background: url("../img/blog-cover.jpg") no-repeat;
padding-top: 190px;
padding-bottom: 160px;
background-attachment: inherit;
background-size: cover;
background-position: top center;
}
.blog-banner h1{
margin-bottom: 25px;
font-family: 'Poppins', sans-serif;
font-size: 60px;
font-weight: 500;
color: #FFFFFF;
}
.blog-banner p{
font-family: 'Open Sans', sans-serif;
font-size: 15px;
margin-bottom: 10px;
color: #FFFFFF;
}
.blog-panel {padding: 25px 45px 60px 45px; background-color: #FFFFFF; }
.bg-grey {background-color: #f5f5f5;}
.blog-panel h5 {font-size: 18px; font-weight: 600; color: #3c3f46; margin-bottom: 1.5rem; font-family: 'Poppins', sans-serif;}
.blog-panel .panel-img {height: 205px; width: 258px; margin-bottom: 25px;}
.blog-panel .img-link {font-size: 14px; font-weight: 600; font-family: 'Poppins', sans-serif;}
.blog-panel .img-link .name-link {margin-left: 15px;}
.panel-img {overflow: hidden; max-width: 258px;}
.panel-img img { -webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.panel-img:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1);
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.blog-post-navigation {
padding-top: 4rem;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.blog-post-navigation .page-link.current {
z-index: 1;
color: #FFFFFF;
background-color: #3498db;
}
.blog-post-navigation .page-link {
position: relative;
display: block;
padding: 0.7rem 1.1rem;
color: #646464;
background-color: transparent;
text-decoration: none;
font-weight: lighter;
}
.blog-post-navigation a {
text-decoration: underline;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
height: 35px;
width: 35px;
outline: #484b59;
background-size: 100%, 100%;
border-radius: 50%;
border: 1px solid whitesmoke;
background-image: none;
}
.carousel-control-next-icon:after
{
content: '>';
font-size: 22px;
color: whitesmoke;
}
.pointer {cursor: pointer;}
.carousel-control-prev-icon:after {
content: '<';
font-size: 22px;
color: whitesmoke;
}
/* ===================================
Blog Page
====================================== */
/*Blog*/
.main .side_tags .search-bar form span button {
border-radius: 10px;
border: none;
background-color: #114dba;
color: #FFFFFF;
padding-left: 15px;
padding-right: 15px;
z-index: 11;
border-bottom-left-radius: 0px;
border-top-left-radius: 0px;
-webkit-transition: .8s ease;
-o-transition: .8s ease;
transition: .8s ease;
border: solid 1px #114dba;
}
.blog-body{
position: relative;
padding: 7.5rem 0;
overflow: hidden
}
.blog-search{
padding: 40px 48px;
background-color: #f8f9fa;
margin-bottom: 30px;
}
.has-search .form-control {
padding-left: 1.375rem;
border-radius: 40px;
margin-top: 10px;
}
.blog-left .form-control{
padding: 0.5rem .75rem;
}
input[type=text]:focus {
outline: none !important;
}
.has-search .form-control-feedback {
position: absolute;
z-index: 2;
display: block;
right: 61px;
border-radius: 50px;
background-color: #21c2c2;
width: 50px;
height: 50px;
line-height: 3.4rem;
text-align: center;
pointer-events: none;
color: #ffffff;
-webkit-transition: .8s ease;
-o-transition: .8s ease;
transition: .8s ease;
}
.blog-search .has-search:hover .form-control-feedback {
cursor: pointer;
}
.blog-topic{
padding: 40px 48px;
background-color: rgba(225, 225, 225, 0.24);
margin-bottom: 30px;
}
.blog-topic h5{
font-size: 22px;
font-weight: bold;
font-family: 'Poppins', sans-serif;
color: #484b59;
}
.blog-body .blog-topic ul{
padding-left: 0px;
margin-bottom: 0px;
}
.blog-body .blog-topic ul li{
list-style: none;
font-family: "Open Sans", sans-serif;
letter-spacing: 1px;
position: relative;
overflow: hidden;
font-size: 13px;
margin-bottom: 10px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
}
.blog-body .blog-topic ul li:last-child{
margin-bottom: 0px;
}
.blog-body .blog-topic ul li a{
font-family: "Open Sans", sans-serif;
font-weight:500;
color: #484b59;
text-decoration: none;
display: inline-block;
padding-right: 8px;
}
.blog-body .blog-topic ul li .dots{
overflow-wrap: break-word;
white-space: nowrap;
}
.blog-body .blog-topic ul li p{
font-family: "Open Sans", sans-serif;
font-weight:500;
display: inline-block;
float: right;
background-color: #F8F8F8;
padding-left: 7px;
color:#000000;
}
.blog-body .blog-topic ul li:last-child p{
margin-bottom: 0px;
}
.blog-body .blog-topic ul li .dots:before{
content: ". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .";
white-space: nowrap;
height: 2px;
opacity: 1;
z-index: -99999;
line-height: 1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
width: 100%;
}
.blog-post{
padding: 40px 48px;
background-color: rgba(225, 225, 225, 0.24);
margin-bottom: 30px;
}
.blog-post h5{
font-size: 22px;
font-weight: bold;
font-family: 'Poppins', sans-serif;
color: #484b59;
}
.blog-post .media{
margin-bottom: 10px;
}
.blog-post .media img{
border-radius: 20px;
width: 90px;
height: 90px;
}
.blog-post .media:last-child{
margin-bottom: 0px;
}
.blog-post .media .media-body h5{
font-family: 'Poppins', sans-serif;
color: #484b59;
font-size: 14px;
line-height: 1.4;
display: block;
}
.blog-post .media .media-body p{
font-family: 'Poppins', sans-serif;
font-size: 12px;
color: #0fc0e0;
font-weight: bold;
}
.blog-post .media .media-body p .date{
color: gray;
font-weight: normal;
font-style: italic;
}
.blog-post .media .media-body p a{
color: #0fc0e0;
text-decoration: none;
}
.blog-post .media .media-body p .author{
color: gray;
font-weight: normal;
}
.blog-tags-sec{
padding: 40px 48px;
background-color: rgba(225, 225, 225, 0.24);
margin-bottom: 30px;
}
.blog-tags-sec h5{
font-size: 22px;
font-weight: bold;
font-family: 'Poppins', sans-serif;
color: #484b59;
}
.blog-tags li{
display: inline-block;
margin-bottom: 10px;
}
.blog-tags li a{
padding: 6px 15px;
border:1px solid #838383;
font-size: 13px;
color: #838383;
border-radius: 50px;
text-decoration: none;
}
.blog-tags li a:hover,.blog-tags li a:focus{
border:1px solid #00bcd4;
background-color: #00bcd4;
color: #FFFFFF;
}
.blog-archives{
padding: 40px 48px;
background-color: rgba(225, 225, 225, 0.24);
margin-bottom: 30px;
}
.blog-archives h5{
font-size: 22px;
font-weight: bold;
font-family: 'Poppins', sans-serif;
color: #484b59;
}
.blog-body .blog-archives ul{
padding-left: 0px;
margin-bottom: 0px;
}
.blog-body .blog-archives ul li{
list-style: none;
font-family: "Open Sans", sans-serif;
letter-spacing: 1px;
position: relative;
overflow: hidden;
font-size: 13px;
margin-bottom: 10px;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
}
.blog-body .blog-archives ul li:last-child{
margin-bottom: 0px;
}
.blog-body .blog-archives ul li a{
font-family: "Open Sans", sans-serif;
font-weight:500;
color: #484b59;
text-decoration: none;
display: inline-block;
padding-right: 8px;
}
.blog-body .blog-archives ul li .dots{
overflow-wrap: break-word;
white-space: nowrap;
}
.blog-body .blog-archives ul li p{
font-family: "Open Sans", sans-serif;
font-weight:500;
display: inline-block;
float: right;
background-color: #F8F8F8;
padding-left: 7px;
color: #484b59;
}
.blog-body .blog-archives ul li:last-child p{
margin-bottom: 0px;
}
.blog-body .blog-archives ul li .dots:before{
content: ". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .";
white-space: nowrap;
height: 2px;
opacity: 1;
z-index: -99999;
line-height: 1;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
width: 100%;
}
.blog-advertise{
margin-bottom: 30px;
}
.blog-advertise img {
width: 100%;
}
.blog-body article .post-thumbnail{
margin-bottom: 25px;
}
/*Post plus Article*/
.blog-body .blog-classic:first-child {
padding-top: 0;
}
.blog-classic {
padding: 4rem 0;
border-bottom: 1px solid #efefef;
}
.blog-body article .post-thumbnail img{
width: 100%;
}
.blog-body article .post-title {
font-size: 1.4rem;
line-height: 1.3;
margin-top: 0;
margin-bottom: 5px;
}
.blog-body article .post-title a{
text-decoration: none;
color: #484b59;
font-family: 'Poppins', sans-serif;
font-weight: bold;
}
.blog-body article .post-details.alt-font {
font-size: 11px;
line-height: 2;
color: #939393;
text-transform: uppercase;
margin-bottom: .8rem;
font-weight: bold;
font-family: 'Poppins', sans-serif;
}
.post-separator {
margin: 0 10px;
}
.post-separator:nth-last-child(1) {
display: none;
}
.blog-body article .post-details .post-author a{
text-decoration: none;
color: #939393;
font-weight: bold;
}
.blog-body article .post-details .post-categories .cat-links a{
text-decoration: none;
color: #939393;
font-weight: bold;
}
.blog-body article .post-content p{
font-size: 14px;
font-family: 'Poppins', sans-serif;
color: #AEAEAE;
line-height: 1.8;
}
.blog-body article .post-content .btn-primary {
color: #ffffff;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
background-size: 200% auto;
background-image: -webkit-gradient(linear, left top, right top, from(#0284d0), color-stop(51%, #39c5de), to(#0284d0));
background-image: -o-linear-gradient(left, #0284d0 0%, #39c5de 51%, #0284d0 100%);
background-image: linear-gradient(to right, #0284d0 0%, #39c5de 51%, #0284d0 100%);
background-size: 200% auto;
border: none;
}
.blog-body article .post-content .btn-rounded {
border-radius: 50px;
}
.blog-body article .post-content .btn-large {
font-size: 14px;
padding: 8px 30px;
line-height: 25px;
}
.blog-body article .post-content .btn-primary:hover {
background-position: right center;
color: #fff;
}
.gallery-projects {
list-style: none;
padding: 0;
margin: 0;
margin-bottom: 2rem;
}
.gallery-projects img {
max-width: 100%;
height: auto;
}
.gallery-projects .img-hover {
position: absolute;
top: 0;
width: 100%;
text-align: center;
display: block;
height: 100%;
vertical-align: middle;
opacity: 0;
visibility: hidden;
background: rgba(0,0,0,.3);
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.gallery-projects li {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
}
.gallery-projects .img-hover i {
color: #fff;
font-size: 20px;
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.gallery-projects li>a:hover .img-hover {
opacity: 1;
visibility: visible;
}
a {
color: #3264f5;
text-decoration: none;
background-color: transparent;
}
.blog-post-navigation {
padding-top: 4rem;
}
.blog-post-navigation .page-link.current {
z-index: 1;
color: #484b59;
background-color: #e9ecef;
border-color: #dee2e6;
}
.blog-post-navigation .page-link {
position: relative;
display: block;
padding: 0.7rem 1.1rem;
color: #484b59;
text-decoration: none;
font-weight: lighter;
}
.blog-post-navigation a {
text-decoration: underline;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
height: 35px;
line-height: 1.5;
width: 35px;
outline: #484b59;
background-size: 100%, 100%;
border-radius: 50%;
border: 1px solid whitesmoke;
background-image: none;
}
.carousel-control-next-icon:after
{
content: '>';
font-size: 22px;
color: whitesmoke;
}
.carousel-control-prev-icon:after {
content: '<';
font-size: 22px;
color: whitesmoke;
}
/* ===================================
Blog PAGES END
====================================== */
/* ===================================
Blog Section
====================================== */
.blog-text{
max-width: 500px;
}
.blog-text h2{
font-size: 2rem;
margin-bottom: 1.2rem;
color: #3c3f46;
font-weight: 400;
font-family: 'Poppins', sans-serif;
line-height: 1.3;
}
.blog-image, .blog-image2{
max-width: 500px;
}
.date, .date-2 {
position: absolute;
top: 5px;
background: #FFFFFF;
right: 60px;
z-index: 99;
font-family: 'Poppins', sans-serif;
font-weight: 200;
font-size: 14px;
color: #3c3f46;
padding: 18px 22px 18px 22px;
text-align: center;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
}
.blog-image, .blog-image2 {
overflow: hidden;
}
.blog-image img, .blog-image2 img {
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.blog-image:hover img, .blog-image2:hover img {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.date.date-hvr, .date-2.date-2-hvr{
background: #39C5DE;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
color: #ffffff;
}
/* ===================================
Address , Map % Contact
====================================== */
.contact{
background: url("../img/map-bg.jpg");
}
#google-map {
border: 10px solid #ffffff;
height: 400px;
width: 100%;
}
.col-map #google-map {
height: 418px;
}
.map {
background: url(../img/map.jpg);
}
.bg-overlay {position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.bg-color{
background-color: rgba(2, 132, 208, 0.71);
}
.address-text{
padding: 7.5rem 0;
}
.map-text {
font-family: 'Poppins', sans-serif;
font-size: 40px;
font-weight: 400;
}
/*==========================
Footer
===========================*/
.footer-sec{
padding: 5.2rem 0 7.5rem;
background: #f8f8f8;
z-index: -1;
bottom: 0;
width: 100%;
}
.footer-social li{
display: inline-block;
}
.footer-social a {
display: block;
width: 45px;
color: #484b59;
height: 45px;
text-align: center;
line-height: 45px;
border-radius: 50px;
visibility: visible !important;
font-size: 17px;
margin: 10px 5px;
border: 1px solid transparent;
-webkit-transition: background-color .2s ease-in-out;
-o-transition: background-color .2s ease-in-out;
transition: background-color .2s ease-in-out;
}
.footer-social li a:hover{
background-color:#00bcd4;
color: #ffffff;
}
.grey-text {
color: #8b8b8b;
}
/*-------------------------------
Footer ends
-------------------------------*/
/*===================================
media query
======================================*/
@media screen and (max-width: 1199px) {
.navbar-top-default .navbar-nav .nav-link {
margin: 0 0.1rem;
font-size: 12px;
}
.search_block {
left: 32%;
}
}
@media screen and (max-width: 1024px) {
.feature-item{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.feature-item .icon {margin: 0 auto 15px ;}
.feature-item .icon-2 {margin: 0 auto 15px ;}
.text {text-align: center !important;}
.blog-panel .panel-img {overflow: hidden; width: 100%; height: 100%;}
}
@media screen and (max-width: 991px) {
.da-thumbs li {
width: 33%;
}
.blog-panel .panel-img {overflow: hidden; width: 100%; height: 100%;}
.panel-img img {width: 100%;}
}
@media screen and (max-width: 768px) {
#join-us {display: none;}
.select2-container {
width: 100% !important;}
.form-title {text-align: center;}
.form-para {text-align: center;}
.social-icons-simple {display: none;}
.side-menu {
width: 300px;
}
.feature-item .icon-2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 auto !important;}
.feature-item .icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 auto !important;}
.feature-txt {margin-top: 20px;}
.hermes.tp-bullets {display: none;}
section {padding: 4.5rem 0;}
.main-title.style-two h2 {font-size: 32px; line-height: 46px;}
.main-title.style-two h5 {font-size: 18px; line-height: 28px;}
.department-title h2 {font-size: 30px; line-height: 46px; margin-bottom: 30px;}
.form-title h2 {margin-bottom: 32px; font-size: 32px; text-align: center;}
.feature-item {margin: 0 auto;}
.da-thumbs li {width: auto; margin-left: 150px;}
.side-nav .navbar-nav .nav-link {font-size: 20px; line-height: 30px;}
.form-bg {background-position: top center;
background-position-x: right;
background-position-y: top;}
.portfolio-title h2 {font-size: 32px;}
.testimonial-title h2 {font-size: 32px;}
.portfolio-subtitle {margin-bottom: 26px;}
.testimonial-subtitle {margin-bottom: 26px;}
.serial-box {margin-bottom: 40px;}
.test {max-width: 310px;}
.blog-text {text-align: center; margin-bottom: 40px;}
.blog-text h2 {font-size: 26px;}
.date, .date-2 {right: 21px;}
#google-map {margin-top: 80px;}
.address-text {
text-align: center;
padding: 2.5rem 0;
}
.footer-social a {margin: 10px 3px;}
.map-text {font-size: 32px;}
.contact-subtitle {font-weight: 400; font-size: 16px;}
.nav-link {display: block;
padding: .3rem .6rem;}
.blog-topic h5 {text-align: center;}
.blog-post h5 {text-align: center;}
.blog-tags-sec h5 {text-align: center;}
.blog-archives h5 {text-align: center;}
.blog-panel {text-align: center; margin-bottom: 20px;}
.blog-classic {text-align: center;}
.list-unstyled {text-align: center;}
.blog-body {padding: 4.5rem 0;}
.blog-body article .post-content {margin: 0;}
.small-bg-overlay {background-color:#ffffff; opacity: 0.6; height: 100%; z-index: 1; width: 100%;}
}
@media screen and (max-width: 767px) {
.da-thumbs li {margin-left: 65px;}
.panel-img {margin: 0 auto;}
}
@media screen and (max-width: 480px) {
.da-thumbs li {margin: 0 30px;}
}