@charset "utf-8";
/* CSS Document - AROK */

/******************************

	global

******************************/
* { padding: 0; margin: 0; }
body { font: 12px Arial, Helvetica, sans-serif; color: #333; background: #fff url(/img/body-bg.png) 0 0 repeat-x; padding-bottom: 30px; }

a { color: #000; text-decoration: underline; }
a:hover { text-decoration: none; }
a img { border: none; }
hr { display: none; }
.left { float: left; }
.right { float: right; }
.clear { clear: both; line-height: 0; }
.hidden { display: none !important; }
.center { text-align: center; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.bold { font-weight: bold; }
.green { color: #390; }
.red { color: #b00; }

/* overlapping */
.overlap { position: relative; overflow: hidden; }
.overlap span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: 0 0; background-repeat: no-repeat; }
.overlap a span,
a.overlap span { cursor: pointer; }


/******************************

	layout

******************************/
#page-wrapper { width: 1000px; margin: auto; padding: 0 1px 1px; position: relative; background-color: #fff; }
#column-wrapper { overflow: auto; }
#left-column { float: left; width: 220px; padding: 10px; }
#content { float: right; width: 720px; padding: 0 25px 25px 15px; }

/* homepage */
#hp #content { width: 950px; float: none; padding: 0 25px 20px; }


/******************************

	homepage

******************************/
#hp #content #news { float: right; width: 250px; border: 1px solid #eee; padding: 0 10px 10px; margin-top: 20px; }
#hp #content #news h2 { font-size: 16px; background-color: #f5f5f5; padding: 5px 10px; margin: 0 -10px 10px; }
#hp #content #news h3 { font-size: 14px; margin-bottom: 10px; }
#hp #content #news .text { font-size: 12px; line-height: 1.3; }

#hp #services { margin: 0 -20px 0 0; overflow: auto; }
#hp #services li { float: left; margin-right: 20px; }
#hp .services { list-style: none; overflow: auto; margin: 0; }
#hp .services li { width: 298px; height: 110px; margin: 0 0 20px 0; padding: 0; background: none; border: 1px solid #eee; overflow: hidden; }
#hp .services li:hover { border-color: #ccc; }
#hp .services li.no-margin { margin-right: 0; }
#hp .services li h2 { font-size: 16px; letter-spacing: -1px; font-weight: bold; background-color: #666; color: #fff; line-height: 24px; padding: 0 7px; margin: 0; }
#hp .services li h2 a { text-decoration: none; color: #fff; }
#hp .services li h2 a:hover { text-decoration: underline; }
#hp .services li img { float: left; padding: 0 10px 0 10px; }
#hp .services li p { font-size: 11px; line-height: 1.3; color: #666; margin: 0; padding: 6px 5px 0; }

#hp .services .zelezarstvi h2,
#hp .services .zelezarstvi h2 a { background-color: #036; color: #fff; }
#hp .services .skolka h2,
#hp .services .skolka h2 a { background-color: #fc0; color: #333; }
#hp .services .seleterie h2,
#hp .services .seleterie h2 a { background-color: #58582f; color: #fff; }
#hp .services .drogerie h2,
#hp .services .drogerie h2 a { background-color: #94b7db; color: #fff; }
#hp .services .jazykova-skola h2,
#hp .services .jazykova-skola h2 a { background-color: #99b000; color: #fff; }
#hp .services .restaurace h2,
#hp .services .restaurace h2 a { background-color: #828258; color: #fff; }
#hp .services .cafedecor h2,
#hp .services .cafedecor h2 a { background-color: #f8e4cd; color: #000; }
#hp .services .cafedecor img { margin-top: 13px; }


/******************************

	header

******************************/
#header { height: 95px; background: url(/img/header-bg.png) 0 0 repeat-x; border-bottom: 20px solid #99adc2; }
#logo { font-size: 48px; font-weight: bold; color: #444; padding: 20px 0 0 20px; float: left; }
#logo a { color: #036; text-decoration: none; margin-right: 20px; }
#header .services { padding-top: 28px; }
#header .services span { display: block; float: left; height: 52px; padding: 10px 25px 0 0; font-size: 35px; letter-spacing: -2px; color: #99acc1; font-style: normal; font-weight: normal; }
#header .services .obchod { background: url(/img/header-obchod.png) 0 0 no-repeat; padding-left: 145px; margin-left: 20px; }
#header .services .vzdelani { background: url(/img/header-vzdelani.png) 0 0 no-repeat; padding-left: 85px; }
#header .services .gastronomie { background: url(/img/header-gastronomie.png) 0 0 no-repeat; padding-left: 60px; padding-right: 0; }
#header .services .sluzby { background: url(/img/header-sluzby.png) 0 0 no-repeat; padding-left: 110px; padding-right: 0; margin-left: 40px; }


/******************************

	menu

******************************/
#menu { position: absolute; top: 100px; left: 10px; width: 980px; background-color: #99adc2; height: 28px; display: none; }
#menu ul { list-style: none; }
#menu ul li { float: left; border-right: 1px solid #ddd; }
#menu ul li a { display: block; float: left; padding: 0 15px; line-height: 28px; font-size: 17px; font-weight: bold; text-decoration: none; color: #fff; }
#menu ul li a:hover { background-color: #a8b9cb; }


/******************************

	left column

******************************/
#left-column h2 { font-size: 16px; color: #333; padding: 5px 10px; background-color: #f1f5f8; margin-bottom: 1px; }

/* left menu */
#left-menu ul { list-style: none; }
#left-menu ul li { border-bottom: 1px solid #eee; }
#left-menu ul li a { display: block; line-height: 28px; height: 28px; padding: 0 10px; color: #555; text-decoration: none; }
#left-menu ul li a:hover,
#left-menu ul li.active a { background-color: #ffc; color: #000; }
#left-menu ul li.active a { font-weight: bold; background-color: #fcfcfc; color: #516c88; }
/* submenu */
#left-menu ul ul li { border: none; }
#left-menu ul li.active ul li a,
#left-menu ul ul li a { font-size: 11px; font-weight: normal; color: #555; line-height: 24px; height: 24px; padding-left: 25px; background: #fff url(/img/arrow-blue.png) 13px 9px no-repeat; }
#left-menu ul li ul li a:hover,
#left-menu ul li.active ul li a:hover,
#left-menu ul ul li.active a { text-decoration: underline; color: #111; background-color: #fff; }
#left-menu ul li ul li.active a { font-weight: bold; }


/*****************************

	right column

******************************/


/******************************

	content

******************************/
#content { font-size: 12px; min-height: 400px; }
#content h1 { margin: 20px 0 15px; font-size: 28px; font-weight: normal; color: #036; letter-spacing: -1px; }
#content h2 { margin: 20px 0 10px; font-size: 18px; font-weight: normal; color: #036; letter-spacing: -1px; }
#content h3 { margin: 15px 0 0; font-size: 15px; color: #000; }
#content h4 { margin: 10px 0 5px; font-size: 14px; color: #333; }
#content p { margin: 5px 0 10px; line-height: 1.5; }
#content p.intro { font-size: 14px; }
#content img.right { margin: 5px 0 5px 15px; }
#content img.left { margin: 5px 15px 5px 0; }
#content ul { list-style: none; margin: 10px; }
#content ul li { background: url(/img/arrow-blue.png) 0 7px no-repeat; padding: 3px 0 4px 12px; }

#content .box { border: 1px solid #eee; padding: 10px 10px 0; }
#content .box.yellow { background-color: #ffe; }

#content #news { width: 280px; padding-bottom: 5px; margin: 10px 0; }
#content #news.right { margin-left: 15px; }
#content #news h2 { font-size: 14px; margin: 0 0 5px; font-weight: bold; color: #036; }
#content #news ul { list-style: none; margin: 0; }
#content #news li { margin-bottom: 10px; padding: 0; background: none; }
#content #news h3 { margin: 0; font-size: 13px; }
#content #news p { margin: 3px 0; font-size: 12px; }
#content #news p.date { font-size: 11px; color: #999; margin: 0; }
#content #news p.text { font-size: 11px; }

/* galerie */
#content .gallery-list { list-style: none; margin: 15px 0; }
#content .gallery-list h2 { font-size: 15px; font-weight: bold; margin: 0 0 10px; }
#content .gallery-list li { background: none; float: left; width: 200px; height: 150px; margin: 0 10px 10px 0; padding: 10px; overflow: hidden; background-color: #f9f9f9; border: 1px solid #d5d5d5; text-align: center; }
#content .navigation { font-size: 14px; }
#content .photo-box { float: left; margin: 5px; display: block; width: 150px; height: 150px; padding: 7px; text-align: center; background-color: #f9f9f9; border: 1px solid #d5d5d5; }
#content .gallery-list li:hover,
#content .photo-box:hover { background-color: #ffe; border-color: #aaa; }
#content .photo-box img { margin-top: 20px; }
#content .photo-box.vertical img { margin-top: 0; }


/* seleterie */
#content p.price-list { text-align: right; width: 370px; }
#content p.price-list span { float: left; }


/* content layout */
#content .contact { border-top: 2px solid #99adc2; overflow: auto; margin-top: 20px; }
#content .contact h2 { margin: 10px 0 0; }
#content .contact .column-1,
#content .contact .column-2 { float: left; width: 350px; }
#content .contact .column-1 { padding-right: 20px; }

/* links */
#content #links li { float: left; width: 200px; padding-right: 20px; }


/******************************

	forms, tables

******************************/
form fieldset { border: none; }
input.input,
textarea,
select { font: 12px Arial, Helvetica, sans-serif; border: 1px solid #99ADC2; padding: 5px; box-shadow: inset 0 0 10px #ddd; }

/* form */
.form { margin: 20px 0; }
.form label { display: inline-block; padding: 0 0 3px 0; }
.form input[type="image"] { margin: 15px 0 0; }
.form textarea { width: 360px; height: 100px; }
#content .form p { margin: 0; padding: 5px 0 5px; }
#content p.info-msg { font-weight: bold; }

/* cenik */
table.price-list { width: 720px; border-collapse: collapse; margin: 0 0 15px; }
table.price-list td { border-collapse: collapse; padding: 8px 0; border-bottom: 1px solid #eee; vertical-align: top; line-height: 1.4; }
table.price-list td.price { padding-left: 15px; width: 200px; }
#content table.price-list h2 { margin: 10px 0 -5px; font-size: 18px; }
#content table.price-list h3 { margin: 0px 0 -5px; font-size: 14px; }
table.price-list strong { color: #444; }



/******************************

	footer

******************************/
#footer { background-color: #eee; color: #666; font-size: 11px; padding: 10px 15px; }
#footer a { color: #666; }