.beacon-cta * {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}


.modalBg { z-index: 9999999998; }

.BEACON-modalWindow { font: 18px Arial; height: auto; background: #fff; color: #666; padding: 7% 5%; border-radius: 5px; width: 100%; max-width: 700px; z-index: 9999999999; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.BEACON-modalWindow a.BEACON-close { position:absolute; top:10px; right:10px; color: #666; text-decoration: none; font-size: 80%; font-weight: normal; opacity: 0.5;}
.BEACON-modalWindow a.BEACON-close:hover { text-decoration: underline; opacity: 1;}
.BEACON-modalWindow h3 { font-size: 26px; line-height:30px; text-align: left; color: #666; font-weight: normal; margin-bottom: 20px;}

.BEACON-modalWindow .BEACON-imgcol{float:left; width:25%; margin:4% 7% 0 2%; text-align: center; padding: 0;}
.BEACON-modalWindow .BEACON-imgcol img{max-width:100%; margin: auto;}
.BEACON-modalWindow .BEACON-formcol{float:left; width:59%; margin-left: 6%; padding:0; border-bottom-right-radius: 5px; border-top-right-radius: 5px; display: table-cell;}
.BEACON-modalWindow .BEACON-formcol.no-img{ width: 88%; }

.BEACON-modalWindow .BEACON-row { display: block; clear: both; width: 100%; margin: auto auto 1em auto;  }
.BEACON-modalWindow .BEACON-row:last-child{margin-bottom: 0;}
.BEACON-modalWindow .BEACON-row label { display: block; clear: both; color:#666; font-weight: normal;}
.BEACON-modalWindow .BEACON-row .checkbox { }
.BEACON-modalWindow .BEACON-row .checkbox label { display: inline-block; width: auto; max-width: auto; }
.BEACON-modalWindow .BEACON-row .checkbox input { display: inline-block; width: auto; max-width: auto; }
.BEACON-modalWindow .BEACON-row input { display: block; clear: both; width: 100%; padding: 5px; border: 1px solid #aaa; border-radius: 0; }
.BEACON-modalWindow button { display: block; border: none; background: #2396F6; color: #fff; padding: 0.5em 1em; border-radius: 0; border-bottom:3px solid #2E84CA; border-radius: 3px; font-weight: normal; font-size: 100%;}

.BEACON-modalWindow button:hover { cursor: pointer; background: #2E84CA; }

.text { display: inline-block; width: 65%; margin-left: 10%; vertical-align: middle; position: absolute; top: 40%; }
.text p{margin:0;}
.book { display: inline-block; box-shadow: 5px 5px 20px #333; margin: 0 0 0 5%; max-width: 100%; width: 20%; }
.book img { display: inline-block; max-width: 200px; }
.csstransforms3d  .books { -moz-perspective: 100px; -moz-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; }

.beacon-cta { position: relative; padding-bottom: 2em !important; min-height: 8em; }
.beacon-cta.hide-thumb .book { display: none; }
.beacon-cta.hide-thumb .text { width: 97%; margin-left: 0; }

.BEACON-imgcol .book { width: 350px; vertical-align: middle; }

.csstransforms3d  .book { position: relative; -moz-perspective: 100px; -moz-transform: rotateY(-3deg); -webkit-transform: perspective(100) rotateY(-2deg); outline: 1px solid transparent; /* Helps smooth jagged edges in Firefox */ box-shadow: none; margin: 0; }

.csstransforms3d  .book img { position: relative; max-width: 100%; }

.csstransforms3d  .book:before,
.csstransforms3d  .book:after { position: absolute; top: 2%; height: 96%; content: ' '; z-index: -1; }

.csstransforms3d  .book:before { width: 100%; left: 7.5%; background-color: #333; box-shadow: 5px 5px 20px #333; }

.csstransforms3d  .book:after { width: 5%; left: 100%; background-color: #EFEFEF; box-shadow: inset 0px 0px 5px #aaa; -moz-transform: rotateY(20deg); -webkit-transform: perspective(100) rotateY(20deg); }


@media (min-width:768px) and (max-width: 992px) {
.BEACON-modalWindow{  width: 65%; }
}

@media (max-width: 767px) {
.BEACON-modalWindow{ width: 90%; }
.BEACON-modalWindow .BEACON-imgcol{width:30%; margin: 0 35%; text-align: center; padding: 0;}
.BEACON-modalWindow .BEACON-imgcol img{max-width:100%; margin: auto;}
.BEACON-modalWindow .BEACON-formcol{width:90%; margin-left: 5%;}
.BEACON-modalWindow .BEACON-formcol{width:90%; margin-left: 5%;}
.BEACON-modalWindow h3{text-align: center; margin-top: 1em;}
}



.beacon-cta { font: 16px Arial; margin: 1em auto; display: block; width: 100%; background: #FFEFD5; border: 1px solid orange; padding: 1em; color: #333; }
.beacon-wrap { display: flex; 
  flex-flow: row wrap;
  justify-content: space-around;
}

.beacon-wrap {
  padding: 0;
  margin: 0;
  list-style: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
}

.beacon-item {
  background: tomato;
  padding: 5px;
  width: 200px;
  height: 150px;
  margin-top: 10px;
  
  line-height: 150px;
  color: white;
  font-weight: bold;
  font-size: 3em;
  text-align: center;
}