@import url('https://fonts.googleapis.com/css2?family=Jost:wght@100;200;300;400;500;600;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Goldman&display=swap');

body {
    font-family: 'Roboto', sans-serif;
    color:#fff;
    background: url(../img/bkg.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    text-align: center;
    overflow: hidden;
}

.title {font-family: 'Dancing Script', cursive;}

p {font-size:12px}

img {margin: auto;}

h2 img {max-width: 50px}

.pink {
    color:#F9C2F8;
    font-size: 13px !important;
}

.pink-2 {
    color:#F9C2F8;
    margin-bottom: 5%;
    margin-top: unset !important;
}

.dark-pink {color:#a086b9}

.card-wrapper2, .card-wrapper2 .pink {margin: 20px 0}

.card-wrapper2 small {font-style: italic;} 

.card-wrapper2-open {margin: 20px 0}

.tumacenje-karte {
    text-align: left;
}

.baner {margin: 40px 0}

.footer p {
    font-size:10px;
    line-height: 12px;
}


/*** Ljubavni kalkulator ***/
.calculator {
    text-align: center;
    background-color:#211717;
    font-family: 'Lobster', cursive;
    padding: 20px 0;
}

.name-box {
    color: black;
}

.ljubavni-kalkulator h2, .ljubavni-kalkulator h3, .ljubavni-kalkulator h4 {color:#F9C2F8}

input {padding: 10px;}

/* buttons */
.buttons {
  color: #ffd7e8;
  background-color: #ffaaaa;
  border: solid;
  border-color: #ee4266;
  cursor: pointer;
  margin: 10px 10px;
  padding: 10px 20px 10px 20px;
  position: relative;
  opacity: 0.5;
  font-size: 14px;
}

.buttons:hover {
  box-shadow: 5px 3px #a086b9;
  opacity: 1;
  color: #fff;
}




.wrapper {
    height: 100%;
    min-height: 95.9vh;
    position: relative;
    display: flex;
    flex-direction: column;
}

.uputstvo {
    margin-top: 70px;
    padding: 10% 16px;
    display: flex;
    align-items: center;
}

.space {padding: 10px;}

.grey-txt {color:#999!important}

h1 {
    font-size:37px;
}

/* h4 {
    font-size:24px;
} */

h5 {
    font-size:20px;
}

h6 {font-size:18px}

/*** NAVBAR ***/
.navbar-default {
    background: transparent;
    border: none;
    border-radius: 0;
}

.navbar-default a {
    color:#fff!important;
    font-weight: 700;
}

.navbar-brand img {float: left;margin-top: -10px;margin-right: 5px}



.main-content {
    background: url(../img/bkg.jpg) no-repeat center center scroll; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
    text-align: center;
    margin-top: -93px;
    padding-top: 60px;
}

.main-content h1 {
    font-weight: 600;
}

.txt-with-bkg {
    background: #300091;
    box-shadow: 0px 0px 16px #300091;
    border-radius: 2px;
    z-index: 3;
    border: 2px solid;
    border-image: linear-gradient(#360154, #300091) 30;
    margin: 30px 0;
    
}
.txt-with-bkg span {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    margin: 0 auto;
    transition: all 0.3s ease-in-out;
    background: -webkit-linear-gradient(#ffdc2a, #fb2182);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.karte img {margin: auto}

.vidovnjakinja {
    background: #e1f5ff;
    padding: 50px 0 80px;
    color:#000
}

.vidovnjakinja h1 {
    color:#050097;
    font-weight: 600;
}

/* .vidovnjakinja img {
    margin: 0 0 10px auto;
} */

.jaspos {
    background: #f5f7fa;
    text-align: left;
    color:#5073b0;
}

.jaspos h3 {
    line-height: 0;
    margin-top: 0;
}

.jaspos h6 {
    margin-top: -3px;
    line-height: 25px;
}

.vidovnjakinja .fa-phone-square-alt {
    padding-left: 30px;
}

i.fa-phone-alt {
    font-size:30px!important;
    border:5px solid #5073b0;
    padding: 10px;
    border-radius: 50px;
    margin-left: 10px;
}
.root-cards-revealed p.grey-txt {
    font-size:11px;
    line-height: 13px;
}

.root-cards-revealed h4 {font-weight: 600}

.root-cards-revealed .karte .col-sm-4 {
    margin: 0;
    padding: 2px;
}

.root-cards-revealed .karte {
    padding: 20px 0;
}

.root-cards-revealed .vidovnjakinja {
    display: none;
}

img.karta-transparent {opacity: 0.3;}

.root-cards-revealed span.gradiant-txt {
    text-align: center;
    font-size: 20px;
    margin: 0 auto;
    transition: all 0.3s ease-in-out;
    background: -webkit-linear-gradient(#ffdc2a, #fb2182);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 500;
}

.transparent-box {
    background: rgba(0,0,0,0.5);
    border:2px solid #2f528f;
    margin: 30px auto 80px;
    padding: 20px 30px;
    max-width: 403px;
}

.button-animation {background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
    padding: 1px 0 12px;
    margin-top: 0px!important;
}

.button-animation {margin: 30px 0}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.code-info {
    padding: 0 44px;
    text-align: justify;
}

p.code-info  {line-height: 10px!important;}

.footer-txt {
    padding: 20px 0
}

footer {
    /* background: #1F263E; */
    color:#fff;
    padding: 10px;
}

footer a {
    color: #fff;
}

.hide-on-desktop {
    display: none;
}

@media (max-width:1023px) {
    .hide-on-mobile {display: none;}
    .hide-on-desktop {display: initial;}
    .wrapper {
        min-height: 94.9vh;
    }
    .transparent-box {
        margin: 0;
    }
    .uputstvo {
        margin-top: 0;
    }
}