@import url(https://www.artcity.co.il/cssForSites/OpenSansHebrew/opensanshebrew.css);  /*opensanshebrew*/


body, table, td,div,a, p, span,h1,h2,h3,h4,li
{

       font-family: "opensanshebrew",
               "Helvetica Neue",
               Helvetica,
               Arial,
               sans-serif; 
        font-size:18px;
}
  .swal2-container.swal2-center
              {
                  z-index: 50000;
              }
            #MainView
            { 
                height:90%;position: fixed;top:10px;right:0;left:0;
            }
            #ImageWallContainer
            {
                text-align: center;
            }
            #fileUploadWrapper
            {
                display: none;
            }
            
            #additionalImagesBox
            {
                display:none;
                position: fixed;
                right:20px;
                width:150px;
                top:20px;
                bottom:140px;
                background-color: #ddd;
            }
            #additionalImagesBox #additionalImagesThumbContainer
            {
                display:none;
                position: fixed;
                
                width:150px;
                top:45px;
                bottom:140px;
                text-align: center;
                
                overflow-y: auto;
                
            }
            
            #fullscreen
            {
                position: fixed;
                top:0;
                left:0;
                z-index: 99900;
                cursor: pointer;
                margin:5px;                
            }
            
            #additionalImagesBox #additionalImagesThumbContainer .additionalImagesInnerThumbContainer 
            {
                margin:10px;
                height:80px;
                cursor: pointer;
                position: relative;
            }
            #additionalImagesBox #additionalImagesThumbContainer .additionalImagesInnerThumbContainer  .additionalImagesThumb img
            {
                width:100%;
                height:100%;
                cursor: pointer;
                object-fit: cover;
            }
            
            #additionalImagesBox  .additionalImagesInnerThumbContainer  .additionalImageslink  
            {
                position: absolute;
                bottom:0;
                right:20px;
                z-index: 99901;
                font-size: 13px;
                    letter-spacing: -1; 
                    font-weight: bold;
                    background-color: rgba(201, 201, 201, 0.5);
            }
            
            #additionalImagesBox  .additionalImagesInnerThumbContainer  .additionalImagesAdd
            {
                position: absolute;
                bottom:0;
                right:0;
                z-index: 99901;
                font-size: 13px;
                    letter-spacing: -1; 
                    font-weight: bold;
                    background-color: rgba(201, 201, 201, 0.5);
            }
            
            #additionalImagesBox_OpenBtn
            {
                position: absolute;
                top:0;right:40px;background-color: #e0262d;
                border-radius: 0px 0px 10px 10px;font-size:15px;
                padding:10px;color:#fff;
                text-align:center;
                cursor: pointer;
                z-index: 10000;
            }
            
            #additionalImagesBox_CloseBtn
            {
                 padding:10px;
                  cursor: pointer;
            }
            
            .hangedArtImage.border-4 /*white*/
            {
                border:none !important;
                padding: 0px !important;
                background-color: #888;
                -webkit-box-shadow: 2px 5px 9px -4px rgba(0,0,0,0.79) !important;;  
                box-shadow: 2px 5px 9px -4px rgba(0,0,0,0.79) !important;;
            }
            
            .hangedArtImage.border-3 /*brown*/
            {
                border-image-source:url(https://www.artbeat.co.il/ArtWallShow/Assets/border.jpg) !important;
                border-image-slice: 30 !important;
                border-image-width: 18px !important;
                border-image-outset: 1!important;
            }
            
            .hangedArtImage.border-2 /*white*/
            {
                border-color: #eee !important;
                background-color: #aaa !important;
                padding: 2px !important;
            }
              
            #imageWrapper
            {
                height:100%;
                margin-top: 10px;
            }
            
            #userMessage, #fileUploadWrapper
            {
                    width: 90%;
                    max-width:800px;
                    margin: 0 auto;
                    text-align: center;
                    position: absolute;
                    left: 0;
                    right: 0;
                    top: 20%;
                    font-size:30px;
                    font-weight: bold;
            }
            .hangedArtImage
            {
                background-color:#fff;
                 object-fit: contain;
                 min-height: 50px;
                 min-width: 50px;
                 cursor: pointer;
                 
                 z-index: 10000;
                 position:fixed;
                 top:100px;
                 left:100px;
                 display:none
            }
            
            #ThumbsRow
            {
                position: fixed;
                bottom: 10px;
                right:10px;
                left:10px;
                
                text-align: center;
                /*overflow-x: auto;overflow-y: hidden;*/
                z-index: 0;
                overflow-x: auto;
                scrollbar-height: thin;
                -webkit-overflow-scrolling: touch;
                overflow-y: hidden;
                white-space: nowrap;
                height:90px;
                padding-bottom: 5px;
                
                min-height:55px;
                
            }
            
            #ThumbsRow .thumbnail_link
            {
                position: relative;
                display:inline-block;
                margin-left:2px;
                margin-right:2px;
                cursor: pointer;
                     
            }
            
            #ThumbsRow .selectedThumb
            {
                border:3px solid black;
            }
            
            #ThumbsRow .thumbnail_link-close
            {
                    background-image: url(Assets/fancybox_sprite@2x.png);
                    background-size: 44px 152px;
                    position: absolute;
                    top: -12px;
                    right: -12px;
                    width: 36px;
                    height: 36px;
                    cursor: pointer;
                    z-index: 8040;

            }
            
            
            
             /* shwoing thumb scroll in mobile */
            ::-webkit-scrollbar {
               width: 12px !important;
            }

            /* Track */
           ::-webkit-scrollbar-track {
              -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3) !important;
              -webkit-border-radius: 10px !important;
              border-radius: 10px !important;
            }

            /* Handle */
            ::-webkit-scrollbar-thumb {
              -webkit-border-radius: 10px !important;
              border-radius: 10px !important;
              background: #41617D !important; 
              -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5) !important; 

            }
            ::-webkit-scrollbar-thumb:window-inactive {
              background: #41617D !important; 
            }
            
            ::-webkit-scrollbar {
                height: 8px;
                width: 8px;
                
            }
            
            #ThumbsRow .thumbnail_image
            {
                height:100%;
                
                width:auto;
            }
            
            #loadingAnim
            {
                position:absolute;
                top:30px; 
                
                margin-left: auto;
                margin-right: auto;
                left: 0;
                right: 0;
                text-align: center;
                }
            
              #videoElement
              {
                position:absolute;
                top:0px;
                margin-left: auto;
                margin-right: auto;
                left: 0;
                right: 0;
                text-align: center;
                height:100%;
              }

              .FrameColorbox{
                  cursor: pointer;
                      vertical-align: top;
              }
 
              #WidgetArea
              {
                  position: absolute; 
                  left:0;
                  right:0;
                   bottom:130px;
                   height:35px;


                  font-wight:17px;
                  text-align: center;
                  margin-left: auto; 
                    margin-right: auto; 
                    
                    display: none;
                    
                    
              }
              
              #WidgetArea #FrameColor
                {
                    position: absolute;
                    top:0px;
                    ;left:0;
                    text-align: center;
                    font-size:17px;
                    width:185px;
                }
             
            
       
              
              #WidgetArea .ArtWorkRangeContainer
              {
                  display: none;
                  z-index: 10000;
                  position: absolute; 
                  left:220px;
                  right:auto;
                  width:50%;
                  max-width:250px;
                  top:0;
                  
                  text-align: center;
                 
                  
              }
              
              #WidgetArea #ArtWorkRangeContainer_2
              {
                  left:520px;
              }
              
              
              #WidgetArea #innerText
              {
                   
                   float: left;
                   text-align: right;
                   font-size: 15px;
                    margin:0px 4px;
                    line-height: 16px;  
              }
              
              .FrameColorbox
              {
                  width:30px;
                  height:30px;
                  display:inline-block;
                  
              }
              
              #WidgetArea .ArtWorkRangeContainer .ArtWorkRange
              {
                  
                  width:180px;
                  -webkit-appearance: none;
                  height: 10px;
                  border-radius: 10px;
                  background: #d3d3d3;
                  outline: none;
                  opacity: 0.7;
                  -webkit-transition: opacity .15s ease-in-out;
                  transition: opacity .15s ease-in-out;
                  margin-top: 15px;

              }


                /* Mouse-over effects */
                .ArtWorkRange:hover {
                  opacity: 1; /* Fully shown on mouse-over */
                }

                /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
                .ArtWorkRange::-webkit-slider-thumb {
                  -webkit-appearance: none; /* Override default look */
                  appearance: none;
                  width: 20px; /* Set a specific slider handle width */
                  height: 20px; /* Slider handle height */
                  background: #4CAF50; /* Green background */
                  cursor: pointer; /* Cursor on hover */
                  border-radius: 15px;
                }

                .ArtWorkRange::-moz-range-thumb {
                  width: 20px; /* Set a specific slider handle width */
                  height: 20px; /* Slider handle height */
                  background: #4CAF50; /* Green background */
                  cursor: pointer; /* Cursor on hover */
                  border-radius: 15px;
                }
 
              
              .arrowbut
              {
                  position:fixed;top:40%;
                  z-index:1000;cursor: pointer;
                  width: 50px;
              }
              
              
              @media (max-width: 1000px)
              {
                  
                 /* #ThumbsRow
                   {
                
                        height:60px;
                   }
                   .thumbnail_link
                   {
                       margin-left: 2px;
                        margin-right: 2px;
                   }
                   
                   
                   
                   
                    .arrowbut
                    {
                      width:30px;
                      height:auto;  
                    }*/
                  
                  
                    
                 
              }