@import url('https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

@font-face {

  font-family: 'Lato-Regular';

  src: url('../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),  

  url('../fonts/Lato-Regular.woff') format('woff'), 

  url('../fonts/Lato-Regular.ttf')  format('truetype'), 

  url('../fonts/Lato-Regular.svg#Lato-Regular') format('svg');

  font-weight: normal;

  font-style: normal;

}

@font-face {

  font-family: 'Century Gothic';

  src: url('fonts/CenturyGothic.eot?#iefix') format('embedded-opentype'),  url('fonts/CenturyGothic.woff') format('woff'),  url('fonts/CenturyGothic.ttf') format('truetype'),  url('fonts/CenturyGothic.svg#CenturyGothic') format('svg');

  font-weight: normal;

  font-style: normal;

}

/*@import url('https://fonts.googleapis.com/css?family=Didact+Gothic&display=swap&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext');*/

@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&display=swap');



body {

    background:url(../images/page-bg.jpg)repeat;

    line-height: 20px;

    font-size: 16px;

    color: #323232;

    font-family: 'Roboto', sans-serif;

}

body ul {

    padding-left: 0;

}

/*body h1, h2{font-family: 'Roboto Condensed', sans-serif;}*/

body ul li {

    list-style-type: none;

}

body i {

    vertical-align: middle;

}

body ul li {

    list-style-type: none;

}

body a, body a:hover {

    text-decoration: none;

    font-weight: 600;

}

.p2 {

    padding-top: 2%;

}

.m9 {

    margin-top: -9%;

}

* {

    margin: 0;

    padding: 0;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

header {

    width: 100%;

    display: inline-block;

    position: relative;

    z-index: 999;

}

.top{

    width: 100%;

    margin: 0 auto;

 }

 .lgo{

    padding: 10px 0;

    margin-top: -50px;

 }

.redsec {

    width: 100%;

    background: #760a00;

    padding: 12px 0 0 58px;

    color: #fff;

    font-size: 18px;

}

.redsec:before {

    content: "";

    position: absolute;

    border: 25px solid #760a00;

    top: 0;

    left: -34px;

    border-bottom-color: transparent;

    border-left-color: transparent;

}

.redsec:after {

    content: "";

    position: absolute;

    background: #760a00;

    width: 77px;

    top: 0;

    left: 98%;

    /* right: 0; */

    height: 100%;

}



.redsec p span{

    padding-right: 15px;

}

/*.navbox ul li{

    padding-right: 20px;

}*/

 .navbar{margin-bottom: 0;    

}

.navbar-expand-md .navbar-collapse {

    display: -ms-flexbox!important;

    display: flex!important;

    -ms-flex-preferred-size: auto;

    flex-basis: auto;

    margin-top: -72px;

}

.navbar a.navbar-brand {

    margin-top: -50px;

}

.navbar ul li a:hover {

     color: #ffffff !important;

    background-image: linear-gradient(-65deg,  #770a00, #e00110);

}

.navbar-nav li a {

    font-size: 16px;

    transition: 0.4s all;

    color: #760a00 !important;

    text-transform: uppercase;

    padding: 10px 18px !important;

    font-weight: 500;

}





.nav-item > .nav-link.active {

      color: #fff;

    background: linear-gradient(-65deg,  #770a00, #e00110); 

}

.dropdown-toggle::after {

    display: none;

}

 .navbar-brand {padding: 0;height: auto;}

.navbar-toggler-icon i {

    color: transparent;

}

.navbar-brand{

color: #ed864c;

    font-weight: 600;

    text-transform: uppercase;

}

/*.navbox ul li.nav-item{

    padding-right: 42px;

}

.navbox ul li.nav-item:last-child{

    padding-right:0;

}

.navbox ul li.nav-item a:hover{

    background-image: linear-gradient(-65deg,  #770a00, #e00110);

    color: #fff !important;

    padding: 10px 20px;

}*/

li.nav-item {

    padding-top: 14px;

}

.btn {

    display: inline-block;

    font-weight: 400;

    text-align: center;

    white-space: nowrap;

    vertical-align: middle;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    border: 1px solid transparent;

    margin-top: -16px;

    font-size: 1rem;

    line-height: 1.5;

    border-radius: .25rem;

    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;

}

.carousel-inner img {

      width: 100%;

      height: 100%;

  }

.bannerarea {

    width: 100%;

    position: relative;

    top: -77px;

}

.bannertext {

    position: absolute;

    color: #fff;

    text-align: center;    

    bottom: 3px;

    right: 180px;

}

.bannertext a{

    color: #fff;

}

.bannertext h4{

    font-family: 'Raleway', sans-serif;

    font-size: 32px;

    font-weight: 700;

}

.bannertext1 {

    position: absolute;

    color: #bb1100;    

    bottom: 228px;    

    /*right: 180px;*/

}

.bannertext1 h4{

    font-size: 36px;  

    font-family: 'Raleway', sans-serif; 

    font-weight: 900;

}

.offerarea{

    width: 100%;

    /*margin-top:10px;*/

}

.grbg{   

    background-image: radial-gradient( #fec500, #ed7500);

}

.grbg img{

    clip-path: polygon(0 0, 83% 0, 100% 100%, 0% 100%);

}

/*.grbg2{

    float: right;

    padding: 24px 20px 0 0;

    text-align: center;

}*/

.grbg2{

   

    text-align: center;

}

.grbg2 h5 {

    border: 1px solid #bb1000;

    text-align: center;

    padding: 4px 11px;

    color: #bb1000;

    font-size: 32px;

    margin-top: 3px;

}

.grbg2 p {

    font-size: 16px;

    color: #2d2d2d;

    margin-bottom: 4px;

    font-family: 'Raleway', sans-serif;

}

.grbg2 h4 {

    font-size: 16px;

    color: #bb1000;

    font-family: 'Raleway', sans-serif;

}

.grbg2 h5 span{

    font-size: 18px;

}

.btn1 {

    font-size: 16px;

    color: #fff;

    font-family: 'Raleway', sans-serif;

    font-weight: 600;

    display: inline-block;

    padding: 9px 20px;

    background-image: linear-gradient(-65deg, #770a00, #e00110);

}

.btn1 a{

    color: #fff;

    /*background-image: linear-gradient(-65deg, #e00110, #770a00);*/

}

.grbg1{   

    background-image: radial-gradient( #fec500, #ed7500);

}

.grbg1 img{

    float: right;

    clip-path: polygon(17% 0, 100% 0, 100% 100%, 0% 100%);

}

.grbg3{

    float: left;

    margin-top: -265px;

    padding: 7px 20px 0 0;

    text-align: center;

}

.grbg3 h5 {

    border: 1px solid #bb1000;

    text-align: center;

    padding: 0 11px 4px 11px;

    color: #bb1000;

    font-size: 32px;

    clear: both;

}

.grbg3 h5 span{

    font-size: 18px;

}

.grbg3 p {

    font-size: 16px;

    color: #2d2d2d;

    margin-bottom: 4px;

    font-family: 'Raleway', sans-serif;

}

.grbg3 h4 {

    font-size: 16px;

    color: #bb1000;

    font-family: 'Raleway', sans-serif;

}

.box{

  background: url(../images/atta.jpg)no-repeat center;

  background-size: cover;



}

.title {

    position: relative;

    width: 40%;

    padding: 10px 20px 10px 10px;

    font-size: 20px;

    position: relative;

    color: #FFF;

     background: #ef7e00;

     background-size: cover;

    /*background-image: radial-gradient( #fec500, #ed7500);*/

    z-index: 9;

        min-height: 278px;

}

.title:after {

    content: " ";

    position: absolute;

    display: block;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    z-index: -1;

    background-image: radial-gradient( #fec500, #ed7500);

    transform-origin: bottom left;

    -ms-transform: skew(-30deg, 0deg);

    -webkit-transform: skew(-30deg, 0deg);

    transform: skew(-20deg, 0deg);

}

.box1 {

    background: url(../images/besan.jpg)no-repeat center;

    background-size: cover;

    display: flow-root;

}

.title1 {

    position: relative;

    width: 40%;

    padding: 10px 20px 10px 10px;

    font-size: 20px;

    float: right;

    position: relative;

    color: #FFF;

     background: #ef7e00;

     background-size: cover;

    /*background-image: radial-gradient( #fec500, #ed7500);*/

    z-index: 9;

        min-height: 278px;

}

.title1:after {

    content: " ";

    position: absolute;

    display: block;

    width: 100%;

    height: 100%;

    top: 0;

    right: 0;

    z-index: -1;

    background-image: radial-gradient( #fec500, #ed7500);

    transform-origin: bottom left;

    -ms-transform: skew(30deg, 0deg);

    -webkit-transform: skew(20deg, 0deg);

    transform: skew(20deg, 0deg);

}

.productarea{

    width: 100%;

    padding: 30px 0;

    text-align: center;

}

.productarea h3{

    font-size: 36px;

    font-weight: 900;

    font-family: 'Century Gothic';

    /*font-family: 'Didact Gothic', sans-serif;*/

    color: #bb1000;

}

.productarea .btn1{

    margin-top: 20px;

}
.link-a {
    padding-top: 13px;
}

.servarea{

    padding-top: 30px;

}

.imagebox{

    background: #f6f6f6;

    padding: 35px 10px 20px 10px;

    box-shadow: 5px 5px 10px #d4d4d4;

}

.imagebox h5{

    font-size: 20px;

    font-family: 'Raleway', sans-serif;

    font-weight: 400;

}

.imagebox h2{

    font-family: 'Raleway', sans-serif;

    font-weight: 700;

    color: #bb1000;

}

.imagebox p{

    font-family: 'Roboto', sans-serif;

    font-size: 16px;

    font-weight: 700;

}

.overlay {

     position: absolute;

    bottom: 0;

    background: rgb(0, 0, 0);

    background: rgba(187, 16, 0, 0.75);

    color: #f1f1f1;

    width: 100%;

    transition: .5s ease;

    opacity: 0;

    color: white;

    font-size: 20px;

    margin-left: -10px;

    padding: 20px 0;

    text-align: center;

}

.imagebox:hover .overlay {

  opacity: 1;

}

a.crPrev {

    float: left;

    color: #bb1000;

}

  a.crNext {

    float: right;

    color: #bb1000;

}



.imagebox1{

    background: #f6f6f6;

    padding: 35px 10px 20px 10px;

    box-shadow: 5px 5px 10px #d4d4d4;

}

.imagebox1 h5{

    font-size: 20px;

    font-family: 'Raleway', sans-serif;

    font-weight: 400;

}

.imagebox1 h2{

    font-family: 'Raleway', sans-serif;

    font-weight: 700;

    color: #bb1000;

}

.imagebox1 p{

    font-family: 'Roboto', sans-serif;

    font-size: 16px;

    font-weight: 700;

}

.overlay1 {

    position: absolute;

    bottom: 0;

    background: rgb(0, 0, 0);

    background: rgba(187, 16, 0, 0.75);

    color: #f1f1f1;

    width: 92%;

    transition: .5s ease;

    opacity: 0;

    color: white;

    font-size: 20px;

    margin-left: -9px;

    padding: 20px 0;

    text-align: center;

}

.imagebox1:hover .overlay1 {

  opacity: 1;

}

.royalarea{

    width: 100%;

    background: url(../images/royal-bg.jpg) no-repeat;

    background-size: cover;

    padding: 40px 0;

    text-align: center;

}

.royalarea h3{

    color: #fff;

    font-size: 36px;

    font-weight: 900;

    font-family: 'Century Gothic';

}

.greysec{

   /* width: 100%;*/

    background-image: radial-gradient( #ffffff, #c7c7c7); 
/* height: 486px; */
    padding: 20px;

    /*margin-right: 10px;*/

}

/*.greysec:last-child{

    margin-right: 0;

}*/



.brdrwht{

    border: 1px solid #ffffff;

    padding: 40px 10px 10px 10px;

}

.topbox {

    width: 54%;

    height: 52px;

    position: absolute;

    display: inline-block;    

    left: 88px;

    top: 0;

    padding: 18px 0 5px 0;    

    font-family: 'Raleway', sans-serif;

    background-image: radial-gradient( #fec500, #ed7500);

}

.topbox:before {

    content: "";

    position: absolute;

    border: 26px solid #f18800;

    top: 0;

    left: -52px;

    border-top-color: transparent;

    border-left-color: transparent;

}

.topbox:after {

    content: "";

    position: absolute;

    border: 26px solid #f18800;

    top: 0;

    right: -52px;

    border-top-color: transparent;

    border-right-color: transparent;

}

.topbox h5{

    font-size: 19px;

    color: #fff;

}

.welcomearea{

    width: 100%;

    padding: 30px 0;

    text-align: center;

}

.welcomearea h3{

    font-size: 36px;

    color: #bb1000;

    font-weight: 900;

    font-family: 'Century Gothic';

    padding-top: 60px;

}

.contactsec{

    background-image: linear-gradient(-65deg, #770a00, #e00110);

    position: relative;

    padding: 20px;

    text-align: center;

    margin-top: 36px;

}

.topbox1 {

    width: 59%;

    height: 52px;

    position: absolute;

    display: inline-block;

    color: #fff;

    left: 108px;

    top: -26px;

    padding: 18px 0 5px 0;

    font-size: 22px;

    font-family: 'Raleway', sans-serif;

    background-image: radial-gradient( #fec500, #ed7500);

    /*box-shadow: 5px 5px 10px #d4d4d4; */

}

.topbox1:before {

    content: "";

    position: absolute;

    border: 26px solid #f18800;

    top: 0;

    left: -52px;

    border-top-color: transparent;

    border-left-color: transparent;

}

.topbox1:after {

    content: "";

    position: absolute;

    border: 26px solid #f18800;

    top: 0;

    right: -52px;

    border-top-color: transparent;

    border-right-color: transparent;

    /*box-shadow: 5px 5px 10px #d4d4d4; */

}

.formSec{

    margin: 40px;

}

.form-group {

    margin-bottom: 0.4rem;

}

.form-control {

    display: block;

    width: 100%;

    height: calc(2.25rem + 2px);

    padding: .375rem .75rem;

    font-size: 1rem;

    line-height: 1.5;

    color: #495057;

    background-color: #fff;

    background-clip: padding-box;

    border: 1px solid #ced4da;

     border-radius: 0;

    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;

}

.btn2 {

    font-size: 16px;

    color: #fff;

    margin-top: 20px;

    font-family: 'Raleway', sans-serif;

    font-weight: 600;

    display: inline-block;

    padding: 9px 20px;

    background-image: radial-gradient( #fec500, #ed7500);

    border: none;

}

.btn2 a{

    color: #fff;

    /*background-image: linear-gradient(-65deg, #e00110, #770a00);*/

}

.yellowarea{

    width: 100%;

    background-image: linear-gradient(-65deg, #ed7500, #fec500);

    padding: 30px 0 20px 0;

    color: #fff;

}

.yellowarea h5{

    font-size: 18px;

    font-family: 'Raleway', sans-serif;

    font-weight: 600;

    padding-top: 20px;

    text-transform: uppercase; 

}

.yellowarea h4{

    font-size: 16px;

    font-family: 'Raleway', sans-serif;

    font-weight: 600;

    padding-top: 20px;

    text-transform: uppercase; 

}

.yellowarea p{

    font-size: 16px;

    font-family: 'Raleway', sans-serif;

}

.footer{

    width: 100%;

    background: url(../images/footerbg.jpg) no-repeat;

    background-size: cover;

    padding: 30px 0;

    color: #fff;

}

.footer img{

    padding-bottom: 20px;

}

.footer ul li{

    font-size: 18px;

    padding-bottom: 10px;

}

.footer ul li span{

    font-size: 22px;

    color: #ea8f1a;

    padding-right: 20px;

}

.footer h4{

    margin-top: 30px;

    padding: 25px 0;

}

.footer p{

     font-family: 'Raleway', sans-serif;

     color: #fff; 

     font-size: 18px;

}

.footer p a{

    color: #fff;   

}

.footer ul.media li {

    display: inline;

    width: 46px;

    margin-right: 12px;

    color: #fff;

    font-size: 22px;

    padding: 10px;

    background-image: radial-gradient( #fec500, #ed7500);

    text-align: center;

}

.footer ul.media li a{

    color: #fff;

}

.bottom{

    width: 100%;

    border-top: 1px solid #fff;

    color: #fff;

    background: #000;

    padding: 20px 0;

    text-align: center;

}

.bottom a{

    color: #d63623;

}

.aboutsec{

    width: 100%;

    padding: 30px 0;

    text-align: center;

}

.aboutsec h4{

    font-size: 36px;  

    font-family: 'Raleway', sans-serif; 

    font-weight: 900;

    color: #bb1100;



}

.aboutsec p{

    line-height: 22px;

    user-select: none; /* supported by Chrome and Opera */

-webkit-user-select: none; /* Safari */

-khtml-user-select: none; /* Konqueror HTML */

-moz-user-select: none; /* Firefox */

-ms-user-select: none;

}

.aboutsec p span{

    padding-right: 20px;

}

.aboutsec h5{

    font-size: 24px;  

    font-family: 'Raleway', sans-serif;

    padding-top: 30px; 

    font-weight: 700;

    color: #bb1100;

}

.point{

    text-align: left;

    padding-top: 20px;

}

.brandarea{

    width: 100%;

    padding: 20px 0;

     height: 550px;



}

.brandarea a{

    color: #bb1100;

}

.brandarea h5{

    text-align: center;

    padding: 0 30px;

}

.brandarea .brands{

    padding: 30px 0 0 0;



}

.tabcon{

    padding-top: 20px;

}

 #contactForm .inputtext{

 border: 1px solid #fccc00;

}

ul.contact_us li {

    padding: 2%;

    background: #bb1100;

    margin: 2%;

    color: #fff;

    font-weight: 600;

    font-size: 19px;

    border: 2px solid #9e9797;

    /* border-radius: 32px; */

}

ul.contact_us li a{

  color: #fff;

}

ul.contact_us li i{

  padding-right: 4%;

}

.maparea{

    width: 100%;

    padding: 20px 0;

}

.prodetailarea{
    width: 100%;
    padding: 30px 0;
}
.prodetailarea h3{
    color: #770b00;
}
.prodetailarea p strong{
    color: #770b00;
}
.line{
    width: 80%;
    height: 1px;
    background: #770b00;
    margin-bottom: 20px;
}

.options{

    width: 100%;

}

.options ul li{

    display: inline-block;

    padding-left: 20px;

}



/*// Small devices (landscape phones, 576px and up)*/

@media (max-width: 991.98px) {

    .redsec {

    width: 100%;

    background: #760a00;

    padding: 11px 0 0 0px;

    color: #fff;

    text-align: center;

    font-size: 18px;

}

    .redsec:before {

    display: none;

}

.redsec:after {

    display: none;

}

.lgo {

    padding: 10px 0;

    margin-top: -1px;

    text-align: center;

}

.bannerarea {

    width: 100%;

    position: relative;

    top: -5px;

}

      .bannertext {

        bottom: 0px;

    right: 99px;

}

.bannertext h4 {

        font-size: 21px;

    }  

    .redsec:after {

    content: "";

    position: absolute;

    background: #760a00;

    width: 77px;

    top: 0;

    left: 98%;

    /* right: 0; */

    height: 20%;

}

.topbox {

    width: 54%;

    height: 52px;

    position: absolute;

    display: inline-block;

    left: 168px;

    top: 0;

    padding: 18px 0 5px 0;

    font-family: 'Raleway', sans-serif;

    background-image: radial-gradient( #fec500, #ed7500);

}

.topbox1 {

    width: 59%;

    height: 52px;

    position: absolute;

    display: inline-block;

    color: #fff;

    left: 145px;

    top: -26px;

    padding: 18px 0 5px 0;

    font-size: 22px;

    font-family: 'Raleway', sans-serif;

    background-image: radial-gradient( #fec500, #ed7500);

}

.brandarea {

    width: 100%;

    padding: 20px 0;

    height: 580px;

}

.bannertext1 {

    position: absolute;

    color: #bb1100;

    bottom: 129px;

    /* right: 180px; */

}



}



@media (max-width: 767.98px){

    .redsec {

    padding: 12px 0 0 0px;

    color: #fff;

    text-align: center;

    font-size: 18px;

}

    .lgo {

    padding: 10px 0;

    margin-top: -1px;

    text-align: center;

}

.bannerarea {

    width: 100%;

    position: relative;

    top: -5px;

}

.bannertext {

    bottom: 0px;

    right: 74px;

}

.bannertext h4 {

    font-size: 15px;

}

.grbg2 h5 {    

    font-size: 18px;   

}

.topbox {    

    left: 126px;    

}

.topbox1 {    

    left: 104px;    

}

        

}

@media (max-width: 575.98px) {

    .redsec {

    padding: 12px 0 0 5px;

    color: #fff;

    text-align: center;

    font-size: 18px;

}

    .bannertext {

    bottom: 0px;

    right: 32px;

}

.bannertext h4 {

    font-size: 8px;

}

.topbox {    

    left: 71px;    

}

.topbox1 {    

    left: 58px;    

}



 .topbox1 h5{    

    font-size: 18px;    

}  

.form-control {    

    font-size: 14px;    

} 

    

}