﻿/* -----------------------------------------------------------------------------

    This file should be used to add your own CSS definitions or override
	the existing ones.

----------------------------------------------------------------------------- */

	/* FONT */
	/* body { font-family: 'insert-font-family-name-here', 'Arial', sans-serif; } */

	/* STANDARD LOGO DIMENSIONS */
	.header-branding img { width: 140px; }

	/* LARGE LOGO DIMENSIONS */
	/* .header-branding.m-large-logo img { width: 200px; } */
	/* Scroll down to "MEDIUM DEVICES" to change width of large logo on mobile devices */

	/* your CSS here */

	/* Város / Falu Infó Widget */
	.locale-slider{
		position:relative;
	}

	.widget-inner{
		transition: background-image 0.6s ease;
	}

	.locale-slide{
		display:none;
		position:absolute;
		top:0;
		left:0;
		width:100%;
		opacity:0;
		visibility:hidden;
		transition:
			opacity 0.5s ease,
			visibility 0.5s ease;
		z-index:1;
	}

	.locale-slide.active{
		display:block;
		opacity:1;
		visibility:visible;
		position:relative;
		z-index:2;
	}

	.locale-header{
		display:flex;
		align-items:center;
		justify-content:space-between;
	}

	.locale-nav{
		display:flex;
		gap:10px;
	}

	.locale-nav button{
		background:none;
		border:none;
		color:#fff;
		font-size:24px;
		cursor:pointer;
		padding:0;
		transition:0.3s;
		opacity:0.7;
	}

	.locale-nav button:hover{
		opacity:1;
		transform:scale(1.1);
	}

/* -----------------------------------------------------------------------------

    RESPONSIVE DEFINITIONS

----------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
        LARGE DEVICES
		devices with width between 992px and 1199px
    ------------------------------------------------------------------------- */

    @media ( max-width: 1199px ) {

		/* your CSS here */

	}

    /* -------------------------------------------------------------------------
        MEDIUM DEVICES
		devices with width between 768px and 991px
    ------------------------------------------------------------------------- */

    @media ( max-width: 991px ) {

		/* LARGE LOGO DIMENSIONS */
		.header-branding.m-large-logo img { width: 140px; }

		/* your CSS here */

	}

	/* -------------------------------------------------------------------------
        SMALL DEVICES
		devices with width between 481px and 767px
    ------------------------------------------------------------------------- */

    @media ( max-width: 767px ) {

		/* your CSS here */

	}

	/* -------------------------------------------------------------------------
        EXTRA SMALL DEVICES
		devices with width up to 480px
    ------------------------------------------------------------------------- */

	@media ( max-width: 480px ) {

		/* your CSS here */

	}