body { font-family: 'Open Sans', Arial, Helvetica, sans-serif; margin:0px; padding:0px; font-size:13px; color:#333;}

h1,h2,h3,h4,h5,h6 { font-family: 'Open Sans', Arial, Helvetica, sans-serif; }

* { margin:0px; padding:0px;}
a, img{border:0; outline:0;}
a { text-decoration:none; }
.wrapper { width:980px; margin:auto;}
.header { background:url(../images/headerBG.gif) top left repeat-x;}
.innerHeader{width:980px; margin:0 auto; background:url(../images/headerGraphic2.png) 90px 2px no-repeat; height:108px; overflow:hidden;}
.logo{float:left; margin:5px 0px 0px 0px;}
.partSearch { float:right; width:365px; background:url(../images/searchbg.png) no-repeat left top; height:97px; margin:10px 0 0 0;}
.advac { float:right; width:140px; padding:16px 0 0 0;}
.advac a { font-size:12px; color:#828282; border-bottom:1px solid #949494;}
.textBoxCont { float:left; width:345px; padding:10px 0 0 20px;}
.inputCont { float:left; background:url(../images/textBox.gif) repeat-x left top; border:1px solid #d8d8d8; width:248px; margin:1px 0 0 0;}
.inputCont input {width:242px; border:0; background:none; font-size:13px; color:#666; padding:5px 4px 6px 4px; }
.searchBtn { float:left;}
/** menu CSS start here*/

/*UPdate CSS CSS on 31-10-2011*/
.menu { float:left; width:980px; height:35px; background:url(../images/rep.jpg) repeat-x top left;}
.menu ul { float:left; list-style:none;}
.menu ul li { float:left; padding:0 35px;  position:relative; display:block;}
.menu  ul li ul {display:none; width:654px; background:#000000;}
.menu  ul li ul li { display:block; width:286px; height:400px; padding:5px 0 0 15px; background:url(../images/arrow.png) left 6px no-repeat;}
.menu ul li:hover ul { position:absolute; display:block; background:#44474C; top:34px; left:14px; z-index:30000;  padding:0 0 10px 0;}
.menu  ul li ul li a {  font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; color:#c0c0c0; display:block; font-size:10px;  line-height:12px;}
.menu  ul li ul li a:hover  { color:#FFFFFF; text-decoration:underline; border-bottom:none; }
.menu  ul li:hover li  {color:#2877ae; display:block; height:24px; }
.menu ul li a { float:left;  font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; color:#aaabac; display:block; font-size:14px; font-weight:bold; line-height:32px;}
.menu ul li.active { float:left;  font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; color:#FFF; display:block; font-size:14px; font-weight:bold; line-height:32px; }
.menu ul li.active span { float:left;  font-family:Arial, Helvetica, sans-serif; text-transform:uppercase; color:#FFF; display:block; font-size:14px; font-weight:bold; line-height:32px; border-bottom:2px solid #e03c32;}
.menu ul li a:hover { color:#FFFFFF; border-bottom:2px solid #e03c32;}

/* END HERE UPDATED CSS*/
.boldtxt { float:left; background:url(../images/bold-arrow.jpg) left 4px no-repeat; font-size:20px; color:#000; text-transform:uppercase; padding:0 0 10px 30px; margin:10px 0 0 0; font-weight:bold;width:890px;}
.boldtxt1 { float:left; background:url(../images/bold-arrow.jpg) left 4px no-repeat; font-size:15px; color:#000; text-transform:uppercase; padding:0 0 10px 30px; margin:10px 0 0 0; font-weight:bold;width:890px;}
.bannerCont { float:left; width:980px;  height:243px; }
.redBg { float:left; width:327px; background:url(../images/redbg.jpg) 0px top no-repeat; height:246px;}
/*.redBg h1 { float:left; color:#FFFFFF; width:252px; font-size:22px; font-weight:bold; text-transform:uppercase; padding:22px 0 0 30px;}*/
.redrfqbox { float:left; color:#FFFFFF; width:252px; font-size:22px; font-weight:bold; text-transform:uppercase; padding:22px 0 0 30px;}
.banner { float:left; }
.midCont { float:left; width:980px;}
.leftCont { float:left; width:316px; padding:8px 0 0 10px;}
.outCont { float:left;  width:300px; border-bottom:1px solid #e2e2e2; padding:10px 0 22px 0;}
.outCont p { float:left; font-size:13px; color:#424242;  line-height:18px; width:305px;}
.outCont p a { color:#3d81b6; text-decoration:underline;}
.outCont p a:hover { text-decoration:none;}
.outCont ul { float:left;  width:300px; padding:6px 0 0 0;}
.outCont ul li { float:left; color:#424242; background:url(../images/squre.jpg) no-repeat left 5px; padding:0 0 0 15px; display:block; width:280px; font-size:13px;}
.readmore { float:left; padding:20px 0 0 0;}
.imgCont { float:left;}
.redtext { float:left; font-size:18px; color:#9f1515; font-weight:bold; padding:0 0 2px 0;}
.ptext p { float:left; font-size:13px; color:#424242; width:196px; }
.rightPanel { float:left; padding:10px 0 0 0; width:651px; border:0px solid #ff0000;}
.boldred {font-size:19px; color:#9f1515; background:url(../images/nsn.png) 18px  3px no-repeat; padding:8px 0 20px 70px; font-weight:bold;}
.innerCont {background: url(../images/shadow.jpg) repeat-y left top; padding:0 0 0 19px; border-right:1px solid #e1e1e1;  }
.innerCont p {font-size:11px; padding: 8px 8px 8px 19px; color:#424242; line-height:20px; font-family:Verdana, Geneva, sans-serif;}
.innerCont p a{color:#2f6fad;}
.innerCont p a:hover{text-decoration:underline;}
.text01 {font-size:15px; color:#000000; background:url(../images/categoryHdBg.gif) top left repeat-x; padding:4px 0 4px 19px; font-weight:bold; font-family:Verdana, Geneva, sans-serif;}
.text01  a{ color:#2f6fad;text-decoration:underline;}
.form { float:left; width:300px; padding:16px 0 0 0;}
.form fieldset { float:left; border:0px; padding:7px 0 7px 0;}
.form fieldset label { float:left; width:78px; color:#fff; font-size:12px; text-align:left; padding:7px 0 0 28px;}
.form fieldset input { float:left; width:180px; padding:0px 2px 0 2px; font-size:12px; color:#666; height:22px;}
.senrqBtn { float:left;  width:120px; padding:4px 0  0 106px;}
.seprator {border-top:1px solid #e1e1e1; display:block; height:12px; overflow:hidden; clear:both;}
.footer{min-width:980px; padding:13px 0 13px 0; background:url(../images/footer.jpg) repeat-x; overflow:hidden; text-align:center; color:#939395; line-height:20px;}
.footer a{ font-size:13px; color:#adaeaf; }
.footer a:hover{ text-decoration:underline;}
.footer ul li.bgNone {padding:0 5px; background:none;}
.footer p { color:#adaeaf; float:left; font-size:11px; padding:5px 0 0 5px;}
span.seperator{padding:0 5px;}

/* recently added */

/* category page css */

.clr{clear:both; line-height:0; height:0;}

.innerPageHd{padding:0px; margin:15px 0;}
.innerPageHd span{color:#9f1515; font-size:22px; font-weight:bold;}
.categoryBox{margin-bottom:30px;}
.categoryHd{background:url(../images/categoryHdBg.gif) top left repeat-x; padding:4px 0 4px 19px; font-weight:bold; margin-bottom:15px; font-size:16px;}
.pagination{background:url(../images/pagesimg.gif) left center no-repeat; padding-left:65px; display:block; font-size:11px; min-height:20px; line-height:20px; color:#909090;}
.pagination a{color:#2f6fad; text-decoration:none; padding:0 5px;}

/* sub category page css */

.categoryItemBox td{padding:3px 5px;}
.categoryItemBox th{padding:5px; text-align:left; background:#efefef; color:#333;}
.subCatPagination {color:#666; word-wrap: break-word; background:#fafafa;}
.subCatPagination a{color:#0099CC; text-decoration:none; word-wrap: break-word; padding:0 2px; line-height:20px;}
.martop{margin-top:20px;}

.partnbrs { float:left; left 4px no-repeat; font-size:20px; color:#000; text-transform:uppercase; padding:0 0 10px 2px; margin:10px 0 0 0; font-weight:bold;}

.textboxclass input{ float:left; border:1px solid #d8d8d8;  margin:1px 0 0 0; height:23px;}

/* css for pagination in category*/
.gridList{   font:normal 12px/12px Arial, Helvetica, sans-serif; width:980px; margin:10px auto;; }
.gridListHead{ background:#e9edec url(../images/gridBg.jpg) 0 0 repeat-x; padding:7px 19px; font:normal 16px/16px Arial, Helvetica, sans-serif; color:#323232; text-transform:uppercase; font-weight:bold; border:1p=x solid #c3c3c3;}
.gridList ul{/*border:1px solid #c2dff1;*/ margin:5px 0 0 0; padding:0 0 0 107px; position:relative;width:873px; float:left;}
.gridList ul li{ text-align:center; width:95px;margin:0px; padding:0 ;  height:26px; color:#656565; font-size:12px; list-style:none; float:left; border:1px solid #c2dff1; border-left:1px solid #c2dff1; }
.lGirB{border-right:1px solid #c2dff1; color:#C00; font-weight:bold;}

.gridList ul li a{margin:0px; padding:7px 0 ; color:#656565; text-decoration:none; display:block; background:#FFFFFF; }
.gridList ul li a:hover{ color:#000000; background:#ecf5fa;}
.pagesbg{ width:95px; height:22px; background:url(../images/pages.png) 0 0 no-repeat; position:absolute; top:0; left:0;} 

.btn_rfq{background:url(../images/btn_sendRfq.jpg) no-repeat 0 0; width:82px; height:28px; cursor:pointer; border:1px solid #990000;}
.btn_rfq:hover{background:url(../images/btn_sendRfq.jpg) no-repeat 0 -28px; width:82px; height:28px; cursor:pointer; border:1px solid #FFFF00;}

/* css for RFQ PAGE BUTTONS - 17-01-2012*/
.btn_rfq{
	background:url(../images/btn_sendRfq.jpg) no-repeat 0 0; width:82px; height:28px !important; cursor:pointer; border:1px solid #990000;
}
.btn_rfq:hover{
	background:url(../images/btn_sendRfq.jpg) no-repeat 0 -28px; width:82px; height:28px; cursor:pointer; border:1px solid #FFFF00;
}

.btn_addMorePart{
	background:url(../images/btn_addMorePart.jpg) no-repeat 0 0; width:112px; height:28px !important; cursor:pointer; border:1px solid #990000;
}
.btn_addMorePart:hover{
	background:url(../images/btn_addMorePart.jpg) no-repeat 0 -28px; width:112px; height:28px; cursor:pointer; border:1px solid #FFFF00;
}

.btn_backToCatlg{
	background:url(../images/btn_backToCatlg.jpg) no-repeat 0 0; width:149px; height:28px !important; cursor:pointer; border:1px solid #990000;
}
.btn_backToCatlg:hover{
	background:url(../images/btn_backToCatlg.jpg) no-repeat 0 -28px; width:149px; height:28px; cursor:pointer; border:1px solid #FFFF00;
}

.btn_clearAll{
	background:url(../images/btn_clearAll.jpg) no-repeat 0 0; width:82px; height:28px !important; cursor:pointer; border:1px solid #990000;
}
.btn_clearAll:hover{
	background:url(../images/btn_clearAll.jpg) no-repeat 0 -28px; width:82px; height:28px; cursor:pointer; border:1px solid #FFFF00;
}

/* Style you custom popupbox according to your requirement */
.popupbox {
 width:800px;
 height:600px;
 background-image:url(http://www.csgparts.com/images/TAC_big.jpg);
 background-repeat:no-repeat;
 display: none; /* Hidden as default */
 float: left;
 position: fixed;
 top: 40%; left: 50%;
 z-index: 99999;
 -webkit-box-shadow: 0px 0px 20px #000;
 -moz-box-shadow: 0px 0px 20px #000;
 box-shadow: 0px 0px 20px #000;
}
.popupbox2 {
 width:454px;
 height:307px;
 background-image:url(images/pu_03.png);
 background-repeat:no-repeat;
 display: none; 
 float: left;
 position: fixed;
 top: 50%; left: 50%;
 z-index: 99999;
 -webkit-box-shadow: 0px 0px 20px #000;
 -moz-box-shadow: 0px 0px 20px #000;
 box-shadow: 0px 0px 20px #000;
}
.popupbox3 {
 width:502px;
 height:302px;
 background-image:url(images/3_03.png);
 background-repeat:no-repeat;
 display: none;
 float: left;
 position: fixed;
 top: 50%; left: 50%;
 z-index: 99999;
 -webkit-box-shadow: 0px 0px 20px #000;
 -moz-box-shadow: 0px 0px 20px #000;
 box-shadow: 0px 0px 20px #000;
}
#fade { 
 display: none; /* Hidden as default */
 background: #000;
 position: fixed; left: 0; top: 0;
 width: 100%; height: 100%;
 opacity: .80;
 z-index: 9999;
}
/* for breadcrum feature*/
.breadcrum{
margin-top:5px;
/*border:1px solid #cccccc;*/
color: #000;
}
.breadcrum a{
text-decoration:underline;
color: #3882CE;
}
.breadcrum a:hover{
text-decoration:underline;
color: #AE0200;
}
/* for breadcrum feature ends here */

/* changes for menu */
.menu ul li ul {width: 468px; padding: 7px 0 13px 20px !important;}
.menu ul li ul li {padding: 7px 0 0 15px;  height: auto; width: 211px; margin:0 0 -6px 0;}
.menu ul li ul li a {font-size: 11px;}



/* changes for Media Query  */
.fa.menu-icon {display: none;}

@media (max-width:980px) {
body{width: 100%;}
.header {background: url(../images/headerBG.gif) top -2px left repeat-x;}
.innerHeader {width: 98%;padding: 0 1%;background: transparent;height: auto;}
.logo {float: none;padding: 18px 0 28px 0;width: auto;margin: 0 auto;background: url(../images/headerGraphic2.png) 100% -22px no-repeat;background-size: 100% 100%;}
.logo a {display: inline-block;width: 215px;}
.logo a img {width: 215px;}
.partSearch {margin: 0;}
.textBoxCont {width: 95%;padding: 10px 0 0 5%;}
input[type="image"] {width: auto!important;}
.fa.menu-icon {display: block!important;font-size: 40px;cursor: pointer;margin: 25px 0 0 0;float: left;width: auto;}
.wrapper {width: 100%;float: left;}
.menu {display: none;width: 100%;height: auto;background: none repeat-x top left #000;}
.menu ul li, .menu ul {width: 100%;padding: 0;}
.menu ul li.active span {width: 100%;}
.menu ul li a {text-align: center;font-size: 18px;width: 100%;padding: 5px 0px;}
.boldtxt {width: auto;}
.bannerCont {width: 100%;height: auto;padding-top: 10px;}
.redBg {float: left;width: 100%;background: url(../images/redbg.jpg) 0px top no-repeat;background-size: 100% 100%;height: 246px;}
.redrfqbox {float: left;width: 100%;font-size: 22px;font-weight: bold;text-transform: uppercase;padding: 22px 0 0 0;text-align: center;}
.form {float: none;width: 66%;padding: 16px 0 0 0;margin: 0 auto;}
.form fieldset {float: left;border: 0px;padding: 10px 0 15px 0;width: 100%;}
.senrqBtn {float: none;width: 120px;padding: 4px 0 0 0;margin: 0 auto;}
.form fieldset label {float: left;width: 14%;color: #fff;font-size: 12px;text-align: left;padding: 7px 0 0 28px;}
.form fieldset input {float: left;width: 76%;padding: 0px 2px 0 2px;font-size: 12px;color: #666;height: 22px;}
.banner {float: left;width: 100%;}
.banner img {width: 100%;height: 100%;}
.midCont {float: left;width: 98%;padding: 0 1%;display: block;}
.midCont.home-flx{display: flex;align-items: flex-start;flex-direction: column-reverse;justify-content: flex-start;}
.leftCont {float: left;width: 98%;padding: 8px 0 0 0;margin: 0 auto;}
.outCont {float: none;width: 100%;margin: 0 auto;display: table;border-bottom: 1px solid #e2e2e2;padding: 10px 0 22px 0;}
.redtext {font-size: 20px;padding: 0 0 10px 0;}
.outCont p {width: 100%;font-size: 16px;}
.outCont ul {width: 100%;}
.outCont ul li {width: 95%;font-size: 16px;padding-left: 5%;background: url(../images/squre.jpg) no-repeat left 5px top 8px;}
.rightPanel {width: 100%;}
.cataloglist {width: 98% !important;margin: 0 auto !important;}
.cataloglist li {margin-left: 0 !important;width: 100% !important;height: 100% !important;}
.footer {min-width: 98%;width: 98%;padding: 10px 1%;background: none #000;}
.footer a {font-size: 14px;line-height: 25px;}
.advac {width: 120px;}
.imgCont {margin-bottom: 8px;}
.cataloglist li img {height: 100% !important;}
.leftCont .outCont:last-child {border-bottom: 0;}
.cataloglist .desc {bottom: 0px !important;}
span.rfq_cart_btn{padding-right: 8px;}
.menu ul li:hover ul {width: 100%;top: 0;left: 0;position: relative;background: transparent;padding: 0 0 10px 0;}
.menu ul li ul {padding: 0 0 10px 0 !important;}
.menu ul li:hover li {background: #000;width: 100%;height: auto;padding-left: 0;margin: 0;}
.menu ul li ul li a {font-size: 11px;line-height: normal;}
.midCont .categoryItemBox {float: left;width: 100%;padding: 20px 0%!important;margin: 0 !important;}
.rfq_third_table tr {display: inline-grid;width: 100%;}
.rfq_third_table .rfq_image img {width: 100%;max-width: 100%;display: block;}
textarea#addcomments , .rfq_third_table td input{width: 100% !important;max-width: 100% !important;}
#orderprod{overflow: scroll;}
#orderprod table.rfq_first_table, #orderprod table.rfq_second_table {width: 980px;}
#orderprod table.rfq_first_table td input[type="button"], #orderprod table.rfq_second_table td input[type="button"]{width: 149px !important;max-width: inherit !important;}
#orderprod table.rfq_first_table td input, #orderprod table.rfq_second_table td input{width: auto !important;max-width: inherit !important;}
.categoryItemBox table.about-us .banner{width: auto;}
#contactus table {float: left;width: 100%;}
#contactus tr {display: inline-grid;width: 100%;}
#contactus p {font-size: 16px;}
#contactus tr td.contact-image {display: none;}
textarea#content {width: 100% !important;max-width: 100% !important;}
.categoryItemBox table.contact-addrs tr {display: inline-grid;width: 100%;}
.categoryItemBox table.contact-addrs td {width: auto !important;padding: 10px 0;}
.categoryItemBox table.contact-addrs {float: left;width: 100%;}
#contactus tr td{text-align: left !important;width: auto !important;}
#contactus tr td p{text-align: center !important;}
.categoryItemBox table.contact-addrs td iframe {width: 100% !important;}
#contactus table input{width: 100% !important;max-width: 100% !important;}
.rfq_image img {width: 100%;}
.quality-page table{padding-top: 0 !important;}
.inputCont {width: 65%;}
#contactus table input[type="image"] {width: auto!important;max-width: inherit !important;}
.sub-category-table {overflow: scroll;}
.sub-category-table table {width: 955px;}
.wrapper h1.boldtxt1 {width: auto;}
.categoryItemBox{width: 94%;padding: 20px 2%!important;margin: 0 1% !important;}
.midCont .categoryItemBox {float: left;width: 100%;padding: 20px 0%!important;margin: 0 !important;}
.breadcrum {width: auto;padding: 0 2%;}
.textBoxCont .inputCont input {width: 100%;box-sizing: border-box;}
.textBoxCont .searchBtn {position: relative;left: -2px;height: 29px;}
.textBoxCont .searchBtn input[type="image"]{height: 100%;}

}

@media (max-width: 767px){
form#advancesearch table tr {display: inline-grid;width: 100%;}
form#advancesearch select#fsc , .textboxclass input {width: 100% !important;max-width: 100% !important;}
.textboxclass input[type="image"] {width: auto!important;max-width: inherit !important;}
.categoryItemBox td .td-img{width: 100%;}
.categoryItemBox table.about-us .banner{width: 100%;margin-bottom: 15px;}
.categoryItemBox table.about-us .banner img{width: 100% !important;height: 100% !important;}
.quality-page tr {display: inline-grid;width: 100%;}
.quality-page tr td{width: 98%!important;margin-bottom: 12px;}
.quality-page tr td:last-child{margin-bottom: 0;}

.sub-category-table.subTabl {overflow: inherit;}
.sub-category-table.subTabl table {width: 100%;}
.sub-category-table.subTabl table td{display: block;border-top: 0;width: auto;text-align: left;border-right: 1px solid #f1f2f3;padding: 7px 10px 7px 160px;
    position: relative;}
.sub-category-table.subTabl table td:before {width: 160px;display: inline-block;
    font-weight: 600;position: absolute;left: 7px;}
.sub-category-table.subTabl table td:first-child:before {content: "NSn";}
.sub-category-table.subTabl table td:nth-child(2):before {content: "Part Number";}
.sub-category-table.subTabl table td:nth-child(3):before {content: "Item Name";}
.sub-category-table.subTabl table tbody tr:first-child{display: none;}
.sub-category-table.subTabl table td:last-child, .sub-category-table.subTabl table td:nth-last-of-type(2) {width: 49.68%;display: block;position: static;text-align: center;padding: 7px 0px;float: left;border: 0;border-bottom: 2px solid #f1f2f3;}
.sub-category-table.subTabl table td:last-child{border-left: 2px solid #f1f2f3;}
.sub-category-table.subTabl table tbody tr:last-child td.subCatPagination {width: auto;text-align: left;position: static;border: 0;padding: 15px 10px;}
.sub-category-table.subTabl table tbody tr:last-child td:before{display: none;}



}

@media (min-width: 640px) and (max-width: 767px){
.cataloglist li {height: 198px !important;margin-left: 10px !important;width: 48% !important;}
.cataloglist li img {height: 160px !important;}

}

@media (max-width: 640px){
.form {width: 80%;}
table.about-us p a{display: block;width: 100%;}
.categoryItemBox table.about-us .banner ~ p a , table.about-us p span a{display: inline;width: auto;}
}

@media (max-width: 480px){
.form {width: 100%;}
.form fieldset label {width: 18%;padding: 7px 0 0 8px;}
.rfq_third_table .rfq_image img {max-width: 300px;}

}

@media (max-width: 420px){
.fa.menu-icon {margin: 43px 0 0 0;}
.partSearch {width: 86%;height: 90px;}

}