body {
    background-image: 
        url('https://d10i0hdaxgvcrd.cloudfront.net/asweb/devices_linked.png'),
        url('https://d10i0hdaxgvcrd.cloudfront.net/asweb/top_gradient.png'),
        url('https://d10i0hdaxgvcrd.cloudfront.net/asweb/noise_texture.png');

    background-repeat:
        no-repeat,
        repeat-x,
        repeat;

    background-position:
        center -1px,
        0 0,
        0 0;

    background-color:rgb(240, 246, 248);

    font-family: Lato, 'Helvetica Neue', Helvetica, sans-serif;
    font-weight:300;
    word-spacing: 2pt;
    letter-spacing: 0.2pt;
    color:#7aafbf;
    margin:0;
}

strong {
    font-weight:500;
    color: #059dcc;
    padding-bottom:4px;
    padding-top:1px;
    padding-left: 4px;
    padding-right: 4px;
    cursor:pointer;
}

strong:hover {
    background:#00BED6;
    border-radius: 4px;
    color: #FFFFFF;
    text-shadow:none;
    text-decoration:none;
}

#movement {
    width:1024px;
    height:1px;
    margin:0 auto;
}

    #movement .arc {
        width:64px; height:82px;
        position:absolute;
    }

    #movement .arc .file {
        background-repeat: no-repeat;
        background-position:center; 
        width:82px; height:82px; display:block;
        opacity:1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
    }

    #movement .vanish {
        -webkit-transition: opacity 0.25s ease-in;
        -moz-transition: opacity 0.25s ease-in;
        opacity:0;
    }

    #movement .arc1 {
        top:339px;
        margin-left:-74px;
        margin-top:-305px;
        -webkit-transform: translateX(76px) translateY(322px);
        -moz-transform: translateX(76px) translateY(322px);
    }

    #movement .arc1 .file {
        -webkit-transition: -webkit-transform 0.5s ease-in 0.2s;
        -webkit-transform: scale(0.7);
        -moz-transition: -webkit-transform 0.5s ease-in 0.2s;
        -moz-transform: scale(0.7);
    }

    #movement .arc1.moving .file {
        -webkit-transform: scale(0.4);
        -moz-transform: scale(0.4);
    }

    #movement .arc1.bigger .file {
        -webkit-transform: scale(0.65);
        -webkit-transition: -webkit-transform 0.2s ease-in 0.5s;
        -moz-transform: scale(0.65);
        -moz-transition: -webkit-transform 0.2s ease-in 0.5s;
    }

    #movement .arc2 .file {
        -webkit-transition: -webkit-transform 0.4s ease-in 0s;
        -webkit-transform: scale(0.4);
        -moz-transition: -webkit-transform 0.4s ease-in 0s;
        -moz-transform: scale(0.4);
    }

    #movement .arc2.bigger .file {
        -webkit-transform: scale(1);
        -webkit-transition: -webkit-transform 0.6s ease-in 0.1s;
        -moz-transform: scale(1);
        -moz-transition: -webkit-transform 0.6s ease-in 0.1s;
    }

    #movement .arc3 .file {
        -webkit-transition: -webkit-transform 0.4s ease-in 0s;
        -webkit-transform: scale(0.65);
        -moz-transition: -webkit-transform 0.4s ease-in 0s;
        -moz-transform: scale(0.65);
    }

    #movement .arc3.bigger .file {
        -webkit-transform: scale(1);
        -webkit-transition: -webkit-transform 0.5s ease-in 0.1s;
        -moz-transform: scale(1);
        -moz-transition: -webkit-transform 0.5s ease-in 0.1s;
    }

    #movement .arc2 {
        top:0px;
        margin-left:56px;
        margin-top:-126px;
    }

    #movement .arc3 {
        top:0px;
        margin-left:56px;
        margin-top:-126px;
    }

#main {
    margin:0 auto;
    margin-top:543px;
    width: 970px;
}

#arcs {
    background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/arcs.png);
    background-repeat:no-repeat;
    background-position: center;
    width:1187px;
    height:522px;
    position:absolute;
    margin-top:-548px;
    margin-left:-116px;
    z-index:1;
    opacity:0;
}

body.loaded #arcs {
    -webkit-transition:opacity 0.2s ease-in 0.5s;
    -moz-transition:opacity 0.2s ease-in 0.5s;
    opacity:1;
}

#big_logo {
    background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/big_logo.png);
    background-repeat:no-repeat;
    background-position: center;
    width:970px;
    height:600px;
    position:absolute;
    margin-top:-613px;
    margin-left:-2px;
    z-index:31337;
}

button {
    background-image: -webkit-linear-gradient(top, rgb(101,192,220), rgb(64,163,195));
    background-image: -moz-linear-gradient(top, rgb(101,192,220), rgb(64,163,195));
    display:inline-block;
    text-align:center;
    width:276px;
    padding: 10px;
    border-radius:10px;
    border:1px solid #093c44;
    font-family: Lato, 'Helvetica Neue', Helvetica, sans-serif;
    text-transform:capitalize;
    text-shadow: 0 -1px 1px #093c44;
    color:white;
    font-size:20pt;
    font-weight:300;
    box-shadow: 0 2px 4px 0 rgba(9, 60, 68, 0.3),
        inset 0 1px 2px 0 rgba(174, 235, 255, 1);
    display:block;
    cursor:pointer;
}

button:hover {
    background-image: -webkit-linear-gradient(top, rgb(116,207,235), rgb(78,178,210));
    background-image: -moz-linear-gradient(top, rgb(116,207,235), rgb(78,178,210));
}

button:active {
    position:relative;
    top:1px;
    box-shadow: none;
}

strong {
    color:#00BED6;
    font-weight: bold;
}

h2 {
    text-align:center;
    font-size:37pt;
    font-weight:300;
    letter-spacing:0.4px;
    word-spacing:3pt;
    color:#087797;
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
    margin-bottom:0.23em;
}

#logo {
    width:238px;
    height:82px;
    background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/as_logo.png);
    display:block;
    position:absolute;
    right:30px;
    top:30px;
}

#quick_sell {
    padding: 0 10px;
    height:200px;
}

    #quick_sell p {
        float:left;
        width:574px;
        box-sizing:border-box;
        margin:0;
        font-size:16pt;
        font-weight:300;
        line-height:30pt;
        text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.8);
        letter-spacing: -0.2pt;
        margin-top:0.5em;
    }

    #quick_sell #quick_download {
        float:right;
        width:280px;
        box-sizing:border-box;
        text-align:center;
        margin-top: 1.3em;
    }

    #quick_sell label {
        font-size:13pt;
        font-weight:300;
        text-shadow: 0 0 1px rgba(255,255,255,0.2);
        margin-top:8px;
        display:block;
    }

.well {
    background: rgba(253,253,253, 1);
    box-sizing:border-box;
    border:1px solid rgba(181, 208, 218, 1);
    border-radius:10px;
    box-shadow: 1px 1px 1px rgba(241, 247, 250, 0.9);
    margin-top:2em;
}

.section {
    margin-top:73px;
}

#simplicity {
    padding: 0 5px;
    margin-top:100px;
}

    #simplicity ol {
        height:326px;
        list-style:none;
        padding:0;
    }

    #simplicity ol li {
        float:left;
        width:33.3333%;
        box-sizing:border-box;
        font-size:18pt;
        font-weight:300;
        color:#1480A1;
        text-align:center;
        padding-top:253px;
        background-repeat:no-repeat;
    }

    #simplicity h4 {
        text-align:center;
        margin-top:8px;
        font-weight:300;
        margin-top:0;
        text-shadow: 0 1px 1px rgba(255,255,255,0.8);
    }

    #simplicity .goes {
        background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/jump_right.png);
    }

    #simplicity .who {
        background-image:url(images/who_face.png);
    }

    #simplicity .copy {
        background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/copy_file.png);
    }

#video {
    margin:73px auto;
    width:855px; height:477px;
    background-image:url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/seb.png),
        url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/play_button.png);
    cursor:pointer;
}

#video:active {
    position:relative;
    -webkit-transform: translateY(1px);
    -moz-transform: translateY(1px);
}

#downloads {
    height:300px;
    margin-top:100px;
}

    #downloads ol {
        width: 810px;
        height: 130px;
        margin: 0 auto;
        list-style:none;
        padding:0;
        margin-top:2em;
        cursor:pointer;
    }

    #downloads ol li {
        width: 20%;
        height: 130px;
        display:block;
        float:left;
        box-sizing:border-box;
        padding:0;
        margin:0;
        background-repeat:no-repeat;
        background-position:center;
        cursor:pointer;
    }

    #downloads ol li.selected:before {
        content: '';
        height:174px;
        width: 174px;
        position:absolute;
        margin-top:-35px;
        margin-left:-5px;
        background-repeat:no-repeat;
        background-image: url(images/circle_highlight.png);
    }

    #downloads label {
        display:block;
        width:69px;
        height:78px;
        margin-top:20px;
        margin-left:50px;
    }

    #downloads li:hover label {
        background-position-x:68px;
        opacity: .5;
        -webkit-transition: opacity;
        -webkit-transition-timing-function: ease-out;
        -webkit-transition-duration: 300ms; 
        -moz-transition: opacity;
        -moz-transition-timing-function: ease-out;
        -moz-transition-duration: 300ms; 
        cursor:pointer;
    }

    #downloads li.selected label,
    #downloads li:active label {
        background-position-x:138px;
    }

    #downloads .windows label {
        background-image:url(images/windows_logo.png);
    }

    #downloads .mac label {
        background-image:url(images/mac_logo.png);
    }

    #downloads .android label {
        background-image:url(images/android_logo.png);
    }

    #downloads .ipad label {
        background-image:url(images/ipad_logo.png);
    }

    #downloads .iphone label {
        background-image:url(images/iphone_logo.png);
    }

    #downloads #dl {
        margin:0 auto;
        width:810px;
        margin-top:58px;
    }

    #downloads button {
        margin:0 auto;
        display:none;
        border-radius:40px;
    }

        #downloads #dl .well {
            width:510px;
            margin:0 auto;
            height:60px;
            box-sizing:border-box;
            display:none;
            box-shadow:0 2px 4px rgba(9,60,68, 0.3);
            border:1px solid #40a2c0;
        }

        #downloads #dl p {
            text-align:center;
            text-transform:lowercase;
            font-weight:300;
            padding-top:1em;
        }

        #downloads #dl form.submitted { height:0; border:0; }
        #downloads #dl form.submitted *,
        #downloads #dl p.success { display:none; }
        #downloads #dl form.submitted p.success { 
            display:block; font-size:18pt; font-weight:100; 
        }

    #downloads input {
        border:0;
        font-size:18pt;
        font-weight:300;
        font-family:Leto, sans-serif;
        padding:10px 7px;
        margin-left:10px;
        background:transparent;
        text-shadow:0 0 1px #fff;
        outline:0;
        box-shadow:none;
        width:375px;
        color: #323131;
        padding-top:12px;
    }

    #downloads form button {
        display:block;
        float:right;
        width:77px;
        border-radius:6px;
        height:49px;
        line-height:6px;
        font-weight:300;
        margin-top:4px;
        margin-right:4px;
    }

    #downloads form input::-webkit-input-placeholder,
    #downloads form input:-moz-placeholder {
        color:#b1afab;
    }

    #downloads #dl.mac button.mac,
    #downloads #dl.windows button.windows,
    #downloads #dl.android button.android,
    #downloads #dl.ipad .well.ipad,
    #downloads #dl.iphone .well.iphone { display:block; }

#sharing {
    list-style:none;
    margin:0 auto;
    width:30%;
    text-align:center;
    margin-top:80px;
    padding-top:130px;
    padding-left:0;
    font-size:0;
}

    #sharing li {
        background-color:black;
        border-radius:5px;
        height:30px;
        width:30px;
        display:inline-block;
        background-repeat:no-repeat;
        background-position:center;
        margin-right:5px;
        margin-left:5px;
        cursor:pointer;
    }

    #sharing li:hover {
        background-color:#2ba8d3;
    }

    #sharing .twitter {
        background-image:url(images/twitter_logo.png);
    }

    #sharing .facebook {
        background-image:url(images/facebook_logo.png);
        background-position:14px 6px;
    }

    #sharing .pinterest {
        background-image:url(images/pinterest_logo.png);
        background-position:9px 8px;
    }

    #sharing .linkedin {
        background-image:url(images/linkedin_logo.png);
    }


footer {
    display:block;
    background-image: url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/cityscape.png),
        -webkit-linear-gradient(top, rgba(241,255,252,0), rgba(206, 234, 243, 1));
    background-image: url(https://d10i0hdaxgvcrd.cloudfront.net/asweb/cityscape.png),
        -moz-linear-gradient(top, rgba(241,255,252,0), rgba(206, 234, 243, 1));
    height:368px;
    background-repeat:no-repeat, repeat;
    background-position:bottom, bottom;
}