/* Base */

@font-face {
  font-family: 'Feather';
  src: url(../fonts/Feather.ttf);
}

#ems_jetpack_crm {
  font-family: 'Feather', 'sans-serif';
  font-size: 18px;
}

#ems_jetpack_crm .plugin-title {
  font-size: 26px;
  padding-bottom: 20px;
}

#ems_jetpack_crm .plugin-title a {
  color: #00796b;
  text-decoration: none;
}

#ems_jetpack_crm a:focus {
  box-shadow: none;
}

#ems_jetpack_crm .no-margin-bottom {
  margin-bottom: 0;
}



/* Section */

.container {
  display: flex;
}

section.left {
  border-right: 15px solid rgba(178, 223, 219, .5);
  margin-right: 6%;
  width: 16%;
}

section.right {
  width: 45%;
}

section.extra {
  margin: 0 auto;
  width: 20%;
}

section.extra h4 {
  border: 1px dashed rgba(255, 160, 0, .6);
  border-radius: 3px;
  color: #ffa000;
  line-height: 25px;
  padding: 10px;
}

section h2 {
  border-bottom: 5px solid rgba(178, 223, 219, .3);
  color: #009688;
  font-size: 23px;
  letter-spacing: 1px;
  margin-right: 50px;
  padding-bottom: 20px;
  word-spacing: 2px;
}



/* Menu */

.services {
  margin-top: 30px;
}

.services li {
  height: 40px;
  padding: 5px 15px;
}

.services li a {
  color: #424242;
  font-size: 20px;
  padding: 10px 2px;
  text-decoration: none;
  transition: font-size .1s;
}

.services li a:hover,
.services li a.active {
  color: #0288d1;
  font-size: 22px;
}



/* Form and Input */

.ems-form input[type=submit] {
  background: #00bfa5;
  border: none;
  border-radius: 3px;
  color: #fff;
  cursor: pointer;
  margin-top: 25px;
  padding: 10px 40px;
  transition: background .2s;
}

.ems-form input[type=submit]:hover {
  background: #00695c;
}

.ems-input-group {
  margin-bottom: 30px;
}

.ems-input-group label {
  color: #4db6ac;
  display: block;
  margin-right: 20px;
  padding-bottom: 12px;
}

.ems-input-group input[type=text] {
  border-color: rgba(97, 97, 97, .3);
  padding: 5px;
  width: 600px;
}



/* Other utility */

.ems-info {
  border: 1px dashed rgba(156, 39, 176, .5);
  border-radius: 5px;
  height: 80px;
  margin-top: 50px;
  width: 600px;
}

.ems-info .in-progress,
.ems-info .no-process {
  line-height: 80px;
  margin: 0;
  text-align: center;
}

.ems-info .in-progress {
  color: #424242;
  font-size: 20px;
}

.ems-info .no-process {
  color: #ef9a9a;
  font-size: 30px;
}

.ems-what-to-import {
  color: #616161;
}

.ems-help {
  margin-top: 100px;
}

.ems-error {
  color: #f44336;
  font-size: 19px;
}