/* -Stylesheet--------------------------------------


 */
body {
    background: #000000;
}

li, p {
    list-style-type: none;
    text-decoration: none;
    font-family: Verdana, Sans Serif;
    color: #ffffff;
}

a {
    color: #ffffff;
    text-decoration: none;
}

.bottom-text {
    position: absolute;
    bottom: 0;
}

/* -Img-Box----------------------------------------- */
#img {
    position: absolute;
    background: #ffffff;
    border: medium solid #ffffff;
    overflow: hidden;

}
/* Landscape phones and down */
@media only screen and (max-width: 480px) {
    #img {
        top: 41%;
        left: 1%;
        bottom: 14%;
        right: 1%;
    }
    #img img {
        height: 100%;
        width: 100%;
    }
}
/* Landscape phone to portrait tablet */
@media only screen and (min-width: 480px) and (max-width: 968px) {
    #img {
        top: 41%;
        left: 1%;
        bottom: 17%;
        right: 1%;
    }
    #img img {
        height: 100%;
        width: 100%;
    }
}
/* desktop */
@media only screen and (min-width: 968px) {
    #img {
        top: 2%;
        left: 1%;
        bottom: 2%;
        right: 67%;
    }
    #img img {
        height: 100%;
        width: 100%;
    }
}
/*desktop HD*/
@media only screen and (min-height: 650px) and (min-width: 968px){

}

/* -Img-Box-2--------------------------------------- */
/* Landscape phones and down */
#imgSec {
    position: absolute;
    background: #ffffff;
    border: medium solid #ffffff;
    overflow: hidden;
}
@media only screen and (max-width: 480px) {
    #imgSec {
        display: none;
    }
}
/* Landscape phone to portrait tablet */
@media only screen and (min-width: 480px) and (max-width: 968px) {
    #imgSec {
        display: none;
    }
}
/* desktop */
@media only screen and (min-width: 968px) {
    #imgSec {
        top: 2%;
        left: 92%;
        bottom: 2%;
        right: 1%;
    }
    #imgSec img {
        height: 100%;
        width: 100%;
    }
}
/*desktop HD*/
@media only screen and (min-height: 650px) and (min-width: 968px){

}

/* -Large-Box--------------------------------------- */
#textPri {
    position: absolute;
    border: medium solid #ffffff;
    padding: 0.5vw 1vw;
}
#textPri li, #textPri p { }
#textPri .bottom-text li:nth-child(1) {
    font-weight: bold;
}
#textPri .bottom-text {
}
/* Landscape phones and down */
@media only screen and (max-width: 480px) {
    #textPri {
        top: 0.5%;
        right: 1%;
        bottom: 60%;
        left: 1%;
    }
    #textPri li, #textPri p {
        font-size: 3.7vw;
        margin: 1vw 0;

    }
    #textPri .bottom-text li:nth-child(1), p:nth-child(1) {
        font-size: 4vw;
    }
}
/* Landscape phone to portrait tablet */
@media only screen and (min-width: 480px) and (max-width: 968px) {
    #textPri {
        top: 0.5%;
        right: 1%;
        bottom: 60%;
        left: 1%;
    }
    #textPri li, #textPri p {
        font-size: 3.7vw;
        margin: 1.4vw 0;
    }
    #textPri .bottom-text li:nth-child(1) {
        font-size: 4vw;
    }
}
/* desktop */
@media only screen and (min-width: 968px) {
    #textPri {
        top: 2%;
        right: 10%;
        bottom: 37%;
        left: 35%;
    }
    #textPri li, #textPri p {
        font-size: 1.05vw;
        margin: 0.38vw 0;
    }
    #textPri .bottom-text li:nth-child(1) {
        font-size: 1.2vw;
    }

}
/*desktop HD*/
@media only screen and (min-height: 650px) and (min-width: 968px){ }

/* -Small-Box--------------------------------------- */
#textSec {
    position: absolute;
    padding: 0.5vw 1vw;
    border: medium solid #ffffff;
}
#textSec li, #textSec p { }
/* Landscape phones and down */
@media only screen and (max-width: 480px) {
    #textSec {
        right: 1%;
        bottom: 0.5%;
        top: 87%;
        left: 1%;
    }
    #textSec li, #textSec p {
        font-size: 2.1vw;
    }
}

/* Landscape phone to portrait tablet */
@media only screen and (min-width: 480px) and (max-width: 968px) {
    #textSec {
        right: 1%;
        bottom: 0.5%;
        top: 84%;
        left: 1%;
    }

    #textSec li, #textSec p {
        font-size: 2vw;
    }
}
/* desktop */
@media only screen and (min-width: 968px) {
    #textSec {
        right: 10%;
        bottom: 2%;
        top: 67%;
        left: 35%;
    }

    #textSec li, #textSec p {
        line-height: 150%;
        font-size: 0.95vw;
    }
}
/*desktop HD*/
@media only screen and (min-height: 650px) and (min-width: 968px){ }

/* -Container--------------------------------------- */
#inner-container {
    width: 100%;
    position: relative;
}
/* Landscape phones and down */
@media only screen and (max-width: 480px) {
    #inner-container {
        padding-top: 300%;
    }
}
/* Landscape phone to portrait tablet */
@media only screen and (min-width: 480px) and (max-width: 968px) {
    #inner-container {
        padding-top: 300%;
    }
}
/* desktop */
@media only screen and (min-width: 968px) {
    #inner-container {
        padding-top: 50%;
    }
}
/*desktop HD*/
@media only screen and (min-height: 650px) and (min-width: 968px){
    #outer-container {
        position: absolute;
        width: 99%;
        height: 99%;
    }
    #inner-container {
        top: 50%;
        -webkit-transform: perspective(1px) translateY(50%);
        -ms-transform: perspective(1px) translateY(50%);
        transform: perspective(1px) translateY(-50%);
    }
}