@CHARSET "ISO-8859-1";

h1 {
    font-size: 6em;
}

/*p {
    font-size: 2em;
}*/

.section {
    text-align: center;
}

/* Menu
 * --------------------------------------- */
#menu li {
    display: inline-block;
    margin: 10px;
    color: #000;
    background: #fff;
    background: rgba(255,255,255, 0.5);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

    #menu li.active {
        background: #666;
        background: rgba(0,0,0, 0.5);
        color: #fff;
    }

    #menu li a {
        text-decoration: none;
        color: #000;
    }

    #menu li.active a:hover {
        color: #000;
    }

    #menu li:hover {
        background: rgba(255,255,255, 0.8);
    }

    #menu li a,
    #menu li.active a {
        padding: 9px 18px;
        display: block;
    }

    #menu li.active a {
        color: #fff;
    }

#menu {
    position: fixed;
    top: 0;
    left: 0;
    height: 40px;
    z-index: 70;
    width: 100%;
    padding: 0;
    margin: 0;
}


.intro p {
    font-size: 1.5em;
}

.twitter-share-button {
    position: fixed !important;
    z-index: 99;
    right: 149px;
    top: 9px;
}

#download {
    margin: 10px 0 0 0;
    padding: 15px 10px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
    background-color: #49afcd;
    background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: -webkit-gradient(linear,0 0,0 100%,from( #5bc0de),to( #2f96b4));
    background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
    background-image: linear-gradient(top, #5bc0de, #2f96b4);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);
    border-color: #2f96b4 #2f96b4 #1f6377;
    border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    vertical-align: middle;
    cursor: pointer;
    display: inline-block;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}

    #download a {
        text-decoration: none;
        color: #fff;
    }

    #download:hover {
        text-shadow: 0 -1px 0 rgba(0,0,0,.25);
        background-color: #2F96B4;
        background-position: 0 -15px;
        -webkit-transition: background-position .1s linear;
        -moz-transition: background-position .1s linear;
        -ms-transition: background-position .1s linear;
        -o-transition: background-position .1s linear;
        transition: background-position .1s linear;
    }

#infoMenu {
    height: 20px;
    color: #f2f2f2;
    position: fixed;
    z-index: 70;
    bottom: 0;
    width: 100%;
    text-align: right;
    font-size: 0.9em;
    padding: 8px 0 8px 0;
}

    #infoMenu ul {
        padding: 0 40px;
    }

    #infoMenu li a {
        display: block;
        margin: 0 22px 0 0;
        color: #333;
    }

        #infoMenu li a:hover {
            text-decoration: underline;
        }

    #infoMenu li {
        display: inline-block;
        position: relative;
    }

#examplesList {
    display: none;
    background: #282828;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    padding: 20px;
    float: left;
    position: absolute;
    bottom: 29px;
    right: 0;
    width: 638px;
    text-align: left;
}

    #examplesList ul {
        padding: 0;
    }

        #examplesList ul li {
            display: block;
            margin: 5px 0;
        }

            #examplesList ul li a {
                color: #BDBDBD;
                margin: 0;
            }

                #examplesList ul li a:hover {
                    color: #f2f2f2;
                }

    #examplesList .column {
        float: left;
        margin: 0 20px 0 0;
    }

    #examplesList h3 {
        color: #f2f2f2;
        font-size: 1.2em;
        margin: 0 0 15px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.4);
        -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
        -moz-box-shadow: 0 1px 0 rgba(255,255,255,0.1);
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
        padding: 0 0 5px 0;
    }

/* Section 1
 * --------------------------------------- */
#section1 h3 {
    color: #444;
    font-size: 50px;
}

#section1 p {
    color: #444;
}

#section1 img {
    margin: 20px 0;
    height: 470px;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    margin: 0;
}
/* Section 2
 * --------------------------------------- */
#section2 .intro {
    width: 80%;
    margin: 0 auto;
}

    #section2 .intro .img {
        float: left;
        width: 40%;
        padding: 10px;
    }

        #section2 .intro .img img {
            width: 100%;
        }

    #section2 .intro .text {
        float: left;
        width: 60%;
        padding: 10px;
        padding-left: 100px;
    }

        #section2 .intro .text h3 {
            text-align: justify;
            font-size: 40px;
            margin-top: 90px;
        }

        #section2 .intro .text p {
            color: #000;
            text-align: justify;
            margin-bottom: 50px;
        }

#section2 h1,
#section2 p {
    z-index: 3;
}


/* Section 3
 * --------------------------------------- */
#section3 .intro {
    width: 80%;
    margin: 0 auto;
}

    #section3 .intro .img {
        float: left;
        width: 35%;
        padding: 10px;
    }

        #section3 .intro .img img {
            width: 768px;
            height: 768px;
            transform: translate(-60px, 1.13687e-13px) rotate(180deg);
        }

    #section3 .intro .text {
        float: left;
        width: 65%;
        padding: 10px;
        padding-left: 100px;
    }

        #section3 .intro .text p.span3 {
            text-align: justify !important;
            font-size: 20px;
        }

        #section3 .intro .text p.span4 {
            text-align: justify !important;
            font-size: 20px;
            margin-top: 120px;
        }

        #section3 .intro .text h3 {
            text-align: justify;
            font-size: 35px;
            margin-top: 90px;
        }

        #section3 .intro .text p {
            color: #000;
            text-align: justify;
            margin-bottom: 50px;
        }

p.section3 {
    margin: 50px 0;
}

#section3 h1,
#section3 p {
    z-index: 3;
}

/* Section 4
 * --------------------------------------- */

.container-global {
    width: 80%;
    margin: 0 auto;
    border-radius: 15px;
    background-color: #fff;
}

    .container-global .grid3 {
        width: 33.333%;
        border-right: solid 1px #D9D9DA;
        height: 100%;
        text-align: center;
        float: left;
    }

        .container-global .grid3 .img1 {
            width: 225.582px;
            height: 150.388px;
            margin: 0 auto;
        }

        .container-global .grid3 .img2 {
            width: 136.582px;
            /* height: 150.388px; */
            margin: 0 auto;
            margin-top: 32px;
            margin-bottom: 39px;
        }

        .container-global .grid3 .img3 {
            width: 136.582px;
            /* height: 150.388px; */
            margin: 0 auto;
            margin-top: 32px;
            margin-bottom: 39px;
        }

        .container-global .grid3 .text h6 {
        }

        .container-global .grid3 .text p {
            font-size: 1em;
            text-align: center;
        }

#section4 h3 {
    color: #444;
    font-size: 50px;
}

#section4 p.title {
    color: #444;
    margin-top: 100px;
}

/* Section 5
 * --------------------------------------- */
#section5 h3 {
    color: #444;
    font-size: 50px;
    margin-top: 50px;
}

#section5 img {
    margin-top: 100px;
    width: 100%;
}

/* Section 6
 * --------------------------------------- */
#section6 h3 {
    color: #444;
    font-size: 50px;
    margin-top: 50px;
}

.section6-row {
    width: 65%;
    margin: 50px auto;
}

    .section6-row .grid2 {
        width: 50%;
        float: left;
        border-right: solid 1px #D9D9DA;
    }

        .section6-row .grid2 span {
            font-size: 24px;
            margin-bottom: 30px;
            display: block;
        }

        .section6-row .grid2 p {
            font-size: 50px;
            font-weight: 800;
        }

#section6 .text {
    margin-bottom: 160px;
}

    #section6 .text h4 {
        font-size: 1.5em;
        font-weight: 400;
        font-style: normal;
        color: rgb(46, 47, 51);
        font-kerning: none;
        text-decoration-line: none;
        text-decoration-thickness: initial;
        text-decoration-style: initial;
        margin-bottom: 25px;
    }

    #section6 .text p {
        font-size: 20px;
        font-weight: 400;
        font-style: normal;
        color: rgb(46, 47, 51);
        font-kerning: normal;
        text-decoration-line: none;
        text-decoration-thickness: initial;
        text-decoration-style: initial;
    }

/* Section 7
 * --------------------------------------- */
#section7 .img {
    width: 414px;
    height: 184px;
    margin: 0 auto;
}

#section7 .button-row {
    width: 50%;
    margin: 20px auto;
}

    #section7 .button-row .grid3 {
        width: 33.333%;
        float: left;
        margin: 0 auto;
    }

        #section7 .button-row .grid3 a {
            font-size: 20px;
        }

#section7 .grid-row {
    width: 70%;
    margin: 20px auto;
    background-color:#fff;
    border-radius:10px;
}

    #section7 .grid-row .grid3 {
        width: 33.33%;
        float: left;
        border-right: solid 1px #dedede;
        padding:15px;
    }
        #section7 .grid-row .grid3 p{
            font-size:20px;
        }
        /* Overwriting fullPage.js tooltip color
* --------------------------------------- */
        #pp-nav.custom .pp-tooltip {
            color: #AAA;
        }


.twitter-share-button {
    position: fixed;
    z-index: 99;
    right: 149px;
    top: 9px;
}

#starGithub {
    position: fixed;
    z-index: 99;
    right: 264px;
    top: 9px;
    width: 90px;
}