@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);

 @font-face {
   font-family: 'GothamBook';
  src: url('../fonts/gotham/book/gothambook-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/gotham/book/gothambook-webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/gotham/book/gothambook-webfont.woff') format('woff'), /* Pretty Modern Browsers */
      url('../fonts/gotham/book/gothambook-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/gotham/book/gothambook-webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'GothamBlack';
  src: url('../fonts/gotham/black/gotham_black-webfont.eot'); /* IE9 Compat Modes */
  src: url('../fonts/gotham/black/gotham_black-webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/gotham/black/gotham_black-webfont.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/gotham/black/gotham_black-webfont.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/gotham/black/gotham_black-webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/gotham/black/gotham_black-webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
 }
body {
    font-family: Arial, sans-serif;
    background-color: transparent;
    margin: 0;
    padding: 0;
}

.shadow {
    text-shadow: -1px 0 black,
    0 1px black,
    1px 0 black,
    0 -1px black;
}

#manage_guestlists {
    background: url("/images/promoter/picture1.jpg") no-repeat fixed;
    background-size: cover;
    width: 100%;
    height: 1391px;
}

#title {
    width: 100%;
    height: 10%;
    background-color: black;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.title {
    text-align: center;
    display: block;
    font-size: 1.6em;
    color: white;
}

.manage_guestlists {
    margin-top: 350px;
    text-align: center;
    font-size: 1.4em;
}

h2 {
    font-weight: bold;
    color: #5F3A70;
}

.white {
    font-weight: bold;
    color: white;
}

#manage_sub_promoters {
    margin-top: -15%;
    margin-right: 300px;
    background: url("/images/promoter/screen1.png") no-repeat right;
    width: 100%;
    height: 1391px;
}

.manage_sub_promoters {
    position: absolute;
    margin-top: 530px;
    margin-left: 25%;
    text-align: center;
    font-size: 1.4em;
    color: #737373;
}

#promote_event {
    background: url("/images/promoter/picture2.jpg") no-repeat fixed;
    background-size: cover;
    width: 100%;
    height: 1261px;
}

.promote_event {
    position: absolute;
    margin-left: 32%;
    margin-right: 32%;
    margin-top: 200px;
    text-align: center;
    font-size: 1.4em;
    color: white;
}

#facebook_app {
    margin-top: -10%;
    background: url("/images/promoter/screen2.png") no-repeat right;
    margin-right: 200px;
    width: 100%;
    height: 1391px;
}

.facebook_app {
    position: absolute;
    margin-top: 530px;
    margin-left: 25%;
    text-align: center;
    font-weight: 600;
    font-size: 1.4em;
    color: #737373;
}

#collect_data {

    background: url("/images/promoter/picture3.jpg") no-repeat fixed;
    background-size: cover;
    width: 100%;
    height: 1089px;

}

.collect_data {
    position: absolute;
    margin-left: 32%;
    margin-right: 32%;
    margin-top: 340px;
    text-align: center;
    font-weight: bold;
    font-size: 1.4em;
    color: white;

}

.get-started {
    margin-top: 60px;
}

.button {
    padding: 15px;
    color: #FFFFFF;
    background: #5F3A70;
    text-decoration: none;
    min-width: 75px;
}

.button:hover {
    background: #84409E;
}

.skip-about {
    position: fixed;
    bottom: 35px;
    right: 35px;
}

/*NEW*/
/* START PROMOTER ABOUT US */

@media screen and (max-width: 1200px) and (min-width: 800px) {
    .promoterGuestlistImage{
    }
    .promoteraboutusheaderimage{
    }
    .promoterAboutUstextcontainer{
        padding-left: 15%!important;
    }
    .promoterAboutUsimage{
        width: 90% !important;
    }
    .promoterAboutUsimageRight{
        width: 90% !important;
    }
}
@media screen and (max-width: 1400px) and (min-width: 1200px) {
    .promoterAboutUsimage{
        width: 90%!important;
    }
    .promoterAboutUsimageRight{
        width: 90%!important;
    }
}
@media screen and (max-width: 1600px) and (min-width: 1400px) {
    .promoterAboutUsimageRight{
        width: 85%!important;
    }
    .promoterAboutUsimage{
        width: 85%!important;
    }
}

@media screen and (min-width: 800px){
    .promoterAboutUsimageTablet{
        display: none!important;
    }
}
.promoterAboutUsimageTablet{
    width: 100%
}
@media screen and (max-width: 1100px){
    .promoterAboutUsimage{
        padding-top: 16%!important;
    }
    .promoterAboutUsimageRight{
        padding-top: 16%!important;
    }
}
@media screen and (min-width: 800px){
    .promoterAboutUstextBox{
        padding-left: 8%;
    }
    .promoterAboutUsimage{
        padding-left: 10%;
        padding-top: 10%;
    }
    .promoterAboutUsimageRight{
        padding-left: 10%;
        padding-top: 10%;
    }
    .promoterAboutUstextBoxRight{
        margin: 10% 0px;
    }
    .promoterAboutUstextBox{
        margin: 10% 0px;
    }
    .promoterAboutUstextcontainerRight{
        padding-right: 20%!important;
        width: 100%;
    }
    .promoterAboutUstextButtonRight{
        margin-top: 5%;
    }
    .promoterAboutUstextButton{
        margin-top: 5%;
    }
    .promoterAboutUstextcontainer{
        padding-left: 20%!important;
    }
  
}
@media screen and (max-width: 800px){
    .promoterAboutUstextBox{
        width: 80%!important;
        text-align:left!important;
        margin-left: 10%!important;
        padding-left: 0px!important;
        padding-right: 0px!important;
        margin-top: 23%!important;
    }
    .promoterGuestlistImage{
        width: 80%!important;
    }
    .promoterAboutUstext{
        text-align: center!important;
    }
    .promoterAboutUstextButton{
        width: 100%!important;
    }
    .promoterAboutUstextBoxHeader{
        text-align: center!important;
    }
    .promoterAboutUstextButtonRight{
        width: 100% !important;
    }
    .promoterAboutUstextRight{
        text-align: center!important;
    }
    .promoterAboutUstextBoxRight{
        width: 100%!important;
        text-align:left!important;
        padding-left: 0px!important;
        padding-right: 0px!important;
    }
    .promoterAboutUstextcontainer{
        padding-left: 0%!important;
    }
    .promoterAboutUstextcontainerRight{
        padding-right:0%!important;
    }
    .promoterAboutUstextButton{
        margin-left: 0px!important;
        float: left!important;
    }
     .promoterAboutUsimage{
        display:none!important;
    }
    .promoterAboutUsimageRight{
        display: none!important;
    }
}
@media screen and (max-width:800px){
    div.promoterAboutUsBox{
        padding: 100px 0px!important;
    }
    .promoterAboutUstextBox{
        width: 90%!important;
        text-align: center!important;
        margin-left: 0%!important;
        padding-left: 5%!important;
        padding-right: 5%!important;
        margin-top: 5%!important;    
    }
    .promoterAboutUstextBoxRight{
        width: 90%!important;
        text-align: center!important;
        margin-left: 0%!important;
        padding-left: 5%!important;
        padding-right: 5%!important;
        margin-top: 5%!important;   
    }
    .promoterAboutUstextButton{
        margin-top: 15px;
    }
    .promoterAboutUstextButtonRight{
        margin-top: 15px;
    }
}

@media screen and (max-width: 800px) and (min-width: 0px) {
    .promoterAboutUsHeaderText{
        margin: 15% 5%!important;
        font-size: 30px!important;
        line-height: 40px!important;
    }
    .promoteraboutusheaderimage{
        padding: 100px 0px!important;
    }
    .promoterAboutUstext{
        text-align: center;
    }
    .promoterAboutUstextRight{
        text-align: center;
    }
    .promoterAboutUstextBoxHeader{
        text-align: center;
    }
    .promoterAboutUstextButton{
        width: 100%!important;
    }
    .promoterAboutUstextButtonRight{
        width: 100%!important;
    }
    .promoterAboutUsTweetBox{
        font-size: 160%!important;
    }
    .promoterAboutUsTweetIcon{
        width: 7%!important;
        margin-bottom: -2%;
    }
}
.promoterAboutUstextBox{
    width: 40%;
    float:left;
    text-align: right;
}
.promoterAboutUstextBoxRight{
    width: 40%;
    float:left;
    text-align: left;
    padding-left: 6%;
}
.promoterAboutUsimage{
    width: 75%;
}
.promoterAboutUsimageRight{
    width: 75%;
    float:right;
}
.promoterAboutUsimageBox{
    width: 45%;
    float: left;
}
.promoterAboutUstext{
    font-family: 'gothambook';
    font-size: 21px;
    line-height: 33px;
    font-weight: bold;
    width: 100%;
    float: right;
    color: #434343;
}
.promoterAboutUstextRight{
    font-family: 'gothambook';
    font-size: 21px;
    line-height: 33px;
    font-weight: bold;
    width: 100%;
    float: left;
    color: #434343;
}
.promoterAboutUstextButton{
    background-color: #000;
    color: #fff;
    text-align: center;
    float:right;
    width: 320px;
    line-height: 70px;
    text-transform: uppercase;
    height: 70px;
    font-family: 'gothambook';
    font-weight: 900;
    font-size: 19px;
    border-radius: 4px;
}
.promoterAboutUstextButtonRight{
    background-color: #000;
    color: #fff;
    text-align: center;
    float:left;
    width: 320px;
    line-height: 70px;
    text-transform: uppercase;
    height: 70px;
    font-family: 'gothambook';
    font-weight: 900;
    font-size: 19px;
    border-radius: 4px;
}

.promoterAboutUstextcontainer{
    padding-left: 44%;
}
.promoterAboutUstextcontainerRight{
    padding-right: 44%;
}
.promoterAboutUstextBoxHeader{
    text-transform: uppercase;
    color:#783D8D;
    font-weight: 900;
    font-size: 30px;
}

.promoterAboutUsBox{
    margin: 0 auto; 
    padding: 150px 0px;
}
.promoterAboutUsimageBoxTablet{
    width: 100%;
}
.promoteraboutusheaderimage{
    background-image: url('../../images/promoter/party.png');
    width:100%;
    background-size: cover;
    background-position: center;
    text-align: center;
    padding: 200px 0px;
}
.promoterGuestlistImage{
    width: 40%;
}
.promoterAboutUsHeaderText{
    color: #fff;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 40px;
    line-height: 60px;
}
.promoterAboutUsTweetBox{
    text-align: center;
    font-size: 42px;
    height: 170px;
    line-height: 170px;
    color:#C2C2C2;
    font-family:'GothamBlack'
}
.promoterAboutUsTweetIcon{
    width: 40px;
}
/* END PROMOTER ABOUT US   */

.outer {
    height: 100%;
    width: 100%;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

.inner {
    margin-left: auto;
    margin-right: auto;
    width: /*whatever width you want*/;
}

.grey {
  background-color: #EEEEEE;
}