body * {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
}

body { font-size: 16px;   }
h1   { font-size: 4em;    }
h2   { font-size: 1.75em; }
h3   { font-size: 1.25em; }

h1      { font-weight: 100; }
h2      { font-weight: 300; }
h3      { font-weight: 500; }
strong  { font-weight: 500; }

.text-white       { color: #FFF;   }
.text-blue        { color: #278FF9; }
.background-blue  { background-color: #278FF9; }
.background-grey  { background-color: #EEE; }

a, a:hover, a:visited {
  color: inherit;
  text-decoration: underline;
}

section {
  padding-top:     10em;
  padding-bottom:  10em;
}

.logo {
  margin: 1em;
  width: 200px ;
}

.header {
  padding-top: 12px;
  padding-bottom: 12px;
}

.header h2 {
  padding: 0;
  margin:  0;
  padding-top: 10px;
}

/* To prevent a white space on the right from appearing on mobile phones */
/* http://stackoverflow.com/questions/14270084/overflow-xhidden-doesnt-prevent-content-from-overflowing-in-mobile-browsers */
.site-wrapper { overflow-x: hidden; }

.headline {
  background-image: url(../images/headline-background.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.headline {
  position: relative;
/*  height: 600px;*/
  height: 100vh;
}

.headline section {
  padding:0;
  margin: 0;
  width: 90%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.contact  {
  background: url(../images/contact-background.jpg) no-repeat center center;
  background-size: cover;
}

footer { padding: 0.5em }

ul { padding-left: 0; }

li  { list-style: none; }

li:before {
  content: "\e013"; /*glyphicon-ok;*/
  font-family: 'Glyphicons Halflings';
  font-size: 0.75em;
  margin-right: 0.75em;
  margin-left:  0.25em;
}

/* Apply to everything except small screens */
@media (min-width: 768px)  {
  .clear-padding { padding: 0; }

  .iphone-with-message { width: 250px; }

  .send-and-receive {
    height: 600px;
  }

  .send-and-receive .left-content {
    width: 100%;
  }

  .center-xy-container {
    position: relative;
    height: 100%;
  }

  .center-xy-element {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}



/* Apply to smaller screens */
@media (max-width: 767px)  {
  h1 { font-size: 2.5em; }
  h2 { font-size: 1.25em; }

  section {
    padding-top: 4em;
    padding-bottom: 4em;
  }

  .logo { width: 150px; }
  
  .iphone-with-message {
    display: block;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 4em;
  }
}

/*@media (min-width: 992px)  {}*/
/*@media (min-width: 1200px) {}*/