﻿
.bannerrow-public {
        margin-right: 0px;
        margin-left: 0px;
        width:100%;
        height:auto;
        padding-top: 133px;
    }

.bannerrow-public img{
        width:100%;
        height:auto;
        
    }

.bannerrow-public {
        margin-right: 0px;
        margin-left: 0px;
        width:100%;
        height:auto;
        padding-top: 0px;
    }



.swal2-popup .swal2-content .page.topic-page {
      padding:6px;
      margin-top:-30px;
    }


.swal2-popup .swal2-content .page.topic-page p {
     font-size:15px;
    }


.swal2-popup .swal2-content .bannerrow-public {
      display:none;
    }


.bannerrow-Menu {
        margin-right: 0px;
        margin-left: 0px;
        width:100%;
        height:auto;
        overflow:hidden !important;
        padding-top: 0px !important;
    }

/*.bannerrow-carousel .banertitle {
        margin-left: 100px;
        margin-right: auto;
       

    }*/


.slick-track {
  display: flex;
}
.bannerrow-carousel .banertitle{
  display: flex;
  height: auto;
  align-items: center;
  justify-content: center;
  direction:rtl;
}


.banertitle{margin:10px;color:#000;font-weight:600;text-align:center !important; text-decoration:none; font-size: 25px;color: #1a171b;line-height: 50px;}
.menubanertitle{font-size:16px;margin:10px;color:#000;font-weight:600;text-align:center !important; text-decoration:none;}

.slick-slide{
  background-color: transparent;
   overflow: hidden !important;
   margin-right:7px;
   margin-left:7px;
}


   .bannerrow-carousel{margin:0px auto;overflow-x:hidden;}

    .bannerrow-carousel > *:not(:first-child) {
        display: none;
    }

    .bannerrow-carousel.slick-initialized  > *:not(:first-child){
        display: inherit;
      
    }

    .bannerrow-carousel img {
        margin-left: auto;
        margin-right: auto;
    }


    /*inspired from https://codepen.io/Rowno/pen/Afykb */

    .carousel-inner img {
        width:100%;
        height:auto;
       
    }

    .carousel-fade .carousel-inner .item {
        opacity: 0;
        transition-property: opacity;
    }

    .carousel-fade .carousel-inner .active {
        opacity: 1;
    }

        .carousel-fade .carousel-inner .active.left,
        .carousel-fade .carousel-inner .active.right {
            left: 0;
            opacity: 0;
            z-index: 1;
        }

    .carousel-fade .carousel-inner .next.left,
    .carousel-fade .carousel-inner .prev.right {
        opacity: 1;
    }

    .carousel-fade .carousel-control {
        z-index: 2;
    }

    .slick-arrow:before { color: #000 !important; }
        .slick-prev {
      left: 1% !important;
      z-index: 1;
    }
    .slick-next {
      right: 1% !important;
      z-index: 1;
}
    .slick-slide img{
        display:block;
        /*width:100%;*/
        height:auto;
        text-align:center !important;
    }

     .bannerrow-carousel:not(.slick-initialized) > * {
	display:inline-flex;
    }

     .home-page-product-grid .item-grid:not(.slick-initialized){
         white-space:nowrap;
     }
     
     .home-page-product-grid .item-grid:not(.slick-initialized) > *{
         display:inline-flex;
     }


    /*
    WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
    now override the 3.3 new styles for modern browsers & apply opacity
    */
    @media all and (transform-3d), (-webkit-transform-3d) {
        .carousel-fade .carousel-inner > .item.next,
        .carousel-fade .carousel-inner > .item.active.right {
            opacity: 0;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }

        .carousel-fade .carousel-inner > .item.prev,
        .carousel-fade .carousel-inner > .item.active.left {
            opacity: 0;
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }

            .carousel-fade .carousel-inner > .item.next.left,
            .carousel-fade .carousel-inner > .item.prev.right,
            .carousel-fade .carousel-inner > .item.active {
                opacity: 1;
                -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
            }

            .carousel-inner {
                position: relative;
                width: 100%;
                overflow: hidden;
                margin-bottom: 10px;
            }

                    .carousel-indicators {
                            bottom: 4px;
                            /*position: absolute;
                            top: 3px;
                            left: 30px;*/
                        }
                     .carousel-indicators li{
                          border: 1px solid #000;
                          margin-right:7px;
                          margin-left:7px;
                        }
                            .carousel-indicators .active {
                                width: 12px;
                                height: 12px;
                                margin: 0;
                                background-color: #000;
                            }
                  


    }

     @media (min-width:768px) and (max-width:1199px) {
    .bannerrow-public {
    margin-right: 0px;
    margin-left: 0px;
    width: 100%;
    height: auto;
    padding-top: 115px;
}
    }


    @media (max-width:768px) {
        .bannerrow-public {
        margin-right: 0px;
        margin-left: 0px;
        width:100%;
        height:auto;
        padding-top: 20px;
    }
        .bannerrow-image-src {
            margin-bottom: 20px;
        }

      .bannerspacer {
    width: 100%;
    margin-bottom:0px;
}

     /*.bannerrow-carousel .banertitle {
        margin-left: 30%;
        margin-right:20%;
       }*/

.banertitle{font-size:17px;color:#000;font-weight:600;text-align:center !important; text-decoration:none;line-height:24px;}


.slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 8%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}


.slick-track {
  display: flex;
}
.bannerrow-carousel .banertitle{
  display: flex;
  height: auto;
  align-items: center;
  justify-content: center;
}



                    .carousel-indicators {
                            bottom: -6px;
                            /*position: absolute;
                            top: 3px;
                            left: 30px;*/
                        }

                     .carousel-indicators li{
                          border: 1px solid #000;
                        }

                            .carousel-indicators .active {
                                width: 12px;
                                height: 12px;
                                margin: 0;
                                background-color: #000;
                            }
                  


     

}
