/* 
 * Facebook Messenger promotional page
 * 
 * Copyright 2017 Nuzzel, Inc.
 */

body {
  background: #F1F1F1;
}

.fbm-promo-content {
  padding-bottom: 64px;
  padding-top: 64px;
  background: #FFF;
}

.fbm-promo-content-main-image, 
.fbm-promo-content-how-to-main-image {
  display: inline;
}

.fbm-promo-content-main-header {
  float: right;
  margin-bottom: 16px;
}

.fbm-promo-content-main {
  margin-bottom: 64px;
}

.fbm-promo-content-main-header-title {
  font-size: 2em;
  font-weight: bold;
  line-height: 1.25em;
  margin-bottom: 8px;
  margin-top: 32px;
  text-align: center;
}

.fbm-promo-content-how-to-header-title {
  font-size: 1.7em;
  font-weight: bold;
  line-height: 1.25em;
  margin-bottom: 8px;
  margin-top: 40px;
  text-align: center;
}

.fbm-promo-content-main-header-button {
  width: 132px;
  margin: 0 auto;
}

.fbm-promo-content-how-to-header-button {
  width: 175px;
  margin: 0 auto;
}

.fbm-promo-content-how-to-header-description,
.fbm-promo-content-main-header-button {
  padding-bottom: 24px;
}

.fbm-promo-content-main-header-description,
.fbm-promo-content-how-to-header-description {
  font-size: 1.25em;
  margin-bottom: 10px;
}

.fbm-promo-header {
  background: #2E3D4B;
  padding: 56px 0 24px 0;
}

.fbm-promo-header-title {
  color: #FFF;
  font-size: 2.5em;
  text-align: center;
}

/** Bootstrap v3 x-small break **/
@media(max-width:767px){

  .fbm-promo-content {
    padding-top: 32px;
  }

  .fbm-promo-content-main-header-title {
    margin-top: 16px;
  }

  .fbm-promo-content-main {
    margin-bottom: 32px;
  }

  .fbm-promo-content-how-to {
    margin-bottom: 8px;
  }

}