body { font-size:62.5%; } /********************************************************************************************** CSS on Sails Title:Website Author:XHTMLized Date:March 2008 ********************************************************************************************** 1. BASE 1.1 Reset 1.2 Default styles 1.3 Basic styles 2. LAYOUT 2.1 Header 2.2 Content 2.3 Sidebar 2.4 Footer ***********************************************************************************************/ /* 1. BASE ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* 1.1 Reset -----------------------------------------------------------------------------------------------*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp, small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;} body {line-height:1;} ol,ul {list-style:none;} :focus {outline:0;} ins {text-decoration:none;} del {text-decoration:line-through;} table {border-collapse:collapse;border-spacing:0;} /* 1.2 Default styles -----------------------------------------------------------------------------------------------*/ body {font-family:'Trebuchet MS',Arial,Verdana,sans-serif;} hr {display:none;} strong {font-weight:bold;} em {font-style:italic;} abbr,acronym { border-bottom:1px dotted #999;cursor:help;} input,textarea,select {font:1.2em Arial,Helvetica,sans-serif;} a {color:#0000ff;text-decoration:underline;} a:hover, a:active {color:#ff0000;text-decoration:none;} /* 1.3 Basic styles -----------------------------------------------------------------------------------------------*/ .hide {display:none;} .clear {clear:both;} br.clear {font-size:0;line-height:0;height:0;overflow:hidden;} .fleft {float:left;} .fright {float:right;} p.center {text-align:center;} p.right {text-align:right;} p.left {text-align:left;} .clearfix:after, #fc4:after, .box .m .c:after, #sidebar .contents:after {content:".";display:block;height:0;clear:both;visibility:hidden;} .clearfix, #fc4, .box .m .c, #sidebar .contents {display:inline-block;} /* Hides from IE-mac \*/ * html .clearfix, * html #fc4, * html .box .m .c, * html #sidebar .contents {height:1%;} .clearfix, #fc4, .box .m .c, #sidebar .contents {display:block;} /* 2. LAYOUT ----------------------------------------------------------------------------------------------- ===============================================================================================*/ body {text-align:center;} body #content, body #sidebar {text-align:left;} /*#fc4 {padding:0 413px 0 25px;}*/ #fc4 {padding-bottom:15px;} #container {padding:0 413px 0 25px;} #content {float:left;width:100%;position:relative;} #sidebar {width:376px;float:left;position:relative;margin-right:-100%;margin-top:10px;} #footer {margin:0 10px;} #sidebar .contents {margin:15px 0;} #sidebar .contents .left {float:left;width:170px;} #sidebar .contents .right {float:right;width:183px;} /* Main Backgrounds */ body {background:#8db6f7 url(../images/bg_body.gif) top center;} #fc {background:url(../images/bg_fc.png) left repeat-y;} * html #fc {background:none;} #fc2 {background:url(../images/bg_fc2.png) right repeat-y;} * html #fc2 {background:none;} #fc3 {background:#e7f0f0 url(../images/bg_fc3.gif) top center;} #fc4 {background:url(../images/bg_fc4.png) top repeat-x;} * html #fc4 {background:none;} #sidebar {border:1px solid #dcdada;background:#fff;} #sidebar .contents {background:url(../images/bg_sidebar.gif) 180px 0 repeat-y;} #header #navigation {background:url(../images/bg_navigation.png) bottom repeat-x;} * html #header #navigation {background:none;} #footer {background:url(../images/bg_footer.png) top repeat-x;} * html #footer {background:none;} /* 2.05 Rounded corners .box */ .box {margin-bottom:5px;} .box .t, .box .b {height:10px;overflow:hidden;} .box .t .l, .box .t .r, .box .b .l, .box .b .r {width:16px;height:10px;overflow:hidden;} .box .m .l {padding-left:10px;background-position:left center;background-repeat:repeat-y;} .box .m .r {padding-right:10px;background-position:right center;background-repeat:repeat-y;} .box .m .c {background:#fff;padding:15px 15px 5px 15px;} .box .t .l, .box .b .l { float:left; } .box .t .r, .box .b .r { float:right; } .box .t .c, .box .b .c {margin:0 16px;height:10px;overflow:hidden;} #content p {font-size:1.2em;line-height:1.4em;margin-bottom:10px;} #content p.p10 {font-size:1em;} #content p.p11 {font-size:1.1em;} #content p.p13 {font-size:1.3em;} #content p.p14 {font-size:1.4em;} #content p.p15 {font-size:15px;} .box .t .l {background-image:url(../images/brd_tl.png);} .box .t .c {background-image:url(../images/brd_t.png);} .box .t .r {background-image:url(../images/brd_tr.png);} .box .m .l {background-image:url(../images/brd_l.png);} .box .m .r {background-image:url(../images/brd_r.png);} .box .b .l {background-image:url(../images/brd_bl.png);} .box .b .c {background-image:url(../images/brd_b.png);} .box .b .r {background-image:url(../images/brd_br.png);} * html .box .t .l, * html .box .t .c, * html .box .t .r, * html .box .m .l, * html .box .m .r, * html .box .b .l, * html .box .b .c, * html .box .b .r {background:none;} /* 2.1 Header -----------------------------------------------------------------------------------------------*/ #header .logo {position:absolute;top:0;right:0;} #header .logo a, #header .logo span {display:block;width:100px;height:50px;overflow:hidden;cursor:pointer;} #header .logo span {position:absolute;top:0;left:0;z-index:10;background:url(../images/logo.gif) no-repeat;} #header a {color:#009DE5;text-decoration:none;} #header a:hover, #header a:focus {text-decoration:underline;} #header .white {background:#fff url(../images/bg_white.gif) bottom repeat-x;padding:10px 10px 5px 10px;border-bottom:1px solid #508eff;min-height:51px;} * html #header .white {height:51px;} #header .white h1, #header .white p.h1 {font-size:2em;line-height:1.2em;font-weight:bold;} #header .white h2, #header .white p.h2 {font-size:1.4em;line-height:1.2em;font-weight:normal;} #header #navigation {margin:0 10px;height:31px;padding:0 35px;} #header #navigation li {float:left;} #header #navigation li.page_item {background:url(../images/nav-li.gif) left bottom no-repeat;height:24px;margin-top:7px;margin-right:10px;} #header #navigation li.page_item a {float:left;background:url(../images/nav-a.gif) right bottom no-repeat;height:24px;line-height:24px;font-size:1.2em;color:#828282;padding:0 10px;} #header #navigation li#skip-to-content.page_item {float:right;margin-right:0;margin-left:10px;} #header #navigation li#searchsite {float:right;margin-left:10px;width:167px;} #header #navigation li#searchsite form {border-width:0 1px 1px 1px;border-style:solid;border-color:#508eff;height:23px;background:url(../images/header-form.gif) no-repeat;} #header #navigation li#searchsite form input.text {float:left;width:126px;height:19px;padding:4px 0 0 4px;border:none;color:#0077e5;background:transparent;} body.js #header #navigation li#searchsite form input.text {background:url(../images/header-input.gif) no-repeat;} body.js #header #navigation li#searchsite form input.active {background:none;} #header #navigation li#searchsite form input.buttonimg {float:left;} #fc {margin-left:6px;padding-left:4px;} #fc2 {margin-right:6px;padding-right:4px;} /* IMAGERY under Header */ div.imagery { margin:0 35px; } div.imagery .l { padding-left:5px;background:url(../images/bg_imagery-l.gif) left top no-repeat;} div.imagery .r { padding-right:5px;background:url(../images/bg_imagery-r.gif) right top no-repeat;} div.imagery .c { padding:5px 0;background:#fff;overflow:hidden;} div.imagery .in { position:relative;height:95px;text-align:center;background-position:center center; background-image:url(../images/imagery/img0.jpg);} div.imagery .in a { position:absolute;top:0;left:0; height:100%;width:100%;text-indent:-9999px;} #fc div.imagery0 img, #fc div.imagery1 img, #fc div.imagery2 img, #fc div.imagery3 img { display:none; } #fc div.imagery0 .in { background-image:url(../images/imagery/img0.jpg); } #fc div.imagery1 .in { background-image:url(../images/imagery/img1.jpg); } #fc div.imagery2 .in { background-image:url(../images/imagery/img2.jpg); } #fc div.imagery3 .in { background-image:url(../images/imagery/img3.jpg); } #fc {position:relative;} div.utils {position:fixed;top:113px;left:19px;} * html div.utils {position:absolute;top:19px;left:8px;} div.utils ul {margin-bottom:10px;padding-left:1px;} div.utils a {display:block;height:22px;width:16px;overflow:hidden;text-indent:-9999px;background-position:center left;background-repeat:no-repeat;} div.utils a:hover {background-position:center right;} div.utils ul.sizeswitch {padding-left:0;} div.utils ul.sizeswitch a {width:18px;height:30px;} div.utils .top a {background-image:url(../images/ico/top.gif);} div.utils .home a {background-image:url(../images/ico/home.gif);} div.utils .bot a {background-image:url(../images/ico/bot.gif);} div.utils .french a {background-image:url(../images/ico/french.gif);} div.utils .german a {background-image:url(../images/ico/german.gif);} div.utils .spanish a {background-image:url(../images/ico/spanish.gif);} div.utils .italian a {background-image:url(../images/ico/italian.gif);} div.utils .s a {background-image:url(../images/ico/s.gif);} div.utils .d a {background-image:url(../images/ico/d.gif);} div.utils .l a {background-image:url(../images/ico/l.gif);} div.utils a.current {background-position:right center;cursor:default;} /* 2.2 Content -----------------------------------------------------------------------------------------------*/ #content a {color:#0081e5;text-decoration:underline;} #content a:hover, #content a:focus {text-decoration:none;} #content h1 {font-size:2em;line-height:1.3em;padding-left:35px;background:url(../images/bg_heading.gif) left center no-repeat;margin-bottom:10px;zoom:1;} #content h1 a {text-decoration:none;} #content h1 a:hover {text-decoration:underline;} #content h2 {font-size:1.8em;margin-bottom:10px;} #content h3 {font-size:1.6em;margin-bottom:10px;} #content h4 {font-size:1.4em;margin-bottom:10px;} #content p.date {font-size:1.1em;color:#777;padding-left:17px;margin-left:2px;background:url(../images/ico/date.gif) left center no-repeat;zoom:1;} #content p.meta {font-size:1.3em;clear:both;margin:15px 15px 0 15px;padding:5px 10px 5px 10px;text-align:right;background:url(../images/bg_meta.gif) top repeat-x;} #content p.meta a {text-decoration:none;padding-left:20px;background-position:left center;background-repeat:no-repeat;} #content p.meta a:hover {text-decoration:underline;} #content p.meta .category {padding-right:5px;} #content p.meta .category a {background-image:url(../images/ico/category.gif);padding-right:5px;} #content p.meta .category a:hover {background-image:url(../images/ico/category-h.gif);} #content p.meta .comments {background:url(../images/bg_category.gif) left center no-repeat;} #content p.meta .comments a {margin-left:5px;background-image:url(../images/ico/comments.gif);} #content p.meta .comments a:hover {background-image:url(../images/ico/comments-h.gif);} /* Buy box */ #content .buy {float:right;margin:15px 0 15px 15px;border:1px solid #cacdcf;padding:3px;width:250px;} #content .buy .in {background:#f6f6f6;padding:10px 5px;} #content .buy h4, #content .buy h3, #content .buy h2 {padding-left:0;color:#5b5b5b;font-size:1.3em;margin-bottom:5px;} #content .buy p {color:#5b5b5b;font-size:1.1em;text-align:justify;} #content .buy p.important {text-align:center;font-size:1.2em;} #content .buy a.url {color:#5b5b5b;text-decoration:none;} #content .buy a.url:hover {text-decoration:underline;color:#5b5b5b;} /* Comments */ #commentlist {margin-bottom:20px;} #commentlist li {padding: 5px 5px 5px 5px;text-align:justify;margin-bottom:10px;padding-left:5px;background:#f2fbfb;border:1px dashed #8DB5F6;} #commentlist li p {padding:0 10px;text-align:justify;} #commentlist li p.author {font-style:italic;border-top:1px dashed #E7F0F0;margin:5px 0 0;font-size:1em;letter-spacing:1px;padding:5px 10px 0 10px;} /* Form */ form.extended {margin-bottom:15px;} form.extended li {padding-top:5px;clear:both;} form.extended label {float:left;width:180px;text-align:right;padding-right:10px;font-size:1.2em;line-height:25px;} form.extended input.text, form.extended textarea {border:1px solid #8DB5F6;} form.extended textarea {width:280px;padding:2px 3px;} form.extended input.text {width:280px;padding:2px 3px;font-size:14px;float:left;} form.extended em.req {color:#f00;font-style:normal;} form.extended fieldset.submit {padding-left:190px;padding-top:10px;} form.extended fieldset.submit input {font-size:1.7em;padding:3px 7px;} /* 2.3 Sidebar -----------------------------------------------------------------------------------------------*/ #sidebar a {color:#1f90e8;text-decoration:none;} #sidebar a:hover {color:#0061b3;text-decoration:underline;} #sidebar p {font-size:1.2em;line-height:1.2em;margin-bottom:5px;} #sidebar h4, #sidebar h2 {padding-left:10px;font-size:1.3em;margin-bottom:5px;} #sidebar ul li ul {margin-bottom:15px;} #sidebar ul li li {font-size:1.2em;line-height:1.2em;} * html #sidebar ul li li {padding-bottom:1px;} #sidebar .left ul li li:hover {background:url(../images/nav-side-left.gif) left repeat-y;} #sidebar .right ul li li:hover {background:url(../images/nav-side-right.gif) right repeat-y;} #sidebar ul li li a {display:block;padding:3px 0 3px 24px;color:#1f90e8;text-decoration:none;background:url(../images/bull.gif) 11px 6px no-repeat;} #sidebar .right ul li li a {padding-left:10px;background:none;} #sidebar ul li li a:hover {color:#0061b3;text-decoration:none;} #sidebar li.calendar {text-align:center;} table#wp-calendar {width:170px;margin-left:0px;;text-align:center;font-size:1.2em;} table#wp-calendar caption {padding:0 0 10px 0;font-size:14px;letter-spacing:2px;text-align:center;font-weight:bold;} table#wp-calendar thead th {text-align:center;font-weight:bold;border-bottom:1px solid #5B3215;padding-bottom:4px;} table#wp-calendar thead {} table#wp-calendar tbody {padding-top:2px;} table#wp-calendar tbody td {text-align:center;padding:2px 0;} table#wp-calendar tfoot td {border-top:1px solid #5B3215;} #sidebar .buy {margin:7px 2px 7px 0;border:1px solid #cacdcf;padding:3px;} #sidebar .right .buy {position:relative;left:-5px;} #sidebar .left .buy {position:relative;left:7px;margin-right:4px;} #sidebar .buy .in {background:#f6f6f6;padding:10px 5px;} #sidebar .buy h4, #sidebar .buy h3, #sidebar .buy h2 {padding-left:0;color:#5b5b5b;} #sidebar .buy p {color:#5b5b5b;font-size:1.1em;text-align:justify;} #sidebar .buy p.important {text-align:center;font-size:1.2em;} #sidebar .buy a.url {color:#5b5b5b;} #sidebar .buy a.url:hover {text-decoration:underline;color:#5b5b5b;} /* 2.4 Footer -----------------------------------------------------------------------------------------------*/ #footer {padding-top:10px;padding-bottom:15px;} #footer p {font-size:1.3em;line-height:1.3em;} #footer p a {color:#000;text-decoration:none;} #footer p a:hover {text-decoration:underline;}