﻿body {
}

.enlacesWhite{
   color:white !important; 
}

.enlacesWhite:hover {
    color: white !important;
}

.leter {
    color: #fff;
    font-weight: 200;
}

.leter2 {
    color: #fff;
    font-weight: 600;
    margin-top: 20%;
}

.circleBase {
    border-radius: 50%;
}

.type1 {
    width: 43px;
    height: 43px;
    background: transparent;
    border: 1px solid #fff;
}

.type1:hover {
    width: 43px;
    height: 43px;
    background: rgba(0, 148, 255, 0.44);
    border: 1px solid #fff;
}

.type2 {
    width: 50px;
    height: 50px;
    background: #ccc;
    border: 3px solid #000;
}

.type3 {
    width: 500px;
    height: 500px;
    background: aqua;
    border: 30px solid blue;
}

.centrar {
    margin-top: 31%;
    margin-left: 34%;
    color: #fff;
}

.centrar2 {
    margin-top: 31%;
    margin-left: 30%;
    color: #fff;
}


.separador{
    border-left:1px solid #fff;
}

.row {
    width: -webkit-fill-available;
}

@import url('https://fonts.googleapis.com/css?family=Google+Sans');
/*--------------*/

* {
    margin: 0;
    padding:;
    border-box: 0;
}

.fondoBody1 {
    background: url(http://www.inired.com/imagenes/contenidos/lago-federa-3746335_1920.jpg);
    /*font-size: 36px;*/
    color: #fff;
}

.fondoBody2 {
    background: url(http://www.inired.com/imagenes/contenidos/city-3660779_1920.jpg);
    /*font-size: 36px;*/
    color: #fff;
}

.fondoBody3 {
    background: url(http://www.inired.com/imagenes/contenidos/sun-3726030_1920.jpg);
    /*font-size: 36px;*/
    color: #fff;
}

.wrap {
    width: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: absolute;
}

.widget {
    width: 500px;
    margin: 32px;
}

    .widget p {
        display: inline-block;
        position: relative;
    }

.fecha {
    font-family: 'Google Sans', sans-serif;
    text-align: center;
    font-size: 2em;
    padding: 20px;
    width: 100%;
    background: rgb(0, 0, 0, .7);
    margin-bottom: 5px;
    box-sizing: border-box;
    border-radius: 25px 25px 0 0
}

.reloj {
    font-family: 'Google Sans';
    text-align: center;
    font-size: 4.5em;
    padding: 20px;
    width: 100%;
    background: rgb(0, 0, 0, .7);
    box-sizing: border-box;
    border-radius: 0 0 25px 25px
}

    .reloj .caja-segundos {
        display: inline-block;
    }

    .inputClass {
        background-color: transparent;
        border-radius: 60px;
        color: white;
        height: 100%;
        border: 1px solid #fff;
    }

    .inputClass::placeholder {
        color: white;
        opacity: 1;
    }

    .inputClass:focus {
        background-color: transparent;
        border-radius: 60px;
        color: white;
        height: 100%;
        border: 1px solid #fff;
        
    }

    fa{
        color:#fff;
    }

.alt {
    margin-top: 17px;
    margin-bottom: 0px;
    padding-right: 0px;
    padding-left: 12px;
}



.flotante {
    width: 465px;
    height: 300px;
    position: absolute !important;
    z-index: 909 !important;
    margin-top: 2% !important;
    margin-left: -8% !important;
}

.changeColor:hover{
    color:#005593 !important;
}

.botonPasar {
    position: absolute;
    margin-top: 40%;
    margin-left: 40%;
}

.botonAtras {
    position: absolute;
    margin-top: 40%;
    margin-left: 37%;
}

    .botonAtras:hover {
        position: absolute;
        margin-top: 40%;
        margin-left: 37%;
        background: white;
        color: #747474;
        border: 2px solid white;
        border-radius: 50px;
    }

    .botonPasar:hover {
        position: absolute;
        margin-top: 40%;
        margin-left: 40%;
        background: white;
        color: #747474;
        border: 2px solid white;
        border-radius: 50px;
    }

        .botonPasar:hover > .buttonNext {
            margin-top: 20%;
            margin-left: 35%;
            color:#0066b0;
            font-size: 27px;
        }

        .botonAtras:hover > .buttonBack {
            margin-top: 20%;
            margin-left: 32%;
            color: #0066b0;
            font-size: 27px;
        }

.buttonNext {
    margin-top: 20%;
    margin-left: 35%;
    color: #fff;
    font-size: 27px;
}

.buttonBack {
    margin-top: 20%;
    margin-left: 32%;
    color: #fff;
    font-size: 27px;
}

h2{

}