/*-----------------------------------------------------------------------------------------------*/
/*                   BAHUR78 VER.03 - GRAPHIC AND WEB DESIGNER                                   */
/*                   AUTHOR: DARIUSZ "BAHUR78" MARTYN                                            */
/*                   EMAIL: bahur78@googlemail.com                                               */
/*-----------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/*                                  CSS RESET THANKS TO ERIC MEYER                               */
/*                   http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/                */
/*-----------------------------------------------------------------------------------------------*/
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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {outline: 0;}
body {line-height: 1;color: black;background: white;}
ol, ul {list-style: none;}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,
q:before, q:after {content: '"';}
blockquote, q {quotes: '"' '"';}

/*-----------------------------------------------------------------------------------------------*/
/*                                          GENERAL STYLES                                       */
/*-----------------------------------------------------------------------------------------------*/

*{margin:0; padding:0;}/* set all elements to have 0 margin and padding */
body{background:#dcc4a2 url(../images/bg_body.jpg) left top repeat scroll; font-family:Courier New, Times New Roman, Century, serif; line-height:1.5em; font-size:0.8em; color:#1d1a16; border:10px solid rgba(255, 255, 255, 0.2);}
body #loader {width:16px; height:16px; background:url(../images/loader.gif) center center no-repeat; position:absolute; left:50%; top:50%; margin:0 0 0 -8px;}

/****************************** HTML DIV'S STRUCTURE ********************************/

/************************************************************************************/
/********************************** page ********************************************/
/************************************************************************************/


#page{width:100%; height:auto; float:left; margin:0 auto; padding:0; background:url(../images/bg_page.png) top center repeat-x;}


/************************************************************************************/
/********************************** header ******************************************/
/************************************************************************************/


#header{width:100%; height:350px; margin:0; padding:0;}
#header #innerheader{width:1000px; height:350px; margin:0 auto; padding:0; position:relative;}

#header #innerheader h1{font-size:1.2em; color:#1d1a16; display:block; text-indent:-1000em; position:absolute; top:50px; left:0; z-index:1;}
#header #innerheader h1 a{width: 565px; height:160px; display:block; overflow:hidden; text-indent:-1000em; background: url(../images/logo_h1.png) no-repeat; color:#bda782; outline:none;}
#header #innerheader h1 a:hover{background: url(../images/logo_h1.png) no-repeat; background-position: 0 -160px; outline:none;}

#header #innerheader h2{width:1000px; height:100px; display:block; overflow:hidden; font-size:1.2em; color:#1d1a16; text-indent:-1000em; position:absolute; bottom:20px; right:0; background: url(../images/logo_h2.png) no-repeat;}

#header #innerheader #usersonline{position:absolute; top:235px; right:15px; border-bottom:0px dashed #1d1a16; padding:0; margin:0; text-transform:uppercase; font-size:1em;}
#header #innerheader #version{position:absolute; top:30px; left:500px; z-index:2;}

/************************************************************************************/
/********************************** navigation **************************************/
/************************************************************************************/


#navigation{width:100%; height:140px; margin:0; padding:0; background:url(../images/) center center no-repeat;}
#navigation #innernavigation{width:1000px; height:140px; margin:0 auto; padding:0; position:relative;}

#navigation #innernavigation #main_navigation{width:1000px; height:140px; margin:0; padding:0; position:absolute; top:0; left:0;}
#navigation #innernavigation #main_navigation ul{display: block; width:1000px; height:140px; margin:0; padding:0;}
#navigation #innernavigation #main_navigation ul li{display: inline; list-style-type:none; vertical-align:middle; padding:0; margin:0; width:250px; height:140px; float:left;}
#navigation #innernavigation #main_navigation ul li a{width:250px; height:140px; text-indent:-1000em; display:block; overflow:hidden; color:#bda782; outline:none;}
#navigation #innernavigation #main_navigation img{margin: 0; border: 0;}

/********************** main_navigation buttons (link) ******************************/

#navigation #innernavigation #main_navigation_about{background: url(../images/navigation.png) 0 0 no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_work{background: url(../images/navigation.png) -250px 0 no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_contact{background: url(../images/navigation.png) -500px 0 no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_blog{background: url(../images/navigation.png) -750px 0 no-repeat; outline:none;}

/************************ main_navigation buttons (hover) ***************************/

#navigation #innernavigation #main_navigation_about:hover{background: url(../images/navigation.png) 0 -140px no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_work:hover{background: url(../images/navigation.png) -250px -140px no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_contact:hover{background: url(../images/navigation.png) -500px -140px no-repeat; outline:none;}
#navigation #innernavigation #main_navigation_blog:hover{background: url(../images/navigation.png) -750px -140px no-repeat; outline:none;}

/************************************************************************************/
/************************************* content **************************************/
/************************************************************************************/


#content{width:100%; height:auto; float:left; margin:0; padding:0;}
#content .spacer{background: url(../images/rule.png) center center no-repeat; width:100%; height:100px; display:block; overflow:hidden; text-indent:-1000em; padding:30px 0; margin:0 auto; clear:both;}

#content #innercontent{width:1000px; height:auto; margin:0 auto; padding:0;}

#content #innercontent #hello{text-transform:uppercase; font-size:1.2em; color:#1d1a16; display:block; text-indent:-1000em; margin:30px 0 0 0; padding:0; background:url(../images/hello.png) center center no-repeat; width:1000px; height:170px;}

#content #innercontent #primary{width:720px; height:auto; float:right; margin:0; padding:0 15px; position:relative;}
#content #innercontent #primary p{padding:0; margin:0 0 30px 0; font-size:1.2em}
#content #innercontent #primary h3{text-transform:uppercase; font-size:1.2em; color:#1d1a16; display:block; text-indent:-1000em; margin:0; padding:0;}
#content #innercontent #primary #myservice{ background:url(../images/my_service.png) center center no-repeat; width:720px; height:100px;} 
#content #innercontent #primary #mygraphics{ background:url(../images/my_graphics.png) center center no-repeat; width:720px; height:100px;}
#content #innercontent #primary #mywebsites{ background:url(../images/my_websites.png) center center no-repeat; width:720px; height:100px;}
#content #innercontent #primary #mycontact{ background:url(../images/my_contact.png) center center no-repeat; width:720px; height:100px;}


#content #innercontent #secondary{width:250px; height:auto; float:left; margin:0; padding:0; text-align:left; position:relative;}
#content #innercontent #secondary p{padding:0; margin:0; font-size:1.2em;}
#content #innercontent #secondary .secondaryinner{padding:0 15px; height:auto;}
#content #innercontent #secondary #tababout{background: url(../images/tab_about.png) top center no-repeat; width:250px; height:350px; display:block; overflow:hidden; text-indent:-1000em; padding:0; margin:0 auto;}


/************************************************************************************/
/************************************* footer ***************************************/
/************************************************************************************/


#footer{clear:both; width:100%; height:auto; background: url(../images/bg_footer.png) bottom center repeat-x; padding:0;}

#footer #credit{width:970px; height:auto; padding:15px 0; margin:0 auto; text-align:center;}

#footer #innerfooter{width:1000px; height:550px; background:url(../images/) center center no-repeat; margin:0 auto; padding:0; position:relative;}

#footer #innerfooter #flickr {position:absolute; top:140px; right:5px; font-family: Georgia, serif; font-size:0.7em; width:315px; height:auto; padding:0 5px; margin:0;}
#footer #innerfooter #flickr a img {float:left; margin:5px 5px 0 0; padding:5px; background:#c8ae88; width:90px; height:90px;}
#footer #innerfooter #flickr a:hover img{background:#947e55;}

#footer #innerfooter h2{width:800px; height:100px; display:block; overflow:hidden; font-size:1.2em; color:#1d1a16; text-indent:-1000em; position:absolute; top:0; left:0; background: url(../images/footer_logo_h2.png) no-repeat;}
#footer #innerfooter h3{font-size:1.1em; font-weight:bold; color:#1d1a16; padding:0; margin:0;}

#footer #innerfooter .top{width:200px; height:100px; background:url(../images/top_button.png) 0 0 no-repeat; text-indent:-1000px; display:block; overflow:hidden; padding:0; margin:0; position:absolute; top:0; right:0; color:#bda782;}
#footer #innerfooter .top:hover{background: url(../images/top_button.png) 0 -100px no-repeat;}

#footer #innerfooter #submenu{position:absolute; bottom:0; margin:0 295px;}
#footer #innerfooter #submenu ul{width:410px; height:auto; padding:0; display:block; border-left: 1px solid #2d1600; float:left;}
#footer #innerfooter #submenu li{display: inline; float:left; width:101px; margin:0; padding:0; list-style:none; border-right: 1px solid #2d1600;}
#footer #innerfooter #submenu li a{display: block; padding:0; text-decoration:none; font-size:1em; font-weight:bold; width:101px; height:auto; text-transform:uppercase; text-align:center; vertical-align:middle; color:#2d1600; outline:none;}
#footer #innerfooter #submenu ul li a:hover{text-transform:uppercase; text-decoration:none; height:auto; color:#245253; font-weight:bold; outline:none;}


/******************************* COMMON SETTINGS ************************************/


.left{text-align:left;} 
.center{text-align:center;} 
.right{text-align:right;}

.floatleft{float:left;} 
.floatright{float:right;} 
.clear{clear:both;}

.bold{font-weight:bold;}
.uppercase{text-transform:uppercase;}
.largefont{font-size:1.4em; font-weight:bold; line-height:1.4em;}
.alert{font-weight:bold; text-transform:uppercase; color:#740000;}


.frame{float:left; width:auto; height:auto; margin:0 30px 30px 0; text-align:center; color:#1d1a16;}
.frame img{display:block; padding:0;}

.frameleft{float:left; width:auto; height:auto; margin:60px 30px 0 0; text-align:left; color:#1d1a16;}
.frameright{float:left; width:auto; height:auto; margin:60px 0 0 30px ; text-align:left; color:#1d1a16;}
.frameleft img, .frameright img{display:block; padding:0 0 15px 0;}

.framelarge{float:left; width:auto; height:auto; margin:60px 0 0 0; text-align:left; color:#1d1a16;}
.framelarge img{display:block; padding:0 0 15px 0;}

a, a:link, a:visited{color:#2d1600; text-decoration:none; font-weight:bold; outline:none;}
a:hover, a:active {color:#245253; font-weight:bold; outline:none;}

img{border:0;}

p{padding:0; margin:0;}

ul{display:block; margin:0; padding:0;}
li{list-style:none; padding:2px 0; font-size:1.2em; display:block;}

ul.dot{display:block; margin:0; padding:0; border:0px solid #947e55;}
li.dot{list-style:none; padding:2px 0 2px 30px; margin:2px 0; font-size:1.2em; display:block; background:url(../images/dot.png) left center no-repeat;}

ul.img{display:block; margin:0; padding:0 15px;}
li.img{list-style:none; padding:5px 0; margin:0; font-size:0.9em; line-height:1.1em; border-bottom:1px dashed #1d1a16;}