lodge layout

GLOBAL_HEAD<= <title></title> <meta charset="UTF-8"> <link href="https://fonts.googleapis.com/css?family=Ropa+Sans" rel="stylesheet"> <link rel="stylesheet" href="https://lodge.neocities.org/styles/01.css"> <style> /* CREDIT: @MINNA { ASK FOR CODES, HELP OR RESOURCES! } */ /* IJ OVERRIDES */ /* BODY BACKGROUND */ body { background: url(https://www.transparenttextures.com/patterns/dust.png), linear-gradient(#ffffff, #e5e5e5, #f0f3f6); /* using a transparent texture over linear gradient */ height: 100%; } /* REMOVES BORDERS AROUND TABLES AND ENTRYBOX; ALLOWS USE OF DROP-SHADOWS INSTEAD */ table { border: 0p; } table table { border: 0px; } /* JUSTIFIES TEXT */ tr { text-align:justify; } /* SETS THE WIDTH OF YOUR ENTRYBOX. note: this also effects the "top box" with your icon, userinfo links, etc! */ .entrybox { width:594px; } /* ENTRYBOX DISPLAY. note: this also effects the "top box" with your icon, userinfo links, etc! */ .entrybox, .shadowed { background-color: rgba(255, 255, 255, 0.2); /* set the colour of the entrybox. the 0.2 allows you to mess with the opacity. does not effect font opacity. */ box-shadow: 0 0 1px #dddddd; /* how to get a border around the entire entrybox */ border-radius: 2px; /* adding a very slight rounding to the edges */ -webkit-border-radius: 2px; -moz-border-radius: 2px; } /* IJ LINKS - USERINFO, CALENDAR, NAVIGATION */ table table table td.meta { font-size: 0px; line-height: 0px; } /* CHANGES FONT SIZES FOR IJ LINKS */ p table.entrybox table table td.meta, table table table td.meta a { font-size:6px; letter-spacing:1px; line-height: 6px; margin-top:-4px; } /* HIDES THE LINKS AND NAMEFIELD ABOVE THE TOP BOX */ table table tr.caption td.caption, .entrybox td table td.index, tr.caption, .entrybox td.meta { visibility: hidden; line-height: 0px; } .entrybox td.index { display: none; } /* PAGE FONT */ tr, td, table, body { font-family: calibri; font-size: 8px; color: #4e4c51; letter-spacing: 1px; line-height: 10px; font-weight: lighter; text-transform: uppercase; padding: 1px; } /* SETS HOW BOLDED TEXT LOOKS */ b { font-weight: normal !important; } /* SUBJECT LINE APPEARANCE & FONT */ p table table td.caption { font-family: ropa sans; font-size: 8px; color: #4e4c51; letter-spacing: 1px; line-height: 8px; font-weight: lighter; margin-bottom: -4px; text-transform:uppercase; text-shadow: 0px 0px 1px #b89fcb; padding: 3px; } /* NAMEFIELD - note: this pulls your default namefield */ .shadowed td div { font-family: lodge; font-size: 32px; letter-spacing:0px; line-height: 10px; color:#4e4c51; text-shadow: 2px 2px 1px #fff; text-transform: lowercase; margin-left: 10px; } /* MISC LITTLE TEXT. e.g. navigation/date and time. */ p.index, .index, tr.caption, .meta, td.meta, .comments, .date { font-family: ropa sans, calibri; font-size: 7px; line-height: 8px; letter-spacing: 1px; color:#222222; text-shadow:0px 0px 0px #ddd; font-weight: lighter; text-transform: uppercase; } .date { padding:0; display:block; text-align:left; font-size: 6px; } / * HIDES DATE * / .dates { display: none; } /* LINK EFFECTS */ a { color: #da4b86; text-shadow: 0px 0px 1px #b89fcb; text-decoration: none; -webkit-transition-duration: 1.0s; -moz-transition-duration: 1.0s; -o-transition-duration: 1.0s; } a:hover{color: #ffffff; text-shadow:-1px -1px 1px #da4b86; text-decoration: none; -webkit-transition-duration: 1.5s; -moz-transition-duration: 1.5s; transition-duration: 1.5s;} .shadowed td div img { box-shadow: 0 0 0 !important; } /* USERICONS & LOCKS - note: this pulls your default icon. */ .shadowed img, .index img { border-radius: 0px; opacity: .75; filter:alpha(opacity=75); height: 100px; /* ADJUST SIZE OF ICON */ width: 100px; /* ADJUST SIZE OF ICON */ } .shadowed img { border-radius: 100px; /* ADJUST WHETHER ICON IS SQUARE, ROUND, ANOTHER SHAPE */ -webkit-border-radius: 100px; -moz-border-radius: 100px; padding: 0px; position: relative; z-index: 5; } p table table td.caption img { height:6px; width:7px; opacity:0.7; } /* HIDES THE IJ ICONS FOR UI AND COMM LINKS WHEN USING <xx-lj USER> */ img[src*="img/userinfo.gif"] { width: 0 !important; height: 0 !important; } img[src*="img/community.gif"] { width: 0 !important; height: 0 !important; } /* OPACITY FOR IMAGES */ img { border: 0px; opacity:0.7; filter:alpha(opacity=70); border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -moz-transition: all 1.0s ease-out; -o-transition: all 1.0s ease-out; -webkit-transition: all 1.0s ease-out; transition: all 1.0s ease-out; } img:hover { opacity:1.0; filter:alpha(opacity=100); -moz-transition: all 1.0s ease-out; -o-transition: all 1.0s ease-out; -webkit-transition: all 1.0s ease-out; transition: all 1.0s ease-out; } /* FRIENDS PAGE ICON BACKGROUND/FONT */ .entrybox a.index { background:transparent; color:#808080; font-size:8px; } /* SCROLLBAR APPEARANCE */ ::-webkit-scrollbar {width: 4px;} /* UNDERNEATH BAR */ ::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 0px;background-color:#AFAEEA;} /* TOP BAR */ ::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 1px 1px 1px tan;border-radius:0px;background-image: url(https://s-media-cache-ak0.pinimg.com/736x/32/de/77/32de77f2336e5adb20b3fbf58d13d94a.jpg);} /* CURSOR */ body, a, a:hover { cursor:url(http://i.imgur.com/ONVDMqu.png), default; .} /* CSS */ #ui { position:absolute; top: 14px; margin-left: 180px; z-index: 2; } #floralfront { position:absolute; top: 8px; margin-left: -204px; visibility: visible; z-index: 6; } #floralback { position:absolute; top: 8px; margin-left: -204px; visibility: visible; z-index: 2; } </style> <=GLOBAL_HEAD FRIENDS_WEBSITE<= <div id="ui"> <font style="font-family: ropa sans, calibri; font-size: 7px; letter-spacing: 1px; text-transform: uppercase;"><a href="/info">USERINFO</a>&emsp;<a href="/friends">FRIENDS</a>&emsp;<a href="/2000/01/01/">CUSTOMS</a></font> </div> <div id="floralfront"> <img src="http://i.imgur.com/k5Ifg2X.png" style="display: block;width: 150px; height: 150px; margin-top: 10px;margin-left:66px; transform: rotate(0deg); opacity: .9; visibility: none;"> </div> <div id="floralback"> <img src="http://i.imgur.com/tJjg9dz.png" style="display: block;margin-top: 0px;margin-left: 68px;transform: rotate(20deg);width: 150px;height: 153px;opacity: .9;"> </div> <=FRIENDS_WEBSITE LASTN_WEBSITE<= <div id="ui"> <font style="font-family: ropa sans, calibri; font-size: 7px; letter-spacing: 1px; text-transform: uppercase;"><a href="/info">USERINFO</a>&emsp;<a href="/friends">FRIENDS</a>&emsp;<a href="/2000/01/01/">CUSTOMS</a></font> </div> <div id="floralfront"> <img src="http://i.imgur.com/k5Ifg2X.png" style="display: block;width: 150px; height: 150px; margin-top: 10px;margin-left:66px; transform: rotate(0deg); opacity: .9; visibility: none;"> </div> <div id="floralback"> <img src="http://i.imgur.com/tJjg9dz.png" style="display: block;margin-top: 0px;margin-left: 68px;transform: rotate(20deg);width: 150px;height: 153px;opacity: .9;"> </div> <=LASTN_WEBSITE