CSSBayan

[LidaChk]

##CSSBayan

1. Task: https://github.com/DrDiman/CSS-Bayan-task

2. Screenshot:
   

3. Deploy: https://lidachk.github.io/cssBayan/cssBayan/

4. Done 13.03.2023

5. Score: 140/ 140

Max score 140

[+] Repository requirements and how to submit task +30
[+]The accordion component is centered on the screen, with equal indents on the left and right +10
[+] Icons, meme texts and meme images are exist +5
[+] Placement of the meme, icons and meme text are the same as in provided example gif images +5
[+] Smooth change (transition) of the meme images and icons is done +20
[+] Responsive design with three breakpoints for mobile, tablet, and desktop exist. Accordion is displayed correctly at mobile 320x568, tablet 820x1180, desktop 1920×1080. +10
[+] All visual effects when the cursor is hovering over the memes, when the mouse is down on a meme, and when a meme is selected are implemented (:hover, :active, :checked)+10
[+] The entire row (text, icon, and meme image) clickable +5
[+] Cursor over the memes (hover) effect only exists for devices that can support hover. @media (hover: hover) +10

[+] The cursor when it is hovering over the rows of the accordion is changing +5
[+] Only flexible dimensions are used rem, em, %, vh, vw, fr and etc... The accordion is responsive +10
[+] All blocks/parts of the accordion are in base flow of the dom elements. no top, left, right, bottom. float . The value of position is only static +5
[+] Pseudo-elements are not used +5
[+] Initially, the first meme should be expanded +5
[+] Font size is changed at each device (mobile, tablet, desktop) +5