/* -------------------------------------------------------------- CSS Framework Web Design & Development by Studio 24 Ltd www.studio24.net - (0870) 241 6159 * Screen & Projection Styles * This is the main CSS-file for the framework. Include this in the of every page. -------------------------------------------------------------- */ @import "reset.css"; @import "content.css"; @import "typography.css"; /* =MAIN-CONTAINER-ELEMENTS -------------------------------------------------------------- */ /* slightly enhanced, universal clearfix hack */ /* ODD'N'SODS from extra.css */ #admin {display: inline;} #admin dl { display: inline; float:left; } .admin_img { margin: 1px; padding: 1px; border: 1px solid hsl(210, 23%, 85%); border-radius:4px; background: #fff; border-style:solid 4px; border-right-color:#666 ; border-bottom-color:#333 ; } .admin_box{ width: 80%; margin-top: 1px; margin-left: 1px; padding-top: 1px; padding-left: 1px; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-right-color: #666; border-bottom-color: #666; border-radius: 4px; background-color: #EFEFEF; } .admin_box dt{ font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; color: #A3461F; font-weight: 600; font-size: 1.3em; line-height: 1.4em;} .admin_box dd{ font-size: 1.1em; font-weight: 500; line-height: 1.2em;} .post800b { color: #993300; font-family: Georgia, "Times New Roman", Times, serif; font-size: 102%; font-style: normal; font-weight: 500; font-variant: normal; text-transform: none; line-height: normal; } .post600sm { color: #993300; font-family: Georgia, "Times New Roman", Times, serif; font-size: 77%; font-style: italic; font-weight: 700; font-variant: normal; text-transform: none; line-height: normal; } .academic { color: #666; font-size: 1.4em; } .space{ padding: 3%; margin: 3%; } #sweden { font-size: small; width: 100%; float: none; padding: 25px 0; border-width: 0px; border-style: solid; border-color: #fff; } #sweden p{ font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-size: 100%; color: #666; } #sweden dl { padding: 1px; float: left; width:48%; display: inline; /* fixes IE/Win double margin bug */ border-width: 1px; border-style: solid; border-color: #aaa; border-radius: 4px; margin: 1px; background-color:#fff; } #sweden:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } #sweden dt { float: right; width: 62%; margin: 0; padding:.2em 2em .2em 0; font-size: 1.4em; color: #666; font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-weight: 500; } #sweden dt a{ font-size: 1.1em; line-height: 1.2em; } #sweden dd { margin: 0 0 0 90px; padding: 0; font-size: 105%; line-height: 1.3em; color: #666; font-family: Calibri, "Calibri Light", Tahoma; font-weight: normal; } #sweden dl dd.img { margin: 0; } #sweden dd.img img { float: left; margin: 8px; padding: 4px; background: #fff; vertical-align: top; border: 1px solid hsl(210, 23%, 85%); border-radius:4px; border: 1px solid #7D96AA; } /* reverse float */ #sweden .alt dt { float: left; } #sweden .alt dd { margin: 0 0 0; } #sweden .alt dd.img img { float: right; margin: 0 0 0 8px; } #sweden ul{ font-family: Calibri, "sans serif"; font-size: 1em; color: #666; list-style-type: none; } #sweden ul a{ font-family: Calibri, "sans serif"; color: #CB450C; } #sweden ul a:hover{ font-family: Calibri, "sans serif"; color: #FF9900; background-color: #CCC; } #sweden ul a:focus{ font-family: Calibri, "sans serif"; color: #FF9900; background-color: #777; } .inline{ display:inline;} .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } /* start commented backslash hack \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* END OF ODD'N'SODS from extra.css */ /* close commented backslash hack */ body { /* background: #EEE; */ background: #ccc; padding: 0 ; } @media screen and (max-width:320px) {body { background-color:orange; } } div#skip { display: none; } div#container { box-shadow: 10px 10px 5px #888888; background: #fff; max-width: 940px; margin: 0 auto; overflow: hidden; padding: 2em, 0, 2em ,0; border-left: 1px solid #d3d3b1; border-right: 1px solid #d3d3b1; border-bottom: 1px solid #d3d3b1; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; } img.ucam { padding: 0.7em 1em 0 1em; } /*hvs 14.4*/ div#dept-title { box-shadow: 10px 10px 5px #888888; background: #fff; max-width: 940px; margin: 0 auto; overflow: hidden; padding: 0; border-left: 1px solid #d3d3b1; border-right: 1px solid #d3d3b1; border-bottom: 1px solid #d3d3b1; } div#navtabs { box-shadow: 10px 10px 5px #888888; background: #d3d3b1; max-width: 940px; z-index:1000; line-height: 1em; margin: 0 auto; overflow: hidden; padding: 0; border-left: 1px solid #d3d3b1; border-right: 1px solid #d3d3b1; } div#navtabs ul { float:left; list-style: none; margin:0; padding: 0px; } div#navtabs li { display: block; float: left; } ul#nav-tabbed li a { color: white; background: #81adb5 url(../images/bg-tab-right.gif) no-repeat 100% 0; display: block; padding: 0.6em 20px 0.45em 20px; position: relative; text-decoration: none; } div#navtabs a { display: block; /* float: left; */ color: #336; text-decoration: none; background-color:#d3d3b1; padding:4px 10px 4px 10px; border-right: 1px solid #9c9; } div#navtabs a:hover { display: block; float: left; color: #000; text-decoration: none; background-color: #EDEEEC; } div#navtabs a.first { border-left: 1px solid #9c9; border-right: 1px solid #9c9; } div#navtabs a.current { background-color: #9c9; } /* Commented backslash hack hides rule from IE5-Mac \*/ div#navtabs li a { float: none } /* End IE5-Mac hack */ /*end of tabbed nav bar*/ div#header { box-shadow: 10px 10px 5px #888888; height: 70px; margin: 5px auto 0 auto; overflow: hidden; padding: 0; max-width: 940px; /*border-bottom: 1px solid #cdc5bc;*/ border-left: 1px solid #d3d3b1; border-right: 1px solid #d3d3b1; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: #fff; background-image: none; z-index: auto; } .dept div#header { box-shadow: 10px 10px 5px #888888; border-bottom: 1px solid #9c9; } div#branding { float: left; } div#content { float: left; width: 100%; padding-bottom: 1em; } div#content-primary { float: left; width: 80%; padding: .3em; min-height: 25em; border-left-width: 0px; border-left-style: solid; border-left-color: #777777; vertical-align: top; } .dept div#content-primary { margin: 1em 0 0 0; } .dept div#content-primary h1 { margin: 0 0 0.5em 0; padding: 0; } div#content-primary ul li a:link { text-decoration: none; font-size: 1em; font-family: Calibri, Geneva, sans-serif; color: hsl(0,0%,44%); font-style: normal; font-weight: 500; line-height: 1.2em; } div#content-primary#front a { text-decoration: none; font-size: 1em; font-family: Calibri, Geneva, sans-serif; color: hsl(199,42%,45%); font-style: normal; font-weight: 500; line-height: 1.2em; } div#content-primary h5 a { font-size: 1.2em; color: #3A6A9E; } div#content-primary a:hover { text-decoration: underline; } /*following three styles are to make links in text panel show up better*/ div#content-primary a:link.textlink {text-decoration:none; border-bottom: 1px #999 solid;} div#content-primary a:hover.textlink {text-decoration:none; color: #cf5200;} div#content-primary a:visited.textlink {text-decoration:none; border-bottom: 1px #999 solid;} div#content-secondary { float: right; margin-top: 0em; border-left: 1px solid #ccc; width: 17%; height: 100%; background-color: #E2E2E2; } .dept div#content-secondary, .dept.three-col.nosub div#content-secondary { border-top: 1px solid #ccc; } .dept.three-col div#content-secondary { border: 0; } /* Set one column layout -------------------------------------------------------------- */ body.one-col div#content-secondary, body.one-col ul#nav-primary { display: none; } body.one-col div#content-primary { width: 100%; } /* Set two and three column layouts -------------------------------------------------------------- */ body.two-col div#content, body.three-col div#content { width: 75%; } body.two-col ul#nav-primary, body.three-col ul#nav-primary { float: left; width: 16%; padding-left: 0; } body.two-col div#nav-secondary { float: left; width: 16%; padding-left: 0; } body.two-col div#content-primary { width: 100%; } body.two-col div#content-secondary { display: none; } body.three-col div#content-primary { width: 76.6%; padding-right: 1%; } body.three-col div#content-secondary { float: right; width: 17%; padding-left: 0px; } /* =SITE-TOOLS -------------------------------------------------------------- */ .dept div#site-search { padding: 0.5em 0 0 0; } div#site-search ul { padding:5px; margin: 0; list-style-type: none; } div#site-search ul li { float: right; padding: 0 7px 0 7px; background: url(../images/divider-site-tools-small.gif) no-repeat 100% 50%; } div#site-search ul li.last { background: none; padding-right: 15px; } div#site-search ul li a { color:#036; text-decoration:none; } div#site-search ul li a:hover { color:#c60; } div#site-search { float:none; width:auto; height:auto; padding:10px 1em 5px 0; font-family: Arial, Helvetica, sans-serif; } div#site-search form { text-align:right; } /* =NAV-PRIMARY -------------------------------------------------------------- */ ul#nav-primary { list-style-type: none; clear: both; width: 100%; font-weight: normal; background-color: #ffffff; border-width: thin; border-style: solid; border-color: #C0C0C0; color: #444444; font-size: 0.9em; margin-top: 2.3em; margin-right: 2%; margin-bottom: 5em; margin-left: 0.5em; border-radius: 9px; } ul#nav-primary h5{ text-align: center; padding: 1em; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight: 500; color: #BB5E00; } ul#nav-primary li { border-bottom: 1px solid #CCC; margin: 0 1px 0 0; padding: 0; color: #444444; } /* added by DMR (Studio24) 24.01.08 */ ul#nav-primary li.title { border-top: none; font-weight: normal; padding: 0.6em 3em 0.45em 2em; background: #eee; color: #555555; } ul#nav-primary li a { border-top: 1px solid white; padding: 0.2em 1em 0.2em .5em; display: block; height: 100%; font-size: 1em; text-decoration: none; color: #666; } ul#nav-primary li a:hover { color:#c60; } /* =nav-primary sub-nav -------------------------------------------------------------- */ ul#nav-primary li.active { background:#fff; } ul#nav-primary li.active a { border: none; color:#c60; background:#fff; } ul#nav-primary li.active ul, ul#nav-primary li ul { font-size: .9em; list-style-type: none; margin: 0; padding: 0.3em 0 0 1em; } ul#nav-primary li.active ul li, ul#nav-primary li ul li { border: none; border-top: solid #E8F0FF 1px; padding: 4px 0 4px 0; } /* Style for unselected secondary nav link */ ul#nav-primary li.active ul li a, ul#nav-primary li.active ul li a:hover, ul#nav-primary li ul li a, ul#nav-primary li ul li a:hover { padding: 0 10px 0 10px; border: none; color: #036; font-weight: normal; } /* Style for selected secondary nav link */ ul#nav-primary li.active ul li.active a, ul#nav-primary li.active ul li.active a:hover, ul#nav-primary li ul li.active a, ul#nav-primary li ul li.active a:hover { background: url(../images/icon-arrow-nav-primary.gif) no-repeat 10px 5px; color: #c60; font-weight: 600; } ul#nav-primary li.active ul li a:hover, ul#nav-primary li ul li a:hover { color: #c60; text-decoration: underline; } /* =BREADCRUMB -------------------------------------------------------------- */ ul#nav-breadcrumb { overflow: hidden; margin: 0; list-style-type: none; color: #666; font-size: 0.8em; width: 100%; padding-top: 1.2em; padding-right: 0; padding-bottom: 1em; padding-left: 0; } ul#nav-breadcrumb li { float: left; padding: 0 6px 0 6px; background: url(../images/icon-arrow-nav-breadcrumb.gif) no-repeat 0 50%; white-space: nowrap; } ul#nav-breadcrumb li.first { padding-left: 21px; background: url(../images/icon-home.gif) no-repeat 0 0; } ul#nav-breadcrumb li.last { font-size: 1.1em; font-weight: 600; color: #913E74; text-decoration: underline; /*background: none;*/ } /* ul#nav-breadcrumb li.first a { color: #cf5200; } */ ul#nav-breadcrumb a, ul#nav-breadcrumb a:hover { text-decoration: none; } /* =SITE-INFO -------------------------------------------------------------- */ ul#site-info { overflow: hidden; clear: both; list-style-type: none; padding: 1em; font-size: 0.7em; border-top-width: 2px; border-top-style: solid; border-top-color: #FF6317; color: #ffffff; font-family: Verdana, Geneva, sans-serif; background-color:hsl(201, 48%, 31%); } ul#site-info li { float: left; list-style-type: none; } ul#site-info li a{ text-decoration: none; color: #ffffff; } ul#site-info li.copy{ text-decoration: none; color: #ffffff; } ul#site-info li.link { float: right; padding: 0 10px 0 10px; background: url(../images/divider-site-tools-small.gif) no-repeat 100% 50%; } ul#site-info li.last { background: none; padding-right: 0; } ul.ref-info { margin-left: .5em; padding-top: 1em; padding-bottom: 1em; font-size: 0.9em; border-top-width: 1px; border-top-style: solid; border-top-color: #CC7A00; } ul.ref-info li { list-style-type: circle; line-height: 1em; margin-top: 1.1em; } ul.ref-info li a:link { text-decoration: none; font-family: Calibri, "Calibri Light", Tahoma; color: #018FA9; } ul.ref-info li.link { float: right; padding: 0 10px 0 10px; background: url(../images/divider-site-tools-small.gif) no-repeat 100% 50%; } ul.ref-info li.last { background: none; padding-right: 0; } #columns { column-count: 2; column-gap: 10px; column-rule:1px solid #666; } .spaced { border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; margin-top: 0px; margin-right: 25px; margin-bottom: 5px; margin-left: 25px; padding-top: 0px; padding-right: 20px; padding-bottom: 20px; padding-left: 25px; } .plain{ background-color: #fff; } .box{ width: 36%; border-radius: 4px; font-size: 1em; color: #666666; padding: 0.5em; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; border: 1px solid #888888; background-color: #eee; background: -moz-linear-gradient(#fff, #ccc); background: -webkit-linear-gradient(#fff, #ccc); background: -o-linear-gradient(#fff, #ccc); box-shadow: 2px 2px 2px 1px #D5D5FF; margin-top: 0.5em; margin-right: 1em; margin-bottom: 0.5em; margin-left: 1em; } .box a{ font-family: Calibri, Geneva, sans-serif; font-size: 1em; color: #04617B; text-decoration: none; } .box86{width: 86%;} .box666{width: 100%; alignment-adjust:middle;} .box66{ width: 66%; border-radius: 4px; font-size: 85%; color: #666666; border: 1px solid hsl(0, 5%, 89%); margin:.5em; padding: 0.5em; background-color: #eee; } .column{ width: 10em; float: left; border-radius: 4px; font-size: 0.8em; color: #666666; padding: 1em; margin: .5em; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; border: 1px solid #888888; } .box90{ border-radius: 4px; color: #666666; padding: 1em; margin: 2em; border: 1px solid #888888; background-color: #eee; background: -moz-linear-gradient(#fff, #ccc); background: -webkit-linear-gradient(#fff, #ccc); background: -o-linear-gradient(#fff, #ccc); box-shadow: 2px 2px 2px 1px #D5D5FF; } .admin_box{ width: auto; font-family: Calibri, Geneva, sans-serif; line-height: 1em; } .box h1{ font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-size: 1em; color: #666; text-decoration: none; padding: 0.1em; } .box p{} .box td{ font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 0.9em; color: #444; } .fright{ float: right; margin-right: 1em; } .rmargin{margin: 0,10%, 0 , 0;} .lmargin {margin: 0,0 ,0,3%;} .fleft{ float: left; padding: .3em; } .fmiddle{ width: 90%; alignment-adjust:middle; float: middle; padding: .3em; } .corner{ border-radius: 8px; box-shadow: 3px 4px 2px 2px #ddd;} #navigation { float: left; border: 1px solid; padding: 5px; width: 97%; } #navigation>div { float: left; text-align: center; margin-left: 40px; 200px; } #prev {font-size: 0.8em; float: left; width: 100px; } #next {font-size: 0.8em; float: right; width: 100px; text-align: right; }