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

    Mackbeth
    v 1.0
    by ShakespeareThemes
    shakespearethemes@gmail.com

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


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

    TABLE OF CONTENT

    1.) General
    2.) Typography
    3.) Components
    4.) Header
    5.) Main Slider
    6.) Core
    7.) Homepage
    8.) Page Types
    9.) Sidebar
    10.) Twitter Feed
    11.) Bottom
    12.) Footer
    13.) Responsive

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


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

    1.) GENERAL

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

body { color: #99a4aa; background: #3e454d; }
a { color: #0084FF; font-weight: 400;}
a:hover { color: #ec6267; }

#respond,
.default-form { color: #99a4aa; background: #ededed; }
#respond h3 a,
.default-form h3 a { color: #0084FF; }
#respond h3 small a,
.default-form h3 small a { color: #667279; }
#respond input, #respond textarea,
.default-form input, .default-form textarea { color: #667279; background: #FFF; }
#respond p .error-ico,
.default-form p .error-ico { color: #D40041; }
#respond #submit,
.default-form #submit { color: #FFF; background: #ec6267; }
#respond #submit:hover,
.default-form #submit:hover { background: #232c31; }

.color-1 { color: #fff; }
.color-1-bg { background-color: #fff; }
.color-2 { color: #ec6267; }
.color-2-bg { background-color: #ec6267; }
.color-3 { color: #F68E56; }
.color-3-bg { background-color: #F68E56; }
.color-4 { color: #7CC576; }
.color-4-bg { background-color: #7CC576; }
.color-5 { color: #99A4AA; }
.color-5-bg { background-color: #99A4AA; }
.color-6 { color: #232c31; }
.color-6-bg { background-color: #232c31; }
.color-7 { color: #0084FF; }
.color-7-bg { background-color: #0084FF; }


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

    2.) TYPOGRAPHY

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

    /* -------------------------------------------------------------------------
        HEADINGS
    ------------------------------------------------------------------------- */

    .various-content h1, .various-content h2,
    .various-content h3, .various-content h4,
    .various-content h5, .various-content h6 { color: #667279; }

    /* -------------------------------------------------------------------------
        LISTS
    ------------------------------------------------------------------------- */

    ul.check-list .icon-ok { color: #7cc576; }
    ul.check-list .icon-remove { color: #ec6267; }

    /* -------------------------------------------------------------------------
        TABLE
    ------------------------------------------------------------------------- */

    .various-content table th { color: #667279; background: #f3f3f3; }
    .various-content table td,
    .various-content table th { border-color: #dce3e6; }


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

    3.) COMPONENTS

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

    /* -------------------------------------------------------------------------
        ACCORDION
    ------------------------------------------------------------------------- */

    .accordion .accordion-item { background: #f3f3f3; border-color: #e8e8e8; }
    .accordion .accordion-toggle { color: #667279; }

    /* -------------------------------------------------------------------------
        ALERT MESSAGES
    ------------------------------------------------------------------------- */

    p.alert.warning { color: #d40041; background: #ffdfe0; border-color: #ffa5c1; }
    p.alert.success { color: #499143; background: #d4fbd3; border-color: #bcdcb9; }
    p.alert.info { color: #0084ff; background: #d3effb; border-color: #b9d2ed; }
    p.alert.notification { color: #f68e56; background: #fffbd7; border-color: #f7dfd2; }

    /* -------------------------------------------------------------------------
        BUTTON PAGINATION
    ------------------------------------------------------------------------- */

    .button-pagination a { color: #FFF; background: #afbbc1; }
    .button-pagination a.loading,
    .button-pagination a:hover { background: #99a4aa; }

    /* -------------------------------------------------------------------------
        BUTTONS
    ------------------------------------------------------------------------- */

    .button.style1 { color: #FFF; background: #ec6267; }
    .button.style1:hover { background: #232c31; }
    .button.style2 { color: #FFF; background: #7cc576; }
    .button.style2:hover { background: #232c31; }
    .button.style3 { color: #FFF; background: #0084ff; }
    .button.style3:hover { background: #232c31; }
    .button.style4 { color: #FFF; background: #f68e56; }
    .button.style4:hover { background: #232c31; }
    .button.style5 { color: #FFF; background: #99a4aa; }
    .button.style5:hover { background: #232c31; }
    .button.style6 { color: #FFF; background: #2f3639; }
    .button.style6:hover { background: #3e454d; }
    .button.style7 { color: #FFF; background: #c0003b; }
    .button.style7:hover { background: #3e454d; }
    .button.style8 { color: #9BA5AA; background: #FFF; }
    .button.style8:hover { background: #ededed; }

    /* -------------------------------------------------------------------------
        CTA MESSAGE
    ------------------------------------------------------------------------- */

    .cta-message { color: #FFF; background: #afbbc1; }
    .cta-message h2,
    .cta-message a { color: #FFF; }

    /* -------------------------------------------------------------------------
        DIVIDER
    ------------------------------------------------------------------------- */

    hr.divider { border-color: #ededed; }

    /* -------------------------------------------------------------------------
        DEFINITION LIST
    ------------------------------------------------------------------------- */

    dl.custom dt { color: #3e454d; }

    /* -------------------------------------------------------------------------
        FEATURE
    ------------------------------------------------------------------------- */

    .feature h3 { color: #667279; }

    /* -------------------------------------------------------------------------
        LIST SLIDER
    ------------------------------------------------------------------------- */

    .list-slider-nav button { color: #FFF; background: #afbbc1; }
    .list-slider-nav button.disabled { background: #ededed; }

    /* -------------------------------------------------------------------------
        LOADING ANIMATION
    ------------------------------------------------------------------------- */

    .loading-anim span { background: #282E31; background: rgba(0,0,0,.4); }
    .loading-anim i { color: #FFF; }

    /* -------------------------------------------------------------------------
        PAGINATION
    ------------------------------------------------------------------------- */

    .pagination li a { color: #afbbc1; }
    .pagination li a:hover { color: #FFF; background: #afbbc1; }
    .pagination li.active span,
    .pagination .current { color: #FFF; background: #ec6267; }

    /* -------------------------------------------------------------------------
        PROGRESS BARS
    ------------------------------------------------------------------------- */

    .progressbar { color: #FFF; background: #ededed; }
    .progressbar.color1 .inner { background: #0084ff; }
    .progressbar.color2 .inner { background: #f68e56; }
    .progressbar.color3 .inner { background: #7cc576; }
    .progressbar.color4 .inner { background: #ec6267; }

    /* -------------------------------------------------------------------------
        PROJECT PREVIEW
    ------------------------------------------------------------------------- */

    .project-preview { border-color: #ededed; }
    .project-preview .thumb .overlay .lightbox { color: #FFF; background: #ec6267; }
    .project-preview .thumb .overlay .link { color: #99a4aa; background: #FFF; }
    .project-preview h3 a { color: #afbbc1; }
    .project-preview h3 a:hover { color: #545d61; }
    .project-preview .date { color: #afbbc1; }

    /* -------------------------------------------------------------------------
        SEARCH FORM
    ------------------------------------------------------------------------- */

    .search-form form > div { border-color: #e2e2e2; }
    .search-form form input { color: #9DB1BA; }
    .search-form button i { color: #ec6267; }

    /* -------------------------------------------------------------------------
        SECTION TITLE
    ------------------------------------------------------------------------- */

    .section-title { color: #667279; }
    .section-title strong { color: #afbbc1; }

    /* -------------------------------------------------------------------------
        SERVICE
    ------------------------------------------------------------------------- */

    .service { border-color: #ededed; }
    .service h2 { color: #232c31; }

    /* -------------------------------------------------------------------------
        TABS
    ------------------------------------------------------------------------- */

    .tabs .tab { color: #667279; background: #f3f3f3; border-color: #e8e8e8; }
    .tab-content .item { border-color: #e8e8e8; }
    .tabs .tab.active { border-bottom-color: #FFF; }


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

    4.) HEADER

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

    /* -------------------------------------------------------------------------
        LANGBAR
    ------------------------------------------------------------------------- */

    #langbar { color: #FFF; background: #212121; }
    #langbar a { color: #a3a3a3; }

    /* -------------------------------------------------------------------------
        TOPBAR
    ------------------------------------------------------------------------- */

    #topbar { background: #2f3639; }

    .responsive-controls button,
    .responsive-controls .close,
    #topbar .top-search-form .input button,
    #topbar .top-search-form .input .close,
    #topbar .top-search-form button.submit,
    #topbar .social-icons li a { color: #FFF; background: #282e31; }

    .responsive-controls button.active,
    #topbar .top-search-form button.submit.active,
    #topbar .top-search-form button.submit:hover,
    #topbar .top-search-form .input button:hover,
    #topbar .top-search-form .input .close:hover,
    #topbar .social-icons li a:hover { color: #FFF; background: #ec6267; }

    /* SEARCH */

    #topbar .top-search-form input { color: #99a4aa; }

    /* -------------------------------------------------------------------------
        NAVBAR
    ------------------------------------------------------------------------- */

    #navbar { background: #3e454d; }

    /* MAIN NAV */

    nav.main .indicator { background: #5e6771; height:90px; border-bottom: 5px solid #ec6267; margin-left: -10px; padding-right:20px;}
    /* lvl 1 */
    nav.main > ul > li > a { color: #FFF; }
    nav.main > ul > li > a span { color: #afbbc1; }
    nav.main > ul > li > .arrow i { color: #ec6267; }
    /* lvl 2 */
    nav.main > ul > li > ul { background: #FFF; }
    nav.main > ul > li > ul li { border-color: #ededed;}
    nav.main > ul > li > ul a { color: #99a4aa; }
    nav.main > ul > li > ul a:hover { color: #FFF; background: #afbbc1; }
    /* lvl 3 */
    nav.main > ul ul ul { background: #FFF; }
    nav.main > ul ul ul li { border-color: #ededed;}
    nav.main > ul ul ul a { color: #99a4aa; }
    nav.main > ul ul ul a:hover { color: #FFF; background: #afbbc1; }

    /* responsive btn */
    nav.main > button { color: #99a4aa; background: #282e31; }
    nav.main > button.active { color: #FFF; background: #ec6267; }


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

    5.) MAIN SLIDER

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

.st-slider { background: #2f3639; }

    /* -------------------------------------------------------------------------
        ITEMS
    ------------------------------------------------------------------------- */

    .st-slider .carousel-inner .item { color: #FFF; }
    .st-slider .various-content h1, .st-slider .various-content h2,
    .st-slider .various-content h3, .st-slider .various-content h4,
    .st-slider .various-content h5, .st-slider .various-content h6 { color: #FFF; }

    /* -------------------------------------------------------------------------
        CONTROLS
    ------------------------------------------------------------------------- */

    .st-slider .nav button,
    .st-slider button.pause { color: #FFF; background: #3e454d; }
    .st-slider .nav button:hover,
    .st-slider button.pause:hover { background: #232c31; }
    .st-slider button.pause.paused { background: #dc114b; }

    /* -------------------------------------------------------------------------
        INDICATOR
    ------------------------------------------------------------------------- */

    .st-slider .indicator .progressbar { background: #ec6267; }

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

    6.) CORE

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

    #core { background: #FFF; }

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

    7.) HOMEPAGE

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

    /* -------------------------------------------------------------------------
        HEADING SECTION
    ------------------------------------------------------------------------- */

    .heading-section { color: #c7d4db; background: #5e6771; }
    .heading-section strong { color: #FFF; }
    .heading-section a { color: #58666E; }
    .heading-section a:hover { color: #c7d4db; }

    /* -------------------------------------------------------------------------
        HOME SERVICES
    ------------------------------------------------------------------------- */

    .home-services-section { color: #99a4aa; background: #f5f5f5; }
    .home-services-section .service.hover { background: #ffffff; }
    .home-services-section .ico { color: #99A4AA; background: #FFF; }
    .home-services-section .service h2 { color: #58666e; }
    .home-services-section a { color: #0084FF; }

    /* -------------------------------------------------------------------------
        RECENT ARTICLES
    ------------------------------------------------------------------------- */

    section.recent-articles article .article-title { border-color: #ededed; }
    section.recent-articles article .article-title a { color: #667279; }
    section.recent-articles article .article-title a:hover { color: #545d61; }
    section.recent-articles article .article-date { color: #afbbc1; }

    /* -------------------------------------------------------------------------
        BOTTOM BANNERS
    ------------------------------------------------------------------------- */

    .home-page .bottom-banners { border-color: #ededed; }


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

    8.) PAGE TYPES

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

    /* -------------------------------------------------------------------------
        PAGE TITLE
    ------------------------------------------------------------------------- */

    #page-title { color: #FFF; background-color: #5e6771; }

    /* -------------------------------------------------------------------------
        404 PAGE
    ------------------------------------------------------------------------- */

    .error404-page .various-content *,
    .error404-page input { color: #9db1ba; }
    .error404-page .various-content h2 { color: #9db1ba; background-color: #f4f4f4; }
    .error404-page .various-content a { color: #ec6267; }

    /* -------------------------------------------------------------------------
        ABOUT PAGE
    ------------------------------------------------------------------------- */

    /* ABOUT TEAM */

    .team-member { border-color: #ededed; }
    .team-member .thumb a i { color: #FFF; }
    .team-member .thumb .twitter { background: #0084ff; }
    .team-member .thumb .facebook { background: #004ae0; }
    .team-member .thumb .gplus { background: #ec6267; }
    .team-member .thumb .linkedin { background: #5674b9; }
    .team-member h3 { color: #ec6267; }
    .team-member h4 { color: #afbbc1; }

    /* -------------------------------------------------------------------------
        BLOG PAGE
    ------------------------------------------------------------------------- */

    .sticky { background: #f1f5f7; border-color: #dae9ef; }

    /* ARTICLE TITLE */

    .blog-page .article-title,
    .blog-page .article-title a { color: #667279; }
    .blog-page .article-title a:hover { color: #99a4aa; }
    .blog-page .article-title .date { color: #afbbc1; }
    .blog-page .article-title { border-color: #e5e5e5; }

    /* AUDIO ARTICLE */

    article.audio .audio-player { background: #000; }
    article.audio .audio-player .ico { color: #FFF; background: #0084ff; }

    /* IMAGE ARTICLE */

    article.image .article-image .ico { color: #FFF; background: #ec6267; }

    /* LINK ARTICLE */

    article.link .article-link a { color: #667279; }
    article.link .article-link { background: #ededed; }
    article.link .article-link .ico { color: #FFF; background: #7cc576; }

    /* QUOTE ARTICLE */

    article.quote .article-quote { color: #667279; border-color: #ededed; }
    article.quote .article-quote .source { color: #afbbc1; }
    article.quote .article-quote .ico { color: #FFF; background-color: #e4a656; }

    /* ARTICLE LIST */

    .blog-page .article-list .article-content { border-color: #e5e5e5; }

    /* -------------------------------------------------------------------------
        ARTICLE COMMENTS
    ------------------------------------------------------------------------- */

    /* COMMENT LIST */

    .bypostauthor { background: #f1f5f7; }
    .article-comments .comment-author { color: #667279; }
    .article-comments .comment-author a { color: #ec6267; }
    .article-comments .comment-meta a { color: #99a4aa; }
    .article-comments .comment-tools a { color: #0084FF; }

    /* -------------------------------------------------------------------------
        CONTACT PAGE
    ------------------------------------------------------------------------- */

    /* CONTACT FORM */

    .contact-form { background: #ededed; border-color: #FFF; }
    .contact-form .section-title { color: #667279; }
    .contact-form .section-title strong { color: #afbbc1; }
    .contact-form input,
    .contact-form textarea { color: #667279; background: #FFF; }
    .contact-form .error-ico { color: #D40041; }

    /* -------------------------------------------------------------------------
        PORTFOLIO PAGE
    ------------------------------------------------------------------------- */

    /* PORTFOLIO CATEGORIES */

    .portfolio-page .portfolio-categories { background: #5e6771; }
    .portfolio-page .portfolio-categories a { color: #FFF; background: #7f94a0; margin-top:20px;}
    .portfolio-page .portfolio-categories a:hover,
    .portfolio-page .portfolio-categories .current-cat a { color: #ffffff; background: #ec6267; }

    /* PROJECT AUDIO */

    .portfolio-page .project-audio .audio-player { background: #000; }

    /* PROJECT DESCRIPTION */

    .portfolio-page .project-description .info { border-color: #e5e5e5; }
    .portfolio-page .project-description .info h3 { color: #667279; }
    .portfolio-page .project-nav, .portfolio-page .project-nav a { color: #FFF; }
    .portfolio-page .project-nav a { background: #afbbc1; }
    .portfolio-page .project-nav span { background: #ededed; }

    /* -------------------------------------------------------------------------
        SEARCH RESULTS PAGE
    ------------------------------------------------------------------------- */

    .search-results-page h2,
    .search-results-page h2 a { color: #667279; }


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

    9.) SIDEBAR

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

    /* -------------------------------------------------------------------------
        WIDGETS
    ------------------------------------------------------------------------- */

    #sidebar .widget h3,
    #sidebar .widget h3 a { color: #667279; }

    #sidebar .widget .widget-content > ul > li,
    #sidebar .widget .widget-content > div > ul > li { border-color: #e5e5e5; }
    #sidebar .widget .widget-content a { color: #9DB1BA; }
    #sidebar .widget .widget-content a:hover { color: #101010; }

    /* links type 2 */

    #sidebar .widget.widget_recent_comments li a,
    #sidebar .widget.widget_recent_entries li a,
    #sidebar .widget.widget_rss li a,
    #sidebar .widget.widget_tag_cloud a { color: #118cff; }
    #sidebar .widget.widget_recent_comments li a:hover,
    #sidebar .widget.widget_recent_entries li a:hover,
    #sidebar .widget.widget_rss li a:hover,
    #sidebar .widget.widget_tag_cloud a:hover { color: #101010; }

    /* count */

    #sidebar .widget.widget_archive .widget-content > ul > li,
    #sidebar .widget.widget_categories .widget-content > ul > li,
    #sidebar .widget.widget_links li { color: #ec6267; }

    /* selectbox */

    #sidebar .widget .selectbox button { color: #99a4aa; }
    #sidebar .widget .selectbox { background: #eaf1f4; }
    #sidebar .widget .selectbox li a { color: #99a4aa; }
    #sidebar .widget .selectbox li a:hover { color: #101010; }
    #sidebar .widget .selectbox li a span { color: #ec6267; }


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

    10.) TWITTER FEED

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

#twitter-feed { color: #FFF; background: #0084ff; }
#twitter-feed .title,
#twitter-feed button { color: #FFF; }
#twitter-feed a { color: #FFF; }


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

    11.) BOTTOM

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

#bottom { color: #afbbc1; background: #2f3639; }

    /* -------------------------------------------------------------------------
        WIDGETS
    ------------------------------------------------------------------------- */

    #bottom .widget h3, #bottom .widget h3 a { color: #FFF; border-color: #595e61; }
    #bottom .widget h3 span.decor { background: #ec6267; }
    #bottom .widget .widget-content > ul > li,
    #bottom .widget .widget-content > div > ul > li { border-color: #262b2e; }
    #bottom .widget .widget-content a { color: #9DB1BA; }
    #bottom .widget .widget-content a:hover { color: #FFF; }

    /* links type 2 */

    #bottom .widget.widget_recent_comments li a,
    #bottom .widget.widget_recent_entries li a,
    #bottom .widget.widget_rss li a,
    #bottom .widget.widget_tag_cloud a { color: #FFF; }
    #bottom .widget.widget_recent_comments li a:hover,
    #bottom .widget.widget_recent_entries li a:hover,
    #bottom .widget.widget_rss li a:hover,
    #bottom .widget.widget_tag_cloud a:hover { color: #9DB1BA; }

    /* count */

    #bottom .widget.widget_archive .widget-content > ul > li,
    #bottom .widget.widget_categories .widget-content > ul > li,
    #bottom .widget.widget_links li { color: #ec6267; }

    /* selectbox */

    #bottom .widget .selectbox button { color: #99a4aa; }
    #bottom .widget .selectbox { background: #3e454d; }
    #bottom .widget .selectbox li a { color: #808e95; }
    #bottom .widget .selectbox li a:hover { color: #FFF; }
    #bottom .widget .selectbox li a span { color: #ec6267; }

    /* SEARCH WIDGET */

    #bottom .widget.widget_search input#s { color: #99a4aa; }
    #bottom .widget.widget_search form > div { background: #262d30; }
    #bottom .widget.widget_search button i { color: #99a4aa; }

    /* TAGS WIDGET */

    #bottom .widget.widget_tag_cloud a { color: #FFF; border-color: #444a4d; }
    #bottom .widget.widget_tag_cloud a:hover { color: #FFF; border-color: #6e7375; }
    #bottom .widget.widget_tag_cloud a:active { border-color: #444a4d; }


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

    12.) FOOTER

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

footer { color: #b0b0b0; }
footer a { color: #FFF; }
footer a:hover { color: #b0b0b0; }

    /* -------------------------------------------------------------------------
        FOOTER NAV
    ------------------------------------------------------------------------- */

    nav.footer a { color: #b0b0b0; }
    nav.footer .active a,
    nav.footer a:hover { color: #FFF; }
    nav.footer { color: #292f31; }


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

    13.) RESPONSIVE

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

    /* -------------------------------------------------------------------------
        LARGE TABLET
    ------------------------------------------------------------------------- */

    @media (max-width: 979px) {

    /* HEADER */

    /* topbar */
    #topbar .top-search-form { background: #282e31; }

    /* navbar */
    nav.main > ul > li > ul a { color: #99a4aa; background: none; }
    nav.main > ul > li.current-menu-item > a { color: #ec6267; }
    nav.main > ul > li { border-color: #505659; }
    nav.main > ul > li > ul { background: none; }
    nav.main > ul > li > ul a:hover { color: #99a4aa; background: none; }
    nav.main > ul > li > ul ul { background: none; }
    nav.main > ul > li > ul ul a:hover { color: #99a4aa; background: none; }

    }