html {
position: relative;
min-height: 100%;
background-color: #DCDCDC;
}

a:link {
  color: red;
}

/* visited link */
a:visited {
  color: green;
}

/* mouse over link */
a:hover {
  color: hotpink;
}

/* selected link */
a:active {
  color: blue;
}

footer {
position: absolute;
left: 0;
bottom: 0;
height: 100px;
width: 100%;
}

//MOBILE
@media screen and (max-width: 600px) {

  	input {
		max-width: 100%;
		width: 80%;
		height: 35px;
	}
	textarea { 
		resize:horizontal; 
		max-width: 100%; 
		min-width:200px;
		
	}


	.page { 
		max-width: 100%;
		width: 100%;
	}
	.search {
                width: 80%;
        }
}

//TABLET
@media (min-width: 768px) and (max-width: 1024px) {
	input {
        	width: 60%;
	        height: 35px;
  	}
        textarea {
                resize:horizontal;
                max-width:550px;
                min-width:300px;

        }
	.page {
		width: 650px;
	}
        .search {
                width: 80%;
        }
}

//DESKTOP
@media (min-width: 768px) {
        input {
                width: 60%;
                height: 35px;
        }
        textarea {
                resize:horizontal;
                max-width:550px;
                min-width:300px;

        }
        .pagetable {
                width: 100%;
        }
        .search {
                width: 80%;
        }

}

#redlink.hover { 
	color: #FF0000; 
	text-decoration: none; 
	color: #FF0000;
}
.rotate {

  transform: rotate(-90deg);


  /* Legacy vendor prefixes that you probably don't need... */

  /* Safari */
  -webkit-transform: rotate(-90deg);

  /* Firefox */
  -moz-transform: rotate(-90deg);

  /* IE */
  -ms-transform: rotate(-90deg);

  /* Opera */
  -o-transform: rotate(-90deg);

  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}
.sticky
{
     position: sticky;
     position: -webkit-sticky;
top: 0px;
	z-index: 1;
}
.box
{
     padding: 0 20px 20px 20px;
     margin-top: 20px;
}