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

    CSS Name: CGTnews over Hashnews - Modern Magazine & Newspaper HTML Template
    Description: CGTnews
    Author: Estudio Nexos
    Author URI: https://www.estudionexos.com/
    Version: 1.0
-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  1.  Theme default CSS
/*----------------------------------------*/
/*-- Colors --*/
/* maincolor = '#b4061b'
   highlight1 = '#b4061b'
   highlight1hover = '#8d0801'
   highlight2 = '#b4061b'
   bgdark = '#001427'
   bgdarkhover = '#002548'
/*-- 
    Sections colors
-----------------------------------------*/
/*
dark-red = #d40000 //accion sindical
dark-brown = #986601 //agitacion
light-brown = #ae906d //confederacion
dark-green = #029502 //sin fronteras
light-green = #339900 //cultura libre
violet = #a54bff //eje violeta
dark-blue = #0147d1 //ideas
*/
/*-- Fonts --*/
@font-face {
    font-family: "AvenirBold";
    src: url(/wp-content/themes/ryn/src/fonts/AvenirNextLTPro-Bold.otf);
    font-weight:600;
}
@font-face {
    font-family: "AvenirRegular";
    src: url(/wp-content/themes/ryn/src/fonts/AvenirNextLTPro-Regular.otf);
    font-weight:600;
}
@font-face {
    font-family: "Ryn";
    src: url(/wp-content/themes/ryn/src/fonts/MOCLAN1T.ttf);
    font-weight:600;
}
/*-- Google Font --*/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900");
/*-- Common Style --*/
body { font-family: "AvenirRegular", "Roboto", sans-serif; background-color:#f5f5f5; font-weight:400; }
h1, h2, h3, h4, h5, h6 { font-family: "AvenirBold", "Roboto", sans-serif; }
ul { list-style: square outside none; margin: 0px; padding: 0 0 0px 20px; }
ul.sub-menu, ul.sub-menu ul, ul.breaking-news-ticker { list-style: none; margin: 0px; padding: 0px; }

.bg-dark { background-color: #001427 !important; }
.text-danger { color: #b4061b; }
.badge-danger { background-color: #b4061b; }
a { color:#001427; }
a:hover { text-decoration: none; color: #d40000; }

/*-- --
    Scroll Up 
-----------------------------------------*/
#scrollUp { background-color: #b4061b; }

/*--
    Youtube Video PlayList
-----------------------------------------*/
.RYPP { padding: 18px 18px 100px 18px; }
.RYPP .RYPP-playlist { height: 75px; }

.playlist { background-color: #000; }

/*--
    Page Banner
-----------------------------------------*/
/*-- Page Banner --*/
.page-banner { padding: 30px 0px 0px; }
@media only screen and (min-width: 992px) and (max-width: 1200px) { .page-banner { padding: 20px 0px 0px; } }
@media only screen and (min-width: 768px) and (max-width: 991px) { .page-banner { padding: 20px 0px 0px; } }
@media only screen and (max-width: 767px) { .page-banner { padding: 20px 0px 0px; } }
.page-banner h2 { color: #000; text-transform: none; }

/*--
    Instagram Carousel
-----------------------------------------*/
.instagram-carousel .video.instagram-item::before { content: "\f03d"; }
.instagram-carousel .galeria.instagram-item::before { content: "\f03e"; }
.instagram-carousel .publicacion.instagram-item::before { content: "\f0f6"; color:#666; }

/*--
    Blockquote
-----------------------------------------*/
blockquote { text-align: left; background-color: #ccc; color: #000; position: relative; overflow: hidden; width: 100%; float: left; padding: 35px 35px 10px 80px; }
blockquote::before { font-family: 'Fontawesome'; content: "\f10d"; position: absolute; left: -2px; top: 3px; font-size: 60px; color: #ffffff; }

/*-- 
    Background color
-----------------------------------------*/
/*
.bg-red { background-color: #b4061b; }
*/
.bg-red { background-color: #f05555; }
.bg-red .post-block-wrapper { background-color: #f69e9e; }


/*----------------------------------------*/
/*  2.  Header
/*----------------------------------------*/
/*----
    Header Section
------------------------------------------*/
.header-section { background-color: #ffffff; }
@media only screen and (min-width: 777px) {
    .header-logo .logo { float:right; }
    .header-section {
        background-image: url("/wp-content/themes/ryn/src/img/g4841.png");
        background-position: top right;
        background-repeat: no-repeat;
        background-size: 85px auto;
    }
    .header-banner { text-align:left; }
}
@media only screen and (min-width: 777px) and (max-width: 1024px) {
    .header-section {
        padding:10px 0;
        background-size: 90px auto;
    }
}
@media only screen and (min-width: 741px) and (max-width: 777px) {
    .header-section { background-image:none; }
    .header-banner { line-height: 20px; }
}
@media only screen and (max-width: 740px) {
    .header-top-links ul.header-links { padding:0px; float:none; width:65%; margin:0 auto; text-align:center;}
    .header-top-links .header-links li::before { background-color: transparent; }
    .header-top-social { text-align:center; }
    .header-top-social .header-social { float:none; }
    .header-top-social .header-social a { display:inline; float:none; }
    .header-section { display:none; }
}
/*-- Header Logo --*/
/*
.header-logo .logo img { height:100px; }
*/

/*-- Header Banner --*/
.header-banner .banner a img { max-width:auto; width:auto; }

/*----
    Menu Section
------------------------------------------*/
/*-- Main Menu --*/
.main-menu nav > ul > li.active > a,
.main-menu nav > ul > li:hover > a { color: #b4061b; }

/*-- Sub Menu --*/
.sub-menu li.active a, .sub-menu li:hover a, .sub-menu li a:hover { color: #b4061b; }

.sub-sub-menu { border-top: 1px solid #f1f1f1; }
.sub-sub-menu li { padding-left: 10px }
.sub-menu li:hover .sub-sub-menu li a { color: #666666; }
.sub-menu li:hover .sub-sub-menu li a:hover { color:red; }

/*----
    Header Top
------------------------------------------*/
.header-top-links .header-links li.disabled a { background-color: #f05555; }
.header-top-links .header-links li a:hover { color: #b4061b; }
.header-top-social .header-social a:hover {color: #b4061b;}

/*--
    Breaking News Section
------------------------------------------*/
.breaking-news-section { background-color: #b4061b; /*-- Breaking News Section Two --*/ /*-- Breaking News Section Three --*/ }
.breaking-news-wrapper .breaking-news-nav button { background-color: red; /*-- Hover --*/ }

/*-- Breaking News Wrapper --*/
.breaking-news-wrapper .breaking-news-ticker li a { font-family: "Roboto", sans-serif; }


/*----------------------------------------*/
/*  3.  Post Common Style For Post Block, Carousel & Nav Etc
/*----------------------------------------*/
/*-- Popular Section --*/
.single-publicacion .popular-section { background-color: #1f2024; }
.popular-section .popular-section-title { align-self:center; }
.popular-section h2.title { text-align:center; text-transform:uppercase; font-size:18px; font-weight:600; color:#fff; margin:auto 0px; }

/*-- Post Block Wrapper --*/
.post-block-wrapper { border: 1px solid #f1f1f1; background-color: #ffffff; }

.single-galeria .post-block-wrapper.post-content,
.single-video .post-block-wrapper.post-content,
.single-publicacion .post-block-wrapper.post-content,
.single-audio .post-block-wrapper.post-content { border: none; }

.post-header .teaser,
.single-video .teaser,
.single-publicacion .teaser,
.single-audio .teaser { color:#fff; }
@media only screen and (min-width: 992px) {
    .single-video .teaser { position:absolute; bottom:30px; font-size:18px; }
    .post-header .teaser,
    .single-audio .teaser { font-size:16px; }
    .single-publicacion .teaser { font-size:18px; }
}

.post-block-wrapper .head { border-bottom: 3px solid #f1f1f1; }
.post-block-wrapper.dark-red .head { border-bottom: 3px solid #d40000; }
.post-block-wrapper.dark-green .head { border-bottom: 3px solid #029502; }
.post-block-wrapper.light-green .head { border-bottom: 3px solid #339900; }
.post-block-wrapper.dark-brown .head { border-bottom: 3px solid #986601; }
.post-block-wrapper.light-brown .head { border-bottom: 3px solid #ae906d; }
.post-block-wrapper.violet .head { border-bottom: 3px solid #a54bff; }
/*
.post-block-wrapper.violet .head { background: linear-gradient(to left, #fff, #a54bff); border-bottom: 3px solid #fff; }
*/
.post-block-wrapper.dark-blue .head { border-bottom: 3px solid #0147d1; }

.post-block-wrapper.violet { background-color:#a54bff; color:#f5f5f5; }
.post-block-wrapper.violet .head { border-bottom: 3px solid #f1f1f1; }
.post-block-wrapper.violet a { color:#fff; }
.post-block-wrapper.violet a:hover { color:#d40000; }

.post-block-wrapper.bg-dark a { color:#f1f1f1; }
.post-block-wrapper.bg-dark a:hover { color:#d40000; }

.post-block-wrapper .head h2,
.post-block-wrapper .head h3 { font-size: 18px; line-height: 24px; }

.post-block-wrapper .head::before, .post-block-wrapper .head::after { background-color: #b4061b; }
.post-block-wrapper .head .title { color: #b4061b; }
.post-block-wrapper .head .post-block-tab-list > li > a { font-family: "AvenirRegular","Roboto", sans-serif;  font-weight: bold; }
.post-block-wrapper .head .post-block-tab-list > li .dropdown-menu li a { font-family: "Roboto", sans-serif; }

.post-block-wrapper .head .post-block-tab-list.feature-post-tab-list > li > a:hover,
.post-block-wrapper .head .post-block-tab-list.feature-post-tab-list > li > a.active { color: #b4061b; }
.post-block-wrapper.dark-red .head .post-block-tab-list.feature-post-tab-list > li > a:hover,
.post-block-wrapper.dark-red .head .post-block-tab-list.feature-post-tab-list > li > a.active { color: #d40000; }
.post-block-wrapper.dark-blue .head .post-block-tab-list.feature-post-tab-list > li > a:hover,
.post-block-wrapper.dark-blue .head .post-block-tab-list.feature-post-tab-list > li > a.active { color: #0147d1; }

.post-block-wrapper .head .post-block-tab-list.feature-post-tab-list > li .dropdown-menu li a:hover,
.post-block-wrapper .head .post-block-tab-list.feature-post-tab-list > li .dropdown-menu li a.active { color: red; }

.post-block-wrapper .body .single-post .content { font-size:18px; line-height: 28px; }

.post-carousel-1 .slick-arrow { background-color: #000; color:#fff; }
/*
.post-block-carousel .slick-arrow:hover { color: #b4061b; border-color: #b4061b; }
*/

.page-pagination ul li a { width:auto; min-width:30px; }

/*----------------------------------------*/
/*  4.  Post Styles
/*----------------------------------------*/
.post .post-wrap .category { font-family: "Roboto", sans-serif; }
.post .post-wrap .content .title { font-size: 22px; line-height: 24px; }
@media only screen and (min-width: 992px) and (max-width: 1200px) { .post .post-wrap .content .title { font-size: 20px; } }
@media only screen and (max-width: 479px) { .post .post-wrap .content .title { font-size: 14px; line-height: 18px; } }
.post.post-small .post-wrap .content .title { font-size: 16px; line-height: 18px; }
@media only screen and (min-width: 992px) and (max-width: 1200px) { .post.post-small .post-wrap .content .title { font-size: 12px; line-height: 16px; } }
.post.post-large .post-wrap .content .title { font-size: 32px; line-height: 36px; }
@media only screen and (min-width: 992px) and (max-width: 1200px) { .post.post-large .post-wrap .title { font-size: 28px; line-height: 32px; } }
@media only screen and (max-width: 767px) { .post.post-large .post-wrap .content .title { font-size: 24px; line-height: 30px; } }
@media only screen and (max-width: 479px) { .post.post-large .post-wrap .content .title { font-size: 14px; line-height: 18px; } }
.post .post-wrap .content .title a:hover { color: #b4061b; }
.post .post-wrap .content .meta .meta-item.date { font-size:0.8rem; }
.post .post-wrap .content .meta .meta-item.date.event { font-size:0.9rem; line-height:1.3rem; font-family:"AvenirBold", Roboto, sans-serif; }
.post .post-wrap .content .meta .meta-item i { line-height:16px; }

.post-header .meta .meta-item.author i { color:#17a2b8; }

.post-header .meta .meta-item.category.politic { background-color: #b4061b; }
.post-header .meta .meta-item.category.politic:hover { background-color:#8d0801; }
.post-header .meta .meta-item i { color: /*#b4061b*/#bbb; }

.post.post-overlay.post-large .content { left:50px; right:50px; }

.post.post-overlay .post-wrap .category { position: static; left: auto; top: auto; float:left; margin-right:3px; }
.post.post-overlay .post-wrap .categories { position: absolute; left: 3px; top: 3px; z-index:100; }

.archive .post-header,
.blog .post-header,
.page .post-header,
.articulos .post-header,
.campanas .post-header { background-color:rgba(255, 255, 255, 0.4); padding:50px 30px 10px; }

/*----------------------------------------*/
/*  5.  Single Post Details
/*----------------------------------------*/
/*-- Post Header --*/
.post-header { padding: 50px 30px; background-color: rgba(98, 28, 28, 0.65) }
.post-header .title { font-size: 3rem; line-height: 4rem; font-weight: 700; }
@media only screen and (min-width: 992px) and (max-width: 1200px) { .post-header .title { font-size: 28px; line-height: 32px; } }
@media only screen and (max-width: 767px) { .post-header .title { font-size: 24px; line-height: 30px; } }
@media only screen and (max-width: 479px) { .post-header .title { font-size: 18px; line-height: 24px; } }
.post-header-section { box-shadow: 0 16px 32px 0 rgba(52,58,64,.24); }

@media only screen and (max-width: 767px) { .post-header { padding-bottom: 40px; } }
.post-header .meta .meta-item { font-family: "AvenirRegular","Roboto", sans-serif; }
.post-header .meta .meta-item.category { margin-right:5px; border-radius:0px; }

/*-- Single Post --*/
.single-post .post-wrap .content p { margin-bottom: 30px; display: block; float: none; }
.single-post .post-wrap .content p:first-child { font-family: "AvenirBold", "Roboto"; font-weight:bold; line-height: 24px; font-size: 18px; }
.single-blog .blog-wrap .meta .meta-item.category { margin-right:5px; }

/*-- Single post Publicacion --*/
.single-publicacion .post-content .post-header { padding: 30px 0px 10px; background-color:transparent; }
.single-publicacion .post-header .meta .meta-item { color:#666; }
.single-publicacion .post-header .meta .meta-item.category { color:#fff; }
.single-publicacion .post-header .title { color: #000; }

/*----------------------------------------*/
/*  6.  Blog & Blog Details
/*----------------------------------------*/
/*-- Single Post --*/
.single-blog .blog-wrap .meta .meta-item { font-family:"AvenirRegular","Roboto", sans-serif; }

/*----------------------------------------*/
/*  7.  Sidebar
/*----------------------------------------*/
/*-- Sidebar Block Wrapper --*/
.sidebar-block-wrapper .head::before, .sidebar-block-wrapper .head::after { background-color: #b4061b; }
.sidebar-block-wrapper .head .title { color: #b4061b; }

/*-- Sidebar Social Follow --*/
.sidebar-social-follow > div { padding: 1px; width: 33%; float: left; }

/*-- Sidebar Tab List For Latest & Popular News --*/
.sidebar-tab-list a { font-family: "AvenirRegular","Roboto", sans-serif; }
.sidebar-tab-list.sidebar-tab-list-3-tabs a { width: 33.33%; }
.sidebar-tab-list.sidebar-tab-list-3-tabs a:last-child::after { right: -1.1px; }
.sidebar-tab-list a::before,
.sidebar-tab-list a::after,
.sidebar-tab-list a.active { background-color: #b4061b; }

/*-- Sidebar Category --*/
.sidebar-category li a { font-family: "AvenirRegular","Roboto", sans-serif; }

/*----------------------------------------*/
/*  8.  Contact
/*----------------------------------------*/

/*-- Contact Form --*/
.contact-form input[type="checkbox"] { width: auto; height: auto; border: 1px solid #f1f1f1; line-height: 24px; padding: 7px 15px; }
.contact-form button[type="submit"] { width: auto; border-radius: 5px; background-color: #00c8fa; color: #ffffff; text-transform: capitalize; border: none; padding: 8px 30px; }
.contact-form legend { display: block; line-height: 18px; font-size:14px; font-weight:600; }

.contact-form button[type="submit"]:focus { border: none; }

/*----------------------------------------*/
/*  9.  Footer
/*----------------------------------------*/
/*--
    Footer Top
----------------------------------------*/
/*-- Footer Widget --*/
.footer-widget .widget-title { border-left: 4px solid #b4061b; }
.footer-widget .widget-title { font-family: "AvenirRegular","Roboto", sans-serif; }
.footer-widget .footer-widget-post .post-wrap .content .meta .meta-item { font-family: "AvenirRegular","Roboto", sans-serif; }
.footer-widget .single-tweet .content .head h5 { font-family: "AvenirRegular","Roboto", sans-serif; }
.footer-top-section a, .footer-bottom-section a {color:#fff; }

.footer-widget .content .footer-social a.rss { background-color: orange; }

.not-front .footer-widget .content .footer-social a { width: 56px; height: 56px; border-radius: 3px; text-align: center; color: #ffffff; text-shadow: 0 2px 2px rgba(0, 0, 0, 0.4); }
.not-front .footer-widget .content .footer-social a i { font-size: 28px; line-height: 58px; }


/*----------------------------------------*/
/*  10.  Extra CSS
/*----------------------------------------*/
/*--
    Masonry
----------------------------------------*/

.grid-sizer,
.grid-item { float:left; width: 100%; margin-bottom: 10px;}
.grid-item--width2 { width:100%; }
.grid-item img { max-width:100%; }

@media only screen and (min-width: 1501px) {
.grid-sizer,
.grid-item { float:left; width: 16.1%;}
.grid-item--width2 { width: 49.5%; }
.grid-item img { max-width:100%; }
}

@media only screen and (min-width: 1370px) and (max-width: 1500px) {
    .grid-sizer,
    .grid-item { float:left; width: 16.05%;}
    .grid-item--width2 { width: 49.4%; }
}

@media only screen and (min-width: 1274px) and (max-width: 1369px) {
    .grid-sizer,
    .grid-item { float:left; width: 16%;}
    .grid-item--width2 { width: 49.3%; }
}

@media only screen and (min-width: 1185px) and (max-width: 1273px) {
    .grid-sizer,
    .grid-item { float:left; width: 15.95%;}
    .grid-item--width2 { width: 49.3%; }
}

@media only screen and (min-width: 1050px) and (max-width: 1184px) {
    .grid-sizer,
    .grid-item { float:left; width: 15.85%;}
    .grid-item--width2 { width: 49.25%; }
}

@media only screen and (min-width: 955px) and (max-width: 1049px) {
    .grid-sizer,
    .grid-item { float:left; width: 24.2%;}
    .grid-item--width2 { width: 49.3%; }
}


@media only screen and (min-width: 860px) and (max-width: 954px) {
    .grid-sizer,
    .grid-item { float:left; width: 24.1%;}
    .grid-item--width2 { width: 49.3%; }
}

@media only screen and (min-width: 650px) and (max-width: 859px) {
    .grid-sizer,
    .grid-item { float:left; width: 49%;}
    .grid-item--width2 { width: 49%; }
}