body {
  width: 100%;
  height: 100%;
  background: url(../images/bg.png) 0 0 no-repeat;
  background-size: 100% auto;
}

html {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 62.5%; 
}

*, *::after, *::before {
  box-sizing: inherit; 
}

* {
  box-sizing: border-box;
  text-decoration: none;
  padding: 0rem;
  margin: 0rem;
  color: #333;
  font-family: 'Roboto Condensed',Arial,Helvetica,sans-serif;   
  /*font-size: 62.5%;*/
}

*:focus {
  outline: 0; 
}
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
.fa-search-glyph {
  font-size: 1.8rem!important;
  color: #fff!important;
  margin: 0px!important;
  cursor: pointer;
}
.sub-container{
  -webkit-box-shadow: 0px 0px 13px -4px rgba(150,126,150,1);
  -moz-box-shadow: 0px 0px 13px -4px rgba(150,126,150,1);
  box-shadow: 0px 0px 13px -4px rgba(150,126,150,1);
  border-radius: 5px;
  background: #fff;
  /* margin-top: 3rem; */
  padding: 20px 40px 40px 40px; 
  min-height: 35rem!important;
}
.log-user{
font-size: 14px;
margin-bottom: 5px;
}
.log-user .log-welcome {
float: left;
/* margin-left: 30px; */
font-weight: bold;
}
.log-user .log-user-name {
font-weight: bold;
color: black;
}
.log-user .log-user-ico {
float: left;
margin-left: 10px;
margin-right: 10px;
height: 21px;
width: 21px;
background-image: url(../images/user.png);
}

.nav-item {
  padding: 0 1.5rem;
}
.nav-label-menu {
  padding-bottom: 1.0rem!important;
  font-size: 1.5rem;
  transition: all 0s ease!important;
  color: #fff!important;
}
.navbar-nav li a:hover, .navbar-nav li a.active {
  border-bottom: .1rem none!important;
  text-decoration: underline;
}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {
  background-color: #00adb0!important;
}
.nav-label-grey .dropdown a {
 color: #00adb0!important; 
}
.nav-label-grey a:hover {
 color: #00adb0!important; 
}
.navbar-inverse {
  background-color: #00A2AF!important;
  border-color: #ccc!important;
}
.dropdown-menu .dropdown a {
  color: #00adb0!important;
}
.dropdown-menu .dropdown a:hover {
  color: #00adb0!important;
}
.contact-email {
  color: #FFF;
}
.contact-email:hover {
  color: #FFF;
}
.logo {
  color: #333!important;
  font-size: 2.0rem!important;
  font-weight: bold!important;
  padding-left: 0rem!important;
}
.logo:hover {
  border-bottom-style: none!important;
  text-decoration: none!important;
}
.full-width, .items .item .overlay, form .field textarea, form .field input, .form-holder button {
  width: 100%; 
}
.edit {
	background:url(../images/edit.png) no-repeat;
	background-size: 25px 25px;
	display: inline-block;
	width: 30px;
	height: 25px;
	cursor: pointer;
}

.remove {
	background: url(../images/remove.png) no-repeat;
	background-size: 25px 25px;
	display: inline-block;
	width: 30px;
	height: 25px ;
	border:none;
}
.left {
  float: left; 
}

.right {
  float: right; 
  right: 0;
}

.margin-auto, .wrapper {
  margin-left: auto;
  margin-right: auto; 
}

.wrapper {
  max-width: 100.0rem;
  padding: 0rem 1.2rem;
  overflow: hidden;
}
.slider-wrapper {
  /* max-width: 100.0rem; */
  padding: 0rem 1.2rem;
  overflow: hidden;
}
.heading-title {
  color: #292929!important;
  font-size: 3.0rem;
  font-weight: bold;
}
.sub-heading-title {
  color: #BDBDBD!important;
  font-size: 1.3rem;
  font-weight: 700;
  font-family: arial;
}
.heading {
  color: #00A2AF!important;
  font-size: 2.5rem;
  font-weight: bold;
  border-left: 6px solid #00A2AF;
  padding-left: 1.5rem;
  margin: 1rem 0;
}
.sub-heading {
  color: #00A2AF!important;
  font-size: 1.8rem;
  font-weight: 700;
  font-family: arial;
  /*margin-bottom: 5rem;*/
}
.header {
  background-color: #FFF;
  height: 10.0rem;  
  margin:0 auto;
} 

.grid-container {
  display: flex;
  /*grid-template-columns: auto auto auto;*/
  /*grid-gap: 1.0rem;*/
  background-color: #fff;
  /*padding: 1.0rem;*/
  align-items: center;
  /*box-sizing: border-box;*/
  flex-wrap: wrap;
  height:auto;
  margin: 0.5rem 0;
}
.item3 {
  margin-left: auto;
  padding-right: 1rem;
}
.item3 .glyph-icon, .item3 .glyph-icon {
  color: #fff;
  font-size: 1.8rem;
  padding-left: 1rem;
}
.header-contact-text {
  color: #b1b1b1; 
  font-size: 1.2rem!important;
} 
.table-cell {
  display: table-cell;
}
.line {
    position: relative;
}
.line:after {
    content: '';
    position: absolute;
    border-right: .1rem solid #CCC;
    top: 10%;
    bottom: 10%;
    margin: 0 1.0rem 0 1.0rem;
}
.bg1 {
  background: #3d3d3d;
}
.br30 {
  border-radius: .5rem;
}
.phone {
  font-size: 1.8rem;
  color: #FFF;
  padding: 2.0rem 2.0rem;
}
.btn-body {
  background: #00afb3;
  border-radius: .5rem;
  color: #FFF;
  padding: 0.5rem;
}
.btn-body:hover {
  cursor: pointer;
  background: #00cbcf;
}

.btn-enq {
  background: #00afb3;
  border-radius: .5rem;
  height: 4.0rem;
  /*font-size: 1.8rem;*/
  color: #FFF;
  padding-top: .7rem;
}
.btn-enq:hover {
  cursor: pointer;
  background: #00cbcf;
}
.footer-grid {
  background: #3D3D3D!important;
  display: flex;
  flex-wrap: wrap;
  /*align-items: center;*/
  /*height: clamp(10rem, 18rem, 35rem);*/
  /*width: 100vw;
  box-sizing:border-box;*/
  padding: 1rem 0 ;

}
.grid3 {
  flex: 1.5;
}
.grid4 {
  flex: 1;
}
.grid1 {
  /*margin-left: auto;*/
  flex:1.5;
  /*padding-right: 1rem;*/
}
.grid2 {
  flex: 1.5;
}
.lh50 {
  line-height: 10rem;
}
.map-icon {
  font-size: 3rem; 
  color: #00cbcf;  
  margin-right: 1rem;
}
.glyph-icon {
  font-size: 2.5rem;
  color:#00cbcf; 
  margin:0rem -1.5rem 0rem 0.5rem;
}
.glyphicon-phone {
  font-size: 2.5rem;
  color:#00cbcf; 
}
.grid-title {
  font-size: 2.5rem; 
  color: #fff;
}
.grid-subtitle {
  font-size: 2rem; 
  line-height:4rem;
  color: #fff;
}
.grid-details {
  font-size: 14px;
  color: #fff;
}
.footer-container {
  left:0rem;
  bottom:0rem;
  font-size: 1.2rem;  
  padding: .5rem 0 0rem 0!important;
  width:100%;
  height:3.0rem;
  background:#E9E9E9;
}
.footer-container-text {
  text-align: center;
  font-size: 1.2rem;
}
.height20{
  height: 2.0rem;
}
.height40{
  height: 4.0rem;
}
.paragraph {
  margin-bottom: 1.0rem;
  word-break: keep-all!important;
  /* word-wrap: break-word; */
  font-size: 1.2rem;
  word-break: break-all;
}
.word-wrap {
  word-break: break-all;
}
.relative {
  position: relative
}
.white {
  color: #fff;
}
.blackish {
  color: #333;
}
.container .paragraph ul li {
  display: list-item;          /* This has to be "list-item"                                               */
  list-style-type: disc;       /* See https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type     */
  list-style-position: inside;
}
.caret {
  color: #fff;
}
.alert{
  padding: 0.5rem!important;
}
.required-field {
  color: #FF0000;
  font-size: 1.4rem;
  padding-top: .3rem;
}
.bold {
  font-weight: bold;
}

hr.style1{
  height: 1.0rem;
  border: 0;
  box-shadow: 0 1.0rem 1.0rem -1.0rem #8c8b8b inset;
}

/*Image  gallery list CSS Start*/
.responsive {
  padding: 0 .6rem;
  float: left;
  width: 19.5555%;
  margin: 1.0rem 0;
}
div.gallery {
  margin-top: 1rem;
  padding: 1.0rem;
  
  border-radius: .5rem;
  box-shadow: 0 .4rem .8rem 0 rgba(0, 0, 0, 0.2), 0 .6rem 2.0rem 0 rgba(0, 0, 0, 0.2);
}

div.gallery:hover {
  box-shadow: 0 .4rem .8rem 0 rgba(0, 0, 0, 0.3), 0 .6rem 2.0rem 0 rgba(0, 0, 0, 0.4);
}

div.gallery img {
  width: 100%;
  height: auto;
}

.slider_desc {
  font-size: 1.4rem;
}
.align_middle {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-height: 50px;
}
.cell2 {
  margin-left: auto;
}
.owl-item {
  margin-bottom: 2rem!important;
}
.owl-theme .owl-nav {
  display: none;
}
.owl-carousel a, .item.gallery:hover, div.slider_desc:hover {
  /* background: #00cbcf; */
  text-decoration: none!important;
}
div.prod-details {
  padding: 0.2rem;
  text-align: center;
  font-size: 1rem;
  white-space: nowrap; 
  width: 175px; 
  overflow: hidden;
  text-overflow: ellipsis; 
}
div.desc {
  padding: 0.2rem;
  text-align: center;
  background: #00A2AF;
  color: #fff;
  font-size: 1.1rem;
}

.responsive a, div.gallery:hover div.desc, div.desc:hover { 
  background: #00cbcf;
  text-decoration: none!important;
}

.slider-text-section{
  width: 100%;
  position: absolute;
  /* right: -35%; */
  top:1%;
  z-index: 1;
}
.slider-text-section .slider-wrapper{
  font-size: 2.4rem;
  width: 100%;
  color: #FFFF00;
  z-index: 1;
  letter-spacing: 2px;
  font-family: 'Vollkorn', serif;
}
.slider-text-section .slider-wrapper div{
  /* max-width: 100%; */
  min-width: 300px;
  font:inherit;
  color: inherit;
  text-align: left;
  padding-left: 40%;
}


@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: .6rem 0;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}
/*Image  gallery list CSS*/


/* datatable oveload */
table.dataTable thead th, table.dataTable thead td{
  border-bottom: 0rem;
}
table.dataTable.no-footer {
    border-color: #ddd;
}
table.dataTable{
  width: 99.98% !important;
}
.data-table{
  border-collapse: collapse !important;
}
.data-table thead tr{
  background-color: #eaeaea;
}
.data-table tbody tr:nth-child(even) td, .inner_table tr:nth-child(even) td {
    background-color:  #f1f8fc;
    border-top: 0rem;
    border-bottom: 0rem;
}
.data-table tbody tr:nth-child(odd) td, .inner_table tr:nth-child(odd) td {
    background-color:#fff;
    border-top: 0rem;
    border-bottom: 0rem;
}
#entryListTable_previous, #customerListTable_previous{
  background: url("../images/page_back.png") no-repeat;
  width: 2.4rem;
  height:2.4rem;
  text-indent:-999.9rem;
  cursor: pointer;
  border: 0rem;
}
#entryListTable_next, #customerListTable_next{
  background: url("../images/page_next.png") no-repeat;
  width: 2.4rem;
  height:2.4rem;
  text-indent:-999.9rem;
  cursor: pointer;
  border: 0rem;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
  background: #34BA32;
}

.dataTables_wrapper .dataTables_paginate .paginate_button{
  padding: .1rem .5rem;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
  background-color: #ccc!important;
}

/*End of data table css */


/* Bootstrap button css override */
.btn-primary {
  color: #fff!important;
  background-color: #00afb3!important;
  border-color: #00afb3!important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: #00cbcf!important;
  border-color: #00cbcf!important;
}
.filter-row {
  margin-bottom: 1.5rem;
  margin-top: 1.5rem;
}
.filter-row select, .filter-row input {
  display: inline-block;
  /*margin-left: 10rem;*/
  /*min-width: 150rem;*/
  /*width: auto;*/
  max-width: 100%;
}
.bs-searchbox {
  width: 90%!important;  
}
.enquiry_button {
  cursor: pointer;
  display: block;;
}
/*Date picker*/
.calendar-icon{
  background: url(../images/datepicker.png) no-repeat;
  width:1.5rem;
  height:1.6rem;
}
.date-picker input{
  border-right: 0rem;
}
.date-picker .input-group-addon{
  background-color: #fff;
}
.name_container{
  max-height: 10.0rem;
  overflow-y: auto;
  border: .2rem solid #eee;
}
.name_container_heading, .name_container div {
  padding-left: .5rem;
}
.name_container label {
  font-weight: normal;
}

.table-responsive a {
  color: #333;
  text-decoration: underline;
}

.btnSearchEntry {
    margin-top: 2.5rem!important;
}
.container-relative {
  position: relative;
}
.vertical-center {
  display: grid;
  place-items: center;
}
.vertical-bottom {
  display: grid;
  place-items: bottom;
}

.navbar-inverse .navbar-toggle{
  border-color: #ccc!important;
}

/* .modal:nth-of-type(even) {
  z-index: 1052 !important;
}
.modal-backdrop.show:nth-of-type(even) {
  z-index: 1051 !important;
} */
/* .connected-carousels .carousel-stage {
  height: auto!important;
  min-height: 700px!important;
} */
.slider_img_stage {
  /* width: 45rem!important; */
  max-height: 80rem!important;
}
.slider_img {
  width: 6rem!important;
  height: 4rem!important;
}
.edit_slider_img {
  border: 1px solid grey;
  padding:2px;
}
.image-area {
  width: 7rem!important;
  height: 6rem!important;
  position: relative;
  display: inline-block;
  margin-right: 2rem;
}
.image-area img{
  max-width: 100%;
  height: auto;
}
.remove-image {
  display: none;
  position: absolute;
  top: -10px;
  right: -10px;
  border-radius: 10em;
  padding: 2px 6px 3px;
  text-decoration: none;
  font: 700 16px/15px sans-serif;
  background: #555;
  border: 3px solid #fff;
  color: #FFF;
  box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 2px 4px rgba(0,0,0,0.3);
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    -webkit-transition: background 0.5s;
    transition: background 0.5s;
  }
  .remove-image:hover {
    background: #E54E4E;
    padding: 3px 7px 5px;
    top: -11px;
    right: -11px; 
    text-decoration: none;
  }
  .remove-image:active {
   background: #E54E4E;
    top: -10px;
  right: -11px;
  }

.photo-credits {
  bottom: unset!important;
  z-index: 10;
  padding-top: 5px;
}
.gallery_quote {
  font-size: 2.5rem;
}
/* .modal-backdrop {
  display: none!important;
}

.modal {
  background: rgba(0, 0, 0, 0.5)!important;
} */


/* .modal-backdrop + .modal-backdrop {
  z-index: 1040!important;
}
.modal + .modal {
  z-index: 1050!important;
} */
.connected-carousels .prev-stage, .connected-carousels .next-stage {
  height: 35rem!important;
}

@media all and (max-height: 500px) {
    .social-nav{ 
      margin-top:16rem;
    }
}

@media all and (min-width: 1200px) {
  .responsive {
    width: 19.999%;
    margin: .4rem 0;
  }
  /* div.prod-details {
    width: 185px;
  } */
}
  
@media all and (min-width: 736px) and (max-width: 1200px) {
  *, html {
    font-size:1vw;
  }
  .item3 {
    /* margin-left: 0; */
    padding-left: 1rem;
  }
  .slider-text-section .slider-wrapper {
    font-size: 1.8rem;
  }  
  .responsive {
    width: 24.9933%;
    margin: .4rem 0;
  }
  div.prod-details {
    width: 185px;
  }
}
@media all and (max-width: 999px) {
  div.prod-details {
    width: 130px;
  }
}
@media all and (max-width: 735px) {
  *, html {
    font-size:1.5vw;
  }
  .item3 {
    /* margin-left: 0; */
    padding-left: 1rem;
  }  
  .grid3, .grid4 {
    flex: 1;
  }  
  .grid1, .grid2 {
    flex: 4;
  }  
  .grid-title {
    font-size: 1.8rem;
  }
  .grid-subtitle, .grid-details {
    font-size: 1.2rem;
  }
  .slider-text-section .slider-wrapper {
    font-size: 1.4rem;
  }
  .responsive {
    width: 33.33%;
    margin: .4rem 0;
  }
  div.prod-details {
    width: 125px;
  }
}
@media all and (max-width: 525px) {  
  *, html {
    font-size:2vw;
  }
  .item2, .item3 {
    margin-left: 0;
    padding-left: 1rem;
  }
  .grid1, .grid2 {
    flex-grow: 12;
    padding-left: 1.5rem;
  }  
  .grid-title {
    font-size: 1.5rem;
  }
  .grid-subtitle, .grid-details {
    font-size: 1rem;
  }
  .slider-text-section .slider-wrapper {
    font-size: 1.2rem;
  }  
  div.prod-details {
    width: 100px;
  }
}

@media all and (max-width: 375px) {  
  *, html {
    font-size:2vw;
  }
  .item2, .item3 {
    margin-left: 0;
    padding-left: 1rem;
  }
  .line {
    position: none;
  }
  .line:after {
      border-right: 0rem solid #CCC;
  }
  .grid1, .grid2 {
    flex-grow: 12;
    padding-left: 1.5rem;
  }  
  .grid-title {
    font-size: 1.5rem;
  }
  .grid-subtitle, .grid-details {
    font-size: 1.2rem;
  }
  div.prod-details {
    width: 80px;
  }
}

@media all and (max-width: 275px) {  
  div.prod-details {
    width: 60px;
  }
}

.info-area {
  position: relative;
  display: inline-block;
  margin: 1rem 5rem 0 0;
  /* border: 1px solid #000; */
  padding: 2px;
  background: #cecece;
  height: 2.2rem;
}

.prod-info {
  display: block;
  width: 180px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.remove-info {
  display: none;
  position: absolute;
  top: -10px;
  right: -25px;
  border-radius: 10em;
  padding: 2px 6px 3px;
  text-decoration: none;
  font: 700 16px/15px sans-serif;
  background: #555;
  border: 3px solid #fff;
  color: #FFF;
  box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 2px 4px rgba(0,0,0,0.3);
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    -webkit-transition: background 0.5s;
    transition: background 0.5s;
  }
  .remove-info:hover {
    background: #E54E4E;
    text-decoration: none;
  }
  .remove-info:active {
   background: #E54E4E;
  }

  /* .overlay-loading {
    background: #e9e9e9; 
    position: absolute; 
    top: 0;             
    right: 0;           
    bottom: 0;
    left: 0;
    opacity: 0.5;
  }
  .loader {
    background-color: rgba(255,255,255,0.1);
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 60px;
    height: 60px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    margin:auto;
    left:0;
    right:0;
    top:-100px;
    bottom:0;
    position:fixed;
    display: none;
    z-index: 999999;
  }
  
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  } */

.loader {
    position:fixed;
    width:100%;
    left:0;right:0;top:0;bottom:0;
    background-color: rgba(255,255,255,0.7);
    z-index:9999;
    display:none;  
}

@-webkit-keyframes spin {
	from {-webkit-transform:rotate(0deg);}
	to {-webkit-transform:rotate(360deg);}
}

@keyframes spin {
	from {transform:rotate(0deg);}
	to {transform:rotate(360deg);}
}

.loader::after {
    content:'';
    display:block;
    position:absolute;
    left:48%;top:40%;
    width:40px;height:40px;
    border-style:solid;
    border-color:black;
    border-top-color:transparent;
    border-width: 4px;
    border-radius:50%;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite;
}
.no_product {
  vertical-align:middle;line-height: 100px;text-align:center;background-color:#fff;font-size:16px
}

/* The dots/bullets/indicators */
.owl-dots {
  /* transition: all 0.5s ease-out; */
  /* transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
  transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); */
}
.owl-dot {
  /* transition: background-color 0.6s ease!important; */
  /* transition: all 0.9s ease!important; */
  /* float: left; */
}

.owl-carousel .owl-item img {
  max-height: 625px!important;
  /* max-width: 100%!important;
  width: auto!important; */
}