/*
Name: HP Style Sheet
Author: Ludek Cernocky and members of his team
Date: 29.1.2008
Note: Don´t steal, just watch and learn. This CSS is copyrighted like all other stuff on eStranky.cz domain ;)

1. Main
2. Intro panel
3. Promo
  3.1 Why
  3.2 Video
4. Middle
  4.1 News
  4.2 Catalog
  4.3 Most visited
5. Footer
*/

/* 1. Main
-----------------------------*/
#all {width: auto;}
#top, div.container {position: relative; margin: 0 auto; width: 760px;}

/* 1.1 special home features */
#content h2 {line-height: 28px; border: none; padding-bottom: 0; text-align: center;}
#content h2 span {color: Black;}
#content p {text-align: center; position: relative; padding: 0.1em 0;}
#content p a {color: #FF5400;}

h3 {color: #595959;}
#left-column h3 {color: #FF5400;}

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

#content {border: none; margin: 0; min-height: 300px;}
* html #content {height: 200px !important; padding-bottom: 0;}  /* IE 6 */

menu {border: none;}

#promo a, #middle p a {background: url('/resources/presentation/img/sprites/estranky.png') no-repeat 0 -232px; cursor: pointer; padding-left: 10px;}
#middle p a:hover {background: url('/resources/presentation/img/sprites/estranky.png') no-repeat 0 -195px; color: #333;}

/* IE 6 */
* html #promo a, * html #middle p a {background: url('/resources/presentation/img/left-column/login/a.gif') no-repeat 0 50%;}
* html #middle p a:hover {background: url('/resources/presentation/img/left-column/login/a-hover.gif') no-repeat 0 50%;}

/* 2. Intro panel
-----------------------------*/
div.intro-panel {margin-top: 21px; text-align: center;}
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
div.intro-panel {margin-top: 28px;} /* Opera 7.2 up */
}

div.intro-panel ul:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */
div.intro-panel ul {=height: 1%;} /* IE 6 + 7 - non-valid hack */

div.intro-panel ul li {list-style-type:none; float:left; width:130px; height:145px;}
div.intro-panel ul li a {cursor:pointer; display:block; font-size:75%; position:relative; outline: none; overflow:hidden; width:130px; height:145px; }
div.intro-panel ul li a span {background: url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat 0 -802px; display:block; width:130px; height:145px; position:absolute; top:0; left:0; z-index:1;}

div.intro-panel a.personal span {background-position: 0 -802px;}
div.intro-panel a:hover.personal, div.intro-panel a:hover.personal span, div.intro-panel a.personal:focus, div.intro-panel a.personal:focus span{background-position: 0 -947px;}

div.intro-panel a.hobbies, div.intro-panel a.hobbies span {width: 140px;}
div.intro-panel a.hobbies span {background-position: -122px -802px;}
div.intro-panel a:hover.hobbies, div.intro-panel a:hover.hobbies span, div.intro-panel a.hobbies:focus, div.intro-panel a.hobbies:focus span {background-position: -122px -947px;}

div.intro-panel a.companies {margin-left: 15px;}
* html div.intro-panel a.companies {margin-left: 0px;}  /* IE 6 */
div.intro-panel a.companies span {background-position: -255px -802px;}
div.intro-panel a:hover.companies, div.intro-panel a:hover.companies span, div.intro-panel a.companies:focus, div.intro-panel a.companies:focus span {background-position: -255px -947px;}

div.intro-panel a.institutions, div.intro-panel a.institutions span {width: 135px;}
* html div.intro-panel a.institutions {margin-left: -10px;}  /* IE 6 */
div.intro-panel a.institutions span {background-position: -365px -802px;}
div.intro-panel a:hover.institutions, div.intro-panel a:hover.institutions span, div.intro-panel a.institutions:focus, div.intro-panel a.institutions:focus span {background-position: -365px -947px;}

div.intro-panel p {position: relative; height: 35px; top: 22px; left: 17.5%;}

div.intro-panel p a, div.smviewersvideo .info a {border: 0; cursor: pointer; display: block; float: left; font-size: 133.3%; position: relative; margin: 0; padding: 0; overflow: visible;}
* html div.intro-panel p a, * html div.smviewersvideo .info a {width: 100px;}  /* IE 6 */
div.intro-panel p a strong, div.smviewersvideo .info a strong {display: block; position: relative; white-space: nowrap;}

/* Webkit only - fix margins */
@media screen and (-webkit-min-device-pixel-ratio:0) {
   div.intro-panel p a, div.smviewersvideo .info a {margin-top: -1px;}
}

div.intro-panel p a, div.smviewersvideo .info a {background: url('/resources/presentation/img/home/big-button.png') no-repeat right 0; margin-right: 5px; padding: 0 38px 0 0; text-decoration: none; text-align: center; outline: none; }
div.intro-panel p a strong, div.smviewersvideo .info a strong {background: #FF6600 url('/resources/presentation/img/home/big-button.png') no-repeat 0 -71px; color: White; padding: 9px 15px 0 20px; height: 50px; text-shadow: #A03E02 1px 1px 1px;}
div.intro-panel p a:hover, div.intro-panel p a:focus, div.smviewersvideo .info a:hover, div.smviewersvideo .info a:focus {background:  transparent url('/resources/presentation/img/home/big-button.png') no-repeat right -153px;}
div.intro-panel p a:hover strong, div.intro-panel p a:focus strong, div.smviewersvideo .info a:hover strong, div.smviewersvideo .info a:focus strong {background: #666 url('/resources/presentation/img/home/big-button.png') no-repeat 0 -222px; text-shadow: #333 1px 1px 1px;}

/* 3. Promo
-----------------------------*/
#promo {margin: 5px 0 0 0; padding: 42px 0 0 0; text-align: left;}
#promo:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */
* html #promo {height: 20px; padding: 17px 0 0 0;}  /* IE 6 */

#promo #why, #promo #video-teaser {float: left; height: 170px; margin: 0; padding: 0; position: relative; width: 230px;}
#promo #video-teaser {width: 295px;}
#promo h3 {text-align: left;}
#promo a {color: #FF5400;}
#promo a span {display: none;}

/* 3.1 Why */
#why h3 {margin-left: 15px;}
#why ul {margin: 0; width: 230px;}
#why ul li {background: url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat 0 -290px; display: block; list-style-type: none; line-height: 120%; margin-left: 16px; padding: 3px 0 3px 11px;}
#why ul li.clean {background: none; list-style-type: none; margin-left: 5px;}
#why ul li {=padding-bottom: 2px; } /* IE 6 + 7 non valid hack */
#why ul li.clean {=padding-top: 4px;}  /* IE 6 + 7 non valid hack */

/* targeting just WebKit */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
  #why ul li {height: 14px; padding-top: 0.35em; vertical-align: baseline;}
}

/* 3.2 Video */
#video-teaser {background: url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat -1px -617px; width: 295px; text-align: right;}
#video-teaser h3 {margin-left: 67px;}
#video-teaser a.video {position: absolute; top: 148px; left: 69px;}
object#video-teaser-cont {outline: none; position:relative; top: -15px;}

/* targeting just WebKit */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
#video-teaser {background-position: -1px -621px;}
}

/* video inside dialog */
div.smviewersvideo {width: 687px; height: 439px;}
div.smviewersvideo blockquote, div.smviewersvideo div.samples {float: left; margin-top: 11px; height: 350px;}
div.smviewersvideo blockquote {padding: 0; text-align: left; width: 523px;}
div.smviewersvideo div.samples {width: 164px; margin-top: 6px;}
div.smviewersvideo div.samples a {border: 1px solid White; display: block; margin: 3px 0 6px 0;}
* html div.smviewersvideo div.samples a {margin: 4px 0 8px 0 !important;}   /* IE 6 */
*:first-child+html div.smviewersvideo div.samples a {margin: 4px 0 8px 0 !important;}  /* IE 7  */

div.smviewersvideo div.samples a:hover {border-color: #FF5400;}
div.smviewersvideo div.samples img {display: block; margin: 1px; position: relative; z-index: 36000; zoom: 1;}
div.smviewersvideo .info {clear: both; position: relative; margin: 0 auto; top: 12px; left: 24%;}
div.smviewersvideo .info a {font-size: 16px;}
div.smviewersvideo .info a strong {padding-top: 6px; height: 53px;}
div.smviewersvideo object {outline: none;}

/* 4. Middle: news, catalog, most visited
-------------------------------------------------------*/
#middle {background: #F5F5F5 url('/resources/presentation/img/sprites/estranky-hp.jpg') repeat-x 0 0; border-top: 1px solid #F5F5F5; color: #494949; min-height: 50px; margin: 0; padding: 1px 0 30px 0;}
* html #middle, * html #middle div.container {height: 50px; position: relative;} /* IE 6 */
#middle:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */

#middle h3 {line-height: 18px; margin-bottom: 1em; text-shadow: 1px 1px 0 #FAFAFA;}

#middle a {color: #555;}
#middle p a span {display: none;}

#middle div.container div {float: left; padding-top: 10px; overflow: hidden;}

/* 4.1 News */
#news {padding-left: 10px; width: 180px;}
#news dl {font-size: 100%; height: 125px; margin: 0; padding: 0;}
#news dt a {color: #494949;}
#news dt a strong {font-weight: normal;}
#news dd {background: none !important; margin: -1px 0 0 0; padding: 0 3px 0 0; text-align: justify;}
#news dd:hover {color: #333;}
#news small {display: block; font-size: 10px; margin-bottom: 8px;}

/* 4.2 Catalog */
#catalog {background: url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat 0 -338px; padding-left: 50px; width: 259px;}
#catalog form {padding-top: 3px;}
#catalog h4, #catalog form label {position: absolute; top: 0; left: -9999px;}
#catalog blockquote {margin: 0 0 0 -5px; line-height: 140%; padding: 15px 0 0 0; overflow: hidden; height: 85px; width: 240px;}
#catalog blockquote:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */
#catalog blockquote a {float: left; display: block; margin: 2px 8px 6px 5px;}

#catalog fieldset {border: none;padding: 0px; margin: 0px;}
#catalog legend{display: none;}
#catalog input {border:1px solid #C5C5C5; border-top: 1px solid #B4B4B4; background: White url('/resources/presentation/img/sprites/estranky.png') no-repeat 0 0; height:18px; width:158px; margin: 0 4px 0 0; padding: 2px 0 0 2px;}
#catalog input:focus {border-color: #888;}
#catalog button {border:0; background: #666 url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat -346px -654px; cursor: pointer; font-family: "Trebuchet MS", "Geneva CE", lucida, sans-serif; font-size: 12px; margin: 0 0 0 1px; padding:0; height:22px; width:64px;}
#catalog button::-moz-focus-inner {border: none;}
#catalog button strong {color: White; text-shadow: #444 1px 1px 1px;}
#catalog button:hover, #catalog button:focus {background-position: -434px -654px; border: none;}
#catalog button:hover strong, #catalog button:focus strong {text-shadow: #111 1px 1px 1px;}

/* 4.3 Most visited */
#most-visited {background: url('/resources/presentation/img/sprites/estranky-hp.jpg') no-repeat -23px -338px; padding-left: 25px; width: 230px;}
#most-visited ol {margin: 0 0 0 -5px; =margin: 0; height: 125px;}
#most-visited li {color: #999; margin: 0 0 3px 25px;}
#most-visited li a {border-bottom: 1px solid #EEE; text-decoration: none;}
#most-visited li a:hover {border-bottom-color: #999;}
#most-visited p a {margin-left: 4px;}

#catalog blockquote a, #most-visited li a {border-bottom: 1px solid #EEE; text-decoration: none;}
#catalog blockquote a:hover, #most-visited li a:hover {color: #333; border-bottom-color: #999;}

/* 5. Footer */
#footer {border-top: 1px solid #DDD; font-size: 100%; color: #595959; width: 760px; height: 25px; position: relative; margin: 0 auto; padding: 10px 0 0 0;}
#footer:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} /* clearfix */
#footer a {color: #595959;}
#footer a:hover {color: #333;}

#footer p, #footer ul {float: left;}

#footer ul {font-size: 91.7%; margin: 0 20px;}
#footer ul li {list-style-type: none; display: inline; margin: 0 1em;}

#footer p.languages {min-width: 120px; text-align: left;}
* html #footer p.languages {width: 120px;}  /* IE 6 */
#footer p.languages a {float: left; margin: 2px 10px;}

#footer ul.social-links {float: right; margin: 0;}
#footer ul.social-links li {margin: 0;}

#footer p.copyright {position: absolute; left: 0; top: -9999px;}
