
/*
Theme Name: Arke
Theme URI: https://olympusthemes.com/themes/arke/
Author: DannyCooper
Description: Arke is a truly minimal WordPress theme.
License: GNU General Public License v2 or later
Version: 1.1.3
Text Domain: arke
License URI: https://www.gnu.org/licenses/gpl-2.0.html
GitHub Theme URI: https://github.com/DannyCooper/arke
*/

html{font-family:sans-serif;-webkit-text-size-adjust:100%;position: relative;background: #f8f8f9}

article,aside,details,figcaption,figure,footer,header,main,menu,section,summary,.sticky{display:block}a{background-color:#fff0}a:active,a:hover{outline:0}b,strong{font-weight:700}

h1{font-size:20px;margin:.67em 0;line-height:1.25;color:#060606}img{border:0}figure{margin:1em 40px}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

body{width:100%;margin-left:auto;margin-right:auto;color:#2f2f2f;    font-family: sans-serif;font-size:16px;line-height:1.2;overflow-wrap:break-word}
nav, label, input {
    font-size: 14px;
}

h2,h3,h4,h5,h6{line-height:1.25;color:#060606}p{margin:10px 0}dfn,cite,em,i{font-style:italic}blockquote{margin:0 1em}pre{background:#eee;font-family:"Courier 10 Pitch",Courier,monospace;font-size:15px;line-height:1.6;margin-bottom:1.6em;max-width:100%;overflow:auto;padding:1.6em}

blockquote:before,blockquote:after,q:before,q:after{content:""}blockquote,q{background: #f7f7f7;
    font-size: larger;
    width: max-content;
    padding: 6px;
    border-left: 5px solid #ddd;}.widget ul,.widget ol{margin:0;padding:0 0 0 1em}ul{list-style:disc}ol{list-style:decimal}img{height:auto;max-width:100%;vertical-align:baseline}figure{margin:1em 0}table{font-family:sans-serif;margin:0 0 1.5em;width:100%;font-size:14px}table th{border-bottom:2px solid;padding:10px;text-align:left}table td{padding:10px 10px 0}
    

#searchsubmit {
    border: 1px solid #5f9ea0;
    background-color: #ffffff;
    color: #000000;
    padding: 5px 8px;
    cursor: pointer;
    font-size: 18px;
    line-height: 1.5;
}


.search-form {
    margin: auto;
    display: flex;
    justify-content: center;
}

input[type=search] {
color: #666;
    border: 1px solid #5f9ea0;
    font-size: 15px;
}


.content{display:block;padding:10px;margin:0px 0 10px 0;border-radius: 8px}a{color:#253e80;text-decoration: none}a:hover,a:focus,a:active{color:#3767b3}a:focus{outline:thin dotted}a:hover,a:active{outline:0}.clear:before,.clear:after{margin-left:auto;margin-right:auto;padding:0 5px}#content-area{margin-top:60px;padding:15px 5px 0px 5px}
.sea {
    text-align: center;
    clear: both;
    position: sticky;
    top: 10px;
    display: flex;
    justify-content: center;
    padding: 15px 0;
}

#fi {
    background-image: url(/wp-content/themes/arke/searchicon.png);
    background-position: 1%;
    background-repeat: no-repeat;
    min-width: 85%;
    font-size: 17px;
    padding: 10px 10px 10px 40px;
    border: 1px solid #ddd;
    box-shadow: 0 2px 20px 4px #ccc;
    background-color: #fff;
}

.site-header {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    background: black;
    padding-top: 3px;
    padding-bottom: 3px;
}

.site-branding {
    height: inherit;
    width: 48%;
    justify-content: center;
    display: flex;
    flex-wrap: wrap;
    margin: auto;
}

.plink {
    width: 50%;
    margin: auto;
    height: inherit;
    text-align: center;
}

.plink a {
display: inline-block;
    padding: 2px 6px;
    color: #ffffff;
    font-size: 17px;
}

.site-title{font-size:1.7em;font-weight:700;padding:0 5%;margin:auto 0}.site-title a{text-decoration:none;color:white;font-family:cursive}.site-description{color:#fff;margin:auto 0;text-align: center}

a.btn-top {
    color: white;
}

.btn-top {
border-radius: 31%;
    font-size: 27px;
    padding: 3px 8px;
    border-right: 1px solid #767676;
    
}



.post-thumbnail{margin-bottom:32px}.entry-title{font-size:20px;margin:10px auto;text-align:center;padding:10px}

#sp {
    background-image: radial-gradient(circle, #004f7c, #0693e3, #499ccb, #fdfeff);
    display: flex;
    position: sticky;
    bottom: 0;
    padding: 0 5px;
}


#ca {
    display: flex;
    overflow: hidden;
    justify-content: center;
    padding: 3px 0;
    clear: both;
    position: sticky;
    bottom: 0;
    background: #192C32;
}

#cb, #cbe {
    font-size: 26px;
    color: #000;
    line-height: 37px;
    resize: none;
    width: 80%;
    letter-spacing: 2px;
    text-align: center;
    background: #cdd9e1;
    border: 1px solid #90c2df;
}

#cb {font-family: Segoe UI Symbol;}
#cbe {font-family: system-ui, Apple Color Emoji, 'Segoe UI Emoji', 'Noto Color emoji';}

#copy {
font-size: 26px;
    border-radius: 5px;
    background-color: transparent;
    color: #fff;
    cursor: pointer;
    border: none;
    border-right: 1px solid #767676;
    margin: auto 0;
    padding: 3px;
}


#clear {
border: none;
    background: transparent;
    cursor: pointer;
    border-right: 1px solid #767676;
    margin: auto 0;
    padding: 6px;
}

#sym h2, #ei h2, #eym h2 {
    text-align: left;
    font-size: 19px;
}

#sym, #eym, #ei {
text-align: center;
        padding: 10px 5px 20px
}


#ei {
font-family: Apple Color Emoji, 'Segoe UI Emoji', 'Noto Color emoji';
}

#sym h3, #ei h3 {
    text-align: left;
    color: #b0b6bb;
}


#sym p, #ei p {
    text-align: left;
    font-weight: 600;
}

#sym span, #eym span, #ei span {
    display: inline-block;
    min-width: 42px;
}

#sym span, #eym span {
font-family:Segoe UI Symbol;
}


#sym span:hover, #eym span:hover, #ei span:hover, .text:hover {
    cursor: pointer;
    border: 1px solid #161313;
}

#sym span, #ei span {
margin: 2px auto;
    border: 1px solid #ddd;
    font-size: 35px;
    color: #000;
    vertical-align: middle;
    background: white;
    border-radius: 5px;
        padding: 2px;
}
#eym span{padding: 10px;
    margin: 5px 0;
    border: 1px solid #ddd;
    font-size: 22px;
    background: #fff;}


#symc{margin-left:25%;padding:10px 45px;background-color:rgb(255 3 201 / 82%);border-radius:4px;color:#fff;position:fixed;z-index:20000;font-weight:600;font-size:19px;top:50%}



.lpost{display:block;background:#fff;padding:15px;margin:10px 0}.lpost a {
    padding: 5px;
    text-decoration: none;
    display: inline-block;
    margin: 3px 5px;
    background: #f5f4f4;
    border-radius: 10px;
    font-family: auto;
    font-size: 15px;
    color: black;
}
.lpost a:hover{color:#e91210dd;background:aliceblue}.site-footer{border-top:1px solid #eaeaea;padding:25px 0;font-size:14px;text-align:center}

#all{display: block;
    padding: 15px;
    margin: 10px 0;
    text-align: center;
}
#all a {
    padding: 5px;
    text-decoration: none;
    display: inline-block;
    margin: 3px 5px;
    background: #ffffff;
    border-radius: 10px;
    font-family: system-ui;
    font-size: 15px;
    color: black;
}
#all a:hover{color:#e91210dd;background:aliceblue}







/*------
start css for emojis
-----*/
#al{display: none}
/*------
end css for emojis
-----*/

/*------
start css for fancy text font generator
-----*/
.text {
    font-size: 19px;
    background: #fff;
    padding: 10px 5px;
    margin: 5px;
    border: 1px solid #d6d6d9;
    display: block;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
}
#result {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 10px 0
}

.loadmore {
    padding: 10px;
    font-size: large;
    border-radius: 4px;
    max-width: fit-content;
    cursor: pointer;
    margin: 10px auto;
    border: 1px dotted #0c0909;
}

.gen {
    padding: 10px 0;
    position: sticky;
    top: 0;
}



.form-control {
    font-size: 1.2rem;
    display: block;
    padding: .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    border: 6px solid #015e93;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

.fancytext {
    width: 75%;
    margin: auto;
    min-width: 40%;
    font-size: 1.2rem;
    display: block;
    line-height: 1.2;
    color: #495057;
    border: 1px solid #d6d6d9;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.input-group {
    white-space: nowrap;
    overflow: hidden;
    text-align: center;
    flex-grow: 1;
    flex-shrink: 1;
    width: calc(100% / 3);
}

::-webkit-input-placeholder {
    opacity: .5;
}




/*------
end css for fancy text font generator
-----*/

@media only screen and (max-width:743px){#content-area {
    margin-top: 55px;
}
.content{padding:5px 0}
    .input-group { width: calc(100% / 1);}
.fancytext {
        width: 90%;
}}


@media only screen and (max-width:599px){
    .site-header {
    display: block;
}
    #sp {
    display: block;
}
.search-form {
    padding-top: 5px;
}
#ca {
    width: 100%;
    padding-top: 0;
}

.site-branding, .plink {
    width: 100%;
padding: 5px 0;
}
#result {
    margin: auto;
}
#content-area {
    margin-top: 70px;
}

}


@media only screen and (max-width:516px){
    .lpost a{font-size: 14px}
    .entry-title{font-size: 17px;margin: 5px auto;}
    .site-title {
    font-size: 1.5em;}
        #copy {
    font-size: 22px;}
   .sea {
    top: 0;
} 
}

@media only screen and (max-width:400px){.input-group {
    width: 100%;
}

}


@media only screen and (max-width:371px){#content-area {
    margin-top: 120px;
}
#sym span, #ei span{font-size: 30px;}

#sym span, #eym span, #ei span {
    min-width: 38px;
}
#fi { width: 100%;}}

@media only screen and (max-width:283px){#content-area {
    margin-top: 145px;
}
input[type=search] {
    width: 100%;
}
}