b.para {
    /*    font-weight: bold;*/
    font-family: 'para-bold';
    color: #333333;
}

@media not all and (min-resolution:.001dpcm) {
    @supports (-webkit-appearance:none) {

        b.para {
            /*    font-weight: bold;*/
            font-family: 'para-bold';
            color: #333333;
            text-rendering: optimizeLegibility;
            -webkit-font-smoothing: antialiased;
        }


    }
}

html,body {
    margin: 0;
    overflow-x: hidden;
}


::-webkit-scrollbar {
    width: 5px;
    background-color: black;
    /*    opacity: 10%;*/
    /*    display: NONE;*/
}

/* Track */
::-webkit-scrollbar-track {
    /*  box-shadow: inset 0 0 5px grey; */
    /*  border-radius: 10px;*/
    opacity: 0;
    display: none;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #f8f8f8;
    /*    opacity: 10%;*/
    /*  border-radius: 10px;*/
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #6e6e6e;
}



a:link {
    text-decoration: none;

}

@font-face {
    font-family: 'title';
    src: url("/Fonts/CraftworkGrotesk-Heavy.ttf");
    /* IE9 Compat Modes */
    /*  src: url("/Fonts/Pandemic.otf") format('embedded-opentype'),  IE6-IE8     */
}

@font-face {
    font-family: 'para-thin';
    src: url("/Fonts/Space/SpaceGrotesk-Light.ttf");
    /* IE9 Compat Modes */
    /*  src: url("/Fonts/Pandemic.otf") format('embedded-opentype'),  IE6-IE8     */
}


@font-face {
    font-family: 'para';
    src: url("/Fonts/Space/SpaceGrotesk-Regular.ttf");
    /* IE9 Compat Modes */
    /*  src: url("/Fonts/Pandemic.otf") format('embedded-opentype'),  IE6-IE8     */
}

@font-face {
    font-family: 'para-bold';
    src: url("/Fonts/Space/SpaceGrotesk-Bold.ttf");
    /* IE9 Compat Modes */
    /*  src: url("/Fonts/Pandemic.otf") format('embedded-opentype'),  IE6-IE8     */
}



@font-face {
    font-family: 'fa';
    src: url("/Fonts/fa-solid-900.ttf");
}


iframe {
    /*    background-color: beige;*/
    /*    width: 60vw;*/
}

#foucs {
    margin-top: 0;
}


::-moz-selection {
    /* Code for Firefox */
    color: #333333;
 background: #00FF47;
}

::selection {
    color: #333333;
    background: #00FF47;
}


#hidescrollcontainer {
    height: 100%;
    width: 100%;
    overflow: hidden;
    overflow-x: hidden;
}

#hidescrollcontent {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
}



ul {
    opacity: 0;
    visibility: hidden;
    list-style-type: none;
    margin: 0%;
    padding: 0%;
    overflow: hidden;
    background-color: white;
    box-shadow: 10px;
    background-color: rgba(255, 255, 255, 0);
    -webkit-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -moz-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -o-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -ms-transition: background-color 700ms linear, opacity .70s ease-in-out;
    transition: background-color 700ms linear, opacity .70s ease-in-out;
}

ul.scrolled {
    visibility: visible;
    opacity: 1;
    background-color: rgba(255, 255, 255, 0);
    -webkit-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -moz-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -o-transition: background-color 700ms linear, opacity .70s ease-in-out;
    -ms-transition: background-color 700ms linear, opacity .70s ease-in-out;
    transition: background-color 700ms linear, opacity .70s ease-in-out;
}

li {


    float: right;
}


li a {
    display: inline-block;
    text-align: center;
    /*    padding: 7% 50px;*/
    padding-top: 1vw;
    padding-left: 3vw;
    padding-right: 3vw;
    padding-bottom: 1vw;
    text-decoration: none;
    font-family: 'para';
    /*    font-weight: 900;*/
    font-size: 0.85vw;
    color: #222222;
    /*    margin-top: 0.56vw;*/
}

li a:hover:not(.active) {

    color: #332cce;
}

li.amitsharma {
    opacity: 1;
    float: left;
    visibility: visible;
    transition: opacity .70s ease-in-out;
    -moz-transition: opacity .70s ease-in-out;
    -webkit-transition: opacity .70s ease-in-out;
}

li.amitsharma.fadein {
    visibility: visible;
    opacity: 1;
    transition: opacity .70s ease-in-out;
    -moz-transition: opacity .70s ease-in-out;
    -webkit-transition: opacity .70s ease-in-out;

}

li a.amitsharma {
    /*    font-weight: 600;*/
}


.fixed-nav-bar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
}




#introductionheading
{
   position: absolute;
    font-size: 3vw;
    font-weight: 700;
    font-family: 'title', serif;
    color: #333333;
    text-align: center;
    width: 100%;
    margin-top: 11vw;
    margin-left: auto;
}


#introductiondetail
{
    font-size: 1vw;
   
    font-family: 'para', monospace;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-left: 25vw;
    margin-right: 25vw;
    margin-top: 19vw;
}

#processheading
{
   position: absolute;
    font-size: 3vw;
    font-weight: 700;
    font-family: 'title', serif;
    color: #333333;
    text-align: center;
    width: 100%;
    margin-top: 62vw;
    margin-left: auto;
}

#processimg
{
    margin-top:72vw;
    width: 80%;
    
}

#researchheading
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17.6vw;
    width: 100%;
    text-align: center;
}



#researchdetail1
{
    font-size: 1vw;
   
    font-family: 'para', monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-left: 25vw;
    margin-right: 25vw;
    margin-top: 2vw;
/*    padding-right: 25vw;*/
}

#icons
{
    width:50%;
    margin-top: 16vw;
}
a
{
    color: #BC5928;
}


#personaheading
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:30.6vw;
    width: 100%;
    text-align: center;
}


#kabirpersonaimg
{
    position: absolute;
    width: 40%;
    right: 0;
    padding-right: 6vw;
    margin-top:5.6vw;
}

#kabirdetails
{
    font-size: 1vw;
    font-family: 'para', monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 14vw;
    margin-left: 18vw;
    margin-right: 54.4vw;
}

#radhikapersonaimg
{
    position: absolute;
    width: 40%;
    margin-top: 0vw;
    align-content: left;
    margin-top: 56.6vw;
    left: 0;
    margin-left: 8vw; 
}

#radhikapersonadetails
{
    font-size: 1vw;
    font-family:  'para', monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 68.5vw;
    margin-right: 10vw;
    margin-left: 57.4vw;
}

#scenarioheading
{   
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:123.4vw;
    width: 100%;
    text-align: center;
}

#scenariodetails
{
    font-size: 1vw;
    font-family: 'para', monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 2.8vw;
   text-align: left;
    margin-left: 25vw;
    margin-right: 25vw;
}

#scenariokabir
{
    font-size: 1.68vw;
    font-family: 'para-bold',sans-serif;
    font-weight: 400;
    position: absolute;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 22.4vw;
    left: 0;
    text-align: center;
    width: 100%;
}


#kabirbreakfast
{
    font-size: 1vw;
    font-family: 'para', monospace;
    font-weight: 400;
    color: #777777;
    line-height: 2vw;
    margin-top: 11.2vw;
    text-align: center;
}

#quote
{
    font-size: 0.9vw;
    font-family: 'para', monospace;
    font-weight: 100;
    color: #777777;
    line-height: 1.8vw;
    margin-top: 36.4vw;
    margin-left: 65vw;
    margin-right: 6.72vw;
    text-align: right;
}


#quotev2{
    
    font-size: 0.9vw;
    font-family: 'para', monospace;
    font-weight: 100;
    color: #777777;
    line-height: 1.8vw;
    margin-top: 42vw;
    margin-left: 65vw;
    margin-right: 6.72vw;
    text-align: right;   
}

#quotename
{
    font-size: 1vw;
    font-family: 'para', monospace;
    font-weight: 100;
    color: #333333;
    margin-right: 6.72vw;
    text-align: right;
}


#quotename2
{
    font-size: 0.8vw;
    font-family: 'para', monospace;
    font-weight: 300;
    color: #333333;
    margin-top: 0vw;
    margin-right: 6.72vw;
    text-align: right;
}


#quote1
{
    font-size: 0.9vw;
    font-family: 'para', monospace;
    font-weight: 100;
    color: #777777;
    line-height: 1.8vw;
    margin-top: 8.4vw;
    margin-left: 59vw;
    margin-right: 6.72vw;
    text-align: right;
}

#scenario1comic
{
    width: 90%;
    margin-top: 1.12vw;
    align-content: left;
}

#scenario2comic
{
    width: 90%;
    align-content: left;
}


#scenarioradhika
{
    font-size: 1.68vw;
    font-family: 'para-bold',sans-serif;
    font-weight: 400;
    position: absolute;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 19.6vw;
    left: 0;
    text-align: center;
    width: 100%;
}

#scenario3comic
{
    width: 90%;
    margin-top: 0vw;
    align-content: left;
}



#scenario4comic
{
    width: 90%;
    align-content: left;
    margin-top: 1.12vw;
}

#scenario5comic
{

    width: 90%;
    align-content: left;
    margin-top: 0vw;
}


#opportunityheading
{    
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:16.8vw;
    width: 100%;
    text-align: center;
}


#opportunitydetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    color: #777777;
    margin-top:4vw;
    line-height: 2vw;
    margin-left: 25vw;  
    margin-right: 25vw;
   
}

#briefheading
{    
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:15.8vw;
    width: 100%;
    text-align: center; 
}

#briefdetails
{
    font-size: 0.96vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 2vw;
   
    padding-left: 25vw;
    padding-right: 25vw;
}

#conceptheading
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:25vw;
    width: 100%;
    text-align: center;
}

/* #conceptdetails
{
    font-size: 2.8vw;
    font-family: 'karla', sans-serif;
    font-weight: 200;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 16.8vw;
    padding-left: 5.6vw;
} */

#concept1img
{
    margin-top: 5.6vw;
    width: 75%;
}


#projectalphascroll-wrapper
{
    margin-top: 140vw;
    position: fixed;
}
#projectalphascroll
{
    
    position: absolute;
/*    top:0;*/
    right:0;
    opacity: 0;
/*    margin-left: 60vh;*/
/*    right: 11.2vw;*/
/*    padding-top: 5.6vw;*/
/*    max-height: 50.4vw;*/
    width: 100%;
/*    visibility: hidden;*/
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}
#projectalphascroll.fixed
{
    -webkit-transform: translateZ(0);
    position: fixed;
    top:0;
    right:0;
    opacity: 1;
/*    visibility: visible;*/
/*    right: 11.2vw;*/
/*    max-height: 50.4vw;*/
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
/*    height: 2000vh;*/
}


#introducingprojectalpha
{
   font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:14vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#introducingprojectalpha.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
    
}

#introducingprojectalphadetails
{
    font-size: 1vw;
    font-family: 'para',monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 22.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
    
}

#introducingprojectalphadetails.fixed
{
  position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;  
}

#buttonpress
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#buttonpress.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}
#buttonpressdetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#buttonpressdetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}


#charger
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#charger.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#chargerdetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#chargerdetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}


#doorbell
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#doorbell.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#doorbelldetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 47vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#doorbelldetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#namecallout
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#namecallout.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#namecalloutdetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#namecalloutdetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#alarm
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#alarm.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#alarmdetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#alarmdetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}


#speechtotext
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: left;
    margin-left: 15vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#speechtotext.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}



#speechtotextdetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 15vw;
    margin-right: 46vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#speechtotextdetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}



#alphascreen1
{
    max-height: 44.8vw;
    margin-left: 11.2vw;
}
#screen1details
{
    font-size: 1vw;
    font-family: 'para',  monospace;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: -43.68vw;
    margin-left: 42vw;
    margin-right: 35vw;
    text-align: left;
    opacity: 1;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
    
}

#screen2details
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 14vw;
    margin-left: 35vw;
    margin-right: 40vw;
    text-align: right;
    opacity: 1;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
    
}


#alphascreen2
{
   position: absolute;
    margin-top: 28vw;
    max-height: 44.8vw;
    margin-left: 30.8vw;
}

#alphascreen3
{
    position: absolute;
    margin-top: 28vw;
    max-height: 44.8vw;
    margin-left: 5.6vw;
}
#alphascreen4
{
    position: absolute;
    margin-top: 56vw;
    max-height: 44.8vw;
    margin-left: 36.6vw;
}

#alphascreen5
{
    position: absolute;
    margin-top: 84vw;
    max-height: 44.8vw;
    margin-left: 72.8vw;
}

#time
{
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:17vw;
/*    width: 100%;*/
    text-align: right;
    margin-left: 50vw;
    position: absolute;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
  
}
#time.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    left:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timedetails
{
    font-size: 1vw;
    font-family: 'para', sans-serif;
    font-weight: 200;
    position: absolute;
    color: #777777;
    line-height: 2vw;
    margin-top: 25.4vw;
    margin-left: 50vw;
    margin-right: 10vw;
    text-align: left;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timedetails.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timeexplained
{
        
    position: absolute;
/*    top:0;*/
    right:0;
    opacity: 0;
    margin-top: 16.8vw;
    margin-right: 4.5vw;
/*    margin-left: 60vh;*/
/*    right: 11.2vw;*/
/*    padding-top: 5.6vw;*/
/*    max-height: 50.4vw;*/
    width: 60%;
/*    visibility: hidden;*/
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timeexplained.fixed
{
     position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timenow
{
    font-size: 14vw;
    font-family: 'para-bold', sans-serif;
    font-weight: 350;
    position: absolute;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 27vw;
/*    margin-left: 10vw;*/
    margin-right: 20vw;
    text-align: right;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timenow.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}


#timenow1
{
    font-size: 14vw;
    font-family: 'para-bold', sans-serif;
    font-weight: 350;
    position: absolute;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 27vw;
/*    margin-left: 10vw;*/
    margin-right: 20vw;
    text-align: right;
    opacity: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timenow1.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#timenow2
{
    font-size: 14vw;
    font-family: 'para-bold', sans-serif;
    font-weight: 350;
    position: absolute;
    color: #333333;
    line-height: 3.08vw;
    margin-top: 27vw;
/*    margin-left: 10vw;*/
    margin-right: 20vw;
    text-align: right;
    opacity: 0;
    transition: opacity 1.2s ease-in;
    -moz-transition: opacity 1.2s ease-in;
    -webkit-transition: opacity 1.2s ease-in;
}

#timenow2.fixed
{
    position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    top:0;
    right:0;
    /* transition: opacity 1.2s ease-in-out; */
    /* -moz-transition: opacity 1.2s ease-in-out; */
    /* -webkit-transition: opacity 1.2s ease-in-out; */
}

#colors
{
     position: absolute;
    font-size: 3vw;
    font-weight: 200;
     font-family: 'title', serif;
    color: #333333;
    margin-top:-14vw;
    width: 100%;
    text-align: center; 
}
#finalimage
{
    position: absolute;
/*    align-items: center;*/
    width: 60%;
    opacity: 1;
    margin-top: 2.8vw;
/*    margin-left: 15vw;*/
    margin-left: auto;
    margin-right: auto;
    right: 0;
    left: 0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}



#finalimage.fixed
{
   position: fixed;
    opacity: 1;
    -webkit-transform: translateZ(0);
    margin-top: 8.4vw;
        top:0;
    margin-right: 8.96vw;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}

#finalimage.absolute
{
   position: absolute;
    opacity: 1;
    -webkit-transform: translateZ(0);
    margin-top: 8.4vw;
        top:0;
    margin-right: 8.96vw;
    right:0;
    transition: opacity 1.2s ease-in-out;
    -moz-transition: opacity 1.2s ease-in-out;
    -webkit-transition: opacity 1.2s ease-in-out;
}



#upnexttext{
     font-size: 1vw;
   
    font-family: 'para', monospace;
    /*    font-weight: 200;*/
    position: absolute;
    color: #000000;
    line-height: 2.2vw;
    margin-left: 18.3vw;
    margin-right: 27vw;
    margin-top: 79.5vw;
    
}


#upnexttitle{
     font-size: 6vw;
   
    font-family: 'title', monospace;
    /*    font-weight: 200;*/
    position: absolute;
    color: #000000;
    line-height: 2.2vw;
    margin-left: 18vw;
    margin-right: 17vw;
    margin-top: 84vw;
}



#exploremorebtnlayout {
    position: absolute;
    -moz-border-radius: 0.8vw;
    border-radius: 0.9vw;
    border-style: solid;
    border-width: 0.14vw;
    border-color: #212121;
    font-family: 'para', monospace;
    font-weight: 700;
    font-size: 1.12vw;
    right: 0;
    margin-right: 18vw;
    margin-top: 82vw;
    color: #000000;
    opacity: 1;
    padding-right: 8vw;
    padding-left: 1vw;
    padding-top: 1.5vw;
    padding-bottom: 1vw;
    text-decoration: none;
        background-color: #E9E9E9;
/*    border-color: #5357ee;*/
    -webkit-box-shadow: -0px 8vw 0px 0px #000000;
    -moz-box-shadow: -0px 8px 0px 0px #000000;
    box-shadow: -0px 0.4vw 0px 0px #000000;
/*    color: #2ae49c;*/
/*    font-weight: 700;*/
}


#exploremorebtnlayout:hover {

    background-color: #212121;
    border-color: #212121;
    -webkit-box-shadow: 0px 8px 0px 0px #000000;
    -moz-box-shadow: 0px 8px 0px 0px #000000;
    box-shadow: 0px 0.4vw 0px 0px #000000;
    color: #FFFFFF;
    font-family: 'para-bold', monospace;
}

#exploremorebtnlayout:active {
    margin-top: 82.4vw;
    background-color: #212121;
    border-color: #212121;
    -webkit-box-shadow: 0px 0px 0px 0px #000000;
    -moz-box-shadow: 0px 0px 0px 0px #000000;
    box-shadow: 0px 0vw 0px 0px #000000;
    color: #FFFFFF;
    font-weight: 700;
}


#footer {
    
    border-top: 0.14vw solid #E9E9E9; 
    position: absolute;
    width: 100%;
    background-color: #F3F3F3; /* 50% of bg of button */
    height: 25vw;
    margin-top: 72vw;
    z-index: -1;
/*   transform: skew(-30deg, 0deg);*/
}

#creativecommons{
    vertical-align: middle;
    align-content: center;
    margin-left: 45vw;
    position: absolute;
    width: 10vw;
    padding-bottom: 5vw;
    margin-top: 49vw;
}


#landscapeimg{
    position: absolute;
    height: 95vh;
    margin-top: 2vh;
    margin: auto;
    left: 0;
    right: 0;
    /* vertical-align: ; */
    right: 0;
    /* margi */
    z-index: +99999;
}


@media only screen and (orientation:portrait) {
    
    #wrapper {
        display:none;
        
       
    }
    
    body{
        
    }
    
    #warning-hero{
        opacity: 1;
    background-size: cover;
/*    position: fixed;*/
    height: 100vh;
    width: 100vw;
    background-color: black;
    }
    
}

@media only screen and (orientation:landscape) {
    #warning-hero {
        display: none;
    }
}


#fadein
{
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}