/* Hewo, peeker of codes. 
   Feel free to use my codes (not the graphics) 
   for personal use, just give me credit. 
   I added comments to help you. */


/* Import Pixel Font */
@import url('04b03.css');


/* Custom Cursor */
body, a, a:hover { 
   cursor:url('/images/cursor.png'), auto;
}

/* CSS Reset */
body {
   font-family: Verdana;
   font-size: 10px;
   border: 0;
   margin: 0;
   padding: 0;
  /* background-color: transparent; */
   color: #b881fe;
   line-height: 15px;
}

/* Cute Itty Bitty Scrollbar */
::-webkit-scrollbar {
   width: 8px;
   height: 8px;
   background: transparent;
}
::-webkit-scrollbar-button {
   width: 4px;
   height: 4px;
   background: transparent;
}
::-webkit-scrollbar-thumb {
   background-color: #e1c3ff;
   -webkit-border-radius: 0;
   border: 1px solid #a966ff;
}
::-webkit-scrollbar-thumb:hover {
   background:#e1c3ff;
}
::-webkit-scrollbar-thumb:active {
   background:#e1c3ff;
}
::-webkit-scrollbar-track {
   background:0 0;
   border:none;border-radius:0;
}
::-webkit-scrollbar-track:hover {
   background:0 0;
}
::-webkit-scrollbar-track:active {
   background:0 0;
}
::-webkit-scrollbar-corner {
   background:0 0;
}

/* Text */
b, strong {
	color: #dc677e !important;;
	font-weight: bold;
	letter-spacing: 1.5px;
}
/* Headings 
h1 {
   color: #f9859c;
   letter-spacing: 2px;
   font-size: 1.5em;
}
*/
h1, h2, h3, h4 {
	color: #ffecfc;
	font-family: verdana;
	font-size: 7pt;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	font-weight: normal;
	text-align: center;
	width: 98%;
	background-color: #ff9cce;
	padding: 1px;
	border: 1px solid #ff42a5;
}

u {    
    border-bottom: 1px dotted #65deee;
    text-decoration: none;
}

i, em { 
  color: #ffab73 !important;;
  letter-spacing: 1.5px;
}

/* Links */
a:link {
   color:#ff9cce;
   text-decoration:none;
}
a:visited {
   color:#ff9cce;
   text-decoration:none;
}
a:hover {
   color:#e1c3ff;
   text-decoration:none;
}
a:active {
   color:#ff9cce;
   text-decoration:none;
}

/* Remove border on linked images */
a img {
   border: none;
}

/* Text area customizations */
textarea {
   font-family: Verdana;
   font-size: 8px;
   color: #b881fe;
   height: 50px;
   width: 150px;
   background-color: #d6affd;
   border-style: solid;
   border-color: #a966ff;
   border-width: 1px;
   overflow: auto;
   
}

/* To make your layout mobile responsive: 
   Put a div with an id of "layout" around entire content of index.html 
   Position of #layout must be relative. 
   Width & height of divs need to be specified in pixels. 
   
   Use absolute positioning for the other elements. 
   Use percentages (not pixels) for top & left. 
   
   Elements should stay in positon relative to the 
   layout div as the window resizes. */

.stickertut {
  -webkit-border-radius: 15px; 
  -moz-border-radius: 15px; 
  border-radius: 15px;
  padding: 5px;
}

#layout {
   position: relative;
   display: block;
   margin-top: 6%;
   width: 622px;
   height: 514px;
}

/* For the main content box */
#main {
   position: absolute; 
   top: 17%; 
   left: 39.5%;
   width: 290px;
   height: 310px;
}

/* For the navigation box */
#nav {
   position: absolute; 
   top: 17%;
   left: 13.5%;
   width: 108px;
   height: 98px;
}

/* For the update box */
#info {
   position: absolute;
   top: 49%;
   left: 13.5%;
   width: 110px;
   height: 72px;
}

/* For links box */

#links {
   position: absolute;
   top: 72.5%;
   left: 13.5%;
   width: 110px;
   height: 32px;
   overflow: hidden;

}
/* For the copyright info box */
#footer {
   position: absolute;
   top: 95.25%;
   left: 23.5%;
   font-family: '04b03', Verdana;
   font-size: 10px;
}

/* Marquee */

.marquee {
 height: 50px;	
 overflow: hidden;
 position: relative;
}
.marquee p {
 position: absolute;
 width: 200px;

 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);

 /* Apply animation to this element */	
 -moz-animation: scroll-left 15s linear infinite;
 -webkit-animation: scroll-left 15s linear infinite;
 animation: scroll-left 15s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes scroll-left {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scroll-left {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes scroll-left {
 0%   { 
 -moz-transform: translateX(100%);
 -webkit-transform: translateX(100%);
 transform: translateX(100%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); 
 -webkit-transform: translateX(-100%); 
 transform: translateX(-100%); 
 }
}
.marquee p:hover {
 -moz-animation-play-state: paused;
 -webkit-animation-play-state: paused;
 animation-play-state: paused;
 }


			td {
			  font-family: Verdana;
   			font-size: 10px;
				color: #ffffff;
				padding-left: 2px;
				padding-right: 2px;
			}