body
{
background:
linear-gradient(27deg, #151515 5px, transparent 5px) 0 5px,
linear-gradient(207deg, #151515 5px, transparent 5px) 10px 0px,
linear-gradient(27deg, #222 5px, transparent 5px) 0px 10px,
linear-gradient(207deg, #222 5px, transparent 5px) 10px 5px,
linear-gradient(90deg, #1b1b1b 10px, transparent 10px),
linear-gradient(#1d1d1d 25%, #1a1a1a 25%, #1a1a1a 50%, transparent 50%, transparent 75%, #242424 75%, #242424);
background-color: #131313;
background-size: 20px 20px;
font-family:arial;
}
table{border-collapse: collapse;}
table, th, td{border: 1px solid #dedede;margin-left: 40px;}
#divContainer table, th, td{margin-left:-15px;}
td{padding:5px;font-size:13px;}
.top table, .top th, .top td {border: 0px;}
.noborder table, .noborder th, .noborder td {border: 0px;}
font.alert{color: #C00000; font-weight: bold;}
#divContainer {
background: #fff;
max-width: 680px;
margin: 0 auto;
box-shadow: 1px 10px 25px #000;
padding: 15px;
border-radius: 0 0 3px 3px;
-moz-border-radius: 0 0 3px 3px;
-webkit-border-radius: 0 0 3px 3px;
}
#divHeading {
color: #fff;
max-width: 680px;
margin: 0 auto;
padding: 15px;
font-weight: bold;
text-shadow: 1px 1px #1f272b;
border: 1px solid #1c252b;
border-radius: 3px 3px 0 0;
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
background: #232B30;
background: -moz-linear-gradient(top, #3D4850 3%, #313d45 4%, #232B30 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#3D4850), color-stop(4%,#313d45), color-stop(100%,#232B30));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3D4850', endColorstr='#232B30',GradientType=0 );
margin-bottom: -18px;
}
h1, h2 {font-size:25px;font-family: 'Arial', sans-serif;text-transform:uppercase;}
h2, h3 {margin: 0;padding: 7px;margin-top: -1px;}
h3 {color:red; display:inline;}
a, a:visited {
font-size:14px;
color:#f7cf16;
text-decoration:none;
-moz-transition-duration:0.3s;
-webkit-transition-duration:0.3s;
-o-transition-duration:0.3s;
}
a:hover {color:#fff;}
th, .divButton  {
background-color: #222;color:#fff;
font-weight: bold;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
border: 1px solid #1c252b;
background: #232B30;
background: -moz-linear-gradient(top, #3D4850 3%, #313d45 4%, #232B30 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#3D4850), color-stop(4%,#313d45), color-stop(100%,#232B30));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3D4850', endColorstr='#232B30',GradientType=0 );
box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-moz-transition-duration:0.3s;
-webkit-transition-duration:0.3s;
-o-transition-duration:0.3s;
 }
input, select, button {
padding-top: 5px;
padding-bottom: 5px;
display: block;
border: 1px solid #aaa;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
-moz-transition-duration:0.3s;
-webkit-transition-duration:0.3s;
-o-transition-duration:0.3s;
}
.divButton:hover {
color: #fff;
background: #4C5A64;
background: -moz-linear-gradient(top, #4C5A64 3%, #404F5A 4%, #2E3940 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#4C5A64), color-stop(4%,#404F5A), color-stop(100%,#2E3940));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4C5A64', endColorstr='#2E3940',GradientType=0 );
}
.shButton:hover {
border-color: #0F80AE #0F80AE #11698D #0F80AE;
background: linear-gradient(#169BD0, #0D7FAE);
color:#fff;
-moz-transition-duration:0.3s;
-webkit-transition-duration:0.3s;
-o-transition-duration:0.3s;
}
.wizButton, .shButton {
color: #fef4e9;
font-weight:bold;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
background: #f78d1d;
background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
background: -moz-linear-gradient(top, #faa51a, #f47a20);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
-moz-transition-duration:0.3s;-webkit-transition-duration:0.3s;-o-transition-duration:0.3s;
border:1px solid orange;
}
.wizButton:hover, .shButton:hover {
background: #f47c20;
background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
background: -moz-linear-gradient(top, #f88e11, #f06015);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.pageTitle {border-top:1px solid #1c252b; margin-left:-16px; padding:5px;}
.pageTitle input {padding:5px;}
@media (max-width: 768px) {
#divContainer {background: #fff;}
.pwInput input {max-width: 30% !important;}
.shButton, .shButton:hover {border:none;}
#divHeading {margin:0; padding:0; margin:0 auto;}
#divHeading table, #divHeading h1 {padding:5px;}
.pageTitle h2 {padding-left:20px;}
#divContainer {width:100%;	margin:0; padding:0; margin:0 auto;
}
style.css:1
* {font-family: Arial;}
#divContainer table, th, td {
margin-left:0 !important;
width: 100% !important;
}
#divContainer p {padding:5px;}
table, thead, tbody, th, td, tr { 
display: block;
padding:0;
margin:0;
border:none;
}
img{float:left; margin-top:20px; max-width:100%;}
td {border: none; padding:5px;}
input, select {max-width: 100%;}
tr, th {
padding-top:5px;
padding-bottom:5px;
max-width: 100% !important;
margin-top: -5px;
}
td:before { content: attr(data-label); }
}
@media (max-width: 500px) {
h1 {font-size: 22px;}
}
@media (max-width: 370px) {
h1 {font-size: 15px;}
}