/*
Theme Name: Zodiac Astrology
Theme URI: https://www.theclassictemplates.com/themes/free-astrology-wordpress-theme
Author: classictemplate
Author URI: https://www.theclassictemplates.com/
Description: Zodiac Astrology is a WordPress theme specially designed for astrologers, priests, religious gurus, astrological firms, Horoscope, Tarot Card Reader, Numerology etc. It is a perfect theme to showcase your astrological and devotional services over the internet. The theme is built using the latest HTML5 and awesome CSS3 that makes the website look clean, sophisticated and attractive. With it being a user-friendly and customizable theme, anyone can create a professional horoscope and astrology website on their own using the customization options available with the theme. You don't need any professional coding knowledge to build a website using this theme. You are ready to go with basic computing skills. The Zodiac Astrology WordPress Theme is purely designed according to the horoscope masterminds and astrologers so they don't face any issues or feel anything missing on their website and easily create a stunning astrological website of their own. This WordPress theme is also designed using the Bootstrap Framework that makes the website responsive, light-weight and loads pages faster. It also makes the website SEO friendly that attracts more visitors by showing your website in the top results of any search engines. This theme is also compatible with all types of devices and screens irrespective of their sizes and ratios for the visitors to have a better experience on your website.
Version: 0.1
Tested up to: 6.0
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zodiac-astrology
Tags: blog, e-commerce, photography, one-column, two-columns, left-sidebar, right-sidebar, custom-logo, featured-images, full-width-template, custom-colors, editor-style, wide-blocks, custom-header, custom-background, custom-menu, sticky-post, threaded-comments, theme-options

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Zodiac Astrology WordPress Theme has been created by classictemplate (theclassictemplates.com), 2021.
Zodiac Astrology WordPress Theme is released under the terms of GNU GPL
*/

* {
    margin: 0;
    padding: 0;
    outline: none;
}

/***
====================================================================
## Start CSS
====================================================================
***/

body {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow-x: hidden;
    position: relative;
    margin: 0;
    padding: 0;
    font-family: "Meiryo", Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.8;
    font-weight: normal;
    color: #333;
    background-color: #fff;
    /* Fallback for when there is no custom background color defined. */
}


/**
 * Typography
 * -------------------------------------------------------------
 */

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    margin: 0 0 10px;
    padding: 0;
    line-height: 1.3;
}

h1 {
    font-size: 38px;
}

h2 {
    font-size: 28px;
}

h3 {
    font-size: 20px;
    font-weight: bold;
}

h4 {
    font-size: 22px;
}

h5 {
    font-size: 18px;
}

h6 {
    font-size: 16px;
}

p {
    margin: 10px 0;
    padding: 0;
    font-size: 16px;
    font-weight: normal;
    line-height: 30px;
    color: #333;
}


/**
 * Links
 * -------------------------------------------------------------
 */

a {
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    text-decoration: none;
    color: #333;
}

a:hover,
a:active {
    color: #95652d;
}

a:focus {
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
}


/**
 * Elements
 * -------------------------------------------------------------
 */

.clr {
    clear: both;
}


/***
====================================================================
## Header
====================================================================
***/

#header {
    background: linear-gradient(180deg, rgb(0 0 0) 0%, rgb(0 0 0 / 0%) 100%);
    z-index: 10;
}


/**
 * Socials
 * -------------------------------------------------------------
 */

#header .w-100:first-child {
    padding-top: .25rem;
    padding-bottom: .25rem;
}

#header .w-100:first-child .gap-3 a {
    font-size: 1.25rem;
    color: #fff;
}


/***
====================================================================
## Logo + Navigation
====================================================================
***/

#header .w-100:last-child {}


/**
 * Logo
 * -------------------------------------------------------------
 */

#header .w-100:last-child .col-lg-3 {}

#header .w-100:last-child .col-lg-3 img {
    max-width: 100%;
}

@media screen and (max-width: 767px) {
    #header .w-100:last-child .col-lg-3 {
        width: 70%;
    }
}


/**
 * Navigation
 * -------------------------------------------------------------
 */

#mySidenav {
    display: inline;
}

.main-nav ul {
    margin: 0;
    padding: 0;
    /*display: flex;*/
    justify-content: space-between !important;
}

.main-nav ul li {
    display: inline-block;
    position: relative;
    margin-left: 20px;
}

.main-nav ul li a {
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

.main-nav ul li a:hover,
.main-nav ul li:hover a {
    color: #f9f871;
}

.toggle-nav,
a.close-button {
    display: none;
}

.toggle-nav {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

a.close-button {
    padding-left: 20px;
    padding-right: 20px;
}

@media screen and (max-width: 1000px) {
    .toggle-nav {
        display: block;
    }
    .toggle-nav button {
        background: #fff;
        border: none;
        font-size: 15px;
        font-weight: bold;
        color: #262626;
        padding: 10px 15px;
    }
    #mySidenav nav#site-navigation {
        text-align: left;
        background: transparent;
    }
    .sidenav {
        overflow-x: hidden;
        overflow-y: scroll;
        position: fixed;
        width: 100%;
        height: 100%;
        background: #262626;
        top: -110%;
        left: 0;
        transition: 0.5s top ease-in-out;
        opacity: 0.9;
        visibility: hidden;
        z-index: 99999;
    }
    body.show-main-menu .sidenav {
        top: 0;
        transition: 0.5s top ease-in-out;
        visibility: visible;
    }
    .sidenav #site-navigation {
        width: 100%;
    }
    .main-menu {
        padding: 0em;
        background: transparent;
    }
    .main-nav ul {
        padding: 3rem 20px;
    }
    .main-nav ul li {
        display: block;
        margin-left: 0;
        padding: 15px 0;
        border-bottom: solid 1px #565656;
    }
    /*.main-nav ul li:last-child {
        border-bottom: none;
    }*/
    .main-nav ul li a {
        float: none;
        display: block;
        font-size: 16px;
        font-weight: normal;
        color: #fff;
    }
    .main-nav ul li a:hover,
    .main-nav ul li:hover {
        color: #f9f871;
    }
    .sidenav .close-button {
        display: block !important;
        font-size: 28px;
        color: #fff;
    }
}


/***
====================================================================
## Header Image
====================================================================
***/

.header-image {
    clear: both;
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    clip-path: polygon(100% 0, 100% 90%, 39% 100%, 0 86%, 0 0);
    z-index: 1;
}

.home .header-image {
    padding: 30em 0 4em;
}

.single .header-image {
    padding: 20em 0 4em;
}

.header-image:after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.home .header-image:after {
    background-color: rgb(0 0 0 / 40%);
}

.single .header-image:after {
    background-color: rgb(0 0 0 / 40%);
}


/***
====================================================================
## Categories-1
====================================================================
***/

#about {
    overflow: hidden;
    position: relative;
    padding-top: 4em;
    padding-bottom: 3em;
}

#about .about-body {
    position: relative;
    padding: 0 2em;
}

#about .classic-about-img {
    width: 460px;
    height: 450px;
    background: #e97e33;
    border-radius: 50%;
    padding-right: 10px;
    transition: all 1s ease 0s;
}

@media (max-width: 992px) {
    .home #about .classic-about-img {
        /*width: 340px;
        height: 330px;*/
        width: 310px;
        height: 300px;
    }
}

@media (max-width: 767px) {
    .home #about .classic-about-img {
        width: 295px;
        height: 285px;
    }
}

#about .classic-about-img:hover {
    padding-left: 10px;
    padding-right: 0;
}

#about .classic-img1 {
    width: 450px;
    height: 450px;
    background: #bec7cc;
    border-radius: 50%;
}

@media (max-width: 992px) {
    #about .classic-img1 {
        /*width: 330px;
        height: 330px;*/
        width: 300px;
        height: 300px;
    }
}

@media (max-width: 767px) {
    #about .classic-img1 {
        width: 285px;
        height: 285px;
    }
}

#about .classic-about-img img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

#about .about-space {
    -ms-flex-item-align: center;
    align-self: center;
    padding: 0 2em 0 3em;
}

@media (max-width: 992px) {
    #about .about-space {
        padding-left: calc(var(--bs-gutter-x) * .5);
        padding-right: calc(var(--bs-gutter-x) * .5);
    }
}

@media (max-width: 767px) {
    #about .about-space {
        padding: 2em 0 0;
        text-align: center;
    }
}

#about .classic-section-head {}

#about .classic-section-head h2 {}

#about .classic-section-area-text {}

#about .classic-section-area-text p {
    margin: 0;
}


/***
====================================================================
## Categories-2
====================================================================
***/

div#banner {
    padding-top: 3em;
    padding-bottom: 3em;
    background: #384a72;
}

div#banner .banner-body {}

div#banner .banner-space {
    -ms-flex-item-align: center;
    align-self: center;
    padding: 0 1em;
}

div#banner .a-content {}

div#banner .classic-section-head {
    position: relative;
}

div#banner .classic-section-head h2 {
    color: #fff;
}

div#banner .classic-section-area-text {}

div#banner .classic-section-area-text p {
    margin: 0;
    color: #fff;
}

div#banner .classic-banner-img {}

div#banner .classic-img1 {}

div#banner .classic-banner-img img {
    object-fit: cover;
    width: 100%;
}

@media screen and (max-width: 767px) {
    div#banner .banner-space {
        text-align: center;
    }
    div#banner .classic-banner-img {
        margin-top: 2em;
    }
}


/***
====================================================================
## Post / Categories-1
====================================================================
***/

#card {
    position: relative;
    padding-top: 4em;
    padding-bottom: 4em;
    background: #eeebe6;
}

#card .classic-card-area {}

#card .classic-card-single {
    margin: 0 8px;
}

#card .classic-card {
    position: relative;
    text-align: center;
}

.classic-card .classic-inner-box {
    display: block;
    position: relative;
}

.classic-card .classic-image-box {
    overflow: hidden;
    display: block;
    position: relative;
}

.classic-card .classic-image-box .image {}

.classic-card .classic-image-box img {
    display: block;
    object-fit: cover;
    width: 100%;
    height: 550px;
    border-radius: 20px;
}

.classic-card .classic-overlay-box {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #222632;
    outline: double 5px #4e433c;
    outline-offset: -25px;
    border-radius: 20px;
    padding: 45px 45px 45px 45px;
    color: #a0774d;
    opacity: 1;
    transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    bottom: -100%;
    left: 0;
}

.classic-card:hover .classic-overlay-box {
    bottom: 0;
}

.classic-card .classic-overlay-content {
    /*display: table-cell;*/
    vertical-align: middle;
    position: relative;
}

.classic-card h4.classic-card-title {
    font-size: 20px;
    font-weight: bold;
}

.classic-card h4.classic-card-title a {
    color: #af8451;
}

.classic-card .classic-card-text {}

.classic-card .classic-card-text p {
    color: #ffe7ce;
}

.classic-card a.classic-card-readmore {
    font-size: 14px;
    font-weight: 600;
    color: #ab8250;
}

.classic-card a.classic-card-readmore:hover {
    color: #fff;
}

@media (max-width: 992px) and (min-width: 767px) {
    #card .col-md-4 {
        width: 100%;
        margin-bottom: 3em;
    }
    #card .col-md-4.last {
        margin-bottom: 0;
    }
    .classic-card .classic-image-box img {
        height: 350px;
    }
}

@media (max-width: 767px) {
    #card .col-md-4 {
        margin-bottom: 3em;
    }
    #card .col-md-4.last {
        margin-bottom: 0;
    }
    .classic-card .classic-image-box img {
        height: 350px;
    }
    .classic-card .classic-overlay-box {
        height: auto;
        position: relative;
        bottom: 0;
    }
}

@media (max-width: 600px) {
    .classic-card .classic-card-text p {
        display: none;
    }
}


/***
====================================================================
## Post / Categories-2
====================================================================
***/

#team {
    position: relative;
    padding-top: 3em;
    padding-bottom: 3em;
}

#team .classic-team-block {
    position: relative;
}

#team .classic-team-single {
    padding: 0 22px;
}

@media only screen and (max-width: 992px) {
    #team .classic-team-single {
        padding-left: calc(var(--bs-gutter-x) * .5);
        padding-right: calc(var(--bs-gutter-x) * .5);
    }
}

@media only screen and (max-width: 767px) {
    #team .classic-team-single {
        margin-bottom: 30px;
    }
    #team .classic-team-single.last {
        margin-bottom: 0;
    }
}

#team .classic-team-img {
    overflow: hidden;
    position: relative;
    border-radius: 20px;
}

#team .classic-team-img img {
    object-fit: cover;
    width: 100%;
    height: auto;
    border-radius: 20px;
}

@media only screen and (max-width:990px) and (min-width: 767px) {
    #team .classic-team-img img {
        object-fit: cover;
        width: 100%;
        height: 300px;
    }
}

#team .classic-team-img .classic-team-area {
    text-align: center;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    padding: 25% 5%;
    transition: all 0.3s ease 0s;
    z-index: 1;
}

@media only screen and (max-width:990px) and (min-width: 767px) {
    #team .classic-team-img .classic-team-area {
        padding: 20% 5%;
    }
}

#team .classic-team-img:hover .classic-team-area {
    opacity: 1;
}

#team .classic-team-img h4.classic-team-name {
    margin: 0;
    padding: 0;
    font-size: 20px;
    font-weight: bold;
}

#team .classic-team-img h4.classic-team-name a {
    color: #fff;
}

#team .classic-team-img:before,
#team .classic-team-img:after,
#team .classic-team-img .classic-team-area:before,
#team .classic-team-img .classic-team-area:after {
    position: absolute;
    content: "";
    width: 50%;
    height: 50%;
    background: rgb(0 0 0 / 70%);
    opacity: 0;
    top: 0;
    left: 0;
    transition: all 0.5s ease 0s;
}

#team .classic-team-img:after {
    top: 50%;
}

#team .classic-team-img .classic-team-area:before,
#team .classic-team-img .classic-team-area:after {
    top: 0;
    left: 50%;
    z-index: -1;
}

#team .classic-team-img .classic-team-area:after {
    top: 50%;
}

#team .classic-team-img:hover:before {
    left: 50%;
    opacity: 1;
}

#team .classic-team-img:hover:after {
    top: 0;
    opacity: 1;
}

#team .classic-team-img:hover .classic-team-area:before {
    top: 50%;
    opacity: 1;
}

#team .classic-team-img:hover .classic-team-area:after {
    left: 0;
    opacity: 1;
}


/***
====================================================================
## Content Link
====================================================================
***/

#testimonials {
    position: relative;
    padding: 4em 0;
    padding-top: 0;
}

#testimonials .classic-section-head {
    position: relative;
    margin: 0 8em 2em;
}

#testimonials .classic-section-head h2 {}

#testimonials .classic-testimonial-block {}

#testimonials .item {}

#testimonials .classic-testimonials-single {
    padding: 0 8em;
}

#testimonials .classic-testimonials-area {}

#testimonials .classic-testimonials-image {}

#testimonials .classic-testimonials-image img {
    object-fit: cover;
    width: 100%;
}

#testimonials .col-lg-8.col-md-6 {
    -ms-flex-item-align: center;
    align-self: center;
}

#testimonials .classic-testimonials-content {
    position: relative;
}

#testimonials .classic-testimonials-content p {
    margin: 0;
}

@media only screen and (max-width:992px) {
    #testimonials .classic-section-head {
        margin: 0 4em 1.5em;
    }
    #testimonials .classic-testimonials-single {
        padding: 0 4em;
    }
}

@media only screen and (max-width:767px) {
    #testimonials .classic-section-head {
        margin: 0 0 1.5em;
    }
    #testimonials .classic-testimonials-single {
        padding: 0;
    }
    #testimonials .classic-testimonials-image {
        margin-bottom: 20px;
    }
}


/***
====================================================================
## Single Header
====================================================================
***/

.single .header-image .page-header {
    position: relative;
    margin-bottom: 6%;
    z-index: 999;
}

.single .header-image .page-header h1 {
    margin: 0;
    font-size: 32px;
    font-weight: normal;
    color: #fff;
}

@media screen and (max-width: 767px) {
    .single .header-image .page-header h1 {
        text-align: center;
        font-size: 28px;
    }
}

.contentsecwrap {
    clear: both;
    padding: 25px 0;
}


/***
====================================================================
## Single Post
====================================================================
***/

.site-main {}

article.single-post {}

article.single-post .entry-content {}

article.single-post .entry-content h2 {
    font-size: 20px;
    font-weight: bold;
}

article.single-post .entry-content p {}

@media screen and (max-width: 992px) {
    article.single-post {
        margin-bottom: 50px;
    }
}


/***
====================================================================
## Sidebar
====================================================================
***/

#sidebar {}

#sidebar .widget {
    margin-bottom: 30px;
    padding: 20px;
    border: solid 1px #019ee2;
    border-radius: 5px;
}

#sidebar .widget:last-child {}

#sidebar .widget h3.widget-title {
    position: relative;
    font-size: 20px;
    font-weight: bold;
}

#sidebar .widget h3.widget-title a {
    color: #333;
}

#sidebar .widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#sidebar .widget ul li {
    margin: 0;
    padding: 10px 0 10px 0;
    border-bottom: dashed 1px #d0cfcf;
}

#sidebar .widget ul li:last-child {
    border-bottom: none;
}

#sidebar .widget ul li a {
    display: inline-block;
    font-size: 16px;
    font-weight: normal;
    color: #333;
}

#sidebar .widget ul li a:hover,
#sidebar .widget ul li:hover a {
    color: #95652d;
}


/***
====================================================================
## Footer
====================================================================
***/

#footer {
    padding: 6em 0 3rem;
    background-color: #262626;
    clip-path: polygon(33% 0, 100% 5%, 100% 100%, 0 100%, 0 5%);
}

.footer-content {
    padding-top: 3rem;
    border-top: solid 1px rgb(185, 185, 185);
}

.copywrap {
    text-align: center;
    font-size: 14px;
    font-weight: normal;
    color: #fff;
}

.copywrap a {
    color: #fff;
}


/***
====================================================================
## End CSS
====================================================================
***/
img {
    border: none;
    margin: 0;
    padding: 0;
    height: auto;
    max-width: 100%;
}

ol,
ul {
    margin: 0;
    padding: 0;
}

.sticky,
.aligncenter {
    margin: 0;
    padding: 0;
    max-width: 100% !important;
}

.sticky {
    background: #ededed;
}

.entry-content ol li,
.entry-content ul li {
    margin-left: 15px;
}

ul li ul,
ul li ul li ul,
ol li ol,
ol li ol li ol {
    margin-left: 10px;
}

.clear {
    clear: both;
}

.alignnone {
    width: 100% !important;
}

img.alignleft,
.alignleft {
    float: left;
    margin: 0 15px 0 0;
    padding: 5px;
    border: 1px solid #cccccc;
}

img.alignright,
.alignright {
    float: right;
    margin: 0 0 0 15px;
    padding: 5px;
    border: 1px solid #cccccc;
}

.left {
    float: left;
}

.right {
    float: right;
}

/* Text meant only for screen readers. */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: #eee;
    clip: auto !important;
    clip-path: none;
    color: #444;
    display: block;
    font-size: 1em;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}

.entry-summary p a {
    text-decoration: none;
    color: #444;
}

/* = wide block css
-------------------------------------- */
.alignwide {
    margin-left: -80px;
    margin-right: -80px;
}

.alignfull {
    margin-left: calc(-100vw / 2 + 100% / 2);
    margin-right: calc(-100vw / 2 + 100% / 2);
    max-width: 100vw;
}

.alignfull img {
    width: 100vw;
}

/* = top header css
-------------------------------------- */
h1.site-title {
    font-size: 35px;
    margin: 0;
    text-transform: uppercase;
}

h1.site-title a {
    color: #fff;
    font-weight: bold;
}

h1.site-title a:hover {
    text-decoration: unset;
}

span.site-description {
    font-size: 16px;
    font-weight: 600;
    color: #222;
}

.listarticle h2 a:hover,
#sidebar ul li a:hover {
    color: #262626;
}

.center-align {
    align-self: center;
}

.social-icons {
    text-align: right;
}

.social-icons i {
    color: #222;
    font-size: 20px;
}

.header-inner-box {
    position: absolute;
    top: 50%;
    left: 43%;
    width: 620px;
    margin-left: -513px;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 3;
}

.page-header span,
.page-header span a {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
}


/*----------------------------------------*/
/*  About Area
/*----------------------------------------*/
.space-block {
    padding: 3em;
}

.home #about .about-overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000;
    opacity: 1;
    background-size: cover;
}

.home #about .classic-section-head h3 {
    color: #021348;
}

.home #about .classic-section-area-textlist ul {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-bottom: 2em;
}

.home #about .classic-section-area-textlist ul li,
.home #about .classic-section-area-textlist {
    color: #3a3839;
    font-size: 20px;
    font-weight: 500;
    word-break: break-word;
    line-height: 20px;
    margin-bottom: 15px
}

.home #about .classic-section-area-textlist ul li:before {
    content: "\f1e3";
    font-family: 'Fontawesome';
    margin-right: 15px;
    transform: scale(1);
    transition: all 0.5s ease 0s;
    color: #d0150f;
    display: inline-block;
    margin-bottom: 0;
    font-size: 17px;
    padding: 3px;
}

.home #about .classic-success-b {
    padding: 8px;
}

.home #about .classic-success-single {
    box-shadow: 0px 0px 12px 1px #efefef;
    padding: 20px 18px;
}

.home #about .classic-success-single:hover {
    box-shadow: 0px 1px 12px 5px #e2e2e2;
    background: #fff;
}


/*----------------------------------------*/
/*  Card Area
/*----------------------------------------*/
.home #card .classic-section-head h2 {
    color: #ec8034;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}

.home #card .classic-section-head h3 {
    color: #46567b;
    font-size: 40px;
    font-weight: 600;
    word-break: break-word;
    line-height: 50px;
}

.home div#card .classic-section-head {
    position: relative;
    margin: 0 10em 3em;
}

.classic-card .classic-overlay-box .overlay-inner {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: table;
    vertical-align: middle;
    padding: 20px 30px 20px 90px;
}


/*----------------------------------------*/
/*  Team Area
/*----------------------------------------*/
.home #team .team-overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000;
    opacity: 1;
    background-size: cover;
}

.home #team .classic-section-head h2 {
    color: #ec8034;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}


/*----------------------------------------*/
/*  Testimonials Area
/*----------------------------------------*/
.home #testimonials .testimonials-overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #000;
    opacity: 1;
    background-size: cover;
}

/* = header css
-------------------------------------- */

.header {
    background: transparent;
    position: absolute;
    width: 100%;
    z-index: 9999;
    padding: 0;
}

/* = menus css
-------------------------------------- */
.main-nav ul ul {
    display: none;
    position: absolute;
    background: #00b9d5;
    min-width: 250px;
    z-index: 9999;
    line-height: 30px;
    margin: 0;
    top: 100%;
}

.main-nav ul ul ul {
    left: 100%;
    top: 0%;
}

.main-nav ul ul a {
    color: #fff;
    border: none;
    padding: 5px 10px;
}

.main-nav ul ul a:hover {
    background: #019ee2;
    color: #262626;
}

.main-nav ul ul li {
    float: none;
    display: block;
    text-align: left;
    border-left: none;
    border-right: none !important;
    padding: 0;
    border-bottom: solid 1px #262626;
}

.main-nav ul li:hover>ul {
    display: block;
}

.main-nav .menu>ul>li.highlight {
    background-color: #006ccc;
}

.main-nav .menu>ul>li.highlight:hover {
    background: transparent;
}

.sf-arrows ul .sf-with-ul:after {
    margin-top: -5px;
    margin-right: -3px;
    border-color: transparent;
    border-left-color: #888;
}

.sf-arrows ul li>.sf-with-ul:focus:after,
.sf-arrows ul li:hover>.sf-with-ul:after,
.sf-arrows ul .sfHover>.sf-with-ul:after {
    border-left-color: #333;
}

/* Footer */
#footer h2 {
    color: #fff;
}

#footer ul li a {
    color: #fff;
}

#footer .widget {
    color: #fff;
}

#footer aside.widget .textwidget p {
    font-size: 16px;
    color: #c9c9c9;
    font-weight: 400;
}

#footer .menu-item {
    margin: 10px 0;
}

#footer .menu-item a {
    color: #fff !important;
    text-decoration: none;
    font-size: 17px;
    font-weight: 300;
}

#footer .menu-item a::before {
    content: "\f005";
    font-family: 'Fontawesome';
    font-size: 11px;
    color: #fff;
    margin-right: 10px;
}

/* = Page lay out css
-------------------------------------- */
.listarticle {
    margin-bottom: 30px;
    padding: 20px;
    border-radius: 5px;
    border: solid #019ee2;
}

.listarticle h2 a {
    color: #262626;
}

.single_title {
    margin-bottom: 15px;
    font-size: 20px;
}

.post-thumb {
    margin: 0 0 15px 0;
}

/* = sidebar
---------------------------------------------- */
label {
    margin-bottom: 0;
}

#sidebar.left {
    float: left;
}

#sidebar table {
    width: 100%;
    text-align: center;
}

#sidebar select {
    width: 100%;
    padding: 10px;
    background: transparent;
    border: solid 2px #262626;
}

#sidebar input[type="text"] {
    border: solid 2px #262626;
    padding: 10px;
    width: 100%;
    margin-bottom: 10px;
}

.textwidget select,
table {
    width: 100%;
}

/* = Footer css
------------------------------------------- */
.ftr-4-box h3,
.ftr-4-box h2 {
    font-size: 25px;
    color: #fff;
    margin-bottom: 25px;
    border-bottom: 1px solid #303030;
    padding: 15px 0;
}

.ftr-4-box ul {
    margin: 0;
    padding: 0;
    list-style: inside disc;
}

.ftr-4-box ul li {
    display: block;
    padding: 6px 0;
}

.ftr-4-box ul li a,
.ftr-4-box a {
    color: #ffffff;
}

.ftr-4-box a:hover {
    color: #019ee2;
}

.ftr-4-box p {
    margin-bottom: 15px;
}

#footer select {
    height: auto;
}

/* Mobile */
@media screen and (min-width: 320px) and (max-width: 520px) {
    .home .header {
        position: static !important;
        background: #262626 !important;
    }

    .social-icons {
        text-align: center;
    }

    .slider-box h3 {
        font-size: 20px;
    }

    .slider-box {
        right: 10%;
        left: 10%;
        text-align: center;
    }

    h1.site-title {
        font-size: 28px;
    }
}

/* Mobile Portrait View */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .home .header {
        position: static !important;
        background: linear-gradient(0deg, #086ad9, #00bcd4 80%) no-repeat;
    }
}

@media screen and (max-width: 1200px) {
    .header-inner-box {
        margin-left: 0;
        left: 20%
    }
}

@media screen and (max-width: 1000px) {
    .toggle-nav span {
        font-size: 30px;
        cursor: pointer;
        text-align: right;
    }

    .main-nav ul ul li,
    .menubar .nav ul li {
        display: block;
    }

    .main-nav ul li ul li a:before {
        content: "\00BB \00a0";
    }

    .main-nav ul.sub-menu a:hover {
        padding-left: 20px !important;
    }

    .main-nav ul ul {
        position: static;
        width: 100%;
        background: transparent;
        border-top-width: 0px;
        border-bottom-width: 0px;
        box-shadow: none;
    }

    .main-nav ul ul a {
        border-bottom: none;
        padding-left: 40px;
    }

    .main-nav ul ul ul.sub-menu a {
        padding-left: 40px;
    }

    .main-header-box {
        padding-bottom: 15px;
    }

    .main-nav ul.sub-menu>li>a:before {
        content: unset;
    }

    .main-nav ul.sub-menu>li>a:hover:before {
        opacity: 0;
        left: 0px;
        width: 0px;
    }
}


@media screen and (max-width: 992px) {
    .header-inner-box {
        margin-left: 0;
        margin-right: 0;
        padding-left: 20px;
        padding-right: 20px;
        left: 0%;
        width: 100%;
    }

    @media screen and (max-width: 767px) {
        .header-inner-box {
            top: 60%;
        }
    }
}