@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&family=Great+Vibes&family=Halant:wght@300;400;500&display=swap');

html, body {
    height: 100%;
}

body {
    font-family: 'Halant', serif;
}

h1, h2, h3, h4, h5, h6 {
    color: #727475;
}

.cursive {
    font-family: 'Great Vibes', cursive;
}

.bg-gray {
    background-color: #f9f9f9;
}

.title {
    font-family: "Cinzel";
}

.btn-danger {
   background-color: #d02b41;
}

.intro {
    background: url('/img/danielyema/intro.jpg');
    background-size: cover;
    background-position: center center;
    position: relative;
}

.intro2 {
    background: url('/img/danielyema/intro2.jpg');
    background-size: cover;
    background-position: center center;
    position: relative;
}

.intro-circulo {
    background: rgba(255, 255, 255, 0.7);
    border-radius: 50%;
    width: 224px;
    height: 224px;
    color: #000;
    position: absolute;
    bottom: 160px;
    z-index: 5;
    top:60%;
    left: 50%;
    margin-left: -112px;
    text-align: center;
    color: #333;
    font-family: 'Great Vibes', cursive;
}

.intro-circulo:after {
    content: "";
    position: absolute;
    left: -6px;
    top: -6px;
    right: -6px;
    bottom: -6px;
    border: 1px solid #fff;
    border-radius: 50%;
    transition: .24s ease-out all;
}

.intro-circulo p {
    font-family: 'Great Vibes', cursive;
    font-size: 20px;
    margin: 25px 0 28px;
}

.circulo-novio {
    margin-top: 70px;
}
.circulo-nombre {
    
    font-size: 36px;
    line-height: 0;
    font-family: "Cinzel";
}

.circulo-and {
    font-size: 24px;
    font-family: 'Great Vibes', cursive;
    margin: 14px 0;
}

.circulo-and:after, .circulo-and:before {
    content: "";
    width: 60px;
    height: 1px;
    vertical-align: middle;
    display: inline-block;
    background: #000;
    margin: 0 8px;
}

.circulo-fecha {
    font-size: 16px;
    font-family: "Halant";
    margin-top: 34px;
}

.contador-container {
    text-align: center;
    border: 1px solid #d02b41;
    padding: 20px 0 40px;
    position: relative;
}

.contador-container:before {
    content: "Faltan";
    position: absolute;
    top: -23px;
    background: #fff;
    width: 160px;
    display: block;
    color: #707070;
    font-size: 28px;
    font-family: "Cinzel";
    left: 50%;
    margin-left: -80px;
}

.contador-container > div {
    font-family: halant;
    text-align:center;
    font-size:42px;
    display:inline-block;
    vertical-align:middle;
    color:#d02b41;
    position:relative;
    margin:0 20px;
    font-weight:300
}
/* .contador-container > div:before {
    content:"Dí­as";
    position:absolute;
    font-size:16px;
    bottom:-15px;
    color:#707070;
    text-align:center;
    width:100%
} */
.contador-container>div:nth-child(2):before {
    content:"Horas"
}
.contador-container>div:nth-child(3):before {
    content:"Mins"
}
.contador-container>div:nth-child(4):before {
    content:"Segs"
}
.contador-container>div:nth-child(4):after {
    display:none
}

.historia {
    background: url('/img/danielyema/historia.jpg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #fff !important;
}

.historia h5 {
    color: #fff !important;
}