/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Description: Child tema za Hello Elementor temo.
Author: Zaslon Telecom, Boris Turk
Author URI: https://example.com
Template: hello-elementor
Version: 1.0.0
*/

/* Sticky Header */
    #site-header {
        position: -webkit-sticky; /* Za Safari */
        position: sticky;
        top: 0;
        z-index: 9999;
        width: 100%;
        
    
        top: 0;
        left: 0;
        transition: transform 0.3s ease-in-out;
    }

/* Header and logo */
    .site-header:not(.header-stacked) .header-inner .site-branding {
        max-width: 80%!important;
        overflow: hidden;
    }
    
    .site-logo img {
        -webkit-filter: drop-shadow(0px 0px 3px rgba(255,255,255, 1));
        -ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#ffffff')";
        filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#ffffff')";
    	width: 100px;
    	max-width: 100px!important;
    }
    
    .site-header:not(.header-stacked) .header-inner .site-branding {
        max-width: 80%;
        display: flex;
        flex-direction: row;
    }
    .eicon-menu-bar:before {
    	color: white;
    }
    
    .site-header .site-description {
        line-height: 1.5;
        padding-left: 10px;
        align-self: center;
        font-size: 150%;
    }

    #menu-glavni a {color: white;}

    .site-navigation-dropdown[aria-hidden="false"] #menu-glavni  a {
        color: var( --e-global-color-primary ); /* Barva besedila, ko je aria-hidden nastavljeno na false */
    }
    
    .site-navigation-dropdown[aria-hidden="false"] #menu-glavni  a:hover {
        color: var( --e-global-color-primary ); /* Barva besedila ob prehodu z mi分ko */
    }


/* GUMBI, SLIKE, NASLOV, RAZNO */
    .zt-najave-form button {
       overflow-wrap: break-word; white-space: normal;
    }
    
    .site-logo img{
        object-fit: contain;
    }
    
    #content button, #content .elementor-button {
        text-transform: uppercase;
    }
    h1.entry-title {
        display: var(--page-title-display);
        margin: 0.5rem auto 1rem auto;
        width: 1140px;
    }

    .elementor-column-gap-default>.elementor-column>.elementor-element-populated {
        padding: 10px 0px;
    }

    .site-main ul {margin-bottom: .9rem;}
    
    .qmn_quiz_container a.qmn_btn, .qmn_quiz_container a.btn {
        background-color: var( --e-global-color-primary )!important;
    }
    .qmn_quiz_container a.qmn_btn:hover, .qmn_quiz_container a.btn:hover {
        background-color: var(--e-global-color-accent);
    }


/* PAGE CONTENT */
    .page-content {
        margin-right: auto;
        margin-left: auto;
        width: 100%;
    }
    @media (min-width: 576px){
    	.page-content {
    		max-width: 500px;
    	}
    }
    @media (min-width: 768px){
    	.page-content {
    		max-width: 600px;
    	}
    }
    @media (min-width: 992px){
    	.page-content {
    		max-width: 800px;
    	}
    }
    @media (min-width: 1200px){
    	.page-content {
    		max-width: 1140px;
    	}
    }
    
    @media (max-width: 575px){
    	.page-content {
    		padding-right: 10px;
    		padding-left: 10px;
    	}
    }
    
/* TABELE ZA PRAVILA GDPR */

    .safety-table .img-pravila-standard{
    	width: 64px;	
    	max-width: 64px;	
    }

    #content .safety-table {
        width: 100%;
        max-width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
    }
    
    #content .safety-table td, #content table th {
        word-wrap: break-word; /* Prelomi dolge besede */
        overflow-wrap: break-word; /* Podpora za različne brskalnike */
        font-size: 14px;
    }
    
    /* Pravila za colgroup z enim stolpcem */
    #content .safety-table colgroup col.column:nth-of-type(1):only-of-type {
      width: 100%; /* Če je samo en stolpec */
    }
    
    /* Pravila za colgroup z dvema stolpcema */
    #content .safety-table colgroup col.column:nth-of-type(1):nth-last-of-type(2) {
      width: 20%; /* Prvi stolpec pri dveh stolpcih */
    }
    
    #content .safety-table colgroup col.column:nth-of-type(2):nth-last-of-type(1) {
      width: 80%; /* Drugi stolpec pri dveh stolpcih */
    }
    
    /* Pravila za colgroup s tremi stolpci */
    #content .safety-table colgroup col.column:nth-of-type(1):nth-last-of-type(3) {
      width: 20%; /* Prvi stolpec pri treh stolpcih */
    }
    
    #content .safety-table colgroup col.column:nth-of-type(2):nth-last-of-type(2) {
      width: 60%; /* Drugi stolpec pri treh stolpcih */
    }
    
    #content .safety-table colgroup col.column:nth-of-type(3):nth-last-of-type(1) {
      width: 20%; /* Tretji stolpec pri treh stolpcih */
    }

    
    #content .safety-table  tr td:nth-child(1):only-child {
      width: 100%; /* Če je samo en stolpec v vrstici */
    }
    
    #content .safety-table  tr td:nth-child(1):nth-last-child(2),
    #content .safety-table  tr td:nth-child(2):nth-last-child(1) {
      width: 20% !important; /* Prvi stolpec pri dveh stolpcih */
    }
    
    #content .safety-table  tr td:nth-child(2):nth-last-child(1) {
      width: 80% !important; /* Drugi stolpec pri dveh stolpcih */
    }
    
    #content .safety-table  tr td:nth-child(1):nth-last-child(3),
    #content .safety-table  tr td:nth-child(3):nth-last-child(1) {
      width: 20% !important; /* Prvi in tretji stolpec pri treh stolpcih */
    }
    
    #content .safety-table  tr td:nth-child(2):nth-last-child(2) {
      width: 60% !important; /* Drugi stolpec pri treh stolpcih */
    }
    
    #content .safety-table  tr td img {
        max-width:100%;
    }


@media (max-width: 768px) {

    /* TABELE */
        /* Pravila za colgroup z dvema stolpcema */
        #content .safety-table colgroup col.column:nth-of-type(1):nth-last-of-type(2) {
          width: 40%; /* Prvi stolpec pri dveh stolpcih */
        }
        
        #content .safety-table colgroup col.column:nth-of-type(2):nth-last-of-type(1) {
          width: 60%; /* Drugi stolpec pri dveh stolpcih */
        }
        
        /* Pravila za colgroup s tremi stolpci */
        #content .safety-table colgroup col.column:nth-of-type(1):nth-last-of-type(3) {
          width: 40%; /* Prvi stolpec pri treh stolpcih */
        }
        
        #content .safety-table colgroup col.column:nth-of-type(2):nth-last-of-type(2) {
          width: 40%; /* Drugi stolpec pri treh stolpcih */
        }
        
        #content .safety-table colgroup col.column:nth-of-type(3):nth-last-of-type(1) {
          width: 20%; /* Tretji stolpec pri treh stolpcih */
        }
        
        #content .safety-table  tr td:nth-child(1):nth-last-child(2),
        #content .safety-table  tr td:nth-child(2):nth-last-child(1) {
          width: 40% !important; /* Prvi stolpec pri dveh stolpcih */
        }
        
        #content .safety-table  tr td:nth-child(2):nth-last-child(1) {
          width: 60% !important; /* Drugi stolpec pri dveh stolpcih */
        }
        
        #content .safety-table  tr td:nth-child(1):nth-last-child(3),
        #content .safety-table  tr td:nth-child(2):nth-last-child(2) {
          width: 40% !important; /* Prvi in drugi stolpec pri treh stolpcih */
        }
            
        #content .safety-table  tr td:nth-child(3):nth-last-child(1) {
          width: 20% !important; /* Ttretji stolpec pri treh stolpcih */
        }


    /* HEADER */
    
        header.site-header {
            position: absolute;
        }
        #content{
           padding-top: 28px;
        }
        #site-header .site-logo img,
        body[data-elementor-device-mode] #site-header .site-logo img{
            width:60px !important;
        }
        #site-header .site-description,
        
        
    /* FONT */    
        body[data-elementor-device-mode] #site-header .site-description{
            font-size: 1.1rem!important;
        }
        body[data-elementor-device-mode] h1 {
            font-size: 1.7rem;
        }
        
        body[data-elementor-device-mode] h2 {
            font-size: 1.6rem;
        }
        
        body[data-elementor-device-mode] h3 {
            font-size: 1.5rem;
        }
        
        body[data-elementor-device-mode] h4 {
            font-size: 1.25rem;
        }
        
        body[data-elementor-device-mode] h5 {
            font-size: 1.1rem;
        }
        
        body[data-elementor-device-mode] h6 {
            font-size: 1rem;
        }
        
        /* GUMBI */
        #content button, #content .elementor-button {
            width: 100%!important;
            border-color: var( --e-global-color-primary );
        }
}


@media (min-width: 1200px){
	.site-footer .footer-inner, .site-footer:not(.dynamic-footer), .site-header .header-inner, .site-header:not(.dynamic-header), body:not([class*=elementor-page-]) .site-main {
    	max-width: 1140px;
	}	
}


/* FLAGS */
	.cpel-switcher--layout-horizontal.cpel-switcher--align-center .cpel-switcher__list {
		justify-content: space-between;
	}
	li.cpel-switcher__lang {
		border-style: solid;
		border-width: 1px 1px 1px 1px;
		border-radius: 3px;
		padding:5px;
		width: calc(100% / 4) vw !important; /* devided by number of languages - flags */
		margin-bottom: 5px !important;		
		margin-left: 0px ;
		margin-right: 1vw!important ;
		border-color: var( --e-global-color-primary );
	}

	li.cpel-switcher__lang  a {
		font-size: 1.5vw!important;
		display: table-cell;
	}

	.cpel-switcher__flag {    
		max-width: 5vw;
		height: auto !important;
	}
	cpel-switcher__code, .cpel-switcher__flag, .cpel-switcher__name {    
		white-space: break-spaces;
		width: calc(100% - 10px);
	}

	.cpel-switcher__lang a {
		height: 100%;
		vertical-align: middle;
	}

	.cpel-switcher--layout-horizontal .cpel-switcher__lang:last-child {
    	margin-right: 0px!important;
	}	

/* KVIZ */
	.qmn_quiz_container .qmn_btn, .qmn_quiz_container .btn{
		background-color: var(--e-global-color-primary)!important;
		border-style: solid!important;
		border-radius: 0px 0px 0px 0px!important;
		font-size:18px!important;
		color: white !important;
		margin-top:0px;
		padding: 20px 40px!important;
		line-height:1!important;
		text-transform: uppercase!important;
		font-weight: 500!important;
	}

	.qmn_mc_answer_wrap  {
		display: flex;
		margin-bottom: 10px;
	}

	.quiz_section .mlw_qmn_new_question {
		font-weight: bold;
		display: inline;
		width: auto;
		margin-bottom: 10px;
	}

	.quiz_section .qmn_radio_answers label, .quiz_section .qmn_check_answers label, .quiz_section .qmn_accept_answers label {
		display: inline-block;
		margin: 0 5px;
		padding: 0 5px;
		font-weight: normal;
		font-size: 14px;
		cursor: pointer;
		max-width: calc(100% - 40px);
	}

	.quiz_section {
	  display: block;
	  border: 0;
	  margin: 0;
	  padding: 15px 0 15px 0;
	}

	.qsm-results-page .qmn_question_answer.qsm-add-border-bottom {
		border-bottom: 1px solid #808080;
		padding-bottom: 25px;
	}

	.qsm-results-page .qmn_question_answer {
		margin-bottom: 30px;
	}

	.mlw_qmn_question .qsm-text-wrong-option:first-child {
		padding-top: 10px;
	}

	.qmn_mc_answer_wrap input  {
		transform: scale(1.5);
	}