body{background:#333; text-align: center; color:#fff;}

/* LAYOUT */
#header {background: #FFFFFF url('../img/light/bg-header-in.png') 50% 0 no-repeat; padding: 1px 0; color: #333;}
#middle {background: #333333; padding: 1px 0; color: #fff;}
#main {background: #d5d5d5 url('../img/light/bg-main.png') 0 0 repeat-x; color: #333; border-top: 1px solid #fff; margin: -1px 0 0;}
#footer {padding: 1px 0 10px;}

#col-content {float: right; display: inline; width: 610px; margin-right: 5px; margin-top: 5px; }
#col-side {float: left; display: inline; width: 307px; margin-left: 5px; margin-top: 5px; }

#footer .in, #main .in, #header .in, #middle .in {margin: 0 auto; width: 960px; text-align: left;}
#middle .in { padding: 0 0 0 310px; width: 650px; height: 382px;}

#middle .images0 {background: #2B2B2B url('../img/light/motive-home.jpg') 0 0 no-repeat; }
#middle .images1 {background: #2B2B2B url('../img/light/motive-home_1.jpg') 0 0 no-repeat; }
#middle .images2 {background: #2B2B2B url('../img/light/motive-home_2.jpg') 0 0 no-repeat; }
#middle .images3 {background: #2B2B2B url('../img/light/motive-home_3.jpg') 0 0 no-repeat; }
#middle .images4 {background: #2B2B2B url('../img/light/motive-home_4.jpg') 0 0 no-repeat; }
#middle .images5 {background: #2B2B2B url('../img/light/motive-home_5.jpg') 0 0 no-repeat; }

#main .in {background: #fff url('../img/light/bg-main-in.png') 0 0 repeat-x; padding: 8px; width: 944px;}
#footer .in {color: #395707; background: #A5CA51 url('../img/light/bg-footer.png') 0 0 no-repeat; width: 959px;}



/* LOGO BOX */
#logo-box {float: left; display: inline; margin: 10px 0;}

/* COLOR VARIATS */
.color-var {float: right; display: inline; margin: 15px 0 0;}
.color-var strong {width: 91px; height: 23px; display: inline-block; background: url('../img/light/light.png') 0 0 no-repeat;}
.color-var a {width: 91px; height: 23px; display: inline-block; background: url('../img/light/dark.png') 0 0 no-repeat;}

/* MENU */
#menu {float: right; display: inline; margin: 15px 0 0 5px;}
#menu .reset li {float: left; display: inline; margin: 0 0 0 10px;}
#menu .reset li a {width: 29px; height: 17px; display: block;}
#menu .reset li .home {background: url('../img/light/ico-home.png') 0 0 no-repeat;}
#menu .reset li .tree {background: url('../img/light/ico-tree.png') 0 0 no-repeat;}
#menu .reset li .contact {background: url('../img/light/ico-contact.png') 0 0 no-repeat;}

/* MAIN MENU */
#main-menu {background: url('../img/light/bg-main-menu.png') 0 0 no-repeat; margin: 5px -17px 17px; padding: 0 17px; position: relative;}
#main-menu .reset li {float: left; display: inline;}
#main-menu .reset li a {background: #4D4D4D; color: #fff; text-decoration: none; font-size: 127.5%; min-height: 34px; display: block; line-height: 34px; margin: 0 1px 0 0;}
#main-menu .reset li a span {padding: 0 15px; background: url('../img/light/bg-main-menu-span.png') 0 50% no-repeat;}
#main-menu .sub-menu .reset li.first a, #main-menu .reset li.first span {background: none;}
#main-menu .reset li a strong, #main-menu .reset li:hover a span, #main-menu .reset li.hover a span {display: block; border: 5px solid #83B43F; background: #83B43F; font-weight: normal; padding: 0 10px; position: relative; top: -10px; height: 44px; line-height: 44px; cursor: pointer;}
#main-menu .reset li a .cor {display: none;}
#main-menu .reset li a strong .cor, #main-menu .reset li:hover a span .cor, #main-menu .reset li.hover a span .cor {display: block !important; padding: 0 !important; background-image: url('../img/light/corner-ggreen-white.png') !important; line-height: 1px !important; font-size: 1px !important; height: 5px !important; border: none !important; position: absolute !important;}
#main-menu .reset li a strong .c-r, #main-menu .reset li:hover a span .c-r, #main-menu .reset li.hover a span .c-r, #main-menu .reset li a strong .c-l, #main-menu .reset li:hover a span .c-l, #main-menu .reset li.hover a span .c-l {top: -5px !important;}


#main-menu .reset li .sub-menu {display: none; position: absolute; background: #84B440 url('../img/light/bg-sub-menu.png') 0 100% no-repeat; width: 960px; left: 17px; top: 40px; z-index: 10; min-height: 32px; font-size: 84%;}
#main-menu .reset li.active .sub-menu {display: block; z-index: 10;}
#main-menu .reset li.hover .sub-menu, #main-menu .reset li:hover .sub-menu {display: block; z-index: 50;}
#main-menu .reset li .sub-menu .cor {background-image: url('../img/light/corner-ggreen-white.png');0} 
#main-menu .reset li .sub-menu .c-l {left: 0; top: 0;}
#main-menu .reset li .sub-menu .c-r {right: 0; top: 0;}
#main-menu .reset li .sub-menu .reset {margin: 0 15px;}
#main-menu .reset li .sub-menu a {min-height: 1px; line-height: 1; margin: 3px 1px 2px; padding: 0 0 0 15px; background: url('../img/light/bg-sub-menu-span.png') 0 50% no-repeat;}
#main-menu .reset li .sub-menu a span {height: auto; line-height: 1; padding: 0; border: none; position: static; padding: 7px 12px 6px 0; display: block; background: none;}
#main-menu .reset li .sub-menu a strong, #main-menu .reset li .sub-menu a:hover span {height: auto; line-height: 1; padding: 0; border: none; position: static; background: url('../img/light/bg-sub-menu-active.png') 100% 0 no-repeat; padding: 7px 12px 6px 0;}
#main-menu .reset li .sub-menu .active a, #main-menu .reset li .sub-menu a:hover {background: url('../img/light/bg-sub-menu-active.png') 0 0 no-repeat;}

/* MOTIVE */
#middle .internet {background: url('../img/light/motive-internet.jpg') 0 0 no-repeat; height:109px;}
#middle .medialnikampan {background: url('../img/light/motive-medialnikampan.jpg') 0 0 no-repeat; height:109px;}
#middle .firma {background: url('../img/light/motive-firma.jpg') 0 0 no-repeat; height:109px;}
#middle .vizual {background: url('../img/light/motive-vizualnistyl.jpg') 0 0 no-repeat; height:109px;}
#middle .marketing {background: url('../img/light/motive-marketing.jpg') 0 0 no-repeat; height:109px;}
#middle .onas {background: url('../img/light/motive-onas.jpg') 0 0 no-repeat; height:109px;}
#middle .kontakt {background: url('../img/light/motive-kontakt.jpg') 0 0 no-repeat; height:109px;}
#middle .seo {background: url('../img/light/motive-seoappc.jpg') 0 0 no-repeat; height:109px;}
#middle .public {background: url('../img/light/motive-publicrelations.jpg') 0 0 no-repeat; height:109px;}


/* HOME REFER */
.home-refer {padding: 15px 0px 5px 0px;}
.home-refer .row {float: left; display: inline; width: 20px; padding: 70px 0 0;}
.home-refer .row .prev {width: 18px; height: 28px; display: block; background: url('../img/light/row-left.png') 0 0 no-repeat;}
.home-refer .row .next {width: 18px; height: 28px; display: block; background: url('../img/light/row-right.png') 0 0 no-repeat;}
.home-refer .spc {float: left; display: inline; width: 570px; position: relative; border: 5px solid #8FBB45; padding: 2px; margin: 0 10px;}
.home-refer .spc h2 {position: absolute; top: 0; left: 0; color: #fff; background: url('../img/light/bg-home-refer-h2.png') 100% 0 no-repeat; font-size: 140%; font-weight: normal; width: 160px; height: 42px; text-align: center; line-height: 1.7; z-index:10;}
.home-refer .spc .l {width: 300px;}
.home-refer .spc .l img {display: block;}
.home-refer .spc .r {width: 240px; margin: 0 10px 0 0;}
.home-refer .spc h3 {font-size: 140%; margin: 0.5em 0; font-weight: normal;}
.home-refer .spc p {font-size: 100%; margin: 0 0 1em; color: #B5B5B5;}
.home-refer .spc .right {font-size: 110%; margin: 0; color: #fff;}
.home-refer .spc .right strong {color: #83B43F;}

/* ANNOT BOX */
#annot-box {float: left; display: inline; width: 300px; margin: 0 0 0 30px;}
#annot-box h1 {font-size: 140%; font-weight: normal; margin: 0 0 1em;}
#annot-box p {color: #B5B5B5;}

/* NEWS BOX */
.news-box {float: right; display: inline; width: 259px; padding: 0 30px 0 0; margin: 0 10px 0 0;}
.news-box h2 {width: 248px; background: #9AC24B url('../img/light/bg-news-box-h2.png') 0 0 no-repeat; color: #fff; font-size: 140%; font-weight: normal; padding: 6px 0 0px 15px;}
.news-box h2 span {display: block; background: url('../img/light/bg-news-box-h2-span.png') 0 100% no-repeat; padding: 0 0 19px; margin: 4px 0 0 -15px; line-height: 1px; font-size: 1px;}
.news-box .reset li {margin: 0 0 10px 7px; position: relative;}
.news-box .reset li h3 {font-size: 120%; font-weight: bold; color: #fff; margin: 0;}
.news-box .reset li h3 a {text-decoration: none; color: #fff;}
.news-box .reset li h3 span {font-weight: normal; color: #7D7D7D;}
.news-box .reset li p {font-size: 100%; color: #AEAEAE; margin: 0;}
.news-box .reset li .more {position: absolute; right: -30px; bottom: 0; margin: 0;}
.news-box .reset li .more a {display: block; width: 23px; height: 15px; background: url('../img/light/ico-more.png') 0 0 no-repeat;}

/* HOME CROSSROAD */
.home-crossroad .reset {margin: 0px 0 0 -10px;}
.home-crossroad .reset li {float: left; display: inline; width: 228px; margin: 0 0 20px 10px;}
.home-crossroad .reset li h2 {width: 228px; color: #fff; font-size: 130%; font-weight: normal;}
.home-crossroad .reset li h2 a {color: #fff; text-decoration: none; display: block; background: #3F3F3F url('../img/light/bg-home-crossroad-h2.png') 0 0 no-repeat; padding: 4px 0 0px 0;}
.home-crossroad .reset li h2 span {display: block; background: url('../img/light/bg-home-crossroad-h2-span.png') 0 100% no-repeat; padding: 0 0 15px 15px; margin: 0 0 0 0;}
.home-crossroad .reset li p {margin: 0 20px 1em; color: #727272; font-size: 90%;}
.home-crossroad .reset li .right {margin: 0 0 0; color: #999999; font-size: 90%;}
.home-crossroad .reset li .right a {display: inline-block; width: 29px; height: 15px; background: url('../img/light/ico-more-white.png') 0 0 no-repeat;}

/* CROSSRAOD */
.crossroad .reset {margin: 0 0 0 -6px; padding-bottom: 15px; }
.crossroad .reset li {float: left; display: inline; width: 302px; margin: 0 0 4px 6px;}
.crossroad .reset li a {display: block; background: #9BC24B url('../img/light/bg-crossroad.png') 0 0 no-repeat; font-size: 120%; color: #fff; text-decoration: none; padding: 3px 0 0 0; line-height: 1.8;}
.crossroad .reset li a span {display: block; background: url('../img/light/bg-crossroad-span.png') 0 100% no-repeat; padding: 0 0 0px 15px;}

.crossroad-left .reset {margin: 0px;}
.crossroad-left .reset li {float: left; display: inline; width: 306px; margin: 0 0 4px 0; height: 26px; }
.crossroad-left .reset li a {display: block; background: url('../img/light/bg-crossroad-left.png') 0 0 no-repeat; font-size: 120%; color: #fff; text-decoration: none; padding: 3px 0 0 0; line-height: 1.8;}
.crossroad-left .reset li.active a {display: block; background: url('../img/light/bg-crossroad-left-on.png') 0 0 no-repeat; font-size: 120%; color: #fff; text-decoration: none; padding: 3px 0 0 0; line-height: 1.8;}
.crossroad-left .reset li a span {display: block; padding: 0 0 0 15px;}


/* CONTENT */
#content {background: #2C2C2C; color: #fff; border: 5px solid #2C2C2C; padding: 1px 15px; margin: 0; position: relative;}

#content #hl_stranka {background: #2C2C2C; color: #fff; margin-top: 10px; border: 5px solid #2C2C2C; padding: 1px 15px; margin: 0; position: relative;}

#content .cor {background-image: url('../img/light/corner-black-white.png');}
#content_h1 {font-weight: bold; font-size: 150%; color: #ffffff; padding: 0 0 0 18px; background: url('../img/light/bg-content-h2.png') 0 50% no-repeat; margin: 0.3em 0 0.5em;}
#content h2 {font-weight: bold; font-size: 150%; color: #ffffff; padding: 0 0 0 18px; background: url('../img/light/bg-content-h2.png') 0 50% no-repeat; margin: 1.2em 0 0.5em;}
#content h2.zelena {font-weight: bold; font-size: 150%; color: #96bf49; padding: 0 0 0 18px; background: url('../img/light/bg-content-h2.png') 0 50% no-repeat; margin: 1.2em 0 0.5em;}
#content h3 {font-weight: bold; font-size: 130%; color: #96bf49; margin: 0px; padding: 0px; margin-bottom: 7px; }

#content p { font-size: 120%;}
#content p.zelena { color: #96bf49; }
#content strong.zelena { color: #96bf49; }
#content a {color: #fff; text-decoration: underline; }
#content .polovina { float: left; width: 50%; }

/* REFER BOX */
.refer-box {padding: 0 0 15px;}
.refer-box2 {padding: 0 0 15px;}
.refer-box h2 {width: 292px; background: #2B2B2B url('../img/light/bg-refer-h2.png') 0 0 no-repeat; color: #fff; font-size: 140%; font-weight: normal; padding: 7px 0 0px 15px;}
.refer-box h2 span {display: block; background: url('../img/light/bg-refer-h2-span.png') 0 100% no-repeat; padding: 0 0 18px; margin: 5px 0 0 -15px; line-height: 1px; font-size: 1px;}
.refer-box .big-img {position: relative; margin: 0 0 5px;}
.refer-box .big-img img {margin: 0 auto 3px; border: 2px solid #000; display: block;}
.refer-box .big-img a {color: #000; text-decoration: none; display: block;}
.refer-box .big-img span {padding-left: 5px;}
.refer-box .small-img {position: relative; margin: 0 0 5px; width: 141px;}
.refer-box .small-img img {margin: 0 auto 3px; border: 2px solid #000; display: block;}
.refer-box .small-img a {color: #000; text-decoration: none; display: block;}

/* QUICK BOX */
.quick-box h2 {width: 291px; background: #9AC24B url('../img/light/bg-quick-box-h2.png') 0 0 no-repeat; color: #fff; font-size: 140%; font-weight: normal; padding: 7px 0 0px 15px;}
.quick-box h2 span {display: block; background: url('../img/light/bg-quick-box-h2-span.png') 0 100% no-repeat; padding: 0 0 18px; margin: 5px 0 0 -15px; line-height: 1px; font-size: 1px;}
.quick-box p {color: #494848; margin: 0 15px 0.7em;}

/* QUICK BOX */
.kontakt-box {width: 306px; background: #9AC24B url('../img/light/bg-quick-box-h2.png') 0 0 no-repeat; }
.kontakt-box h2 {width: 291px; color: #fff; font-size: 140%; font-weight: normal; margin: 0px; padding: 7px 0 7px 15px;}
.kontakt-box p {margin: 0 15px 0.7em;}
.kontakt-box img {display: block;}
/* FOOTER */
#footer .in .spc {background: url('../img/light/bg-footer-spc.png') 0 100% no-repeat; padding: 8px 20px;}
#footer .in .spc p {margin: 0;}
#footer .in .spc p a {color: #395707; margin: 0 5px; text-decoration: none;}

/* HOVER */ 
.refer-box .big-img a:hover, .refer-box .small-img a:hover, .crossroad .reset li a:hover, .home-crossroad .reset li h2 a:hover, #footer .in .spc p a:hover, .news-box .reset li h3 a:hover {text-decoration: underline;}
#content a:hover {text-decoration: none;}

/* CORNERS */
.cor {width: 5px; height: 5px; display: block; background-image: url('../img/light/corner-green-black.png'); background-repeat: no-repeat; position: absolute; line-height: 5px; font-size: 5px;}
.c-l {top: -5px; left: -5px; background-position: 0 0 !important;}
.c-r {top: -5px; right: -5px; background-position: 100% 0 !important;}
.c-bl {bottom: -5px; left: -5px; background-position: 0 100% !important;}
.c-br {bottom: -5px; right: -5px; background-position: 100% 100% !important;}


/* Formulář - dotazovací */
#form_celek { color: #000; margin: 0px; padding: 0px; }
#form_celek input.submit { background-image: url('../img/light/formular_odeslat.jpg'); background-repeat: no-repeat; height: 34px; width: 274px; border: 0px; margin-left: 0px; cursor: hand; }
#form_celek textarea { background-color: #2a2a2a; border: #f8ffe3 1px solid; height: 70px; width: 270px; color: #fff; }
.formular_pole_1 { background-color: #2a2a2a; border: #f8ffe3 1px solid; height: 17px; width: 270px; color: #fff; }
.formular_pole_2 { background-color: #2a2a2a; border: #f8ffe3 1px solid; height: 17px; width: 127px; color: #fff; }
#form_div_0 { float: left; padding-left: 15px; }
#form_div_1 { float: left; padding-left: 15px; width: 132px; }
#form_div_2 { float: left; padding-left: 11px; width: 132px; }
#form_div_3 { float: left; padding-left: 15px; }

/* JS */
.home-refer ul{width:10000px; }
.home-refer ul.reset li{white-space:normal; width:570px; float:left;}
.home-refer .wrap{width:570px; overflow:visible; overflow-x:scroll; zoom:1; position:relative; z-index:5;}
#middle div.js .wrap{overflow-x:hidden;}