/*****Basic Elements
Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc.
*****/
body {
font-family: Arial, Helvetica, sans-serif;  
background: #010500 url(../img/top_back.jpg) no-repeat 50% 0;
}

em.underline { color: #fff; font-weight: 700;}

/*****Generic Classes
Define styles for simple things like floating to the sides, removing a bottom margin on elements, etc
Yes, these may not be as semantic as we would all like, but they are necessary for coding efficiently 
*****/

html {overflow:-moz-scrollbars-vertical;}

a:active, a:focus {outline:none;}

/* shims */
.floatleft { float: left; }
.floatright { float: right; }
.clear { clear: both; }
.hidden { visibility: none; }
.bye { display: none; }
.textleft { text-align: left; }
.textright { text-align: right; }
.textcenter { text-align: center; }


.replace,
.logo a,
.rss,
.mesaj,
.cross-link,
.linkedin a,
.stripNav a
	{ display: block; float: left; font-size: 1px; text-indent: -9000px;}

/*sprite*/

#footer { background: url(../img/header_footer.jpg) no-repeat;}

.logo a,
.rss,
.cross-link,
.linkedin a,
.stripNav li a.current,
.stripNav li a,
.stripNav li a:hover
 { background: url(../img/sprite01.gif) no-repeat;}

.mesaj {background: url(../img/mesaj.gif) no-repeat;}

#slider1 .wrapper h2,
#slider,
.navigation,
.post h2 { background: url(../img/bottom_line.jpg) no-repeat;}

.linkedin,
.twitter { background:  url(../img/sprite02.jpg) no-repeat;}

/* typo */

h1 {}

h2 {}

h3 { font-size: 25px; font-weight: 400; color: #f38c11; line-height: 35px;}

h4 {}

h5 {}

h6 {}

p {}

em {}





/*****Basic Layout
Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site
*****/
#wrap { width: 960px; margin: 0 auto;}

.navigation {background-position: 0 0; overflow: hidden; clear: both; padding: 20px 0 0px 0 ;}

.navigation #prev { padding: 0 0 0 15px; background-position: -278px 4px;}

.navigation #next { padding: 0 15px 0 0; background-position: -385px 4px;}
 
/*****Header*****/

#header  { overflow: hidden; }

.logo a {width: 41px; height: 55px; margin: 40px 0 0 0;}

.logo a:hover { background-position: 0 -70px;}

.nav { margin-top: 70px; font-size: 20px;}

.nav li { display: inline; padding: 0 10px;}

.nav li a { color: #000;}

.nav li a:hover { text-decoration: underline; }

.rss { width: 38px; height: 39px; background-position: -230px 0; margin: 55px 0 0 25px; display: inline-block;}

.rss:hover { background-position: -230px -70px;}

#homepage .mesaj { background-position: 0 0; width: 860px; height: 70px; margin: 45px 0 35px 0; }

#project .mesaj,
#web .mesaj,
#identity .mesaj { background-position: 0 -90px; width: 860px; height: 70px; margin: 45px 0 35px 0; }

#contact .mesaj { background-position: 0 -180px; width: 860px; height: 70px; margin: 45px 0 35px 0; }


/*slider*/

/** slider **/

#slider { background-position: 80px 100%;}

#slider1 .wrapper img { float: left; margin-right: 10px;}

#slider1 .wrapper .info { float:left; width: 390px;}

#slider1 .wrapper .info ul,
.post .info ul { padding: 10px 0;}

#slider1 .wrapper .info ul li,
.post .info ul li { padding: 0 0 8px 0;}

#slider1 .wrapper .info ul li span,
.post .info ul li span { color: #d4d4d4; font-weight: 700;}

#slider1 .wrapper h2, 
.post h2 
{ font-size: 30px; font-weight: 400; background-position: 100% 100%; line-height: 30px; color: #74ca33; padding: 0 0 15px 0;}

#stripNav0 { overflow: hidden; background-position: 0 100%; height: 40px;}

/*****Content*****/


/* #home */

.content { margin-top: 5px;}

.services h3 { line-height: 70px; margin-left: 10px;}

.services ul { width: 480px; overflow: hidden;}

.services ul li { float: left; display: inline; width: 220px; margin: 0 10px; padding: 5px 0 0 0;} 

.linkedin { background-position: 218px 0; height: 75px; }

.linkedin span,
.linkedin a { margin-top: 20px;}

.linkedin span { float: left; line-height: 38px; font-size: 20px; margin-left: 75px;}

.linkedin a { background-position: -80px 0; width: 138px; height: 38px;}

.linkedin a:hover { background-position: -80px -70px;}

.twitter { background-position: -162px 0; padding: 25px 0 0px 0; color: #00CCFF; margin-top: -20px;  font-family: Georgia, "Times New Roman", Times, serif;}

.twitter a.follow { margin: 0 0 0 70px; font-size: 11px; color: #FFF;}

.twitter #twitter_div { padding: 10px 20px; font-size: 14px; line-height: 1.2em; font-style: italic; font-weight: 400;}

.twitter #twitter_div a { display: block; clear: both; color: #CCC; font-family: Arial, Helvetica, sans-serif; line-height: 40px; font-size: 11px; font-style: normal;}

/* category page */

ul.post-meta { height: ; }

.category { width: 800px; margin: 10px 80px; overflow: hidden;}

.category li { float: left; margin: 10px 10px;}

.category li a img { float: left;}

.category .navigation {  margin-top: 25px; }


/* post */

.post .navigation { margin-top: 0;}

/* contact */

#info_contact { line-height: 2em;}

#info_contact h2 { font-weight: 400;  color: #74ca33; font-size: 30px;}

.phone { font-size: 18px;color: #f38c11; font-style: italic;}

.phone span { font-size: 12px; color: #FFFFFF;}

#contact .linkedin { margin-top: 150px;}

#info_contact ul span { font-weight: 700; color: #CCC; font-style:normal;}

/*****sidebar*****/


/*****Footer*****/


#footer { background: url(../img/footer_wrapp.gif) repeat-x; overflow: hidden; margin-top: 25px;}

#footer .container_12 { background: url(../img/footer.jpg) 50% 42px no-repeat; overflow: hidden; height: 250px;}

#footer .link { margin-top: 15px; float: left;}

#footer .link ul { margin-top: 20px;}

#footer .link a { font-size: 12px;}

.copyright p { text-align: right; line-height: 42px;}