
.margined{
  margin-top: 40px;
  margin-bottom: 40px; 
}

.grid-6{
  display: grid;
  grid-template-columns: repeat(6, 1fr); 
  gap: 20px; 
}

.grid-5{
  display: grid;
  grid-template-columns: repeat(5, 1fr); 
  gap: 20px; 
}

.grid-4{
  display: grid;
  grid-template-columns: repeat(4, 1fr); 
  gap: 20px; 
}

.grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

.grid-gap{
  gap: 50px !important;
}
.grid-vert{
  align-items: center; 
}

.grid-swap div:first-child{
  order: 2;
}
.grid-swap div:last-child{
  order:1;
}


.span-1 {
  grid-column: span 1;
}
.span-2 {
  grid-column: span 2;
}
.span-3 {
  grid-column: span 3;
}
.span-4 {
  grid-column: span 4;
}
.span-5 {
  grid-column: span 5;
}


@media (max-width: 767px) { 


.mobile-grid-6{
  grid-template-columns: repeat(6, 1fr); 
}

.mobile-grid-5{
  grid-template-columns: repeat(5, 1fr); 
}

.mobile-grid-4{
  grid-template-columns: repeat(4, 1fr); 
}

.mobile-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}

.mobile-grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.mobile-grid-1 {
  grid-template-columns: repeat(1, 1fr);
}


.mobile-span-1 {
  grid-column: span 1;
}
.mobile-span-2 {
  grid-column: span 2;
}
.mobile-span-3 {
  grid-column: span 3;
}
.mobile-span-4 {
  grid-column: span 4;
}
.mobile-span-5 {
  grid-column: span 5;
}
.mobile-span-6 {
  grid-column: span 6;
}

.mobile-grid-tight{
  gap: 10px !important; 
}

.mobile-block{
  display:block;
  margin-left:0 !important;
}


}

.value{
  background-color:#FFF;
  border-radius: 15px;
  padding: 40px; 
}