/* Stylesheet för discsport.se av Per Jonson per[punkt]jonson[at]discsport[punkt]se Boxvalues * One value: all sides * Two values: top and bottom, right and left * Three values: top, right and left, bottom * Four values: top, right, bottom, left font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif; When using the font shorthand you can omit any values except font-size and font-family – you always need to give values for those, and in that order. */ @import url(position.css); @import url(print.css); /* ----------------------------------------------------------------------- GLOBALA GREJOR -------------------------------------------------------------------------*/ body { color: #000; font-size: 11.5px; line-height: 16.5px; /* font-size: 60.5%; */ background-image:url(../grafik/grafik/chains.gif); background-repeat: no-repeat; background-position: 147px 125px; } /* RUNDADE HÖRN KOD FRÅN: http://www.webcredible.co.uk/user-friendly-resources/css/css-round-corners-borders.shtml */ /* SIDEBAR 4px */ .t { background: url(../grafik/rounded_box/dot.gif) 0 0 repeat-x; } .b { background: url(../grafik/rounded_box/dot.gif) 0 100% repeat-x} .l { background: url(../grafik/rounded_box/dot.gif) 0 0 repeat-y} .r {background: url(../grafik/rounded_box/dot.gif) 100% 0 repeat-y} .bl { background: url(../grafik/rounded_box/bl.gif) 0 100% no-repeat; } .br { background: url(../grafik/rounded_box/br.gif) 100% 100% no-repeat} .tl { background: url(../grafik/rounded_box/tl.gif) 0 0 no-repeat; } .tr { background: url(../grafik/rounded_box/tr.gif) 100% 0 no-repeat; padding: 4px; } /* GREY 1px */ .grey1px .t { background: url(../grafik/rounded_box/grey1px/dot.png) 0 0 repeat-x; } .grey1px .b { background: url(../grafik/rounded_box/grey1px/dot.png) 0 100% repeat-x} .grey1px .l { background: url(../grafik/rounded_box/grey1px/dot.png) 0 0 repeat-y} .grey1px .r { background: url(../grafik/rounded_box/grey1px/dot.png) 100% 0 repeat-y} .grey1px .bl { background: url(../grafik/rounded_box/grey1px/bl.png) 0 100% no-repeat; } .grey1px .br { background: url(../grafik/rounded_box/grey1px/br.png) 100% 100% no-repeat} .grey1px .tl { background: url(../grafik/rounded_box/grey1px/tl.png) 0 0 no-repeat; } .grey1px .tr { background: url(../grafik/rounded_box/grey1px/tr.png) 100% 0 no-repeat; padding: 1px; } /* add_to_chart 1px */ .add_to_chart .t { background: url(../grafik/rounded_box/add_to_chart/dot_t.png) 0 0 repeat-x; } .add_to_chart .b { background: url(../grafik/rounded_box/add_to_chart/dot_b.png) 0 100% repeat-x} .add_to_chart .l { background: url(../grafik/rounded_box/add_to_chart/dot_l.png) 0 0 repeat-y} .add_to_chart .r { background: url(../grafik/rounded_box/add_to_chart/dot_r.png) 100% 0 repeat-y} .add_to_chart .bl { background: url(../grafik/rounded_box/add_to_chart/bl.png) 0 100% no-repeat; } .add_to_chart .br { background: url(../grafik/rounded_box/add_to_chart/br.png) 100% 100% no-repeat} .add_to_chart .tl { background: url(../grafik/rounded_box/add_to_chart/tl.png) 0 0 no-repeat; } .add_to_chart .tr { background: url(../grafik/rounded_box/add_to_chart/tr.png) 100% 0 no-repeat; padding: 2px; } /* home */ #hem .right .t { background: url(../grafik/rounded_box/add_to_chart/dot_t.png) 0 0 repeat-x; } #hem .right .b { background: url(../grafik/rounded_box/add_to_chart/dot_b.png) 0 100% repeat-x} #hem .right .l { background: url(../grafik/rounded_box/add_to_chart/dot_l.png) 0 0 repeat-y} #hem .right .r { background: url(../grafik/rounded_box/add_to_chart/dot_r.png) 100% 0 repeat-y} #hem .right .bl { background: url(../grafik/rounded_box/add_to_chart/bl.png) 0 100% no-repeat; } #hem .right .br { background: url(../grafik/rounded_box/add_to_chart/br.png) 100% 100% no-repeat} #hem .right .tl { background: url(../grafik/rounded_box/add_to_chart/tl.png) 0 0 no-repeat; } #hem .right .tr { background: url(../grafik/rounded_box/add_to_chart/tr.png) 100% 0 no-repeat; padding: 2px; } /* html body { font-size: 58%; } /* ses bara av IE läs mer: http://www.info.com.ph/~etan/w3pantheon/style/starhtmlbug.html */ html, body { margin: 0; padding: 0; } img, form, fieldset, div, p, a, ul, li, h1 { margin: 0; padding: 0; } img { border: 0; } .clear { clear:both; } p { margin-bottom: 12px; } /* för att ta bort border för radio-knappar */ /* -------------------------------------------------------------------- HEEDINGS OCH TEXTFORMATERING ---------------------------------------------------------------------*/ H1, H2, H3 { font-weight: bold;} H1 { font: bold italic 26px/26px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #4682B4; margin: 0 0 5px; } H1.reditalic { font: bold italic 22px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #DC143C; } H2 { margin: 3px 0 3px; padding: 0; font: bold italic 18px/18px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #4682B4; } H3 { font-size: 1.10em; font-weight: bold; margin: 1px 0; color: #666; } H4 { font: bold 14px/20px Geneva, Arial, Helvetica, sans-serif; color: #FFA500; margin: 3px 0 3px; padding: 0; } .bildtext { font: italic 0.85em/1.5em Verdana, Arial, Helvetica, sans-serif; margin-top: 1px; } .required { color: #C00; font-weight: normal; } .errormsg, .greenmsg { padding: 7px; margin: 5px 0 5px; } .errormsg { color: #F00; border: 2px solid #F00;} .greenmsg { color: #390; border: 2px solid #390;} .noticemsg { color: #369; font-weight: bold; } .pris { color: #DC143C; font-weight: bold; } .submit { margin-top: 10px; } /* -------------------------------------------------------------------- LÄNKAR ---------------------------------------------------------------------*/ a:link, a:visited { color:#1E90FF; font-weight: bold; text-decoration:underline; } a:focus { color:#580801; } a:hover { color:#0000FF; text-decoration:none; } a.imglink:link, a.imglink:visited {border:0;} a.imglink:hover {background:transparent;} a.flag:link, a.flag:visited { border:0; margin: 0; padding: 0; } /* -------------------------------------------------------------------- FORMULÄR ---------------------------------------------------------------------*/ form { } input, select, textarea { width: 200px; text-align: left; padding: 1px; border: 1px solid #CCC; } select { width: 204px; } input.ort, #ort { width: 140px; margin-left: 2px; } input.postnr, #postnr { width: 50px; } input.bbcode-button { width: 60px; } label { color: #000; display: block; margin: 5px 0 0; line-height: 1.10em; } input.submit, input.reset {width: auto; padding: 1px 0 0; text-align: center; color: #369; background-color: #F5F5F5; border: 2px solid #369; } input.submit { font-weight: bold; font-family: tahoma, Geneva, Arial, Helvetica, sans-serif; } input.antal { width: auto; } input.radiobtn, input.checkbox { border: none; width: auto; } /* för att ta bort border för radio-knappar & check-boxar */ input.hidden { display: inline; border: 0; } .required { color: #C00; font-weight: normal; } /* Not supported Explorer. */ input[type=radio], input[type=checkbox] { border: 0; } /* Works in Explorer Mac, Mozilla and Opera. */ input:focus, select:focus, textarea:focus { background-color: #FFF; } /* -------------------------------------------------------------------- DISCBOX ---------------------------------------------------------------------*/ .discbox { float: left; width: 160px; overflow: hidden; height: 195px; text-align: center; font-weight: normal; } .discbox .bild { height: 130px; margin-bottom: 4px; } .discbox a:link, .discbox a:visited { color: #333; text-transform: uppercase; text-decoration: none; } .discbox h1 { margin-top: 3px; font: bold 12px Geneva, Arial, Helvetica, sans-serif; } .discbox p { line-height: 1.20em; margin: 0; padding: 0; color: #999; } .discbox p.typmarkestab { color: #999; font: bold 12px Geneva, Arial, Helvetica, sans-serif; } .discbox p.pris { color: #DC143C; font: bold 12px Geneva, Arial, Helvetica, sans-serif; text-transform: uppercase; } /* -------------------------------------------------------------------- TABELLER ---------------------------------------------------------------------*/ table { margin: 5px 0 10px; border-collapse:collapse; border-spacing:0; } caption { font-style: italic; color: #DC143C; font: bold italic 20px Geneva, Arial, Helvetica, sans-serif; } th, td { padding: 2px 6px 1px; vertical-align: top; } th { font-weight: bold; font-style: normal; text-align: left; text-transform: uppercase; } table.neutral, table.nospace { margin: 0; } table.neutral th, table.neutral td, table.nospace th, table.nospace td { padding: 0; } table.border { border:1px solid #333;} table.border th, table.border td { padding: 6px 5px 3px; border:1px solid #333; } th.right { text-align: right; } table.classic { border:1px solid #DCDCDC; border-width:1px 0; } table.classic th { border:1px solid #999; border-width:1px 0; background-color: #F5F5F5; } table.classic td { border:1px solid #DCDCDC; border-width:1px 0; } table.flight_data { border:1px solid #666; border-width:1px; } table.flight_data th { border:1px solid #666; border-width:1px 1px; background-color: #F5F5F5; } table.flight_data td { border:1px solid #666; border-width:1px 1px; padding: 2px 3px; } table.chartitems { border:1px solid #369; border-width:1px 0; } table.chartitems th { border:1px solid #369; border-width:1px 0; color: #369; background-color: #FFF; } table.chartitems td { border:1px solid #DCDCDC; border-width:1px 0; } /* -------------------------------------------------------------------- enlish ---------------------------------------------------------------------*/ div.english { ; } /* -------------------------------------------------------------------- topp ---------------------------------------------------------------------*/ #header { } #header a:hover { color: #fff; } #header img { } #head h1 { padding-bottom: 1px; border-bottom: 6px solid #9ACD32; } #head { border-bottom: 2px solid #9ACD32; margin-bottom: 15px; padding-bottom: 2.5px; } /* display: inline; görs så att element under inte täcks, hade problem med länkar som det knappt gick att klicka på.. */ /* -------------------------------------------------------------------- Navigation ---------------------------------------------------------------------*/ #nav { background: url(../grafik/gradient/topmenu_gradient.png) } #nav, #nav2 { list-style-type:none; } #nav { background-color: #F5F5F5; padding: 4px 0 1px; border: 3px solid #87CEEB; border-width: 2px 0 3px; } #nav2 { float: right; padding: 6px 0 3px; margin-right: 12px } #nav li, #nav2 li { display:inline; } #nav-om { } #nav-discgolf { padding-left: 20px; } #nav a:link, #nav a:visited, #nav2 a:link, #nav2 a:visited { text-transform: uppercase; text-decoration:none; font-weight: bold; } #nav a:link, #nav a:visited { padding:3px 8px 1px; color:#999; /* 87CEEB */ } #nav-discgolf a:link, #nav-discgolf a:visited, #nav-frisbee a:link, #nav-frisbee a:visited, #nav-dogdisc a:link, #nav-dogdisc a:visited { padding:3px 8px 1px; color:#4682B4; /* 87CEEB */ } #nav2 a:link, #nav2 a:visited { padding:3px 6px 1px; color:#4682B4; } #nav a:hover { color:#fff; background:#9ACD32; } #nav2 a:hover { color:#fff; background:#9ACD32; } #nav #info a:link, #nav #info a:visited, #nav #info a:hover { color: #000; font-weight: normal; border-right: 0; padding-left: 0; } #nav #info a:hover { background: none; } #home #nav-home a, #discgolf #nav-discgolf a, #frisbee #nav-frisbee a, #dogdisc #nav-dogdisc a, #om #nav-om a, #event #nav-event a, #villkor #nav-villkor a, #frakt #nav-frakt a, #koprad #nav-koprad a, #brev #nav-brev a, #download #nav-download a, #faq #nav-faq a, #sek #nav-sek a, #eur #nav-eur a, #usd #nav-usd a { background:#C33; color:#fff; } #home #nav-home a:hover, #discgolf #nav-discgolf a, #frisbee #nav-frisbee a, #dogdisc #nav-dogdisc a, #om #nav-om a:hover, #event #nav-event a:hover, #villkor #nav-villkor a:hover, #frakt #nav-frakt a:hover, #koprad #nav-koprad a:hover, #brev #nav-brev a:hover, #download #nav-download a:hover, #faq #nav-faq a:hover, #team #nav-team a:hover, #sek #nav-sek a:hover, #eur #nav-eur a:hover, #usd #nav-usd a:hover { background:#C33; color:#fff; } #nav a:active { background:#e35a00; color:#fff; } /* -------------------------------------------------------------------- SIDEBAR ---------------------------------------------------------------------*/ #sidebar .box { padding: 3px 10px 3px 15px; border-bottom: 1px solid #DCDCDC; } #sidebar .box_last { padding: 3px 10px 7px 15px; } #sidebar .box .dtree {line-height: 1.60em;} #sidebar input { border: 1px solid #ccc; color: #999; width: 100px; } #sidebar .kundvagn { padding: 7px 10px 7px 15px; border-bottom: 1px solid #DCDCDC; line-height: 14px; } #sidebar .total { margin: 3px 0 0; padding: 3px 0 0; border-top: 1px solid #fff; } #sidebar a { color: #999; font-weight: normal; text-decoration: none; } #sidebar .dtree a { font-weight: bold;} #sidebar p { margin: 0 0 0; } #sidebar h2 { font-weight: bold; margin: 0 0 0; } #sidebar .kundvagn h2 { margin: 0 0 3px; } #sidebar .kundvagn a { color: #1E90FF; margin: 0 0 3px; } #sidebar p#user { } /* -------------------------------------------------------------------- sidebar menu dTree 2.05 | www.destroydrop.com/javascript/tree/ Copyright (c) 2002-2003 Geir Landrö ---------------------------------------------------------------------*/ .dtree { white-space: nowrap; } .dtree img { border: 0; vertical-align: middle; } .dtree a.node, a.node:visited { color: #999; text-decoration: none; white-space: nowrap; padding: 0 2px 1px; } .dtree a.node:hover, .dtree a.nodeSel:hover { color: #666; } .dtree a.nodeSel, a.nodeSel:visited { white-space: nowrap; padding: 1px 2px 1px 2px; color: #FFFFFF; text-decoration: none; } .dtree .clip { overflow: hidden; } .dtree a.n { color: #000; text-decoration: none; } #nedstat { clear: right; margin-top: 10px; } /* -------------------------------------------------------------------- om oss ---------------------------------------------------------------------*/ /* -------------------------------------------------------------------- Topplistan ---------------------------------------------------------------------*/ #topplistan { float: left; width: 35%; margin: 15px 0; margin-right: 20px; padding-top:10px; border: 4px dashed #9ACD32; background:#87CEEB; } #topplistan h1, #topplistan a { color: #FFF; } #topplistan h1 { padding:5px 0 0 20px;} #topplistan ul { list-style:none; margin: 0px; padding:0 0 7px 20px} #topplistan li {color: #FFF; margin: 5px 0;} /* -------------------------------------------------------------------- Search adv ---------------------------------------------------------------------*/ #search_adv { } #search_adv .modell { width: 305px; } #search_adv p { margin:0; } #search_adv h2 { margin: 10px 0 2px; } #search_adv input, #search_adv select { width: 150px; margin: 0 5px 0 0; } #search_adv input.search { width: 315px; } #search_adv input.submit { width: 50px; } #search_adv p.submit { margin-top: 20px; } /* -------------------------------------------------------------------- KATALOG TABELL ---------------------------------------------------------------------*/ #modeller { } #modeller .tabell { width: 450px; font: 12px/15px Arial, Helvetica, sans-serif; margin-top:5px; } #modeller .img { margin-left: 15px; } #modeller .ingress { padding-bottom: 5px; margin-bottom: 15px; border-bottom: 1px solid #9ACD32; } #modeller .poster { margin-bottom: 15px; } #modeller .footer { clear: both; border-top: 1px solid #666; padding-top: 5px; } #modeller form p { margin: 0; padding: 0; } /* These are used by simple search result to produce the table-like result. */ #modeller .tabell .head { border-top: 1px solid #333; border-bottom: 1px solid #333; padding: 2px 0 20px; font-weight:bold; } #modeller .tabell .row { padding: 2px 0 20px; border-top: 1px dotted #ccc; } #modeller .tabell .head a { font-weight:bold; } #modeller .tabell a { color: #666; text-decoration: none; } #modeller .tabell .head, #modeller .tabell .head a { color: #000; } #modeller .tabell a.slut { color: #F00; } #modeller .tabell a.ny { color: #008000; } #modeller .tabell a.favvo { color: #008000; font-weight:bold;} #modeller .tabell .separator { height:1px; overflow:hidden; clear:both; padding:0px; margin:0px; clear:both; } #modeller .tabell .head .nr, #modeller .tabell .row .nr { overflow:hidden; float:left; width:28px; height:20px; padding-left:5px; } #modeller .tabell .head .modell, #modeller .tabell .row .modell { overflow:hidden; float:left; width:165px; height:20px; } #modeller .tabell .head .typ, #modeller .tabell .row .typ { overflow:hidden; float:left; width:105px; height:20px; } #modeller .tabell .head .stab, #modeller .tabell .row .stab { overflow:hidden; float:left; width:40px; height:20px; } #modeller .tabell .head .marke, #modeller .tabell .row .marke { overflow:hidden; float:left; width:68px; height:20px; } #modeller .tabell .head .pris, #modeller .tabell .row .pris { overflow:hidden; float:left; width:38px; height:20px; } .pagination ul{ margin-top: 5px; padding-top: 5px; list-style-type: none; text-align: right; } .pagination ul li{ list-style-image: none; display:inline; padding-left: 7px; } /* -------------------------------------------------------------------- Modell ---------------------------------------------------------------------*/ #modell p.flight_value { margin: 0; padding: 0; font: bold 22px/20px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #000; } #modell p.flight { margin: 0; padding: 0; font: bold 10px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #000; } /* -------------------------------------------------------------------- Orders ---------------------------------------------------------------------*/ /* -------------------------------------------------------------------- KASSAN ---------------------------------------------------------------------*/ #kassan { border:1px dashed #00008B; background-color:#F5F5F5; margin: 0 0 20px; padding: 5px 30px 10px } #kassan label { display: inline; } #kassan .etttvatre { float:right; } #kassan h1 { font-size: 30px; color: #369; } #kassan h2 { color: #369; } #kassan .rub { border-bottom: 6px solid #369; margin-bottom: 10px; padding: 5px 0; } #kassan b.border { display:block; padding: 3px 0; margin-bottom: 5px; border-bottom: 1px solid #1E90FF; } #kassan .next { margin: 15px 0 5px; text-align:right; border-width: 0 } #kassan .next, #kassan .next a { color: #369; font-weight: bold; } #kassan .footer { margin: 15px 0 0; padding: 6px 0; border-top: 3px solid #369; font: 0.85em/1.30em Arial, Helvetica, sans-serif; } #kassan .footer .avbryt { float: right; width: 100px; text-align: right; } #stegett form p { margin: 3px; } #stegett div.loggain { margin: 0 0 10px; } /* -------------------------------------------------------------------- ORDER-PRINT ---------------------------------------------------------------------*/ #content { margin-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 0.85em; line-height: 1.40em; } #order_print table { border-collapse: collapse; border-spacing: 0; border: 1px solid #666; border-width: 1px; } #order_print th, #order_print td { font-size: 10px; border: 1px solid #666; border-width: 1px; } /* ----------------------------------------------------------------------- FDGO -------------------------------------------------------------------------*/ #fdgo { float: left; width: 700px; text-align: left; margin: 20px; } #fdgo h1 {color: #666; font-size: 1.50em; margin: 20px 0; text-transform: none; } #fdgo h2 {color: #FF8C00; margin: 15px 0 5px; } /* ----------------------------------------------------------------------- PREVIEW OCH SCREENSHOT FRÅN http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery -------------------------------------------------------------------------*/ #tooltip{ position:absolute; border:1px solid #333; background:#f7f5d1; padding:2px 5px; color:#333; display:none; } #preview{ position:absolute; border:1px solid #ccc; background:#333; padding:8px; display:none; color:#fff; } #screenshot{ position:absolute; border:1px solid #ccc; background:#333; padding:5px; display:none; color:#fff; } /* ----------------------------------------------------------------------- /* Layout helpers FRÅN NETONET ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { position: absolute; left: -99999999px; } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .ui-helper-clearfix { display: inline-block; } /* required comment for clearfix to work in Opera \*/ * html .ui-helper-clearfix { height:1%; } .ui-helper-clearfix { display:block; } /* end clearfix */ .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } .ui-state-disabled { cursor: default !important; } .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } /* Overlays */ .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ none/*{bgImgUrlOverlay}*/ 0/*{bgOverlayXPos}*/ 0/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; } .ui-widget-shadow { margin: -4px/*{offsetTopShadow}*/ 0 0 -4px/*{offsetLeftShadow}*/; padding: 4px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ none/*{bgImgUrlShadow}*/ 0/*{bgShadowXPos}*/ 0/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .35;filter:Alpha(Opacity=35)/*{opacityShadow}*/; -moz-border-radius: 4px/*{cornerRadiusShadow}*/; -webkit-border-radius: 4px/*{cornerRadiusShadow}*/; } .ui-icon-close { background-image: url('../../Content/images/close.gif'); } .ui-icon-closethick { background: url('../../Content/images/layerClose.gif') no-repeat scroll top center; height: 16px; width: 16px; } .ui-icon-closethick:hover { background: url('../../Content/images/layerClose.gif') no-repeat scroll bottom center; } .ui-icon-closethickOnly { background: url('../../Content/images/layerCloseOnly.gif') no-repeat scroll top center; height: 16px; width: 16px; cursor:pointer;} .ui-icon-closethickOnly:hover { background: url('../../Content/images/layerCloseOnly.gif') no-repeat scroll bottom center; }