psmreborn/style.css

/*
* header.php
*/

.sitename img {
  vertical-align: top;
}

.sitename{
	font-weight: bold;
    float: left;
}

.sitemap{
	float:right;
	height: 40px;
	margin: 0;
	line-height: 100%;
	position: relative;
	font-weight: bold;
}

.sitemap ul {
    margin:0;
    padding:0;
    list-style-type:none;
    top:0;
    right: 10px;
}

.sitemap ul li {
    display:inline;
}


.sitemap ul li a {
    color:#ffffff;
    text-decoration:none;
    padding: 6px 6px;
}
 
.sitemap a:hover{
	color: white;
	background-color: #0099CC;
}

.sitemap a:link, a:visited{
	color: white;
}

.header {
	font-size: 200%;	
	font-weight: bold;
	color: white;	
	height: 40px;
	width: 100%;
	margin: 0px;	
	background-color: #00CCCC;
}


/*
* index.php
*/



#welcome-page{
	padding:20px;
	text-align: center;
}


#contact {
    position: fixed;
    bottom: 0;
    width: 100%;
	text-align:center;
}

#content {
    position: absolute;
    width: 600px;
    left: 50%;
    margin-left: -280px; 

}


/*
* libary.php
*/


#psm-gamelist {
	position: inherit;
	text-align:center;
}

#search-form{
	position:relative;

	left: 50%;
	text-align: center;
	width:620px;
	height:70px;
	background-color: #4289f4;
	padding: 15px;
	border-radius: 5px;	
	margin-top: 10px;
	margin-left: -280px; 
	
	color: white;
	font-weight: bold;
}

#search-form [type=text], select{
	width: 500px;
	padding: 10px;
	display: inline-block;
	border: 1px solid #2b58a0;
	border-radius: 10px;
	margin-right: 10px;
	box-sizing: border-box;
}

#search-form [type=submit]{
	padding: 10px;
	display: inline-block;
	background-color: #46dbfc;
	border: 1px solid #2b58a0;
	border-radius: 10px;
	box-sizing: border-box;
}

#search-form [type=submit]:hover{
	padding: 10px;
	display: inline-block;
	background-color: #2b8ba0;
	border: 1px solid #2b58a0;
	border-radius: 10px;
	box-sizing: border-box;
}

.version-select{

	width:70px;
	height:40px;
	float:right;
}

.psm-game img{
	float: left;
    margin-right:1rem;
}

.psm-game a:link, a:visited{
	color: white;
	font-weight: bold;
	text-decoration: none;
}

.psm-game a:hover{
	color: white;
	font-weight: bold;
	text-decoration: underline;
}


.psm-game{
	padding: 5px;
	width: 400px;
	height: 124px;
	margin: 10px;
	background-color: #0094ff;
	color: white;
	border-radius: 5px;
	text-align: left;
	
	display: inline-block;
	vertical-align: middle;
	
	cursor:pointer;
}

.psm-game:hover{
	padding:5px;
	width: 400px;
	height: 124px;
	margin: 10px;
	background-color: #005796;
	color: white;
	border-radius: 5px;
	
	display: inline-block;
	vertical-align: middle;
	
	cursor:pointer;
}

.psm-meta > #psm-title{
	position: relative;
	font-size: 200%;
	text-align: center;
	color:white;
	font-weight: bold;
}
.psm-meta > #psm-icon{
	float: left;
	border-radius: 10px;
}


.psm-meta > #psm-infos{
	position: relative;
	color: white;
	left: 6%;
}

.psm-meta > #psm-downloads{
	position: relative;
	top: 50px;
	color: white;
	left: 0px;
}


.psm-meta{
	position: absolute;
	background-color: rgba(38, 118, 142,0.5);
	width: 980px;
	height: 480px;
    top: 20%;
    left: 50%;
	margin-left: -490px; 
	margin-top: -25px; 
	border-radius: 5px;	
	padding: 20px;
}





/*
*	devtools.php
*/

.devtoollist{
	position: inherit;
	margin-left: 15%; 
	margin-right: 15%;
	text-align:center;
}

.devtool{

	padding:10px;
	margin: 10px;
	width: 325px;
	border-radius: 1000px;
	background-color: #00ffa9;
	
	display: inline-block;
	vertical-align: middle;
}
.devtool:link, .devtool:visited, .devtool a{
	text-decoration: none !important;
	color: black;
	/*font-size: 150%;*/
	font-size: 25px;
	font-weight: bold;
	height:128px;
	line-height: 120px;
}

.devtool:hover{
	padding:10px;
	margin: 10px;
	width:325px;
	height:128px;
	border-radius: 1000px;
	background-color: #005796;
	cursor: pointer;
	
	display: inline-block;
	vertical-align: middle;
}

.devtool #textContent{
	text-align: center;
}

.bubble{
	float: left;
	border-radius: 100%;		
}

/*
* Common
*/

html,body,header {
	margin: 0;
	padding: 0;
	background-image: url("/img/psm_bg.png");
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	color:white;
}

a.image{
	text-decoration: none;
}

.mid{
	vertical-align: middle;
}

.left{
	float: left;	
}

.black:link, .black:visited, .black{
	color: black;
	font-weight: bold;
	text-decoration: none;
}
.black:hover{
	color: black;
	font-weight: bold;
	text-decoration: underline;
}

.white:link, .white:visited, .white{
	color: white;
	font-weight: bold;
	text-decoration: none;
	cursor: pointer;
}

.white:hover{
	color: white;
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;
}

.nostyle:link, .nostyle:visited, .nostyle:hover, .nostyle, .nostyle a{
	color: white;
	font-weight: bold;
	text-decoration: none !important;
	cursor: pointer;
}

.button-enabled{
	width: 300px;
	height: 50px;
	margin: 10px;
	background-color: #00d0ff;
	text-align: center;
	font-weight: bold;
	line-height: 50px;
	float: left;
	color: white;
	border-radius: 20px;
}

.button-enabled:hover{
	width: 300px;
	height: 50px;
	margin: 10px;
	background-color: #005796;
	text-align: center;
	font-weight: bold;
	line-height: 50px;
	float: left;
	cursor: pointer;
	color: white;
	border-radius: 20px;
}

.button-disabled{
	
	width: 300px;
	height: 50px;
	margin: 10px;
	background-color: #8f9db7;
	text-align: center;
	line-height: 50px;
	float: left;
	font-weight: bold;
	color: #cfd2d3;
	cursor: arrow;
	border-radius: 20px;
}