.task-login #layout-content
{
  display: flex !important;
}

#logo
{
	top: 1vh !important;
}

#login-form
{
	top: 2vh;
}

.grid-item-login
{
	justify-content: center;
}

.simple-grid
{
	display: grid !important;
	grid-template-columns: 1fr;
	grid-template-areas: "login";
	grid-gap: 1rem;
	padding: 2rem 4rem;
	margin: auto;
	width: auto;
	overflow: hidden !important;
}

.simple-grid a
{
	color: black !important;
}

[class*='simple-grid-']
{
	background: white;
	height: 300px;
	width: 240px;
}

[class*='-login']
{
	grid-area: login;
}

[class*='-article']
{
	--col-border: rgba(12, 12, 12, 0.1);
	cursor: pointer;
	display: none;
	box-shadow: 0 0 0 0 var(--col-border);
	border: 0.1rem solid var(--col-border);
	border-radius: 0.3rem;
	text-align: left;
	transition: box-shadow 0.1s;
}

[class*='-article']:hover
{
	box-shadow: 0 0 0 0.3rem var(--col-border);
}

@media(orientation: portrait)
{
	.simple-grid
    {
		grid-template-columns: 1fr;
		grid-template-areas:
		"login"
		"artia";
	}
	[class*='simple-grid-article-s']
    {
		grid-area: artia;
		display: block;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 550px)
{
	.simple-grid
    {
		grid-template-columns: 1fr 1fr;
		grid-template-areas:
		"artia login";
	}
    [class*='simple-grid-article-s']
    {
		grid-area: artia;
		display: block;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-height: 700px)
{
	.simple-grid
    {
		grid-template-columns: 1fr;
		grid-template-areas:
		"login"
		"artia";
	}
	[class*='simple-grid-article-s']
    {
		grid-area: artia;
		display: block;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 550px) and (min-height: 700px)
{
	[class*='simple-grid-']
    {
		height: 300px;
		width: 240px;
		margin: auto;
	}
	.simple-grid
    {
		grid-template-areas:
		"artia login"
		"artib artic";
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
	}
	[class*='simple-grid-article-m']
    {
		display: block;
	}
	[class*='simple-grid-article-m-1']
    {
		grid-area: artia;
	}
	[class*='simple-grid-article-m-2']
    {
		grid-area: artib;
	}
	[class*='simple-grid-article-m-3']
    {
		grid-area: artic;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 800px) and (min-height: 420px)
{
	.simple-grid
    {
		grid-template-areas:
		"artia login artib";
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: auto;
	}
	[class*='simple-grid-article-l']
    {
		display: block;
	}
	[class*='simple-grid-article-l-1']
    {
		grid-area: artia;
	}
	[class*='simple-grid-article-l-2']
    {
		grid-area: artib;
	}
	[class*='simple-grid-article-l-3']
    {
		grid-area: artic;
		display: none;
	}
	[class*='simple-grid-article-l-4']
    {
		grid-area: artid;
		display: none;
	}
	[class*='simple-grid-article-l-5']
    {
		grid-area: artie;
		display: none;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 800px) and (min-height: 700px)
{
	.simple-grid
    {
		grid-template-areas:
		"artia login artib"
		"artic artid artie";
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: auto;
	}
	[class*='simple-grid-']
    {
		height: 300px;
		width: 240px;
	}
	[class*='simple-grid-article-l-3']
    {
		grid-area: artic;
		display: block;
	}
	[class*='simple-grid-article-l-4']
    {
		grid-area: artid;
		display: block;
	}
	[class*='simple-grid-article-l-5']
    {
		grid-area: artie;
		display: block;
	}
    .article-title
    {
	    font-size: 17px;
    }
    .article-content
    {
        font-size: 15px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 800px) and (min-height: 980px)
{
	.simple-grid
    {
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-areas:
		"artia login artib"
		"artic artid artie"
		"artif artig artih";
	}
	.simple-grid-article
    {
		display: block !important;
	}
	[class*='simple-grid-article']:nth-child(2)
    {
		grid-area: artia !important;
	}
	[class*='simple-grid-article']:nth-child(3)
    {
		grid-area: artib !important;
	}
	[class*='simple-grid-article']:nth-child(4)
    {
		grid-area: artic !important;
	}
	[class*='simple-grid-article']:nth-child(5)
    {
		grid-area: artid !important;
	}
	[class*='simple-grid-article']:nth-child(6)
    {
		grid-area: artie !important;
	}
	[class*='simple-grid-article']:nth-child(7)
    {
		grid-area: artif !important;
	}
	[class*='simple-grid-article']:nth-child(8)
    {
		grid-area: artig !important;
	}
	[class*='simple-grid-article']:nth-child(9)
    {
		grid-area: artih !important;
	}
    .article-title
    {
	    font-size: 20px;
    }
    .article-content
    {
        font-size: 17px;
	    -webkit-line-clamp:6;
    }
}

@media(min-width: 1050px) and (min-height: 1100px)
{
	[class*='simple-grid-']
    {
		height: 330px;
		width: 295px;
	}
    .article-title
    {
	    font-size: 20px;
    }
    .article-content
    {
        font-size: 17px;
	    -webkit-line-clamp:6;
    }
}

.article-thumbnail
{
	width: 100%;
}

.article-information
{
	box-sizing: border-box;
	min-height: 180px;
	padding: 1rem;
}

.article-url
{
	display: none;
}

a
{
    text-decoration: none !important;
}

.article-title
{
	color: #111;
	line-height: 24px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
    text-decoration: none !important;
}

.simple-grid-article:hover .article-title
{
	color: #6B8DCF
}

.article-content
{
	line-height: 20px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	margin: 0;
    text-decoration: none !important;
}