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

	Project:			SLOVNIK KRESTANSTVI
	
		
	== iNFO ===========================================
	
	Web width:			100%
	Page width:			940px
	
	
	== Px2Em ===========================================
	
	body 	100%
	
	12px	0.750em
	13px	0.813em
	14px	0.875em
	15px	0.938em
	16px	1.000em
	17px	1.063em
	18px	1.125em
	19px	1.188em
	20px	1.250em
	21px	1.313em
	22px	1.375em
	23px	1.438em
	24px	1.500em
	
	
	== CSS DETAiL ======================================
	
	RESET
	TYPOGRAPHY
	HACKS
	
	LAYOUT
	HEADER
	FOOTER
	CONTENT
	
	MENU
	
	
=====================================================================================*/

/******************************************************************
	RESET
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
border:0;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0;
padding:0;
vertical-align:baseline;
}
article, aside, dialog, figure, footer, header, hgroup, nav, section {
display:block;
}
body {
background:url(img-slovnik/body.png) repeat 0px 0px;
color:#555555;
font-family:'Open Sans Condensed', arial, tahoma, verdana, sans-serif;
font-size:100%;
font-weight:normal;
line-height:1.5em;
padding:20px 0px 40px;
text-align:left;
-webkit-font-smoothing: subpixel-antialiased;
-webkit-font-smoothing: antialiased;
}
select, input, textarea, button {
color:#555555;
font-family:arial, tahoma, verdana, sans-serif;
font-size:100%;
margin:0px;
}

/******************************************************************
	TYPOGRAPHY
*/
h1, h2, h3, h4 {
color:#555555;
font-family:'MyriadProRegular', arial, tahoma, verdana, sans-serif;
line-height:1em;
margin:0px;
padding:0px;
}
h1 {font-family:'MyriadProBold', arial, tahoma, verdana, sans-serif; font-size:8.125em; padding:0px 0px 20px;}
h2 {font-size:2.8125em; padding:3px 0px 18px;}
h3 {font-size:1.875em; padding:0px 0px 10px;}

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

p               {margin:0px;}
img				{border:0px;margin:0px;}
strong			{font-weight:bold;}
em				{font-style:italic;}
sup, sub		{line-height:0;font-size:90%}
ul				{margin:0em 1.5em 0em 2.0em; padding:0em 0em 1.5em 0em;list-style-type:disc;}
ol				{margin:0em 1.5em 0em 2.0em; padding:0em 0em 1.5em 0em;list-style-type:decimal;}
.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;}
hr				{height:0px;color:#cccccc;border:0px;border-top:1px solid #cccccc;}

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

sub, sup {font-size:70%; position:relative;}
sub {bottom:-5px;}
sup {top:-5px;}

/******************************************************************
	HACKS
*/
html 			{overflow-y:scroll;} 						/* PRO NON-IE PROHLIZECE PRIDA DOPRAVA SCROLLBAR */
textarea		{overflow:auto;} 							/* V IE ODSTRANI V TEXTAREA SCROLLBAR */
button 			{width:auto; overflow:visible;}				/* WWW.VIGET.COM/INSPIRE/STYLING-THE-BUTTON-ELEMENT-IN-INTERNET-EXPLORER/ */

::-moz-selection	{background:#1860f3; color:#fff; text-shadow: none;}
::selection 		{background:#1860f3; color:#fff; text-shadow: none;}

.clearfix:before,											/* NEW CLEARFIX! - RESI PROBLEM S VYTECENIM FLOATOVANYCH PRVK� */
.clearfix:after,
.movie:before,
.movie:after {
content: ".";    
display: block;    
height: 0;    
overflow: hidden;	
}
.clearfix:after,
.movie:after {clear: both;}

.text-vpravo {text-align:right;}


/* FONTY */
@font-face {
    font-family: 'MyriadProRegular';
    src: url('fonts/myriadpro-regular-webfont.eot');
    src: url('fonts/myriadpro-regular-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/myriadpro-regular-webfont.woff') format('woff'),
         url('fonts/myriadpro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MyriadProBold';
    src: url('fonts/myriadpro-bold-webfont.eot');
    src: url('fonts/myriadpro-bold-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/myriadpro-bold-webfont.woff') format('woff'),
         url('fonts/myriadpro-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MyriadProItalic';
    src: url('fonts/myriadpro-it_0-webfont.eot');
    src: url('fonts/myriadpro-it_0-webfont.eot#iefix') format('embedded-opentype'),
         url('fonts/myriadpro-it_0-webfont.woff') format('woff'),
         url('fonts/myriadpro-it_0-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

/**********************************************/
/*				PAGE						  */
/**********************************************/

#page {
background:#fff;
border:1px solid #e1e1e1;
margin:0px auto;
width:940px;
}


/**********************************************/
/*				HEADER						  */
/**********************************************/
#header {
padding:33px 40px 36px 40px;
text-align:center;
}
.purple #header h1 {color:#5167d4;}
.pink #header h1 {color:#c149b7;}
.red #header h1 {color:#f51d1d;}
.green-light #header h1 {color:#c9e829;}
.green #header h1 {color:#6bae1e;}
.brown #header h1 {color:#8c6239;}
.yellow #header h1 {color:#ffcc00;}
.blue #header h1 {color:#5ce3fb;}
.orange #header h1 {color:#ff5b00;}

#header small {
font-family:'MyriadProItalic', arial, tahoma, verdana, sans-serif;
font-size:3.125em;
line-height:1.2em;
}
.purple #header small {color:#5167d4;}
.pink #header small {color:#c149b7;}
.red #header small {color:#f51d1d;}
.green-light #header small {color:#c9e829;}
.green #header small {color:#6bae1e;}
.brown #header small {color:#8c6239;}
.yellow #header small {color:#ffcc00;}
.blue #header small {color:#5ce3fb;}
.orange #header small {color:#ff5b00;}

#header .big {
font-size:1.250em;
font-style:italic;
font-weight:400;
line-height:1.5em;
padding:39px 0px 6px;
}


/**********************************************/
/*				FOOTER						  */
/**********************************************/
#footer {
padding:40px 0px 0px;
text-align:center;
}
#footer a:link,
#footer a:visited,
#footer a:hover {
background:none;
font-size:1.250em;
line-height:1.2em;
display:inline-block;
}
#footer-home {
font-family:'MyriadProItalic', arial, tahoma, verdana, sans-serif;
font-size:0.875em;
margin:0px auto;
padding:40px 10px 0px;
text-align:center;
width:920px;
}
#footer-home img {
margin:30px 0px 0px;
}

#footer-home a.info {float: right;}
#footer-home a.crossroad {float: left;}

/**********************************************/
/*				CONTENT						  */
/**********************************************/
#content .gray-box {
background:#f7f7f7;
border-top:1px solid #e1e1e1;
padding:43px 40px 42px 40px;
}
#content .white-box {
border-top:1px solid #e1e1e1;
padding:43px 40px 42px 40px;
}
#content .more-info {
padding:20px 0px 0px;
}
#content a.more-home:link,
#content a.more-home:visited,
#content a.more-home:hover,
#content a.less-home:link,
#content a.less-home:visited,
#content a.less-home:hover {
color:#6bae1e;
float:right;
margin:0px 0px 2px;
}
#content a.more-home:link,
#content a.more-home:visited,
#content a.more-home:hover {
display:none;
}
#content a.less-home:link,
#content a.less-home:visited,
#content a.less-home:hover {
margin:20px 0px 1px;
}
#content .note {
border-top:1px solid #e1e1e1;
color:#fff;
font-size:1.250em;
line-height:1.5em;
padding:43px 40px 42px 40px;
text-align:center;
}
.blue #content .note {background:#5ce3fb;}
.green #content .note {background:#6bae1e;}
.pink #content .note {background:#c149b7;}
.green-light #content .note {background:#c9e829;}
.brown #content .note {background:#8c6239;}
.yellow #content .note {background:#ffcc00;}
.red #content .note {background:#f51d1d;}
.purple #content .note {background:#5167d4;}
.orange #content .note {background:#ff5b00;}

#content .note a:link,
#content .note a:visited,
#content .note a:hover {
color:#fff !important;
}
#content p {
padding:0px 0px 22px;
}
#content p.big {
font-size:1.250em;
font-style:italic;
font-weight:400;
line-height:1.5em;
padding:0px;
}
#content p.last {
padding:0px 0px 2px;
}
#content .h4 {
display:block;
font-size:1.125em;
padding:7px 0px 5px;
}
#content .h4-songs {
padding:22px 0px 5px;
}
#content ul.decimal {
list-style-type:none;
margin:0px;
padding:0px;
position:relative;
top:-2px;
}
#content ul.decimal li {padding:0px 0px 9px;}
#content ul.decimal li.last {padding:0px;}
#content ul.decimal li small {
display:inline-block;
font-size:1.875em;
font-weight:400;
line-height:1em;
padding:0px 10px 0px 0px;
}
#content ul.decimal-home {
list-style-type:none;
margin:0px;
padding:0px 0px 18px;
}
#content ul.decimal-home li {
padding:0px 0px 1px 8px;
}
#content ul.point {
list-style-type:none;
margin:0px;
padding:0px 0px 18px;
}
#content ul.pointLast {
padding:0px 0px 1px;
}
#content ul.point li {
background:url(img-slovnik/ico-point.png) no-repeat 8px 11px;
padding:0px 0px 1px 21px;
}
#content ul.link {
list-style-type:none;
margin:0px;
padding:0px 0px 4px;
}
#content ul.link-little {
padding:0px 0px 40px;
}
#content ul.link li {
background:url(img-slovnik/ico-point.png) no-repeat 8px 21px;
line-height:1.1em;
padding:14px 0px 0px 21px;
}
#content ul.link li.first {
background:url(img-slovnik/ico-point.png) no-repeat 8px 11px;
padding:4px 0px 0px 21px;
}
#content ul.link li a:link,
#content ul.link li a:visited,
#content ul.link li a:hover,
#content ul.link li small {
display:inline-block;
font-size:0.750em;
}
.blue #content a:link, .blue #content a:visited, .blue #content a:hover {color:#5ce3fb;}
.green #content a:link, .green #content a:visited, .green #content a:hover {color:#6bae1e;}
.pink #content a:link, .pink #content a:visited, .pink #content a:hover {color:#c149b7;}
.green-light #content a:link, .green-light #content a:visited, .green-light #content a:hover {color:#c9e829;}
.brown #content a:link, .brown #content a:visited, .brown #content a:hover {color:#8c6239;}
.yellow #content a:link, .yellow #content a:visited, .yellow #content a:hover {color:#ffcc00;}
.red #content a:link, .red #content a:visited, .red #content a:hover {color:#f51d1d;}
.purple #content a:link, .purple #content a:visited, .purple #content a:hover {color:#5167d4;}
.orange #content a:link, .orange #content a:visited, .orange #content a:hover {color:#ff5b00;}


.blue #content .topic {background:#f7f7f7 url(img-slovnik/blue-topic.png) no-repeat 665px bottom;}
.green #content .topic {background:#f7f7f7 url(img-slovnik/green-topic.png) no-repeat 665px bottom;}
.pink #content .topic {background:#f7f7f7 url(img-slovnik/pink-topic.png) no-repeat 665px bottom;}
.green-light #content .topic {background:#f7f7f7 url(img-slovnik/green-light-topic.png) no-repeat 665px bottom;}
.brown #content .topic {background:#f7f7f7 url(img-slovnik/brown-topic.png) no-repeat 665px bottom;}
.yellow #content .topic {background:#f7f7f7 url(img-slovnik/yellow-topic.png) no-repeat 665px bottom;}
.red #content .topic {background:#f7f7f7 url(img-slovnik/red-topic.png) no-repeat 665px bottom;}
.purple #content .topic {background:#f7f7f7 url(img-slovnik/purple-topic.png) no-repeat 665px bottom;}
.orange #content .topic {background:#f7f7f7 url(img-slovnik/orange-topic.png) no-repeat 665px bottom;}

.blue #content .questions {background:url(img-slovnik/blue-questions.png) no-repeat 659px bottom;}
.green #content .questions {background:url(img-slovnik/green-questions.png) no-repeat 659px bottom;}
.pink #content .questions {background:url(img-slovnik/pink-questions.png) no-repeat 659px bottom;}
.green-light #content .questions {background:url(img-slovnik/green-light-questions.png) no-repeat 659px bottom;}
.brown #content .questions {background:url(img-slovnik/brown-questions.png) no-repeat 659px bottom;}
.yellow #content .questions {background:url(img-slovnik/yellow-questions.png) no-repeat 659px bottom;}
.red #content .questions {background:url(img-slovnik/red-questions.png) no-repeat 659px bottom;}
.purple #content .questions {background:url(img-slovnik/purple-questions.png) no-repeat 659px bottom;}
.orange #content .questions {background:url(img-slovnik/orange-questions.png) no-repeat 659px bottom;}

.blue #content .discussion-bg {background:#f7f7f7 url(img-slovnik/blue-discussion.png) no-repeat 661px 102px;}
.green #content .discussion-bg {background:#f7f7f7 url(img-slovnik/green-discussion.png) no-repeat 661px 102px;}
.pink #content .discussion-bg {background:#f7f7f7 url(img-slovnik/pink-discussion.png) no-repeat 661px 102px;}
.green-light #content .discussion-bg {background:#f7f7f7 url(img-slovnik/green-light-discussion.png) no-repeat 661px 102px;}
.brown #content .discussion-bg {background:#f7f7f7 url(img-slovnik/brown-discussion.png) no-repeat 661px 102px;}
.yellow #content .discussion-bg {background:#f7f7f7 url(img-slovnik/yellow-discussion.png) no-repeat 661px 102px;}
.red #content .discussion-bg {background:#f7f7f7 url(img-slovnik/red-discussion.png) no-repeat 661px 102px;}
.purple #content .discussion-bg {background:#f7f7f7 url(img-slovnik/purple-discussion.png) no-repeat 661px 102px;}
.orange #content .discussion-bg {background:#f7f7f7 url(img-slovnik/orange-discussion.png) no-repeat 661px 102px;}

.blue #content .discussion {background:url(img-slovnik/blue-discussion2.png) no-repeat 660px bottom;}
.green #content .discussion {background:url(img-slovnik/green-discussion2.png) no-repeat 660px bottom;}
.pink #content .discussion {background:url(img-slovnik/pink-discussion2.png) no-repeat 660px bottom;}
.green-light #content .discussion {background:url(img-slovnik/green-light-discussion2.png) no-repeat 660px bottom;}
.brown #content .discussion {background:url(img-slovnik/brown-discussion2.png) no-repeat 660px bottom;}
.yellow #content .discussion {background:url(img-slovnik/yellow-discussion2.png) no-repeat 660px bottom;}
.red #content .discussion {background:url(img-slovnik/red-discussion2.png) no-repeat 660px bottom;}
.purple #content .discussion {background:url(img-slovnik/purple-discussion2.png) no-repeat 660px bottom;}
.orange #content .discussion {background:url(img-slovnik/orange-discussion2.png) no-repeat 660px bottom;}

.blue #content .links {background:url(img-slovnik/blue-links.png) no-repeat 660px bottom;}
.green #content .links {background:url(img-slovnik/green-links.png) no-repeat 660px bottom;}
.pink #content .links {background:url(img-slovnik/pink-links.png) no-repeat 660px bottom;}
.green-light #content .links {background:url(img-slovnik/green-light-links.png) no-repeat 660px bottom;}
.brown #content .links {background:url(img-slovnik/brown-links.png) no-repeat 660px bottom;}
.yellow #content .links {background:url(img-slovnik/yellow-links.png) no-repeat 660px bottom;}
.red #content .links {background:url(img-slovnik/red-links.png) no-repeat 660px bottom;}
.purple #content .links {background:url(img-slovnik/purple-links.png) no-repeat 660px bottom;}
.orange #content .links {background:url(img-slovnik/orange-links.png) no-repeat 660px bottom;}

.blue #content .media {background:#f7f7f7 url(img-slovnik/blue-media.png) no-repeat 660px bottom;}
.green #content .media {background:#f7f7f7 url(img-slovnik/green-media.png) no-repeat 660px bottom;}
.pink #content .media {background:#f7f7f7 url(img-slovnik/pink-media.png) no-repeat 660px bottom;}
.green-light #content .media {background:#f7f7f7 url(img-slovnik/green-light-media.png) no-repeat 660px bottom;}
.brown #content .media {background:#f7f7f7 url(img-slovnik/brown-media.png) no-repeat 660px bottom;}
.yellow #content .media {background:#f7f7f7 url(img-slovnik/yellow-media.png) no-repeat 660px bottom;}
.red #content .media {background:#f7f7f7 url(img-slovnik/red-media.png) no-repeat 660px bottom;}
.purple #content .media {background:#f7f7f7 url(img-slovnik/purple-media.png) no-repeat 660px bottom;}
.orange #content .media {background:#f7f7f7 url(img-slovnik/orange-media.png) no-repeat 660px bottom;}

#content-home {padding: 7px 10px 5px;}
#content-home h1 {text-align: center;}

/**********************************************/
/*				MENU						  */
/**********************************************/
#content .menu {
border-top:1px solid #e1e1e1;
padding:50px 40px;
}
#content .menu ul {
background:url(img-slovnik/menu.png) no-repeat 0px 0px;
height:282px;
list-style-type:none;
margin:0px;
overflow:hidden;
padding:0px;
width:860px;
}
#content .menu ul li {
float:left;
margin:0px 100px 48px 0px;
}
#content .menu ul li.last {
margin:0px 0px 48px 0px;
}
#content .menu ul li a:link,
#content .menu ul li a:visited,
#content .menu ul li a:hover {
background:#555555;
color:#fff;
display:block;
font-size:1.6875em;
font-style:italic;
font-weight:400;
height:62px;
letter-spacing:-1px;
line-height:62px;
overflow:hidden;
text-align:center;
text-decoration:none;
width:220px;
-webkit-border-radius:10px;
border-radius:10px;
}
#content .menu ul li.purple a:hover {background:#5167d4;}
#content .menu ul li.pink a:hover {background:#c149b7;}
#content .menu ul li.red a:hover {background:#f51d1d;}
#content .menu ul li.green-light a:hover {background:#c9e829;}
#content .menu ul li.green a:hover {background:#6bae1e;}
#content .menu ul li.brown a:hover {background:#8c6239;}
#content .menu ul li.yellow a:hover {background:#ffcc00;}
#content .menu ul li.blue a:hover {background:#5ce3fb;}
#content .menu ul li.orange a:hover {background:#ff5b00;}