.scene {
  width: 1366px;
  margin: 0 auto;
  height: 720px;
  padding: 0;
}


html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
    text-decoration: none;
}

/* -- custome fonts --*/
@font-face {
    font-family: "calibri";
    src: url('../fonts/53802491-calibri.eot');
    src: url('../fonts/53802491-calibri.eot?#iefix') format('embedded-opentype'),
        url('../fonts/53802491-calibri.svg#Calibri') format('svg'),
        url('../fonts/53802491-calibri.woff') format('woff'),
        url('../fonts/53802491-calibri.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "harabara";
    src: url('../fonts/harabara-webfont.eot');
    src: url('../fonts/harabara-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/harabara-webfont.svg#harabara') format('svg'),
        url('../fonts/harabara-webfont.woff') format('woff'),
        url('../fonts/harabara-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "androgyne";
    src: url('../fonts/androgyne_tb-webfont.eot');
    src: url('../fonts/androgyne_tb-webfont.eot?#iefix') format('embedded-opentype'),
        url('../fonts/androgyne_tb-webfont.svg#androgyne') format('svg'),
        url('../fonts/androgyne_tb-webfont.woff') format('woff'),
        url('../fonts/androgyne_tb-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


/*--- Commong Class ---*/
body{
     font: 14px/18px 'calibri',sans-serif;
     color: #333;
}


/*--- Header section ---*/
header,
.titleContainer{
    width: 980px;
    margin: 0 auto;
    overflow: hidden;
}
.logo{
    width: 337px;
    height: 132px;
    float: left;
    display: block;
    margin-top: 40px;
    margin-left: 10px;
    background: url(../img/logo.png) no-repeat;
}

nav{
    float: right;
    padding-top: 35px;
}
nav ul{
    background: url(../img/nav_shade_bg.png) no-repeat center bottom;
    overflow: hidden;
    height: 40px;
    padding: 0;
    width: 361px;
    margin: 0 0 3px;
}
nav li{
    float: left;
    padding: 0 20px;
    background: url(../img/nav_divider_home.png) no-repeat center right;
}
nav li .active{
    cursor: text;
}
nav li.navHome{
    padding-left: 0;
}
nav li.navContact{
    padding-right: 0;
    background: none;
}
nav li a{
    display: inline-block;
    font: 500 16px 'Oswald', sans-serif;
    color: #5f5f5f;
    text-transform: uppercase;
}
nav li a:hover{
    text-decoration: none;
    color: #9e0196;
}
.navPhone{
    float: left;
    vertical-align: top;
    font: 500 13px 'Oswald', sans-serif;
    color: #797878;
    letter-spacing: .3px
}
.navPhone i{
    display: inline-block;
    width : 16px;
    height : 18px;
    background: url(../img/phone_icon_bg.png) no-repeat 0 3px;
    margin-right: 7px;
}
.navEnq{
    display: block;
    float: right;
    color: #a2399c;
    margin-right: 10px;
    letter-spacing: .6px;
    text-transform: uppercase;
    font: 500 13px 'Oswald', sans-serif;
}
.navEnq:hover{
    text-decoration: none;
    color: #333;
}


/*------------------------- home page -------------------------*/
.home{
    width: 100%;
    height: 720px;
    overflow: hidden;
    background: url(../img/home_bg.jpg) no-repeat;
}
.hmContentBox{
    width: 498px;
    height: 390px;
    position: absolute;
    background: url(../img/home_content_bg.png) no-repeat;
}
.homeBottleImage{
    width: 292px;
    height: 476px;
}
.sliderText{
    width: 411px;
    height: 95px;
    right: 95px;
    top: 410px;
    display: block;
    position: absolute;
    background: url(../img/slider_text.png) no-repeat;
}
.hmContentBox h3{
    width: 100%;
    color: #fff;
    text-align: left;
    font: 300 33px 'Oswald', sans-serif;
    margin: 35px 0 15px 35px;
}
.hmContentBox h3 span{
    font-weight: 500;
}
.hmContentBox p{
    width: 410px;
    color: #f6ebf5;
    text-align: left;
    margin:0 0 0 37px;
    padding-bottom: 15px;
    position: static !important;
}
.hmContentBox a{
    display: block;
    float: right;
    color: #ffe854;
    margin: 0 53px 0 0;
    padding: 0 14px 0 0;
    background: url(../img/down_arrow.png) no-repeat right -8px;
    -webkit-transition:all .2s ease; 
    -moz-transition:all .2s ease; 
    -ms-transition:all .2s ease; 
    -o-transition:all .2s ease; 
    transition:all .2s ease;
}
.hmContentBox a:hover{
    text-decoration: none;
    background-position: right 6px;
    color: #000;
}
.homeFruit1{
    top: 15px;
    right: 0;
    width: 182px;
    height: 321px;
    z-index: 9999;
    position: absolute;
    background: url(../img/fruit_home_1.png) no-repeat;
}
.homeFruit2{
    top: 363px;
    left: 0;
    width: 164px;
    height: 183px;
    z-index: 9999;
    position: absolute;
    background: url(../img/fruit_home_2.png) no-repeat;
}

/*------------------------- product page -------------------------*/
.product{
    width: 100%;
    height: 720px;
    overflow: hidden;
    background: url(../img/product_bg.jpg) no-repeat;
}
.product .pageTitle{
    width: 590px;
    float: left;
    color: #fff;
    text-align: left;
    margin: 29px 0 0 0;
    font: 35px/55px 'harabara',sans-serif;
    background: url(../img/titles_bg.png) no-repeat 195px 29px;
}
.product nav{
    padding-top: 25px;
}
.product nav li a{
    color: #fff;
}
.product nav li a:hover{
    color: #fed700;
}
.product nav li.navProduct a{
    color: #fed700;
}
.product .navPhone{
    color: #d1c6c8;
}
.product .navEnq{
    color: #fff;
}
.product .navPhone i{
    background-position: 0 -36px;
}
.proFruit1{
    width: 144px;
    height: 326px;
    background: url(../img/pro_fruit_1.png) no-repeat;
    position: absolute;
    right: 0;
    top: 689px;
}
.proFruit2{
    width: 134px;
    height: 167px;
    background: url(../img/pro_fruit_2.png) no-repeat;
    position: absolute;
    left: 0;
    top: 1275px;
}


/** product content **/
.proContent{
    width: 920px;
    height: 530px;
    margin: 10px auto 0;
    padding: 30px;
    background: url(../img/product_content_bg.png);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.proContent > p{
    color: #C2C2C2;
    font-size: 16px;
    padding: 8px 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background: url(../img/pro_content_heading.png);
}

/** product slider **/
.productSlider{
    width: 100%;
    height: 410px;
    margin-top: 35px;
    position: relative;
}
.proImage{
    width: 290px;
    height: 400px;
    float: left;
    overflow: hidden;
    margin-left: 40px;
}
.proDetail {
    width: 380px;
    float: left;
    margin-left: 40px;
    margin-right: 15px;
}
.proDetail h4{
    color: #ffb600;
    font: 40px 'androgyne',sans-serif;
    padding-bottom: 20px;
    margin: 0;
}
.proDetail p{
    font-size: 16px;
    line-height: 20px;
    color: #bebaba;
    padding-bottom: 15px;
}
.nutriDetails{
    display: none;
    float: left;
    width: 260px;
    height: 310px;
    padding-left: 30px;
    background: url(../img/pro_info_divider.png) no-repeat left top;
}
.nutriDetails p{
    color: #fff;
    display: block;
    padding-bottom: 15px;
    letter-spacing: 0.6px;
    font: 300 16px 'Oswald', sans-serif;
}
.nutriDetails p span{
    font-weight: 500;
}
.nutriDetails .table{
    color: #fff;
    font-size: 12px;
    ;
}
.nutriDetails .table > tbody > tr > td{
    border: 0;
    color: #fff;
}
.nutriDetails .table > tbody > tr > td.txtCenter{
    text-align: center;
}

/** product slider control **/
.bx-controls{
    top: 40%;
    width: 100%;
    position: absolute;
    z-index: 9999;
}
.bx-prev,
.bx-next{
    display: block;
    width: 29px;
    height: 48px;
    text-indent: -9999px;
    position: absolute;
    background: url(../img/pro_slider_arrow.png) no-repeat;
}
.bx-prev{
    left: 0;
}
.bx-prev:hover{
    background-position: 0 -53px;
}
.bx-next{
    right: 0;
    background-position: -32px 0;
}
.bx-next:hover{
    background-position: -32px -53px;
}
.sliderPager{
    right: -6px;
    width: 600px;
    height: 170px;
    bottom: -45px;
    position: absolute;
    z-index: 1000;
}
.sliderPager p{
    font: 400 18px 'Oswald', sans-serif;
    color: #d4d1d1;
    background: url(../img/titles_bg.png) no-repeat 215px 15px;
}
.proSliderPager{
   width: 100%;
}
.proSliderPager > a{
    width: 75px;
    float: left;
    display: block;
    text-align: center;
    font-size: 12px;
    margin-top: 30px;
}
.proSliderPager > a > img{
    transform : scale(1);
    -ms-transform : scale(1);
    -webkit-transform : scale(1);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}
.proSliderPager > a:hover > img,
.proSliderPager a.active > img{
    transform : scale(1.2);
    -ms-transform : scale(1.2);
    -webkit-transform : scale(1.2);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}
.proSliderPager > a span{
    display: block;
    line-height: 14px;
    color: #ccc;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}
.proSliderPager > a:hover span,
.proSliderPager > a.active span{
    color: #ffb600;
    margin-top: 8px;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}


/*------------------------- about page -------------------------*/
.aboutPage{
    width: 100%;
    height: 720px;
    background: url(../img/about_bg.jpg);
}
.aboutPage .pageTitle{
    width: 590px;
    float: left;
    color: #fff;
    text-align: left;
    margin: 29px 0 0 0;
    font: 35px/55px 'harabara',sans-serif;
    background: url(../img/titles_bg.png) no-repeat 140px 29px;
}
.aboutPage nav{
    padding-top: 25px;
}
.aboutPage nav li{
   background: url(../img/nav_divider_about.png) no-repeat center right;
}
.aboutPage nav li.navContact{
    background: none;
}
.aboutPage nav li a{
    color: #fff;
}
.aboutPage nav li a:hover{
    color: #fed700;
}
.aboutPage nav li.navAbout a{
    color: #fed700;
}
.aboutPage .navPhone{
    color: #374e4c;
}
.aboutPage .navEnq{
    color: #374e4c;
}
.aboutPage .navEnq:hover{
    color: #fed700;
}
.aboutPage .navPhone i{
    background-position: 0 -17px;
}
/* about content */
.aboutPageContent{
    width: 920px;
    height: 530px;
    margin: 10px auto 0;
    padding: 30px;
    background: url(../img/about_content_bg.png);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.aboutPageContent > .leftContent{
    width: 500px;
    float: left;
    padding-left: 10px;
    padding-top: 40px;
}
.aboutPageContent > .rightContent{
    width: 364px;
    height: 491px;
    float: right;
    margin-top: 30px;
    background: url(../img/about_image.png) no-repeat;
}
.aboutPageContent > .leftContent > p{
    width: 100%;
    font-size: 16px;
    color: #E7E7E7;
    padding-bottom: 20px;
    line-height: 22px;
}
.aboutPageContent > .leftContent h3{
    font-size: 18px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
}
.aboutPageContent > .leftContent h3 span{
    display: block;
    font-weight: normal;
    text-transform: capitalize;
    color: #E7E7E7;
}
.aboutPageContent > .leftContent ul{
    list-style: none;
    padding-top: 20px;
}
.aboutPageContent > .leftContent ul li{
    font-size: 16px;
    color: #E7E7E7;
    background: url(../img/about_bullet.png) no-repeat left center;
    margin-bottom: 15px;
    padding-left: 20px;
}
.aboutFruit1{
    right: 0;
    top: 1420px;
    width: 166px;
    height: 203px;
    background: url(../img/fruit_about_1.png) no-repeat;
    position: absolute;
    z-index: 1000;
}
.aboutFruit2{
    left: 0;
    top: 1985px;
    width: 154px;
    height: 195px;
    background: url(../img/fruit_about_2.png) no-repeat;
    position: absolute;
    z-index: 1000;
}


/*------------------------- Contact Page -------------------------*/
.contactPage{
    width: 100%;
    height: 720px;
    background: url(../img/contact_bg.jpg);
}
.contactPage .pageTitle{
    width: 590px;
    float: left;
    color: #fff;
    text-align: left;
    margin: 29px 0 0 0;
    font: 35px/55px 'harabara',sans-serif;
    background: url(../img/titles_bg.png) no-repeat 155px 29px;
}
.contactPage nav{
    padding-top: 25px;
}
.contactPage nav li{
   background: url(../img/nav_divider_about.png) no-repeat center right;
}
.contactPage nav li.navContact{
    background: none;
}
.contactPage nav li a{
    color: #fff;
}
.contactPage nav li a:hover{
    color: #fed700;
}
.contactPage nav li.navContact a{
    color: #fed700;
}
.contactPage .navPhone{
    color: #c0b1c2;
}
.contactPage .navEnq{
    color: #c0b1c2;
}
.contactPage .navEnq:hover{
    color: #fed700;
}
.contactPage .navPhone i{
    background-position: 0 -36px;
}

/* contact content */
.contactPageContent{
    width: 900px;
    height: 540px;
    margin: 10px auto 0;
    padding: 30px;
    background: url(../img/about_content_bg.png);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.contactPageContent .cForm{
   width: 263px;
    float: left;
    padding: 15px 20px;
    border-radius: 5px;
    margin-left: 5px;
    background: url(../img/pro_content_heading.png);
}
.contactPageContent .cForm h3{
    display: none;
    font-size: 20px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    padding-bottom: 25px;
}
.contactPageContent .cForm p{
    display: block;
    width: 100%;
    padding-bottom: 15px;
    position: relative;
}
.contactPageContent .cForm p label{
    display: block;
    width: 100%;
    font-size: 16px;
    color: #f0f0f0;
    padding-bottom: 5px;
}
.contactPageContent .cForm p label em{
    font-style: normal;
    font-size: 14px;
}
.contactPageContent .cForm p input[type='text'],
.contactPageContent .cForm p textArea{
    background-color: #c1c1c1;
    padding: 7px 10px;
    border: none;
    width: 240px;
    outline: none;
    color: #666;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.contactPageContent .cForm p textArea{
    height: 50px;
}

.contactPageContent .cForm p input[type='text']:focus,
.contactPageContent .cForm p textArea:focus{
    background-color: #fff;
}
.contactPageContent .cForm .sendBtn{
    background-color: #d8335b;
    padding: 12px 0;
    text-align: center;
    border: none;
    font-weight: bold;
    margin-top: 40px;
    outline: none;
    cursor: pointer;
    width: 260px;
    color: #fff;
    text-transform: uppercase;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.contactPageContent .cForm .sendBtn:hover{
    background-color: #8a0357;
}
.contactPageContent .mapBox{
    width: 570px;
    float: right;
}
.contactPageContent .mapBox > iframe{
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.contactPageContent .mapBox p.phone{
    width: 235px;
    background: url(../img/contact_phone_icon.png) no-repeat 0 0;
    color: #d8d1d5;
    float: left;
    font-size: 16px;
    margin-top: 20px;
    padding-left: 22px;
    clear: left;
}
.contactPageContent .mapBox p.address{
    width: 280px;
    color: #d8d1d5;
    float: right;
    font-size: 16px;
    margin-top: 36px;
    padding-left: 22px;
    line-height: 20px;
    background: url(../img/contact_address_icon.png) no-repeat 0 0;
}
.contactFruit1{
    right: 0;
    top: 2078px;
    width: 154px;
    height: 178px;
    background: url(../img/fruit_contact_1.png) no-repeat;
    position: absolute;
    z-index: 1000;
}
.contactFruit2{
    left: 0;
    top: 2733px;
    width: 209px;
    height: 145px;
    background: url(../img/fruit_contact_2.png) no-repeat;
    position: absolute;
    z-index: 1000;
}
#contactForm label.error {
    position: absolute;
    top: 57px;
    background: red;
    border-radius: 3px;
    width: 240px;
    color: #fff;
    padding: 5px 10px;
    font-size: 12px;
    z-index: 100;
}


/* recapcha styles */
#recaptcha_image,
#recaptcha_image > img{
    width: 260px;
}
#recaptcha_image > img{
     -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.recaptcha_only_if_image{
   color: #fff;
    padding-top: 10px;
    display: block;
}
#recaptcha_response_field{
    float: left;
    border: none;
    width: 212px;
    float: left;
    outline: none;
    border-radius: 3px;
    padding: 5px 10px;
    background-color: #c1c1c1;
}
#recaptcha_response_field:focus{
    background-color: #fff;
}
.reloadCaptcha{
    width: 23px;
    height: 26px;
    float: left;
    margin: 1px 0 0 5px;
    background: url(../img/reload_icon.png) no-repeat;
}
.reloadCaptcha:hover{
    background-position: 0 -27px;
}

/* hide iframe styles */
iframe[src='about:blank']{
    display: none;
}


/***-------- contact content ----------***/
.thanksLogo{
    width: 337px;
    height: 132px;
    margin: 100px auto 30px;
    background: url(../img/logo.png) no-repeat;
}
.sorryMsg,
.successMsg{
    width: 100%;
    font-size: 30px;
    text-align: center;
}
.sorryMsg{
    color: red;
}
.successMsg{
    color: green;
}
.backContact,
.backHome{
    display: block;
    width: 100%;
    text-align: center;
    padding-top: 20px;
}
.backContact:hover,
.backHome:hover{
    text-decoration: underline;
}