@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Lato:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Tangerine:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Fascinate:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Merriweather:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Domine:300,400,500,600,700,800);
@import url(https://fonts.googleapis.com/css?family=Great+Vibes:300,400,500,600,700,800);

@font-face {
	font-family: 'Open Sans', sans-serif;
	font-size:14px;
}

@font-face {
	font-family: 'Roboto', sans-serif;
	font-size:14px;
}

@font-face {
	font-family: 'Lato', sans-serif;
	font-size:14px;
}




a:link {
color:inherit;
text-decoration: none;
}
a:visited {
text-decoration: none;
color:inherit;
}
a:hover {
text-decoration: none;
color:inherit;
}
a:active {
text-decoration: none;
}

html {
	font-family: 'Roboto', sans-serif;
	margin: 0;
	color: #676869;
	font-size: 13px;
}

body {
	margin: 0;
	height: 100%;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #676869;
	position: relative;
	background: #f5f6fa;
}
input {
	width: 100%;
	height: 42px;
	border-radius: 5px;
	border:none;
	background-color: #f5f6fa;
	outline: none;
	padding: 14px;
	font-size: 14px;
	font-weight: 600;
	color: #818990;
}
input::placeholder {
  color: #b9babc;
}
input[type="checkbox"] {
	width: 18px;
	display: none;
}
label {
	height: 19px;
	padding-right: 25px;
	color: #b9babc;
	font-size: 14px;
	font-weight: 500;
}
input[type=checkbox] + label::before {
	content: '';
	display: inline-block;
	width: 24px;
	height: 19px;
	background: url(/images/filter_check.png) no-repeat;
	vertical-align: top;
}
input[type=checkbox]:checked + label::before {
	content: '';
    background: url(/images/filter_checked.png) no-repeat;
}

.clear:after {
    clear: both;
    content: "";
    display: table;
}

.Content{
	width: 1180px;
	margin-left: auto;
	margin-right: auto;
}

.overlay {
	display: none;
}


.header {
	width: 100%;
	height: 85px;
	border-bottom: solid 1px #e5e5e5;
	position: sticky;
	background-color: #f5f6fa;

}
.header .logo {
	width: 154px;
	height: 41px;
	float: left;
	margin-top: 22px;
}

.header .menu a {
  color: #283252;
  text-decoration: none;  
  position: relative;
}
.header .menu a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: -7px;
  content: "";
  display: block;
  height: 3px;
  left: 50%;
  position: absolute;
  background: #283252;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
  border-radius: 20px;

}
.menu a:hover:after { 
  width: 100%; 
  left: 0; 
}

.header .menu ul {
	list-style-type: none;
	float: left;
	padding: 0px;
	margin: 0px;
}	
.header .menu li {
	height: 85px;
	padding: 28px 18px 14px 26px;
	float: left;
	font-size: 19px;
	font-weight: 600;
	color: #283252;
}	
.header .menu li img {
	margin-top: -5px;
}
.header .login {
	float: right;
	width: 120px;
	height: 40px;
	background-color: #FFF;
	margin-top: 21px;
	border-radius: 20px;
	padding-top: 5px;
	padding-left: 15px;
	font-size: 18px;
	font-weight: 600;
	color: #283252;
	border: solid 2px #f5f6fa;
	transition: .3s;
	cursor: pointer;
}
.header .login:hover {
	border: solid 2px #FFF;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15);

}
.header .login img{
	float: left;
	margin-right: 15px;
	margin-top: 5px;
	margin-left: 2px;
	}
.header .account {
	width: 135px;
}
.header .accountDm .dropdown-menu{
	width: 190px;
	background-color: #FFF;
	border-radius: 20px;
	font-size: 14px;
	font-weight: bold;
	overflow: hidden;
	border: solid 2px #e4e4e4;

}
.header .accountDm .dropdown-menu ul{
	transform: translate(-42px, 63px) !important;
}
.header .accountDm .dropdown-item{
  font-size: 14px;
  font-weight: 400;
  color: #283252;
  text-align: right;
}
.header .accountDm .dropdown-menu .Cmpanel{
	background: url(/images/compositepanel_low_icon.png) no-repeat;
	background-position: 145px 7px;
}
.header .accountDm .dropdown-menu .set{
	background: url(/images/setting_low_icon.png) no-repeat;
	background-position: 147px 7px;
}
.header .accountDm .dropdown-menu .logout{
	background: url(/images/logout_low_icon.png) no-repeat;
	background-position: 147px 9px;
	background-size: 24px;
}
.header .accountDm .dropdown-menu {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.header .accountDm  .dropdown-item {
	cursor: pointer;
	padding: 10px 60px 10px 7px;
}
.header .accountDm  .dropdown-item:hover {
	background-color: #EFF0F7;
}
.header .accountDm  .dropdown-item:active {
	background-color: #CED2E4;
}
.header .welcome {
	float: right;
	width: 200px;
	height: 40px;
	margin-top: 21px;
	padding-top: 0px;
	padding-right: 25px;
	font-size: 14px;
	font-weight: 400;
	color: #283252;
	text-align: right;
	line-height: 19px;
}
.socialMedia {
	width: 55px;
	height: 140px;
	border-radius: 14px;
	position: fixed;
	background-color: #FFF;
	top:50%;
	margin-top: -70px;
	margin-left: 30px;
}
.socialMedia .facebook{
	width: 38px;
	height: 38px;
	margin-top: 9px;
	margin-left: 9px;
	border-radius: 16px;
	background: url(/images/facebook_icon.png) no-repeat;
	background-size: auto 18px;
	background-position: 13px 10px;
	cursor: pointer;
}
.socialMedia .facebook:hover{
	background-color: #f5f6fa;
}
.socialMedia .twitter{
	width: 38px;
	height: 38px;
	margin-top: 4px;
	margin-left: 9px;
	border-radius: 16px;
	background: url(/images/twitter_icon.png) no-repeat;
	background-size: auto 15px;
	background-position: 11px 12px;
	cursor: pointer;
}
.socialMedia .twitter:hover{
	background-color: #f5f6fa;
}
.socialMedia .instagram{
	width: 38px;
	height: 38px;
	margin-top: 4px;
	margin-left: 9px;
	border-radius: 16px;
	background: url(/images/instagram_icon.png) no-repeat;
	background-size: auto 16px;
	background-position: 11px 11px;
	cursor: pointer;
}
.socialMedia .instagram:hover{
	background-color: #f5f6fa;
}
.slider {
	width: 100%;
	height: 900px;
	background-color: #f5f6fa;
	background: url(/images/slider_bg.jpg) no-repeat;
	background-position: bottom;
	background-size: 100%;
	font-family: 'Lato', sans-serif;
}
.slider .slideU {
	padding-top:85px;
	height: 350px;
}
.slider .slideU .CompositeLogo {
	width: 511px;
	height: 135px;
	margin-top: 65px;
	padding-top: 20px;
	margin-left: -20px;
	float: left;
}
.slider .slideU .Texture {
	width: 600px;
	height: 135px;
	margin-top: 65px;
	float: right;
	text-align: right;
}
.slider .slideU .Texture .text1{
	height: 85px;
	font-size: 48px;
	font-weight: bold;
	color: #283252;
	}
.slider .slideU .Texture .text2{
	font-size: 24px;
	color: #949bb0;
	line-height: 28px;
	}
.slider .slideD {
	height: 650px;
}
.slider .slideD .Register {
	width: 373px;
	height: 394px;
	background-color: #FFF;
	border-radius: 28px;
	padding: 32px;
	float: left;
}
.slider .slideD .Register .title{
	color: #d14e6c;
	font-weight: bold;
	font-size: 24px;
	height: 40px;
	}
	.slider .slideD .Register .text{
		font-size: 18px;
		color: #b0b5bc;
		line-height: 20px;
	}
	.slider .slideD .Register .form {
		margin-top: 25px;
	}
	.slider .slideD .Register .form input{
		width: 100%;
		height: 51px;
		border-radius: 10px;
		background-color: #f5f6fa;
		margin-bottom: 10px;
		font-size: 18px;
		font-weight: 400;
	}
	.slider .slideD .Register .form button{
		height: 47px;
		border-radius: 25px;
		background-color: #d14e6c;
		margin-top: 7px;
		font-size: 18px;
		border:none;
		padding: 10px 35px;
		color: #FFF;
		font-weight: bold;
		margin-left: 85px;
		float: left;
	}
	.slider .slideD .scrolldown {
		width: 373px;
		height: 80px;
		background: url(/images/scrolldown.png) no-repeat;
		background-position: center;
		float: left;
		margin-top: 50px;
				animation-name: scrolldown;
  	animation-duration: 2s;
  	animation-iteration-count: infinite;
	}
	.slider .slideD .image{
		float: right;
		width: 740px;
		height: 532px;
		background: url(/images/slide1.png) no-repeat;
		margin-top: 18px;

	}
	@keyframes scrolldown {
	  0%   {margin-top: 50px;}
	  50%  {margin-top: 70px;}
	  100% {margin-top: 50px;}
	}
.workbar {
	width: 100%;
	height: 335px;
	background-color: #FFF;
	padding-top: 45px;
}
.workbar .title{
	font-size: 36px;
	font-weight: 500;
	color: #283252;
	text-align: center;
}
.workbar .text{
	font-size: 16px;
	font-weight: 400;
	color: #808595;
	text-align: center;
}
.workbar .item {
	width: 330px;
	height: 100px;
	cursor: pointer;
	float: left;
	margin-top: 50px;
	margin-left: 60px;
}
.workbar .item .itemIco{
	width: 57px;
	height: 57px;
	border-radius: 15px;
	float: left;
	margin-top: 6px;
}
.workbar .item .red {
	background-color: #ffeff3;
}
.workbar .item .ora {
	background-color: #ffeff3;
}
.workbar .item .blu {
	background-color: #d7f4fc;
}
.workbar .item .pru {
	background-color: #e6e7f9;
}




.workbar .item .itemTitle {
	float: left;
	width: 273px;
	height: 30px;
	font-size: 18px;
	font-weight: bold;
	padding-left: 15px;
	color: #d14e6c;
}
.workbar .item .itemText {
	float: left;
	width: 250px;
	height: 48px;
	padding-left: 15px;
	font-size: 16px;
	color: #9599a8;
	line-height: 18px;
}
.workbar .item .itemMore {
	float: left;
	width: 250px;
	height: 25px;
	font-size: 15px;
	color: #d14e6c;
	font-weight: bold;
	margin-top: 10px;
	background: url(/images/pmright_icon.png) no-repeat;
	background-position: 85px 2px;
	transition: .3s;

}
.workbar .item:hover .itemMore{
	color: #DB6580;
	background-position: 90px 2px;
}

.footer {
	height: 243px;
	text-align: center;
	font-size: 18px;
	font-weight: 500;
	color: #c4c6cb;
	background-color: #ececec;
}
.footer img {
	margin-top:35px;
	margin-bottom: 20px;
	}
.footer .cr {
	margin-top: 25px;
	height: 68px;
	background-color: #f5f5f5;
	color:#aaadb6;
	font-size: 18px;
	padding-top: 23px;
	font-weight: 400;
}
#LoginMenu .title{
	font-weight: bold;
	font-size: 25px;
	height: 40px;
	}
#LoginMenu .text{
	font-size: 18px;
	color: #b0b5bc;
	line-height: 20px;
	font-weight: 300;
}
#LoginMenu .form {
	margin-top: 25px;
}
#LoginMenu .form input{
	width: 100%;
	height: 51px;
	border-radius: 10px;
	background-color: #f5f6fa;
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: 400;
}
#LoginMenu .form button{
	width: 100%;
	height: 47px;
	border-radius: 25px;
	background-color: #d14e6c;
	margin-top: 7px;
	font-size: 18px;
	border:none;
	padding: 10px 35px;
	color: #FFF;
	font-weight: bold;
	margin-left: 0px;
}
#LoginMenu .btn-close {
	float: right;
	font-size: 22px;
	margin-top: 2px;
}
#LoginMenu .forgotpass {
	margin-top: 19px;
	font-size: 18px;
	color: #b0b5bc;
	line-height: 20px;
	font-weight: 400;
	text-align: center;
}


.CompositePanel {
	width: 100%;
	min-height: 700px;
	background-color: #f5f6fa;
	background: url(/images/slider_bg.jpg) no-repeat;
	background-position: bottom;
	background-size: 100%;
	font-family: 'Lato', sans-serif;
	/*padding-bottom: 75px;*/
}

.CompositePanel .navBar{
	width: 70%;
	height: 80px;
	margin-top: 70px;
	float: left;
}
.CompositePanel .navBar .title{
	font-size: 26px;
  font-weight: 500;
  color: #283252;
  font-weight: 600;
}
.CompositePanel .navBar .text{
	font-size: 16px;
  font-weight: 500;
  color: #787f8a;
  font-weight: 400;
}
.CompositePanel .search{
	width: 30%;
	height: 80px;
	font-family: 'Lato', sans-serif;
	margin-top: 80px;
	float: right;
}
.CompositePanel .search input{
	width: 190px;
	height: 36px;
	border-radius: 20px;
	background: url(/images/search_icon.png) no-repeat;
	background-position: 155px 8px;
	background-color: #FFF;
	float: right;
}

.CompositePanel .CompositeManage{
	height: auto;
	clear: both;
	
}
.CompositePanel .CompositeManage .item{
	width: 390px;
	height: 124px;
	float: left;
	border-radius: 20px;
	color: #787f8a;
	font-size: 16px;
	font-weight: 400;
	padding-top: 12px;
	padding-left: 35px;
	margin-right: 33px;
	margin-bottom: 33px;
	transition: 0.2s;
	cursor: pointer;
}
.CompositePanel .CompositeManage .item:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeManage .item .title{
	color: #404762;
	font-size: 24px;
	margin-top: 14px;
	font-weight: 600;
}
.CompositePanel .CompositeManage .iComposite{
	background: url(/images/compositepanel_icon.png) no-repeat;
	background-position: 290px 30px;
	background-color: #fff;

}
.CompositePanel .CompositeManage .iUser{
	background: url(/images/userpanel_icon.png) no-repeat;
	background-position: 295px 28px;
	background-color: #fff;
}
.CompositePanel .CompositeManage .iPricing{
	background: url(/images/pricingpanel_icon.png) no-repeat;
	background-position: 297px 33px;
	background-color: #fff;
}




.CompositePanel .CompositeFolders{
	height: auto;
	clear: both;
	
}
.CompositePanel .CompositeFolders .Option{
	height: 40px;
}
.CompositePanel .CompositeFolders .Option .Button{
	height: 40px;
	border-radius: 20px;
	background-position: 155px 8px;
	background-color: #FFF;
	padding: 8px 16px;
	font-weight: 800;
	font-size: 15px;
	color: #404762;
	text-align: right;
	float: left;
	margin-right: 14px;
	transition: 0.2s;
	cursor: pointer;
}
.CompositePanel .CompositeFolders .Option .Button:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeFolders .Option .Create{
	padding: 8px 16px 8px 43px;
	background: url(/images/plus_icon.png) no-repeat;
	background-position: 12px 8px;
	background-color: #FFF;
	}
.CompositePanel .CompositeFolders .Option .Move{
	padding: 8px 16px 8px 51px;
	background: url(/images/move_icon.png) no-repeat;
	background-position: 15px 6px;
	background-color: #FFF;
	}
.CompositePanel .CompositeFolders .Option .Delete{
	padding: 8px 16px 8px 45px;
	background: url(/images/delete_icon.png) no-repeat;
	background-position: 15px 6px;
	background-color: #FFF;
	}


.CompositePanel .CompositeFolders .Folders{
	margin-top: 25px;	
}
.CompositePanel .CompositeFolders .Folders .item{
	width: 124px;
	height: 124px;
	background: url(/images/folder_icon.png) no-repeat;
	background-position: 37px 30px;
	background-color: #fff;
	float: left;
	border-radius: 20px;
	color: #404762;
	font-size: 14px;
	font-weight: 600;
	padding-top: 85px;
	text-align: center;
	margin-right: 15px;
	margin-bottom: 18px;
	transition: 0.2s;
}
.CompositePanel .CompositeFolders .Folders .item .itemLink{
	width: 100%;
	height: 100%;
	position: absolute;
	margin-top: -85px;
	border-radius: 20px;
}

.CompositePanel .CompositeFolders .Folders .Previous{
	width: 66px;
	background: url(/images/Previous.png) no-repeat;
	background-position: 14px 32px;
	background-size: 40px;
	background-color: #fff;
	color: #7d839e;
}
.CompositePanel .CompositeFolders .Folders .Create{
	width: 66px;
	height: 66px;
	padding-top: 0px;
	background: url(/images/plus_3x_icon.png) no-repeat;
	background-position: 14px 15px;
	background-size: 40px;
	background-color: #fff;
	border-radius: 45px;
	color: #7d839e;
	margin-right: 0px;
	margin-top: 27px;
}
/*.CompositePanel .CompositeFolders .Folders .Create{
	width: 66px;
	background: url(/images/plus_3x_icon.png) no-repeat;
	background-position: 14px 32px;
	background-size: 40px;
	background-color: #fff;
	color: #7d839e;
	margin-right: 0px;
}*/
.CompositePanel .CompositeFolders .Folders .NoFolder{
	background: url(/images/nofolder.png) no-repeat;
	background-position: 42px 32px;
		background-size: 40px;
	
	color: #7d839e;
}
.CompositePanel .CompositeFolders .Folders .viewcomposite {
	background: url(/images/view_composite_icon.png) no-repeat;
	background-position: 37px 30px;
	background-color: #fff;
}
.CompositePanel .CompositeFolders .Folders .item:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeFolders .Folders .NoFolder:hover {
	box-shadow: none;
}
.CompositePanel .CompositeFolders .Folders .item .Select{
	width: 25px;
	height: 25px;
	background: url(/images/menu_icon.png) no-repeat;
	background-size: 4px;
	background-position: 10px;
	background-color: #f5f6fa;
	border-radius: 30px;
	position: absolute;
	margin-top: -79px;
	margin-left: 91px;
	padding: 3px;
}
.CompositePanel .CompositeFolders .Folders .item .Select:hover{
	background-color: #E4E6F0;
	}
.CompositePanel .CompositeFolders .Folders .item .dropdown-menu {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeFolders .Folders .item .dropdown-item {
	cursor: pointer;
	padding: 5px 5px 5px 35px;
}
.CompositePanel .CompositeFolders .Folders .item .dropdown-item:hover {
	background-color: #EFF0F7;
}
.CompositePanel .CompositeFolders .Folders .item .dropdown-item:active {
	background-color: #CED2E4;
}
.CompositePanel .CompositeFolders .Folders .item .Rename{
	background: url(/images/pen_icon.png) no-repeat;
	background-size: 20px;
	background-position: 7px 5px;
}
.CompositePanel .CompositeFolders .Folders .item .Move{
	background: url(/images/move_icon.png) no-repeat;
	background-size: 19px;
	background-position: 7px 6px;
}

.CompositePanel .CompositeFolders .Folders .item .Delete{
	background: url(/images/delete_icon.png) no-repeat;
	background-size: 16px;
	background-position: 9px 5px;
}
.CompositePanel .CompositeList{
	width: 100%;
	height: auto;
	background-color: #FFF;
	border-radius: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 15px;
}
.CompositePanel .CompositeList .title{
	font-size: 22px;
	font-weight: 500;
	color: #283252;
	font-weight: 600;
	padding: 5px 25px 0px 25px;
}
.CompositePanel .CompositeList .text{
	font-size: 16px;
	font-weight: 500;
	color: #787f8a;
	font-weight: 400;
	padding: 5px 25px 0px 35px;
}
.CompositePanel .CompositeList .text b{
	color: #d14e6c;
}
.CompositePanel .CompositeList table{
	font-size: 16px;
	padding: 25px;
	border-color: #f4f5f9;
}
.CompositePanel .CompositeList table th{
	padding: 15px 28px 10px 32px;
	color: #404762;
	font-size: 16px;
}
.CompositePanel .CompositeList table td{
	padding: 15px 28px 10px 32px;
	color: #7d839e;
	font-size: 15px;
}
.CompositePanel .CompositeList table .dropdown-menu {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeList table .dropdown-item {
	cursor: pointer;
	padding: 5px 5px 5px 35px;
}
.CompositePanel .CompositeList table .dropdown-item:hover {
	background-color: #EFF0F7;
}
.CompositePanel .CompositeList table .dropdown-item:active {
	background-color: #CED2E4;
}
.CompositePanel .CompositeList table .Edit{
	background: url(/images/pen_icon.png) no-repeat;
	background-size: 20px;
	background-position: 7px 5px;
}
.CompositePanel .CompositeList table .Move{
	background: url(/images/move_icon.png) no-repeat;
	background-size: 19px;
	background-position: 7px 6px;
}

.CompositePanel .CompositeList table .Delete{
	background: url(/images/delete_icon.png) no-repeat;
	background-size: 16px;
	background-position: 9px 5px;
}
.CompositePanel .CompositeList .download {
	width: 130px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	font-size: 16px;
	color: #d14e6c;
	background: url(/images/download_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 95px 7px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeList .edit {
	width: 80px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	font-size: 16px;
	color: #d14e6c;
	background: url(/images/edit_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 49px 8px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeList .view {
	width: 36px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	background: url(/images/view_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 7px 9px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeList .menu {
	width: 36px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	background: url(/images/menu_icon_2.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 16px 8px;
	float: right;
	transition: 0.2s;
	margin-top: -7px;
}
.CompositePanel .CompositeList .download:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeList .edit:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeList .view:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeList .menu:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeList .CompositeContent {
	background-color: #FFF;
	width: 100%;
	height: auto;
	border-radius: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 20px;
	box-shadow: 1px -14px 10px -12px rgba(0,0,0,0.15);
}
.CompositePanel .CompositeMapBar {
	float: left;

}
.CompositePanel .CompositeList .CompositeFolderMap {
	width: 100%;
	height: 35px;
	margin-left: 35px;
	margin-top: 11px;
	font-size: 24px;
	font-weight: 600;
	color: #283252;
}
.CompositePanel .CompositeList .CompositeFolderMap .FolderMapItem{
	float: left;
	padding: 0px 24px 0px 0px;
	background: url(/images/composite_right_icon.png) no-repeat;
	background-position: right;
	margin-right: 12px;
}
.CompositePanel .CompositeList .CompositeFolderMap .last{
	background:none;
}

.CompositePanel .CreateComposite {
	height: 47px;
  border-radius: 25px;
  background-color: #d14e6c;
  font-size: 18px;
  border: none;
  padding: 10px 35px;
  color: #FFF;
  font-weight: bold;
  margin-right: 30px;
  margin-top: 17px;
	float: right;
	cursor: pointer;
}


.FolderOption .title{
	font-weight: bold;
	font-size: 25px;
	height: 40px;
	}
.FolderOption .text{
	font-size: 18px;
	color: #b0b5bc;
	line-height: 20px;
	font-weight: 300;
}
.FolderOption .text span{
	font-weight: 600;
	color: #d14e6c;

}
.FolderOption .form {
	margin-top: 25px;
}
.FolderOption .form input{
	width: 100%;
	height: 51px;
	border-radius: 10px;
	background-color: #f5f6fa;
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: 400;
}
.FolderOption .form button{
	width: 100%;
	height: 47px;
	border-radius: 25px;
	background-color: #d14e6c;
	margin-top: 7px;
	font-size: 18px;
	border:none;
	padding: 10px 35px;
	color: #FFF;
	font-weight: bold;
	margin-left: 0px;
}
.FolderOption .form .btnWhite{
	width: 100%;
	height: 47px;
	border-radius: 25px;
	background-color: #F2F2F2;
	margin-top: 7px;
	font-size: 18px;
	border:none;
	padding: 10px 35px;
	color: #AD9F9F;
	font-weight: bold;
	margin-left: 0px;
}
.FolderOption .btn-close {
	float: right;
	font-size: 22px;
	margin-top: 2px;
}

.moved {
	color: #d14e6c;
}


.MoveList {
	margin-top: 25px;
  width: 100%;
  height: 300px;
  border-radius: 10px;
  background-color: #f5f6fa;
  margin-bottom: 10px;
  font-size: 17px;
  font-weight: 400;
  padding: 15px;
  overflow-y: scroll;
}
.MoveList .upFolder{
	width: 100%;
	background: url(/images/move_folder_op.png) no-repeat;
	padding: 4px 0px 0px 22px;
	background-position: 0px 9px;
	background-size: 18px;
  font-size: 16px;
  font-weight: 400;
}
.MoveList .folderItem{
	width: 100%;
	background: url(/images/move_folder_cl.png) no-repeat;
	padding: 4px 0px 0px 22px;
	background-position: 0px 8px;
  background-size: 16px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 400;
  height: 25px;
  overflow: hidden;
  transition: 0.2s;
}
.MoveList .of{
	background: url(/images/move_folder_op.png) no-repeat;
	background-position: 0px 9px;
	background-size: 18px;
}
.MoveList .cf{
	background: url(/images/move_folder_cl.png) no-repeat;
	background-position: 0px 8px;
	background-size: 16px;
}

.MoveList .moveTo {
	width: 30px;
	height: 20px;
	float: right;
	background: url(/images/move_icon.png) no-repeat;
	background-position: 7px 3px;
	background-size: 16px;
	background-color: #fff;
	border-radius: 10px;
	overflow: hidden;
	font-size: 12px;
	padding-left: 30px;
	padding-top: 1px;
	transition: 0.2s;
}
.MoveList .moveTo:hover{
	width: 70px;
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}

/*

.MoveList .moveTo {
	width: 85px;
	float: right;
	background: url(/images/move_icon.png) no-repeat;
	background-position: 63px 3px;
	background-size: 16px;
	background-color: #fff;
	border-radius: 10px;
	height: 20px;
	font-size: 12px;
	padding-left: 10px;
	padding-top: 1px;
}
.MoveList .moveTo:hover{
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
*/


.modal-content {
	border-radius: 30px;
	padding: 15px;
	border: none;
}


#UserCreate .title{
	font-weight: bold;
	font-size: 25px;
	height: 40px;
	}
#UserCreate .text{
	font-size: 18px;
	color: #b0b5bc;
	line-height: 20px;
	font-weight: 300;
}
#UserCreate .text span {
	color: #d14e6c;
	font-weight: bold;
}
#UserCreate .form {
	margin-top: 25px;
}
#UserCreate .form input{
	width: 100%;
	height: 51px;
	border-radius: 10px;
	background-color: #f5f6fa;
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: 400;
}
#UserCreate .form button{
	width: 100%;
	height: 47px;
	border-radius: 25px;
	background-color: #d14e6c;
	margin-top: 7px;
	font-size: 18px;
	border:none;
	padding: 10px 35px;
	color: #FFF;
	font-weight: bold;
	margin-left: 0px;
}
#UserCreate .btn-close {
	float: right;
	font-size: 22px;
	margin-top: 2px;
}


.CompositePanel .CompositeEdit{
	width: 100%;
	height: auto;
	background-color: #FFF;
	border-radius: 20px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 15px;
}
.CompositePanel .CompositeEdit .title{
	font-size: 22px;
	font-weight: 500;
	color: #283252;
	font-weight: 600;
	padding: 5px 25px 0px 25px;
}
.CompositePanel .CompositeEdit .text{
	font-size: 16px;
	font-weight: 500;
	color: #787f8a;
	font-weight: 400;
	padding: 5px 25px 0px 35px;
}
.CompositePanel .CompositeList .text b{
	color: #d14e6c;
}
.CompositePanel .CompositeEdit table{
	font-size: 16px;
	padding: 25px;
	border-color: #FFF;
}
.CompositePanel .CompositeEdit table th{
	padding: 5px 5px 5px 5px;
	color: #404762;
	font-size: 16px;
}
.CompositePanel .CompositeEdit table td{
	padding: 5px 5px 5px 5px;
	color: #7d839e;
	font-size: 15px;
}
.CompositePanel .CompositeEdit table .dropdown-menu {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
}
.CompositePanel .CompositeEdit table .dropdown-item {
	cursor: pointer;
	padding: 5px 5px 5px 35px;
}
.CompositePanel .CompositeEdit table .dropdown-item:hover {
	background-color: #EFF0F7;
}
.CompositePanel .CompositeEdit table .dropdown-item:active {
	background-color: #CED2E4;
}
.CompositePanel .CompositeEdit table .Edit{
	background: url(/images/pen_icon.png) no-repeat;
	background-size: 20px;
	background-position: 7px 5px;
}
.CompositePanel .CompositeEdit table .Move{
	background: url(/images/move_icon.png) no-repeat;
	background-size: 19px;
	background-position: 7px 6px;
}

.CompositePanel .CompositeEdit table .Delete{
	background: url(/images/delete_icon.png) no-repeat;
	background-size: 16px;
	background-position: 9px 5px;
}
.CompositePanel .CompositeEdit table label{
	float: left;
	padding-top: 4px;
	margin-right: 10px;
	margin-left: 20px;
}
.CompositePanel .CompositeEdit table .SelectFont{
	width:138px;
	height: 36px;
	border-radius: 10px;
	border-radius: 20px;
}
.CompositePanel .CompositeEdit table .SelectSize{
	width:55px;
	height: 36px;
	border-radius: 10px;
	border-radius: 20px;

}
.CompositePanel .CompositeEdit .download {
	width: 130px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	font-size: 16px;
	color: #d14e6c;
	background: url(/images/download_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 95px 7px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeEdit .edit {
	width: 80px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	font-size: 16px;
	color: #d14e6c;
	background: url(/images/edit_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 49px 8px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeEdit .view {
	width: 36px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	background: url(/images/view_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 7px 9px;
	float: right;
	margin-right: 10px;
	margin-top: -7px;
	transition: 0.2s;
}
.CompositePanel .CompositeEdit .menu {
	width: 36px;
	height: 36px;
	border-radius: 20px;
	padding: 6px 15px 6px 15px;
	background: url(/images/menu_icon_2.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 16px 8px;
	float: right;
	transition: 0.2s;
	margin-top: -7px;
}
.CompositePanel .CompositeEdit .download:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeEdit .edit:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeEdit .view:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeEdit .menu:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeEdit .CompositeContent {
	background-color: #FFF;
	width: 100%;
	height: auto;
	border-radius: 20px;
	padding: 30px;
	margin-top: 20px;
	box-shadow: 1px -14px 10px -12px rgba(0,0,0,0.15);
}
.CompositePanel .CompositeMapBar {
	float: left;

}
.CompositePanel .CompositeEdit .CompositeEditName {
	width: 100%;
	height: 35px;
	margin-left: 35px;
	margin-top: 11px;
	font-size: 24px;
	font-weight: 600;
	color: #283252;
}
.CompositePanel .CompositeEdit .CompositeEditName .EditMapItem{
	float: left;
	padding: 0px 24px 0px 0px;
	background: url(/images/composite_right_icon.png) no-repeat;
	background-position: right;
	margin-right: 12px;
}
.CompositePanel .CompositeEdit .CompositeEditName .last{
	background:none;
}
.CompositePanel .CompositeEdit .DateStyle {
     font-family: 'Domine', sans-serif;
     font-size: 20px;
     line-height: 30px;
}
.CompositePanel .CompositeEdit .SchoolStyle {
     font-size: 35px;
     line-height: 30px;
     font-family: 'Great Vibes', sans-serif;
}
.CompositePanel .CompositeEdit .ClassRoomStyle {
     font-size: 20px;
     line-height: 30px;
     font-family: 'Domine', sans-serif;
}
.CompositePanel .SaveComposite {
	height: 47px;
  border-radius: 25px;
  background-color: #d14e6c;
  font-size: 18px;
  border: none;
  padding: 10px 35px;
  color: #FFF;
  font-weight: bold;
  margin-right: 30px;
  margin-top: 17px;
	float: right;
	cursor: pointer;
}
.CompositePanel .CompositeEdit .TextEdit {
	width: 45px;
	height: 36px;
	border-radius: 20px;
	border: none;
	padding: 6px 10px 6px 15px;
	font-size: 16px;
	color: #d14e6c;
	background: url(/images/edit_icon.png) no-repeat;
	background-color: #f4f5f9;
	background-position: 15px 7px;
	transition: 0.2s;
	text-align: left;
}
.CompositePanel .CompositeEdit .TextEdit:hover {
	box-shadow: 0px 3px 16px -3px rgba(0,0,0,0.2);
	background-color: #FFF;
}
.CompositePanel .CompositeEdit .photoItem {
    float: left;
    margin-right: 15px;
    margin-bottom: 15px;
    width: 120px;
    height: 235px;
    border: solid 2px #F5E9EC;
    text-align: center;
    border-radius: 20px;
    padding-top: 10px;
   }
 .CompositePanel .CompositeEdit .logoBg {
 	width: 170px;
 }
 .CompositePanel .PhotosBar{
 	margin-bottom: 105px;
 }
 .CompositePanel .CompositeEdit .CompositePhotoName {
	width: 100%;
	height: 35px;
	font-size: 18px;
	font-weight: 600;
	color: #283252;
}

.accordion-item {
	border: solid 1px ##FFF1F1;
}
 .accordion-button {
 	font-size: 16px;
 	color: #D14E6C;
 	font-weight: 600;
 }
 .accordion-button:not(.collapsed) {
    color: #D14E6C;
    background-color: #ffedf1;
    
}
.badge {
	font-size: 16px;
	background-color: #D14E6C !important;
	margin-right: 5px;
	padding: 5px 10px;
	border-radius: 15px;
}