/***************
* Page
**************/
html, body {
margin: 0;
padding: 0;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;;
font-size: 90%;
background: #000;
}
img, div {
behavior: url(iepngfix.htc);
}
/***************
* Container box, holds
* the page together
**************/
#wrap {
margin: 0 auto;
padding: 0 3px 0 3px;
width: 994px;
text-align: center;
}
* html #wrap {
padding: 0 1px 0 3px;
}
#mainimage {
background: transparent url(/images/toprand.jpg) no-repeat;
padding-top: 28px;
}
/****************
* Pageheader
***************/
#header {
position: relative;
z-index: 99;
border: 0;
margin: 0;
text-align: left;
width: 91px;
float: left;
margin-right: -91px;
margin-top: 19px;
display: none;
}
* html #header {
margin-right: -110px;
margin-top: 7px;
}
*+html #header {
margin-top: 12px;
}
/***************
* Content
**************/
#content {
width: 994px;
text-align: left;
padding: 0;
margin: 0;
}
* html #content {
width: 994px;
}
#image_text {
text-align: left;
float: right;
width: 48%;
height: 18px;
}
#image_text p {
margin: 0;
padding: 0;
padding-left: 0;
margin-left: 0;
padding-top: 2px;
text-align: left;
font-size: 10px;
color: #ababab;
}
/***************
* Footer
**************/
#footer {
border: 0;
width: 100%;
padding-top: 4px;
padding-bottom: 2px;
margin: 0 auto;
font-size: 10px;
text-align: center;
color: #999;
clear: both;
font-weight: normal;
margin-bottom: 10px;
}
* html #footer, *+html #footer {
margin-left: 0px;
padding: 5px 0;
}
#footer a {
color: #999;
text-decoration: none;
}
#footer a:hover {
color: #999;
text-decoration: underline;
}
#footer a:visited {
color: #999;
}
/***************
* Headers
**************/
legend {
font-size: 20px;
font-weight: bold;
}
h2.category_header {
padding: 0 10%;
}
/***************
* Text defaults
***************/
p {
font-size: 11px;
}
p.admin_box { /* used for paragraph with extra adminlinks below content */
text-align: center;
font-size: 10px;
}
p.admin_box a {
color: #ff9900;
}
p.category_description { /* used for paragraph with description of indexcategory */
padding: 0 10%;
}
.discrete { /* used in places such as "Click on link for larger version" */
color: #aaa;
margin: 6px auto;
text-align: center;
}
/****************
* Link defaults
***************/
a {
color: #99e;
text-decoration: none;
}
a:hover {
color: #99e;
text-decoration: underline;
}
a:visited {
color: #99e;
text-decoration: none;
}
a img {
border: 0;
}
/****************
* Forms
***************/
fieldset {
border: 1px solid #ccc;
width: 400px;
margin: 0 auto;
padding: 10px;
text-align: left;
}
label {
font-size: 1em;
}
textarea {
font-family: Verdana, 'Century Gothic', Helvetica, sans-serif;
width: 360px;
}
input, select, textarea {
font-size: 1em;
}
/***************
* Misc
***************/
#content p, #content h2 { /* just for misc contents leftmargin */
padding: 0 24px;
}
.clear {
clear: both;
}
.odd {
background-color: #fff;
}
.even {
background-color: #eaeaea;
}
.msg { /* messages, errors etc */
color: #c00;
background-color: #ff9;
font-style: italic;
padding: 8px;
width: 400px;
margin: 10px auto;
border: 1px dotted #c00;
}
.clr {
clear: both;
}
fieldset.email {
float: left;
border: 0;
}
.write_field {
background: #ccc;
border: 1px solid #333;
margin: 4px;
}
fieldset.email label {
font-weight: bold;
}
#viewcart {
float: right;
text-transform: uppercase;
padding: 5px 20px 0 0;
}
#viewcart a {
color: #f60;/*#ff8e18;*/
}
#viewcart {
width: 125px;
height: 30px;
background: url(../../images/frameorangefill.png) no-repeat;
float: right;
text-transform: uppercase;
padding: 5px 20px 0 15px;
margin-top: 3px;
position: relative;
right: -15px;
}
#viewcart a {
color: #fff !important;/*#f80 !important;#ff8e18;*/
}
#mycart {
float:right;
font-size: 10px;
margin: 0 10px 0 0;
padding: 0;
position: relative;
top: 0;
}
#mycart {
text-align: center;
}
#viewcart {
visibility: hidden;
}
.cartcount {
text-align: center;
margin: 0 auto;
width: 100%;
}
/***************
* Main menu
**************/
#site_color, #site_flags {
font-size: 10px;
}
#site_logo {
float: left;
margin-top: 5px;
}
#site_flags {
float: right;
height: 34px;
margin-right: 5px;
}
#site_flags img.swe {
margin: 2px 0 0 8px;
}
#site_flags img.eng {
margin: 2px 8px 0 0;
}
#site_color {
float: right;
height: 34px;
}
* html #site_color {
margin-right: 2px;
}
#mainmenu {
text-align: left;
border: 0;
margin-top: -4px;
padding: 0;
padding-top: 2px;
font-size: 11px;
width: 100%;
}
* html #mainmenu {
margin-top: 0;
margin-right: -4px;
padding-top: 2px;
}
*+html #mainmenu {
margin-top: 0;
margin-right: -7px;
padding-top: 2px;
}
#mainmenu ul {
clear: right;
}
* html #mainmenu ul {
float: right;
}
*+html #mainmenu ul {
float: right;
margin-left: -50px;
width: 660px;
}
#mainmenu li {
display: block;
float: right;
padding: 0 0 2px 16px;
}
#mainmenu li a {
text-decoration: none;
font-weight: bold;
text-transform: uppercase;
font-size: 11px;
}
#mainmenu li a:hover {
text-decoration: underline;
}
#mainmenu li a.current {
text-decoration: underline;
color: #99e;
}
/** Subnav **/
#mainmenu li .anylinkcss {
position: absolute;
visibility: hidden;
margin-top: 4px;
border: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
z-index: 100;
width: 190px;
background: #333;
color: #ccc;
}
#mainmenu li .anylinkcss a {
color: #ccc;
width: 100%;
display: block;
text-indent: 3px;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-indent: 5px;
text-transform: none;
padding: 1px 0 0 0;
font-weight: normal;
font-size: 12px;
}
#mainmenu li .anylinkcss a:hover {
background: #ff8e18;
color: #fff;
}
#mainmenu li .anylinkcss a.line {
border-bottom: 1px solid #666;
}
#mainmenu li .anylinkcss a.big {
padding-top: 6px;
padding-bottom: 7px;
font-weight: bold;
}
* html #mainmenu {
margin-top: 2px;
/*height: 16px;*/
}
*+html #mainmenu {
margin-top: 2px;
/*height: 16px;*/
}
* html #mainmenu li {
padding: 0 6px 0 10px;
}
*+html #mainmenu li {
padding: 0 6px 0 10px;
}
/*******************
* Popup
******************/
#popupbox{
margin: 0;
margin-left: 40%; /* This gets it relatively center on the screen */
margin-right: 40%; /* This gets it relatively center on the screen */
margin-top: 50px; /* Makes it a little off the top of the screen */
padding-top: 10px; /* Make the text not touching the top on the login box */
padding-left: 30px;
width: 200px; /* For centering it on the screen */
height: 200px; /* The height of the login box */
position: absolute; /* Makes sure its absolute so it doesn't dock with everything else */
background: #eaeaea; /* Login Box background color. Change this if desired. */
border: solid #666 2px; /* Makes a black border around the login box */
border-bottom-color: #000;
border-right-color: #000;
z-index: 9; /* Makes it on top of everything else */
font-family: arial; /* Sets the font */
visibility: hidden; /* Makes it hidden at first. Very Important.*/
}
#popupbox form {
margin: 0;
padding: 0;
}
#popupbox fieldset {
border: 0;
padding: 0;
margin: 0;
}
#popupbox p {
margin: 5px;
}
#popupbox legend {
font-size: 14px;
font-weight: bold;
margin: 0;
padding: 0;
}
#popupbox label {
font-size: 12px;
font-style: italic;
}
#popupbox input.colorInput {
border: 1px solid #ccc;
border-top-color: #777;
border-left-color: #777;
}
.colorbox {
width: 14px;
height: 14px;
float: left;
margin: 2px 6px 10px 0;
padding: 0;
border: 1px solid #000;
filter:alpha(opacity=60);
-moz-opacity:.60;
opacity:.60;
}
#content #mainimage {
width: 994px;
float: right;
}
#content #mainimage img {
margin: 0;
}
/* image selector */
#content #mainimage #image-selector {
width: 100%;
height: 20px;
text-align: left;
margin-left: 4px;
margin-top: 0px;
}
* html #content #mainimage #image-selector {
margin-left: 4px;
}
*+html #content #mainimage #image-selector {
margin-left: 4px;
}
/******************
* DIVIDED INDEXPAGE
******************/
/*******************
* WRAPPER (a table)
*******************/
#content #mainimage #welcome-wrapper {
width: 994px;
padding: 0;
margin: 5px auto 3px auto;
}
/** IE 7 **/
*+html #content #mainimage #welcome-wrapper {
padding-top: 10px;
padding-bottom: 10px;
}
/********************
* FRAME 1 - TEXT (a tablecell)
********************/
#content #mainimage #welcome-wrapper #welcome-text {
width: 290px;
text-align: left;
color: #999;
padding-left: 12px;
padding-right: 4px;
}
#content #mainimage #welcome-wrapper #welcome-text.diary {
width: 310px;
padding-left: 5px;
}
#content #mainimage #welcome-wrapper #welcome-text h3 {
background-image: url(../../images/headerback.png) !important;
}
em.week {
font-size: 11px;
font-style: italic;
}
/** IE 6 **/
* html #content #mainimage #welcome-wrapper #welcome-text {
margin-left: 0px;
}
#content #mainimage #welcome-wrapper #welcome-text #portrait-image {
position: relative;
top: -2px;
}
#content #mainimage #welcome-wrapper #welcome-text #portrait-image p {
width: 300px;
margin: 0 auto;
padding: 0 !important;
text-align: left;
}
/**********************
* FRAME 2 - NEWS (a tablecell)
**********************/
#content #mainimage #welcome-wrapper #news {
width: 290px;
text-align: left;
padding-left: 7px;
padding-right: 7px;
}
#content #mainimage #welcome-wrapper #news div.whats {
clear: both;
font-size: 11px;
padding: 0;
margin: 0 0 4px 0;
padding-right: 3px;
}
#content #mainimage #welcome-wrapper #news div h3 {
background-image: url(../../images/headerback.png) !important;
}
/* special rules for diary page */
#content #mainimage #welcome-wrapper #news.diary {
width: 335px;
padding-left: 4px;
padding-right: 0px;
}
#content #mainimage #welcome-wrapper #news.diary h3 {
background-image: url(../../images/headerback2.png) !important;
}
#content #mainimage #welcome-wrapper #news.diary .whats-up {
height: 322px;
overflow: hidden;
}
#content #mainimage #welcome-wrapper #news div img {
margin: 2px 0;
}
/** IE 6 **/
* html #content #mainimage #welcome-wrapper #news {
margin-left: 0;
}
/** IE 7 **/
*+html #content #mainimage #welcome-wrapper #news.diary h3 {
width: 320px;
}
*+html #content #mainimage #welcome-wrapper #news.diary .whats-up {
height: 310px;
}
*+html #content #mainimage #welcome-wrapper #news div p img {
margin-top: 2px;
}
/***********************
* FRAME 3 - PROJECTS (a tablecell)
***********************/
#content #mainimage #welcome-wrapper #projects {
width: 320px;
margin-left: 0px;
padding-left: 7px;
text-align: left;
}
#content #mainimage #welcome-wrapper #projects.diary {
width: 325px;
padding-left: 4px;
margin-left: 0;
}
/* photodiary */
#content #mainimage #welcome-wrapper #projects #photo-diary {
height: 310px;
width: 100%;
text-align: center;
}
#content #mainimage #welcome-wrapper #projects #photo-diary #diarypost {
width: 240px;
margin: 0 auto;
}
#content #mainimage #welcome-wrapper #projects #photo-diary p {
margin-bottom: 2px;
padding-bottom: 2px;
margin-top: 2px;
}
*+html #content #mainimage #welcome-wrapper #projects #photo-diary p {
margin-top: 0;
padding-top: 0;
}
#content #mainimage #welcome-wrapper #projects #photo-diary h3 {
text-align: left;
}
#content #mainimage #welcome-wrapper #projects #photo-diary p {
text-align: left;
padding-left: 2px;
}
#content #mainimage #welcome-wrapper #projects #photo-diary img {
margin: 0 auto;
}
/**********************
* FRAME 1,2,3 - COMMON
*********************/
* html #content #mainimage #welcome-wrapper #text, * html #content #mainimage #welcome-wrapper #news, * html #content #mainimage #welcome-wrapper #projects {
margin-top: 10px;
margin-bottom: 10px;
}
#content #mainimage #welcome-wrapper #welcome-text p, #content #mainimage #welcome-wrapper #news p, #content #mainimage #welcome-wrapper #projects p {
margin-left: 0;
padding-left: 0;
}
#content #mainimage #welcome-wrapper #welcome-text h3, #content #mainimage #welcome-wrapper #news h3, #content #mainimage #welcome-wrapper #projects h3 {
display: block;
height: 20px;
padding-top: 4px;
font-size: 12px;
padding-left: 10px;
font-weight: normal;
background: transparent url(../../images/headerback2.png) no-repeat;
}
*+html #content #mainimage #welcome-wrapper #welcome-text h3, *+html #content #mainimage #welcome-wrapper #news h3, *+html #content #mainimage #welcome-wrapper #projects h3 {
width: 300px;
padding-top: 4px;
font-size: 12px;
padding-left: 6px;
font-weight: normal;
background: transparent url(../../images/headerback2.png) no-repeat;
}
#content #mainimage #welcome-wrapper #projects h3, #content #mainimage #welcome-wrapper #support h3 {
background: transparent url(../../images/headerback2.png) no-repeat;
display: block;
height: 20px;
width: 320px;
}
*+html #content #mainimage #welcome-wrapper #projects h3, *+html #content #mainimage #welcome-wrapper #support h3 {
background: transparent url(../../images/headerback2.png) no-repeat;
display: block;
height: 20px;
width: 320px;
}
h3.slideshow-header {
padding-bottom: 0;
margin-bottom: 12px;
}
*+html h3.slideshow-header {
margin-bottom: 8px;
}
/*****************
* PROJECT BOXES
* 270x150
*****************/
.projectbox1, .projectbox2 {
float: left;
width: 150px;
height: 270px;
padding: 0;
margin: 0;
}
.projectbox1 {
margin-right: 12px;
}
*+html .projectbox1 {
margin: -10px 6px 0 4px;
padding: 0;
}
*+html .projectbox2 {
margin: 0;
padding: 0;
float: right;
}
.diary .projectbox1 {
padding-left: 5px;
margin-right: 4px;
}
.projectbox1 {
padding-left: 3px;
}
/* More-links */
a.more {
color: #99e;
text-decoration: none;
}
a.more:hover {
text-decoration: underline;
}
#projects a#projectsdrop {
float: right;
text-align: right;
padding-right: 5px;
padding-top: 10px;
font-size: 11px;
text-transform: uppercase;
font-weight: bold;
}
* html #projects a#projectsdrop {
padding-top: 0;
}
*+html #projects a#projectsdrop {
padding-top: 0;
}
#projects_div {
width: 345px;
padding: 0;
margin: 0;
}
* html #projects_div {
margin-bottom: -8px;
}
#projects .anylinkcss {
position: absolute;
left: 0;
visibility: hidden;
margin-top: 4px;
/*margin-left: -180px;*/
border: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 20px;
z-index: 100;
width: 175px;
background: #333;
color: #999;
}
#projects .anylinkcss a {
color: #999;
width: 100%;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-indent: 3px;
text-decoration: none;
text-indent: 5px;
text-transform: none;
padding: 1px 0 0 0;
font-weight: normal;
font-size: 12px;
}
#projects .anylinkcss a:hover {
color: #fff;
}
#project_info {
padding-bottom: 5px;
width: 345px;
margin: 0;
height: 35px;
margin-bottom: 5px;
}
* html #project_info {
padding-top: 6px;
height: 45px;
}
*+html #project_info {
padding-top: 0;
height: 45px;
}
#project_ilink {
float: right;
font-size: 11px;
margin-top: -10px;
margin-right: 8px;
}
* html #project_ilink {
margin-top: 2px;
margin-right: 2px;
}
*+html #project_ilink {
margin-top: 0;
}
#project_name {
float: left;
font-size: 11px;
width: 190px;
margin-top: 0;
}
* html #project_name {
margin-top: 19px;
}
*+html #project_name {
margin-top: 19px;
}
/* ---- */
#projects #outer_images {
height: 85px;
font-size: 10px;
width: 355px;
margin-bottom: 0;
margin-top: 8px;
}
* html #projects #outer_images {
margin-top: 4px;
}
#projects #images {
width: 310px;
height: 93px;
overflow: hidden;
font-size: 10px;
margin-left: 5px;
margin-bottom: 2px;
float: left;
}
#projects #images #scrolling {
}
/* ----- */
#projects #outer_slides {
height: 85px;
font-size: 10px;
width: 355px;
margin-top: -8px;
}
* html #projects #outer_slides {
margin-top: 2px;
}
*+html #projects #outer_slides {
margin-top: 6px;
}
#projects #slides {
width: 310px;
height: 93px;
overflow: hidden;
font-size: 10px;
margin-left: 5px;
margin-bottom: 5px;
float: left;
}
#projects #slides #scrolling {
}
/*---*/
#project_navigation {
float: right;
margin: 0;
padding: 0;
margin-top: 12px;
font-size: 11px;
font-weight: bold;
width: 75px;
height: 12px;
}
* html #project_navigation {
margin-top: 0;
}
*+html #project_navigation {
margin-top: 0;
}
#prev_project {
float: left;
width: 10px;
padding: 0;
margin: 0;
}
* html #prev_project {
margin-top: 2px;
}
*+html #prev_project {
margin-top: 2px;
}
#project_count {
float: left;
width: 51px;
text-align: center;
}
#next_project {
float: right;
width: 10px;
margin: 0;
padding: 0;
}
* html #next_project {
margin-top: 2px;
}
*+html #next_project {
margin-top: 2px;
}
#project_navigation img a, #project_navigation a img {
border: 0;
}
#support {
width: 320px;
padding-bottom: 5px;
}
#support p {
padding: 0;
margin-top: 0;
}
#support img {
margin: 0;
padding: 0;
}
#portrait-image {
width: 100%;
text-align: center;
}
/**********************
* SHARELIST
*********************/
#sharelist {
width: 560px;
color: #999;
margin: 10px auto;
clear: both;
}
#sharelist .button {
display: block;
float: left;
margin-right: 8px;
}
#sharelist a {
color: #333;
}
#sharelist img a, #sharelist a img {
border: 0;
}
#sharelist img {
display: block;
float: left;
margin-left: 2px;
}
#pusha_knapp {
width: 16px;
height: 16px;
}