.form-control:focus {
  border: 1px solid #ba68c8;
  box-shadow: 0 0 0 0.2rem rgba(186, 104, 200, .25);
}

.ColorListReport {width:100%;margin:1em auto auto;float:left;padding:1%;background:#874398;}
.ColorListReport-result         {margin:auto auto auto 1%;width:19%;float:left;background:#743484;color:#ffffff;padding:0.5%;border-radius:6px;}
.ColorListReport-result img     {width:auto;margin:auto;float:left;}
.ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
.ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
.ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}


/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .PromoterProfileName {font-size:13px;}
.PromoterProfilePicture {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
.PromoterProfilePicture-child {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture-child img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
  .PromoterGuestClient {float:left;width:48%;padding:5px;margin:0.5rem 1%;border:1px solid #aaa;background:none;}
  .PromoterGuestClient:hover {background:#eceaea;}
  .PromoterGuestClient:focus {background:#eceaea;}
  .PromoterGuestClient p {margin:0;text-align:center;font-size:1em;line-height:23px;height:75px;}
  .PromoterGuestClient span {color:#1398cb;font-weight:bold;float:left;width:100%;margin:auto auto 5px;height:35px;line-height:17px;}
  .ColorListReport {width:100%;margin:1em auto auto;float:left;padding:2%;background:#874398;}
  .ColorListReport-result {margin:1% 0 0;width:100%;float:left;background:#743484;color:#ffffff;padding:1%;border-radius:0;}
  .ColorListReport-result img     {width:auto;margin:2.5% auto auto 2%;float:left;}
  .ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
  .ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
  .ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .PromoterProfileName {font-size:13px;}
.PromoterProfilePicture {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
.PromoterProfilePicture-child {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture-child img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
  .PromoterGuestClient {float:left;width:32.3%;padding:5px;margin:0.2%;border:1px solid #aaa;background:none;}
  .PromoterGuestClient:hover {background:#eceaea;}
  .PromoterGuestClient:focus {background:#eceaea;}
  .PromoterGuestClient p {margin:0;text-align:center;font-size:1.2em;line-height:20px;height:75px;}
  .PromoterGuestClient span {color:#1398cb;font-weight:bold;float:left;width:100%;margin:auto auto 5px;height:35px;line-height:17px;}
  .ColorListReport {width:100%;margin:1em auto auto;float:left;padding:1%;background:#874398;}
  .ColorListReport-result {margin:1%;width:48%;float:left;background:#743484;color:#ffffff;padding:0.5%;border-radius:6px;}
  .ColorListReport-result img     {width:auto;margin:auto;float:left;}
  .ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
  .ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
  .ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .PromoterProfileName {font-size:13px;}
.PromoterProfilePicture {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
.PromoterProfilePicture-child {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture-child img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
  .PromoterGuestClient {float:left;width:18%;padding:5px;margin:1%;border:1px solid #aaa;background:none;}
  .PromoterGuestClient:hover {background:#eceaea;}
  .PromoterGuestClient:focus {background:#eceaea;}
  .PromoterGuestClient p {margin:0;text-align:center;font-size:1em;line-height:23px;height:75px;}
  .PromoterGuestClient span {color:#1398cb;font-weight:bold;float:left;width:100%;margin:auto auto 5px;height:35px;line-height:17px;}
  .ColorListReport {width:100%;margin:2em auto auto;float:left;padding:1%;background:#874398;}
  .ColorListReport-result {margin:auto auto auto 1%;width:48%;float:left;background:#743484;color:#ffffff;padding:0.5%;border-radius:6px;}
  .ColorListReport-result img     {width:auto;margin:auto;float:left;}
  .ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
  .ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
  .ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
  .PromoterProfileName {font-size:13px;}
.PromoterProfilePicture {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
.PromoterProfilePicture-child {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture-child img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
  .PromoterGuestClient {float:left;width:16%;padding:5px;margin:0.2%;border:1px solid #aaa;background:none;}
  .PromoterGuestClient:hover {background:#eceaea;}
  .PromoterGuestClient:focus {background:#eceaea;}
  .PromoterGuestClient p {margin:0;text-align:center;font-size:1em;line-height:23px;height:75px;}
  .PromoterGuestClient span {color:#1398cb;font-weight:bold;float:left;width:100%;margin:auto auto 5px;height:35px;line-height:17px;}
  .ColorListReport {width:100%;margin:2em auto auto;float:left;padding:1%;background:#874398;}
  .ColorListReport-result         {margin:auto auto auto 1%;width:19%;float:left;background:#743484;color:#ffffff;padding:0.5%;border-radius:6px;}
  .ColorListReport-result img     {width:auto;margin:auto;float:left;}
  .ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
  .ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
  .ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .PromoterProfileName {font-size:13px;}
.PromoterProfilePicture {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
.PromoterProfilePicture-child {margin:auto;float:none;text-align:center;border:0;width:60px;height:60px;}
.PromoterProfilePicture-child img {float:left;padding:0.5%;background:#434058;border-radius:65px;}
  .PromoterGuestClient {float:left;width:16%;padding:5px;margin:0.2%;border:1px solid #aaa;background:none;}
  .PromoterGuestClient:hover {background:#eceaea;}
  .PromoterGuestClient:focus {background:#eceaea;}
  .PromoterGuestClient p {margin:0;text-align:center;font-size:1em;line-height:23px;height:75px;}
  .PromoterGuestClient span {color:#1398cb;font-weight:bold;float:left;width:100%;margin:auto auto 5px;height:35px;line-height:17px;}
  .ColorListReport {width:100%;margin:2em auto auto;float:left;padding:1%;background:#874398;}
  .ColorListReport-result {margin:auto auto auto 1%;width:19%;float:left;background:#743484;color:#ffffff;padding:0.5%;border-radius:6px;}
  .ColorListReport-result img     {width:auto;margin:auto;float:left;}
  .ColorListReport-result div     {margin:auto;width:40%;float:right;text-align:center;}
  .ColorListReport-result div span{margin:0;font-size:0.9em;font-weight:normal;}
  .ColorListReport-result div em  {color:#fdb221;margin:0;font-style:normal;font-size:1.4em;font-weight:bold;}
}