/*
    @author: Webway IT Labs
    @comment: please? replase all relative paths to absolute (delete all "..") 
*/

/* =Reset */
@import url("wwcss/reset-fonts.css");

/* =Layout */
@import url("wwcss/wwlayout.css");

/* =Base */
@import url("wwcss/base.css");


html{ background-color:#e4e4e4; }

body{
    background:#e4e4e4 url(../_pic/bg-main-gradient.jpg) repeat-x top left;
    color:#3f3f3f;
    font:normal 62.5%/140% Arial, Helvetica, sans-serif;
    height:100%;
}

.my-menu {
	height: 10px ! important;
}

a{
    cursor:pointer;
    color:#3f3f3f;
	text-decoration:underline;
}

ul li{
    background:transparent url(../_pic/bullet-data-light.png) no-repeat scroll 0pt 0.5em;
    margin:0.25em 0 0.3em 22px;
    padding:0.25em 22px 0.22em;
}
ol li{
    margin:0.25em 0 0.3em 22px;    
}

p{
    margin:0.6em 0 1em;
}

input{
    color:#4f4f4f;
    font-size:1em;    
}
input.text{
    background-color:#1a1a1a;
    border:1px solid #333333;
    font-family:Arial, Helvetica, sans-serif;
	 color: Silver;
}
input.text:focus,
textarea:focus{
    border-color:#4f4f4f;
}

/* =graphic links */
.ico-plus{
    background-image:url(../_pic/ico-plus.png);
    width:31px;height:31px;
}

.ico-home,.ico-mail,.ico-map{
    background-image:url(../_pic/ico-topnav.png);
    width:12px;height:9px;
}
.ico-home{ background-position:0px top; }
.ico-mail{ background-position:-12px top; }
.ico-map{ background-position:-25px top; }

.bullet,
.bullet-cardio{
    padding-left:19px;
}
#orange .bullet,
.bullet-cardio{ background-image:url(../_pic/bullet-cardio.png); }
#blue .bullet{ background-image:url(../_pic/bullet-blue.png); }

.cat-search{ 
    background-image:url(../_pic/ico-search.png);
    background-position:right center;
    width:172px;
    padding:10px 0;
}

.menu-open{
    background-image:url(../_pic/h-menu-open.png);
    width:69px;height:6px;
    font-size:6px;    
}
.btn-close{
    background-image:url(../_pic/btn-close.png);
    width:92px;height:44px;
}

.hkettler{
    background-image:url(../_pic/h-h1-kettler.png);
    width:96px;height:14px;    
}

.hcatsearch{
    background-image:url(../_pic/h-cat-search.png);
    background-position:left center;
    width:138px;height:7px;
}

.hcaption .graph{
    height:10px;
}

.hcaption .btn-sh-l{
    position:static;
}

/* =shadowed box */
/*******************************************************************/
.shb{
    /*display:block;*/
    float:left;
    display:inline-block;
    max-width:590px;
    position:relative;
    z-index:1;
}
.shb:after{
    content:'';
    clear:both;
    display:block;
}
.shb .c{
    display:block;
    margin:0 0 -21px 0;
    padding:11px 15px 17px 15px;
    position:relative;top:0px;left:0px;
    z-index:2;
}
#sbright .shb .c{ padding:9px 13px 15px; }
.shb .t,
.shb .b{
    position:absolute;
    top:0px;
    left:0px;
    right:20px;
    bottom:0px;
    z-index:1;
    overflow:hidden;
}
.shb .b{
    top:auto;
    bottom:-21px;
    height:21px !important;
}
.shb .r{
    left:auto;
    right:0px;
    width:20px !important;
}
.shb .t *,
.shb .b *{
    background:url(../_pic/shadowed.png) no-repeat 0 0;
    width:590px;
    height:587px;
    position:absolute;
    left:0px;top:0px;
}
.shb .t *{ margin-top:-21px; }
.shb .l *{ margin-left:-19px; }
/****************************************************************/

.shb.grey{ margin-bottom:30px; }

.shb.grey .c{ padding:6px 11px 12px 10px; }
.shb .c table.navi{
    background-color:#b5b5b5;
    width:100%;
    /*width:auto;*/
}
.shb .c table.navi td{
    padding:6px;
    text-align:center;
}
.shb .c table.navi a{ 
    color:#eee;
    text-decoration:none;
}
.shb .c table.navi a:hover,
.shb .c table.navi span{
    color:#3f3f3f;
}
.shb .c table.navi span{
    background:transparent url(../_pic/bullet-thin-grey.png) no-repeat 0 0.2em !important;
    padding-left:14px !important;
}

/* shadowed button */
.btn-sh-l,
.btn-sh-r{
    background:transparent no-repeat left top;
    display:block;
    float:left;
    height:43px;
    vertical-align:top;
}
.btn-sh-l{
    background-image:url(../_pic/btn-sh-body.png);
    position:relative;
    top:0px;left:0px;
}
.btn-sh-l .graph{
    position:absolute;
    top:17px;left:16px;
    z-index:100;
}
.btn-sh-r{
    background-image:url(../_pic/btn-sh-r.png);
    width:11px;
}

.active .btn-sh-l{ background-image:url(../_pic/btn-sh-body-act.png); }
.active .btn-sh-r{ background-image:url(../_pic/btn-sh-r-act.png); }

.box-glass .icaption{
    position:absolute;
    bottom:10px;left:10px;
    text-decoration:none;
}
.card .icaption{
    top:10px;left:0px;
    bottom:auto;
}
.box-glass .shb .iconed{
    background-position:left 0.145em;
    /*font-size:1em;*/
    font-size:10px;
    line-height:13px;
    margin:0 4px 0 4px;
}

.cat-item{ margin-bottom:30px; }
.cat-item.plused{
    padding:0 0 50px;
}

/* item_card */

#item-card .plused{
    padding:49px 0 35px 15px;
    /*float:left;*/
}

.cat-item.fright{
    display:inline;
    padding-right:2%;
}

.icaption{
    margin:0;
    padding:0;
}
.icaption .btn-sh-l{
    background-image:url(../_pic/icaption-bg-flesh.png);
}
.icaption .btn-sh-r{
    background-image:url(../_pic/icaption-bg-r.png);
    width:11px;
}


/* =OUTSIDE=== */
#outside{
    min-height:100%;
}

/* =HEAVEN========================= */
#heaven{
    position:static;
    top:0px;left:0px;
}
#heaven .plused{
    float:left;
	height:auto;
    padding:0 0 14px 19px;
    position:relative;
    top:35px;left:130px;
    z-index:100;
}
#heaven .btn-sh-l{
    width:98px;
}

/* =HEAD=========================== */
#logo-main{
    display:block;
    float:left;
}

#catsearch{
    position:absolute;
    top:28px;right:4.893%;
}

/* =BODY=========================== */
/* ==sidebar=LEFT */
#sbleft{
/*	position:relative;*/
}
#sbleft .hd,
#sbleft #mleft{
	padding:0 0 0 47px;
}

#sbleft #mleft{
    background:transparent url(../_pic/sbar-left-bg.png) no-repeat 0 0;
	min-height:252px;
}
#sbleft ul.vert{
    margin-left:-26px;
    padding-top:46px;
	position:relative;
}
#sbleft ul.vert li{
    margin:0 0 13px;
}
#sbleft ul.vert li a,
#sbleft ul.vert li span{
    background:transparent no-repeat left center;
    height:8px;
    padding-left:26px;
}
#sbleft ul.vert li .graph{
    height:9px;
}

/* =Cardios */
#sbleft ul.vert li#cardio .graph{
    background-image:url(../_pic/mleft/h-lm-cardio.png);
    width:106px;
}
#sbleft ul.vert li#cardio a.graph:hover,
#sbleft ul.vert li#cardio span.graph{
    background-image:url(../_pic/mleft/h-lm-cardio_a.png);
}
/* =Powers */
#sbleft ul.vert li#power .graph{
    background-image:url(../_pic/mleft/h-lm-power.png);
    width:115px;
}
#sbleft ul.vert li#power a.graph:hover,
#sbleft ul.vert li#power span.graph{
    background-image:url(../_pic/mleft/h-lm-power_a.png);
}
/* =Sceme */
#sbleft ul.vert li#scheme .graph{
    background-image:url(../_pic/mleft/h-lm-scheme.png);
    width:143px;
}
#sbleft ul.vert li#scheme a.graph:hover,
#sbleft ul.vert li#scheme span.graph{
    background-image:url(../_pic/mleft/h-lm-scheme_a.png);
}
/* =Why KETTLER */
#sbleft ul.vert li#whykettler .graph{
    background-image:url(../_pic/mleft/h-lm-why-kettler.png);
    width:157px;
}
#sbleft ul.vert li#whykettler a.graph:hover,
#sbleft ul.vert li#whykettler span.graph{
    background-image:url(../_pic/mleft/h-lm-why-kettler_a.png);
}

/* ==sidebar=RIGHT*/
#sbright .plused{
    padding:0 0 35px 14px;
    margin:0 auto;
    /*width:250px;*/
}

/* == */
#content .hcaption{
    clear:both;
    display:block;
    float:left;
    margin:0;
    padding:0;
    
    overflow:hidden; /* TESTME */
}

#content .hcaption.arrowed{
    background:transparent url(../_pic/blue/bullet-blue.png) no-repeat right center;
    padding-right:15px;
}

#content .btn-sh-l .graph,
#content .btn-sh-l input{
    margin:16px 6px 0 13px;
    position:static;
}

#content .hcaption.active{
    margin-bottom:11px;
}

#content table.data{
    margin-left:2px;
    width:100%;
}
#content table.data th,
#content table.data td{
    padding:0.35em 0.7em 0.25em;
    vertical-align:top;
}
#content table.data th{
    width:48%;
}
#content table.data th.arrowed{
    background:transparent url(../_pic/bullet-data-light.png) no-repeat 0 0.65em;
    padding-left:22px;
}
#content table.data th.arrowed.dark{
    background-image:url(../_pic/bullet-data-dark.png)
}

/* =FOOTTER======================== */
/* ==kettler slogan */
#kettler{
    background:transparent url(../_pic/slogan-bot-bg.png) no-repeat bottom left;
}

/* ==bottom=menu */
#ft #menu-bottom{
    background:#2b2312 url(../_pic/menu-bot-bg.png) repeat-x top left;
}
#ft #menu-bottom table td{
    border-right:1px solid #474031;
    padding:7px 4px 6px;
    text-align:center;
    vertical-align:middle;
    width:14.28%;
}
#ft #menu-bottom table td.first{ text-align:left; }
#ft #menu-bottom table td.last{ text-align:right;border:none; }

#ft #menu-bottom table td a,
#ft #menu-bottom table td span{ text-align:left; }

#ft #menu-bottom table td .graph{ margin:0 auto; }
#ft #menu-bottom table td.first .graph,
#ft #menu-bottom table td.last .graph{ margin:0 }

#ft #menu-bottom table td.last .graph{ float:right; }

#ft .colcontainer{
    background-color:#000;
}

/* ==form=search=bottom */
#ft-search,
#ft-search input{
    vertical-align:middle;
}
#ft-search input.text{
    margin-right:9px;
}

/* =MENU=curtains=================== */
#curtain,
#mc{
    display:none;
    position:absolute;
}
#curtain{
    background:transparent url(../_pic/bg_basic.png) repeat top left;
    position:fixed;
    top:0px;left:0px;
    width:100%;
    height:100%;
    z-index:100;
    opacity:0.9;
}
#mc{
    padding-left:70px;
    padding-bottom:23px;
    top:189px;left:88px;
    z-index:101;
}

/* ==main=menu */
#mmenu{
    position:relative;
    top:0px;left:0px;
    width:798px;
    height:128px;
}
#mmenu #bg{
    background: transparent url(../_pic/mmenu-bg.png) no-repeat top left;
    width:918px;
    height:128px;
}
#mmenu .graph{ position:static; }

#mc #mmenu h1,
#mmenu ul#menu-flow{
    left:41px;
}
#mc #mmenu h1{
    position:absolute;
    top:43px;
}
#mmenu ul{
    position:absolute;
}

/* ===menu-flow */
#mmenu ul#menu-flow{
    border-top:1px solid #808080;
    padding-top:7px; 
    width:712px;
    bottom:31px;
}
#mmenu ul#menu-flow li{
    float:left;
    margin-right:15px;
}

/* ===topnav */
#mmenu ul#topnav{
    top:48px;right:52px;
}
#mmenu ul#topnav li{
    float:left;
    height:9px;
    margin-left:18px;
}


/* ==MENU=(MAIN/BOTTOM)========= */
#mmenu ul#menu-flow li,
#mmenu ul#menu-flow li .graph,
#menu-bottom .graph{
    height:10px;
}
#mmenu ul#menu-flow li a.graph:hover,
#mmenu ul#menu-flow li a.graph:active,
#mmenu ul#menu-flow li span.graph,
#menu-bottom a.graph:hover,
#menu-bottom a.graph:active,
#menu-bottom span.graph{
    background-position:left bottom;
}

#hd #logo-main,
#ft #menu-bottom,
#ft #hell{
    position:relative;
    top:0px;left:0px;
    z-index:999;
}


/* =CONTENT==================== */
p.iconed{
    font-size:1em;
}

#outside,
#ft{
    font-size:1.1em;
}
#content{
    text-align:justify;
}

#content form{
    clear:both;
}
#content form fieldset{
    margin:7px 0 10px 5px;
}
#content form fieldset dl{
    margin-left:-2px;
}
#content form dt,
#content form dd{
    margin:0px 0 12px 0;
    text-align:left;
}
#content form input.text{
    background-color:#fff;
    border:1px solid #73d9f2;
    font-size:1em;
    font-weight:normal;
    margin:0 0.2em;
}
#content form p{
    margin:0.3em 0 0.3em 20px;
}
#content form p.iconed{
    background:transparent url(../_pic/bullet-base.png) no-repeat left 0.35em;
    font-weight:bold;
    margin-left:0;
    padding:0 0 0 20px;    
}

/* =CAT=TITLE=ITEMS============= */
.cat-item-doll{
    background:transparent no-repeat top left;
    display:block;
    position:absolute;
    /*z-index:99;*/
}

/* ==MAIN=PAGE */
#impowers{
    top:95px;left:18.7272%;
}
#impowers div{
    background-image:url(../_pic/_main/m-powers.png);
    width:181px;height:307px;
}
#impowers div img{
    position:relative;
    top:0px;left:0px;
    z-index:26;
}
#imcardios{
    top:14px;right:4.091%;
}
#imcardios div{
    background-image:url(../_pic/_main/m-cardios.png);
    width:663px;height:513px;
}
#imcardios div img{
    position:relative;
    top:0px;left:0px;
    z-index:23;
}

/* ==CATALOGUE */
#icardios{
    top:116px;left:16.895%;
}
#icardios img{
    background-image:url(../_pic/cat_basic/item-cardios.png);
    width:231px;height:357px;
}
#ipowers{
    top:25px;left:50%;margin-left:-110px;
}
#ipowers img{
    background-image:url(../_pic/cat_basic/item-powers.png);
    width:272px;height:526px;
}
#iothers{
    top:145px;right:6.266%;
}
#iothers img{
    background-image:url(../_pic/cat_basic/item-others.png);
    width:300px;height:292px;
}

/* ===CARDIOS */
#ivelo{
    top:96px;left:27.091%;
}
#ivelo div{
    background-image:url(../_pic/red/item-velo.png);
    width:227px;height:312px;
}
#ivelo div img{
    position:relative;
    top:0px;left:0px;
    z-index:26;
}
#ielipt{
   top:8px;right:21.455%;
}
#ielipt div{
    background-image:url(../_pic/red/item-elipt.png);
    width:396px;height:422px;
}
#ielipt div img{
    position:relative;
    top:0px;left:0px;
    z-index:25;
}
#irunroad{
   bottom:-20px;right:1.545%;
}
#irunroad div{
    background-image:url(../_pic/red/item-runroad.png);
    width:550px;height:379px;
}
#irunroad div img{
    position:relative;
    top:0px;left:0px;
    z-index:24;
}
#igrebn{
    bottom:4px;left:8.8182%;
}
#igrebn div{
    background-image:url(../_pic/red/item-grebn.png);
    width:330px;height:221px;
}
#igrebn div img{
    position:relative;
    top:0px;left:0px;
    z-index:23;
}

/* ===POWERS */
#ifreew{
    top:48px;left:18%;
}
#ifreew div{
    background-image:url(../_pic/grey/item-freew.png);
    width:269px;height:380px;
}
#ifreew div img{
    position:relative;
    top:0px;left:0px;
    z-index:25;
}
#iacsess{
    bottom:2px;left:16%;
}
#iacsess div{
    background-image:url(../_pic/grey/item-acsess.png);
    width:233px;height:119px;
}
#iacsess div img{
    position:relative;
    top:0px;left:0px;
    z-index:23;
}
#iskam{
    bottom:22px;right:6.1819%;
}
#iskam div{
    background-image:url(../_pic/grey/item-skam.png);
    width:300px;height:291px;
}
#iskam div img{
    position:relative;
    top:0px;left:0px;
    z-index:23;
}
#ibuildinw{
    bottom:2px;left:50%;
    margin-left:-110px;
}
#ibuildinw div{
    background-image:url(../_pic/grey/item-biuldinw.png);
    width:315px;height:590px;
	/*
    background-image:url(../_pic/grey/item-biuldinw_01.png);
    width:335px;height:590px;*/
}
#ibuildinw div img{
    position:relative;
    top:0px;left:0px;
    z-index:23;
}

/* =ITEM-CARD */
#card-deco{
    position:absolute;
    top:168px;
    *top:169px;
    left:75%;
    display:inline;
    float:none;
    margin-left:-23px;
}

#item-card{
    position:relative;
    top:0px;left:0px;
    width:100%;
}
#photo1,
#photo2,
#photo3{
    float:none;
    position:absolute;
    z-index:25;
}
#photo1{
    top:308px !important;
    left:75% !important;
    margin-left:-160px;
}
#photo2{
    top:396px !important;
    left:75% !important;
    margin-left:-74px;
}
#photo3{
    top:484px !important;
    left:75% !important;
    margin-left:12px;
}


/* =RED */
body#root,
body#red{
     background-image:url(../_pic/red/bg-main-gradient.jpg);
}

/* =BLUE */
body#blue{
     background-image:url(../_pic/blue/bg-main-gradient.jpg);
}

/* =GREEN */
body#green{
     background-image:url(../_pic/green/bg-main-gradient.jpg);
}

/* =ORANGE */
body#orange{
     background-image:url(../_pic/orange/bg-main-gradient.jpg);
}

/* =GREY */
body#grey{
     background-image:url(../_pic/grey/bg-main-gradient.jpg);
}

/* =AUTHOR */
body#author{
     background-image:url(../_pic/author/bg-main-gradient.jpg);
}

.red {
	color: Red;
}

a.bmenu { color: #8B7B59; text-decoration: none; font-family: Arial; font-size: 10px; }
a.bmenu:hover, span.bmenu { color: #AFA796; font-family: Arial; font-size: 10px; }

a.umenu { color: #504C4C; text-decoration: none; font-family: Arial; font-size: 10px; font-weight: bold; }
a.umenu:hover, span.umenu { color: #F0EFEF; font-family: Arial; font-size: 10px; font-weight: bold; }


.newheader {
	font-family: "Arial Black";
	font-weight: bold;
	font-size: 18px;
	color: Black;
}

a.mmenu { color: #1F1F1F; text-decoration: none; font-family: Tahoma; font-size: 9px; }
a.mmenu:hover, span.mmenu { color: #ECECEC;  font-family: Tahoma; font-size: 9px; }
/* where */
td.border {padding: 2px 10px; margin: 1px; border: 1px solid Silver;}
tr.light {background-color: #EAEAEA;}