.selector{ display: flex; justify-content: right; } .pagination{ width: calc(70% - 100px); height: calc(100vh - 150px); padding: 50px; padding-left: 0px; padding-top: 10px; overflow-y: scroll; } .main{ padding: 0px 75px; padding-top: 150px; display: flex; justify-content: space-around; } .btn{ display: flex; flex-direction: row; justify-content: center; align-items: center; padding: 10px 24px; gap: 10px; font-style: normal; font-weight: 500; font-size: 18px; line-height: 28px; cursor: pointer; color: #13377D; background: #F4F7FD; border: 1px solid #13377D; border-radius: 8px; transition: 0.3s; } .upload{ display: flex; flex-direction: column; gap:25px; padding-top: 210px; justify-content: center; align-items: center; } .history{ display: flex; flex-direction: row; flex-wrap: wrap; gap:50px; padding: 120px; } .fileCard{ background: #F4F7FD; box-shadow: inset 0px -1px 0px #F0F0F0; width: 240px; height: 120PX; padding: 25px; display: flex; align-items: center; justify-content: center; text-align: center; color: #13377D; cursor: pointer; } .tools{ display: flex; flex-direction: row; gap:25px; justify-content: left; } .h1{ margin-top: -75px; font-weight: 700; font-size: 48px; line-height: 111.5%; color: #13377D; text-align: center; z-index: 10; margin-bottom: 75px; } .frame{ position: absolute; bottom: 0px; right: 0px; width: 35%; } .stars{ position: absolute; bottom: 50px; left: 75px; width:35%; } .progress{ padding: 20px; padding-top:50px; width: 10%; margin-left: -40px; } .viewer{ padding: 0px 40px; padding-right: 30%; padding-bottom: 100px; } .viewerText{ font-weight: 500; font-size: 20px; line-height: 28px; /* identical to box height, or 140% */ /* Character/Title .85 */ color: rgba(0, 0, 0, 0.85); } .viewTools{ padding-left: 15px; display: flex; gap:25px; margin-bottom: 20px; } .downloadText{ font-weight: 300; font-size: 36px; line-height: 111.5%; color: #000000; } .downloadStars{ position: absolute; bottom: 50px; left:-50px } .programs{ display: flex; gap:25px; height: 36px; } .supported{ margin-top: 100px; display: flex; flex-direction: column; gap:25px; justify-content: center; align-items: center; } .btnBlue{ display: flex; flex-direction: row; justify-content: center; align-items: center; padding: 10px 24px; gap: 10px; font-style: normal; font-weight: 500; font-size: 18px; line-height: 28px; cursor: pointer; text-decoration: none; color: #F4F7FD; background: #13377D; border-radius: 8px; transition: 0.3s; } .btnBlue:hover{ text-decoration: none; transition: 0.3s; color: #F4F7FD; padding: 12px 26px; } .profileCard{ width: 15%; } .profileWrapper{ display: flex; align-items: center; justify-content: center; gap:25px } .mText{ font-style: normal; font-weight: 500; font-size: 16px; line-height: 200%; color: #000000; text-align: center; } .sourceLink{ text-align: center; font-style: normal; font-weight: 300; font-size: 16px; line-height: 200%; /* identical to box height, or 48px */ text-align: center; text-decoration-line: underline; /* main/black */ color: #000000; }