/*
Theme Name: Pendulum
Theme URI: http://pendulum.rascalsthemes.com
Author: Rascals Themes
Author URI: http://themeforest.net/user/rascals
Description: A responsive Wordpress music theme.
License: GNU General Public License
License URI: https://www.gnu.org/copyleft/gpl.html
Version: 3.1.2
Text Domain: pendulum
Tags:custom-menu, threaded-comments
*/

/*------------------------------------------------------------------


__________                   .___    .__                 
\______   \ ____   ____    __| _/_ __|  |  __ __  _____  
 |     ___// __ \ /    \  / __ |  |  \  | |  |  \/     \ 
 |    |   \  ___/|   |  \/ /_/ |  |  /  |_|  |  /  Y Y  \
 |____|    \___  >___|  /\____ |____/|____/____/|__|_|  /
               \/     \/      \/                      \/          

~ Pendulum by Rascals Themes 2020 ~


/*------------------------------------------------------------------

[Table of contents]

1. Reset & Clearfix
2. Basic Elements & Classes
3. Forms
 3.1 Search Form
4. Helper Classes
5. WordPress Core Styles
6. Layout and Content
 6.1 Container
 6.2 Visual Composer Container
 6.3 Columns
 6.4 Flexible columns
 6.5 Masonry Grid
 6.6 Main
 6.7 Sidebar
 6.8 Slidebar
 6.9 Ajax container and #page
 6.10 Ajax loading layer
7. Header
 7.1 Logo
 7.2 Menu Trigger Button
8. Navigation
 8.1 Main Navigation
9. Paging Navigation 
10. Posts
11. Intro Section
12. Events List
13. Grid Elements
14. Filters
15. Content Section
16. 404 Page
17. Contact Section
18. Section Helpers
19. Fullscreen Template
20. Comments
21. Footer Section
 21.1 Footer Social
 21.2 Footer Note
 21.3 Scroll Button
22. Widgets
23. Custom widgets
24. Elements
25. Plugins
26. MEDIA QUERIES
*/


/* ----------------------------------------------------------------------
  1. Reset & Clearfix
/* ---------------------------------------------------------------------- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, and, address, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, textarea, select {
    background: transparent;
    border: 0;
    font-size: 100%;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}
body {
    line-height: 1
}
abbr[title], dfn[title] {
    border-bottom: 1px dotted;
    cursor: help
}
blockquote, q {
    quotes: none
}
blockquote:before, blockquote:after, q:before, q:after {
    content: none
}
del {
    text-decoration: line-through
}
hr {
    background: transparent;
    border: 0;
    clear: both;
    color: transparent;
    height: 1px;
    margin: 0;
    padding: 0
}
mark {
    background-color: #ffffb3;
    font-style: italic
}
input, select {
    vertical-align: middle
}
ins {
    background-color: red;
    color: white;
    text-decoration: none
}
ol, ul {
    list-style: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}


/* ----------------------------------------------------------------------
  2. Basic Elements & Classes
/* ---------------------------------------------------------------------- */

/* Set box sizing for all elements */
* {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}
body {
    color: #bbb;
    height:100%;
    font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
    width: 100%;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    background: #191919 url(images/bg.jpg) left top repeat;
    background-size: cover;
}

::-moz-selection {
    background: #0099cc;
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #0099cc;
    color: #fff;
    text-shadow: none;
}
h1, h2, h3, h4, h5, h6 {
    color: #fff;
    font-weight: 300;
    line-height: 1.2;
    margin-bottom: 20px;
    letter-spacing: 0.05em;
    font-family: "Oswald", Helvetica, Arial, sans-serif;
}
a, a > * {
    color: #0099cc;
    text-decoration: none;
    -webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}
a:hover, a > *:hover {
    color: #fff;
}
h1 {
    font-size: 46px;
}
h2 {
    font-size: 38px;
}
h3 {
    font-size: 28px;
}
h4 {
    font-size: 24px;
}
h5 {
    font-size: 22px;
}
h6 {
    font-size: 18px;
}
small {
    font-size: 12px;
}
ol {
    list-style: decimal;
}
ul {
    list-style: disc;
}
ul ul, ul ul ul, ol ol, ol ol ol {
    margin-bottom: 0
}
li {
    margin: 1px 0 1px 30px;
}

img {
}
dl, hr, ol, ul, pre, table, address, fieldset, blockquote, iframe {
    margin-bottom: 30px;
}
p {
    margin-bottom:30px;
}
article {
    margin-bottom: 30px;
}
strong, b {
    font-weight: bold;
}

/* Table */
table {
    width: 100%;
    background: #34363A;
}
table td, table th {
    padding: 15px;
    border: 1px solid #212225;
    text-align: left;
}
table th {
    background: #46474C;
    font-weight: bold;
    color: #fff;
}
table caption {
    padding: 1em 0;
    text-align: center;
}
dt {
    font-weight: bold;
}
dd {
    line-height: 1.4;
    margin: 4px 0 0;
    padding: 0 0 .5em 0;
}

/* Cite */
cite {
    text-align: right;
    font-style: normal;
    color: #666;
    font-weight: 600;
    width: 100%;
    display: inline-block;
}
cite:before {
    content: '\2013 \00A0';
}
cite a {
    font-weight: bold;
    color: #222;
}

/* Definition lists */
dt {
    font-weight: bold;
    color: #ddd;
    font-size: 16px;
}
dd {
    line-height: 1.4;
    margin: 4px 0 0;
    padding: 0 0 .5em 0;
}

/* HTML Tags */
del {
    color: red;
    text-decoration: line-through;
}
em, i {
    font-style: italic;
}
strong, b {
    font-weight: bold;
}
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
    bottom: -0.25em;
}
abbr, acronym {
    border-bottom: 1px dotted;
}
address {
    margin: 0 0 1.5em;
    font-style: italic;
}
code, kbd, pre, samp, tt {
    font: 0.8em 'Andale Mono', 'Lucida Console', monospace;
}
pre, code {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    background: #46474C;
    border: 1px solid #57585F;
    color: #FFF;
    padding: 2px 4px;
    font-size: 14px;
}
pre { 
    white-space: pre;
    word-wrap: normal;
    overflow-x: scroll;
    line-height: 1.3;
    padding: 15px;
}

/* Blockquote */
.single-post .main.thin blockquote {
    margin-right:-24px;
    margin-left:-24px;
}
blockquote {
    position: relative;
    /* background: #303033; */
}

blockquote p {
    padding: 10px 20px;
    font-size: 18px;
    line-height: 1.7em;
    color: #fff;
    margin-bottom: 0;
    border-left: 4px solid #eee;
    font-style: italic;
    font-weight: 300;
    font-family: "Oswald";
}
blockquote .author {
    color: #222;
}
blockquote .author:before {
    content: "-";
    display: inline-block;
    margin: 0 4px 0 2px;
}
blockquote cite a {
    font-weight: bold;
    color: #0099cc;
}
blockquote cite a:hover {
    color: #0099cc;
}

/* Small */
small {
    font-size: 11px
}

/* Img */
img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}


/* ----------------------------------------------------------------------
3. Forms
/* ---------------------------------------------------------------------- */
label {
    cursor: pointer;
    display: block;
    margin: 0 0 5px;
    color: #eee;
    font-weight: 400;
    font-size:15px;
}
*::-webkit-input-placeholder {
    color: 666;
}
*:-moz-placeholder {

    /* FF 4-18 */
    color: 666;
}
*::-moz-placeholder {

    /* FF 19+ */
    color: 666;
}
*:-ms-input-placeholder {

    /* IE 10+ */
    color: 666;
}
input, textarea, select {
    font: 16px/1.8 "Source Sans Pro", Helvetica, Arial, sans-serif;
    background-color: transparent;
    border: none;
    padding: 6px;
    border: 1px solid #555;
    color: #fff;
    background-color: rgba(255, 255, 255, 0.13);
}
input, select {
    outline: none;
    display: inline-block;
    /*     -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; */
    background-color:#333;
    cursor: pointer;
}
select, option {
    cursor: pointer;
}
input, textarea {
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
input:hover, textarea:hover, input:focus, textarea:focus {
}
textarea {
    padding: 10px;
    resize: both;
    width: 100%;
    min-height: 200px;
}
select, option {
    cursor: pointer;
}
select::-ms-expand {
    display: none;
}
input[type="submit"], button {
    -webkit-appearance: none;
    -webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
    transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}
input[type="checkbox"], input[type="radio"] {
    width:auto;
     -webkit-appearance: checkbox !important;
     -moz-appearance: checkbox !important;
     -ms-appearance: checkbox !important;
     -o-appearance: checkbox !important;
     appearance: checkbox !important;
}


/* 3.1 Search Form
 ------------------------------ */

/* Search input */
#searchform {
    position: relative;
    z-index: 1;
}
#searchform fieldset {
    margin-bottom: 0
}
#searchform #s {
    border: 0;
    width: 100%;
    padding: 10px 20px;
    font-size: 16px;
    background-color: transparent;
    color: #eee;
    border: 1px solid #555;
    font-weight: 600;
}
#searchform #s::-webkit-input-placeholder {
    color: #999;
}
#searchform #s:-moz-placeholder {
    color: #999;
}
#searchform #s:-ms-input-placeholder {
    color: #999;
}
#searchform #searchsubmit {
    position: absolute;
    border: none;
    right: 10px;
    top: 15px;
    background: transparent;
    width: 20px;
    cursor: pointer;
    padding: 0;
}
#searchform #searchsubmit i {
    color: #999;
    transition: all 0.5s ease-out;
    font-size: 18px;
}
#searchform #searchsubmit i:hover {
    color: #0099cc;
}
#search-404 #searchform #searchsubmit i {
    font-size: 20px;
    position: relative;
    top: 5px
}


/* ----------------------------------------------------------------------
  4. Helper Classes
/* ---------------------------------------------------------------------- */
.hidden {
    display: none;
}
.custom-ul li{ 
    padding:5px 0; 
}
.disabled {
    cursor: auto;
}
.invisible {
    visibility: hidden;
}
.no-margin {
    margin: 0 !important;
}
.aligncenter {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
img.inline {
    vertical-align: middle;
    max-width: 100%;
}
img.size-1-2 {
    width: 50%;
    height: 50%;
}
img.size-3-4 {
    width: 75%;
    height: 75%;
}
img.aligncenter {
    display: block;
    margin-bottom: 30px;
}
.alignleft, .floatleft {
    float: left !important;
}
img.alignleft {
    margin-bottom: 30px;
    margin-right: 20px;
}
.alignright, .floatright {
    float: right !important;
}
img.alignright {
    margin-bottom: 30px;
    margin-left: 20px;
}
img.frame {
    border: 4px solid #fff;
}
.weight-lighter {
    font-weight: 300
}
.weight-light {
    font-weight: 400
}
.weight-bolder {
    font-weight: 900
}
.text-right {
    text-align: right;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.color {
    color: #0099cc;
}
.white {
    color: #fff !important;
}
.light {
    color: #eee;
}
.dark {
    color: #222;
}
.caps {
    text-transform: uppercase;
}
.clear {
    clear: both;
    display: block;
    height: 1px;
    margin-top: -1px;
    overflow: hidden;
    visibility: hidden;
    width: 0
}
.clearfix:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0
}
* html .clearfix, :first-child+html .clearfix {
    zoom: 1
}
.inlineblock {
    display: inline-block;
}
#qLtempOverlay {
    background-color: #222 !important;
}
.float-left {
    float: left;
}
.float-right {
    float: right;
}
.background-bottom {
    background-position: bottom;
    background-repeat: no-repeat;
}
.background-top {
    background-position: top;
    background-repeat: no-repeat;
}
.background-left {
    background-position: left;
    background-repeat: no-repeat;
}
.background-right {
    background-position: right;
    background-repeat: no-repeat;
}


/* ----------------------------------------------------------------------
  5. WordPress Core Styles
/* ---------------------------------------------------------------------- */
.main .alignfull {
    margin-left  : calc( -100vw / 2 + 100% / 2 );
    margin-right : calc( -100vw / 2 + 100% / 2 );
    max-width    : 100vw;
}
.main .wp-block-cover.alignfull,
.main .wp-block-cover-image.alignfull {
    width:auto;
}
.blog-list .main .alignfull,
.blog-list .main .alignwide,
.alignfull.is-type-video.wp-embed-aspect-16-9 {
    margin-left  :0;
    margin-right :0;
    max-width    : 100vw;
}
.alignnone {
    margin: 5px 20px 20px 0;
}
.aligncenter, div.aligncenter {
    display: block;
    margin: 5px auto;
}
.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}
.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}
.aligncenter {
    display: block;
    margin: 5px auto;
}
a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}
a img.alignnone {
    margin: 5px 20px 20px 0;
}
a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}
a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.wp-caption .wp-caption-text, .gallery-caption, .entry-caption {
    font-size: 12px;
    font-size: 0.857142857rem;
    line-height: 2;
}
.caption-txt {
    font-size: 14px;
}
.wp-caption .wp-caption-text {
    font-size: 14px;
}
.wp-caption {
    margin-bottom: 30px;
    max-width: 100%;
    position: relative;
    color: #777;
}
.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}
.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}
.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0 0 0px 0;
    max-width: 100%;
    padding: 0;
    width: auto;
    vertical-align: middle;
}
.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0;
}
.sticky.post {
    position: relative;
    overflow: hidden;
}
.main .blog-article.post.sticky .article-title:before {
    font-family:"icomoon";
    content: "\e698";
    border-radius:100%;
    width:30px;
    height:30px;
    line-height:30px;
    background-color:#eee;
    text-align:center;
    color:#222;
    font-size:16px;
    display:inline-block;
    margin-right:10px;
    position:relative;
    top:-3px;
}
.main .gallery-item {
    float: left;
}
.main .gallery-item .thumb {
    margin: 0.05em;
}
.main .gallery-item {
    margin 2px;
}
.main .gallery-item img {
    border: none;
    vertical-align: middle;
}
.bypostauthor {
    width: 100%;
}
.gallery {
    margin-bottom: 50px;
    clear: both;
    position: relative;
}
.main.thin .gallery {
    margin-left:-80px;
    margin-right:-80px;
}
.gallery:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0
}
.gallery-item {
    float: left;
    overflow: hidden;
    position: relative;
    max-width: 100%;
}
.gallery-item img {
    max-height: 100%;
    max-width: 100%;
    width: 100%;
}
.gallery-columns-1 .gallery-item {
    width: 100%;
}
.gallery-columns-2 .gallery-item {
    width: 50%;
}
.gallery-columns-3 .gallery-item {
    width: 33.33%;
}
.gallery-columns-4 .gallery-item {
    width: 25%;
}
.gallery-columns-5 .gallery-item {
    width: 20%;
}
.gallery-columns-6 .gallery-item {
    width: 16.66%;
}
.gallery-columns-7 .gallery-item {
    width: 14.285%;
}
.gallery-columns-8 .gallery-item {
    width: 12.5%;
}
.gallery-columns-9 .gallery-item {
    width: 11.111%;
}
.gallery-columns-1.gallery-size-medium figure.gallery-item:nth-of-type(1n+1), .gallery-columns-1.gallery-size-thumbnail figure.gallery-item:nth-of-type(1n+1), .gallery-columns-2.gallery-size-thumbnail figure.gallery-item:nth-of-type(2n+1), .gallery-columns-3.gallery-size-thumbnail figure.gallery-item:nth-of-type(3n+1) {
    clear: left;
}
.gallery-caption {
    background-color: rgba(33, 34, 37, 0.8);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    font-size: 13px;
    line-height: 1.5;
    margin: 0;
    opacity: 0;
    padding: 8px 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    width: 100%;
}
.gallery-caption:before {
    content: "";
    height: 100%;
    min-height: 49px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.gallery-item:hover .gallery-caption {
    opacity: 1;
}
.gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption {
    display: none;
}
.size-auto, .size-full, .size-large, .size-medium, .size-thumbnail {
    max-width: 100%;
    height: auto;
}

/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}


/* ----------------------------------------------------------------------
    5. Filters 
/* ---------------------------------------------------------------------- */
.filters-wrapper {
    text-align: left;
    margin-bottom: 40px;
    margin-top: 20px;
    padding:0 0px 10px 0px;
}
.filters-wrapper.filter-1 .filter {
    width: 100%;
}
.filters-wrapper.filter-2 .filter {
    width: 50%;
}
.filters-wrapper.filter-3 .filter {
    width: 33.33%;
}
.filters-wrapper.filter-4 .filter {
    width: 25%;
}

    .filter {
        position: relative;
        height: 40px;
        float: right;
        z-index: 5;
        padding-right: 20px;
        background-color: rgba(34, 34, 34, 0.66);
        margin-bottom: 10px;
        margin-right: 14px;
    }
    .filter.is-visible {
        z-index:100;
    }
        .filter-dropdown {
            position: absolute;
            left: 0;
            top: 0;
            color: #fff;
            width: 100%;
            z-index: 10;
        }
            .filter-collpase-btn {
                padding: 0 0 0 0px;
                height: 40px;
                cursor: pointer;
                overflow: hidden;
                margin-left: 0px;
                border: 1px solid rgba(255, 255, 255, 0.26);
                border-right-width:0;
                border-radius: 4px;
            }
            .filters-wrapper .filter:last-child .filter-collpase-btn {
                border-right-width:1px;
            }
            .filters-wrapper .filter:first-child .filter-collpase-btn {
                margin-left:0;
            }

            .filters-wrapper .filter:last-child .filter-collpase-btn {
                border-right-width:1px;
            }
                .filter-title, .filter-title-anim {
                    display: block;
                    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
                    transform: translate(0, -100%);
                    line-height: 40px;
                    font-size: 15px;
                    margin-bottom: 0;
                    font-weight: 400;
                    color: #fff;
                    letter-spacing: 0.02em;
                    text-transform: uppercase;
                    padding-left: 18px;
                }
                .filter.is-visible .filter-title-anim {
                    transform: translate(0, 0);
                }

                .filter-btn-icon {
                    position: absolute;
                    font-family: "icomoon";
                    right: 15px;
                    font-size: 28px;
                    color: #fff;
                    top: 11px;
                    width: 20px;
                    height: 20px;
                    display: block;
                    line-height:20px;
                    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
                }
                .filter-btn-icon:after {
                    content: "\f107";
                }
                .filter.is-visible .filter-btn-icon {
                    transform: rotate(180deg);
                }
                .filter.loading .filter-btn-icon {
                    top: 8px;
                    right: 13px;
                    width: 24px;
                    height: 24px;
                    font-size: 22px;
                    -webkit-animation:spin 1.5s linear infinite;
                    -moz-animation:spin 1.5s linear infinite;
                    animation:spin 1.5s linear infinite;
                    line-height: normal;
                    text-align: center;
                }
                .filter.loading .filter-btn-icon:after {
                    content: "\e61e";
                }

            .filter-dropdown-content {
                overflow: hidden;
                height: auto;
                max-height: 0px;
                transition: max-height 0.3s cubic-bezier(0.19, 1, 0.22, 1);
            }
            .filter.is-visible .filter-dropdown-content {
                max-height: 1000px;
                transition: max-height 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
                background-color: rgba(11, 11, 12, 0.85);
            }
                .filter-dropdown-content > ul {
                    margin-left: 0;
                    margin-bottom:0;
                    list-style: none;
                }
                    .filter-dropdown-content > ul li {
                        background-color: rgba(11, 11, 12, 0.61);
                        border: 1px solid rgba(255,255,255, 0.2);
                        border-top:none;
                        padding: 0 18px;
                        height: 40px;
                        margin:0;
                        cursor: pointer;
                        transition: background-color 0.7s cubic-bezier(0.19, 1, 0.22, 1);
                    }
                    .filter-dropdown-content > ul li:hover {
                        background-color: #292A2D;
                    }
                    .filter-dropdown-content > ul li h3 {
                        font-size: 15px;
                        color: #fff;
                        line-height: 40px;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        width: 100%;
                        font-weight: 300;
                        margin-bottom: 0;
                        letter-spacing: 0.02em;
                        text-transform: uppercase;
                    }

/* Releases Slider */
.carousel-releases-slider {
    margin-bottom:20px;
}

/* Ajax messages */
.ajax-messages .message {
    padding: 50px;
    border:1px solid #333;
    border-radius:10px;
    display: none;
}
    .ajax-messages .message-title {
        display: block;
        font-size: 60px;
        font-weight:700;
        line-height:130%;
    }
    .ajax-messages .message-body {
        font-size: 22px;
        display: block;
        opacity:0.8;
    }


/* ----------------------------------------------------------------------
  6. Layout and Content
/* ---------------------------------------------------------------------- */


/* 6.1 Container
 ------------------------------ */
.container {
    width: 1090px;
    margin: 0 auto;
    position: relative;
}
.container:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.container.full-width {
    width: 100%;
}

/* 6.2 Visual Composer Container
 ------------------------------ */
.vc-container {
    width: 1120px;
    margin: 0 auto;
    position: relative;
}
.vc-container:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.vc-container.full-width {
    width: 100%;
}
.vc-container.thin {
    width: 780px;
}
.main.vc {
    width: 100%;
    overflow: hidden;
}


/* 6.3 Columns
 ------------------------------ */
.col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4 {
    float: left;
    margin-right: 50px;
}
.col-1-1 {
    width: 100%;
}
.col-1-2 {
    width: 520px;
}
.col-1-3 {
    width: 330px;
}
.col-1-4 {
    width: 235px;
}
.col-1-5 {
    width: 178px;
}
.col-2-3 {
    width: 710px;
}
.col-3-4 {
    width: 805px;
}
.center-col {
    margin: 0 auto;
    float: none;
}

/* Helpers */
.last {
    margin-right: 0px !important;
}
.row {
    margin-bottom: 40px;
    clear: both;
    position: relative;
    z-index: 1
}
.row:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}


/* 6.4 Flexible columns
 ------------------------------ */
.flex-col-1-1, .flex-col-1-2, .flex-col-1-3, .flex-col-1-4, .flex-col-1-5 {
    float: left;
}
.flex-col-1-1 {
    width: 100%;
}
.flex-col-1-2 {
    width: 50%;
}
.flex-col-1-3 {
    width: 33.33%;
}
.flex-col-1-4 {
    width: 25%
}
.flex-col-1-5 {
    width: 20%
}


/* 6.5 Masonry Grid
 ------------------------------------ */
.masonry {
    clear: both;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}
.masonry-item {
    float: left;
    margin-bottom: 0;
    padding: 15px;
}
.masonry.masonry-list {
}
.masonry.masonry-list .masonry-item {
    width: 100%;
    padding: 0;
    background-color:transparent;
}

.masonry-item {
}
.masonry-anim .masonry-item {
    overflow: hidden;
    opacity: 0;
    -webkit-transform: translateX(-30%);
    -ms-transform: translateX(-30%);
    transform: translateX(-30%)
}
.masonry-anim .masonry-item--appear {
    transition: opacity .3s linear, -webkit-transform cubic-bezier(0.075, .82, .165, 1) .9s;
    transition: opacity .3s linear, transform cubic-bezier(0.075, .82, .165, 1) .9s;
    transition: opacity .3s linear, transform cubic-bezier(0.075, .82, .165, 1) .9s, -webkit-transform cubic-bezier(0.075, .82, .165, 1) .9s;
     -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

.masonry-anim .masonry-item--hide {
    transition: opacity .3s linear;
    opacity: 0;
}
.masonry-item-1-5 {
    width: 20%
}
.masonry-item-1-4 {
    width: 25%
}
.masonry-item-1-3 {
    width: 33.33%;
}
.masonry-item-1-2 {
    width: 50%
}
.full-width .masonry-item-1-5, .full-width .masonry-item-1-4, .full-width .masonry-item-1-3, .full-width .masonry-item-1-2 {
    width: 25%
}

.masonry-item .media-thumb {
    margin-bottom:0;
}


/* 6.6 Main
 ------------------------------ */
.main {
    width: 780px;
}
.main:after {
    clear: both;
    content: ' ';
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    visibility: hidden;
    width: 0
}
.main.main-right {
    float: right;
    margin-left: 50px;
}
.main.main-left {
    float: left;
    margin-right: 50px;
}
.main.wide {
    width: 100%;
    /* overflow: hidden; */
}
.main.thin {
    margin: 0 auto;
}
.main article:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.main article:last-child {
    margin-bottom: 0px
}


/* 7.7 Sidebar
 ------------------------------ */
.sidebar {
    width: 260px;
    -webkit-transition: opacity .2s ease-in-out;
    -moz-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out;
}

.sidebar.slidebar {
    width: 100%
}
.sidebar.main-left {
    float: right;
}
.sidebar.main-right {
    float: left;
}


/* 7.8 Slidebar
 ------------------------------ */
#slidebar {
    width: 400px;
    background-color: #0B0B0C;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    padding: 30px 30px;
    z-index: 100001;
    -webkit-transform: translateX(400px);
    -moz-transform: translateX(400px);
    transform: translateX(400px);
    border-left:1px solid #222326;
    -webkit-box-shadow: inset 14px 0px 20px -12px rgba(0, 0, 0, 0.90);
    -moz-box-shadow: inset 14px 0px 20px -12px rgba(0, 0, 0, 0.90);
    box-shadow: inset 14px 0px 20px -12px rgba(0, 0, 0, 0.90);
}

/* Anim */
#slidebar, #main-container, #footer-container, #header, #header-container {
    -webkit-transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
body.slidebar-visible #slidebar {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}
body.slidebar-visible #main-container,body.slidebar-visible #header-container, body.slidebar-visible #footer-container, body.slidebar-visible #header {
    -webkit-transform: translateX(-400px);
    -moz-transform: translateX(-400px);
    transform: translateX(-400px);
}

#slidebar .slidebar-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3;
    z-index: 0;
    background-size: cover;
}
#slidebar header {
    top: 0;
    right: 0;
    position: absolute;
    width: 100%;
    height: 50px;
    background-color: #292929;
    z-index: 100001;
    display: none;
}
#slidebar header a {
    color: #eee;
    float: right;
    margin-right: 30px;
    margin-top: 14px;
    font-weight: 700;
}
#slidebar header a span {
    color: #eee;
    display: inline-block;
    margin-left: 5px;
    font-size: 13px;
}
#slidebar header a:hover, #slidebar header a:hover span {
    color: #0099cc;
}
#slidebar-wrap {
    position: absolute;
    top: 60px;
    bottom: 60px;
    right: 30px;
    left: 30px;
}
#slidebar-content {
    position: relative;
    width: 100%;
    height: 100%;
}

/* Scroll styles */
#slidebar .iScrollVerticalScrollbar {
    position: absolute;
    z-index: 10;
    width: 4px;
    bottom: 2px;
    top: 2px;
    right: -18px;
    overflow: hidden;
}
#slidebar .iScrollVerticalScrollbar.iScrollBothScrollbars {
    bottom: 18px;
}
#slidebar .iScrollIndicator {
    position: absolute;
    background-color: #fff;
    border-radius: 2px;
    opacity: 0.05;
    cursor: pointer;
}
#slidebar:hover .iScrollIndicator {
    opacity: 0.1;
}
#slidebar .iScrollVerticalScrollbar .iScrollIndicator {
    width: 100%;
}

/* Layer */
#slidebar-layer {
    background-color: rgba(21, 21, 21, 0.63);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 100000;
    opacity: 0;
    width: 0;
    height: 0;
    cursor: pointer;
    -webkit-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
body.slidebar-visible #slidebar-layer {
    opacity: 1;
    width: auto;
    height: auto;
}

/* Search */
#slidebar-search {
    display: block;
    width: 100%;
    z-index: 3;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
    overflow: hidden;
    margin-bottom: 60px;
}

/* Image */
#slidebar-site-image {
    text-align:center;
}
#slidebar-site-image > img {
    display:inline-block;
    margin:0px 0 20px;
}


/* 6.9 Site
 ------------------------------ */
#site {
    position: relative;
    background: transparent url(images/bg2.png) center top no-repeat;
    z-index: 3;
    overflow: hidden;
}
#site:before {
    content: "";
    display: block;
    width: 100%;
    height: 8px;
    background-color: #0099cc;
}


/* 6.10 loading layer
 ------------------------------ */
body.animsition #site,
.animsition-overlay {
    opacity: 0;
    position: relative;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both; 
}

.animsition-overlay {
    z-index: 9999 !important; 
}

.animsition-loading {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1000;
    text-align: center;
}

.animsition-loading > img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    display: inline-block;
    margin-left: -20px;
    margin-top: -20px; 
    z-index: 111;
}


/* ----------------------------------------------------------------------
  7. Header
/* ---------------------------------------------------------------------- */
#header-container {
    width: 100%;
    padding: 20px 0;
    z-index:2;
}
#header-container > .container p:last-child {
    margin-bottom:0;
}

#header-wrap {
    min-height: 72px;
    width: 100%;
    position: relative;
    z-index: 999;
}
#header {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    z-index: 901;
    -webkit-transition: background-color .3s ease, opacity .3s ease, color .3s ease, top .3s ease-in-out, transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    -moz-transition: background-color .3s ease, opacity .3s ease, color .3s ease, top .3s ease-in-out, transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
    transition: background-color .3s ease, opacity .3s ease, color .3s ease, top .3s ease-in-out, transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
#site #header.sticky {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.82);
}

/* Admin bar */
.admin-bar #header.sticky {
    top: 32px;
}


/* 7.1 Logo
 ------------------------------ */
#logo {
    display: inline-block;
    float: left;
}
#logo img {
    margin: 0;
    vertical-align: middle;
}
#logo:hover {
    opacity: 0.5
}
.logo-dark {
    display: none;
}


/* 7.2 Menu Trigger Button
 ------------------------------ */
#menu-trigger {
    display: block;
    width: auto;
    height: auto;
    background-color: transparent;
    z-index: 9999;
    position: absolute;
    right: 0px;
    top: 19px;
}
#menu-trigger .icon {
    display: inline-block;
    width: 30px;
    height: 3px;
    position: relative;
    left: 4px;
    top: 3px;
    background: #fff;
    margin: 10px 0;
}
#menu-trigger .icon:before, #menu-trigger .icon:after {
    content: '';
    width: 100%;
    height: 3px;
    position: absolute;
    background-color:#fff;
}
#menu-trigger .icon:before {
    top: -9px;
}
#menu-trigger .icon:after {
    top: 9px;
}

body.slidebar-visible #menu-trigger span {
    background: none;
}
body.slidebar-visible #menu-trigger span:before {
    top: 0 !important;
    background-color: #fff;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
body.slidebar-visible #menu-trigger span:after {
    top: 0 !important;
    background-color: #fff;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
body.slidebar-visible #menu-trigger.menu-text {
    color: #fff;
}
#menu-trigger:hover span:before {
    top: -6px;
}
#menu-trigger:hover span:after {
    top: 6px;
}

/* Animations */
#menu-trigger .icon, #menu-trigger .icon:before, #menu-trigger .icon:after {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}


/* ----------------------------------------------------------------------
    8. Navigation
/* ---------------------------------------------------------------------- */


/* 8.1 Main Navigation
 ------------------------------ */
#nav {
    float: right;
    z-index: 100;
    margin-top: 0px;
    margin-right: 50px;
}
#nav.nav-hidden {
    overflow:hidden;
}
#nav > ul {
    margin-bottom: 0;
}
#nav li {
    list-style: none;
    float: left;
    margin: 0;
    position: relative;
}
#nav a {
    color: #fff;
    font-size: 14px;
    display: block;
    padding: 12px 13px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    z-index: 98;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius:4px;
    margin-top:12px;
}
#nav .active > a,
#nav .current > a, 
#nav a:hover {
    background-color: #0099cc;
    color:#fff;
}
#nav li.menu-item-has-children > a:after {
    font-family: "icomoon";
    content: "\f107";
    display: inline-block;
    margin-left: 10px;
    line-height: normal;
    opacity: 0.7;
}
#nav ul ul li.menu-item-has-children > a:after {
    content: "\f105";
}
#nav > ul > li.menu-item-has-children.active > a {
   
}
#nav li.menu-item-has-children.active > a {
    
}

/* Sub nav */
 #nav .show-list {
   -webkit-transition: margin-top 0.3s ease;
    -moz-transition: margin-top 0.3s ease;
    transition: margin-top 0.3s ease;
}
#nav ul ul {
    visibility: hidden;
    border-radius:4px;
    padding: 0;
    position: absolute;
    width: 220px;
    z-index: 300;
    margin-top: 50px;
    border-radius:4px;
    background: rgba(0,0,0,0.7);
}
#nav ul ul.show-list {
    visibility: visible;
    opacity: 1;
    margin-top: 0px;
}

    #nav ul ul li {
        float: none;
    }
    #nav ul ul li:last-child {
        border-bottom: none;
    }

        #nav ul ul a {
            color: #999;
            display: block;
            font-size: 13px;
            letter-spacing: 0;
            padding: 14px 10px !important;
            text-align: left;
            line-height: normal;
            margin-top: 0;
            margin-left:0;
            border-bottom: 1px solid rgba(255,255,255,0.04);
        }

            #nav ul ul a:hover, #nav ul ul .hover > a, #nav ul ul .current > a, #nav ul ul .current > a:hover, #nav ul ul a.selected {
               background-color:transparent;
                color: #fff
            }

/* Dropdown */
#nav ul ul ul {
    left: 100% !important;
    top: 0 !important;
}
body #nav ul li > .edge {
    right: 100% !important;
    left: -100% !important;
}
body #nav ul .edge {
    right: 100% !important;
    left: auto !important;
}

/* Main Nav */
#main-nav {
    margin-bottom: 30px
}
#main-nav ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-weight: 400;
}
#main-nav ul li {
    width: 100%;
    padding: 0;
    margin: 0;
    position: relative;
}
#main-nav ul li a {
    width: 100%;
    display: inline-block;
    padding: 5px 10px 5px 0;
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.06em;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
#main-nav ul li a {
}
#main-nav ul li a:hover {
    color:#0099cc;
}
#main-nav ul {
}
#main-nav > ul > li:last-child a {
    border: none;
}
#main-nav ul ul {
    display: none
}
#main-nav ul li a {
    font-size: 16px;
    text-transform: uppercase;
    line-height: normal;
}
#main-nav ul li li a {
    padding-left: 10px;
    opacity: 0.8;
}
#main-nav ul li li li a {
    padding-left: 20px;
    opacity: 0.4
}
#main-nav ul li li li li a {
    padding-left: 30px;
    opacity: 0.4
}
#main-nav ul li i {
    position: absolute;
    top: 4px;
    right: 0px;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    opacity: 0.8;
}
#main-nav ul li i:hover {
    opacity: 1;
}
#main-nav ul li li i {
    opacity: 0.8
}
#main-nav ul li li li i {
    opacity: 0.7
}
#main-nav ul li li li li i {
    opacity: 0.6
}

/* Responsive */
#main-nav .top-nav-el {
    display: none;
}


/* ----------------------------------------------------------------------
    10. Breadcrumb Navigation
/* ---------------------------------------------------------------------- */
#breadcrumb {
   width:100%;
   background-color: rgba(255, 255, 255, 0.09);
   margin-bottom: 40px;
   padding:5px 10px;
   border-radius:4px;
}

#breadcrumb > ul {
    text-align:left;
    margin-bottom:0;
    font-size:13px;
    text-transform:uppercase;
    color: #888;
}
#breadcrumb > ul a {
    color:#aaa;
}
#breadcrumb > ul a:hover {
    color:#fff;
}

#breadcrumb > ul li { 
    display:inline-block;
    margin-left:0;
}
#breadcrumb > ul li:after {
    font-family: "icomoon";
    content: "\f105";
    line-height:normal;
    padding:0 6px 0 8px;
    display:inline-block;
}
#breadcrumb > ul li:last-child:after { 
    display:none
}


/* ----------------------------------------------------------------------
    9. Paging Navigation
/* ---------------------------------------------------------------------- */

/* Nav links */
.nav-links {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-wrap: break-word;
    overflow: hidden;
    text-align: center;
}
.post-navigation, .image-navigation {
    overflow: hidden;
}
.post-navigation a {
    padding: 30px 10px;
    position: relative;
}
.post-navigation .nav-label {
    font-family: "Oswald";
    color: #fff;
    font-size: 16px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    font-weight: 300;
    display: inline-block;
    opacity: 1;
    letter-spacing: 0.07em;
    font-weight:400;
}

.post-navigation a:hover .nav-label {
    opacity:1;
    color:#fff;
}
.post-navigation .attachment-post-link {
    text-align: center;
}
.post-navigation a, .image-navigation a {
    display: inline-block;
    line-height: 1.7142857142;
    text-transform: uppercase;
    margin-bottom: 0;
    position: relative;
    z-index: 2;
    letter-spacing: 0.04em;
    text-align:center;
    vertical-align: middle;
    text-align: center;
    opacity: 0.6;
}
.post-navigation a:hover, .image-navigation a:hover {
    opacity: 1;

}

.post-navigation a.prev-link {
}
.post-navigation a.next-link {}
.post-navigation .post-nav-inner.link-full a {
    text-align:center;
}
.post-navigation a.prev-link .nav-label:before, .post-navigation a.next-link .nav-label:after {
    font-family: "icomoon";
    display: inline-block;
    line-height: 38px;
    color: #fff;
    position: relative;
    font-size: 31px;
    vertical-align: middle;
    top: -2px;
}
.post-navigation a.prev-link .nav-label:before {
    margin-right: 15px;
    content: "\f104";
}
.post-navigation a.next-link .nav-label:after {
    margin-left: 15px;
    content: "\f105";
}
.post-navigation a.prev-link {
    border-right: 1px solid rgba(255, 255, 255, 0.14);
}
.post-navigation .post-nav-inner.link-empty a.prev-link {
    border-right:none;
}
.post-nav-preview {
    display: inline-block;
    width: 60px;
    height: 60px;
    border-radius:6px;
    background-color: #333;
    background-size: cover;
    background-attachment: scroll;
    background-position: center center;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    vertical-align: middle;
    margin: 0 15px;
     filter: gray; /* IE6-9 */
    filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}
.post-navigation a:hover .post-nav-preview {
    filter: none;
  -webkit-filter: grayscale(0);
    
}

/* Paging Navigation */
.paging-navigation {
    margin: 20px 0 0px 0;
}
.main .paging-navigation {
    position: relative;
    top: -20px;
}
.paging-navigation .loop-pagination {
    text-align: left;
}
.paging-navigation .page-numbers {
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    margin-right: 0;
    text-transform: uppercase;
    border: none;
    margin: 0 3px;
    font-weight: 600;
    color: #999;
    padding: 5px 10px;
    border-radius:4px;
    background-color: rgba(0, 0, 0, 0.24);
}
.prev.page-numbers, .next.page-numbers {
    /* display: none; */
}
.paging-navigation a {
    color: #fff;
}
.paging-navigation .page-numbers.current,.paging-navigation a:hover {
    color: #222;
    background: rgba(255, 255, 255, 0.67);
}

/* Page Navigation */
.page-nav {
    position: relative;
    height: 80px;
    border-top: 1px solid #444;
    border-bottom: 1px solid #444;
    position: relative;
    z-index: 1;
    font-size: 24px;
}
.page-nav a span {
    color: #999;
}
.page-nav a:hover span {
    color: #eee;
}

/* Arrows */
.page-nav .prev-button, .page-nav .next-button {
    position: absolute;
    display: block;
    top: 24px;
    height: 31px;
}
.page-nav .prev-button {
    left: 20px;
}
.page-nav .next-button {
    right: 20px;
}
.page-nav .disabled span, .page-nav .disabled:hover span {
    opacity: 0.3;
    color: #999;
}

/* Page Navigation */
.page-navigation {
    overflow: hidden;
    margin-top: 0px;
}
.page-navigation .left {
    padding: 0 1px 2px 0;
}
.page-navigation .right {
    padding: 0 0 2px 1px;
}
.page-navigation .next, .page-navigation .prev {
    display: inline-block;
    width: 100%;
    background-color: #f2f2f2;
    text-align: center;
    padding: 30px 0;
    color: #666;
    font-size: 18px;
    text-transform: uppercase;
}
.page-navigation .next i, .page-navigation .prev i {
    color: #666;
    font-size: 16px;
    margin: 0 8px;
}
.page-navigation .next:hover, .page-navigation .prev:hover {
    background-color: #222;
    color: #fff;
}
.page-navigation .next:hover i, .page-navigation .prev:hover i {
    color: #fff;
}

/* Page links */
.page-links {
    margin-top: 20px;
    display: block;
    width: 100%;
    clear: both;
}


/* ----------------------------------------------------------------------
    10. Posts
/* ---------------------------------------------------------------------- */

/* Blog article */
.blog-grid .blog-article,
.blog-classic .blog-article {
    width: 100%;
}
.blog-classic .blog-article {
    margin-bottom:50px
}
.blog-grid .blog-article {
    margin-bottom:20px;
    background: #000;
    padding: 20px;
    border-radius:5px;
    background-color:rgba(000,000,000,0.2)
}
.article-header {
    text-align: left;
}

/* Title */
.article-title, .article-title a {
    color: #fff;
    font-weight: 400;
    font-size: 36px;
    margin-bottom: 13px;
    text-align: left;
}
.article-title a:hover {
    color: #0099cc;
}
h1.article-title {
    margin-bottom:30px;
}

.article-title:after {
    content:"";
    width: 100%;
    height: 5px;
    clear: both;
    margin-top:10px;
    position: relative;
    text-align: right;
    display: block;
    background: transparent url(images/line.png) left bottom repeat;
    margin-bottom: 0px;
}
.blog-grid .article-title, .blog-grid .article-title a {
    font-weight: 400;
    font-size: 22px;
    letter-spacing: 0.04em;
}

/* Meta */

/* Meta Top */
.meta-top {
    width: 100%;
    text-align: left;
    margin-bottom: 20px;
    padding-top: 0px;
    font-size: 13px;
    display: table;
    min-height: 30px;
}
.caption-bottom > .meta-top {
    border:0;
    padding-top:0;
    top:-5px;
    position:relative;
    margin-bottom:0
}
.meta-col {
    display: table-cell;
    vertical-align: middle;
}
.meta-col:not(:first-child) {
    padding-left: 20px;
}
.caption-bottom .meta-col:not(:first-child) {
    border-left: 1px solid rgba(255,255,255,0.2);
}
.meta-top .meta-col:last-child {
    text-align:right;
    border-left:0;
}
.blog-grid .meta-top .meta-col:last-child {
    display:none;
}
.meta-col .meta-date, .meta-col .meta-comments {
    display:inline-block;
}

/* Categories */
.meta-cats {
    display:inline-block;
    margin-right: 4px;
}
.meta-cats a {
    border-radius: 999em;
    font-weight: 400;
    -webkit-transition:all 0.2s ease-out;
    transition: all 0.2s ease-out;
    color: #fff;
    text-transform:uppercase;
    font-size:13px;
    letter-spacing:0.02em;
    /* margin-bottom:8px; */
    display:inline-block;
    padding:0 5px
}
.meta-cats a:hover {
    color: #0099cc;
}

/* Author */
.meta-author-image, .meta-author {
    vertical-align: middle;
    padding-right: 10px;
    display: table-cell;
}
    .meta-author-image > img {
        vertical-align: middle;
        max-width: initial;
        border-radius:100%;
    }
    .meta-author > .author-name {
        font-weight: 300;
        text-transform: uppercase;
    }

/* Comments */
.meta-col .meta-comments {
    opacity:0.3;
}
.meta-col .meta-comments a {
    min-width:40px;
    border-radius: 4px;
    position: relative;
    top: 0px;
    left: 0;
    display:inline-block;
    text-align:center;
    color:#fff;
    font-size:14px;
    font-weight:600;
    background-color: #fff;
}
.meta-col .meta-comments a:after {
    border: 8px solid #fff;
    border-right-color: transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
    height: 0;
    width: 0;
    position: absolute;
    bottom: -8px;
    right: 5px;
    content: "";
    display:inline-block;
    z-index:-1;
}
.meta-col .meta-comments .icon {
    color:#666;
    font-size:18px
}

/* Date */
.meta-col .meta-date {
    font-weight: 400;
    color:#999;
    color: rgba(255,255,255,1);
    display: table-cell;
    vertical-align:middle;
    font-size:14px;
    min-width:80px
}

/* Meta Bottom */
.meta-bottom {
    width: 100%;
    text-align: left;
    margin-top: 30px;
    margin-bottom: 40px;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 20px;
    padding-bottom:10px;
    font-size: 13px;
    display: table;
    min-height: 50px;
}

/* Tags */
.meta-tags-title {
    display: block;
    font-size: 14px;
    text-transform:uppercase;
    font-weight: 600;
    color: #999;
    margin-bottom: 10px;
    letter-spacing: 0.05em;
}
.meta-tags {
    display: inline-block;
}
.meta-tags a {
    color: #999;
    border: 1px solid #555;
    padding: 4px 12px;
    margin: 0 5px 5px 0;
    letter-spacing: 0.1em;
    font-size: 12px;
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.0em;
    font-weight:400;
    border-radius: 999em;
     -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}
.meta-tags a:hover {
    color: #fff;
    border-color:transparent;
    background-color:#0099cc;
}
.meta-tags a:before { 
  content: "#"
}

/* Share */
.share-buttons {
    display:table-cell;
}
.meta-share-title {
    display: block;
    font-size: 14px;
    text-transform:uppercase;
    font-weight: 600;
    color: #999;
    margin-bottom: 10px;
}

.share-buttons a { 
    border:0;
}

.share-buttons a span {
    color:#fff;
}
.share-buttons .fb-share-btn, .share-buttons .fb-share-btn:hover {
    background-color: #4769A5;
}
.share-buttons .twitter-share-btn, .share-buttons .twitter-share-btn:hover {
    background-color: #65CCEF;
}
.share-buttons .gplus-share-btn, .share-buttons .gplus-share-btn:hover {
    background-color: #bf3727;
}
.share-buttons .linkedin-share-btn, .share-buttons .linkedin-share-btn:hover {
    background-color: #278cc0;
}

/* Media / Post Formats */
.article-media iframe, .article-media .video-wrap {
    margin-bottom:0px;
}
.article-media.content-image, .article-media.sc-audio, .article-media.content-video, .article-media.content-slider {
    margin-bottom: 30px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #292929;
    background: #121212;
    position: relative;
    margin-bottom: 30px;
    background-image: linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -o-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -moz-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -webkit-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -ms-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.14, #181818), color-stop(0.47, #232323));
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}
.article-media.content-image a {
    margin-bottom:0;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
.article-media.content-image a:hover {
    filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}
.article-media.content-video .video {
    margin-bottom: 0px;
}
.article-media img {
    vertical-align: middle;
    width: 100%;
}
.article-media.featured-image img {
    vertical-align: middle;
    width: auto;
    width: 100%;
}
.format-quote .quote-text {
    margin-bottom:0px;
    font-size: 18px;
    color: #fff;
    font-style:italic;
    text-align: left;
    line-height:170%;
    font-weight: 400;
}
.format-quote .quote-text cite, .format-quote .quote-text cite a {
    color:#0099cc;
    font-size: 17px;
    text-align: left;
    margin-top: 5px;
}
.single-format-quote .article-media {
    text-align:center;
    background-color: #292A2D;
    margin-bottom:30px;
}
.single-format-quote .quote-text {
    font-size: 20px;
}

.format-quote .article-media {
    padding: 24px;
}

.classic-grid .format-quote .article-media,
.blog-grid .format-quote .article-media {
    background-color: #292A2D;
    margin-bottom:20px
}

/* Article Content */
.article-content {
    text-align: left;
}
.blog-grid .article-content p {
    margin-bottom:20px;
    font-size:15px
}
.blog-classic .article-content p {
    margin-bottom: 20px;
}

/* More Link */
.more-link, .more-link-excerpt {
    color: #fff;
    display: inline-block;
    text-align: center;
    font-size: 12px;
    margin-top: 0px;
    margin-top: 10px;
    background-color: #0099cc;
    padding:8px 12px;
    border-radius:5px;
    text-transform:uppercase;
    letter-spacing:0.1em;
    font-weight: 400;
}
.more-link:hover, .more-link-excerpt:hover {
    color: #222;
    background-color:#eee;
}
.more-link:after, .more-link-excerpt:after {
    font-family: "icomoon";
    content: "\f105";
    margin-left: 10px;
    line-height:normal;
    font-size:14px;
    position: relative;
    top:1px;
}

/* Small thumbs layout */
.blog-classic .small-thumb .article-inner {
    display:table;

}
.blog-classic .small-thumb .media-container {
    display:table-cell;
    vertical-align:top;
    padding-right: 30px;
}
.blog-classic .small-thumb .media-container img,
.blog-classic .small-thumb .article-media .video {
    min-width:300px;
}
.blog-classic .small-thumb .article-content {
    display:table-cell;
    vertical-align:top;
}


/* ----------------------------------------------------------------------
    11. Intro Section
/* ---------------------------------------------------------------------- */


/* Intro text */
.intro-text {
    margin-top:30px;
}
    .intro-text h1 {
        font-size: 54px;
    }
    .intro-text h2 {
        font-size: 48px;
    }
    .intro-text h3 {
        font-size: 36px;
    }

    .intro-text.intro-tag h2 span {
        color: #09c;
    }
    .intro-text.intro-tag h6 {
        text-transform:uppercase;
        opacity:0.6;
        font-size:16px;
    }


/* Intro */
#intro {
    margin-top: 30px;
}
    
    #intro.media-slider, #intro.media-slider .content-slider, #intro.media-slider .slide,
    #intro.media-image,
    #intro.media-gmaps, #intro .gmap {
        min-height: 500px;
    }

    #intro.media-video {
        min-height: 0px !important;
    }
    #intro.media-video .video-wrap {
        margin-bottom: 0;
    }
    #intro .video {
        opacity: 0;
         -webkit-transition: opacity 0.3s ease-out;
        -moz-transition: opacity 0.3s ease-out;
        -ms-transition: opacity 0.3s ease-out;
        -o-transition: opacity 0.3s ease-out;
        transition: opacity 0.3s ease-out;
    }
    #intro .video.show-video {
        opacity: 1;
    }
    

/* ----------------------------------------------------------------------
    11. Portfolio
/* ---------------------------------------------------------------------- */

.portfolio-excerpt {
    margin-top: 20px;
}
.portfolio-excerpt p {
    margin-bottom: 15px;
    font-size: 14px;
}
.portfolio-excerpt p, .portfolio-excerpt {
     font-size: 14px;
}
.portfolio-title {
    font-size: 18px;
    margin-bottom: 0;
    margin-top: 20px;
}
.portfolio-title a {
    color: #fff;
}


/* ----------------------------------------------------------------------
    12. Events List
/* ---------------------------------------------------------------------- */
.masonry.masonry-list .masonry-item.pendulum_event_type-past-events a span {
    opacity:0.6;
}
.masonry.masonry-list .masonry-item.pendulum_event_type-past-events a:hover span {
    opacity:1;
}
.masonry-list .event-li {
    width: 100%;
    display: table;
    overflow: hidden;
    position: relative;
    background-color:rgba(000,000,000,0.2);
    margin-bottom:1px;
    font-family:"Oswald";
}
.masonry-list .event-li.selected,
.masonry-list .event-li:hover {
    background-color:#eee;
}
.masonry-list .event-li.selected .venue,
.masonry-list .event-li.selected .title h2,
.masonry-list .event-li:hover .title {
    color:#222;
}
.masonry-list .event-li.selected .date,
.masonry-list .event-li:hover .date  {
    background-color:#0099cc;
}
.masonry-list .event-li .date,
.masonry-list .event-li .title {
    display: table-cell;
    padding: 20px;
    color:#fff;
    font-size: 22px;
    vertical-align: middle;
    text-align: left;
    line-height: normal;
}
.masonry-list .event-li .date {
    width: 12%;
    font-weight:600;
    font-size:22px;
    min-width:100px;
}
.masonry-list .event-li .title {
    width: 40%;
    font-weight:400;
    color: #999;
}
.masonry-list .past-event-label {
    display:block;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    opacity: 0.7;
}

/* ----------------------------------------------------------------------
    13. Events Grid
/* ---------------------------------------------------------------------- */
.events-grid {}

.events-grid img {
    width:100%
}
.events-grid .event-date, .events-grid .event-title {
    position:absolute;
    z-index: 4;
    color:#fff;
}

.events-grid .event-date {
   top:0;
   padding:10px;
   background:rgba(000,000,000,0.3);
   right: 0;
}
.events-grid .event-date span {
   display:block
}
.events-grid .event-date .month {
   text-transform:uppercase;
   line-height:normal;
}
.events-grid .event-date .day {
   font-size:28px;
   line-height:normal;
   font-weight:600;
}
.events-grid .event-title {
    bottom:0;
    left:0;
    right:0;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.54+100 */
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.54) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.54) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.54) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#8a000000',GradientType=0 ); /* IE6-9 */
    padding:10px;
}
.events-grid .event-title h2 {
    font-size:16px;
    margin-bottom:0
}
.events-grid  .pendulum_event_type-past-events .event-date:before {
    content: attr(data-label);
    position:absolute;
    left:-52px;
    top:23px;
    width:80px;
    height:26px;
    text-align:center;
    line-height:26px;
    background-color:;
    transform:rotate(-90deg);
    text-transform:uppercase;
    font-size:12px;
    background:rgba(000,000,000,0.6);
}


/* ----------------------------------------------------------------------
    13. Singel Event
/* ---------------------------------------------------------------------- */

/* Countdown */
.countdown {
    display:inline-block;
    vertical-align:middle;
    margin-top:15px
}
.countdown .days, .countdown .hours, .countdown .minutes, .countdown .seconds {
    position: relative;
    display: inline-block;
    font-size: 70px;
    font-weight: bold;
    line-height:50%;
    padding:0 4px;
}
.countdown .days {
    color: rgba(255,255,255,0.5);
}
.countdown .hours {
    color: rgba(255,255,255,0.6);
}
.countdown .minutes{
    color: rgba(255,255,255,0.7);
}
.countdown .seconds {
    color: rgba(255,255,255,9);
}

.countdown .days:after, .countdown .hours:after, .countdown .minutes:after, .countdown .seconds:after {
    content: attr(data-label);
    font-size: 14px;
    position: relative;
    text-transform: uppercase;
    display: block;
    font-weight: bold;
    text-align:center;
    color: rgba(255,255,255,0.4);
    text-align: center;
    margin-top:4px;
}

/* Module */
.event-countdown.compact {
    border: 1px solid rgba(255,255,255,0.1);
    border-radius:5px;
    padding:20px;
    margin-bottom: 20px;
}
.event-countdown.compact .upcoming-title {
    font-size: 24px;
    margin-bottom:0;
}
.event-countdown.compact .upcoming-date {
   margin-bottom:0;
   opacity: 0.6;
   font-weight: 300;
}

/* Big */
.event-countdown.big {
    text-align:center;
    background-color:rgba(000,000,000,0.4);
    border-radius:5px;
    padding:20px
}
.event-countdown.big .upcoming-title {
    font-size: 40px;
    margin-bottom:0;

}
.event-countdown.big .upcoming-date {
    margin-bottom:15px;
    font-weight:400;
    opacity:0.6;
    font-size:18px;
    display:block;
}
.event-countdown.big .countdown .days, 
.event-countdown.big .countdown .hours, 
.event-countdown.big .countdown .minutes, 
.event-countdown.big .countdown .seconds {
    font-size:140px;
    margin: 0 10px;
}

.event-countdown.big .countdown .days:after, 
.event-countdown.big .countdown .hours:after, 
.event-countdown.big .countdown .minutes:after, 
.event-countdown.big .countdown .seconds:after {
    font-size:18px;
    
}


/* ----------------------------------------------------------------------
    15. Content Section
/* ---------------------------------------------------------------------- */
#content {
    padding: 40px 0 80px 0;
    clear: both;
    width: 100%;
    position: relative;
    z-index: 2;
}
#content.vc {
    padding: 0;
}
#content.vc > .container {
    width: 100%;
    padding: 0
}

#content.filter-content {
    padding: 40px 0 80px 0;
}


/* ----------------------------------------------------------------------
    16. 404 Page
/* ---------------------------------------------------------------------- */

.error404 #footer-container, .error404 #header-container, .error404 #header, .error404 #header-wrap {
    display:none;
}
.error-page {
    padding-bottom: 50px
}
.error-page .row {
    max-width:700px;
    margin:0 auto;
    text-align:center;
}
#search-404 {
    margin-top: 40px;
    margin-bottom:0px;
}
.error-page #s {
    padding: 16px 40px 16px 40px;
    font-size: 24px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    max-width:300px;
}
.error-page  #searchsubmit { display:none; }
.error-page #s::-webkit-input-placeholder {
    color: #999;
}
.error-page #s:-moz-placeholder {
    color: #999;
}
.error-page #s:-ms-input-placeholder {
    color: #999;
}
.error-page  #s:focus {
    border-color: #666;
}
.big-404 {
    font-size: 350px;
    text-align: center;
    display: inline-block;
    padding: 0 0;
    font-weight: bold;
    line-height: 100%;
    color: #333;
}
.title-404 {
    margin-bottom: 30px
}
.error-page .sub-title-404 {
    font-size:22px;
}


/* ----------------------------------------------------------------------
    20. Comments
/* ---------------------------------------------------------------------- */
.comments-section {
    padding: 50px 0 0px 0;
    position: relative;
}
/* Comments */
.comment-message {
    font-size: 18px;
    color: #ddd;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    /* background-color: rgba(255, 255, 255, 0.01); */
    border-radius:5px;
}
.comments-title {
    margin-bottom: 40px;
    font-size: 18px;
    font-weight: normal;
    text-transform: uppercase;
    color: #fff;
    width: 100%;
    position: relative;
    text-align: left;
    display: block;
    padding:13px;
    background: transparent url(images/line.png) left bottom repeat;
}
.comments-title:before {
    font-family:"icomoon";
    content: "\f0e5";
    margin-right:10px
}
.comments-title span {
}
.comments-list {
    border-top: 1px solid rgba(255,255,255,0.1);
    margin: 30px 0 60px;
    padding: 0 0 30px;
    overflow: hidden;
}
.comment {
    border-top: 1px solid rgba(255,255,255,0.1);
    list-style: none;
    margin: 30px 0 0;
    padding: 35px 0 20px;
}
.comment:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.comment:first-child {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
}
.logged-in-as {
    position: relative;
    top: 0px;
    margin-bottom: 20px;
    font-size: 14px;
}
.logged-in-as a {
    color: #999;
    font-size:13px;
    letter-spacing:0.02em;
}
.logged-in-as a:hover { 
    color: #0099cc
}

.comment-field {
    /* padding-top: 20px; */
    overflow: hidden;
    clear: both;
    margin-bottom: 10px;
}
.comment > article {
    margin: 0;
    /* overflow: hidden; */
    position: relative;
    border: 1px solid #222;
    background-color: rgba(19, 19, 19, 0.83);
    padding:20px;
}
.comment .avatar-wrap {
    background: #eee;
    float: left;
    position: absolute;
    z-index: 1;
    left: 20px;
    top: 16px;
    overflow: hidden;
}
.comment .avatar-wrap img {
    margin: 0;
    width: 70px;
    height: 70px;
    float: left;
    border: 4px solid #222;
}
.comment .comment-body, .comment .comment-meta {
    margin: 0 0 0px 85px;
    color: #ddd;
    font-size: 15px;
    line-height: 1.7em;
    margin-bottom: 30px;
}
.comment .comment-meta {
    margin-bottom: 0;
}
.comment .author, .comment .author a {
    color: #eee;
    margin: 0;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
}
.comment .author a:hover {
    color: #f4624a;
}
.comment .date {
    color: #aaa;
    font-size: 13px;
    margin: 0 0 10px;
}
.comment .reply {
    position:absolute;
    bottom: 20px;
    right: 20px;
    z-index: 2;
}
.comment .reply a {
    font-size:12px;
    color:#222;
    text-transform:uppercase;
    margin-right:2px;
    padding:4px 7px;
    border-radius:4px;
    margin-right: 0px;
    background-color:#eee;
    font-weight:400;
}
.comment .reply a:before {
    font-family:"icomoon";
    content: "\f122";
    margin-right:5px;
}
.comment .reply a:hover {
    background-color:#0099cc;
    color:#fff;

}

.comment .children {
    margin: 0;
    padding: 0px 0 0;
    position: relative;
}
.comment .children .comment {
    /* border-top: 1px solid rgba(255,255,255,0.1); */
    margin: 30px 0 0;
    padding: 35px 0 0 125px;
    position: relative;
}
.comment .children .comment.depth-4, .comment .children .comment.depth-5, .comment .children .comment.depth-6, .comment .children .comment.depth-7, .comment .children .comment.depth-8, .comment .children .comment.depth-9, .comment .children .comment.depth-10 {
    padding-left: 0;
}
.comment .children .comment:first-child {
    margin-top: 0;
}
.comment .children .comment-body, .comment .children .comment-meta {
}

/* Pingbacks / Trackbacks */
.comment-list .pingback, .comment-list .trackback {
    list-style: none;
    margin-left: 0;
    padding-top: 30px;
    padding-left: 0;
    border-top: 1px dotted #e6e6e6;
}
.comment-list .pingback:first-child, .comment-list .trackback:first-child {
    border-top: none;
    margin-top: 0;
    padding-top: 0;
}
.comment-list .pingback .author, .comment-list .trackback .author, .comment-list .pingback .author a, .comment-list .trackback .author a, .comment-list .pingback .author a:hover, .comment-list .trackback .author a:hover {
    font-size: 18px;
    color: #222;
    margin-bottom: 12px;
    font-weight: 600;
}
.comment-list .pingback .date, .comment-list .trackback .date {
    color: #888;
    font-size: 13px;
    margin: 0 0 5px;
    position: relative;
    top: -5px;
}

/* Response */
#respond {
    margin-top: 60px;
}
#reply-title {
    font-size: 28px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
#reply-title small {
    font-size: 24px;
    font-weight: normal;
}
.form-allowed-tags {
    font-size: 12px;
    color: #888;
    display: none;
}
.form-allowed-tags span {
    font-size: 12px;
    color: #aaa;
    display: block
}
.form-submit {
    overflow:hidden;
    clear: both;
    padding-top: 20px;
}
#respond .flex-col-1-3 {
    padding:0 5px;
}
#respond .flex-col-1-3.last {
    padding-right:0
}
#respond .flex-col-1-3.first {
    padding-left:0
}
#respond input[type="text"] {
    width:100%;
}
#respond .comment-form-cookies-consent label {
    display:inline-block;
    margin-left:10px;
}
    
/* ----------------------------------------------------------------------
    21. Footer Section
/* ---------------------------------------------------------------------- */


/* Footer container */
#footer-container {
    overflow:hidden;
}

/* Widgets */
#footer-widgets {
    clear: both;
    z-index: 2;
    position: relative;
    background: rgba(0, 0, 0, 0.52); /* Old browsers */
}
#footer-widgets > .container {
    display:flex;
}
#footer-widgets .footer-col {
    padding: 70px 2%;
    color: #eee;
    min-width: 33.33%;
}


/* 21.1 Footer Social
 ------------------------------ */
#footer-social {
    width: 100%;
    position: relative;
    z-index: 2;
    border-top: 1px solid #444;
    text-align: center;
}
#footer-social .container {
    padding: 20px;
}
#footer-social .container p {
    margin-bottom:0;
}


/* 21.2 Footer Note
 ------------------------------ */
#footer-note {
    width: 100%;
    position: relative;
    z-index: 2;
    padding-bottom: 60px;
    padding-top: 60px;
}
#footer-note p {
    margin-bottom: 0;
    color: #999;
    font-size: 14px;
}
#footer-note .footer-copyrights {
    text-align:right;
    font-size:14px;
    color:#999;
}
#footer-note .footer-copyrights a {
     color: #ccc;
}
#footer-note .footer-copyrights a:hover {
     color: #0099cc;
}
#footer-note .social-button.circle-button {
    background-color:#333
}
#footer-note .social-button.circle-button i.icon {
    color:#ddd
}
#footer-note .social-button.circle-button:hover {
    background-color:#0099cc;
}
#footer-note .social-button.circle-button i.icon {
    color: #999;
}
#footer-note .social-button.circle-button:hover i.icon {
    color:#fff
}



/* 21.3 Scroll Button
 ------------------------------ */
#scroll-button {
    font-family: "icomoon";
    background: #FFF;
    width: 40px;
    height: 40px;
    position: fixed;
    right: -40px;
    top: 120px;
    z-index: 10;
    text-align: center;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
    color: #222;
    -webkit-transition-delay: 0.2s; /* Safari */
    transition-delay: 0.2s;
}
#scroll-button:hover {
    background-color:#0099cc;
    color:#fff;
}
#scroll-button i {
    margin-left: 0;
    line-height:37px;
    font-size: 25px;
    font-style: normal;
    vertical-align:top;
}
#scroll-button i:after {
     content: "\f106";
}
#scroll-button.active {
    right: 30px;
}


/* ----------------------------------------------------------------------
    22. Widgets
/* ---------------------------------------------------------------------- */
.widget {
    line-height: 1.7em;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    margin-bottom: -1px;
    width: 100%;
    word-wrap: break-word;
    color: #ccc;
    overflow: hidden;
    padding-bottom: 30px;
    font-size: 14px;
}
#slidebar .widget {
    font-size: 14px;
    line-height: 22px;
    color: #999;
    margin-bottom: 60px;
    border: none;
    padding: 0;
}
#slidebar .widget:last-child {
    padding-bottom: 40px;
}
.widget li a {
    color: #ccc;
}
.widget a {
    color: #ddd;
}
.widget a:hover {
    color: #0099cc;
}
.widget h1, .widget h2, .widget h3, .widget h4, .widget h5, .widget h6 {
    margin: 24px 0 12px;
}
.widget h1 {
    font-size: 24px;
}
.widget h2 {
    font-size: 22px;
    line-height: 1.2;
}
.widget h3 {
    font-size: 20px;
}
.widget h4 {
    font-size: 18px;
    line-height: 1.5;
}
.widget h5 {
    font-size: 16px;
}
.widget h6 {
    font-size: 14px;
    line-height: 2;
}
.widget address {
    margin-bottom: 18px;
}
.widget abbr[title] {
    border-color: rgba(255, 255, 255, 0.1);
}
.widget mark, .widget ins {
    color: #000;
}
.widget pre, .widget fieldset {
    border-color: rgba(255, 255, 255, 0.1);
}
.widget code, .widget kbd, .widget tt, .widget var, .widget samp, .widget pre {
    font-size: 12px;
}
.widget blockquote {
    color: rgba(255, 255, 255, 0.7);
    font-size: 18px;
    line-height: 1.5;
    margin-bottom: 18px;
}
.widget blockquote cite {
    color: #999;
    font-size: 14px;
}
.widget dl, .widget dd {
    margin-bottom: 18px;
}
.widget ul, .widget ol {
    list-style: none;
    margin: 0;
}
.widget li > ol, .widget li > ul {
    margin-left: 10px;
}
.widget table, .widget th, .widget td {
    border-color: rgba(255, 255, 255, 0.1);
    padding: 0;
    border: none;
}
.widget table {
    margin-bottom: 18px;
}
.widget del {
    color: rgba(255, 255, 255, 0.4);
}
.widget hr {
    background-color: rgba(255, 255, 255, 0.1);
}
.widget p {
    margin-bottom: 30px;
}
.widget p strong {
    color:#fff;
}
.widget p:last-child {
  margin-bottom:0;
}
.widget input, .widget textarea {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.1);
    color: #999;
    font-size: 14px;
    padding: 8px;
}
.widget input:focus, .widget textarea:focus {
    border-color: rgba(255, 255, 255, 0.3);
}
.widget button, .widget .button, .widget input[type="button"], .widget input[type="reset"], .widget input[type="submit"] {
    background-color: #0099cc;
    border: 0;
    font-size: 12px;
    padding: 8px 15px;
}
.widget input[type="button"]:hover, .widget input[type="button"]:focus, .widget input[type="reset"]:hover, .widget input[type="reset"]:focus, .widget input[type="submit"]:hover, .widget input[type="submit"]:focus {
    color: #222;
    background-color: #fff;
}
.widget input[type="button"]:active, .widget input[type="reset"]:active, .widget input[type="submit"]:active {
    color: #222;
    background-color: #fff;
}
.widget .wp-caption {
    color: rgba(255, 255, 255, 0.7);
    margin-bottom: 18px;
}
.widget .widget-title {
    font-size: 18px;
    margin: 0 0 15px 0;
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
}
.sidebar .widget .widget-title {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 0;
}
#footer-container .widget .widget-title {
    font-size: 18px;
    color: #FFF;
    margin-bottom: 0;
}
.widget .widget-title:after{
    content:"";
    width: 100%;
    height: 5px;
    clear: both;
    margin-top:10px;
    position: relative;
    text-align: right;
    display: block;
    background: transparent url(images/line.png) left bottom repeat;
    margin-bottom: 20px;
}
#footer .widget .widget-title {
    margin-bottom: 20px;
}
.widget-title, .widget-title a {
    color: #aaa;
}
.widget-title a:hover {
    color: #0099cc;
}
#slidebar .widget .widget-title {
    font-size: 18px;
    font-weight: 500;
    color:rgba(255,255,255,0.7)
}

/* Tag Cloud Widget */
.widget_tag_cloud {
    overflow: hidden
}
.widget_tag_cloud .tagcloud a {
    padding: 6px 10px;
    margin: 3px;
    float: left;
    line-height: normal;
    color: #bbb;
    border: 1px solid #555;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-weight: 600;
    font-size: 13px !important;
    text-transform: uppercase;
}
.widget_tag_cloud .tagcloud a:before {
     content: "#";
}
.widget_tag_cloud .tagcloud a:hover {
    text-decoration: none;
    line-height: normal;
    border: 1px solid transparent;
    color: #fff;
    background-color: #0099cc;
}

/* Calendar Widget*/
.widget table#wp-calendar {
    background-color: transparent;
}
.widget table#wp-calendar a {
    display: block;
    background: #3D3E42;
    color: #FFF;
    line-height: 30px;
    text-decoration: none;
    font-weight: 700;
}
.widget table#wp-calendar a:hover {
    background: #fff;
    color: #333;
    line-height: 30px;
    text-decoration: none;
}
.widget table#wp-calendar {
    width: 99%;
    margin-left: 2px;
}
.widget table#wp-calendar tbody td {
    text-align: center;
    border: 1px solid #0B0B0C;
    background-color: #1E1E21;
    color: #999;
    font-size: 13px;
    line-height: 30px;
}
.widget table#wp-calendar caption {
    font-size: 12px;
    text-transform: uppercase;
    width: 100%;
    color: #ddd;
    padding: 0;
    margin-bottom: 5px;
    font-weight: 700;
}
.widget table#wp-calendar th {
    font-weight: normal;
    color: #999;
    background-color: #292A2D;
    text-align: center;
    padding: 2px;
    border: none;
}
.widget table#wp-calendar #next a {
    text-align: right;
    color: #999;
    line-height: 10px;
    background: none;
}
.widget table#wp-calendar #prev a {
    text-align: left;
    color: #999;
    line-height: 15px;
    background: none;
}
.widget table#wp-calendar #next a:hover, .widget table#wp-calendar #prev a:hover {
    color: #0099cc;
}

/* List Style Widgets*/
.widget li {
    margin-left: 0;
}
.widget_archive li, .widget_categories li, .widget_links li, .widget_meta li, .widget_nav_menu li, .widget_pages li, .widget_recent_comments li, .widget_recent_entries li {
    padding: 6px 0;
    color: #ccc;
    line-height: 20px;
}
.widget_archive li:last-child, .widget_categories li:last-child, .widget_links li:last-child, .widget_meta li:last-child, .widget_nav_menu li:last-child, .widget_pages li:last-child, .widget_recent_comments li:last-child, .widget_recent_entries li:last-child {
    border-bottom: none;
}
.widget_archive li:before, .widget_categories li:before, .widget_links li:before, .widget_meta li:before, .widget_nav_menu li:before, .widget_pages li:before, .widget_recent_comments li:before, .widget_recent_entries li:before {
    font-family: "icomoon";
    content: "\f105";
    display: inline-block;
    color: #0099cc;
    margin-right: 8px;
    margin-left: 0px;
}

/* Categories / archives meta */
.widget_archive li, .widget_categories li, .widget_meta li {
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    float:left;
    width:50%;
    margin-bottom:0;
    padding-bottom:4px;
}
.blog-list .widget_archive li,
.blog-list .widget_categories li,
.blog-list .widget_meta li {
    width:100%;
}
.widget_archive li:hover, .widget_categories li:hover, .widget_meta li:hover {
    
}
.widget_archive li a, .widget_categories li a, .widget_meta li a {
    color:#aaa;
    text-transform:uppercase;
}
.widget_archive li a:hover, .widget_categories li a:hover, .widget_meta li a:hover {
    color:#fff;
}

/* Recent Comments */
.widget_recent_comments li .url {
    padding-left:10px;
    display:block;
}

.widget_recent_comments li:before {
   content:"";
   padding-left:24px;
}
.widget_recent_comments li {}
.widget_recent_comments li > a {
    display: block !important;
    position: relative;
    margin-top: 5px !important;
    padding: 15px !important;
    border-radius: 4px;
    background: rgba(238,238,238,0.06);
}
.widget_recent_comments li > a:before {
    content: '';
    display: block;
    position: absolute;
    top: -28px;
    left: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 0px 14px 14px;
    border-color:transparent;
    border-bottom-color:rgba(238,238,238,0.06);
}

/* Categories */
.widget_categories li:before {
    
}

/* Recent Posts Widget */
.widget_recent_entries li:before {
  display:none;
}
.widget_recent_entries li {
    border-bottom:1px solid rgba(255,255,255,0.1);
    padding:10px 0;
}
.widget_recent_entries .post-date {
    display: block;
    margin-left:3px;
    opacity:0.5;
    font-size: 14px;
}

/* RSS Widget */
.rsswidget img {
    margin-top: -4px;
}
.widget_rss li a {
    color: #fff;
}
.rssSummary {
    margin: 9px 0;
    color: #999;
}
.rss-date {
    display: block;
    font-size: 12px
}
.widget_rss li {
    margin-bottom: 18px;
}
.widget_rss li:last-child {
    margin-bottom: 0;
}

/* Text Widget */
.widget_text > div >:last-child {
    margin-bottom: 0;
}


/* ----------------------------------------------------------------------
    23. Custom widgets
/* ---------------------------------------------------------------------- */

/* Tweets */
.rascals-widget-twiter {
    list-style: none;
    margin: 0;
}
.rascals-widget-twiter li {
    margin: 0 0 40px 0;
    padding-left: 40px;
    position: relative;
    background-color: rgba(18, 18, 18, 0.58);
    padding:15px;
    border-radius:5px;
}
.rascals-widget-twiter li a {
    color:#0099cc;
}
.rascals-widget-twiter li a:hover {
    color:#fff;
}
    .rascals-widget-twiter li .date a {
        display: block;
        margin-top: 0px;
        color: #999;
        border: none;
        width: 100%;
        font-size: 12px;
        text-align:right;
        text-transform:uppercase;
        position:absolute;
        bottom:-30px;
        right:0;
        font-weight: 400;
    }
    .rascals-widget-twiter li .date a:hover { color: #eee; }
    .rascals-widget-twiter li .date a:before {
        display:none
    }

/* Recent Releases */
.widget_pendulum_recent_releases {
}
.widget_pendulum_recent_releases .thumb {
    margin: 4px
}
.widget_pendulum_recent_releases .flex-col-1-2 {
    width: 50%;
}
.widget_pendulum_recent_releases .flex-col-1-3 {
    width: 33.33%;
}
.widget_pendulum_recent_releases .flex-col-1-4 {
    width: 25%
}
.widget_pendulum_recent_releases .flex-col-1-5 {
    width: 20%
}

/* Recent Posts */
.rascals-widget-rp .rp-list li {
   overflow: hidden;
   margin-bottom: 11px;
   padding: 10px;
   background-color: rgba(18, 18, 18, 0.72);
}
.rascals-widget-rp .rp-list li:last-child {
    border:0;
    margin-bottom: 0;
}
.rascals-widget-rp .rp-post-thumb {
    float: left;
    width:60px;
    overflow:hidden;
}
.rascals-widget-rp .rp-caption {
   padding-left:70px;
}
.rascals-widget-rp .rp-caption h4  {
    margin-bottom:0px;
    font-size: 15px;
    margin-top: 0px;
}
.rascals-widget-rp .rp-caption h4 a {
    font-weight: 400;
    color:#0099cc;
}
.rascals-widget-rp .rp-caption h4 a:hover {
    color:#fff;
}
.rascals-widget-rp .rp-caption .rp-date {
    text-transform:uppercase;
    font-size: 14px;
    color: #eee;
}
.rp-excerpt {
    color:#999
}


/* Flickr */
.widget.rascals-widget-flickr {

}
.rascals-widget-flickr .flickr_badge_image {
    width:33.333%;
    text-align:center;
    margin:0;
    height:auto;
    display:inline-block;
    float:none;
}
.rascals-widget-flickr a {
    padding:5px;
    display:block;
}
.rascals-widget-flickr img {
    margin: 0;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
}

/* Newsletter */
.mc-custom-widget input[type="submit"] {
    width:100%;
    padding:14px 10px;
    font-size:14px;
    margin-top:10px;
}

#footer-widgets .mc-custom-widget input {
    width:100%;
}


/* ----------------------------------------------------------------------
    24. Elements
/* ---------------------------------------------------------------------- */

/* Thumbs effects
 ------------------------------------ */

.thumb {
    display: block;
    margin-bottom: 30px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.thumb img {
    height: auto;
    display: block;
    max-width: 100%; 
    max-height: 100%;
    margin: 0;
    z-index: 1;
    width: 100%;
    vertical-align: middle;
}

/* SIMPLE THUMB */
.thumb-simple {
    background: #0B0B0C;
     -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.thumb-simple img {
     -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.thumb-simple:hover img {
    opacity: 0.2;
}

/* MEDIA THUMB */
.media-thumb {
    margin-bottom: 30px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
    border: 1px solid #292929;
    background: #121212;
    position: relative;
    margin-bottom: 30px;
    background-image: linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -o-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -moz-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -webkit-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -ms-linear-gradient(bottom, #181818 14%, #232323 47%);
    background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.14, #181818), color-stop(0.47, #232323));
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
    display:table;
    width:100%;
}
    .media-thumb.big-frame, 
    .media-thumb.big-frame-extended {
        padding:10px;
    }
    .media-thumb.big-frame-extended {
        width: calc(100% + 200px);
        margin-left:-100px;
    }
    .media-thumb.media-slider {
        display: block;
    }
    .media-thumb .image {
        height: auto;
        display: block;
        margin: 0;
        z-index: 1;
        width: 100%;
        vertical-align: middle;
    }
    .media-thumb.wpb_single_image .vc_single_image-wrapper,
    .media-thumb.wpb_single_image img,
    .media-thumb.wpb_single_image .vc_figure {
        width:100%;
    }

    .media-thumb .media-thumb-inner {
        position:relative;
        height:100%;
        border:1px solid #111;
        display:table-cell;
        overflow: hidden;
        background: #111;
    }

    .media-thumb.media-slider .media-thumb-inner {
        display:block;
    }

    /* Image */
    .media-thumb .image-container {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }

    /* Clickable layer */
    .clickable-layer {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 8;
        opacity:1;
    }
    
    /* Overlay */
    .overlay {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
        opacity:0;
        text-align:center;
        background: transparent url(images/overlay-dots.png) left top repeat;
        /*background: transparent url(images/overlay-noise.gif) left top repeat;*/
    }

    /* Icon */
    .media-icon {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 4;
    }
         .media-icon:after {
            content:"";
            position: absolute;
            left: 50%;
            top: 50%;
            margin-top: -40px;
            margin-left: -40px;
            width: 78px;
            height: 78px;
            border: 1px solid #fff;
            border-radius: 100%;
            transform:scale(0);
            opacity:1
        }
        .media-icon .icon {
            position: absolute;
            left: 50%;
            top: 50%;
            margin-top: -40px;
            margin-left: -40px;
            width: 80px;
            height: 80px;
            line-height: 76px;
            font-size: 30px;
            color: #fff;
            border: 3px solid #fff;
            border-radius: 100%;
            text-align: center;
            opacity: 0;
            transform:scale(0);
        }

/* Animations */
.media-thumb.media-anim .image,
.media-thumb.media-anim .owl-item.active > .slide-image,
.media-thumb.media-anim .overlay,
.media-thumb .overlay,
.media-icon .icon,
.media-icon:after {
    -webkit-transition: all 0.4s cubic-bezier(0.64, 0.57, 0.67, 1.53);
    -moz-transition: all 0.4s cubic-bezier(0.64, 0.57, 0.67, 1.53);
    transition: all 0.4s cubic-bezier(0.64, 0.57, 0.67, 1.53);
}
.media-thumb.media-anim:hover .icon {
    opacity:1;
    transform:scale(1);
}
.media-thumb.media-anim:hover .overlay {
    opacity:1;
    transition-delay: 0.2s;
}
.media-thumb.media-anim:hover .media-icon:after {
    animation: media_icon_anim 0.4s ;
    animation-fill-mode: forwards;
}

@keyframes media_icon_anim {
  0%   { 
         transform:scale(0);
         opacity:1;
         -webkit-filter: blur(0);
         filter: blur(0);
    }
  50% { 
        transform:scale(1);
        opacity:1;
        -webkit-filter: blur(4px);
        filter: blur(4px);
    }
 100%   { 
        transform:scale(1.6);
         opacity:0;
         -webkit-filter: blur(0px);
         filter: blur(0);
    }
}
.media-thumb.media-anim:hover .image,
.media-thumb.media-anim:hover .owl-item.active .slide-image {
    animation: media_anim 0.2s ;
    animation-fill-mode: forwards;
}

@keyframes media_anim {
  0%   { 
    -webkit-filter: blur(0) grayscale(0) opacity(1);
     filter: blur(0) grayscale(0) opacity(1);
     animation-timing-function:ease-out;
    }
  50% { 
    transform:scale(1.02);
    -webkit-filter: brightness(200%) grayscale(.5) opacity(0.8);
    filter: brightness(200%) grayscale(.5) opacity(0.8);
    animation-timing-function:ease-in;
    }
 100%   { 
    -webkit-filter: brightness(100%) grayscale(1) opacity(0.5);
    filter: brightness(100%) grayscale(1) opacity(0.5);
     animation-timing-function:ease-out;
    }
}


/* line */
.line {
    width: 100%;
    height: 5px;
    position: relative;
    text-align: right;
    display: block;
    background: transparent url(images/line.png) left bottom repeat;
    margin-bottom: 30px;
}


/* Separator
 ------------------------------------ */
hr.separator {
    background-color: #ddd;
    width: 100%;
    height: 1px;
    margin-bottom: 80px;
}


/* Icon button
 ------------------------------------ */
.icon-button {
    border: 1px solid #fff;
    color: #fff;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
    font-weight: 400;
    text-transform: uppercase;
    height: 60px;
    width: 60px;
    text-align: center;
    display: inline-block;
    position: relative;
    z-index: 1;
}
.icon-button i {
    font-size: 16px;
    color: #fff;
    line-height: 60px;
    z-index: 2;
    position: relative;
}
.icon-button:after {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: '';
    position: absolute;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    border-radius: 60px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 0;
}
.icon-button:hover:after {
    background-color: #fff;
}
.icon-button:hover i {
    color: #111;
}


/* Flexible video
 ------------------------------------ */
.video-wrap {
    margin: 0 0 30px;
}


/* Alertboxes
 ------------------------------------ */
.error, .success, .info, .warning {
    display: block;  /* font-weight: bold; */
    border: 1px solid;
    padding: 14px 20px 14px 20px;
    clear: both;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-weight: 600;
}
.error {
    background-color: #fdcaca;
    color: #7f6060;
    border-color: #ffc3c3;
}
.success {
    background-color: #cafdce;
    color: #637a65;
    border-color: #9cfaa3;
}
.info {
    background-color: #dee9fe;
    color: #737b8b;
    border-color: #cddfff;
}
.warning {
    background-color: #fbe9de;
    color: #877863;
    border-color: #fbe0b9
}


/* Buttons
 ------------------------------ */

/* Default button */
input[type="submit"], button, .btn, .widget .btn {
    font-family : "Source Sans Pro", Helvetica, Arial, sans-serif;
    display: inline-block;
    position: relative;
    padding: 14px 32px;
    background-color:#0099cc;
    font-size: 14px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: none;
    vertical-align: middle;
    white-space: nowrap;
    text-rendering: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 5px;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    font-weight: 600;
    font-style: normal;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-feature-settings: "liga" on;
    -webkit-transition:all 0.2s ease-out;
    transition: all 0.2s ease-out;
    margin-right: 5px;
    margin-bottom: 5px;
    width: auto;
    text-transform: uppercase;
    color: #fff;
    letter-spacing: 0.03em;
}
.text-center .btn {
    margin-right:5px;
    margin-left:5px;
}
input[type="submit"]:hover, button:hover, .btn:hover, .widget .btn:hover {
    background-color:#eee;
    color:#222;
}
input[type="submit"].inverted, button.inverted, .btn.inverted, .widget .btn.inverted {
    background-color:#eee;
    color:#222;
}
input[type="submit"].inverted:hover, button.inverted:hover, .btn.inverted:hover, .widget .btn.inverted:hover {
    background-color:#eee;
    color:#222;
}
.btn.btn-icon {
    padding-left:0;
}
.btn.btn-icon .icon {
    background-color: rgba(000,000,000,0.4);
    color: #fff;
    border-radius: 4px;
    padding: 15px;
    margin-right: 15px;
}

.btn > i:first-child:not(:last-child) {
    margin-right: 5px;
}
.btn > i:last-child:not(:first-child) {
    margin-left: 5px;
}
.btn.btn-transparent {
    background-color: transparent !important;
}
.btn.btn-small {
    font-size: 13px;
}
.btn.btn-medium {
    font-size: 15px;
}
.btn.btn-big {
    font-size: 18px;
}
.btn.btn-circle {
    padding: 0;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 999em;
    min-width: initial;
}
.btn:hover .icon {
    color:#fff;
}
.btn.load-more {
    position: relative;
    padding-left: 60px;
    margin-top:20px;
}
    .btn.load-more:hover .icon-wrap {
        color:#222;
    }
    .btn.loaded.load-more:hover .icon-wrap {
        transform:none;
        
    }
    .btn.load-more .icon-wrap {
        position: absolute;
        width: 44px;
        height: 44px;
        color:#fff;
        display: inline-block;
        left: 7px;
        top: 0;
        border-radius: 100%;
        transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
        text-align:center;
    }
    .btn.load-more .icon-wrap .icon {
        line-height:45px;
    }
    .btn.load-more:hover .icon-wrap .icon {
        color:#222;
    }
    .btn.load-more .icon-wrap .icon:after {
        content:"\e644";
    }
    .btn.load-more.loaded .icon-wrap .icon:after {
        content:"\e642";
    }
    .btn.load-more.loading .icon-wrap .icon {
        position:absolute;
        left:0;
        top:0;
        width: 44px;
        height: 44px;
        font-size: 24px;
        -webkit-animation:spin 1.5s linear infinite;
        -moz-animation:spin 1.5s linear infinite;
        animation:spin 1.5s linear infinite;
    }
    .btn.load-more.loading .icon-wrap .icon:after {
        content: "\e61e";
    }
    

/* Circle */
.circle-btn {
    display: inline-block;
    margin: 0px 5px 5px 0;
    color: rgba(255,255,255,0.1);
    vertical-align: middle;
    line-height: normal;
    font-size: 12px;
    line-height: 27px;
    border-radius: 100%;
    font-weight: 400;
    text-transform:uppercase;
    text-align: center;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(255,255,255,0.3);
}
.circle-btn span {
    line-height: 16px;
    font-size: 14px;
    vertical-align: middle;
    color: rgba(255,255,255,0.7);
}
.circle-btn:hover,
.circle-btn:hover span {
    color: #fff;
    border-color:transparent;
}
.circle-btn:hover {
    background-color:#0099cc;
}

/* Pill btn */
.pill-btn {
    border-radius: 999em;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    font-weight: 400;
    -webkit-transition:all 0.2s ease-out;
    transition: all 0.2s ease-out;
    color: #fff;
    background-color: #0099cc;
    margin-right: 3px;
    margin-bottom: 5px;
    padding: 1px 10px;
    text-transform:uppercase;
    font-size:11px;
    letter-spacing:0.02em;
    margin-bottom:8px;
    display:inline-block;
}
.pill-btn:hover {
    background-color:#eee;
    color:#222;
}
.pill-btn.medium {
    font-size: 13px;
}

.button-position {
    text-align: center;
}


/* Content Slider / Carousel Slider
 -------------------------------- */
.content-slider {

}
    .owl-carousel .captions {
        position:absolute;
        left:0;
        bottom:0;
        right:0;
        top:0;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0+36,0.65+100 */
        background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 36%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 36%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 36%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        z-index: 4;
        overflow: hidden;
    }
        .owl-carousel .captions > .captions-inner {
            position:absolute;
            left:20px;
            bottom:20px;
            text-align: left;
            right: 20px;
            color: #fff;
            z-index:10
        }
        .owl-carousel .captions .subtitle a {
            color:#fff;
        }

        .owl-carousel .captions .title {
            font-size: 26px;
            margin-bottom: 10px;
        }
        .owl-carousel .captions .subtitle {
            font-size: 18px;
            margin-bottom: 10px;
        }

        .slider-small .captions .title {
            font-size:14px;
            margin-bottom:5px
        }
        .slider-small .captions .subtitle {
            font-size:12px;
            margin-bottom:0
        }
        .slider-small .captions > .captions-inner {
            left:10px;
            bottom:10px;
            right: 10px;
        }


/* Nav */
.owl-controls .owl-nav {
    z-index: 10;
}
    .owl-controls .owl-nav .owl-next, .owl-controls .owl-nav .owl-prev {
        position: absolute;
        top:50%;
        width: 40px;
        height: 40px;
        line-height: 40px;
        margin-top: -20px;
        background-color: rgba(000,000,000,0.4);
        border-radius: 5px;
        color: #fff;
        text-align: center;
        -webkit-transition: all 0.3s cubic-bezier(0.64, 0.57, 0.67, 1.53);
        -moz-transition: all 0.3s cubic-bezier(0.64, 0.57, 0.67, 1.53);
        -ms-transition: all 0.3s cubic-bezier(0.64, 0.57, 0.67, 1.53);
        -o-transition: all 0.3s cubic-bezier(0.64, 0.57, 0.67, 1.53);
        transition: all 0.3s cubic-bezier(0.64, 0.57, 0.67, 1.53);
        opacity: 0;
    }
    .owl-controls .owl-nav .owl-next {
        right: -20px;

    }
    .owl-controls .owl-nav .owl-prev {
        left: -20px;

    }
    .owl-controls .owl-nav .owl-next:hover, .owl-controls .owl-nav .owl-prev:hover {
       background-color: rgba(000,000,000,0.8);
        
    }

    .owl-carousel:hover .owl-controls .owl-nav .owl-next {
        right: 20px;
        opacity: 1;
        transform:scale(1);
    }
    .owl-carousel:hover .owl-controls .owl-nav .owl-prev {
        left: 20px;
        opacity: 1;
        transform:scale(1);
    }
    .owl-controls .owl-nav .owl-next:after, .owl-controls .owl-nav .owl-prev:after {
        font-family: "icomoon";
        font-size:18px;
        font-weight:bold;
    }
    .owl-controls .owl-nav .owl-next:after {
        content: "\f105";
    }
    .owl-controls .owl-nav .owl-prev:after {
        content: "\f104";
    }

/* Dots */
.owl-controls .owl-dots {
    z-index: 10;
    position: absolute;
    text-align: right;
    top: 20px;
    width: 100%;
    right: 20px;
}
.slider-small .owl-controls .owl-dots {
    display: none !important;
}
.slider-small .owl-controls .owl-dots {
    top:5px;
    right:5px;
}
    .owl-controls .owl-dot {
        display: inline-block;
    }
        .owl-controls .owl-dots span {
            display: block;
            width: 12px;
            height: 12px;
            position: relative;
            margin: 0 4px;
             -webkit-transition: all 0.5s ease-out;
            -moz-transition: all 0.5s ease-out;
            -ms-transition: all 0.5s ease-out;
            -o-transition: all 0.5s ease-out;
            transition: all 0.5s ease-out;
            background-color: #fff;
            display: inline-block;
            opacity: 0.2;
            border-radius:100%;
        }
        .owl-controls .owl-dots .owl-dot.active span:after, .owl-controls .owl-dots span:hover:after {
            content: '';
            width: 12px;
            height: 12px;
            background-color: #fff;
            position:absolute;
            left:0px;
            top:0px;
            border-radius:100%;
             -webkit-animation: dot_scale 0.5s  ease-out;
            animation: dot_scale 0.5s ease-out;
        }
        @-webkit-keyframes dot_scale {
          0% { -webkit-transform: scale(1) }
          100% {
            -webkit-transform: scale(4.0);
            opacity: 0;
          }
        }

        @keyframes dot_scale {
          0% { 
            -webkit-transform: scale(1);
            transform: scale(1);
          } 100% {
            -webkit-transform: scale(4.0);
            transform: scale(4.0);
            opacity: 0;
          }
        }

        .owl-controls .owl-dots .owl-dot.active span, .owl-controls .owl-dot:hover span {
            width: 12px;
            height: 12px;
            background-color: #fff;
            opacity:1;
            position:relative;
            border-radius:100%
        }
    
/* Video options */
.owl-carousel .owl-video-playing .captions,
.owl-carousel .owl-video-playing .overlay {
  display: none;
}
.video-slide .overlay {
    opacity:1;
}

/* Music Slide */
.music-slide .overlay {
    opacity: 0;
}
.music-slide .media-icon {
    opacity:1;
    transform:scale(1);
    cursor:pointer;
    z-index: 5;
}
.music-slide .media-icon .icon {
    opacity:0;
    transform:scale(1);
}
.slider-small .music-slide .media-icon .icon {
    font-size:18px;;
    width:40px;
    height:40px;
    margin-left:-20px;
    margin-top:-20px;
    line-height:36px;
}
.music-slide .media-icon .icon-pause {
    display:none;
}
.music-slide .spl-track {
    position:absolute;
    left:0;
    bottom:0;
    right:0;
    top:0;
}
.music-slide .spl-track.playing .media-icon .icon-pause {
    display:block;
}
.music-slide .spl-track.playing .media-icon .icon-play2 {
    display:none;
}
.music-slide .spl-track.playing .media-icon .icon,
.music-slide .spl-track.paused .media-icon .icon {

    opacity:1
}
.music-slide .spl-elapsed, .music-slide .spl-total {
    z-index:3;
    font-size:24px;
    color:#fff;
    position:absolute;
    top:50%;
    margin-top:-16px;
    width:60px;
    text-align:center;
    text-shadow: 0px 0px 4px #fff;
    font-weight: 400;
}
.slider-small .music-slide .spl-elapsed, .slider-small .music-slide .spl-total {
    font-size:16px;
    width:50px;
    margin-top:-13px
}
.music-slide .spl-elapsed {
    left:50%;
    margin-left: -100px;
}
.music-slide .spl-total {
    right:50%;
    margin-right: -100px;
}
.slider-small .music-slide .spl-elapsed {
    margin-left: -70px;
}
.slider-small .music-slide .spl-total {
    margin-right: -70px;
}
.music-slide .spl-progress {
    position:relative;
    display:block;
    height:20px;
    z-index: 1000;
}
.music-slide .spl-loading, .music-slide .spl-position  {
    position:absolute;
    left:0;
    top:0;
    right:0;
    z-index:3;
    display:block;
    bottom: 0;
    width:0;
}
.music-slide .spl-loading {
    background-color: rgba(000,000,000,0.4);
}
.music-slide .spl-position {
    background-color: #0099cc;
    opacity:0.4;
}


/* Scroll Button
 ------------------------------ */
#top-button {
    font-family: "icomoon";
    background: #0099cc;
    width: 40px;
    height: 40px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 10;
    text-align: center;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
    color: #fff;
    -webkit-transition-delay: 0.2s; /* Safari */
    transition-delay: 0.2s;
    border-radius: 5px;
    opacity: 0;
}
#top-button:hover {
   /* background-color:#E82561;
    color:#fff;*/
}
#top-button i {
    margin-left: 0;
    line-height:37px;
    font-size: 25px;
    font-style: normal;
    vertical-align:top;
}
#top-button i:after {
     content: "\f106";
}
#top-button.active {
    opacity: 1;
}


/* ----------------------------------------------------------------------
    25. Plugins
/* ---------------------------------------------------------------------- */

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }


/* ----------------------------------------------------------------------
    25. Plugins
/* ---------------------------------------------------------------------- */


/* Tooltip
 -------------------------------- */
#tooltip { 
    border-radius: 5px; 
    padding:5px; 
    width:50px; 
    height:50px; 
    position: absolute; 
    display: none; 
    z-index:999; 
    background:#000 url(images/ajax-loader-tooltip.gif) 48% 45% no-repeat;
}


/* Newsletter
 -------------------------------- */
.mc-split-form {
    margin-bottom:15px;
    font-size: 15px;
    display:table;
    max-width:400px;
    margin-left:auto;
    margin-right:auto;
}
.mc-btn-group {
     display:table-cell;
     width:1%;
     vertical-align:middle;
}
.mc-split-form input[type="submit"] {
    padding: 10px 10px;
    font-size: 14px;
    width: 20%;
    min-width: 120px;
    height: 50px;
    white-space:nowrap;
    overflow:hidden;
    padding-left:10px;
    letter-spacing: 0.06em;
    text-align: center;
    border-radius: 0;
}

#footer-container .mc-split-form input[type="submit"] {
    min-width:100px;
    padding:0 10px;
}
.mc-split-form input[type="email"] {
    color:#eee;
    background-color:transparent;
    display:table-cell;
    /* border-radius:99em; */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    height: 50px;
    padding-left:20px;
    background-color:rgba(255,255,255,0.2);
    border:0;
    width: 100%;
    vertical-align:middle;
    font-size:15px;
}

.mc-split-form input[type="email"]::-webkit-input-placeholder {
    font-size:15px;
    color:#fff
}
.mc-split-form input[type="email"]::-moz-input-placeholder {
    font-size:15px;
    color:#fff
}


/* Message for older IE browsers
 -------------------------------- */
#ie-message {
    background: #c00;
    border-bottom: 1px solid #900;
    display: block;
    margin: 0 auto 20px auto;
    width: 100%;
    z-index: 2000;
}
#ie-message p {
    text-align: center;
    color: #fff;
    font-size: 13px;
    padding: 20px;
    margin: 0 25%;
}
#ie-message a {
    color: #fff;
    font-weight: bold;
    text-decoration: underline;
}


/* ----------------------------------------------------------------------
    26. MEDIA QUERIES
/* ---------------------------------------------------------------------- */

/* ----------------------------------------------------------------------
    Large Displays
/* ---------------------------------------------------------------------- */
@media only screen and (max-width:1320px) {

     /* Elements
    ------------------------------ */

    /* MEDIA THUMB */
    .media-thumb.big-frame-extended {
        width: 100%;
        margin-left:0px;
    }
}


/* ----------------------------------------------------------------------
    For Small Desktop Devices [ 960px ]
/* ---------------------------------------------------------------------- */
@media only screen and (max-width:1200px) {


    /* Basic Elements & Classes
    ------------------------------ */

    /* Blockquote */
    .single-post .main.thin blockquote {
        margin-left:0;
        margin-right:0;
    }


    /* WordPress Core Styles
    ------------------------------ */
    .main.thin .gallery {
        margin-left:0;
        margin-right:0;
    }


    /* Typography
    ------------------------------ */



    /* Layout and Content
    ------------------------------ */

    /* Container */
    .container {
        width: 960px;
    }

    /* Visual Composer Container */
    .vc-container {
        width: 990px;
    }
    .vc-container.thin {
        width: 800px;
    }

    /* Columns */
    .col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4 {
        margin-right: 20px;
    }
    .col-1-2 {
        width: 460px;
    }
    .col-1-3 {
        width: 300px;
    }
    .col-1-4 {
        width: 220px;
    }
    .col-2-3 {
        width: 620px;
    }
    .col-3-4 {
        width: 700px;
    }
    .center-col {
        margin: 0 auto;
        width: 500px;
    }

   /* Main */
    .main {
        width: 640px;
    }
    .main.thin {
        width: 800px;
    }
    .main.main-right {
        margin-left: 50px;
    }
    .main.main-left {
        margin-right: 50px;
    }
    .main.wide, .main.vc {
        width: 100%;
    }

    /* Sidebar */
    .sidebar {
        width: 260px;
    }


    /* Posts
    ------------------------------ */
    .single-post .article-media {
        margin-left: 0px;
        margin-right:0px;
    }

}


/* ----------------------------------------------------------------------
    For Tablet and Mobile devices 
/* ---------------------------------------------------------------------- */
@media only screen and (max-width:979px) {


    /* Basic Elements & Classes
    ------------------------------ */

    /* Blockquote */
    .single-post .main.thin blockquote {
        margin-left:0;
        margin-right:0;
    }
    blockquote p {
        padding: 20px
    }
    table td, table th {
        padding: 8px;
    }


    /* Layout and Content
    ------------------------------ */

    /* Columns */
    .col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4 {
        margin-right: 20px;
    }

    /* Masonry Grid */
    .full-width .masonry {
        margin-left: 0;
        margin-right: 0;
    }

    /* Masonry Grid */
    .blog-grid .masonry-item, .full-width .blog-grid .masonry-item {
        width: 50%;
    }

    /* Main */
    .main {
        width: 100%
    }
    .main.main-right {
        margin-left: 0;
    }
    .main.main-left {
        margin-right: 0;
    }
    
    /* Sidebar */
    .sidebar {
        width: 100%;
        margin-top: 40px
    }
    

    /* Helper Classes
    ------------------------------ */

    /* Header 
    ------------------------------ */
    .admin-bar #header.sticky {
        top: 32px;
    }


    /* Main Navigation
    ------------------------------ */
    #main-nav li.top-nav-el {
        display: block
    }
    #nav {
        display: none;
    }


    /* Posts
    ------------------------------ */
    .article-title, .article-title a {
        font-size: 28px;
    }

    /* Small thumbs layout */
    .blog-classic .small-thumb .article-inner,
    .blog-classic .small-thumb .media-container,
    .blog-classic .small-thumb .article-content {
        display:block;
    }

    .blog-classic .small-thumb .article-content {
        padding-left:0px;
    }
    

    /* Events
    ------------------------------ */

    /* Countdown */
    .countdown .days, .countdown .hours, .countdown .minutes, .countdown .seconds {
        font-size: 48px;
        margin-top:2px;
    }
    .countdown .days:after, .countdown .hours:after, .countdown .minutes:after, .countdown .seconds:after {
        content: attr(data-label);
        font-size: 12px;
    }

    /*  Module */
    .event-countdown.compact .upcoming-title {
        font-size:18px;
    }


     /* Event Countdown
    ------------------------------ */
    .event-countdown.big .upcoming-title {
        font-size: 30px;
    }
    .event-countdown.big .upcoming-date {
        font-size:18px;
    }
    .event-countdown.big .countdown .days, 
    .event-countdown.big .countdown .hours, 
    .event-countdown.big .countdown .minutes, 
    .event-countdown.big .countdown .seconds {
        font-size:90px;
        margin: 0 5px;
    }

    .event-countdown.big .countdown .days:after, 
    .event-countdown.big .countdown .hours:after, 
    .event-countdown.big .countdown .minutes:after, 
    .event-countdown.big .countdown .seconds:after {
        font-size:16px;
    }


    /* Intro Sections
    ------------------------------ */
    #intro.media-slider, #intro.media-slider .content-slider, #intro.media-slider .slide,
    #intro.media-image,
    #intro.media-gmaps, #intro .gmap {
        min-height: 350px !important;
    }
    

    /* Filters
    ------------------------------ */
    .filters-wrapper.filter-1 .filter,
    .filters-wrapper.filter-2 .filter,
    .filters-wrapper.filter-3 .filter,
    .filters-wrapper.filter-4 .filter {
        width: 100%;
        margin-right: 0;
    }
    .filters-wrapper {
        padding:0 18px
    }


    /* Widgets
    ------------------------------ */
    
    /* Flickr  */
    .rascals-widget-flickr .flickr_badge_image {
        float:left;
        width:auto;
        text-align:center;
    }
    

    /* Elements
    ------------------------------ */

    /* Stamp Button */
    .stamp-button {
        padding: 10px 30px
    }


    /* Footer
    ------------------------------ */
    #footer {
        clear: both;
        padding: 50px 0 50px 0;
    }

    #footer-widgets {
        background: #171719;
        padding:50px 0 0px;
    }

    #footer-widgets > .container {
        display:block;
        width:100%;
        padding:0;
    }
    #footer-widgets .footer-col  {
        width: 100%;
        padding: 10px 30px;
        display: block;
    }
    #footer-note .footer-copyrights {
        text-align:left;
    }
}


/* ----------------------------------------------------------------------
    For Tablet Devices [ 748px ]
/* ---------------------------------------------------------------------- */
@media only screen and (min-width:768px) and (max-width:979px) {


    /* Layout and Content
    ------------------------------ */

    /* Container */
    .container {
        width: 748px;
    }

     /* Visual Composer Container */
    .vc-container, .vc-container.thin {
        width: 778px;
    }

    /* Columns */
    .col-1-2 {
        width: 364px;
    }
    .col-1-3 {
        width: 236px;
    }
    .col-2-3 {
        width: 492px;
    }
    .col-1-4 {
        width: 172px;
    }
    .col-3-4 {
        width: 492px;
    }

    /* Masonry Grid */
    .masonry-item, .full-width .masonry-item {
       
    }

    /* Main */
    .main {
        width: 492px;
    }
    .main.thin {
        width: 100%;
    }
    .main.main-right {
        margin-left: 20px;
    }
    .main.main-left {
        margin-right: 20px;
    }
    .main.wide, .main.vc {
        width: 100%;
    }

    /* Sidebar */
    .sidebar {
        width: 236px;
    }

  
}


/* ----------------------------------------------------------------------
    For Mobile Devices [ 640px ]
/* ---------------------------------------------------------------------- */
@media only screen and (min-width:640px) and (max-width:781px) {


    /* Layout and Content
    ------------------------------ */

    /* Container */
    .container {
        width: 620px;
    }

    /* Visual Composer Container */
    .vc-container, .vc-container.thin {
        width: 650px;
    }

     /* Columns */
    .col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4 {
        margin-right: 0px;
        width: 100%;
    }
    
    /* Flexible columns */
    .flex-col-1-2, .flex-col-1-4 {
        width: 50%
    }

    /* Masonry Grid */
    .masonry-item, .full-width .masonry-item {
        width: 50%;
    }

    /* Main */
    .main {
        width: 100%
    }
    .main.main-right {
        margin-left: 0;
    }
    .main.main-left {
        margin-right: 0;
    }

    /* Sidebar */
    .sidebar {
        width: 100%;
        margin-top: 40px;
        opacity:1;
    }

    /* Header 
    ------------------------------ */
    #header.show-bg {
        min-height: 43px;
    }
    .admin-bar #header.sticky {
        top: 46px;
    }
    

}


/* ----------------------------------------------------------------------
    For Mobile Devices [ 300px ]
/* ---------------------------------------------------------------------- */
@media only screen and (max-width:767px) {


    /* Basic Elements & Classes
    ------------------------------ */
    body {
        /* font-size: 15px; */
        line-height: 1.6;
    }
    

    /* Typography
    ------------------------------ */

    /* Lead text */
    .big-heading {
        font-size: 32px;
    }


    /* Layout and Content
    ------------------------------ */

    /* Container */
    .container {
        width: 100%;
        padding: 0 20px;
    }

     /* Visual Composer Container */
    .vc-container, .vc-container.thin {
        width: 100%;
        padding: 0 30px;
    }
    .vc-container > .vc_column_container > .vc_column-inner { padding: 0; }  

    body .vc_row { 
        margin-left:0 !important;
        margin-right: 0 !important;
    }
    body .vc_column_container>.vc_column-inner {
        padding-left: 0px;
        padding-right: 0px;
    }

    /* Columns */
    .col-1-1, .col-1-2, .col-1-3, .col-2-3, .col-1-4, .col-3-4 {
        margin-right: 0px;
        width: 100%;
        margin-bottom: 20px;
    }

    /* Masonry Grid */
    .masonry-item, .full-width .masonry-item,
    .blog-grid .masonry-item, .full-width .blog-grid .masonry-item {
        width: 100%;
        /* margin-bottom: 20px; */
        padding-left: 0;
        padding-right: 0;
    }

    /* Flexible columns */
    .flex-col-1-1, .flex-col-1-2, .flex-col-1-3, .flex-col-1-4, .flex-col-1-5 {
        width: 100%
    }

    /* Main */
    .main {
        width: 100%
    }
     .main.thin {
        width: 100%;
    }


    /* Slidebar
     ------------------------------ */
    #slidebar {
        width: 280px; 
        -webkit-transform: translateX(280px);
        -moz-transform: translateX(280px);
        transform: translateX(280px);
    }
    body.slidebar-visible #ajax-container, body.slidebar-visible #footer-container, body.slidebar-visible #header {
        -webkit-transform: translateX(-280px);
        -moz-transform: translateX(-280px);
        transform: translateX(-280px);
    }


    /* Header
    ------------------------------ */
    #header, #header-wrap {
        min-height: 58px;
    }
    #logo img {
      width: 80%;
    }
    .admin-bar #header.sticky {
        top: 46px;
    }


    /* Menu trigger Button
    ------------------------------ */
    #menu-trigger {
        top: 15px;
        right: 25px;
    }


    /* Paging Navigation
    ------------------------------ */
    .post-navigation .nav-label {
        font-size: 16px;
    }
    .post-nav-preview { 
        display:none
     }


    /* Posts
    ------------------------------ */
    .article-title, .article-title a {
        font-size: 24px;
    }
    
    /*  Meta */
    .meta-col:not(:first-child) {
        padding-left: 16px;
    }
    /* Small thumbs layout */
    .blog-classic .small-thumb .article-inner,
    .blog-classic .small-thumb .media-container,
    .blog-classic .small-thumb .article-content {
        display:block;
    }
    .blog-classic .small-thumb .media-container {
        padding-right: 0px;
    }


    /* Intro Sections
    ------------------------------ */

    /* Intro text sizes */
    .intro-text h1 {
        font-size: 44px;
    }
    .intro-text h2 {
        font-size: 38px;
    }
    .intro-text h3 {
        font-size: 32px;
    }

    /* Intro height */
    #intro.media-slider, #intro.media-slider .content-slider, #intro.media-slider .slide,
    #intro.media-image,
     #intro.media-gmaps, #intro .gmap {
        min-height: 350px !important;
    }
    
    
    /* Events Grid
    ------------------------------ */
    .events-grid .container.filters-wrapper {
        padding: 0;
    }


    /* Event List
    ------------------------------ */
    .masonry-list .event-li .title,
    .masonry-list .event-li .venue {
        width: 100%;
        display:block;
    }


    /* Event Countdown
    ------------------------------ */
    .event-countdown.big .upcoming-title {
        font-size: 28px;
    }
    .event-countdown.big .upcoming-date {
        font-size:18px;
        margin-bottom:5px
    }
    .event-countdown.big .countdown .days, 
    .event-countdown.big .countdown .hours, 
    .event-countdown.big .countdown .minutes, 
    .event-countdown.big .countdown .seconds {
        font-size:37px;
        margin: 0 5px;
    }

    .event-countdown.big .countdown .days:after, 
    .event-countdown.big .countdown .hours:after, 
    .event-countdown.big .countdown .minutes:after, 
    .event-countdown.big .countdown .seconds:after {
        font-size:12px;
    }


    /* Gallery
    ------------------------------ */
    .gallery-album-image {
       width:50%;
    }


    /* 404
    ------------------------------ */
    .big-404 {
        font-size: 180px
    }


    /* Comments
    ------------------------------ */
    .comments-title {
        font-size: 18px
    }
    .comment .avatar-wrap {
        position: relative;
    }
    .comment .children .comment {
        padding-left: 0
    }
    .comment-body {
        margin-left: 0;
        margin-top: 30px;
    }
    .comment .comment-meta {
        margin-left: 80px;
        margin-top: 10px;
    }
    

    /* Footer
    ------------------------------ */
    #footer-widgets .footer-col  {
        width: 100%;
        padding: 10px 20px;
        display: block;
    }
}


/* ----------------------------------------------------------------------
    For Mobile Devices [ 440px ]
/* ---------------------------------------------------------------------- */
@media only screen and (max-width:480px) {


    /* Layout and Content
    ------------------------------ */

    /* Flexible columns */
    .flex-col-1-2, .flex-col-1-4 {
        width: 50%
    }

    /* Masonry Grid */
    .masonry-item, .full-width .masonry-item {
        width: 100%;
    }

}