/* Project Name: Centriair Project URI: http://www.centriair.com Description: General stylesheet for the new version of http://www.centriair.com Version: 1.0 Author: Magnus Forsberg Author URI: http://www.magnusforsberg.com/ */ /* RESET -------------------- */ * { margin: 0; padding: 0; text-decoration: none; font-size: 1em; outline: none; } code, kbd, samp, pre, tt, var, textarea, input, select, isindex, listing, xmp, plaintext { font: inherit; font-size: 1em; white-space: normal; } dfn, i, cite, var, address, em { font-style: normal; } th, b, strong, h1, h2, h3, h4, h5, h6 { font-weight: normal; } a, img, a img, iframe, form, fieldset, abbr, acronym, object, applet, table { border: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td, center { text-align: left; vertical-align: top; } body { line-height: 1; background: white; color: black;} q { quotes: "" ""; } ul, ol, dir, menu { list-style: none; } sub, sup { vertical-align: baseline; } a { color: inherit; } font { color: inherit !important; font: inherit !important; color: inherit !important; } marquee { overflow: inherit !important; -moz-binding: none; } blink { text-decoration: none; } nobr { white-space: normal; } /* GENERAL -------------------- */ html { font-size: 125%; background:#fff; } body { font-size: 50%; font-family:Helvetica Neue, Arial, Verdana, sans-serif; background:#fff url(../images/body-bg.jpg) top left repeat-x; behavior: url("csshover3.htc");} hr { background:#fff; border:0; clear:both; color:#fff; float:none; height:1px; width:100%; } em { font-style:italic; } strong { font-weight:bold; } a:link, a:visited, a:hover, a:active { color:#359668; } a:hover, a:active { text-decoration:underline; } img { border:0; margin:0; padding:0; } img.right { float:right; margin:0 0 10px 10px; } /* LAYOUT -------------------- */ #container { width:1024px; margin:0 auto;} #top { position:relative; width:1024px; padding:0 0px; margin:0 0 0px 0; height:110px;} body.contentimage #top { margin-bottom:0px; } #top #logo { width:320px; height:81px; float:left; padding:10px 0 0; } #top #logo h1 { width:320px; height:81px; text-indent:-9999em; margin:0; padding:0; background: transparent url(../../images/Logo_Centriair-transp-small.png) top right no-repeat; z-index: 20;} #top #navigation { padding-top:50px; width:700px; float:right; padding-bottom:10px; margin-right:0px;} #top #navigation ul { list-style:none; display: block; z-index: 10; } #top #navigation li { display:inline; border-left:1px solid #d8d8d8; padding:0 7px; font-family:Georgia, Times, serif; position: relative;} #top #navigation li.first { border:0; padding-left:0; } #top #navigation li.last { padding-right:0; } #top #navigation li a { color:#5d899d; font-size:1.8em; font-style:italic; } #top #navigation li a:hover, #top #navigation li.active a { color:#359668; } #top #navigation ul li ul { float:left; display: none; position: absolute; top: auto; left:0; padding-top: 15px; background:url(../images/nav_menu.jpg); background-repeat:repeat-x; padding-bottom:5px; border: 1px solid #999; } #top #navigation li ul li {float:left; padding:0 17px 0px 17px; line-height: 25px; font-family:Verdana, Geneva, sans-serif; position: relative; border-left:hidden; color:blue; font-size:0.6em; border-bottom: 1px solid #CCC; width:180px;} #top #navigation li ul li.last {float:left; padding:0 17px 0px 17px; line-height: 25px; font-family:Verdana, Geneva, sans-serif; position: relative; border-left:hidden; color:blue; font-size:0.6em; width:180px; border:none;} #top #navigation li ul li a { font-style:normal; font-weight:bold; padding-top: 5px; } #top #navigation li:hover ul, li.over ul { display: block; } #top #navigation li ul {top: auto; left: auto; float: left;} #top #languages { position:absolute; top:10px; right:10px; } #top #languages a#languages-toggle { color:#5d899d; padding:0 9px 0 0; background:transparent url(../images/link-languages.gif) right 50% no-repeat; } #top #languages #languages-toggle:hover { color:#359668; background:transparent url(../images/link-languages-green.gif) right 50% no-repeat;} #top #languages #languages-list { position:absolute; top:15px; right:0; width:90px; padding:3px 5px; background:#fff; border:1px solid #d9d9d9; } #top #languages #languages-list li { display:block; padding:3px 0;} #top #headerText {width:620px; height:auto; float:left; } #top #headerText h3 { font-size:2.4em; font-weight:normal; color:#3c7595; margin-left:50px; margin-top: 20px;} #top #close { content: "."; display: block; height: 0; clear: both; visibility: hidden;} #midle { width:720px; } #midle #navigation { width:235px; float:left; padding-bottom:20px; position: relative; z-index: 1000; float: left;} #midle #navigation ul { padding-top:5px; list-style:none; text-align:right; } #midle #navigation li { display:inline; border-left:1px solid #d8d8d8; padding:0 7px; font-family:Georgia, Times, serif; } #midle #navigation li.first { border:0; padding-left:0; } #midle #navigation li.last { padding-right:0; } #midle #navigation li a { color:#5d899d; font-size:1.2em; font-style:italic; } #midle #navigation li a:hover, #midle #navigation li.active a { color:#359668; } #material { width:720px; } #material #leftbox {width:205px; margin-left: 50px; float: left; padding-top: 50px; padding-left: 100px; padding-bottom: 50px;} #material #leftbox pic {background:transparent url(../images/trash_bin.jpg)} #material #rightbox {width:205px;float: right; padding-top: 50px; padding-right: 100px; padding-bottom: 50px;} #content { width:1024px; margin-top: 20px} #content #close { content: "."; display: block; height: 0; clear: both; visibility: hidden;} #top #languages #languages-list li a { padding:0 0 0 20px; color:#505050; } #top #languages #languages-list li a.en { background:transparent url(../images/lang-en.gif) top left no-repeat; } #top #languages #languages-list li a.de { background:transparent url(../images/lang-de.gif) top left no-repeat; } #top #languages #languages-list li a.se { background:transparent url(../images/lang-se.gif) top left no-repeat; } #content h2.intro { width:700px; text-indent:-9999em; margin:0 10px 30px; } #content h2.start { height:110px; background:#fff url(../images/h2-start.jpg) top left no-repeat; } #content h2.solutions { height:73px; background:#fff url(../images/h2-solutions.jpg) top left no-repeat; } #content h2.potatoes { height:73px; background:#fff url(../images/h2-potatoechips.jpg) top left no-repeat; } #content h2.snacks { height:73px; background:#fff url(../images/h2-snacksfrying.jpg) top left no-repeat; } #content h2.meat { height:73px; background:#fff url(../images/h2-meatfrying.jpg) top left no-repeat; } #content h2.other { height:73px; background:#fff url(../images/h2-other.jpg) top left no-repeat; } #content h2.technology { height:73px; background:#fff url(../images/h2-technology.jpg) top left no-repeat; } #content h2.contact { height:73px; background:#fff url(../images/h2-contact.jpg) top left no-repeat; } #content h2.about { height:73px; background:#fff url(../images/h2-about.jpg) top left no-repeat; } #content h2.news { height:73px; background:#fff url(../images/h2-news.jpg) top left no-repeat; } #content h2.support { height:73px; background:#fff url(../images/h2-support.jpg) top left no-repeat; } #content h2.centrifugal { height:73px; background:#fff url(../images/h2-centrifugal.jpg) top left no-repeat; } #content h2.uv { height:73px; background:#fff url(../images/h2-uv.png) top left no-repeat; } #content h2.cip { height:73px; background:#fff url(../images/h2-cip.png) top left no-repeat; } #content h2.carbon { height:73px; background:#fff url(../images/h2-carbon.png) top left no-repeat; } #content h2.nose { height:73px; background:#fff url(../images/h2-nose.png) top left no-repeat; } #content h2.scrubbing { height:73px; background:#fff url(../images/h2-scrubb.png) top left no-repeat; } #content h2.freshman { height:73px; background:#fff url(../images/h2-freshman.jpg) top left no-repeat; } #content h2.remote { height:73px; background:#fff url(../images/h2-remote.jpg) top left no-repeat; } #content h2.heat { height:73px; background:#fff url(../images/h2-heat.jpg) top left no-repeat; } #content h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0 0 8px 0; } #content span.date { color:#666; font-family:Georgia, Times, serif; font-style:italic; font-size:1.1em; padding-bottom:3px; display: block; } #content h4 { font-size:1.4em; font-style:italic; font-family:Georgia, Times, serif; color:#3c7595; margin-bottom:4px; } #content p { font-size:1.2em; line-height:1.4em; color:#151515; margin:0 0 15px 0; } #content p.preamble { font-size:1.4em; font-style:italic; font-family:Georgia, Times, serif; color:#303030; margin-bottom:10px; } #content .col-large ul { padding:0; margin:0; } #content .col-large ul li { list-style:inside square; padding:3px 0; font-size:1.2em; color:#151515; } #content #contentimage { width:720px; margin:0 200px 30px 0; float:left; position: relative; z-index: 0;} #content #contentimageflash { width:720px; margin:0 0 30px 0; float:left; position: relative; z-index: 0;} #content #newsfeed { height:auto; margin: 0 0 30px; width:304px; float:right;} #content #newsfeed h1 { font-size:3.0em; font-weight:bolder; color:#b2c6d7; margin:0px 0px 0px 65px;} #content #newsfeed .news {width:320px; heigth:300px; margin: 0 0px 0 50px; font-size:1.4em; font-style:italic; font-family:Georgia, Times, serif; color:#303030;} #content #newsfeed #contentNews {width:260x; height:auto; margin-left: 15px; margin-top:10px;} #content #newsfeed #contentNews h3 { padding-left: 10px;} #content #newsfeed .img { margin: 0px 0px 0px; width:110px; heigth:70px; float:left; position:inherit; padding: 0px 7px 5px 0px;} #content #newsfeed text {margin: 5px 0px 0px; width:275px;float:right; text-align:justify; font-size:1.0em; border-bottom:1px solid #d9d9d9;} #content #newsfeed #newslink { float:right; width:285px; height:auto; margin-top:10px; } #content #newsfeed #newslink h3 { padding-left:10px;} #content #newsfeed #newslink .img { width:180px; height:auto; float:right; position:inherit; margin-right:40px;} #content #headerText {width:720px; height:auto; float:left; } #content #headerText h2 { font-size:3.8em; font-weight:normal; color:#3c7595; margin:0 0 20px 5px;} #content #headerText h3 { font-size:2.4em; font-weight:normal; color:#3c7595; margin-left:50px; margin-bottom: 20px;} #content #col-thumbnails { width:340px; margin:0 0px 0px; float:left; } #content #col-thumbnails #content {width:340px; height:auto;} #content #col-thumbnails h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0px 0px 8px 5px; } #content #col-thumbnails .text {margin: 5px 5px 0px; width:330px; text-align:justify; font-size:1.1em;} #content #col-thumbnails .img { margin: 5px 5px 10px; width:330px; height:160px; float:left;} #content #col-thumbnails-m { width:340px; margin:0 0px 0px 40px; float:left; } #content #col-thumbnails-m #content {width:340px; height:auto;} #content #col-thumbnails-m h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0px 0px 8px 5px; } #content #col-thumbnails-m .head {margin: 5px 5px 0px; width:330px; font-size:1.1em;} #content #col-thumbnails-m .text {margin: 5px 5px 0px; width:330px; text-align:justify; font-size:1.1em;} #content #col-thumbnails-m .img { margin: 5px 5px 10px; width:330px; height:160px; float:left;} #content #col-thumbnails-r { width:320px; margin:0 10px 15px; float:right; } #content #col-thumbnails-r #content1 {width:320px; height:auto;} #content #col-thumbnails-r #content2 {width:320px; height:auto;} #content #col-thumbnails-r #content3 {width:320px; height:auto;} #content #col-thumbnails-r h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0px 0px 8px 15px; } #content #col-thumbnails-r h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0px 0px 8px 15px; } #content #col-thumbnails-r h3 { font-size:1.8em; font-weight:normal; color:#3c7595; margin:0px 0px 8px 15px; } #content #col-thumbnails-r text1 {margin: 5px 5px 0px; width:230px;float:right;} #content #col-thumbnails-r text2 {margin: 5px 5px 0px; width:230px;float:right;} #content #col-thumbnails-r text3 {margin: 5px 5px 0px; width:230px;float:right;} #content #col-thumbnails-r .img1 { margin: 5px 5px 0px; width:70px; heigth:70px; float:left; position:relative;} #content #col-thumbnails-r .img2 { margin: 5px 5px 0px; width:70px; heigth:70px; float:left; position:relative;} #content #col-thumbnails-r .img3 { margin: 5px 5px 0px; width:70px; heigth:70px; float:left; position:relative;} #content .col-medium { width:220px; margin:0 10px 15px; float:left; } #content .col-large { width:720px; margin:0 10px 15px; float:left; } body.full #content .col-large { width:700px; } #content #leftmenu { width:160px; margin:0 10px 15px 10px; float:left; display:block;} #content #leftmenu ul { } #content #leftmenu ul ul {} #content #leftmenu ul ul li { padding-left:15px;} #content #leftmenu ul ul li:first-child { padding-left:15px; border-top:1px solid #d9d9d9;} #content #leftmenu li { font-size:1.4em; padding:5px 0; border-top:1px solid #d9d9d9; color:#5d899d;} #content #leftmenu li:first-child { border-top:0; padding-top:3px;} #content #leftmenu li a { color:#5d899d; } #content #leftmenu li a:hover { color:#359668; } #content #leftmenu li.active a { color:#359668; } #footer { width:1024px; margin:0 10px; padding:5px 0 15px; border-top:1px solid #d9d9d9;} #footer p { font-size:1em; line-height:1.4em; color:#505050; } #footer a { color:#5d899d} #footer a:hover { color:#359668} .box {background-color: #EFEFEF; width: 300px; padding: 25px;border: 1px solid #999999; margin-right: auto; margin-left: auto; margin-top: 50px; margin-bottom: 50px;}