* {
 margin: 0;
 padding: 0;
 border: 0;
}

body { 
 font-family: "Arial CE", "Helvetica CE", Geneva, Swiss, sans-serif;
 font-size: 11px; 
 color: #fff;
 background-color: #151515;
 margin: 15px 0;
 text-align: center;
}

a:link, a:hover, a:visited {
 color: #58a1c7; 
}

#page {
 width: 900px;
 margin: 0 auto;
 position: relative;
 overflow: hidden;
 text-align: left;
 background: #151515 url(../img/bg-page.png) left bottom repeat-x;
}

h1 {
 text-align: right;
}

h1 span, hr, .invi, #products a span {
 display: none;
}

/* Menu -------------------------------------------------------------------------------------------------------- */

ul#menu {
 margin-top: 16px;
	list-style: none;
	font-weight: bold;
	width: 100%;
	height: 31px;
}

ul#menu li {
	float: left;
	margin-right: 4px;
	background: #151515 url(../img/bg-menu.png) left top no-repeat;
}

ul#menu li a {
	text-decoration: none;
	color: #58a1c7;
	display: block;
	width: 133px;
	height: 31px;
	font-size: 14px;
	text-align: center;
	line-height: 2.2em;
	background: #151515 url(../img/bg-menu.png) left top no-repeat;
}

ul#menu li#act {
	color: #fff;
	background: #151515 url(../img/bg-menu-hover.png) left top no-repeat;
}

ul#menu li#act a {
	color: #fff;
	background: #151515 url(../img/bg-menu-hover.png) left top no-repeat;
}

ul#menu li a:hover {
	color: #fff;
}

/* HP ---------------------------------------------------------------------------------------------------------- */

#hp {
 background: url(../img/bg-header1.png) left top repeat-x;
 overflow: hidden;
 position: relative;
	width: 100%;
 margin-bottom: 41px;
}

h4#slogan {
 font-size: 18px;
 position: absolute;
 top: 110px;
 left: 317px;
 z-index: 2;
}

#hpmain {
 width: 550px;
 float: left;
}

#products {
 margin: 98px 0 0 20px;
 overflow: hidden;
 position: relative;
	width: 500px;
	background: url(../img/col-hp.gif) 135px 0px no-repeat; 
}	

#triocms, #trioshp, #trioseo {
 width: 134px;
 float: left;
 margin-right: 9px;
}	

#trioshp {
 margin-right: 11px;
}	

#products h3 a {
 display: block;
 height: 153px;
}

#triocms h3 a {
 background: url(../img/btn-cms1.png) left top no-repeat; 
}		

#trioshp h3 a {
 background: url(../img/btn-shp1.png) left top no-repeat; 
}		

#trioseo h3 a {
 background: url(../img/btn-seo1.png) left top no-repeat; 
}		

#products p {
 color: #ccc;
 margin: 13px 10px;
}

#products p.next {
 margin-top: 20px;
 text-align: right;
}

#products p.next a {
 font-weight: bold;
}

#products p.next a:hover {
 color: #fff;
} 

/* VIP --------------------------------------------------------------------------------------------------------- */

#vip {
 position: relative;
 overflow: hidden;
 left: 0;
 top: 31px;
 float: left;
 width: 500px;
 height: 82px;
 background: url(../img/vip.gif) 17px 52px no-repeat;
 padding-bottom: 3px;
}

#vip h2 {
 background: url(../img/linehp.png) left top no-repeat;
 color: #58a1c7;
 font-size: 14px; 
 margin-bottom: 10px;
 padding: 20px 0 0 15px;
}

#vip div {
 float: left;
 margin-right: 6px;
}

#vip #userbox {
 padding-left: 65px;
 margin-right: 12px;
}

#vip label {
 display: block;
 margin-bottom: 3px;
}

#vip input {
 padding: 1px 2px;
 width: 115px;
 height: 15px;
 font-size: 11px;
 background-color: #ccc;
}

#vip input.sbmt {
 margin-top: 14px;
 width: 25px;
 height: 21px;
 background: none;
}

/* Novinky ----------------------------------------------------------------------------------------------------- */

#hpside, #side, #refside {
	float: right;
	width: 317px;
 background: url(../img/bg-animal1.png) 0px 30px no-repeat;
}

#side {
 background: url(../img/bg-animal2.png) 0px 7px no-repeat;
}		

#refside {
 background: url(../img/bg-animal4.png) 0px 6px no-repeat;
}

#hpside h2, #side h2 {
 margin: 213px 0 30px 7px;
 font-size: 14px;
}

#side h2 {
 margin: 151px 0 30px 7px;
 font-size: 14px;
}

#refside h2 {
 margin: 151px 0 29px 7px;
 font-size: 14px;
}

#refside h2 a {
 color: #fff;
 text-decoration: none;
}

#refside h2 a:hover {
 text-decoration: underline;
}

#news {
 background: url(../img/bg-news.png) left bottom no-repeat; 
 margin-left: 7px;
 width: 285px;
}

#news h3 {
 margin: 8px 0 6px 15px;
 font-size: 12px;
 color: #58a1c7; 
}

#news h3 a {
 text-decoration: none;
 font-size: 12px;
}

#news h3 a:hover {
 text-decoration: underline;
}

#news p {
 margin: 0 15px;
 padding-bottom: 16px;
 color: #ccc;
 line-height: 1.2em;
 background: url(../img/line.jpg) left bottom repeat-x; 
}

#news p a {
 color: #58a1c7;
}

#news p a:hover {
 color: #fff;
}

#news p.noborder {
 background: none; 
}

/* Stranka ----------------------------------------------------------------------------------------------------- */

#big {
 background: url(../img/bg-header2.png) left top repeat-x;
 overflow: hidden;
 position: relative;
	width: 100%;
 margin-bottom: 17px;
}

#main {
 width: 530px;
 float: left;
 padding-left: 15px;
}

#main p {
 font-size: 12px;
}

#main ul {
 margin: 15px 25px;
}

#main li {
 color: #ccc;
 font-size: 12px;
 list-style-type: none;
 background: url(../img/bullet.gif) 0px 6px no-repeat;
 padding-left: 12px;
 margin-bottom: 5px;
}

#cont h3  {
 color: #fff;
 margin: 20px 0 10px 25px;
 font-size: 14px;
}

.bg2 {
 background: url(../img/bg-o-spolecnosti.png) 30px 24px no-repeat;
}

.bg4 {
 background: url(../img/bg-reference.png) 30px 24px no-repeat;
}

.bg5 {
 background: url(../img/bg-kontakt.png) 30px 24px no-repeat;
}

.bg2 h2, .bg3 h2, .bg4 h2, .bg5 h2 {
 margin: 126px 0 0 178px;
 color: #ff0;
 font-size: 16px;
}

/* Adresa ------------------------------------------------------------------------------------------------------ */

#main address {
 font-style: normal;
 line-height: 1.5em;
 margin: 47px 0 -300px 10px;
 width: 130px;
 float: left;
}

#main address span {
 position: relative;
 top: -5px;
}

#main address a:hover {
 color: #fff;
}

/* Kontakt ----------------------------------------------------------------------------------------------------- */

#contform {
 width: 350px;
 margin: 45px 0 25px 178px;
}

#contform fieldset {
 padding: 7px 45px 0 38px;
 background: url(../img/col-kont.gif) 0px 0px repeat-y;
}

#contform fieldset h3 {
 margin: 0 0 18px 0;
 font-size: 11px;
}

#contform label {
 display: block;
 margin-bottom: 3px;
}

#contform input {
 padding: 1px 2px;
 width: 115px;
 height: 15px;
 font-size: 11px;
 margin: 0 1px 15px 0;
 background-color: #ccc;
}

#contform textarea {
 padding: 1px 2px;
 width: 98%;
 height: 100px;
 font-size: 11px;
 line-height: 1.3em;
 margin-bottom: 15px;
 font-family: "Arial CE", "Helvetica CE", Geneva, Swiss, sans-serif;
 background-color: #ccc;
}

#contform fieldset p {
 color: #fff;
 font-size: 11px;
 margin-left: 0;
}

#contform fieldset p.inputright {
 float: right;
}

#contform p {
 color: #ccc;
 font-size: 11px;
 margin-left: 38px;
}

#contform input.sbmt {
 width: 90px;
 margin: 0 43px 7px 0;
 float: right;
 height: 20px;
 background: none;
}

/* O spolecnosti	----------------------------------------------------------------------------------------------- */

#company {
 width: 350px;
 margin: 45px 0 25px 178px;
 background: url(../img/col-kont.gif) 0px 0px repeat-y;
 overflow: hidden;
}

#company h3 {
 margin: 20px 0 10px 25px;
 font-size: 14px;
}

#company h3 a:hover {
 color: #fff;
}

#company p {
 color: #ccc;
 margin: 0 25px 10px 25px;
}

#company p a:hover, .bg3 p a:hover {
 color: #fff;
}

/* Sluzby	------------------------------------------------------------------------------------------------------ */

#content img {
 margin: 0 0 5px 25px;
}

#main.bg3 {
 width: 662px;
}

#main.bg3 div {
 border-right: 1px solid #000;
}

#main.bg3 div.cleaner {
 height: 5px;
 border: 0;
}

.bg3 h2 {
 margin: 126px 0 12px 0;
 padding-bottom: 8px;
 background: url(../img/line.png) left bottom no-repeat;
}

.bg3 p {
 color: #ccc;
 margin: 0 25px 10px 0;
}

div#products.prod {
 width: 620px;
 margin: 50px 0 0 0;
 border: 0;
 margin-bottom: 25px;
 background: url(../img/col-sl.gif) 165px 0px no-repeat;
}

#products.prod p, #products.prod a {
 font-size: 11px;
}

#products.prod #triocms, #products.prod #trioshp, #products.prod #trioseo {
 margin-right: 68px;
 border: 0;
}

#products.prod #triocms h3 a {
 background: url(../img/btn-cms2.png) left top no-repeat;
}		

#products.prod #trioshp h3 a {
 background: url(../img/btn-shp2.png) left top no-repeat;
}		

#products.prod #trioseo h3 a {
 background: url(../img/btn-seo2.png) left top no-repeat;
}		

/* Submenu	----------------------------------------------------------------------------------------------------- */

#submenu {
	float: right;
	width: 207px;
	margin-bottom: 20px;
 background: url(../img/bg-animal3.png) 0px 7px no-repeat;
}

#submenu ul {
 width: 190px;
 margin-top: 150px;
 border-bottom: 1px solid #444;
}

#submenu li {
 border-top: 1px solid #444;
 list-style: none;
}

#submenu ul li a, #submenu ul li a:visited {
 display: block;
 width: 100%;
 padding: 10px 1px;
 text-decoration: none;
 font-weight: bold;
 color: #ccc;
}

#submenu ul li a:hover {
 color: #ff0;
}

#submenu ul li#sact {
 color: #ff0;
 font-weight: bold;
 padding: 10px 1px;
}

/* Sluzby sub -------------------------------------------------------------------------------------------------- */

.sl1 {
 background: url(../img/bg-www.png) 29px 24px no-repeat;
}

.sl2 {
 background: url(../img/bg-int-aplikace.png) 29px 24px no-repeat;
}

.sl3 {
 background: url(../img/bg-hosting.png) 29px 24px no-repeat;
}

.sl4 {
 background: url(../img/bg-triocms.png) 30px 25px no-repeat;
}

.sl5 {
 background: url(../img/bg-trioshop.png) 29px 25px no-repeat;
}

.sl6 {
 background: url(../img/bg-trioseo.png) 29px 25px no-repeat;
}

#cont h2 {
 margin: 126px 0 0 178px;
 color: #ff0;
 font-size: 16px;
 padding: 0;
 background: none;
}

#cont div#content {
 width: 470px;
 margin: 45px 0 20px 178px;
 background: url(../img/col-sluz.gif) 0px 0px repeat-y;
 overflow: hidden;
 border: 0;
}

#content p {
 color: #ccc;
 margin: 0 25px 10px 25px;
}

#content p a:hover {
 color: #fff;
}

#main div#leftcol {
 margin: 195px 0 -5000px 10px;
 width: 130px;
 float: left;
 border: 0;
}

#main div#leftcol h3 {
 font-size: 11px;
}

#main div#leftcol p {
 font-size: 11px;
 color: #fff;
}

#main div#leftcol div {
 width: 92px;
 height: 65px;
 background: #DADADA;
 border: 1px solid #bebebe;
 float: left;
 margin: 18px 14px 5px 0;
 text-align: center;
} 

#main div#leftcol div img {
 margin-top: 8px;
} 

/* Reference --------------------------------------------------------------------------------------------------- */

#ref {
 width: 350px;
 margin: 45px 0 0 178px;
 background: url(../img/col-kont.gif) 0px 0px repeat-y;
 overflow: hidden;
 padding-left: 19px;
}

#ref div {
 width: 92px;
 height: 65px;
 background: #DADADA;
 border: 1px solid #bebebe;
 float: left;
 margin: 0 14px 14px 0;
 text-align: center;
} 

#ref div img {
 margin-top: 8px;
} 

#count {
 width: 350px;
 margin: 28px 0 25px 178px;
 text-align: center;
 font-weight: bold;
 font-size: 12px;
}

#count a {
 color: #8dc70e;
}

#count a:hover {
 color: #fff;
}

/* Paticka ----------------------------------------------------------------------------------------------------- */

#foot {
 overflow: hidden;
 width: 100%;
} 

#foot p {
 float: left;
} 

#foot span {
 float: right;
}

#foot span a {
 color: #fff;
 text-decoration: none;
}

#foot span a:hover {
 text-decoration: underline;
}

img.host-icon {
 float: left;
}

#content .price {
 color: #58a1c7; 
}

#content div {
 width: 100%;
 overflow: hidden;
}

#content h3 {
 color: #ff0;
}

#content h4 {
 margin: 20px 0 10px 25px;
 font-size: 14px;
}

#content div p {
 padding-left: 50px;
}