#app .mcqp {
    font-size: 14px;
}
#app .mcqpitem b {
	margin-right:5px;
}
#app .mcqpitem b:nth-child(even){
	color:#dfdfdf;
}
#app .mcqpitem b:hover {
	color:yellow;
	cursor:pointer;
}
#app .mcqpitem i {
	color: greenyellow;
    padding: 6px;
}	
	
#app .mcqpitem {
    max-width: 90vw;
    white-space: nowrap;
    overflow: hidden;
}
#app .reports .r-room {
	letter-spacing: -1px;
    font-size: 15px;
    color: gray;
}
#app .reports li .pabtn {
	visibility:hidden;
}
#app .reports li:hover .pabtn {
	visibility:visible;
}
#app td.roleselected {
	background: lightgreen;
}

#app .reports .r-date {
	letter-spacing: -1px;
    font-size: 17px;
    color: gainsboro;
}

#app .revoked-by a {
	display:none;
}
#app .revoked-by:hover a {
	display:inline;
}

#app span.pended {
    position: absolute;
    left: 0px;
    top: -3px;
    font-size: 10px;
    color: #b6d2ff;
}
#app .pacb {
    position: absolute;
    left: -48px;
    top: 11px;
}
#songs li.selected {
    background: #005c55 !important;
}
#app section.selectdb div {
	padding:30px;
	margin:auto;
}
#app .search-db input[autowidth] {
    background: transparent;
    color: white;
    border: 1px solid darkslategray;
    border-radius: 4px;
    padding-left: 2px;
    padding-right: 3px;
    font-weight: bold;
    outline: none;
	font-size:24px;
	min-width:200px;
	text-align:center;
}
#app b.tabs span {
	padding:2px;
}
#app span.draft-protected {
    font-size: 16px;
    color: #ff8e8e;
    margin: 5px;
}
#app .propose-search-results p {
	color:yellow;
}
#app .propose-search-results {
	font-size: 22px;
    color: gainsboro;
}
#app .search-db {
    position: relative;
    top: 50px;	
    margin-bottom: 60px;
}
#app .tabs-propose span i:not(.fa) {
    color: yellow;
}
#app .tabs-propose span i.fa {
	color:orange;
}
#app .tabs span {
	margin-left:3px;
}
#app .tabs span::after {
    content: ' ';
}
#app .pts {
    display: block;
    float: right;
	    position: relative;
    top: -4px;
}
#app .pt {
	display:block;
}
#app span.mcq li:nth-child(2) .tag-editor-tag {    
    color: #4fc2ff !important;
}
#app span.mcq .tag-editor-tag {
    color: #ff7200 !important;
}
#app span.mcq .placeholder {
    color: #ff7200 !important;
}
#app span.mcq {
	    display: block;
    padding-left: 20px;
}

#app ol.locked li {opacity:1; pointer-events:none;}

#app section.pvr li {
    position: relative;
}

#app b.count {
    position: absolute;
    left: -100px;
    color: gray;
    font-size: 12px;
    text-align: right;
    top: 4px;
    width: 70px;
    display: block;
}
#app section.pvr tr.used {
	opacity:0.7;
}
#app section.pvr input[autowidth] {
    background: transparent;
    color: white;
    border: 1px solid darkslategray;
    border-radius: 4px;
    padding-left: 2px;
    padding-right: 3px;
    font-weight: bold;
    outline: none;
}
#app .pvrsec-title input:first-child {
	font-weight:bold;
	font-size:24px;
}
#app .pvrsec {
	width: 600px;
    margin: auto;
    text-align: left;
}

#app section.history table {
	border-collapse:collapse;
}
#app section.history .cover {
    border-radius: 4px;
}
#app td.h-date {
    color: gray;
    text-align: right;
}
#app section.history td.h-value, #app section.history td.h-before {
    white-space: normal;
}
#app section.history td {
    white-space: nowrap;
    font-size: 15px;
    padding: 0px;
    height: 15px;
    margin: 0px;
}
#app .drafted img.avatar {
    width: 18px;
    height: 18px;
    margin-right: 5px;
    margin-left: 5px;
}
#app .propose-flag-accepted li .remove-q { 
	display:none!important;
}

#app .propose-flag-validation li .f-answers ul {
	
	display: inline-block !important;
    pointer-events: none;
}
#app #songs li input.pacb {
	
	
    pointer-events: all;
}
#app .propose-flag-validation li ul,
#app .propose-flag-drafts li ul,
#app .propose-flag-rejected li ul {
	display:none!important;
}

#app .propose-flag-validation li span.pt,
#app .propose-flag-drafts li span.pt,
#app .propose-flag-rejected li span.pt {
	display:none!important;
}

#app .propose-flag-validation li a:not(.pabtn),
#app .propose-flag-drafts li a:not(.pabtn),
#app .propose-flag-rejected li a:not(.pabtn) {
	display:none!important;
}
#app .propose-flag-validation li input:not(.name),
#app .propose-flag-drafts li input:not(.name),
#app .propose-flag-rejected li input:not(.name) {
	display:none!important;
}
#app .tabs div span i {
    color: yellow;
}
#app .propose-actions a:hover {
	color:lightgreen;
}
#app .propose-actions {
	cursor: pointer;
    position: absolute;
    right: 12px;
    top: 7px;
    font-size: 17pt;
	
}
#app .rejected {
    color: brown;
}
#app .drafted {
    color: brown;
}
#app .accepted {
    color: green;
}
#app .top-tabs.tool-tabs {
	    text-align: right;
		top: 36px;
		width: 100%;
}
#app .top-tabs.tool-tabs span:last-child {
	margin-right:20px;
}
#app .proposed-by {
    position: absolute;
    right: -15px;
    width: 24px;
    height: 29px;
    top: 9px;
}
#app table.events .trophees img {
    max-width: 40px;
    max-height: 40px;
}
#app table.events {
	border-collapse: collapse;
}
#app table.events td {
    white-space: nowrap;
}
#app table.events td:nth-child(2) {
    white-space: normal;
}
#app table.events td:nth-child(1) {
    text-align:left;
}
#app .replace-mp3:hover {
	color:orange;
}
#app .replace-mp3 {
	color:gray;
    float: right;
    position: relative;
    top: 4px;
    margin-right: 5px;
}
#app .planned-header {
	float:left;
	position: relative;
	color:green;
	left:30px;
}
#app .queue.waqueue p {
    height: 37px;
}
#app .queue.waqueue audio {
	float: left;
    zoom: 0.7;
}
#app .queue.ytqueue p {
    background: rgba(0,0,0,0.3);
    padding: 10px;
    margin: 2px;
    border-radius: 8px;
    height: 16px;
}
#app .queue.ytqueue {
    width: 700px;
	padding-bottom:20px;
}
#app section.details label span i {
    display: inline-block; 
}
#app .remove-q {
	    position: absolute;
    right: 10px;
    top: 5px;
    opacity: 0.9;
}
#app .remove-q:hover {
	opacity:1;
}
#app input.add-owner {
	background: transparent;
    border: 1px dashed #565656;
    border-radius: 4px;
    color: white;
    font-weight: bold;
    outline: none;
    padding: 2px;
    width: 77px;
    position: relative;
    top: -4px;
}
#app .create-event {
    padding: 10px;
}
#app .queue {
    width: 500px;
    margin: auto;
    text-align: left;
	margin-bottom:20px;
}
#app .ppppppplanning.planned {
	opacity: 0.4;
	cursor:not-allowed;
	pointer-events:none;
}
#app .queue p {
    background: rgba(0,0,0,0.3);
    padding: 10px;
    margin: 2px;
    border-radius: 8px;
}
#app .listen {
	font-size:16px;
}
#app .request select {
    background: transparent;
    border: none;
    color: orange;
	font-weight:bold;
	outline:none;
}
#app .details select {
    background: transparent;
    border: none;
    color: orange;
	font-weight:bold;
	outline:none;
}
.quiz .tools {
    float: left;
    position: relative;
    top: 7px;
    left: 8px;
    width: 19px;
    overflow: hidden;
    white-space: nowrap;
	transition: .3s all linear;
}
.quiz .tools:hover{
    width:300px;
}
.quiz .tools a{
    margin-right:10px;    
}
.request select option {    
    color: black;
	font-weight:bold;
}
#app b[mq-mp3] span {
    display: inline-block;
    margin-right: 5px;
}
#app .details .trophy a {
    font-size: 70px;
}
#app .details .intro-pix a {
	font-size:100px;	
}
#app .details .trophies .trophy {
	display:inline-block;
	width:80px;
	height:75px;
}
#app .details .trophies img {	
	width:75px;
	height:75px;
	border-radius:4px;
}
#app .details .intro-pix img {
    max-height: 150px;
    max-width: 300px;
    border-radius: 4px;
	cursor:pointer;
}
#app .q .specials img {
    max-width: 32px;
    max-height: 24px;
	cursor:pointer;
	transition: .3s all linear;
}
#app .q .specials img:hover {
    max-width: 128px;
    max-height: 128px;	
}
#app .specials input[autowidth] {
    background: transparent;
    color: white;
    border: 1px solid darkslategray;
    border-radius: 4px;
    padding-left: 2px;
    padding-right: 3px;
    font-weight: bold;
    outline: none;
}
#app .q .specials {
	    padding-bottom: 5px;
}
#app .q .specials .addspecial {
	display:none;
}
#app .q:hover .specials .addspecial {
	display:initial;
}
#app .q .specials select {
	width:180px;
	color:orange;	
}
#app .q .specials select option {
	color:black;
}
#app .specials .qspecial label {
	cursor:pointer;
}
#app .specials .qspecial input[type="radio"]:checked+b { color:cyan }
#app .specials .qspecial label:hover {
	color:gainsboro;
}
#app .specials .qspecial {
    margin: 0px;
    font-size: 16px;
    margin-left: 30px;
}
#app b[mq-stepper] a { width:0px; overflow-x:hidden;display:inline-block; transition: .2s all linear; position: relative; top: 4px;}
#app b[mq-stepper] { color:orange; user-select:none;}
#app b[mq-stepper]:hover { color:white; }
#app b[mq-stepper]:hover a {width: 13px; }
#app section.details label span{
	margin-bottom:2px;
}
#app section.details label span:not(.bad) { 
	color: #71ff71;
}
#app section.details label span.bad {
	color: red;
}
#app section.details label input {
    border: 1px solid darkslategray;
    background: transparent;
    color: white;
    border-radius: 5px;
    font-size: 16px;
    padding: 2px;
	font-weight:bold;
    margin-top:0px;
    
}
#app section.details textarea {
	outline:none;
    border: 1px solid darkslategray;
    background: transparent;
    color: white;
    border-radius: 5px;
    font-size: 16px;
    padding: 2px;
    font-weight: bold;
    margin-top: 0px;
    width: 95%;
}
#app section.details {
    text-align: left;
    width: 500px;
    margin: auto;
}

#app section.details h3 {
	    border-bottom: 2px solid #4c4c4c;
    color: gray;
}

.details-block {
	padding-left: 20px;    
}

.details label {
    display: block;    
	margin-bottom: 10px;
}

.details label span {
	color: gainsboro;
	display:block;
}


#app .plat {
    font-size: 20px;
    margin-right: 10px;
    color: gainsboro;
}
#app .i-q input.noob {width:20px;text-align:center;float:right;margin-top:5px;}

#aapp .i-q input.platform {display:none;}
#aapp .i-q:hover input.platform {display:initial;}
#aapp .i-q:focus input.platform {display:initial !important;}
#app .i-q .plat a {display:none;}
#app .i-q:hover .plat a {display:initial;}
#app .i-q .composer a {display:none;}
#app .i-q:hover .composer a {display:initial;}
#app .i-q .composer { margin-left:10px;}
#app .i-q:hover .composer { margin-left:0px;}
#app .inputby {
    width: 140px;
}
#app .platforms {
	float: right;
margin-right: 5px;
    margin-top: 0px;
}
#app .composers {
	/*float: right;*/
	margin-right: 5px;
    margin-top: 0px;
}
#app .composers .composer {
	font-size:14px;letter-spacing:-0.5px;
}
#app input.platform, #app input.noob{

    
    background: transparent;
    border: 1px solid #272727;
    border-radius: 4px;
    color: white;
    padding: 2px;
    font-weight: bold;
    font-size: 15px;
    width: 115px;
    outline: none;
}
#app input.composer {
    float: right;
    margin-right: 5px;
    margin-top: 5px;
    background: transparent;
    border: 1px solid #272727;
    border-radius: 4px;
    color: white;
    padding: 2px;
    font-weight: bold;
    font-size: 15px;
    width: 135px;
    outline: none;
}
#app .right-floater {
	 float:right;width:35px;height:10px;display:inline-block;
}
#app .clue input {
    float: right;
    margin-right: 5px;
    margin-top: 5px;
    background: transparent;
    border: 1px solid #272727;
    border-radius: 4px;
    color: white;
    padding: 2px;
    font-weight: bold;
    font-size: 15px;
    width: 135px;
    outline: none;
}
#app .main-filters label {
	color:gray;
}
#app .main-filters input {
    background: transparent;
    border: 1px solid #424141;
    padding: 2px;
    border-radius: 4px;
    font-weight: bold;
    font-size: 16px;
    color: white;
    text-align: center;
	outline:none;
}
#app input.event-name {    
    max-width: 30%;
	padding-left:10px;
position:absolute;
right:30px;
top:7px;
padding-right:10px;
border: 2px solid transparent;
    background: transparent;
    color: white;
    font-weight: bold;
    text-align: right;
    font-size: 18px;
    border-radius: 8px;
	outline:none;
	opacity:0.8;
	transition: .2s linear all;
	}
	
#app input.event-name:hover {
	border: 2px solid gray;
	opacity:1;
}
#app a.wr:hover {
	opacity:1;
}
#app #songs.locked a.wr {
	display:inline;
	pointer-events:all;
}
#app a.wr {
	position: absolute;
    right: -9px;
    top: 5px;
	display:none;
	opacity:0.5;	
}
#app li:hover a.wr {
	display:inline;
}

#app .q .tags {
	float:right;
}
#app .q .tags .tag-editor .tag-editor-tag {
	color:#e8ff72;
}

#app .play-song { background-image:url("img/play.png");}
#app .q:hover { background-color:rgba(0,0,0,0.8); }
#app .q {text-align: left;	position: relative;	font-family: Ubuntu !important;	background-color: rgba(0,0,0,0.5);border-radius: 8px; margin: 5px;     width: calc(100% - 20px);}
#app .q span.name {display:inline; margin-left:20px; color:rgb(203, 203, 203);  }
#app .q input.name{ display:inline-block; color:rgb(203, 203, 203);background: transparent;border: none;font-weight: bold;font-size: 20px;margin-left:5px;
outline:none;}
#songs{color:white;font-size:18pt;margin-top: 0px;}
.play-song, .stop-song { position: relative;	left: 10px;top: 3px;	opacity:0.7;	cursor:pointer;}
.play-song:hover, .stop-song:hover {opacity:1;}

.song-player {
	margin-left:5px;
	float:left;
	pointer-events: all;
}

#app .i-q {
	min-height: 35px;
    padding-top: 5px;
}

#app .filter-panel select option {
	color:black;
}
#app .filter-panel select.active {
    width: 150px;
    color: cyan;
}
#app .filter-panel select.sort-field.active {
	width:80px;
}

#app .filter-panel select {
	    width: 36px;
    background: transparent;
    color: white;
    font-weight: bold;
    border-radius: 5px;
    border: 1px solid #424141;
    padding: 2px;
}
#app .filter-panel {	display:inline-block;}
#app .filter-panel p {max-width;100px;}

input.xs {
	width:40px;
}

/*.question,.clue,.tag,.noobchange
{	
	display: block;
	background-color: rgba(0,0,0,0);
	border-radius: 8px;
	margin: 10px;
	position: relative;
	top: -10px;
	width: 98%;
	color: #F4FA40;
	padding-left:5px;
}*/


#app input.search {
	border-radius: 8px;
    font-size: 24px;
    text-align: center;
    outline: none;
	margin:10px!important;
}
#app .top-menu span { margin-left:10px;margin-right:10px;}
#app .flag.empty {
	filter: grayscale(1);
    opacity: 0.7;
}	

#app .filters span b {
    color: orange;
}
#app .q.validated input,
#app .q.validated .star,
#app .q.validated ul {
	pointer-events: none;
}
	
#app .q .flags {
    float: left;
    display: inline-block;
    height: 1px;
    position: relative;
    top: 2px;
    left: 6px;
    width: 25px;
}
.flag.selected {
	    border-right: 2px solid cyan;
}
.flag {
	margin-top: 1px;
	cursor:pointer;
    display: block;    
    width: 16px;
    height: 11px;
    background-repeat: no-repeat;
    background: url(//d24siqz0xbbpg8.cloudfront.net/v4/pix/flags.png) no-repeat;
}
#app .q.teaching img.avatar {
    position: absolute;
	top:8px;
	visibility:hidden;
}
#app .q.teaching:hover img.avatar { visibility:visible;}
#app .q:hover .links { visibility:visible;opacity:1; }
#app .q.teaching { display:inline-block; margin-left: 10px;}
#app .q.teaching input.from { text-align:right; }
#app .q.teaching input{
	font-weight:bold;
    background: transparent;
    color: white;
    border: none;
    border-radius: 6px;
    padding-left: 5px;
    width: 150px;
    font-size: 16px;
    outline: none;
}

#app .q .links {	
    display: inline;
    opacity: 0;
    transition: 1s;
    visibility: hidden;
}
#app .q .star {
     color: yellow;
    position: absolute;
    right: 9px;
    top: 0px;
    cursor: pointer;
    font-size: 29px;
    opacity: 0.2;
}
#app .q .star.specials {
	opacity:1;
}
#app .q {
	position:relative;    
    margin-bottom: 5px;
    text-align: left;
}
#app .q select {
	    width: 40px;
    outline: none;
    background: transparent;
    color: gainsboro;
    border: none;
    position: relative;
    left: 8px;
}
#app .cover .no-cover {
	display: inline-block;
    height: 20px;
    width: 22px;
    background: orange;
    border-radius: 4px;
    margin-top: 4px;
    margin-left: 4px;
}
#app .cover {
	cursor:pointer;
	float:left;
	position:relative;
	max-width:30px;
	min-width:25px;
	min-height:10px;
}
#app .cover:hover img {
	position:absolute;	
	max-width:200px;
	max-height:500px;
	z-index:1000;
}
#app .cover img {
	transition: all .5s linear; 
    max-width: 21px;
    max-height: 29px;
    margin-left: 5px;
    border-radius: 3px;
}
#app .q .realanswer.empty {
	min-width:120px;
}
#app .q .realanswer {
	border-radius: 4px;
    background: transparent;
    border: none;
    
    color: white;
    outline: none;
    color: #8ab1ce;
    font-weight: bold;
    font-size: 14px;	
}
#app .q .realanswer:hover {
	border:1px solid #353535;
}
#app .q .tag-editor {    
    position: relative;
	
    
}
#app .i-question .tag-editor {
    top: 7px;
    /* display: none; */
}
#app .q input.question {
	max-width: 80vw;
	display:inline-block;
	font-weight:bold;
    background: transparent;
    color: white;
    border: none;
    border-radius: 6px;
    padding-left: 5px;
		min-width:200px;
    font-size: 16px;
    outline: none;
}


#app {
 color:white;
 font-weight:bold;
 text-align:center;
}
#app nav span {
	padding: 5px;
	cursor:pointer;
    background-color: black;
    border-radius: 4px;
}

#app nav span.active {
	color: cyan;
    border: 1px solid gray;
}

#app .avatars .avatar {
    margin-right: 4px;
}
#app img.avatar:hover {
	opacity:1;
}
#app img.avatar {
    cursor: pointer;
    width: 24px;
    height: 24px;
    border-radius: 4px;
    opacity: 0.8;
}
#app .item input {
	color: black;
    width: 80%;
}
#app .item textarea {
	display: block;
    width: 80%;
	height:70px;
    margin-left: 30px;
}
#app .item:hover .desc {
	max-height:initial;
}
#app .item .desc {
	overflow:hidden;
    display: block;
    margin-left: 33px;
    margin-bottom: 10px;
	white-space:pre-line;
	max-height:100px;
}
#app .item .upvotes {
    font-weight: bold;
    font-size: 14pt;
    color: orange;
	display:none;
}
#app .item .upvote {    
    /*position: absolute;
    left: -30px;
	top:0px;*/
    font-size: 24px;
    text-decoration: initial;
	display:none;
}
#app .item:hover .upvote, #app .item:hover .upvotes {
	display:inline;
}
#app .logerror, #app .premiumerror {
	color:orange;
}
#app .item .admin { display:none;}
#app .item:hover .admin { display:inline; }
#app a {
	cursor:pointer;
}
#app .items {
   margin-left: 140px;	
}
#app .item {	margin: 2px; text-align: left; position:relative }
#app .item img {
    position: relative;
    top: -4px;    
}
#app  .creating input {
	width: 500px;    
}
#app  .creating textarea {
	width: 500px;
	height: 80px;
}
#app .filters {
	margin: 20px;
}
#app .filters span {
	padding: 5px;
	cursor:pointer;
    background-color: black;
    border-radius: 4px;
}

#app .filters span.active {
	color: cyan;
    border: 1px solid gray;
}

#app .filters strong {
    margin-left: 30px;
}

#app .menu a {
    margin: 10px;
    font-size: 14pt;
}




#app .trophees img {
    max-width: 75px;
    max-height: 75px;
}

#app tr {
	height:45px;
	font-size:16pt;
	
}
#app table tbody tr:hover { background-color: rgba(0,0,0,0.3);}
#app table thead td { beorder:none; }
#app table thead tr {    background-color: rgba(0,0,0,0.6); }
#app table {
	margin:auto;
}

#app td {
    border: 2px solid black;
    padding: 5px;
}

#app {
 color:white;
 font-weight:bold;
 text-align:center;
}



#drop{
    background-color: #2E3134;
    border: 20px solid rgba(0, 0, 0, 0);
    border-radius: 3px;
    /*border-image: url('../img/border-image.png') 25 repeat;*/
    text-align: center;

    font-size:16px;
    font-weight:bold;
    color:#7f858a;
	padding-bottom: 5px;
}

#drop a.btn {
    background-color:#007a96;
    padding:12px 26px;
	margin-left:5px;
    color:#fff;
    font-size:14px;
    border-radius:2px;
    cursor:pointer;
    display:inline-block;
    margin-top:12px;
    line-height:1;
}

#drop a.btn:hover{
    background-color:#0986a3;
}

#drop input{
    display:none;
}

#upload ul{
    list-style:none;
	padding-left: 0px;
    /*border-top:1px solid #2b2e31;*/
    border-bottom:1px solid #3d4043;
}

#upload ul li{

    background-color:#333639;

    background-image:-webkit-linear-gradient(top, #333639, #303335);
    background-image:-moz-linear-gradient(top, #333639, #303335);
    background-image:linear-gradient(top, #333639, #303335);

    border-top:1px solid #3d4043;
    border-bottom:1px solid #2b2e31;
    padding:15px;
    height: 72px;

    position: relative;
}

#upload ul li input{
    display: none;
}

#upload ul li p{
    overflow: hidden;
    white-space: nowrap;
    color: #EEE;
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    top: 15px;
    left: 100px;
}

#upload ul li i{
    font-weight: normal;
    font-style:normal;
    color:#7f7f7f;
    display:block;
}
#upload .error
{
	color: red;
float: right;
position: relative;
right: 50px;
left: initial;
}
#upload .success
{
	color: green;
float: right;
position: relative;
right: 50px;
left: initial;
}
#upload .processing
{
	color: orange;
float: right;
position: relative;
right: 50px;
left: initial;
}
#upload .waiting
{
	color: rgb(172, 166, 166);
	float: right;
	position: relative;
	right: 50px;
	left: initial;
}

#upload ul li canvas{
    top: 10px;
    left: 22px;
    position: absolute;
}

#upload ul li span{
    width: 15px;
    height: 12px;
    background: url('../img/icons.png') no-repeat;
    position: absolute;
    top: 34px;
    right: 33px;
    cursor:pointer;
}

#upload ul li.working span{
    height: 16px;
    background-position: 0 -12px;
}

#upload ul li.error p{
    color:red;
}
#yt
{
display: inline-block !important;
padding-left: 4px;
margin-left: 5px;
width: 430px;
}

#ytcut
{
display: inline-block !important;
margin-left: 5px;
margin-right: 5px;
width: 40px;
text-align:center;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotate {
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}