/* CSS Reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, em, font, img, small, strike, sub, sup, dl, dt, dd, ol, ul, li, acronym, fieldset, form, label, legend, table, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0;	outline: 0;	font-weight: inherit;	font-style: inherit;  font-size: 100%; font-family: inherit; vertical-align: baseline;}
:focus {outline: 0;}
body {line-height: 1;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
th, td {text-align: left; font-weight: normal;}
/* CSS Reset - end */

html {height: 101%; margin-bottom: 1px;}
body {background: #ccc url(../images/brushed_metal.jpg) 0 0 ; font: 13px/19px Arial,sans-serif; color:#555; text-align:left; }
a, img {border: 0; text-decoration: none;}
a {color: #888; text-decoration:underline;}
a:hover {color:#404040;}
.clear {width: 0; height: 0; overflow: hidden; clear: both;}
.invisible {display: none;}
acronym {border-bottom: 1px dotted #404040; cursor: help;}
strong {color:#444; font-weight: bold;}

#wrapper {margin: 0 auto; padding: 30px 0 30px; width: 770px;}
#wrapper h1, #wrapper div#logo {background: url(../images/ivo_ivan_infomedia_logo.png) bottom left no-repeat; margin: 8px 0 8px 25px; width: 240px; height: 22px; position: relative; float: left; display: inline;}
#wrapper h1 a, #wrapper div#logo a {width: 240px; height: 22px; display: block; text-indent: -9999px;}

/* MAIN MENU */
ul#menu {list-style:none; margin: 8px 18px 0 0; float: right; display: inline;}
ul#menu li {display: inline;}
ul#menu li a {margin: 0 3px; padding: 4px 8px 4px 7px; float: left; text-decoration: none; font-size: 16px; font-weight: normal; text-align: center;  color: #444444;}
ul#menu li a:hover { color: #0099CC;}
ul#menu li a#selected {color: #eee; box-shadow: 1px 1px 4px #ebebeb; -moz-box-shadow: 1px 1px 4px #ebebeb; -webkit-box-shadow: 1px 1px 4px #ebebeb; border: 1px solid #149cdc; background: -webkit-gradient(linear, 0 0, 0 70%, from(#3dc0fc), to(#16a0e1)); background: -moz-linear-gradient(#39bbf7, #0b97d9 70%); background: linear-gradient(#39bbf7, #0b97d9 70%); -pie-background: linear-gradient(#39bbf7, #0b97d9 70%); border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; behavior: url(PIE.htc);}

/* SLIDER */
#sliderwrappertop {margin: 30px auto 0 auto; width:846px; height:310px;}
.leftbtn a, .rightbtn  a {float:left; display: inline; width:28px; height: 28px; text-indent: -9999px; background: url(../images/menu.png) no-repeat 0 100%;}
.leftbtn a {margin:120px 10px 0 0; background-position: 0 -108px;}
.leftbtn a:hover{background-position: 0px -136px;} 
.rightbtn a {margin:120px 0 0 10px; background-position: -28px -108px;}
.rightbtn a:hover{background-position: -28px -136px;} 

/* SLIDER content*/
#sliderwrapper {margin-bottom: 20px; float:left; display: inline; position:relative; overflow: auto; width:770px; height:284px; /*border: 1px solid #666;*/ border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 1px 1px 4px #777; -moz-box-shadow: 1px 1px 4px #777; -webkit-box-shadow: 1px 1px 4px #777; background: -webkit-gradient(linear, 0 0, 0 70%, from(#2d2c22), to(#6d6c66)); background: -moz-linear-gradient(#2d2c22, #6d6c66 70%); background: linear-gradient(#2d2c22, #6d6c66 70%); -pie-background: linear-gradient(#2d2c22, #6d6c66 70%); behavior: url(PIE.htc);}

#sliderwrapper ul {position:absolute; list-style:none; top:0; left:0; }
#sliderwrapper ul li {float:left; padding: 30px 0 5px 0px; width: 770px; height: 253px; position: relative;}

.promoicons {width: 664px; height: 154px; margin: 3px 0 0 52px;}
#sliderwrapper ol.icobox {margin: 13px 0 0 4px; padding: 0;}
#sliderwrapper ol.icobox li {margin: 0; padding: 0; float: left; width: 253px; text-align: center; font: 14px/1.3em  Arial Black, sans-serif; font-weight: bold; color: #eee; text-shadow: #505050 1px 1px;}
#sliderwrapper ol.icobox h3 {font-size: 31px; line-height: 31px; margin-bottom: 2px;}

h1.promo {margin-left: 30px; font: 58px/58px Arial Black, Arial, sans-serif; letter-spacing: -2px; color: #ddd;}
h1.dvadsat {margin-left: 90px; font-size: 50px; line-height: 50px; color: #ddd;}
.odsadenie1 {margin-left: 120px; font: italic bold 21px/30px Verdana, Tahoma, Arial, sans-serif; color: #999; text-shadow: #444 1px 1px;  }
.odsadenie2 {margin: 32px 0 0 38px; font: 16px/20px Arial Black, sans-serif; color: #ddd; text-shadow: #505050 1px 1px;}
			
.inline {margin-left: 30px; font: 64px/1em Tahoma, Arial, sans-serif; position:absolute; top: 22px; color: #ddd;}			
.inline2 {font: normal 25px/1em Arial Black, Arial, sans-serif;	position:absolute; top: 26px; left: 160px; color: #ddd;}			
#sliderwrapper ul li ul.promo2 {margin: 105px 0 0 36px; font: 17px/18px Arial Black, Arial, sans-serif; color: #e3e3e3; text-shadow: #505050 1px 1px;}
#sliderwrapper ul li ul.promo2 li {padding: 0 0 0 36px; background: transparent url(../images/blue-tick.gif) no-repeat 0 0; height: 26px;}
.safari {padding: 19px 0 6px 0; width: 324px; height: 216px; background: #fff url(../images/safari.gif) no-repeat 0 0; position: absolute; top: 24px; left: 420px; box-shadow: 3px 3px 14px #333; -webkit-box-shadow: 3px 3px 14px #333; -moz-box-shadow: 3px 3px 14px #333;}
.odsadenie3 {margin: 198px 0 0 40px;}

.sliderpagination {margin-left: 330px; font-size: 30px; list-style:none; height: 48px;}
.sliderpagination li {float:left; display: inline; cursor:pointer;  margin-right: 4px; text-align:center; color:#999;}
.sliderpagination li:hover {color:#35b9f7;}
li.current {color: #35b9f7;}
/*  SLIDER - end */

/* PROMO Teaser*/
#teaser {margin: 30px auto 26px; width:770px; position: relative; height:284px;  border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; box-shadow: 1px 1px 4px #777; -moz-box-shadow: 1px 1px 4px #777; -webkit-box-shadow: 1px 1px 4px #777; background: -webkit-gradient(linear, 0 0, 0 70%, from(#2d2c22), to(#6d6c66)); background: -moz-linear-gradient(#2d2c22, #6d6c66 70%); background: linear-gradient(#2d2c22, #6d6c66 70%); -pie-background: linear-gradient(#2d2c22, #6d6c66 70%); behavior: url(PIE.htc);}
.h1doris {margin-left: 30px; font: 64px/1em Tahoma, Arial, sans-serif; position:absolute; top: 22px; color: #ddd;}			
.h2doris {font: normal 25px/1em Arial Black, Arial, sans-serif;	position:absolute; top: 26px; left: 160px; color: #ddd;}
#teaser h1.promo {margin:30px 0 4px 30px; display:inline-block; font: 58px/58px Arial Black, Arial, sans-serif; letter-spacing: -2px; color: #ddd;}
#teaser h1.promo span {color: red;}
#teaser ul.promo2 {position:absolute; top:0; margin: 105px 0 0 36px; font: 17px/18px Arial Black, Arial, sans-serif; color: #e3e3e3; text-shadow: #505050 1px 1px;}
#teaser ul.promo2 li {padding: 0 0 0 36px; background: transparent url(../images/blue-tick.gif) no-repeat 0 0; height: 26px;}
.teasericon {width: 256px; height: 256px; position: absolute; top: 24px; left: 475px;}
.odsadenie11 {margin-left: 60px; font: italic bold 21px/30px Verdana, Tahoma, Arial, sans-serif; color: #999; text-shadow: #444 1px 1px;  }
.odsadenie22 {margin: 12px 0 0 30px; font: 16px/20px Arial Black, sans-serif; color: #ddd; text-shadow: #505050 1px 1px;}
.odsadenie4 {margin: 220px 0 0 40px;}

/* CONTENT */
#indexcontent, #content {margin: 0 auto; padding: 10px 25px 25px; width: 720px; background-color: #f7f7f7; border-radius: 0 5px 0 0; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius: 5px; behavior: url(PIE.htc);}
#indexcontent h2 { margin: 32px 0 13px; font-size:19px; font-weight: normal; color: #0099CC/*17a0e0*/; }
#indexcontent p, #content p {margin-bottom: .8em; text-align:justify;}
#content h1 {margin: 32px 0 13px; font-size:19px; line-height: 1.5em; font-weight: normal; color: #0099CC/*17a0e0*/; }
#content h2 {margin: 32px 0 16px; font-size:17px; font-weight: normal; color: #444; }
#indexcontent h1 span, #indexcontent h2 span, #content h1 span, #content h2 span {font-size:19px; color:#555;}
#indexcontent h3, #content h3 {margin: 15px 0 10px; color:#666; font-size:16px; font-weight:normal; line-height:22px;}
#indexcontent h5, #content h5 {margin-bottom: 10px; padding: 6px 10px; font-size:15px; font-weight:bolder; background-color: #f3f3f3; color: #00B7EB; text-align: right; border: 1px solid #f0f0f0; -moz-border-radius: 3px; -webkit-border-radius: 3px;}
#indexcontent h6, #content h6 {margin-bottom: 4px; font-size:14px; font-weight:bold; color:#666;}
#indexcontent h6span, #content h6 span {text-align: right; font-size:10px; font-weight:bolder; color:#666;}

#indexcontent ul, #content ul, .contentleftshort ul {margin: 10px 0 20px;}
#indexcontent ul li, #content ul li {padding: 2px 0 2px 16px; background: url(../images/bullet.gif) no-repeat scroll 0 7px; list-style-position:outside; list-style-type:none; line-height: 1.6em;} /* POKUS color */

blockquote {color:#222; border-left:3px solid #0099CC; background-color: #fff; font-style: italic; margin: 15px; padding: 8px 25px 8px 18px; line-height:19px;}

.contentleft {float:left; display: inline; width: 450px;  padding-right: 36px;}
.contentleftshort {color: #333; float:left; display: inline; width:340px;  padding-right: 50px;}
.contentright {color: #333; float:left; display: inline; width: 234px;}
.contentrightLicense {color: #333; float:left; display: inline; width: 320px;}

#contentrightlist {width:203px; padding: 14px 18px 0px 13px; font-size:12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px solid #ededed; background: -webkit-gradient(linear, 0 0, 0 50%, from(#f5f5f5), to(#ededed)); background: -moz-linear-gradient(#f5f5f5, #ededed 50%); background: linear-gradient(#f5f5f5, #ededed 50%); -pie-background: linear-gradient(#f5f5f5, #ededed 50%); behavior: url(PIE.htc);}
#contentrightlist h3 {margin: 0px 0 12px 0; font-size:16px; color:#09c; border-bottom:0;}

.textright {text-align: right;}
.buttonright {margin-right: 20px; text-align: right;}

.banner {margin: 25px 0 10px;}

/*#content p.intro{color:#444; font-size:13px; font-weight: bold; line-height:20px; margin: 20px 30px 30ox; text-align:justify;}*/
/*#content .weblink {margin: 6px 0 0 0;}*/
/*#content h2 span {margin-bottom: 10px; font-size: 15px; color:#666; text-transform:lowercase;}*/
/*#content ul {list-style-type:square;}
#content ul li {line-height:21px;}*/

/* SUBPAGE menu*/ 
#subpagemenu {margin: 0 auto; width: 770px; line-height: 100%;  position:relative; z-index:0;}
#subpagemenu li {margin-right: 4px; float: left; position: relative; list-style: none;}

#subpagemenu a {font-size: 14px; color: #666; text-decoration: none;	display: block; border: none; padding: 11px 20px 8px 20px;	margin: 0; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; behavior: url(PIE.htc);}
#subpagemenu a:hover {background-color: #F7F7F7;color: #09C; border: none;}

#subpagemenu li a {background-color: #eee; border-bottom: 1px solid #e4e4e4; color: #999; text-shadow: 1px 1px 1px #f2f2f2;  -moz-box-shadow: 3px -2px 3px rgba(153, 153, 153, 0.2); -webkit-box-shadow: 3px -2px 3px rgba(153, 153, 153, 0.2);	box-shadow: 3px -2px 3px rgba(200, 200, 200, 0.2);}
#subpagemenu .subpagemenucurrent a, #subpagemenu li:hover a {background-color: #F7F7F7; border-bottom: 1px solid #F7F7F7; color: #09c; -moz-box-shadow: 3px -2px 3px rgba(51, 51, 51, 0.2); -webkit-box-shadow: 3px -2px 3px rgba(51, 51, 51, 0.2); box-shadow: 3px -2px 3px rgba(180, 180, 180, 0.2);/*box-shadow: 10px 10px 5px #888;*/}

#subpagemenu:after {content: ".";	display: block;	clear: both; visibility: hidden; line-height: 0; height: 0;}
#subpagemenu {display: inline-block;} 
html[xmlns] #subpagemenu {display: block;}
* html #subpagemenu {height: 1%;}

/* SIDETABS */
.sidetabscontent {float:left; display: inline; width: 468px;  padding-right: 36px;}
.sidetabs {float: left; width:180px; margin-top: 30px !important; padding: 14px 15px 12px 15px; font-size:12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px solid #ededed; background: -webkit-gradient(linear, 0 0, 0 50%, from(#f5f5f5), to(#ededed)); background: -moz-linear-gradient(#f5f5f5, #ededed 50%); background: linear-gradient(#f5f5f5, #ededed 50%); -pie-background: linear-gradient(#f5f5f5, #ededed 50%); behavior: url(PIE.htc);}
.sidetabs li {padding: 4px 0 4px 20px !important; border-bottom: 1px solid #fff; display: block; }
.sidetabs li:first-child {padding: 0 0 4px 20px !important;}
.sidetabs li:last-child {border-bottom: none; padding: 4px 0 0 20px !important;}
.sidetabs li a, .sidetabs li a {color: #888888; display: block; text-decoration: none;}
.sidetabs li a:hover, .sidetabs li a:focus {color: #404040;}
.sidetabs li.active a {color: #404040;}

/* LANGUAGES menu*/
#languagesmenu {display: none;} 
.sk {padding-left: 36px; background: transparent url(../images/sk.gif) no-repeat 0 -1px;}
.en {padding-left: 36px; background: transparent url(../images/en.gif) no-repeat 0 -1px;}


.slidetrigger {cursor: pointer;}
.slidecontent {margin-top: 30px; text-align: justify;} /* POKUS text */
/*.slidecontent p {text-align: justify;}*/
.seo {margin-top: 10px; padding-left: 226px; width: 490px; height: 31px; line-height: 30px; background: #f7f7f7 url(../images/seo_header_bg.gif) no-repeat 0 0;}
.seo2 {margin-top: 10px; padding-left: 220px; width: 496px; height: 31px; line-height: 30px; background: #f7f7f7 url(../images/seo_header_bg.gif) no-repeat 0 0;}

.freebies {/*float: right; margin: 0 0 20px 30px; width: 344px*/ margin: 20px 0 30px; padding-left: 20px;}
.freebies img {/*float: left;*/ width: 64px; height: 64px; display: inline; margin: 0 4px 4px 0; padding: 6px; background-color: #fff; border: 1px solid #f1f1f1; -moz-border-radius: 4px; -webkit-border-radius: 4px; -moz-box-shadow: 0px 2px 4px rgba(51, 51, 51, 0.1)} /* POKUS display */ 
.imgleft {float: left; display: inline; width: 315px; margin: 0 20px 20px 0; padding: 6px; background-color: #fff; border: 1px solid #f1f1f1; -moz-border-radius: 4px; -webkit-border-radius: 4px;} /* POKUS display */
.imgright {float: right;  display: inline; width: 315px; margin: 0 0px 20px 30px; padding: 6px; background-color: #fff; border: 1px solid #f1f1f1; -moz-border-radius: 4px; -webkit-border-radius: 4px;}

/* PORTFOLIO */
.ramik {padding: 3px; background: #fff; width: 420px; height: 150px; margin-right:30px; border:1px solid #ddd; position:relative;}
.portfolioitem {float: left; display: inline; margin: 24px 12px 0px 6px; padding: 7px; background-color: #fff; border: 1px solid #f1f1f1; -moz-border-radius: 4px; -webkit-border-radius: 4px; -moz-box-shadow: 0px 2px 8px rgba(51, 51, 51, 0.2)}
.portfolioitem a {text-decoration: none;}

.boxgrid{width: 326px; height: 218px; overflow: hidden; position: relative;}
.boxgrid img{position: absolute; top: 0; left: 0; border: 0; border: 1px solid #eee;}
.boxgrid p{margin: 0; padding: 0 10px; color:#afafaf; font-weight:bold;}
.boxgrid p span {color: #555;}
.weblink {margin: 0 !important; padding: 10px 0 2px 10px;}
.weblink a {font-size: 15px; color: #999; font-weight: bold; line-height: 22px;}
.weblink a:hover {color: #666;}	
.weblink a span {color: #999; font-size: 15px; font-weight: bold}				
.weblink a:hover span {color: #00B7EB;}	




#footer {margin: 0 auto; padding: 16px 0 40px; width:770px; height:14px; line-height: 14px;  color: #888; font-size: 11px; text-align: center; background: transparent url(../images/footer.png) no-repeat 50% 0;}  /* POKUS % */
#footer a:link, #footer a:visited {color: #888; text-decoration: none;/*border-bottom: 1px dotted #888;*/}
#footer a:hover {color:#666;/*border-bottom: 1px solid #666;*/}  
 
a#facebook {display:inline-block; padding-left: 18px; line-height: 14px; height: 14px; background: url(../images/menu.png) no-repeat -54px -108px; text-decoration: none;}
a:hover#facebook {padding-left: 18px; background: url(../images/menu.png) no-repeat -54px -122px;} /* POKUS % */

/* CSS galleries */
ul#cssgalleries {width: 720px; height:65px; margin: 15px 0 0 0 !important; padding: 0;}
ul#cssgalleries li {float: left; margin: 0; padding: 0; list-style-type: 0; background: 0 none;}
ul#cssgalleries li a {display: block; float: left; height: 65px; background-image: url(../images/cssgalleries_sprite.png); text-indent: -9999px;}
ul#cssgalleries li a.cssbased {width: 148px; background-position: 0 0;}
ul#cssgalleries li a.cssbased:hover {background-position: 0 -65px;}
ul#cssgalleries li a.designshack {width: 179px; margin-left: 35px; background-position: -183px 0;}
ul#cssgalleries li a.designshack:hover {background-position: -183px -65px;}
ul#cssgalleries li a.csswebsite {width: 155px; margin-left: 39px; background-position: -401px 0;}
ul#cssgalleries li a.csswebsite:hover {background-position: -401px -65px;}
ul#cssgalleries li a.cssleak {width: 125px; margin-left: 39px; background-position: -595px 0;}
ul#cssgalleries li a.cssleak:hover {background-position: -595px -65px;}
/* END CSS galleries */



/* CONTACT form */

/* CONTACT form */
.contactform {float:left; margin-top: 28px; width: 324px; margin-bottom: 10px; color:#404040;}
/*.contactform label { float: left;}*/

.contactform div { clear: both; } /* VYMAZAT */

.smallinput input {width: 267px; height: 18px; margin: 6px 0; padding:11px 11px 11px 46px; background: url(../images/contactform_bg.png) no-repeat top left; border: 0 none; color:#404040;}
.form_name input {background-position:0 0; }
.form_name input:hover {background-position:0 -40px;}
.form_email input {background-position:0 -80px;}
.form_email input:hover {background-position:0 -120px;}

#form_message {background:transparent; border:0 none; width:300px; height:100px; margin-top:5px; padding:9px 12px 11px 12px; font-family: Arial, Helvetica, sans-serif; font-size: 13px; overflow: auto; color:#404040;}
#message {background: url(../images/contactform_bg.png) no-repeat 0 -160px; width:324px; height:132px; margin-top:6px;}
#message:hover {background-position: 0 -292px;}

.contactform button{margin:12px 0 0 6px; text-indent:-9999px;	overflow:hidden; width:120px; height:28px;	border:none;	background: url(../images/contactform_bg.png) no-repeat 0 -424px; cursor:pointer;	text-align:left;}		
.contactform button:hover{margin:12px 0 0 6px; text-indent:-9999px;	overflow:hidden; width:120px; height:28px;	border:none;	background: url(../images/contactform_bg.png) no-repeat -120px -424px; cursor:pointer; text-align:left;}		


.notification_error{float:left; clear:both; margin:10px 0px -20px 0px;}
.notification_ok {margin-bottom:236px;}
div.container {display: none}
#content .contactform h4 {font-size:1.1em; font-weight: bold; color: #c12d06;}
#content .contactform .container ul li {padding:2px 0 2px 20px; background: url(../images/error.gif) no-repeat scroll 0 6px; list-style-position:outside; list-style-type:none; line-height: 1.6em;}



/* ColorBox Core Style */
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
/* ColorBox example user style */
#cboxOverlay{background:#060606;}
#cboxContent{/*margin-top:20px;*/}
#cboxLoadedContent{background:#000; /*padding:5px;*/}
#cboxTitle{display: none; position:absolute; top:-20px; left:0; color:#ccc;}
#cboxCurrent{display: none; position:absolute; top:-20px; right:0px; color:#ccc;}
#cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
#cboxPrevious{position:absolute; top:50%; left:0px; margin-top:-32px; background:url(../images/controls.png) top left no-repeat; width:28px; height:65px; text-indent:-9999px;}
#cboxPrevious.hover{background-position:bottom left;}
#cboxNext{position:absolute; top:50%; right:0px; margin-top:-32px; background:url(../images/controls.png) top right no-repeat; width:28px; height:65px; text-indent:-9999px;}
#cboxNext.hover{background-position:bottom right;}
#cboxLoadingOverlay{background:#000;}
#cboxLoadingGraphic{background:url(../images/loading.gif) center center no-repeat;}
#cboxClose{display: none; /*display:block;*/ position:absolute; top:11px; right:10px; background:url(../images/controls.png) top center no-repeat; width:38px; height:19px; text-indent:-9999px;}
#cboxClose.hover{background-position:bottom center;}

img#cboxPhoto {padding: 11px; border: 1px solid #1f1f1f; background-color: #181818;}
#content .cgallery img {padding: 4px; border: 1px solid #1f1f1f; background-color: #181818; margin: 8px;}

