* { margin:0; padding:0; }
body, div, span, p, a, img, ul, ol, li, table, th, tr, td, form, fieldset, legend, dl, dt, dd, blockquote, applet, object { border:0; }
ul, ol {list-style-type:none}
html {background: #fff url('../img/bg-foot.jpg') repeat-x bottom;}
body { padding: 0; font: normal 12px Arial,sans-serif; color: #5a5a5a;background: url('../img/bg-head.jpg') repeat-x top;}
p {line-height: 2.1em;padding: 0 0 15px 0;}

/* LINKS ---------------------------------------------------------------------------------------------------------- */
a {color: #92ad01;text-decoration: underline;}
a:link {color: #92ad01;}
a:focus {color: #92ad01; outline: 0}
a:visited {color: #495700}
a:hover {color: #495700;text-decoration: none;}
a.more {padding-right: 12px; background: url('../img/arrow.gif') no-repeat 100% 55%;}
a.out {padding-right: 12px; background: url('../img/out.gif') no-repeat 100% 30px;}
a.out:hover {background-position: 100% -17px;}

/* H1 - H5 -------------------------------------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin:15px 0 15px 0; }
h1 { font-size: 1.4em;  margin: 0; color: #92ad01; font-weight: normal;}
h2 { font-size: 1.2em; margin: 0; color: #575757;font-weight: normal;padding: 0;text-transform: uppercase}
h3 { font-size:1.0em; margin: 0;color: #575757;  padding: 0 0 5px; }
h4 { font-size:1.0em; color: #575757 }
h5 { font-size:1.0em; }

/* LAYOUT --------------------------------------------------------------------------------------------------------- */
#layout { width: 900px; margin: 0 auto;}
    /* HEADER ----------------------------------------------------------------------------------------------------- */
    #header {height: 150px;  background: url('../img/dashed.gif') repeat-x left bottom;height: auto;clear: both; overflow: hidden;}
        #header p {color: #f6ffc6; padding: 8px 0 8px 0; line-height: 1.2em;}
            #header p strong {color: #fff;}
            #header p a {color: #f6ffc6;}
            #header p a:hover {color: #fff;}
        /* logo */
        #header h1 { font-weight: bold;margin: 25px 0 15px 0;position: relative;display: block; color: #92ad01;text-decoration: none;width: 319px; height: 20px;line-height: 20px;float: right;text-align: right}
            #header h1 span {position: absolute; top: 0; left: 0;display: block;width: 319px; height: 20px; background: url('../img/subtitle.jpg') no-repeat}
        
        /* subtitle */
        #header h2 { font-size: 1.4em;margin: 25px 0 15px 0;position: relative;font-weight: bold;display: block; color: #92ad01;text-decoration: none;width: 137px; height: 20px;line-height: 20px;float: left;text-align: left;}
            #header h2 span {position: absolute; top: 0; left: 0;display: block;width: 137px; height: 20px; background: url('../img/logo.jpg') no-repeat}


        #header a#twitter {float: left;cursor: pointer;display: block;height: 20px; line-height: 20px;margin: 20px 0 10px;padding-left: 17px;background: url('../img/twitter.gif') no-repeat 0 50%;}
        #header #twitter_update_list {clear: both;display: none;}
            #header #twitter_update_list li {background: #edecf0 url('../img/twitter-top.jpg') no-repeat; margin-bottom: 10px;}
                #header #twitter_update_list li div {font-size: 0.9em;background: url('../img/twitter-btm.jpg') no-repeat bottom; padding: 25px 20px 10px;text-align: justify;}
        /* contact */
        #header .contact {float: right;height: 20px; line-height: 20px;overflow: hidden;margin: 20px 0 10px;}
            #header .contact dl {float: left;margin-left: 10px;padding-left: 10px;background: url('../img/dotted.gif') repeat-y left}
            #header .contact dl.e-mail {background: none; margin: 0; padding: 0;}
                #header .contact dl dt {display: none}
                #header .contact dl dd {}
                #header .contact dl.e-mail dd {padding-left: 25px;background: url('../img/ico-email.gif') no-repeat 0 80%;}
                #header .contact dl.icq dd {padding-left: 20px;background: url('../img/ico-icq.gif') no-repeat 0 60%;}
                #header .contact dl.tel dd {padding-left: 15px;background: url('../img/ico-tel.gif') no-repeat 0 60%;}
                
        /* status */
        #header .status {float: left; background: #92ad01; width: 50%;}
            #header .status strong {padding-left: 15px;background: url('../img/status.gif') no-repeat 1px 3px;}
            #header .status strong.offline {background-position: 0 -27px;}

        /* update */
        #header .update {float: right; background: #92ad01; width: 50%; text-align: right;}
            #header .update strong {padding-right: 15px; background: url('../img/update.gif') no-repeat 100% 1px;}


    /* CONTENT ---------------------------------------------------------------------------------------------------- */
    .content {background: #fff;padding: 20px 0;}
    
        /* welcome box */
        .content .welcome {width: 542px; background: #edecf0 url('../img/welcome-btm.jpg') no-repeat bottom; float: left; margin-bottom: 40px;}
            .content .welcome h2 {font-size: 1.6em;position: relative; padding: 20px 0 0 20px; width: 522px; height: 29px; margin: 0; text-transform: none; }
                .content .welcome h2 span {position: absolute; display: block; width: 542px; height: 49px; position: absolute; top: 0; left: 0; background: url('../img/welcome-title.jpg') no-repeat; }
            .content .welcome p {padding: 0 20px 20px;text-align: justify;}

        /* bank contact box */
        .content .bank-contact {width: 338px; background: #f8f8f9 url('../img/bank-btm.jpg') no-repeat bottom; float: right; margin-bottom: 40px;}
            .content .bank-contact h2 {font-size: 1.6em;position: relative; padding: 20px 0 0 20px; width: 318px; height: 29px; margin: 0; text-transform: none; }
                .content .bank-contact h2 span {position: absolute; display: block; width: 100%; height: 49px; position: absolute; top: 0; left: 0; background: url('../img/bank-title.jpg') no-repeat; }
            .content .bank-contact p {padding: 0 20px 20px;}

        /* title */
        .content .title { background: url('../img/dashed.gif') repeat-x 0 60%; position: relative;height: 16px; line-height: 16px;clear: both;overflow: hidden;margin-bottom: 10px;}
        .content #title {background: none;}
            .content #title div {background: url('../img/dashed.gif') repeat-x 0 60%;height: 16px; line-height: 16px;}
            .content .title p a {cursor: pointer;}
            .content .title p a.active {color: #575757; text-decoration: none; font-weight: bold;}
            .content .title h2 {position: relative; height: 16px;background: #fff;font-weight: bold;}
                .content .title h2 span {display: block; height: 16px; position: absolute; top: 0; left: 0;}
            .content #tab2, .content #tab3, .content #tab4 {display: none;}
            .content .title h2.vybrane-reference {width: 168px;float: left;}
                .content .title h2.vybrane-reference span {width: 168px; background: url('../img/title-vybranereference.jpg') no-repeat;}

            .content .title h2.graficke-prace {width: 138px;float: left;}
                .content .title h2.graficke-prace span {width: 138px; background: url('../img/title-grafickeprace.jpg') no-repeat;}

            .content .title h2.koderske-prace {width: 144px;float: left;}
                .content .title h2.koderske-prace span {width: 144px; background: url('../img/title-koderskeprace.jpg') no-repeat;}

            .content .title h2.vyjadreni-klientu {width: 161px;float: left;}
                .content .title h2.vyjadreni-klientu span {width: 161px; background: url('../img/title-vyjadreniklientu.jpg') no-repeat;}

            .content .title h2.pricelist {width: 54px;}
                .content .title h2.pricelist span {width: 54px; background: url('../img/title-pricelist.jpg') no-repeat;}

            .content .title h2.contactform {width: 186px;position: absolute; top: 0;left: 476px;}
                .content .title h2.contactform span {width: 186px; background: url('../img/title-contactform.jpg') no-repeat;}

            .content .title p {float: right;padding: 0;line-height: 15px;background: #fff;color: #ccc;}
                .content .title p a {padding: 0 3px;}



        .content .reference {height: 260px; clear: both; overflow: hidden; border-bottom: 1px solid #f1f1f1;padding-top: 20px;}
        .content .reference.last {margin-bottom: 0;}
            .content .reference h2 {text-transform: none;font-size: 1.5em;color: #7e9601}
            .content .reference .info {width: 195px;float: left;padding: 30px 0 0 0;}
                .content .reference .info dl {line-height: 1.8em;margin-bottom: 10px;}
                    .content .reference .info dl dt {font-weight: bold;}
                    .content .reference .info dl dd a.out {text-align: left; display: inline;}
            .content .reference a.out {display: block; clear: both; text-align: right;}
            .content .reference span {display: block; clear: both; text-align: right;padding-right: 12px;}
            .content .reference span a.out {display: inline;}
            .content .reference a.preview {display: block;width: 705px;height: 206px; line-height: 206px; text-align: center; float: left; font-size: 1.4em;}

        .content ul.text-reference {clear: both;padding-top: 10px;border-bottom: 1px solid #f1f1f1}
            .content ul.text-reference li {background: #edecf0 url('../img/twitter-top.jpg') no-repeat 0 45px; margin-bottom: 20px;}
            .content ul.text-reference li strong {display: block; padding: 14px 0 10px;background: #fff;font-size: 1.5em;color: #7e9601;font-weight: normal;}
                .content ul.text-reference li strong span {color: #5a5a5a;font-size: 0.8em;font-weight: bold;}
                .content ul.text-reference li strong span a {color: #5a5a5a;text-decoration: none;}
                .content ul.text-reference li div {font-size: 1.0em;line-height: 1.6em;background: url('../img/twitter-btm.jpg') no-repeat bottom; padding: 25px 20px 10px;text-align: justify;}
  
        /* cols */
        .content .cols {background: url('../img/shade.jpg') no-repeat;padding: 20px 0 20px 20px; margin-bottom: 20px}
            .content .cols div {width: 31%; float: left;height: 220px; background: url('../img/dotted.gif') repeat-y 0 0;padding-left: 20px;}
            .content .cols div.col1 {background: none;padding: 0;width: 32%;}
                .content .cols div ul {padding: 5px 0;}
                .content .cols div ul.margin {margin-bottom: 15px;}
                    .content .cols div ul li {padding-left: 20px; line-height: 2.0em; background: url('../img/arrow.gif') no-repeat 0 55%; }
                        .content .cols div ul li span {text-decoration: line-through;}
                        .content .cols div ul li a {padding-right: 12px; background: url('../img/out.gif') no-repeat 100% 30px;}
                        .content .cols div ul li a:hover {background-position: 100% -17px;}

        /* price list */
        .content .pricelist {border-collapse: collapse;border: 0;width: 420px;float: left;}
            .content .pricelist td {background: url('../img/dotted.gif') repeat-x 0 34px;padding: 10px 0;}
            .content .pricelist td.price {font-weight: bold; width: 30%;text-align: right;}
            .content .pricelist tr:hover td {background-color: #92ad01;color: #fff; padding: 10px;}
            .content .pricelist tr.info td {background: none;padding: 15px 0;font-weight: bold; text-transform: uppercase;color: #92ad01;}
            .content .pricelist tr.info:hover td {color: #92ad01;}

        /* contact form */
        .content #result {display: none;}
            .content #result p {float: none; color: #5a5a5a;font-size: 1.2em;text-transform: none;line-height: 1.3em;}
            .content #result a {display: block; cursor: pointer;padding: 10px 0 10px 30px;width: 110px; margin: 30px auto;font-weight: bold;background: url('../img/mail_send.jpg') no-repeat 0 50%;}
        .content .contactform {width: 420px;float: right;}
            .content .contactform label {display: none;}
            .content .contactform div {padding: 0 0 7px;}
            .content .contactform input.text {color: #5a5a5a;background: #f9f9f9; position: relative; top: 3px;width: 239px; padding: 5px;border: 1px solid #dedede;border-right-color: #f0f0f0;border-bottom-color: #f0f0f0;}
            .content .contactform input.text:focus {border: 1px solid #d1d1d1;background: #f6f6f6}
            .content .contactform textarea {color: #5a5a5a;font-size: 1.0em;font-family: Arial;background: #f9f9f9; position: relative; top: 3px;width: 410px; height: 90px;padding: 5px;border: 1px solid #dedede;border-right-color: #f0f0f0;border-bottom-color: #f0f0f0;}
            .content .contactform textarea:focus {border: 1px solid #d1d1d1;background: #f6f6f6}
            .content .contactform p {float: left;padding: 5px 0;color: #92ad01;font-weight: bold;text-transform: uppercase;}
            .content .contactform .submit {padding: 5px 20px; font-weight: bold; font-size: 1.2em;font-family: Arial; text-transform: uppercase;float: right;}
            .content #loader {display: none; width: 420px;float: right; height: 200px;	background: url('../img/loading.gif') no-repeat 50% 50%;}

  	/* FOOTER ----------------------------------------------------------------------------------------------------- */
    .footer {padding: 10px 0 20px;color: #606060;font-size: 0.9em;background: url('../img/dashed.gif') repeat-x left top;}
        .footer a {margin-left: 5px;text-decoration: none;color: #606060;font-weight: bold;}
        .footer a:hover {color: #000}


#atrtitle {border:1px solid #92ad01;background:#92ad01;color:#FFF;padding:10px;font-weight: bold;position:absolute;font-size:1.0em;z-index: 100;}



/* OTHER ----------------------------------------------------------------------------------------------------- */
hr { display:block; height:1px; margin:10px 0; padding:0; border:0 solid #CCC; background:#CCC; color:#CCC;}
.clear { clear:both; display: block; height:0;line-height:0;font-size:0; width: 100%;}
.noscreen { display:none; }
.flt-l {float: left;}
.flt-r {float: right;}
.bold {font-weight: bold;}
.center {text-align: center;}
.noborder {border: 0;}
/* clearfix */
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden}
.clearfix {display: inline-block;}
/* hidden for ie mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}