/*=====================================================================================

	File: 				styles.css
	Information:		Main styles
	Project:			Česká hepatologická společnost
	Author:				Petr Urbánek - petr.urbanek@webprogress.cz
	Twitter:			@r4ms3scz
	
		
	== iNFO ===========================================
	
	Page width:			998px
	
	
	== Px2Em ===========================================
	
	body 	87.5%

	10px 	0.909em		10 / 11 = 0.909
	11px 	1em			11 / 11	= 1
	12px 	1.091em		12 / 11 = 1.091
	13px 	1.182em		13 / 11 = 1.182
	14px 	1.273em		14 / 11 = 1.273
	15px 	1.364em
	16px 	1.455em
	17px 	1.545em
	18px 	1.636em
	19px 	1.727em
	20px 	1.818em
	
	
	== CSS DETAiL ======================================
	
	RESET
	TYPOGRAPHY
	SELECTOR HELPER
	SPRAVCE
	
	LAYOUT
	HEADER
	FOOTER
	
	CONTENT
	
	
=====================================================================================*/


/******************************************************************
	RESET
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, em, img, 
ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td {
margin:0;
padding:0;
border:0;
font-weight:inherit;
font-style:inherit;
font-size:100%;
font-family:inherit;
vertical-align:baseline;
}
a img 			{border:none;}
time 			{display: inline;}

body{
background: url(../img/page-bg.png) center center repeat-y #ebebeb;
color: black;
font-size: 68.8%;
font-family:arial, tahoma, verdana, sans-serif;
font-weight:normal;
text-align:center;
line-height:1.5em;
}

.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix { display: inline-block; }

/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* stop commented backslash hack */


/******************************************************************
	TYPOGRAPHY
*/
h1, h2, h3, h4 {
padding:0em;
margin:0em;
font-weight:normal;
color:black;
line-height: 1.1em;
}
h1 				{font-size:1.455em;padding:0.00em 0em 0.25em 0em;}
h2 				{font-size:1.364em;padding:0.25em 0em 0.25em 0em;}
h3 				{font-size:1.273em;padding:0.25em 0em 0.50em 0em;}
h4 				{font-size:1.182em;padding:0.25em 0em 0.50em 0em;}

.clear			{clear:both;}
.left			{float: left !important;}
.right			{float: right !important;}

#content p		{margin:0em; padding:0em 0em 1.5em 0em;}
p .left			{margin:1.5em 1.5em 1.5em 0em; padding:0em;}
p .right		{margin:1.5em 0em 1.5em 1.5em; padding:0em;}

strong			{font-weight: bold;}
em				{font-style: italic;}
sup, sub		{line-height: 0;}
li ul, li ol	{margin:0em 1.5em;}
ul				{margin:0em 1.5em 0em 2.0em; padding:0em 0em 1.5em 0em;}
ol				{margin:0em 1.5em 0em 2.0em; padding:0em 0em 1.5em 0em;}
.ie6 ul			{margin-left:2.0em;}
.ie6 ol			{margin-left:2.6em;}
.ie7 ul			{margin-left:2.0em;}
.ie7 ol			{margin-left:2.6em;}
.ie8 ul			{margin-left:1.5em;}
ul				{list-style-type:disc;}
ol				{list-style-type:decimal;}
ul li p,
ol li p			{padding:0px !important;}
hr				{height:0px;color:#cccccc;border:0px;border-top:1px solid #cccccc;}

a,
a:link,
a:visited,
a:hover{
color: #515254;
text-decoration: underline;
outline:none;
}
a:focus,
a:hover{
text-decoration: none;
}


/******************************************************************
	SELECTOR HELPER
*/
h10+p{ 
padding-top:10px; /* POKUD PO H10 NASLEDUJE P, TAK SE NA P NASTAVI 10PX Z VRCHU - NEFUNGUJE V IE6 */
}
.first.firstAct{
padding-top:10px; /* POKUD MA ELEMENT CLASSU FIRST A I FIRSTACT, TAK SE NASTAVI 10PX Z VRCHU */
}
#content h10:first-child{ 
padding-top:10px; /* POKUD JE V CONTENT PRVNI ELEMENT H10, TAK SE NASTAVI 10PX Z VRCHU */
}


/******************************************************************
	SPRAVCE
*/
.blok-vlevo		{float:left;}
.blok-vpravo	{float:right;}
.blok-vycisit	{clear:both;}
.text-blok		{text-align:justify;}
.text-uprostred	{text-align:center;}
.text-vlevo		{text-align:left;}
.text-vpravo	{text-align:right;}
.obrazek-vlevo	{float:left; margin:5px 15px 10px 0px}
.obrazek-vpravo	{float:right; margin:5px 0px 10px 15px}


/******************************************************************
	LAYOUT
*/
#page{
width:998px;
margin:0px auto 0px;
}


/******************************************************************
	HEADER
*/
#header{
width:998px;
height:142px;
text-align:left;
position:relative;
}
.ie6 #header{
width:1000px;
left:2px;
}
.ie7 #header{
left:1px;
}
#header #logo{
position:absolute;
left:0px;
top:0px;
}
#header #header-login{
float:right;
position:absolute;
right:0px;
top:0px;
width:212px;
height:139px;
background: url(../img/header-login-bg.png) left top no-repeat;
}
#header #header-login #header-login-in{
padding:5px 21px 0px 17px;
color:white;
}
#header #header-login #header-login-in label.text{
padding:3px 0px 0px 0px;
display:block;
}
#header #header-login #header-login-in label.input{
width:174px;
height:27px;
display:block;
background: url(../img/header-login-label-bg.png) left top no-repeat;
}
#header #header-login #header-login-in label.input input{
margin:7px 5px 0px 5px;
border:0px;
width:164px;
font-size:1em;
}
#header #header-login #header-login-in button{
width:44px;
height:27px;
background: url(../img/header-login-button-bg.png) left top no-repeat;
float:right;
position:relative;
right:-3px;
top:6px;
cursor:pointer;
margin:0px;
border:0px;
}

#header #header-login #header-login-in #logged{
padding:20px 0px 0px 0px;
color:white;
text-align:center;
}
#header #header-login #header-login-in #logged a:link,
#header #header-login #header-login-in #logged a:visited,
#header #header-login #header-login-in #logged a:hover{
font-weight:bold;
color:white;
}




/******************************************************************
	FOOTER
*/
#footer{
width:998px;
padding:20px 0px 20px 0px;
text-align:center;
color:#ea9d9b;
font-size:1em;
}


/******************************************************************
	CONTENT
*/
#content{
padding:0px 10px 0px 10px;
text-align:left;
}
#content #rightcol{
float:right;
width:203px;
border-top:1px solid #e0e0e0;
background: url(../img/leftcol-rightcol-bg.png) left bottom no-repeat;
}
#content #rightcol #rightcol-in{
padding:10px 10px 45px 10px;
text-align:center;
}
#content #rightcol #rightcol-in #rightcol-header-calendar{
width:172px;
display:block;
color:white;
text-align:left;
padding:7px 0px 12px 11px;
background: url(../img/leftcol-header-bg.png) left top no-repeat;
}
#content #rightcol #rightcol-in table.calendar-table{
text-align:left;
margin:10px 0px 30px 0px
}


#content #rightcol #rightcol-in .rightcol-header{
width:172px;
display:block;
color:white;
text-align:left;
padding:7px 0px 12px 11px;
background: url(../img/leftcol-header-bg.png) left top no-repeat;
}
#content #rightcol #rightcol-in .rightcol-box{
padding:0px 0px 30px 0px;
text-align:left;
}

#content #rightcol #rightcol-in img{
margin:5px auto 0px;
}

#content #leftcol{
float:left;
width:745px;
}
#content #leftcol #leftcol-menu{
float:left;
width:203px;
}
#content #leftcol #leftcol-menu #leftcol-menu-in{
border-top:1px solid #e0e0e0;
background: url(../img/leftcol-rightcol-bg.png) left bottom no-repeat;
padding:10px 10px 45px 10px;
}
#content #leftcol #leftcol-menu #leftcol-menu-in .leftcol-header{
width:172px;
display:block;
color:white;
padding:7px 0px 12px 11px;
background: url(../img/leftcol-header-bg.png) left top no-repeat;
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul{
margin:0px;
padding:0px;
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul li{
margin:0px;
padding:0px 0px 0px 0px;
list-style-type:none;
float:left;
width:185px;
}
.ie6 #content #leftcol #leftcol-menu #leftcol-menu-in ul li{
/*padding:6px 0px;*/
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a:link,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a:visited,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a:hover{
color:#515254;
font-size:1.273em;
text-decoration:none;
display:block;
float:left;
padding:5px 0px 5px 10px;
width:175px;
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a.act:link,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a.act:visited,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a.act:hover,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li a:hover{
font-weight:bold;
}

#content #leftcol #leftcol-menu #leftcol-menu-in ul li ul{
padding:0px 0px 10px 20px;
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul li ul li{
margin:0px;
/*padding:4px 0px 4px 0px;*/
list-style-type:none;
float:left;
width:165px;
}
.ie6 #content #leftcol #leftcol-menu #leftcol-menu-in ul li ul li{
/*padding:3px 0px;*/
}
#content #leftcol #leftcol-menu #leftcol-menu-in ul li ul li a:link,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li ul li a:visited,
#content #leftcol #leftcol-menu #leftcol-menu-in ul li ul li a:hover{
font-size:1em;
width:155px;
padding:2px 0px 2px 10px;
}



#content #leftcol #leftcol-menu #leftcol-box{
border-top:1px solid #e0e0e0;
background: url(../img/leftcol-rightcol-bg.png) left bottom no-repeat;
padding:10px 10px 45px 10px;
}
#content #leftcol #leftcol-menu #leftcol-box .leftcol-header{
width:172px;
display:block;
color:white;
padding:7px 0px 12px 11px;
background: url(../img/leftcol-header-bg.png) left top no-repeat;
}
#content #leftcol #leftcol-menu #leftcol-box .leftcol-box{
padding:0px 0px 30px 0px;
}
#content #leftcol #leftcol-menu #leftcol-menu-search{
width:203px;
height:86px;
margin:4px 0px 4px 0px;
background: url(../img/leftcol-menu-search-bg.png) left top no-repeat;
}
#content #leftcol #leftcol-menu #leftcol-menu-search #leftcol-menu-search-in{
padding:15px 10px 12px 19px;
}
#content #leftcol #leftcol-menu #leftcol-menu-search #leftcol-menu-search-in label{
width:174px;
height:27px;
display:block;
background: url(../img/leftcol-menu-search-label-bg.png) left top no-repeat;
}
#content #leftcol #leftcol-menu #leftcol-menu-search #leftcol-menu-search-in label input{
width:160px;
border:0px;
margin:7px 5px 0px 7px;
font-size:1em;
}
#content #leftcol #leftcol-menu #leftcol-menu-search #leftcol-menu-search-in button{
width:45px;
height:28px;
background:url(../img/leftcol-menu-search-button-bg.png) left top no-repeat;
cursor:pointer;
border:0px;
float:right;
margin:0px;
position:relative;
right:-4px;
top:6px;
}

#content #leftcol #leftcol-content{
float:right;
width:530px;
color:#515254;
}


/******************************************************************
	CONTENT - HOME
*/
#content-home h1{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:20px 0px 10px 0px;
}
#content-home h2{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:5px 0px 3px 0px;
}
#content-home img{
margin:8px 0px 0px 0px;
}


/******************************************************************
	CONTENT - DEPARTMENT
*/
#content-department h1{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:20px 0px 10px 0px;
}
#content-department .article-item{
padding:0px 0px 10px 0px;
}
#content-department .article-item h2{
color:#df6a67;
font-size:1.273em;
font-weight:bold;
line-height:1.2em;
padding:5px 0px 3px 0px;
}
#content-department .article-item h2 a:link,
#content-department .article-item h2 a:visited,
#content-department .article-item h2 a:hover{
color:#df6a67;
font-size:1em;
}



/******************************************************************
	CONTENT - ARTICLE
*/
#content-article h1{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:20px 0px 10px 0px;
}


#content-article #documents{
padding:0px 0px 25px 20px;
line-height:1.8em;
background: url(../img/ico/documents-bg.gif) left 0px no-repeat;
}

#content-article #documents a:link,
#content-article #documents a:visited,
#content-article #documents a:hover{
padding:2px 0px 2px 25px;
}
#content-article #documents a:link,
#content-article #documents a:visited,
#content-article #documents a:hover{
background: url(../img/ico/none.png) 6px 2px no-repeat;
}
#content-article #documents a.doc:link,
#content-article #documents a.doc:visited,
#content-article #documents a.doc:hover{
background: url(../img/ico/doc.png) 6px 2px no-repeat;
}
#content-article #documents a.xls:link,
#content-article #documents a.xls:visited,
#content-article #documents a.xls:hover{
background: url(../img/ico/xls.png) 6px 2px no-repeat;
}
#content-article #documents a.pdf:link,
#content-article #documents a.pdf:visited,
#content-article #documents a.pdf:hover{
background: url(../img/ico/pdf.png) 6px 2px no-repeat;
}
#content-article #documents a.bmp:link,
#content-article #documents a.bmp:visited,
#content-article #documents a.bmp:hover,
#content-article #documents a.BMP:link,
#content-article #documents a.BMP:visited,
#content-article #documents a.BMP:hover{
background: url(../img/ico/bmp.png) 6px 2px no-repeat;
}
#content-article #documents a.dll:link,
#content-article #documents a.dll:visited,
#content-article #documents a.dll:hover{
background: url(../img/ico/dll.png) 6px 2px no-repeat;
}
#content-article #documents a.htm:link,
#content-article #documents a.htm:visited,
#content-article #documents a.htm:hover{
background: url(../img/ico/htm.png) 6px 2px no-repeat;
}
#content-article #documents a.ini:link,
#content-article #documents a.ini:visited,
#content-article #documents a.ini:hover{
background: url(../img/ico/ini.png) 6px 2px no-repeat;
}
#content-article #documents a.jpg:link,
#content-article #documents a.jpg:visited,
#content-article #documents a.jpg:hover{
background: url(../img/ico/jpg.png) 6px 2px no-repeat;
}
#content-article #documents a.png:link,
#content-article #documents a.png:visited,
#content-article #documents a.png:hover{
background: url(../img/ico/png.png) 6px 2px no-repeat;
}
#content-article #documents a.ppt:link,
#content-article #documents a.ppt:visited,
#content-article #documents a.ppt:hover{
background: url(../img/ico/ppt.png) 6px 2px no-repeat;
}
#content-article #documents a.rar:link,
#content-article #documents a.rar:visited,
#content-article #documents a.rar:hover{
background: url(../img/ico/rar.png) 6px 2px no-repeat;
}
#content-article #documents a.rtf:link,
#content-article #documents a.rtf:visited,
#content-article #documents a.rtf:hover{
background: url(../img/ico/rtf.png) 6px 2px no-repeat;
}
#content-article #documents a.txt:link,
#content-article #documents a.txt:visited,
#content-article #documents a.txt:hover{
background: url(../img/ico/txt.png) 6px 2px no-repeat;
}
#content-article #documents a.zip:link,
#content-article #documents a.zip:visited,
#content-article #documents a.zip:hover{
background: url(../img/ico/zip.png) 6px 2px no-repeat;
}



/******************************************************************
	COMMENT
*/
#content-article #addcomment{
text-align:center;
padding:0px 0px 0px 0px;
}
#content-article #addcomment span.h2{
font-size:160%;
text-align:left;
color:#A63031;
display:block;
padding:0px 0px 15px 0px;
}
#content-article #addcomment #in_addcomment{
width:420px;
margin:0px auto 0px;
}
#content-article #addcomment #in_addcomment label{
font-weight:bold;
display:block;
padding:0px 0px 3px 0px;
text-align:left;
}
#content-article #addcomment #in_addcomment div input{
border:1px solid #A63031;
height:18px;
width:200px;
margin:0px 0px 12px 0px;
text-align:left;
}
#content-article #addcomment #in_addcomment .center input{
width:420px;
}
#content-article #addcomment #in_addcomment textarea{
width:420px;
height:120px;
border:1px solid #A63031;
}
#content-article #addcomment #in_addcomment textarea.err,
#content-article #addcomment #in_addcomment div input.err{
background: #FFEFEF;
}

#content-article #addcomment #in_addcomment input#submitForm{
width:76px;
height:16px;
margin:10px 0px 0px 20px;
border:0px;
background: url(../img/sendform-bg.gif) no-repeat;
cursor:pointer;
float:left;
}
#content-article #addcomment #in_addcomment input.submitFormEn{
background: url(../img/sendform-bg-en.gif) no-repeat !important;
}


a.closeForm:link,
a.closeForm:visited,
a.closeForm:hover{
width:76px;
height:16px;
margin:10px 0px 0px 140px;
border:0px;
background: url(../img/sendform-close-bg.gif) no-repeat;
cursor:pointer;
text-decoration:none;
display:block;
float:left;
}
a.closeFormEn:link,
a.closeFormEn:visited,
a.closeFormEn:hover{
background: url(../img/sendform-close-bg-en.gif) no-repeat;
}

#content-article .listCommentDetail{
line-height:1.4em;
}
#content-article .listCommentDetail strong{
color:#909090;
font-size:120%;
}
#content-article .listCommentDetail strong span{
font-size:90%;
}
#content-article .listCommentDetail .content{
padding:4px 0px 20px 0px;
margin:0px 0px 20px 0px;
border-bottom:1px solid #909090;
}
#content-article .listCommentDetail .content strong{
color:black;
font-size:100%;
}
#content-article .listCommentDetail a:link,
#content-article .listCommentDetail a:visited,
#content-article .listCommentDetail a:hover,
#content-article #commentBubble a:link,
#content-article #commentBubble a:visited,
#content-article #commentBubble a:hover{
color:#0072A5;
}

#content-article #commentBubble{
width:778px;
position:absolute;
left:0px;
top:0px;
background:#F6F6F6;
line-height:1.4em;
display:none;
}
#content-article #commentBubble #in_commentBubble{
padding:10px 20px 15px 20px;
border:1px solid black;
}
#content-article #commentBubble a#closecommentBubble:link,
#content-article #commentBubble a#closecommentBubble:visited,
#content-article #commentBubble a#closecommentBubble:hover{
position:absolute;
right:4px;
top:4px;
padding:0px;
margin:0px;
displaY:block;
cursor:pointer;
width:15px;
height:16px;
background: url(../img/closecommentBubble-bg.gif) top center no-repeat;
}
#content-article #commentBubble a#closecommentBubble:hover{
background: url(../img/closecommentBubble-bg.gif) bottom center no-repeat;
}

#content-article .error {
background:#B30606;
border:1px solid #8C0707;
color:white;
font-size:100%;
font-weight:bold;
line-height:1.7em;
margin:10px 0 20px;
padding:7px 15px;
vertical-align:middle;
}
#content-article .sucess{
background:#439500;
border:1px solid #165000;
font-weight:bold;
color:white;
font-size:100%;
line-height:1.7em;
margin:10px 0 20px;
padding:7px 15px;
vertical-align:middle;
}







/******************************************************************
	CONTENT - LOGIN
*/
#content-login h1{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:20px 0px 10px 0px;
}
#content-login .error{
background:#B30606;
border:1px solid #640505;
padding:10px 10px;
color:white;
}
#content-login .itemLeftColForm{
width:300px;
}
#content-login .itemLeftColForm label{
display:block;
width:300px;
}
#content-login .itemLeftColForm label.text{
padding:5px 0px 0px 0px;
}
#content-login .itemLeftColForm label.input input{
width:180px;
}
#content-login .itemLeftColForm label.errorInput input{
border:1px solid #B30606;
}
#content-login button{
width:44px;
height:26px;
background:url(../img/content-login-button-bg.png) left top no-repeat;
cursor:pointer;
border:0px;
float:left;
margin:0px;
position:relative;
left:140px;
top:-6px;
}




/******************************************************************
	CONTENT - SEARCH
*/
#content-search h1{
color:#df6a67;
font-size:1.455em;
font-weight:bold;
line-height:1.2em;
padding:20px 0px 10px 0px;
}
#content-search p{
padding:0px 0px 10px 0px;
}
#content-search .article-item{
padding:0px 0px 10px 0px;
}
#content-search .article-item h2{
color:#df6a67;
font-size:1.273em;
font-weight:bold;
line-height:1.2em;
padding:5px 0px 3px 0px;
}
#content-search .article-item h2 a:link,
#content-search .article-item h2 a:visited,
#content-search .article-item h2 a:hover{
color:#df6a67;
font-size:1em;
}

#content-search .pagination{
font-size:1.273em;
padding:20px 0px 0px 0px;
}
#content-search .pagination a:link,
#content-search .pagination a:visited,
#content-search .pagination a:hover{
color:#df6a67;
font-weight:bold;
padding:0px 3px;
}
#content-search .pagination strong{
font-weight:bold;
padding:0px 3px;
}

table.tabulka
{width:100%;margin-bottom:20px;table-layout:fixed;border-spacing:0;border-collapse:separate}
table.tabulka th,table.tabulka tr:first-child td
{background-color:#801a18;color:#fff;height:42px;padding:0 20px;vertical-align:middle;font-weight:700;text-transform:uppercase;border-bottom:6px solid #fff}
table.tabulka td
{text-align:left;color:#333;padding:12px 20px;line-height:20px;border-bottom:1px solid #801a18;vertical-align:top}
table.tabulka td a
{color:#333;font-weight:500}
table.tabulka td a:after {display:none}
table.tabulka tr:last-child td{border-bottom:none}
@media only screen and (max-width:550px){
	table.tabulka{border:1px solid #dedede}
	table.tabulka tr:first-child{display:none}
	table.tabulka td td{display:block;padding-left:2%!important;border-bottom:none;padding:8px 0}
	table.tabulka td:last-child{border-bottom:1px solid #dedede}
	table.tabulka tr:nth-of-type(odd) td{background-color:#f0f3f5}
}