@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bentham&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Josefin+Slab:ital,wght@0,100..700;1,100..700&display=swap');

::-moz-selection {
	/* Code for Firefox */
	color: var(--accent-color);
	background: var(--card-color);
}

::selection {
	color: var(--accent-color);
	background: var(--card-color);
}

html, body {
   background-color: var(--black-color);
   transition: all .3s;
}

body {
	/*border:10px solid var(--black-color);*/
}

.canvas {
	background-color: var(--bg-color);
	/*border:2px solid var(--text-color);*/
}

.rainbow {
        position:sticky;
	top:0;
	z-index:1000;
}

p, li, span, a, div {
   font-size:16px;
}

div.links {
   padding:20px 20px 0 20px;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   box-sizing: border-box;
   transition: all .3s;
}

div.links a.link, button.comment {
   /*width: 100%;*/
   padding: 10px!important;
   background-color: var(--white-color);
   float: left;
   text-align: center;
   color: var(--text-color);
   text-decoration: none!important;
   font-size: 12px !important;
   /*line-height: 35px !important;*/
   text-transform: uppercase;
   box-sizing: border-box;
   transition: all .3s;
   border-radius: 30px;
   box-shadow: var(--black-color) 12px 12px 0px 0px;
   border: 2px solid var(--text-color);
   font-weight:bold;
   cursor:pointer;
   margin-top:10px;
   /*margin-bottom:10px;*/
   height:46px;
   width:46px;
}

.post-body a {
 text-decoration:underline!important;
}

div.links a.link:hover, div.links a.link:active, button.comment:hover, button.comment:active {
   background-color: var(--accent-color);
   color: var(--white-color);
   transform: translate(4px, 4px);
   box-shadow: var(--black-color) 8px 8px 0px 0px;
   border: 2px solid var(--black-color);
   text-decoration:none!important;
}

div.divider {
   height: 2px;
   width: 50px;
   margin: 25px 0;
   margin-right: 0px;
   margin-left: 0px;
   margin-left: auto;
   margin-right: auto;
   background-color: var(--accent-color);
   transition: all .3s;
}

span {
   text-align: center;
   line-height: 135%;
   letter-spacing: 0.25em;
   text-transform: uppercase;
   display: block;
}

h1 {
   margin-top: 20px;
   font-size: 32px;
   /*font-weight: bold;*/
}

h1,
span {
   margin-left: auto;
   margin-right: auto;
   text-align: center;
}

h1,
p,
span,
a,
div {
   font-family: "Josefin Sans", serif;
   font-optical-sizing: auto;
   color: var(--text-color);
   transition: all .3s;
}

img.logo {
   margin-left: auto;
   margin-right: auto;
   width: 150px;
   height: auto;
   border-radius: 100%;
   display: block;
   transition: all .3s;
}

a.desktop {
    width: 100%;
    display: block;
    text-align: center;
    color: var(--text-color)!important;
    font-size: 17px !important;
    text-decoration:none!important;
    transition: all .3s;
}

a.desktop:hover, a.desktop:active, a.desktop:focus, p a:hover, p a:active, p a:focus, a h1:hover, a h1:active, a h1:focus {
    color: var(--accent-color)!important;
    cursor:pointer;
    text-decoration:none!important;
}

.uk-lightbox-items > * > :not(iframe) {
    max-height:90%!important;
}

.post img, .uk-lightbox img, img.displayArt {
background:var(--post);
}

.post img, img.displayArt {
	border:2px solid var(--text-color);
	/*box-shadow: var(--black-color) 12px 12px 0px 0px;*/
}

.uk-grid-small:hover a img{
  opacity: .6;
}
.uk-grid-small a img:hover{
  opacity: 1;
}

.uk-grid-small a img {
  transition: .3s all;
}

.hidden, .hide {
     display:none!important;
}

/*
#comments {
     padding-top:15px;
}
*/

.active {
     color:var(--accent-color)!important;
     text-decoration:none!important;
}

.uk-lightbox {
     background-color:var(--bg-color)!important;
}

.uk-lightbox-toolbar {
color:var(--text-color)!important;
}

/*#reactions__container {
display:none!important;
}*/


em, .article em {
color: var(--text-color)!important;
}

.article em {
opacity:.5!important;
font-size:14px!important;
}

.article {
  padding:20px;
  border-radius: 15px;
  background-color: var(--bio);
  margin-bottom:20px;
}

.article a, .description a {
font-weight:bold!important;
text-decoration:underline!important;
}

.article a:hover, .pagination a:hover,
.article a:focus, .pagination a:focus,
.article a:active, .pagination a:active {
color:var(--accent-color) !important;
}

.summary {
font-style:italic!important;
}

.date {
text-align:center!important;
}

iframe {
width:100%!important;
height:800px!important;
}

.uk-close::after {
	display:none!important;
}

.uk-grid-column-small > *, .uk-grid-small > * {
  padding-left:20px;
}

.uk-grid-small > .uk-grid-margin {
  margin-top:20px;
}

div.photo img {
  background:var(--post);
}

html {
	--text-color: azure;
	--accent-color: #ffbf00;
	--card-color: #080808;
	--white-color: azure;
	--black-color: #080808;
	--bg-color: #080808;
	--shadows: rgba(1, 0, 19, 0.23);
	--post: lavender;
	--bio:rgba(11,3,23,.5);
}


/*
html,
html[data-theme="light"] {
	--text-color: #000000;
	--accent-color: #DF1687;
	--card-color: lavender;
	--white-color: #ffffff;
	--black-color: black;
	--bg-color: lavender;
	--shadows: rgba(125, 138, 124, 0.23);
	--post: whitesmoke;
	--bio:rgba(245,245,245,.8);
}

html[data-theme="dark"] {
	--text-color: lavender;
	--accent-color: #DF1687;
	--card-color: #1c1238;
	--white-color: #0b0317;
	--black-color: black;
	--bg-color: #1c1238;
	--shadows: rgba(1, 0, 19, 0.23);
	--post: lavender;
	--bio:rgba(11,3,23,.5);
}

@media (prefers-color-scheme: dark) {
	html,
	html[data-theme="dark"] {
		--text-color: lavender;
		--accent-color: #DF1687;
		--card-color: #1c1238;
		--white-color: #0b0317;
		--black-color: black;
		--bg-color: #1c1238;
		--shadows: rgba(1, 0, 19, 0.23);
		--post: lavender;
		--bio:rgba(11,3,23,.5);
	}
	html[data-theme="light"] {
		--text-color: #000000;
		--accent-color: #DF1687;
		--card-color: lavender;
		--white-color: #ffffff;
		--black-color: black;
		--bg-color: lavender;
		--shadows: rgba(125, 138, 124, 0.23);
		--post: whitesmoke;
		--bio:rgba(245,245,245,.8);
	}
}*/

/*@media (max-width:1028px) {
        div.links { width:100%; }
}*/

@media (min-width:1028px) {
	div.links { width:75%; }
}

@media (min-width:1542px) {
	div.links { width:51%; }
}

@media (min-width: 691px) {
	
	div.backbtn { width:50%!important; margin:0 auto; }
	
	a.desktop {
	margin-bottom:20px;
	}
	div.links a.link {
	/*width:45%;*/
	/*margin: 10px 0;*/
	}
	
	#comments, p.description {
	/*width:60%;
	margin:0 auto;*/
	}
}

@media (max-width: 690px) {
	
	#comments, p.description {
	width:100%;
	}
	
	div.backbtn { width:100%; }
	
	a.desktop {
	margin-bottom:20px;
	}
	
	div.links a.link, button {
	/*margin:0 0 20px 0;*/
	}
   div.links, div.links a.link {
      /*width: 100%;*/
   }
}