* html,
body {
height: auto !important; /* FF and compliant browsers should automatically size the body/html */
height: 100%; /* ie will set the body/html to 100%, anything overflowing that will (incorrectly) resize it. go IE */
min-height: 100%; /* when FF/etc automatically size the body/html it should be AT LEAST the height of the entire browser window, but can expand based on
content. */
}
BODY {
padding: 0;
margin: 0;
background-image: url(http://donnasandra.se/images/2011/background_148102720.png);
text-align: center;
background-color: #474747;
}
.clear { /* generic container (i.e. div) for floating buttons */
overflow: hidden;
width: 100%;
}
form {
margin: 0;
padding: 0;
}
input.submit {
cursor: pointer !important;
cursor: hand;
}
br.clear-both, div.clear-both, br.clear-left, div.clear-left {
font: 1px/1px monospace;
display: block;
}
.clear-both {
clear: both;
}
#capTop, #capBottom, div.capBottom {
font: normal 0px/0px monospace;
background-repeat: no-repeat;
}
A {
COLOR: #333333;
TEXT-DECORATION: underline
}
A:hover {
COLOR: #666666;
TEXT-DECORATION: underline
}
#pageLayout {
background-image: url(http://donnasandra.se/images/2011/kant_148193388.gif);
background-repeat: no-repeat;
background-position: left top;
WIDTH: 740px;
text-align: left;
margin: 0 auto;
padding: 0;
background-color: #FFFFFF;
clear: both;
height: 100%;
position: relative;
display: table;
float: left;
}
div[id="pageLayout"] {
clear: both;
min-height: 1em;
height: auto;
}
#main {
background-color: #FFFFFF;
}
#logo {
float: left;
position: relative;
clear: right;
padding-left: 10px;
}
P {
PADDING-RIGHT: 0px;
PADDING-LEFT: 4px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
PADDING-TOP: 1px
}
div.side {
FLOAT: right;
WIDTH: 150px;
padding-right: 10px;
padding-left: 10px;
margin-right: 15px;
padding-top: 10px;
margin-top: 18px;
background-color: #eeeeee;
background-image: url(http://farm2.static.flickr.com/1135/812218336_5d5659f15b_o_d.gif);
background-repeat: no-repeat;
background-position: left top;
}
div.side img {
text-align: center;
}
div.content {
PADDING-LEFT: 15px;
FLOAT: left;
MARGIN: 0px;
WIDTH: 515px;
}
#header A {
color: #377ca0;
FONT-FAMILY: Verdana, Georgia, "Times New Roman", Times, serif;
TEXT-DECORATION: none
}
H1 {
FONT-SIZE: 18px;
COLOR: #CA5B90;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 6px;
margin-left: 0px;
}
H1 A {
text-decoration: none;
FONT-SIZE: 18px;
COLOR: #CA5B90;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
}
H1 A:hover {
color: #F480BD;
text-decoration: none;
}
H2 {
FONT-SIZE: 16px;
COLOR: #CA5B90;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 6px;
margin-left: 0px;
}
H3 {
FONT-SIZE: 12px;
COLOR: #CA5B90;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 6px;
margin-left: 0px;
}
.dark {
color: #666666;
}
.navheader {
FONT-WEIGHT: bold;
FONT-SIZE: 13px;
COLOR: #666666;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
margin-top: 10px;
}
#profile,
form.commentform,
.nav {
FONT-SIZE: 11px;
FONT-FAMILY: Arial, Helvetica, sans-serif;
}
.commentform textbox,
.commentform input {
font-size: 11px;
line-height: 15px;
}
.nav UL {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 5px;
MARGIN: 0px;
PADDING-TOP: 0px
}
.nav LI {
LIST-STYLE-TYPE: none
}
#profile A,
.nav A {
COLOR: #CA5B90;
TEXT-DECORATION: none
}
#profile A:hover,
.nav A:hover {
COLOR: #F480BD;
TEXT-DECORATION: none
}
.commenttext,
.entrybody {
FONT-WEIGHT: normal;
FONT-SIZE: 11px;
COLOR: #333;
LINE-HEIGHT: 120%;
FONT-FAMILY: Arial, Helvetica, sans-serif;
TEXT-ALIGN: justify
}
.entrybody img {
border: 0;
margin: 10px;
}
.commentmeta,
.entrymeta {
FONT-WEIGHT: normal;
FONT-SIZE: 10px;
PADDING-BOTTOM: 12px;
COLOR: #999999;
PADDING-TOP: 12px;
FONT-FAMILY: Arial, Helvetica, sans-serif;
}
.commentmeta A,
.entrymeta A {
COLOR: #999999;
TEXT-DECORATION: underline
}
.commentmeta A:hover,
.entrymeta A:hover {
COLOR: #666666;
TEXT-DECORATION: underline
}
.commentheader {
PADDING-RIGHT: 3px;
BORDER-TOP: #fff 1px solid;
PADDING-LEFT: 18px;
FONT-WEIGHT: bold;
FONT-SIZE: 12px;
PADDING-BOTTOM: 3px;
COLOR: #000000;
LINE-HEIGHT: 140%;
PADDING-TOP: 10px;
FONT-FAMILY: Verdana, Georgia, "Times New Roman", Times, serif
}
form.commentform {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
PADDING-BOTTOM: 10px;
PADDING-TOP: 10px;
background-color: #333333;
color: #FFFFFF;
}
.separator {
margin-top: 12px;
margin-bottom: 12px;
font-size: 1px;
line-height: 1px;
height: 1px;
background-color: #F480BD;
}
.default {
DISPLAY: none
}
.subside {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
FONT-WEIGHT: normal;
FONT-SIZE: 0.7em;
PADDING-BOTTOM: 0px;
PADDING-TOP: 0px;
FONT-FAMILY: Verdana, "Trebuchet MS" Verdana, Arial, Helvetica, Sans-serif
}
.xmlButton {
BORDER-RIGHT: #630 1px solid;
PADDING-RIGHT: 3px;
BORDER-TOP: #fc9 1px solid;
PADDING-LEFT: 3px;
BACKGROUND: #f60;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
FONT: bold 10px Verdana, Arial, Helvetica, Sans-serif;
BORDER-LEFT: #f96 1px solid;
COLOR: #fff;
PADDING-TOP: 0px;
BORDER-BOTTOM: #330 1px solid;
TEXT-DECORATION: none
}
.image {
margin-left: 15px;
}
.thumbnail {
BORDER-RIGHT: #889977 0px solid;
BORDER-TOP: #889977 0px solid;
MARGIN: 0px 6px 6px 0px;
BORDER-LEFT: #889977 0px solid;
BORDER-BOTTOM: #889977 0px solid
}
.video {
PADDING-RIGHT: 0px;
PADDING-LEFT: 30px;
PADDING-BOTTOM: 30px;
PADDING-TOP: 0px
}
.fieldName {
FONT-SIZE: 11px;
MARGIN: 0px 0px 12px;
FONT-FAMILY: Verdana, Arial, Helvetica, Sans-serif
}
#calendar {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
COLOR: #333333;
PADDING-TOP: 0px;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
TEXT-ALIGN: left
}
#calendar TABLE {
BORDER-TOP-WIDTH: 0px;
PADDING-RIGHT: 1px;
PADDING-LEFT: 1px;
BORDER-LEFT-WIDTH: 0px;
BORDER-BOTTOM-WIDTH: 0px;
PADDING-BOTTOM: 1px;
PADDING-TOP: 1px;
BORDER-RIGHT-WIDTH: 0px
}
#calendar TABLE CAPTION {
PADDING-RIGHT: 3px;
PADDING-LEFT: 3px;
FONT-WEIGHT: bold;
FONT-SIZE: 0.7em;
PADDING-BOTTOM: 3px;
TEXT-TRANSFORM: uppercase;
COLOR: #000000;
PADDING-TOP: 3px;
BORDER-BOTTOM: #000000 1px solid;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif;
LETTER-SPACING: 0.3em;
TEXT-ALIGN: left
}
#calendar TABLE TH {
FONT-WEIGHT: bold;
FONT-SIZE: xx-small;
TEXT-ALIGN: center
}
#calendar TABLE TR TD {
BORDER-RIGHT: #f1f1f1 1px solid;
BORDER-TOP: #f1f1f1 1px solid;
FONT-SIZE: 9px;
BORDER-LEFT: #f1f1f1 1px solid;
BORDER-BOTTOM: #f1f1f1 1px solid;
TEXT-ALIGN: center;
background-color: #FFFFFF;
}
#calendar TABLE TR UL {
FONT-SIZE: 0.7em;
MARGIN: 0px 0px 0px 20px;
COLOR: #bbb;
FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif
}
#calendar TABLE TR TD.cssDayMouseOver {
BORDER-RIGHT: red 1px dotted;
BORDER-TOP: red 1px dotted;
BORDER-LEFT: red 1px dotted;
CURSOR: hand;
BORDER-BOTTOM: red 1px dotted
}
#calendar TABLE TR TD.cssDayMouseOut {
BORDER-RIGHT: #f1f1f1 1px solid;
BORDER-TOP: #f1f1f1 1px solid;
BORDER-LEFT: #f1f1f1 1px solid;
BORDER-BOTTOM: #f1f1f1 1px solid
}
#calendar TABLE TR TD.cssEntryBox {
BORDER-RIGHT: gray 1px solid;
PADDING-RIGHT: 6px;
BORDER-TOP: gray 1px solid;
PADDING-LEFT: 6px;
FONT-SIZE: 0.8em;
BACKGROUND: #ffffff;
PADDING-BOTTOM: 6px;
BORDER-LEFT: gray 1px solid;
PADDING-TOP: 6px;
BORDER-BOTTOM: gray 1px solid;
FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif;
TEXT-ALIGN: left
}
#calendar TABLE TR TD UL LI {
}
#calendar TABLE TR TD DIV.cssDayEntryHeader {
FONT-WEIGHT: bold;
FONT-SIZE: 0.8em;
FONT-FAMILY: Verdana, Geneva, Arial, Helvetica, sans-serif;
TEXT-ALIGN: left
}
#calendar TABLE TR TD DIV.cssDayAvailable {
TEXT-DECORATION: underline;
text-weight: bold
}
#profile {
MARGIN-BOTTOM: 10px;
text-align: center;
}
#profile H4 {
FONT-WEIGHT: bold;
FONT-SIZE: 12px;
MARGIN: 0px 0px 5px;
COLOR: #000000;
FONT-FAMILY: Georgia, "Times New Roman", Times, serif
}
#ads {
width: 250px;
margin-top: 80px;
text-align: left;
float: right;
font-family: Arial, Helvetica, sans-serif;
color: #cccccc;
}
.adHeader {
color: #666666;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
.adHeader a {
color: #666666;
text-decoration: none;
}
.adHeader a:hover {
color: #999999;
}
#header {
text-align: left;
width: 740px;
margin: 0 auto;
margin-top: 20px;
background-image: url(http://donnasandra.se/images/2011/kant_148193388.gif);
background-repeat: no-repeat;
background-position: left bottom;
height: 110px;
position: relative;
float: left;
}
#search {
background-color: #333333;
float: right;
height: 24px;
width: 193px;
text-align: left;
background-image: url(http://donnasandra.se/images/2011/nedre_148194878.gif);
background-repeat: no-repeat;
background-position: left top;
position: relative;
}
#searchButton {
background-image: url(http://farm2.static.flickr.com/1175/821821646_dd3ea19fa6_o_d.jpg);
background-repeat: no-repeat;
background-position: left top;
border-style: none;
background-color: transparent;
height: 18px;
width: 52px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #EB74B4;
text-decoration: none;
font-weight: bold;
position: absolute;
margin-top: 2px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
#sendButton {
background-image: url(http://farm2.static.flickr.com/1175/821821646_dd3ea19fa6_o_d.jpg);
background-repeat: no-repeat;
background-position: left top;
border-style: none;
background-color: transparent;
height: 18px;
width: 52px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #EB74B4;
text-decoration: none;
font-weight: bold;
margin-top: 10px;
}
#searchField {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #333333;
height: 18px;
width: 120px;
line-height: 16px;
position: relative;
background-color: transparent;
background-repeat: no-repeat;
background-position: left top;
border: 1px solid;
padding-left: 4px;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
padding-top: 0px;
padding-bottom: 0px;
padding-right: 4px;
}
form select {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #CA5B90;
background-color: #EEEEEE;
}
#sideBottom {
background-image: url(http://farm2.static.flickr.com/1205/812218290_0f80b7762f_o_d.gif);
background-repeat: no-repeat;
background-position: left top;
height: 7px;
width: 165px;
float: right;
}
#bottom {
background-image: url(http://donnasandra.se/images/2011/nedre_148194878.gif);
background-repeat: no-repeat;
background-position: left top;
margin: 0 auto;
height: 50px;
width: 740px;
position: relative;
clear: both;
border: 0;
padding: 0;
float: left;
}
#topLinks {
float: right;
padding-right: 3px;
position: relative;
margin-top: 76px;
}
#topLinks a {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
text-transform: uppercase;
color: #CA5B90;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #eeeeee;
text-decoration: none;
}
#topLinks a:hover {
color: #F480BD;
text-decoration: none;
}
#copyright {
width: 740px;
text-align: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
margin: 0 auto;
margin-bottom: 20px;
position: relative;
clear: both;
border: 0;
padding: 0;
float: left;
}
#siteContent {
float: left;
width: 740px;
text-align: left;
margin: 0 auto;
}
#adWrapper {
width: 1000px;
text-align: left;
margin: 0 auto;
}
#readmore {
}
#readmore img {
vertical-align: middle;
margin-right: 5px;
height: auto;
}
#readmore {
float: right;
text-align: right;
margin-right: 10px;
}
#readmore a {
text-decoration: none;
}
#poll {
float: right;
border: 1px solid #CA5B90;
padding: 5px;
background-color: #E8ECF4;
}
/*
-- Even more rounded corners with CSS: donnasandra stylesheet --
*/
.dialog {
position:relative;
margin:0px auto;
min-width:8em;
max-width:760px; /* based on image dimensions - not quite consistent with drip styles yet */
FONT-SIZE: 11px;
FONT-FAMILY: Arial, Helvetica, sans-serif;
color:#fff;
z-index:1;
margin-left:12px; /* default, width of left corner */
margin-bottom:0.5em; /* spacing under dialog */
}
.dialog .dialog_content,
.dialog .dialog_t,
.dialog .dialog_b,
.dialog .dialog_b div {
background:transparent url(dialog2-blue-800x1600.png) no-repeat top right;
_background-image:url(dialog2-blue.gif);
}
.dialog.black .dialog_content,
.dialog.black .dialog_t,
.dialog.black .dialog_b,
.dialog.black .dialog_b div {
background-image:url(http://farm2.static.flickr.com/1433/898878342_5ac61f8f0b_o_d.png);
_background-image:url(dialog2-dark-alpha-drip.gif);
}
.dialog .dialog_content {
position:relative;
zoom:1;
_overflow-y:hidden;
padding:0px 12px 0px 0px;
}
.dialog .dialog_t {
/* top+left vertical slice */
position:absolute;
left:0px;
top:0px;
width:12px; /* top slice width */
margin-left:-12px;
height:100%;
_height:1600px; /* arbitrary long height, IE 6 */
background-position:top left;
}
.dialog .dialog_b {
/* bottom */
position:relative;
width:100%;
}
.dialog .dialog_b,
.dialog .dialog_b div {
height:30px; /* height of bottom cap/shade */
font-size:1px;
}
.dialog .dialog_b {
background-position:bottom right;
}
.dialog .dialog_b div {
position:relative;
width:12px; /* bottom corner width */
margin-left:-12px;
background-position:bottom left;
}
.dialog .dialog_hd,
.dialog .dialog_bd,
.dialog .dialog_ft {
position:relative;
}
.dialog .dialog_wrapper {
/* extra content protector - preventing vertical overflow (past background) */
position:static;
max-height:1000px;
overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without
if you aren't worried about height/overflow issues. */
}
.dialog h2,
.dialog p {
margin:0px;
color: #FFFFFF;
padding-top: 1em;
padding-right: 0px;
padding-bottom: 0.5em;
padding-left: 0px;
}
.dialog h1 {
padding-bottom:0px;
}