* {    box-sizing: border-box;}
ol {    margin: 0;    padding: 0; direction: rtl; list-style-type: decimal;
list-style-position: inside;
}
ol li {cursor: pointer;
	position: relative;
	padding: 0.4vw 2vw 0.7vw 1vw;
	list-style-type: decimal;
	background: #eee;
	font-size: 1vw;
	transition: 0.2s;        
	/* make the list items unselectable */-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
ol li:nth-child(odd) {    background: #f9f9f9;}
ol li:hover {    background: #ddd;}
ol li.checked {
	background: #888;
	color: #fff;
	text-decoration: line-through;
}
ol li.checked::before {
	content: '';
	position: absolute;
	border-color: #fff;
	border-style: solid;
	border-width: 0 2px 2px 0;
	top: 0.5vw;
	right: 1vw;
	transform: rotate(45deg);
	height: 0.7vw;
	width: 0.3vw;
}
.close {    position: absolute;    right: 0;    top: 0;    padding: 12px 16px 12px 16px;}
.close:hover {    background-color: #f44336;    color: white;}
.header {    background-color: #f44336;    padding: 30px 40px;    color: white;    text-align: center;}
.header:after {    content: "";    display: table;    clear: both;}
input {    margin: 0;    border: none;    border-radius: 0;    width: 75%;    padding: 10px;    float: left;    font-size: 16px;}
.addBtn {    padding: 10px;    width: 25%;    background: #d9d9d9;    color: #555;    float: left;    text-align: center;    font-size: 16px;    cursor: pointer;    transition: 0.3s;    border-radius: 0;}
.addBtn:hover {    background-color: #bbb;}
#myUL{
    position: absolute;
    width: 48vw;
    height: 28vw;
    left: 0vw;
    right: 0;
    top: 7.6vw;
    
    margin: auto auto;
    overflow-y: scroll;
    font-weight: 800;
    color: #2a489f;
    list-style-type: decimal;
	z-index: 1001;
}
.ulsolution{
    position: absolute;
    left: -25vw;
    right: 0;
    top: 35.8vw;
    width: 23vw;
    height: 3vw;
    margin: auto;
    background-color: white;
    direction: rtl;
}
.ourSol{
	position: absolute;
	left: -4vw;
	right: 0;
	top: 35.8vw;
	direction: rtl;
	text-align: right;
	height: 3vw;
	margin: auto;
	line-height: 2.6vw;
	font-size: 2vw;
	width:46vw;
	color: #fff;
	font-weight: 600;
	padding-right: 10vw;
}
.ulsolution .tx{
    display: inline;
    direction: rtl;
    text-align: right;
    height: 100%;
    line-height: 2.6vw;
    font-size: 2vw;
    margin-right: 1vw;
    color: blue;
    font-weight: 600;
}
.ulsolution button{
	font-family: 'Alef', sans-serif;
 height: 100%;
 width: 5vw;
 background-color: #2f44eb;
 color: white;
 border: none;
 font-size: 2vw;
 float: left;
	border-radius: 0;
	margin:0;
}



.listtitle {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 0vw;
    color: #fff;
    text-align: center;
    width: 42.7vw;
    height: 2.8vw;
    font-size: 2.2vw;
    font-weight: bold;
    text-shadow: 0vw 0.1vw 0.7vw #000;
	z-index: 1001;
}
.listtitle2 {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    top: 3.1vw;
    color: #fff;
    text-align: center;
    width: 41.7vw;
    height: 5vw;
    font-size: 1.3vw;
    line-height: 1.4vw;
    font-weight: bold;
    text-shadow: 0vw 0.1vw 0.7vw #000;
    direction: rtl;
	z-index: 1001;
}