/*
		Theme Name: Artopsy 2025
		Theme URI: https://Artopsy.net/theme
		Author: Ajey@Artopsy.net
		Author URI: Artopsy.net
		Description: This is my first custom theme!
		Version: 1.0.0
		License: GNU General Public License v2 or later
		License URI: <https://www.gnu.org/licenses/gpl-2.0.html>
		Text Domain: Artopsy 2025
		Tags: 
*/

	@font-face {  	font-family: MondayMother;
						src: url(MondayMother.otf);
					}
		@font-face {  	font-family: silkscreen;
						src: url(slkscre.ttf);
					}
a, a:hover, img a, img a:hover { 
													transition-timing-function: ease-in;
													transition-timing-function: ease-out;
transition: 0.25s;}

a, a:hover	{	text-decoration: none !important;}


			body	{
						margin: 0px; padding: 0px;
						background: #d7a2a3;
						background-repeat: repeat;
						background-position: top center;
						font: 14px/11px arial;
						letter-spacing: 1px;
						
						
						}
						
			#container	{
							width: 1342px;
							margin: 0px auto 0px;
							min-height: 300px;
							background-image: 	url(headermain.png), 
												url(headermainrunner.png);
							background-repeat:	no-repeat, 
												repeat-y;
							background-position:	top center,
													top center;
							overflow: hidden;
							}
							
				#container::after	{	position: relative;
										clear: both;
										display: block;
										content: " ";
										margin: 0px auto;
										width: 1232px;
										height: 32px;
										background:	 			
													url("runnerbottom.png");
										background-repeat:  no-repeat;
										background-position: bottom center;
										z-index: 999 !important;
										}
										
			#navigate	{		margin: 302px 0 0;
								padding-left: 222px;
								padding-top: 25px;
								}
								
						a.top:link, a.top:active, a.top:visited {	margin: 0 5px;
																	font:8px silkscreen; 
																	border: none ;
																	text-transform: lowercase;
																	letter-spacing: 1px ;
																	background: #2c3241; 
																	padding-bottom: 4px;
																	padding-top: 15px;
																	padding-left: 8px; padding-right: 8px;
																	text-align: left  ;
																	color: #e6e6e6;
																	margin-top: 0px;
																	border-top: 5px solid #555e78;
																	}
																	
									a.top:hover	{	margin-bottom: 10px; 
													padding-left: 30px;
													padding-right: 30px;
													letter-spacing: 3px;
													}
													
									
								
									a.top:nth-child(4n+1):hover	{	color: #638394; 
																	border-color: #638394;}
									a.top:nth-child(4n+2):hover		{	color: #aa6d8d;
																		border-color: #aa6d8d;}
									a.top:nth-child(4n+3):hover		{	color: #df6762;
																		border-color: #df6762;}
									a.top:nth-child(4n+4):hover		{	color: #9ab48d;
																		border-color: #9ab48d;}
																		
							#navigate a.top:nth-child(4n+1) span	{	color: #638394 !important;}
							#navigate a.top:nth-child(4n+2) span	{	color: #aa6d8d !important;}
							#navigate a.top:nth-child(4n+3) span	{	color: #df6762 !important;}
							#navigate a.top:nth-child(4n+4) span	{	color: #9ab48d !important;}
									
								#navigate a.top:hover span { 	color: #e6e6e6 !important;
																
															}
																						
				
										
			#content	{	position: relative;
							float: left;
							width: 635px;
							padding: 5px;
							min-height: 200px;
							color: #808080;
							
							}
							
				#content img { border: 2px solid #e6e6e6; margin: 2px;}
				#content table {	position: relative;
							margin: 0 auto !important;
							width: 80%;
							background: #eceaf0;
							color: #808080;
							font:10px/10px silkscreen;
							text-transform: capitalize;	}
				#content table span {border-bottom: 1px solid #cbc3da !important; display: block; margin-top: 3px;}
							
							#content h1	{	font-style: italic;
											font:36px/40px MondayMother;
											margin-bottom: 0px !important;
											text-align: center;
											font-weight: normal !important;
											letter-spacing: 1px;
											margin: 0 0 10;
											border-bottom: 1px dashed #3a4155;
											color: #3d4355;
										
											}
							#content h2, th.tutorials_th_main	{	font:8px/12px silkscreen;
											color:#e6e6e6;
											text-align: center;
											font-weight: normal !important;
											letter-spacing: 4px;
											margin: 0 0 5;
											padding: 5px 0px;
											background: url(h2.png), 
														url(h2b.png)  #3a4155;
											background-repeat: no-repeat; 
											background-position: left center, right center;
										
											}
											
									.content, .content:hover, .content:hover span, .content span	
															{	transition-timing-function: ease-in  !important;
																transition-timing-function: ease-out  !important;
																transition: 0.25s  !important;
																}
											
								.content {	float: left; text-align: center;
											padding-bottom: 10px;
											width: auto;
									}
									.content a {	padding: 5px 8px;
													font: 8px silkscreen;
													color: #e6e6e6;
													opacity:0 !important;
													
									}
									
									.content:hover a { opacity:1 !important;}
									
									
									.content span	{	position: absolute;
														text-align: center;
														margin-top: 150px !important ;
														margin-left: -136px;
														background: #303030;
														border-bottom-left-radius: 20px;
														border-bottom-right-radius: 20px;
									}
									
									
									
									.content:nth-child(4n+1) span	{	background-color: #638394 !important;}
									.content:nth-child(4n+2) span	{	background-color: #aa6d8d !important;}
									.content:nth-child(4n+3) span	{	background-color: #df6762 !important;}
									.content:nth-child(4n+4) span	{	background-color: #9ab48d !important;}
									
									
									.content:nth-child(4n+1) a	{	background-color: #638394 !important;;}
									.content:nth-child(4n+2) a	{	background-color: #aa6d8d !important;;}
									.content:nth-child(4n+3) a	{	background-color: #df6762 !important;;}
									.content:nth-child(4n+4) a	{	background-color: #9ab48d !important;;}
									
									
									
									.content:nth-child(4n+1) img {	border-color: #638394 !important;}
									.content:nth-child(4n+2) img  {	border-color: #aa6d8d !important;}
									.content:nth-child(4n+3) img {	border-color: #df6762 !important;}
									.content:nth-child(4n+4) img  {	border-color: #9ab48d !important;}
									
									.content a:hover	{background-color: #3a4155 !important;}
									
									.content:nth-child(4n+1) a:hover	{	color: #638394;}
									.content:nth-child(4n+2) a:hover	{	color: #aa6d8d;}
									.content:nth-child(4n+3) a:hover	{	color: #df6762;}
									.content:nth-child(4n+4) a:hover	{	color: #9ab48d;}
									
											
										
									.content:hover span { 	
														margin-top: 120px !important ;
															background: none !important;
															}	
								blockquote	{	position: relative;
												margin: 0 auto;
												margin-top: 20px;
												margin-bottom: 30px;
												padding: 10px;
												width: 60%;
												background: #e6e6e6;
												font: 8px silkscreen;
												color: #808080;
												border: 5px double #5e698a;
												border-width: 0px 5px;
												}
												
												
					#left	{	position: relative;
								float: left;
								margin: 400px 86px 0px 80px;
								width: 110px;
								min-height: 200px;
								}
								
					#right	{	position: relative;
								float: left;
								overflow: hidden;
								margin: 20px 0px 0px 27px;
								width: 300px;
								min-height: 200px;
								}
								
								
				#right::before, #right::after	{		position: relative;
														clear: both;
														display: block;
														content: " ";
														width: 136px;
														height: 136px;
														background-repeat: no-repeat;
														background-position: bottom left;
														z-index: 999 !important;
														}
										
										
					#right::after		{	background:	url("sidebottom.png");}
					#right::before		{	background:	url("sidetop.png"); }
					
					.box	{	position: relative;
								float: left;
								width: 90%;
								margin: 10px;
								margin-bottom: 50px;
								padding: 5px;
								padding-right: 0px;
								padding-top: 10px;
								background: #3a4155;
								color: #5d6885;
								font:8px/10px silkscreen;
								border-bottom: 30px double;
								border-top: 15px solid;
								text-shadow: #2d3241 0px 0px 2px;
								border-bottom-left-radius: 40px;
								border-bottom-right-radius: 40px;
								}

						
						.box table	{	width: 100%;}
							.box table td	{	width: 50%;}
							
						.box table td a:active, 
						.box table td a:link, 
						.box table td a:visited	{	font: 8px/10px silkscreen;
													letter-spacing: 1px;
													display: block;
													text-decoration: none;
													text-transform: lowercase;
													text-align: center;
													background: #32394a;
													margin-bottom:1px;
													border: 20px solid ;
													border-width: 0px 0px;
													color: #5d6885;
													padding: 3px 0px;
													transition-timing-function: ease-in;
													transition-timing-function: ease-out;
													transition: 0.25s;
												}						
					.box:nth-child(4n+1) table td a:hover {	background: #638394 ; }
					.box:nth-child(4n+2) table td a:hover {	background: #aa6d8d ; }
					.box:nth-child(4n+3) table td a:hover {	background: #df6762 ; }
					.box:nth-child(4n+4) table td a:hover	{	background: #9ab48d ; }
					
					.box:nth-child(4n+1) table td a {	border-color: : #638394 !important ; }
					.box:nth-child(4n+2) table td a {	border-color: : #aa6d8d !important ; }
					.box:nth-child(4n+3) table td a {	border-color: : #df6762 !important ; }
					.box:nth-child(4n+4) table td a	{	border-color: : #9ab48d !important ; }
					
					.box table td a:hover {		transition-timing-function: ease-in;
												transition-timing-function: ease-out;
												transition: 0.25s;
												border-width: 0px 20px;
												border-color: #32394a;
												color: #32394a;
												letter-spacing: 0px;
												}
								
						.box h2	{	font-weight: normal;
									margin-top: -35px;
									margin-bottom: 30px;
									margin-left: -14px;
									padding-top: 1px;
									margin-right: 5px;
									text-align: right;
									letter-spacing: -2px;
									font:78px/3px MondayMother;
									color: #3a4155;
									background: #3a4155;
									text-shadow: #3a4155 -4px 2px 0px;
									}
								
								
						
					.box:nth-child(4n+1) h2 {	text-shadow: #638394  -3px 0px 0px; }
					.box:nth-child(4n+2) h2 {	text-shadow: #aa6d8d  -3px 0px 0px; }
					.box:nth-child(4n+3) h2 {	text-shadow: #df6762  -3px 0px 0px; }
					.box:nth-child(4n+4) h2	{	text-shadow: #9ab48d  -3px -1px 0px; }
					
					.box:nth-child(4n+1) h2:first-letter	{	color: #638394;
									text-shadow: #3a4155 -3px 2px 0px;	}
					.box:nth-child(4n+2) h2:first-letter	{	color: #aa6d8d;
									text-shadow: #3a4155 -3px 2px 0px;	}
					.box:nth-child(4n+3) h2:first-letter	{	color: #df6762;
									text-shadow: #3a4155 -3px 2px 0px;	 }
					.box:nth-child(4n+4) h2:first-letter	{	color: #9ab48d;	
									text-shadow: #3a4155 -3px 2px 0px; }
					
					.box:nth-child(4n+1) 	{	border-color: #638394; }
					.box:nth-child(4n+2) 	{	border-color: #aa6d8d;}
					.box:nth-child(4n+3) 	{	border-color: #df6762;}
					.box:nth-child(4n+4)	{	border-color: #9ab48d;}
		
		
.tagcloud, .widget_tag_cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 5px;
  justify-content: center;
}

.tag-cloud-link {
  display: inline-block;
  color: white;
  font: 8px/10px silkscreen !important;
  letter-spacing: 1px !important;
  background: #3d4355 !important;
  text-decoration: lowercase !important;
  transition: all 0.3s ease;
  padding: 1px 3px;
  margin: 1px 1px;
}

/* Rotating tag backgrounds */
.tag-cloud-link:nth-child(4n+1):hover {
  background: #638394 !important;
}
.tag-cloud-link:nth-child(4n+2):hover {
  background: #aa6d8d !important;
}
.tag-cloud-link:nth-child(4n+3):hover {
  background: #df6762 !important;
}
.tag-cloud-link:nth-child(4n+4):hover {
  background: #9ab48d !important;
}
.post-tags {background: #3d4355; margin: 10px; padding: 5px; 
 font: 8px/10px silkscreen !important;
  letter-spacing: 1px !important;
 border-bottom: 20px double #fff;
  background: #3d4355 !important;}

.post-tags a {
  display: inline-block;
  color: white;
  font: 8px/10px silkscreen !important;
  letter-spacing: 1px !important;
  background: #3d4355 !important;
  text-decoration: none !important;
  transition: all 0.3s ease;
  padding: 1px 10px;
  margin: 1px 1px;
}
.post-tags {  color: #4f566c !important;
}

.post-tags a:nth-child(4n+1):hover {
  background: #638394 !important;
}
.post-tags a:nth-child(4n+2):hover {
  background: #aa6d8d !important;
}
.post-tags a:nth-child(4n+3):hover {
  background: #df6762 !important;
}
.post-tags a:nth-child(4n+4):hover {
  background: #9ab48d !important;
}

span.tag-label { color: #7884a6;}



a.more-link { position: relative;
  clear: both !important;
  margin-top: 10px;
  margin: 10px;
  padding: 4px 8px;
  background: #3d4355;
  border-left: 10px solid #df6762;
  color: white;
  font: 8px/10px 'Silkscreen', monospace;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 3px;
  margin-right: 10px;
  transition: all 0.3s ease;
}

a.more-link:hover {
  background: #df6762;
  color: #3d4355;
  margin-right: 20px;
  border-left: 50px solid #3d4355;
}
.verdict-overlay {
  position: absolute;
  top: 30px;
  right: -80px;
  width: 250px;      
  height: 100px;
  background-repeat: no-repeat;
  background-position: top center;
  background-image:;
}
