@import 'variable.less';
.main-collapse{
	padding: 10px;
	box-sizing: border-box;
	h4{
		color: white;
		background: @m-blue;
	    padding: 30px;
	    box-sizing: border-box;
	    font-weight: normal;
	    font-size: 17px;
	    text-align: center;
	    cursor: pointer;
	    margin: 0;
	    border-bottom: 4px solid #0066aa;
	    position: relative;
	    &.second_title{
	    	background: @main-blue;
	    	border-bottom: 4px solid #002f59;
	    }
	    span{
	    	font-size: 13px; 
	    	margin-left: 10px;
	    }
	}
	label.title{
		color: @m-pink;
		padding: 0 20px;
    	padding-top: 10px;
	    font-size: 19px;
	}
	.collapse_content{
		display: none;
		.list_card_feed{
		padding: 10px 20px;
		box-sizing: border-box;
			overflow: hidden;
			>.row:nth-child(odd){
				background: #f2f2f4;
			    border-bottom: 1px solid #ececec;
			}
			>.row:nth-child(even){
				background: #fafafa;
			}
			.row{
				>div{
				    padding: 15px 20px;
					box-sizing: border-box;
					&:first-child{
						font-weight:700; 
					}
				}
				&.header{
					background: #cccaca;
				}
			}
			.top_note{margin-top: 10px;}
		}
	}
	.note_p{
		padding: 10px; box-sizing: border-box;
	}	
}
.ol-style-letters{
	li{
		list-style-type: lower-alpha;
	}
}
.div-loader{
	 position: absolute; 
    display: none; 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(232, 232, 232, 0.74);
    z-index: 2; 
    &.active{
  	display: block;
  }
}
.newcode1 {
  color: #056fde;
  cursor: pointer;
  display: inline-block;
  .mt10 {
  	margin-top: 10px;
	}	
}

.article-rel1{
	position: relative;
}
/* load animation */
.sk-fading-circle-spin {
  width: 90px;
  height: 90px;
  position: absolute;
  top: 40%;
  left: 40%;
  display: none;
  &.active{
  	display: block;
  }
	.sk-circle {
	  width: 100%;
	  height: 100%;
	  position: absolute;
	  left: 0;
	  top: 0;

	  	&::before {
		  content: '';
		  display: block;
		  margin: 0 auto;
		  width: 15%;
		  height: 15%;
		  background-color: #333;
		  border-radius: 100%;
		  -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
		          animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
		}
		
	}
	
	.sk-circle2 {
	  -webkit-transform: rotate(30deg);
	      -ms-transform: rotate(30deg);
	          transform: rotate(30deg);
      	&::before {
		  -webkit-animation-delay: -1.1s;
		          animation-delay: -1.1s; 
		}
	}
	.sk-circle3 {
	  -webkit-transform: rotate(60deg);
	      -ms-transform: rotate(60deg);
	          transform: rotate(60deg);
     	&::before {
		  -webkit-animation-delay: -1s;
		          animation-delay: -1s; 
		}
	}
	.sk-circle4 {
	  -webkit-transform: rotate(90deg);
	      -ms-transform: rotate(90deg);
	          transform: rotate(90deg);
      	&::before {
		  -webkit-animation-delay: -0.9s;
		          animation-delay: -0.9s; 
		}
	}
	.sk-circle5 {
	  -webkit-transform: rotate(120deg);
	      -ms-transform: rotate(120deg);
	          transform: rotate(120deg);
      	&::before {
		  -webkit-animation-delay: -0.8s;
		          animation-delay: -0.8s; 
		}
	}
	.sk-circle6 {
	  -webkit-transform: rotate(150deg);
	      -ms-transform: rotate(150deg);
	          transform: rotate(150deg);
      	&::before {
		  -webkit-animation-delay: -0.7s;
		          animation-delay: -0.7s; 
		}
	}
	.sk-circle7 {
	  -webkit-transform: rotate(180deg);
	      -ms-transform: rotate(180deg);
	          transform: rotate(180deg);
      	&::before {
		  -webkit-animation-delay: -0.6s;
		          animation-delay: -0.6s; 
		}
	}
	.sk-circle8 {
	  -webkit-transform: rotate(210deg);
	      -ms-transform: rotate(210deg);
	          transform: rotate(210deg);
      	&::before {
		  -webkit-animation-delay: -0.5s;
		          animation-delay: -0.5s; 
		}
	}
	.sk-circle9 {
	  -webkit-transform: rotate(240deg);
	      -ms-transform: rotate(240deg);
	          transform: rotate(240deg);
      	&::before {
		  -webkit-animation-delay: -0.4s;
		          animation-delay: -0.4s;
		}
	}
	.sk-circle10 {
	  -webkit-transform: rotate(270deg);
	      -ms-transform: rotate(270deg);
	          transform: rotate(270deg);
  		&::before {
		  -webkit-animation-delay: -0.3s;
		          animation-delay: -0.3s;
		}
	}
	.sk-circle11 {
	  -webkit-transform: rotate(300deg);
	      -ms-transform: rotate(300deg);
	          transform: rotate(300deg); 
      	&::before {
		  -webkit-animation-delay: -0.2s;
		          animation-delay: -0.2s;
		}
	}
	.sk-circle12 {
	  -webkit-transform: rotate(330deg);
	      -ms-transform: rotate(330deg);
	          transform: rotate(330deg); 
      	&::before {
		  -webkit-animation-delay: -0.1s;
		          animation-delay: -0.1s;
		}
	}
}

@-webkit-keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; }
}

@keyframes sk-circleFadeDelay {
  0%, 39%, 100% { opacity: 0; }
  40% { opacity: 1; } 
}
@media (max-width: 1520px){
	#sk-fading-circle{
		left: 25%;
	}
}
@media (max-width: 1250px){
	#sk-fading-circle{
		left: 40%;
	}
}
