 /*
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 {
	/* font-size: 60.5%; */
	background-image:url(../grafik/grafik/chains.gif);
	background-repeat: no-repeat;
	background-position: 150px 125px;
	color: #333;
	font-size: 13px;
	line-height: 16px;
	font-weight: normal;
	font-family: Helvetica Narrow, sans-serif;

}

/* 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 */


/* --------------------------------------------------------------------
	topp
---------------------------------------------------------------------*/
#header {  }
#header a:hover { color: #fff; }
#header img {  }


#head { border-bottom: 2px solid #666; padding: 0 0 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å.. */


/* --------------------------------------------------------------------
HEEDINGS OCH TEXTFORMATERING
---------------------------------------------------------------------*/
H1, H2, H3 { font-family: tahoma, Geneva, Arial, Helvetica, sans-serif; font-weight: bold; padding: 0; margin: 0; }


H1 { font: bold italic 26px/26px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #666; margin: 0 0 10px; }
H1.reditalic { font: bold italic 22px tahoma, Geneva, Arial, Helvetica, sans-serif; color: #DC143C; }
H1.articleList { font-family: Helvetica Narrow, sans-serif; }
#head h1 { border-bottom: 6px solid #8B0000;  }
#discbox H1 { margin: 0; padding: 0; font: normal 14px/16px Helvetica Narrow, sans-serif; }

H2 { font-size: 16px; margin: 3px 0 6px; color: #333;  }
H3 { font-size: 14px; font-weight: normal; margin: 0 0 10px; color: #333; }

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 / LINKS
---------------------------------------------------------------------*/
a:link,
a:visited {
	color:#4682B4;
	font-weight: bold;
	text-decoration:none;
}

a.two:link,
a.two:visited {
	color:#333;
	font-weight: bold;
	text-decoration:none;
}

a.big:link,
a.big:visited {
	font-size: 14px;
}

a.flightspec:link, a.flightspec:visited {
	font-size: 30px;
}


#sidebar a { ; }
#sidebar .dtree a { font-weight: normal; }

a:focus, a.two:focus {
	color:#580801;
	}
	
a:hover:hover, a.two:hover {
	color:#0000FF;
	text-decoration:underline;
	}

.dtree a.node, a.node:visited { 
	color: #666;
	text-decoration: none;
	white-space: nowrap;
	padding: 0 2px 1px;
}
.dtree a.node:hover, .dtree a.nodeSel:hover { color: #00F; text-decoration: underline; }
.dtree a.nodeSel, a.nodeSel:visited  {
	white-space: nowrap;
	padding: 1px 2px 1px 2px;
	color: #FFFFFF;
	text-decoration: none;
}


#discbox a:link, #discbox a:visited { font-weight: bold; text-decoration: none; color:#333;  }
#discbox a:hover { color: #00F; text-decoration: underline; }

	
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; 
	padding: 2px; 
	border: 1px solid #CCC;
}

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.btnSubmit, input.btnReset {
	width: auto; 
	padding: 5px; 
	text-align: center; 
	color: #369; 
	background: #F5F5F5; 
	border: 2px solid #369; 
	font-size: 14px; 
	font-weight: bold;
}


input.btnReset {
	border: 2px solid #999; 
	color: #369; 

}

input.btnSubmit:hover, input.btnReset:hover {
	color: #CCC;
	background: #00F;
	border: 2px solid #CCC;
}
	
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; }


/* --------------------------------------------------------------------
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;
}

table.orderspec {
	width: 600px;
	border:1px solid #999;
	border-width:1px 0 0;
	padding: 3px 0;
	}
table.orderspec th { 
	border:1px solid #000;
	border-width:1px 0;
	padding: 3px 3px;
	background-color: #F5F5F5;
}
table.orderspec td { 
	border:1px solid #DCDCDC;
	border-width:1px 0;
	padding: 3px 3px;
}

table.brands {
	margin: 0;
	border: 0;
	vertical-align: middle;
	text-align: center;
}

table.brands td { 
	padding: 0 3px;
}


/* --------------------------------------------------------------------
Navigation
---------------------------------------------------------------------*/
#nav { background: url(../grafik/gradient/topmenu_gradient.png) }

#nav, #nav2 {  list-style-type:none;  }

#nav {  background-color: #F5F5F5; padding: 6px 0 4px; border: 3px solid #8B0000; border-width: 0 0 1px; }
#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 { 
color: #666;
padding:3px 8px 1px; 
font-size: 13px; 
text-transform: uppercase;
text-decoration:none;
font-weight: bold; 	 
}


#nav2 a:link, #nav2 a:visited { 
padding-right: 6px; 

}

#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,
#about-us #nav-about-us a,
#contact-us #nav-contact-us a,
#event #nav-event a,
#terms #nav-terms a,
#shipping #nav-shipping a,
#guides #nav-guides a,
#newsletter #nav-newsletter 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,
#about-us #nav-about-us a:hover,
#contact-us #nav-contact-us a:hover,
#event #nav-event a:hover,
#terms #nav-terms a:hover,
#shipping #nav-shipping a:hover,
#guides #nav-guides a:hover,
#newsletter #nav-newsletter 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 8px 3px 15px;  border-bottom: 2px solid #DCDCDC;  }
#sidebar .box_last  { padding: 3px 10px 7px 15px;   }

#sidebar .box .dtree { }

#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 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: #666;
	text-decoration: none;
	white-space: nowrap;
	padding: 0 2px 1px;
}
.dtree a.node:hover, .dtree a.nodeSel:hover { color: #00F; text-decoration: underline; }
.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
---------------------------------------------------------------------*/


/* 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 .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; }
#modeller .footer { clear: both; border-top: 1px solid #666; padding-top: 5px; }


 .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; 
 }


/* --------------------------------------------------------------------
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 { ; }
#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;
	z-index: 3;
	border:10px solid #DCDCDC;
	background:#FFF;
	padding:10px;
	display:none;
	color:#333;
	}	
	
#preview{
	position:absolute;
	z-index: 3;
	border:10px solid #DCDCDC;
	background:#FFF;
	padding:10px;
	display:none;
	color:#333;
	}
	
#screenshot{
	position:absolute;
	z-index: 3;
	border:10px solid #DCDCDC;
	background:#FFF;
	padding:10px;
	display:none;
	color:#333;
	}

/* -----------------------------------------------------------------------	
/* 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; }

