/********************************************************************************************************************
	
	Autor:   Martin Felcman - martin@felcman.cz - www.felcman.cz
	
 *****************************************************************************************************************/

/*----- reset -----*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, header, section, article, nav, aside, footer, hgroup, figure, figcaption {border: 0; margin: 0; padding: 0; vertical-align: baseline; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit;}

table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}

blockquote:before, blockquote:after,
q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

li {list-style-type: none;}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

h1, h2, h3, h4 {font-weight: normal;}

header, section, article, nav, aside, footer, hgroup, figure, figcaption {display: block;}

.clearfix { clear:both;}

/*----- fonts -----*/
@font-face {
	font-family: 'KlavikaBasicRegular';
	src: url('../fonts/klavikabasic-regular-webfont.eot');
	src: local('?'), url('../fonts/klavikabasic-regular-webfont.woff') format('woff'), url('../fonts/klavikabasic-regular-webfont.ttf') format('truetype'), url('../fonts/klavikabasic-regular-webfont.svg#webfont1SjbV04n') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'KlavikaBasicMedium';
	src: url('../fonts/klavikabasic-medium-webfont.eot');
	src: local('?'), url('../fonts/klavikabasic-medium-webfont.woff') format('woff'), url('../fonts/klavikabasic-medium-webfont.ttf') format('truetype'), url('../fonts/klavikabasic-medium-webfont.svg#webfont7eoY9vwr') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'KlavikaBasicMedium';
	src: url('../fonts/klavikabasic-medium-webfont.eot');
	src: local('?'), url('../fonts/klavikabasic-medium-webfont.woff') format('woff'), url('../fonts/klavikabasic-medium-webfont.ttf') format('truetype'), url('../fonts/klavikabasic-medium-webfont.svg#webfont7eoY9vwr') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'KlavikaBasicRegular';
	src: url('../fonts/klavikabasic-regular-webfont.eot');
	src: local('?'), url('../fonts/klavikabasic-regular-webfont.woff') format('woff'), url('../fonts/klavikabasic-regular-webfont.ttf') format('truetype'), url('../fonts/klavikabasic-regular-webfont.svg#webfont1SjbV04n') format('svg');
	font-weight: normal;
	font-style: normal;
}

.KlavikaBasicMedium { font-weight: normal; font-style: normal; line-height:normal; font-family: 'KlavikaBasicMedium', sans-serif; font-size-adjust: 0.49;}
.KlavikaBasicRegular { font-weight: normal; font-style: normal; line-height:normal; font-family: 'KlavikaBasicRegular', sans-serif; font-size-adjust: 0.49;}

/*----- structure -----*/
body { font-family: Georgia, "Times New Roman", Times, serif; background: #fff; color: #303233; text-align: center; height: auto; text-rendering: optimizeLegibility; }
#header { height: 231px; width: 100%; background: url(../images/header-bg.png) top left;}
#content { margin: 0 auto; width: 940px; text-align: left; padding: 35px 0 40px 0;}
#footer { clear: both; height: 283px; width: 100%; background: url(../images/header-bg.png) bottom left;}

.container { position: relative; width: 940px; padding: 0; margin: 0 auto; text-align: left;}

/*----- header -----*/
#header .container { height: 231px;}
#header h1 { float: left; margin: 60px 0 0 0; width: 221px; height: 26px;}
#header nav { float: right; margin: 60px 0 0; height: 50px; width: 600px;}
#header nav ul { float: right; font-size: 1em; text-transform: uppercase; }
#header nav ul li { float: left; padding: 10px 0 0 50px;}
#header nav ul li a { color: #303233; text-decoration: none;}
#header nav ul li a:hover { color: #303233; border-bottom: 1px solid; padding: 0 0 0 0;}
#header h2 { display: block; float: left; width: 940px; height: 86px; position: absolute; bottom: 0; left: 0; z-index: 5; font-style: italic; color: #303233; font-size: 1.563em; text-shadow: #fdef89 -1px 1px 1px;}
#header span { display: block; background: #f3de41; padding: 8px 19px 0 19px; float: left; height: 35px;}

/*----- content -----*/
#content h2 { font-size: 1.25em; color: #000; padding: 0 0 13px 0; float: left; }

#content #services { float: left; margin: 0; width: 410px;}
#content #services ul { font-size: 1.125em; }
#content #services ul li { float: left; clear: both; padding: 13px 10px 23px 10px; margin: 0 0 25px 0; color: #fff; text-shadow: #1a5285 1px -1px 1px; background: url(../images/services-item-bg.png) bottom left no-repeat;}
#content #services a { display: block; font-size: 0.95em; color: #000; text-decoration: underline; clear: both; }
#content #services a:hover {color: #000; text-decoration: none; }

#content #clients { float: right; margin: 0; width: 460px;}
#content #clients .slideshow { position:relative; height:250px;	width:460px; float:left; cursor:pointer; }
#content #clients .slideshow img { display:none; position:absolute; top:0; left:0; height:250px; width: 460px; }
#content #clients .slidetabs { height: 6px; float: left; clear:both; width: 450px; margin: 15px 0 0 0;}
#content #clients .slidetabs a { width:6px; height:6px; float:left; margin: 0 10px 0 0; background: url(../images/slideshow-dot.png) 0 0 no-repeat; display:block; font-size:1px;}
#content #clients .slidetabs a.current { background-position:0 -6px;} 	
#content #clients .forward { float:right; background: url(../images/slideshow-arrow-forward.png) top right no-repeat; display:block; width:31px; height:67px; cursor:pointer; font-size:1px; text-indent:-9999em; position: absolute; top: 92px; right: -11px; z-index:5;	}
#content #clients .backward { float:left; background: url(../images/slideshow-arrow-backward.png) top right no-repeat; display:block; width:31px; height:67px; cursor:pointer; font-size:1px; text-indent:-9999em; position: absolute; top: 92px; left: -11px; z-index:5;}
#content #clients .disabled { visibility:hidden !important;}

#content #web { float: left; clear: both; margin: 35px 0 0 0; padding: 35px 0 0 0; border-top: 1px solid #f1f1f1; width: 100%;}
#content #socialmedia { float: left; clear: both; margin: 25px 0 0 0; padding: 35px 0 20px 0; border-top: 1px solid #f1f1f1; border-bottom: 1px solid #f1f1f1; width: 100%;}

#content .ref-management { float: right; height: 20px;}
#content .ref-management span.text { float: right; height: 18px; display: block; font-size: 0.95em; color: #dbdada; padding: 2px 10px 0 0;}
#content .ref-management a.icon-minus { float: right; width: 20px; height: 20px; display: block; background: url(../images/icon-minus.png) top center no-repeat;}
#content .ref-management a.icon-plus { float: right; width: 20px; height: 20px; display: block; background: url(../images/icon-plus.png) top center no-repeat;}
#content .ref-management a.icon-minus:hover { background: url(../images/icon-minus.png) bottom center no-repeat;}
#content .ref-management a.icon-plus:hover { background: url(../images/icon-plus.png) bottom center no-repeat;}

#content .ref-item { display: block; width: 300px; height: 160px; position: relative; float: left; margin-bottom: 20px; cursor: pointer;}
#content .ref-item-middle { margin: 0 20px 20px 20px;}
#content .ref-item .over { display: block; width: 298px; height: 158px; position: absolute; top: 0; left: 0; z-index: 5; border: 1px solid #f1f1f1; background: #fff; opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=)"; filter: alpha(opacity=0);	}
#content .ref-item .overlayer { display: block; width: 300px; height: 160px; position: absolute; top: 0; left: 0; float: left; background: url(../images/ref-overlay2.png) top center no-repeat; z-index: 1;}
#content .ref-item .over h3 { color: #3c7bb6; font-weight: normal; font-size: 0.95em; padding: 60px 30px 0 30px;}
#content .ref-item .over h4 { color: #111; font-weight: normal; font-size: 0.95em; padding: 5px 30px 0 30px;}
#content .ref-item .over a { display: block; color: #dbdada; font-size: 0.95em; margin: 30px 30px 0 30px; text-decoration: none;}


/*----- footer -----*/
#footer .container { height: 258px; background: #f3de41; width: 900px; padding: 25px 20px 0 20px;}
#footer #contact { width: 600px; float: left; padding: 0 0 0 10px;}
#footer #twitter { width: 280px; float: right;}
#footer #contact h2, #footer #twitter h2 { padding: 0 0 25px 0; font-style: italic; color: #303233; font-size: 1.25em; text-shadow: #fdef89 -1px 1px 1px; }

#footer #contact p { color: #000; font-size: 0.9em; padding: 15px 0 7px 0; line-height: 165%;}
#footer #contact p.fl-l { float: left; width: 265px;}
#footer #contact p.fl-r { float: right; width: 335px;}
#footer #contact p.license { color: #fff; font-size: 0.75em; clear: both; padding: 10px 0 0 0;}
#footer #contact p a { color: #000; text-decoration: underline;}
#footer #contact p a:hover { color: #000; text-decoration: none;}

#footer #twitter div.twitStream { width: 100%; padding: 10px 0 0 0;}
#footer #twitter div.twitStream ul { width: 100%; background: #fff; font-size: 0.9em; font-style: italic; color: #000; line-height: 165%;}
#footer #twitter div.twitStream ul li { padding: 13px 20px;}
#footer #twitter div.twitStream ul li a { color: #000; text-decoration: underline;}
#footer #twitter div.twitStream ul li a:hover { color: #000; text-decoration: none;}
#footer #twitter div.links-sm { width: 100%; padding: 10px 0 0 0; height: 40px;}
#footer #twitter div.links-sm a { display: block; float: left; width: 40px; height: 40px; margin: 0 10px 0 0; overflow: hidden; position: relative;}
#footer #twitter div.links-sm a span { display: block; position: absolute; top:0; left:0; z-index: 1; width: 40px; height: 40px; }

#footer #twitter div.links-sm a.icon-facebook span { background: url(../images/icon-facebook.png) top left no-repeat; }
#footer #twitter div.links-sm a.icon-twitter span { background: url(../images/icon-twitter.png) top left no-repeat; }
#footer #twitter div.links-sm a.icon-linkedin span { background: url(../images/icon-linkedin.png) top left no-repeat; }
#footer #twitter div.links-sm a:hover.icon-facebook span { background: url(../images/icon-facebook.png) bottom left no-repeat; }
#footer #twitter div.links-sm a:hover.icon-twitter span { background: url(../images/icon-twitter.png) bottom left no-repeat; }
#footer #twitter div.links-sm a:hover.icon-linkedin span { background: url(../images/icon-linkedin.png) bottom left no-repeat; }



/*----- fancybox -----*/
#fancybox-wrapper { height: 598px; width: 850px; text-align: left; position: absolute; top: 0; left: 0; }

#fancybox-header { height: 98px; width: 100%; background: url(../images/fb-header-bg.png) top left repeat-x;}
#fancybox-header h1 { padding: 25px 30px 0 30px; color: #fff; font-size: 1.625em; font-weight: normal; text-align: left; text-shadow: #1f588c -1px 1px 1px; }

#fancybox-wrapper div.slidegallery { width: 480px; float: left; clear: both; margin: 30px 0 0 30px; }
#fancybox-wrapper div.slidegallery .slideshow { position:relative; height:360px; width:480px; float:left; cursor:pointer; }
#fancybox-wrapper div.slidegallery .slideshow img { display:none; position:absolute; top:0; left:0; height:360px; width: 480px; }
#fancybox-wrapper div.slidegallery .slidetabs { height: 6px; float: left; clear:both; width: 480px; margin: 15px 0 0 0;}
#fancybox-wrapper div.slidegallery .slidetabs a { width:6px; height:6px; float:left; margin: 0 10px 0 0; background: url(../images/slideshow-dot.png) 0 0 no-repeat; display:block; font-size:1px;}
#fancybox-wrapper div.slidegallery .slidetabs a.current { background-position:0 -6px;} 	
#fancybox-wrapper div.slidegallery .disabled { visibility:hidden !important;}



#fancybox-wrapper div.info { width: 270px; float: right; margin: 30px 30px 0 0; }
#fancybox-wrapper div.info h2 { color: #3c7bb6; font-size: 0.95em; line-height: 150%; }
#fancybox-wrapper div.info p { color: #111; font-size: 0.95em; line-height: 150%; padding: 0 0 15px 0;}
#fancybox-wrapper div.info p a { color: #111; text-decoration: underline; padding: 0 17px 0 0; background: url(../images/icon-nw.png) center right no-repeat;}
#fancybox-wrapper div.info p a:hover { color: #111; text-decoration: none;}
#fancybox-wrapper div.info div.social-plugins { clear: both; padding: 10px 0 0 0;}
#fancybox-wrapper div.info div.social-plugins iframe { clear: both; margin: 5px 0 0 0;}


#fancybox-wrapper div.bottom-line { position: absolute; bottom: 0; left: 0; width: 850px; height: 60px; background: url(../images/fb-bottom-line-bg.png) top left; font-size: 0.95em;}
#fancybox-wrapper div.bottom-line a.prev { color: #3c7bb6; text-decoration: none; float: left; margin: 22px 0 0 30px; }
#fancybox-wrapper div.bottom-line a.next { color: #3c7bb6; text-decoration: none; float: right; margin: 22px 30px 0 0;}
#fancybox-wrapper div.bottom-line a:hover { color: #111; }