/*

Fighting Styles

by: Eric Biboso

b1interactive.com

*/

@font-face { font-family:"Segoe UI"; font-weight:bold; src: url('fonts/seguibd.ttf');}

@font-face { font-family:"Segoe UI"; src: url('fonts/seguibk.ttf');}

body { color:#000000; background:url(../_images/headBg.jpg) repeat-x #2b2b2b; font-family: Arial,'Trebuchet MS',Trebuchet,sans-serif; font-size:12px; margin:auto 0px; padding:0px;}

#sub { color:#000000; background:#FFF url(../_images/headBg_port.jpg) repeat-x; font-family: Arial,'Trebuchet MS',Trebuchet,sans-serif; font-size:12px; margin:auto 0px; padding:0px; min-height:900px;}

div,h1,h2,h3,h4,p { margin:0; padding:0;}

ul, li { margin:0; padding:0; }

#sub h2 { font-family:'Segoe UI', Arial,'Trebuchet MS',sans-serif; font-size:20px; font-weight:bold; line-height:22px;}

#sub ul li { list-style-type: none}

#page li { float:left; padding:5px; width:215px; height:120px;}

#video li { float:left; padding:5px; width:680px; height:295px;}

h3 { color:#666666; font-family:'Segoe UI', Arial,'Trebuchet MS',sans-serif; font-size:16px; font-weight:normal; line-height:normal;}

h4 { color:#1b1b1b; font-family:'Segoe UI', Arial,'Trebuchet MS',sans-serif; font-size:16px; line-height:normal;}

#logo { float:left; width:219px; z-index:1000; padding-left:5px;}

#logo a { height:50px; z-index:999;}

#header { background:url(../_images/headRule.jpg) no-repeat bottom; display:block; height:60px; margin:auto; padding-top:40px; width:950px;}

#subheader { display:block; height:60px; margin:auto; padding-top:40px; width:950px;}

#holder { background:url(../_images/headRule.jpg) no-repeat bottom; width:950px; height:55px;}

.blueTxt {color:#0CF}

/***********LINK HANDLING***********/
a:link, a:visited {color:#000;text-decoration:none;}

a:active, a:hover {color:#666; text-decoration:none;}

/*.topnav .active {color:#666;}*/

a img {border:none;}
a { outline: none; }

.see {clear:both; float:left; margin:0 0 0 56px;}


/***********CONTENT***********/
#preamble { margin:auto; width:930px; position:relative; top:40px;}

#preamble h3 { padding:0 0 10px;}

#preamble ul { background:url(../_images/webcaseThumb_bg.jpg) repeat-x; height:400px; padding:10px;}

#portThumbs { background:#FFF; border:1px solid #CCC; padding:1px;}

#slideBox { background:#F1F1F1; border:1px solid #999999; padding:1px; width:860px; margin:auto;}

#index_services { background:url(../_images/bg_footer.gif) repeat-x; margin:32px auto auto; padding-top:50px; height:200px;}

#index_services p { font-family: "Segoe UI", Arial,'Trebuchet MS',Trebuchet,sans-serif; margin:0; padding:0px; color:#FFF; font-weight:normal;}

#index_services h4 { font-family: "Segoe UI", Arial,'Trebuchet MS',Trebuchet,sans-serif; color:#FFF;}

.wIcon {width:50px; padding:0 10px 0 10px; float:left;}
.wTxt {border-right:1px solid #444; width:200px; height:150px; display:inline; float:left; padding-right:15px;}

#netIcons {margin-top:10px;}

#container {width:860px; margin:auto;}

#container h2 { font-family: "Segoe UI", Arial,'Trebuchet MS',Trebuchet,sans-serif; color:#1b1b1b; font-size:20px; font-weight:bold; line-height:1; padding:20px 0 0;}

#container h3 { padding:0 0 10px;}

#container_services { width:860px; height:100%; margin:auto; padding-left:20px;}

#preamble p { line-height:1.5; padding:0 0 0 30px; width:540px;}

#brass { height:auto; margin-bottom:100px;}

#brass1 { background: #FFF;  background:#FFF; border:1px solid #CCC; padding:1px;}

#brass1 ul { background:url(../_images/webcaseThumb_bg.jpg) repeat-x; height:260px; padding:10px;}

.brass2 { background: #FFF;  background:#FFF; border:1px solid #CCC; padding:1px;}

.brass2 ul { background:url(../_images/webcaseThumb_bg.jpg) repeat-x; height:130px; padding:10px;}

#brass p { clear:both; width:540px; padding:20px 0 0;}

#brass li { display:block;}

#page { padding:0px; margin:0px;}

#page ul li a img { border:1px solid #CCC; display:inline; /*position:absolute;*/ text-decoration:none; width:215px; height:120px;}

#page ul.clients li a img { border: 6px solid #ffffff; width:140px; height:110px;}

#page ul.clients li a.down { text-align:center; padding:4px 4px 8px 4px; background:#ffffff; color:#2c1204;}

#panel { background-color:#2B2B2B; clear:left; position:relative; top:200px; }

#ScrollBox { background:url(../_images/bg_footer.jpg) repeat-x; display:block; clear:left; position:relative; margin-left:0px; margin-right:0px; height:480px; overflow: hidden;}

.sbHead {color:#FFF; clear:both; margin:25px 0 25px 55px;}

#BigBox { position:absolute; width:20000px; height:480px; margin:60px 0 0 35px;} 

.nextprev { display:block; height:20px; margin:0 0 5px 10px;}

.webcase { background:url(../_images/webcase_bg.jpg) repeat-x; float:left; margin:0 45px 0 20px; padding:10px; width:840px;}

.webcase img { background-color:#FFF; border:1px solid #999999; height:280px; width:480px; padding:1px;}

.des { float:right; margin:25px 0 0 10px; width:340px;}

.des p { line-height:18px; width:340px; padding:5px 0;}

.des .tech { background: none repeat scroll 0 0; border:medium none; width:35px; height:35px; padding:5px 5px 0 0;}

.des .paypal { background:none; border:medium none; width:100px; height:28px; padding:5px 5px 0 0;}

.des h2 { font-family: 'Segoe UI', Arial,'Trebuchet MS',Helvetica,sans-serif; font-size:22px; font-weight:bold; color:#1b1b1b; line-height:1.2; padding:0;}

.des h3 { color:#666666; font-family: 'Segoe UI', Arial,'Trebuchet MS',Helvetica,sans-serif; font-size:16px; font-weight:normal; padding:0 0 10px;}

.vec { background: #FFF;  background:#FFF; border:1px solid #CCC; padding:1px; width:880px; height:240px; margin:0 auto 20px;}

.vecContainer { background: url(../_images/webcaseThumb_bg.jpg) repeat-x; width:860px; height:220px; padding:10px;}

.vecContainer ul li a img { border:1px solid #FFF; text-decoration:none; width:680px; height:295px;}

.vecDes { float:right; width:360px;}

.vecDes h2 {color:#000; padding:10px 0 5px;}

.vecDes p {color:#000; padding:5px 0;}

.vecDes .tech { border:medium none; width:35px; height:35px; padding:5px 5px 0 0;}

#video { width:880px; margin:40px auto; position:relative; top:20px;}

#video h3 { padding:0 0 10px;}

#video a img { background:#FFF; border:1px solid #CCC; padding:1px; float:left;}

.pTitle {color:#666; font-size:14px;}

/***********END CONTENT***********/

/***********CONTACT/ABOUT PAGE***********/
#leftBar { float:left; padding:20px 0; width:255px;}

#cwrapper {float:left; width:400px;}

#cwrapper h2 {padding:20px 0 0 15px;}

#cwrapper h3 {padding:0 0 5px 15px;}

#cwrapper p {padding-left:15px; width:440px;}

#cwrapper_about {float:left; width:925px; padding-top:20px;}

#cwrapper_about h3 {padding-left:30px;}

#cwrapper_about p {padding:0 0 15px 0; width:450px;}

#about_copy { float:left; width:500px;}

#about_copy h2 { font-weight:bold; padding:0 0 5px 0;}

#about_copy img { padding-right:5px;}

#form {float:left; width:350px; padding:5px 0 0 15px;}

#form  h2 { padding:10px 0;}

#form p {margin:0px; padding:0px; font-weight:bold;}

#form .fBlock {margin:10px 0;}

form fieldset { border:none; padding:0;}

input.text-input { width:150px;}

input.mesg-input { width:230px; height:100px;}

.button { margin:5px 0;}

#sidebar {float:right; padding:15px 10px; width:180px;}

#sidebar p {margin:0; padding:0;}

#sidebar h2 {font-size:14px; line-height:0.5; margin:5px 0;}

#sidebar #delicious ul li {border-bottom:1px solid #E0E0E0; float:left; padding:5px 3px 5px 0; display:block;}

#delicious ul { background:none; padding:10px 0; display:inline;}

#twitter ul { background:none; width:170px; margin:0; padding:0; height:auto;}

#twitter li span { width:170px; display:block; max-width:170px;}

#sidebar li a:hover {color:#999;}

#sidebar li a {color:#0093D3; text-decoration:none;}

#about_services { background:url(../_images/bg_services.jpg) no-repeat; border:1px solid #CCC; float:right; width:420px; height:300px; padding-top:20px;}

#about_services h4 { color:#FFF; padding-bottom:10px;}

#about_services ul { background:none;}

#services { float:left; width:185px; padding-left:50px;}

#services .serve {margin:0; float:left; padding:0;}

#services .serve li {background:url(../_images/plus.png) no-repeat left top; font-style:italic; color:#EEE; height:25px; padding:0 0 0 20px;}

#services2 { float:left; width:185px;}

#services2 .serve {margin:0; padding:0;}

#services2 .serve li {background:url(../_images/plus.png) no-repeat left top; font-style:italic; color:#EEE; height:25px; padding:0 0 0 20px;}

/***********ABOUT GALLERY***********/
#panel_about { background:url(../_images/bg_footer.gif) repeat-x #2B2B2B; clear:left; position:relative; top:100px; }

#galleryBtn { clear:both; position:relative; top:50px; left:50px;}

#galleryBtn  p { color:#999;}

#galleryBtn a { color:#333;}

#galleryBtn a:hover { color:#CCC;}

#ScrollBox_ab { display:block; clear:both; position:relative; margin:auto; width:800px; height:480px; overflow: hidden; z-index:10;}

#BigBox_ab { position:absolute; width:20000px; height:480px; margin:25px 0 0 50px;} 

#prev { display:block; float:left; position:relative; top:200px; z-index:11;}

#next { display:block; float:right; position:relative; top:200px; z-index:11;}

.imgcase { float:left; margin:0 50px; padding:10px; width:600px;}

.imgcase img { height:400px; width:600px;}

.imgcasev { float:left; margin:0 100px; padding:10px; width:600px;}

.imgcasev img { height:400px; width:266px;}

#error { width:400px; margin:auto; text-align:center; position:relative; top:50px;}

#submitted { position:relative; top:50px;}

/***********END CONTACT/ABOUT PAGE***********/

/***********FOOTER***********/
#footer { clear:both; background:#2B2B2B; width:100%; padding-top:70px; position:absolute; bottom:0;}

#footer p { color:#999; font-family: Arial, Helvetica, sans-serif; font-size:10px; text-align:center; padding:3px;}

#sub #footer { clear:both; background:#2B2B2B; width:100%; padding:0; position:relative; bottom:0;}

#sub #footer2 { clear:both; background:#2B2B2B; width:100%; padding:0; position:fixed; bottom:0;}

#sub #footer2 p { color:#999; font-family: Arial, Helvetica, sans-serif; font-size:10px; text-align:center; padding:3px;}

#footer a {color:#F60;}

#footer a:hover {color:#FFF;}

#footer2 a {color:#F60;}

#footer2 a:hover {color:#FFF;}

.clearing { clear:both; height:0;}