/* Mobile Potrait */
@media only screen and (max-width: 600px) {
  .BBwebdesign {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBwebdesign .card{
     border-radius:0px;
  }
  .BBwebdesign h1{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:18px;
      color: #3A3A3A;
      font-style: italic;
  }
   .BBwebdesign h2{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:14px;
      color: #3A3A3A;
  }
  .BBwebdesign p{
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      font-size:12px;
      color: #3A3A3A;
  }
  .BBwebdesign span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBviewimage{
    background-color: #5ca038;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color: #fff;
    border: 2px solid #5c9f38;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBviewimage:hover{
    background-color: #3A3A3A;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color: #fff;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBlivepreview{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color:#3A3A3A!important;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
    
  }
  .BBlivepreview:hover{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color:#5ca038!important;
    border: 2px solid #5ca038!important;
    border-radius: 4px;
    text-decoration:none;
  }
  #BCWebdesignModal i {
    font-size: 22px;
    color: #fff;
}

  #BCWebdesignModal .BBcarouselicon i {
    font-size: 22px;
    color: #000;
}
  
}
/* Mobile Landscape */
@media (max-width: 767px) {
  .BBwebdesign {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBwebdesign .card{
    border-radius:0px;
 }
  .BBwebdesign h1{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:18px;
      color: #3A3A3A;
      font-style: italic;
  }
   .BBwebdesign h2{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:14px;
      color: #3A3A3A;
  }
  .BBwebdesign p{
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      font-size:12px;
      color: #3A3A3A;
  }
  .BBwebdesign span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBviewimage{
    background-color: #5ca038;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color: #fff;
    border: 2px solid #5c9f38;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBviewimage:hover{
    background-color: #3A3A3A;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color: #fff;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBlivepreview{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color:#3A3A3A!important;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
    
  }
  .BBlivepreview:hover{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:12px;
    color:#5ca038!important;
    border: 2px solid #5ca038!important;
    border-radius: 4px;
    text-decoration:none;
  }
  #BCWebdesignModal i {
    font-size: 24px;
    color: #fff;
}

  #BCWebdesignModal .BBcarouselicon i {
    font-size: 24px;
    color: #000;
}

}
/* Ipad Potrait */
@media only screen and (min-width: 768px) {
  .BBwebdesign {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBwebdesign .card{
    border-radius:0px;
 }
  .BBwebdesign h1{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:18px;
      color: #3A3A3A;
      font-style: italic;
  }
   .BBwebdesign h2{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:14px;
      color: #3A3A3A;
  }
  .BBwebdesign p{
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      font-size:12px;
      color: #3A3A3A;
  }
  .BBwebdesign span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:12px;
    color: #3A3A3A;
  }
  .BBviewimage{
    background-color: #5ca038;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:9px;
    color: #fff;
    border: 2px solid #5c9f38;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBviewimage:hover{
    background-color: #3A3A3A;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:9px;
    color: #fff;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBlivepreview{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:9px;
    color:#3A3A3A!important;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
    
  }
  .BBlivepreview:hover{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:9px;
    color:#5ca038!important;
    border: 2px solid #5ca038!important;
    border-radius: 4px;
    text-decoration:none;
  }
  #BCWebdesignModal i {
    font-size: 24px;
    color: #fff;
}

  #BCWebdesignModal .BBcarouselicon i {
    font-size: 24px;
    color: #000;
}
}
/* Ipad Landscape */
@media only screen and (min-width: 992px) {
  .BBwebdesign {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:14px;
    color: #3A3A3A;
  }
  .BBwebdesign .card{
    border-radius:0px;
 }
  .BBwebdesign h1{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:24px;
      color: #3A3A3A;
      font-style: italic;
  }
   .BBwebdesign h2{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:16px;
      color: #3A3A3A;
  }
  .BBwebdesign p{
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      font-size:14px;
      color: #3A3A3A;
  }
  .BBwebdesign span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:14px;
    color: #3A3A3A;
  }
  .BBviewimage{
    background-color: #5ca038;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color: #fff;
    border: 2px solid #5c9f38;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBviewimage:hover{
    background-color: #3A3A3A;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color: #fff;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBlivepreview{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color:#3A3A3A!important;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
    
  }
  .BBlivepreview:hover{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color:#5ca038!important;
    border: 2px solid #5ca038!important;
    border-radius: 4px;
    text-decoration:none;
  }
  #BCWebdesignModal i {
    font-size: 24px;
    color: #fff;
}

  #BCWebdesignModal .BBcarouselicon i {
    font-size: 24px;
    color: #000;
}
}
/* Desktop and Laptop */
@media only screen and (min-width: 1200px) {
  .BBwebdesign {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:14px;
    color: #3A3A3A;
  }
  .BBwebdesign .card{
    border-radius:0px;
 }
  .BBwebdesign h1{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:24px;
      color: #3A3A3A;
      font-style: italic;
  }
   .BBwebdesign h2{
      font-family: 'Open Sans', sans-serif;
      font-weight: 600;
      font-size:16px;
      color: #3A3A3A;
  }
  .BBwebdesign p{
      font-family: 'Open Sans', sans-serif;
      font-weight: 400;
      font-size:14px;
      color: #3A3A3A;
  }
  .BBwebdesign span {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size:14px;
    color: #3A3A3A;
  }
 .BBviewimage{
    background-color: #5ca038;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color: #fff;
    border: 2px solid #5c9f38;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBviewimage:hover{
    background-color: #3A3A3A;  
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color: #fff;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBlivepreview{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color:#3A3A3A!important;
    border: 2px solid #3A3A3A;
    border-radius: 4px;
    text-decoration:none;
    
  }
  .BBlivepreview:hover{
    background-color:#fff!important;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size:14px;
    color:#5ca038!important;
    border: 2px solid #5ca038!important;
    border-radius: 4px;
    text-decoration:none;
  }
  .BBwebdesign #BCWebdesigncarousel{
    text-decoration:none!important;
    background-color:none!important;
  }
  #BCWebdesignModal i {
    font-size: 27px;
    color: #fff;
}

  #BCWebdesignModal .BBcarouselicon i {
    font-size: 27px;
    color: #000;
}
}


@media only screen and (max-width: 767px) {
.grid-item {
  width: 100% !important;
}
}

@media screen and (min-device-width: 768px) and (max-device-width: 991px) {
  .grid-item {
    width: 50% !important;
  }
}