
.ItemList { background: none repeat scroll 0 0 #f6f8fa; border: 1px solid #c9c9ca; position: relative; }
/*homepage start*/
.leftBanner { width: 220px; background-color: #fff; display: inline-block; vertical-align: top; }
   .leftBanner .oneBanner { width: 220px; float: left; height: auto; border: 1px solid #acadb2; border-radius: 5px 5px 0 0; }
      .leftBanner .oneBanner .header { width: 170px; line-height: 30px; text-align: left; border-radius: 3px 3px 0 0; color: #fff; padding: 0 0 0 50px; }
      .leftBanner .oneBanner p { line-height: 21px; text-align: left; padding: 0 10px; }
   .leftBanner .libraryHour { display: block; padding: 20px 5px 20px 5px; }
      .leftBanner .libraryHour li { display: block; line-height: 25px; text-align: left; padding: 0 0 0 5px; }
   .leftBanner .imgDiv { background-color: #d9d9d9; padding: 20px 0 20px 0; }
      .leftBanner .imgDiv a { display: block; width: 135px; margin: 0 auto; border: 8px solid #ffffff; }
         .leftBanner .imgDiv a:hover { padding: 7px; background-color: #fff; border: 1px solid #0A5280; }
   .leftBanner .membership { display: block; float: left; margin: 15px 0; }
      .leftBanner .membership li { width: 190px; line-height: 30px; background: url(images/system/icons.png) no-repeat 15px -400px; padding: 0 0 0 30px; text-align: left; box-sizing: content-box; }
      .leftBanner .membership a { text-decoration: none; }
         .leftBanner .membership a:hover { text-decoration: underline; color: #fe6243; }
   .leftBanner .libraryHourHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 15px -256px; }
   .leftBanner .membershipHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 15px -302px; }

.defaultBannerHeader { background: url(images/system/icons.png) no-repeat 15px -769px; }

.homeContent { flex: 1; -webkit-flex: 1; height: auto; display: inline-block; vertical-align: top; margin: 0 3px; overflow: hidden; background-color: #fff; }
   .homeContent .pictures { width: calc(100% - 2px); height: auto; float: left; overflow: hidden; border: 1px solid #acadb2; border-top: 5px solid #0A5280; }
      .homeContent .pictures .picBorder { width: 100%; float: left; }
      .homeContent .pictures .buttonDiv { width: 15px; margin: 43px 0 0 0; }
         .homeContent .pictures .buttonDiv.left { margin-left: 5px; }
         .homeContent .pictures .buttonDiv.right { margin-right: 5px; }
      .homeContent .pictures .picList { flex: 1; -webkit-flex: 1; min-width: 520px; display: block; margin: 0 7px 0 7px; }
         .homeContent .pictures .picList li { float: left; width: 118px; height: 113px; padding: 6px; text-align: left; box-sizing: content-box; }

      .homeContent .pictures li img { width: 112px; height: 80px; border: 1px solid #e1e1e1; padding: 3px; background-color: white; box-sizing: content-box; }
      .homeContent .pictures li:hover img { border: 1px solid #fff; }
      .homeContent .pictures li .title { display: block; width: 112px; text-decoration: none; padding: 0 3px 10px 3px; line-height: 14px; box-sizing: content-box; }
      .homeContent .pictures li:hover .title { color: #fff; }
   .homeContent .books { width: calc(100% - 2px); height: auto; float: left; border: 1px solid #acadb2; overflow: hidden; border-top: 5px solid #0A5280; }
      .homeContent .books .bookBorder { width: 100%; float: left; }
      .homeContent .books .buttonDiv { width: 15px; margin: 43px 0 0 0; }
         .homeContent .books .buttonDiv.left { margin-left: 5px; }
         .homeContent .books .buttonDiv.right { margin-right: 5px; }
      .homeContent .books .bookList { flex: 1; -webkit-flex: 1; min-width: 520px; display: block; margin: 0 7px 0 7px; }
         .homeContent .books .bookList li { float: left; width: 96px; padding: 4px; text-align: left; box-sizing: content-box; }
         .homeContent .books .bookList img { width: 90px; height: 140px; }
         .homeContent .books .bookList a { display: table-cell; background-color: white; border: 1px solid #e1e1e1; float: none; text-align: center; vertical-align: middle; }
            .homeContent .books .bookList a:hover { border: 1px solid #0A5280; }
   .homeContent .news { width: calc(100% - 2px); height: auto; float: left; border: 1px solid #acadb2; border-top: 5px solid #0A5280; }
      .homeContent .news .newsList { display: block; padding: 0 10px 0 10px; }
         .homeContent .news .newsList li { line-height: 30px; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -515px; display: block; text-align: left; }

   .homeContent .bookList .outTag, .homeContent .bookList .inTag { width: 23px; height: 25px; display: block; position: absolute; top: 145px; left: 70px; z-index: 99; background-image: url(images/system/button04.png); background-size: 23px; background-repeat: no-repeat; text-align: center; font-weight: bold; font-size: 11px; overflow: hidden; line-height: 22px; color: #fff; }
   .homeContent .bookList .outTag { background-position: 0 0; }
   .homeContent .bookList .inTag { background-position: 0 -25px; }
   .homeContent .bookList .no_image_text { left: 2px; }
   .homeContent .bookList .materialTypeForHomePage { width: 70px; }

   .homeContent .news .newsList li a { text-decoration: underline; }
      .homeContent .news .newsList li a:hover { text-decoration: underline; color: #fe6243; }
   .homeContent .booksHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -718px; }
   .homeContent .videoHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -663px; }
   .homeContent .recentlyviewedHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -560px; }
   .homeContent .newtitlesHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -947px; }
   .homeContent .mostcirculatedHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -990px; }
   .homeContent .recommendedHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -1030px; }
   .homeContent .topratedHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -1068px; }
   .homeContent .overdrivenewtitlesHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -947px; }
   .homeContent .newsHeader { background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 10px -620px; }
   .homeContent .custom { width: calc(100% - 2px); height: auto; float: left; border: 1px solid #acadb2; border-top: 5px solid #0A5280; }
      .homeContent .custom .header { background-image: url(images/system/star.png); background-repeat: no-repeat; background-position: 10px 6px; }
   .homeContent .onlineResuorces { width: calc(100% - 2px); height: auto; float: left; border: 1px solid #acadb2; overflow: hidden; border-top: 5px solid #0A5280; }
      .homeContent .onlineResuorces .header { background-image: url(images/system/links.png); background-repeat: no-repeat; background-position: 10px 6px; }
      .homeContent .onlineResuorces .content { float: left; padding: 0 0 0 10px; }
   .homeContent .linkColumn { width: 177px; float: left; padding: 0 10px 0 0; box-sizing: content-box; }
      .homeContent .linkColumn ul, .homeContent .linkColumn li { float: left; }
      .homeContent .linkColumn li { width: 177px; text-align: left; }
      .homeContent .linkColumn .linkHeader { font-weight: bold; display: inline-block; padding: 5px 0 5px 0; }
      .homeContent .linkColumn li a { text-decoration: underline; padding: 0 0 3px 0; display: inline-block; }
         .homeContent .linkColumn li a:hover { text-decoration: underline; }
   .homeContent .header { line-height: 35px; text-align: left; padding: 0 0 0 50px; }
      .homeContent .header a { text-decoration: none; color: black; }
         .homeContent .header a:hover { text-decoration: underline; }

.rightBanner { width: 150px; overflow: hidden; background-color: #fff; display: inline-block; vertical-align: top; }
   .rightBanner .oneBanner { width: 148px; float: left; height: auto; background-color: #e1e1e1; border: 1px solid #d1d1d1; }
      .rightBanner .oneBanner .header { width: 140px; line-height: 30px; color: #fff; text-align: left; padding: 0 0 0 10px; box-sizing: content-box; }
   .rightBanner .oneImg { width: 140px; margin: 20px auto; display: block; overflow: hidden; }
      .rightBanner .oneImg img { width: 130px; height: 130px; border: 5px solid #fff; padding: 0; }
      .rightBanner .oneImg:hover { background-color: #fff; }
         .rightBanner .oneImg:hover img { padding: 4px; border: 1px solid #0A5280; }
   .rightBanner .oneBanner .content { line-height: 21px; text-align: left; padding: 0 10px; }
   .rightBanner .oneBanner p { text-align: left; padding: 0 10px; }
      .rightBanner .oneBanner p a { text-decoration: none; }
         .rightBanner .oneBanner p a:hover { color: #fe6243; text-decoration: underline; }
.bgLightGray { background-color: #f2f2f2; }
.btnLeft { width: 15px; height: 25px; border: none; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 0 -480px; cursor: pointer; background-color: Transparent; }
.btnRight { width: 15px; height: 25px; border: none; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 0 -440px; cursor: pointer; background-color: Transparent; }
/*left banner customized start*/
.leftBanner .oneBanner .banner_NoneStyle, .leftBanner .oneBanner .banner_star, .leftBanner .oneBanner .banner_light,
.leftBanner .oneBanner .banner_heart, .leftBanner .oneBanner .banner_calculate, .leftBanner .oneBanner .banner_locate, .leftBanner .oneBanner .banner_picture, .leftBanner .oneBanner .banner_sound, .leftBanner .oneBanner .banner_time { width: 170px; line-height: 30px; text-align: left; border-radius: 3px 3px 0 0; color: #fff; padding: 0 0 0 50px; }
.leftBanner .oneBanner .banner_star { background-image: url(images/system/banner_star.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_light { background-image: url(images/system/banner_light.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_heart { background-image: url(images/system/banner_heart.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_calculate { background-image: url(images/system/banner_calculate.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_locate { background-image: url(images/system/banner_locate.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_picture { background-image: url(images/system/banner_picture.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_sound { background-image: url(images/system/banner_sound.png); background-repeat: no-repeat; background-position: 15px 4px; }
.leftBanner .oneBanner .banner_time { background-image: url(images/system/banner_time.png); background-repeat: no-repeat; background-position: 15px 4px; }
/*left banner customized end*/
/*kiosk start*/
.kiosk { width: 960px; }
   .kiosk .categories { width: 345px; margin: 0 5px 0 0; }
      .kiosk .categories ul, .kiosk .categories ul li { text-align: center; }
      .kiosk .categories .content { padding: 0 5px; overflow: hidden; }
      .kiosk .categories .parent { padding-bottom: 4px; overflow: hidden; text-decoration: none; text-align: left; color: black; font-weight: bold; }
      .kiosk .categories .splitDiv { position: relative; width: 165px; height: 3px; float: left; top: -7px; }
      .kiosk .categories .whiteTriangle { display: block; float: left; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid #fff; position: absolute; left: 20px; }
      .kiosk .categories .blueTriangle { display: block; float: left; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; position: absolute; left: 21px; top: 2px; }
      .kiosk .categories .yellowTriangle { display: block; float: left; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; position: absolute; left: 21px; top: 2px; border-bottom: 8px solid #ffb23e; }
      .kiosk .categories .expandArrow { width: 15px; height: 9px; float: right; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 0 -864px; margin: 10px 20px 0 0; }
      .kiosk .categories .shrinkArrow { width: 15px; height: 9px; float: right; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 0 -890px; margin: 10px 20px 0 0; }
      .kiosk .categories .oneCategory, .kiosk .categories .oneCategorySelected { width: 100%; padding: 10px 0; overflow: hidden; margin: 0 0 2px 0; }
         .kiosk .categories .oneCategorySelected, .kiosk .categories .oneCategory:hover { background: #eee; }
            .kiosk .categories .oneCategory .image_place,
            .kiosk .categories .oneCategorySelected .image_place { display: block; margin: 0 30px; clear: both; cursor: pointer; width: 100px; height: 100px; border-radius: 3px; background-color: #C2C3C4; }
      .kiosk .categories .title { display: inline-block; padding: 40px 0 0 0; clear: both; text-decoration: none; color: #000; line-height: 18px; font-weight: bold; }
      .kiosk .categories .parent:hover, .kiosk .categories .top:hover, .kiosk .categories .bottom:hover { filter: alpha(opacity=80); opacity: 0.8; }

   .kiosk .itemlist { overflow: hidden; }
      .kiosk .itemlist li { width: 160px; height: 260px; float: left; margin: 20px 25px; }
      .kiosk .itemlist .oneBook { height: 260px; background: #fff; position: relative; }

         .kiosk .itemlist .oneBook .oneBookContent { width: 160px; overflow: hidden; cursor: pointer; border: none; border-radius: 3px; }
   .kiosk .image_place { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; }
   /*.kiosk .itemlist .oneBookContent:hover { background: #EEE; }*/
   .kiosk .itemlist .oneBook .oneBookContent .no_image_text,
   .kiosk .itemsNav .itemsNavList .no_image_text { position: absolute; display: block; color: #353535; word-break: break-word; }
   .kiosk .itemlist .oneBook .oneBookContent .k-button { width: 130px; overflow: hidden; height: 2em; line-height: 1.25em; margin: 1px 0; padding-left: 0; padding-right: 0; }
   .kiosk .itemlist .oneBook .oneBookContent .no_image_text { text-align: left; top: 15px; width: 150px; left: 10px; color: #353535; overflow: hidden; max-height: 190px; word-break: break-word; font-size: 14px; /*Last modified by futao 2018-6-6 ver:8.3.7 to add font-size:14px;Leo told me that */ }
   .kiosk .itemsNav .itemsNavList .no_image_text { width: 60px; height: 85px; left: 15px; top: 5px; font-size: 11px; cursor: pointer; word-break: break-word; }
   .kiosk .itemlist .oneBook .materialType { left: 10px; right: 10px; top: 215px; width: 150px; height: 18px; text-align: right; color: #353535; overflow: hidden; font-weight: bold; white-space: nowrap; position: absolute; -ms-word-wrap: normal; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }
   .kiosk .itemlist .oneBook .textPlaceHold { height: 100%; background: #EEEEEE; border-radius: 3px; }
      .kiosk .itemlist .oneBook .textPlaceHold a { color: #000; text-decoration: none; }
         .kiosk .itemlist .oneBook .textPlaceHold a:hover { text-decoration: underline; }
   .kiosk .itemlist .outTag, .kiosk .itemlist .inTag { width: 50px; height: 50px; border-radius: 50%; display: block; position: absolute; top: 200px; left: 130px; z-index: 99; margin: 0 -40px -40px 0; text-align: center; font-size: 20px; font-weight: bold; overflow: hidden; line-height: 50px; color: #fff; }
   .kiosk .itemlist .outTag { background-color: #E4333F; }
   .kiosk .itemlist .inTag { background-color: #42B749; }
   .kiosk .itemlist li img { width: 160px; height: 240px; border-radius: 3px; }
   .kiosk .itemlist .bottomText { display: block; width: 160px; line-height: 20px; height: 20px; background: #fff; overflow: hidden; text-align: left; font-weight: bold; }
      .kiosk .itemlist .bottomText a { color: #000; text-decoration: none; }
         .kiosk .itemlist .bottomText a:hover { text-decoration: underline; }

   .kiosk .itemlist .summary { background-color: #EEE; }
      .kiosk .itemlist .summary span { display: block; text-align: left; line-height: 22px; margin: 0px 8px; }
      .kiosk .itemlist .summary .titlelink { display: block; text-align: left; height: 16px; overflow: hidden; line-height: 16px; padding: 0 8px; text-decoration: underline; background-color: transparent; color: #333; width: auto; }
         .kiosk .itemlist .summary .titlelink:hover { text-decoration: none; }
      .kiosk .itemlist .summary p { margin: 1px 0; }
      .kiosk .itemlist .summary .desc { line-height: 12px; font-size: 11px; }

   .kiosk .itemsBorder .kioskli { width: 250px; height: auto; float: left; padding: 0; margin: 10px 15px; }
   .kiosk .itemsBorder .kioskImgDiv { float: left; background-color: #E9F2F5; cursor: pointer; width: 250px; height: 200px; border-radius: 3px; }
      .kiosk .itemsBorder .kioskImgDiv .kioskP { text-align: center; display: table-cell; vertical-align: middle; height: 166px; }
      /*.kiosk .itemsBorder .kioskImgDiv .kioskImg { max-width: 100px; max-height: 70px; }*/
      .kiosk .itemsBorder .kioskImgDiv span { padding: 6px 0; overflow: hidden; display: block; text-align: center; width: 250px; background-color: #e9f1f5; font-weight: 700; }
      .kiosk .itemsBorder .kioskImgDiv:hover span { font-weight: 700; }
      .kiosk .itemsBorder .kioskImgDiv .kioskP .kioskImg { border-radius: 3px; }

   .kiosk .itemsNav { width: 960px; }
      .kiosk .itemsNav .leftBanner,
      .kiosk .itemsNav .rightBanner { width: 34px; height: 113px; float: left; cursor: pointer; }
      .kiosk .itemsNav .leftBanner { border-radius: 5px 0 0 5px; }
      .kiosk .itemsNav .rightBanner { border-radius: 0 5px 5px 0; }
      .kiosk .itemsNav .leftBanner .leftTriangle { border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin: 45px 0 0 10px; float: left; border-right: 13px solid #fff; }
      .kiosk .itemsNav .rightBanner .rightTriangle { border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid #fff; margin: 45px 0 0 10px; float: left; }
      .kiosk .itemsNav .itemsNavList { float: left; width: 884px; height: 101px; padding: 5px 2px 5px 8px; overflow: hidden; }
         .kiosk .itemsNav .itemsNavList ul { height: 100px; }
            .kiosk .itemsNav .itemsNavList ul li { width: 84px; padding: 0 0 0 4px; float: left; position: relative; }
               .kiosk .itemsNav .itemsNavList ul li img { width: 75px; height: 100px; cursor: pointer; }
               .kiosk .itemsNav .itemsNavList ul li .navItemSelected img { border: 1px solid #ff0000; width: 73px; height: 98px; }
         .kiosk .itemsNav .itemsNavList .no_image_text:hover { color: #1765a9; }
      .kiosk .itemsNav .navButton, .kiosk .itemsNav .navButtonDisabled { display: block; width: 34px; height: 113px; cursor: pointer; position: absolute; filter: alpha(opacity=0); opacity: 0; }
      .kiosk .itemsBorder .navButton:hover, .kiosk .itemsNav .navButtonDisabled { filter: alpha(opacity=50); opacity: 0.5; }
/*kiosk end*/

/*myFavoritesKids start  zhangzehua add,2017-06-21,Ver:8.1.0*/
.myFavoritesKids { width: 730px; }
   .myFavoritesKids .itemsBorder, .myFavoritesKids .itemsNav { display: block; width: 726px; height: 315px; border-radius: 5px; border: 1px solid #0A5280; background: #dbf0fa; }
   .myFavoritesKids .itemlist { width: 638px; height: 280px; float: left; display: block; margin: 25px 0 0 0; overflow: hidden; }
      .myFavoritesKids .itemlist li { width: 200px; height: 280px; float: left; padding: 0 0 0 20px; box-sizing: content-box; }
      .myFavoritesKids .itemlist .oneBook { width: 170px; height: 260px; position: relative; padding: 2px; border: 1px solid #858585; background: #fff; box-shadow: 3px 3px 12px #888; margin-left: 15px; box-sizing: content-box; }
         .myFavoritesKids .itemlist .oneBook .oneBookImg { width: 170px; height: 235px; overflow: hidden; cursor: pointer; }

            .myFavoritesKids .itemlist .oneBook .oneBookImg .no_image_text,
            .myFavoritesKids .itemsNav .itemsNavList .no_image_text { position: absolute; display: block; color: #353535; word-break: break-word; }

            .myFavoritesKids .itemlist .oneBook .oneBookImg .no_image_text { text-align: left; top: 15px; width: 150px; left: 10px; color: #353535; overflow: hidden; max-height: 190px; height: 190px; word-break: break-word; }
   .myFavoritesKids .itemsNav .itemsNavList .no_image_text { width: 60px; height: 85px; left: 15px; top: 5px; font-size: 11px; cursor: pointer; word-break: break-word; }

   .myFavoritesKids .itemlist .oneBook .materialType { left: 10px; right: 10px; top: 215px; width: 150px; height: 18px; text-align: right; color: #353535; overflow: hidden; font-weight: bold; white-space: nowrap; position: absolute; -ms-word-wrap: normal; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }

   .myFavoritesKids .itemlist .outTag, .myFavoritesKids .itemlist .inTag { width: 46px; height: 50px; display: block; position: absolute; top: 230px; left: 140px; z-index: 99; margin: 0 -40px -40px 0; background-image: url(images/system/button04.png); background-repeat: no-repeat; text-align: center; font-size: 18px; overflow: hidden; line-height: 45px; color: #fff; }
   .myFavoritesKids .itemlist .outTag { background-position: 0 0; }
   .myFavoritesKids .itemlist .inTag { background-position: 0 -49px; }
   .myFavoritesKids .itemlist li img { width: 170px; height: 235px; }
   .myFavoritesKids .itemlist .callno { display: block; width: 140px; line-height: 25px; height: 25px; float: left; background: #fff; overflow: hidden; text-align: left; padding: 0 0 0 30px; font-size: 16px; color: #333; background-image: url(images/system/icons.png); background-repeat: no-repeat; background-position: 3px -915px; }
   .myFavoritesKids .itemlist .summary { display: block; width: 150px; height: 211px; border: 2px solid #0A5280; color: #333; margin: 10px 0 10px 8px; overflow: hidden; cursor: pointer; }
      .myFavoritesKids .itemlist .summary span { display: block; text-align: left; height: 18px; overflow: hidden; line-height: 18px; padding: 0 8px; }
      .myFavoritesKids .itemlist .summary p { margin: 5px 0; }
      .myFavoritesKids .itemlist .summary .desc { line-height: 12px; font-size: 11px; height: 60px; }
   .myFavoritesKids .itemsBorder .btnLeft, .myFavoritesKids .itemsBorder .btnLeftDisabled { display: block; width: 44px; height: 79px; border-radius: 0 60px 60px 0; background: #0A5280 url(images/system/left-arrow-03.png) no-repeat -14px 8px; background-size:60px; float: left; margin: 110px 0 0 0; z-index: 100; }
   .myFavoritesKids .itemsBorder .btnRight, .myFavoritesKids .itemsBorder .btnRightDisabled { display: block; width: 44px; height: 79px; border-radius: 60px 0 0 60px; background: #0A5280 url(images/system/right-arrow-03.png) no-repeat -2px 8px; background-size: 60px; float: left; margin: 110px 0 0 0; z-index: 100; }
   .myFavoritesKids .itemsBorder .btnLeft .arrow, .myFavoritesKids .itemsBorder .btnLeftDisabled .arrow { border: 2px solid white; border-width: 0 0 3px 3px; width: 22px; height: 22px; display: inline-block; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); }
   .myFavoritesKids .itemsBorder .btnRight .arrow, .myFavoritesKids .itemsBorder .btnRightDisabled .arrow { border: 2px solid white; border-width: 3px 3px 0 0; width: 22px; height: 22px; display: inline-block; transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0); }
   .myFavoritesKids .itemsBorder .btnLeft:hover, .myFavoritesKids .itemsBorder .btnRight:hover, .myFavoritesKids .itemsBorder .btnLeftDisabled, .myFavoritesKids .itemsBorder .btnRightDisabled { filter: alpha(opacity=70); opacity: 0.7; }

   .myFavoritesKids .itemsBorder .myFavoritesKidsli { width: 117px; height: 120px; float: left; padding: 0; }
   .myFavoritesKids .itemsBorder .myFavoritesKidsImgDiv { width: 110px; height: 113px; float: left; background-color: #fff; border: 1px solid #ccc; margin: 1px; cursor: pointer; }
      .myFavoritesKids .itemsBorder .myFavoritesKidsImgDiv .myFavoritesKidsP { width: 110px; height: 75px; text-align: center; display: table-cell; vertical-align: middle; }
      .myFavoritesKids .itemsBorder .myFavoritesKidsImgDiv .myFavoritesKidsImg { max-width: 100px; max-height: 70px; }
      .myFavoritesKids .itemsBorder .myFavoritesKidsImgDiv span { height: 32px; overflow: hidden; display: block; text-align: center; width: 112px; }
      .myFavoritesKids .itemsBorder .myFavoritesKidsImgDiv:hover span { color: #ff0000; }

   .myFavoritesKids .itemsNav { width: 730px; }
      .myFavoritesKids .itemsNav .leftBanner,
      .myFavoritesKids .itemsNav .rightBanner { width: 34px; height: 113px; float: left; cursor: pointer; }
      .myFavoritesKids .itemsNav .leftBanner { border-radius: 5px 0 0 5px; }
      .myFavoritesKids .itemsNav .rightBanner { border-radius: 0 5px 5px 0; }
      .myFavoritesKids .itemsNav .leftBanner .leftTriangle { border-top: 8px solid transparent; border-bottom: 8px solid transparent; margin: 45px 0 0 10px; float: left; border-right: 13px solid #fff; }
      .myFavoritesKids .itemsNav .rightBanner .rightTriangle { border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid #fff; margin: 45px 0 0 10px; float: left; }
      .myFavoritesKids .itemsNav .itemsNavList { float: left; width: 652px; height: 101px; padding: 5px 2px 5px 8px; overflow: hidden; }
         .myFavoritesKids .itemsNav .itemsNavList ul { height: 100px; }
            .myFavoritesKids .itemsNav .itemsNavList ul li { width: 84px; padding: 0 0 0 4px; float: left; position: relative; box-sizing: content-box; }
               .myFavoritesKids .itemsNav .itemsNavList ul li img { width: 75px; height: 100px; cursor: pointer; }
               .myFavoritesKids .itemsNav .itemsNavList ul li .navItemSelected img { border: 1px solid #ff0000; width: 73px; height: 98px; }
         .myFavoritesKids .itemsNav .itemsNavList .no_image_text:hover { color: #1765a9; }
      .myFavoritesKids .itemsNav .navButton, .myFavoritesKids .itemsNav .navButtonDisabled { display: block; width: 34px; height: 113px; cursor: pointer; position: absolute; filter: alpha(opacity=0); opacity: 0; }
      .myFavoritesKids .itemsBorder .navButton:hover, .myFavoritesKids .itemsNav .navButtonDisabled { filter: alpha(opacity=50); opacity: 0.5; }
/*myFavoritesKids end*/

.shelfListDiv { width: 883px; min-height: 532px; overflow: hidden; }
   .shelfListDiv ul { display: block; float: left; margin: 7px 0 0 0; }
   .shelfListDiv li { width: 110px; float: left; }
   .shelfListDiv .shelfListCallNo { width: 110px; padding: 0 5px; word-break: break-all; height: 30px; display: block; overflow: hidden; color: #333; }
   .shelfListDiv .imgDiv { width: 90px; height: 108px; display: block; position: relative; margin: 0 10px; background: #fff; border: 1px solid #858585; padding: 3px; }
   .shelfListDiv .imgDiv a { position: relative; }
   .shelfListDiv ul li img { width: 82px; height: 100px; display: block; }
   .shelfListDiv .imgDiv .tag { position: absolute; display: block; top: 0; left: 0; width: 50px; height: 35px; margin: -2px -5px; text-align: left; color: #fff; }
   .shelfListDiv .imgDiv .outTag { background-image: url(images/system/inout.png); background-repeat: no-repeat; background-position: 0 0; font-size: 11px; padding: 2px 0 0 3px; }
   .shelfListDiv .imgDiv .inTag { background-image: url(images/system/inout.png); background-repeat: no-repeat; background-position: 0 -39px; font-size: 14px; padding: 0 0 0 3px; }
   .shelfListDiv .sperateLine { width: 895px; height: 10px; display: block; float: left; background: #f18431; border: 1px solid #000; border-left: none; border-right: none; margin: 4px 0 0 0; }
.shelfListButtons { width: 882px; height: 46px; text-align: center; padding: 5px 0 0 0; }
.shelfListDiv .shelfListLocation { width: 110px; margin-left: 8px; word-break: break-all; height: 12px; display: block; overflow: hidden; color: #333; }

/*tooltip start*/
.tooltipDiv { width: 350px; height: 176px; margin:10px 0 0 0; text-align: left; font-size: 12px; background-color: #dbf0fa; border: 1px solid #0A5280; border-width: 0px 5px 5px 5px; border-radius: 5px; } 
   .tooltipDiv * { box-sizing: content-box; }
   .tooltipDiv .tooltipHeader {   height: 26px; display: block; overflow: hidden; line-height: 25px; color: #fff; text-align: center; font-weight: bold; padding: 3px 0 0 0; box-sizing: content-box; }
   .tooltipDiv .tooltipLeft { width: 275px; height: 115px; float: left; box-sizing: content-box; border-bottom: 1px solid #0A5280; }
   .tooltipDiv .tooltipTitle { width: 270px; height: 22px; line-height: 22px; overflow: hidden; font-weight: bold; clear: both; display: block; padding: 0 0 0 5px; }
   .tooltipDiv .tooltipAvailable { width: 270px; height: 20px; line-height: 20px; overflow: hidden; clear: both; display: block; padding: 0 0 0 5px; color: #333; }
   .tooltipDiv .tooltipDesc { width: 265px; height: 55px; line-height: 16px; overflow: hidden; clear: both; display: block; color: #333; padding: 3px 5px 0 5px; font-size: 11px; }
   .tooltipDiv .tooltipRight { width: 75px; height: 115px; overflow: hidden; float: left; box-sizing: content-box; margin: 0 0 0 0; border-bottom: 1px solid #0A5280; }
   .tooltipDiv .tooltipCallno { width: 69px; height: 22px; overflow:hidden;text-overflow:ellipsis;white-space:nowrap; display: block; float: left; text-align: center; line-height: 22px; margin: 0 0 5px 0; padding: 0 3px; }
   .tooltipDiv .tooltipRight img { width: 60px; height: 70px; border: 1px solid #ccc; box-sizing: content-box; padding: 2px; margin: 0 0 0 5px; }
   .tooltipDiv .tooltipTags { width: 195px; height: 30px; display: block; line-height: 30px; overflow: hidden; border-right: 1px solid #0A5280; float: left; box-sizing: content-box; background: url(images/system/tags.png) no-repeat 5px 8px; padding: 0 0 0 30px; font-size: 12px; }
      .tooltipDiv .tooltipTags a { color: #333; }
         .tooltipDiv .tooltipTags a:hover { text-decoration: none; }

   .tooltipDiv .tooltipMore { width: 123px; height: 30px; display: block; line-height: 30px; overflow: hidden; float: left;   box-sizing: content-box; }
      .tooltipDiv .tooltipMore a { display: block; float: left; font-size: 13px; text-decoration: none; font-weight: bold; }
/*tooltip end*/
.button01 { width: 40px; height: 40px; border-radius: 50%; cursor: pointer;; background: #0A5280 url(images/system/left-arrow-02.png) no-repeat 4px 4px; background-size: 32px; }
.button02 { width: 40px; height: 40px; border-radius: 50%; cursor: pointer; background: #0A5280 url(images/system/right-arrow-02.png) no-repeat 4px 4px; background-size: 32px; }
   .button01:hover, .button02:hover { filter: alpha(opacity=70); opacity: 0.7; } 
 
/*item detail start*/
.sideBar { width: 214px; height: auto; background-color: white; min-height: 266px; float: left; border: 1px solid #e3e3e3; border-radius: 5px; color: #333; text-align: left; padding: 0 0 10px 0; }
   .sideBar a { text-decoration: underline; }
      .sideBar a:hover { text-decoration: underline; }
   .sideBar .sideBarLabel { padding: 10px 10px 6px 10px; font-weight: bold; }
   .sideBar .sideBarText { padding: 0 10px 0 20px; font-size: 12px; line-height: 20px; word-wrap: break-word; word-break: normal; }
/*add by futao 2014-4-3 ver:6.4.0*/
.itemDetailContent { width: 728px; display: block; float: left; padding: 0 0 0 16px; }
   .itemDetailContent .itemImageSide { width: 178px; height: auto; display: block; float: left; padding: 0 10px 0 0; }
   .itemDetailContent .itemImageCover { width: 170px; height: 230px; display: block; vertical-align: middle; margin: 0 0 15px 0; border: 1px solid #e3e3e3; }
      .itemDetailContent .itemImageCover img { vertical-align: middle; display: inline-block; }
   .itemDetailContent .itemImageSide span { display: block; float: left; line-height: 20px; }
   .itemDetailContent .itemImageSide .shareImg { display: block; margin: 0 0 0 10px; float: left; }
   .itemDetailContent .itemDetailSide { width: 540px; height: auto; display: block; float: left; }
      .itemDetailContent .itemDetailSide .itemHeader { display: block; float: left; line-height: 24px; font-size: 18px; padding: 0 0 5px 0; font-weight: bold; word-wrap: break-word; word-break: normal; width: 540px; text-align: left; }
      /*add by futao 2014-5-6 ver:6.4.0*/

      .itemDetailContent .itemDetailSide .itemMessageBox { width: 540px; display: block; float: left; padding: 3px 0 0 0; text-align: left; border-bottom: 1px solid #e3e3e3; min-height: 10px; }
      .itemDetailContent .itemDetailSide .infoBox { width: 486px; display: block; float: left; }
         .itemDetailContent .itemDetailSide .infoBox .showLeft { display: block; float: left; line-height: 28px; color: #999; margin-right: 5px; }
         .itemDetailContent .itemDetailSide .infoBox .showRight { display: block; float: left; line-height: 28px; color: #444; }
            .itemDetailContent .itemDetailSide .infoBox .showRight .startLevel { width: 70px; height: 12px; display: block; float: left; background-image: url(images/system/star1.gif); background-repeat: repeat-x; background-position: 0 0; margin: 6px 10px 0 0; }
            .itemDetailContent .itemDetailSide .infoBox .showRight .startLevelInner { width: 28px; height: 12px; display: block; float: left; background-image: url(images/system/star0.gif); background-repeat: repeat-x; background-position: 0 0; }
      .itemDetailContent .itemDetailSide .summary { width: 460px; display: block; float: left; text-align: left; line-height: 20px; }
   .itemDetailContent .c1 { display: block; line-height: 24px; float: left; color: #999; }
   .itemDetailContent .c2 { color: #444; }
   .itemDetailContent .c3 { display: inline; line-height: 24px; font-weight: bold; color: #5b9630; }
   .itemDetailContent .c4 { display: inline; line-height: 24px; color: #dc0000; }
   .itemDetailContent .c5 { width: 460px; display: block; float: left; text-align: left; line-height: 20px; }
      .itemDetailContent .c5 a { text-decoration: none; }
         .itemDetailContent .c5 a:hover { text-decoration: underline; }

   .itemDetailContent .copiesTable { width: 726px; float: left; margin-top: 20px; }
      .itemDetailContent .copiesTable table { border-collapse: collapse; }
      .itemDetailContent .copiesTable tr { border-top: 1px dashed #d8d7d7; }
      .itemDetailContent .copiesTable td, .copiesTable th { padding: 4px 0 4px 0; text-align: left; }
   .itemDetailContent .panelHeader { width: 716px; display: block; float: left; line-height: 40px; background-color: #e7e7e7; font-weight: bold; border: 1px solid #cac3bf; text-align: left; color: #404040; font-size: 14px; padding: 0 0 0 10px; }
   .itemDetailContent .panelContent { width: 726px; display: block; float: left; border: 1px solid #d8d7d7; border-top: none; color: #444; }
      .itemDetailContent .panelContent table { border-collapse: collapse; }
      .itemDetailContent .panelContent tr { border-top: 1px solid #f3f3f3; }
      .itemDetailContent .panelContent td { text-align: left; padding: 0px 5px 0px 10px; line-height: 20px; }
   .itemDetailContent .reviewBox { display: block; float: left; width: auto; border-bottom: 1px dashed #dcdcdc; text-align: left; }
      .itemDetailContent .reviewBox .reviewInner { display: block; float: left; width: 696px; padding: 5px 0 3px 0; word-wrap: break-word; word-break: normal; }
      /*add by futao 2014-4-3 ver:6.4.0*/
      .itemDetailContent .reviewBox .userInfo { width: auto; display: inline-block; float: left; }
      .itemDetailContent .reviewBox .reviewLabel { display: inline-block; color: #666; float: left; padding: 0 10px 0 0; }
      .itemDetailContent .reviewBox .reviewText { display: inline-block; color: #444; float: left; width: 500px; }
      /*modified by futao 2014-4-3 ver:6.4.0 add width:500px;*/
      .itemDetailContent .reviewBox .reviewDate { width: 100px; display: inline-block; color: #666; float: right; text-align: right; }
      .itemDetailContent .reviewBox .reviewRateBox { width: 80px; height: 15px; display: inline-block; background-image: url(images/system/start03.png); background-repeat: repeat-x; background-position: 0 0; }
      .itemDetailContent .reviewBox .reviewRateInner { width: 64px; height: 15px; display: inline-block; background-image: url(images/system/start04.png); background-repeat: repeat-x; background-position: 0 0; }
      .itemDetailContent .reviewBox .reviewDesc { display: inline-block; padding: 8px 0 0 0; margin: 3px 0 0 0; line-height: 20px; color: #000; border-top: 1px dashed #dcdcdc; }
.sideBar h4 { font-size: 15px; font-weight: 400; color: #fff; line-height: 30px; border-radius: 5px 5px 0 0; margin: 0; border-bottom: 1px solid #e0e0e0; }
.itemDetailGoBack { width: 204px; height: auto; float: left; text-align: left; font-size: 13px; }
.itemDetailNavbtn { width: 734px; height: auto; float: left; text-align: right; font-size: 14px; }
.itemDetailNav a, .itemDetailNav a:hover { text-decoration: underline; }
.itemDetailTool1 { width: 450px; height: auto; padding: 5px; float: left; margin-left: 20px; margin-top: 10px; }
.itemDetailTool2 { width: 450px; height: auto; padding: 5px; float: left; margin-left: 20px; margin-bottom: 20px; }
.itemDetailTool3 { width: 450px; height: auto; padding: 5px; float: left; margin-bottom: 40px; }

.itemDetailTool1 li { float: left; width: 140px; vertical-align: middle; text-align: left; margin-bottom: 10px; }
.itemDetailTool2 li { float: left; width: 125px; vertical-align: middle; text-align: left; }
.itemDetailTool3 li { float: left; margin-right: 5px; vertical-align: middle; text-align: left; }
.itemDetailTool3 .shareImg { display: block; margin: 0 0 0 10px; float: left; }
.itemDetailTool3 .sideBarText { padding-bottom: 3px; }
.MediumType { width: 530px; display: block; float: left; font-size: 12px; text-align: left; }

.copiesTable .sideBarLabel { padding: 10px 10px 6px 10px; font-weight: bold; }
.copiesTable .sideBarText { padding: 0 10px 0 20px; font-size: 12px; line-height: 20px; word-wrap: break-word; word-break: normal; }
/*add by futao 2014-4-3 ver:6.4.0*/

.itemDetailInSomeLocations { width: 695px; display: block; float: left; padding: 1px; }
   .itemDetailInSomeLocations .copiesTable { width: 100%; float: left; border: none; }
      .itemDetailInSomeLocations .copiesTable table { border-collapse: collapse; }
      .itemDetailInSomeLocations .copiesTable tr { border-top: 1px dashed #d8d7d7; }
      .itemDetailInSomeLocations .copiesTable td, .copiesTable th { padding: 4px 0 4px 0; text-align: left; }

   .itemDetailInSomeLocations .c31 { background-color: #99CC33; }
   .itemDetailInSomeLocations .c4 { display: inline; line-height: 24px; color: #dc0000; }

/*RoomBooking*/
.cellDateSelected_Room .k-nav-day, .MediaSelectedCalendar .k-nav-day, .calendarPlus .k-state-selected { background-color: #007bc2; color: #fff; border-radius: 12px; width: 24px; height: 24px; display: inline-block; line-height: 24px; }

#iframeItemDetailTabs { width: 728px; }
/*Gridview start add by duanhanlin 2014-4-28 version:6.4.0*/
.ErrorMessage { color: #b60000; }

/*add by futao 2014-6-12 ver:6.4.0*/
.AuthrityMessage { font-weight: bold; font-size: 13px; }
.AuthrityMessage2 { color: red; }
.SpellCheck { border: 2px solid #1a6aa3; background: #cce7fc; }
.group-li-checkbox { display: block; position: relative; cursor: pointer; font-size: 13px; height: 22px; overflow: hidden; }
.group-inline { display: inline-block; margin: 2px 3px 0px 3px; }
.group-checkbox-hide { opacity: 0; position: absolute; }

.confirmImg { background: transparent no-repeat top left; background-image: url('images/system/icon-question.gif'); }
.alertImg { background: transparent no-repeat top left; background-image: url('images/system/icon-info.gif'); }

#txtSearchData:enabled:not([readonly]):focus { background-clip: content-box !important; background-color: #f0f0f0 !important; }
.flexlayout { display: flex; display: -webkit-flex; }
.flexlayout > * { min-width: 0; }
.flexlayoutcol { display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; }
.flexlayoutcol > * { min-height: 0; }
.immbookingholiday { background-color: #e3e3e3 !important; border-color: #e3e3e3 !important; }

.itemDetailContent .tabPanels { width: 728px; height: 31px; display: block; float: left; background-color: #fff; border-bottom: 1px solid #a5a5a5; padding-bottom: 3px; box-sizing: content-box; }
   .itemDetailContent .tabPanels .base { border-radius: 4px; margin: 0 0.5em; font-size: 13px; display: inline-block; padding: 8px 13px; text-decoration: none; font-weight: bold; }
      .itemDetailContent .tabPanels .base:first-child { margin-left: 0; }

.loginIcon { background: url(images/system/login2.png) no-repeat #005486; display: block; width: 34px; height: 34px; background-size: 34px; border-radius: 50%; }
.userIcon { background: url(images/system/user2.png) no-repeat #005486; display: block; width: 24px; height: 24px; background-size: 24px; border-radius: 50%; }
.btnExpandIconButton, .btnShrinkIconButton { background: none; width: 40px; }
   .btnExpandIconButton .btnSprite { display: inline-block; content: " "; height: 6px; width: 6px; border-width: 0 0 2px 2px; border-color: #2F2F2F; border-style: solid; transform: matrix(-0.9, -0.9, -0.9, 0.9, 0, 0); }
   .btnShrinkIconButton .btnSprite { display: inline-block; content: " "; height: 6px; width: 6px; border-width: 0 0 2px 2px; border-color: #2F2F2F; border-style: solid; transform: matrix(-0.9, 0.9, -0.9, -0.9, 0, 0); }
.LoadingDIV { background-image: url('../../Images/loading.gif'); }

input:autofill,
input:-webkit-autofill,
input:autofill:focus,
input:-webkit-autofill:focus { transition: background-color 0s 600000s, color 0s 600000s !important; }

.k-checkbox-wrap:has(:disabled.k-checkbox) + .k-checkbox-label { color: #777; cursor: not-allowed; pointer-events: all !important; }
.k-radio-wrap:has(:disabled.k-radio) + .k-radio-label { color: #777; cursor: not-allowed; pointer-events: all !important; }
.k-button:disabled, .k-button.k-disabled, .k-button:disabled:hover, .k-button.k-disabled:hover { cursor: not-allowed !important; pointer-events: all !important; }
:root { --kendo-font-size: 1rem; }
.k-clear-value { display: none !important; }
.k-tabstrip-content, .k-tabstrip > .k-content { border: none; }
.k-tabstrip-content:focus, .k-tabstrip-content.k-focus, .k-tabstrip > .k-content:focus, .k-tabstrip > .k-content.k-focus { outline: none; }
.k-tabstrip-top > .k-tabstrip-items-wrapper { border-bottom: 1px solid #a5a5a5; padding-bottom: 3px; }
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item { margin: 0 0.5em; border-radius: 0.35em; color: var(--kendo-color-on-app-surface, #424242); }
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item:first-child { margin-left: 0; }
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item:last-child { margin-right: 0; }
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item .k-link { font-size: 1.08rem; font-weight: bold; }
.k-table-thead, .k-table-header, .k-table-group-sticky-header, .k-window-title { font-size: 1.08rem; font-weight: bold; }
.k-treeview-leaf.k-selected { background-color: #dfe8f6; color: #424242; }
.k-checkbox-md { width: 1.2rem; height: 1.2rem; }
.k-checkbox-md::before { font-size: var(--kendo-spacing-4\.5, 1.125rem); }
.k-ripple-container .k-checkbox-md::after { width: 300%; height: 300%; }
.k-radio-md { width: 1.25rem; height: 1.25rem; }
.k-radio-md::before { font-size: 1.125rem; }
.k-ripple-container .k-radio-md::after { width: 300%; height: 300%; }
.k-grid td a, .k-grid .k-table-td a { text-decoration: underline; }
.k-disabled [disabled], .k-disabled .k-disabled, .k-widget[disabled] [disabled], .k-widget[disabled] .k-disabled { cursor: not-allowed !important; pointer-events: all !important; }
.k-input.k-textbox.k-disabled { color: black; }
