/* Filename: main.css

 * Website: Prixmax

 * Author: Eranga Lakmal Kapukotuwa

 * Date Created: 02/08/2012

 * Media: Screen

 *

 * Description

 * -----------

 * Colours:

 * Background       - #xxxxxx

 * Link             - #xxxxxx

 * Link Hover       - #xxxxxx

 * Link Active      - #xxxxxx

 *

 *=====================================================================*/



/* Layout styles

    index ->

                CSS reset

				default styles

*/



/* = css reset

--------------------- */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: inherit; font-family: inherit; vertical-align: baseline; list-style-type:none; text-decoration: none; }

article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}



@font-face

{

font-family: helveticaneueltpromdcn;

src: url('../fonts/helveticaneueltpromdcn.ttf')

}





html { color: #3a3d40; font: 13px/17px "Arial"; background: #ffffff; }

body {
  background-color: #eee;
  padding-bottom: 50px;
  overflow-x: hidden;
}



h1 { color: #3b3c3e; font: 39px/39px "helveticaneueltpromdcn"; margin-bottom: 15px; border-bottom: 1px solid #c0c0c0; padding-bottom: 10px;}

h2 { color: #3b3c3e; font: 24px/24px "helveticaneueltpromdcn"; text-transform: uppercase; margin-bottom: 10px; }

h3 { color: #3b3c3e; font: 20px/24px "helveticaneueltpromdcn"; margin-bottom: 15px; }

h4 { color: #3b3c3e; font: 16px/16px "helveticaneueltpromdcn"; font-weight: bold; margin-bottom: 10px; }

p { margin-bottom: 17px; }

a { color: #53A917; }

a:hover { color: #50c011; }

a.block, a.block:hover { color: #3b3c3e; }



/* = header

--------------------- */

header { overflow: visible; padding-bottom: 21px; height: 92px; }

header h1.logo { display: block; width: 313px; height: 46px; margin: 31px 0px 0px -1px; text-indent: -9999px; border-bottom: 0; }

header h1.logo a { display: block; width: 313px; height: 46px; background: url('../images/logo.jpg') no-repeat top left; }



header .topNav { float: right; margin: 27px 2px 17px 0px; }

header .topNav li { float: left; margin-right: 8px; }

header .topNav li a { color: #313131; font: 12px/12px "Arial"; display: block; height: 12px; padding-right: 7px; border-right: 2px solid #5db568; }

header .topNav li a:hover { color: #50c011; }

header .topNav li.last { margin-right: 0px; padding-right: 0px; }

header .topNav li.last a { margin-right: 0px; padding-right: 0px; border: 0px; }

header .topNav li.customer a { padding-left: 7px; border-left: 2px solid #5db568; border-right: 0; margin-left: 7px; padding-right: 0; }

header .topNav li.loginButton { margin-right: 0px; }

header .topNav li.loginButton a { color: #ffffff; display: block; border-right: 0px; padding: 6px 20px 7px 20px; text-align: center; margin: -6px 0px 0px 10px; background: #65ac42 url('../images/header-login-bg.jpg') repeat-x top;

	-webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px;}

header .topNav li.loginButton a:hover { color: #fbe02b; }



header .productFindForm { float: right; clear: both; margin: 0px 2px 0px 0px; }

header .productFindForm .selectholder { border: 1px solid #b9bcbe; width: 164px; height: 27px; cursor: pointer; background: #ffffff url('../images/header-dropdown-arrow.jpg') no-repeat top right;

	-webkit-box-shadow: inset 2px 2px 6px 1px #cccccc; -moz-box-shadow: inset 2px 2px 6px 1px #cccccc; -o-box-shadow: inset 2px 2px 6px 1px #cccccc; box-shadow: inset 2px 2px 6px 1px #cccccc;

	-webkit-border-radius: 1px; -moz-border-radius: 1px; -o-border-radius: 1px; border-radius: 1px; }

header .productFindForm .selectholder span { color: #85837f; font: 11px/11px "Arial"; margin: 9px 0px 7px 9px; }

header .productFindForm .selectholder ul {  width: 166px; display: none; margin-top: 8px; margin-left: -10px; position: relative; z-index: 2000; }

header .productFindForm .selectholder span:hover ul { display: block; }

header .productFindForm .selectholder ul li { overflow: hidden; }

header .productFindForm .selectholder ul li a { color: #212121; font: 11px/11px "Arial"; display: block; background: #ffffff; padding: 9px 9px 9px 9px; cursor: pointer; }

header .productFindForm .selectholder ul li:hover a { color: #ffffff; background: #5bb233;  }



/* = mainNav

--------------------- */

.manNavHolder {  position: relative; width: 100%; }

.manNavHolder nav { height: 48px; width: 978px; margin: 0px auto; position: relative; z-index: 1000; }

.manNavHolder .mainNav { height: 48px; float: left; }

.manNavHolder .mainNav li { float: left; height: 48px; }

.manNavHolder .mainNav li a { color: #ffffff; font: 16px/16px "helveticaneueltpromdcn"; cursor: pointer; padding: 19px 35px 13px 34px; display: block; background: #262827; }

.manNavHolder .mainNav li.current a  { background: transparent; }

.manNavHolder .mainNav li:hover a { background: #5fb03c; }

.manNavHolder .mainNav li.hasSubMenu:hover a { background: #5fb03c; }

.manNavHolder .mainNav li.hasSubMenu:hover .secNav a { background: #5fb03c url('../images/sec-nav.jpg') right center no-repeat; }

.manNavHolder.noBanner .mainNav li:hover a, .manNavHolder.noBanner .mainNav li.current a { color: #ffffff; }

.manNavHolder .mainNav li.spaceFiller  a { background: #262827; width: 1200%; height: 16px; }



.manNavHolder .mainNav .secNav { position: absolute; display: none; margin: 0px 0px 0px 0px; }

.manNavHolder .mainNav li:hover .secNav { display: block; }

.manNavHolder .mainNav li:hover .secNav .thirdNav, .manNavHolder .mainNav li:hover .secNav .fourthNav { display: none; }

.manNavHolder .mainNav .secNav li { position: relative; float: none; height: auto; padding: 0px 10px 0px 10px; background: #5fb03c; }

.manNavHolder .mainNav .secNav li a { overflow: hidden; padding: 10px 15px 10px 15px; width: 200px; border-bottom: 1px solid #6ab946; background: #5fb03c url('../images/sec-nav.jpg') right center no-repeat; font: 13px/17px "Arial"; }

.manNavHolder .mainNav .secNav li.last a { border-bottom: 0px; }

.manNavHolder .mainNav .secNav li a span { float: left; }

.manNavHolder .mainNav .secNav li a:hover { color: #fbe02b; }



.manNavHolder .mainNav .secNav .thirdNav { left: 250px; display: none; top: 0px; }

.manNavHolder .mainNav .secNav .fourthNav { left: 250px; display: none; top: 0px; }

.manNavHolder .mainNav .secNav li:hover .thirdNav,
.manNavHolder .mainNav .thirdNav li:hover .fourthNav { display: block; }



.manNavHolder .left { position: absolute; z-index: 2; top: 0px; height: 48px; width: 50%; margin-left: -489px; background: #262827; }

.manNavHolder .right { position: absolute; z-index: 2; top: 0px; left: 978px;  height: 48px; width: 200%; margin-left: 0px; background: #262827; }

.hamburger-button{ display: none;}
.loginButton-mobile{display: none;}
.productFindForm-mobile{display: none;}
.mobileMenu{display: none;}
.mainNavMobile{display: none;}



/*.manNavHolder .spaceFiller { overflow: hidden; height: 50px; width: 392px; background: red;}*/



#Breadcrumbs { padding-top: 14px; padding-bottom: 16px; }

#Breadcrumbs p { margin-left: 7px; margin-bottom: 0px; color: #53A917; }

#Breadcrumbs p a, #Breadcrumbs p a span  { color: #717171; }

#Breadcrumbs p span { color: #53a917; }

/* = slider

--------------------- */

.slider { width: 1980px; height: 534px; position: relative; z-index: 0; margin: -48px auto 0px auto ; }

.slider .sliderHolder { position: absolute; }

.orbit-wrapper div.slider-nav .right { right: 50% !important; margin-right: -51px; width: 51px !important; height: 45px !important; background: url('../images/slider-nav-bg.png') no-repeat -51px -45px !important;  }

.orbit-wrapper div.slider-nav .left { left: 50% !important; margin-left: -51px; width: 51px !important; height: 45px !important; background: url('../images/slider-nav-bg.png') no-repeat 0px -45px !important; }

.orbit-wrapper div.slider-nav .right:hover { background-position: -51px 0px !important;  }

.orbit-wrapper div.slider-nav .left:hover { background-position: 0px 0px !important; }

.page.container_12 { margin-top: 30px; }



.slider.bannerImage { height: 234px; }



.slider .homeSliderContent { color: white; position: absolute; top: 123px; left: 0px; z-index: 4; width: 100%; }

.slider .homeSliderContent #positionSliderContent { width: 978px;  left: 0px; position: relative; }

.slider .homeSliderContent #positionSliderContent .sliderContent { width: 630px;  }

.slider .homeSliderContent h2 {  color: white; font: 72px/81px "helveticaneueltpromdcn"; text-transform: none; margin-bottom: -7px; word-spacing: -9px; padding-left: 0px; }

.slider .homeSliderContent p {   color: white; font: 16px/25px "Arial"; font-weight: lighter; padding-left: 0px; }



.orbit-wrapper img { }



/* = home

--------------------- */

.homePage.container_12 { padding: 10px 5px 45px 5px; width: 968px; margin-top: -48px; position: relative; z-index: 4; background: white; }

.homePage .block.grid_4 { width: 312px; margin-left: 5px; margin-right: 5px; }

.homePage .block { margin-bottom: 63px;  }

.homePage .block img { margin-bottom: 21px; }

.homePage .block p { margin-bottom: 23px; line-height: 18px; }

.homePage .block .learnMore { color: #ffffff; display: inline-block; padding: 9px 26px 8px 26px; text-align: center; background: #65ac42 url('../images/header-login-bg.jpg') repeat-x top;

	-webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; }

.homePage .block .learnMore:hover { color: #fbe02b; }



.homePage .newsArea.grid_12 { width: 958px; margin-left: 0px; margin-right: 5px; padding-bottom: 12px; height: 105px; overflow: hidden; }

.homePage .newsArea { overflow: hidden; background: #f3f3f3 url('../images/home-news-bg.jpg') repeat-x bottom; }

.homePage .newsArea .upDownNav { float: left; width: 28px; margin-right: 28px; }

.homePage .newsArea .headerCol { float: left; margin: 29px 27px 0px 0px; }

.homePage .newsArea .headerCol a { color: #3B3C3E; }

.homePage .newsArea .newsSliderHolder { overflow: hidden; position: relative; margin: 27px 0px 0px 0px;  float: left; height: 78px; width: 800px; }

.homePage .newsArea ul { position: absolute; }

.homePage .newsArea ul li { margin-bottom: 13px; }

.homePage .newsArea ul li a { color: #599e3a; margin: 0px 7px 0px 0px;  display: inline; }

.homePage .newsArea ul li p { color: #757575; display: inline; }



.homePage .newsArea .upDownNav a { float: left; height: 34px; width: 28px; text-indent: -9999px; display: block; background: #65ac42 url('../images/home-news-arrow-sprite.jpg') no-repeat 0px 0px;  }

.homePage .newsArea .upDownNav a.down { background-position: 0px -34px; }

.homePage .newsArea .upDownNav a:hover { opacity: 0.7; }



/* = products page

--------------------- */

.productsPage { padding-bottom: 44px; }

.productsPage.container_12 .grid_12 { margin-left: 22px; margin-right: 0px; width: 962px; }

.productsPage .lhs { float: left; width: 278px; border-width: 1px 0px 0px 0px; border-color: #e9e9e9; border-style: solid; }

.productsPage .right { float: left; width: 632px; padding: 31px 20px 31px 26px; border: 1px solid #e9e9e9; }

.productsPage .right strong, .productsPage .right b { font-weight: bold; }

.productsPage .right em, .productsPage .right i { font-style: italic; }

.productsPage .right ul, .productsPage .right ul li { /* list-style: disc; list-style-type: disc; */ list-style-image: url('../images/list-arrow.png'); }

.productsPage .right ul li, .productsPage .right ol li { margin: 0 0 5px; }

.productsPage .right ul, .productsPage .right ol { margin-bottom: 20px; margin-left: 20px; }

.productsPage .right ol, .productsPage .right ol li { list-style: decimal; list-style-type: decimal; }


.productsPage .productList {
  border-left: 1px solid #e9e9e9;
}

.productsPage .productList li a { color: #3a3d40; display: block; overflow: hidden; width: 234px; padding: 17px 21px 17px 23px; border-bottom: 1px solid #e9e9e9; background: #f8f8f8; }

.productsPage .productList li a:hover { color: #50c011; }

.productsPage .productList li a span { float: left; }

.productsPage .productList li a span.arrow { float: right; }

.productsPage .productList li.active { position: relative; }

.productsPage .productList li.active a { background: #ffffff url('../images/sidebar-active-border.jpg') repeat-y left; width: 235px; }

.productsPage .productList li.active a span.arrow { opacity: 0; }

.productsPage .productList li.active li a { color: #3a3d40; display: block; overflow: hidden; width: 214px; padding: 17px 21px 17px 43px; border-bottom: 1px solid #e9e9e9; background: #f8f8f8; }

.productsPage .productList li.active li.active li a { width: 196px; padding: 17px 21px 17px 61px; }

.productsPage .productList li.active li.active a { background: #ffffff url('../images/sidebar-active-border.jpg') repeat-y left; }

.productsPage .productList li.active li.active li.active a { background: #ffffff url('../images/sidebar-active-border.jpg') repeat-y left; }

.productPage.container_12 { width: 974px; }

.productPage .productPageBody.grid_12 { margin-left: 5px; width: 901px; padding: 31px 31px 129px 26px; margin-right: 5px; margin-bottom: 50px; border: 1px solid #e9e9e9; }

.productPage .contentBox { width: 580px; float: left; }

.productPage .imgDiv { font-size: 0px; line-height: 0px; float: right; border: 5px solid #eae9e9; }



/* =content styles

------------------ */

.cmsContent strong, .cmsContent b { font-weight: bold; }

.cmsContent em, .cmsContent i { font-style: italic; }

.cmsContent ul, .cmsContent ul li { list-style: disc; list-style-type: disc; }

.cmsContent ol, .cmsContent ol li { list-style: decimal; list-style-type: decimal; }

.cmsContent ul, .cmsContent ol { padding-left: 20px; }



/* =news items

-------------- */

.newsItems {  }

.newsItems li { border-bottom: 1px solid #f1f1f1; padding-bottom: 10px; margin-bottom: 10px; }

.newsItems li h3 a { color: #3b3c3e; }

.newsItems li .time { margin-bottom: 0px; font-style: italic; }



.paginations a { color: #3b3c3e; }



/* =forms

--------- */

div.field, p.field { overflow: hidden; padding-bottom: 20px; }

.field label { float: left; width: 120px; }

.field .middleColumn { float: left; width: 200px; }

.field .middleColumn input, .field .middleColumn select { width: 200px; }

.mainContent .content .optionset { margin: 0px; }

.mainContent .content .optionset, .mainContent .content .optionset li { list-style: none; list-style-type: none; padding: 0px; background: transparent; overflow: hidden; }

.mainContent .content .optionset li input { width: auto; float: left; margin-right: 10px; }

form .Actions { padding-left: 120px; }



/* =Customer page

-------------- */

.customerDetails tr td { padding: 0 20px 5px 0; }

.coolcheck { margin: 20px 0 10px 0; }

.reports th, .reports td { padding: 2px 5px; }

.reports th { font-weight: bold; width: 150px;}

.reports .odd td { background-color: #f5f5f5; }





/* = footer

--------------------- */

footer.container_12 { width: 960px; }

footer.container_12 .grid_6 { width: 463px; }

footer { padding-top: 11px; padding-bottom: 30px; border-top: 1px solid #d7d7d7; }

footer a, footer p { color: #898989; font: 11px/11px "Arial"; }

footer a.logo { float: left; display: block; margin-right: 18px; width: 146px; height: 22px; background: url('../images/footer-logo.png') no-repeat 0px 0px; }

footer p { margin: 7px 0px 0px 0px; }

footer ul { float: right; margin-top: 6px; }

footer ul li { float: left; margin-right: 10px; }

footer ul li a { display: block; height: 12px; padding-right: 10px; border-right: 2px solid #5db568; }

footer ul li.last { margin: 0px; }

footer ul li.last a { padding: 0px; border: 0px; }

footer .youtube { float: right; display: block; margin: 0 0 0 10px; }


/* updates */

.manNavHolder {
  z-index: 2;
}
.slider {
  z-index: 1;
}
.manNavHolder .right {
  display: none;
}
.productPage,
.header-holder,
#Breadcrumbs,
.productsPage,
footer {
  background-color: #fff;
}
.productPage.container_12,
.footer-holder {
    background-color: #fff;
    margin: 0 auto;
    width: 1008px;
}
.HomePage .footer-holder {
  width: 978px;
}

.slider-text-holder {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.slider-text-holder .inner {
  margin: 130px auto 0;
  width: 980px;
}
.slider-text-holder span {
  color: #fff;
  font: 72px/81px "helveticaneueltpromdcn";
  margin-bottom: -7px;
  padding-left: 0;
  text-transform: none;
  word-spacing: -9px;
  width: 640px;
  display: block;
}
.content-title-holder span {
  color: #fff;
  font-size: 36px;
  font-family: "helveticaneueltpromdcn", sans-serif;
  display: block;
  text-shadow: 0 0 4px rgba(0, 0, 0, .4);
}
.content-title-holder {
  bottom: 30px;
  left: 0;
  position: absolute;
  width: 100%;
}
.content-title-holder .inner {
  margin: 0 auto;
  width: 970px;
}

/* Contact form */

body.ContactPage { }

body.ContactPage form h1,
body.ContactPage form h2,
body.ContactPage form h3,
body.ContactPage form h4 {
    width: 40%;
    margin: 30px auto 0px auto;
}

body.ContactPage div.field, 
body.ContactPage p.field,
body.ContactPage form .Actions {
    margin: auto;
    width: 100%;
    text-align: center;
    padding: 0;
}

body.ContactPage .field label,
body.ContactPage .field .middleColumn {
    float: none;
}

body.ContactPage .field label {
    width: 40%;
    text-align: left;
    display: block;
    margin: 20px auto 10px auto;
}

body.ContactPage .field .middleColumn {
    width: 100%;
    text-align: center; 
}

body.ContactPage .field .middleColumn input, 
body.ContactPage .field .middleColumn select,
body.ContactPage .field .middleColumn textarea {
    width: 40%;
    resize: none;
    text-align: left;
}

body.ContactPage form .Actions { 
    margin-top: 30px;
}

body.ContactPage .field label.required {
    color: #dd0000;
    font-size: 0.75em;
    text-align: right;
    margin-top: 0;
}

@media only screen and (max-width: 782px) {

  body.ContactPage form h1,
  body.ContactPage form h2,
  body.ContactPage form h3,
  body.ContactPage form h4,

  body.ContactPage .field label,

  body.ContactPage .field .middleColumn input, 
  body.ContactPage .field .middleColumn select,
  body.ContactPage .field .middleColumn textarea {
      width: 80%;
  }

}
