@media (orientation: landscape){
    .uvodnaOnama{
        height: 100vh;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%), url("/img/KontaktHero.JPG"), lightgray 50% / cover no-repeat;
        background-position: center;
    }

    .title p{ /* Ovo bi trebalo u style.css ali tu sam stavio za sad pa ti dodaj */
        color: #FFF;
    }
    #kontaktH{
        color: #2A444F;
        font-family: 'Montserrat';
        font-size: 4vw;
    }
}

@media (orientation: portrait){
    .uvodnaOnama{
        height: 100vh;
        background: linear-gradient(0deg, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.40) 100%), url("/img/KontaktHero.JPG"), lightgray 50% / cover no-repeat;
        background-position: center;
    }
    
    .title p{ /* Ovo bi trebalo u style.css ali tu sam stavio za sad pa ti dodaj */
        color: #FFF;
    }
    #kontaktH{
        color: #2A444F;
        font-family: 'Montserrat';
        font-size: 6vw;
    }
}

@media (orientation: portrait){
    .langsel{
        background-color: transparent;
        border: #FFF solid 2px;
        border-radius: 10px;
        width: 6vh;
        height: 4vh;
        position: absolute;
        top: 5vh;
        left: 5vw;
        display: none;
        z-index: 1;
    }
}

@media (orientation: landscape){
    .langsel{
        background-color: transparent;
        border: #FFF solid 2px;
        border-radius: 10px;
        width: 6vh;
        height: 4vh;
        position: absolute;
        top: 5vh;
        right: 5vw;
        display: block;
        z-index: 1;
    }
}

@media (orientation: landscape){
    .gornjiTekst{
        padding-top: 5vh;
        color: #2A444F
    }

    .gornjiTekst h2{
        font-family: Montserrat;
        font-size: 4vw;
    }

    .gornjiTekst p{
        font-family: Karla;
        font-weight: 300;
        font-size: 2.5vw;
        padding-top: 5vh;
        margin: 0 10vw;
    }

    .donjiDio img{
        height: 65vh;
        width: 25vw;
        padding-top: 5vh;
        padding-left: 2.5vw;
        border-radius: 0 5vw 0 5vw;
    }

    .donjiDio {
        position: relative;
    }

    .donjiDio h2 {
        position: absolute;
        top: 0;
        right: 0;
        color: #2A444F;
        font-family: Montserrat;
        font-size: 7.5vh;
        padding-top: 7.5vh;
        padding-right: 30vw;
    }

    .kontaktContainer {
      text-align: center;
    }
    
    .kontaktForm {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    
    .form-group {
      margin-bottom: 10px;
    }

    .slikica{
        margin: 5vh 0 0 0;
        border-radius: 0 3vw 0 3vw;
        width: 30vw;
        height: 40vw;
        background-image: url("/img/vrata.jpg");
        background-size: cover;
    }

    .form-group input{
        border: none;
        border-bottom: #dcc4a9 3px solid;
        background-color: #f3ede6;
        font-family: Montserrat;
        font-size: 2vw;
        font-weight: 300;
        margin-bottom: 5vh;
    }

    .onamabutton button {
        margin-top: 5vh;
        width: 10vw;
        height: 3vw;
        background-color: #dcc4a9;
        border-radius: 70px;
        border: 4px solid;
        border-color: #29434e;
        font-family: "Montserrat-Medium", Helvetica;
        font-weight: 300;
        color: #29434e;
        font-size: 1.5vw;
    }

    h3{
        font-size: 1vw;
        margin: 0;
        margin-top: 1vw;
    }

    .kontakt-svg{
        width: 6vw;
        height: auto;
        margin: auto auto;
    }

    h2{
        font-size: 4vw;
    }
}

@media (orientation: portrait){
    .gornjiTekst{
        padding-top: 5vh;
        color: #2A444F
    }

    .gornjiTekst h2{
        font-family: Montserrat;
        font-size: 6vw;
        font-weight: 500;
    }

    .gornjiTekst p{
        font-family: Karla;
        font-weight: 300;
        font-size: 3vw;
        padding-top: 1vh;
        margin: 0 10vw;
    }

    .kontaktContainer {
      text-align: center;
    }
    
    .kontaktForm {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    
    .form-group {
      margin-bottom: 10px;
    }

    .form-group input{
        border: none;
        border-bottom: #dcc4a9 3px solid;
        background-color: #f3ede6;
        font-family: Montserrat;
        font-size: 3.5vw;
        font-weight: 300;
        margin-bottom: 5vh;
        width: 60vw;
    }

    .onamabutton button {
        margin: auto;
        width: 30vw;
        height: 10vw;
        background-color: #dcc4a9;
        border-radius: 70px;
        border: 4px solid;
        border-color: #29434e;
        font-family: "Montserrat-Medium", Helvetica;
        font-weight: 300;
        color: #29434e;
        font-size: 3vw;
        margin-bottom: 5vh;
    }

    h2{
        font-size: 6.5vw;
    }

    h3{
        font-size: 3vw;
        margin: 0;
    }

    .kontakt-svg{
        display: flex;
        flex-direction: row;
        width: 15vw;
        height: auto;
        margin: auto auto;
    }
}
