*{
    font-family: 'Open Sans', sans-serif;
}

html,
body {
    width: 100%;
    height: 100%;
}

hr{ color:white;}

#imgLogo{  margin-left: 50px !important;}

#contenedor{
    width: 100% !important;
    height: 100% !important;
    overflow: auto;
}

#contenedorInsc{
    width: 100% !important;
    height: 100% !important;

}

#loading{
    top:0;
    left:0;
    position: absolute !important;  
	width: 100% !important;
	height: 100% !important;
	background-color: rgba(255, 255, 255, 0.90) !important;
	box-shadow: 0 1px 3px rgba(255, 255, 255, 0.15), 0 1px 2px rgba(255, 255, 255, 0.30) !important;
	z-index: 99999 !important;    
}

.loading div{
	position: relative !important;
	top: 35% !important;
	left: 42% !important;
	width: 200px !important;
	height: 200px !important;  
	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position: center !important;  
}

.borde{ border:1px solid white;}
.borde2{ border:1px solid green;}

a{
    color:white;
    text-decoration: none;
}

#imgLetras{ margin-top: 40px !important;}
#contentLinks{ text-align: right !important; }
#espacio{ margin-top: 200px !important;}

@media (min-width: 300px) and (max-width: 415px) {

    #imgLetras{ margin-top: 0px !important;}
    #contentLogo, #contentLetras, #contentLinks{ text-align: center !important; }
    #espacio{ display: none !important;}
    .w-85{  width: 100% !important;  }

    .fixed-top {
        position: inherit !important;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1030;
    }

    .loading div{
        position: relative !important;
        top: 40% !important;
        left: 28% !important;
        width: 180px !important;
        height: 180px !important;  
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: center !important;  
    }

    #Color{ margin-bottom: 25px;}

    #logoInsc, #redesInsc{  text-align: center !important;}
    #imgLogo{  margin-left: 0px;}
}

@media (min-width: 768px) and (max-width: 900px) {

    #titulo1{   display: none;}
    #titulo2{   display: block;}

    .borde{ border:1px solid blue;}

}

@media (min-width: 500px) and (max-width: 1023px) {

    #titulo1{   display: block;}
    #titulo2{   display: none;}

    .borde{ border:1px solid green !important;}

    .loading div{
        position: relative !important;
        top: 27.5% !important;
        left: 40% !important;
        width: 150px !important;
        height: 150px !important;  
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: center !important;  
    }
    
}

@media (min-width: 1024px) and (max-width: 1359px) {
    
    #espacio{ display: none !important;}

    .fixed-top {
        position: inherit !important;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1030;
    }
    
    #menu{
        font-size: 8.5pt !important;
    }
}



@media (min-width: 500px) and (max-width: 1024px) and (orientation: landscape){

    #imgLetras{ margin-top: 0px !important;}
    #contentLogo, #contentLetras, #contentLinks{ text-align: center !important; }
    #espacio{ display: none !important;}

    .fixed-top {
        position: inherit !important;
        top: 0;
        right: 0;
        left: 0;
        z-index: 1030;
    }

    .w-85{  width: 100% !important;  }
}










@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    to {
        -webkit-transform: rotate(360deg);
    }
}