a:hover {
color: var(--renovo-green);
}
.bg-renovo {
  background-color: var(--white) !important;
}
.bg-renovo-pale {
  background-color: var(--renovo-pale) !important;
}
div.todger {
  width: 35px;
  height: 5px;
  background-color: blue;
  margin: 6px 0;
}
.cart-image {
padding-left: 1rem;
padding-top: 0.2rem;
}
.pad {
width: 96%;
padding-left: 1rem;
padding-right: 1rem;
}
h4 {font-size: 1.2rem;}
.alert-renovo {background-color: #B5FF95;}
.img-bdr-cnt {
	border: 1px solid #000000;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.container {
  width: 1200px;
  padding: 0;
  margin-right: auto;
  margin-left: auto;
}
.container-fluid {
  width: 100%;
  padding-right: 0;
  padding-left: 0;
  margin-right: auto;
  margin-left: auto;
}
.row {
  margin-right: 0;
  margin-left: 0;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  padding-right: 0;
  padding-left: 0;
}
.marine {font-size: 1rem; color: blue;}
.marine a {color: #0000ff;}
.grid-container {
  display: grid;
  grid-gap: 10px;
}
.grid-item {
  padding: 10px 20px 0px 20px;
}
.item1 {
    grid-column: 1 / span 2;
    grid-row: 1;
    margin: 0.1rem 3rem 0.5rem;
}
.item2 {
  grid-column: 3;
  grid-row: 1;
  margin: 0.1rem 1.8rem 0.5rem 1.5rem;
  padding-left: 2rem;
  padding-right: 2rem;
  background: var(--renovo-pale);
  font-size: 1.2rem;
}
li a:hover {
color: var(--black);
}

.flex-container {
align-content:  center;
flex-direction: row;
	display: flex;
	justify-content: space-between;
	background-color: #EFEFEF;
}
.flex-container > div {
  margin: 10px;
  text-align: left;
}
#f1 {
width: 30%;
padding-top: 0.5rem;
}
#f2 {
width: 30%;
padding-top: 0.5rem;
text-align: center;
}
.f3 {text-align: center !important; width: 30%; padding-top: 0.5rem;}
.social {text-align: left;}
.renovo-marine {text-align: right;}
.copyright {font-size: 0.7rem; text-align: center !important;}
.copyright-cart {font-size: 0.7rem; text-align: center!important; padding-top: 1rem;}

a { color: #000;}
.brands {padding-top: 15px; padding-bottom: 15px;}
.brands-cart {padding-top: 15px; padding-bottom: 0;}

.cart-quant, .cart-quant a, .cart-quant a:hover {font-size: 1.1rem; font-weight: 600; color: var(--renovo-green);}
.setwidth, .setwidth a:hover {text-decoration: none;}

.w-80px {width: 80px;}
.w-150px {
  width: 150px!important;
}

.bold {
  font-weight: 700 !important;
}
.half-bold {
  font-weight: 600 !important;
}
.btn-renovo {
  color: #fff;
  background-color: var(--renovo-green);
  border-color: #579702;
}


.btn-renovo:hover {
  color: #fff;
  background-color: var(--renovo-green);
  border-color: #579702;
}
.btn-renovo:focus, .btn-renovo.focus {
  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}
.custom-select:focus {
  border-color: var(--renovo-green);
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(87,151,2,0.15);
}

.kd-hover:hover, .kd-hover:active, kd-hover.active {
  background-color: var(--renovo-green) !important;
  text-decoration-style: double;
}
.card {
  background-clip: border-box;
  border: none;
}
#buy.btn {margin-top: 2rem;}
#secondname {display: none;}

.clear {
    clear: both;
}
.clearhead {
    margin: 0;
    padding: 0.5rem;
    clear: both;
    background-color: var(--renovo-green) !important;
}
.middleimg {
    padding-top: 0;
    padding-left: 3px;
    padding-right: 3px;
}
.navbar {
padding: 0;
}
.spread {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}

.dropdown:hover > .dropdown-menu {
    display: block;
}
.dropdown > .dropdown-toggle:active {
    pointer-events: none;
}
.navbar-nav .nav-link {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    width: 100%;
    text-align: right;
}
a.nav-link {
display: block;
padding: 10px 14px;
}
.dropdown-menu {
margin: 0;
font-size: 1.1rem;
font-weight: 500; 
}
h1, h2 {
color: var(--renovo-green);
}
#home {
    color: #fff;
}
.nav-t {font-size: 1.1rem; font-weight: 500; padding-bottom: 0 !important;}
/***********************************************/
/************************Mobile*****************/

@media (max-width: 1000px) {
.bg-renovo {
  background-color: var(--renovo-green) !important;
}
.container {
    max-width: 100%;
  }
h1 {font-size: 2rem;
}
.nav-link, a.nav-link {
float: right;
/*margin-right: 1rem;*/
color: white;
background: var(--renovo-green);
}
.mobile {display:none;}
.spread {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    padding: 0;
    margin: 0;
    list-style: none;
}
li a:hover {
color: var(--white);
}
}

@media only screen and (max-width: 1000px) {
#buy.btn { margin: 1rem; float: right; }
label {
  margin-top: 0.2rem;
}
}

@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}
@media only screen and (max-width: 1200px){
}
@media only screen and (max-width: 1000px){
.order {
order: -1;
width: 100%;
}
}

@media only screen and (max-width: 1000px) and (min-width: 750px)  {
h1 {font-size: 1.9rem;}
h2 {font-size: 1.5rem;}
}

@media (min-width: 1000px) {
.desktop {display: none;}
.container {
    max-width: 100%;
  }
}

@media (max-width: 820px) {
.item1 {
  grid-column: 1;
  grid-row: 1;
  margin-left: 1rem;
  margin-right: 1rem;
}
.item2 {
  grid-column: 1;
  grid-row: 2;
  text-align: center;
}
h1 {font-size: 1.7rem;}
h2 {font-size: 1.3rem;}
h3 {font-size: 1.2rem;}
h4 {font-size: 1.1rem;}
#carriage {
font-size: 0.8rem;
}
}

@media (min-width: 768px) {
  .container {
    max-width: 100%;
  }
}

@media (max-width: 768px) {
.hide {display: none;}
#carriage {
font-size: 0.7rem;
}
.social {text-align: center;}
.renovo-marine {text-align: center;}
#f1 {width: 100%; padding-top: 0; text-align: center;}
#f2 {width: 100%; padding-top: 0;}
.f3 {width: 100%; padding-top: 0;}
.nav {
flex-direction: column;
text-align: end;
}
}

@media (max-width: 640px) {
#f1 {text-align: center; margin-bottom: 0;}
#f2 {padding-top: 0;}
#f2 h4 {padding-top: 0;}

}
@media (min-width: 576px) {
.container {
    max-width: 100%;
  }
}
@media screen and (max-width: 380px) {
h1 {font-size: 1.3rem; padding-left: 2rem; padding-right: 2rem; padding-top: 0.3rem;}


h2 {font-size: 1.2rem;}
 .container {
    max-width: 100%;
  }
}