/*
                                                                                                                
                                         .                                                                         
          ..                            .:::                                                                       
       .:::::.     .     .               .:::=%...                                                                 
       . .::::.  .::::::::#@@.        ..::-@ ----+@                                                                
             .   :::%   .:::@@.       :-@--@ --@--@                                    ...      . .:::@=.          
                .:::@@.   ::-@#       .--------.     .  . .    ..:::::%   ::::@@@%  .:::::+@=  .::::::@%.          
         .....   :::@@   :::#@: .....      :+@  ::#@=::::@@=.  :::+@@@@  :::@=::-@@@::-@@=#@.  :::@@@-.            
        :::::::. :::%@::::::@@-::-::::@@  .:+@@ .::::@%:::@@ .:::@@#  -..:::@#::::%@::*@@:     :::+@@  .           
       .......    :::::::-@@@.::*@::::@@   ::%@-.::::@@-.:-@@ :::@%.    .:::::::@@@*.::::::%@* ..:::::::@@         
                  .::@@@@@@  .:::::::-@@    ::@@  ::::@@  :=@@:::@%.    .::#@@          ..::%@.       :::@@        
                   ::+@@.      :::-::::::  ..:-@@ .:::@@  ::@@:::@@@@@@@@:::#@#  .@@. .    :-@@.   ..  ::%@        
             .  . .:::@@.      :::@@ .::::#@ ::=@* :::@@  ::%@ ::::::::=@@.:::::::@@@ ::::::*@@. :::::::@@@        
             ::::  .:::@@     .:::%@@. ..:@@ .::*   ::@@   :: . .  ....    .                *=.   ....*@@=.        
          ..:::.      ...        . ++.     .                                                                       
           :::                                                          .                                          
           ..                                                        -*@@@                                         
                                                                      =@@-      .    .    ******@=.      .::.      
                            . ******@@.                       ..     . .        ****@*   **%@**%@      :::::.      
                           -********@@.       .         =***-***%@#. =*%@    .:**@@@@   :**@@#.       . . .        
                          ***@@%%%%=%    ..****@@@  *************@@:.=*@@     **@@ .     +******@@%       ...      
                         :**@@#         .+*******@@*.***@% **%@-+*@@ =**@@    **@@        ..-****%@#    .::::::    
                         =**@@           **@@@*.**@@.=**@% =*%@. *@@ .***@@@#@:**@@@@@@@+.  .   **@@    ....::..   
                         .**@@           **@@@. **%@. **@@ :*%@. *@@-.:*****@@ .*******@@  .*****#@@     ..        
                         .-**@@@@  @@@@@.****%***@@@ .+*@@        .    ......-  . .---..-  ..--..**     .:::.      
                           .****@@@@**%@#. -+****@=     .                                                .::::.    
                              +******.                                                                      ..     
                                                                                                                                                                                                            
*/

body {
      margin: 0;
      padding: 0;
      font-family: dos;
	  font-size: 1.2em;
	  background-repeat: repeat;

    }

a{ /* Makes the links blue (Which is the default so this is a strange addition */
	color: yellow;
}

a:hover{ /* colors the link when hovered */
	color: magenta;
	    text-decoration: none;
}

audio { /*audio player*/
  height: 35px;
  width: 100%;
  background-color: #FF00FF;
  border-radius: 5px;
  box-shadow: 2px 2px 4px 0px #006773;
}

/* custom classes */

.logo{ /* Site logo image at the top of each page */
	width: 555px;
	padding-top:.5em;
}
	
.container { /* Feed Body */
  border: .5em solid #333;  
  border-radius: .2em;      
  padding: 1.5em;
  margin: .05em auto;
  max-width: 50em;      
  width: 90%; 
  background-color: #f8f8f8;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  box-sizing: border-box;
  overflow-wrap: normal;  
  word-wrap: break-word; 
  word-break: keep-all;
}

.container_top { /* Navigation Bar */
  border: .1em solid #333;  
  border-radius: .2em;
  padding: .5em;
  margin: .05em auto;
  max-width: 50em;
  width: 90%; 
  background-color: #f8f8f8;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  box-sizing: border-box;
  overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-word;
}

.container_left { /* Not Sure where this is used */
  padding: 1.5em;
  margin: .05em;
  max-width: 50em;
  width: 90%;
  min-height: 33em;
  background-color: #ffffff;
  box-sizing: border-box;
  overflow-wrap: normal;
  word-wrap: break-word;
  word-break: keep-all;
}
		
.no-wrap { /*keeps text and objects bound on the same line */
    display: inline-block;
	}

.wrapped-image { /* pushes image to the left, lets text flow around it */
		float: left;           
		margin: 0 5px 0px 0;
	}
	
.indent{ /* indents the paragraph just so */
	 text-indent: 40px;
}

.line-breaks { /* preserves line breaks from the HTML source. I use it for peoms, lyrics, etc. */
  white-space: pre-line; 
}

.redacted { /*block out an small area with a black square in a document */
  display: inline-block;
  width: 5.5em;
  height: 1.1em;
  background: black;
  vertical-align: middle;
}

.heaven { /*Rainbow animation graphics. Used often on text */
    background: linear-gradient(to right, #ffffff, #6666ff, #0099ff , #FFF300, #ff3399, #6666ff, #ffffff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow_animation 6s linear infinite;
    background-size: 400% 100%;
}

.image-container { /*Container for images like comics. Scrolls up and down. */
  width: 99%;
  height: 30em;
  overflow-y: scroll;
  overflow-x: hidden;
  border: 3px solid #111;
  border-radius: 10px;
  background-color: black;
}

.image-container img { /* Default of comics and images start at 50% */
  width: 50%;
}


.image-container-x { /*Container for images like comics. Scrolls right and left. */
  width: 100%;
  height: 30%;
  overflow-y: hidden;
  overflow-x: auto;
  border: 3px solid #111;
  border-radius: 10px;
  background-color: black;
}

.image-container-x img { /* Default height of horizontal comics and images start at 555px */
  display: inline-block;
  height: 555px;
}

.container-media {
  border: .5em solid #333;
  border-radius: .2em;
  padding: 1.5em;
  margin: .05em auto;
  max-width: 50em;
  width: auto; 
  max-height: 35em;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
  box-sizing: border-box;
  overflow-y: auto;
  overflow-wrap: normal;
  word-wrap: break-word;
  word-break: keep-all;
}

.thumb {
  object-fit: cover;
  border-radius: 8px;
  margin: 5px;
}

.text{
	color: black;
	transition: color 0.25s ease;
	transition: font-size 0.25s ease;
}

.text:hover{
	color: red;
	font-size: 1.5em;
}

.thumb_movie{
	width: 100px;
	filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.5));
}

.nodecor{
	    text-decoration: none;
}

/*CSS changes for mobile media */
@media (max-width: 768px) {
  .logo {
		width: 75%;    /* keeps aspect ratio */
  }
  
	audio {
		height: 35px;
		width: 100%;
		background-color: #FF00FF; /* Changes the background of the control panel */
		border-radius: 5px;
		box-shadow: 2px 2px 4px 0px #006773;
	}

	.image-container img {
		height: auto;   /* fills most of screen height */
		width: 100%;    /* keeps aspect ratio */
  }
  
	.image-container-x img {
		height: 250px;   /* fills most of screen height */
		width: auto;    /* keeps aspect ratio */
  }
  
	.thumb{
		width: 100px;
	}
	
	.thumb_movie{
	width: 200px;
}
	

	video{
		height: 250px;
	}
	
}

	
	/* fonts */
	/* fonts */
	@font-face {
	   font-family: EB;
	   src: url(../fonts/EBGaramond-VariableFont_wght.ttf);
}
	@font-face {
		font-family: EB;
		src: url(../fonts/EBGaramond-Bold.ttf);
		font-weight: bold;
}
	@font-face {
	   font-family: dos;
	   src: url(../fonts/ModernDOS9x16.ttf);
}

@keyframes rainbow_animation {
    0%,100% {
        background-position: 0 0;
    }

    50% {
        background-position: 100% 0;
    }
}


/*
 
============----------------------------------
--=========-----------------::-:::------------
+====*===-------------::-=::-:.--:::-------:::
%#*=++-.--=.=**--------:::::.+***.:::-:-----==
%@%%%%#+-====*#%%-----::-:=:#####+:::::-------
==+*%%%%%%%%*#####*.---::-:###%##-------------
+=++++++*%#%%%###%###%######%####---------====
+++++++++=====*%##%%%#*#%%%%%%%%#-=-----====--
+++++++=====---%%#*#*###%%###%%%*:-:---====--=
++++++===--:::*#%@@#++*#%@@@#%###--= ---=--:-=
++++++++++===-#%#%@#++=+%%@%#%%%%==----------=
++++++++++++*++%%#*%*==+#*#####%%#*=------====
**+++*++++#%%%+*#===***==**#%%@@%#@+=----=====
+++%%@+*###**+=+*===+##++++*##**+%@*==========
#+*%@@@#%%%%###*=+*+####****+++#@@%*==========
++#@@@@%#%#######-==+**##***+##%@%%@%%#+======
**#@@@#++#%#%%%#+--===++++*+#%@@@%@@@@@%%%*===
@@@@@@%%%%#%%%%%*=--====+*%@@@@@@@@@%@@@%@%%%=
@%@@@@%###@@@@@%#---====@@@@@@@@@@@@@@@%%%%@@%
@@@@@@@@@@@@@@@@*=====*%@@@@@@@@@@@@@@@@@@%@%%
@@@@@@@@@@@@@@@@%+=+#%%@@@@@@@@@@@@@@@@@@%%%%@
@@@@@@@@@@@@@@@@@*++#@@@@@@@@@@@@@@@@@@%@@@%%@
@@@@@@@@@@@@@@@@@%**#@@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@#*#@@@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@%#*%@@@@@@@@@@@@@@@@@@@@@@
@@@@@@@@@@@@@@@@@@@@@@%#@@@@@@@@@@@@@@@@@@@@@@
+++++++*#+=======+++@@@@@@@@@@@@@@@@@@@@@@@@@@
+++++++++***++++++=+@@@@@@@@@@@@@@@@@@@%@%@@@@
+*++*+++++++++++++*#@@@@@@@@@@@@@@@@@@@@@@@@@@
++++**+*+++++++*+**%%@@@@@@@@@@@@@@@@@@@@@@@%@
******++**+*****##%##%@%@@@@@@@@@@@@@@@@@%@@@@
**#**#********#%%%#@%%@@@@@@@@%@@@@@@@@@@@@@@@
######*#*****#*#++##%@@@@@@@@%%@@@@@@@@@@@%##*  ~signed... Hackercat♡

*/