When switching tabs, the icon to the left of the tab should change, for each tab has its own icon. Those. Now I put a pseudo-element on the <i></i> tag (the icon to the left of the tab), when I switch to the active tab, the icon should change to the active one.

How to do it?

PS tabs switch all the rules, when you switch to the <li> class is added active.

 .new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; } TXVvR .new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; } 
 <ul class="nav nav-tabs block-2" role="tablist"> <li role="presentation" class="active"> <a href="#settings-1" aria-controls="settings" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-4"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 1</span> </a> </li> <li role="presentation"> <a href="#home-1" aria-controls="home" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-1"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 2</span> </a> </li> <li role="presentation"> <a href="#profile-1" aria-controls="profile" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-2"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 3</span> </a> </li> <li role="presentation"> <a href="#messages-1" aria-controls="messages" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-3"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 4</span> </a> </li> </ul>

  • .active: before - your rules for ".new-ico-4: before {" - slowBro
  • It’s not quite clear why you use a псСвдо-элСмСнт ... Show your JS You add the класс active ... - Air

1 answer 1

You need to create a separate class for the asset item.

 .new-ico-1:before { ... } .new-ico-2:before { ... } .new-ico-3:before { ... } .new-ico-4:before { ... } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .new-ico-1:before { ... } .new-ico-2:before { ... } .new-ico-3:before { ... } .new-ico-4:before { ... } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; } TXVvR .new-ico-1:before { ... } .new-ico-2:before { ... } .new-ico-3:before { ... } .new-ico-4:before { ... } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: 0; top: 35%; }

Code example

 var a = document.querySelectorAll('ul.nav a'); for (var i = 0; i < a.length; ++i) { a[i].onclick = function(e) { var active = document.querySelector('ul.nav li.active'); active.classList.remove('active'); if (!active.getAttribute('class')) { active.removeAttribute('class'); } var li = e.target.parentElement.parentElement; li.classList.add('active'); } } 
 .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } TXVvR .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } TXVvR .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } TXVvR .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } TXVvR .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } jpeg; base64, / 9j / 4AAQSkZJRgABAQAAAQABAAD / 2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys / RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N // AABEIAB4AHgMBIgACEQEDEQH / xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG / 8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD / xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB / 8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi / 9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ + OIrFVVS6PJbJbmPOfIP25W1aEeb + MHnDcOVwzJqkKHJo65rK0pbU / fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ / kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0 / gNm1pPRRA0tob / XFnkc4tcOUFKWQlCRlJuE + 46D / dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT / .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } TXVvR .nav li i { position: relative; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li { margin: 20px; } .nav li i.new-ico-1:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-2:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-3:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li i.new-ico-4:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .nav li.active i:before { content: ""; position: absolute; background: url(data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBwgHBgkIBwgKCgkLDRYPDQwMDRsUFRAWIB0iIiAdHx8kKDQsJCYxJx8fLT0tMTU3Ojo6Iys/RD84QzQ5OjcBCgoKDQwNGg8PGjclHyU3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzctNzc3Nzc3Nzc3Nzc3NzU3Nzc3NTc3N//AABEIAB4AHgMBIgACEQEDEQH/xAAXAAEBAQEAAAAAAAAAAAAAAAAHBQQG/8QALRAAAQMCBAUDAwUAAAAAAAAAAQIDBAURABIhMQYHQVFhEyIjcYGRMkKhsfD/xAAXAQADAQAAAAAAAAAAAAAAAAAAAgMB/8QAHBEAAgMAAwEAAAAAAAAAAAAAAQMAAhIRITIi/9oADAMBAAIRAxEAPwBdrlfp9CaC6g6pJUhS0JSkkqy726deuAOt8cVyrVRcpiVJjtrI9NhlwC3bTX8YZ+OIrFVVS6PJbJbmPOfIP25W1aEeb+MHnDcOVwzJqkKHJo65rK0pbU/fO6STcX3ACRva1ziLrmg5l0rFzwJm4T5kSqZMQzWZDq2VkZlOp9yR9hZQ/kW6jTDVS6lFqkREmG4FtqHfUeDge5hUtyoU6lOS0wk1l1z0/gNm1pPRRA0tob/XFnkc4tcOUFKWQlCRlJuE+46D/dcYlmhBq8y5zDqZpFQo83NYMokrGlxmKUpSfysYOeHOKocSbIkT/XW+97S4kmx7km+ovrYpOLXNWO6eKYTUmQtUeQpBUka2bzD2gfUE+cYJdBoL8hQbjutIAJTkFjYEed8K0a6MddsD5mKq1d2pTYqILPqIbWC20lWq0bnMNtf6H2wvcIVGnTIqmYMMQ1sgZ2ha1j1BG4wdU2PQqZ8rTMm2X9BANjvmzXuT22Ax2fLtp99uTVXihKJNksso19Nsai5tqo3JJ7nAjkHIHUZ+TXVvRn//2Q==) no-repeat; background-size: cover; width: 30px; height: 30px; left: -30px; top: -10px; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } 
 <ul class="nav nav-tabs block-2" role="tablist"> <li role="presentation" class="active"> <a href="#settings-1" aria-controls="settings" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-4"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 1</span> </a> </li> <li role="presentation"> <a href="#home-1" aria-controls="home" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-1"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 2</span> </a> </li> <li role="presentation"> <a href="#profile-1" aria-controls="profile" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-2"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 3</span> </a> </li> <li role="presentation"> <a href="#messages-1" aria-controls="messages" role="tab" data-toggle="tab"> <i aria-hidden="true" class="new-ico-3"></i> <span>Π’ΠΊΠ»Π°Π΄ΠΊΠ° 4</span> </a> </li> </ul>

  • In principle, exactly what you need. But it became a bit incorrect to work. When you click on the tab should change the contents of the block. When you click specifically on the text, the icons work, but the block content does not change, when you click next to the text, the block content changes and everything works. - Dmitriy
  • @ Dmitry give all the codes on jsfiddle.net - KYRAN
  • Thanks for the help, I figured out the rest. The answer was very helpful - Dmitriy
  • @ Dmitriy always welcome - KYRAN