/* CSS Document */

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

}

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

}


html {
height: 100%;
margin: 0px;
padding: 0px;
}

body {
font-family: 'MetronLightProRegular';
height: 100%;
margin: 0px;
padding: 0px;
text-align: center;
color: #213a40;
font-size: 15px;
}

h1 {
font-family: Helvetica, sans-serif;
font-size: 25px;
color: #222e31;
font-weight: bold;
}     


h2 {
font-family: Helvetica, sans-serif;
font-size: 15px;
color: #222e31;
font-weight: bold;
}

h3 {
font-size: 15px;
color: #222e31;
text-decoration: none;
}  



a {
color: #213a40;
font-weight: normal;
text-decoration: underline;
}    

a:hover {
color: #213a40;
text-decoration: underline;
}

img {
border: none;
}

table {
  border-collapse: collapse;
}

table td {
vertical-align: top;
}

table th {
vertical-align: top;
text-align: left;
}

div.cleaner {
clear: both;
}

.right {
float: right;
}

.borderBottom {
border-bottom: 1px solid #2f2f2f;
padding-bottom: 11px;
}

.noRightMargin {
margin-right: 0px!important;
}


/*
LAYOUT
*/

#containerMainWrapper {
min-height: 100%;
height: 100%;
position: relative;
text-align: center;
}

body>#containerMainWrapper {
height: auto;
}

#containerTopWrapper {
text-align: center;
background: white;
}

#containerTop {
height: 117px;
width: 959px;
margin-left: auto;
margin-right: auto;
position: relative;
text-align: left;
}

#logo {
display: block;
position: absolute;
left: 0px;
top: 0px;
}

#topMenu {
position: absolute;
right: 0px;
top: 70px;
width: 800px;
}

#topMenu table {
width: auto;
float: right;
}

#topMenu table td {
margin: 0px;
padding: 0px;
}

#topMenu td.separator {
width: 1px;
background-color: #b4bdc5;
}

#topMenu td.separator span {
display: block;
width: 1px;
height: 23px;
}

#topMenu a, #topMenu h1 {
display: block;
text-align: center;
padding: 4px 20px 4px 20px;
margin: 0px 0px 0px 0px;
text-decoration: none;
color: #213a40;
}

#topMenu h1, #topMenu a {
font-size: 15px;
}

#topMenu a.first {
}

#topMenu a.last, #topMenu h1.last {
padding-right: 0px;
}

#topMenu a.active/*, #topMenu a:hover*/ {
font-weight: bold;

}

#containerBottomWrapper {
text-align: center;
}

#containerContentIndexWrapper {
width: 959px;
margin-left: auto;
margin-right: auto;
background: transparent url('../images/px.png') left top repeat;
color: white;
margin-top: 82px;
padding: 10px 0px 10px 0px;
}

#containerContentIndex {
margin: 22px 30px 0px 30px;
text-align: left;
font-size: 18px;
}

#containerContentIndex a {
color: #b3e5ec;
}

#containerContentIndex a:hover {
color: #eaeeee;
}


#containerContentWrapper {
text-align: center;
background: transparent url('../images/content-bg.jpg') left top repeat-x;
position: relative;
padding: 0px;
margin: 0px;
border-top: 1px solid transparent;
}


#containerContent {
width: 959px;
margin-left: auto;
margin-right: auto;
text-align: center;
min-height: 307px;
text-align: left;
}

#referenceList {
padding-top: 64px;
}

#referenceList div.referenceItem {
float: left;
margin-right: 10px;
margin-bottom: 10px;
position: relative;
width: 313px;
height: 175px;
}

#referenceList div.referenceItem img {
position: absolute;
left: 0px;
top: 0px;
}

#referenceList div.referenceItem a {
position: absolute;
left: 0px;
top: 0px;
display: block;
width: 313px;
height: 175px;
z-index: 20;
text-decoration: none;  
}

#referenceList div.referenceItem a:hover {
background: transparent url('../images/px.png') left top repeat;
}

#referenceList div.referenceItem a span {
display: none;
}

#referenceList div.referenceItem a:hover span {
color: white;
display: block;
margin: 16px;
}

#referenceListSmall {
padding-top: 40px;
padding-bottom: 40px;
color: #b4bdc4;
}

#referenceListSmall strong {
color: #213a40;
}

#referenceDetail {
position: relative;
}

#referenceDetail a {
color: white;
}

#referenceDetail a:hover {
color: #eaeeee;
}

#referenceDetail h2 {
font-size: 23px;
position: absolute;
top: 27px;
left: 0px;
margin: 0px;
padding: 0px;
}

#referenceDetail div#referenceNavigace {
position: absolute;
top: 17px;
right: 0px;
}

a#prev, a#next, a#exit {
float: left;
display: block;
width: 43px;
height: 44px;
background: transparent url('../images/prev.jpg') right top no-repeat;
background-color: #242E31;
}

a#next {
background: transparent url('../images/next.jpg') right top no-repeat;
background-color: #242E31;
margin-left: 1px;
}

a#exit {
background: transparent url('../images/exit.jpg') right top no-repeat;
background-color: #242E31;
margin-left: 1px;
}

#referenceTextWrapper {
position: absolute;
top: 62px;
background: transparent url('../images/px.png') left top repeat;
color: white;
padding: 10px 0px 10px 0px;
width: 100%;
}

#referenceText {
margin: 0px 30px 0px 30px;
text-align: left;
font-size: 18px;
}

#referenceWebsiteImageContainer {
background-position: center top;
background-repeat: no-repeat;
}

#referenceWebsiteImageContainer a {
display: block;
width: 100%;
height: 100%;
}

#referenceWebsiteImageContainer img {
width: 100%;
}


#contactFormTable {
}

#contactFormTable form {
padding: 0px;
margin: 0px;
}

#contactFormTable form table {
}

#contactFormTable form table tr td {
}

#contactFormTable form table:first-child td div {
background: red;
padding: 5px 5px 5px 5px;
margin-left: 10px;
margin-bottom: 10px;
background-color: #2c3e42;
}

#contactFormTable form table tr td input {
font-family: 'MetronLightProRegular';
font-size: 15px;
width: 150px;
line-height: 23px;
height: 23px;
display: block;
background-color: #2c3e42;
border: none;
color: white;
}

#contactFormTable form table tr td:first-child div {
margin-left: 0px;
}

#contactFormTable textarea{
border: none;
width: 490px;
height: 120px;
font-family: 'MetronLightProRegular';
font-size: 15px;
background-color: #2c3e42;
color: white;
}

#contactFormTable form input[type="submit"] {
float: right;
border: none;
background: transparent url('../images/contact.jpg') left top no-repeat;
display: block;
width: 36px;
height: 27px;
cursor: pointer;
}






/*
ADMINISTRACE
*/

div#adminMenu {
}

div#adminMenu a {
font-size: 12px;
float: left;
display: block;
margin-right: 15px;
text-decoration: underline;
}

table.adminTable {
border: 1px solid black;
width: 100%;
}

table.adminTable td {
border: 1px solid black;
}

table.adminTable th {
border: 1px solid black;
}

table.adminTable a {
}

input.textLong {
width: 400px;
}

textarea#text, textarea#aktualita_text {
width: 730px;
height: 500px;
}

body.mceContentBody {
background: transparent url('../images/px.png') left top repeat;
text-align: left;
padding: 0px;
color: white;
}

body.mceContentBody a {
color: white;
}

body.mceContentBody a:hover {
color: #eaeeee;
}