Difference between revisions of "Team:Tec-Monterrey/sandboxDavid"

Line 2: Line 2:
 
<head>
 
<head>
 
<style>
 
<style>
−
/*** Custom scrollbar ***/     
+
/********************************* Custom scrollbar *********************************************/     
 
html {
 
html {
 
     overflow: auto;
 
     overflow: auto;
Line 33: Line 33:
 
     #top_menu_14 {
 
     #top_menu_14 {
 
         box-sizing: initial;
 
         box-sizing: initial;
 +
    }
 +
 +
/************************************************* Loader ********************************************/
 +
/************************************************* Loader ********************************************/
 +
#loader-wrapper {
 +
    position: fixed;
 +
    top: 0;
 +
    left: 0;
 +
    width: 100%;
 +
    height: 100%;
 +
    z-index: 1000;
 +
}
 +
 +
#loader {
 +
    position: relative;
 +
    left: 50%;
 +
    top: 50%;
 +
    width: 250px;
 +
    height: 250px;
 +
    margin: -125px 0 0 -125px;
 +
    z-index: 1001;
 +
}
 +
 +
#videoLoader {
 +
    position:absolute;
 +
    right: 0;
 +
    bottom: 0;
 +
    max-width: 100%;
 +
}
 +
 +
    #loader-wrapper .loader-section {
 +
        position: fixed;
 +
        width: 100%;
 +
        height: 51%;
 +
        background: rgb(216,228,222);
 +
        z-index: 1000;
 +
        -webkit-transform: translateY(0);
 +
        -ms-transform: translateY(0);
 +
        transform: translateY(0);
 +
    }
 +
    #loader-wrapper .loader-section.section-top {
 +
        top: 0;
 +
    }
 +
    #loader-wrapper .loader-section.section-bottom {
 +
        bottom: 0;
 +
    }
 +
    /* Loaded */
 +
    .loaded #loader-wrapper .loader-section.section-top {
 +
        -webkit-transform: translateY(-100%);
 +
        -ms-transform: translateY(-100%);
 +
        transform: translateY(-100%);
 +
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
        -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
    }
 +
    .loaded #loader-wrapper .loader-section.section-bottom {
 +
        -webkit-transform: translateY(100%);
 +
        -ms-transform: translateY(100%);
 +
        transform: translateY(100%);
 +
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
        -o-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
 +
    }
 +
    .loaded #loader {
 +
        opacity: 0;
 +
        -webkit-transition: all 0.3s ease-out;
 +
                -o-transition: all 0.3s ease-out;
 +
                transition: all 0.3s ease-out;
 +
    }
 +
    .loaded #loader-wrapper {
 +
        visibility: hidden;
 +
    }
 +
    /* JavaScript Turned Off */
 +
    .no-js #loader-wrapper {
 +
        display: none;
 
     }
 
     }
 
</style>
 
</style>

Revision as of 20:51, 14 June 2018

HOLA