/* 
    Created on  : Sep 20, 2016, 5:35:49 PM
    Author      : Sergiu
    Role        : General resets style
*/

/*############################################################################*/

/*Fonts*/
@font-face {
    font-family: 'ApexBoldItalic';
    src: url('../fonts/apexnew-bolditalic-webfont.eot');
    src: url('../fonts/apexnew-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-bolditalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-bolditalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-bolditalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-bolditalic-webfont.svg#apex_newbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexBold';
    src: url('../fonts/apexnew-bold-webfont.eot');
    src: url('../fonts/apexnew-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-bold-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-bold-webfont.woff') format('woff'),
         url('../fonts/apexnew-bold-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-bold-webfont.svg#apex_newbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexBook';
    src: url('../fonts/apexnew-book-webfont.eot');
    src: url('../fonts/apexnew-book-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-book-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-book-webfont.woff') format('woff'),
         url('../fonts/apexnew-book-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-book-webfont.svg#apex_newbook') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexBookItalic';
    src: url('../fonts/apexnew-bookitalic-webfont.eot');
    src: url('../fonts/apexnew-bookitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-bookitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-bookitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-bookitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-bookitalic-webfont.svg#apex_newbook_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexHeavy';
    src: url('../fonts/apexnew-heavy-webfont.eot');
    src: url('../fonts/apexnew-heavy-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-heavy-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-heavy-webfont.woff') format('woff'),
         url('../fonts/apexnew-heavy-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-heavy-webfont.svg#apex_newheavy') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ApexHeavyItalic';
    src: url('../fonts/apexnew-heavyitalic-webfont.eot');
    src: url('../fonts/apexnew-heavyitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-heavyitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-heavyitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-heavyitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-heavyitalic-webfont.svg#apex_newheavy_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexLight';
    src: url('../fonts/apexnew-light-webfont.eot');
    src: url('../fonts/apexnew-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-light-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-light-webfont.woff') format('woff'),
         url('../fonts/apexnew-light-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-light-webfont.svg#apex_newlight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexLightItalic';
    src: url('../fonts/apexnew-lightitalic-webfont.eot');
    src: url('../fonts/apexnew-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-lightitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-lightitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-lightitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-lightitalic-webfont.svg#apex_newlight_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexMedium';
    src: url('../fonts/apexnew-medium-webfont.eot');
    src: url('../fonts/apexnew-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-medium-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-medium-webfont.woff') format('woff'),
         url('../fonts/apexnew-medium-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-medium-webfont.svg#apex_newmedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexMediumItalic';
    src: url('../fonts/apexnew-mediumitalic-webfont.eot');
    src: url('../fonts/apexnew-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-mediumitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-mediumitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-mediumitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-mediumitalic-webfont.svg#apex_newmedium_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexThin';
    src: url('../fonts/apexnew-thin-webfont.eot');
    src: url('../fonts/apexnew-thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-thin-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-thin-webfont.woff') format('woff'),
         url('../fonts/apexnew-thin-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-thin-webfont.svg#apex_newthin') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexThinItalic';
    src: url('../fonts/apexnew-thinitalic-webfont.eot');
    src: url('../fonts/apexnew-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-thinitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-thinitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-thinitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-thinitalic-webfont.svg#apex_newthin_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexUltra';
    src: url('../fonts/apexnew-ultra-webfont.eot');
    src: url('../fonts/apexnew-ultra-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-ultra-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-ultra-webfont.woff') format('woff'),
         url('../fonts/apexnew-ultra-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-ultra-webfont.svg#apex_newultra') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ApexUltraItalic';
    src: url('../fonts/apexnew-ultraitalic-webfont.eot');
    src: url('../fonts/apexnew-ultraitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/apexnew-ultraitalic-webfont.woff2') format('woff2'),
         url('../fonts/apexnew-ultraitalic-webfont.woff') format('woff'),
         url('../fonts/apexnew-ultraitalic-webfont.ttf') format('truetype'),
         url('../fonts/apexnew-ultraitalic-webfont.svg#apex_newultra_italic') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*############################################################################*/

/*Color variables*/
/*:root {
  --color-night: #383c4e;
  --color-night-medium: #262834;
  --color-night-dark: #202020;
  
  --color-slate: #9dabba;
  --color-slate-medium: #838f9b;
  --color-slate-dark: #607890;
  
  --color-light: #ffffff;
  --color-light-medium: #d1d1d1;
  --color-light-dark: #afafaf;
  
  --color-cherry: #c62258;
  --color-cyan: #1989e6;
  --color-amazon: #24b2aa;
}*/

/*############################################################################*/
a,
h1,h2,h3,
body {
    font-family: ApexBook!important;
}

a:hover {
    color: #428bca;
}
.page-header + .col {
    margin-left: 0;
}

body.pootle-page-customizer-active,
body {
    background-color: #383c4e!important;
}

input,
textarea {
    border-radius: 0!important;
    -moz-border-radius: 0!important;
    padding: 0 10px!important;
    line-height: 30px!important;
    font-size: 14px!important;
    box-shadow: none!important;
}

.single main.site-main {
    margin: 0;
}

.eighteen-tags-pro-active.single #content > .col-full {
    max-width: none!important;
}

main.site-main header.entry-header h1 {
    display: table;
    margin: 0 auto 50px auto;
    color: #FFF;
    font-size: 26px;
    text-align: center;
    text-transform: uppercase;
    border-bottom: 1px solid #CC2255;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 0;
}

.g-recaptcha > div {
    margin: 0 auto;
}

main.site-main {
    margin: 20px 0 0 0;
}

.button {
    background: transparent!important;
    display: table!important;
    margin: 50px auto 0 auto;
    color: #FFF!important;
    text-transform: uppercase;
    font-size: 22px;
    border: 1px solid #FFF!important;
    padding: 0!important;
    line-height: 40px!important;
    box-shadow: none!important;
    font-weight: 400!important;
    width: 100%;
    max-width: 400px;
    text-align: center;
}

@media screen and (max-width: 540px) {
    .button {
        max-width: 100%;
        font-size: 15px;
        margin: 20px auto 0 auto;
    }
}

/*############################################################################*/

/*Carousel*/
.photo-blog .wp-posts-carousel-slide {
    padding: 0!important;
    margin: 0!important;
    width: 100%!important;
}

.photo-blog .wp-posts-carousel-container {
    padding: 0!important;
    background: none!important;
    box-shadow: none!important;
    -moz-box-shadow: none!important;
}

.photo-blog .wp-posts-carousel-container:hover .wp-posts-carousel-details {
    opacity: 1;
}

.photo-blog .wp-posts-carousel-details {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.7);
    opacity: 0;
    transition: opacity 0.3s ease;
    cursor: pointer;
    height: 200px;
    z-index: 1;
}

.photo-blog .wp-posts-carousel-details h3 {
    padding: 0 20px;
}

.photo-blog .wp-posts-carousel-details h3 a {
    color: #000;
    display: block;
    width: 100%;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    margin-top: 100px;
    position: relative;
}

.photo-blog .wp-posts-carousel-details h3 a:before {
    display: block;
    position: absolute;
    left: calc(50% - 15px);
    top: -46px;
    width: 30px;
    height: 30px;
    background: #ce2052;
    border-radius: 100%;
    cursor: pointer;
    content: "+";
    color: #FFF;
    line-height: 30px;
    text-align: center;
    font-size: 46px;
    font-family: ApexThin;
    font-weight: 600;
}

.photo-blog .default-theme.wp-posts-carousel .wp-posts-carousel-image {
    padding: 0;
}

.photo-blog .default-theme.wp-posts-carousel .wp-posts-carousel-image img {
    width: 100%;
    height: 200px;
}

.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-prev,
.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-next {
    opacity: 1!important;
    top: 59%;
    width: 50px;
    background: transparent;
}

.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-prev:before,
.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-next:before {
    font-size: 60px;
    color: #FFF;
}

.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-prev {
    left: 0!important;
    padding: 0px 0 0px 10px!important;
}

.default-theme.wp-posts-carousel .owl-controls .owl-nav .owl-next {
    right: 0!important;
    padding: 0px 10px 0px 0!important;
}

/*############################################################################*/

/*Floating social media*/
.social-icons {
    position: fixed;
    left: 0;
    top: 380px;
    z-index: 1001;
}

.social-icons ul {
    margin: 0;
    list-style-type: none;
}

.social-icons ul li a {
    display: block;
    width: 40px;
    height: 35px;
    background: #c62258;
    margin-top: 1px;
    margin-left: -5px;
    transition: margin-left 0.5s ease;
}

.social-icons ul li a:hover {
    margin-left: 0;
}

.social-icons ul li a i:before {
    display: block;
    color: #FFF;
    text-align: center;
    line-height: 35px;
    width: 40px;
    font-size: 14px;
}

/* Colorbox fix */

#colorbox #cboxContent {
    margin-top: 44px;
}

#colorbox #cboxTitle {
    top: initial;
    bottom: 100%;
    left: 0;
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/*No image*/
.syria-no-image {
    background: url(../images/no-image.png);
    width: 100%;
    background-size: auto 115%;
    background-repeat: no-repeat;
    background-position: center;
}

.col-1-3 .syria-no-image {
    height: 164px;    
}

.col-1-4 .syria-no-image {
    height: 135px;
}

.latest-by-cat .post-meta.byline:after {
    content: none;
}

.latest-by-cat .post-meta,
.latest-by-cat .post-meta a {
    color: #607890;
    font-size: 13px;
}
.latest-by-cat .post-meta .author a {
    font-family: ApexBold!important;
    font-weight: 600;
}

/*############################################################################*/
@media screen and (min-width: 768px) {
    html, body, #page {
        min-height: 100%!important;
    }
    
    .main-navigation ul li.etp-search:hover > ul {
        display: none!important;
    }
    
    .eighteen-tags-pro-active #site-navigation {
        height: 63px!important;
    }
    
    .col-full {
        max-width: 65.141em!important;
    }
}

@media screen and (max-width: 767px) {
    .eighteen-tags-pro-active #site-navigation {
        height: 0px!important;
    }
}

@media screen and (min-width: 480px) and (max-width: 800px) {
    .col-1-4 {
        width: 48%!important;
    }
    
    .more-stories .col-1-4:nth-of-type(4) {
        margin-left: 0;
        clear: left;
    }
    
    .site-main .col-1-4:nth-child(3),
    .latest-posts .col-1-4:nth-child(3),
    .gallery-images .col-1-4:nth-child(3) {
        margin-left: 0;
        clear: left;
    }
    
}

@media screen and (max-width: 480px) {
    .latest-posts {
        margin-top: 30px;
    }
    
    .col-full {
        margin-left: 10px!important;
        margin-right: 10px!important;
    }
    
    main.site-main {
        margin: 0;
    }

    .eighteen-tags-pro-active.single #content > .col-full {
        margin: 0!important;
    }
    
    .social-icons {
        left: 0;
        top: auto;
        top: initial;
        bottom: 0;
        width: 100%;
    }
    
    .social-icons ul li {
        display: inline-block;
        width: 32.66%;
    }
    
    .social-icons ul li a {
        width: 100%;
        margin-left: 0;
    }
    
    .social-icons ul li a i,
    .social-icons ul li a i:before {
        width: 100%;
    }
    
    .social-icons ul li + li {
        margin-left: 1%;
    }
    
    .social-icons + .footer-menu {
        margin-bottom: 50px;
    }
    
}
