/* Font style */

/* Defaults */
/* Button style */
/* HTML Style */
*:focus {
  outline: none;
}
body {
  background-image: url(background.png);
	font-family: 'Signika', sans-serif; font-weight: 400;
  -webkit-font-smoothing: antialiased;
  font-size: 14px;
}
h1 {
  margin-top: 10px;
  margin-bottom: 10px;
  color: #666;
  font-size: 30px;
  font-family: 'Overlock', sans-serif; font-weight: 900;
  text-align: center;  
}

h2 {
  margin-bottom: 30px;
  margin-top: 5px;
  font-size: 30px;
  font-family: 'Overlock', sans-serif; font-weight: 700;
  color: #666;
  -webkit-font-smoothing: antialiased;
  text-align: center;
}

h3 {
  font-size: 30px;
  font-weight: bold;
  color: #4d5258;
}

ul li {
  list-style: disc;
  margin-left: 30px;
  margin-top: 5px;
}

#container {
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.25);
  background-color: #fff;
  width: 944px;
  margin: auto;
  overflow: hidden;
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 30px;
}

@media screen and (max-device-width: 1024px) {
  #container {
    padding-left: 4%;
    padding-right: 4%;
    margin-left: 1%;
    margin-right: 1%;
    float: left;
    width: 90%;
  }
}

@media screen and (max-device-width: 1024px) {
  .button {
    background-position: 0 -31px;
  }
  .button a {
    background-position: right -31px;
    padding-top: 4px;
  }
}


@media screen and (max-device-width: 1024px) {
  .video {
    width: 98%;
  }
}

.reasons {
  margin-top: 0px;
  margin-left: 30px;
  overflow: hidden;
}
.reason {
  max-width: 470px;
  margin-bottom: 10px;
  float: left;
}
.reason_image {
  float: left;
}
.reason_text {
  margin-left: 19px;
  float: left;
  width: 300px;
}
@media screen and (max-device-width: 568px) {
  .reason_image {
    width: 25%;
  }
  .reason_image img {
    width: 100%;
  }
  .reason_text {
    width: 65%;
  }
}
.reason_title {
  font-weight: bold;
  font-size: 18px;
  color: #4d5258;
  float: left;
}
.reason_content {
  margin-top: 15px;
  font-size: 13px;
  color: #888e94;
  float: left;
  clear: both;
}

#showcases {
  background-repeat: no-repeat;
  background-image: url(slide_bg.png);
  background-position: 0 228px;
  background-size: 100% auto;
}
#showcases {
  padding-left: 6px;
  overflow: hidden;
}
.showcase_image img {
  width: 200px;
  height: auto;
  float: left;
}
.showcase_content {
  margin-top: 97px;
  float: left;
  width: 464px;
}
.showcase_content h3 {
  float: left;
}
.showcase_content .button {
  float: left;
  margin-left: 40px;
  margin-top: 5px;
}
.showcase_content .showcase_intro {
  margin-top: 30px;
  font-size: 16px;
  color: #888e94;
  clear: both;
  float: left;
}
.showcase_content .showcase_text {
  font-family: 'Adelle';
  font-style: italic;
  font-size: 16px;
  margin-top: 75px;
  color: #ffffff;
  float: left;
}
@media screen and (max-device-width: 1024px) {
  #showcases {
    background: none;
    float: left;
    width: 100%;
    overflow: hidden;
    padding-bottom: 30px;
  }
  .showcase_image {
    display: none;
  }
  .showcase_content .showcase_text {
    background-repeat: no-repeat;
    background-image: url(slide_bg.png);
    background-size: 100% 100%;
    padding: 5%;
    width: 90%;
    height: auto;
    float: left;
    margin-top: 20px ;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
  }
  .showcase_content {
    margin-top: 0;
    float: left;
    width: 100%;
  }
}

#menu {
  text-decoration: center;
  margin: 10px 0 10px 0;
  padding: 3px;
  text-align: center;
  color: #9e9e9e;
  border-bottom: 1px solid #9e9e9e;
}

#menu a {
  text-decoration: none;
  font-size: 13px;
  color: #9e9e9e;
}

#menu a:hover {
  color: #1881e2;
}

#legal {
  text-decoration: center;
  margin: 10px 0 10px 0;
  padding: 3px;
  text-align: center;
  color: #9e9e9e;
  border-top: 1px solid #9e9e9e;
}

#legal a {
  text-decoration: none;
  font-size: 13px;
  color: #9e9e9e;
}

#legal a:hover {
  color: #1881e2;
}

/* AJAX Overlay */
.loading-overlay {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  background-color: #fff;
  opacity: 0;
  -moz-transition-property: opacity;
  -moz-transition-duration: 2s;
  -webkit-transition-property: opacity;
  -webkit-transition-duration: 2s;
  -o-transition-property: opacity;
  -o-transition-duration: 2s;
  transition-property: opacity;
  transition-duration: 2s;
  height: 0px;
}
.loading-overlay.active {
  opacity: 0.6;
}
/* ANIMATION */
.animated {
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -ms-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
}
.animated.hinge {
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -ms-animation-duration: 2s;
  -o-animation-duration: 2s;
  animation-duration: 2s;
}
@-webkit-keyframes shake {
  0%,
  100% {
    -webkit-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translateX(10px);
  }
}
@-moz-keyframes shake {
  0%,
  100% {
    -moz-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    -moz-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
    -moz-transform: translateX(10px);
  }
}
@-o-keyframes shake {
  0%,
  100% {
    -o-transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    -o-transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
    -o-transform: translateX(10px);
  }
}
@keyframes shake {
  0%,
  100% {
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translateX(-10px);
  }
  20%,
  40%,
  60%,
  80% {
    transform: translateX(10px);
  }
}
.shake {
  -webkit-animation-name: shake;
  -moz-animation-name: shake;
  -o-animation-name: shake;
  animation-name: shake;
}
.bubblingG {
  opacity: 0;
  -moz-transition-property: opacity;
  -moz-transition-duration: 2s;
  -webkit-transition-property: opacity;
  -webkit-transition-duration: 2s;
  -o-transition-property: opacity;
  -o-transition-duration: 2s;
  transition-property: opacity;
  transition-duration: 2s;
  margin: auto;
  text-align: center;
  width: 80px;
  height: 50px;
}
.bubblingG span {
  display: inline-block;
  vertical-align: middle;
  width: 10px;
  height: 10px;
  margin: 25px auto;
  background: #0e73d9;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -ms-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
  -webkit-animation: bubblingG 1.1s infinite alternate;
  -moz-animation: bubblingG 1.1s infinite alternate;
  -ms-animation: bubblingG 1.1s infinite alternate;
  -o-animation: bubblingG 1.1s infinite alternate;
}
#bubblingG_1 {
  -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  -ms-animation-delay: 0s;
  -o-animation-delay: 0s;
}
#bubblingG_2 {
  -webkit-animation-delay: 0.33s;
  -moz-animation-delay: 0.33s;
  -ms-animation-delay: 0.33s;
  -o-animation-delay: 0.33s;
}
#bubblingG_3 {
  -webkit-animation-delay: 0.66s;
  -moz-animation-delay: 0.66s;
  -ms-animation-delay: 0.66s;
  -o-animation-delay: 0.66s;
}
@-webkit-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #0e73d9;
    -webkit-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFFFFF;
    -webkit-transform: translateY(-21px);
  }
}
@-moz-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #0e73d9;
    -moz-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFFFFF;
    -moz-transform: translateY(-21px);
  }
}
@-ms-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #0e73d9;
    -ms-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFFFFF;
    -ms-transform: translateY(-21px);
  }
}
@-o-keyframes bubblingG {
  0% {
    width: 10px;
    height: 10px;
    background-color: #0e73d9;
    -o-transform: translateY(0);
  }
  100% {
    width: 24px;
    height: 24px;
    background-color: #FFFFFF;
    -o-transform: translateY(-21px);
  }
}
.quote {
  text-align: center;
  font-family: 'Overlock';
  font-size: 24px;
  font-style: italic;
  color: #7c8895;
  height: 80px;
  margin-top: 5px;
  margin-bottom: 5px;
}

h4 {
  margin-top: 5px;
  text-align: center;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: #404952;
  width: 100%;
}


#buynow2 {
    text-align:center;
}

.bookblock { 
    display: inline-block;
    zoom: 1;
    display*: inline; /* ie hack */
    width: 33%;
    float: left;
}


#howtoorder2 { 
    display: inline-block;
    zoom: 1;
    display*: inline; /* ie hack */
    width: 50%;
    clear: both;
	margin: 30px 0 20px 0;
	font-size: 13px;
	font-weight: 300;
	color: #888e94;
	line-height: 125%;    
}

#buynow {
	width: 650px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

#howtoorder {
	clear: both;
	margin: 30px 0 20px 0;
	font-size: 13px;
	font-weight: 300;
	color: #888e94;
	line-height: 125%;
}

#bookcover
{
	float: left;
	margin: 0 30px 0 0;
}

.bookstore
{
	float: left;
	margin: 10px;
}

.acell {
    display:table-cell;
    padding: 15px;
    vertical-align: middle;
}


.arow {
    display:table-row-group;
}
