.worksrooms__block{
	padding:38px 24px;
	& .top{
		display: flex;
		align-items:center;
		justify-content:space-between;
		margin-bottom: 24px;
		& .btns{
			display: flex;
			align-items:center;
			justify-content:flex-end;
			&>a{
				margin-right: 16px;
			}
		}
		& .view__switcher{
			& ul{
				padding:0px;
				list-style-type: none;
				margin:0px;
				padding:1px;
				border-radius: 8px;
				border:1px solid #D1D5DB;
				display: flex;
				align-items:center;
				justify-content:center;
				&>li{
					&>a{

						min-width: 35px;
						min-height: 35px;
						display: flex;
						align-items:center;
						justify-content:center;
						border-radius: 8px;

						&.current{
							& svg path{
								fill:#111928;
							}
							background-color:rgba(229,231,235,.6);
						}
					}
				}
			}
		}
		&>h6{
			margin:0px;
			font-size: 28px;
			line-height: 120%;
			font-weight: 600;
			color:#111928;
		}
	}
	& .workroom__plates{
		& .plates{
			display: grid;
			grid-template-columns:repeat(4,1fr);
			grid-column-gap:20px;
			grid-row-gap:20px;
			& .plate{
				border-radius: 8px;
				border:1px solid #E5E7EB;
				background-color:#fff;
				overflow:hidden;
				& .desc{
					&>ul{
						padding:0px;
						list-style-type: none;
						margin:0px;
						display: flex;
						align-items:center;
						justify-content:flex-start;
						flex-wrap:wrap;
						&>li{
							font-size: 14px;
							line-height: 150%;
							font-weight: 500;
							color:#6B7280;
							&.spacer{
								display: inline-flex;
								align-items:center;
								justify-content:center;
								margin:0px  8px;
							}
						}
					}
					&>p{
						margin-top: 0px;
						margin-bottom: 8px;
						font-size: 16px;
						line-height: 150%;
						font-weight: 500;
						color:#111928;
					}
					padding:16px;
					& .top{
						margin-bottom: 8px;
						&>a{
						    display: -webkit-inline-box;
						    display: -ms-inline-flexbox;
						    display: inline-flex;
						    -webkit-box-align: center;
						    -ms-flex-align: center;
						    align-items: center;
						    -webkit-box-pack: center;
						    -ms-flex-pack: center;
						    justify-content: center;
						    min-width: 30px;
						    max-width: 30px;
						    min-height: 30px;
						    max-height: 30px;
						    border-radius: 4px;
						    -webkit-transition: .3s ease all;
						    transition: .3s ease all;
						    &:hover{
						    	background-color:#F9FAFB;
						    }
						}
						&>span{
							margin-right: 12px;
							display: inline-flex;
							align-items:center;
							justify-content:center;
							min-height: 22px;
							border-radius: 6px;
							padding-left: 10px;
							padding-right: 10px;
							font-weight: 500;
							font-size: 12px;
							line-height: 150%;
							padding-left: 10px;
							padding-right: 10px;
						}
					}
				}
				& .media{
					display: flex;
					align-items:center;
					justify-content:center;
					height: 120px;
					background-color:#F9FAFB;
					padding:15px;
					& img{
						max-height: 80px;
						max-width: 100%;
					}
				}
			}
		}
		& .top{
			margin-bottom: 24px;
			width: 100%;
			& .group__input{
				width: 100%;
				max-width: 650px;
				position: relative;
				display: flex;
				align-items:center;
				&>span{
					z-index: 2;
					left: 10px;
					display: inline-flex;
					position: absolute;
					margin-top: -1px;
				}
				& input{
					width: 100%;
					position: relative;
					height: 37px;
					border:1px solid #D1D5DB;
					border-radius: 8px;
					background-color:#F9FAFB;
					padding-left: 34px;
					padding-right: 20px;
					font-size: 14px;
				}
			}
		}
	}
	& .workroom__dashboard{
		width: 100%;
		& .list{
			& .search{
				padding:16px;
				& .group__input{
					width: 100%;
					max-width: 650px;
					position: relative;
					display: flex;
					align-items:center;
					&>span{
						z-index: 2;
						left: 10px;
						display: inline-flex;
						position: absolute;
						margin-top: -1px;
					}
					& input{
						width: 100%;
						position: relative;
						height: 37px;
						border:1px solid #D1D5DB;
						border-radius: 8px;
						background-color:#F9FAFB;
						padding-left: 34px;
						padding-right: 20px;
						font-size: 14px;
					}
				}
			}
			border:1px solid #E5E7EB;
			border-radius: 8px;
			overflow:hidden;
			background-color:#fff;
		}
	}
}
@media (max-width: 1280px){
	.worksrooms__block .workroom__plates .plates{
		grid-template-columns:repeat(3 ,1fr);
	}
}
@media (max-width: 991px){
	.worksrooms__block .top>h6{
		font-size: 24px;
	}
	.worksrooms__block .top{
		margin-bottom: 15px;
	}
	.worksrooms__block .workroom__plates .top{
		margin-bottom: 15px;
	}
	.worksrooms__block .workroom__plates .plates{
		grid-template-columns:repeat(2,1fr);
		grid-column-gap:12px;
		grid-row-gap:12px;
	}
}
@media (max-width: 767px){
	.worksrooms__block .top .btns>a{
		width: 100%;
	}

	.worksrooms__block .top{
		position: relative;
	}
	.worksrooms__block .top .btns .view__switcher{
		position: absolute;
		right: 0px;
		top:0px;
	}
	.worksrooms__block .workroom__plates .plates .plate .desc .top{
		flex-direction:row;
	}
	.worksrooms__block .top .btns>a{
		margin-right: 0px;
	}
	.worksrooms__block .top{
		flex-direction:column;
	}
	.worksrooms__block .top>h6{
		width: 100%;
		padding-top:4px;
		margin-bottom: 13px;
	}
	.worksrooms__block .top .btns{
		width: 100%;
	}
	.worksrooms__block{
		padding:20px 15px;
	}
}
@media (max-width: 640px){
	.worksrooms__block .workroom__plates .plates{
		grid-template-columns:1fr;
	}
}