/*
---------------------------------------------------------------
Titolo:      Javacenter -  Foglio di stile  (screen media)
Autore:      Sonia Anepeta - www.webfruits.it
Copyright:   Javacenter - www.javacenter.net
Versione:    1.0
Data:        12/2008
Ultimo agg.: 08/12/2008
 
All rights reserved
---------------------------------------------------------------
*/


/* _________________ Global Setting
                            ________________________ */
							
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, cite, code,
font, img, dd, dl, dt, li, ol, ul,
fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td  { 
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
line-height: 1;
margin: 0; 
outline: none; 
padding: 0;  
vertical-align: baseline;
}  

body { 
background: url(../images/bg_body.jpg) repeat-x;
font: 76%/140% Verdana, Arial, Helvetica, sans-serif;
}

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

ul, ol { list-style-type: none; }

a,
a:link,
a:visited,
a:hover {
outline: none;
text-decoration: none;
}

:focus { outline: 0; }

.floatLeft {  
float: left;  
padding: .5em .5em .5em 0;  
}  
  
.floatRight {  
float: right;  
padding: .5em 0 .5em .5em;  
}  

.centered, p.centered{ text-align: center; }
.right { text-align: right; }	
.left { text-align: left; }

.clear { 
clear: both; 
display: block; 
}

a img, :link img, :visited img { border: 0; }

acronym, abbr {
border-bottom: 1px dotted;
cursor: help;
}

/* _________________ Layout
                            ________________________ */

#main_block { 
margin: auto; 
width: 980px;
}

#inner_block {
float: left;
width: 980px; 
}

/* -------->> Header <<<-----------*/
#header { 
background:url(../images/bg_header.jpg) repeat-x;
float: left; 
height: 222px;
width: 980px;
}

#logo { 
float: left;
height: 105px;
padding: 40px 0 0 38px;
width: 330px;  
}

/* -------->> Container <<<-----------*/
#container { 
float: left; 
display: inline; 
margin-top: 3px;
padding: 55px 0 25px 0;
width: 1000px; 
}

/* -------->> Footer <<<-----------*/
#footer {
background: url(../images/bg_footer.jpg) repeat-x;
float: left; 
height: 222px;
width: 100%
}

#innerFoot {
background: url(../images/bg_innerFoot.jpg) repeat-x;
height: 200px;
margin: auto; 
width: 1000px; 
}

/* -------->> Columns <<<-----------*/
#leftCol { 
float: left; 
padding-left: 10px;
width: 590px; 
}

#rightCol { 
float: left; 
padding-left: 70px;
width: 280px;
}


/* _________________ Content Header
                            ________________________ */

/* -------->> Main Navigation <<<-----------*/
#nav {
float: right;
margin-top: 60px;
width: 350px
}

#nav ul {
margin: 0;
overflow: hidden;
}

.menu {
background: url(../images/topnav.gif) repeat-x;
display: block;
height: 29px;
margin: 0 auto; 
padding :0;  
width: 100%; 
}

.menu li {
display: inline;
font-size: .94em;
margin:0;
padding:0; 
}

.menu li a {
background: url(../images/topnav.gif) 0px -30px no-repeat;
cursor: pointer;
display: block;
float: left;
padding-left: 15px;  
color: #333; 
text-decoration: none;
}

.menu li a:visited { color: #333; }

.menu li a span {
background: url(../images/topnav.gif) 100% -30px no-repeat;
display: block; 
float: left; 
line-height: 30px;
padding-right: 15px; 
}

.menu li a:hover {
background-position: 0px -60px; 
color: #FFF;
}

.menu li a:hover span { background-position: 100% -60px; }

.menu li a.active, .menu li a.active:hover {
background: url(../images/topnav.gif) 0px -90px no-repeat;
color: #FFF;
line-height:30px;   
}

.menu li a.active span, .menu li a.active:hover span { background:url(../images/topnav.gif) 100% -90px no-repeat; }

/* -------->> Search Bar <<<-----------*/
#search_box {
background: url(../images/bg_searchbox.png);
float: right;
height: 31px;
margin: 10px 20px 0 0;
width: 201px;
}

#search_box #s {
background: none;
border: 0;
color: #fff;
float: left;
margin: 6px 0 0 6px;
padding: 0;
width: 159px;
}

#search_box #go {
float: right;
padding: 3px 4px 0 0;
}

/* -------->> News <<<-----------*/
#newsBox {
float: right;
margin-top: 20px;
width: 590px
}

#rightCol_newsBox { 
background: url(../images/newsBox.png) no-repeat 0 59px; 
clear: left; 
float: left;
height: 302px;
margin: 20px 0 0 0;
padding-bottom: 20px;
width: 296px; 
}

#rightCol_newsBox h4 { 
background: url(../images/title_newsBox.png) no-repeat; 
height: 60px;
text-indent: -9000px;
}

.titlefield { }
.labelfield { }

.datefield { /*CSS for date field in general*/
color: #BAB88F;
font-size: 0.94em;
width: 100%
}

#example3 { /*Demo 3 main container*/
background: transparent;
font-size: .94em;
height: 80px;
padding: 10px;
text-align: justify;
}

#example3 div p { 
color: #333;
line-height: 20px;
margin-bottom: 8px; }

#example3 a { 
color: #BAB88F;
font-weight: bold; }


/* _________________ Content Columns
                            ________________________ */

/* -------->> Left Column <<<-----------*/
#leftCol_infoBox { background:url(../images/boxInfo.gif) no-repeat; }
#leftCol_servicesBox { background:url(../images/boxServices.gif) no-repeat; }

#leftCol_infoBox, #leftCol_servicesBox { 
clear: left; 
display: inline;
float: left; 
height: 200px;
padding: 0 30px 10px 20px;
text-align: justify;
width: 540px;
}

#leftCol_infoBox p a { 
border-bottom: 1px dashed #FA942C;
color: #FA942C;
font-weight: bold;
}

#leftCol_servicesBox p a { 
border-bottom: 1px dashed #43B4FD;
color: #43B4FD;
font-weight: bold; 
}

#leftCol_infoBox p a:hover, #leftCol_servicesBox p a:hover { 
border-bottom: 1px dashed #333;
color: #333;
font-weight: bold;
}

#leftCol_infoBox p, #leftCol_servicesBox p { 
color: #333;
line-height: 20px;
margin-top: 8px;
}

#leftCol_infoBox span { 
color: #E87603; 
font-size: 1.6em 
}

#leftCol_servicesBox span { 
color: #1F5A74; 
font-size: 1.6em 
}

h1.info, h1.services {
height: 68px;
text-indent: -9000px;
}

h1.info { background: url(../images/title-boxInfo.gif) no-repeat; }
h1.services { background: url(../images/title-boxServices.gif) no-repeat; }

.moreIB, .moreSB { 
clear: left; 
float: right; 
}

.moreIB { margin: 0 0 0 15px; }
.moreSB { margin: 0 0 0 15px; }

#leftCol_worksBox { 
float: left; 
width: 590px;
}

#leftCol_worksBox h2 { 
background: url(../images/title-boxWorks.gif) no-repeat; 
height: 38px;
text-indent: -9000px;
}

.worksBox {
background: url(../images/boxWorks.gif) no-repeat; 
height: 182px;
float: left; 
padding: 10px;
width: 176px; 
}

.worksBox h3 { 
color: #333;
font-size: 1.6em;  
margin: 0
}

.worksBox img {
float: right; 
padding: 20px 5px 0 0;
}

.launch {
background: url(../images/i-launch.gif) no-repeat 90% 90%; 
float: right;
font-size: .94em;
margin-top: 10px;
padding: 0px 25px 0 15px!important; 
}

a.launch { color: #44B5FD; }
a:hover.launch { color: #333; }

.worksBoxBott { 
float: left; 
margin: 0;
}

/* -------->> Right Column <<<-----------*/

/* Accordion Menu */
#content {
border: 0px solid #EDE9BA;
background: #fff;
float: left;
margin: 50px 0 0 0;
width: 296px; 
}

#contentTop {
background: url(../images/bg_menuTop.gif) no-repeat;
height: 56px; 
}
#contentBott {
background: url(../images/bg_menuBott.gif) no-repeat;
height: 56px; 
}

.tab {
margin: 0;
padding: 0;
text-align: left;
}

#content .tab h4 {
font-size: 1.5em;
margin: 0;
}

#content .tab h4.bl-tec a, #content .tab h4.bl-ser a {
display: block;
height: 1%;
margin: 0;
padding: 8px 0 8px 45px;
}

#content .tab h4.bl-tec a {
background: url(../images/m_blTec-off.gif) no-repeat;
color: #E87603;
}

#content .tab h4.bl-tec.last a {
background: url(../images/m_blTec-last-off.gif) no-repeat;
color: #E87603;
}

#content .tab h4.bl-ser a {
background: url(../images/m_blSer-off.gif) no-repeat;
color: #43B4FD;
}

#content .tab h4.bl-tec a span, #content .tab h4.bl-ser a span { color: #333; }

#content .tab h4.bl-tec a:hover, #content .tab h4.bl-ser a:hover  {
color: #333;
display: block;
margin: 0;
padding: 8px 0 8px 45px;
}

#content .tab h4.bl-tec a:hover { background: url(../images/m_blTec-on.gif) no-repeat; }
#content .tab h4.bl-tec.last a:hover { background: url(../images/m_blTec-last-on.gif) no-repeat; }
#content .tab h4.bl-ser a:hover { background: url(../images/m_blSer-on.gif) no-repeat; }

.stretcher { 
background: url(../images/bg_stretcher.gif) repeat-y;
padding: 0 0 0 0; }

.stretcher ul {
border: none;
margin: 0;
padding: 5px 30px 10px 50px;
}	

.stretcher .acc li {
margin: 0;
padding: 0;
}

.stretcher .acc li.bl-tec a, 
.stretcher .acc li.bl-ser a  {
display: block;
height: 1%;
padding: 8px 0 8px 0;
}

.stretcher .acc li.bl-tec a {
border-bottom: 2px solid #FEE3C9;
color: #E87603;
}

.stretcher .acc li.bl-ser a {
border-bottom: 2px solid #D5E8F6;
color: #43B4FD;
}

.stretcher .acc li.bl-tec a:hover, .stretcher .acc li.bl-ser a:hover  {
color: #333;
display: block;
padding: 8px 0 8px 0;
}

.stretcher .acc li.bl-tec a:hover { border-bottom: 2px solid #fff; }	
.stretcher .acc li.bl-ser a:hover { border-bottom: 2px solid #fff; }	


/* _________________ Content Footer
                            ________________________ */

/* -------->> Footer Menu <<<-----------*/
#innerFoot ul.menuf { 
float: left;
padding: 100px 0 0 70px; 
width: 520px;
}

#innerFoot ul.menuf li { 
background: url(../images/pipe.png) no-repeat top right;
float: left;
font-size: 0.9em;
padding: 0 10px 0 10px!important; 
}

#innerFoot ul.menuf li.last { background: none }

#innerFoot ul.menuf li a { color: #333; }
#innerFoot ul.menuf li a:hover { color: #fff }


#innerFoot ul.banner  { 
float: left;
width: 520px;
padding: 30px 0 0 60px; 
}
#innerFoot ul.banner li { 
background: none;
float: left;
padding: 0;
}

/* -------->> Copyright <<<-----------*/
#copy {
float: right;
font-size: 0.9em;
color: #fff;
line-height: 20px;
padding: 0 70px 0 0; 
text-align: center;
width: 300px;
}

#copy a { color: #1F5A74}
#copy a:hover { color: #fff }

/* -------->> Social Bookmarks <<<-----------*/
ul.bookmarkIcons {
float: right;
padding: 0 0 0 40px;
margin-top: -50px;
width: 330px;
}

.bookmarkIcons li {
background: none!important;
float: left;
margin: 2px; 
padding: 0!important;
}

.bookmarkIcons a {
background-repeat: no-repeat;
background-position: 0 0;
border: none;
cursor: pointer;
display: block;
height: 84px;
padding-right: 8px;
text-indent: -9000px;
width: 61px;
}

.bookmarkIcons a:hover { background-position: 0 -84px; }

#delicious a { background-image: url(../images/is-delicious.gif); }
#digg a { background-image: url(../images/is-digg.gif); }
#stumbleupon a { background-image: url(../images/is-stumbleupon.gif); }


/* _________________ Contact
                            ________________________ */

form#contact {
background: #D7E9F6;
float: left;
padding: 0 0 10px 0;
width: 590px;
}

form#contact h1 {
background: url(../images/title-bl.gif) no-repeat 0 0; 
color: #333;
font-size: 2.2em;
padding: 50px 0 0 40px;
height: 40px;
text-align: justify;
}
	
form#contact fieldset {
border: 0 solid #fafafa;
display: block;
line-height: 1.5em;
margin: 2em auto 0 auto;
padding: 10px;
width: 354px;	
}

form#contact label, form#contact input {
display: block;	
float: left;
height: 22px;
margin-bottom: 10px;
}

form#contact input, 
form#contact input:hover, 
form#contact input:focus { border: 0 none; }

form#contact fieldset#personal input {
background: #dce8f6!important;
border: 1px solid #57BBFB;
} 

form#contact textarea:focus,
form#contact fieldset#personal input:focus {
background: #fff!important;
border: 1px solid #dce8f6;
}

form#contact fieldset#personal input {	
height: 1.2em;
width: 170px;
}

form#contact br { clear: left; }

form#contact fieldset#opt select { width: 170px; }

form#contact p { 
padding: 0 0 2em 0; 
text-align: justify
} 

form#contact label {
color: #43B4FD;	
font-weight: bold;	
padding-right: 5px;
text-align: right;
width: 7em;
}

form#contact textarea {
background: #dce8f6;
border: 1px solid #57BBFB;
height: 15em; 
overflow: auto;
width: 352px; 
}

form#contact #button1,
form#contact #button2  {
background: transparent url(../images/btn_contact.gif) 50% 100% no-repeat;
border: none;
color: #fff;
cursor: pointer; 
display: inline;
height: 27px;
margin: 0 35px 0 99px;
padding: 0;
text-align: center;
width: 130px;
}

form#contact #button1:hover,
form#contact #button2:hover { color: #333; }
form#contact fieldset#personal p { clear: left; }