/* Note: feel free to update, remove test-app-root-class css properties since it's for template test app */
.mobile-app-class {
   margin: 0px;
   width: 100%;
   background-color: #f8f8f8;
   overflow: hidden;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
}

.hide-mobileApp-View
{
   display: none !important;
}

.loading-page-container-class
{
   width: 100%;
   height: 100%;
   display: none;
}

.error-page-container-class
{
   width: 100%;
   height: 100%;
   display: none;
}

.error-div-dialog-overlay
{
   position: absolute;
   z-index: 999999;
   width: 100%;
   background-color: #f8f8f8;
   height: calc(100vh - 70px);
   padding-top: 70px;
   text-align: center;
   overflow-y: auto;
   top:0;
}
.error-image-div-class{
   text-align: center;
}
.errorpage_bottomBase-class
{
   display: none;
   position: absolute;
   top: 320px;
   margin-left: 30px;
   margin-right: 30px;
   left: 0;
   width: 100%;
   background: #c6c6c6;
   opacity: .5;
}
.error-try-again-button{
   background-color: #B9492C;
   color: white;
   padding: 5px 8px 7px 8px;
   border: none;
   border-style: none;
   outline:none;
   border-radius: 2px;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
   font-size: 14px;
}

.error-trackingId
{
   font-size: 8px;
}

.error-dummy-div{
   padding: 8px;
}

.copy-text {  
   -webkit-user-select: all;  /* Chrome all / Safari all */
   -moz-user-select: all;     /* Firefox all */
   -ms-user-select: all;      /* IE 10+ */
   user-select: all;          /* Likely future */   
 }

.thumbnail-page-container-class
{
   margin: 0px;
   width: 100%;
   position: inherit;
   display: grid;
   grid-template-columns: auto;
}

.thumbnail-page-containerDW-class
{
   position: absolute;
}

.thumbNail-grid-list-view-class {
   position: absolute;
   bottom: 10px;
   top: 17px;
   width: 100%;
}

.fallback-list-view-class {
   position: absolute;
   bottom: 0px;
   top: 0px;
   width: 100%;
}


.thumbNail-grid-list-view-class.thumbNailWithHeaderV2-class {
   top: 10px;
}

.FallbackViewWithHeaderV2
{
   top : 0px
}
.single-slide-page-main-body{
   position: relative;
   top:1px;
}

.single-slide-page-main-body-slider {
   overflow-y: auto;
   height: calc(100vh - 65px);
   overflow-x:hidden;
   touch-action: auto;
}

.comments-enabled-class.thumbNail-grid-list-view-class {
   position: relative;
   /* top: 35px; */
   width: 100%;
   height: calc(100vh - 70px);
   background-color: #f8f8f8;
}

.section-list-view-visible-class {
   overflow-y: auto;
   position: relative;
   height: 100%;
   padding: 0px;
}

.section-list-view-visible-class-iphone, .section-list-view-visible-class-iphone-slr{
   position: relative;
}

.generic-view-class {
   outline: none;
   width: 100% !important;
   height: 100% !important;
}

.generic-view-class .drag-over-frame-view-hidden-class
{
   height: 0px !important;
   width: 0px !important;
}

.generic-view-class * {
   outline: none;
}

.section-view-visible-class {
   font-family: 'Segoe UI semibold';
   font-size: 14px;
   color: #A8A8A8;
   text-align: left;
   padding-right: 8px;
   padding-left: 8px;
}
.error-info-bar-class
{
   margin: 0px;
   width: 100%;
   position: inherit;
}
.rtl-class .section-view-visible-class {
   text-align: right;
}

.rtl-class.section-list-view-visible-class {
   direction: rtl;
}

.grid-list-view-visible-class {
   display: flex;
   width: 100%;
   flex-flow: row;
   flex-wrap: wrap;
   justify-content: center;
}

.grid-frame-view-visible-class {
   position: relative;
   /* padding-bottom: 45px; */
}

.comments-enabled-class.grid-frame-view-visible-class {
   display: grid;
   position: relative;
   width: 100%;
   padding: 16px 0px 0px 0px;
}

.v2HeaderAdjustmentForSlideGrid-class
{
   padding: 4px 0px 0px 0px;
}

.grid-frame-view-inner-container-class
{
   width: 100%;
}

.grid-frame-view-slide-info-container-class {
   position: relative;
   display: flex;
   grid-row: 2; /* We are using SlideGrid factory which is placing comments before slide. But we need reverse. */
   bottom: 0px; 
   height: 18px;
   width: 100%;
   color: rgb(255, 255, 255);
   background: #F8F8F8;
   padding-top: 4px;
}
.grid-frame-view-slide-index-container-class {
   position: relative !important;
   bottom: 30px;
   padding: 0px 5px 0px 5px;  
   font-size: 14px;
   color: #A8A8A8;
   margin-bottom: -27px;
   top: 0px;
}

.comments-enabled-class.grid-frame-view-slide-index-container-class {
   position: absolute;
   bottom: 8px;
   padding: 0px 4px 0px 4px;
   font-size: 10px;
   color: rgb(78, 77, 77);
}

.grid-frame-view-num-comments-container-class {
   position: absolute;
   display: block;
   bottom: 12px;
   right: 15px;
   padding: 0px 5px 0px 5px;
   font-size: 10px;
   color: rgb(116, 113, 113);
}

.rtl-class .grid-frame-view-slide-index-container-class {
   right: 30px;
}

.grid-content-view-visible-class {
   width: 247px;
   height: 140px;
   outline: 0px solid #D2D2CE;
}

.comments-enabled-class.grid-content-view-visible-class {
   width: 950px;
   height: 140px;
   outline: 0px solid #D2D2CE;
   grid-row: 1;
   position: relative;
}

.grid-frame-view-visible-class:hover .grid-content-view-visible-class {
   outline: 4px solid #B3B0AD;
}

.grid-content-view-visible-class:hover {
   cursor: pointer;
}

.content-image-view-visible-class {
   display: flex;
   line-height: 0;
   width: 100%;
   height: 100%;
   justify-content: center;
   align-items: center;
   min-height: 150px;
   background-color: #ffffff;
}

.content-image-view-hidden-class {
   display: none;
}

.content-image-view-visible-class img {
   width: 100%;
   height: 99%;
   box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.14), 0px 2px 2px rgba(0, 0, 0, 0.2);
}

.container-rendered-as-grid-class.grid-content-view-visible-class {
   outline: none;
}

.grid-frame-view-visible-class.grid-frame-view-selected-class .grid-content-view-visible-class {
   outline: 0px solid #E86E58;
}

.grid-frame-view-visible-class.grid-frame-view-selected-class:hover .grid-content-view-visible-class {
   outline: 0px solid #E86E58;
}

.grid-frame-view-visible-class.grid-frame-view-selected-class .grid-frame-view-slide-index-container-class {
   color: #555555;
   font-size: 12px;
   font-family: 'Segoe UI semibold';
}

.grid-frame-view-visible-class.grid-frame-view-active-focus-class .grid-content-view-visible-class {
   outline: 1px solid #323130;
}

.grid-frame-view-visible-class.grid-frame-view-hidden-slide-class .grid-content-view-visible-class .content-image-view-visible-class {
   opacity: 0.5;
}

.grid-frame-view-visible-class.grid-frame-view-hidden-slide-class .grid-frame-view-slide-index-container-class::after {
   border-bottom: 1px solid;
   -webkit-transform: rotate(20deg);
   -ms-transform: rotate(20deg);
   transform: rotate(20deg);
   content: '';
   width: 90%;
   position: absolute;
   top: 8px;
   left: 1px;
}

.single-slide-class,.slide-show-class-portrait {
   position: absolute;
   width: 100%;
   height: 100%;
   margin: 0px;
   background-color: #f8f8f8;
}

.single-slide-class {
   position: relative;
   top: 3px;
}

.slide-show-class-landscape {
   height: 100%;
}

.slide-show-background-color-class{
   background-color: black
}

.single-slide-view-class {
   position: absolute;
   display: flex;
   width: 100%;
   height: 100%;
}

.single-slide-nav-container-class,.slide-show-nav-container-class {
    display: flex;
    align-items: center;
}

.single-slide-nav-container-class {
   margin: 16px 7px 8px 7px;
   padding: 1px 1px 0px 1px;
}

.slide-show-nav-container-class {
   margin: 16px 8px 8px 8px;
}

.single-slide-image-container-class {
    position: relative;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    transform-origin: 0%;
}

.single-slide-tab-bar-class {
   display: inline-block;
   width: 100%;
   height: 24px;
   padding: 12px 0px 8px 8px;
}

.notes-comments-tab-container-class {
   position: absolute;
}

.single-slide-notes-tab-class,.single-slide-comments-tab-class
{
   float: left;
}

.single-slide-comments-tab-class {
   margin-left: 20px;
}

.hide-comments-navigation-panel
{
   display: none;
}

.comments-nav-bar
{
   float: right;
   margin-right: 16px;
}

.single-slide-comments-button-class , .single-slide-notes-button-class {
   background: transparent;
   border:none;
   padding: 0px;
   font-size: 14px !important;
   line-height: 20px;
}

.single-slide-notes-button-class {
   padding: 0px;
}

/*
  This will hide the focus indicator if the element receives focus via the mouse,
  but it will still show up on keyboard focus.
*/
* :focus:not(.focus-visible) {
   outline:  none;
 }

 .focus-visible {
   outline: 1px solid #323130 !important;
 }

.grid-frame-view-visible-class:focus{
   outline:  none !important;
}

.single-slide-notes-container-class {
   display: block;
   overflow: scroll;
   padding:0px 8px 8px 8px;
}

.single-slide-comments-container-class {
   display: block;
   overflow: hidden;
}

.single-slide-notes-content-container-class {
   color: #434343;
   font-size: 15px;
   padding: 7px 12px 12px 12px;
   border: solid 1px lightgrey;
   overflow: auto;
   background-color: #ffffff !important;
}

.single-slide-comments-content-container-class {
   display: flex;
   flex-direction: column;
   font-size: 10px;
   padding: 5px 5px 5px 0px;
   overflow: auto;
}

.single-slide-comment-thread-container-class {
   display: flex;
   flex-direction: column;
   margin-bottom: 15px;
}

.single-slide-comment-card-class {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   background-color: #f0f0f0;
   border: 2px solid #dfdfdf;
   color: #616161;
   padding-left: 10px;
   margin-right: 0px;
}

.single-slide-comment-card-selected-class{
   outline: 1px solid #E86E58;
   background-color: #fac07e;
}

.single-slide-comment-author-container-class{
   padding: 5px;
   margin-left: -10px !important;
   margin-top: -1px !important;
   background-color: lightskyblue;
   font-weight: bold;
   font-size: 10px;
   margin-top: 5px;
}

.single-slide-comment-body-container-class {
   padding: 5px;
   font-size: 12px;
}

.single-slide-comment-date-container-class {
   padding:5px;
   font-size: 8px;
   margin-top: 2px;
   margin-left: -10px !important;
   background-color: lightyellow;
}

.header-ppto-icon-class
{
   max-width: 32px;
}

.mobile-header-panel-brand-Icon
{
   padding-left: 5px;
   float: left;
}

.mobile-header-container-class {
   display: block;
   position: relative;
   width: 100%;
   flex-wrap: wrap;
   height: 60px;
}

.mobile-headerV2-container-class
{
   max-height: 67px;
}

.slideshow-mobile-header-container-class
{
   height: 30px;
}

.mobile-footer-container-class,.mobile-footer-slideshow-container-class{
   display: block;
   position: fixed;
   bottom: 0%;
   width: 100%;
   height: 10px;
   flex-wrap: wrap;
   z-index: 9999;
}
.mobile-footer-slideshow-container-class
{
   height: 40px !important;
   text-align:center;
   margin-bottom: 8px;
}

.mobile-footer-SubContainer-class{
   display: grid;
   grid-template-columns: 1fr 6fr 1fr;
   position: fixed;
   bottom: 0%;
   width: 100%;
   height: 10px;
   flex-wrap: wrap;
   background-color: whitesmoke;
   z-index: 9999;
   border-top: darkgrey solid 2px;
}

.mobile-footer-SubContainer-class-SlideShowView
{
   display: grid;
   bottom: 0%;
   width: 120px;
   flex-wrap: wrap;
   z-index: 9999;
   height: 40px;
   margin: 0 auto;
   border-radius:2px;
   border-top: 0px;
}

.mobile-header-SubContainer-class
{   
   display: block;
   position: relative;
   position: fixed;
   top: 0%;
   width: 100%;
   height: 100%;
   max-height: 60px;
   flex-wrap: wrap;
   z-index: 9999;
   padding-bottom: 8px;
   border-bottom: solid 2px rgba(0, 0, 0, 0.2);
   background-color: #ffffff;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
 }

 .app-mobile-header-container-class
 {
   border: none;
   box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
   background-color: #ffffff;
   min-height: 35px;
   max-height: 65px;
 }

 .slideShow-mobile-header-SubContainer-class
 {
   grid-template-rows: auto;
   height: 30px;
   padding-bottom: 0px;
 }

.mobile-loadingPage-SubContainer-class
{
   position: fixed;
   top: 0%;
   width: 100%;
   height: 100%;
   background-color: white;
   z-index: 999999;
   border: #702c1b;
}

.no-commentsToShow-class,.no-notesToShow-class
{
   display: grid;
   grid-row-gap: 0px;
   grid-template-columns: auto;
   grid-template-rows: 5fr 1fr 2fr 1fr;
   top: 0%;
   flex-wrap: wrap;
   text-align: center;
   justify-self: center;
}

.no-commentsToShow-class
{
   padding: 0px 13px 0px 5px;
}

.no-Comments-Parent-Container-backGround-class , .no-Notes-Parent-Container-backGround-class
{
   background-color: #f8f8f8 !important;
   border: 0px;
}

.mobile-no-comment-icon-class,.mobile-no-notes-icon-class,.error-icon-class
{
   max-width: 50%;
   align-self: center;
}

.mobile-no-comment-icon-class,.mobile-no-notes-icon-class
{
   height: 105px;
}

.mobile-no-comment-icon-container-class,.mobile-no-notes-icon-container-class
{
   align-self: center;
   text-align: center;
   min-height: 109px;
}

.mobile-no-comment-Title-class,.mobile-no-Notes-Title-class
{
   color: #434343;
   font-family: "Segoe UI semibold";
   font-size: 16px;
   display: table;
   margin: auto;
   letter-spacing : normal;
}

.error-title-class{
   padding: 10px;
   display: table;
   margin: auto;
   color: #252423;
   font-size: 18px;
   font-family: "Segoe UI semibold";
   width: 60%;
}
.mobile-no-comment-Message-class,.mobile-no-notes-Message-class
{
   color: #605e5c;
   font-size: 14px;
   width: 90%;
   display: table;
   margin: auto;
}
.error-Message-class{
   width: 65%;
   display: inline-block;
   margin: auto;
   font-size: 16px;
   color: #252423;
}

.error-message-class-unsupported-sizegreaterthan2GB-error{
   width: 75%;
}

.mobile-no-comment-OpenInApp-class,.mobile-no-notes-OpenInApp-class,.error-try-again
{
   color: #B9492C;
   font-family: 'Segoe UI semibold';
   font-size: 14px;
   display: table;
   margin: auto;
   letter-spacing : normal;
}

.error-try-again{
   padding-top: 14px;
}

.modern-previewer-container-class{
   width: 100%;
   height: calc(100vh - 70px) !important;
}

.mobile-footer-panel-grid{
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   height: 100%;
}

.footer-panel-button-class{
   font-size: 10px;
   display: block;
   width: 100%;
   height: 99%;

}
.mobile-header-bottom-half-container {
   display: flex;
   width: 100%;
   flex-direction: row;
   margin-bottom: 10px;
   justify-content: space-between;
}

.mobile-footer-bottom-half-container {
   display: flex;
   width: 100%;
   flex-direction: row;
   margin-bottom: 10px;
   justify-content: space-between;
}

.mobile-header-back-button-class {
   height: 50px;
   width: 50px;
   font-size: 50px;
   color: #B9492C;
   background: transparent;
   border: none;
}

.mobile-header-landscape-button-class {
   height: 50px;
   width: 50px;
   font-size: 50px;
   color: #ffffff;
   background: transparent;
   border: none;
}

.mobile-header-icon-class {
   margin-left: 0px;
   width: 100%;
   height: 100%;
   max-width: 30px;
   max-height: 30px;
}

.mobile-loadingpage-icon-container-class {
   position: absolute;
   top: 35%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.mobile-loadingPage-icon-class {
   margin-left: 0px;
   width: 100%;
   height: 180px;
   width: 180px;
}

.mobile-loadingPage-msftLogo-container-class {
   position: relative;
   height: 100%;
   width: 100%;
}

.mobile-loadingPage-msftLogo-class {
   height: 21px;
   width: 99px;
   position: absolute;
   bottom: 36px;
   left: 50%;
   transform: translate(-50%);
}

.mobile-footer-icon-class {
   margin-left: 24px;
   width: 50px;
   height: 50px;
}

.mobile-header-title-container-class {
   display: flex;
   width: 100%;
   height: 100%;
   justify-items: center;
}

.mobile-header-panel-grid{
   display: inherit;
}

.mobile-header-panel-grid-actions{
   float: left;
   width: 100%;
   text-align: center;
}

.headerActionsRightContainer-class
{
   float: right;
}

.mobile-header-panel-FileName-grid
{
   grid-column: 2/7;
   max-height: 23px;
}

.header-slideNumber-grid-class-slideView
{
  display: inline-block;
}

.mobile-header-panel-grid-lower-class
{
   display: inherit;
   grid-column: 1/8;
   height: 12px;
}

.mobile-header-panel-grid-Upper-class
{
   display: inherit;
   grid-column: 1/8;
   height: 12px;
}

.mobile-loadingPage-panel-grid-loader, .mobile-pulltoRefresh-loader {
   border: 3px solid #f3f3f3;
   border-radius: 50%;
   border-top: 3px solid #B9492C;
   width: 20px;
   height: 20px;
   margin:auto;
   -webkit-animation: spin 1s linear infinite; /* Safari */
   animation: spin 1s linear infinite;
}

/* Landing Page Progress Bar */
.mobile-loadingPage-loader-class 
{
   position: relative;
   height: 2px;
   padding-top: 8px;
   padding-right: 0px;
   padding-bottom: 8px;
   padding-left: 0px;
   overflow: hidden;
}

.mobile-loadingPage-loader-track-class
{
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: rgb(237, 235, 233);
}

.mobile-loadingPage-loader-bar-class
{
  height: 2px;
  position: absolute;
  width: 0px;
  min-width: 33%;
  transition: width 0.3s ease 0s;
  background: linear-gradient(to right, rgb(237, 235, 233) 0%, #b9492c, rgb(237, 235, 233) 100%);
  animation: 3s ease 0s infinite normal none running animation-css;
}

@keyframes animation-css 
{
  0% { left: -30%; }
  100% { left: 100%; } 
}

.mobile-loadingPage-loader-container-class
{
   position: absolute;
   width: 216px;
   top: 56%;
   left: 50%;
   transform: translate(-50%, -50%);
}

 /* Safari */
@-webkit-keyframes spin {
   0% { -webkit-transform: rotate(0deg); }
   100% { -webkit-transform: rotate(360deg); }
 }
 
 @keyframes spin {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
 }

.mobile-loadingPage-panel-grid{
   text-align: center;
   color:  #B9492C;
   font-size: 15px;
   justify-self: center
 }

 .mobile-loadingPage-panel-grid-error{
      text-align: center;
      color:  #B9492C;
      font-size: 10px;
      justify-self: center;
      padding: 10px 10px 10px 10px;
      font-family: 'Segoe UI', 'Segoe UI Web',sans-serif,;
   }

.mobile-header-title-class {
   margin: auto;
   color: #f0f0f0;
   font-size: 15px;
   justify-self: center;
   border: none;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
}

.mobile-header-grid-title-class {
   margin: auto;
   display: inherit;
   text-align: center;
   color: #B9492C;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
   font-size: 16px;
   justify-self: center;
   overflow: hidden;
   white-space: nowrap;
}

.headerActionBar-class
{
   padding-top: 4px;
}

.headerActionBar-slr-class
{
   display: grid;
   grid-template-columns: 4fr 13fr 4fr;
   padding-top: 6px;
}

.headerActionBar-leftHeader-slr-class
{
   justify-self: end;;
}

.FlyOutAnchor-menu-class
{
   z-index: 3;
}

.app-mobile-header-grid-title-class
{
   color: #B9492C !important;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif !important;;
   font-size: 16px !important;
   padding: 12px 0px 0px 0px;
}

.app-mobile-header-slr-title-class
{
   padding: unset;
   width: 100%;
   display: inline-block;
}

.lowerHeaderSlideCountDetailsContainer-class
{
   padding-top: 3.5px;
}

.mobile-header-panel-grid-row2-col1-woffleAndBack
{
   padding: 4px 7px 0px 12px;
   float: left;
}

.mobile-header-panel-grid-row2-col3-ShareAndEdit {
   margin-right: 20px;
}

.icon-disabled-class
{
   pointer-events: none;
   opacity: 0.4;
}

.mobile-view-background-color{
   background-color:#f8f8f8
}

.default-FontStyle{
   color: #252423;
   font-size: 18px;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
}

.mobile-header-slide-num-class {
   justify-content: center;
   align-items: center;
   display: flex;
   font-size: 16px;
   /*padding to account for width of back button so slide count is centered*/
}

.tab-container-button-selected
{
   outline:none;
   border-bottom: 3px #B9492C solid;
   font-family: "Segoe UI semibold";
}
 
.tab-container-button-unselected
{
   outline:none;
   border: none;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
}
 
.tab-container-hide-tab,.hide-error-dialog,.hide-Header,.hide-Footer,.hide-modalDialog
{
   display: none;
}

.mobile-header-panel-grid-row2-col3-MenuBar
{
   display:grid;
   justify-items: center;
   align-items: center;
   justify-content: end;
}


.mobile-header-panel-grid-row2-col3-MenuBar-Thumbnail
{
   grid-template-columns: 30px 30px 30px 30px;
   grid-column: 4/8;
}

.mobile-header-panel-grid-row2-col3-MenuBar-slideView
{
   grid-template-columns: 30px;
   grid-column: 7/8;
   margin-right: 5px;
   margin-left: 4px;
}

.mobile-header-panel-grid-row2-col3-MenuBar-slideShow
{
   grid-template-columns: 30px 30px 30px 30px;
   grid-column: 4/8;
   margin-right: 5px;
}

.grid-frame-view-visible-class.grid-frame-view-hidden-slide-class .grid-frame-view-slide-index-container-class::after {
   border-bottom: 1px solid;
   -webkit-transform: rotate(120deg);
   -ms-transform: rotate(120deg);
   transform: rotate(120deg);
   content: '';
   width: 90%;
   position: absolute;
   top: 6px;
   left: 1px;
   opacity: 0.4;
}

@font-face {
   font-family: 'FabricMDL2Icons';
   src: url('data:application/octet-stream;base64,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') format('truetype');
}

.slide-show-back-button
{
   font-size: 14px !important;
   align-self: center;
}

.pencil-Editor-Color-Class
{
   fill: #666 !important;
}

.ms-Icon--ChromeBack:before { 
    content: "\E830"; 
}


@keyframes shimmerBackground {
   0% {background-position:-5000px 0}
   100% {background-position:5000px 0}
}

.shimmer
{
background-image: -moz-linear-gradient(160deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 25%, rgba(255,255,255,0.85) 60%, rgba(255,255,255,0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(25%,rgba(255,255,255,0)), color-stop(60%,rgba(255,255,255,0.85)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.85) 60%,rgba(255,255,255,0) 100%);
background-image: -o-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.85) 60%,rgba(255,255,255,0) 100%);
background-image: -ms-linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.85) 60%,rgba(255,255,255,0) 100%);
background-image: linear-gradient(160deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.85) 60%,rgba(255,255,255,0) 100%);
background-repeat: repeat-y;
background-position:-5000px 0;
animation: shimmerBackground 8s linear infinite;
}



/*  CSS for Dialog Box Starts */

.dialog-page-container-class,.modal-dialog-page-container-class
{
   z-index: 9999;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   overflow: auto;
   background-color: rgb(0,0,0);
   background-color: rgba(0,0,0,0.4);
   position :absolute;
}

.dialog-ContentBox-class
{
   min-height: 100px;
   background-color: white;
   margin: 34px;
   display: grid;
   text-align: justify;
   grid-template-columns: auto;
   border: solid 1px grey;
   padding: 16px;
   position: absolute;
   font-family: 'Segoe UI semibold';
   font-size: 14px;
   color: #A8A8A8;
   top: calc(50% - 120px);
   border-radius: 2px;
}

.dialogBox-cancel-Button-class
{
   display: block;
   margin-top: auto;
   color: #aaaaaa;
   font-size: 20px;
   font-weight: bold;
   text-align: right;
}

.dialogBox-cancel-Button-class:hover
.dialogBox-cancel-Button-class:focus
{
   color: #000;
   text-decoration: none;
   cursor: pointer;
}

.dialogBox-title-container-class
{
   font-size: 20px;
   color: #b9492c;
}

.dialogBox-Message-container-class
{
   font-size: 14px;
   color: #000000;
   padding: 16px 20px 23.5px 0px;
   font-family: 'Segoe UI','Segoe UI Web', sans-serif;
}

.dialogBox-Action-container-class
{
   grid-template-columns: 5fr 3fr 1fr;
   padding-right: 2px;
}

.dialogBox-Action-class
{
   border-radius: 2px;
   padding: 6px 12px;
   font-size: 14px;
   float: left;
   margin-left: 4px;
   border: 1px solid #b9492c;
}

.dialogBox-Action-OpenInApp-class
{
   background: #b9492c;
   color: #ffffff;
}

.openInApp-close-button
{
   font-size: 16px;
   padding: 2px;
   color: #444444;
}

.dialogBox-Action-Cancel-class
{
   background: #ffffff;
   color: #000000;
   border-color: #c8c6c4;
}

.dialogBox-Action-row-class
{
   display: grid;
   grid-template-columns: 1fr 6fr;
   padding: 2px;
   justify-items: left;
   align-items: center;
}

.img20by20
{
   width: 20px;
   height: 20px;
}

.absolute-Center {
   margin: auto;
   position: absolute;
   top: 0; left: 0; bottom: 0; right: 0;
 }

/*  CSS for Dialog Box Ends */

/*  CSS for Ios Dialog Box Starts */

.dialog-Ios-ContentBox-class
{
   min-height: 100px;
   background-color: white;
   margin: 24px;
   padding: 24px;
   display: flex;
   flex-direction: column;
   border: solid 1px grey;
   position: absolute;
   font-family: 'Segoe UI semibold','Segoe UI Web', sans-serif;
   font-size: 14px;
   color: #A8A8A8;
   top: calc(50% - 120px);
   border-radius: 2px;
   height: fit-content;
   row-gap: 12px;
}

.dialogBox-Ios-Title-Container-class
{
   display: flex;
   flex-direction: row;
}

.dialogBox-Ios-Title-Label-class{
   font-size: 20px;
   color: #242424;
   font-family: 'Segoe UI semibold','Segoe UI Web', sans-serif;
}

.dialogBox-Ios-Message-Container-class
{
   font-size: 14px;
   color: #242424;
   font-family: 'Segoe UI regular','Segoe UI Web', sans-serif;
}

.dialogBox-Ios-Action-Container-class
{
   display: flex;
   flex-direction: row;
   margin-left: 0px;
   background-color:#C43E1C ;
   border-radius: 4px;
   padding: 5px 12px;
   width:fit-content;
   column-gap: 8px;
}

.dialogBox-Ios-Action-icon-container-class
{
   display:flex;
   align-items: center;
}

.dialogBox-Ios-Action-OpenInApp-class
{
   font-size:14px;
   font-family: 'Segoe UI regular','Segoe UI Web', sans-serif;
   color: #FFFFFF;
}

.dialogBox-Ios-Footer-Container-class
{
   display: flex;
   flex-direction: row;
}

.dialogBox-Ios-Footer-Text-class
{
   font-size:14px;
   font-family: 'Segoe UI regular','Segoe UI Web', sans-serif;
   color: #2E2E2E;
   white-space: pre;
}

.dialogBox-Ios-Action-OpenAppStore-class
{
   font-size:14px;
   font-family: 'Segoe UI regular','Segoe UI Web', sans-serif;
   color: #C43E1C;
}

.dialogBox-Ios-Action-Cancel-class
{
   margin: auto 0px auto auto;
}

/*  CSS for Ios Dialog Box Ends */

.comments-enabled-class.grid-frame-view-slide-index-container-class
{  
    float: left;
    position: relative !important;
    bottom: 0px;
    font-family: 'Segoe UI semibold';
    font-size: 12px;
    color: #555555;
}

.container-rendered-as-grid-class.grid-frame-view-slide-index-container-class
{
    position: absolute;
    bottom: 30px !important;
    padding: 0px 5px 0px 5px;
    font-family: Segoe UI, sans-serif;
    font-size: 12px;
    color: #555555;
}

.container-rendered-as-grid-class.grid-frame-view-visible-class
{
   padding-bottom : 10px;
}

.section-view-title-default-class
{
   margin-bottom: 0px;
}

.grid-frame-view-num-comments-with-icon-container-class
{
    float: left;
    padding: 0px;
    position: relative !important;
}

.grid-frame-view-transition-or-animation-icon-container-class
{
    width: 16px;
    height: 16px;
    overflow: hidden;
    vertical-align: middle;
    margin-left: auto;
    margin-top: 0px;
    float: right;
    padding-right: 10px;
}

.slideshow-icon-image-class
{
   padding-top: 5px;
   min-width: 23px;
}
.grid-frame-view-num-comments-on-comment-icon
{
    color: white !important;
    font-weight: bold;
    font-size: 9px;
    position: absolute;
    top: 0px;
    left: 0px;
    font-family: 'Segoe UI','Segoe UI Web', sans-serif;
    margin:auto;
    width: 100%;
    display: block;
    z-index: 1;
    text-align: center;
    line-height: 16px;
}

.transtionIcon-Solid {
    height: 16px;
}
.comment-Solid
{
   background:url('https://cdn.hubblecontent.osi.office.net/getty/publish/pptmweb/commenticon.svg') center center no-repeat;
   width: 18px;
   height: 18px;
   padding-top: 3px;
   margin-left: 2px;
}

.grid-frame-view-transition-or-animation-icon-hidden-class
{
   display: none;
}

.grid-frame-view-Comments-icon-hidden-class
{
   display: none;
}

.hide-mobileapp-header
{
   visibility: hidden;
}

.section-view-title-class
{
   display: none; /* Till we don't show title */
}

.fileMenu-ellipses
{
   justify-self: right;
   margin-right: 0px !important;
   pointer-events: auto;
}

.fileMenuDropDown-FlyOutAnchor-button-panel-class
{
   padding: 0px;
   border: none;
}

.fileMenuDisabledIconClass
{
   padding: 8px 11px 0px 11px;
}

.fileMenuDropDown-FlyOutAnchor-menu-class, .dropDownId-FlyOutAnchor-menu-class
{
   right: 0px;
   border: 1px solid #dedbdb;
   box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.2);
   margin: unset;
}

.fileMenuDropDown-FlyOutAnchor-menu-item-class, .dropDownId-FlyOutAnchor-menu-item-class
{
   border-bottom: none;
   padding: 0px;
}

.fileMenuDropDown-FlyOutAnchor-main-panel-class
{
   padding: 8px 11px 0px 11px;
}

.fileMenuDropDown-FlyOutAnchor-main-panel-class-selected,.dropDownId-FlyOutAnchor-main-panel-class-selected
{
    background-color: #f3f2f1;
}

.fileMenuDropDown-FlyOutAnchor-menu-itemText-class
{
   color: black;
}

@media only screen and (max-width: 325px)
{
   .single-slide-image-class
   {
      max-height: 200px;
   }

   .content-image-view-visible-class
   {
      max-height: 200px;
   }
}

@media only screen and (min-width: 325px) and (max-width: 380px)
{
   .single-slide-image-class
   {
      max-height: 210px;
   }

   .content-image-view-visible-class
   {
      max-height: 210px;
   }
}

@media only screen and (min-width: 380px) and (max-width: 430px)
{
   .single-slide-image-class
   {
      max-height: 232px;
   }

   .content-image-view-visible-class
   {
      max-height: 232px;
   }
}

@media only screen and (max-height: 320px)
{
   .dropDownId-FlyOutAnchor-menu-class
   {
      max-height: 150px;
      overflow-y: auto;
   }
}
@media only screen and (min-width: 430px) and (max-width: 770px)
{
   .single-slide-image-class
   {
      max-height: 425px;
   }

   .content-image-view-visible-class
   {
      max-height: 425px;
   }
}

@media only screen and (min-width: 770px)
{
   .single-slide-image-class
   {
      max-height: 569px;
   }
   
   .content-image-view-visible-class
   {
      max-height: 569px;
   }
}

@media (orientation: landscape)
{
   .mobile-loadingPage-loader-container-class
   {
      top: 64%;
   }

   .dialog-ContentBox-class
   {
      left: calc(50% - 35px);
      transform: translate(-50%,0%);
   }

   .single-slide-page-main-body-slider-slr
   {
      height: calc(100vh - 40px) !important;
      margin-top: 3px; 
   }

   .app-mobile-header-container-class-slr
   {
      max-height: 34px !important;
      min-height: 34px !important;
   }

   .single-slide-page-main-body-slider-iphone {
      height: calc(100vh - 70px) !important;
      position: relative !important;
   }

   .single-slide-page-main-body-slider-iphone-slr
   {
      height: calc(100vh - 40px) !important;
      position: relative !important;
   }

   .dropDownId-FlyOutAnchor-main-panel-class
   {
      top: -5px;
   }

   .single-slide-page-main-body-slider-iphone::after, .single-slide-page-main-body-slider-iphone-slr::after
   {
      content:"";
      height: 70px;
      display:block;
      position: relative;
      width: 100%;
      bottom: 0;
   }

   .section-list-view-visible-class-iphone::after, .section-list-view-visible-class-iphone-slr::after{
      content:"";
      height: 90px;
      display:block;
      position: relative;
      width: 100%;
      bottom: 0;
   }

   .comments-enabled-class.thumbNail-grid-list-view-class-slr {
      position: relative;
      width: 100%;
      height: calc(100vh - 40px) !important;
      background-color: #f8f8f8;
   }
}

@font-face
{
	font-family:'Segoe UI Web';
	src:
		url( https://static2.sharepointonline.com/files/fabric/assets/fonts/segoeui-westeuropean/segoeui-regular.woff2 ) format('woff2'),
		url( https://static2.sharepointonline.com/files/fabric/assets/fonts/segoeui-westeuropean/segoeui-regular.woff) format('woff');
	font-style:normal
}

@font-face
{
	font-family:'Segoe UI semibold';
	src:
		url( https://static2.sharepointonline.com/files/fabric/assets/fonts/segoeui-westeuropean/segoeui-semibold.woff2 ) format('woff2');
	font-style:normal
}

.comments-enabled-class.app-mobile-hideToolbar-height {
   height: calc(100vh) !important;
}

.app-mobile-hideToolbar-height {
   height: calc(100vh) !important;
}

.rtl-mobileweb-class .grid-frame-view-slide-index-container-class {
   right: 0px;
}

.rtl-mobileweb-class .single-slide-tab-bar-class {
   padding: 12px 8px 8px 0px;
}

.rtl-mobileweb-class .single-slide-notes-tab-class
{
   float: right;
}

.rtl-mobileweb-class .single-slide-comments-tab-class
{
   float: right;
}

.rtl-mobileweb-class .single-slide-comments-tab-class {
   margin-left: 0px;
   margin-right: 20px;
}

.rtl-mobileweb-class .comments-nav-bar
{
   float: left;
   margin-left: 16px;
   margin-right: 0px;
}

.rtl-mobileweb-class .single-slide-comments-content-container-class {
   padding: 5px 0px 5px 5px;
}

.rtl-mobileweb-class .mobile-header-panel-brand-Icon
{
   padding-left: 0px;
   padding-right: 5px;
}

.rtl-mobileweb-class .no-commentsToShow-class
{
   padding: 0px 5px 0px 13px;
}

.rtl-mobileweb-class .mobile-header-panel-grid-row2-col3-ShareAndEdit {
   margin-left: 20px;
   margin-right: 0px;
}

.rtl-mobileweb-class .per-slideShowIcon-Image-class
{
   left: 0px;
}

.rtl-mobileweb-class .dialog-ContentBox-class
{
   padding: 2px 25px 23.5px 10px;
}

.rtl-mobileweb-class .dialogBox-cancel-Button-class
{
   text-align: left;
}

.rtl-mobileweb-class .dialogBox-Message-container-class
{
   padding: 16px 0px 23.5px 20px;
}

.rtl-mobileweb-class .dialogBox-Action-class
{
   float: right;
}

.rtl-mobileweb-class .comments-enabled-class.grid-frame-view-slide-index-container-class
{
   float: right;
}

.rtl-mobileweb-class .grid-frame-view-num-comments-with-icon-container-class
{
   float: right;
}

.rtl-mobileweb-class .grid-frame-view-transition-or-animation-icon-container-class
{
   float: left;
   direction: ltr;
   margin-left: 10px;
   margin-right: auto;
}

.rtl-mobileweb-class .comment-Solid
{
   margin-left: unset;
   margin-right: 2px;
}

.rtl-mobileweb-class .fileMenu-ellipses
{
   justify-self: left;
   margin-left: 0px !important;
}

.rtl-mobileweb-class .fileMenuDropDown-FlyOutAnchor-menu-class,
.rtl-mobileweb-class .dropDownId-FlyOutAnchor-menu-class
{
   left: 0px;
   right: unset;
}

.rtl-mobileweb-class .mobile-header-panel-brand-Icon
{
   float: right;
}

.rtl-mobileweb-class .headerActionsRightContainer-class
{
   float: left;
}

.rtl-mobileweb-class .mobile-header-panel-grid-row2-col1-woffleAndBack
{
   float: right;
}

.rtl-mobileweb-class .dialogBox-Ios-Action-Cancel-class
{
   margin: auto auto auto 0px;
}

/* rules related to disabling print */
@media print
{
  .disablePrintAndDownload
  {
    display: none;
  }
}