/**
 * section_shorts
 * @version	2.0
 * @release	17-01-2022
 * @author	msolowski Marcin Sołowski
 * @website	http://msolowski.pl
 */

.section_shorts.background_none .short
{
	background-color: var(--root_color_light);
}

.section_shorts .short
{
	transition: var(--global_transition);
	border-radius: 12px 12px 0 0;
}

.section_shorts.effect_hover .short:hover
{
	box-shadow: 0 var(--global_size_10) var(--global_size_20) 0 rgba(0, 0, 0, 0.1);
	transform: translateY(calc(var(--global_size_10) * -1));
}

.section_shorts .short img
{
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
	border-radius: 12px;
}

.section_shorts.effect_hover .short:hover img
{
	transform: scale(1.05, 1.05);
}

.section_shorts.effect_hover .short .link
{
	display: flex;
	justify-content: flex-end;
}

.section_shorts.effect_hover .short .global_link::after
{
	content: '';
	display: block;
	width: 32px;
	height: 32px;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='33' height='32' viewBox='0 0 33 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cg clip-path='url(%23clip0_2136_645)'%3e%3cpath d='M5.625 16H26.5781' stroke='%23060670' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3e%3cpath d='M18.625 7L27.625 16L18.625 25' stroke='%23060670' stroke-width='2' stroke-linecap='square'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='clip0_2136_645'%3e%3crect width='32' height='32' fill='white' transform='translate(0.625)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
}

.section_shorts.effect_hover .short:hover .global_link
{
	color: var(--root_color_lead);
}

/**********************************************************************************/

@media screen and (max-width: 1680px)
{
}

@media screen and (max-width: 1600px)
{
}

@media screen and (max-width: 1440px)
{
}

@media screen and (max-width: 1366px)
{
}

@media screen and (max-width: 1300px)
{
}

@media screen and (max-width: 1200px)
{
}

@media screen and (max-width: 1024px)
{
}

@media screen and (max-width: 800px)
{
}

@media screen and (max-width: 640px)
{
}

@media screen and (max-width: 480px)
{
}

@media screen and (max-width: 360px)
{
}