/*
Theme Name: Fun
Theme URI: http://socialfun.nl/theme
Description: theme for fun site
Author: Funny
Author URI: http://socialfun.nl
Published by: http://socialfun.nl
Version: z1.0
*/

/* ---------------- RESET CSS ---------------- */

@font-face{font-family: Blick Variable, sans-serif}
@font-face{font-family: Blick Variable, sans-serif}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,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{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;direction: ltr;}

/* HTML5 display-role reset for older browsers */

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{margin:10px 0;clear:both;quotes:none;background:#EDF0F3;border-left:5px solid #C1CED4;padding:5px 10px}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
code{margin: 10px 0;display: block;border-right:1px solid #DDD;border-left:3px solid #43966C;padding:5px 10px;font-family:monospace;font-size:13px;background:#FAFAFA}
table{border-collapse:collapse;border-spacing:0}
a{color:#000000;text-decoration:none;transition:color .1s linear;-moz-transition:color .1s linear;-webkit-transition:color .1s linear}
a:hover{color: #3C97F3 !important}
.clear{clear:both}

/* ---------------- GENERAL CSS ---------------- */

.wp-block-image img {
    box-sizing: border-box;
    height: auto;
    width: 100% !important;
    max-width: 100%;
    vertical-align: bottom;
	border-radius: 20px;
}

.share-box{
    display:flex;
    gap:8px;
    width:100%;
}

.share-facebook{
    flex:1;
    height:44px;
    background:#1877F2;
    color:#fff;
    text-decoration:none;
    border-radius:8px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    font-size:18px;
    font-weight:600;
}

.share-facebook:hover{
    background:#166FE5;
}

.fb-icon{
    font-family:Arial;
    font-size:28px;
    font-weight:bold;
    line-height:1;
}

.copy-button{
    width:64px;
    border:none;
    background:#ECEFF3;
    border-radius:8px;
    cursor:pointer;
    font-size:24px;
}

.copy-button:hover{
    background:#dde2e8;
}


h1{font-size:30px}
h2{font-size:25px}
h3{font-size:20px}
h4{font-size:16px}
h5{font-size:15px}
h6{font-size:14px}
p{margin:10px 0;overflow:hidden;}
body{background:#DDE1E4;font-size:16px;font-family:'Tauri',sans-serif;color:#3C3B3B;margin:0 auto}
#wrap{max-width:850px;margin:0 auto;background:#FFF}
#content{overflow:hidden;margin-bottom:15px}
:focus{outline:none}
.ads{padding:10px 15px;text-align:center;overflow:hidden;position:relative}
.ads img{max-width:100%;height:auto}

/* ---------------- HEADER CSS ---------------- */

#header{overflow:hidden;margin:10px 0;margin-top:0}
#header .logo{float:left}
#header .logo img{height:90px}

/* ---------------- MENU CSS ---------------- */

#main-menu{
    margin:0 auto;
    background:#23282d;
    text-shadow:1px 1px 2px #3C3C3C;
    position:relative;
    z-index:999;
}

#main-menu ul.menu{
    float:left;
    display:flex;
    align-items:center;
}

#main-menu ul li{
    position:relative;
    float:none;
}

#main-menu ul li a{
    color:#fff;
    display:block;
    font-size:15px;
    text-align:center;
    text-transform:uppercase;
    line-height:40px;
    font-weight:700;
    padding:0 14px;
    transition:.2s;
}

#main-menu ul li a:hover,
#main-menu ul li.current-menu-item > a{
    background:#3482D2;
    color:#fff !important;
}


/* lenyíló menü */

#main-menu ul li.menu-item-has-children > a:after{
    content:" ▾";
    font-size:12px;
}


#main-menu ul li ul.sub-menu{
    position:absolute;
    top:40px;
    left:0;
    min-width:190px;
    background:#32373c;
    display:block;
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.25s ease;
    box-shadow:0 5px 15px rgba(0,0,0,.35);
}


#main-menu ul li:hover > ul.sub-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}


#main-menu ul li ul li{
    width:100%;
}


#main-menu ul li ul li a{
    text-transform:none;
    text-align:left;
    font-size:14px;
    font-weight:400;
    line-height:22px;
    padding:10px 15px;
    white-space:nowrap;
}


#main-menu ul li ul li a:hover{
    background:#23282d;
}


/* második szintű almenü */

#main-menu ul li ul li ul{
    left:100%;
    top:0;
}


/* mobil gomb */

.show-menu{
    display:none;
    color:#fff;
    line-height:40px;
    font-size:17px;
    font-weight:700;
    text-transform:uppercase;
    text-align:center;
    cursor:pointer;
}

.show-menu span{
    float:left;
    margin-left:15px;
}

.show-menu i{
    float:right;
    margin-right:15px;
    font-style:normal;
}


/* mobil menü */

input[type=checkbox]{
    display:none;
}


@media only screen and (max-width:769px){

    .show-menu{
        display:block;
        overflow:hidden;
    }

    #main-menu ul.menu{
        display:none;
        float:none;
        width:100%;
    }

    input[type=checkbox]:checked ~ ul.menu{
        display:block;
        background:#23282d;
    }


    #main-menu ul li{
        float:none;
        width:100%;
    }


    #main-menu ul li a{
        text-align:left;
        padding:10px 15px;
        line-height:25px;
    }


    #main-menu ul li ul.sub-menu{
        position:static;
        display:none;
        opacity:1;
        visibility:visible;
        transform:none;
        box-shadow:none;
    }


    #main-menu ul li:hover > ul.sub-menu{
        display:block;
    }


    #main-menu ul li ul li ul{
        position:static;
    }

}
}

/* ---------------- POSTSBODY CSS ---------------- */

.postsbody{float:left;width:100%}
.postsbody .lts{margin:0 15px}
.postsbody .lts .ls{overflow:hidden;margin:15px 0 0;padding:0 0 15px;border-bottom:1px dashed #CCCBCB}
.postsbody .lts .ls .img{float:left;width:100%;overflow:hidden}
.postsbody .lts .ls .img .ltr{max-height: 225px;overflow:hidden;margin-right:0px}
.postsbody .lts .ls .img .ltr img{width:100%;min-height:100px;height:auto}
.postsbody .lts .ls .nf{overflow:hidden;line-height:18px;float:right;width:100%}
.postsbody .lts .ls .nf h2{font-size:17px;margin-bottom:5px;margin-top:16px;line-height: normal;}
.postsbody .lts .ls .nf h2 a{color:#000000;font-size: 25px;}
.postsbody .lts .ls .nf .th{color:#B9B8B8;font-size:16px}
.postsbody .lts .ls .nf .th span,.ctn .th span{font-size:16px;width:16px;height:16px}
.postsbody .lts .ls .nf .th a{color:#B9B8B8;font-size: 16px;}
.postsbody .lts .ls .nf .th a:hover{color:#3C97F3}
.postsbody .lts .ls .nf .xp{color:#545454}
.postsbody .lts .ls .nf .xp p{margin:0}

/* ---------------- SIDEBAR CSS ---------------- */

#sidebar{float:right;width:35%}
.bl{margin-right:15px;margin-top:15px}
.bl .blc{overflow:hidden;margin-bottom:15px;line-height:21px}
.bl .blc .searchform{background:#FAFAFA;border-radius:5px;overflow:hidden}
.bl .blc .searchform .screen-reader-text{display:none}
.bl .blc .searchform #s{padding:0;line-height:27px;font-size:14px;background:#EFEFEF;font-family:'Tauri',sans-serif;border:0;width:78%}
.bl .blc .searchform #searchsubmit{padding:0 5px;line-height:27px;color:#FFF;width:20%;border:0;background:#3C97F3;font-family:'Tauri',sans-serif}
.bl .blc h3{border-radius:3px;overflow:hidden;text-transform:uppercase;font-size:14px;color:#FFF;background:#23282d}
.bl .blc h3 span{display:block;background:#3482D2;padding:7px 10px;float:left}
.bl .blc h3 i{display:block;float:left;width:0;height:0;border-top:34px solid #3482D2;border-right:34px solid transparent}
.bl .blc ul{overflow:hidden}
.bl .blc ul li{padding:10px 0;overflow:hidden;border-bottom:1px dashed #CCCBCB}
.bl .blc a{color:#1F303C}
.bl .blc a:hover{color:#3C97F3}
.bl .blc .spl li .img{width:26%;float:left;overflow:hidden}
.bl .blc .spl li .img .ltr{max-height: 40px;overflow:hidden;margin-right:6px}
.bl .blc .spl li .img .ltr img{width:100%;height:auto}
.bl .blc .spl li .nf{overflow: hidden;}

/* ---------------- POST CSS ---------------- */

.ctn{padding:15px;word-break: break-word;}
.ctn .ttl{line-height:normal;color:#000000;font-size:40px;margin:10px 0}
.ctn .th{margin-bottom:15px;line-height:17px;font-size:16px;color:#999}
.ctn .thm{margin-bottom:15px;text-align:center}
.ctn .thm img{max-width:100%;height:auto}
.ctn .pst{line-height:21px;margin-bottom:10px}
.ctn .pst img{width:100%;height:auto}
.ctn .tag{margin-bottom:15px;font-size:12px;color:#999}
.ctn .tag a{color:#999}
img.alignleft{float:left;margin-right:10px}
img.alignright{float:right;margin-left:10px}
.pst h1,.pst h2,.pst h3,.pst h4,.pst h5,.pst h6{line-height:22px;margin-bottom:5px}
.ctn .pst ul,.ctn .pst ol{margin:0 0 10px 20px}
.ctn .pst ul{list-style:disc}
.ctn .pst ol{list-style:decimal}
.rtd{overflow:hidden;margin-bottom:15px}
.rtd li{padding:10px 0;overflow:hidden;border-bottom:1px dashed #CCCBCB}
.rtd li .img{float:left;width:17%;overflow:hidden}
.rtd li .img .ltd{max-height: 50px;overflow:hidden;margin-right:10px}
.rtd li .img .ltd img{width:100%;height:auto}
.rtd li .nf{float:right;width:83%;line-height:normal;overflow:hidden}
.rtd li .nf h2{font-size:15px}
.rtd li .nf h2 a{color:#142E40}
.pl{overflow:hidden}
.pl .plt{background:#4F6065}
.pl span{display:block;float:left;border-radius:2px;background:#3482D2;color:#FFF;font-size:11px;font-weight:700;text-transform:uppercase;margin-right:2px;padding:0 7px}
.shr{margin-bottom:15px}
.share-btn{display:inline-block;color:#fff;border:none;padding:.5em;width:4em;box-shadow:0 2px 0 0 rgba(0,0,0,0.2);outline:none;text-align:center}
.share-btn:hover{color:#eee}
.share-btn:active{position:relative;top:2px;box-shadow:none;color:#e2e2e2;outline:none}
.share-btn.share{background:#4F6065;text-transform:uppercase;font-weight:700}
.share-btn.twitter{background:#55acee}
.share-btn.google-plus{background:#dd4b39}
.share-btn.facebook{background:#3B5998}
.share-btn.linkedin{background:#4875B4}
.share-btn.email{background:#444}
.share-btn.stumbleupon{background:#EB4823}
.share-btn.reddit{background:#ff5700}
.snip{padding:8px;color:#9E9E9E;background:#EFEFEF;font-weight:700;font-size:11px;margin-bottom:15px}

/* ---------------- PAGENAVI CSS ---------------- */

.pagination{padding:10px 0;line-height:normal;font-size:18px;text-transform:uppercase}
.pagination .page{overflow:hidden}
.pagination .page .left{float:left}
.pagination .page .left .now{padding:5px 10px;margin-right:3px;border-radius:3px;color:#FFF;background:#3482D2;display:block;float:left}
.pagination .page .left a{padding:5px 10px;background:#3C97F3;border-radius:3px;color:#FFF;margin-right:3px;display:block;float:left}
.pagination .page .left a:hover{background:#3482D2}
.pagination .page .right{float:right;color:#FFF;padding:5px 10px;border-radius:3px;background:#3482D2}

/* ---------------- BREADCRUMBS CSS ---------------- */

.cst{margin-top:15px}
.cst h1{line-height:normal;border-bottom:1px dashed #CCCBCB;font-size:12px;font-weight:400;color:#888;padding-bottom:5px}
#breadcrumbs{line-height:normal;list-style:none;color:#999;font-size:11px;padding-bottom:5px;overflow:hidden;border-bottom:1px dashed #CCCBCB}
#breadcrumbs a{color:#999}
#breadcrumbs li{display:inline-block;vertical-align:middle;margin-right:3px}
#breadcrumbs .separator{font-size:15px;font-weight:100;color:#ccc}

/* ---------------- COMMENT CSS ---------------- */

.commentarea{padding:0}
.commentarea input[type=checkbox]{display:block;margin:0;margin-right:5px;float:left;-webkit-appearance:initial}
.commentarea h3{margin-bottom:10px;line-height:normal}
.commentlist{overflow:hidden}
.commentlist li{overflow:hidden;padding:5px 0}
.comment-body{overflow:hidden;line-height:normal;padding:10px;margin-bottom:5px;border:1px solid #DEDEDE}
.comment-author.vcard{background:#E6E6E6}
.commentlist li .comment-meta{font-size:12px;line-height:17px;background:#E6E6E6}
.commentlist li .comment-author img{float:left;width:32px;height:32px;margin-right:7px;padding:1px;border:1px solid #d5d5d5;background:#fff;-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.1);-moz-box-shadow:0 2px 2px rgba(0,0,0,0.1);box-shadow:0 2px 2px rgba(0,0,0,0.1)}
.commentlist li .comment-author .fn{font-style:normal;font-weight:700}
.commentlist li .comment-author .fn a{color:#333}
.commentlist li .comment-author .says{display:none}
.commentlist li .comment-meta{font-size:12px;line-height:17px}
.commentlist li p{line-height:normal;margin:15px 0}
.commentlist li .reply{float:right}
.commentlist li .reply a{display:block;font-weight:700;font-size:11px;font-family:Open Sans;border-radius:3px;color:#777;background:#f8f8f8;border:1px solid #ccc;box-shadow:0 1px 0 rgba(0,0,0,.08);text-shadow:none;line-height:23px;padding:1px 10px}
.commentlist li .children{margin-left:20px}
#respond input{border:1px solid #DDD;border-radius:3px;font-family:Open Sans,sans-serif;padding:5px}
#respond #comment{width:96.1%;border-radius:3px;font-family:Open Sans,sans-serif;padding:10px;line-height:18px!important;padding:10px 10px 5px!important;-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.12) inset;-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.12) inset;box-shadow:1px 1px 2px rgba(0,0,0,0.12) inset;background:#fcfcfc;background:rgba(255,255,255,0.85);border:1px solid #c9c9c9;border:1px solid rgba(0,0,0,0.2);-webkit-transition-duration:.3s;-moz-transition-duration:.3s}
#respond #submit{background:#FAFAFA;font-weight:700;cursor:pointer;padding:5px 8px;border:1px solid #DDD;border-radius:3px;color:#555;font-family:Open Sans,sans-serif}
#respond #submit:hover{background:#FFF;color:#000}

/* ---------------- FOOTER CSS ---------------- */

#footer{
background:#23282d;
padding:15px;
overflow:hidden;
border-top:3px solid #3482D2;
}

#footer .left{
float:none;
text-align:center;
margin-bottom:15px;
}

#footer .left ul{
display:flex;
justify-content:center;
align-items:center;
flex-wrap:wrap;
gap:10px;
}

#footer .left ul li{
float:none;
margin:0;
position:relative;
}

#footer .left ul li a{
display:block;
padding:10px 15px;
color:#fff;
font-size:14px;
font-weight:700;
text-transform:uppercase;
background:#3482D2;
border-radius:4px;
}

#footer .left ul li a:hover{
background:#2b6fb5;
color:#fff !important;
}

/* DROPDOWN */

#footer .left ul li ul{
display:none;
position:absolute;
bottom:100%;
left:0;
background:#32373c;
min-width:180px;
z-index:999;
}

#footer .left ul li:hover ul{
display:block;
}

#footer .left ul li ul li{
display:block;
width:100%;
}

#footer .left ul li ul li a{
border-radius:0;
background:#32373c;
text-align:left;
}

#footer .left ul li ul li a:hover{
background:#23282d;
}

#footer .right{
float:none;
text-align:center;
color:#aaa;
font-size:12px;
line-height:20px;
}

#footer a{
color:#fff;
}



/* ---------------- RESPONSIVE CSS ---------------- */

@media only screen and ( max-width: 769px ) {
img,video,object{max-width:100%;height:auto}
.articles{padding-right:0;border-right:none}
.show-menu{display:block;overflow:hidden}
.show-menu i{float:right;margin-right:15px;line-height:36px;font-size:20px}
.show-menu span{float:left;margin-left:15px}
#main-menu{padding:0;width:100%}
#main-menu ul{position:static;display:none}
#main-menu ul li{float:none;position:relative;width:100%}
#main-menu ul li a{width:auto}
#main-menu ul li ul{width:100%}
#footer .left{display:block;margin-bottom:15px;}
#footer .right{float:none;text-align:center;line-height:normal}
}
@media only screen and ( max-width: 655px ) {
.postsbody{float:none;width:100%}
#sidebar{float:none;width:100%}
.bl{margin-left:15px}
}
@media only screen and ( max-width: 645px ) {
.postsbody .lts .ls .img .ltr img{min-height:auto}
}
@media only screen and ( max-width: 400px ) {
.postsbody .lts .ls .nf .xp{display:none}
}

#main-menu ul li.menu-item-has-children.open > ul.sub-menu{
    display:block;
}

#main-menu ul li ul.sub-menu{
    display:none;
}



/* ===============================
   ÚJ MODERN MOBIL MENÜ
================================ */

.new-menu {
    background:#23282d;
    width:100%;
    position:relative;
    z-index:9999;
}


/* mobil fejléc */

.menu-header {
    display:none;
    height:45px;
    line-height:45px;
    color:#fff;
    font-weight:700;
    padding:0 15px;
}


.menu-header span {
    float:left;
}


.menu-toggle {
    float:right;
    background:none;
    border:0;
    color:#fff;
    font-size:26px;
    cursor:pointer;
}


/* menü tartalom */

.menu-content {
    display:block;
}


.new-nav {
    display:flex;
    margin:0;
    padding:0;
    list-style:none;
}


.new-nav li {
    position:relative;
}


.new-nav li a {
    display:block;
    color:#fff !important;
    padding:0 15px;
    line-height:40px;
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
}


.new-nav li a:hover {
    background:#3482D2;
}


/* almenü */

.new-nav li ul {
    display:none;
    position:absolute;
    top:40px;
    left:0;
    min-width:190px;
    background:#32373c;
    padding:0;
    margin:0;
    list-style:none;
}


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


.new-nav li ul li {
    width:100%;
}


.new-nav li ul li a {
    text-transform:none;
    line-height:22px;
    padding:10px 15px;
    font-weight:400;
}


/* ===============================
   MOBIL
================================ */

@media only screen and (max-width:769px){


    .menu-header {
        display:block;
    }


    .menu-content {
        display:none;
    }


    .menu-content.active {
        display:block;
    }


    .new-nav {
        display:block;
    }


    .new-nav li {
        width:100%;
    }


    .new-nav li a {
        line-height:45px;
        padding:0 15px;
    }


    .new-nav li ul {
        position:static;
        display:none;
        background:#32373c;
    }


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

}

/* ==================================
   MENÜ FINOMÍTÁSOK
================================== */


/* szebb lenyílási animáció */

.new-nav li ul {
    display:block;
    opacity:0;
    visibility:hidden;
    transform:translateY(15px);
    transition:all .25s ease;
}


.new-nav li:hover > ul {
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}


/* menü szín igazítása a sablonhoz */

.new-menu {
    background:#23282d;
    border-bottom:3px solid #3482D2;
}


.new-nav li a {
    transition:all .2s ease;
}


.new-nav li a:hover,
.new-nav li.current-menu-item > a {
    background:#3482D2;
    color:#fff !important;
}


/* almenü kinézet */

.new-nav li ul {
    background:#23282d;
    border-top:3px solid #3482D2;
    box-shadow:0 8px 20px rgba(0,0,0,.35);
}


.new-nav li ul li a:hover {
    background:#3482D2;
}






/* ================================
   LATEST NEWS VÉGLEGES JAVÍTÁS
================================ */

.latest-news,
.latest-news * {
    box-sizing:border-box;
}


.latest-news{
    display:flex !important;
    width:100%;
    height:40px;
    overflow:hidden;
    background:#23282d;
}


.latest-title{
    display:flex !important;
    align-items:center;
    flex:none !important;
    height:40px;
    background:#3482D2;
    color:#fff !important;
    padding:0 15px;
}


.latest-slider{
    flex:1 !important;
    overflow:hidden !important;
    height:40px;
}


.latest-track{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    width:max-content !important;
    height:40px;
    align-items:center;

    animation-name:latest-scroll !important;
    animation-duration:100s !important;
    animation-timing-function:linear !important;
    animation-iteration-count:infinite !important;
    animation-delay:0s !important;
    animation-fill-mode:none !important;
}


.latest-track a{
    display:block !important;
    float:none !important;
    clear:none !important;
    width:auto !important;
    flex:none !important;
    white-space:nowrap !important;
    color:#fff !important;
    line-height:40px;
    padding:0 30px;

}


.latest-track a:hover{
    color:#3482D2 !important;
}


@keyframes latest-scroll{

    0%{
        transform:translateX(0);
    }

    100%{
        transform:translateX(-100%);
    }

}
/* PC sebesség */
@media (min-width:770px){

.latest-track{
    animation-duration:290s !important;
}

}


/* Mobil sebesség */
@media (max-width:769px){

.latest-track{
    animation-duration:280s !important;
}

}

.popular-posts{
    margin:0px;
    background:#f5f5f5;
    padding:15px;
    border-radius:0px;
}

.popular-posts h3{
    background:#23282d;
    color:#fff;
    padding:10px;
    font-size:18px;
    margin-bottom:10px;
}

.popular-posts ul{
    margin:0;
    padding:0;
    list-style:none;
}

.popular-posts li{
    padding:10px 0;
    border-bottom:1px dashed #ccc;
}

.popular-posts li a{
    color:#222;
    font-weight:700;
}

.popular-posts li a:hover{
    color:#3482D2;
}