﻿/* ~-~-~-~-~-~-~-~-~ IT-PRO (www.it-pro.cz) ~-~-~-~-~-~-~-~-~ */
/* ~-~-~-~-~ gfx via CSS: IdeFixx (www.sucharda.cz) ~-~-~-~-~ */
@font-face {
	font-family: 'MuseoSans500';
	src: url('./fonty/MuseoSans_500.eot');
	src: local('Museo Sans 500'), local('MuseoSans-500'), url('./fonty/MuseoSans_500.woff') format('woff'), url('./fonty/MuseoSans_500.ttf') format('truetype');
}
/* ~-~ THX to (exljbris): http://www.exljbris.nl ~-~ */

body { margin: 0; padding: 0;
	   font: .8em/1.2 "Verdana CE", Verdana, "Arial CE", Arial, "Lucida Grande CE", "Helvetica CE", lucida, sans-serif;
	   color: #3b3b3b;
	   background: #d7d7d7 url("bg.jpg") 50% 0 fixed no-repeat;
}

/* ~-~ common ~-~ */
h1, h2, h3, h4, h5, h6 { margin: 0 0 .1em 0; padding: .2em 0 0 0; font: normal 1.3em/1.2 'MuseoSans500', "Verdana CE", Verdana, "Arial CE", Arial, "Lucida Grande CE", "Helvetica CE", lucida, sans-serif; color: #3b3b3b; text-shadow: #dbdbdb 0 1px 0; clear: both; }
h2, h3, h4, h5, h6 { margin: .4em 0 .2em 0; }
h1, h2 { color: #01407f; text-shadow: #bddbff 0 1px 0; }
h1 { padding: 0; font-size: 2em; }
h2 { font-size: 1.5em; }
.font { font-family: 'MuseoSans500', "Verdana CE", Verdana, "Arial CE", Arial, "Lucida Grande CE", "Helvetica CE", lucida, sans-serif; }

a:link { color: #3b3b3b; border-bottom: 1px solid #3b3b3b; text-decoration: none; } :focus { outline: none; }
a:visited { color: #834887; border-bottom: 1px solid #834887; text-decoration: none; }
a:hover, a:active, a:focus { color: #01407f; border-bottom: 1px solid #01407f; text-decoration: none; }
a:active {}

p, address {
	margin: 0;
	padding: .2em 0 .8em 0;
	font-size: .9em;
	line-height: 195%;
	text-shadow: #fff 0 1px 0;
}
address { font-style: normal; }

img { border: none; }
ul, ol, dl { padding: 0; margin: 0; list-style: none; }
#article ul, #article ol { padding: 0 0 .8em 2em; line-height: 190%; }
#article ul li { list-style: disc; }
#article ol li { list-style: decimal; }

sup { height: 0; line-height: 1; position: relative; top: -0.6em; vertical-align: baseline !important; vertical-align: bottom; font-variant: small-caps; }
hr, .hidden { display: none; }

/* -~-~-~-_°-°_-~-~-~- */
/* ~-~ user's pick ~-~ */
.left { float: left; }
.left-img, .block.left { float: left; margin: 8px 15px 1px 0; }

.right { float: right; }
.right-img, .block.right { float: right; margin: 8px 0 1px 15px; }

.w-200 { width: 150px; }
.w-200 img { margin-bottom: 18px; }

.clear { clear: both; }
hr.clear { display: block; clear: both; margin: .3em 0; padding: 0; border: none; }

.block p { padding: 0; line-height: 1.5em; }

.haf-ik-block { width: 395px; padding: 0 0 20px 30px; border-left: 1px solid #d4d1cb; }

.block a.photo { border-bottom: none; }
.block .photo img { padding: 5px; background: #f4f4f7; border: 1px solid #d4d1cb; }
.block .photo img:hover { border: 1px solid #b4bbc3; }

.upper { text-transform: uppercase; }

/* ~-~ body ~-~ */
#container { margin: 0 auto; width: 960px; position: relative; z-index: inherit; zoom: 1; }

/* ~-~ header ~-~ */
#header { height: 179px; }

#logo { position: absolute; z-index: 1; top: 21px; left: 45px; margin: 0; padding: 0; }
#logo a { display: block; padding-top: 81px; height: 0; width: 237px; background: url("logo-it-pro.png") no-repeat; overflow: hidden; border-bottom: none; }

#support { position: absolute; right: 48px; top: 25px; width: 409px; height: 81px; overflow: hidden; }
#support p { padding: 0; font-size: 1em; text-align: right; text-shadow: #ededed 0 1px 0; color: #717171; }
#support a { color: #717171; border-bottom: 1px solid #717171; }
#support a:hover { color: #01407f; border-bottom: 1px solid #01407f; }

#support .hotline { float: left; width: 165px; background: url("bg-mini-hr-vertical.png") 100% 50% no-repeat; }
#support .hotline p { padding-bottom: 3px; text-align: center; }
#support .hotline strong { font-weight: normal; color: #aaaaab; }

#support .tel strong { font-size: 1.5em; font-weight: 400; }
#support .mail .font, #support .remote { font-size: 1.1em; }
#support .remote { padding-right: 30px; background: url("ico-abra-pc.png") 100% 2px no-repeat; }

#access { position: absolute; z-index: -1; width: 1px; height: 1px; margin: 0; overflow: hidden; text-indent: -1000em; }

/* ~-~ curved corners: http://code.google.com/p/curved-corner/ ~-~ */
.radius {
	box-shadow: 0 0 3px rgba(0, 0, 0, .3); -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .3); -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
	-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
}
#article, .aside, #footer, .coda-slider {
	background: #fff;
	border: 1px solid #fbfbfb;
	behavior: url("./design/border-radius.htc");
}

/* ~-~ article: main content ~-~ */
#article, .aside, #footer {
	margin-top: 21px;
	padding: 20px 25px 10px 25px;
	width: 554px;
	float: left;
}

#article, #footer, #copy { margin-left: 33px; }
.aside {
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dedede));
	background: -moz-linear-gradient(top,  #fff,  #dedede);
	/*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dedede');*/
}

#article.main { margin-top: 0; width: 846px; }

/* ~-~ aside: sidebar ~-~ */
.aside { margin-right: 31px; padding-bottom: 20px; float: right; width: 216px; }
.aside h2 { margin-bottom: .2em; padding-top: 0; color: #3b3b3b; text-shadow: #dbdbdb 0 1px 0; }
.aside p { padding: .3em 0 .5em 0; line-height: 140%; font-size: .8em; }
.aside .time, table.ref .time { padding: 1px 2px; font-size: .8em; color: #fff; background: #3158a1; }
.aside hr { margin: 7px 0 9px 0; padding: 0; display: block; border: 0; width: 100%; height: 2px; background: url("bg-mini-hr.png") 0 50% no-repeat; }

/* ~-~ footer ~-~ */
#footer { clear: both; margin-top: 20px; width: 846px; }
#footer p { position: relative; top: -7px; padding: 0; }
#footer .font { text-transform: uppercase; font-size: 1.1em; }

#abra, #cisco, #ibm, #oracle, #microsoft, #linux, #cisco-select { display: block; float: left; margin-right: 7px; height: 40px; background: url("logo-technologies.png") no-repeat; text-indent: -1000em; }

#abra { width: 208px; height: 72px; } /*#abra.off { background-position: 0 -72px; }*/
#cisco, #ibm, #oracle, #microsoft, #linux, #cisco-select { position: relative; top: 5px; }
#cisco { width: 72px; background-position: -208px -32px; } /*#cisco.off { background-position: -208px -104px; }*/
#ibm { width: 94px; background-position: -280px -32px; } /*#ibm.off { background-position: -280px -104px; }*/
#oracle { width: 151px; background-position: -374px -32px; } /*#oracle.off { background-position: -374px -104px; }*/
#microsoft { width: 121px; background-position: -525px -32px; } /*#microsoft.off { background-position: -525px -104px; }*/
#linux { width: 99px; background-position: -646px -32px; } /*#linux.off { background-position: -646px -104px; }*/
#cisco-select { top: -20px; margin: 0 0 -20px 0; width: 56px; height: 65px; background-position: -745px -7px; } /*#linux.off { background-position: -745px -104px; }*/

#copy { float: left; margin-top: 20px; margin-bottom: 20px; width: 846px; text-align: center; }
#copy p { padding-bottom: 0; margin-bottom: 0; font-size: .8em; }
#copy #odkazy { margin-top: 10px; line-height: 150%; }

#copy a, #copy a:visited { color: #3b3b3b; white-space: nowrap; border-bottom: 1px solid #3b3b3b; }
#copy a:hover { color: #01407f; background: none; border-bottom: 1px solid #01407f; }

/* ~-~ nav ~-~ */
#nav { position: absolute; z-index: 1; top: 124px; left: 30px; width: 902px; height: 39px; }
#nav ul {}
#nav ul li { float: left; }

#t-1 a, #t-2 a, #t-3 a, #t-4 a, #t-5 a, #t-6 a, #t-7 a, #t-1 strong, #t-2 strong, #t-3 strong, #t-4 strong, #t-5 strong, #t-6 strong, #t-7 strong { display: block; padding-top: 41px; height: 0; background: url("bg-nav-button.png") no-repeat; overflow: hidden; border-bottom: none; }
#t-1 a, #t-1 strong { width: 72px; background-position: 0 -82px; }
#t-2 a, #t-2 strong { width: 179px; background-position: -72px -82px; }
#t-3 a, #t-3 strong { width: 188px; background-position: -251px -82px; }
#t-4 a, #t-4 strong { width: 146px; background-position: -439px -82px; }
#t-5 a, #t-5 strong { width: 108px; background-position: -585px -82px; }
#t-6 a, #t-6 strong { width: 107px; background-position: -693px -82px; }
#t-7 a, #t-7 strong { width: 102px; background-position: -800px -82px; }

#t-1 a:hover { background-position: 0 -41px; }
#t-2 a:hover { background-position: -72px -41px; }
#t-3 a:hover { background-position: -251px -41px; }
#t-4 a:hover { background-position: -439px -41px; }
#t-5 a:hover { background-position: -585px -41px; }
#t-6 a:hover { background-position: -693px -41px; }
#t-7 a:hover { background-position: -800px -41px; }

#t-1 strong { background-position: 0 0; }
#t-2 strong { background-position: -72px 0; }
#t-3 strong { background-position: -251px 0; }
#t-4 strong { background-position: -439px 0; }
#t-5 strong { background-position: -585px 0; }
#t-6 strong { background-position: -693px 0; }
#t-7 strong { background-position: -800px 0; }

/* ~-~ coda slider v.2: http://www.ndoherty.biz/2009/10/coda-slider-2/ ~-~ */
.coda-slider-wrapper { margin: 0 3px; padding-top: 3px; height: 277px; position: relative; }

.coda-slider-no-js .coda-slider { height: 272px; overflow: auto !important; }
.coda-slider-no-js .img-1, .coda-slider-no-js .img-2, .coda-slider-no-js .img-3, .coda-slider-no-js .img-4 { min-height: 280px; }

.coda-slider p.loading { padding: 20px; text-align: center; }

.coda-slider { margin-left: 30px; overflow: hidden; position: relative; z-index: 1; background: url("bg-coda-slider.jpg") 0 50% no-repeat; }
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 894px; height: 272px; }

.coda-nav ul { display: block; margin: auto; overflow: hidden; position: absolute; top: 225px; left: 56px; z-index: 2; }
.coda-nav ul li { float: left; margin-right: 5px; padding: 3px; }
.coda-nav ul li a { color: #3b3b3b; display: block; padding: 4px 8px; border: 1px solid #fff; background: #dbdbdb url("bg-gradient.png") -500px 50% repeat-x; }
.coda-nav ul li a.current { background-position: -750px 50%; }
.coda-nav ul li a:hover { background-position: -250px 50%; text-shadow: #fff 0 0 3px, #fff 0 0 4px; }

.coda-nav-left, .coda-nav-right { position: absolute; top: 115px; }
.coda-nav-left { left: 0; }
.coda-nav-right { right: 0; }
.coda-nav-left a, .coda-nav-left a:hover, .coda-nav-right a, .coda-nav-right a:hover { display: block; width: 29px; height: 45px; background: url("scroll.png") no-repeat; text-indent: -1000em;  border-bottom: none; }
.coda-nav-right a { background-position: -29px 0; }
.coda-nav-left a:hover { background-position: 0 -45px; }
.coda-nav-right a:hover { background-position: -29px -45px; }

.coda-slider .panel { display: block; float: left; }
.coda-slider .panel-container { position: relative; }
.coda-slider .panel-wrapper {}
.coda-slider .panel-wrapper strong { display: block; padding: 30px 403px 0 25px; font-size: 1.8em; line-height: 1.5em; font-weight: normal; color: #3b3b3b; text-shadow: #fff 0 0 3px, #fff 0 0 4px; }
.coda-slider .panel-wrapper p { padding: 10px 403px 0 28px; }
/* ~-~ images in da" slida" ~-~ */
.coda-slider .img-1, .coda-slider .img-2, .coda-slider .img-3, .coda-slider .img-4 { width: 100%; height: 100%; background: url("../images/1.jpg") 100% 0 no-repeat;
	-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
}
.coda-slider .img-2 { background-image: url("../images/2.jpg"); }
.coda-slider .img-3 { background-image: url("../images/3.jpg"); }
.coda-slider .img-4 { background-image: url("../images/4.jpg"); }
.coda-slider .panel-wrapper p.title { display: none; }

/* ~-~ buttons ~-~ */
.coda-slider .panel-wrapper .button { float: right; margin: 20px 420px 0 25px; border-bottom: 1px solid #fff; }
.button {
	display: block; padding: 0 20px;
	text-align: center;	font: 1.2em/33px 'MuseoSans500', Verdana, Arial, Helvetica, sans-serif; color: #3b3b3b; text-transform: lowercase; text-shadow: #fff 0 0 3px, #fff 0 0 4px, #fff 0 0 5px;
	/*text-shadow: 0 0 3px rgba(255,255,255,.8);*/
	border: 1px solid #fff;
	background: #b8f0fd url("bg-gradient.png") 0 50% repeat-x;
}
.button:hover { background-position: -250px 50%; color: #3b3b3b; }
.button:active { position: relative; top: 1px; background-position: -250px 50%; }
.button:visited { color: #3b3b3b; }

/* ~-~ forms ~-~ */
.mail-form { padding: 0; margin-bottom: 1em; }
.mail-form input, .mail-form textarea { font-size: .9em; font-family: "Verdana CE", Verdana, "Arial CE", Arial, "Lucida Grande CE", "Helvetica CE", lucida, sans-serif; }
.mail-form label { margin-top: .2em; font-size: .9em; }
.mail-form .linka { padding-top: 7px; }
.mail-form .linka label.typ-pole, .mail-form .linka span.typ-pole { margin-right: 5px; }
.mail-form .pole { margin-top: 3px; }
.mail-form .linka span.pole { display: block; }
.mail-form .posun {}
.mail-form .tlacitko { padding: .4em .8em; }

form.valid label.error, form.valid strong { margin-left: 5px; font-size: 1em; font-weight: bold; color: #01407f; }
form.valid strong { margin-left: 0; }

/* ~-~ tables ~-~ */
table.download, table.ref { clear: both; margin: .2em 0 1em 0; padding: 0; width: 100%; border: none; font-size: .8em; text-align: left; border-collapse: collapse; }
table.download caption, table.ref caption { display: none; }
table.download td, table.ref td { padding: 10px; padding-bottom: 6px; vertical-align: top; border-bottom: 1px solid #e9ebee; }
table.ref th { padding: 10px 5px; text-align: left; font-size: 1em; text-transform: uppercase; background: #f4f3f2; border-top: 1px solid #e9ebee; border-bottom: 1px solid #e9ebee; }
table.ref td { padding: 10px 5px; }
table.ref td ul { padding: 0 !important; }
table.ref td ul li { list-style: inside !important; }

table.download td { width: 50%; }
table.download .c-1 {}
table.download .c-2 {}

table.ref .c-1 { width: 20%; }
table.ref .c-2 { width: 15%; }
table.ref .c-3 { width: 35%; }
table.ref .c-4 { width: 30%; }

table.ref img { margin-bottom: 6px; display: block; }
table.ref p { font-size: 1.2em; }

table.download p, table.ref p { margin: 0; padding: 0; }

/* ~-~ HTML 5 support styles ~-~ */
/*header, section, footer, aside, nav, article, figure { display: block; }*/
