@charset "utf-8";
/* CSS Document */

@font-face{
        font-family:"Wes Wilson W01 Regular";
        src:url("/Fonts/1518326/3ea3a8d6-4f0d-4711-b75e-ce69c65fcc99.woff2") format("woff2"),url("/Fonts/1518326/77ba3932-8174-4ca2-8acd-59965130c9eb.woff") format("woff");
    }

body, html {
    color:#ededed;
    background-color: #000;
}




p, h1, h2, h3, ul, a, img {
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}



@media (max-width: 575.98px) {
.container, #header.full-header .container, .container-fullwidth {
    width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}
}

a {
    color:lime!important;
}

.helper {
    font-size:12px; font-weight:none; display: inline-block; margin-bottom: 0; color:yellow
}

.dark .form-control:not(.not-dark), .dark .sm-form-control:not(.not-dark)
{ 
background-color:#222;
}

body.side-push-panel { overflow-x: hidden; }




#side-panel  {
    background-color: #111!important
}



#side-panel .widget {
    margin-top: 40px;
    padding-top: 40px;
    width: 220px;
    border-top: 0px solid #E5E5E5;
}


h1, h2, h3, h4
{
    font-family: 'Lato', sans-serif;
}

h1 {
    font-size:40px;
}

h2 {
    font-size:35px;
}

p {
    font-size:16px; color:cyan;
}

.heading-block h1 {
    font-size: 80px;
} 
.rainbow-text {
  background-image: linear-gradient(to left, violet, indigo, blue, green, yellow, orange, red);   -webkit-background-clip: text!important;
  color: transparent!important;font-family: 'Wes Wilson W01 Regular'!important ; font-size:60px!important; letter-spacing: 4px!important; line-height:1.1em!important;
} 

@media (min-width: 768px) {
.rainbow-text {
  font-size:80px!important;;
} 
}



.rainbow-text2 {
  background-image: linear-gradient(to left, violet, indigo, blue, green, yellow, orange, red);   -webkit-background-clip: text!important;
  color: transparent!important;
}

.rainbow-box {
  background-color: #302244;
  /*border: 3px solid transparent;*/
	
  border-style: solid;
  border-width: 3px;	
	
	
  border-image: linear-gradient(to bottom right, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  border-image-slice: 1;
  border-radius:15px!important;   
}

.rainbow-button {
  background-color: #ff1493;
  background-image: linear-gradient(319deg, #ff1493 0%, #0000ff 37%, #ff8c00 100%);

}


.men {line-height: 50px; font-size: 44px}
    
    .globe {
        text-decoration: none!important; margin: 0 6px; font-size: 18px;
    }    
    
 .slideshow {
      margin-top: 0;
      padding-bottom: 0vw;
	 background-color: #1c1c1c;
	 margin-bottom: 0;
    }

    .slide {
      width: 400px;
      max-resolution: 4vw;
      margin-right: 0px;
      text-align: center;
      height: 400px;
      background-color: #1c1c1c;
      border-radius: 0px;
      color: #fff;
      font-family: 'Helvetica Neue', helvetica, arial;
      font-size: 24px;
      line-height: 50vh;
      background-size: 100%;  
      position: relative;
      /*filter: grayscale(100%);*/  
    }


    /*.slidetextback {
      position:absolute; bottom:-16px; text-align: center; line-height: 1.0em; height:80px; width:100%; background-color: transparent; z-index: 300}*/

    .slidetext {
        font-size: 18px; color:purple; padding: 4px; line-height: 1.0em;font-family: 'Ultra'!important ; height:50px; background-color: #1c1c1c;
    }



            
#inner {
  display: table;
  margin: 0 auto;
}

#outer {
  width:100%
}            
.container-fluid {padding-right: 0; padding-left: 0}            
@media (min-width: 1800px) {
.container-fluid {max-width: 1800px;}
}




.albumtitle {
    font-size: 22px;
    font-weight: bold;
    color: red;
    margin-bottom: 5px;
    line-height: 1.1em;
}

.label {
    font-size: 14px;
    font-weight: normal;
    color: white;
    margin-bottom:2px;
}

.artist {
    font-size: 16px;
    font-weight: normal;
    color: cyan;
    margin-bottom:0px;
}

.date {
    font-size: 12px;
    font-weight: normal;
    color: #FFFF00;
    margin-bottom:2px;
}

.playedon {
    font-size: 18px;
    font-weight: bold;
    color: lime;
    margin-bottom: 12px;
}

.songtitle {
    font-size: 15px;
    font-weight: normal;
    color: yellow;
    margin-bottom: 0px;
}

.single {
    font-size: 12px;
    font-weight: normal;
    color: white;
    margin-bottom: 12px;
}

.comments {
    font-size: 15px;
    font-weight: normal;
    color: #EA1196;
}




div .anime {
  display: inline-block;
  position: relative;
  width: 250px;
  height: 250px;
  margin: 0px auto;
  border-radius: 50%;
  border: 10px solid hsla(0,0%,0%,.7);
margin-top: 30px;
  
  
  background-position: center;
  transform: scale(.9);
  transition: transform .5s cubic-bezier(.32,0,.15,1);
}

div .anime:hover {
  cursor: none;
  transform: scale(1);
  transition: transform .2s cubic-bezier(.32,0,.15,1);
}



/* Particle Ping Pong -------------------------------------------- */

.particle {
  background-size: 12px 12px;
  background-color: #000;
  
  /* the default highlight was too strong */
  box-shadow: inset 0 15px 15px -5px hsla(0,0%,100%,.25), inset 0 -5px 10px 3px hsla(0,0%,0%,.6), 0 8px 10px 2px hsla(0,0%,0%,.3);
  background-image: radial-gradient( #555 0px, hsla(0,0%,0%,0) 2px, hsla(0,0%,0%,0) 24px),
    repeating-radial-gradient( gray 0px, black 2px, black 48px);
}
.particle:hover {
  animation: particle-size .24s linear infinite, particle-positon .48s linear infinite alternate;
}

@keyframes particle-size { from { background-size: 6px 6px, 12px 12px; } to { background-size: 12px 12px, 24px 24px; } }
@keyframes particle-positon { from { background-position: 60px, 60px; } to { background-position: 140px, 140px; } }





/* Growing cells -------------------------------------------- */

.cells {
  background-size: 24px 24px;
  background-color: #fff;
  background-image: repeating-radial-gradient( black 8px, white 12px);
}

.cells:hover {
  animation: cells 0.4s linear infinite;
}

@keyframes cells { from { background-size: 12px 12px; } to { background-size: 24px 24px; } }





/* Jelly -------------------------------------------- */

.jelly {
  background-size: 60px 60px;
  background-color: hsla(320,80%,60%,1);
  background-image: repeating-radial-gradient( hsla(320,100%,60%,.6) 0px, hsla(220,100%,60%,0) 60%),
    repeating-radial-gradient( hsla(330,100%,40%,1) 12%, hsla(320,80%,60%,1) 24px);
}

.jelly:hover {
  animation: jelly 1.4s cubic-bezier(.1,.4,.9,.6) infinite;
}

@keyframes jelly {
  from { background-size:  60px  60px,  24px  24px; }
  50%  { background-size: 120px 120px, 100px 100px; }
  to   { background-size:  24px  24px, 140px 140px; }
}




/* Blobbs -------------------------------------------- */

.blobbs {
  background-size: 66px 66px;
  background-color: hsl(200,100%,50%);
  background-image: repeating-radial-gradient( hsla(200,100%,80%,.8) 0px, hsla(200,100%,80%,.5) 4px, hsla(200,100%,80%,0) 50px),
    repeating-radial-gradient( hsla(260,100%, 0%, 0) 0px, hsla(260,100%,50%,.1) 2px, hsla(260,100%, 0%,0) 10px);
}

.blobbs:hover {
  animation: blobbs-position 6s cubic-bezier(.4,0,.2,1) infinite,
    blobbs-size .75s cubic-bezier(.4,0,.2,1) infinite alternate;
}

@keyframes blobbs-position {
  0% { background-position: left top, left top; }
  25% { background-position: right top, left bottom; }
  50% { background-position: right bottom, right bottom; }
  75% { background-position: left bottom, right top; }
  100% { background-position: left top, left top; }
}

@keyframes blobbs-size { from { background-size: 200px 200px, 200px 200px; } to { background-size:  66px  66px, 66px 66px; } }




/* The Chase -------------------------------------------- */

.chase {
  background-repeat: no-repeat, repeat;
  background-size: 180px 180px;
  background-color: hsl(50,100%,70%);
  background-image: repeating-radial-gradient( hsla(50,100%,100%,1) 0px, hsla(50,100%,90%, 1) 10px, hsla(50,100%,70%,.2)  12px, hsla(50,100%,70%,0) 130px),
    repeating-radial-gradient( hsla(20,100%, 50%,0) 20%, hsla(20,100%,50%,.4) 80%,  hsla(50,100%,70%, 1) 120px);
}

.chase:hover {
  animation: chase-position 1.2s infinite, chase-size .4s infinite alternate;
}

@keyframes chase-position {
  0% { background-position: left top, left top; }
  25% { background-position: right top, left bottom; }
  50% { background-position: right bottom, right bottom; }
  75% { background-position: left bottom, right top; }
  100% { background-position: left top, left top; }
}

@keyframes chase-size {
  from { background-size: 120px 120px, 300px 300px; }
  50% { background-size: 160px 160px, 150px 150px; }
  to   { background-size: 180px 180px, 100px 100px; }
}

.head {
	pointer-events: none;
}

.head > * {
/* Adjust animation duration to change the element’s speed */
        animation: head 2s forwards;
        pointer-events: none !important;
	top: 50%;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%,-50%) scale(0.001);
	/*transform:scale(0,0);*/
	position: fixed;
	animation-delay: 0.1s;
	z-index: 999999;
    transition: opacity .2 ease-in-out;
    opacity: 1.0;
}

 /* Keyframe values control where the element will begin
    and end its trajectory across the screen. Each rule
    represents a path the element follows across the screen. */


@keyframes head {   
    100% {opacity:0;
		transform: translate(-50%,-50%) rotateZ(25deg) scale(2.0)
	}
	
	}
    
}