/****************\
 theJubster.co.uk
 logo.css
\****************/

*{
  font-weight:normal;
  letter-spacing:1pt;
  word-spacing:2pt;
  text-align:center;
  line-height:1.25;
  font-family:tahoma, helvetica, sans-serif;
  cursor:none;
	
}

a{
  font-size:32px;
  font-weight:bold;
}

body {
  background-color:white;
  height:100%;
  margin:0;
  padding:0;
  width:100%;
}


/*
 * Anything where this class applies 
 * will do nice transition fades on 
 * included elements
 */ 

.transition, .transition:hover{
  transition:
    background-color ease-out 4s,
    border ease-out 4s,
    box-shadow ease-out 4s,
    color ease-out 4s,
    text-shadow ease-out 4s;
}

/**************
* body
*/

body.transition:hover {
  background-color:dodgerblue;
  color:white;
}

body.transition:hover .link a{
	background-color:white;
	color:dodgerblue;
}

/**************
* Code Link
*/

.link a{
	background-color:dodgerblue;
	border-radius:200px;
	bottom:10px;
	box-shadow: 0px 0px 9px dodgerblue;
	left: 50%;
	line-height:70px;
	margin: 0 0 0 -30px;
	max-width: 70px;
	min-height:70px;
	min-width:70px;
	padding:0;
	position: fixed;
	width: 60px;
}

.link a, .link a:visited{
  color: white;
  text-decoration: none;
}

.link:hover{
  background-color:white;
  color:dodgerblue;
}

/******* 
* Smiley
*/

.smiley{
  border-radius:100px;
  border: solid 2px dodgerblue;
  box-shadow: 
    0px 0px 5px dodgerblue,
    inset 0px 0px 5px dodgerblue;
  cursor:none;
  height:30px;
  margin:42px auto;
  padding:3px;
  position:relative;
  text-align:center;
  text-shadow:0px 0px 6px dodgerblue;
  width:30px;

}

body:hover .smiley{
	border-color: white;
	box-shadow: 
	  0px 0px 5px white,
		inset 0px 0px 5px white;
	text-shadow:0px 0px 6px white;

}

/**************
* Logo
*/

.logo {
  background-color:dodgerblue;
  box-shadow: 
    0px  8px 6px 6px rgba(30,144,255,1),
    0px -8px 6px 6px rgba(30,144,255,1);
  color:white;
  color:dodgerblue;
  cursor:none; 
  font-size:1000%;
  margin:5% 0 0 0;
  padding:62px;
  text-shadow: 
	   0px  0px 9px white,
	   1px  1px 1px white,
	  -1px  1px 1px white,
	   1px -1px 1px white,
	  -1px -1px 1px white;

}

p.logo:hover {

  color: dodgerblue;
  color:white;
  background-color: white;
  box-shadow: 
    0px  8px 6px 6px white,
    0px -8px 6px 6px white;
  text-shadow:
     0px  0px 9px dodgerblue,
     1px  1px 1px dodgerblue,
    -1px  1px 1px dodgerblue,
     1px -1px 1px dodgerblue,
    -1px -1px 1px dodgerblue;
}


/* flicker effect */


.anim{

 /* 
  * This class will be animated
  * We have 25 'frames' laid out in the next
  * section so it's best to keep the duration 
  * at one(1) second to get 25 fps which, without
  * any particular knowledge on this subject seems
  * pretty sensible to me. YMMV 
  */

  /* Chrome, Safari, Opera */
  
/*-webkit-animation-name: pulse;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-delay: 0.5s;
  -webkit-animation-iteration-count: 3;
  -webkit-animation-direction: alternate;
  -webkit-animation-play-state: running;
*/

  /* Standard syntax */
  
  animation-name: pulse;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-delay: 0.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-play-state: running;

}
/*
@-webkit-keyframes pulse {

   0% {color: red ;} 
   4% {color: white ;}
   8% {color: lime ;} 
  12% {color: dodgerblue ;}
  16% {color: magenta ;} 
  20% {color: yellow ;}
  24% {color: darkorange ;} 
  28% {color: gray ;}
  32% {color: purple ;} 
  36% {color: white ;}
  40% {color: hotpink ;} 
  44% {color: lime ;}
  48% {color: white ;} 
  52% {color: magenta ;}
  56% {color: dodgerblue ;} 
  60% {color: darkorange ;}
  64% {color: yellow ;} 
  68% {color: purple ;}
  72% {color: gray ;} 
  76% {color: hotpink ;}
  80% {color: purple ;} 
  84% {color: white ;}
  88% {color: hotpink ;} 
  92% {color: lime ;}
  96% {color: white ;} 
}
*/

@keyframes pulse {
   0% {color: red ; border-color:lime ;} 
   4% {color: white;border-color:dodgerblue;}
   8% {color: lime ;border-color:magenta;} 
  12% {color: dodgerblue ;border-color:yellow;}
  16% {color: magenta ;border-color:darkorange;} 
  20% {color: yellow ;border-color:gray;}
  24% {color: darkorange ;border-color:purple;} 
  28% {color: gray ;border-color:white;}
  32% {color: purple ;border-color:hotpink;} 
  36% {color: white ;border-color:lime;}
  40% {color: hotpink ;border-color:white;} 
  44% {color: lime ;border-color:magenta;}
  48% {color: white ;border-color:dodgerblue;} 
  52% {color: magenta ;border-color:darkorange;}
  56% {color: dodgerblue ;border-color:yellow;} 
  60% {color: darkorange ;border-color:purple;}
  64% {color: yellow ;border-color:gray;} 
  68% {color: purple ;border-color:hotpink;}
  72% {color: gray ;border-color:purple;} 
  76% {color: hotpink ;border-color:white;}
  80% {color: purple ;border-color:hotpink;} 
  84% {color: white ;border-color:lime;}
  88% {color: hotpink ;border-color:white;} 
  92% {color: lime ;border-color:red;}
  96% {color: white ;border-color:hotpink;}   
}

/* EOF */