/**********************

Style.css
=============

Author:  Gino Aliaj
Template: Cariera - Job Board HTML Template
Version: 1.0

Author URI: gnodesign.com
***************************/

/*------------------------------------------------------------------
[Table of contents]

1.  DEFAULT TYPOGRAPHY
2.  GENERAL STYLES
3.  MARGINS & PADDINGS

4.  ELEMENTS
    4.1.    BUTTONS
        4.1.1.  BUTTON COLORS
        4.1.2.  BACK TO TOP
        4.1.3.  CHECK BUTTONS
    4.2.    SOCIAL MEDIA BUTTONS
        4.2.1.  SOCIAL MEDIA BUTTON COLORS
    4.3.    PAGE HEADER
        4.3.1.  VERSION 1 - DEFAULT
        4.3.2.  VERSION 2 - LIGHT
        4.3.3.  VERSION 3 - DARK
        4.3.4.  VERSION 4 - PARALLAX
    4.4.    PRICING TABLES

5.  HEADERS - NAVIGATIONS
    5.1.    VERSION 1 - DEFAULT
    5.2.    VERSION 2 - LOGO TOP
    5.3.    VERSION 3 - TOP BAR
    5.4.    VERSION 4 - STICKY
    5.5.    DROPDOWN MENU
        5.5.1.  SIMPLE MENU
        5.5.2.  DROPDOWN SUBMENU
        5.5.3.  MEGA MENU
        5.5.4.  LOGIN POP UP

6.  FOOTERS
    6.1.    FOOTER VERSION 1 - DEFAULT
    6.2.    FOOTER VERSION 2 - LIGHT
    6.3.    FOOTER VERSION 3 - DARK
    6.4.    FOOTER VERSION 4 - SIMPLE

7.  SECTIONS
    7.1.    MAIN - JOB SEARCH
        7.1.1.  VERSION 1
        7.1.2.  VERSION 2 - SLIDER
    7.2.    POPULAR CATEGORIES
        7.2.1.  VERSION 1
        7.2.2.  VERSION 2
        7.2.3.  VERSION 3
    7.3.    SIGNUP & VIDEO
    7.4.    JOB POST
    7.5.    COUTUP
    7.6.    TESTIMONIAL
    7.7.    LATEST NEWS
        7.7.1.  VERSION 1
        7.7.2.  VERSION 2
        7.7.3.  VERSION 3
    7.8.    PARTNERS
    7.9.    GET STARTED
    7.10.   CARIERA APP
    7.11.   JOB SEARCH

8.  PAGES
    8.1.   SEARCH JOBS
        8.1.1. VERSION 2
        8.1.2. VERSION 3
        8.1.3. VERSION 4
    8.2.   POST JOB - POST RESUME
    8.3.   FIND CANDIDATE
        8.3.1.  VERSION 2
    8.4.   ABOUT US
    8.5.    CONTACT US
        8.5.1.   CONTACT VER. 1
        8.5.2.   CONTACT VER. 2
    8.6.    COMPANIES
    8.7.   COMPANY PAGE
        8.7.1. VERSION 1
        8.7.2. VERSION 2
        8.7.3. LATEST JOBS
    8.8.    CANDIDATE PROFILE
        8.8.1   VERSION 1
        8.8.2   VERSION 3
    8.9.    FAQ
    8.10.   JOB PAGE
    8.11.   404 - PAGE NOT FOUND
    8.12.   COMING SOON
    8.13.   LOGIN - REGISTER

9.  BLOG
    9.1.    BLOG LISTING
        9.1.1.  VERSION 1
        9.1.2.  VERSION 2
    9.2.    BLOG SIDEBAR
    9.3.    MASONRY GRID
    9.4.    SINGLE BLOG POST
    9.5.    NEXT BLOG POST SECTION

10.  SHOP
    10.1.   SHOP LISTING
    10.2.   SHOP SIDEBAR
    10.3.   SINGLE PRODUCT
    10.4.   CART
    10.5.   CHECKOUT


-------------------------------------------------------------------*/

@import url(animate.css);
@import url(magnific-popup.css);
@import url(bootstrap-select.min.css);
@import url(jquery-ui.min.css);

/* --------------------------------------
    1. Default Typography
-------------------------------------- */

*,
body {
    font-family: "Raleway", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Varela Round", sans-serif;
    margin: 0 !important;
}

h1 {
    font-size: 46px;
}

h2 {
    font-size: 38px;
}

h3 {
    font-size: 30px;
}

h4 {
    font-size: 24px;
}

h5 {
    font-size: 20px;
}

h6 {
    font-size: 18px;
}

p {
    font-size: 16px;
    line-height: 24px;
    color: #666;
}

/* --------------------------------------
    2. General Styles
-------------------------------------- */

html,
body {
    width: 100%;
    height: 100%;
}

body.mfp-zoom-out-cur {
    overflow: hidden;
}

body.boxed {
    max-width: 1200px;
    margin: 0 auto;
    background: #e3e3e3;
}

section {
    position: relative;
    background: #cfeae1;
}

a {
    color: #29b2fe;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

a:hover,
a:focus {
    color: #29b2fe;
}

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

a,
button,
input {
    outline: none !important;
}

.form-control {
    width: 100%;
    padding: 10px 20px;
    color: #666;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    height: auto;
    box-shadow: none;
    -webkit-appearance: none;
}

.form-control:focus {
    outline: none;
    box-shadow: none;
    border-color: #e3e3e3;
}

select.form-control {
    cursor: pointer;
    color: #999;
}

::-webkit-input-placeholder {
    opacity: 1;
    color: #999;
}

::-moz-placeholder {
    opacity: 1;
    color: #999;
}

:-ms-input-placeholder {
    opacity: 1;
    color: #999;
}

:-moz-placeholder {
    opacity: 1;
    color: #999;
}

.uppercase {
    text-transform: uppercase;
}

.capitalize {
    text-transform: capitalize;
}

ul {
    margin: 0;
    list-style: none;
}

img {
    -moz-user-select: none;
    /* These user-select properties are inheritable, used to prevent text selection */
    -webkit-user-select: none;
    -ms-user-select: none;
    /* From IE10 only */
    -webkit-user-drag: none;
    /* Prevents dragging of images/divs etc */
    user-drag: none;
}

.fullscreen {
    width: 100%;
    height: 100%;
}

.shadow {
    -webkit-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    -moz-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
}

.shadow-hover {
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
    box-shadow: none;
}

.shadow-hover:hover {
    -webkit-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    -moz-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
}

.overlay-black:before {
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

.overlay-blue:before {
    background: rgba(41, 177, 253, 0.25);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

.overlay-gradient:before {
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

.overlay-gradient:after {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 3;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.4;
}

.overlay-black>div,
.overlay-blue>div .overlay-gradient>div {
    position: relative;
    z-index: 4;
}

.hover-link:after {
    content: "\f0c1";
    font-family: "fontawesome";
    color: #f6f6f6;
    font-size: 32px;
    cursor: pointer;
    position: absolute;
    top: 50%;
    left: -20%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.hover-link:hover:after {
    left: 50%;
    opacity: 0.9;
}

.hover-zoom:after {
    content: "\f00e";
    font-family: "fontawesome";
    font-size: 30px;
    color: #f6f6f6;
    cursor: pointer;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 5;
    display: block;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    opacity: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.hover-zoom:hover:after {
    opacity: 0.8;
    font-size: 38px;
}

.transparent {
    background: transparent !important;
}

.text-white {
    color: #c8c8c8;
}

.text-blue {
    color: #29b2fe;
}

.section-title {
    text-align: center;
    padding-bottom: 60px;
    margin: 0;
    text-transform: capitalize;
}

.section-title h2:after {
    content: "";
    width: 50px;
    height: 3px;
    background: #29b1fd;
    display: block;
    margin: 0 auto;
    margin-top: 20px;
}

ul.list {
    margin-left: 0px;
    padding: 0;
}

.list li {
    list-style: outside none none;
    margin: 10px 0px 10px 25px;
    position: relative;
    font-size: 16px;
    line-height: 24px;
    color: #666;
}

.list li:first-child {
    margin-top: 0;
}

.list li:before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    background: #29b1fd;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: absolute;
    left: -25px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.table {
    max-width: none;
}

/* --------------------------------------
    3. Margins & Paddings
-------------------------------------- */

.nopadding {
    padding: 0 !important;
}

.nomargin {
    margin: 0 !important;
}

/********** Margin Top **********/

.mt5 {
    margin-top: 5px;
}

.mt10 {
    margin-top: 10px;
}

.mt15 {
    margin-top: 15px;
}

.mt20 {
    margin-top: 20px;
}

.mt25 {
    margin-top: 25px;
}

.mt30 {
    margin-top: 30px;
}

.mt35 {
    margin-top: 35px;
}

.mt40 {
    margin-top: 40px;
}

.mt45 {
    margin-top: 45px;
}

.mt50 {
    margin-top: 50px;
}

.mt60 {
    margin-top: 60px;
}

.mt70 {
    margin-top: 70px;
}

.mt80 {
    margin-top: 80px;
}

.mt90 {
    margin-top: 90px;
}

.mt100 {
    margin-top: 100px;
}

.mt110 {
    margin-top: 110px;
}

.mt120 {
    margin-top: 120px;
}

.mt125 {
    margin-top: 125px;
}

.mt130 {
    margin-top: 130px;
}

.mt140 {
    margin-top: 140px;
}

.mt150 {
    margin-top: 150px;
}

/********** Margin Bottom **********/

.mb5 {
    margin-bottom: 5px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb15 {
    margin-bottom: 15px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb25 {
    margin-bottom: 25px;
}

.mb30 {
    margin-bottom: 30px;
}

.mb35 {
    margin-bottom: 35px;
}

.mb40 {
    margin-bottom: 40px;
}

.mb45 {
    margin-bottom: 45px;
}

.mb50 {
    margin-bottom: 50px;
}

.mb60 {
    margin-bottom: 60px;
}

.mb70 {
    margin-bottom: 70px;
}

.mb80 {
    margin-bottom: 80px;
}

.mb90 {
    margin-bottom: 90px;
}

.mb100 {
    margin-bottom: 100px;
}

.mb110 {
    margin-bottom: 110px;
}

.mb120 {
    margin-bottom: 120px;
}

.mb125 {
    margin-bottom: 125px;
}

.mb130 {
    margin-bottom: 130px;
}

.mb140 {
    margin-bottom: 140px;
}

.mb150 {
    margin-bottom: 150px;
}

/********** Margin Top & Bottom **********/

.mtb5 {
    margin: 5px 0;
}

.mtb10 {
    margin: 10px 0;
}

.mtb15 {
    margin: 15px 0;
}

.mtb20 {
    margin: 20px 0;
}

.mtb25 {
    margin: 25px 0;
}

.mtb30 {
    margin: 30px 0;
}

.mtb35 {
    margin: 35px 0;
}

.mtb40 {
    margin: 40px 0;
}

.mtb45 {
    margin: 45px 0;
}

.mtb50 {
    margin: 50px 0;
}

.mtb60 {
    margin: 60px 0;
}

.mtb70 {
    margin: 70px 0;
}

.mtb80 {
    margin: 80px 0;
}

.mtb90 {
    margin: 90px 0;
}

.mtb100 {
    margin: 100px 0;
}

.mtb110 {
    margin: 110px 0;
}

.mtb120 {
    margin: 120px 0;
}

.mtb130 {
    margin: 130px 0;
}

.mtb140 {
    margin: 140px 0;
}

.mtb150 {
    margin: 150px 0;
}

/********** Padding Top **********/

.pt5 {
    padding-top: 5px;
}

.pt10 {
    padding-top: 10px;
}

.pt15 {
    padding-top: 15px;
}

.pt20 {
    padding-top: 20px;
}

.pt25 {
    padding-top: 25px;
}

.pt30 {
    padding-top: 30px;
}

.pt35 {
    padding-top: 35px;
}

.pt40 {
    padding-top: 40px;
}

.pt45 {
    padding-top: 45px;
}

.pt50 {
    padding-top: 50px;
}

.pt60 {
    padding-top: 60px;
}

.pt70 {
    padding-top: 70px;
}

.pt80 {
    padding-top: 80px;
}

.pt90 {
    padding-top: 90px;
}

.pt100 {
    padding-top: 100px;
}

.pt110 {
    padding-top: 110px;
}

.pt120 {
    padding-top: 120px;
}

.pt130 {
    padding-top: 130px;
}

.pt140 {
    padding-top: 140px;
}

.pt150 {
    padding-top: 150px;
}

.pt160 {
    padding-top: 160px;
}

/********** Padding Bottom **********/

.pb5 {
    padding-bottom: 5px;
}

.pb10 {
    padding-bottom: 10px;
}

.pb15 {
    padding-bottom: 15px;
}

.pb20 {
    padding-bottom: 20px;
}

.pb25 {
    padding-bottom: 25px;
}

.pb30 {
    padding-bottom: 30px;
}

.pb35 {
    padding-bottom: 35px;
}

.pb40 {
    padding-bottom: 40px;
}

.pb45 {
    padding-bottom: 45px;
}

.pb50 {
    padding-bottom: 50px;
}

.pb60 {
    padding-bottom: 60px;
}

.pb70 {
    padding-bottom: 70px;
}

.pb80 {
    padding-bottom: 80px;
}

.pb90 {
    padding-bottom: 90px;
}

.pb100 {
    padding-bottom: 100px;
}

.pb110 {
    padding-bottom: 110px;
}

.pb120 {
    padding-bottom: 120px;
}

.pb130 {
    padding-bottom: 130px;
}

.pb140 {
    padding-bottom: 140px;
}

.pb150 {
    padding-bottom: 150px;
}

.pb160 {
    padding-bottom: 160px;
}

/********** Padding Top & Bottom **********/

.ptb5 {
    padding: 5px 0;
}

.ptb10 {
    padding: 10px 0;
}

.ptb15 {
    padding: 15px 0;
}

.ptb20 {
    padding: 20px 0;
}

.ptb25 {
    padding: 25px 0;
}

.ptb30 {
    padding: 30px 0;
}

.ptb35 {
    padding: 35px 0;
}

.ptb40 {
    padding: 40px 0;
}

.ptb45 {
    padding: 45px 0;
}

.ptb50 {
    padding: 50px 0;
}

.ptb60 {
    padding: 60px 0;
}

.ptb70 {
    padding: 70px 0;
}

.ptb80 {
    padding: 80px 0;
}

.ptb90 {
    padding: 90px 0;
}

.ptb100 {
    padding: 100px 0;
}

.ptb110 {
    padding: 110px 0;
}

.ptb120 {
    padding: 120px 0;
}

.ptb130 {
    padding: 130px 0;
}

.ptb140 {
    padding: 140px 0;
}

.ptb150 {
    padding: 150px 0;
}

.ptb160 {
    padding: 160px 0;
}

/* --------------------------------------
    4. Elements
-------------------------------------- */

/*********** 4.1 Buttons *************/

.btn {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    outline: none;
    padding: 0 15px;
    position: relative;
    line-height: 35px;
    font-size: 14px;
    font-weight: 600;
    color: #f6f6f6 !important;
    text-transform: uppercase;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.btn.active,
.btn:active {
    box-shadow: none !important;
}

.btn:focus {
    color: #f6f6f6;
}

.btn-small {
    line-height: 25px;
}

.btn-large {
    line-height: 50px;
    font-size: 16px;
}

/* button effect */

.btn-effect {
    overflow: hidden;
}

.ripple {
    width: 0;
    height: 0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    position: absolute;
    opacity: 1;
}

.rippleEffect {
    animation: rippleDrop 0.6s linear;
}

@keyframes rippleDrop {
    100% {
        -webkit-transform: scale(2.5);
        -moz-transform: scale(2.5);
        -o-transform: scale(2.5);
        -ms-transform: scale(2.5);
        transform: scale(2.5);
        opacity: 0;
    }
}

/*** ====== 4.1.1 Button Colors ====== ***/

.btn-blue {
    background: #29b1fd;
}

.btn-blue:hover {
    background: #66c9ff;
}

.btn-green {
    background: #2ecc71;
}

.btn-green:hover {
    background: #4dd977;
}

.btn-purple {
    background: #443088;
}

.btn-purple:hover {
    background: #5c48a0;
}

.btn-orange {
    background: #e69d29;
}

.btn-orange:hover {
    background: #ecaf4f;
}

.btn-red {
    background: #db6131;
}

.btn-red:hover {
    background: #dc7f5a;
}

.btn-dark {
    background: #0c112a;
}

.btn-dark:hover {
    background: #293053;
}

/*** ====== 4.1.2 Back to Top Button ====== ***/

.back-top {
    position: fixed;
    opacity: 0;
    right: 0;
    bottom: 30px;
    height: 45px;
    width: 45px;
    text-align: center;
    line-height: 45px;
    background: -moz-linear-gradient(left, #29b2fe -30%, #443088 130%);
    background: -webkit-linear-gradient(left, #29b2fe -30%, #443088 130%);
    background: linear-gradient(to right, #29b2fe -30%, #443088 130%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    box-shadow: 0 0 50px 0 rgba(68, 48, 136, 0.5);
    font-size: 18px;
    z-index: 10;
    visibility: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.back-top:hover {
    box-shadow: 0 0 0 0 rgba(68, 48, 136, 0);
}

.back-top i {
    color: #f6f6f6;
}

.back-top-visible {
    opacity: 1;
    right: 30px;
    visibility: visible;
}

/*** ====== 4.1.3 Check Button ====== ***/

/* Base for label styling */

[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
}

[type="checkbox"]:not(:checked)+label,
[type="checkbox"]:checked+label {
    position: relative;
    padding-left: 25px;
    cursor: pointer;
}

/* checkbox aspect */

[type="checkbox"]:not(:checked)+label:before,
[type="checkbox"]:checked+label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 1.25em;
    height: 1.25em;
    border: 2px solid #e3e3e3;
    background: #fff;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

/* checked mark aspect */

[type="checkbox"]:not(:checked)+label:after,
[type="checkbox"]:checked+label:after {
    content: "✔";
    position: absolute;
    top: 0;
    left: 3px;
    font-size: 18px;
    line-height: 1;
    color: #29b1fd;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

/* checked mark aspect changes */

[type="checkbox"]:not(:checked)+label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

[type="checkbox"]:checked+label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

/*********** 4.2 Social Media Buttons *************/

.social-btn-roll {
    width: 35px;
    height: 35px;
    border: 1px solid #3b5998;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    overflow: hidden;
    display: block;
    -webkit-transition: background 0.3s ease;
    -moz-transition: background 0.3s ease;
    -ms-transition: background 0.3s ease;
    -o-transition: background 0.3s ease;
    transition: background 0.3s ease;
}

.social-btn-roll:hover .social-btn-roll-icons {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.social-btn-roll:hover .social-btn-roll-icon {
    color: #f6f6f6;
}

.social-btn-roll-icons {
    width: 200%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.social-btn-roll-icon {
    width: 50%;
    line-height: 35px;
    text-align: center;
    display: block;
    float: left;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

/*** ====== 4.2.1 Social Media Button Colors ====== ***/

.social-btn-roll.facebook {
    border-color: #3b5998;
    color: #3b5998;
}

.social-btn-roll.facebook:hover {
    background: #3b5998;
}

.social-btn-roll.twitter {
    border-color: #4cc4f2;
    color: #4cc4f2;
}

.social-btn-roll.twitter:hover {
    background: #4cc4f2;
}

.social-btn-roll.google-plus {
    border-color: #dd4b39;
    color: #dd4b39;
}

.social-btn-roll.google-plus:hover {
    background: #dd4b39;
}

.social-btn-roll.instagram {
    border-color: #9b6954;
    color: #9b6954;
}

.social-btn-roll.instagram:hover {
    background: #9b6954;
}

.social-btn-roll.linkedin {
    border-color: #0077b5;
    color: #0077b5;
}

.social-btn-roll.linkedin:hover {
    background: #0077b5;
}

.social-btn-roll.rss {
    border-color: #ffa500;
    color: #ffa500;
}

.social-btn-roll.rss:hover {
    background: #ffa500;
}

.social-btn-roll.pinterest {
    border-color: #cb2027;
    color: #cb2027;
}

.social-btn-roll.pinterest:hover {
    background: #cb2027;
}

.social-btn-roll.tumblr {
    border-color: #32506d;
    color: #32506d;
}

.social-btn-roll.tumblr:hover {
    background: #32506d;
}

.social-btn-roll.github {
    border-color: #171515;
    color: #171515;
}

.social-btn-roll.github:hover {
    background: #171515;
}

.social-btn-roll.dribbble {
    border-color: #ec4a89;
    color: #ec4a89;
}

.social-btn-roll.dribbble:hover {
    background: #ec4a89;
}

/*********** 4.3 Page Header *************/

/*** ====== 4.3.1 Version 1 - Default ====== ***/

section.page-header {
    position: relative;
    background: url(../images/img/page-header.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    text-align: center;
    padding: 40px 0;
    margin: 0;
    border: 0;
    color: #f6f6f6;
}

section.page-header>div {
    z-index: 4;
    position: relative;
}

section.page-header:before {
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

section.page-header:after {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 3;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.2;
}

section.page-header h2 {
    text-transform: uppercase;
}

section.page-header .breadcrumb {
    padding: 0;
    margin: 0;
    background: none;
    text-transform: capitalize;
}

section.page-header .breadcrumb>li a {
    color: #f6f6f6;
}

section.page-header .breadcrumb>.active {
    color: #999;
}

section.page-header .breadcrumb>li+li:before {
    padding: 0 7px;
    color: inherit;
}

/*** ====== 4.3.2 Version 2 - Light ====== ***/

section.page-header2 {
    padding: 40px 0;
    background: #f0f0f0;
    border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
}

section.page-header2 h2 {
    text-transform: uppercase;
    color: #666;
}

section.page-header2 .breadcrumb {
    background: none;
    text-transform: capitalize;
    font-weight: 700;
    line-height: 41px;
    padding: 0;
    text-align: right;
    margin: 0;
}

/*** ====== 4.3.3 Version 3 - Dark ====== ***/

section.page-header3 {
    padding: 40px 0;
    background: #1e1f21;
    border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
}

section.page-header3 h2 {
    text-transform: uppercase;
    color: #f6f6f6;
}

section.page-header3 .breadcrumb {
    background: none;
    text-transform: capitalize;
    font-weight: 700;
    line-height: 41px;
    padding: 0;
    text-align: right;
    margin: 0;
}

section.page-header3 .breadcrumb>.active {
    color: #999;
}

/*** ====== 4.3.4 Version 4 - Parallax ====== ***/

section.page-header4 {
    position: relative;
    background: url(../images/img/page-header.jpg) no-repeat;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    text-align: center;
    padding: 60px 0;
    margin: 0;
    border: 0;
    color: #f6f6f6;
}

section.page-header4>div {
    z-index: 4;
    position: relative;
}

section.page-header4:before {
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

section.page-header4:after {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 3;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.2;
}

section.page-header4 h2 {
    text-transform: uppercase;
}

section.page-header4 .breadcrumb {
    padding: 0;
    margin: 0;
    background: none;
    text-transform: capitalize;
}

section.page-header4 .breadcrumb>li a {
    color: #f6f6f6;
}

section.page-header4 .breadcrumb>.active {
    color: #999;
}

section.page-header4 .breadcrumb>li+li:before {
    padding: 0 7px;
    color: inherit;
}

/*********** 4.4 Pricing Tables *************/

section.pricing-tables {
    background: #f0f0f0;
}

.pricing-table {
    position: relative;
    text-align: center;
    background: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 40px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.pricing-table:hover {
    margin-top: -10px;
}

#popular.pricing-table:before {
    content: "\f005";
    font-family: "fontawesome";
    width: 50px;
    height: 50px;
    display: block;
    position: absolute;
    color: #fff;
    text-align: center;
    top: -25px;
    right: 0;
    left: 0;
    margin: 0 auto;
    background: #29b2fe;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 24px;
    line-height: 50px;
}

.pricing-table .pricing-header {
    text-transform: capitalize;
}

.pricing-table .pricing {
    margin: 40px 0;
    padding: 20px 0;
    border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
    color: #555;
}

.pricing-table .pricing .currency {
    font-size: 18px;
    font-weight: bold;
}

.pricing-table .pricing .amount {
    font-size: 52px;
    font-weight: bold;
    vertical-align: middle;
}

.pricing-table .pricing .month {
    text-transform: capitalize;
    vertical-align: bottom;
    line-height: 40px;
    font-weight: 600;
}

.pricing-table .pricing-footer {
    margin-top: 40px;
}

/* --------------------------------------
    5. Headers - Navigation
-------------------------------------- */

/*********** 5.1 Version 1 - Default *************/

header {
    width: 100%;
    z-index: 999;
    -webkit-transition: 0.6s all ease;
    -moz-transition: 0.6s all ease;
    -ms-transition: 0.6s all ease;
    -o-transition: 0.6s all ease;
    transition: 0.6s all ease;
}

header.navbar-fixed-top {
    position: fixed !important;
}

nav.navbar {
    background: #f6f6f6;
    border: none;
    padding: 15px 0;
    margin: 0;
}

.navbar-brand {
    height: 100%;
    padding: 15px 0;
    padding-right: 30px;
}

.navbar-brand img {
    height: 30px;
    cursor: pointer;
}

div#main-nav {
    padding-top: 20px;
}

.navbar .navbar-nav>li.mobile-title {
    display: none;
}

.navbar .navbar-nav>li.login-btn {
    margin-left: 10px;
}

.nav>li>a:focus,
.nav>li>a:hover {
    background: none !important;
}

.nav>li>a:focus {
    color: #29b2fe !important;
}

.navbar .navbar-nav>li>a {
    font-family: "Varela Round", sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
    color: #666;
    padding: 15px 10px;
}

.navbar .navbar-nav>li>a:hover {
    color: #29b2fe;
    -webkit-transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    -o-transition: 0.3s ease-in;
    transition: 0.3s ease-in;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    background: none !important;
    color: #29b2fe;
}

.navbar .navbar-nav>li>a i {
    padding-left: 5px;
}

.navbar .navbar-nav>li:last-child>a i {
    padding-right: 5px;
    padding-left: 0;
}

.navbar .navbar-nav>li.login-btn>a {
    background: #29b2fe;
    color: #f6f6f6 !important;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/*********** 5.2 Version 2 - Logo Top *************/

.header2 nav {
    padding: 20px 0;
}

.header2 a.navbar-brand {
    float: none;
}

.header2 .navbar-brand img {
    margin: 0 auto;
}

.header2 .navbar .navbar-nav {
    display: inline-block;
    float: none;
    vertical-align: top;
}

.header2 .navbar .navbar-collapse {
    text-align: center;
}

/*********** 5.3 Version 3 - Top Bar *************/

.header3 .top-bar {
    background: #f0f0f0;
    padding: 10px 0;
}

.header3 .top-bar span {
    line-height: 40px;
    color: #999;
}

.header3 .top-bar .social-btns li a {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
}

/*********** 5.4 Version 4 - Sticky *************/

header.sticky {
    position: fixed;
    top: 0;
}

/*********** 5.5 Dropdown Menu *************/

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus {
    color: #f6f6f6;
    background: none;
}

.navbar-default .navbar-nav>.open>a:hover {
    color: #29b2fe;
    background: none;
}

#main-nav .navbar-nav .dropdown .dropdown-menu {
    background: #fff none repeat scroll 0 0;
    padding: 10px 0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border-top: solid 3px #29b1fd;
    display: block;
    visibility: hidden;
    min-width: 250px;
    margin-top: 25px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-box-shadow: 0px 0px 15px 5px rgba(30, 31, 33, 0.15);
    -moz-box-shadow: 0px 0px 15px 5px rgba(30, 31, 33, 0.15);
    box-shadow: 0px 0px 15px 5px rgba(30, 31, 33, 0.15);
    z-index: 99;
    opacity: 0;
}

#main-nav .navbar-nav .dropdown.open .dropdown-menu {
    margin-top: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    visibility: visible;
}

#main-nav .navbar-nav .open>.dropdown-menu {
    opacity: 1;
}

#main-nav .navbar-nav .open a {
    color: #29b1fd;
}

#main-nav .navbar-nav .dropdown-menu>li>a {
    font-family: "Varela Round", sans-serif;
    padding: 5px 20px;
    font-weight: 600;
    color: #666;
    text-transform: capitalize;
}

#main-nav .navbar-nav .dropdown-menu>li>a:focus,
#main-nav .navbar-nav .dropdown-menu>li>a:hover {
    background: none;
    color: #29b1df;
}

#main-nav .navbar-nav .dropdown-menu>li>a i {
    position: absolute;
    right: 15px;
}

/*********** 5.5.1 Simple Menu *************/

#main-nav .navbar-nav .simple-menu .dropdown-menu {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    min-width: 220px;
    max-width: 250px;
    left: 50%;
}

#main-nav .navbar-nav .simple-menu.open .dropdown-menu {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

/*********** 5.5.2 Dropdown Submenu *************/

#main-nav .navbar-nav .simple-menu .dropdown-menu>.dropdown-submenu {
    position: relative;
}

#main-nav .navbar-nav .dropdown-menu>.dropdown-submenu>.dropdown-menu {
    top: -13px;
    left: 130%;
    visibility: hidden;
    -webkit-transition: all 0s ease;
    -moz-transition: all 0s ease;
    -ms-transition: all 0s ease;
    -o-transition: all 0s ease;
    transition: all 0s ease;
}

#main-nav .navbar-nav .dropdown-menu>.dropdown-submenu.open>.dropdown-menu {
    left: 150%;
    visibility: visible;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#main-nav .navbar-nav .dropdown-menu>.dropdown-submenu>.dropdown-menu.left {
    left: -30%;
}

#main-nav .navbar-nav .dropdown-menu>.dropdown-submenu.open>.dropdown-menu.left {
    left: -50%;
}

/*********** 5.5.3 Mega Menu *************/

#main-nav .navbar-nav .mega-menu {
    position: static !important;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu {
    width: 80%;
    padding: 10px 0;
}

#main-nav .navbar-nav .mega-menu.open .dropdown-menu {}

#main-nav .navbar-nav .mega-menu .dropdown-menu li {
    padding: 0 20px;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner {
    padding: 10px 5px;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner ul li {
    font-family: "Varela Round", sans-serif;
    padding: 5px 0;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner ul li:first-child {
    border-bottom: 1px solid #ddd;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner ul li.menu-title {
    color: #333;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner ul li a {
    color: #666;
    text-transform: capitalize;
    font-weight: 600;
}

#main-nav .navbar-nav .mega-menu .dropdown-menu .mega-menu-inner ul li a:hover {
    color: #29b1fd;
}

/*********** 5.5.4 Login Pop Up *************/

.cd-user-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.65);
    z-index: 1039;
    overflow-y: auto;
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: 0.5s ease;
    -moz-transition: 0.5s ease;
    -ms-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}

.cd-user-modal.is-visible {
    visibility: visible;
    opacity: 1;
}

.cd-user-modal.is-visible .cd-user-modal-container {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.cd-user-modal-container {
    position: relative;
    width: 90%;
    max-width: 600px;
    background: #fff;
    margin: 10% auto 0;
    cursor: auto;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transform: translateY(-70px);
    -moz-transform: translateY(-70px);
    -ms-transform: translateY(-70px);
    -o-transform: translateY(-70px);
    transform: translateY(-70px);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -ms-transition-property: -moz-transform;
    -o-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    -ms-transition-duration: 0.8s;
    -o-transition-duration: 0.8s;
    transition-duration: 0.8s;
}

.cd-user-modal-container .cd-switcher {
    list-style: none;
    padding: 0;
}

.cd-user-modal-container .cd-switcher:after {
    content: "";
    display: table;
    clear: both;
}

.cd-user-modal-container .cd-switcher li {
    width: 50%;
    float: left;
    text-align: center;
}

.cd-user-modal-container .cd-switcher a {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    font-weight: 600;
    background: #29b2fe;
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
    text-decoration: none;
    -webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    -ms-transition: 0.3s ease;
    -o-transition: 0.3s ease;
    transition: 0.3s ease;
}

.cd-user-modal-container .cd-switcher a:hover {
    background: #443088;
}

.cd-user-modal-container .cd-switcher a.selected {
    background: #fff;
    color: #323232;
}

@media only screen and (min-width: 600px) {
    .cd-user-modal-container .cd-switcher a {
        height: 70px;
        line-height: 70px;
    }
}

.cd-form {
    padding: 1.4em;
}

.cd-form .fieldset {
    position: relative;
    margin: 1.4em 0;
}

.cd-form .fieldset:first-child {
    margin-top: 0;
}

.cd-form .fieldset:last-child {
    margin-bottom: 0;
}

.cd-form label {
    font-size: 14px;
    color: #444;
    font-weight: 400;
}

.cd-form label.image-replace {
    display: inline-block;
    position: absolute;
    left: 15px;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 20px;
    width: 20px;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    color: transparent;
    text-shadow: none;
    background-repeat: no-repeat;
    background-position: 50% 0;
}

.cd-form label.cd-username {}

.cd-form label.cd-email {}

.cd-form label.cd-password {}

.cd-form input {
    margin: 0;
    padding: 0;
    border-radius: 0.25em;
}

.cd-form input.full-width {
    width: 100%;
}

.cd-form input.has-padding {
    padding: 12px 20px 12px 20px;
}

.cd-form input.has-border {
    border: 1px solid #d2d8d8;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.cd-form input.has-border:focus {
    border-color: #29b2fe;
    outline: none;
}

.cd-form input.has-error {
    border: 1px solid #d76666;
}

.cd-form input[type="password"] {
    /* space left for the HIDE button */
    padding-right: 65px;
}

.cd-form #remember-me {
    border: medium none;
    cursor: pointer;
    position: relative;
}

.cd-form #remember-me:checked {
    background: #29b2fe;
    color: #f6f6f6;
}

.cd-form input[type="submit"]:hover {
    background: #5bbc2e;
}

form.cd-form button {
    background: none;
    display: block;
    margin: 0 auto;
    color: #323232;
}

@media only screen and (min-width: 600px) {
    .cd-form {
        padding: 2em;
    }

    .cd-form .fieldset:first-child {
        margin-top: 0;
    }

    .cd-form .fieldset:last-child {
        margin-bottom: 0;
    }

    .cd-form input.has-padding {
        padding: 16px 20px 16px 20px;
    }

    .cd-form input[type="submit"] {
        padding: 16px 0;
    }
}

.cd-form-message {
    padding: 10px 15px 0;
    font-size: 16px;
    line-height: 1.4;
    text-align: justify;
}

.cd-form-bottom-message {
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 16px;
    margin-top: 10px;
}

.cd-form-bottom-message a {
    color: #fff;
    text-decoration: none;
}

.cd-form-bottom-message a:hover {
    text-decoration: none;
    color: #ff9900;
}

#cd-login,
#cd-signup,
#cd-reset-password {
    display: none;
}

#cd-login.is-selected,
#cd-signup.is-selected,
#cd-reset-password.is-selected {
    display: block;
}

/* --------------------------------------
    6. Footers
-------------------------------------- */

/********************** 6.1 Footer Version 1 - Default ************************/

footer {
    position: relative;
}

footer .footer-info {
    position: relative;

    background-size: cover;
}

footer .footer-info:before {
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

footer .footer-info>div {
    position: relative;
    z-index: 3;
}

footer .footer-info h3 {
    color: #f6f6f6;
    text-transform: capitalize;
    padding-bottom: 40px;
}

footer .footer-info p,
footer .footer-info a,
footer .footer-info ul li,
footer .footer-info span {
    font-size: 14px;
    line-height: 22px;
    color: #999;
}

/* About Column */

footer .footer-info .footer-about {
    font-size: 14px;
}

footer .footer-info .footer-about img {
    height: 33px;
}

footer .footer-info .footer-about ul li {
    padding: 20px 0;
    border-bottom: 1px solid rgba(153, 153, 153, 0.2);
}

footer .footer-info .footer-about ul li:last-child {
    padding-bottom: 0;
    border: 0;
}

footer .footer-info .footer-about ul li i {
    padding: 0 15px;
}

/* Useful links Column */

footer .footer-info .footer-links ul li {
    padding-bottom: 10px;
}

footer .footer-info .footer-links ul li:last-child {
    padding-bottom: 0;
}

footer .footer-info .footer-links a {
    text-transform: capitalize;
}

footer .footer-info .footer-links a:hover {
    color: #29b1fd;
    padding-left: 10px;
}

footer .footer-info .footer-links a i {
    padding-right: 10px;
}

/* Popular Posts Column */

footer .footer-info .footer-posts .footer-blog-post {
    clear: both;
}

footer .footer-info .footer-posts .thumbnail-post {
    width: 80px;
    height: 80px;
    overflow: hidden;
    position: relative;
    float: left;
    margin-right: 20px;
    margin-bottom: 30px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

footer .footer-info .footer-posts .thumbnail-post img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

footer .footer-info .footer-posts .thumbnail-post img:hover {
    opacity: 0.5;
}

footer .footer-info .footer-posts .post-info {
    padding-top: 15px;
    float: left;
}

footer .footer-info .footer-posts .post-info a {
    text-transform: capitalize;
    font-weight: 600;
    color: #f6f6f6;
    display: block;
}

footer .footer-info .footer-posts .post-info a:hover {
    color: #29b2fe;
}

footer .footer-info .footer-posts .post-info span {
    font-style: italic;
}

/* Newsletter Column */

footer .footer-info .footer-newsletter .form-group,
footer .footer-info .footer-newsletter .form-group .input-group {
    width: 100%;
}

footer .footer-info .footer-newsletter input.form-control {
    width: 70%;
    height: 40px;
    background: rgba(237, 237, 237, 0.3);
    border: 0;
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    color: #999;
    padding-left: 20px;
    box-shadow: none;
}

footer .footer-info .footer-newsletter button {
    width: 30%;
    height: 40px;
    line-height: 40px;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    padding: 0;
}

form.mailchimp label {
    position: fixed;
    left: 0;
    bottom: -50px;
    width: 100%;
    color: #f6f6f6;
    text-align: center;
    padding: 15px 0;
    margin: 0;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
    -webkit-transform: translateZ(0);
}

form.mailchimp label.valid,
form.mailchimp label.error {
    bottom: 0;
    opacity: 1;
    visibility: visible;
}

form.mailchimp label.valid {
    background: #2ecc71;
}

form.mailchimp label.error {
    background: #dc464a;
}

/* Live Chat */

footer .footer-info .footer-newsletter .footer-chat {
    background: #29b1fd;
    padding: 20px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

footer .footer-info .footer-newsletter .footer-chat>div {
    padding: 0;
}

footer .footer-info .footer-newsletter .supporter-image {
    width: 70px;
    height: 70px;
    margin: 0 auto;
    display: block;
}

footer .footer-info .footer-newsletter .supporter-image img {
    width: 100%;
}

footer .footer-info .footer-newsletter .chat-details {
    padding-left: 15px;
}

footer .footer-info .footer-newsletter .chat-details span {
    color: #f6f6f6;
    font-weight: 600;
}

footer .footer-info .footer-newsletter .chat-details p {
    color: #f6f6f6;
}

footer .footer-info .footer-newsletter .chat-details a {
    color: #f6f6f6;
}

footer .footer-info .footer-newsletter .chat-details a:hover {
    text-decoration: underline !important;
}

footer .footer-info .footer-newsletter .chat-details a i {
    padding-right: 10px;
}

/* Copyright Section */

footer .copyright {
    background: #1e1f21;
}

footer .copyright span {
    color: #999;
    line-height: 40px;
}

footer .copyright span,
footer .copyright a {
    font-family: "Varela Round", sans-serif;
    font-weight: 600;
    text-transform: capitalize;
}

footer .copyright .social-btn-roll {
    border: 1px solid transparent;
    background: none;
    color: #999;
}

/********************** 6.2 Footer Version 2 - Light ************************/

.footer2 {
    border-top: 1px solid #e3e3e3;
}

.footer2 .footer-info {
    background: #f0f0f0;
}

.footer2 .footer-info:before {
    display: none;
}

.footer2 .footer-info p,
.footer2 .footer-info a,
.footer2 .footer-info ul li,
.footer2 .footer-info span {
    color: #666;
}

.footer2 .footer-info h3 {
    color: #666;
}

.footer2 .footer-info .footer-posts .post-info a {
    color: #323232;
}

.footer2 .footer-info .footer-posts .post-info a:hover {
    color: #29b1fd;
}

.footer2 .footer-info .footer-newsletter input.form-control {
    background: #fff;
}

/* Copyright */

.footer2 .copyright {
    background: #f0f0f0;
    border-top: 1px solid #e3e3e3;
}

/********************** 6.3 Footer Version 3 - Dark ************************/

.footer3 .footer-info {
    background: #1e1f21;
}

.footer3 .footer-info:before {
    display: none;
}

/* Copyright */

.footer3 .copyright {
    border-top: 1px solid #323232;
}

/********************** 6.3 Footer Version 4 - Simple ************************/

.footer4 .footer-info .footer-contact ul li {
    padding: 20px 0;
    border-bottom: 1px solid rgba(153, 153, 153, 0.2);
}

.footer4 .footer-info .footer-contact ul li:first-child {
    padding-top: 0;
}

.footer4 .footer-info .footer-contact ul li:last-child {
    padding-bottom: 0;
    border: 0;
}

.footer4 .footer-info .footer-contact ul li i {
    padding: 0 15px;
}

/* ----------------------------------------------------------------------------
    7. SECTIONS
---------------------------------------------------------------------------- */

/********************** 7.1 Main - Job Search Section ************************/

/*** ====== 7.1.1 Version 1 ====== ***/

section.main {
    background: url("../images/img/image1.jpg") no-repeat;
    background-size: cover;
    background-position: center center;
    height: 500px;
}

section.main .wrapper {
    position: relative;
    z-index: 3;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

section.main .wrapper h1 {
    font-size: 55px;
}

.job-search-form {}

.job-search-form label {
    display: none;
}

.job-search-form input {
    height: 50px;
    width: 100%;
    border: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding-left: 30px;
    font-size: 18px;
    color: #999;
}

.job-search-form .search-location:before {
    content: "\f276";
    font-family: "fontawesome";
    font-size: 22px;
    position: absolute;
    right: 30px;
    color: #999;
    line-height: 50px;
}

.job-search-form .search-submit button {
    width: 100%;
    margin: 0;
}

.job-search-form .search-submit button i {
    margin-right: 7px;
}

.extra-info span {
    font-size: 18px;
}

.extra-info a {
    font-size: 18px;
}

/*** ====== 7.1.2 Version 2 - Slider ====== ***/

section.main2 {
    height: 500px;
}

.swiper-container {
    height: 100%;
}

.slider-content {
    position: relative;
    top: 50%;
    z-index: 15;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

/*** ====== 7.1.3 Version 3 ====== ***/

section.main3 {
    background: url(../images/img/image3.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

section.main3>div {
    position: relative;
    z-index: 4;
}

section.main3 .job-search-form {
    background: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
}

section.main3 .job-search-form .form-title {
    padding: 15px 0;
    margin-bottom: 30px;
    background: #f0f0f0;
    text-align: center;
}

section.main3 .job-search-form .form-title h4 {
    text-transform: uppercase;
    color: #666;
}

section.main3 .job-search-form .search-keywords input,
section.main3 .job-search-form .search-categories .bootstrap-select button,
section.main3 .job-search-form .search-location input {
    border: 1px solid #e3e3e3;
    box-shadow: none !important;
    -webkit-appearance: none;
}

section.main3 .job-search-form .search-keywords,
section.main3 .job-search-form .search-categories,
section.main3 .job-search-form .search-location,
section.main3 .job-search-form .search-submit {
    padding: 0 30px;
}

section.main3 .job-search-form .search-location:before {
    right: 40px;
}

/* ---- Previous & Next Slider buttons ---- */

.swiper-button-next,
.swiper-button-prev {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: rgba(30, 31, 33, 0.3);
    text-align: center;
}

.swiper-container .swiper-button-prev i,
.swiper-container .swiper-button-next i {
    font-size: 30px;
    color: #f6f6f6;
    line-height: 45px;
}

/********************** 7.2 Popular Categories Section ************************/

/*** ====== 7.2.1 Version 1 ====== ***/

section#categories {}

section#categories .category {
    position: relative;
    text-align: center;
    background: #f0f0f0;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    height: 250px;
}

section#categories .category h4 {
    text-transform: capitalize;
}

section#categories .category span {
    font-style: italic;
}

section#categories .category .category-icon {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section#categories .category .category-icon i {
    width: 100%;
    font-size: 100px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section#categories .category .category-info {
    position: relative;
    top: 0;
    -webkit-transition: all 0.6s ease 0s;
    -moz-transition: all 0.6s ease 0s;
    -ms-transition: all 0.6s ease 0s;
    -o-transition: all 0.6s ease 0s;
    transition: all 0.6s ease 0s;
}

section#categories .category .category-info a {
    font-family: "Varela Round", sans-serif;
    font-size: 30px;
    color: #2e2e2e;
    text-transform: capitalize;
}

section#categories .category .category-info p {
    opacity: 1;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

section#categories .category .category-descr {
    position: absolute;
    top: 35%;
    opacity: 0;
    padding: 10px 30px;
    visibility: hidden;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

/***** Hover Effects *****/

section#categories .category:hover .category-icon {
    -webkit-transform: translateY(-60px);
    -moz-transform: translateY(-60px);
    -ms-transform: translateY(-60px);
    -o-transform: translateY(-60px);
    transform: translateY(-60px);
}

section#categories .category:hover .category-icon i {
    font-size: 32px;
}

section#categories .category:hover .category-icon i:before {
    position: absolute;
    width: 100%;
    text-align: center;
    left: 0;
    line-height: 60px;
}

section#categories .category:hover .category-icon i:after {
    content: "";
    display: block;
    width: 60px;
    height: 60px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

section#categories .category:hover .category-info {
    top: -45%;
}

section#categories .category:hover .category-info a {
    color: #29b2fe;
}

section#categories .category:hover p {
    opacity: 0;
}

section#categories .category:hover .category-descr {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.6s ease 0.2s;
    -moz-transition: all 0.6s ease 0.2s;
    -ms-transition: all 0.6s ease 0.2s;
    -o-transition: all 0.6s ease 0.2s;
    transition: all 0.6s ease 0.2s;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

/*** ====== 7.2.2 Version 2 ====== ***/

section#categories2 .cat-wrapper ul {
    background: #f0f0f0;
    border: 1px solid #e3e3e3;
    padding: 0;
}

section#categories2 .cat-wrapper ul li {
    position: relative;
    padding: 10px 0 10px 30px;
    border-bottom: 1px solid #e3e3e3;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

section#categories2 .cat-wrapper ul li:last-child {
    border-bottom: 0;
}

section#categories2 .cat-wrapper ul li:hover {
    background: #e3e3e3;
}

section#categories2 .cat-wrapper ul li:before {
    content: "\f105";
    font-family: "fontawesome";
    font-size: 18px;
    display: block;
    position: absolute;
    top: 50%;
    right: 30px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

section#categories2 .cat-wrapper ul li a {
    text-transform: capitalize;
}

section#categories2 .cat-wrapper ul li span {
    color: #999;
}

/*** ====== 7.2.3 Version 3 ====== ***/

section#categories3 {
    background: #f0f0f0;
}

section#categories3 .category {
    position: relative;
    text-align: center;
    height: 250px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section#categories3 .category:hover {
    background: #fff;
}

section#categories3 .category .category-icon {
    width: 90px;
    height: 90px;
    margin: 0 auto;
}

section#categories3 .category .category-icon img {
    height: 100%;
}

section#categories3 .category .category-info a {
    font-family: "Varela Round", sans-serif;
    font-size: 30px;
    color: #2e2e2e;
    text-transform: capitalize;
}

section#categories3 .category .category-info a:hover {
    color: #29b2fe;
}

/********************** 7.3 Signup & Video Section ************************/

section#signup-video {
    overflow: hidden;
}

/**** Signup Column ***/

section#signup-video .signup-sec {
    background: #29b2fe;
}

section#signup-video .signup-sec h2:after {
    background: #fff;
}

section#signup-video .signup-sec img.signup-arrow {
    position: absolute;
    width: 65px;
    right: 15%;
    bottom: 10px;
}

section#signup-video .signup-sec img.signup-icon {
    position: absolute;
    width: 300px;
    left: -10%;
    bottom: -20%;
}

/**** Video Column ***/

section#signup-video .video-sec {
    background-size: cover;
    background-position: center center;
}

section#signup-video .video-sec a {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
    width: 100px;
    height: 100px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    display: block;
    background: transparent;
    border: 7px solid #fff;
    margin: 0 auto;
    text-align: center;
    z-index: 5;
    opacity: 0.6;
}

section#signup-video .video-sec a:hover {
    -webkit-transform: translateY(-50%) scale(0.85);
    -moz-transform: translateY(-50%) scale(0.85);
    -ms-transform: translateY(-50%) scale(0.85);
    -o-transform: translateY(-50%) scale(0.85);
    transform: translateY(-50%) scale(0.85);
    background: rgba(255, 255, 255, 0.2);
    opacity: 0.8;
}

section#signup-video .video-sec a:hover:before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0;
    animation: playButton 0.8s linear;
}

section#signup-video .video-sec a:hover:after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    border: 1px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0;
    animation: playButton 0.8s linear 0.4s;
}

/* Play button animation */

@keyframes playButton {
    50% {
        opacity: 0.6;
    }

    100% {
        -webkit-transform: scale(2.5);
        -moz-transform: scale(2.5);
        -o-transform: scale(2.5);
        -ms-transform: scale(2.5);
        transform: scale(2.5);
        opacity: 0;
    }
}

section#signup-video .video-sec a i {
    font-size: 42px;
    width: 100%;
    text-align: center;
    line-height: 85px;
    color: #fff;
}

/********************** 7.4 Job Post Section ************************/

section#job-post {}

.job-post-main h2 i,
.job-post-sidebar h2 i {
    padding-right: 10px;
}

.job-post-wrapper .single-job-post {
    background: #fff;
    border-top: 1px solid #e3e3e3;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    padding: 30px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.job-post-wrapper .single-job-post:first-child {
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

.job-post-wrapper .single-job-post:last-child {
    border-bottom: 1px solid #e3e3e3;
    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}

.job-post-wrapper .single-job-post:hover {
    background: #f6f6f6;
}

.job-post-wrapper .single-job-post .job-company {
    width: 85px;
    height: 85px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #f0f0f0;
    padding: 20px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.job-post-wrapper .single-job-post .job-company:hover {
    padding: 15px;
}

.job-post-wrapper .single-job-post .job-title,
.job-post-wrapper .single-job-post .job-info {
    padding-left: 20px;
}

.job-post-wrapper .single-job-post .job-title a {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "Varela Round", sans-serif;
    color: #333;
}

.job-post-wrapper .single-job-post .job-title a:hover {
    color: #29b2fe;
}

.job-post-wrapper .single-job-post .job-info {
    color: #666;
    text-transform: capitalize;
}

.job-post-wrapper .single-job-post .job-info i {
    padding-right: 5px;
}

.job-post-wrapper .single-job-post .job-info span.location {
    margin-left: 5px;
}

.job-post-wrapper .single-job-post .job-category {
    float: right;
}

/* Pagination */

ul.pagination {
    display: block;
    padding: 0;
    margin: 50px 0 0 0;
    margin-bottom: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

ul.pagination li a {
    font-size: 16px;
    color: #f6f6f6;
    background: #29b1fd;
    border: 2px solid #29b1fd;
    padding: 7px 14px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    float: none;
}

ul.pagination li a:hover,
ul.pagination li a:focus {
    background: none;
    color: #29b1fd;
    border-color: #29b1fd;
}

ul.pagination li.active a {
    background: none;
    border: 2px solid #29b1fd;
    color: #29b1fd;
}

ul.pagination li.active a:hover,
ul.pagination li.active a:focus {
    background: none;
    color: #29b1fd;
    border-color: #29b1fd;
}

/* Golden Jobs Sidebar */

.widget {
    border: 1px solid #e3e3e3;
}

.featured-job.widget {
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

.featured-job .company {
    background: #f0f0f0;
    padding: 70px 0;
    border-bottom: 1px solid #e3e3e3;
}

.featured-job .company img {
    width: 85%;
    margin: 0 auto;
    display: block;
}

.featured-job-info {
    padding: 30px 20px;
}

.featured-job-info .job-title {
    overflow: hidden;
}

.featured-job-info .job-title h5 {
    line-height: 27px;
}

.featured-job-info .job-info {
    color: #666;
    text-transform: capitalize;
}

.featured-job-info .job-info i {
    padding-right: 5px;
}

.featured-job-info .job-info span#location {
    margin-left: 5px;
}

.upload-resume {
    padding: 30px 20px;
    background: #f0f0f0;
}

.upload-resume p {
    color: #999;
}

/********************** 7.5 Count Up Section ************************/

section#countup {
    background: #f0f0f0;
    text-align: center;
}

section#countup .counter {
    font-family: "Varela Round", sans-serif;
    font-size: 50px;
    color: #29b1fd;
}

section#countup h4 {
    text-transform: uppercase;
}

/********************** 7.6 Testimonial Section ************************/

section#testimonials {
    background: url(../images/img/testimonial-bg.jpg) no-repeat;
    background-size: cover;
}

section#testimonials .section-title h2:after {
    background: #fff;
}

.testimonial .owl-stage-outer {
    padding-top: 25px;
}

.testimonial .owl-item {
    -webkit-transform: scale(0.7);
    -moz-transform: scale(0.7);
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    transform: scale(0.7);
    opacity: 0.5;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.testimonial .owl-item.active.center {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    opacity: 1;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

.testimonial .owl-item .item {
    text-align: center;
    color: #f6f6f6;
}

.testimonial .owl-item .item .review {
    position: relative;
    background: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.testimonial .owl-item .item .review:before {
    content: "\f10e";
    font-family: "fontawesome";
    font-size: 24px;
    position: absolute;
    width: 50px;
    height: 50px;
    top: -25px;
    left: 25px;
    background: #29b1fd;
    border: 2px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    line-height: 50px;
}

.testimonial .owl-item .item .review:after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #fff transparent transparent transparent;
}

.testimonial .owl-item .item .review blockquote {
    border: 0;
    font-style: italic;
    color: #666;
    padding: 40px;
}

.testimonial .owl-item .item .customer {
    margin-top: 40px;
}

.testimonial .owl-item .item .customer img {
    width: 100px;
    height: auto;
    border: 3px solid #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin: 0 auto;
}

/********************** 7.7 Latest News Section ************************/

/*** ====== 7.7.1 Version 1 ====== ***/

section#latest-news {}

section#latest-news .blog-post {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
}

section#latest-news .blog-post .blog-post-thumbnail {
    height: 240px;
    width: 100%;
    overflow: hidden;
    position: relative;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

section#latest-news .blog-post .blog-post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

section#latest-news .blog-post .blog-post-thumbnail:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

section#latest-news .blog-post .post-info {
    position: relative;
    background: #f0f0f0;
    padding: 20px;
}

section#latest-news .blog-post .post-info:before {
    content: "";
    position: absolute;
    top: -25px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 174px 20px 174px;
    border-color: transparent transparent #f0f0f0 transparent;
    z-index: 5;
    -webkit-transition: all 0.4s linear;
    -moz-transition: all 0.4s linear;
    -ms-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

section#latest-news .blog-post:hover .post-info:before {
    content: "";
    position: absolute;
    top: 0;
    border-width: 0 174px 0 174px;
}

section#latest-news .blog-post .post-info:after {
    content: "";
    position: absolute;
    top: -5px;
    left: 0;
    width: 100%;
    height: 5px;
    background: #f0f0f0;
    z-index: 4;
}

section#latest-news .blog-post .post-info a {
    font-family: "Varela Round", sans-serif;
    color: #333;
    font-size: 18px;
    font-weight: 600;
}

section#latest-news .blog-post .post-info a:hover {
    color: #29b1fd;
}

section#latest-news .blog-post .post-info .post-details {
    color: #999;
}

section#latest-news .blog-post .post-info .post-details .date:after {
    content: "|";
    padding: 0 10px;
}

section#latest-news .blog-post .post-info .post-details span i {
    padding-right: 5px;
}

section#latest-news .blog-post .post-info p {
    margin-top: 15px;
    margin-bottom: 0;
    color: #666;
    font-size: 14px;
    line-height: 22px;
}

section#latest-news .blog-post>a.btn {
    position: absolute;
    bottom: -13px;
    right: 30px;
}

/*** ====== 7.7.2 Version 2 ====== ***/

section#latest-news .blog-post-ver2 .post-info {
    padding: 40px 20px;
    text-align: center;
}

section#latest-news .blog-post-ver2 .post-info:before,
section#latest-news .blog-post-ver2 .post-info:after {
    display: none;
}

/*** ====== 7.7.3 Version 3 ====== ***/

section#latest-news2 .blog-post {
    height: 300px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    position: relative;
    padding: 0;
    overflow: hidden;
}

section#latest-news2 .blog-post .post-info {
    width: 100%;
    position: absolute;
    bottom: -20px;
    z-index: 1;
    padding: 0 40px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0.9;
}

section#latest-news2 .blog-post:hover .post-info {
    bottom: 20px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

section#latest-news2 .blog-post .post-info a.blog-post-link {
    color: #f6f6f6;
    display: block;
}

section#latest-news2 .blog-post .post-info span {
    font-size: 14px;
    color: #f6f6f6;
    opacity: 0.9;
}

section#latest-news2 .blog-post img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

section#latest-news2 .blog-post:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -ms-filter: blur(4px);
    -o-filter: blur(4px);
    filter: blur(4px);
    opacity: 0.4;
}

/* Featured Blog Post */

section#latest-news2 .blog-post-featured {
    height: 640px;
    max-height: 640px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    position: relative;
    padding: 0;
    overflow: hidden;
}

section#latest-news2 .blog-post-featured span.featured {
    position: absolute;
    z-index: 1;
    box-shadow: none;
    top: 30px;
    right: 50px;
    color: #f6f6f6;
    background: #29b1fd;
}

section#latest-news2 .blog-post-featured .post-info {
    width: 100%;
    position: absolute;
    bottom: -20px;
    z-index: 1;
    padding: 0 40px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -ms-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    -o-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0.9;
}

section#latest-news2 .blog-post-featured:hover .post-info {
    bottom: 20px;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

section#latest-news2 .blog-post-featured .post-info a.blog-post-link {
    color: #f6f6f6;
    display: block;
}

section#latest-news2 .blog-post-featured .post-info span {
    font-size: 14px;
    color: #f6f6f6;
    opacity: 0.9;
}

section#latest-news2 .blog-post-featured img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section#latest-news2 .blog-post-featured:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -ms-filter: blur(4px);
    -o-filter: blur(4px);
    filter: blur(4px);
    opacity: 0.4;
}

/********************** 7.8 Partners Section ************************/

section#partners {
    background-color: #f0f0f0;
}

#partners .owl-item {
    min-height: 30px;
}

#partners img {
    width: 130px;
    opacity: 0.5;
    -webkit-transition: all 0.9s ease;
    -moz-transition: all 0.9s ease;
    -ms-transition: all 0.9s ease;
    -o-transition: all 0.9s ease;
    transition: all 0.9s ease;
    margin: 0 auto;
    display: block;
}

#partners img:hover {
    opacity: 1;
}

/********************** 7.9 Get Started Section ************************/

section.get-started {
    background-blend-mode: overlay;
    background: url(../images/img/get-started-bg.png) no-repeat,
        -moz-linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background: url(../images/img/get-started-bg.png) no-repeat,
        -webkit-linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background: url(../images/img/get-started-bg.png) no-repeat,
        linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background-position: center center;
    background-size: cover;
}

/********************** 7.10 Cariera App Section ************************/

section.cariera-app {
    background-attachment: fixed;
    background-blend-mode: overlay;
    background: url(../images/img/app-bg.png) #29b1fd;
    background-size: cover;
    background-repeat: no-repeat;
}

section.cariera-app ul li i {
    padding-right: 10px;
}

section.cariera-app .app-wrapper {
    height: 300px;
}

section.cariera-app .app-wrapper img {
    width: 60%;
    display: block;
    margin: 0 auto;
    position: relative;
    bottom: -10px;
}

/********************** 7.11 Job Search Section ************************/

section.job-search {
    background: #f0f0f0;
}

/* --------------------------------------
    8. Pages
-------------------------------------- */

/********************** 8.1 Search Jobs Page ************************/

section.search-jobs .job-search-form input {
    font-size: 14px;
    border: 1px solid #e3e3e3;
    height: auto;
}

section.search-jobs .job-search-form .search-categories .btn-group.bootstrap-select button {
    font-size: 14px;
    height: 42px;
    border: 1px solid #e3e3e3;
}

section.search-jobs .job-search-form .search-categories .btn-group.bootstrap-select button:hover {
    font-size: 14px;
}

section.search-jobs .job-search-form .search-location:before {
    font-size: 18px;
    line-height: 42px;
}

section.search-jobs .job-search-form .search-submit button {
    height: 42px;
    line-height: 42px;
}

/*** ====== 8.1.1 Version 2 ====== ***/

/* Job Post Sidebar */

section#version2.search-jobs .job-post-sidebar .search-location:before {
    content: "\f276";
    font-family: "fontawesome";
    font-size: 18px;
    position: absolute;
    right: 30px;
    color: #999;
    line-height: 42px;
}

section#version2.search-jobs .job-post-sidebar .job-types ul {
    padding: 0 5px;
}

section#version2.search-jobs .job-post-sidebar .job-types ul li {
    padding: 5px 0;
    width: 49%;
}

section#version2.search-jobs .job-post-sidebar .job-types ul li label {
    font-weight: 400;
    padding-left: 30px;
}

section#version2.search-jobs .job-post-sidebar .job-categories .btn-group.bootstrap-select button {
    font-size: 14px;
    height: 42px;
    border: 1px solid #e3e3e3;
}

section#version2.search-jobs .job-post-sidebar .job-categories .btn-group.bootstrap-select button:hover {
    font-size: 14px;
}

/*** ====== 8.1.2 Version 3 ====== ***/

section#version3.search-jobs {
    background: #f0f0f0;
}

section#version3.search-jobs .job-post-wrapper .single-job-post {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#version3.search-jobs .job-post-wrapper .single-job-post:hover {
    background: #fff;
}

/*** ====== 8.1.3 Version 4 ====== ***/

section#version4.search-jobs {
    background: #cfeae1;
}

section#version4.search-jobs .item-block {
    background: #fff;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#version4.search-jobs .item-block .job-post-header {
    padding: 20px;
    border-bottom: 1px solid #e3e3e3;
}

section#version4.search-jobs .item-block .job-post-header a {
    color: #323232;
}

section#version4.search-jobs .item-block .job-post-header a:hover {
    color: #29b1fd;
}

section#version4.search-jobs .item-block .job-post-header img {
    width: 64px;
    margin-right: 30px;
    float: left;
}

section#version4.search-jobs .item-block .job-post-header>div {
    display: inline-block;
    padding-top: 10px;
}

section#version4.search-jobs .item-block .job-post-header>ul {
    padding-top: 5px;
    text-align: center;
}

section#version4.search-jobs .item-block .job-post-header>ul li {
    padding: 5px 0;
}

section#version4.search-jobs .item-block .job-post-header .time {
    color: #999;
    font-size: 12px;
    letter-spacing: 0;
}

section#version4.search-jobs .item-block .job-post-body {
    padding: 20px;
}

section#version4.search-jobs .item-block .job-post-footer {
    margin: 0;
    padding: 10px;
    border-top: 1px solid #e3e3e3;
    color: #999;
    text-align: center;
}

section#version4.search-jobs .item-block .job-post-footer i {
    padding-right: 10px;
}

/********************** 8.2 Post Job - Post Resume Page ************************/

.account-question {
    margin-left: 0;
    margin-right: 0;
    margin-top: 20px;
    background: #f0f0f0;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 20px;
}

/* Form */

form.post-job-resume .form-group {
    margin-bottom: 25px;
}

form.post-job-resume label {
    display: block;
    text-transform: capitalize;
    font-size: 16px;
    margin-bottom: 10px;
}

form.post-job-resume label span {
    text-transform: none;
    font-style: italic;
    color: #999;
    padding-left: 5px;
}

form.post-job-resume span.form-msg {
    margin-top: 10px;
    display: block;
    color: #999;
}

form.post-job-resume h3 {
    border-bottom: 1px solid #e3e3e3;
}

form.post-job-resume #last.form-group {
    border-top: 1px solid #e3e3e3;
}

/* BS Select */

form.post-job-resume .form-group .bootstrap-select {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 3px 20px;
}

form.post-job-resume .form-group .bootstrap-select button.dropdown-toggle,
form.post-job-resume .form-group .bootstrap-select button.dropdown-toggle:hover {
    font-size: 14px;
    padding: 0;
    box-shadow: none;
    background: none;
    height: auto;
}

/* Tinymce Editor */

form.post-job-resume .mce-tinymce {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

form.post-job-resume .mce-panel {
    border-color: #e3e3e3;
}

/* Upload Button */

form.post-job-resume .upload-file-btn {
    position: relative;
    overflow: hidden;
    background: #29b1fd;
    color: #f6f6f6;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 700;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-align: center;
    display: inline-block;
}

form.post-job-resume .upload-file-btn input[type="file"] {
    position: absolute;
    width: 100%;
    height: 165%;
    top: -25px;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

/********************** 8.3 Find Candidate Page ************************/

section#find-candidate.page-header {
    background: url(../images/img/candidate-bg.jpg) no-repeat;
    background-size: cover;
}

section.find-candidate form label {
    display: none;
}

section.find-candidate form button {
    height: 42px;
    line-height: 42px;
}

section.find-candidate form button i {
    padding-right: 10px;
}

/* Candidates Main */

section.find-candidate .candidate-wrapper .single-candidate {
    background: #fff;
    border-top: 1px solid #e3e3e3;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    padding: 30px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.find-candidate .candidate-wrapper .single-candidate:first-child {
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

section.find-candidate .candidate-wrapper .single-candidate:last-child {
    border-bottom: 1px solid #e3e3e3;
    -webkit-border-radius: 0 0 5px 5px;
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}

section.find-candidate .candidate-wrapper .single-candidate:hover {
    background: #f6f6f6;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-img {
    width: 85px;
    height: 85px;
    border: 1px solid #e3e3e3;
    overflow: hidden;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-img:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -ms-filter: blur(2px);
    -o-filter: blur(2px);
    filter: blur(2px);
    opacity: 0.4;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-name a {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 600;
    color: #333;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-name a:hover {
    color: #29b2fe;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-info {
    color: #666;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-info i {
    padding-right: 10px;
}

section.find-candidate .candidate-wrapper .single-candidate .candidate-cta {
    float: right;
}

/*** ====== 8.3.1 Version 2 ====== ***/

section#version2.find-candidate {
    background: #cfeae1;
}

section#version2.find-candidate .candidate-wrapper .single-candidate {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#version2.find-candidate .candidate-wrapper .single-candidate:hover {
    background: #fff;
}

/********************** 8.4 About Us Page ************************/

section.about-process {
    background: #f0f0f0;
}

section.about-process .process-icon {
    background: #29b2fe;
    width: 120px;
    height: 120px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin: 0 auto;
    text-align: center;
}

section.about-process .process-icon i {
    font-size: 50px;
    color: #fff;
    line-height: 120px;
}

/********************** 8.5 Contact Us Page ************************/

section#contact {
    background: #f0f0f0;
    position: relative;
}

section#contact p {
    color: #999;
}

form#contact-form textarea {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 20px;
    box-shadow: none;
    max-width: 100%;
    resize: none;
}

form#contact-form textarea:focus {
    box-shadow: none;
}

form#contact-form .form-control::-webkit-input-placeholder {
    color: #999;
}

form#contact-form .form-control:-moz-placeholder {
    color: #999;
}

form#contact-form .form-control::-moz-placeholder {
    color: #999;
}

form#contact-form .form-control:-ms-input-placeholder {
    color: #999;
}

form#contact-form div#contact-result {
    position: fixed;
    left: 0;
    bottom: -50px;
    width: 100%;
    color: #f6f6f6;
    text-align: center;
    padding: 15px 0;
    margin: 0;
    z-index: 15;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
    -webkit-transform: translateZ(0);
}

form#contact-form div#contact-result.valid,
form#contact-form div#contact-result.error {
    bottom: 0;
    opacity: 1;
    visibility: visible;
}

form#contact-form div#contact-result.valid {
    background: #2ecc71;
}

form#contact-form div#contact-result.error {
    background: #dc464a;
}

/* google maps */

#map .gmnoprint {
    display: none;
}

/*********** 8.5.1 Contact Ver. 1 *************/

.gmaps {
    height: 600px;
    padding: 0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.gmaps #map {
    width: 90%;
    height: 100%;
    float: right;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0 5px 20px 0px rgba(0, 0, 0, 0.1);
}

.gmaps .gm-style {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/*********** 8.5.2 Contact Ver. 2 *************/

.gmaps2 {
    height: 400px;
    padding: 0;
}

.gmaps2 #map {
    width: 100%;
    height: 100%;
}

/********************** 8.6 Companies ************************/

section#companies {}

section#companies .company-letters {
    border-bottom: 2px solid #e3e3e3;
    background: #f6f6f6;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#companies .company-letters a {
    font-weight: 700;
    display: inline-block;
    padding: 15px 10px;
    color: #333;
}

section#companies .company-letters a:hover {
    color: #29b2fe;
}

section#companies .company-group {
    margin-bottom: 40px;
}

section#companies .company-group .company-letter {
    font-size: 24px;
    color: #666;
    padding: 0 0 10px 10px;
    border-bottom: 2px solid #e3e3e3;
}

section#companies .company-group li {
    padding: 10px;
}

section#companies .company-group li:hover {
    background: #f0f0f0;
}

section#companies .company-group li a {
    color: #666;
    font-size: 18px;
}

section#companies .company-group li a:hover {
    color: #29b2fe;
}

/********************** 8.7 Company Page ************************/

/*** ====== 8.7.1 Version 1 ====== ***/

section#company-profile .company-profile {
    position: relative;
    margin-top: -150px;
    z-index: 10;
    background: #fff;
    padding: 40px 20px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#company-profile .company-profile .profile-photo {
    background: #f0f0f0;
    border: 1px solid #e3e3e3;
    padding: 60px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
}

section#company-profile .profile-info li {
    display: inline-block;
    width: 33%;
    padding: 5px 0;
    color: #666;
    font-size: 16px;
}

section#company-profile .profile-info li a {
    color: #666;
}

section#company-profile .profile-info li a:hover {
    color: #29b2fe;
}

section#company-profile .profile-info li i {
    padding-right: 10px;
}

/*** ====== 8.7.2 Version 2 ====== ***/

section#company-profile2 .company-profile {
    position: relative;
    margin-top: -120px;
    z-index: 10;
}

section#company-profile2 .company-profile .profile-photo {
    background: #f0f0f0;
    overflow: hidden;
    width: 240px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin: 0 auto;
}

section#company-profile2 .company-profile .profile-photo img {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
}

section#company-profile2 .company-profile .profile-photo:before {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    display: block;
    background: #29b2fe;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: -1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.2;
}

section#company-profile2 .company-profile .profile-photo:after {
    content: "";
    position: absolute;
    top: 0;
    width: 240px;
    height: 240px;
    display: block;
    background: #29b2fe;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: -1;
    transform: scale(1.2);
    opacity: 0.1;
}

section#company-profile2 .profile-info {
    border: 1px solid #e3e3e3;
    padding: 40px;
    background: #f0f0f0;
}

section#company-profile2 .profile-info li {
    padding: 10px 0;
    color: #666;
    font-size: 16px;
}

section#company-profile2 .profile-info li a {
    color: #666;
}

section#company-profile2 .profile-info li a:hover {
    color: #29b2fe;
}

section#company-profile2 .profile-info li i {
    padding-right: 10px;
}

/*** ====== 8.7.3 Latest Jobs ====== ***/

section.company-jobs {
    background: #f0f0f0;
}

section.company-jobs .single-job-post {
    background: #fff;
    border: 1px solid #e3e3e3;
    padding: 30px;
}

section.company-jobs .single-job-post .job-company {
    width: 85px;
    height: 85px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #f0f0f0;
    padding: 20px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.company-jobs .single-job-post .job-company:hover {
    padding: 15px;
}

section.company-jobs .single-job-post .job-title a {
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "Varela Round", sans-serif;
    color: #333;
    line-height: 45px;
}

section.company-jobs .single-job-post .job-title a:hover {
    color: #29b2fe;
}

section.company-jobs .single-job-post .job-category {
    float: right;
}

/********************** 8.8 Candidate Profile Page ************************/

/*** ====== 8.8.1 Version 1 ====== ***/

/* Profile Header */

section.profile-header {
    position: relative;
    height: 300px;
    background: url(../images/img/image2.jpg) no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

section.profile-header:before {
    background: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
}

section.profile-header:after {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    overflow: hidden;
    z-index: 3;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.4;
}

/* Profile */

section#candidate-profile .candidate-profile {
    position: relative;
    margin-top: -150px;
    z-index: 10;
    background: #fff;
    padding: 40px 20px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section#candidate-profile .candidate-profile .profile-photo {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
}

section#candidate-profile .profile-info li {
    display: inline-block;
    width: 33%;
    padding: 5px 0;
    color: #666;
    font-size: 16px;
}

section#candidate-profile .profile-info li a {
    color: #666;
}

section#candidate-profile .profile-info li a:hover {
    color: #29b2fe;
}

section#candidate-profile .profile-info li i {
    padding-right: 10px;
}

/* Skills */

.skillbar {
    position: relative;
    display: block;
    margin-bottom: 25px !important;
    width: 80%;
    margin: 0 auto;
    background: #e3e3e3;
    height: 30px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-transition: 0.4s linear;
    -moz-transition: 0.4s linear;
    -ms-transition: 0.4s linear;
    -o-transition: 0.4s linear;
    transition: 0.4s linear;
    -webkit-transition-property: width, background-color;
    -moz-transition-property: width, background-color;
    -ms-transition-property: width, background-color;
    -o-transition-property: width, background-color;
    transition-property: width, background-color;
}

.skillbar:last-child {
    margin-bottom: 0 !important;
}

.skillbar-title {
    position: absolute;
    top: 0;
    left: 0;
    width: 120px;
    text-align: center;
    font-size: 14px;
    color: #fff;
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    background: #29b2fe;
}

.skillbar-title span {
    display: block;
    background: rgba(0, 0, 0, 0.2);
    padding: 0 20px;
    line-height: 30px;
}

.skillbar-bar {
    height: 30px;
    width: 0px;
    background: -moz-linear-gradient(left, #29b2fe 20%, #443088 140%);
    background: -webkit-linear-gradient(left, #29b2fe 20%, #443088 140%);
    background: linear-gradient(to right, #29b2fe 20%, #443088 140%);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.skill-bar-percent {
    position: absolute;
    right: 10px;
    top: 0;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    color: #666;
}

/* Portfolio */

section.portfolio {
    background: #f0f0f0;
}

/* Filters */

section.portfolio ul#portfolio-sorting li {
    padding: 0 10px;
}

section.portfolio ul#portfolio-sorting li a {
    color: #323232;
    font-weight: 700;
    display: block;
    opacity: 0.8;
    line-height: 30px;
}

section.portfolio ul#portfolio-sorting li a.current {
    color: #29b2fe;
    opacity: 1;
}

/* Portfolio Items */

section.portfolio .portfolio-grid .element {
    margin-bottom: 40px;
    overflow: hidden;
}

section.portfolio .portfolio-grid .element figure {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

section.portfolio .portfolio-grid .element figure img {
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

section.portfolio .portfolio-grid .element:hover figure img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

/* Education */

section.education .item-block {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section.education .item-block .education-header {
    padding: 20px;
    border-bottom: 1px solid #e3e3e3;
}

section.education .item-block .education-header img {
    width: 64px;
    margin-right: 30px;
    float: left;
}

section.education .item-block .education-header>div {
    display: inline-block;
}

section.education .item-block .education-header .time {
    display: inline-block;
    float: right;
    color: #999;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 64px;
    text-align: right;
}

section.education .item-block .education-body {
    padding: 20px;
}

/* Work Experience */

section.work-experience {
    background: #f0f0f0;
}

section.work-experience .item-block {
    background: #fff;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

section.work-experience .item-block .experience-header {
    padding: 20px;
    border-bottom: 1px solid #e3e3e3;
}

section.work-experience .item-block .experience-header img {
    width: 64px;
    margin-right: 30px;
    float: left;
}

section.work-experience .item-block .experience-header>div {
    display: inline-block;
    padding-top: 10px;
}

section.work-experience .item-block .experience-header .time {
    display: inline-block;
    float: right;
    color: #999;
    font-size: 12px;
    letter-spacing: 0;
    line-height: 64px;
    text-align: right;
}

section.work-experience .item-block .experience-body {
    padding: 20px;
}

/*** ====== 8.8.2 Version 3 ====== ***/

/* Profile */

section#candidate-profile2 .candidate-profile {
    position: relative;
    margin-top: -120px;
    z-index: 10;
}

section#candidate-profile2 .candidate-profile .profile-photo {
    overflow: hidden;
    width: 240px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin: 0 auto;
}

section#candidate-profile2 .candidate-profile .profile-photo:before {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    display: block;
    background: #29b2fe;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: -1;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0.2;
}

section#candidate-profile2 .candidate-profile .profile-photo:after {
    content: "";
    position: absolute;
    top: 0;
    width: 240px;
    height: 240px;
    display: block;
    background: #29b2fe;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: -1;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0.1;
}

section#candidate-profile2 .profile-info {
    border: 1px solid #e3e3e3;
    padding: 40px;
    background: #f0f0f0;
}

section#candidate-profile2 .profile-info li {
    padding: 10px 0;
    color: #666;
    font-size: 16px;
}

section#candidate-profile2 .profile-info li a {
    color: #666;
}

section#candidate-profile2 .profile-info li a:hover {
    color: #29b2fe;
}

section#candidate-profile2 .profile-info li i {
    padding-right: 10px;
}

/* Skill Charts */

.chart {
    position: relative;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    color: #666;
    text-align: center;
}

.chart span {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/********************** 8.9 FAQ Page ************************/

.live-search-box {
    padding: 15px;
}

.live-search-box:focus {
    border: 1px solid #29b1fd;
}

.topic {
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    border-bottom: solid 1px #ebebeb;
}

.topic.expanded {
    background-color: #f4f4f4;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.topic .open {
    cursor: pointer;
    display: block;
    padding: 0px;
}

.topic .open:hover .question {
    color: #29b1fd;
}

.topic .question {
    padding: 20px 0;
    color: #323232;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.topic .answer {
    font-size: 16px;
    line-height: 24px;
    display: none;
    margin-bottom: 30px;
    padding-left: 20px;
    padding-right: 20px;
}

.topic i {
    font-size: 18px;
    color: #323232;
    position: absolute;
    top: 20px;
    right: 20px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.topic.expanded i {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-18deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

/********************** 8.10 Job Page ************************/

/* Job Header */

section.job-header {
    background: #f0f0f0;
}

section.job-header h3 {
    text-transform: uppercase;
    color: #666;
}

section.job-header a i {
    padding-right: 10px;
}

/* Job Details */

section#job-page .company-info {
    padding-bottom: 30px;
    border-bottom: 1px solid #e3e3e3;
}

section#job-page .company-info .job-company {
    width: 120px;
    height: 120px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #f0f0f0;
    padding: 30px;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section#job-page .company-info .job-company:hover {
    padding: 20px;
}

section#job-page .company-info .job-company-info ul li a {
    font-size: 16px;
}

section#job-page .company-info .job-company-info ul li a i {
    padding-right: 10px;
}

/* Job Sidebar */

section#job-page .job-sidebar {
    border: 1px solid #e3e3e3;
    padding: 35px;
}

section#job-page .job-overview li {
    padding: 10px 0;
}

section#job-page .job-overview li:first-child {
    padding-top: 0;
}

section#job-page .job-overview li h5 {
    padding-bottom: 10px;
}

section#job-page .job-overview li h5 i {
    font-size: 18px;
    padding-right: 5px;
    color: #29b1fd;
}

/* Map */

section#job-page .gmaps {
    height: 350px;
}

section#job-page .gmaps #map {
    width: 100%;
    height: 100%;
    float: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #e3e3e3;
}

/* Related Jobs */

section#job-page .related-jobs .item {
    background: #f0f0f0;
    padding: 40px 20px;
    text-align: center;
    border-top: 3px solid transparent;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

section#job-page .related-jobs .item:hover {
    border-top: 3px solid #29b1fd;
}

section#job-page .related-jobs .owl-nav.disabled+.owl-dots {
    text-align: center;
    margin-top: 30px;
}

section#job-page .related-jobs .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
}

section#job-page .related-jobs .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #ddd;
    display: block;
    -webkit-backface-visibility: visible;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

section#job-page .related-jobs .owl-dots .owl-dot.active span {
    background: #29b2fe;
}

/********************** 8.11 404 Page ************************/

/*** Version 1 ***/

section#page-not-found {
    background: url(../images/img/404-bg.png) no-repeat;
    background-position: left center;
    text-align: center;
}

section#page-not-found h2 {
    font-size: 120px;
}

/*** Version 2 ***/

section#page-not-found2 {
    text-align: center;
}

section#page-not-found2 h2 {
    font-size: 120px;
}

/********************** 8.12 Coming Soon Page ************************/

.coming-soon {
    width: 100%;
    min-height: 100%;
    background-blend-mode: overlay;
    background: url(../images/img/coming-soon-bg.png) no-repeat,
        -moz-linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background: url(../images/img/coming-soon-bg.png) no-repeat,
        -webkit-linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background: url(../images/img/coming-soon-bg.png) no-repeat,
        linear-gradient(to right, #29b2fe -20%, #443088 120%);
    background-position: left center;
    z-index: 5;
}

.coming-main {
    position: relative;
    z-index: 7;
    padding-top: 100px;
}

.coming-main h2 {
    font-size: 60px;
    text-transform: uppercase;
}

.coming-main .logo img {
    width: 200px;
    margin: 0 auto;
    display: block;
    padding-top: 20px;
}

.coming-main .countdown {
    text-align: center;
}

.coming-main .countdown ul {
    list-style: none;
    margin: 0;
}

.coming-main .countdown li span {
    font-family: "Varela Round", sans-serif;
    color: #f6f6f6;
    font-size: 90px;
}

.coming-main .countdown li p {
    font-family: "Varela Round", sans-serif;
    color: #f6f6f6;
    font-size: 26px;
    font-weight: 300;
    text-transform: capitalize;
}

.coming-main .mailchimp .form-group {
    width: 100%;
    text-align: center;
}

.coming-main .mailchimp .form-group input {
    width: 50%;
}

.coming-main .mailchimp .form-group button {
    height: 42px;
    line-height: 42px;
    margin-left: 10px;
}

.coming-main .cta a:last-child {
    margin-left: 10px;
}

/********************** 8.13 Login - Register Page ************************/

/*** Login ***/

section#login {
    background: #f0f0f0;
}

section#login .login-box {
    position: relative;
    background: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

section#login .login-box .login-title {
    padding: 20px 30px;
    text-align: center;
    text-transform: uppercase;
    background: #29b1fd;
    color: #f6f6f6;
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
}

section#login .login-box .login-title:before {
    content: "";
    width: 100%;
    height: 30px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    position: absolute;
    top: -10px;
    background: #29b1fd;
    left: 0;
    -webkit-transform: scale(0.95);
    -moz-transform: scale(0.95);
    -ms-transform: scale(0.95);
    -o-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0.4;
}

section#login .login-box form {
    padding: 40px;
}

section#login .login-box form .form-group:last-child {
    margin-bottom: 0;
}

section#login .login-box form a {
    color: #333;
    font-weight: 700;
}

section#login .login-box form a:hover {
    color: #29b1fd;
}

/*** Register ***/

section#register {
    background: #f0f0f0;
}

section#register .nav-tabs>li {
    text-align: center;
}

section#register .nav-tabs>li.active>a {
    color: #333;
    border-top: 3px solid #29b2fe;
}

section#register .nav-tabs>li.active>a:hover {
    background: #fff;
    border-top: 3px solid #29b2fe;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #e3e3e3;
}

section#register .nav-tabs>li>a {
    padding: 15px 30px;
    color: #666;
    border-top: 3px solid transparent;
}

section#register .nav-tabs>li>a:hover {
    background: none;
    border: 1px solid transparent;
    border-top: 3px solid transparent;
}

section#register .nav-tabs>li>a:focus {
    color: #333 !important;
}

section#register .tab-content {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-top: 0;
    -webkit-border-radius: 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}

section#register .tab-content .tab-pane {
    padding: 0 40px;
}

/* --------------------------------------
    9. Blog
-------------------------------------- */

/*********** 9.1 Blog Listing *************/

section.blog-listing article.blog-post .blog-thumbnail:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

section.blog-listing article.blog-post .date {
    background: #29b2fe;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    color: #f6f6f6;
    text-align: center;
    padding: 10px 15px;
    line-height: 1;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.blog-listing article.blog-post .blog-thumbnail:hover .date {
    opacity: 0;
}

section.blog-listing article.blog-post .date span.day {
    display: block;
    font-size: 24px;
    font-weight: 700;
}

section.blog-listing article.blog-post .date span.publish-month {
    font-size: 14px;
    text-transform: uppercase;
}

/* Description */

section.blog-listing article.blog-post .blog-desc h5 a {
    font-family: inherit;
    color: #333;
    text-transform: uppercase;
    font-weight: 700;
}

section.blog-listing article.blog-post .blog-desc h5 a:hover {
    color: #29b2fe;
}

section.blog-listing article.blog-post .blog-desc p {
    font-size: 14px;
}

section.blog-listing article.blog-post .blog-desc .post-detail {
    color: #999;
}

section.blog-listing article.blog-post .blog-desc .post-detail span:after {
    content: "|";
    padding: 0 7px;
}

section.blog-listing article.blog-post .blog-desc .post-detail span:last-child:after {
    display: none;
}

section.blog-listing article.blog-post .blog-desc .post-detail span i {
    padding-right: 5px;
}

section.blog-listing .pagination {
    margin-top: 30px;
}

/*********** 9.1.1 Version 1 *************/

section#version1.blog-listing article.blog-post {
    border-top: 0;
    border-right: 0;
    border-bottom: 1px solid #e3e3e3;
    border-left: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    padding-bottom: 40px;
    margin-bottom: 40px;
}

section#version1.blog-listing article.blog-post:last-of-type {
    border-bottom: 0;
    margin-bottom: 0;
}

section#version1.blog-listing article.blog-post .blog-thumbnail {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    padding: 0;
    overflow: hidden;
}

section#version1.blog-listing article.blog-post .blog-thumbnail img {
    max-height: 300px;
    object-fit: cover;
    height: 260px;
    width: 100%;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

/* Description */

section#version1.blog-listing article.blog-post .blog-desc {
    padding-left: 30px;
}

/*********** 9.1.2 Version 2 *************/

section#version2.blog-listing article.blog-post {
    border-top: 0;
    border-right: 0;
    border-bottom: 1px solid #e3e3e3;
    border-left: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    padding-bottom: 40px;
    margin-bottom: 40px;
}

section#version2.blog-listing article.blog-post:last-of-type {
    border-bottom: 0;
    margin-bottom: 0;
}

section#version2.blog-listing article.blog-post .blog-thumbnail {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
    padding: 0;
    overflow: hidden;
}

section#version2.blog-listing article.blog-post .blog-thumbnail img {
    object-fit: cover;
    height: 350px;
    width: 100%;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

section#version2.blog-listing article.blog-post .blog-thumbnail:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

/* Description */

section#version2.blog-listing article.blog-post .blog-desc {
    margin-top: 40px;
}

/*********** 9.2 Blog Sidebar *************/

.blog-sidebar {
    background: #f0f0f0;
    padding: 40px 10px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.blog-sidebar .widget-title {
    text-transform: uppercase;
    font-weight: 600;
}

.blog-sidebar .widget-title:after {
    content: "";
    width: 50px;
    height: 3px;
    background: #29b1fd;
    display: block;
    margin-top: 20px;
    margin-bottom: 40px;
}

/* Popular Posts */

.blog-sidebar .sidebar-blog-post {
    clear: both;
}

.blog-sidebar .sidebar-blog-post .thumbnail-post {
    width: 80px;
    height: 80px;
    overflow: hidden;
    position: relative;
    float: left;
    margin-right: 20px;
    margin-bottom: 30px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

.blog-sidebar .sidebar-blog-post .thumbnail-post img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.blog-sidebar .sidebar-blog-post .thumbnail-post img:hover {
    opacity: 0.5;
}

.blog-sidebar .sidebar-blog-post .post-info {
    padding-top: 15px;
}

.blog-sidebar .sidebar-blog-post .post-info a {
    text-transform: capitalize;
    font-weight: 600;
    color: #333;
    display: block;
}

.blog-sidebar .sidebar-blog-post .post-info a:hover {
    color: #29b2fe;
}

.blog-sidebar .sidebar-blog-post .post-info span {
    font-style: italic;
}

/* Mailchimp Form */

.blog-sidebar .mailchimp button {
    width: 100%;
}

/* Trending Tags */

.blog-sidebar .tag-wrapper {}

.blog-sidebar .tag-wrapper a {
    color: #999;
    font-size: 16px;
    background: #fff;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px 15px;
    line-height: 50px;
    text-transform: capitalize;
    text-transform: capitalize;
    margin-right: 5px;
    white-space: nowrap;
}

.blog-sidebar .tag-wrapper a:hover {
    background-color: #29b2fe;
    color: #fff;
}

/* Categories - Archives */

.blog-sidebar .sidebar-list {
    padding: 0;
}

.blog-sidebar .sidebar-list li {
    padding: 8px 0;
    border-bottom: 1px solid #e3e3e3;
}

.blog-sidebar .sidebar-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.blog-sidebar .sidebar-list li a {
    font-size: 16px;
    text-transform: capitalize;
    color: #999;
}

.blog-sidebar .sidebar-list li a:hover {
    color: #29b2fe;
    padding-left: 10px;
}

/*********** 9.3 Masonry Grid *************/

section.blog-masonry {
    background: #f0f0f0;
}

.blog-masonry .blog-grid {
    height: 100%;
}

.blog-masonry .element {
    margin-bottom: 40px;
}

/* Single Blog Post Styling */

.blog-masonry .blog-single {
    background-color: #fff;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.blog-masonry .blog-post-thumbnail {
    height: 200px;
    width: 100%;
    overflow: hidden;
    position: relative;
}

.blog-masonry .blog-post-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

.blog-masonry .blog-post-title {
    margin: 0 25px;
    border-bottom: 1px solid #eee;
}

.blog-masonry .blog-post-title h3>a {
    font-size: 18px;
    text-transform: capitalize;
    color: #333;
    font-weight: 600;
    font-family: inherit;
}

.blog-masonry .blog-post-title h3>a:hover {
    color: #29b2fe;
}

.blog-masonry .blog-post-title p {
    font-size: 12px;
    letter-spacing: 0.5px;
}

.blog-masonry .blog-post-title .blog-author {
    text-transform: uppercase;
    font-weight: 700;
}

.blog-masonry .blog-post-title .blog-date:before {
    content: "|";
    padding-left: 7px;
    padding-right: 9px;
}

.blog-masonry .blog-post-details {
    margin: 0 25px;
}

.blog-more-btn {
    color: #333;
}

.blog-masonry .blog-more-btn:hover,
.blog-masonry .blog-more-btn:focus {
    text-decoration: none;
    outline: none;
}

.blog-masonry .blog-more-btn i {
    margin-left: 5px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.blog-masonry .blog-more-btn:hover i {
    margin-left: 10px;
    color: #29b2fe;
}

/* Normal Post */

.blog-masonry .blog-post-thumbnail.normal-post {
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

.blog-masonry .blog-post-thumbnail.normal-post:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

/* Thumbnail Slider */

.blog-masonry .post-thumbnail-slider,
.blog-masonry .post-thumbnail-slider .owl-stage-outer,
.blog-masonry .post-thumbnail-slider .owl-stage-outer .owl-stage,
.blog-masonry .post-thumbnail-slider .owl-item .item {
    height: 100%;
}

.blog-masonry .post-thumbnail-slider .owl-item {
    position: relative;
    float: left;
    height: 100%;
}

.blog-masonry .post-thumbnail-slider .owl-nav {
    position: absolute;
    width: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.blog-masonry .post-thumbnail-slider .owl-nav .owl-prev,
.blog-masonry .post-thumbnail-slider .owl-nav .owl-next {
    font-size: 28px;
    color: #f6f6f6;
    display: inline-block;
    cursor: pointer;
}

.blog-masonry .post-thumbnail-slider .owl-nav .owl-prev {
    padding-left: 15px;
}

.blog-masonry .post-thumbnail-slider .owl-nav .owl-next {
    text-align: right;
    float: right;
    padding-right: 15px;
}

/* Quote Post */

.blog-masonry .quote-post {
    background: #29b2fe;
}

.blog-masonry .quote-post blockquote {
    font-family: "Varela Round", sans-serif;
    border: none;
    margin: 0;
    font-size: 18px;
    text-align: center;
}

.blog-masonry .quote-post blockquote span {
    font-family: "Varela Round", sans-serif;
    display: block;
}

/* Video Post */

.blog-masonry .video-post {
    height: auto;
}

/*********** 9.4 Single Blog Post *************/

section#blog-post h2 {
    text-transform: uppercase;
}

section#blog-post .post-content-wrapper {
    padding: 0 40px;
}

section#blog-post .post-content {
    margin-top: 40px;
}

section#blog-post h4 {
    text-transform: uppercase;
    padding-bottom: 20px;
}

section#blog-post p {
    line-height: 26px;
}

section#blog-post .post-img {
    height: 300px;
    margin: 40px 0;
}

section#blog-post .post-img img {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section#blog-post .post-detail {
    padding-top: 10px;
    color: #999;
}

section#blog-post .post-detail span:after {
    content: "|";
    padding: 0 7px;
}

section#blog-post .post-detail span:last-child:after {
    display: none;
}

section#blog-post .post-detail span i {
    padding-right: 5px;
}

section#blog-post .post-quote {
    background: #29b1fd;
    color: #f6f6f6;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    text-align: center;
    margin: 40px 0;
}

section#blog-post .post-quote blockquote {
    position: relative;
    margin: 0;
    padding: 60px;
    font-style: italic;
    font-size: 24px;
    border: 0;
}

section#blog-post .post-quote blockquote:before {
    content: "\f10d";
    font-family: "fontawesome";
    position: absolute;
    display: inline-block;
    float: left;
    color: #f6f6f6;
    font-size: 72px;
    left: 30px;
    top: 0;
    font-style: normal;
    opacity: 0.2;
}

section#blog-post .post-quote blockquote:after {
    content: "\f10e";
    font-family: "fontawesome";
    position: absolute;
    display: inline-block;
    float: right;
    color: #f6f6f6;
    font-size: 72px;
    right: 30px;
    bottom: 0;
    font-style: normal;
    opacity: 0.2;
}

section#blog-post .social-btn-roll {
    background: none;
}

/* Comments Section */

#blog-comments h4 {
    text-transform: uppercase;
}

#blog-comments .comments-list {
    list-style: none;
    padding: 0;
}

#blog-comments .comments-list .comment {
    padding: 40px 0;
    border-bottom: 1px solid #e3e3e3;
}

#blog-comments .comments-list .comment:last-child {
    border-bottom: 0;
}

#blog-comments .comments-list .commenter {
    position: relative;
    width: 65px;
    height: 65px;
    margin-right: 30px;
}

#blog-comments .comments-list .commenter:before {
    content: "";
    display: block;
    background: #29b1fd;
    width: 65px;
    height: 65px;
    position: absolute;
    top: 0;
    z-index: 0;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0.15;
}

#blog-comments .comments-list .commenter:after {
    content: "";
    display: block;
    background: #29b1fd;
    width: 65px;
    height: 65px;
    position: absolute;
    top: 0;
    z-index: 0;
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0.1;
}

#blog-comments .comments-list .commenter img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    z-index: 2;
    position: relative;
}

#blog-comments .comments-list .comment-body h6 {
    text-transform: capitalize;
    padding-bottom: 5px;
}

#blog-comments .comments-list .comment-body .comment-reply {
    margin: -20px 20px 0 0;
}

#blog-comments .comments-list .comment-body .comment-info {
    padding-bottom: 25px;
}

#blog-comments .comments-list .comment-body span {
    font-size: 14px;
    color: #999;
}

/* comment replies */

#blog-comments .comment-body {
    overflow: visible;
}

#blog-comments .comments-list .comment-replies {
    list-style: none;
    padding: 0;
    margin-top: 40px;
}

#blog-comments .comments-list .comment-replied {
    padding-bottom: 40px;
}

#blog-comments .comments-list .comment-replied:last-child {
    padding-bottom: 0;
}

/* comment form */

form#comment-form textarea {
    resize: none;
}

/*********** 9.5 Next Blog Post Section *************/

section#next-post {
    position: relative;
    background: url(../images/blog/blog2.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    color: #f6f6f6;
}

section#next-post:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #000;
    position: absolute;
    top: 0;
    opacity: 0.7;
    z-index: 0;
}

section#next-post>div {
    position: relative;
    z-index: 1;
}

section#next-post span {
    font-size: 18px;
}

section#next-post span:after {
    content: "";
    width: 50px;
    height: 3px;
    background: #29b1fd;
    display: block;
    margin: 0 auto;
    margin-top: 20px;
}

/* --------------------------------------
    10. Shop
-------------------------------------- */

section.shop {
    background: #f0f0f0;
}

/*********** 10.1 Shop Listing *************/

section.shop .product {
    margin-bottom: 40px;
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    overflow: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.shop .product:hover {
    -webkit-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    -moz-box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
    box-shadow: 5px 5px 30px 0px rgba(55, 71, 79, 0.1);
}

section.shop .product-image {
    position: relative;
    overflow: hidden;
    height: 260px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

section.shop .product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    transition: all 0.8s ease;
}

section.shop .product-image:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: blur(3px);
    opacity: 0.4;
}

section.shop .product-image .product-overlay {
    position: absolute;
    width: 100%;
    height: 40px;
    line-height: 40px;
    top: auto;
    bottom: -40px;
    z-index: 6;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

section.shop .product-image:hover .product-overlay {
    bottom: 0;
    opacity: 1;
    visibility: visible;
}

section.shop .product-image .product-overlay a {
    display: block;
    width: 100%;
    font-size: 14px;
    color: #f6f6f6;
    background: #443088;
    text-align: center;
}

section.shop .product-image .product-overlay a:hover {
    background: #29b2fe;
}

section.shop .product-image .product-overlay a i {
    padding-right: 5px;
}

section.shop .product-descr {
    background: #fff;
    text-align: center;
    padding: 20px 0;
}

section.shop .product-descr h4 {
    color: #323232;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

section.shop .product-descr h4:hover {
    color: #29b2fe;
}

section.shop .product-descr h5 {
    color: #323232;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

section.shop .product-descr h5:hover {
    color: #29b2fe;
}

section.shop .product-descr span.price {
    color: #999;
    font-size: 18px;
}

section.shop .pagination {
    margin-top: 20px;
}

/*********** 10.2 Shop Sidebar *************/

.shop-sidebar {
    padding: 0 10px;
}

.shop-sidebar .widget-title {
    text-transform: uppercase;
    font-weight: 600;
}

.shop-sidebar .widget-title:after {
    content: "";
    width: 50px;
    height: 3px;
    background: #29b1fd;
    display: block;
    margin-top: 20px;
    margin-bottom: 40px;
}

/* Cart */

.shop-sidebar .cart-sidebar span {
    font-style: italic;
    color: #999;
}

/* Price Filter */

.shop-sidebar .price-filter .ui-slider.ui-slider-horizontal.ui-widget.ui-widget-content.ui-corner-all {
    background: #fff;
    border: medium none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    height: 10px;
}

.shop-sidebar .price-filter .ui-slider-handle.ui-state-default.ui-corner-all {
    background: #fff none repeat scroll 0 0;
    border: 3px solid #29b1fd;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    height: 21px;
    margin-top: -2px;
    width: 21px;
    outline: none;
}

.shop-sidebar .price-filter .ui-slider-range {
    background: #29b1fd none repeat scroll 0 0;
}

.shop-sidebar .price-slider-amount>input[type="text"] {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-weight: bold;
    height: 40px;
    letter-spacing: 1px;
    text-align: center;
    width: 65%;
    box-shadow: none !important;
    -webkit-appearance: none;
}

.shop-sidebar .price-slider-amount>button {
    float: right;
    font-weight: bold;
    height: 40px;
    letter-spacing: 1px;
    text-transform: uppercase;
    width: 30%;
}

/* Popular Products */

.shop-sidebar .sidebar-product {
    clear: both;
}

.shop-sidebar .sidebar-product .thumbnail-post {
    width: 80px;
    height: 80px;
    overflow: hidden;
    position: relative;
    float: left;
    margin-right: 20px;
    margin-bottom: 30px;
    background: -moz-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: -webkit-linear-gradient(left, #29b2fe -20%, #443088 120%);
    background: linear-gradient(to right, #29b2fe -20%, #443088 120%);
}

.shop-sidebar .sidebar-product .thumbnail-post img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.shop-sidebar .sidebar-product .thumbnail-post img:hover {
    opacity: 0.5;
}

.shop-sidebar .sidebar-product .product-info {
    padding-top: 15px;
}

.shop-sidebar .sidebar-product .product-info a {
    text-transform: capitalize;
    font-weight: 600;
    color: #333;
    display: block;
}

.shop-sidebar .sidebar-product .product-info a:hover {
    color: #29b2fe;
}

.shop-sidebar .sidebar-product .product-info span {
    color: #999;
    font-style: italic;
}

/* Categories - Archives */

.shop-sidebar .sidebar-list {
    padding: 0;
}

.shop-sidebar .sidebar-list li {
    padding: 8px 0;
    border-bottom: 1px solid #e3e3e3;
}

.shop-sidebar .sidebar-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.shop-sidebar .sidebar-list li a {
    font-size: 16px;
    text-transform: capitalize;
    color: #999;
}

.shop-sidebar .sidebar-list li a:hover {
    color: #29b2fe;
    padding-left: 10px;
}

/*********** 10.3 Single Product *************/

.product-slider .item>div {
    height: 350px;
    overflow: hidden;
}

.product-slider .item>div img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-slider .owl-nav.disabled+.owl-dots {
    text-align: center;
    margin-top: 10px;
}

.product-slider .owl-dots .owl-dot {
    display: inline-block;
    zoom: 1;
}

.product-slider .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #ddd;
    display: block;
    -webkit-backface-visibility: visible;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.product-slider .owl-dots .owl-dot.active span {
    background: #29b2fe;
}

.product-details .product-rating i {
    color: #fdc948;
    font-size: 18px;
}

.product-details .product-price {
    padding: 20px 0;
    font-size: 18px;
}

.product-details .product-price del {
    color: #999;
    padding-right: 10px;
    font-style: italic;
}

.product-details .product-price span.price {
    font-size: 24px;
    font-weight: 600;
}

/* Quantity */

.product-quantity {
    display: inline-block;
    margin: 0;
    float: none;
    border: 1px solid #e3e3e3;
}

.product-quantity .minus,
.product-quantity .plus {
    display: block;
    float: left;
    cursor: pointer;
    border: 0 transparent;
    padding: 0;
    width: 36px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #eee;
    font-size: 16px;
    font-weight: 700;
}

.product-quantity .qty {
    float: left;
    width: 50px;
    line-height: 40px;
    border: 0;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    background-color: #f6f6f6;
    text-align: center;
    margin-bottom: 0;
}

/* Tabs */

.product-wrapper .nav-tabs>li {
    text-align: center;
}

.product-wrapper .nav-tabs>li.active>a {
    color: #333;
    border-top: 3px solid #29b2fe;
}

.product-wrapper .nav-tabs>li.active>a:hover {
    background: #fff;
    border-top: 3px solid #29b2fe;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #e3e3e3;
}

.product-wrapper .nav-tabs>li>a {
    padding: 15px 30px;
    color: #666;
    border-top: 3px solid transparent;
}

.product-wrapper .nav-tabs>li>a:hover {
    background: none;
    border: 1px solid transparent;
    border-top: 3px solid transparent;
}

.product-wrapper .nav-tabs>li>a:focus {
    color: #333 !important;
}

.product-wrapper .tab-content {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-top: 0;
    -webkit-border-radius: 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}

.product-wrapper .tab-content .tab-pane {
    padding: 40px;
}

/* Review Section */

.product-wrapper h4 {
    text-transform: uppercase;
}

.product-wrapper .comments-list {
    list-style: none;
    padding: 0;
}

.product-wrapper .comments-list .comment {
    padding: 40px 0;
    border-bottom: 1px solid #e3e3e3;
}

.product-wrapper .comments-list .comment:last-child {
    border-bottom: 0;
}

.product-wrapper .comments-list .commenter {
    position: relative;
    width: 65px;
    height: 65px;
    margin-right: 30px;
}

.product-wrapper .comments-list .commenter:before {
    content: "";
    display: block;
    background: #29b1fd;
    width: 65px;
    height: 65px;
    position: absolute;
    top: 0;
    z-index: 0;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0.15;
}

.product-wrapper .comments-list .commenter:after {
    content: "";
    display: block;
    background: #29b1fd;
    width: 65px;
    height: 65px;
    position: absolute;
    top: 0;
    z-index: 1;
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    opacity: 0.1;
}

.product-wrapper .comments-list .commenter img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: relative;
    z-index: 2;
}

.product-wrapper .comments-list .comment-body h6 {
    text-transform: capitalize;
    padding-bottom: 5px;
}

.product-wrapper .comments-list .comment-body .comment-rating {
    margin: -20px 20px 0 0;
    color: #fdc948;
    font-size: 18px;
}

.product-wrapper .comments-list .comment-body .comment-info {
    padding-bottom: 25px;
}

.product-wrapper .comments-list .comment-body span {
    font-size: 14px;
    color: #999;
}

.product-wrapper form textarea {
    padding: 10px 20px;
    box-shadow: none;
    max-width: 100%;
    resize: none;
    color: #999;
}

/*********** 10.4 Cart *************/

.cart {
    overflow: hidden;
}

.cart>thead>tr>td,
.cart>thead>tr>th,
.cart>tbody>.cart-item>td,
.cart>tbody>.cart-item>th,
.cart>tfoot>tr>td,
.cart>tfoot>tr>th {
    vertical-align: middle !important;
    text-align: center;
}

.cart .cart-item a {
    font-weight: 600;
    color: #323232;
}

.cart .cart-item a:hover {
    color: #29b2fe;
}

/* Product Thumbnail */

.cart .cart-item .cart-product-thumbnail img {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.cart .cart-item .cart-product-thumbnail img:hover {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

/* Quantity */

.cart-product-quantity .quantity {
    display: inline-block;
    margin: 0;
    float: none;
    border: 1px solid #e3e3e3;
}

.cart .quantity .minus,
.cart .quantity .plus {
    display: block;
    float: left;
    cursor: pointer;
    border: 0 transparent;
    padding: 0;
    width: 36px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background-color: #eee;
    font-size: 16px;
    font-weight: 700;
}

.cart .quantity .qty {
    float: left;
    width: 50px;
    line-height: 40px;
    border: 0;
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    background-color: #f6f6f6;
    text-align: center;
    margin-bottom: 0;
}

/*********** 10.5 Checkout *************/

section.shop .panel-group .panel+.panel {
    margin-top: 10px;
}

section.shop .panel-group .panel {
    border: 1px solid #e3e3e3;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: none;
}

section.shop .panel-group .panel .panel-heading {
    padding: 15px 20px;
}

section.shop .panel-group .panel .panel-heading h4 a {
    font-family: inherit;
    font-size: 18px;
}

.invalid-feedback {
    color: red;
}

.is-invalid {
    border-color: red;
}

/* Profile Card Styles */
.profile-card {
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    padding: 20px;
    text-align: center;
    position: relative;
}

.profile-picture img {
    border-radius: 50%;
    width: 200px;
    height: 120px;
    object-fit: cover;
    margin-bottom: 15px;
}

.profile-content {
    display: flex;
    align-items: center;
}

.candidate-name {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin-bottom: 5px;
}

.candidate-title {
    font-size: 18px;
    font-weight: 400;
    color: #777;
    margin-bottom: 15px;
}

.candidate-desc {
    font-size: 14px;
    color: #555;
    line-height: 1.5;
}

/* Card Container and Cards */
.card-container {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

/* Card Styles */
.card {
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    overflow: hidden;
    flex: 1;
    position: relative;
    padding: 20px;
    transition: transform 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
}

.card__info {
    position: relative;
    z-index: 1;
}

/* Card Logo with Icon */
.card__logo {
    font-size: 24px;
    /* Increase this value to make the logo (icon) larger */
    font-weight: 700;
    color: #333;
    display: flex;
    align-items: center;
}

.card__logo i {
    margin-right: 12px;
    /* Increase space between icon and text */
    color: #2d88f0;
    /* Icon color */
}

.card__number {
    font-size: 40px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
}

.card__digit-group {
    font-size: 48px;
    color: #2d88f0;
    /* Customize this color as needed */
}

.card__valid-thru {
    font-size: 14px;
    color: #777;
}

.card__exp-date {
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.card__texture {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: linear-gradient(135deg,
            rgba(255, 255, 255, 0.1) 25%,
            transparent 25%),
        linear-gradient(225deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%),
        linear-gradient(45deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%),
        linear-gradient(315deg, rgba(255, 255, 255, 0.1) 25%, transparent 25%);
    background-size: 50px 50px;
    pointer-events: none;
}

/* Media Queries for Responsive Design */
@media (max-width: 768px) {
    .card-container {
        flex-direction: column;
    }

    .profile-card {
        margin-bottom: 20px;
    }

    .profile-picture img {
        width: 100px;
        height: 100px;
    }

    .candidate-name {
        font-size: 20px;
    }

    .candidate-title {
        font-size: 16px;
    }

    .candidate-desc {
        font-size: 12px;
    }
}

/* General Styles */
.card-container {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    /* Space between cards */
}

.card {
    flex: 1;
    margin: 10px;
    min-width: 250px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Sidebar Styles */
.dashboard-sidebar {
    padding: 0;
}

.sidebar-navigation {
    background-color: #4cc4f2;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
}

/* .card-header {
    background-color: #29b1df;
    color: #ffffff;
    padding: 15px;
    border-radius: 8px 8px 0 0;
    margin-bottom: 20px;
}


.card-header {
  background-color: #29b1df !important;
  color: #000;
  padding: 15px !important;
    padding-top: 15px;
    padding-bottom: 15px;
  border-radius: 8px 8px 0 0;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
  margin-bottom: 20px;
} */

.sidebar-title {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

.nav {
    padding: 0;
    margin: 0;
}

.nav-item {
    margin-bottom: 10px;
}

.nav-link {
    display: block;
    padding: 12px 15px;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    font-size: 16px;
}

.nav-link.active,
.nav-link:hover {
    background-color: #333;
    color: #ffffff;
}

.btn-link {
    border: none;
    background: none;
    font-weight: 500;
}

.btn-link:hover {
    text-decoration: none;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    color: #555;
    cursor: default;
    background-color: #28efef !important;
    border: 0px solid #ddd;
    border-bottom-color: transparent;
}

/* Adjustments for responsive design */
@media (max-width: 768px) {

    /* Sidebar Styles for Mobile */
    .dashboard-sidebar {
        width: 100%;
        /* Full width on mobile */
        padding: 10px;
    }

    .sidebar-navigation {
        padding: 15px;
        border-radius: 0;
    }

    .nav-link {
        padding: 10px;
        font-size: 14px;
        text-align: center;
    }

    .nav-link.active,
    .nav-link:hover {
        background-color: #333;
        color: #ffffff;
    }

    /* Make cards stack vertically in mobile view */
    .card-container {
        flex-direction: column;
    }

    /* Responsive logout button */
    .btn-danger {
        width: 100%;
        font-size: 14px;
    }

    .card-container {
        flex-direction: column;
        /* Stack cards vertically on small screens */
    }
}

.notify {
    z-index: 9999;
}

.select2-selection--multiple.select2-selection.select2-selection__rendered {
    margin-top: -10px !important;
}

.select2-selection--multiple.select2-selection.select2-selection--multiple {
    border: 0px !important;
    height: 0px;
}

.select2-selection--multiple .select2-search {
    margin-top: -15px !important;
}

.select2-selection__choice {
    padding: -1px !important;
    background: var(--colorPrimary) !important;
    border: 0px !important;
    padding: 2px 14px !important;
    color: white;
    margin: 0px;
}

.select2-selection__choice__remove {
    color: black !important;
    margin-right: 7px !important;
}

.ck-editor__editable {
    min-height: 250px;
}

.preloader_demo {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffffc4;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.preloader_demo .img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.preloader_demo .img img {
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

/* Mobile-specific adjustments */
@media (max-width: 767px) {

    /* Ensure buttons look consistent on mobile */
    .btn {
        width: 100%;
        /* Make buttons full-width on small screens */
        margin-bottom: 0.5rem;
        /* Add spacing between buttons */
    }

    .table-responsive table {
        border-collapse: separate;
        border-spacing: 0 0.5rem;
        /* Space between rows */
    }

    .table thead {
        display: none;
        /* Hide table headers on mobile */
    }

    .table tbody tr {
        display: block;
        /* Each row becomes a block */
        margin-bottom: 1rem;
        /* Space between rows */
        border: 1px solid #ddd;
        border-radius: 5px;
        padding: 1rem;
    }

    .table tbody tr td {
        display: flex;
        justify-content: space-between;
        padding: 0.5rem;
        border-bottom: 1px solid #f1f1f1;
    }

    .table tbody tr td:last-child {
        border-bottom: none;
    }

    .table tbody tr td::before {
        content: attr(data-label);
        font-weight: bold;
        min-width: 100px;
        display: inline-block;
    }
}

ul.timeline {
    list-style-type: none;
    position: relative;
    padding-left: 0;
}

ul.timeline:before {
    content: " ";
    background: #d4d9df;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 100%;
    z-index: 400;
}

ul.timeline>li {
    margin: 20px 0;
    padding-left: 70px;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

ul.timeline>li:before {
    content: " ";
    background: white;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #22c0e8;
    left: 20px;
    width: 20px;
    height: 20px;
    z-index: 400;
}

/* For the text elements */
ul.timeline>li>span {
    flex-grow: 1;
}

/* Date element styling for floating to the right */
ul.timeline>li>span.date {
    white-space: nowrap;
    text-align: right;
    flex-shrink: 0;
}

.bookmark-icon {
    color: #666;
    /* Default color */
    font-size: 30px;
    /* Icon size */
    transition: color 0.3s ease;
    /* Smooth color transition */
    text-decoration: none;
    /* Remove underline */
}

.bookmark-icon:hover {
    color: #007bff;
    /* Change color on hover */
}

.bookmark-icon.active {
    color: #007bff;
    /* Color when bookmarked */
}

/* Job Type Colors */
.btn-full-time {
    background-color: #28a745;
    color: #fff;
}

.btn-part-time {
    background-color: #ffc107;
    color: #000;
}

.btn-contract {
    background-color: #17a2b8;
    color: #fff;
}

.btn-temporary {
    background-color: #dc3545;
    color: #fff;
}

.btn-remote {
    background-color: #6c757d;
    color: #fff;
}

.btn-freelance {
    background-color: #6610f2;
    color: #fff;
}

.btn-internship {
    background-color: #fd7e14;
    color: #fff;
}

.btn-entry-level {
    background-color: #20c997;
    color: #fff;
}

.btn-mid-level {
    background-color: #0d6efd;
    color: #fff;
}

.btn-senior-level {
    background-color: #6f42c1;
    color: #fff;
}

.btn-volunteer {
    background-color: #d63384;
    color: #fff;
}

.btn-apprenticeship {
    background-color: #0dcaf0;
    color: #fff;
}

.btn-commission-based {
    background-color: #ff6b6b;
    color: #fff;
}

.btn-seasonal {
    background-color: #f06595;
    color: #fff;
}

.btn-consulting {
    background-color: #4dabf7;
    color: #fff;
}

.btn-gig-work {
    background-color: #ff922b;
    color: #fff;
}

.btn-shift-based {
    background-color: #94d82d;
    color: #fff;
}

.btn-per-diem {
    background-color: #fcc419;
    color: #000;
}

.btn-self-employed {
    background-color: #82c91e;
    color: #fff;
}

.btn-casual {
    background-color: #fab005;
    color: #000;
}

.btn-on-call {
    background-color: #74b816;
    color: #fff;
}

.btn-hybrid {
    background-color: #5c7cfa;
    color: #fff;
}

.btn-rotational {
    background-color: #339af0;
    color: #fff;
}

.btn-fixed-term {
    background-color: #228be6;
    color: #fff;
}

.btn-probationary {
    background-color: #1c7ed6;
    color: #fff;
}

.btn-flexible-hours {
    background-color: #15aabf;
    color: #fff;
}

.btn-overtime {
    background-color: #12b886;
    color: #fff;
}

.btn-job-sharing {
    background-color: #0ca678;
    color: #fff;
}

.btn-night-shift {
    background-color: #087f5b;
    color: #fff;
}

.btn-weekend-shift {
    background-color: #099268;
    color: #fff;
}

/*
Additional CSS for responsive design
*/
.featured {
    background: #ae00ae !important;
    color: white !important;
}

.featured:hover {
    background: #fff !important;
    /* Darker shade on hover */
    color: #ae00ae !important;
    transform: translateY(-2px) !important;
    /* Slight lift on hover */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    /* Shadow on hover */
}

.highlighted {
    background: #f05d04 !important;
    color: white !important;
}

.highlighted:hover {
    background: #fff !important;
    /* Darker shade on hover */
    color: #f05d04 !important;
    transform: translateY(-2px) !important;
    /* Slight lift on hover */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    /* Shadow on hover */
}

.box-map {
    display: inline-block;
    width: 360px;
    /* Set fixed width */
    height: 360px;
    /* Set fixed height */
    margin-bottom: 15px;
    overflow: hidden;
    /* Prevents overflow issues */
}

.box-map iframe {
    width: 100%;
    /* Ensure iframe fits inside */
    height: 100%;
    /* Ensure iframe fits inside */
}

.job-summary {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.job-summary {
    background-color: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.job-summary h2 {
    margin-top: 0;
    font-size: 24px;
    font-weight: bold;
    color: #333;
}

.joblist {
    margin-bottom: 20px;
}

.joblist strong {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.joblist strong i {
    margin-right: 8px;
    font-size: 16px;
    color: #007bff;
    /* Icon color */
}

.joblist p {
    margin: 0;
    font-size: 16px;
    color: #333;
    padding-left: 24px;
    /* Align text with icon */
}

/* Deadline styling */
.deadline-approaching {
    color: #28a745;
    /* Green for approaching deadline */
}

.deadline-passed {
    color: #dc3545;
    /* Red for passed deadline */
}

/* Styling for job categories */
.job-categories li {
    margin-bottom: 10px;
    transition: all 0.3s ease;
}

.job-categories label {
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

/* Job count styling */
.job-count {
    margin-left: 5px;
    font-size: 14px;
    color: #777;
    background-color: #f0f0f0;
    border-radius: 12px;
    padding: 2px 8px;
    font-weight: normal;
    display: inline-block;
    transition: all 0.3s ease;
}

/* Hover effects */
.job-categories li:hover .job-count {
    background-color: #e0e0e0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .job-categories label {
        font-size: 14px;
    }

    .job-count {
        font-size: 12px;
        padding: 1px 6px;
    }
}

.job-filter {
    background-color: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.mt30 {
    margin-top: 30px;
}

.filter-option {
    margin-bottom: 10px;
}

.filter-label {
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
    display: block;
}

.filter-toggle {
    display: flex;
    margin-bottom: 20px;
}

.toggle-btn {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    padding: 8px 16px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}

.toggle-btn:first-child {
    border-radius: 4px 0 0 4px;
}

.toggle-btn:last-child {
    border-radius: 0 4px 4px 0;
}

.toggle-btn.active {
    background-color: #38b2ac;
    color: white;
    border-color: #38b2ac;
}

.slider-container {
    padding: 5px 0 20px 0;
}

.slider {
    position: relative;
    height: 6px;
    background-color: #e2e8f0;
    border-radius: 3px;
    margin: 20px 0;
}

.slider-track {
    position: absolute;
    height: 100%;
    background-color: #38b2ac;
    border-radius: 3px;
}

.slider-thumb {
    position: absolute;
    width: 18px;
    height: 18px;
    background-color: #ffffff;
    border: 2px solid #38b2ac;
    border-radius: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    transition: box-shadow 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.slider-thumb:hover {
    box-shadow: 0 0 0 5px rgba(56, 178, 172, 0.2);
}

.slider-thumb.active {
    box-shadow: 0 0 0 8px rgba(56, 178, 172, 0.3);
}

.range-values {
    display: flex;
    justify-content: space-between;
    color: #718096;
    font-size: 14px;
}

.salary-display {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #38b2ac;
    margin-top: 5px;
}

/* Hide slider when inactive */
.slider-container.hidden {
    display: none;
}

/* Debug panel */
.debug-panel {
    margin-top: 20px;
    padding: 10px;
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.debug-panel h4 {
    margin-top: 0;
    margin-bottom: 10px;
}

.select-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
}

.select-wrapper select {
    width: 100%;
    padding-right: 40px;
    /* Ensures space for the icon */
    appearance: none;
    /* Removes default arrow */
    -webkit-appearance: none;
    -moz-appearance: none;
}

.select-icon {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
    pointer-events: none;
}

.sweet-button {
    background-color: #4a90e2;
    /* Blue background */
    color: #fff;
    /* White text */
    padding: 12px 24px;
    /* Padding for size */
    border: none;
    /* Remove default border */
    border-radius: 6px;
    /* Rounded corners */
    font-size: 16px;
    /* Font size */
    font-weight: 500;
    /* Medium font weight */
    cursor: pointer;
    /* Pointer cursor on hover */
    transition: all 0.3s ease;
    /* Smooth transition for hover effects */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    /* Subtle shadow */
    display: inline-flex;
    /* Align icon and text */
    align-items: center;
    /* Center icon and text vertically */
    justify-content: center;
    /* Center icon and text horizontally */
    gap: 8px;
    /* Space between icon and text */
    width: 100%;
    /* Full width */
}

.sweet-button:hover {
    background-color: #357abd;
    /* Darker blue on hover */
    transform: translateY(-2px);
    /* Slight lift on hover */
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
    /* Larger shadow on hover */
}

.sweet-button:active {
    transform: translateY(0);
    /* Reset lift on click */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    /* Reset shadow on click */
}

.sweet-button i {
    font-size: 18px;
    /* Slightly larger icon */
}

.input-with-icon {
    position: relative;
    /* Required for absolute positioning of the icon */
    width: 100%;
    /* Ensure the wrapper takes full width */
}

.input-with-icon .form-control {
    width: 100%;
    /* Ensure input takes full width */
    padding-right: 40px;
    /* Add padding to prevent text from overlapping the icon */
    border: 1px solid #e0e0e0;
    /* Optional: Add a border */
    border-radius: 6px;
    /* Optional: Rounded corners */
    font-size: 16px;
    /* Optional: Adjust font size */
    height: 48px;
    /* Optional: Adjust height */
    box-sizing: border-box;
    /* Ensure padding and border are included in the width */
}

.input-with-icon .input-icon {
    position: absolute;
    /* Position the icon absolutely within the wrapper */
    right: 12px;
    /* Adjust the right position */
    top: 50%;
    /* Center vertically */
    transform: translateY(-50%);
    /* Center vertically */
    color: #888;
    /* Icon color */
    pointer-events: none;
    /* Ensure the icon doesn't interfere with input clicks */
    font-size: 18px;
    /* Adjust icon size */
}

/* Empty State Styling */
.empty-jobs-container {
    background-color: #fff;
    border-radius: 15px;
    padding: 40px 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.empty-jobs-container:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

.empty-state-icon img {
    max-width: 350px;
    margin: 0 auto;
    display: block;
}

.empty-jobs-container h3 {
    font-size: 24px;
    font-weight: 700;
    color: #3a3a3a;
}

.empty-jobs-container p {
    font-size: 16px;
    color: #666;
    max-width: 500px;
    margin: 0 auto;
    line-height: 1.6;
}

.empty-state-actions {
    margin-top: 25px;
}

.btn-primary:hover {
    background-color: #0e7d69;
    border-color: #0e7d69;
    transform: translateY(-1px);
}

.btn-outline {
    padding: 11px;
    color: #000;
    /* Set color to match border */
    border: 1px solid #0e7d69;
    /* Visible border */
    background-color: #10c3fa;
    /* Remove background color */
    border-radius: 5px;
    /* Adjust for a smoother look */
    transition: all 0.3s ease-in-out;
    /* Smooth hover effect */
}

.btn-outline:hover {
    background-color: #0e7d69;
    /* Add hover effect */
    color: white;
    /* Change text color on hover */
}

/* Job Suggestions */
.job-suggestions {
    padding-top: 25px;
    border-top: 1px solid #eee;
    margin-top: 30px;
}

.job-suggestions h5 {
    color: #3a3a3a;
    font-size: 18px;
}

.suggested-searches {
    margin-top: 15px;
}

.suggested-searches a.badge {
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.suggested-searches a.badge:hover {
    background-color: #129079 !important;
    color: white !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .empty-state-icon img {
        max-width: 250px;
    }

    .empty-jobs-container {
        padding: 30px 15px;
    }

    .empty-state-actions {
        flex-direction: column;
        align-items: center;
    }

    .empty-state-actions .btn {
        width: 100%;
        margin-bottom: 10px;
    }
}

/* Search Results Header */
.search-results-header {
    background-color: #fff;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    margin-bottom: 25px;
}

.search-results-header h3 {
    color: #333;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
}

.search-results-header p {
    color: #666;
    font-size: 15px;
    margin-bottom: 0;
}

/* Companies Grid */
.company-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 25px;
    margin-top: 30px;
}

.company-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e6e6e6;
}

.company-card:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    transform: translateY(-5px);
}

.company-card a {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.company-card-header {
    padding: 25px 20px;
    background: linear-gradient(135deg, #f8f9fa, #f1f3f5);
    text-align: center;
    border-bottom: 1px solid #e6e6e6;
}

.company-logo-container {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.company-logo {
    max-height: 65px;
    max-width: 160px;
    object-fit: contain;
}

/* Card Body */
.company-card-body {
    padding: 22px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.company-title {
    font-size: 18px;
    font-weight: 700;
    color: #2d3748;
    margin-bottom: 12px;
    line-height: 1.3;
}

.company-jobs {
    margin-bottom: 18px;
}

.badge-primary {
    background-color: #129079;
    color: white;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    display: inline-block;
    letter-spacing: 0.3px;
}

/* Meta Data */
.company-meta {
    margin-top: auto;
}

.meta-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    color: #4a5568;
    font-size: 14px;
}

.meta-icon {
    color: #129079;
    width: 20px;
    margin-right: 10px;
}

/* Card Footer */
.company-card-footer {
    padding: 15px 22px;
    background: #f9f9f9;
    border-top: 1px solid #e6e6e6;
    text-align: right;
}

.view-profile {
    color: #129079;
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    transition: all 0.3s ease;
}

.view-profile i {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.company-card:hover .view-profile {
    color: #0d6b5a;
}

.company-card:hover .view-profile i {
    transform: translateX(5px);
}

/* No Results Styling */
.no-results {
    text-align: center;
    padding: 60px 30px;
    background: white;
    border: 1px solid #e6e6e6;
    border-radius: 12px;
    margin: 30px 0;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);
}

.no-results-icon {
    font-size: 55px;
    color: #129079;
    margin-bottom: 25px;
}

.no-results h4 {
    font-size: 24px;
    margin-bottom: 15px;
    color: #2d3748;
    font-weight: 600;
}

.no-results p {
    color: #4a5568;
    margin-bottom: 25px;
    font-size: 16px;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.no-results .btn-primary {
    background-color: #129079;
    border-color: #129079;
    padding: 10px 20px;
    border-radius: 6px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.no-results .btn-primary:hover {
    background-color: #0d6b5a;
    border-color: #0d6b5a;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(18, 144, 121, 0.2);
}

/* A-Z Company Directory Styling */
.company-letters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    background-color: #fff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    margin-bottom: 25px;
    justify-content: center;
}

.company-letters a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 6px;
    background-color: #f5f7fa;
    color: #4a5568;
    font-weight: 600;
    transition: all 0.2s ease;
    text-decoration: none;
}

.company-letters a:hover {
    background-color: #129079;
    color: white;
    transform: translateY(-2px);
    box-shadow: 0 3px 8px rgba(18, 144, 121, 0.2);
}

.company-group {
    margin-bottom: 30px;
}

.company-letter {
    margin-bottom: 12px;
    position: relative;
}

.company-letter h4 {
    color: #2d3748;
    font-size: 20px;
    font-weight: 700;
    display: inline-block;
    padding-bottom: 5px;
    border-bottom: 2px solid #129079;
}

ul.nopadding {
    padding-left: 0;
    list-style: none;
}

.company-name {
    padding: 10px 0;
    border-bottom: 1px solid #e2e8f0;
}

.company-name:last-child {
    border-bottom: none;
}

.company-name a {
    color: #4a5568;
    font-size: 15px;
    transition: all 0.2s ease;
    text-decoration: none;
    display: block;
}

.company-name a:hover {
    color: #129079;
    transform: translateX(3px);
}

@media (max-width: 991px) {
    .company-letter h4 {
        font-size: 18px;
    }

    .company-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }
}

@media (max-width: 767px) {
    .search-results-header {
        padding: 20px;
    }

    .company-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .company-letters {
        gap: 5px;
        padding: 15px;
    }

    .company-letters a {
        width: 32px;
        height: 32px;
        font-size: 14px;
    }

    .company-card-header {
        padding: 20px 15px;
    }

    .company-card-body {
        padding: 18px;
    }

    .company-card-footer {
        padding: 12px 18px;
    }

    .company-title {
        font-size: 17px;
    }
}

.job-industries {
    background-color: #fff;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.job-industries h4 {
    color: #333;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0;
}

.industry-types-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 15px;
}

.industry-type-item {
    position: relative;
    margin: 0;
}

.industry-type-item input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.industry-type-item label {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 30px;
    background-color: #f5f7fa;
    border: 1px solid #e0e0e0;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
}

.industry-type-item input[type="radio"]:checked+label {
    background-color: #129079;
    color: white;
    border-color: #129079;
    box-shadow: 0 2px 8px rgba(18, 144, 121, 0.25);
}

.industry-type-item:hover label {
    border-color: #129079;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.industry-count {
    margin-left: 6px;
    opacity: 0.7;
    font-size: 12px;
}

.section-divider {
    height: 1px;
    background-color: #e0e0e0;
    margin: 15px 0;
    position: relative;
}

@media (max-width: 767px) {
    .industry-types-list {
        gap: 8px;
    }

    .industry-type-item label {
        padding: 6px 12px;
        font-size: 13px;
    }
}

.organization-list {
    margin-top: 15px;
}

.organization-item {
    margin-bottom: 12px;
    position: relative;
}

.organization-item label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-weight: 400;
    margin-bottom: 0;
    transition: all 0.2s ease;
    width: 100%;
}

.organization-item input[type="radio"] {
    margin-right: 10px;
    cursor: pointer;
    accent-color: #129079;
    width: 16px;
    height: 16px;
}

.organization-item input[type="radio"]:checked+.organization-name {
    color: #129079;
    font-weight: 500;
}

.organization-name {
    font-size: 15px;
    flex-grow: 1;
}

.organization-count {
    display: inline-block;
    margin-left: 8px;
    background-color: rgba(18, 144, 121, 0.1);
    color: #129079;
    font-size: 12px;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 12px;
    min-width: 30px;
    text-align: center;
    transition: all 0.2s ease;
}

.organization-item input[type="radio"]:checked~.organization-count {
    background-color: #129079;
    color: white;
}

.organization-item:hover label {
    color: #129079;
}

@media (max-width: 767px) {
    .filter-section {
        padding: 15px;
    }

    .organization-item {
        margin-bottom: 10px;
    }
}

/* No Companies Found Section */
.no-companies-found {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    /* Ensure it takes enough vertical space */
    background-color: #f9f9f9;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 40px 20px;
    margin: 20px auto;
    max-width: 800px;
    /* Limit width for better readability */
    text-align: center;
}

.no-companies-content {
    max-width: 500px;
    /* Limit content width for better focus */
}

/* No Results Image */
.no-results-image {
    width: 150px;
    /* Adjust size as needed */
    height: auto;
    margin-bottom: 20px;
}

/* Heading */
.no-companies-found h3 {
    font-size: 24px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

/* Paragraph */
.no-companies-found p {
    font-size: 16px;
    color: #666;
    margin-bottom: 20px;
}

/* Reset Button */
.no-companies-found .btn-primary {
    background-color: #007bff;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    /* Space between icon and text */
}

.no-companies-found .btn-primary:hover {
    background-color: #0056b3;
}

/* Hide the default radio button */
.experience-type-item input[type="radio"] {
    display: none;
}

/* Custom radio button */
.experience-type-item label {
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.experience-type-item label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border: 2px solid #ccc;
    border-radius: 50%;
    background-color: white;
}

/* Style for checked radio button */
.experience-type-item input[type="radio"]:checked+label::before {
    background-color: #007bff;
    border-color: #007bff;
}

/* Style for the label text */
.experience-type-item label span.experience-count {
    margin-left: 10px;
    color: #666;
}



/* Improved card styling */
.metric-card {
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
    height: 100%;
    border: none;
}

.metric-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}

.metric-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

/*

.bg-primary-light {
    background-color: var(--primary-light);
}

.bg-success-light {
    background-color: var(--success-light);
}

.bg-warning-light {
    background-color: var(--warning-light);
}

.bg-info-light {
    background-color: var(--info-light);
}

.btn {
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.btn-primary {
    background-color: var(--primary);
    border-color: var(--primary);
    color: white;
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
}



.btn-outline-secondary {
    color: var(--gray-dark);
    border-color: var(--gray-dark);
    background-color: transparent;
}

.btn-outline-secondary:hover {
    color: white;
    background-color: var(--gray-dark);
} */
.btn-outline-primary {
    color: var(--primary);
    border-color: var(--primary);
    /* background-color: transparent; */
}

.btn-outline-primary:hover {
    color: white;
    background-color: var(--primary) !important;
}

/* Icon spacing fix */
.fas,
.fa {
    margin-right: 0.5rem;
}

/* Alert styling */
.alert {
    border-radius: 0.75rem;
    border: none;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.alert-warning {
    background-color: #fff8e1;
    color: #b45309;
}

.alert-link {
    font-weight: 600;
    text-decoration: underline;
    color: inherit;
}

/* Badge styling */
.badge {
    font-weight: 500;
    padding: 0.35em 0.65em;
    border-radius: 0.375rem;
}




/* Card header consistent styling */
.card-header {
    background-color: white;
    border-bottom: 1px solid #f1f1f1;
    padding: 1.25rem 1.5rem;
}

/* Subscription table improvements */
.subscription-row td {
    padding: 1.25rem 1.5rem;
    vertical-align: middle;
    border-top: 1px solid #f1f1f1;
}

.table tbody tr:first-child td {
    border-top: none;
}

/* Icon circle consistency */
.icon-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    margin-right: 1rem;
}

/* Bootstrap 5 compatibility fixes */
.me-3 {
    margin-right: 1rem !important;
}

.fw-semibold {
    font-weight: 600 !important;
}

.fw-bold {
    font-weight: 700 !important;
}

.fs-6 {
    font-size: 1rem !important;
}

.rounded-top {
    border-top-left-radius: 0.5rem !important;
    border-top-right-radius: 0.5rem !important;
}

.rounded-bottom {
    border-bottom-left-radius: 0.5rem !important;
    border-bottom-right-radius: 0.5rem !important;
}

.rounded-lg {
    border-radius: 0.5rem !important;
}

.text-end {
    text-align: right !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.pt-4,
.py-4,
.p-4 {
    padding-top: 1.5rem !important;
}

.pb-4,
.py-4,
.p-4 {
    padding-bottom: 1.5rem !important;
}

.px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
}

.py-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}

.px-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
}

.py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* Fix for alignment issues */
.d-flex {
    display: flex !important;
}

.align-items-center {
    align-items: center !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

/* Shadow improvements */
.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}


/* Enhanced Profile Image Styling */
.profile-image-container {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(45deg, #3b82f6, #06b6d4);
    margin-bottom: 0.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.profile-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid white;
    transition: transform 0.3s ease;
}

.profile-image:hover {
    transform: scale(1.05);
}

/* Improved Profile Card Styling */
.profile-completeness-card {
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(249, 250, 251, 1) 100%);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.profile-card-content {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding: 0.5rem;
}

/* Enhanced Edit Profile Button */
.edit-profile-btn {
    display: inline-block;
    padding: 0.5rem 1rem;
    background-color: #2563eb;
    color: white;
    border-radius: 8px;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(37, 99, 235, 0.3);
}

.edit-profile-btn:hover {
    background-color: #1d4ed8;
    color: white;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.4);
}

/* Improved Status Cards */
.warning-card,
.success-card {
    flex: 1;
    padding: 1.25rem;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
    transition: all 0.3s ease;
}

.warning-card {
    background-color: #fff8e1;
    border-left: 5px solid #f59e0b;
}

.success-card {
    background-color: #ecfdf5;
    border-left: 5px solid #10b981;
}

.warning-card:hover,
.success-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}

.warning-content,
.success-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.warning-content strong,
.success-content strong {
    font-size: 1.2rem;
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Enhanced Progress Bar */
.profile-completeness {
    height: 20px;
    background-color: rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    overflow: hidden;
    margin-top: 0.5rem;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.15);
    position: relative;
}

.profile-completeness-bar {
    height: 100%;
    border-radius: 10px;
    transition: width 0.8s ease-in-out;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.warning-card .profile-completeness-bar {
    background: linear-gradient(90deg, #f59e0b 0%, #fbbf24 100%);
    box-shadow: 0 1px 3px rgba(245, 158, 11, 0.3);
}

.success-card .profile-completeness-bar {
    background: linear-gradient(90deg, #10b981 0%, #34d399 100%);
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.3);
}

.percentage-indicator {
    color: white;
    font-size: 0.8rem;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 2;
}

/* Media Query for Responsiveness */
@media (max-width: 768px) {
    .profile-card-content {
        flex-direction: column;
        text-align: center;
        gap: 1.5rem;
    }

    .card__profile-image {
        margin-bottom: 0;
    }

    .profile-image-container {
        margin: 0 auto 0.75rem auto;
    }
}




/* Pagination container */
.pagination-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 30px;
}

/* Pagination box */
.pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Pagination links */
.pagination a {
    color: black;
    padding: 10px 16px;
    text-decoration: none;
    background: #f1f5f9;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    transition: background-color 0.3s, color 0.3s;
}

/* Hover & Active */
.pagination a:hover:not(.active) {
    background-color: #e2e8f0;
    color: #1e3a8a;
}

.pagination a.active {
    background-color: dodgerblue;
    color: white;
    font-weight: bold;
}

/* Disabled links */
.pagination a.disabled {
    color: #9ca3af;
    pointer-events: none;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
}

/* Info text */
.pagination-info {
    font-size: 14px;
    background: #f8fafc;
    padding: 10px 16px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.pagination-info span {
    font-weight: 600;
    color: #0f172a;
}

/* Responsive */
@media (max-width: 768px) {
    .pagination-container {
        flex-direction: column;
        align-items: flex-start;
    }

    .pagination {
        justify-content: flex-start;
    }
}