diff --git a/07-lection5/01-checkbox/checkbox.css b/07-lection5/01-checkbox/checkbox.css
index e69de29..750c56e 100644
--- a/07-lection5/01-checkbox/checkbox.css
+++ b/07-lection5/01-checkbox/checkbox.css
@@ -0,0 +1,48 @@
+.checkbox {
+ display: inline-block;
+ position: relative;
+}
+.checkbox__input {
+ position: absolute;
+ left: -100vw;
+}
+.checkbox__state {
+ display: flex;
+ gap: 12px;
+ align-items: center;
+}
+.checkbox__control {
+ width: 28px;
+ height: 28px;
+ border-radius: 4px;
+ border: 1px solid var(--grey-2);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+.checkbox__label {
+ font-family: 'Inter';
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 24px;
+ color: #495057;
+}
+.checkbox__input:checked ~ .checkbox__state .checkbox__control {
+ background-color: #4263EB;
+ border-color: #4263EB;
+}
+.checkbox__input:checked ~ .checkbox__state .checkbox__control:before {
+ content: '';
+ background: url("img/icon.png");
+ width: 15px;
+ height: 13px;
+}
+.checkbox__input:disabled ~ .checkbox__state .checkbox__control {
+ background-color: var(--grey-2);
+}
+.checkbox__input:disabled ~ .checkbox__state .checkbox__label {
+ color: var(--grey-2);
+}
+.checkbox__input:focus ~ .checkbox__state .checkbox__label {
+ text-decoration: underline;
+}
\ No newline at end of file
diff --git a/07-lection5/01-checkbox/img/icon.png b/07-lection5/01-checkbox/img/icon.png
new file mode 100644
index 0000000..6b6789e
Binary files /dev/null and b/07-lection5/01-checkbox/img/icon.png differ
diff --git a/07-lection5/01-checkbox/index.html b/07-lection5/01-checkbox/index.html
index 5799c72..efab265 100644
--- a/07-lection5/01-checkbox/index.html
+++ b/07-lection5/01-checkbox/index.html
@@ -6,6 +6,28 @@
-
+