@font-face {
    font-family: 'Avenir';
    font-style: normal;
    font-weight: 200;
    src: local('Avenir Light'), local('Avenir-Light'), url(Avenir-Light.woff) format('woff');
}
@font-face {
    font-family: 'Avenir';
    font-style: normal;
    font-weight: 400;
    src: local('Avenir Medium'), local('Avenir-Medium'), url(Avenir-Medium.woff) format('woff');
}


html, body, p {
    margin: 0px;
    padding: 0px;
    border: 0px;
}
* {font-family:'Avenir', Helvetica, Arial, sans-serif; font-weight: 200;}
.wrapper {margin:0 auto; text-align: center; clear: both; width: 100%;}
.container  {margin:0 auto;  width:940px;padding: 0 13px;}
h4 {font-size: 24px; padding:100px 0 0 ;margin: 0 0 20px; color:#555;}
h5 {font-size: 72px; margin:0;  }

.container p { line-height:28px;}
#tag {background: url('header_bg.jpg') repeat-x; color: #fff; height:95px; font-size:40px; font-weight:200; text-align: left; }
#tag h1 {float:left;background: url('mozart.png') no-repeat; margin:19px 0 0 0;  text-indent: -9999px; width:200px; height:56px;}
#tag p {float:left; padding: 36px 0 0 80px;font-size: 27px; font-weight:200;}

#features, #organize, #share, #collaborate, #publish, #api, #pricing { height: 450px;}

#features .container div {float: left;max-width: 266px; margin-top:80px;}
#features .container div p {text-align: left; color: #959595}


#organize {background:#ebebeb url("organize.jpg") top center no-repeat;}
#organize .container h4 {margin-left:560px; text-align: left; color:#959595;}
#organize .container p {margin-left:560px; text-align: left; color:#959595; padding:0; }

#share {background:#b3dcf4 url("share.jpg") top center no-repeat;}
#share .container h4 {text-align: left; color:#34383b}
#share .container p { text-align: left; color:#34383b; padding:0; width:320px; }

#collaborate {background:#000 url("collaborate.jpg") top center no-repeat;}
#collaborate .container h4 {margin-left:560px; text-align: left; color:#FFF;}
#collaborate .container p {margin-left:560px;  text-align: left; color:#EBEBEB; padding:0; width:400px; }

#publish {background:#252525 url("publish.jpg") top center no-repeat;}
#publish .container h4 {text-align: left; color:#FFF;}
#publish .container p { text-align: left; color:#EBEBEB; padding:0; width:400px; }

#api {background:#374d65 url("api.jpg") top center no-repeat;}
#api .container>img {margin-left:435px; }
#api .container h4 {margin-left:540px;text-align: left; color:#FFF;margin-top:100px; padding:0;}
#api .container p { margin-left:540px;text-align: left; color:#EBEBEB; width:400px; line-height: 24px;}
#api .container li { padding:0 0 12px 0; margin:0; list-style-position: outside; line-height: 24px;}

#pricing {background:#fff url("screens.jpg") top center no-repeat; }
#pricing .container>img {margin-right:392px; }
.basic, .pro {float:left; width:290px; margin-top:40px;border-bottom: solid 1px #dededd; height:295px; margin-bottom: 30px; }
.basic p, .pro p { padding: 0 30px;color: #9a9c9d}
#pricing h4 {color: #9a9c9d;padding-top: 10px;}
.basic { border-right: solid 1px #dededd; }
.pro {}
.getapp {clear:both; float: left; text-align: left; margin-bottom: 50px;}
.getapp a {margin-right:28px; text-align: center}
.getapp a.orange {display: block; background: url("orange-button.jpg") no-repeat; width:255px; height:44px; color: #fff; font-size: 27px; line-height: 44px; text-decoration: none; margin-bottom: 28px;}
.getapp a.orange:hover {color:#dededd;}

@media (max-width: 980px) {


}
