View file Mememaker 2.0/css/main.css

File size: 16.73Kb
html { margin:0; }
body { margin:0; width:100%; font-family: verdana, sans-serif; font-size:12px; }
a { text-decoration:none; }
input { outline:none; }
#container { width:100%; }
#t_menu_wrap { margin-top:-12px; background-color: #444444; width:100%; }
#t_menu_wrap .t_menu { margin: 0 auto; width:1200px; }
#t_menu_wrap .left ul
{
	margin: 0;
	padding: 0;
}
#t_menu_wrap ul li
{
	list-style-type: none;
	display: inline;
}
#t_menu_wrap li a
{
	display: block;
	float: left;
	padding: 6px 15px 6px 0;
	color: #fff;
	font-size:11px;
	text-decoration: none;
}
#t_menu_wrap li a:hover { text-decoration: underline; }
#t_menu_wrap .right li a
{
	margin-right:-30px;
	float: right;
	padding: 6px 0 6px 15px;
}
#t_menu_wrap .top-right 
{
	color:#fff;float:right;margin-top:5px;
}
#t_menu_wrap .top-right a {
	color:#fff;text-decoration:none;
}
#t_menu_wrap .top-right a:hover {
	text-decoration:underline;
}

#header_wrap 
{
	background-color:#000;
	width:100%;
	height:90px;
	padding:8px 0 10px 0;
}
#header_wrap .header 
{
	margin: 0 auto; 
	width:1200px;
}
#header_wrap .logo 
{
	float:left;
	width:280px;
	height:90px;
	background:url("images/temp_logo.png"/*tpa=http://rage.generatorscripts.com/css/images/temp_logo.png*/) no-repeat scroll;
}
#header_wrap .header-ad 
{
	margin-left:380px;
	width:728px;
	height:90px;
}
#u_menu_wrap { margin:0; margin-top:-12px; background-color: #000; width:100%; }
#u_menu_wrap .u_menu { margin: 0 auto; width:1200px; }
#u_menu_wrap .left ul
{
	margin: 0;
	padding: 0;
}
#u_menu_wrap ul li
{
	list-style-type: none;
	display: inline;
}
#u_menu_wrap li a
{
	display: block;
	float: left;
	padding: 10px 14px 10px 14px;
	margin:0 2px;
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}
#u_menu_wrap .active a
{
	color: #000; background-color: #dddddd; border-top-left-radius:6px; border-top-right-radius: 6px;
}
#u_menu_wrap .active a:hover
{
	color: #000; background-color: #fff; border-top-left-radius:6px; border-top-right-radius: 6px;
}
#u_menu_wrap li a:hover { background-color: #70b13d; border-top-left-radius:6px; border-top-right-radius: 6px; }

#l_menu_wrap { margin:0; margin-top:-12px; background-color: #dddddd; width:100%; }
#l_menu_wrap .u_menu { margin: 0 auto; width:1200px; }
#l_menu_wrap .left ul
{
	margin: 0;
	padding: 0;
}
#l_menu_wrap ul li
{
	list-style-type: none;
	display: inline;
}
#l_menu_wrap li a
{
	display: block;
	float: left;
	padding: 10px 14px 10px 14px;
	margin:0 2px;
	color: #000;
	font-size: 14px;
	text-decoration: none;
}
#l_menu_wrap .active a
{
	color: #000; background-color: #fff; border-top-left-radius:6px; border-top-right-radius: 6px;
}
#l_menu_wrap .active a:hover
{
	background-color: #fff;
}
#l_menu_wrap li a:hover { background-color: #70b13d; border-top-left-radius:6px; border-top-right-radius: 6px; }

#lower { margin: 10px auto; width:1200px; }

#left-menu { float: left; width:180px; min-height:500px; }

#css_vertical_menu{
margin:0 8px 10px 8px;
width:160px; 
padding:1px; 
list-style:none; 
}

#css_vertical_menu a{
display:block;
height:25px;
margin-top:1px;
padding-left:15px;

border-left:10px solid #70b13d;
font-family:arial;
font-size:10px;
text-transform:uppercase;
text-decoration:none;
color:#437E7E;
line-height:25px;
}

#css_vertical_menu a:hover{
background-color:#fff;
border-left:10px solid #000;
color:#666666;
}

#css_vertical_menu a.first{
margin-top:0;
}

#main-area { float: left; margin-left: 0; padding: 0 10px; width: 820px; min-height: 500px; }

#right-menu { float: right; width:180px; min-height:500px; }

#menu-module { width:100%;margin-bottom:10px; }

#menu-module .module-top { width:100%;min-height:24px;background-color:#2d2d2d;border-top-left-radius:6px;border-top-right-radius:6px;text-align:center; }

#menu-module .module-top a { color:#fff;text-decoration:none; }

#menu-module .module-top a:hover { text-decoration:underline; }

#menu-module .module-body { width:100%;min-height:60px;padding-top:10px;background-color:#d3d3d3;border-bottom-left-radius:6px;border-bottom-right-radius:6px }

#menu-module h1 { color:#fff;padding:5px 0;font-size:14px;font-weight:none;margin:0; }

#footer_wrapper { width:100%;background-color:#000; }

#footer_wrapper .footer { color: #fff; margin: 0 auto; padding: 5px 0; width:1200px; }

#side-ad { width:160px;height:600px;background-color:#000; margin:0 10px 10px 10px; }

#char-list-item { width:780px;height:120px;margin:0 20px 10px 20px; } 
#char-list-item .vote { float:left;margin-top:30px;width:60px; } 
#char-list-item img { float:left;width:120px;height:120px;border:0; } 
#char-list-data { float:left;margin-left:20px;width:420px;height:120px; } 
#char-list-data .title { margin-top:10px;font-size:24px;font-weight:bold;width:400px;height:30px;overflow:hidden; }
#char-list-data .rank { color:#70b13d; }
#char-list-data .title a { color:#000;text-decoration:none; }
#char-list-data .title a:hover { text-decoration:underline; }
#char-list-data .bio { max-height:80px;width:390px;overflow:hidden; }

#char-list-item .char-list-stats { float:left;padding-top:5px;width:160px; } 
#char-list-stat-line { width:100%;height:30px; } 
#char-list-stat-line .label { float:left;width:80px;font-weight:bold; }
#char-list-stat-line .stats { float:left;width:80px;text-align:right; }

#char-page-data { float:left;margin-left:20px;width:600px;height:120px; } 
#char-page-data .title { margin-top:10px;font-size:24px;font-weight:bold; }
#char-page-data .rank { color:#70b13d; }
#char-page-data .title a { color:#000;text-decoration:none; }
#char-page-data .title a:hover { text-decoration:underline; }
#char-page-data .bio { max-height:80px;overflow:hidden; }

#center-ad-group { width:100%; }
#center-ad-group .center-ad-l { float:left;margin:0 30px 10px 70px;width:300px;height:250px;background-color:#000; }
#center-ad-group .center-ad-r { float:right;margin:0 70px 10px 30px;width:300px;height:250px;background-color:#000; }
#center-ad-group .center-ad-banner { float:left;margin:0 46px 10px 46px;width:728px;height:90px;background-color:#000; }

#small-generate { padding:0 10px 10px 10px; }
#small-generate .char-name { padding:4px 0;background-color:#70b13d;border-top-right-radius:6px;border-top-left-radius:6px;font-weight:bold;color:#000;width:160px;text-align:center;white-space:nowrap;overflow:hidden; }
#small-generate .char-name a { color:#000;text-decoration:none; }
#small-generate .char-name a:hover { text-decoration:underline; }
#small-generate img { display: block;width:160px;height:160px; }
#small-generate .top-text { margin:0;width:160px;height:28px;border:0;border-top:1px solid #d3d3d3;border-bottom:1px solid #d3d3d3;text-transform: uppercase;text-align:center; }
#small-generate .bottom-text { margin:0;width:160px;height:28px;border:0;border-bottom-left-radius:6px;text-transform: uppercase;text-align:center; }
#small-generate .generate { float:right;cursor:pointer;background-color:#70b13d;padding:4px 10px 5px 10px;font-size:10px;border:0;border-bottom-left-radius:6px;border-bottom-right-radius:6px;text-align:center; }


#more-chars { padding:0 10px 10px 10px; }
#more-chars .char-name { padding:4px;background-color:#70b13d;border-top-right-radius:6px;border-top-left-radius:6px;font-weight:bold;color:#000;height:14px;width:152px;text-align:center;overflow:hidden; }
#more-chars .char-name a { color:#000;text-decoration:none; }
#more-chars .char-name a:hover { text-decoration:underline; }
#more-chars img { display: block;width:160px;height:160px;border:0;border-bottom-right-radius:6px;border-bottom-left-radius:6px; }
#even-more-chars { padding-bottom:10px;width:100%;text-align:center; }
#even-more-chars a { color:#70b13d;font-size:14px;font-weight:bold;text-decoration:none; }
#even-more-chars a:hover { text-decoration:underline; }

#grid-image { float:left;margin:0 0 10px 18px;width:250px;height:300px; }
#grid-image .char-name { padding:4px 0;background-color:#70b13d;border-top-right-radius:6px;border-top-left-radius:6px;font-weight:bold;color:#000;width:250px;text-align:center;white-space:nowrap;overflow:hidden; }
#grid-image .char-name a { text-decoration:none; }
#grid-image .char-name a:hover { text-decoration:underline; }
#grid-image img { display: block;width:250px;height:250px;border:0;border-bottom-left-radius:6px; }
#grid-vote { float:left;width:160px;height:24px; }
#grid-image .generate { float:right;background-color:#70b13d;padding:4px 10px 5px 10px;font-size:10px;border-bottom-left-radius:6px;border-bottom-right-radius:6px;text-align:center; }
#grid-image a { color:#000; }


#vote{}
#vote div{float:left;margin:6px 0 0 6px;}
#vote .smh div{background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:0 -12px;height:12px;width:28px}
#vote .lmao div{margin-left:2px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:-28px -12px;height:12px;width:35px}

#vote .smh-active div{background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:0 -24px;height:12px;width:28px}
#vote .lmao-active div{margin-left:2px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:-28px -0px;height:12px;width:35px}

#vote .smh div:hover{background-position:0 -24px;height:12px;width:28px}
#vote .lmao div:hover{background-position:-28px -0px;height:12px;width:35px}
#vote .smh div:active{background-position:0 -24px;height:12px;width:28px}
#vote .lmao div:active{background-position:-28px -0px;height:12px;width:35px}
#vote .score { background-color:#fff;border-radius:4px;margin:5px 5px 0 5px;width:37px;text-align:center; }

#social-login{}
#social-login div{background:url("images/login-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/login-sprite.png*/) no-repeat scroll;margin:6px 0 0 6px;}
#social-login .facebook div{background-position:0 0;height:16px;width:16px}
#social-login .twitter div{margin-left:2px;background-position:-16px 0;height:16px;width:16px}
#social-login .google div{margin-left:2px;background-position:-32px 0;height:16px;width:16px}


#vote-list{}
#vote-list div{margin:0 0 0 2px;}
#vote-list .smh div{margin:8px 0 4px 7px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:0 -12px;height:12px;width:28px}
#vote-list .lmao div{margin:4px 0 8px 4px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:-28px -12px;height:12px;width:35px}

#vote-list .smh-active div{margin:8px 0 4px 7px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:0 -24px;height:12px;width:28px}
#vote-list .lmao-active div{margin:4px 0 8px 4px;background:url("images/vote-sprite.png"/*tpa=http://rage.generatorscripts.com/css/images/vote-sprite.png*/) no-repeat scroll;background-position:-28px 0;height:12px;width:35px}

#vote-list .smh div:hover{background-position:0 -24px;height:12px;width:28px}
#vote-list .lmao div:hover{background-position:-28px 0;height:12px;width:35px}

#vote-list .smh div:active{background-position:0 -24px;height:12px;width:28px}
#vote-list .lmao div:active{background-position:-28px -0px;height:12px;width:35px}
#vote-list .score { background-color:#fff;border-radius:4px;width:37px;text-align:center; }


#module-header-right { font-size:10px;margin-top:7px;margin-right:4px;float:right; }

#module-header-right span { background-color:#70B13D;padding:4px;border-radius:6px; }

button.cupid-green {
  background-color: #7fbf4d;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7fbf4d), color-stop(100%, #63a62f));
  background-image: -webkit-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -moz-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -ms-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: -o-linear-gradient(top, #7fbf4d, #63a62f);
  background-image: linear-gradient(top, #7fbf4d, #63a62f);
  border: 1px solid #63a62f;
  border-bottom: 1px solid #5b992b;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 0 0 #96ca6d;
  -moz-box-shadow: inset 0 1px 0 0 #96ca6d;
  box-shadow: inset 0 1px 0 0 #96ca6d;
  color: #fff;
  font: bold 14px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  line-height: 1;
  padding: 5px 0 6px 0;
  text-align: center;
  text-shadow: 0 -1px 0 #4c9021;
  width: 180px;
  margin-top:0;
  margin-bottom:8px;}
  button.cupid-green:hover {
    background-color: #76b347;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #76b347), color-stop(100%, #5e9e2e));
    background-image: -webkit-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -moz-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -ms-linear-gradient(top, #76b347, #5e9e2e);
    background-image: -o-linear-gradient(top, #76b347, #5e9e2e);
    background-image: linear-gradient(top, #76b347, #5e9e2e);
    -webkit-box-shadow: inset 0 1px 0 0 #8dbf67;
    -moz-box-shadow: inset 0 1px 0 0 #8dbf67;
    box-shadow: inset 0 1px 0 0 #8dbf67;
    cursor: pointer; }
  button.cupid-green:active {
    border: 1px solid #5b992b;
    border-bottom: 1px solid #538c27;
    -webkit-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
    -moz-box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 8px 4px #548c29, 0 1px 0 0 #eeeeee; }

button.cupid-blue {
  background-color: #2c92d2;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #56b1eb), color-stop(100%, #2c92d2));
  background-image: -webkit-linear-gradient(top, #56b1eb, #2c92d2);
  background-image: -moz-linear-gradient(top, #56b1eb, #2c92d2);
  background-image: -ms-linear-gradient(top, #56b1eb, #2c92d2);
  background-image: -o-linear-gradient(top, #56b1eb, #2c92d2);
  background-image: linear-gradient(top, #56b1eb, #2c92d2);
  border: 1px solid #2c92d2;
  border-bottom: 1px solid #1387d1;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 0 0 #6da8ca;
  -moz-box-shadow: inset 0 1px 0 0 #6da8ca;
  box-shadow: inset 0 1px 0 0 #6da8ca;
  color: #fff;
  font: bold 14px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
  line-height: 1;
  padding: 5px 0 6px 0;
  text-align: center;
  text-shadow: 0 -1px 0 #216090;
  width: 180px;
  margin-top:0;
  margin-bottom:8px;}
  button.cupid-blue:hover {
    background-color: #4aacea;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #4aacea), color-stop(100%, #218cd1));
    background-image: -webkit-linear-gradient(top, #4aacea, #218cd1);
    background-image: -moz-linear-gradient(top, #4aacea, #218cd1);
    background-image: -ms-linear-gradient(top, #4aacea, #218cd1);
    background-image: -o-linear-gradient(top, #4aacea, #218cd1);
    background-image: linear-gradient(top, #4aacea, #218cd1);
    -webkit-box-shadow: inset 0 1px 0 0 #6792bf;
    -moz-box-shadow: inset 0 1px 0 0 #6792bf;
    box-shadow: inset 0 1px 0 0 #6792bf;
    cursor: pointer; }
  button.cupid-blue:active {
    border: 1px solid #1387d1;
    border-bottom: 1px solid #1387d1;
    -webkit-box-shadow: inset 0 0 8px 4px #1387d1, 0 1px 0 0 #eeeeee;
    -moz-box-shadow: inset 0 0 8px 4px #1387d1, 0 1px 0 0 #eeeeee;
    box-shadow: inset 0 0 8px 4px #1387d1, 0 1px 0 0 #eeeeee; }

.paginate {
	padding: 3px;
	margin: 3px;
	margin-top:10px;
	text-align:center;
}

.paginate a {
	padding:4px 10px 5px 10px;
	margin:2px;
	background-color:#70b13d;
	border-radius:6px;
	text-decoration:none;
	color: #000;
	font-weight:bold;
}
.paginate a:hover, .paginate a:active {
	text-decoration:underline;
}
.paginate span.current {
    margin: 2px;
	padding:4px 10px 5px 10px;
	background-color:#70b13d;
	border-radius:6px;
	font-weight: bold;
	color: #FFF;
}
.paginate span.disabled {
	padding:4px 10px 5px 10px;
	margin:2px;
	background-color:#2d2d2d;
	border-radius:6px;
	color:#DDD;
}

#meme-page-data { float:left;margin:0 20px;width:780px;text-align:center; } 
#meme-page-data .title { margin-top:10px;font-size:24px;font-weight:bold; }
#meme-page-data .rank { color:#70b13d; }
#meme-page-data .title a { color:#000;text-decoration:none; }
#meme-page-data .title a:hover { text-decoration:underline; }