/*
Theme Name: Udo
Description: Child theme UDO akademija
Author: Kolomedia.eu
Template: flatsome
Version: 3.0
*/

.header.show-on-scroll, .stuck .header-main {
    background-repeat: no-repeat;
    background-position:  left !important;
    background: #fff !important;
    background-image: url(/wp-content/uploads/2023/08/stuck-header.jpg) !important;
}

.header  {
    background-repeat: no-repeat;
    background-position: left !important;
    background: #fff !important;
    background-image: url(/wp-content/uploads/2023/08/stuck-header.jpg) !important;
}


/*************** HOME PAGE **************/
.row-bottom-home {
    background-repeat: no-repeat;
    background-image: url(https://www.udo-smm.si/wp-content/uploads/2021/02/Diploma-web.jpg);
    background-attachment: fixed;
    background-position: center center;
    height: 100% !important;
}

.banner-text-box {
font-size: 3em !important; 
}

#row-1569102432 > .col > .col-inner {
    padding: 25px 25px 25px 25px;
    background-color: transparent !important;
}

.banner-bottom-left {
font-size: 1.5em; 
background: #70527c !Important;
color: #fff !Important; 
}


.banner-bottom-left:hover {
background: linear-gradient(to left, #e383ac 1%,#72547d 100%) !Important;
color: #fff !Important; 
}

.banner-bottom-right {
font-size: 1.5em; 
background: #c77392 !important; 
color: #fff !Important; 
}

.banner-bottom-right:hover {
background: linear-gradient(to left, #e383ac 1%,#72547d 100%) !Important;
color: #fff !Important; 
}

.banner-bottom {
    color: #fff; 
    font-size: 1.5rem; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    padding: 50px 12px; 
    margin: 0;
}

.nav-box>li.active>a, .nav-pills>li.active>a {
    background-color: #f36467 !important;
    color: #fff;
    opacity: 1;
    border-radius: 0px !important;
    padding-top: 10px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: 10px !important;
}


.nav-box>li.active>a, .nav-outline>li.active>a {
    border-color: currentColor;
    color: #fff !important;
    background: #7c5797 !important;
    border-radius: 0px !important;
    padding-top: 10px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: 10px !important;
}

/*<a href="https://google.com">
    <p style="color: #fff; font-size: 1.5rem; display: flex; justify-content: center; align-items: center; padding: 30px 12px; margin: 0;">hUDO, zanima me, kako bom lažje našel službo!</p>
  </a>
  */

.banner-text-box {
padding: 20px; 
background: 
}

.paralix-banner {
background: linear-gradient(to left, #e383ac 1%,#72547d 100%) !important; 
}


/********* DEMO **************/


/************* HEADER **************/

.transparent .header-main {
    height: 100px;
    background: #fff !IMPORTANT;
}

.stuck .header-main .nav > li > a {
    line-height: 30px !IMPORTANT;
}

.header-main .nav > li > a {
    line-height: 30px !IMPORTANT;
}


/*************** MODULI **************/
.moduli-box {
    text-align: center;
    color: #252021 !important;
    border: 1px solid #E8CAD4;
    color: #ffffff;
    max-width: 350px; 
}

.moduli-box-content {
    padding: 20px;
    color: #252021 !important;

}

.button-bottom {
    position: absolute;
    bottom: 0;
    margin-bottom: -40px;
    left: 0;
    right: 0;
}

.kolomedia-row { gap: 20px; }

.kolomedia-row .col { flex: 1 !important;  }

@media only screen and (max-width: 600px) {
.kolomedia-row { 
   display: grid !important;
}
}


.custom-urniki {
    padding:0px; 
}

@media only screen and (max-width: 600px) {
.custom-urniki { 
   padding-left: 15px !important;
   padding-right: 15px !important;
}
} 

.header-button .button {
    margin: 0;
    background: #70527c !important;
    color: #fff !important;
}




.custom-header-button a{
color: #fff !important;
}

.header-main .nav > li > a {
    line-height: 16px;
    padding: 10px;
}

.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
    padding-left: 0;
    padding-right: 0;
    margin: 0 10px;
    border-bottom: 1px solid #ececec;
    color: #272324 !important;
}





/*************** URNIKI **************/

.row-urniki {
    max-width: 1300px;
    max-height: 1000px;
    margin: 0 auto;
    color: #fff !Important;
    background: #fff !Important;
    border: 1px solid #F36467;
    padding: 15px;
    margin-bottom: 40px;
}





.row-urniki-color {
    max-width: 1300px;
    max-height: 1000px;
    margin: 0 auto;
    color: #fff !Important;
    background: #FCEDEE !Important;
    border: 1px solid #FCEDEE;
    padding: 15px;
    margin-bottom: 40px;
}

.row-urniki-zaposleni {
    max-width: 1100px;
    max-height: 1000px;
    margin: 0 auto;
    color: #fff !Iportant;
    background: #c77392 !important;
    padding: 15px;
    
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
    margin-bottom: 40px;
}


.row-urniki-purple {
    max-width: 1100px;
    max-height: 1000px;
    margin: 0 auto;
    color: #fff !Iportant;
    background: #fff !Important;
    border: 1px solid #7C5797 !important;
    padding: 15px;
    margin-bottom: 40px;
}

.row-urniki-color-purple {
    max-width: 1100px ;
    max-height: 1000px;
    margin: 0 auto;
    color: #fff !Iportant;
    background: #F1ECF3 !Important;
    border: 1px solid #FCEDEE;
    padding: 15px;
    margin-bottom: 40px;
}





.row-urniki-content {
    padding: 20px;
    color: #fff !Important;
}


/*************** SUBTITLE **************/
.custom-subtitle {
    font-size: 3em; 
    text-align: center !important;
    text-transform: uppercase;
    font-weight: 600;
    color: #231E21; 
}

.custom-subtitle-second  {
    font-size: 2em; 
    text-align: left !important;
    text-transform: uppercase;
    font-weight: 600;
}

.custom-subtitle-mobile {
    font-size: 2em; 
    text-align: center !important;
    text-transform: uppercase;
    font-weight: 600;
}
.custom-subtitle-all  {
    margin-bottom: -30px !Important;
}



/*************** PREDAVATELJI **************/

/*.predavatelji-box {
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
    padding-top: 20px; 
    background: #fff !important; 
 
}*/



/***.predavatelj-border {
    background: #fff;
    border: 10px solid transparent;
    -moz-border-image: -moz-linear-gradient(to right, #e383ac 1%,#72547d 100%) !important;
    -webkit-border-image: -webkit-linear-gradient(top, #e383ac 1%,#72547d 100%);
    border-image: linear-gradient(to bottom, #e383ac 1%,#72547d 100%);
    border-image-slice: 1;
    padding: 30px;
    margin-bottom: 50px; 
}

**/

.predavatelj-border {
    background: #fff;
    border: 10px solid #ed9a9c !important;
    border-image-slice: 1;
    padding: 30px;
    margin-bottom: 50px;
}

.predavatelj-box {
    background: transparent!important;
    border: 3px solid #fff;
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
}

.box-push .box-text {
    padding: 15px 20px;
    background-color: #c47199 !Important;
    max-width: 85%;
    margin: -15% auto 0;
}

.overlay {
    background-color: rgb(196 113 153 / 60%) !important;
    height: 100%;
    left: -1px;
    pointer-events: none;
    right: -1px;
    top: 0;
    transition: transform .3s,opacity .6s;
}


.box-push .box-text {
    padding: 15px 20px;
    background-color: transparent !important;
    max-width: 85%;
    margin: -23% auto 0;
}

.predavatelji-content {
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
    padding-top: 20px; 
    background: #fff !important; 
 
}

/*.predavatelji-content-hover {

 
}*/



.predavatelj-box {
    background: transparent!important;
    border:0px solid #fff;
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
}



/*.predavatelji-box:hover {
    background: linear-gradient(to right, #e383ac 1%,#72547d 100%) !important;
}
*/

.box a {
    display: inline !important;
}


/*************** PREDAVATELJI **************/
.button  {
    border: 2px solid #fff !Important; 
    background: transparent !Important;
    color: #fff !Important;
}
.predavatelj-border-main .box-image a,
.predavatelj-border-main .box-text-inner {
	position:relative;
}

.predavatelj-border-main .box-image a {
	z-index:555;
}
.predavatelj-border-main .box-text-inner {
	z-index:556;
}

.predavatelj-border-main h4,
.predavatelj-border-main p {
	color:#fff !important;
}
.predavatelj-border-main h4, 
.predavatelj-border-main p {
    color: #fff;
    -webkit-transition: all .35s ease-in-out;
    -o-transition: all .35s ease-in-out;
    transition: all .35s ease-in-out;
        transition-delay: 0s;
    -webkit-transform: translate3d(0,24px,0);
    transform: translate3d(0,24px,0);
}
.predavatelj-border-main h4 {
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    line-height: 1;
    -webkit-text-stroke: 0.7px #c47199;
}
.predavatelj-border-main p {
    opacity: 0;
    line-height: 20px;
    font-size: 16px !important;
    height: 24px;
    margin: 0;
    overflow: visible;
    -webkit-transition-delay: 50ms;
    transition-delay: 50ms;
    padding-top: 10px;
}

.predavatelj-border-main .box-text {
    top: 10px;
    position: absolute;
    left: 10px;
    right: 10px;
    padding: 0;
    text-align: center;
    bottom: 10px;
    overflow: hidden;
    border: 0px solid rgba(255,255,255,.8);
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
}
.predavatelj-border-main:hover h4, 
.predavatelj-border-main:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

/*.predavatelj-border-main:hover {
 background: linear-gradient (to right, #e383ac 1%,#72547d 100%) !important;
}*/

/*************** PROGRAM **************/
.program-title  {
    font-size: 4em !Important; 
    line-height: 1em !Important
    text-align: left !Important;
    text-transform: uppercase;
    font-weight: 600;
}

.program-content {
    font-size: 2em !Important;
}

.program-button {
font-size: 2em !Important;

}

.border-row {
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-top: 30px solid #fff;
    left: 50%;
    margin-left: -30px;
    margin-top: -1px;
margin-left: auto;
margin-right: auto;     
}

.lightbox-content {
    background-color: #fff;
    max-width: 875px;
    margin: 0 auto;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-shadow: 3px 3px 20px 0 rgb(0 0 0 / 15%);
    box-shadow: 3px 3px 20px 0 rgb(0 0 0 / 15%);
    position: relative;
    padding: 20px !important;
}

/**************** IZJAVE STRANK ****************/

.row-izjave-strank {
box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
}

/************** OTHER ***************/


.border-box {
border: 2px solid; 
padding: 20px; 
}

.border-box-zaposelni{ 
padding: 20px; 
}



/*************** CONTACT FORM    ***************/

/***contact form***/

.column-half{
    float: left;
    position: relative;
    padding: 0.65rem;
    width:50%;
    -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
}

.column-full{
    
    padding: 0.65rem;
    width:100%;
}

.wpcf7 label {
    display: block;
    width: 100%;
}


element.style {
}
.wpcf7 .wpcf7-form-control-wrap {
    display: contents;
}

select {
    box-shadow: inset 0 -1.4em 1em 0 rgba(0,0,0,.02);
    background-color: #f7f7f7;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url(data:image/svg+xml;charset=utf8, %3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E);
    background-position: right .45em top 50%;
    background-repeat: no-repeat;
    padding-right: 1.4em;
    background-size: auto 16px;
    border-radius: 0;
    display: block;
}

.wpcf7 .wpcf7-not-valid-tip {
    margin-top: -10px;
    position: relative;
    padding: 5px 8px;
    line-height: 1.2em;
    border-radius: 3px;
    opacity: .8;
    background-color: #fff !important;
    color: #b20000;
}



/**---------------- Media query ----------------**/
@media only screen and (max-width: 799px) { 
    .column-half{
        width: 100%;
    }
}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"] {
    height:40px;
}

.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea, .wpcf7 input[type="tel"] {
    width: 100%;
    padding: 1px;
    border: 1px solid #ccc;
    -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
    border: 1px solid #cacaca;
    font-size: .97em;
    color: #7c8187 !important;
    background-color: rgba(0,0,0,.07);
    font-weight: 500;
    padding: 12px;
    box-shadow:inset 0 -1.4em 1em 0 rgba(0,0,0,.02);
    
}


.wpcf7 .wpcf7-not-valid-tip:after {
    bottom: 100%;
    left: 30px;
    border: 1px solid #000;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(136,183,213,0);
    border-bottom-color: #cb5a5a;
    border-width: 10px;
    margin-left: -10px;
}

/************ CONTACT ***************/

.header-contact {
    font-size: 14px;
    font-family: Raleway;
    color: #403d3d;
    font-weight: 700 !Important;
}
.nav-size-medium>li>a {
    font-size: .9em;
    color: #403d3d;
}




/*********** TABS **************/

.custom-tabs {
    max-width: 1440px !Important;
    margin-left: auto;
    margin-right: auto;
}


/************* MEMBER PORTAL ***************/



/************* CENIKI ***************/

.cenik-box {
    max-width: 1440px;
    margin: 0 auto;
    text-align: center;
    color: #252021;
    background: #ffffff;
    padding: 30px;
    box-shadow: 0 27px 54px rgb(114 84 125 / 70%);
}

/*********** GO BACK ************/

.button {
    opacity: 1;
    color: #fff;
     background: linear-gradient(to left, #e383ac 1%,#72547d 100%) !important;
    border-radius: 0px;
}

/*ACCORDIAN*/
.accordion-title {
    font-size: 110%;
    padding: 0.6em;
    display: block;
    position: relative;
    border-top: 1px solid #fff !important;

    -webkit-transition: border 200ms ease-out,background-color .3s;
    -o-transition: border 200ms ease-out,background-color .3s;
    transition: border 200ms ease-out,background-color .3s;
}


.accordion-title.active{
    background-color:#006587!important;
    color: white!important;
font-weight: normal !important;
border-color: #e8cad4 !important;
}

.accordion-inner{
    background-color:#eeeeee!important
}






.accordion-title{
    font-size:100%
}

.accordion-inner {
    background-color: #e8cad4!important;
    padding: 10px;
    font-size: .85em;
    border-bottom: 1px solid #fff !important;
    border-right: 1px solid #fff !important;
    border-left: 1px solid #fff !important;
}

.accordion .toggle{
    top:3px!important;
    transform-origin: 50% 50%!important;
    right:0;
    left: unset !Important;
}

.accordion .active .toggle{
    top:3px!important;
}
.accordion-item {
    margin-bottom: 8px;
}
.accordion .icon-angle-down:before{
    content:"+";
}
.accordion-title.plain {
    background-color: #e8cad4 !important;
    color: #c47199;
    font-weight: bold !important;
    font-size: 17px;
    text-transform: uppercase;
    color: #c47199 !important;
    border-top: 1px solid #fff !important;
    border-bottom: 0px solid #fff !important;
    border-right: 1px solid #fff !important;
    border-left: 1px solid #fff !important;
}

.accordion .toggle i {
    color: white;
}
.accordion .toggle i:before {
    color: #020202;
    font-weight: 900!important;
}


.accordion {
    border-right: 0px solid #fff !important;
    border-left: 0px solid #fff !important;
}



.active>.toggle {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}





/************ KROGEC **************/
.button.icon.circle {
    padding-left: 0;
    padding-right: 0;
    background: #70527c !important;
}


/***** BUTTON ******/


.custom-header-button {
    background: #C47199 !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    font-size: 14px !important;
    box-shadow: 0 27px 54px rgb(114 84 125 / 30%);
}


.custom-button {
    background: #C47199 !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
    font-size: 12px !important;
}


.custom-button-brezposelni {
    background: #F36467 !important;
    border: 1px solid #fff !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
    font-size: 12px !important;
}


.custom-button-zaposleni {
    background: #7C5797 !important;
    border: 1px solid #fff !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
    font-size: 12px !important;
}



/***** bOX *****/

.badge-urniki {
    top: 0px !important;
    right: 0px !important;
    margin-right: -1px !important;
    margin-top: -30px !important;
}

/**** CF7 BUTTON ****/

.custom-button-cf7-brezposelni {
    background: #F36467 !important;
}

.custom-button-cf7-zaposleni {
    background: #7C5797 !important;
}


 .um input[type="submit"].um-button, .um input[type="submit"].um-button:focus, .um a.um-button, .um a.um-button.um-disabled:hover, .um a.um-button.um-disabled:focus, .um a.um-button.um-disabled:active {
  background: #c47199 !important;
}


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/

}


@media only screen and (max-width: 600px) {
.banner-bottom-left {
font-size: 0.5em; 
background: #70527c !Important;
color: #fff !Important; 
    }
}




