Perhin Graphics - Hogwarts Houses Layouts!

Perhin Graphics

Hogwarts Houses Layouts!

25th-Sep-2008 06:28 pm

Title: Hogwarts Houses
Layout Style: S2, Smooth Sailing
Best view: 1024x768
Browser(s) Compatible: Firefox, IE
Work with Nav bar?: Not sure
Work with Ads? No.
Credit:

perhin and

potterpuffs for the art.
Note: The art is by

potterpuffs! Please credit her!
Preview:

You can also see the Hufflepuff layout at my journal for now. :)

Instructions:

1. Go to Customize Journal and select any Smooth Sailing layout.
2. At the bottom of the page, select sidebar left.
3. Go to Customize Journal Style and then go to CSS.
4. Select 'No' for all the drop down boxes and paste the codes in the box.
5. Paste the links to your image links where you are prompted in the code.
6.Credit

perhin_graphics for the layout and

potterpuffs for the art.

Codes:

Hufflepuff:

body {
font-family: verdana;
font-size: 9.5px;
text-align: justify;
color: black;
background-color: black;
margin-top: 10px;
}

a:link, a:visited, a:active {
font-weight: bold;
text-decoration: none;
color: black;
}

a:hover {
cursor: crosshair;
font-weight: bold;
text-decoration: none;
color: #FCD116;
}

img {
border: 0px solid #FFFFFF;
}

.pageblock {
padding: 2px;
position: relative;
width:795px;
left: 50%;
margin-left: -400px;
background-color: #FCD116;
background-image: url(HUFFLEPUFF BACKGROUND);
background-repeat: no-repeat;
background-position: top center;
}

.pageheaderblock {
background: transparent;
padding-top:260px
}

.header-title {
opacity: 0;
filter: alpha(opacity=0);
}
}

.header-subtitle {
display: none;
}

.header-menu {
position: relative;
width: auto;
text-align: right;
}

.header-menu li {
display: inline;
padding: 10px;
text-transform: uppercase;
position: relative;
left: -25px;
top: -15px;
}

.header-menu a:link, .header-menu a:visited, .header-menu a:active {
color: #FCD116;
}

.header-menu a:hover {
color: black;
cursor: crosshair;
}

.bodyheaderblock {
background-color: black;
color:#FCD116;
}

.body-title {
text-transform: uppercase;
background-color: black;
color: #FCD116;
line-height: 20px;
font-weight: bold;
font-size: 11px;
letter-spacing: 5px;
text-align: center;
margin-bottom: 10px;
}

.sidebox {
width: 230px;
background-color: black;
padding: 2px;
margin-right: 10px;
margin-bottom: 10px;
border: 1px dotted #FCD116;
padding-bottom: 5px;
color:#FCD116;
}

.sideboxContent {
padding-left: 5px;
}

.sidebox a:link, .sidebox a:active, .sidebox a:visited {
font-weight: normal;
color: #FCD116;
}

.sidebox a:hover {
color: black;
cursor: crosshair;
}

.sideboxTitle {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #FCD116;
line-height: 24px;
margin-top: -3px;
margin-bottom: 5px;
border-bottom: 1px dotted #FCD116;
}

.profile-userpic {
border: 1px solid #e4e4e4;
padding: 2px;
position: relative;
left: 50%;
margin-left: -50px;
}

.profile-label {
font-weight: bold;
text-transform: lowercase;
}

label {
font-weight: bold;
text-transform: lowercase;
}

#latestmonth a:link, #latestmonth a:active, #latestmonth a:visited {
text-transform: lowercase;
font-weight: bold;
color: background-color: black;
color:#FCD116;
border:#FCD116;;
}

#latestmonth a:hover {
color: black;
}

#latestmonth table {
position: relative;
left: 50%;
margin-left: -120px;
}

#latestmonth td {
padding: 4px;
}

.latestmonth-inactive {
background-color: black;
color:#FCD116;
border:#FCD116;
text-align: center;
padding: 3px;
  border-top: 1px dotted #FCD116;
    border-right: 1px dotted #FCD116;
    border-bottom: 1px dotted #FCD116;
    border-left: 1px dotted #FCD116;
}

.latestmonth-active {
background-color: black;
color:#FCD116;
border:#FCD116;
text-align: center;
color:black;
padding: 3px;
  border-top: 1px dotted #FCD116;
    border-right: 1px dotted #FCD116;
    border-bottom: 1px dotted #FCD116;
    border-left: 1px dotted #FCD116;
}

input {
background-color: #FCD116;
width: 100px;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: black;
margin-bottom: 2px;
margin-top: 2px;
}

#SearchTerm {
position: relative;
left: 0;
width: 150px;
margin-left: 0;
}

#SearchType {
width: 100px;
background-color: #FCD116;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: black;
margin-bottom: 2px;
margin-top: 2px;
}

#tags_sidebox a {
display: block;
margin-bottom: -10px;
}

#tags_sidebox {
color: #FCD116;
padding-bottom: 10px;
}

.entryHeader {
border-top: 1px dotted black;
border-bottom: 1px dotted black;
padding: 5px;
}

.entryHeaderDate {
color: black;
text-transform: lowercase;
}

.entryHeaderSubject img {
margin-bottom: -2px;
}

.entryHeaderSubject {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: black;
}

.entryUserinfo {
margin: 7px;
}

.entryUserinfo-usericon {
border: 1px solid black;
padding: 2px;
}

.entryUserinfo-username {
margin-top: 5px;
text-align: center;
}

.entryText {
margin: 10px;
margin-left: 0px;
}

.entryMetadata {
text-transform: lowercase;
color: black;
}

.entryMetadata li {
list-style: none;
}

.entryMetadata-label {
font-weight: bold;
}

.entryMetadata-content {

font-weight: normal;
}

.entryMetadata-content a:link, .entryMetadata-content a:active, .entryMetadata-content a:visited {
color: black;
font-weight: normal;
}

.entryMetadata-content a:hover {
color: #FCD116;
}

.entryLinkbar {
text-transform: lowercase;
text-align: right;
background-color: black;
margin-bottom: 30px;
margin-top: 20px;
padding: 4px 0px 4px 0px;
z-index: 2;
}

.entryLinkbar li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
z-index: 100;
}

.entryLinkbar ul {
margin: 0px;
padding: 0px;
}

.entryLinkbar a:link, .entryLinkbar a:active, .entryLinkbar a:visited {
color: #FCD116;
}

.entrylinkbar a:hover {
color: black;
}

#footer-menu {
text-transform: lowercase;
text-align: right;
}

#footer-menu ul {
padding: 0px;
margin: 0px;
}

#footer-menu li {
display: inline;
padding: 3px;
}

#footer-menu a {
color: #7d7d7d;
white-space: nowrap;
}

.pagefooterblock {
text-transform: lowercase;
text-align: right;
}

table.month {
margin: 40px;
width: 475px;
}

table.month td {
padding: 5px;
border: 1px dotted black;
}

blockquote {
    border-top: 1px dotted black;
    border-right: 1px dotted black;
    border-bottom: 1px dotted black;
    border-left: 1px dotted black;
    color: black;
    padding: 2px;
}

::-moz-selection {
    background-color:  black;
    color: #FCD116;
}

.commentHolder {
font-family: Tahoma, Verdana;
font-size: 9pt;
color: black;
width:90%;
margin: 4px 0px 4px 0px;
padding: 10px;
background-color:#FCD116;
border: 0;
align:left;
}

.commentUserinfo {
font-size: 8pt;
text-align: center; 
background-color: black;
color: #FCD116; 
margin: 0px 8px 8px 0px;
}

.commentUserinfo a{
color:#FCD116; 
}

.commentUserinfo-usericon img { 
border: 1px dotted #FCD116;
padding: 2px;
margin-top: 6px;
}

.commentText {
font-family: Tahoma, Verdana;
font-size: 8pt;
padding: 6px;
width: 100%;
}

.commentHeader {
background-color: black;
color: #FCD116;
font-size: 10px;
padding: 4px 0px 4px 8px;
}

.commentHeader a{
color:black;
}

.commentHeader a:hover{
text-decoration: underline;
}

.commentHeaderScreened a{
color: #FCD116;
}
.commentHeaderScreened {
font-size: 12px;
background-color: #FCD116;
color: black;
padding: 4px 4px 4px 8px;
}

.commentHeaderSubject {
font-weight: bold;
padding: 4px 0px 4px 8px;
}

.commentLinkbar {
font-size: 9px;
color: black;
text-align: left;
padding-top: 4px;
padding-bottom: 4px;
background-color: black;
}

.commentLinkbar ul {
margin: 0px;
padding: 0px;
text-align:left;
}

.commentLinkbar li {
margin: 0px;
display:inline-block;
padding:0 3px;
}

.commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited { 
color: #FCD116; 
text-decoration: none;
}

.commentLinkbar a:hover, .commentLinkbar a:active { 
color: black; 
text-decoration: none; 
}

.replyform {
background-color:#FCD116;
color:black;
padding-left: 0px;
float: left;
}

.replyform textarea {
background-color:black;
color: #FCD116; 
width:90%;
}

select, textarea.textbox#body{
background-color:black;
color:#FCD116;
width:90%;
}

Slytherin:

body {
font-family: verdana;
font-size: 9.5px;
text-align: justify;
color: #397D02;
background-color: #397D02;
margin-top: 10px;
}

a:link, a:visited, a:active {
font-weight: bold;
text-decoration: none;
color: #397D02;
}

a:hover {
cursor: crosshair;
font-weight: bold;
text-decoration: none;
color: #C4C4C4;
}

img {
border: 0px solid #FFFFFF;
}

.pageblock {
padding: 2px;
position: relative;
width:795px;
left: 50%;
margin-left: -400px;
background-color: #C4C4C4;
background-image: url(SLYTHERIN BACKGROUND);
background-repeat: no-repeat;
background-position: top center;
}

.pageheaderblock {
background: transparent;
padding-top:260px
}

.header-title {
opacity: 0;
filter: alpha(opacity=0);
}
}

.header-subtitle {
display: none;
}

.header-menu {
position: relative;
width: auto;
text-align: right;
}

.header-menu li {
display: inline;
padding: 10px;
text-transform: uppercase;
position: relative;
left: -25px;
top: -15px;
}

.header-menu a:link, .header-menu a:visited, .header-menu a:active {
color: #C4C4C4;
}

.header-menu a:hover {
color: #397D02;
cursor: crosshair;
}

.bodyheaderblock {
background-color: #397D02;
color:#C4C4C4;
}

.body-title {
text-transform: uppercase;
background-color: #397D02;
color: #C4C4C4;
line-height: 20px;
font-weight: bold;
font-size: 11px;
letter-spacing: 5px;
text-align: center;
margin-bottom: 10px;
}

.sidebox {
width: 230px;
background-color: #397D02;
padding: 2px;
margin-right: 10px;
margin-bottom: 10px;
border: 1px dotted #C4C4C4;
padding-bottom: 5px;
color:#C4C4C4;
}

.sideboxContent {
padding-left: 5px;
}

.sidebox a:link, .sidebox a:active, .sidebox a:visited {
font-weight: normal;
color: #C4C4C4;
}

.sidebox a:hover {
color: #397D02;
cursor: crosshair;
}

.sideboxTitle {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #C4C4C4;
line-height: 24px;
margin-top: -3px;
margin-bottom: 5px;
border-bottom: 1px dotted #C4C4C4;
}

.profile-userpic {
border: 1px solid #e4e4e4;
padding: 2px;
position: relative;
left: 50%;
margin-left: -50px;
}

.profile-label {
font-weight: bold;
text-transform: lowercase;
}

label {
font-weight: bold;
text-transform: lowercase;
}

#latestmonth a:link, #latestmonth a:active, #latestmonth a:visited {
text-transform: lowercase;
font-weight: bold;
color: background-color: #397D02;
color:#C4C4C4;
border:#C4C4C4;;
}

#latestmonth a:hover {
color: #397D02;
}

#latestmonth table {
position: relative;
left: 50%;
margin-left: -120px;
}

#latestmonth td {
padding: 4px;
}

.latestmonth-inactive {
background-color: #397D02;
color:#C4C4C4;
border:#C4C4C4;
text-align: center;
padding: 3px;
  border-top: 1px dotted #C4C4C4;
    border-right: 1px dotted #C4C4C4;
    border-bottom: 1px dotted #C4C4C4;
    border-left: 1px dotted #C4C4C4;
}

.latestmonth-active {
background-color: #397D02;
color:#C4C4C4;
border:#C4C4C4;
text-align: center;
color:#397D02;
padding: 3px;
  border-top: 1px dotted #C4C4C4;
    border-right: 1px dotted #C4C4C4;
    border-bottom: 1px dotted #C4C4C4;
    border-left: 1px dotted #C4C4C4;
}

input {
background-color: #C4C4C4;
width: 100px;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #397D02;
margin-bottom: 2px;
margin-top: 2px;
}

#SearchTerm {
position: relative;
left: 0;
width: 150px;
margin-left: 0;
}

#SearchType {
width: 100px;
background-color: #C4C4C4;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #397D02;
margin-bottom: 2px;
margin-top: 2px;
}

#tags_sidebox a {
display: block;
margin-bottom: -10px;
}

#tags_sidebox {
color: #C4C4C4;
padding-bottom: 10px;
}

.entryHeader {
border-top: 1px dotted #397D02;
border-bottom: 1px dotted #397D02;
padding: 5px;
}

.entryHeaderDate {
color: #397D02;
text-transform: lowercase;
}

.entryHeaderSubject img {
margin-bottom: -2px;
}

.entryHeaderSubject {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #397D02;
}

.entryUserinfo {
margin: 7px;
}

.entryUserinfo-usericon {
border: 1px solid #397D02;
padding: 2px;
}

.entryUserinfo-username {
margin-top: 5px;
text-align: center;
}

.entryText {
margin: 10px;
margin-left: 0px;
}

.entryMetadata {
text-transform: lowercase;
color: #397D02;
}

.entryMetadata li {
list-style: none;
}

.entryMetadata-label {
font-weight: bold;
}

.entryMetadata-content {

font-weight: normal;
}

.entryMetadata-content a:link, .entryMetadata-content a:active, .entryMetadata-content a:visited {
color: #397D02;
font-weight: normal;
}

.entryMetadata-content a:hover {
color: #C4C4C4;
}

.entryLinkbar {
text-transform: lowercase;
text-align: right;
background-color: #397D02;
margin-bottom: 30px;
margin-top: 20px;
padding: 4px 0px 4px 0px;
z-index: 2;
}

.entryLinkbar li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
z-index: 100;
}

.entryLinkbar ul {
margin: 0px;
padding: 0px;
}

.entryLinkbar a:link, .entryLinkbar a:active, .entryLinkbar a:visited {
color: #C4C4C4;
}

.entrylinkbar a:hover {
color: #397D02;
}

#footer-menu {
text-transform: lowercase;
text-align: right;
}

#footer-menu ul {
padding: 0px;
margin: 0px;
}

#footer-menu li {
display: inline;
padding: 3px;
}

#footer-menu a {
color: #7d7d7d;
white-space: nowrap;
}

.pagefooterblock {
text-transform: lowercase;
text-align: right;
}

table.month {
margin: 40px;
width: 475px;
}

table.month td {
padding: 5px;
border: 1px dotted #397D02;
}

blockquote {
    border-top: 1px dotted #397D02;
    border-right: 1px dotted #397D02;
    border-bottom: 1px dotted #397D02;
    border-left: 1px dotted #397D02;
    color: #397D02;
    padding: 2px;
}

::-moz-selection {
    background-color:  #397D02;
    color: #C4C4C4;
}

.commentHolder {
font-family: Tahoma, Verdana;
font-size: 9pt;
color: #397D02;
width:90%;
margin: 4px 0px 4px 0px;
padding: 10px;
background-color:#C4C4C4;
border: 0;
align:left;
}

.commentUserinfo {
font-size: 8pt;
text-align: center; 
background-color: #397D02;
color: #C4C4C4; 
margin: 0px 8px 8px 0px;
}

.commentUserinfo a{
color:#C4C4C4; 
}

.commentUserinfo-usericon img { 
border: 1px dotted #C4C4C4;
padding: 2px;
margin-top: 6px;
}

.commentText {
font-family: Tahoma, Verdana;
font-size: 8pt;
padding: 6px;
width: 100%;
}

.commentHeader {
background-color: #397D02;
color: #C4C4C4;
font-size: 10px;
padding: 4px 0px 4px 8px;
}

.commentHeader a{
color:#397D02;
}

.commentHeader a:hover{
text-decoration: underline;
}

.commentHeaderScreened a{
color: #C4C4C4;
}
.commentHeaderScreened {
font-size: 12px;
background-color: #C4C4C4;
color: #397D02;
padding: 4px 4px 4px 8px;
}

.commentHeaderSubject {
font-weight: bold;
padding: 4px 0px 4px 8px;
}

.commentLinkbar {
font-size: 9px;
color: #397D02;
text-align: left;
padding-top: 4px;
padding-bottom: 4px;
background-color: #397D02;
}

.commentLinkbar ul {
margin: 0px;
padding: 0px;
text-align:left;
}

.commentLinkbar li {
margin: 0px;
display:inline-block;
padding:0 3px;
}

.commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited { 
color: #C4C4C4; 
text-decoration: none;
}

.commentLinkbar a:hover, .commentLinkbar a:active { 
color: #397D02; 
text-decoration: none; 
}

.replyform {
background-color:#C4C4C4;
color:#397D02;
padding-left: 0px;
float: left;
}

.replyform textarea {
background-color:#397D02;
color: #C4C4C4; 
width:90%;
}

select, textarea.textbox#body{
background-color:#397D02;
color:#C4C4C4;
width:90%;
}

Ravenclaw:

body {
font-family: verdana;
font-size: 9.5px;
text-align: justify;
color: #000033	;
background-color: #000033	;
margin-top: 10px;
}

a:link, a:visited, a:active {
font-weight: bold;
text-decoration: none;
color: #000033	;
}

a:hover {
cursor: crosshair;
font-weight: bold;
text-decoration: none;
color: #B87333;
}

img {
border: 0px solid #FFFFFF;
}

.pageblock {
padding: 2px;
position: relative;
width:795px;
left: 50%;
margin-left: -400px;
background-color: #B87333;
background-image: url(RAVENCALW HEADER);
background-repeat: no-repeat;
background-position: top center;
}

.pageheaderblock {
background: transparent;
padding-top:260px
}

.header-title {
opacity: 0;
filter: alpha(opacity=0);
}
}

.header-subtitle {
display: none;
}

.header-menu {
position: relative;
width: auto;
text-align: left;
}

.header-menu li {
display: inline;
padding: 10px;
text-transform: uppercase;
position: relative;
left: -25px;
top: -15px;
}

.header-menu a:link, .header-menu a:visited, .header-menu a:active {
color: #B87333;
}

.header-menu a:hover {
color: #000033	;
cursor: crosshair;
}

.bodyheaderblock {
background-color: #000033	;
color:#B87333;
}

.body-title {
text-transform: uppercase;
background-color: #000033	;
color: #B87333;
line-height: 20px;
font-weight: bold;
font-size: 11px;
letter-spacing: 5px;
text-align: center;
margin-bottom: 10px;
}

.sidebox {
width: 230px;
background-color: #000033	;
padding: 2px;
margin-right: 10px;
margin-bottom: 10px;
border: 1px dotted #B87333;
padding-bottom: 5px;
color:#B87333;
}

.sideboxContent {
padding-left: 5px;
}

.sidebox a:link, .sidebox a:active, .sidebox a:visited {
font-weight: normal;
color: #B87333;
}

.sidebox a:hover {
color: #000033	;
cursor: crosshair;
}

.sideboxTitle {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #B87333;
line-height: 24px;
margin-top: -3px;
margin-bottom: 5px;
border-bottom: 1px dotted #B87333;
}

.profile-userpic {
border: 1px solid #e4e4e4;
padding: 2px;
position: relative;
left: 50%;
margin-left: -50px;
}

.profile-label {
font-weight: bold;
text-transform: lowercase;
}

label {
font-weight: bold;
text-transform: lowercase;
}

#latestmonth a:link, #latestmonth a:active, #latestmonth a:visited {
text-transform: lowercase;
font-weight: bold;
color: background-color: #000033	;
color:#B87333;
border:#B87333;;
}

#latestmonth a:hover {
color: #000033	;
}

#latestmonth table {
position: relative;
left: 50%;
margin-left: -120px;
}

#latestmonth td {
padding: 4px;
}

.latestmonth-inactive {
background-color: #000033	;
color:#B87333;
border:#B87333;
text-align: center;
padding: 3px;
  border-top: 1px dotted #B87333;
    border-right: 1px dotted #B87333;
    border-bottom: 1px dotted #B87333;
    border-left: 1px dotted #B87333;
}

.latestmonth-active {
background-color: #000033	;
color:#B87333;
border:#B87333;
text-align: center;
color:#000033	;
padding: 3px;
  border-top: 1px dotted #B87333;
    border-right: 1px dotted #B87333;
    border-bottom: 1px dotted #B87333;
    border-left: 1px dotted #B87333;
}

input {
background-color: #B87333;
width: 100px;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #000033	;
margin-bottom: 2px;
margin-top: 2px;
}

#SearchTerm {
position: relative;
left: 0;
width: 150px;
margin-left: 0;
}

#SearchType {
width: 100px;
background-color: #B87333;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #000033	;
margin-bottom: 2px;
margin-top: 2px;
}

#tags_sidebox a {
display: block;
margin-bottom: -10px;
}

#tags_sidebox {
color: #B87333;
padding-bottom: 10px;
}

.entryHeader {
border-top: 1px dotted #000033	;
border-bottom: 1px dotted #000033	;
padding: 5px;
}

.entryHeaderDate {
color: #000033	;
text-transform: lowercase;
}

.entryHeaderSubject img {
margin-bottom: -2px;
}

.entryHeaderSubject {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #000033	;
}

.entryUserinfo {
margin: 7px;
}

.entryUserinfo-usericon {
border: 1px solid #000033	;
padding: 2px;
}

.entryUserinfo-username {
margin-top: 5px;
text-align: center;
}

.entryText {
margin: 10px;
margin-left: 0px;
}

.entryMetadata {
text-transform: lowercase;
color: #000033	;
}

.entryMetadata li {
list-style: none;
}

.entryMetadata-label {
font-weight: bold;
}

.entryMetadata-content {

font-weight: normal;
}

.entryMetadata-content a:link, .entryMetadata-content a:active, .entryMetadata-content a:visited {
color: #000033	;
font-weight: normal;
}

.entryMetadata-content a:hover {
color: #B87333;
}

.entryLinkbar {
text-transform: lowercase;
text-align: right;
background-color: #000033	;
margin-bottom: 30px;
margin-top: 20px;
padding: 4px 0px 4px 0px;
z-index: 2;
}

.entryLinkbar li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
z-index: 100;
}

.entryLinkbar ul {
margin: 0px;
padding: 0px;
}

.entryLinkbar a:link, .entryLinkbar a:active, .entryLinkbar a:visited {
color: #B87333;
}

.entrylinkbar a:hover {
color: #000033	;
}

#footer-menu {
text-transform: lowercase;
text-align: right;
}

#footer-menu ul {
padding: 0px;
margin: 0px;
}

#footer-menu li {
display: inline;
padding: 3px;
}

#footer-menu a {
color: #7d7d7d;
white-space: nowrap;
}

.pagefooterblock {
text-transform: lowercase;
text-align: right;
}

table.month {
margin: 40px;
width: 475px;
}

table.month td {
padding: 5px;
border: 1px dotted #000033	;
}

blockquote {
    border-top: 1px dotted #000033	;
    border-right: 1px dotted #000033	;
    border-bottom: 1px dotted #000033	;
    border-left: 1px dotted #000033	;
    color: #000033	;
    padding: 2px;
}

::-moz-selection {
    background-color:  #000033	;
    color: #B87333;
}

.commentHolder {
font-family: Tahoma, Verdana;
font-size: 9pt;
color: #000033	;
width:90%;
margin: 4px 0px 4px 0px;
padding: 10px;
background-color:#B87333;
border: 0;
align:left;
}

.commentUserinfo {
font-size: 8pt;
text-align: center; 
background-color: #000033	;
color: #B87333; 
margin: 0px 8px 8px 0px;
}

.commentUserinfo a{
color:#B87333; 
}

.commentUserinfo-usericon img { 
border: 1px dotted #B87333;
padding: 2px;
margin-top: 6px;
}

.commentText {
font-family: Tahoma, Verdana;
font-size: 8pt;
padding: 6px;
width: 100%;
}

.commentHeader {
background-color: #000033	;
color: #B87333;
font-size: 10px;
padding: 4px 0px 4px 8px;
}

.commentHeader a{
color:#000033	;
}

.commentHeader a:hover{
text-decoration: underline;
}

.commentHeaderScreened a{
color: #B87333;
}
.commentHeaderScreened {
font-size: 12px;
background-color: #B87333;
color: #000033	;
padding: 4px 4px 4px 8px;
}

.commentHeaderSubject {
font-weight: bold;
padding: 4px 0px 4px 8px;
}

.commentLinkbar {
font-size: 9px;
color: #000033	;
text-align: left;
padding-top: 4px;
padding-bottom: 4px;
background-color: #000033	;
}

.commentLinkbar ul {
margin: 0px;
padding: 0px;
text-align:left;
}

.commentLinkbar li {
margin: 0px;
display:inline-block;
padding:0 3px;
}

.commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited { 
color: #B87333; 
text-decoration: none;
}

.commentLinkbar a:hover, .commentLinkbar a:active { 
color: #000033	; 
text-decoration: none; 
}

.replyform {
background-color:#B87333;
color:#000033	;
padding-left: 0px;
float: left;
}

.replyform textarea {
background-color:#000033	;
color: #B87333; 
width:90%;
}

select, textarea.textbox#body{
background-color:#000033	;
color:#B87333;
width:90%;
}

Gryffindor:

body {
font-family: verdana;
font-size: 9.5px;
text-align: justify;
color: #660000	;
background-color: #660000	;
margin-top: 10px;
}

a:link, a:visited, a:active {
font-weight: bold;
text-decoration: none;
color: #660000	;
}

a:hover {
cursor: crosshair;
font-weight: bold;
text-decoration: none;
color: #EEB422;
}

img {
border: 0px solid #FFFFFF;
}

.pageblock {
padding: 2px;
position: relative;
width:795px;
left: 50%;
margin-left: -400px;
background-color: #EEB422;
background-image: url(GRYFFINDOR HEADER);
background-repeat: no-repeat;
background-position: top center;
}

.pageheaderblock {
background: transparent;
padding-top:260px
}

.header-title {
opacity: 0;
filter: alpha(opacity=0);
}
}

.header-subtitle {
display: none;
}

.header-menu {
position: relative;
width: auto;
text-align: left;
}

.header-menu li {
display: inline;
padding: 10px;
text-transform: uppercase;

position: relative;
left: -25px;
top: -15px;
}

.header-menu a:link, .header-menu a:visited, .header-menu a:active {
color: #EEB422;
}

.header-menu a:hover {
color: #660000	;
cursor: crosshair;
}

.bodyheaderblock {
background-color: #660000	;
color:#EEB422;
}

.body-title {
text-transform: uppercase;
background-color: #660000	;
color: #EEB422;
line-height: 20px;
font-weight: bold;
font-size: 11px;
letter-spacing: 5px;
text-align: center;
margin-bottom: 10px;
}

.sidebox {
width: 230px;
background-color: #660000	;
padding: 2px;
margin-right: 10px;
margin-bottom: 10px;
border: 1px dotted #EEB422;
padding-bottom: 5px;
color:#EEB422;
}

.sideboxContent {
padding-left: 5px;
}

.sidebox a:link, .sidebox a:active, .sidebox a:visited {
font-weight: normal;
color: #EEB422;
}

.sidebox a:hover {
color: #660000	;
cursor: crosshair;
}

.sideboxTitle {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #EEB422;
line-height: 24px;
margin-top: -3px;
margin-bottom: 5px;
border-bottom: 1px dotted #EEB422;
}

.profile-userpic {
border: 1px solid #e4e4e4;
padding: 2px;
position: relative;
left: 50%;
margin-left: -50px;
}

.profile-label {
font-weight: bold;
text-transform: lowercase;
}

label {
font-weight: bold;
text-transform: lowercase;
}

#latestmonth a:link, #latestmonth a:active, #latestmonth a:visited {
text-transform: lowercase;
font-weight: bold;
color: background-color: #660000	;
color:#EEB422;
border:#EEB422;;
}

#latestmonth a:hover {
color: #660000	;
}

#latestmonth table {
position: relative;
left: 50%;
margin-left: -120px;
}

#latestmonth td {
padding: 4px;
}

.latestmonth-inactive {
background-color: #660000	;
color:#EEB422;
border:#EEB422;
text-align: center;
padding: 3px;
  border-top: 1px dotted #EEB422;
    border-right: 1px dotted #EEB422;
    border-bottom: 1px dotted #EEB422;
    border-left: 1px dotted #EEB422;
}

.latestmonth-active {
background-color: #660000	;
color:#EEB422;
border:#EEB422;
text-align: center;
color:#660000	;
padding: 3px;
  border-top: 1px dotted #EEB422;
    border-right: 1px dotted #EEB422;
    border-bottom: 1px dotted #EEB422;
    border-left: 1px dotted #EEB422;
}

input {
background-color: #EEB422;
width: 100px;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #660000	;
margin-bottom: 2px;
margin-top: 2px;
}

#SearchTerm {
position: relative;
left: 0;
width: 150px;
margin-left: 0;
}

#SearchType {
width: 100px;
background-color: #EEB422;
line-height: 20px;
font-family: verdana;
font-size: 9.5px;
letter-spacing: 1px;
text-transform: lowercase;
color: #660000	;
margin-bottom: 2px;
margin-top: 2px;
}

#tags_sidebox a {
display: block;
margin-bottom: -10px;
}

#tags_sidebox {
color: #EEB422;
padding-bottom: 10px;
}

.entryHeader {
border-top: 1px dotted #660000	;
border-bottom: 1px dotted #660000	;
padding: 5px;
}

.entryHeaderDate {
color: #660000	;
text-transform: lowercase;
}

.entryHeaderSubject img {
margin-bottom: -2px;
}

.entryHeaderSubject {
font-size: 11px;
font-weight: bold;
letter-spacing: 5px;
text-transform: lowercase;
color: #660000	;
}

.entryUserinfo {
margin: 7px;
}

.entryUserinfo-usericon {
border: 1px solid #660000	;
padding: 2px;
}

.entryUserinfo-username {
margin-top: 5px;
text-align: center;
}

.entryText {
margin: 10px;
margin-left: 0px;
}

.entryMetadata {
text-transform: lowercase;
color: #660000	;
}

.entryMetadata li {
list-style: none;
}

.entryMetadata-label {
font-weight: bold;
}

.entryMetadata-content {

font-weight: normal;
}

.entryMetadata-content a:link, .entryMetadata-content a:active, .entryMetadata-content a:visited {
color: #660000	;
font-weight: normal;
}

.entryMetadata-content a:hover {
color: #EEB422;
}

.entryLinkbar {
text-transform: lowercase;
text-align: right;
background-color: #660000	;
margin-bottom: 30px;
margin-top: 20px;
padding: 4px 0px 4px 0px;
z-index: 2;
}

.entryLinkbar li {
display: inline;
margin: 0px;
padding: 0px 5px 0px 5px;
z-index: 100;
}

.entryLinkbar ul {
margin: 0px;
padding: 0px;
}

.entryLinkbar a:link, .entryLinkbar a:active, .entryLinkbar a:visited {
color: #EEB422;
}

.entrylinkbar a:hover {
color: #660000	;
}

#footer-menu {
text-transform: lowercase;
text-align: right;
}

#footer-menu ul {
padding: 0px;
margin: 0px;
}

#footer-menu li {
display: inline;
padding: 3px;
}

#footer-menu a {
color: #7d7d7d;
white-space: nowrap;
}

.pagefooterblock {
text-transform: lowercase;
text-align: right;
}

table.month {
margin: 40px;
width: 475px;
}

table.month td {
padding: 5px;
border: 1px dotted #660000	;
}

blockquote {
    border-top: 1px dotted #660000	;
    border-right: 1px dotted #660000	;
    border-bottom: 1px dotted #660000	;
    border-left: 1px dotted #660000	;
    color: #660000	;
    padding: 2px;
}

::-moz-selection {
    background-color:  #660000	;
    color: #EEB422;
}

.commentHolder {
font-family: Tahoma, Verdana;
font-size: 9pt;
color: #660000	;
width:90%;
margin: 4px 0px 4px 0px;
padding: 10px;
background-color:#EEB422;
border: 0;
align:left;
}

.commentUserinfo {
font-size: 8pt;
text-align: center; 
background-color: #660000	;
color: #EEB422; 
margin: 0px 8px 8px 0px;
}

.commentUserinfo a{
color:#EEB422; 
}

.commentUserinfo-usericon img { 
border: 1px dotted #EEB422;
padding: 2px;
margin-top: 6px;
}

.commentText {
font-family: Tahoma, Verdana;
font-size: 8pt;
padding: 6px;
width: 100%;
}

.commentHeader {
background-color: #660000	;
color: #EEB422;
font-size: 10px;
padding: 4px 0px 4px 8px;
}

.commentHeader a{
color:#660000	;
}

.commentHeader a:hover{
text-decoration: underline;
}

.commentHeaderScreened a{
color: #EEB422;
}
.commentHeaderScreened {
font-size: 12px;
background-color: #EEB422;
color: #660000	;
padding: 4px 4px 4px 8px;
}

.commentHeaderSubject {
font-weight: bold;
padding: 4px 0px 4px 8px;
}

.commentLinkbar {
font-size: 9px;
color: #660000	;
text-align: left;
padding-top: 4px;
padding-bottom: 4px;
background-color: #660000	;
}

.commentLinkbar ul {
margin: 0px;
padding: 0px;
text-align:left;
}

.commentLinkbar li {
margin: 0px;
display:inline-block;
padding:0 3px;
}

.commentLinkbar a, .commentLinkbar a:link, .commentLinkbar a:visited { 
color: #EEB422; 
text-decoration: none;
}

.commentLinkbar a:hover, .commentLinkbar a:active { 
color: #660000	; 
text-decoration: none; 
}

.replyform {
background-color:#EEB422;
color:#660000	;
padding-left: 0px;
float: left;
}

.replyform textarea {
background-color:#660000	;
color: #EEB422; 
width:90%;
}

select, textarea.textbox#body{
background-color:#660000	;
color:#EEB422;
width:90%;
}

Images:

Please NO hotlinking!

Gyrffindor: http://i260.photobucket.com/albums/ii22/perhin_g/harry%20potter/gryffindor-header.png
Slytherin: http://i260.photobucket.com/albums/ii22/perhin_g/harry%20potter/slytherin-header.png
Ravenclaw: http://i260.photobucket.com/albums/ii22/perhin_g/harry%20potter/ravenclaw-header.png
Hufflepuff: http://i260.photobucket.com/albums/ii22/perhin_g/harry%20potter/hufflepuff-header.png

EDIT: Slytherin header now fixed. ;)

P.S. Have any questions? Go here! It may already be answered.

Tags:fandom: harry potter, type: layout
Mood:chipper

Comments

26th-Sep-2008 12:33 am (UTC)

dark_puck

They're very gorgeous layouts. I'm going to take the Slytherin one for possible future use, but there's one minor problem. There's a typo in the header, so it reads "SLYHTERIN".

26th-Sep-2008 12:34 am (UTC)

perhin

Eeek! I'll fix it!

26th-Sep-2008 12:37 am (UTC)

dark_puck

Just thought you'd like to know! =D

26th-Sep-2008 12:38 am (UTC)

perhin

Thanks for telling me. :D

26th-Sep-2008 12:37 am (UTC)

perhin

Fixed!

26th-Sep-2008 10:32 am (UTC)

clarksonite22

I took the Slytherin layout for my community

hc_slytherin. I changed the green colour to the same colour as the header. I hope you don't mind. I've credited you (and potterpuffs) in the userinfo ;)

26th-Sep-2008 12:42 pm (UTC)

perhin

That's fine! I couldn't find a color to match, so I just used that one. Glad you found one!

26th-Sep-2008 12:48 pm (UTC)

clarksonite22

OK, great ;)

I just opened the header in Photoshop, put the eye drop over the colour and it told me the hex code.

26th-Sep-2008 01:26 pm (UTC)

hppyflwr

Oh Oh Oh Can I take the griffyndor pleaseeeeeeeeeeeeeeee! I will credit I promise.

Hppyflwr

26th-Sep-2008 05:24 pm (UTC)

perhin

Yes, you can!

Enjoy!

26th-Sep-2008 03:48 pm (UTC)

luv_anakin

Love the Slytherin one! Meming.

26th-Sep-2008 05:24 pm (UTC)

perhin

26th-Sep-2008 09:02 pm (UTC)

maniac_brainiac

Awesome - saving the Gryffindor banner to my own bandwidth and meming this for later...gotta make sure I'm sorted in Gryffindor for sure first ^^,

I always credit.

Thanks,
Dax

26th-Sep-2008 09:06 pm (UTC)

perhin

gotta make sure I'm sorted in Gryffindor for sure first ^^,

Oh, are you applying to Hogwarts_Elite? I'm a member there! I'm in Hufflepuff!

I'm glad you like my layout. :)

27th-Sep-2008 10:15 am (UTC)

asukawati

It doesn't work in my journal... i_i did I make mistakes?

27th-Sep-2008 10:35 am (UTC)

perhin

Judging by your current layout, you probably have it under the wrong style. It needs to be Smooth Sailing.

1st-Oct-2008 02:23 pm (UTC)

asukawati

Oh, i will try it again.

1st-Oct-2008 04:28 pm (UTC)

perhin

Okay.

12th-Oct-2008 01:11 pm (UTC)

lejune

Awwww, this is adorable... I used it (and cedrited, of course). :D

12th-Oct-2008 03:27 pm (UTC)

perhin

Thanks! I'm glad you like it!

And I like your icon! It's so cute!

12th-Oct-2008 06:02 pm (UTC)

lejune

You're welcome & thank you too! I stumbled over it yesterday and immediately fell in love with it. :D

22nd-Oct-2008 02:57 am (UTC)

elvish_dreams

snagged slytherin! cerdit in userinfo :D

11th-Dec-2008 03:16 pm (UTC)

ticcia

I saved Ravenclaw =D
Thank you.

9th-Jan-2009 04:23 pm (UTC)

happierre

Ooooooooh lovelyyy <3
I took the Hufflepuff one, thank you for sharing !

Credits are on my profile =)

25th-Feb-2009 01:52 pm (UTC)

khi_dot_mama

Thanks for the layout. It looks great.
I'm using it at my site now:
http://khi-dot-mama.livejournal.com
Credits are on my profile.

25th-Feb-2009 03:03 pm (UTC)

perhin

I'm glad you like it and that it's working. ;)

9th-Apr-2009 09:00 pm (UTC)

ro_malfoy

Thank you for the layouts
They are brilliant!!

I took Slytherin layout, and i wrote the credits in my profile...

I don't know if i did right (the credits part), i'll be very glad if you check it... Honestly, i don't want to have problems with you...

Again, thank you...

Kisses...

Ro

23rd-May-2009 01:49 pm (UTC)

perhin

I'm glad you like the layout! :)

Leave a Comment to the Entry

Customize

This page was loaded Jul 18th 2009, 1:44 pm GMT.

Advertisement

Advertisement