/*

	Battery Fighter
	
*/

*{ border: 0; }
body { font: 500 15px "Open Sans", Sans-Serif; background: #FFF; background-size: 100%; color: #242121; }
td{ padding:10px 30px;}
th{background-color:#242121 ; color:#fff; padding:10px 10px;}

.x:before, .x:after { content: " "; display: table; }  
.x:after { clear: both; }  
.x { *zoom: 1; } 

/* general styling */
h1 { font-weight: 900; font-size: 23px; margin: 0 0 30px; color: #242121 ; }
h2 { font-weight: 100; font-size: 23px; margin: 0 0 30px; color: #242121 ; }
h4 { font-weight: 400; font-size: 13px; }
p { margin: 0 0 12px; }
a { color: #31b9cf; text-decoration: none; transition: all 0.3s ease-in-out; }
input { border: 1px solid #ccc; padding:15px;}
strong { color: #000; }

/* define border radius */
#pitch, .col, #main { border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
#menu li a, .button a { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }
#menu li ul { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

/* content holder */
.c { margin: 0 auto; width: 1050px; }

/* logotype */
#logo { float: left; margin: 10px 0 20px ; }

/* phone */
#phone { float: right; margin: 70px 15px 16px; font-size: 20px; color: #0b6195; }

/* main menu */
#menu { float: right; clear: right; height: 60px; margin-top:30px;  background: #242121; border-radius:3px; }
#menu li { float: left; text-transform: uppercase; font-size: 14px; font-weight: bold; margin-right:0px; margin-left: 0px; margin-top:10px; }
#menu li a { display: block; color: #fff; padding: 10px 15px; margin: 0 0 0 2px; line-height: 20px; border: 2px solid transparent;   }
#menu li a:hover { color: #31b9cf; }

#menu li ul { display: none; position: absolute; background: rgba(0,0,0, .7); height: auto; padding: 10px 7px 8px; z-index: 100; }
#menu li:hover ul { display: block; }
#menu li li { display: block; float: none; font-size: 12px; margin-top:5px; }
#menu li ul a { padding: 12px 50px 10px 14px; border: 0; }
#menu li ul a:hover { background: #31b9cf; color:#fff; }

/* pitch */
#pitch { clear: both;  width: 1050px; position: relative; height: 300px; overflow: hidden; margin: 0 auto 30px;   }

/* pitch */
#general-top { clear: both; width: 1000px; position: relative;    margin: 0 auto 0px;   }
#general { clear: both; background: rgba(0,0,0, .4); width: 1000px; position: relative;    margin: 0 auto 30px; border-bottom: 2px solid #000; }

/* main column */
#main { float: left; width: 660px; margin: 0 0 30px 0; padding: 20px; background: rgba(0,0,0, .4); border-bottom: 2px solid #000; }
#main p { margin: 0 0 17px; text-align: justify; }

/* content columns (boxes) */
.col { float: left; width: 210px; margin: 0 8px 30px; padding: 10px; background: #242121 ; border: 5px solid #242121; }
.col h2{ font-size: 13px; font-weight:bold; color: #31b9cf; margin-bottom:0px; text-transform:uppercase;}
.col img {  margin: 10px; width:130px; padding:30px; background-color:#fff;   }
.col-hold { height: 150px; }
.col:hover {border:5px solid #ccc;}

/* button */
.button a { float: left; padding: 7px 10px; font-size: 11px; text-transform: uppercase; color: #fff; border: 2px solid #0b6195; }
.button a:hover { background: #0b6195; }

/* side column */
#side { float: right; width: 300px; }

/* side items */
.item { position: relative; margin: 0 -20px 0; padding: 8px 20px; }
.item p { font-size: 13px; color: #888; margin: 0 0 2px; }
.item:hover { background: #222; }
  
/* footer */
#footer { clear: both; padding: 50px 0 10px; background: #242121; border-radius:5px; }
#footer .c { width: 1020px; }
#footer .fcol { float: left; margin: 0 60px 20px 0; }
#footer .fcol p { margin: 0 0 5px; }
#footer p.fttl { color: #0b6195; margin: 0 0 10px; }
#footer .fcol p span { float: left; color: #fff; width: 114px; }
#info { float: right; text-align: right; }
#copy { clear: both; font-size: 12px; color: #bbb; padding: 30px 0; margin: 0; border-top: 2px solid #333; }