header { display: flex; justify-content: space-between; align-items: center; } body.books-body { width: 65%; font-size: .8em; } canvas#the-pdf { width: 100%; } header ul { padding: 0px; display: flex; align-items: center; } header ul li { list-style-type: none; margin-right:17px; } header .lite-logo { width:25%; } .lite-logo IMG { width:100%; } #logo { width: 200px; } body { width: 80%; margin: 0px auto; margin-top: 2%; background: #f5f5f5; padding: 0px!important; } h1 { font-size: 1.4em; text-align: center; } #brand_title{ color: #4e4f55; text-decoration:none; text-transform: uppercase; } #page_title{ color: #4e4f55; text-decoration:underline; letter-spacing: 0.3px; } #redb{ color: red; } #the-canvas{ width:100%; } #redi{ color: red; text-transform: lowercase; font-style: italic; font-size: 1.5em; font-weight: bold; } #auth a { color: #4d4e55; font-size:1em; font-weight:bold; letter-spacing: 0.3px; text-transform: uppercase; } #lk-menu { display:flex; justify-content: start; align-items: center; margin: 15px 0px 20px; } #lk-menu #menu_category, #lk-menu #menu_category ul { padding: 0px; } #lk-menu #menu_category ul { margin: 0px; } #lk-menu div, .header-div { margin-right: 15px; padding: 10px; background: white; border: 1px solid #b1bad0; border-radius: 9px; font-weight: bold; } #lk-menu div p, #lk-menu div a, .header-div a { margin:0px; color: #4d4e55; } #menu_category ul { border-radius: 9px; } #menu_category ul li { margin: 0px; list-style-type: none; float: left; background: #7f7f7f; } #menu_category ul li:first-child{ border-radius: 9px 0px 0px 9px; } #menu_category ul li:last-child{ border-radius: 0px 9px 9px 0px; } #menu_category ul li.active { background: #69c; padding: 10px 20px; } #menu_category ul li a, #menu_category ul li { color:white; padding: 5px 10px; display: block; } #lk-menu #years { padding: 0px; } #lk-menu #years .fas { position: relative; right: 4px; top: 2px; } #year_filter, #pages { border: 0px; background: white; color: #4d4e55; font-weight: bold; font-size: 1em; -ms-appearance: none; appearance: none; -moz-appearance: none; -webkit-appearance: none; font-family: times; padding: 10px; border-radius: 9px; cursor: pointer; margin-right: -7px; outline: none; } #year_filter::-ms-expand, #pages::-ms-expand { display: none; } #pages { padding: 2px 4px; color: #2c2e36; } #downloadtitle{ width: 100%; display: flex; height: 50px; align-items: center; justify-content: center; font-weight: bold; font-size: 1.1em; margin: 0px auto; box-sizing: border-box; } #downloadtitle a, #downarrow{ color: #2c2f36; text-transform: uppercase; } #downarrow { padding: 8px; } #stuff-bar { display: flex; align-items: center; width: 100%; height: 50px; background: #2c2e36; margin: 0px auto; color: white; font-size: 1.4em; justify-content: center; } #stuff-bar a { color: white; } #zoomnav, #pagenav { width: 45%; display: flex; justify-content: center; align-items: center; } #zoomnav div, #pagenav div { margin-right: 15px; } #zoomnav span { cursor: pointer; } #currpage { background: white; color: #2c2e36; padding: 2px 10px; border-radius: 8px; font-weight: bold; font-size: 1.3em; } #currpage i { font-size: .5em; position: relative; bottom: 2px; } .firstpage { background: white; border-radius: 31px; padding: 3px 4px; font-size: .9em; text-align: center; margin-right: 10px!important; } .firstpage i { color: #2c2e36; } #pdfprogress { text-align: center; font-weight: bold; margin: 20px; font-size: 1.2em; } .book_small{ position:relative; } #container_form { width: 100%; margin-top: 10%; text-align: center; } #form_title{ font-size: 18px; } #container_form p { font-size: 1.3em; margin-bottom: 8px; display: flex; font-weight: bold; color: #181716; } input[type="email"],input[type="password"]{ background: #fff; transition: all 800ms; width: calc(100% - 50px); border-radius: 3px 0 0 3px; border: solid 1px #ccc; border-right: none; outline: none; color: #999; height: 37px; line-height: 35px; display: inline-block; padding-left: 10px; font-size: 16px; box-sizing: border-box; } #container_form span.icon { width: 50px; transition: all 800ms; justify-content: center; color: #999; border-radius: 0 3px 3px 0; background: #e8e8e8; display: flex; border: solid 1px #ccc; border-left: none; font-size: 25px; box-sizing: border-box; align-items: center; } .submit { padding: 13px 30px; margin: 5px 0 20px 0; font-size: 15px; color: #fff; background-color: #69c; border: none; cursor: pointer; } .submit:hover{ transition: all 0.5s; background: #fff; color: #2c536c; } .lib_container { display: flex; flex-direction: row; justify-content: left; flex-wrap: wrap; } .book_skeleton { width:25%; margin-bottom: 30px; margin-top: 30px; } .book_mini { width: 60%; background: white; border-radius: 7px; border: 1px solid #cdd8e2; text-align: center; font-weight: bold; padding: 2px; box-sizing: border-box; } .book_mini img{ width:100%; border-radius: 7px 7px 0px 0px; } .book_mini p{ color: #4d4e55; text-decoration: underline; letter-spacing: 0.3px; } #info { margin-top: 5%; font-weight: bold; font-size: 1.2em; text-align:center; width: 100%; } #info span { width: 100%; display: block; margin-top: 20px; font-size: 1.2em; } #info span a { color:#065eb5; } #error { color: red; font-weight: bold; text-align: center; margin-top: 5%; font-size: 1.2em; } @media screen and (max-width: 1260px) { .book_skeleton{ margin-top: 20px; } .book_mini{ width: 70%; font-size: .9em; } } #an_text_block{ padding: 10px; background-color: white; font-size: 1.2em; line-height: 26px; } .antitle{ text-transform: uppercase; font-weight: bold; font-size: 1.1em; } .antext{ margin-bottom: 8px; border-bottom: 4px solid black; } .anphoto { width: 50.5%; float: left; margin: 0px; margin-right: 25px; } .anphoto IMG { width: 100%; margin: 0px; display: block; } @media screen and (max-width: 1100px) { .book_skeleton{ margin-top: 15px; } #logo { width: 170px; } header { font-size: .9em; } #pages { font-size: .9em; } } @media screen and (max-width: 1000px) { .book_mini{ width: 75%; } .book_skeleton{ margin-top: 10px; } header .lite-logo { width: 30%; } #logo { width: 150px; } header, #lk-menu { font-size: .8em; } } @media screen and (max-width: 768px) { #pages { font-size: .8em; } header .lite-logo { width: 35%; } .book_skeleton{ width: 50%; } .book_mini{ width: 75%; } #logo { width: 125px; } header, #lk-menu { font-size: .7em; } header ul li { margin-right: 6px; } .header-div, #lk-menu div { padding: 6px; margin-right: 6px; } #menu_category ul li, #menu_category ul li.active { padding: 6px 10px; } #menu_category ul li a { padding: 0px; } #year_filter { padding:6px; margin-right: 0px; } #zoomnav, #pagenav { width: 100%; font-size: 1.3em; } .firstpage{ margin-right: 15px!important; } #an_text_block { font-size: 1em; line-height: 23px; } #zoomnav div, #pagenav div { margin-right: 15px; } } @media screen and (max-width: 560px) { #pages { font-size: .7em; } body { width:90%; } header .lite-logo { width: 45%; } #brand_title, #page_title { font-size: .8em; } #downloadtitle { font-size: .75em; padding: 10px; line-height: 16px; text-align: center; } .adv, .mob-hidden { display:none; } #stuff-bar { font-size: 1.25em; } #info, #info span { font-size: 1em; } #logo, .mob-full { width: 83%; margin: 0px auto; text-align: center; } header { font-size:.9em; } header, header ul { flex-wrap:wrap; justify-content: center; } header ul li { margin-right: 10px; margin-top: 15px; } #auth { position: absolute; right: 20px; top: 20px; font-size: .9em; } #lk-menu { font-size: .65em; justify-content: center; } .antitle{ font-size: 1em; } .anphoto { width: 100%; float: none; margin: 0px auto; /* margin-right: 25px; */ margin-bottom: 20px; } #an_text_block { font-size: 1.1em; line-height: 27px; } .antitle { font-size: 1.2em; } } @media screen and (max-width: 460px) { header { font-size:.8em; } #logo, .mob-full { width: 75%; } .book_skeleton { width: 100%; } .book_mini { width: 70%; margin: 0px auto; } #lk-menu { font-size: .6em; } #lk-menu div, #year_filter { padding: 4px; margin-right: 4px; } #menu_category ul li, #menu_category ul li.active { padding: 4px 8px; } #stuff-bar { font-size: 1em; } } @media screen and (max-width: 390px) { body { width:98%; } #lk-menu { font-size: .7em; } .small-mob-hidden { display:none; } #menu_category ul li, #menu_category ul li.active { padding: 6px 10px; } #lk-menu div, #year_filter { padding: 6px; margin-right: 6px; } #stuff-bar { font-size: .9em; } }