CSS 3.0 Display

[mreidiv]

My CSS not the best but it works

.statusBar {
text-align: center;

margin: 0 auto;
padding: 2px;
width: 95%;

border: 3px solid red;
}

.tiles {
text-align: center;
width: 100%;
margin-top: 2%;
height: 90%;
}

.tiles_wrapper {
margin: 0 auto;
overflow-y: auto;
height: 100%;
text-align: center;
}

.tile {
text-align: left;
margin: 1%;

vertical-align: top;
display: inline-block;

width: 22%;
min-width: 250px;
height: 250px;
height: 30%;
overflow: hidden;

border: 3px solid blue;
}

.tile_title {
text-align: center;
text-decoration: underline;
padding-bottom: 5px;
cursor: pointer;
background: green; /*#FC0101*/

}

.tile_expanded {
margin: auto;
text-align: left;
color: white;
background: green;

position: absolute;
right: -50%;
left: -50%;
border: 3px solid green;
width: 93.25%;
height: 85%;
/*padding: 10px;*/

overflow-y: auto;
overflow-x: hidden;
visibility: hidden;
}

.tile_content {
padding: 10px;
}

.tile_content a{
color: yellow;
}

.tile_stretch {
width: 100%;
display: inline-block;
font-size: 0;
line-height: 0;
}

#close {
position: absolute;
top: 0.5em;
right: 0.5em;
text-decoration: none;
color: white;
}

.popup {
visibility: hidden;
position: absolute;
top: 7%;
left: 50%;
min-height: 15em;
width: 50em;
;
border: solid 2px green;
background-color: black;
padding: 1em;
z-index: 99;
}

.entropy {
color: gray;
}

input[type=text], textarea, input[type=password] {
border: 1px;
background-color:black;
color:white;
border-style:dotted;
resize: none;
}


a {
color: yellow;
}

body {
background: black;
color: white;
font-family: monospace;
overflow-x: hidden;
}

::-webkit-scrollbar {
width: 8px;
padding-right: 10px;
visibility: visible;
}

::-webkit-scrollbar-track {
border-radius: 10px;
padding-right: 10px;
visibility: visible;

}

::-webkit-scrollbar-thumb {
border-radius: 10px;
background: green;
padding-right: 10px;
visibility: visible;
}

Edited August 14, 2013 by mreidiv