/*tooltips*/

#s-m-t-tooltip{
	max-width:300px;
	z-index:999999999999999999999999999999999;
	margin:24px 14px 7px 12px;
	padding:4px;
	background:#000; 
	font-family:'Neuton';
	font-size:11px;
	line-height:16px;
	color:#ffff;
	letter-spacing: 1px;
}  

/*cool effects*/

.infinitespin {
    -webkit-animation-name: spin;
    -webkit-animation-duration: 10000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spin;
    -moz-animation-duration: 10000ms;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spin;
    -ms-animation-duration: 10000ms;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-transition: rotate(3600deg);
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}


.tilt {
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-o-transition: 0.2s;
	-ms-transition: 0.2s;
	transition: 0.2s;
}

.tilt:hover {
	-webkit-transform: rotate(5deg);
	-moz-transform: rotate(5deg);
	-o-transform: rotate(5deg);
	-ms-transform: rotate(5deg);
	transform: rotate(5deg);
}

.twist, .easyhome {
	-webkit-transition: 1s;
	-moz-transition: 1s;
	-o-transition: 1s;
	-ms-transition: 1s;
	transition: 1s;
}

.twist:hover, .easyhome:hover {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
}

.slow-twist {
	-webkit-transition: 8s;
	-moz-transition: 8s;
	-o-transition: 8s;
	-ms-transition: 8s;
	transition: 8s;
}

.slow-twist:hover {
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
}

.blink {
  animation: blink-animation 1.5s steps(3, start) infinite;
  -webkit-animation: blink-animation 1.5s steps(3, start) infinite;
}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}

/*tossing*/

.tossing, .easyhome  {
	animation-name: tossing;
	-webkit-animation-name: tossing;	

	animation-duration: 8s;	
	-webkit-animation-duration: 8s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes tossing {
	0% {
		transform: rotate(-4deg);	
	}
	50% {
		transform: rotate(4deg);
	}
	100% {
		transform: rotate(-4deg);	
	}						
}

@-webkit-keyframes tossing {
	0% {
		-webkit-transform: rotate(-4deg);	
	}
	50% {
		-webkit-transform: rotate(4deg);
	}
	100% {
		-webkit-transform: rotate(-4deg);	
	}				
}

.spin {
-webkit-transition: -webkit-transform .8s ease-in-out;
          transition:         transform .8s ease-in-out;
}
.spin:hover {
 -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
}

/*extras*/
.row {
  display: flex;
}

.column {
  flex: 33.33%;
  padding: 5px;
}



/*scrollbar*/
body *::-webkit-scrollbar {
  width: 16px;
  height: 16px;
  background: none;
}

body *::-webkit-scrollbar-thumb, body *::-webkit-scrollbar-button {
  width: 16px;
  height: 16px;
  background: silver;
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px gray;
  border: 1px solid;
  border-color: silver #000 #000 silver;
}

body *::-webkit-scrollbar-track {
  image-rendering: optimizeSpeed;
  image-rendering: pixelated;
  image-rendering: optimize-contrast;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAyIDIiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+CjxtZXRhZGF0YT5NYWRlIHdpdGggUGl4ZWxzIHRvIFN2ZyBodHRwczovL2NvZGVwZW4uaW8vc2hzaGF3L3Blbi9YYnh2Tmo8L21ldGFkYXRhPgo8cGF0aCBzdHJva2U9IiNjMGMwYzAiIGQ9Ik0wIDBoMU0xIDFoMSIgLz4KPC9zdmc+");
  background-position: 0 0;
  background-repeat: repeat;
  background-size: 2px;
}

body *::-webkit-scrollbar-button {
  background-repeat: no-repeat;
  background-size: 16px;
}

body *::-webkit-scrollbar-button:single-button:vertical:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTcgNWgxTTYgNmgzTTUgN2g1TTQgOGg3IiAvPgo8L3N2Zz4=");
}

body *::-webkit-scrollbar-button:single-button:vertical:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTQgNWg3TTUgNmg1TTYgN2gzTTcgOGgxIiAvPgo8L3N2Zz4=");
}

body *::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTggM2gxTTcgNGgyTTYgNWgzTTUgNmg0TTYgN2gzTTcgOGgyTTggOWgxIiAvPgo8L3N2Zz4=");
}

body *::-webkit-scrollbar-button:single-button:horizontal:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTYgM2gxTTYgNGgyTTYgNWgzTTYgNmg0TTYgN2gzTTYgOGgyTTYgOWgxIiAvPgo8L3N2Zz4=");
}

body *::-webkit-scrollbar-corner {
  background: silver;
}

/*selection*/
::-moz-selection {
 background:rgba(39, 124, 208, 0) !important;
 color:#277CD0 !important;
}
::selection {
 background:rgba(39, 124, 208, 0) !important;
 color:#277CD0 !important;
}

    /*main links*/
    .header{
    position: relative;
          height: 10em;
          width: 40em;
  margin-left: 37em;
  margin-bottom: -5.5em;
  z-index: 9999;
    }
  
  .header img{
    margin-left: 200px;

    }
  
      .mainlinks{
    position: relative;
          height: 40em;
          width: 50em;
          margin-top: 5em;
  margin-left: 10em;
      display: inline-block;
      background: #fff;
    border: 3px solid #000;
    overflow-y: scroll;
  overflow-x: hidden;
    z-index:2;
    
      
    
  }
  
  .mainlinks::-webkit-scrollbar {
                display: none;
  }
    
  
  .mainlinks h2 {
	background: #000;
	color: #fff;
	font-size: 1rem;
	padding: 4px;
	margin-top: -10px;
	text-align: left;
	font-family: "ms gothic";
  }
  
  
    .mainlinkstext {
	color: #000;
	font-size: 1rem;
	padding: 4px;
	margin-top: 5px;
	text-align: center;
	font-family: "ms gothic";
  }

 .mainlinkstext a:hover {
-webkit-filter: blur(1px);
cursor: help;
  }
.mainlinkstext table {
         background-color:white;
         width: 100%;
         margin-top: -20px;
         font-size: 19px;
         }
         
         .mainlinkstext td{
 border:1px solid #aec0f2; 
}

a {
  color: blue;
  text-decoration: none;
  
}
  a:visited {
  color: blue;
  text-decoration: none;
}


.cloudfloatie {
  position: absolute;
  top: 0;
  right: 0;
  margin-right: 37em;
  z-index:1;
  transform: scale(0.7,0.7);
  margin-top: -10em;
  filter: grayscale(60%)
}

.line-1{
    position: relative;
    bottom: 0;  
    width: 1em;
    margin: 0 auto;
    border-right: 2px solid rgba(255,255,255,.75);
    font-size: 180%;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);  
    color: white;
    font-family: "Sedgwick Ave Display";
    
}

/* Typewriter Animation */
.anim-typewriter{
  animation: typewriter 4s steps(44) 1s 1 normal both,
             blinkTextCursor 500ms steps(44) infinite normal;
}
@keyframes typewriter{
  from{width: 0;}
  to{width: 24em;}
}
@keyframes blinkTextCursor{
  from{border-right-color: rgba(255,255,255,.75);}
  to{border-right-color: transparent;}
}

.backbtn {
   position: relative;
    bottom: 0; 
    left:0;
    margin-top: 1.2em;
    font-size: 300%;
    text-align: left;
    color: white;
    font-family: "ms gothic";
    -webkit-transition: all .3s ease-in-out;
}

.backbtn a {
  -moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
color: #98a2a6;
text-shadow: -1px 0 #6b7073, 0 1px #6b7073, 1px 0 #6b7073, 0 -1px #6b7073, 0 0;
}


.backbtn a:hover {
    webkit-filter: blur(1px); /* Chrome, Safari, Opera */
filter: blur(1px);
font-style: italic;
color: #fff;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}

/* vhs*/


.buzz_wrapper{
  position:relative;
  width:300px;
  margin-top:-60px;
  overflow:hidden;
  padding:100px;
}
.scanline{
  width:100%;
  display:block;
  height:4px;
  position:relative;
  z-index:3;
  margin-bottom:5px;
  opacity:0.1;
}
.buzz_wrapper span{
    text-align:center;
  color:white;
  font-family: "Sedgwick Ave Display";
  font-size: 60px;
  -webkit-text-stroke: 1px black;
  margin-top:27px;
  padding-top:5px;
  position:absolute;
  -webkit-filter: blur(1px);
}
.buzz_wrapper span:nth-child(1){
  color:white;
  margin-left:-2px;
  -webkit-filter: blur(2px);
}
.buzz_wrapper span:nth-child(2){
  color:green;
  margin-left:2px;
  -webkit-filter: blur(2px);
}
.buzz_wrapper span:nth-child(3){
  color:blue;
  position:20px 0;
  -webkit-filter: blur(1px);
}
.buzz_wrapper span:nth-child(4){
  color:#fff;
  -webkit-filter: blur(1px);
  text-shadow:0 0 50px rgba(255,255,255,0.4);
}
.buzz_wrapper span:nth-child(5){
  color:rgba(255,255,255,0.4);
  -webkit-filter: blur(15px);
}

.buzz_wrapper span{
  -webkit-animation: blur 30ms infinite, jerk 50ms infinite;
}

@-webkit-keyframes blur {
  0%   { -webkit-filter: blur(1px); opacity:0.8;}
  50% { -webkit-filter: blur(1px); opacity:1; }
  100%{ -webkit-filter: blur(1px); opacity:0.8; }
}
@-webkit-keyframes jerk {
  50% { left:1px; }
  51% { left:0; }
}
@-webkit-keyframes jerkup {
  50% { top:1px; }
  51% { top:0; }
}

.buzz_wrapper span:nth-child(3){
  -webkit-animation: jerkblue 1s infinite;
}
@-webkit-keyframes jerkblue {
  0% { left:0; }
  30% { left:0; }
  31% { left:10px; }
  32% { left:0; }
  98% { left:0; }
  100% { left:10px; }
}
.buzz_wrapper span:nth-child(2){
  -webkit-animation: jerkgreen 1s infinite;
}
@-webkit-keyframes jerkgreen {
  0% { left:0; }
  30% { left:0; }
  31% { left:-10px; }
  32% { left:0; }
  98% { left:0; }
  100% { left:-10px; }
}

.buzz_wrapper .text{
  -webkit-animation: jerkwhole 5s infinite;
  position:relative;
}
@-webkit-keyframes jerkwhole {
  30% {  }
  40% { opacity:1; top:0; left:0;  -webkit-transform:scale(1,1);  -webkit-transform:skew(0,0);}
  41% { opacity:0.8; top:0px; left:-100px; -webkit-transform:scale(1,1.2);  -webkit-transform:skew(50deg,0);}
  42% { opacity:0.8; top:0px; left:100px; -webkit-transform:scale(1,1.2);  -webkit-transform:skew(-80deg,0);}
  43% { opacity:1; top:0; left:0; -webkit-transform:scale(1,1);  -webkit-transform:skew(0,0);}
  65% { }
}


 
/*MEDIA*/
/* Ripple Out */
@-webkit-keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
@keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
.hvr-ripple-out {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
}
.hvr-ripple-out:before {
  content: '';
  position: absolute;
  border: #fff solid 3px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
.hvr-ripple-out:hover:before, .hvr-ripple-out:focus:before, .hvr-ripple-out:active:before {
  -webkit-animation-name: hvr-ripple-out;
  animation-name: hvr-ripple-out;
}

[class^="hvr-"] {
  margin: 0.1em;
  padding: 0.3em;
  cursor: help;
  background: #fff;
  text-decoration: none;
  color: #000;
  /* Prevent highlight colour when element is tapped */
  -webkit-tap-highlight-color: rgba(0,0,0,0);

  /* Smooth fonts */
  -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

#ok  li {
         line-height: 1.5;
             padding-left: 5px;
}

#ok  li::marker {
    content: url(/images/computer.gif);
}


.box{
  margin:25px;
  border: solid black;
  border-color: black;
}

.box1{
  border-width: 1px 2px 1px 3px;
  border-radius:95% 4% 92% 5%/4% 95% 6% 95%;
  transform: rotate(2deg);
}

.oddboxinner{
  margin:5px;
  transform: rotate(-2deg);
}


.swaggot {
  background-image:url("/images/backgrounds/notebook.png");
        border-bottom:#1B67B3 outset 4px;
        border-right:#1B67B3 outset 4px;
        box-shadow: 2px 2px 8px #000000;
        background-color:#fff;
        outline:1px solid black;
        width: 500px;
        height: 500px;
        margin-left: 505px;
        text-align:"center";
        position: absolute;

}

  #footer	{
    border-top:1px #16325c solid;
	  background-color:#1e54a6;
	  position:fixed;
	  color:white;
	  padding:5px;
	  height:20px;
	  width:100%;
	  left:0px;
	  bottom:0px;
	}
	
	.swaggot222 {
	    background-image:url("/images/backgrounds/girl.png");
        border-right:#1B67B3 outset 4px;
        box-shadow: 2px 2px 8px #000000;
        background-color:#fff;
        outline:1px solid black;
        width: 500px;
        height: 100%;
        margin-left: 505px;
        margin-top: 300px;
        text-align:"center";
        position: absolute;
	}
	
	
	.goback {
	  text-align: right;
	  background-color: white;
	  border-left: 2px inset gray;
	  border-top: 2px inset gray;
	  margin-top: 591px;
	  float: right;
	}
	
	
	/*ART*/
	
	.menu {
    position: fixed;
    width: 10%;
    height: 100%;
    margin-top: 30px;
    margin-left: 15px;
}


.tabNavigation {
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 10px;
}


.tabs {
   background-image: url("images/table2.png");
   background-repeat: repeat-y;
   position: absolute;
   width: 755px;
   height: 100%;
   left: 700px;
   overflow-y: scroll;
   padding: 0;
   margin: 0;
   overflow-x: hidden;
}

.containerc {
  position: absolute;
  left: 5%;
  height: 100%;
  padding: 0;
  margin: 0;
  text-align: center;
}

.containerimg {
  position: absolute;
   padding: 0;
  margin: 0;
}

.image-source-link {
	color: #98C3D1;
}

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
	opacity: 0;
	-webkit-backface-visibility: hidden;
	/* ideally, transition speed should match zoom duration */
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
		opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
		opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
	opacity: 0;
}


/* All stuff below here is for viewing your site on different devices */


@media screen and (max-width: 1680px) {
    body { zoom: 90%; }
}


@media screen and (max-width: 1600px) {
    body { zoom: 85%; }
}



@media screen and (max-width: 1536px) {
    body { zoom: 80%; }
}

@media screen and (max-width: 1440px) {
    body { zoom: 75%; }
}

@media screen and (max-width: 1366px) {
    body { zoom: 70%; }
}

@media screen and (max-width: 1280px) {
    body { zoom: 65%; }
}

@media screen and (max-width: 1024px) {
    body { zoom: 60%; }
}

@media screen and (max-width: 992px) {
    body { zoom: 55%; }
}

@media screen and (max-width: 800px) {
    body { zoom: 50%; }
}

@media screen and (max-width: 600px) {
    body { zoom: 45%; }
}