html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  cursor: default; }

article, aside, figure, footer, header, hgroup, nav, section {
  display: block; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  color: inherit;
  text-decoration: inherit; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted black;
  cursor: help; }

.zoomable, .zoomable * {
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: -ms-zoom-in;
  cursor: -o-zoom-in;
  cursor: zoom-in; }

.lightbox, .lightbox * {
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
  cursor: -ms-zoom-out;
  cursor: -o-zoom-out;
  cursor: zoom-out; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

th {
  font-weight: bold;
  vertical-align: bottom; }

td {
  font-weight: normal;
  vertical-align: top; }

hr {
  display: block;
  height: 1px;
  border: 0;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

pre {
  white-space: pre;
  white-space: pre-wrap;
  white-space: pre-line;
  word-wrap: break-word; }

input[type="radio"] {
  vertical-align: text-bottom; }

input[type="checkbox"] {
  vertical-align: bottom;
  *vertical-align: baseline; }

.ie6 input {
  vertical-align: text-bottom; }

select, input, textarea {
  font: 99% sans-serif; }

table {
  font-size: inherit;
  font: 100%; }

a:hover, a:active {
  outline: none; }

small {
  font-size: 85%; }

strong, th {
  font-weight: bold; }

td, td img {
  vertical-align: top; }

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

pre, code, kbd, samp {
  font-family: monospace, sans-serif; }

input {
  cursor: auto; }

textarea {
  cursor: text; }

a, a *, .clickable, label, input[type=button], input[type=submit], input[type=reset], button, #nextPage, #previousPage, #nextPage *, #previousPage * {
  cursor: pointer; }

button, input, select, textarea {
  margin: 0; }

button {
  width: auto;
  overflow: visible; }

.ie7 img {
  -ms-interpolation-mode: bicubic; }

.ie6 html {
  filter: expression(document.execCommand("BackgroundImageCache", false, true)); }

.clearfix:before, .clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden; }

.clearfix:after {
  clear: both; }

.clearfix {
  zoom: 1; }

ins {
  background-color: #fcd700;
  color: black;
  text-decoration: none; }

mark {
  background-color: #fcd700;
  color: black;
  font-style: italic;
  font-weight: bold; }

/* ==========================================================================
	PAGES

	Styles related to the grids/layouts in the app.

	This is currently acting as a catch-all for grid-related styles that
	haven't found a permanent home.

	These styles should mostly be moved into layout specific styles
	eventually, but are used throughout the test data, so we'll move them as
	it makes sense to do so.
   ========================================================================== */
.grid {
  margin: 18px;
  padding: 0 32px;
  background: white; }

.container img,
.container video,
.column h1, .column h2, .column h3, .column h4, .column h5, .column h6, .column h7,
.container h1, .container h2, .container h3, .container h4, .container h5, .container h6, .container h7 {
  padding-left: 20px; }

.container hgroup {
  padding-bottom: 10px; }

.iphone .container hgroup {
  padding-bottom: 15px; }

p {
  padding-left: 20px;
  color: #333333;
  text-indent: 24px;
  text-align: justify; }
  p.noindent, p.caption, .keeptogether p {
    text-indent: 0; }
  p.caption {
    text-align: left; }
    .lightbox p.caption {
      color: #fff; }

.iphone .container img, .iphone .container hgroup, .iphone .column h1, .iphone .column h2, .iphone .column h3, .iphone .column h4, .iphone .column h5, .iphone .column h6, .iphone .column h7 {
  padding-left: 0; }

.iphone .column h4 {
  padding-left: 20px; }

.os-iphone grid.fixed.iphone.vertical {
  padding-left: 0;
  margin-right: 18px; }

.bgclear {
  background-color: transparent; }

h1, h2, h3, h4, h5, h6 {
  font-family: sans-serif;
  font-weight: bold; }

h1 {
  font-family: sans-serif;
  font-size: 24px;
  line-height: 1em; }

p.caption {
  line-height: 1.2em;
  font-size: 90%;
  text-indent: 0; }

p.introduction:first-letter {
  font-size: 460%;
  font-weight: bold;
  font-family: serif;
  float: left;
  line-height: 0.95em;
  margin-right: -0.3em;
  margin-bottom: -0.2em;
  width: 1em;
  color: #c5e113; }

.hyperlink {
  color: #2561b1; }

a {
  color: #2561b1; }

.grid.iphone.vertical.page-1 .wrapper {
  height: 365px;
  margin: 21px 0px 0px;
  padding: 0 10px;
  position: relative; }

.grid.iphone.horizontal.page-1 .wrapper {
  height: 217px;
  margin: 21px 0px 0px;
  padding: 0 10px;
  position: relative; }

.grid.ipad.vertical.page-1 .wrapper {
  height: 872px;
  margin: 21px 0px 0px;
  padding: 0 10px;
  position: relative; }

.grid.ipad.horizontal.page-1 .wrapper {
  height: 619px;
  margin: 21px 0px 0px;
  padding: 0 10px;
  position: relative; }

.no-mobile .grid .wrapper {
  height: 92%;
  /*margin-top: 5%;*/
  position: relative; }

.grid img {
  max-width: 100%; }

.grid .fLeft {
  float: left; }

.grid .fRight {
  float: right; }

.grid .bold {
  font-weight: bold; }

.grid .italic {
  font-style: italic; }

.grid .underline {
  text-decoration-line: underline; }


/* CSS */

.index.page-1 {
  background: #fff url("http://read.nxtbook.com/best-of/ubiquity/vol1/index/bg.jpg") center center no-repeat;
  background-size: cover;
}

.index.page-1 .column {
  position: absolute;
  left:-100%;
}

.index.page-1 .tableSim {
  display: table;
  height: 100%;
  width: 100%;
}

.index.page-1 .tableRowSim {
  display: table-row;
  width: 100%;
}

.index.page-1 .tableCellSim {
  display: table-cell;
  vertical-align: bottom;
  align: left;
  padding-bottom: 10px;
}

.index.page-1 .responsivetext {
  display:block;
  position:absolute;
  bottom:90px;
  width:auto;
  height:auto;
  left:40px;
}
.index.page-1 .responsivetext h1 {
  font:500% "stencil-std",sans-serif;
  color:#922a07;
  -webkit-transform: rotate(-30deg);
  -moz-transform: rotate(-30deg);
  -ms-transform: rotate(-30deg);
  -o-transform: rotate(-30deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 
  opacity:0.6;
 	-webkit-transition: all 2s ease-in-out;
  -moz-transition: all 2s ease-in-out;
  -o-transition: all 2s ease-in-out;
  transition: all 2s ease-in-out;  
}

.index.page-1 .responsivetext h1:hover {
  opacity:1
}
  

.index.page-1 .cutelogo {
  display:block;
  position:absolute;
  top:65%;
  left:47%;
  width:70%;
  margin:0;
}

.index.page-1 .cutelogo img {
 width:100%;
 max-width:362px;
 }

.index.page-1 .cutelogo2 {
  display:block;
  position:absolute;
  top:80%;
  left:5%;
  width:90%;
  margin:0}
  }
.index.page-1 .cutelogo2 img {
 width:100%
 }

.index.page-1 .mainlogo {
  display:block;
  position:absolute;
  top:10%;
  width:70%;
  left:50%;
  margin:0 0 0 -35%;
  z-index:9999
  }
  
.index.page-1 .waves {
	background:url("http://read.nxtbook.com/best-of/ubiquity/vol1/index/waves.png") repeat-x;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	width:200%;
	height:320px
}

.index.page-1 .waves2 {
	background:url("http://read.nxtbook.com/best-of/ubiquity/vol1/index/waves2.png") repeat-x;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	width:200%;
	height:220px
}

.index.page-1 .mainlogo img {
  width:100%
  } 

.index.page-1 .mainlogo2 {
  display:block;
  position:absolute;
  top:10%;
  width:90%;
  left:5%;
  margin:0% 
  }
.index.page-1 .mainlogo2 img {
  width:100%
  } 
.index.page-1 .stuff {
  display:block;
  width:60%;
  height:auto
  } 
/****** FIRST CREATE THE BUBBLE *****/
.index.page-1 p.thought {
position:relative; /*see the support section below for more info*/
width:200px; /*size of the bubble*/
padding:20px 40px;
margin:10px 10px 80px 40px;
/**give the bubble's background a gradient**/
background:#fff; /*fallback colour for non-supporting browsers*/
background:-webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#e0f1fc));
background:-moz-linear-gradient(#fff, #e0f1fc);
background:-o-linear-gradient(#fff, #e0f1fc);
background:linear-gradient(#fff, #e0f1fc);
/**give the corners a large curve**/
-webkit-border-radius:25px;
-moz-border-radius:25px;
border-radius:25px;
/**style the text**/
color:#000;
font-size:1em;
letter-spacing:.06em;

		-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}
/******NOW CREATE THE THOUGHT CIRCLES*****/
/****FIRST THE LARGE CIRCLE***/
.index.page-1 p.thought:before {
content:"";
position:absolute; /*see the support section below for more info*/
bottom:-40px; /*distance from the bottom of the bubble*/
left:20px; /*distance from the left edge of the bubble*/
background:#fff;
width:30px; /*same as the height*/
height:30px; /*same as the width*/
/*add a curve to the corners the same size as the height and width*/
-webkit-border-radius:30px;
-moz-border-radius:30px;
border-radius:30px;

		-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}
/*****NOW THE SMALL CIRCLE***/
/**Created exactly the same way as the large circle, except with smaller width, height and border-radius**/
.index.page-1 p.thought:after {
content:"";
position:absolute;
bottom:-55px;
left:0;
width:15px;
height:15px;
background:#fff;
-webkit-border-radius:15px;
-moz-border-radius:15px;
border-radius:15px;

		-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}
 
/* Second Thought */
/****** FIRST CREATE THE BUBBLE *****/
.index.page-1 p.thought2 {
position:relative; /*see the support section below for more info*/
width:150px; /*size of the bubble*/
padding:20px 40px;
margin:10px 10px 80px 40px;
/**give the bubble's background a gradient**/
background:#fff; /*fallback colour for non-supporting browsers*/
background:-webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#e0f1fc));
background:-moz-linear-gradient(#fff, #e0f1fc);
background:-o-linear-gradient(#fff, #e0f1fc);
background:linear-gradient(#fff, #e0f1fc);
/**give the corners a large curve**/
-webkit-border-radius:25px;
-moz-border-radius:25px;
border-radius:25px;
/**style the text**/
color:#000;
font-size:.8em;
letter-spacing:.06em;

		-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}
  

.index.page-1 p {
  padding:0;
  text-indent: 0;
}

.index.page-1 h1 {
  color: #fff;
  margin:30px auto;
  font-size: 34px;
}

.index.page-1 ul {
  list-style: none;
  display: inline-block;
  text-align: center;
}

.index.page-1 ul li {
  color: #fff;
  float: left;
  padding: 0 5px;
  border-left:1px solid #fff;
}

.index.page-1 ul li:first-of-type {
  border: none;
}

.index.page-1.w1 ul li, .index.page-1.iphone ul li {
  float: none;
  border: none;
}

.index.page-1 a {
  color: #fff;
}

.index.page-1 p {
  text-align: center;
}.index .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;
    animation-delay:1s;
	-moz-animation-delay:1s;
	-webkit-animation-delay:1s;
}

.index .animated.hinge {
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-ms-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}

.index .animated2 {
	-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;
    animation-delay:2s;
	-moz-animation-delay:2s;
	-webkit-animation-delay:2s;
}

.index .animated2.hinge {
	-webkit-animation-duration: 2s;
	-moz-animation-duration: 2s;
	-ms-animation-duration: 2s;
	-o-animation-duration: 2s;
	animation-duration: 2s;
}    

.index .animated3 {
	-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:wave1 100s linear infinite;
	-moz-animation:wave1 100s linear infinite;
	-o-animation:wave1 100s linear infinite;
	-webkit-transform:translate3d(0,0,0);
	-moz-transform:translate3d(0,0,0);
	-o-transform:translate3d(0,0,0);    
}
@-webkit-keyframes wave1 {
	0% {left:0}
	100% {left:-100%}
}     
@-moz-keyframes wave1 {
	0% {left:0}
	100% {left:-100%}
}          

.index .animated4 {
	-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:wave1 90s linear infinite;
	-moz-animation:wave1 90s linear infinite;
	-o-animation:wave1 90s linear infinite;
	-webkit-transform:translate3d(0,0,0);
	-moz-transform:translate3d(0,0,0);
	-o-transform:translate3d(0,0,0);    
}
@-webkit-keyframes wave2 {
	0% {left:0}
	100% {left:-100%}
}     
@-moz-keyframes wave2 {
	0% {left:0}
	100% {left:-100%}
}                 
@-webkit-keyframes swing {
	20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
	20% { -webkit-transform: rotate(15deg); }	
	40% { -webkit-transform: rotate(-10deg); }
	60% { -webkit-transform: rotate(5deg); }	
	80% { -webkit-transform: rotate(-5deg); }	
	100% { -webkit-transform: rotate(0deg); }
}

@-moz-keyframes swing {
	20% { -moz-transform: rotate(15deg); }	
	40% { -moz-transform: rotate(-10deg); }
	60% { -moz-transform: rotate(5deg); }	
	80% { -moz-transform: rotate(-5deg); }	
	100% { -moz-transform: rotate(0deg); }
}

@-o-keyframes swing {
	20% { -o-transform: rotate(15deg); }	
	40% { -o-transform: rotate(-10deg); }
	60% { -o-transform: rotate(5deg); }	
	80% { -o-transform: rotate(-5deg); }	
	100% { -o-transform: rotate(0deg); }
}

@keyframes swing {
	20% { transform: rotate(15deg); }	
	40% { transform: rotate(-10deg); }
	60% { transform: rotate(5deg); }	
	80% { transform: rotate(-5deg); }	
	100% { transform: rotate(0deg); }
}

.index .swing {
	-webkit-transform-origin: top center;
	-moz-transform-origin: top center;
	-o-transform-origin: top center;
	transform-origin: top center;
	-webkit-animation-name: swing;
	-moz-animation-name: swing;
	-o-animation-name: swing;
	animation-name: swing;
}
                                      
@-webkit-keyframes rollIn {
	0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }
}

@-moz-keyframes rollIn {
	0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }
}

@-o-keyframes rollIn {
	0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }
}

@keyframes rollIn {
	0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; transform: translateX(0px) rotate(0deg); }
}

.index .rollIn {
	-webkit-animation-name: rollIn;
	-moz-animation-name: rollIn;
	-o-animation-name: rollIn;
	animation-name: rollIn;
}                                              

@-webkit-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-o-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

.index .fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
}
                                                  
                                                  @-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;
} /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.howtouse {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .howtouse.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/iphone_port_about.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .howtouse.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/ipad_port_about.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .howtouse.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/iphone_port_about.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .howtouse.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/iphone_land_about.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .howtouse.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/ipad_land_about.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .howtouse.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/ipad_land_about.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.howtouse.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/iphone_port_about.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.howtouse.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/iphone_land_about.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.howtouse.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/ipad_port_about.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.howtouse.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/howtouse/ipad_land_about.png") center center no-repeat;}
 /* CSS *//*General Styles*/
.toc.grid {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/toc/bkg.jpg") top left no-repeat;
  background-size: cover}

.toc p {
  	text-indent: 0;
  	text-align: left;
	padding-bottom: 1em;
	color: #333;
    padding:0;
    margin:0}
	
.toc h2:first-child {
	color:#0067c3;
	font:160%% 'Carme', sans-serif;;
	font-weight:normal;
	text-transform:lowercase;
	padding:0;
	margin:15px 0 0 20px
}
	
.toc h2 {
	color:#0067c3;
	font:160%% 'Carme', sans-serif;;
	font-weight:normal;
	text-transform:lowercase;
	padding:0;
	margin:40px 0 0 20px
}
	
.toc h3.titles {
	color:#fff;
	font:160%% 'Carme', sans-serif;;
	font-weight:normal;
	text-transform:lowercase;
	padding:7px 0 7px 15px;
	margin:-14px 0 20px 35px;
	background:url("http://read.nxtbook.com/best-of/ubiquity/vol1/toc/blu.png") repeat;
	border-radius:30px
}

.toc .arrow {
	position:relative;
	top:15px;
	width:0px;
	height:0px;
	border-bottom:20px solid transparent;
	border-top:20px solid transparent;
	border-left:20px solid #5d965c;
	font-size:0px;
	line-height:0px
}

.toc .logostyle {
	position:absolute;
	top:0;
	margin:-40px 0 0 -10px
}

.toc .logoimg {
	margin:0 0 0 -36px
}

.toc .logoimg_i {
	margin:0 0 0 -10px
}

.toc .logodouble {
	position:absolute;
	top:0;
	margin:-40px 0 0 -36px
}

.toc .i_movemast {
	margin:-40px 0 0 0
}

.toc .moveit {
	padding:0 0 0 10px
}

.toc .moveit_i {
	padding:0 0 0 18px
}

.toc .moveitdown {
	margin:20px 0 0 0
}

.toc .moveitover {
	margin:0 0 0 -15px
}

.toc .morecool {
	display:block;
	margin:-40px 0 0 30px
}

.toc .feature {
	display:block;
	float:left;
	width:267px;
	height:329px;
	margin:0 10px 50px 5px
}

.toc .feature:last-child {
	display:block;
	float:left;
	width:267px;
	height:329px;
	margin:0 10px 5px 5px
}

.toc .feature img {
	float:left;
	border:0;
	padding:5px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
	behavior:url("http://read.nxtbook.com/best-of/ubiquity/vol1/toc/border-radius.htc");
	border:10px solid #eef8c8;
}

.toc .feature img:hover {
	border:10px solid #30b7b7;
	background:#8ee2a2 
}

.toc .rounded-list ol li {
	color:#ddd;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;    
}

.toc .rounded-list ol li:hover {
	color:#eee
}
    
.toc .rounded-list a {
	position: relative;
	display: block;
	padding: .4em .4em .4em 2em;
	*padding: .4em;
	margin: .5em 0;
	background: #ddd;
	color: #444;
	text-decoration: none;
	-moz-border-radius: .3em;
	-webkit-border-radius: .3em;
	border-radius: .3em;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;	
}

.toc .rounded-list a:hover {
	background: #eee;
}

.toc .rounded-list a:hover:before {
	-moz-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
 	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);	
}

.toc .rounded-list a:before {
	content: counter(li);
	counter-increment: li;
	position: absolute;	
	left: -1.3em;
	top: 50%;
	margin-top: -1.3em;
	background: #87ceeb;
	color: #87ceeb;
	height: 2em;
	width: 2em;
	line-height: 2em;
	border: .3em solid #fff;
	text-align: center;
	font-weight: bold;
	-moz-border-radius: 2em;
	-webkit-border-radius: 2em;
	border-radius: 2em;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}

.toc .mainlist ul li {
	padding:0;
    margin:0 0 5px 10px;
    list-style-type:none;
    font: 110% 'Rationale', sans-serif;
    font-weight:100
}
	
.toc .mainlist li a:link, .toc .mainlist li a:active, .toc .mainlist li a:visited {
  color:#4163ba;
  display:block;
  padding:0 0 0 10px;
  margin:0 0 0 -10px
}

.toc .mainlist li a:hover {
  background:#fff
}

.toc .buttons {
    display:block;
    margin:0 auto;
    width:150px
}

.toc button, a.button {
	border: 1px solid rgba(0,0,0,0.3);
	background: #eee;
	color: #515151;
	display: inline-block;
	font-size: 24px;
	font-weight: 700;
	padding: 21px 34px;
	margin:0 20px 0 0;
	position: relative;
	text-decoration: none;
	background: -webkit-gradient(linear, left bottom, left top, color-stop(0.21, rgb(203,203,203)), color-stop(0.58, rgb(227,226,226)));
	background: -moz-linear-gradient(center bottom, rgb(203,203,203) 21%, rgb(227,226,226) 58%);
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 1px 0 0 rgba(255,255,255,0.5), inset 0 -3px 0 0 rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 1px 0 0 rgba(255,255,255,0.5), inset 0 -3px 0 0 rgba(0,0,0,0.5);
	box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 1px 0 0 rgba(255,255,255,0.5), inset 0 -3px 0 0 rgba(0,0,0,0.5);
	text-shadow: 0 1px rgba(255,255,255,0.6);
}

.toc button::-moz-focus-inner, a.button::-moz-focus-inner {
	padding:0;
	border:0;
}

.toc button:hover, a.button:hover {
	background: #cbcbcb;
	cursor: pointer;
}

.toc button:active, a.button:active {
	background: #ccc;
	padding: 22px 34px 20px;
	-moz-box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 -1px 0 0 rgba(255,255,255,0.5), inset 0 2px 5px 0 rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 -1px 0 0 rgba(255,255,255,0.5), inset 0 2px 5px 0 rgba(0,0,0,0.2);
	box-shadow: 0 0 0 5px rgba(255,255,255,0.3), inset 0 -1px 0 0 rgba(255,255,255,0.5), inset 0 2px 5px 0 rgba(0,0,0,0.2);
	text-shadow: none;
}

.toc a.smaller {
	font-size: 12px;
	margin: 18px 0px;
	padding: 10px 14px;
}

.toc a.smaller:active {
	padding: 11px 14px 9px;
}
  
.toc .myWrapper {
	top:0;
	position:absolute;
    }

.toc .oval-speech {
	position:relative;
	width:50%;
	padding:50px 60px 60px 60px;
	margin:1.5m auto 50px;
	text-align:center;
	color:#fff; 
	background:#5a8f00;
	/* css3 */
	background:-webkit-gradient(linear, 0 0, 0 100%, from(#b8db29), to(#5a8f00));
	background:-moz-linear-gradient(#b8db29, #5a8f00);
	background:-o-linear-gradient(#b8db29, #5a8f00);
	background:linear-gradient(#b8db29, #5a8f00);
	/*
	NOTES:
	-webkit-border-radius:220px 120px; // produces oval in safari 4 and chrome 4
	-webkit-border-radius:220px / 120px; // produces oval in chrome 4 (again!) but not supported in safari 4
	Not correct application of the current spec, therefore, using longhand to avoid future problems with webkit corrects this
	*/
	-webkit-border-top-left-radius:220px 120px;
	-webkit-border-top-right-radius:220px 120px;
	-webkit-border-bottom-right-radius:220px 120px;
	-webkit-border-bottom-left-radius:220px 120px;
	-moz-border-radius:220px / 120px;
	border-radius:220px / 120px;
}

.toc .oval-speech h2 {
	color:#0067c3;
	font:160%% 'Carme', sans-serif;;
	font-weight:normal;
	text-transform:lowercase;
	padding:0;
	margin:0;
	text-align:center
}

.toc .oval-speech p {font-size:1.25em;}

/* creates part of the curve */
.toc .oval-speech:before {
	content:"";
	position:absolute;
	z-index:-1;
	bottom:-30px;
	right:50%;
	height:30px;
	border-right:60px solid #5a8f00;
	background:#5a8f00; /* need this for webkit - bug in handling of border-radius */
	/* css3 */
	-webkit-border-bottom-right-radius:80px 50px;
	-moz-border-radius-bottomright:80px 50px;
	border-bottom-right-radius:80px 50px;
	/* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
	-webkit-transform:translate(0, -2px);
	-moz-transform:translate(0, -2px);
	-ms-transform:translate(0, -2px);
	-o-transform:translate(0, -2px);
	transform:translate(0, -2px);
}

/* creates part of the curved pointy bit */
.toc .oval-speech:after {
	content:"";
	position:absolute;
	z-index:-1;
	bottom:-30px;
	right:50%;
	width:60px;
	height:30px;
	background:#b7d14c;
	/* css3 */
	-webkit-border-bottom-right-radius:40px 50px; 
	-moz-border-radius-bottomright:40px 50px; 
	border-bottom-right-radius:40px 50px; 
	/* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
	-webkit-transform:translate(-30px, -2px);
	-moz-transform:translate(-30px, -2px);
	-ms-transform:translate(-30px, -2px);
	-o-transform:translate(-30px, -2px);
	transform:translate(-30px, -2px);
}

.toc .sidebar {
  position: absolute;
  background:url("http://read.nxtbook.com/best-of/ubiquity/vol1/toc/brick.png") repeat;
  height:100%;
  width:34px;
  top:0;
  left:0;
  z-index:3}

.toc .floatL {
  float:left;
  display:block;
  width:230px;
  margin:0 0 15px 50px}

.toc .floatR {
  float:right;}

.toc .clearB {
  clear:both;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.dynamiccovers {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .dynamiccovers.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .dynamiccovers.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .dynamiccovers.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .dynamiccovers.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .dynamiccovers.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .dynamiccovers.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.dynamiccovers.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.dynamiccovers.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.dynamiccovers.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.dynamiccovers.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dynamiccovers/ipad_land.png") center center no-repeat;}
 .dyn-cover1.w4, .dyn-cover1.w3 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dyn-cover1/bg4c.jpg") left top no-repeat;
  background-size: cover;}

.dyn-cover1.w2, .dyn-cover1.w1, .dyn-cover1.iphone {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dyn-cover1/bg2c.jpg") left top no-repeat;
  background-size: cover;}

.dyn-cover1 img {
	max-with: 100%;}

.dyn-cover1 .column {
  position: absolute;
  left: -100%;}

.dyn-cover1 p {
  text-align: left;
  text-indent: 0;
  padding: 0;
  line-height: normal;
  color: #fff;}

.dyn-cover1 .headerStripe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100px;
  width: 100%;
  background: rgba(0,0,0,.5);}

.dyn-cover1 .logo {
	position: relative;
	top: 5px;}

.dyn-cover1.w2 .logo {
	top: 15px;}

.dyn-cover1 .logo img {
	width: 405px;}

.dyn-cover1.w2 .logo img {
	width: 305px;}

.dyn-cover1 .sublogo {
	position: relative;
	top: 5px;
	left: 10px;
	font-family: 'Neuton', serif;
	font-style: italic;
	color: #fff;
	font-size: 22px;}

.dyn-cover1.w2 .sublogo {
	top: 10px;}

.dyn-cover1 .feature {
 	position: absolute;
  	top: 150px;
	right: 20px;
	color: #000;
	text-align: right;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;}

.dyn-cover1 .feature h1, .dyn-cover1 .featureW2 h1 {
  	font-family: 'Cinzel Decorative', cursive;
	font-weight: 900;
	color: #746163;
	font-size: 48px;}

.dyn-cover1.w1 .feature h1 {
	font-size: 36px;}

.dyn-cover1.iphone .feature h1 {
	font-size: 28px;}

.dyn-cover1 .feature h2, .dyn-cover1 .featureW2 h2 {
  	color: #746163;
  	font-size: 28px;
	margin-top: 10px;
	line-height: normal;}

.dyn-cover1.w1 .feature h2, .dyn-cover1.iphone .feature h2 {
	font-size: 20px;}

.dyn-cover1 .featureW2 h1, .dyn-cover1 .featureW2 h2 {
	color: #fff;}

.dyn-cover1 .featureW2 {
	padding-bottom: 40px;}

.dyn-cover1.iphone .featureW2 {
	padding-bottom: 25px;}

.dyn-cover1.w3 .feature {
	width: 380px;}

.dyn-cover1 .plus {
  	position: absolute;
  	right: 0;
  	bottom: 0;
	width: 100%;
    background-image: url("http://read.nxtbook.com/best-of/ubiquity/vol1/dyn-cover1/plusGradient.png");
  	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
	text-align: right;
	padding: 20px;
  	color: #fff;
	-webkit-animation-delay: .5s;
    -moz-animation-delay: .5s;
    -o-animation-delay: .5s;
    animation-delay: .5s;}

.dyn-cover1.iphone .plus {
	padding-bottom: 30px;
	width: 100%;
  	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
    background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));
  	background-image: linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.75));}

.dyn-cover1 .plus h1 {
  	font-size: 36px;}

.dyn-cover1.w1 .plus h1 {
  	font-size: 28px;}

.dyn-cover1 .plus h2 {
  	font-size: 28px;
	margin-top: 10px;
	line-height: normal;}

.dyn-cover1 .plus h2 a:link, .dyn-cover1 .plus h2 a:visited {
  	text-decoration:none;
    color:#fff}    

.dyn-cover1.iphone .plus h1 {
	font-size: 24px;}

/*.dyn-cover1.iphone.horizontal .plus h1.Hor {
  	color: red;
	font-size: 18px;}*/

.dyn-cover1.w1 .plus h2 {
	font-size: 20px;}

.dyn-cover1.iphone .plus h2 {
	font-size: 12px;}

/*.dyn-cover1.iphone.horizontal .plus h2.Hor {
  	color: red;
	font-size: 10px;}*/

.dyn-cover1 .lcciLogo {
	position: absolute;
	top: 10px;
	right: 20px;
	width: auto;}

/*.dyn-cover1.w2 .lcciLogo {
  	position: absolute;
  	right: 20px;
	bottom: 20px;}*/

.dyn-cover1 .lcciLogo img {
	height: 65px;}

.dyn-cover1.w2 .lcciLogo img {
	height: 55px;}

.dyn-cover1 .issueDate {
  	position: absolute;
  	right: 32px;
  	top: 62px;
	padding: 5px;}

.dyn-cover1 .issueDate h3 {
	color: #fff;
	text-align: right;
	font-size: 12px;
	font-family: 'Michroma', sans-serif;}

.dyn-cover1 .issueDate h3.month {
  	font-size: 18px;}

.dyn-cover1 .w2Stories {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	color: #fff;
	background: rgba(0,0,0,.5);
	padding: 20px;}

.dyn-cover1.iphone .headerStripe {
	height: 65px;}

.dyn-cover1.iphone.horizontal .headerStripe {
	height: 70px;}

.dyn-cover1.w1 .logo, .dyn-cover1.iphone .logo {
  left: -20px;}

.dyn-cover1.iphone .logo {
	left: 5px;
	top: 25px;}

.dyn-cover1.w1 .logo img, .dyn-cover1.iphone .logo img {
	width: 230px;}  

.dyn-cover1.iphone.vertical .logo img {
	width: 160px;}

.dyn-cover1.w1 .sublogo, .dyn-cover1.iphone .sublogo {
  	left: -15px;
  	top: 0;
	font-size: 18px;
	width: 230px;}  

.dyn-cover1.iphone .sublogo {
	left: 5px;
	width: 240px;
	top: 18px;
	font-size: 10px;}
  
.dyn-cover1.w1 .lcciLogo, .dyn-cover1.iphone .lcciLogo {
	position: absolute;
	top: 20px;
	right: 10px;
	width: auto;}

.dyn-cover1.iphone .lcciLogo {
	right: 0;
	top: 25px;}

.dyn-cover1.w1 .lcciLogo img, .dyn-cover1.iphone .lcciLogo img {
	height: 35px;}

.dyn-cover1.iphone .lcciLogo img {
	height: 25px;}
  
.dyn-cover1.w1 .issueDate, .dyn-cover1.iphone .issueDate {
  	position: absolute;
  	right: 10px;
  	top: 50px;
	padding: 5px;}

.dyn-cover1.iphone .issueDate {
	right: 0;
  	top: 45px;}

.dyn-cover1.w1 .issueDate h3 {
  	font-size: 10px;}

.dyn-cover1.iphone .issueDate h3 {
	font-size: 8px;}
  
.dyn-cover1.w2 .plus, .dyn-cover1.w1 .plus, .dyn-cover1.iphone .plus {
	-webkit-animation-delay: .5s;
    -moz-animation-delay: .5s;
    -o-animation-delay: .5s;
    animation-delay: .5s}

  /* CSS */
/*
Animate.css - http://daneden.me/animate
LICENSED UNDER THE  MIT LICENSE (MIT)

Copyright (c) 2012 Dan Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/

.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 flash {
	0%, 50%, 100% {opacity: 1;}
	25%, 75% {opacity: 0;}
}

@-moz-keyframes flash {
	0%, 50%, 100% {opacity: 1;}
	25%, 75% {opacity: 0;}
}

@-o-keyframes flash {
	0%, 50%, 100% {opacity: 1;}
	25%, 75% {opacity: 0;}
}

@keyframes flash {
	0%, 50%, 100% {opacity: 1;}
	25%, 75% {opacity: 0;}
}

.flash {
	-webkit-animation-name: flash;
	-moz-animation-name: flash;
	-o-animation-name: flash;
	animation-name: flash;
}
@-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;
}
@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);}
	40% {-webkit-transform: translateY(-30px);}
	60% {-webkit-transform: translateY(-15px);}
}

@-moz-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
	40% {-moz-transform: translateY(-30px);}
	60% {-moz-transform: translateY(-15px);}
}

@-o-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
	40% {-o-transform: translateY(-30px);}
	60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
}

.bounce {
	-webkit-animation-name: bounce;
	-moz-animation-name: bounce;
	-o-animation-name: bounce;
	animation-name: bounce;
}
@-webkit-keyframes tada {
	0% {-webkit-transform: scale(1);}
	10%, 20% {-webkit-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-webkit-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-webkit-transform: scale(1.1) rotate(-3deg);}
	100% {-webkit-transform: scale(1) rotate(0);}
}

@-moz-keyframes tada {
	0% {-moz-transform: scale(1);}
	10%, 20% {-moz-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-moz-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-moz-transform: scale(1.1) rotate(-3deg);}
	100% {-moz-transform: scale(1) rotate(0);}
}

@-o-keyframes tada {
	0% {-o-transform: scale(1);}
	10%, 20% {-o-transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {-o-transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {-o-transform: scale(1.1) rotate(-3deg);}
	100% {-o-transform: scale(1) rotate(0);}
}

@keyframes tada {
	0% {transform: scale(1);}
	10%, 20% {transform: scale(0.9) rotate(-3deg);}
	30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
	40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
	100% {transform: scale(1) rotate(0);}
}

.tada {
	-webkit-animation-name: tada;
	-moz-animation-name: tada;
	-o-animation-name: tada;
	animation-name: tada;
}
@-webkit-keyframes swing {
	20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
	20% { -webkit-transform: rotate(15deg); }
	40% { -webkit-transform: rotate(-10deg); }
	60% { -webkit-transform: rotate(5deg); }
	80% { -webkit-transform: rotate(-5deg); }
	100% { -webkit-transform: rotate(0deg); }
}

@-moz-keyframes swing {
	20% { -moz-transform: rotate(15deg); }
	40% { -moz-transform: rotate(-10deg); }
	60% { -moz-transform: rotate(5deg); }
	80% { -moz-transform: rotate(-5deg); }
	100% { -moz-transform: rotate(0deg); }
}

@-o-keyframes swing {
	20% { -o-transform: rotate(15deg); }
	40% { -o-transform: rotate(-10deg); }
	60% { -o-transform: rotate(5deg); }
	80% { -o-transform: rotate(-5deg); }
	100% { -o-transform: rotate(0deg); }
}

@keyframes swing {
	20% { transform: rotate(15deg); }
	40% { transform: rotate(-10deg); }
	60% { transform: rotate(5deg); }
	80% { transform: rotate(-5deg); }
	100% { transform: rotate(0deg); }
}

.swing {
	-webkit-transform-origin: top center;
	-moz-transform-origin: top center;
	-o-transform-origin: top center;
	transform-origin: top center;
	-webkit-animation-name: swing;
	-moz-animation-name: swing;
	-o-animation-name: swing;
	animation-name: swing;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  0% { -webkit-transform: translateX(0%); }
  15% { -webkit-transform: translateX(-25%) rotate(-5deg); }
  30% { -webkit-transform: translateX(20%) rotate(3deg); }
  45% { -webkit-transform: translateX(-15%) rotate(-3deg); }
  60% { -webkit-transform: translateX(10%) rotate(2deg); }
  75% { -webkit-transform: translateX(-5%) rotate(-1deg); }
  100% { -webkit-transform: translateX(0%); }
}

@-moz-keyframes wobble {
  0% { -moz-transform: translateX(0%); }
  15% { -moz-transform: translateX(-25%) rotate(-5deg); }
  30% { -moz-transform: translateX(20%) rotate(3deg); }
  45% { -moz-transform: translateX(-15%) rotate(-3deg); }
  60% { -moz-transform: translateX(10%) rotate(2deg); }
  75% { -moz-transform: translateX(-5%) rotate(-1deg); }
  100% { -moz-transform: translateX(0%); }
}

@-o-keyframes wobble {
  0% { -o-transform: translateX(0%); }
  15% { -o-transform: translateX(-25%) rotate(-5deg); }
  30% { -o-transform: translateX(20%) rotate(3deg); }
  45% { -o-transform: translateX(-15%) rotate(-3deg); }
  60% { -o-transform: translateX(10%) rotate(2deg); }
  75% { -o-transform: translateX(-5%) rotate(-1deg); }
  100% { -o-transform: translateX(0%); }
}

@keyframes wobble {
  0% { transform: translateX(0%); }
  15% { transform: translateX(-25%) rotate(-5deg); }
  30% { transform: translateX(20%) rotate(3deg); }
  45% { transform: translateX(-15%) rotate(-3deg); }
  60% { transform: translateX(10%) rotate(2deg); }
  75% { transform: translateX(-5%) rotate(-1deg); }
  100% { transform: translateX(0%); }
}

.wobble {
	-webkit-animation-name: wobble;
	-moz-animation-name: wobble;
	-o-animation-name: wobble;
	animation-name: wobble;
}
@-webkit-keyframes wiggle {
    0% { -webkit-transform: skewX(9deg); }
    10% { -webkit-transform: skewX(-8deg); }
    20% { -webkit-transform: skewX(7deg); }
    30% { -webkit-transform: skewX(-6deg); }
    40% { -webkit-transform: skewX(5deg); }
    50% { -webkit-transform: skewX(-4deg); }
    60% { -webkit-transform: skewX(3deg); }
    70% { -webkit-transform: skewX(-2deg); }
    80% { -webkit-transform: skewX(1deg); }
    90% { -webkit-transform: skewX(0deg); }
	100% { -webkit-transform: skewX(0deg); }
}

@-moz-keyframes wiggle {
    0% { -moz-transform: skewX(9deg); }
    10% { -moz-transform: skewX(-8deg); }
    20% { -moz-transform: skewX(7deg); }
    30% { -moz-transform: skewX(-6deg); }
    40% { -moz-transform: skewX(5deg); }
    50% { -moz-transform: skewX(-4deg); }
    60% { -moz-transform: skewX(3deg); }
    70% { -moz-transform: skewX(-2deg); }
    80% { -moz-transform: skewX(1deg); }
    90% { -moz-transform: skewX(0deg); }
	100% { -moz-transform: skewX(0deg); }
}

@-o-keyframes wiggle {
    0% { -o-transform: skewX(9deg); }
    10% { -o-transform: skewX(-8deg); }
    20% { -o-transform: skewX(7deg); }
    30% { -o-transform: skewX(-6deg); }
    40% { -o-transform: skewX(5deg); }
    50% { -o-transform: skewX(-4deg); }
    60% { -o-transform: skewX(3deg); }
    70% { -o-transform: skewX(-2deg); }
    80% { -o-transform: skewX(1deg); }
    90% { -o-transform: skewX(0deg); }
	100% { -o-transform: skewX(0deg); }
}

@keyframes wiggle {
    0% { transform: skewX(9deg); }
    10% { transform: skewX(-8deg); }
    20% { transform: skewX(7deg); }
    30% { transform: skewX(-6deg); }
    40% { transform: skewX(5deg); }
    50% { transform: skewX(-4deg); }
    60% { transform: skewX(3deg); }
    70% { transform: skewX(-2deg); }
    80% { transform: skewX(1deg); }
    90% { transform: skewX(0deg); }
	100% { transform: skewX(0deg); }
}

.wiggle {
    -webkit-animation-name: wiggle;
    -moz-animation-name: wiggle;
    -o-animation-name: wiggle;
    animation-name: wiggle;

    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
    0% { -webkit-transform: scale(1); }
	50% { -webkit-transform: scale(1.2); }
    100% { -webkit-transform: scale(1); }
}
@-moz-keyframes pulse {
    0% { -moz-transform: scale(1); }
	50% { -moz-transform: scale(1.2); }
    100% { -moz-transform: scale(1); }
}
@-o-keyframes pulse {
    0% { -o-transform: scale(1); }
	50% { -o-transform: scale(1.2); }
    100% { -o-transform: scale(1); }
}
@keyframes pulse {
    0% { transform: scale(1); }
	50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

.pulse {
	-webkit-animation-name: pulse;
	-moz-animation-name: pulse;
	-o-animation-name: pulse;
	animation-name: pulse;
}
@-webkit-keyframes flip {
	0% {
		-webkit-transform: perspective(400px) rotateY(0);
		-webkit-animation-timing-function: ease-out;
	}
	40% {
		-webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
		-webkit-animation-timing-function: ease-out;
	}
	50% {
		-webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
		-webkit-animation-timing-function: ease-in;
	}
	80% {
		-webkit-transform: perspective(400px) rotateY(360deg) scale(.95);
		-webkit-animation-timing-function: ease-in;
	}
	100% {
		-webkit-transform: perspective(400px) scale(1);
		-webkit-animation-timing-function: ease-in;
	}
}
@-moz-keyframes flip {
	0% {
		-moz-transform: perspective(400px) rotateY(0);
		-moz-animation-timing-function: ease-out;
	}
	40% {
		-moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);
		-moz-animation-timing-function: ease-out;
	}
	50% {
		-moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
		-moz-animation-timing-function: ease-in;
	}
	80% {
		-moz-transform: perspective(400px) rotateY(360deg) scale(.95);
		-moz-animation-timing-function: ease-in;
	}
	100% {
		-moz-transform: perspective(400px) scale(1);
		-moz-animation-timing-function: ease-in;
	}
}
@-o-keyframes flip {
	0% {
		-o-transform: perspective(400px) rotateY(0);
		-o-animation-timing-function: ease-out;
	}
	40% {
		-o-transform: perspective(400px) translateZ(150px) rotateY(170deg);
		-o-animation-timing-function: ease-out;
	}
	50% {
		-o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
		-o-animation-timing-function: ease-in;
	}
	80% {
		-o-transform: perspective(400px) rotateY(360deg) scale(.95);
		-o-animation-timing-function: ease-in;
	}
	100% {
		-o-transform: perspective(400px) scale(1);
		-o-animation-timing-function: ease-in;
	}
}
@keyframes flip {
	0% {
		transform: perspective(400px) rotateY(0);
		animation-timing-function: ease-out;
	}
	40% {
		transform: perspective(400px) translateZ(150px) rotateY(170deg);
		animation-timing-function: ease-out;
	}
	50% {
		transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
		animation-timing-function: ease-in;
	}
	80% {
		transform: perspective(400px) rotateY(360deg) scale(.95);
		animation-timing-function: ease-in;
	}
	100% {
		transform: perspective(400px) scale(1);
		animation-timing-function: ease-in;
	}
}

.flip {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flip;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flip;
	-o-backface-visibility: visible !important;
	-o-animation-name: flip;
	backface-visibility: visible !important;
	animation-name: flip;
}
@-webkit-keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateX(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@-moz-keyframes flipInX {
    0% {
        -moz-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        -moz-transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        -moz-transform: perspective(400px) rotateX(10deg);
    }

    100% {
        -moz-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@-o-keyframes flipInX {
    0% {
        -o-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        -o-transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        -o-transform: perspective(400px) rotateX(10deg);
    }

    100% {
        -o-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}
@keyframes flipInX {
    0% {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }

    40% {
        transform: perspective(400px) rotateX(-10deg);
    }

    70% {
        transform: perspective(400px) rotateX(10deg);
    }

    100% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
}

.flipInX {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInX;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInX;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInX;
	backface-visibility: visible !important;
	animation-name: flipInX;
}
@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-moz-keyframes flipOutX {
    0% {
        -moz-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -moz-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@-o-keyframes flipOutX {
    0% {
        -o-transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        -o-transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

@keyframes flipOutX {
    0% {
        transform: perspective(400px) rotateX(0deg);
        opacity: 1;
    }
	100% {
        transform: perspective(400px) rotateX(90deg);
        opacity: 0;
    }
}

.flipOutX {
	-webkit-animation-name: flipOutX;
	-webkit-backface-visibility: visible !important;
	-moz-animation-name: flipOutX;
	-moz-backface-visibility: visible !important;
	-o-animation-name: flipOutX;
	-o-backface-visibility: visible !important;
	animation-name: flipOutX;
	backface-visibility: visible !important;
}
@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        -webkit-transform: perspective(400px) rotateY(10deg);
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}
@-moz-keyframes flipInY {
    0% {
        -moz-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        -moz-transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        -moz-transform: perspective(400px) rotateY(10deg);
    }

    100% {
        -moz-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}
@-o-keyframes flipInY {
    0% {
        -o-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        -o-transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        -o-transform: perspective(400px) rotateY(10deg);
    }

    100% {
        -o-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}
@keyframes flipInY {
    0% {
        transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }

    40% {
        transform: perspective(400px) rotateY(-10deg);
    }

    70% {
        transform: perspective(400px) rotateY(10deg);
    }

    100% {
        transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
}

.flipInY {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipInY;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipInY;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipInY;
	backface-visibility: visible !important;
	animation-name: flipInY;
}
@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
	100% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}
@-moz-keyframes flipOutY {
    0% {
        -moz-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
	100% {
        -moz-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}
@-o-keyframes flipOutY {
    0% {
        -o-transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
	100% {
        -o-transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}
@keyframes flipOutY {
    0% {
        transform: perspective(400px) rotateY(0deg);
        opacity: 1;
    }
	100% {
        transform: perspective(400px) rotateY(90deg);
        opacity: 0;
    }
}

.flipOutY {
	-webkit-backface-visibility: visible !important;
	-webkit-animation-name: flipOutY;
	-moz-backface-visibility: visible !important;
	-moz-animation-name: flipOutY;
	-o-backface-visibility: visible !important;
	-o-animation-name: flipOutY;
	backface-visibility: visible !important;
	animation-name: flipOutY;
}
@-webkit-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-o-keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
}
@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInUp {
	0% {
		opacity: 0;
		-moz-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInUp {
	0% {
		opacity: 0;
		-o-transform: translateY(20px);
	}

	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translateY(20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInUp {
	-webkit-animation-name: fadeInUp;
	-moz-animation-name: fadeInUp;
	-o-animation-name: fadeInUp;
	animation-name: fadeInUp;
}
@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInDown {
	0% {
		opacity: 0;
		-moz-transform: translateY(-20px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInDown {
	0% {
		opacity: 0;
		-ms-transform: translateY(-20px);
	}

	100% {
		opacity: 1;
		-ms-transform: translateY(0);
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		transform: translateY(-20px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInDown {
	-webkit-animation-name: fadeInDown;
	-moz-animation-name: fadeInDown;
	-o-animation-name: fadeInDown;
	animation-name: fadeInDown;
}
@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-20px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInRight {
	0% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInRight {
	0% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInRight {
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	-o-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
@-webkit-keyframes fadeInUpBig {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInUpBig {
	0% {
		opacity: 0;
		-moz-transform: translateY(2000px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInUpBig {
	0% {
		opacity: 0;
		-o-transform: translateY(2000px);
	}

	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInUpBig {
	0% {
		opacity: 0;
		transform: translateY(2000px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInUpBig {
	-webkit-animation-name: fadeInUpBig;
	-moz-animation-name: fadeInUpBig;
	-o-animation-name: fadeInUpBig;
	animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeInDownBig {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-2000px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes fadeInDownBig {
	0% {
		opacity: 0;
		-moz-transform: translateY(-2000px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateY(0);
	}
}

@-o-keyframes fadeInDownBig {
	0% {
		opacity: 0;
		-o-transform: translateY(-2000px);
	}

	100% {
		opacity: 1;
		-o-transform: translateY(0);
	}
}

@keyframes fadeInDownBig {
	0% {
		opacity: 0;
		transform: translateY(-2000px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.fadeInDownBig {
	-webkit-animation-name: fadeInDownBig;
	-moz-animation-name: fadeInDownBig;
	-o-animation-name: fadeInDownBig;
	animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeftBig {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}
@-moz-keyframes fadeInLeftBig {
	0% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}
@-o-keyframes fadeInLeftBig {
	0% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}
@keyframes fadeInLeftBig {
	0% {
		opacity: 0;
		transform: translateX(-2000px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInLeftBig {
	-webkit-animation-name: fadeInLeftBig;
	-moz-animation-name: fadeInLeftBig;
	-o-animation-name: fadeInLeftBig;
	animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRightBig {
	0% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInRightBig {
	0% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInRightBig {
	0% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInRightBig {
	0% {
		opacity: 0;
		transform: translateX(2000px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInRightBig {
	-webkit-animation-name: fadeInRightBig;
	-moz-animation-name: fadeInRightBig;
	-o-animation-name: fadeInRightBig;
	animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-moz-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-o-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

.fadeOut {
	-webkit-animation-name: fadeOut;
	-moz-animation-name: fadeOut;
	-o-animation-name: fadeOut;
	animation-name: fadeOut;
}
@-webkit-keyframes fadeOutUp {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
	}
}
@-moz-keyframes fadeOutUp {
	0% {
		opacity: 1;
		-moz-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(-20px);
	}
}
@-o-keyframes fadeOutUp {
	0% {
		opacity: 1;
		-o-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(-20px);
	}
}
@keyframes fadeOutUp {
	0% {
		opacity: 1;
		transform: translateY(0);
	}

	100% {
		opacity: 0;
		transform: translateY(-20px);
	}
}

.fadeOutUp {
	-webkit-animation-name: fadeOutUp;
	-moz-animation-name: fadeOutUp;
	-o-animation-name: fadeOutUp;
	animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutDown {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(20px);
	}
}

@-moz-keyframes fadeOutDown {
	0% {
		opacity: 1;
		-moz-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(20px);
	}
}

@-o-keyframes fadeOutDown {
	0% {
		opacity: 1;
		-o-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(20px);
	}
}

@keyframes fadeOutDown {
	0% {
		opacity: 1;
		transform: translateY(0);
	}

	100% {
		opacity: 0;
		transform: translateY(20px);
	}
}

.fadeOutDown {
	-webkit-animation-name: fadeOutDown;
	-moz-animation-name: fadeOutDown;
	-o-animation-name: fadeOutDown;
	animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}
}

@-moz-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-moz-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}
}

@-o-keyframes fadeOutLeft {
	0% {
		opacity: 1;
		-o-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}
}

@keyframes fadeOutLeft {
	0% {
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		opacity: 0;
		transform: translateX(-20px);
	}
}

.fadeOutLeft {
	-webkit-animation-name: fadeOutLeft;
	-moz-animation-name: fadeOutLeft;
	-o-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutRight {
	0% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(20px);
	}
}

@-moz-keyframes fadeOutRight {
	0% {
		opacity: 1;
		-moz-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(20px);
	}
}

@-o-keyframes fadeOutRight {
	0% {
		opacity: 1;
		-o-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(20px);
	}
}

@keyframes fadeOutRight {
	0% {
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		opacity: 0;
		transform: translateX(20px);
	}
}

.fadeOutRight {
	-webkit-animation-name: fadeOutRight;
	-moz-animation-name: fadeOutRight;
	-o-animation-name: fadeOutRight;
	animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutUpBig {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(-2000px);
	}
}

@-moz-keyframes fadeOutUpBig {
	0% {
		opacity: 1;
		-moz-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(-2000px);
	}
}

@-o-keyframes fadeOutUpBig {
	0% {
		opacity: 1;
		-o-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(-2000px);
	}
}

@keyframes fadeOutUpBig {
	0% {
		opacity: 1;
		transform: translateY(0);
	}

	100% {
		opacity: 0;
		transform: translateY(-2000px);
	}
}

.fadeOutUpBig {
	-webkit-animation-name: fadeOutUpBig;
	-moz-animation-name: fadeOutUpBig;
	-o-animation-name: fadeOutUpBig;
	animation-name: fadeOutUpBig;
}
@-webkit-keyframes fadeOutDownBig {
	0% {
		opacity: 1;
		-webkit-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
	}
}

@-moz-keyframes fadeOutDownBig {
	0% {
		opacity: 1;
		-moz-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(2000px);
	}
}

@-o-keyframes fadeOutDownBig {
	0% {
		opacity: 1;
		-o-transform: translateY(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(2000px);
	}
}

@keyframes fadeOutDownBig {
	0% {
		opacity: 1;
		transform: translateY(0);
	}

	100% {
		opacity: 0;
		transform: translateY(2000px);
	}
}

.fadeOutDownBig {
	-webkit-animation-name: fadeOutDownBig;
	-moz-animation-name: fadeOutDownBig;
	-o-animation-name: fadeOutDownBig;
	animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeftBig {
	0% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}
}

@-moz-keyframes fadeOutLeftBig {
	0% {
		opacity: 1;
		-moz-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}
}

@-o-keyframes fadeOutLeftBig {
	0% {
		opacity: 1;
		-o-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}
}

@keyframes fadeOutLeftBig {
	0% {
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		opacity: 0;
		transform: translateX(-2000px);
	}
}

.fadeOutLeftBig {
	-webkit-animation-name: fadeOutLeftBig;
	-moz-animation-name: fadeOutLeftBig;
	-o-animation-name: fadeOutLeftBig;
	animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRightBig {
	0% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}
}
@-moz-keyframes fadeOutRightBig {
	0% {
		opacity: 1;
		-moz-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}
}
@-o-keyframes fadeOutRightBig {
	0% {
		opacity: 1;
		-o-transform: translateX(0);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}
}
@keyframes fadeOutRightBig {
	0% {
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		opacity: 0;
		transform: translateX(2000px);
	}
}

.fadeOutRightBig {
	-webkit-animation-name: fadeOutRightBig;
	-moz-animation-name: fadeOutRightBig;
	-o-animation-name: fadeOutRightBig;
	animation-name: fadeOutRightBig;
}
@-webkit-keyframes bounceIn {
	0% {
		opacity: 0;
		-webkit-transform: scale(.3);
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.05);
	}

	70% {
		-webkit-transform: scale(.9);
	}

	100% {
		-webkit-transform: scale(1);
	}
}

@-moz-keyframes bounceIn {
	0% {
		opacity: 0;
		-moz-transform: scale(.3);
	}

	50% {
		opacity: 1;
		-moz-transform: scale(1.05);
	}

	70% {
		-moz-transform: scale(.9);
	}

	100% {
		-moz-transform: scale(1);
	}
}

@-o-keyframes bounceIn {
	0% {
		opacity: 0;
		-o-transform: scale(.3);
	}

	50% {
		opacity: 1;
		-o-transform: scale(1.05);
	}

	70% {
		-o-transform: scale(.9);
	}

	100% {
		-o-transform: scale(1);
	}
}

@keyframes bounceIn {
	0% {
		opacity: 0;
		transform: scale(.3);
	}

	50% {
		opacity: 1;
		transform: scale(1.05);
	}

	70% {
		transform: scale(.9);
	}

	100% {
		transform: scale(1);
	}
}

.bounceIn {
	-webkit-animation-name: bounceIn;
	-moz-animation-name: bounceIn;
	-o-animation-name: bounceIn;
	animation-name: bounceIn;
}
@-webkit-keyframes bounceInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateY(-30px);
	}

	80% {
		-webkit-transform: translateY(10px);
	}

	100% {
		-webkit-transform: translateY(0);
	}
}
@-moz-keyframes bounceInUp {
	0% {
		opacity: 0;
		-moz-transform: translateY(2000px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateY(-30px);
	}

	80% {
		-moz-transform: translateY(10px);
	}

	100% {
		-moz-transform: translateY(0);
	}
}

@-o-keyframes bounceInUp {
	0% {
		opacity: 0;
		-o-transform: translateY(2000px);
	}

	60% {
		opacity: 1;
		-o-transform: translateY(-30px);
	}

	80% {
		-o-transform: translateY(10px);
	}

	100% {
		-o-transform: translateY(0);
	}
}

@keyframes bounceInUp {
	0% {
		opacity: 0;
		transform: translateY(2000px);
	}

	60% {
		opacity: 1;
		transform: translateY(-30px);
	}

	80% {
		transform: translateY(10px);
	}

	100% {
		transform: translateY(0);
	}
}

.bounceInUp {
	-webkit-animation-name: bounceInUp;
	-moz-animation-name: bounceInUp;
	-o-animation-name: bounceInUp;
	animation-name: bounceInUp;
}
@-webkit-keyframes bounceInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-2000px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateY(30px);
	}

	80% {
		-webkit-transform: translateY(-10px);
	}

	100% {
		-webkit-transform: translateY(0);
	}
}

@-moz-keyframes bounceInDown {
	0% {
		opacity: 0;
		-moz-transform: translateY(-2000px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateY(30px);
	}

	80% {
		-moz-transform: translateY(-10px);
	}

	100% {
		-moz-transform: translateY(0);
	}
}

@-o-keyframes bounceInDown {
	0% {
		opacity: 0;
		-o-transform: translateY(-2000px);
	}

	60% {
		opacity: 1;
		-o-transform: translateY(30px);
	}

	80% {
		-o-transform: translateY(-10px);
	}

	100% {
		-o-transform: translateY(0);
	}
}

@keyframes bounceInDown {
	0% {
		opacity: 0;
		transform: translateY(-2000px);
	}

	60% {
		opacity: 1;
		transform: translateY(30px);
	}

	80% {
		transform: translateY(-10px);
	}

	100% {
		transform: translateY(0);
	}
}

.bounceInDown {
	-webkit-animation-name: bounceInDown;
	-moz-animation-name: bounceInDown;
	-o-animation-name: bounceInDown;
	animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(30px);
	}

	80% {
		-webkit-transform: translateX(-10px);
	}

	100% {
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes bounceInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateX(30px);
	}

	80% {
		-moz-transform: translateX(-10px);
	}

	100% {
		-moz-transform: translateX(0);
	}
}

@-o-keyframes bounceInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}

	60% {
		opacity: 1;
		-o-transform: translateX(30px);
	}

	80% {
		-o-transform: translateX(-10px);
	}

	100% {
		-o-transform: translateX(0);
	}
}

@keyframes bounceInLeft {
	0% {
		opacity: 0;
		transform: translateX(-2000px);
	}

	60% {
		opacity: 1;
		transform: translateX(30px);
	}

	80% {
		transform: translateX(-10px);
	}

	100% {
		transform: translateX(0);
	}
}

.bounceInLeft {
	-webkit-animation-name: bounceInLeft;
	-moz-animation-name: bounceInLeft;
	-o-animation-name: bounceInLeft;
	animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}

	60% {
		opacity: 1;
		-webkit-transform: translateX(-30px);
	}

	80% {
		-webkit-transform: translateX(10px);
	}

	100% {
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes bounceInRight {
	0% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}

	60% {
		opacity: 1;
		-moz-transform: translateX(-30px);
	}

	80% {
		-moz-transform: translateX(10px);
	}

	100% {
		-moz-transform: translateX(0);
	}
}

@-o-keyframes bounceInRight {
	0% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}

	60% {
		opacity: 1;
		-o-transform: translateX(-30px);
	}

	80% {
		-o-transform: translateX(10px);
	}

	100% {
		-o-transform: translateX(0);
	}
}

@keyframes bounceInRight {
	0% {
		opacity: 0;
		transform: translateX(2000px);
	}

	60% {
		opacity: 1;
		transform: translateX(-30px);
	}

	80% {
		transform: translateX(10px);
	}

	100% {
		transform: translateX(0);
	}
}

.bounceInRight {
	-webkit-animation-name: bounceInRight;
	-moz-animation-name: bounceInRight;
	-o-animation-name: bounceInRight;
	animation-name: bounceInRight;
}
@-webkit-keyframes bounceOut {
	0% {
		-webkit-transform: scale(1);
	}

	25% {
		-webkit-transform: scale(.95);
	}

	50% {
		opacity: 1;
		-webkit-transform: scale(1.1);
	}

	100% {
		opacity: 0;
		-webkit-transform: scale(.3);
	}
}

@-moz-keyframes bounceOut {
	0% {
		-moz-transform: scale(1);
	}

	25% {
		-moz-transform: scale(.95);
	}

	50% {
		opacity: 1;
		-moz-transform: scale(1.1);
	}

	100% {
		opacity: 0;
		-moz-transform: scale(.3);
	}
}

@-o-keyframes bounceOut {
	0% {
		-o-transform: scale(1);
	}

	25% {
		-o-transform: scale(.95);
	}

	50% {
		opacity: 1;
		-o-transform: scale(1.1);
	}

	100% {
		opacity: 0;
		-o-transform: scale(.3);
	}
}

@keyframes bounceOut {
	0% {
		transform: scale(1);
	}

	25% {
		transform: scale(.95);
	}

	50% {
		opacity: 1;
		transform: scale(1.1);
	}

	100% {
		opacity: 0;
		transform: scale(.3);
	}
}

.bounceOut {
	-webkit-animation-name: bounceOut;
	-moz-animation-name: bounceOut;
	-o-animation-name: bounceOut;
	animation-name: bounceOut;
}
@-webkit-keyframes bounceOutUp {
	0% {
		-webkit-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-webkit-transform: translateY(20px);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(-2000px);
	}
}

@-moz-keyframes bounceOutUp {
	0% {
		-moz-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-moz-transform: translateY(20px);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(-2000px);
	}
}

@-o-keyframes bounceOutUp {
	0% {
		-o-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-o-transform: translateY(20px);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(-2000px);
	}
}

@keyframes bounceOutUp {
	0% {
		transform: translateY(0);
	}

	20% {
		opacity: 1;
		transform: translateY(20px);
	}

	100% {
		opacity: 0;
		transform: translateY(-2000px);
	}
}

.bounceOutUp {
	-webkit-animation-name: bounceOutUp;
	-moz-animation-name: bounceOutUp;
	-o-animation-name: bounceOutUp;
	animation-name: bounceOutUp;
}
@-webkit-keyframes bounceOutDown {
	0% {
		-webkit-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-webkit-transform: translateY(-20px);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateY(2000px);
	}
}

@-moz-keyframes bounceOutDown {
	0% {
		-moz-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-moz-transform: translateY(-20px);
	}

	100% {
		opacity: 0;
		-moz-transform: translateY(2000px);
	}
}

@-o-keyframes bounceOutDown {
	0% {
		-o-transform: translateY(0);
	}

	20% {
		opacity: 1;
		-o-transform: translateY(-20px);
	}

	100% {
		opacity: 0;
		-o-transform: translateY(2000px);
	}
}

@keyframes bounceOutDown {
	0% {
		transform: translateY(0);
	}

	20% {
		opacity: 1;
		transform: translateY(-20px);
	}

	100% {
		opacity: 0;
		transform: translateY(2000px);
	}
}

.bounceOutDown {
	-webkit-animation-name: bounceOutDown;
	-moz-animation-name: bounceOutDown;
	-o-animation-name: bounceOutDown;
	animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
	0% {
		-webkit-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-webkit-transform: translateX(20px);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}
}

@-moz-keyframes bounceOutLeft {
	0% {
		-moz-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-moz-transform: translateX(20px);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}
}

@-o-keyframes bounceOutLeft {
	0% {
		-o-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-o-transform: translateX(20px);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}
}

@keyframes bounceOutLeft {
	0% {
		transform: translateX(0);
	}

	20% {
		opacity: 1;
		transform: translateX(20px);
	}

	100% {
		opacity: 0;
		transform: translateX(-2000px);
	}
}

.bounceOutLeft {
	-webkit-animation-name: bounceOutLeft;
	-moz-animation-name: bounceOutLeft;
	-o-animation-name: bounceOutLeft;
	animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
	0% {
		-webkit-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-webkit-transform: translateX(-20px);
	}

	100% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}
}

@-moz-keyframes bounceOutRight {
	0% {
		-moz-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-moz-transform: translateX(-20px);
	}

	100% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}
}

@-o-keyframes bounceOutRight {
	0% {
		-o-transform: translateX(0);
	}

	20% {
		opacity: 1;
		-o-transform: translateX(-20px);
	}

	100% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}
}

@keyframes bounceOutRight {
	0% {
		transform: translateX(0);
	}

	20% {
		opacity: 1;
		transform: translateX(-20px);
	}

	100% {
		opacity: 0;
		transform: translateX(2000px);
	}
}

.bounceOutRight {
	-webkit-animation-name: bounceOutRight;
	-moz-animation-name: bounceOutRight;
	-o-animation-name: bounceOutRight;
	animation-name: bounceOutRight;
}
@-webkit-keyframes rotateIn {
	0% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(-200deg);
		opacity: 0;
	}

	100% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}
@-moz-keyframes rotateIn {
	0% {
		-moz-transform-origin: center center;
		-moz-transform: rotate(-200deg);
		opacity: 0;
	}

	100% {
		-moz-transform-origin: center center;
		-moz-transform: rotate(0);
		opacity: 1;
	}
}
@-o-keyframes rotateIn {
	0% {
		-o-transform-origin: center center;
		-o-transform: rotate(-200deg);
		opacity: 0;
	}

	100% {
		-o-transform-origin: center center;
		-o-transform: rotate(0);
		opacity: 1;
	}
}
@keyframes rotateIn {
	0% {
		transform-origin: center center;
		transform: rotate(-200deg);
		opacity: 0;
	}

	100% {
		transform-origin: center center;
		transform: rotate(0);
		opacity: 1;
	}
}

.rotateIn {
	-webkit-animation-name: rotateIn;
	-moz-animation-name: rotateIn;
	-o-animation-name: rotateIn;
	animation-name: rotateIn;
}
@-webkit-keyframes rotateInUpLeft {
	0% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}

@-moz-keyframes rotateInUpLeft {
	0% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}
}

@-o-keyframes rotateInUpLeft {
	0% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}
}

@keyframes rotateInUpLeft {
	0% {
		transform-origin: left bottom;
		transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		transform-origin: left bottom;
		transform: rotate(0);
		opacity: 1;
	}
}

.rotateInUpLeft {
	-webkit-animation-name: rotateInUpLeft;
	-moz-animation-name: rotateInUpLeft;
	-o-animation-name: rotateInUpLeft;
	animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInDownLeft {
	0% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}

@-moz-keyframes rotateInDownLeft {
	0% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}
}

@-o-keyframes rotateInDownLeft {
	0% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}
}

@keyframes rotateInDownLeft {
	0% {
		transform-origin: left bottom;
		transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		transform-origin: left bottom;
		transform: rotate(0);
		opacity: 1;
	}
}

.rotateInDownLeft {
	-webkit-animation-name: rotateInDownLeft;
	-moz-animation-name: rotateInDownLeft;
	-o-animation-name: rotateInDownLeft;
	animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInUpRight {
	0% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}

@-moz-keyframes rotateInUpRight {
	0% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}
}

@-o-keyframes rotateInUpRight {
	0% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}
}

@keyframes rotateInUpRight {
	0% {
		transform-origin: right bottom;
		transform: rotate(-90deg);
		opacity: 0;
	}

	100% {
		transform-origin: right bottom;
		transform: rotate(0);
		opacity: 1;
	}
}

.rotateInUpRight {
	-webkit-animation-name: rotateInUpRight;
	-moz-animation-name: rotateInUpRight;
	-o-animation-name: rotateInUpRight;
	animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateInDownRight {
	0% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}
}

@-moz-keyframes rotateInDownRight {
	0% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}
}

@-o-keyframes rotateInDownRight {
	0% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}
}

@keyframes rotateInDownRight {
	0% {
		transform-origin: right bottom;
		transform: rotate(90deg);
		opacity: 0;
	}

	100% {
		transform-origin: right bottom;
		transform: rotate(0);
		opacity: 1;
	}
}

.rotateInDownRight {
	-webkit-animation-name: rotateInDownRight;
	-moz-animation-name: rotateInDownRight;
	-o-animation-name: rotateInDownRight;
	animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateOut {
	0% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-webkit-transform-origin: center center;
		-webkit-transform: rotate(200deg);
		opacity: 0;
	}
}

@-moz-keyframes rotateOut {
	0% {
		-moz-transform-origin: center center;
		-moz-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-moz-transform-origin: center center;
		-moz-transform: rotate(200deg);
		opacity: 0;
	}
}

@-o-keyframes rotateOut {
	0% {
		-o-transform-origin: center center;
		-o-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-o-transform-origin: center center;
		-o-transform: rotate(200deg);
		opacity: 0;
	}
}

@keyframes rotateOut {
	0% {
		transform-origin: center center;
		transform: rotate(0);
		opacity: 1;
	}

	100% {
		transform-origin: center center;
		transform: rotate(200deg);
		opacity: 0;
	}
}

.rotateOut {
	-webkit-animation-name: rotateOut;
	-moz-animation-name: rotateOut;
	-o-animation-name: rotateOut;
	animation-name: rotateOut;
}
@-webkit-keyframes rotateOutUpLeft {
	0% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(-90deg);
		opacity: 0;
	}
}

@-moz-keyframes rotateOutUpLeft {
	0% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(-90deg);
		opacity: 0;
	}
}

@-o-keyframes rotateOutUpLeft {
	0% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(-90deg);
		opacity: 0;
	}
}

@keyframes rotateOutUpLeft {
	0% {
		transform-origin: left bottom;
		transform: rotate(0);
		opacity: 1;
	}

	100% {
		-transform-origin: left bottom;
		-transform: rotate(-90deg);
		opacity: 0;
	}
}

.rotateOutUpLeft {
	-webkit-animation-name: rotateOutUpLeft;
	-moz-animation-name: rotateOutUpLeft;
	-o-animation-name: rotateOutUpLeft;
	animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutDownLeft {
	0% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-webkit-transform-origin: left bottom;
		-webkit-transform: rotate(90deg);
		opacity: 0;
	}
}

@-moz-keyframes rotateOutDownLeft {
	0% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-moz-transform-origin: left bottom;
		-moz-transform: rotate(90deg);
		opacity: 0;
	}
}

@-o-keyframes rotateOutDownLeft {
	0% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-o-transform-origin: left bottom;
		-o-transform: rotate(90deg);
		opacity: 0;
	}
}

@keyframes rotateOutDownLeft {
	0% {
		transform-origin: left bottom;
		transform: rotate(0);
		opacity: 1;
	}

	100% {
		transform-origin: left bottom;
		transform: rotate(90deg);
		opacity: 0;
	}
}

.rotateOutDownLeft {
	-webkit-animation-name: rotateOutDownLeft;
	-moz-animation-name: rotateOutDownLeft;
	-o-animation-name: rotateOutDownLeft;
	animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutUpRight {
	0% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(90deg);
		opacity: 0;
	}
}

@-moz-keyframes rotateOutUpRight {
	0% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(90deg);
		opacity: 0;
	}
}

@-o-keyframes rotateOutUpRight {
	0% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(90deg);
		opacity: 0;
	}
}

@keyframes rotateOutUpRight {
	0% {
		transform-origin: right bottom;
		transform: rotate(0);
		opacity: 1;
	}

	100% {
		transform-origin: right bottom;
		transform: rotate(90deg);
		opacity: 0;
	}
}

.rotateOutUpRight {
	-webkit-animation-name: rotateOutUpRight;
	-moz-animation-name: rotateOutUpRight;
	-o-animation-name: rotateOutUpRight;
	animation-name: rotateOutUpRight;
}
@-webkit-keyframes rotateOutDownRight {
	0% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-webkit-transform-origin: right bottom;
		-webkit-transform: rotate(-90deg);
		opacity: 0;
	}
}

@-moz-keyframes rotateOutDownRight {
	0% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-moz-transform-origin: right bottom;
		-moz-transform: rotate(-90deg);
		opacity: 0;
	}
}

@-o-keyframes rotateOutDownRight {
	0% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(0);
		opacity: 1;
	}

	100% {
		-o-transform-origin: right bottom;
		-o-transform: rotate(-90deg);
		opacity: 0;
	}
}

@keyframes rotateOutDownRight {
	0% {
		transform-origin: right bottom;
		transform: rotate(0);
		opacity: 1;
	}

	100% {
		transform-origin: right bottom;
		transform: rotate(-90deg);
		opacity: 0;
	}
}

.rotateOutDownRight {
	-webkit-animation-name: rotateOutDownRight;
	-moz-animation-name: rotateOutDownRight;
	-o-animation-name: rotateOutDownRight;
	animation-name: rotateOutDownRight;
}
@-webkit-keyframes lightSpeedIn {
	0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }
	100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
}

@-moz-keyframes lightSpeedIn {
	0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; }
	100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }
}

@-o-keyframes lightSpeedIn {
	0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; }
	100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }
}

@keyframes lightSpeedIn {
	0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
	60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }
	80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }
	100% { transform: translateX(0%) skewX(0deg); opacity: 1; }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    -moz-animation-name: lightSpeedIn;
    -o-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;

    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -o-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
    0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
	100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}

@-moz-keyframes lightSpeedOut {
	0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; }
	100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}

@-o-keyframes lightSpeedOut {
	0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; }
	100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; }
}

@keyframes lightSpeedOut {
	0% { transform: translateX(0%) skewX(0deg); opacity: 1; }
	100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    -moz-animation-name: lightSpeedOut;
    -o-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;

    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
}
@-webkit-keyframes hinge {
	0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
	20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
	40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
	80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; }
	100% { -webkit-transform: translateY(700px); opacity: 0; }
}

@-moz-keyframes hinge {
	0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
	20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
	40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
	80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; }
	100% { -moz-transform: translateY(700px); opacity: 0; }
}

@-o-keyframes hinge {
	0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
	20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
	40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
	80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; }
	100% { -o-transform: translateY(700px); opacity: 0; }
}

@keyframes hinge {
	0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }
	20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; }
	40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; }
	80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; }
	100% { transform: translateY(700px); opacity: 0; }
}

.hinge {
	-webkit-animation-name: hinge;
	-moz-animation-name: hinge;
	-o-animation-name: hinge;
	animation-name: hinge;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
	0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); }
}

@-moz-keyframes rollIn {
	0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); }
}

@-o-keyframes rollIn {
	0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); }
}

@keyframes rollIn {
	0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }
	100% { opacity: 1; transform: translateX(0px) rotate(0deg); }
}

.rollIn {
	-webkit-animation-name: rollIn;
	-moz-animation-name: rollIn;
	-o-animation-name: rollIn;
	animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
    0% {
		opacity: 1;
		-webkit-transform: translateX(0px) rotate(0deg);
	}

    100% {
		opacity: 0;
		-webkit-transform: translateX(100%) rotate(120deg);
	}
}

@-moz-keyframes rollOut {
    0% {
		opacity: 1;
		-moz-transform: translateX(0px) rotate(0deg);
	}

    100% {
		opacity: 0;
		-moz-transform: translateX(100%) rotate(120deg);
	}
}

@-o-keyframes rollOut {
    0% {
		opacity: 1;
		-o-transform: translateX(0px) rotate(0deg);
	}

    100% {
		opacity: 0;
		-o-transform: translateX(100%) rotate(120deg);
	}
}

@keyframes rollOut {
    0% {
		opacity: 1;
		transform: translateX(0px) rotate(0deg);
	}

    100% {
		opacity: 0;
		transform: translateX(100%) rotate(120deg);
	}
}

.rollOut {
	-webkit-animation-name: rollOut;
	-moz-animation-name: rollOut;
	-o-animation-name: rollOut;
	animation-name: rollOut;
}
 /* CSS */

.dyn-cover2.page-1 {
  background: #be1e2d url("http://read.nxtbook.com/best-of/ubiquity/vol1/dyn-cover2/bg.png") center center no-repeat;
  background-size: cover;
}

.dyn-cover2.page-1 .column {
  position: absolute;
  left:-100%;
}

.dyn-cover2.page-1 .tableSim {
  display: table;
  height: 100%;
  width: 100%;
}

.dyn-cover2.page-1 .tableRowSim {
  display: table-row;
  width: 100%;
}

.dyn-cover2.page-1 .tableCellSim {
  display: table-cell;
  vertical-align: bottom;
  text-align: center;
  align: center;
  padding-bottom: 30px;
}

.dyn-cover2.page-1 p {
  padding:0;
  text-indent: 0;
}

.dyn-cover2.page-1 h1 {
  color: #fff;
  margin:30px auto;
  font-size: 34px;
}

.dyn-cover2.page-1 ul {
  list-style: none;
  display: inline-block;
  text-align: center;
}

.dyn-cover2.page-1 ul li {
  color: #fff;
  float: left;
  padding: 0 5px;
  border-left:1px solid #fff;
}

.dyn-cover2.page-1 ul li:first-of-type {
  border: none;
}

.dyn-cover2.page-1.w1 ul li, .dyn-cover2.page-1.iphone ul li {
  float: none;
  border: none;
}

.dyn-cover2.page-1 a {
  color: #fff;
}

.dyn-cover2.page-1 p {
  text-align: center;
} /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.semidynamic {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .semidynamic.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semidynamic.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .semidynamic.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semidynamic.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .semidynamic.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .semidynamic.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.semidynamic.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.semidynamic.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.semidynamic.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.semidynamic.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidynamic/ipad_land.png") center center no-repeat;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.semidyn_articlecover {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .semidyn_articlecover.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semidyn_articlecover.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_port.jpg") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .semidyn_articlecover.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semidyn_articlecover.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_land.jpg") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .semidyn_articlecover.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/ipad_land.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .semidyn_articlecover.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/ipad_land.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.semidyn_articlecover.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_port.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.semidyn_articlecover.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_land.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.semidyn_articlecover.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/iphone_port.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.semidyn_articlecover.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semidyn_articlecover/ipad_land.jpg") center center no-repeat;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.semi_dynad {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .semi_dynad.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPhone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semi_dynad.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPad_port.jpg") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .semi_dynad.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPhone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .semi_dynad.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPhone_land.jpg") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .semi_dynad.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPad_land.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .semi_dynad.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPad_land.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.semi_dynad.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPhone_port.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.semi_dynad.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPhone_land.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.semi_dynad.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPad_port.jpg") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.semi_dynad.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/semi_dynad/ABM_iPad_land.jpg") center center no-repeat;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.pdfpage {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .pdfpage.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .pdfpage.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .pdfpage.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .pdfpage.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .pdfpage.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .pdfpage.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.pdfpage.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.pdfpage.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.pdfpage.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.pdfpage.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/pdfpage/Trumpf-full.jpg") center center no-repeat;
  background-size: contain;}
 .grid.pdfwithmultiplelinks {
  background-color: transparent;
}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.webinpage {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .webinpage.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .webinpage.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .webinpage.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .webinpage.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .webinpage.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .webinpage.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.webinpage.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.webinpage.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.webinpage.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.webinpage.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/webinpage/ipad_land.png") center center no-repeat;}
 .webinpagestatic .myAdFullPage {
  position: absolute;
  z-index: 999;
  left:0;
  width:100%;
  margin:0 auto;
  height:100%;
  background: #fff;
  padding:0%;
  text-align: center;}

.webinpagestatic .sponsorship {
  position:absolute;
  top:0px;
  display: block;
  color:#fff;
  background:#000;
  width:100%;
  z-index:1000;
  text-align:center;
  padding-top:20px;}

.webinpagestatic .iPhone .myAdFullPage {
  top:68px;
}
.webinpagestatic .iPad .myAdFullPage {
  top:68px;
}

.webinpagestatic .iPod .myAdFullPage {
  top:68px;
}

.webinpagestatic .backPage {
  position:absolute;
  bottom:-5px;
  left:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpagestatic .nextPage {
  position:absolute;
  bottom:-5px;
  right:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpagestatic .header {
  background:#000;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index: 1000;
  padding-top:50px;}

.webinpagestatic .iframeWrapper {
  overflow:auto;
  -webkit-overflow-scrolling: touch !important;
  height:95%;}

.webinpagestatic.iphone.horizontal .iframeWrapper {
  height:82%;}

.webinpagestatic.iphone.vertical .iframeWrapper {
  height:88%;}

.webinpagestatic .footer {
  height:50px;
  background:#000;
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index: 1000;}
 .webinpagewithmobile .myAdFullPage {
  position: absolute;
  z-index: 999;
  left:0;
  width:100%;
  margin:0 auto;
  height:100%;
  background: #fff;
  padding:0%;
  text-align: center;}

.webinpagewithmobile .sponsorship {
  position:absolute;
  top:0px;
  display: block;
  color:#fff;
  background:#000;
  width:100%;
  z-index:1000;
  text-align:center;
  padding-top:20px;}

.webinpagewithmobile .iPhone .myAdFullPage {
  top:68px;
}
.webinpagewithmobile .iPad .myAdFullPage {
  top:68px;
}

.webinpagewithmobile .iPod .myAdFullPage {
  top:68px;
}

.webinpagewithmobile .backPage {
  position:absolute;
  bottom:-5px;
  left:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpagewithmobile .nextPage {
  position:absolute;
  bottom:-5px;
  right:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpagewithmobile .header {
  background:#000;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index: 1000;
  padding-top:50px;}

.webinpagewithmobile .iframeWrapper {
  overflow:auto;
  -webkit-overflow-scrolling: touch !important;
  height:95%;}

.webinpagewithmobile.iphone.horizontal .iframeWrapper {
  height:82%;}

.webinpagewithmobile.iphone.vertical .iframeWrapper {
  height:88%;}

.webinpagewithmobile .footer {
  height:50px;
  background:#000;
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index: 1000;}
 .webinpageresponsive .myAdFullPage {
  position: absolute;
  z-index: 999;
  left:0;
  width:100%;
  margin:0 auto;
  height:100%;
  background: #fff;
  padding:0%;
  text-align: center;}

.webinpageresponsive .sponsorship {
  position:absolute;
  top:0px;
  display: block;
  color:#fff;
  background:#000;
  width:100%;
  z-index:1000;
  text-align:center;
  padding-top:20px;}

.webinpageresponsive .iPhone .myAdFullPage {
  top:68px;
}
.webinpageresponsive .iPad .myAdFullPage {
  top:68px;
}

.webinpageresponsive .iPod .myAdFullPage {
  top:68px;
}

.webinpageresponsive .backPage {
  position:absolute;
  bottom:-5px;
  left:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpageresponsive .nextPage {
  position:absolute;
  bottom:-5px;
  right:5px;
  cursor: pointer;
  z-index: 1000;}

.webinpageresponsive .header {
  background:#000;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index: 1000;
  padding-top:50px;}

.webinpageresponsive .iframeWrapper {
  overflow:auto;
  -webkit-overflow-scrolling: touch !important;
  height:95%;}

.webinpageresponsive.iphone.horizontal .iframeWrapper {
  height:82%;}

.webinpageresponsive.iphone.vertical .iframeWrapper {
  height:88%;}

.webinpageresponsive .footer {
  height:50px;
  background:#000;
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index: 1000;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.figures {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .figures.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .figures.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .figures.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .figures.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .figures.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .figures.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.figures.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.figures.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.figures.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.figures.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/figures/ipad_land.png") center center no-repeat;}
 /* CSS */.figuresinarticle p {text-indent:10px}
.figuresinarticle p.credits {text-indent:0;text-align:left;color:grey;font-size:90%;margin:40px 0 0 0}
.figuresinarticle  h1 {font-size:44px;color:#000;font-weight:600}
.figuresinarticle  h1 span {color:rgba(0,135,186,1)}
.figuresinarticle .titlearea {font-size:14px;color:rgba(138,158,163,1);margin:10px 0 0 20px}
.figuresinarticle .titleauthor {text-align:right;margin:10px 20px 20px 0;font:14px Calibri;color:#333}
.figuresinarticle .titleauthor span {color:rgba(0,70,127,1);text-transform:uppercase;font-style:italic}
.figuresinarticle .question {color:rgba(0,135,186,1);text-transform:uppercase;margin:10px 0 0 0;text-indent:0;text-align:left}
.figuresinarticle ul, ol {list-style-position: inside;margin:5px 0 5px 0;display:block;padding:0 0 0 30px}
.figuresinarticle ol li {color:rgba(0,174,239,1)}
.figuresinarticle ul li {list-style-type:disc;margin:0;padding:0}
.figuresinarticle span.list {color:#000}
.figuresinarticle h3 {font:18px;color:rgba(232,108,76,1);text-transform:uppercase;margin:20px 0 0 0px;font-weight:500;font-style:italic}
.figuresinarticle .pullquote {font:24px Georgia;color:#333;font-style:italic; padding-left: 20px; margin-bottom: 20px;}
.figuresinarticle .takeaway {background:rgba(0,135,186,1);padding:15px 0 15px 0;margin:0;display:block}
.figuresinarticle .takeaway h4 {margin:10px 0 0 40px;padding:0 0 0 20px;background:#000;color:#fff;font:21px Arial;text-transform:uppercase;font-weight:100;letter-spacing:1px;line-height:26px}
.figuresinarticle .takeaway ul li {list-style-type:disk;margin:5px 10px 0 0;padding:0}
.figuresinarticle .takeaway li {font:14px Tahoma;color:#fff;line-height:16px;letter-spacing:1px}


.figuresinarticle p.no-indent {
       text-indent : 0px;
}

.figuresinarticle span.drop-cap {
       font-size : 4.693em;
       float : left;
       line-height : 1;
       margin-top : -0.07em;
       margin-right : 0.05em;
       margin-bottom : -0.204em;
       font-family : "Oswald", sans-serif;
       font-stretch : ultra-condensed;
       font-weight : normal;
       font-style : normal;
 	   color:rgba(232,106,76,1)
}
 /*General Styles*/
.twitterfeed {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/twitterfeed/abstract_blue_3.jpg") right center repeat;}

.twitterfeed p {
  	text-indent: 0;
  	text-align: left;
	padding-bottom: 1em;
	color: #333;}

.twitterfeed h1, .twitterfeed h2, .twitterfeed h3, .twitterfeed li {
  	color: #333;}

.twitterfeed .footer li, .twitterfeed.promopage li {
	color: #fff;
	list-style: none;
	font-size: 14px;
	line-height: 18px;}

.twitterfeed ul, .twitterfeed ol {
  	padding-left: 20px;
  	list-style: inside;}

.twitterfeed ol {
	padding-bottom: 10px;}

.twitterfeed .myWrapper {
	margin-bottom: 75px;
	top: 40px;}

.twitterfeed .container {
  }

.twitterfeed .column {
  }

.twitterfeed .header {
	position: absolute;
  	background-image: -webkit-linear-gradient(bottom, #4e819f, #143548);
	background-image: -moz-linear-gradient(bottom, #4e819f, #143548);
	background-image: -o-linear-gradient(bottom, #4e819f, #143548);
	background-image: -ms-linear-gradient(bottom, #4e819f, #143548);
	background-image: linear-gradient(bottom, #4e819f, #143548);
	height: 55px;
  	width: 110%;
	top: 0;
	left: -32px;
	padding-left: 75px;
	box-shadow: 0 1px 5px #000;}

.twitterfeed .footer {
	position: absolute;
	background-image: -webkit-linear-gradient(top, #4e819f, #143548);
	background-image: -moz-linear-gradient(top, #4e819f, #143548);
	background-image: -o-linear-gradient(top, #4e819f, #143548);
	background-image: -ms-linear-gradient(top, #4e819f, #143548);
	background-image: linear-gradient(top, #4e819f, #143548);
	height: 90px;
  	width: 110%;
	bottom: 0;
	left: -32px;
	padding-left: 75px;
	box-shadow: 0 -1px 5px #000;}

.twitterfeed .footer img {
	max-height: 65px;}

/* iPhone specific */
.twitterfeed.iphone .myWrapper {
	top: 30px;
	margin-bottom: 0;}

.twitterfeed.iphone .header {
	height: 25px;
	padding-top: 10px;
	padding-left: 50px;
	padding-bottom: 10px;}

.twitterfeed.w1.iphone .header h1 {
	font-size: 18px;}

/* END iPhone specific */

.twitterfeed.w1 .header h1 {
	font-size: 28px;
	padding-top: 12px;}

.twitterfeed .sidebar {
	position: absolute;
	/*background: yellow;*/
  	/*background: #4e819f;*/
	height: 100%;
  	width: 32px;
	top: 0;
  	left: 0;}

.twitterfeed .header h1 {
	font-size: 40px;
	/*color: #4e819f;*/
  	color: #e4c470;
	font-family: "tamarillo",sans-serif;
	padding-top: 5px;
	font-weight: normal;}

.twitterfeed .column:not(.c1) p {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/twitterfeed/fff25.png") repeat-y top left;}

.twitterfeed .footer a, .twitterfeed.promopage a {
	color: #fff;}

.twitterfeed .floatL {
	float: left;}

.twitterfeed .subscribe {
	margin-bottom: 10px;}

.twitterfeed .subscribe img {
	height: 30px;}

.twitterfeed .button a:link, .twitterfeed .button a:hover, .twitterfeed .button a:visited, .twitterfeed .button a:active {
  color: #fff;}

.twitterfeed .button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 5px 10px;
   -webkit-border-radius: 9px;
   -moz-border-radius: 9px;
   border-radius: 9px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 16px;
   font-family: Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   vertical-align: text-top;}

.twitterfeed .button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;}

.twitterfeed .button:active {
   border-top-color: #1b435e;
   background: #1b435e;}

.twitterfeed .socialmedia img {
	width: 30px;
	margin-left: 2px;
	margin-right: 2px;
	box-shadow: 3px 3px 3px #000;
	border-radius: 5px;}

.twitterfeed.promopage {
	background-image: -webkit-linear-gradient(left, #000, #666);
	background-image: -moz-linear-gradient(left, #000, #666);
	background-image: -o-linear-gradient(left, #000, #666);
	background-image: -ms-linear-gradient(left, #000, #666);
    background-image: linear-gradient(left, #000, #666);}

.twitterfeed.promopage.iphone.horizontal .tableWrapper {
	height: 175px;}

.twitterfeed.promopage.iphone.vertical .tableWrapper {
	height: 300px;}

.twitterfeed .pullquote {
	font-size: 20px;
	color: #999;
	font-style: italic;
	padding: 20px;
	line-height: normal;}










.twitterfeed.grid {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/twitterfeed/bg.jpg");
  background-size: cover;}

.twitterfeed p {
  text-align: left;}

.twitterfeed {
  position:relative;}
  
.twitterfeed p {
  color: #fff;
  text-indent: 0;
  padding-bottom:10px;}

.twitterfeed p.first:first-letter {
  float: left;
  color: #000;
  font-size: 75px;
  line-height: 60px;
  padding-top: 4px;
  padding-right: 8px;
  padding-left: 3px;
  font-family: 'Coda', cursive;}

/*
.twitterfeed h1  {
  color: #fbd46d;
  font-size: 280%;
  font-family: 'Dancing Script', cursive;
  padding-bottom:10px;
}
*/

.twitterfeed p:last-child {
  padding-bottom:0;
  margin-bottom:0;}

p:last-child {
  padding-bottom:0; margin-bottom:0;}
  
.twitterfeed .center {
  text-align: center; }

.twitterfeed .botRight {
  position:absolute;
  bottom:0;
  right:34px;
  color:#333;
  font-size:75%;}

.twitterfeed .botLeft {
  position:absolute;
  bottom:0;
  left:52px;
  color:#333;
  font-size:75%;}
  
.twitterfeed p.caption {
  font-style: italic;
  line-height: 12px;}

.twitterfeed .author {
	max-height: 100%;}

.twitterfeed .caption.lineheight {
  line-height: 14px;}

.twitterfeed .tilted img {
  transform:rotate(7deg);
  -ms-transform:rotate(7deg); /* IE 9 */
  -moz-transform:rotate(7deg); /* Firefox */
  -webkit-transform:rotate(7deg); /* Safari and Chrome */
  -o-transform:rotate(7deg); /* Opera */
  padding: 0;
  margin-bottom: 10px;
  border: 10px solid #fff;
  box-shadow: 3px 3px 5px #666;}

.twitterfeed .frame {
  padding: 15px;}

.twitterfeed a:link, .twitterfeed a:visited {
  color: #0040FF;
  text-decoration:none
}

.twitterfeed .dimensions {
  width: 614px;
  height: 400px;}.twitterfeed a:link, .twitterfeed a:visited {
  color: rgb(248, 202, 179);}

.twitterfeed a:hover, .twitterfeed a:active {
  text-decoration: underline;}

/************************/
/***   Twitter Feed   ***/
/************************/

.twitterfeed .twitter {
  	background: #fff;
	padding: 10px;
	border-radius: 5px;
	box-shadow: 0px 0px 20px #1f4358;}

.twitterfeed .twitter a {
  color: #426D8B;}
  
.twitterfeed .jstwitterHeadLink {
  
}

.twitterfeed #jstwitter {
  font-family: georgia;
  line-height: 1em;
  font-size: 13px;
  color: #333;
  padding: 10px 10px 10px 10px; }

.twitterfeed #jstwitter .tweet {
  margin: 0 auto 5px auto;
  padding: 0 0 15px 0;
  border-bottom: 1px dotted #ccc; }

.twitterfeed #jstwitter .tweet a {
  text-decoration: none;
  color: #426D8B; }

.twitterfeed #jstwitter .tweet a:hover {
  text-decoration: underline; }

.twitterfeed #jstwitter .tweet .time {
  font-size: 10px;
  font-style: italic;
  color: #666666; }

/*
* Copyright (c) 2012 Thibaut Courouble
* http://www.webinterfacelab.com
* Licensed under the MIT License
*
* Sass/SCSS source: http://goo.gl/Gsy7t
* PSD by Orman Clark: http://goo.gl/D8zmk
*/

.containerX {
margin: 30px;
font: 13px/20px "Lucida Grande", Tahoma, Verdana, sans-serif;
color: #404040;
}

.containerX .login {
position: relative;
margin: 0 auto;
padding: 20px 20px 20px;
width: 310px;
background: white;
border-radius: 3px;
-webkit-box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 200px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.3);
}

.containerX .login:before {
content: '';
position: absolute;
top: -8px;
right: -8px;
bottom: -8px;
left: -8px;
z-index: -1;
background: rgba(0, 0, 0, 0.08);
border-radius: 4px;
}

.containerX .login h1 {
margin: -20px -20px 21px;
line-height: 40px;
font-size: 15px;
font-weight: bold;
color: #555;
text-align: center;
text-shadow: 0 1px white;
background: #f3f3f3;
border-bottom: 1px solid #cfcfcf;
border-radius: 3px 3px 0 0;
background-image: -webkit-linear-gradient(top, whiteffd, #eef2f5);
background-image: -moz-linear-gradient(top, whiteffd, #eef2f5);
background-image: -o-linear-gradient(top, whiteffd, #eef2f5);
background-image: linear-gradient(to bottom, whiteffd, #eef2f5);
-webkit-box-shadow: 0 1px whitesmoke;
box-shadow: 0 1px whitesmoke;
}

.containerX .login p {
margin: 0 0 10px;
padding: 0;
}

.containerX .login p:first-child {
margin-top: 0;
}

.containerX .login p.remember_me {
float: left;
line-height: 31px;
}

.containerX .login p.remember_me label {
font-size: 12px;
color: #777;
cursor: pointer;
}

.containerX .login p.remember_me input {
position: relative;
bottom: 1px;
margin-right: 4px;
vertical-align: middle;
}

.containerX .login p.submit {
text-align: right;
}

.containerX .login-help {
margin: 20px 0;
font-size: 11px;
color: white;
text-align: center;
text-shadow: 0 1px #2a85a1;
}

.containerX .login-help a {
color: #cce7fa;
text-decoration: none;
}

.containerX .login-help a:hover {
text-decoration: underline;
}

.containerX :-moz-placeholder {
color: #c9c9c9 !important;
font-size: 13px;
}

.containerX ::-webkit-input-placeholder {
color: #ccc;
font-size: 13px;
}

.containerX input {
font-family: 'Lucida Grande', Tahoma, Verdana, sans-serif;
font-size: 14px;
}

.containerX input[type=text], .containerX input[type=email] {
margin: 5px;
padding: 0 10px;
width: 75%;
height: 34px;
color: #404040;
background: white;
border: 1px solid;
border-color: #c4c4c4 #d1d1d1 #d4d4d4;
border-radius: 2px;
outline: 5px solid #eff4f7;
-moz-outline-radius: 3px;
-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.12);
}

.containerX input[type=text]:focus, .containerX input[type=email]:focus {
border-color: #7dc9e2;
outline-color: #dceefc;
outline-offset: 0;
}

.containerX input[type=submit] {
padding: 0 18px;
height: 29px;
font-size: 12px;
font-weight: bold;
color: #527881;
text-shadow: 0 1px #e3f1f1;
background: #cde5ef;
border: 1px solid;
border-color: #b4ccce #b3c0c8 #9eb9c2;
border-radius: 16px;
outline: 0;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
background-image: -webkit-linear-gradient(top, #edf5f8, #cde5ef);
background-image: -moz-linear-gradient(top, #edf5f8, #cde5ef);
background-image: -o-linear-gradient(top, #edf5f8, #cde5ef);
background-image: linear-gradient(to bottom, #edf5f8, #cde5ef);
-webkit-box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
box-shadow: inset 0 1px white, 0 1px 2px rgba(0, 0, 0, 0.15);
}

.containerX input[type=submit]:active {
background: #cde5ef;
border-color: #9eb9c2 #b3c0c8 #b4ccce;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.2);
}

.containerX .lt-ie9 input[type=text], .containerX .lt-ie9 input[type=email] {
line-height: 34px;
}
 /* CSS */

.onefigure.grid {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/onefigure/img2.jpg") center top repeat;
  background-size: cover
}

.onefigure .floatL {
  float: left;
  width: 250px}

.onefigure .half {
  width: 47%}

.onefigure .tweetwrap {
  display:block;
  width:270px;
  margin:0 auto;
  padding:10px 0 3px 0;
  background: transparent url(http://read.nxtbook.com/best-of/ubiquity/vol1/onefigure/bkg_white.png);
  background: rgba(255,255,255,.85);
  border-top-right-radius:20px;
  -moz-border-radius-topright:20px;
  -webkit-border-top-right-radius:20px;
-webkit-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
		filter: drop-shadow(0 1px 2px rgba(0,0,0,.5));
}

.onefigure .tweetwrap img {
  margin:0;
  padding:0 5px 0 0;
  opacity:1;
-webkit-filter: drop-shadow(0 1px 2px rgba(255,255,255,.5));
		-moz-filter: drop-shadow(0 1px 2px rgba(255,255,255,.5));
		-ms-filter: drop-shadow(0 1px 2px rgba(255,255,255,.5));
		-o-filter: drop-shadow(0 1px 2px rgba(255,255,255,.5));
		filter: drop-shadow(0 1px 2px rgba(255,255,255,.5));  
}

.onefigure .tweetwrap img:hover {
  opacity:0.7
}




.onefigure .example-right {
  width: 270px;
  display: block;
  padding:0;
  margin:0 auto;
  position: relative;
	color:#fff;
	background:#dce8f4; /* default background for browsers without gradient support */
	/* css3 */
    background-color:#8ccbff;
	background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#8ccbff));
	background:-moz-linear-gradient(#2e88c4, #8ccbff);
	background:-o-linear-gradient(#2e88c4, #8ccbff);
	background:linear-gradient(#2e88c4, #8ccbff);
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
  box-shadow: 2px -2px 5px rgba(255,255,255,0.5);
  z-index:99999
}

.onefigure .example-right img {
  vertical-align: middle;
  padding: 0 5px 0 0;
  opacity:1
}
  

/* display of quote author (alternatively use a class on the element following the blockquote) */
.onefigure .example-right + p {margin:15px 0 2em 85px; font-style:italic;}

/* creates the triangle */
.onefigure .example-right:after {
	content:"";
	position:absolute;
	bottom:-50px;
	left:50px;
	border-width:0 20px 50px 0px;
	border-style:solid;
	border-color:transparent #8ccbff;
    /* reduce the damage in FF3.0 */
    display:block; 
    width:0;
}

.onefigure .oval-thought {
	position:relative;
	width:90%;
	padding:5%;
	margin:0 auto;
	text-align:center;
	color:#fff; 
}

.onefigure .spacer {
  display:block;
  height:20px
}

.onefigure .mainholder {
  display:block;
  height:100%;
  margin:0 0 20px 0;
  width:100%
}
.onefigure .venue {
	margin-top: 35px;}

.onefigure h1 {
  font: 460% 'BenchNine', sans-serif;
  color: #fef7ef;
  opacity: 0.7;
  font-weight: 700;
  margin:0;
  text-shadow:1px 1px 3px rgba(135,121,111,0.4);
  text-transform: uppercase
}
.onefigure h1 span {
  font: 95% 'Merienda', cursive;
  color: #1d3f5f;
  text-transform:lowercase;
  text-shadow:0;
  opacity:0.8;
  margin:-15px 0 0 0
}
.[[ARTILCE_PATHNAME]] h1 img {
  padding:0;
  margin:0 -10px 0 0
}

@media screen and (min-width:0px) and (max-width:700px) {
  .onefigure h1 {
    margin:0 0 0 -20px;
    font:400% 'BenchNine', sans-serif;
  }
}

.onefigure h2 {
  font: 120% 'Monda', sans-serif;
  color: #fff;
  text-transform: lowercase;
  font-weight: 700;
  margin: -20px 0 0 30px;
  text-shadow:0px 0px 3px rgba(0,0,0,0.5);
  opacity:0.8
}
.onefigure h2 span {
  color:#000;
  font-weight:700
}

@media screen and (min-width:0px) and (max-width:700px) {
  .onefigure h2 {
    display:none
  }
}

.onefigure h3 {
  font: 100% 'Monda', sans-serif;
  color: #031634;
  text-transform: lowercase;
  font-weight: 600;
  margin: 0;
  padding: 0;
}

.onefigure h4 {
  font: 80% Arial;
  color: #fff;
  text-transform: lowercase;
  font-weight: 400;
  margin: 0;
  padding: 0;
}
 /* CSS */.justifiedarticlesnolines p {text-indent:0;margin:0 0 5px 0}
.justifiedarticlesnolines p.credits {text-indent:0;text-align:left;color:grey;font-size:90%;margin:40px 0 0 0}
.justifiedarticlesnolines.iphone  h1 {font:40px Arial;color:#000;font-weight:400;margin:-20px 0 0 80px;padding:0}
.justifiedarticlesnolines  h1 {font:60px Arial;color:#000;font-weight:400;margin:-20px 0 0 80px;padding:0}
.justifiedarticlesnolines  h1 span {color:rgba(0,135,186,1)}
.justifiedarticlesnolines .arrow {position:relative;top:20px;width:0px;height:0px;border-bottom:35px solid transparent;border-top:35px solid transparent; border-left:35px solid rgba(195,217,65,1);font-size:0px;line-height:0px}
.justifiedarticlesnolines.w2 h2, .justifiedarticlesnolines.w1 h2 {font:25px Arial;color:#000;font-weight:300;margin:-5px 0 0 40px;padding:0}
.justifiedarticlesnolines.iphone h2 {font:20px Arial;color:#000;font-weight:300;margin:-5px 0 0 40px;padding:0}
.justifiedarticlesnolines h2 {font:40px Arial;color:#000;font-weight:300;margin:-5px 0 0 40px;padding:0}
.justifiedarticlesnolines h2 span {color:rgba(0,135,186,1)}
.justifiedarticlesnolines .titlearea {font-size:14px;color:rgba(138,158,163,1);margin:10px 0 0 20px}
.justifiedarticlesnolines .titleauthor {text-align:right;margin:10px 20px 20px 0;font:14px Calibri;color:#333}
.justifiedarticlesnolines .titleauthor span {color:rgba(0,70,127,1);text-transform:uppercase;font-style:italic}
.justifiedarticlesnolines .question {color:rgba(98,171,168,1);text-transform:uppercase;margin:10px 0 0 0;text-indent:0;text-align:left}
.justifiedarticlesnolines h3 {font:18px;color:rgba(232,108,76,1);text-transform:uppercase;margin:20px 0 0 0px;font-weight:500;font-style:italic}
.justifiedarticlesnolines .pullquote {font:20px Georgia;color:#333;font-style:italic;padding:0 0 0 30px;margin:0;text-align:left;display:block}
.justifiedarticlesnolines .quotewho {font:10px;font-style:italic;color:grey;text-align:left;display:block;text-align:right;margin:10px 0 0 0}
.justifiedarticlesnolines .takeaway {background:rgba(0,84,36,1);padding:15px 0 15px 0;margin:0 0 0 20px;display:block}
.justifiedarticlesnolines .takeaway h4 {margin:10px 0 0 40px;padding:0 0 0 20px;background:rgba(120,192,127,1);color:#fff;font:21px Arial;text-transform:uppercase;font-weight:100;letter-spacing:1px;line-height:26px}
.justifiedarticlesnolines .takeaway ul li {list-style-type:disk;margin:5px 10px 0 40px;padding:0}
.justifiedarticlesnolines .takeaway li {font:14px Tahoma;color:#fff;line-height:16px;letter-spacing:1px}


.justifiedarticlesnolines p.no-indent {
       text-indent : 0px;
}

.justifiedarticlesnolines span.drop-cap {
       font-size : 4.693em;
       float : left;
       line-height : 1;
       margin-top : -0.07em;
       margin-right : 0.05em;
       margin-bottom : -0.204em;
       font-family : "Oswald", sans-serif;
       font-stretch : ultra-condensed;
       font-weight : normal;
       font-style : normal;
 	   color:rgba(232,106,76,1)
}
 .figurepages {
  background: #174472;}

.marketplaceWrapper {
  padding-left: 15px;}
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.mastheadcover {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .mastheadcover.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .mastheadcover.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .mastheadcover.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .mastheadcover.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .mastheadcover.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .mastheadcover.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.mastheadcover.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.mastheadcover.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.mastheadcover.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.mastheadcover.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/mastheadcover/ipad_land.png") center center no-repeat;}
 .theMasthead h3 {
  margin-top: 15px;
  text-decoration: underline;
  text-transform: uppercase;
}

.theMasthead img, .theMasthead p, .theMasthead h1, .theMasthead h2, .theMasthead h3, .theMasthead h4, .theMasthead h5 {
    padding-left: 0;
    text-indent: 0;
    text-align: left;
}

.theMasthead {
  background: #e5e9eb;
  padding: 10px;
}

.theMasthead p {
  font-size: 11px;
  line-height: 15px;
  text-indent: 0 !important;
}

.masthead p {
	font-family : Palatino, serif;
	font-weight : normal;
	font-style : normal;
	text-decoration : none;
	font-variant : normal;
	text-align : left;
	color : #000000;
	text-indent : 12px;
/*	margin : 0px;
    padding: 0px !important; */
}

.masthead p.no-indent {
	text-indent : 0px;
}

.masthead span.drop-cap {
	font-size : 4.693em;
	float : left;
	line-height : 1;
	margin-top : -0.07em;
	margin-right : 0.05em;
	margin-bottom : -0.204em;
	font-family : "Oswald", sans-serif;
	font-stretch : ultra-condensed;
	font-weight : normal;
	font-style : normal;
}


.masthead div.masthead-back {
  width: 340px;
  margin-left: -20px;
  height: 100%;
  background-color: #e5e9eb;
  position:absolute;
  margin-left:-32px;
}

.masthead div.firstPersonHead {
  width: 100%;
  height: 70px;
  padding-left: 20px;
  margin-left: 308px;
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 0px;
  margin-bottom: 0px;
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/masthead/tripledots.png") top left repeat-x;
  position: relative;
}

.masthead.no-page-1 div.firstPersonHead,
.masthead.page-2 div.firstPersonHead {
  margin-left: 0px;
}

.masthead div.firstPersonHead img {
  vertical-align: top;
}

.masthead span.firstPersonTitle {
  font-size: 2em;
  font-family: "Oswald", sans-serif;
  font-weight: bold;
  background-color: #fff;
  margin-top: 28px;
  float: left;
  margin-right: 6px;
}

.grid.masthead div.title {
  top: 90px;
}

.masthead .title {
  font-size: 1.3em;
  font-family: "Oswald", sans-serif;
  font-weight: bold;
  padding-bottom: 10px;
}

.grid.masthead div.column {
  top: 90px;
  bottom: 30px; }
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.inarticleads {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .inarticleads.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .inarticleads.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .inarticleads.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .inarticleads.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .inarticleads.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .inarticleads.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.inarticleads.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.inarticleads.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.inarticleads.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.inarticleads.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/inarticleads/ipad_land.png") center center no-repeat;}
 /* CSS */.bannerad p {text-indent:0;margin:0 0 5px 0}
.bannerad p.credits {text-indent:0;text-align:left;color:grey;font-size:90%;margin:40px 0 0 0}
.bannerad  h1 {font-size:44px;color:#000;font-weight:600}
.bannerad  h1 span {color:rgba(0,174,239,1)}
.bannerad .titlearea {font-size:14px;color:rgba(138,158,163,1);margin:10px 0 0 0}
.bannerad .titleauthor {text-align:right;margin:10px 20px 20px 0;font:14px Calibri;color:#333}
.bannerad .titleauthor span {color:rgba(0,70,127,1);text-transform:uppercase;font-style:italic}
.bannerad .question {color:rgba(0,93,166,1);text-transform:uppercase;margin:10px 0 0 0;text-indent:0;text-align:left;font-size:90%}
.bannerad ul, ol {list-style-position:inside;color:rgba(0,135,186,1)}
.bannerad ol li p, ul li p {color:#000;text-indent:0;font-size:100%}
.bannerad ul li {list-style-type:disc}
.bannerad h3 {font:18px;color:rgba(232,108,76,1);text-transform:uppercase;margin:20px 0 0 0px;font-weight:500;font-style:italic}
.bannerad .pullquote {font:24px Georgia;color:#333;font-style:italic; padding-left: 20px; margin-bottom: 20px;}
.bannerad .takeaway {background:rgba(0,118,194,1);padding:15px 0 15px 0;margin:0 0 0 20px;display:block}
.bannerad .takeaway h4 {margin:10px 0 0 40px;padding:0 0 0 20px;background:rgba(247,143,37,1);color:#fff;font:21px Arial;text-transform:uppercase;font-weight:100;letter-spacing:1px;line-height:26px}
.bannerad .takeaway ul li {list-style-type:disk;margin:5px 10px 0 40px;padding:0}
.bannerad .takeaway li {font:14px Tahoma;color:#fff;line-height:16px;letter-spacing:1px}


.bannerad p.no-indent {
       text-indent : 0px;
}

.bannerad span.drop-cap {
       font-size : 4.693em;
       float : left;
       line-height : 1;
       margin-top : -0.07em;
       margin-right : 0.05em;
       margin-bottom : -0.204em;
       font-family : "Oswald", sans-serif;
       font-stretch : ultra-condensed;
       font-weight : normal;
       font-style : normal;
 	   color:rgba(232,106,76,1)
}
 /* CSS *//***********************/
/***   CORE Styles   ***/
/***********************/

.lb_webpage {
  background: #fff url("{}") center center repeat;
  background-size: cover;}

.lb_webpage p, .lb_webpage h1 {
  	text-indent: 10px;
  	text-align: justify;
  color: #333}

.lb_webpage.iphone p {
  text-align: justify;
  text-indent:10px;
  margin:0 5px 10px 25px
}

.lb_webpage h1, .lb_webpage h2, .lb_webpage h3, .lb_webpage li {
  	color: #333;}

.lb_webpage ul, .lb_webpage ol {
  	padding-left: 20px;
  	list-style: inside;}

.lb_webpage ol {
	padding-bottom: 10px;}

.lb_webpage .myWrapper {
	margin-bottom: 25px;
	top: 30px;}

/* iPhone */
.lb_webpage.iphone .myWrapper {
	top: 30px;
	margin-bottom: 0;
	}

.lb_webpage .header {
	position: absolute;
	height: 45px;
  	width: 110%;
	top: 0;
	left: -32px;
	padding-left: 75px;
    background: #efefef);
  	background: -webkit-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  	box-shadow: 0 1px 5px #000;
	z-index: 2;}

/* iPhone */
.lb_webpage.iphone .header {
	height: 25px;
	padding-top: 15px;
	padding-left: 50px;
	box-shadow: 0 1px 5px #000;}

.lb_webpage .header h1 {
  position: relative;
  top: 12px;
  color: red;
  font-weight: normal;
  left: -5px;}

.lb_webpage.iphone .header h1 {
  top:0;
  left:25px
}

.lb_webpage .header h1 .arrows {
  font-size: 125%;
  font-weight: normal;}

.lb_webpage .ad1 {
	position: absolute;
	top: 5px;
	right: 32px;
  	width: 288px;
  	height: 29px;
	background: #000;
	color: #fff;
	z-index: 5;
	padding-top: 6px;
	text-align: center;}

.lb_webpage .ad2 {
	position: absolute;
	top: 5px;
	right: 340px;
  	width: 288px;
  	height: 29px;
	background: #6d6d6d;
	color: #fff;
	z-index: 5;
	padding-top: 6px;
	text-align: center;}

.lb_webpage .ad3 {
	position: absolute;
	top: 5px;
	right: 648px;
  	width: 288px;
  	height: 29px;
	background: #a0a0a0;
	color: #fff;
	z-index: 5;
	padding-top: 6px;
	text-align: center;}

.lb_webpage .footer {
	position: absolute;
	height: 40px;
  	width: 110%;
	bottom: 0;
	left: -32px;
	padding-left: 75px;}

.lb_webpage .magTitle {
    display: block;
    position: absolute;
  	right: 32px;
  	bottom: 10px;
	font-size: 110%;
	font-weight: normal;
	border-top: 1px solid #e2e2e2;
	border-bottom: 1px solid #e2e2e2;
	color: #d6d6d6;}

.lb_webpage .sidebar {
	position: absolute;
	background: -webkit-linear-gradient(left, #ff0000 20%, #f40000 50%, #ff0000);
	height: 100%;
  	width: 32px;
	top: 0;
  	left: 0;
    box-shadow: 1px 0 5px #000;
	z-index: 2;}

.lb_webpage .sidebarConnector {
    position: absolute;
    background: red;
    height: 55px;
    width: 32px;
    top: 0;
    left: 0;
	z-index: 1;}

.lb_webpage .sidebarContent {
	position:absolute;
    width: 300px;
    top: 144px;
  	left: -130px;
	transform:rotate(-90deg);
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
	z-index: 4;
	color: #fff;
	text-align: right;
	height: 32px;}

.lb_webpage .column:not(.c1) p {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/lb_webpage/505050_25percent.png") repeat-y top left;}

.lb_webpage .floatL {
	float: left;}

.lb_webpage .floatR {
	float: right;}

.lb_webpage .clearB {
	clear: both;}

.lb_webpage .pullquote {
	font-size: 20px;
	color: #999;
	font-style: italic;
	padding: 20px;
	line-height: normal;} /***********************/
/***   CORE Styles   ***/
/***********************/

/* Paragraph indentation */
.imagemapads p {
  text-indent: 15px;
  text-align: left}

/* Give last paragraph in a section bottom padding before the ensuing subheader */
.imagemapads .section p:last-of-type {
  padding-bottom: 16px;}

/* Subheader default margin removal */
.imagemapads h3 {
  margin: 0;}

/* Subheader non bold and italicized */
.imagemapads h3.mild {
  font-weight: normal;
  font-style: italic;}

/* Subheader adjustments on iPhone */
.imagemapads.iphone h3 {
  padding-left: 20px;}

/* Paragraph indentation for paragraphs immediately following a subheader */
.imagemapads .keeptogether + p, .imagemapads p.hyperlink {
  text-indent: 0;}

/* Hyperlink padding */
.imagemapads p.hyperlink {
  padding-bottom: 0;
  padding-top: 16px;}

/* Lines between columns - change .png file to your liking */
.imagemapads .column:not(.c1) p, .imagemapads .column:not(.c1) ul, .imagemapads .column:not(.c1) h3 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/c7c7c7.png") repeat-y top left;}

/* Background image for all article pages */
.imagemapads {
  background: #fff url("{}") center center repeat;
  background-size: cover;}

/* Colorbox caption/title area background */
#cboxTitle {
  background: #fff;}

/* On page caption indentations */
p.caption {
  text-indent: 0;
  margin-bottom: 10px;}

/* On page caption indentations adjustments for iPhone */
.iphone p.caption {
  padding-left: 0;
  width: 280px;}

/*
.imagemapads p, .imagemapads h1 {
  text-indent: 0;
  text-align: left;
  color: #333}*/

/* Font color for article */
.imagemapads p, .imagemapads h1, .imagemapads h2, .imagemapads h3, .imagemapads h4, .imagemapads li {
  color: #333;}

/* Positioning for list items */
.imagemapads ul, .imagemapads ol {
  padding-left: 20px;
  list-style: inside;}

/* Bottom padding for lists */
.imagemapads ol, .imagemapads ul {
  padding-bottom: 10px;}

/* Positioning for wrapper to accomodate for sizes of header/footer */
.imagemapads .myWrapper {
  margin-bottom: 25px;
  top: 30px;}

/* iPhone wrapper positioning */
.imagemapads.iphone .myWrapper {
  top: 17px;
  margin-bottom: 3px;
  margin-left: 17px;}

.imagemapads.iphone .myWrapper .container {
  margin-left: 18px;}

.imagemapads .myWrapper iframe {
  padding-left: 20px;}

.imagemapads.iphone .myWrapper iframe {
  padding-left: 0;}

/* Header attributes */
.imagemapads .header {
  position: absolute;
  height: 45px;
  width: 110%;
  top: 0;
  left: -32px;
  padding-left: 75px;
  background: #efefef);
  background: -webkit-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -moz-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -o-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -ms-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f0f0f0',endColorstr='#f9f9f9');
  box-shadow: 0 1px 5px #000;
  z-index: 2;}

/* iPhone header attributes */
.imagemapads.iphone .header {
  height: 30px;
  padding-top: 10px;
  padding-left: 67px;
  box-shadow: 0 1px 5px #000;}

/* h1 tag in header attributes */
.imagemapads .header h1 {
  position: relative;
  top: 12px;
  color: #000;
  font-weight: normal;
  left: -5px;}

/* iPhone h1 tag in header attributes */
.imagemapads.iphone .header h1 {
  font-size: 14px;}

/* Arrow attributes in front of h1 tag in header */
.imagemapads .header h1 .arrows {
  font-size: 125%;
  font-weight: normal;}

/* Footer attributes */
.imagemapads .footer {
  position: absolute;
  height: 40px;
  width: 110%;
  bottom: 0;
  left: -32px;
  padding-left: 75px;
  background: #efefef);
  background: -webkit-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -moz-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -o-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: -ms-linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  background: linear-gradient(top, #f9f9f9 20%, #f0f0f0 50%, #f9f9f9);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f0f0f0',endColorstr='#f9f9f9');
  box-shadow: 0 1px 5px #000;
  z-index: 2;}

/* MagTitle (overlays on top of footer) attributes */
.imagemapads .magTitle {
  display: block;
  position: absolute;
  right: 32px;
  bottom: 5px;
  z-index: 4;}

/* iPhone magTitle (overlays on top of footer) attributes */
.imagemapads.iphone .magTitle {
  right: 5px;}

/* MagTitle image (overlays on top of footer) attributes */
.imagemapads .magTitle img {
  padding-top: 5px;}

/* Sidebar attributes */
.imagemapads .sidebar {
  position: absolute;
  background: -webkit-linear-gradient(left, #939498 20%, #aaaaaa 50%, #939498);
  background: -moz-linear-gradient(left, #939498 20%, #aaaaaa 50%, #939498);
  background: -o-linear-gradient(left, #939498 20%, #aaaaaa 50%, #939498);
  background: -ms-linear-gradient(left, #939498 20%, #aaaaaa 50%, #939498);
  background: linear-gradient(left, #939498 20%, #aaaaaa 50%, #939498);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#aaaaaa',endColorstr='#939498');
  height: 100%;
  width: 32px;
  top: 0;
  left: 0;
  box-shadow: 1px 0 5px #000;
  z-index: 3;}

/* Sidebar Connector used only for box shadow purposes if you don't want the sidebar shadow to cover the header */
.imagemapads .sidebarConnector {
  position: absolute;
  background: red;
  height: 55px;
  width: 32px;
  top: 0;
  left: 0;
  z-index: 1;}

/* Positioning for the content text on the sidebar */
.imagemapads .sidebarContent {
  position:absolute;
  width: 300px;
  top: 144px;
  left: -130px;
  transform:rotate(-90deg);
  -ms-transform:rotate(-90deg); /* IE 9 */
  -moz-transform:rotate(-90deg); /* Firefox */
  -webkit-transform:rotate(-90deg); /* Safari and Chrome */
  -o-transform:rotate(-90deg); /* Opera */
  z-index: 5;
  color: #fff;
  text-align: right;
  height: 32px;}

/* Float left style */
.imagemapads .floatL {
  float: left;}

/* Float right style */
.imagemapads .floatR {
  float: right;}

/* Clear floats (both left and right) */
.imagemapads .clearB {
  clear: both;}

/* Pullquote attributes */
.imagemapads .pullquote {
  font-size: 20px;
  color: #999;
  font-style: italic;
  padding: 20px;
  line-height: normal;}

/* iPhone portrait image width adjustment */
.imagemapads.iphone .container {
  width: 280px;}

/* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.imagemapads.grid.page-1 {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .imagemapads.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/iphone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .imagemapads.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_port.jpg") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .imagemapads.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/iphone_port.jpg") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .imagemapads.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_land.jpg") center center no-repeat;
  background-size: contain;}
}

/* 3-column */
.no-mobile .imagemapads.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_land.jpg") center center no-repeat;
  background-size: contain;}

/* 4-column */
.no-mobile .imagemapads.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_land.jpg") center center no-repeat;
  background-size: contain;}

/* iPhone vertical */
.imagemapads.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/iphone_port.jpg") center center no-repeat;
  background-size: contain;}

/* iPhone horizontal */
.imagemapads.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/iphone_land.jpg") center center no-repeat;
  background-size: contain;}

/* iPad vertical */
.imagemapads.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_port.jpg") center center no-repeat;
  background-size: contain;}

/* iPad horizontal */
.imagemapads.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/imagemapads/ipad_land.jpg") center center no-repeat;
  background-size: contain;}
/* GradientType=0 is top to bottom */
/* GradientType=1 is left to right */

/* Sidebar color */
.imagemapads .sidebar {
  position: absolute;
  background: -webkit-linear-gradient(left, #d12229 20%, #eb262e 50%, #d12229);
  background: -moz-linear-gradient(left, #d12229 20%, #eb262e 50%, #d12229);
  background: -o-linear-gradient(left, #d12229 20%, #eb262e 50%, #d12229);
  background: -ms-linear-gradient(left, #d12229 20%, #eb262e 50%, #d12229);
  background: linear-gradient(left, #d12229 20%, #eb262e 50%, #d12229);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#eb262e',endColorstr='#d12229');}

/* h1 tag color in header */
.imagemapads .header h1 {
  color: #d12229;}

/* MagTitle position for when using images instead of text */
.imagemapads .magTitle {
  bottom: -2px;} /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.video {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .video.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .video.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .video.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .video.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .video.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .video.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.video.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.video.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.video.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.video.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/video/ipad_land.png") center center no-repeat;}
 .videoad.page-1 {
  /*background: #011724;*/
  background: inherit; }

.videoad.page-1 .column {
  position: absolute;
  left: -100%; }

.videoad.page-1 p {
  text-align: left;
  text-indent: 0;
  padding: 0;
  line-height: 1.5em;
  margin-bottom: 1em;
  color: #000; }

/*.videoad.page-1 .wrapper {*/
/*border: 1px solid blue;}*/
.videoad.page-1 .tableSim {
  display: table;
  width: 100%;
  height: 100%; }

.videoad.page-1 .tableRowSim {
  display: table-row; }

.videoad.page-1 .tableCellSim {
  display: table-cell;
  vertical-align: middle; }

.videoad.page-1 {
  background: white url("http://read.nxtbook.com/best-of/ubiquity/vol1/videoad/BG.jpg") right center no-repeat;
  background-size: cover; }

.videoad.page-1 .tableRowSim {
  height: 15%; }

.videoad.page-1 .tableCellSim {
  padding: 0 10px;
  vertical-align: middle;
  text-align: center; }

.videoad.page-1 .tableCellSim img, .videoad.page-1 .tableCellSim video {
  /*max-height: 33%;*/
  max-width: 100%;
  text-align: center; }

.videoad.page-1 .contentArea {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 10px; }

.videoad.page-1 .phoneemail:first-of-type {
  margin-right: 10px; }
 /* ////////////////////////////////////////////////////////////
// Media Queries for 1-column and 2-column
//////////////////////////////////////////////////////////// */

.grid.futureconcepts {
  background-color: transparent;
}

@media screen and (min-height:700px) {
/* 1-column */
.no-mobile .futureconcepts.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .futureconcepts.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/ipad_port.png") center center no-repeat;
  background-size: contain;}
}

@media screen and (max-height:699px) {
/* 1-column */
.no-mobile .futureconcepts.w1.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/iphone_port.png") center center no-repeat;
  background-size: contain;}

/* 2-column */
.no-mobile .futureconcepts.w2.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/iphone_land.png") center center no-repeat;
  background-size: contain;}
}

/* ////////////////////////////////////////////////////////////
// 3-column
//////////////////////////////////////////////////////////// */
.no-mobile .futureconcepts.w3.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// 4-column
//////////////////////////////////////////////////////////// */
.no-mobile .futureconcepts.w4.page-1 .wrapper {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/ipad_land.png") center center no-repeat;
  background-size: contain;}

/* ////////////////////////////////////////////////////////////
// iPhone vertical
//////////////////////////////////////////////////////////// */
.futureconcepts.iphone.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/iphone_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPhone horizontal
//////////////////////////////////////////////////////////// */
.futureconcepts.iphone.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/iphone_land.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad vertical
//////////////////////////////////////////////////////////// */
.futureconcepts.ipad.vertical.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/ipad_port.png") center center no-repeat;}

/* ////////////////////////////////////////////////////////////
// iPad horizontal
//////////////////////////////////////////////////////////// */
.futureconcepts.ipad.horizontal.page-1 {
  background: url("http://read.nxtbook.com/best-of/ubiquity/vol1/futureconcepts/ipad_land.png") center center no-repeat;}
 .sneakpeakcover .myAdFullPagesneakpeakcover {
  position: absolute;
  z-index: 999;
  left:0;
  width:100%;
  margin:0 auto;
  height:100%;
  background: #fff;
  padding:0%;
  text-align: center;}

.sneakpeakcover .sponsorship {
  position:absolute;
  top:0px;
  display: block;
  color:#fff;
  background:#000;
  width:100%;
  z-index:1000;
  text-align:center;
  padding-top:20px;}

.sneakpeakcover .iPhone .myAdFullPagesneakpeakcover {
  top:68px;
}
.sneakpeakcover .iPad .myAdFullPagesneakpeakcover {
  top:68px;
}

.sneakpeakcover .iPod .myAdFullPagesneakpeakcover {
  top:68px;
}

.sneakpeakcover .backPage {
  position:absolute;
  bottom:-5px;
  left:5px;
  cursor: pointer;
  z-index: 1000;}

.sneakpeakcover .nextPage {
  position:absolute;
  bottom:-5px;
  right:5px;
  cursor: pointer;
  z-index: 1000;}

.sneakpeakcover .header {
  background:#000;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index: 1000;
  padding-top:50px;}

.sneakpeakcover .iframeWrappersneakpeakcover {
  overflow:auto;
  -webkit-overflow-scrolling: touch !important;
  height:95%;}

.sneakpeakcover.iphone.horizontal .iframeWrappersneakpeakcover {
  height:82%;}

.sneakpeakcover.iphone.vertical .iframeWrappersneakpeakcover {
  height:88%;}

.sneakpeakcover .footer {
  height:50px;
  background:#000;
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  z-index: 1000;}


/*
Animate.css - http://daneden.me/animate
Licensed under the ☺ license (http://licence.visualidiot.com/)

Copyright (c) 2012 Dan Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
body {
  /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */
  -webkit-backface-visibility: hidden; }

.animated {
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both; }

.animated.hinge {
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -o-animation-duration: 2s;
  animation-duration: 2s; }

@-webkit-keyframes flash {
  0%, 50%, 100% {
    opacity: 1; }

  25%, 75% {
    opacity: 0; } }

@-moz-keyframes flash {
  0%, 50%, 100% {
    opacity: 1; }

  25%, 75% {
    opacity: 0; } }

@-o-keyframes flash {
  0%, 50%, 100% {
    opacity: 1; }

  25%, 75% {
    opacity: 0; } }

@keyframes flash {
  0%, 50%, 100% {
    opacity: 1; }

  25%, 75% {
    opacity: 0; } }

.flash {
  -webkit-animation-name: flash;
  -moz-animation-name: flash;
  -o-animation-name: flash;
  animation-name: flash; }

@-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; }

@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0); }

  40% {
    -webkit-transform: translateY(-30px); }

  60% {
    -webkit-transform: translateY(-15px); } }

@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0); }

  40% {
    -moz-transform: translateY(-30px); }

  60% {
    -moz-transform: translateY(-15px); } }

@-o-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -o-transform: translateY(0); }

  40% {
    -o-transform: translateY(-30px); }

  60% {
    -o-transform: translateY(-15px); } }

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0); }

  40% {
    transform: translateY(-30px); }

  60% {
    transform: translateY(-15px); } }

.bounce {
  -webkit-animation-name: bounce;
  -moz-animation-name: bounce;
  -o-animation-name: bounce;
  animation-name: bounce; }

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale(1); }

  10%, 20% {
    -webkit-transform: scale(0.9) rotate(-3deg); }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale(1.1) rotate(3deg); }

  40%, 60%, 80% {
    -webkit-transform: scale(1.1) rotate(-3deg); }

  100% {
    -webkit-transform: scale(1) rotate(0); } }

@-moz-keyframes tada {
  0% {
    -moz-transform: scale(1); }

  10%, 20% {
    -moz-transform: scale(0.9) rotate(-3deg); }

  30%, 50%, 70%, 90% {
    -moz-transform: scale(1.1) rotate(3deg); }

  40%, 60%, 80% {
    -moz-transform: scale(1.1) rotate(-3deg); }

  100% {
    -moz-transform: scale(1) rotate(0); } }

@-o-keyframes tada {
  0% {
    -o-transform: scale(1); }

  10%, 20% {
    -o-transform: scale(0.9) rotate(-3deg); }

  30%, 50%, 70%, 90% {
    -o-transform: scale(1.1) rotate(3deg); }

  40%, 60%, 80% {
    -o-transform: scale(1.1) rotate(-3deg); }

  100% {
    -o-transform: scale(1) rotate(0); } }

@keyframes tada {
  0% {
    transform: scale(1); }

  10%, 20% {
    transform: scale(0.9) rotate(-3deg); }

  30%, 50%, 70%, 90% {
    transform: scale(1.1) rotate(3deg); }

  40%, 60%, 80% {
    transform: scale(1.1) rotate(-3deg); }

  100% {
    transform: scale(1) rotate(0); } }

.tada {
  -webkit-animation-name: tada;
  -moz-animation-name: tada;
  -o-animation-name: tada;
  animation-name: tada; }

@-webkit-keyframes swing {
  20%, 40%, 60%, 80%, 100% {
    -webkit-transform-origin: top center; }

  20% {
    -webkit-transform: rotate(15deg); }

  40% {
    -webkit-transform: rotate(-10deg); }

  60% {
    -webkit-transform: rotate(5deg); }

  80% {
    -webkit-transform: rotate(-5deg); }

  100% {
    -webkit-transform: rotate(0deg); } }

@-moz-keyframes swing {
  20% {
    -moz-transform: rotate(15deg); }

  40% {
    -moz-transform: rotate(-10deg); }

  60% {
    -moz-transform: rotate(5deg); }

  80% {
    -moz-transform: rotate(-5deg); }

  100% {
    -moz-transform: rotate(0deg); } }

@-o-keyframes swing {
  20% {
    -o-transform: rotate(15deg); }

  40% {
    -o-transform: rotate(-10deg); }

  60% {
    -o-transform: rotate(5deg); }

  80% {
    -o-transform: rotate(-5deg); }

  100% {
    -o-transform: rotate(0deg); } }

@keyframes swing {
  20% {
    transform: rotate(15deg); }

  40% {
    transform: rotate(-10deg); }

  60% {
    transform: rotate(5deg); }

  80% {
    transform: rotate(-5deg); }

  100% {
    transform: rotate(0deg); } }

.swing {
  -webkit-transform-origin: top center;
  -moz-transform-origin: top center;
  -o-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  -moz-animation-name: swing;
  -o-animation-name: swing;
  animation-name: swing; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  0% {
    -webkit-transform: translateX(0%); }

  15% {
    -webkit-transform: translateX(-25%) rotate(-5deg); }

  30% {
    -webkit-transform: translateX(20%) rotate(3deg); }

  45% {
    -webkit-transform: translateX(-15%) rotate(-3deg); }

  60% {
    -webkit-transform: translateX(10%) rotate(2deg); }

  75% {
    -webkit-transform: translateX(-5%) rotate(-1deg); }

  100% {
    -webkit-transform: translateX(0%); } }

@-moz-keyframes wobble {
  0% {
    -moz-transform: translateX(0%); }

  15% {
    -moz-transform: translateX(-25%) rotate(-5deg); }

  30% {
    -moz-transform: translateX(20%) rotate(3deg); }

  45% {
    -moz-transform: translateX(-15%) rotate(-3deg); }

  60% {
    -moz-transform: translateX(10%) rotate(2deg); }

  75% {
    -moz-transform: translateX(-5%) rotate(-1deg); }

  100% {
    -moz-transform: translateX(0%); } }

@-o-keyframes wobble {
  0% {
    -o-transform: translateX(0%); }

  15% {
    -o-transform: translateX(-25%) rotate(-5deg); }

  30% {
    -o-transform: translateX(20%) rotate(3deg); }

  45% {
    -o-transform: translateX(-15%) rotate(-3deg); }

  60% {
    -o-transform: translateX(10%) rotate(2deg); }

  75% {
    -o-transform: translateX(-5%) rotate(-1deg); }

  100% {
    -o-transform: translateX(0%); } }

@keyframes wobble {
  0% {
    transform: translateX(0%); }

  15% {
    transform: translateX(-25%) rotate(-5deg); }

  30% {
    transform: translateX(20%) rotate(3deg); }

  45% {
    transform: translateX(-15%) rotate(-3deg); }

  60% {
    transform: translateX(10%) rotate(2deg); }

  75% {
    transform: translateX(-5%) rotate(-1deg); }

  100% {
    transform: translateX(0%); } }

.wobble {
  -webkit-animation-name: wobble;
  -moz-animation-name: wobble;
  -o-animation-name: wobble;
  animation-name: wobble; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1); }

  50% {
    -webkit-transform: scale(1.1); }

  100% {
    -webkit-transform: scale(1); } }

@-moz-keyframes pulse {
  0% {
    -moz-transform: scale(1); }

  50% {
    -moz-transform: scale(1.1); }

  100% {
    -moz-transform: scale(1); } }

@-o-keyframes pulse {
  0% {
    -o-transform: scale(1); }

  50% {
    -o-transform: scale(1.1); }

  100% {
    -o-transform: scale(1); } }

@keyframes pulse {
  0% {
    transform: scale(1); }

  50% {
    transform: scale(1.1); }

  100% {
    transform: scale(1); } }

.pulse {
  -webkit-animation-name: pulse;
  -moz-animation-name: pulse;
  -o-animation-name: pulse;
  animation-name: pulse; }

@-webkit-keyframes flip {
  0% {
    -webkit-transform: perspective(400px) rotateY(0);
    -webkit-animation-timing-function: ease-out; }

  40% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
    -webkit-animation-timing-function: ease-out; }

  50% {
    -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -webkit-animation-timing-function: ease-in; }

  80% {
    -webkit-transform: perspective(400px) rotateY(360deg) scale(0.95);
    -webkit-animation-timing-function: ease-in; }

  100% {
    -webkit-transform: perspective(400px) scale(1);
    -webkit-animation-timing-function: ease-in; } }

@-moz-keyframes flip {
  0% {
    -moz-transform: perspective(400px) rotateY(0);
    -moz-animation-timing-function: ease-out; }

  40% {
    -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);
    -moz-animation-timing-function: ease-out; }

  50% {
    -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -moz-animation-timing-function: ease-in; }

  80% {
    -moz-transform: perspective(400px) rotateY(360deg) scale(0.95);
    -moz-animation-timing-function: ease-in; }

  100% {
    -moz-transform: perspective(400px) scale(1);
    -moz-animation-timing-function: ease-in; } }

@-o-keyframes flip {
  0% {
    -o-transform: perspective(400px) rotateY(0);
    -o-animation-timing-function: ease-out; }

  40% {
    -o-transform: perspective(400px) translateZ(150px) rotateY(170deg);
    -o-animation-timing-function: ease-out; }

  50% {
    -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    -o-animation-timing-function: ease-in; }

  80% {
    -o-transform: perspective(400px) rotateY(360deg) scale(0.95);
    -o-animation-timing-function: ease-in; }

  100% {
    -o-transform: perspective(400px) scale(1);
    -o-animation-timing-function: ease-in; } }

@keyframes flip {
  0% {
    transform: perspective(400px) rotateY(0);
    animation-timing-function: ease-out; }

  40% {
    transform: perspective(400px) translateZ(150px) rotateY(170deg);
    animation-timing-function: ease-out; }

  50% {
    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
    animation-timing-function: ease-in; }

  80% {
    transform: perspective(400px) rotateY(360deg) scale(0.95);
    animation-timing-function: ease-in; }

  100% {
    transform: perspective(400px) scale(1);
    animation-timing-function: ease-in; } }

.flip {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flip;
  -moz-backface-visibility: visible !important;
  -moz-animation-name: flip;
  -o-backface-visibility: visible !important;
  -o-animation-name: flip;
  backface-visibility: visible !important;
  animation-name: flip; }

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    opacity: 0; }

  40% {
    -webkit-transform: perspective(400px) rotateX(-10deg); }

  70% {
    -webkit-transform: perspective(400px) rotateX(10deg); }

  100% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    opacity: 1; } }

@-moz-keyframes flipInX {
  0% {
    -moz-transform: perspective(400px) rotateX(90deg);
    opacity: 0; }

  40% {
    -moz-transform: perspective(400px) rotateX(-10deg); }

  70% {
    -moz-transform: perspective(400px) rotateX(10deg); }

  100% {
    -moz-transform: perspective(400px) rotateX(0deg);
    opacity: 1; } }

@-o-keyframes flipInX {
  0% {
    -o-transform: perspective(400px) rotateX(90deg);
    opacity: 0; }

  40% {
    -o-transform: perspective(400px) rotateX(-10deg); }

  70% {
    -o-transform: perspective(400px) rotateX(10deg); }

  100% {
    -o-transform: perspective(400px) rotateX(0deg);
    opacity: 1; } }

@keyframes flipInX {
  0% {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0; }

  40% {
    transform: perspective(400px) rotateX(-10deg); }

  70% {
    transform: perspective(400px) rotateX(10deg); }

  100% {
    transform: perspective(400px) rotateX(0deg);
    opacity: 1; } }

.flipInX {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  -moz-backface-visibility: visible !important;
  -moz-animation-name: flipInX;
  -o-backface-visibility: visible !important;
  -o-animation-name: flipInX;
  backface-visibility: visible !important;
  animation-name: flipInX; }

@-webkit-keyframes flipOutX {
  0% {
    -webkit-transform: perspective(400px) rotateX(0deg);
    opacity: 1; }

  100% {
    -webkit-transform: perspective(400px) rotateX(90deg);
    opacity: 0; } }

@-moz-keyframes flipOutX {
  0% {
    -moz-transform: perspective(400px) rotateX(0deg);
    opacity: 1; }

  100% {
    -moz-transform: perspective(400px) rotateX(90deg);
    opacity: 0; } }

@-o-keyframes flipOutX {
  0% {
    -o-transform: perspective(400px) rotateX(0deg);
    opacity: 1; }

  100% {
    -o-transform: perspective(400px) rotateX(90deg);
    opacity: 0; } }

@keyframes flipOutX {
  0% {
    transform: perspective(400px) rotateX(0deg);
    opacity: 1; }

  100% {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0; } }

.flipOutX {
  -webkit-animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  -moz-animation-name: flipOutX;
  -moz-backface-visibility: visible !important;
  -o-animation-name: flipOutX;
  -o-backface-visibility: visible !important;
  animation-name: flipOutX;
  backface-visibility: visible !important; }

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    opacity: 0; }

  40% {
    -webkit-transform: perspective(400px) rotateY(-10deg); }

  70% {
    -webkit-transform: perspective(400px) rotateY(10deg); }

  100% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    opacity: 1; } }

@-moz-keyframes flipInY {
  0% {
    -moz-transform: perspective(400px) rotateY(90deg);
    opacity: 0; }

  40% {
    -moz-transform: perspective(400px) rotateY(-10deg); }

  70% {
    -moz-transform: perspective(400px) rotateY(10deg); }

  100% {
    -moz-transform: perspective(400px) rotateY(0deg);
    opacity: 1; } }

@-o-keyframes flipInY {
  0% {
    -o-transform: perspective(400px) rotateY(90deg);
    opacity: 0; }

  40% {
    -o-transform: perspective(400px) rotateY(-10deg); }

  70% {
    -o-transform: perspective(400px) rotateY(10deg); }

  100% {
    -o-transform: perspective(400px) rotateY(0deg);
    opacity: 1; } }

@keyframes flipInY {
  0% {
    transform: perspective(400px) rotateY(90deg);
    opacity: 0; }

  40% {
    transform: perspective(400px) rotateY(-10deg); }

  70% {
    transform: perspective(400px) rotateY(10deg); }

  100% {
    transform: perspective(400px) rotateY(0deg);
    opacity: 1; } }

.flipInY {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  -moz-backface-visibility: visible !important;
  -moz-animation-name: flipInY;
  -o-backface-visibility: visible !important;
  -o-animation-name: flipInY;
  backface-visibility: visible !important;
  animation-name: flipInY; }

@-webkit-keyframes flipOutY {
  0% {
    -webkit-transform: perspective(400px) rotateY(0deg);
    opacity: 1; }

  100% {
    -webkit-transform: perspective(400px) rotateY(90deg);
    opacity: 0; } }

@-moz-keyframes flipOutY {
  0% {
    -moz-transform: perspective(400px) rotateY(0deg);
    opacity: 1; }

  100% {
    -moz-transform: perspective(400px) rotateY(90deg);
    opacity: 0; } }

@-o-keyframes flipOutY {
  0% {
    -o-transform: perspective(400px) rotateY(0deg);
    opacity: 1; }

  100% {
    -o-transform: perspective(400px) rotateY(90deg);
    opacity: 0; } }

@keyframes flipOutY {
  0% {
    transform: perspective(400px) rotateY(0deg);
    opacity: 1; }

  100% {
    transform: perspective(400px) rotateY(90deg);
    opacity: 0; } }

.flipOutY {
  -webkit-backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  -moz-backface-visibility: visible !important;
  -moz-animation-name: flipOutY;
  -o-backface-visibility: visible !important;
  -o-animation-name: flipOutY;
  backface-visibility: visible !important;
  animation-name: flipOutY; }

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-o-keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes fadeIn {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

.fadeIn {
  -webkit-animation-name: fadeIn;
  -moz-animation-name: fadeIn;
  -o-animation-name: fadeIn;
  animation-name: fadeIn; }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(20px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-o-keyframes fadeInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(20px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  -moz-animation-name: fadeInUp;
  -o-animation-name: fadeInUp;
  animation-name: fadeInUp; }

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-20px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-o-keyframes fadeInDown {
  0% {
    opacity: 0;
    -o-transform: translateY(-20px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  -moz-animation-name: fadeInDown;
  -o-animation-name: fadeInDown;
  animation-name: fadeInDown; }

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

@-o-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -o-transform: translateX(-20px); }

  100% {
    opacity: 1;
    -o-transform: translateX(0); } }

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-20px); }

  100% {
    opacity: 1;
    transform: translateX(0); } }

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  -moz-animation-name: fadeInLeft;
  -o-animation-name: fadeInLeft;
  animation-name: fadeInLeft; }

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(20px); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

@-o-keyframes fadeInRight {
  0% {
    opacity: 0;
    -o-transform: translateX(20px); }

  100% {
    opacity: 1;
    -o-transform: translateX(0); } }

@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(20px); }

  100% {
    opacity: 1;
    transform: translateX(0); } }

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  -moz-animation-name: fadeInRight;
  -o-animation-name: fadeInRight;
  animation-name: fadeInRight; }

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-o-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -o-transform: translateY(2000px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    transform: translateY(2000px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  -moz-animation-name: fadeInUpBig;
  -o-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig; }

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0); } }

@-moz-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }

  100% {
    opacity: 1;
    -moz-transform: translateY(0); } }

@-o-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -o-transform: translateY(-2000px); }

  100% {
    opacity: 1;
    -o-transform: translateY(0); } }

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }

  100% {
    opacity: 1;
    transform: translateY(0); } }

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  -moz-animation-name: fadeInDownBig;
  -o-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig; }

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

@-o-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -o-transform: translateX(-2000px); }

  100% {
    opacity: 1;
    -o-transform: translateX(0); } }

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }

  100% {
    opacity: 1;
    transform: translateX(0); } }

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  -moz-animation-name: fadeInLeftBig;
  -o-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig; }

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

@-o-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -o-transform: translateX(2000px); }

  100% {
    opacity: 1;
    -o-transform: translateX(0); } }

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    transform: translateX(2000px); }

  100% {
    opacity: 1;
    transform: translateX(0); } }

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  -moz-animation-name: fadeInRightBig;
  -o-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig; }

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-moz-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-o-keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@keyframes fadeOut {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

.fadeOut {
  -webkit-animation-name: fadeOut;
  -moz-animation-name: fadeOut;
  -o-animation-name: fadeOut;
  animation-name: fadeOut; }

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px); } }

@-moz-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -moz-transform: translateY(0); }

  100% {
    opacity: 0;
    -moz-transform: translateY(-20px); } }

@-o-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -o-transform: translateY(0); }

  100% {
    opacity: 0;
    -o-transform: translateY(-20px); } }

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    transform: translateY(0); }

  100% {
    opacity: 0;
    transform: translateY(-20px); } }

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  -moz-animation-name: fadeOutUp;
  -o-animation-name: fadeOutUp;
  animation-name: fadeOutUp; }

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px); } }

@-moz-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -moz-transform: translateY(0); }

  100% {
    opacity: 0;
    -moz-transform: translateY(20px); } }

@-o-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -o-transform: translateY(0); }

  100% {
    opacity: 0;
    -o-transform: translateY(20px); } }

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    transform: translateY(0); }

  100% {
    opacity: 0;
    transform: translateY(20px); } }

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  -moz-animation-name: fadeOutDown;
  -o-animation-name: fadeOutDown;
  animation-name: fadeOutDown; }

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px); } }

@-moz-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -moz-transform: translateX(0); }

  100% {
    opacity: 0;
    -moz-transform: translateX(-20px); } }

@-o-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -o-transform: translateX(0); }

  100% {
    opacity: 0;
    -o-transform: translateX(-20px); } }

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    transform: translateX(0); }

  100% {
    opacity: 0;
    transform: translateX(-20px); } }

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  -moz-animation-name: fadeOutLeft;
  -o-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft; }

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px); } }

@-moz-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -moz-transform: translateX(0); }

  100% {
    opacity: 0;
    -moz-transform: translateX(20px); } }

@-o-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -o-transform: translateX(0); }

  100% {
    opacity: 0;
    -o-transform: translateX(20px); } }

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    transform: translateX(0); }

  100% {
    opacity: 0;
    transform: translateX(20px); } }

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  -moz-animation-name: fadeOutRight;
  -o-animation-name: fadeOutRight;
  animation-name: fadeOutRight; }

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); } }

@-moz-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -moz-transform: translateY(0); }

  100% {
    opacity: 0;
    -moz-transform: translateY(-2000px); } }

@-o-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -o-transform: translateY(0); }

  100% {
    opacity: 0;
    -o-transform: translateY(-2000px); } }

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    transform: translateY(0); }

  100% {
    opacity: 0;
    transform: translateY(-2000px); } }

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  -moz-animation-name: fadeOutUpBig;
  -o-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig; }

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px); } }

@-moz-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -moz-transform: translateY(0); }

  100% {
    opacity: 0;
    -moz-transform: translateY(2000px); } }

@-o-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -o-transform: translateY(0); }

  100% {
    opacity: 0;
    -o-transform: translateY(2000px); } }

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    transform: translateY(0); }

  100% {
    opacity: 0;
    transform: translateY(2000px); } }

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  -moz-animation-name: fadeOutDownBig;
  -o-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig; }

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); } }

@-moz-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -moz-transform: translateX(0); }

  100% {
    opacity: 0;
    -moz-transform: translateX(-2000px); } }

@-o-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -o-transform: translateX(0); }

  100% {
    opacity: 0;
    -o-transform: translateX(-2000px); } }

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    transform: translateX(0); }

  100% {
    opacity: 0;
    transform: translateX(-2000px); } }

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  -moz-animation-name: fadeOutLeftBig;
  -o-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig; }

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px); } }

@-moz-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -moz-transform: translateX(0); }

  100% {
    opacity: 0;
    -moz-transform: translateX(2000px); } }

@-o-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -o-transform: translateX(0); }

  100% {
    opacity: 0;
    -o-transform: translateX(2000px); } }

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    transform: translateX(0); }

  100% {
    opacity: 0;
    transform: translateX(2000px); } }

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  -moz-animation-name: fadeOutRightBig;
  -o-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig; }

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.3); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05); }

  70% {
    -webkit-transform: scale(0.9); }

  100% {
    -webkit-transform: scale(1); } }

@-moz-keyframes bounceIn {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3); }

  50% {
    opacity: 1;
    -moz-transform: scale(1.05); }

  70% {
    -moz-transform: scale(0.9); }

  100% {
    -moz-transform: scale(1); } }

@-o-keyframes bounceIn {
  0% {
    opacity: 0;
    -o-transform: scale(0.3); }

  50% {
    opacity: 1;
    -o-transform: scale(1.05); }

  70% {
    -o-transform: scale(0.9); }

  100% {
    -o-transform: scale(1); } }

@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3); }

  50% {
    opacity: 1;
    transform: scale(1.05); }

  70% {
    transform: scale(0.9); }

  100% {
    transform: scale(1); } }

.bounceIn {
  -webkit-animation-name: bounceIn;
  -moz-animation-name: bounceIn;
  -o-animation-name: bounceIn;
  animation-name: bounceIn; }

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px); }

  80% {
    -webkit-transform: translateY(10px); }

  100% {
    -webkit-transform: translateY(0); } }

@-moz-keyframes bounceInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateY(-30px); }

  80% {
    -moz-transform: translateY(10px); }

  100% {
    -moz-transform: translateY(0); } }

@-o-keyframes bounceInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -o-transform: translateY(-30px); }

  80% {
    -o-transform: translateY(10px); }

  100% {
    -o-transform: translateY(0); } }

@keyframes bounceInUp {
  0% {
    opacity: 0;
    transform: translateY(2000px); }

  60% {
    opacity: 1;
    transform: translateY(-30px); }

  80% {
    transform: translateY(10px); }

  100% {
    transform: translateY(0); } }

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  -moz-animation-name: bounceInUp;
  -o-animation-name: bounceInUp;
  animation-name: bounceInUp; }

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px); }

  80% {
    -webkit-transform: translateY(-10px); }

  100% {
    -webkit-transform: translateY(0); } }

@-moz-keyframes bounceInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateY(30px); }

  80% {
    -moz-transform: translateY(-10px); }

  100% {
    -moz-transform: translateY(0); } }

@-o-keyframes bounceInDown {
  0% {
    opacity: 0;
    -o-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -o-transform: translateY(30px); }

  80% {
    -o-transform: translateY(-10px); }

  100% {
    -o-transform: translateY(0); } }

@keyframes bounceInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }

  60% {
    opacity: 1;
    transform: translateY(30px); }

  80% {
    transform: translateY(-10px); }

  100% {
    transform: translateY(0); } }

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  -moz-animation-name: bounceInDown;
  -o-animation-name: bounceInDown;
  animation-name: bounceInDown; }

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px); }

  80% {
    -webkit-transform: translateX(-10px); }

  100% {
    -webkit-transform: translateX(0); } }

@-moz-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateX(30px); }

  80% {
    -moz-transform: translateX(-10px); }

  100% {
    -moz-transform: translateX(0); } }

@-o-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -o-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -o-transform: translateX(30px); }

  80% {
    -o-transform: translateX(-10px); }

  100% {
    -o-transform: translateX(0); } }

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }

  60% {
    opacity: 1;
    transform: translateX(30px); }

  80% {
    transform: translateX(-10px); }

  100% {
    transform: translateX(0); } }

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  -moz-animation-name: bounceInLeft;
  -o-animation-name: bounceInLeft;
  animation-name: bounceInLeft; }

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px); }

  80% {
    -webkit-transform: translateX(10px); }

  100% {
    -webkit-transform: translateX(0); } }

@-moz-keyframes bounceInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateX(-30px); }

  80% {
    -moz-transform: translateX(10px); }

  100% {
    -moz-transform: translateX(0); } }

@-o-keyframes bounceInRight {
  0% {
    opacity: 0;
    -o-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -o-transform: translateX(-30px); }

  80% {
    -o-transform: translateX(10px); }

  100% {
    -o-transform: translateX(0); } }

@keyframes bounceInRight {
  0% {
    opacity: 0;
    transform: translateX(2000px); }

  60% {
    opacity: 1;
    transform: translateX(-30px); }

  80% {
    transform: translateX(10px); }

  100% {
    transform: translateX(0); } }

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  -moz-animation-name: bounceInRight;
  -o-animation-name: bounceInRight;
  animation-name: bounceInRight; }

@-webkit-keyframes bounceOut {
  0% {
    -webkit-transform: scale(1); }

  25% {
    -webkit-transform: scale(0.95); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.1); }

  100% {
    opacity: 0;
    -webkit-transform: scale(0.3); } }

@-moz-keyframes bounceOut {
  0% {
    -moz-transform: scale(1); }

  25% {
    -moz-transform: scale(0.95); }

  50% {
    opacity: 1;
    -moz-transform: scale(1.1); }

  100% {
    opacity: 0;
    -moz-transform: scale(0.3); } }

@-o-keyframes bounceOut {
  0% {
    -o-transform: scale(1); }

  25% {
    -o-transform: scale(0.95); }

  50% {
    opacity: 1;
    -o-transform: scale(1.1); }

  100% {
    opacity: 0;
    -o-transform: scale(0.3); } }

@keyframes bounceOut {
  0% {
    transform: scale(1); }

  25% {
    transform: scale(0.95); }

  50% {
    opacity: 1;
    transform: scale(1.1); }

  100% {
    opacity: 0;
    transform: scale(0.3); } }

.bounceOut {
  -webkit-animation-name: bounceOut;
  -moz-animation-name: bounceOut;
  -o-animation-name: bounceOut;
  animation-name: bounceOut; }

@-webkit-keyframes bounceOutUp {
  0% {
    -webkit-transform: translateY(0); }

  20% {
    opacity: 1;
    -webkit-transform: translateY(20px); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); } }

@-moz-keyframes bounceOutUp {
  0% {
    -moz-transform: translateY(0); }

  20% {
    opacity: 1;
    -moz-transform: translateY(20px); }

  100% {
    opacity: 0;
    -moz-transform: translateY(-2000px); } }

@-o-keyframes bounceOutUp {
  0% {
    -o-transform: translateY(0); }

  20% {
    opacity: 1;
    -o-transform: translateY(20px); }

  100% {
    opacity: 0;
    -o-transform: translateY(-2000px); } }

@keyframes bounceOutUp {
  0% {
    transform: translateY(0); }

  20% {
    opacity: 1;
    transform: translateY(20px); }

  100% {
    opacity: 0;
    transform: translateY(-2000px); } }

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  -moz-animation-name: bounceOutUp;
  -o-animation-name: bounceOutUp;
  animation-name: bounceOutUp; }

@-webkit-keyframes bounceOutDown {
  0% {
    -webkit-transform: translateY(0); }

  20% {
    opacity: 1;
    -webkit-transform: translateY(-20px); }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px); } }

@-moz-keyframes bounceOutDown {
  0% {
    -moz-transform: translateY(0); }

  20% {
    opacity: 1;
    -moz-transform: translateY(-20px); }

  100% {
    opacity: 0;
    -moz-transform: translateY(2000px); } }

@-o-keyframes bounceOutDown {
  0% {
    -o-transform: translateY(0); }

  20% {
    opacity: 1;
    -o-transform: translateY(-20px); }

  100% {
    opacity: 0;
    -o-transform: translateY(2000px); } }

@keyframes bounceOutDown {
  0% {
    transform: translateY(0); }

  20% {
    opacity: 1;
    transform: translateY(-20px); }

  100% {
    opacity: 0;
    transform: translateY(2000px); } }

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  -moz-animation-name: bounceOutDown;
  -o-animation-name: bounceOutDown;
  animation-name: bounceOutDown; }

@-webkit-keyframes bounceOutLeft {
  0% {
    -webkit-transform: translateX(0); }

  20% {
    opacity: 1;
    -webkit-transform: translateX(20px); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); } }

@-moz-keyframes bounceOutLeft {
  0% {
    -moz-transform: translateX(0); }

  20% {
    opacity: 1;
    -moz-transform: translateX(20px); }

  100% {
    opacity: 0;
    -moz-transform: translateX(-2000px); } }

@-o-keyframes bounceOutLeft {
  0% {
    -o-transform: translateX(0); }

  20% {
    opacity: 1;
    -o-transform: translateX(20px); }

  100% {
    opacity: 0;
    -o-transform: translateX(-2000px); } }

@keyframes bounceOutLeft {
  0% {
    transform: translateX(0); }

  20% {
    opacity: 1;
    transform: translateX(20px); }

  100% {
    opacity: 0;
    transform: translateX(-2000px); } }

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  -moz-animation-name: bounceOutLeft;
  -o-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft; }

@-webkit-keyframes bounceOutRight {
  0% {
    -webkit-transform: translateX(0); }

  20% {
    opacity: 1;
    -webkit-transform: translateX(-20px); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px); } }

@-moz-keyframes bounceOutRight {
  0% {
    -moz-transform: translateX(0); }

  20% {
    opacity: 1;
    -moz-transform: translateX(-20px); }

  100% {
    opacity: 0;
    -moz-transform: translateX(2000px); } }

@-o-keyframes bounceOutRight {
  0% {
    -o-transform: translateX(0); }

  20% {
    opacity: 1;
    -o-transform: translateX(-20px); }

  100% {
    opacity: 0;
    -o-transform: translateX(2000px); } }

@keyframes bounceOutRight {
  0% {
    transform: translateX(0); }

  20% {
    opacity: 1;
    transform: translateX(-20px); }

  100% {
    opacity: 0;
    transform: translateX(2000px); } }

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  -moz-animation-name: bounceOutRight;
  -o-animation-name: bounceOutRight;
  animation-name: bounceOutRight; }

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateIn {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateIn {
  0% {
    -o-transform-origin: center center;
    -o-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -o-transform-origin: center center;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateIn {
  0% {
    transform-origin: center center;
    transform: rotate(-200deg);
    opacity: 0; }

  100% {
    transform-origin: center center;
    transform: rotate(0);
    opacity: 1; } }

.rotateIn {
  -webkit-animation-name: rotateIn;
  -moz-animation-name: rotateIn;
  -o-animation-name: rotateIn;
  animation-name: rotateIn; }

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInUpLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInUpLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInUpLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(90deg);
    opacity: 0; }

  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  -moz-animation-name: rotateInUpLeft;
  -o-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft; }

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInDownLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInDownLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInDownLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(-90deg);
    opacity: 0; }

  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  -moz-animation-name: rotateInDownLeft;
  -o-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft; }

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInUpRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInUpRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInUpRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(-90deg);
    opacity: 0; }

  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  -moz-animation-name: rotateInUpRight;
  -o-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight; }

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInDownRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInDownRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInDownRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(90deg);
    opacity: 0; }

  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  -moz-animation-name: rotateInDownRight;
  -o-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight; }

@-webkit-keyframes rotateOut {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0);
    opacity: 1; }

  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(200deg);
    opacity: 0; } }

@-moz-keyframes rotateOut {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0);
    opacity: 1; }

  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(200deg);
    opacity: 0; } }

@-o-keyframes rotateOut {
  0% {
    -o-transform-origin: center center;
    -o-transform: rotate(0);
    opacity: 1; }

  100% {
    -o-transform-origin: center center;
    -o-transform: rotate(200deg);
    opacity: 0; } }

@keyframes rotateOut {
  0% {
    transform-origin: center center;
    transform: rotate(0);
    opacity: 1; }

  100% {
    transform-origin: center center;
    transform: rotate(200deg);
    opacity: 0; } }

.rotateOut {
  -webkit-animation-name: rotateOut;
  -moz-animation-name: rotateOut;
  -o-animation-name: rotateOut;
  animation-name: rotateOut; }

@-webkit-keyframes rotateOutUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; } }

@-moz-keyframes rotateOutUpLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; } }

@-o-keyframes rotateOutUpLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; } }

@keyframes rotateOutUpLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; }

  100% {
    transform-origin: left bottom;
    transform: rotate(-90deg);
    opacity: 0; } }

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  -moz-animation-name: rotateOutUpLeft;
  -o-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft; }

@-webkit-keyframes rotateOutDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; } }

@-moz-keyframes rotateOutDownLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; } }

@-o-keyframes rotateOutDownLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(90deg);
    opacity: 0; } }

@keyframes rotateOutDownLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; }

  100% {
    transform-origin: left bottom;
    transform: rotate(90deg);
    opacity: 0; } }

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  -moz-animation-name: rotateOutDownLeft;
  -o-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft; }

@-webkit-keyframes rotateOutUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; } }

@-moz-keyframes rotateOutUpRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; } }

@-o-keyframes rotateOutUpRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(90deg);
    opacity: 0; } }

@keyframes rotateOutUpRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; }

  100% {
    transform-origin: right bottom;
    transform: rotate(90deg);
    opacity: 0; } }

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  -moz-animation-name: rotateOutUpRight;
  -o-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight; }

@-webkit-keyframes rotateOutDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; } }

@-moz-keyframes rotateOutDownRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; } }

@-o-keyframes rotateOutDownRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; } }

@keyframes rotateOutDownRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; }

  100% {
    transform-origin: right bottom;
    transform: rotate(-90deg);
    opacity: 0; } }

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  -moz-animation-name: rotateOutDownRight;
  -o-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight; }

@-webkit-keyframes hinge {
  0% {
    -webkit-transform: rotate(0);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out; }

  20%, 60% {
    -webkit-transform: rotate(80deg);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out; }

  40% {
    -webkit-transform: rotate(60deg);
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out; }

  80% {
    -webkit-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -webkit-transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out; }

  100% {
    -webkit-transform: translateY(700px);
    opacity: 0; } }

@-moz-keyframes hinge {
  0% {
    -moz-transform: rotate(0);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out; }

  20%, 60% {
    -moz-transform: rotate(80deg);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out; }

  40% {
    -moz-transform: rotate(60deg);
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out; }

  80% {
    -moz-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -moz-transform-origin: top left;
    -moz-animation-timing-function: ease-in-out; }

  100% {
    -moz-transform: translateY(700px);
    opacity: 0; } }

@-o-keyframes hinge {
  0% {
    -o-transform: rotate(0);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out; }

  20%, 60% {
    -o-transform: rotate(80deg);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out; }

  40% {
    -o-transform: rotate(60deg);
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out; }

  80% {
    -o-transform: rotate(60deg) translateY(0);
    opacity: 1;
    -o-transform-origin: top left;
    -o-animation-timing-function: ease-in-out; }

  100% {
    -o-transform: translateY(700px);
    opacity: 0; } }

@keyframes hinge {
  0% {
    transform: rotate(0);
    transform-origin: top left;
    animation-timing-function: ease-in-out; }

  20%, 60% {
    transform: rotate(80deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out; }

  40% {
    transform: rotate(60deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out; }

  80% {
    transform: rotate(60deg) translateY(0);
    opacity: 1;
    transform-origin: top left;
    animation-timing-function: ease-in-out; }

  100% {
    transform: translateY(700px);
    opacity: 0; } }

.hinge {
  -webkit-animation-name: hinge;
  -moz-animation-name: hinge;
  -o-animation-name: hinge;
  animation-name: hinge; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-100%) rotate(-120deg); }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg); } }

@-moz-keyframes rollIn {
  0% {
    opacity: 0;
    -moz-transform: translateX(-100%) rotate(-120deg); }

  100% {
    opacity: 1;
    -moz-transform: translateX(0px) rotate(0deg); } }

@-o-keyframes rollIn {
  0% {
    opacity: 0;
    -o-transform: translateX(-100%) rotate(-120deg); }

  100% {
    opacity: 1;
    -o-transform: translateX(0px) rotate(0deg); } }

@keyframes rollIn {
  0% {
    opacity: 0;
    transform: translateX(-100%) rotate(-120deg); }

  100% {
    opacity: 1;
    transform: translateX(0px) rotate(0deg); } }

.rollIn {
  -webkit-animation-name: rollIn;
  -moz-animation-name: rollIn;
  -o-animation-name: rollIn;
  animation-name: rollIn; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0px) rotate(0deg); }

  100% {
    opacity: 0;
    -webkit-transform: translateX(100%) rotate(120deg); } }

@-moz-keyframes rollOut {
  0% {
    opacity: 1;
    -moz-transform: translateX(0px) rotate(0deg); }

  100% {
    opacity: 0;
    -moz-transform: translateX(100%) rotate(120deg); } }

@-o-keyframes rollOut {
  0% {
    opacity: 1;
    -o-transform: translateX(0px) rotate(0deg); }

  100% {
    opacity: 0;
    -o-transform: translateX(100%) rotate(120deg); } }

@keyframes rollOut {
  0% {
    opacity: 1;
    transform: translateX(0px) rotate(0deg); }

  100% {
    opacity: 0;
    transform: translateX(100%) rotate(120deg); } }

.rollOut {
  -webkit-animation-name: rollOut;
  -moz-animation-name: rollOut;
  -o-animation-name: rollOut;
  animation-name: rollOut; }

/* originally authored by Angelo Rohit - https://github.com/angelorohit */
@-webkit-keyframes lightSpeedIn {
  0% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -webkit-transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -webkit-transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -webkit-transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@-moz-keyframes lightSpeedIn {
  0% {
    -moz-transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -moz-transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -moz-transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -moz-transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@-o-keyframes lightSpeedIn {
  0% {
    -o-transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    -o-transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    -o-transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    -o-transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

@keyframes lightSpeedIn {
  0% {
    transform: translateX(100%) skewX(-30deg);
    opacity: 0; }

  60% {
    transform: translateX(-20%) skewX(30deg);
    opacity: 1; }

  80% {
    transform: translateX(0%) skewX(-15deg);
    opacity: 1; }

  100% {
    transform: translateX(0%) skewX(0deg);
    opacity: 1; } }

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  -moz-animation-name: lightSpeedIn;
  -o-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  -moz-animation-timing-function: ease-out;
  -o-animation-timing-function: ease-out;
  animation-timing-function: ease-out; }

.animated.lightSpeedIn {
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  -o-animation-duration: 0.5s;
  animation-duration: 0.5s; }

/* originally authored by Angelo Rohit - https://github.com/angelorohit */
@-webkit-keyframes lightSpeedOut {
  0% {
    -webkit-transform: translateX(0%) skewX(0deg);
    opacity: 1; }

  100% {
    -webkit-transform: translateX(100%) skewX(-30deg);
    opacity: 0; } }

@-moz-keyframes lightSpeedOut {
  0% {
    -moz-transform: translateX(0%) skewX(0deg);
    opacity: 1; }

  100% {
    -moz-transform: translateX(100%) skewX(-30deg);
    opacity: 0; } }

@-o-keyframes lightSpeedOut {
  0% {
    -o-transform: translateX(0%) skewX(0deg);
    opacity: 1; }

  100% {
    -o-transform: translateX(100%) skewX(-30deg);
    opacity: 0; } }

@keyframes lightSpeedOut {
  0% {
    transform: translateX(0%) skewX(0deg);
    opacity: 1; }

  100% {
    transform: translateX(100%) skewX(-30deg);
    opacity: 0; } }

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  -moz-animation-name: lightSpeedOut;
  -o-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  -moz-animation-timing-function: ease-in;
  -o-animation-timing-function: ease-in;
  animation-timing-function: ease-in; }

.animated.lightSpeedOut {
  -webkit-animation-duration: 0.25s;
  -moz-animation-duration: 0.25s;
  -o-animation-duration: 0.25s;
  animation-duration: 0.25s; }

/* originally authored by Angelo Rohit - https://github.com/angelorohit */
@-webkit-keyframes wiggle {
  0% {
    -webkit-transform: skewX(9deg); }

  10% {
    -webkit-transform: skewX(-8deg); }

  20% {
    -webkit-transform: skewX(7deg); }

  30% {
    -webkit-transform: skewX(-6deg); }

  40% {
    -webkit-transform: skewX(5deg); }

  50% {
    -webkit-transform: skewX(-4deg); }

  60% {
    -webkit-transform: skewX(3deg); }

  70% {
    -webkit-transform: skewX(-2deg); }

  80% {
    -webkit-transform: skewX(1deg); }

  90% {
    -webkit-transform: skewX(0deg); }

  100% {
    -webkit-transform: skewX(0deg); } }

@-moz-keyframes wiggle {
  0% {
    -moz-transform: skewX(9deg); }

  10% {
    -moz-transform: skewX(-8deg); }

  20% {
    -moz-transform: skewX(7deg); }

  30% {
    -moz-transform: skewX(-6deg); }

  40% {
    -moz-transform: skewX(5deg); }

  50% {
    -moz-transform: skewX(-4deg); }

  60% {
    -moz-transform: skewX(3deg); }

  70% {
    -moz-transform: skewX(-2deg); }

  80% {
    -moz-transform: skewX(1deg); }

  90% {
    -moz-transform: skewX(0deg); }

  100% {
    -moz-transform: skewX(0deg); } }

@-o-keyframes wiggle {
  0% {
    -o-transform: skewX(9deg); }

  10% {
    -o-transform: skewX(-8deg); }

  20% {
    -o-transform: skewX(7deg); }

  30% {
    -o-transform: skewX(-6deg); }

  40% {
    -o-transform: skewX(5deg); }

  50% {
    -o-transform: skewX(-4deg); }

  60% {
    -o-transform: skewX(3deg); }

  70% {
    -o-transform: skewX(-2deg); }

  80% {
    -o-transform: skewX(1deg); }

  90% {
    -o-transform: skewX(0deg); }

  100% {
    -o-transform: skewX(0deg); } }

@keyframes wiggle {
  0% {
    transform: skewX(9deg); }

  10% {
    transform: skewX(-8deg); }

  20% {
    transform: skewX(7deg); }

  30% {
    transform: skewX(-6deg); }

  40% {
    transform: skewX(5deg); }

  50% {
    transform: skewX(-4deg); }

  60% {
    transform: skewX(3deg); }

  70% {
    transform: skewX(-2deg); }

  80% {
    transform: skewX(1deg); }

  90% {
    transform: skewX(0deg); }

  100% {
    transform: skewX(0deg); } }

.wiggle {
  -webkit-animation-name: wiggle;
  -moz-animation-name: wiggle;
  -o-animation-name: wiggle;
  animation-name: wiggle;
  -webkit-animation-timing-function: ease-in;
  -moz-animation-timing-function: ease-in;
  -o-animation-timing-function: ease-in;
  animation-timing-function: ease-in; }

.animated.wiggle {
  -webkit-animation-duration: 0.75s;
  -moz-animation-duration: 0.75s;
  -o-animation-duration: 0.75s;
  animation-duration: 0.75s; }

#jstwitter {
  font-family: georgia;
  line-height: 1em;
  font-size: 13px;
  color: #333333;
  padding: 10px 10px 10px 10px; }

#jstwitter .tweet {
  margin: 0 auto 5px auto;
  padding: 0 0 15px 0;
  border-bottom: 1px dotted #ccc; }

#jstwitter .tweet a {
  text-decoration: none;
  color: #13c9d0; }

#jstwitter .tweet a:hover {
  text-decoration: underline; }

#jstwitter .tweet .time {
  font-size: 10px;
  font-style: italic;
  color: #666666; }


/* ==========================================================================
	CHROME
	
	Styles related to the chrome (interface) of the app.
   ========================================================================== */
.viewer {
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px; }

#dialog_container {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px; }

.next.overlay {
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  height: 100%;
  width: 32px;
  top: 0;
  right: 0;
  z-index: 2; }
  .next.overlay:hover {
    background-color: rgba(0, 0, 0, 0.2);
    background-image: url("../../core/interface/img/arrow_right.png");
    bacground-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center; }

.prev.overlay {
  background-color: rgba(0, 0, 0, 0);
  position: absolute;
  height: 100%;
  width: 32px;
  top: 0;
  left: 0;
  z-index: 2; }
  .prev.overlay:hover {
    background-color: rgba(0, 0, 0, 0.2);
    background-image: url("../../core/interface/img/arrow_left.png");
    bacground-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center; }

.os-android .next.overlay:hover {
  background-color: rgba(0, 0, 0, 0);}

.os-android .prev.overlay:hover {
  background-color: rgba(0, 0, 0, 0);}

nav {
  display: block;
  position: absolute;
  z-index: 5;
  bottom: 0;
  height: 0;
  left: 0;
  right: 0; }

.bottom_controls {
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 30px;
  z-index: 20;
  width: 64px;
  margin: auto; }

.radial_controls {
  width: 60px;
  height: 20px;
  margin: 0 auto;
  padding: 0 0;
  z-index: 20; }

.radial_inner {
  position: relative;
  display: inner-block;
  width: 60px;
  height: 20px;
  margin: 0 0;
  padding: 0 0;
  clear: both;
  z-index: 20; }

.radial_toggle_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat 0px -16px;
  width: 64px;
  height: 32px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  position: absolute;
  left: 0px;
  top: 0px; }
  .radial_toggle_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.contents_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat -63px 0px;
  width: 64px;
  height: 64px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  left: -120px;
  top: -36px; }
  .contents_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.share_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat -127px 0px;
  width: 64px;
  height: 64px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  left: -70px;
  top: -95px; }
  .share_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.search_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat -319px 0px;
  width: 64px;
  height: 64px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  left: 0px;
  top: -118px; }
  .search_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.print_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat -192px 0px;
  width: 64px;
  height: 64px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  left: 70px;
  top: -95px; }
  .print_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.help_btn {
  -webkit-transform: translate3d(0, 0, 0);
  background: url("../../core/interface/img/icons.png") no-repeat -255px 0px;
  width: 64px;
  height: 64px;
  text-indent: -9999px;
  border: none;
  position: absolute;
  display: block;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  transition: all 0.1s linear;
  left: 120px;
  top: -36px; }
  .help_btn:hover {
    -webkit-transform: scale(1.1);
    /*Webkit: Scale up image to 1.2x original size*/
    -moz-transform: scale(1.1);
    /*Mozilla scale version*/
    -o-transform: scale(1.1);
    /*Opera scale version*/ }

.radial_button_hidden {
  left: 0px;
  top: 0px; }

.lbscroll {
  -webkit-overflow-scrolling: touch !important;
  overflow: auto;
  overflow-x: hidden; }

.lightbox {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.5); }
  .lightbox .container {
    position: absolute;
    overflow: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 8px;
    background: black;
    padding-left: 0px; }

/* ==========================================================================
	IPAD SPECIFIC CHROME STYLES
	
	Contains any chrome styling specific to the iPad.
   ========================================================================== */
.os-ipad button {
  -webkit-appearance: none; }

/* ==========================================================================
	IPHONE SPECIFIC CHROME STYLES
	
	Contains any chrome styling specific to the iPhone (normal and retna)
   ========================================================================== */
.os-iphone button {
  -webkit-appearance: none; }

.r16x9.w1, .container.w1 [ratio="16x9"] img {
  width: 308px;
  height: 173px; }

.r16x9.w2, .container.w2 [ratio="16x9"] img {
  width: 634px;
  height: 357px; }

.r16x9.w3, .container.w3 [ratio="16x9"] img {
  width: 960px;
  height: 540px; }

.r16x9.w4, .container.w4 [ratio="16x9"] img {
  width: 1286px;
  height: 723px; }

.r4x3.w1, .container.w1 [ratio="4x3"] img {
  width: 308px;
  height: 231px; }

.r4x3.w2, .container.w2 [ratio="4x3"] img {
  width: 634px;
  height: 476px; }

.r4x3.w3, .container.w3 [ratio="4x3"] img {
  width: 960px;
  height: 720px; }

.r4x3.w4, .container.w4 [ratio="4x3"] img {
  width: 1286px;
  height: 965px; }

.r5x4.w1, .container.w1 [ratio="5x4"] img {
  width: 308px;
  height: 246px; }

.r5x4.w2, .container.w2 [ratio="5x4"] img {
  width: 634px;
  height: 507px; }

.r5x4.w3, .container.w3 [ratio="5x4"] img {
  width: 960px;
  height: 768px; }

.r5x4.w4, .container.w4 [ratio="5x4"] img {
  width: 1286px;
  height: 1029px; }

.r1x1.w1, .container.w1 [ratio="1x1"] img {
  width: 308px;
  height: 308px; }

.r1x1.w2, .container.w2 [ratio="1x1"] img {
  width: 634px;
  height: 634px; }

.r1x1.w3, .container.w3 [ratio="1x1"] img {
  width: 960px;
  height: 960px; }

.r1x1.w4, .container.w4 [ratio="1x1"] img {
  width: 1286px;
  height: 1286px; }

.r4x5.w1, .container.w1 [ratio="4x5"] img {
  width: 308px;
  height: 385px; }

.r4x5.w2, .container.w2 [ratio="4x5"] img {
  width: 634px;
  height: 793px; }

.r4x5.w3, .container.w3 [ratio="4x5"] img {
  width: 960px;
  height: 1200px; }

.r4x5.w4, .container.w4 [ratio="4x5"] img {
  width: 1286px;
  height: 1608px; }

.r3x4.w1, .container.w1 [ratio="3x4"] img {
  width: 308px;
  height: 411px; }

.r3x4.w2, .container.w2 [ratio="3x4"] img {
  width: 634px;
  height: 845px; }

.r3x4.w3, .container.w3 [ratio="3x4"] img {
  width: 960px;
  height: 1280px; }

.r3x4.w4, .container.w4 [ratio="3x4"] img {
  width: 1286px;
  height: 1715px; }

.c1 {
  margin-left: 0px; }

.c2 {
  margin-left: 326px; }

.c3 {
  margin-left: 652px; }

.c4 {
  margin-left: 978px; }

.w1 {
  width: 308px; }

.w2 {
  width: 634px; }

.w3 {
  width: 960px; }

.w4 {
  width: 1286px; }

.w3.grid:not(.fixed):not(.sizetocontainer) {
  max-width: 1286px; }

.w2.grid:not(.fixed):not(.sizetocontainer) {
  max-width: 960px; }

.w1.grid:not(.fixed):not(.sizetocontainer) {
  max-width: 634px; }

.lightbox .container[class*="single"] {
  width: 308px; }
.lightbox .container[class*="double"] {
  width: 634px; }
.lightbox .container[class*="triple"] {
  width: 960px; }
.lightbox .container[class*="quad"] {
  width: 1286px; }
.lightbox .container img {
  width: 100%;
  height: auto; }

.column {
  width: 308px;
  font-size: 16px;
  line-height: 24px; }

orientation-horizontal .column {
  width: 390px; }

orientation-vertical .column {
  width: 200px; }

.grid {
  position: absolute;
  overflow: hidden;
  z-index: 1;
  -webkit-backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased; }

.fixed.grid, .sizetocontainer.grid {
  max-width: none;
  max-height: none;
  min-width: none;
  min-height: none; }

html.js .hidden, html.no-js .hidden {
  display: none; }

.chrome, .viewer {
  position: absolute;
  display: block; }

.chrome {
  bottom: 0;
  top: 0;
  left: 0;
  right: 0; }

.container.scroll {
  position: absolute;
  overflow: auto;
  overflow-x: hidden; }

.grid .scroll-fade:after {
  content: "\0020";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 40px;
  z-index: 3;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0), white);
  background-image: linear-gradient(top, rgba(255, 255, 255, 0), white); }

.container .scroll {
  overflow: auto;
  width: 100%;
  height: 100%;
  padding-bottom: 40px; }

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 6px; }

::-webkit-scrollbar-thumb {
  border-radius: 3px;
  background-color: rgba(0, 0, 0, 0.5); }

.touch ::-webkit-scrollbar {
  width: 3px; }

html {
  font-size: 16px;
  line-height: 24px;
  font-family: sans-serif;
  color: #333333;
  background-color: #333666;
  background-image: url("../../core/interface/img/app_background.png"); }

html, body {
  overflow: hidden; }

h1, h2, h3, h4, h5, h6 {
  text-rendering: optimizeLegibility;
  word-wrap: break-word; }

.column, .container {
  position: absolute;
  overflow: hidden;
  top: 32px;
  bottom: 32px; }

.column {
  min-height: 72px; }

#previousPage, #nextPage {
  opacity: 0.5; }

.os-android #previousPage, .os-android #nextPage {
  opacity: 1; }

.grid.trimleft {
  padding-left: 0; }

.grid.trimright {
  padding-right: 0; }

figure {
  display: block; }

.colapsed {
  position: absolute; }

.topfix {
  top: 0; }

.rightfix {
  right: 0; }

.bottomfix {
  bottom: 0;
  top: auto; }

.leftfix {
  left: 0; }

.overflow {
  overflow: visible; }

.error, .loading {
  position: absolute; }
  .error#nextPage, .error#previousPage, .loading#nextPage, .loading#previousPage {
    display: none; }

.hidden, .microdata {
  display: none; }

.group {
  position: absolute;
  top: 0;
  bottom: 0;
  padding: 0; }

.center, .center * {
  text-align: center; }

.nocap .caption {
  display: none; }

.fill .caption {
  padding-left: 32px;
  padding-right: 32px; }

.caption.left {
  text-align: left; }
.caption.right {
  right: 0;
  text-align: right; }

.insetcap .caption {
  position: absolute; }
.insetcap.ul .caption {
  top: 0;
  left: 0; }
.insetcap.ur .caption {
  top: 0;
  right: 0; }
.insetcap.ll .caption {
  bottom: 0;
  left: 0; }
.insetcap.lr .caption {
  bottom: 0;
  right: 0; }

.fullbleed {
  position: absolute;
  bottom: 0 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: auto; }

.os-ipad, .os-ipad .grid, .os-iphone, .os-iphone .grid {
  -webkit-font-smoothing: antialiased; }

html.offline .no-offline, html.offline [data-requires~="no-offline"] {
  display: none; }
html.offline [data-requires~="offline"] {
  display: block; }

html.no-offline [data-requires~="no-offline"] {
  display: block; }
html.no-offline [data-requires~="offline"] {
  display: none; }

.r {
  background: #ff9999 !important; }

.g {
  background: #99ff99 !important; }

.b {
  background: #9999ff !important; }

.c {
  background: #99ffff !important; }

.m {
  background: #ff99ff !important; }

.y {
  background: #ffff99 !important; }

.ad.grid.w1 {
  width: 100px; }

.ad.grid.w2 {
  width: 200px; }

.ad.grid.w3 {
  width: 300px; }

.ad.grid.w4 {
  width: 400px; }

.ad.grid.w5 {
  width: 500px; }

.ad.grid.w6 {
  width: 600px; }

.ad.grid.w7 {
  width: 700px; }

.ad.grid.w8 {
  width: 800px; }

.ad.grid.w9 {
  width: 900px; }

.ad.grid.w10 {
  width: 1000px; }

.ad.grid.w11 {
  width: 1100px; }

.ad.grid.w12 {
  width: 1200px; }

.ad.grid {
  background: none; }

.grid.ipad {
  min-width: 99999px;
  width: 99999px;
  margin: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  border: none; }

.os-ipad .grid {
  min-width: 99999px;
  width: 99999px;
  opacity: 1 !important; }
.os-ipad .grid.fixed.ipad.horizontal {
  height: 644px;
  width: 960px;
  min-width: 960px;
  padding: 0 32px; }
.os-ipad .grid.fixed.ipad.vertical {
  height: 900px;
  width: 634px;
  min-width: 634px;
  padding: 0 67px; }

.os-ipad.fullscreen .grid.fixed.ipad.horizontal {
  height: 748px; }
.os-ipad.fullscreen .grid.fixed.ipad.vertical {
  height: 1004px; }

.grid.iphone {
  min-width: 99999px;
  width: 99999px;
  margin: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  border: none; }

.os-iphone .vertical div {
  line-height: 16px;
  font-size: 12px; }
  .os-iphone .vertical div.column {
    width: 300px; }
.os-iphone .vertical p {
  line-height: 16px;
  font-size: 12px; }
.os-iphone .horizontal div {
  line-height: 16px;
  font-size: 12px; }
  .os-iphone .horizontal div.column {
    width: 460px; }
.os-iphone .horizontal p {
  line-height: 16px;
  font-size: 12px; }
.os-iphone .grid {
  min-width: 99999px;
  width: 99999px;
  opacity: 1 !important; }
.os-iphone .grid.fixed.iphone.horizontal {
  height: 268px;
  width: 480px;
  min-width: 468px;
  padding: 0px 0px; }
  .os-iphone .grid.fixed.iphone.horizontal .container {
    width: 480px; }
.os-iphone .grid.fixed.iphone.vertical {
  height: 416px;
  width: 320px;
  min-width: 308px;
  padding: 0px 0px; }

.os-iphone.fullscreen .grid.fixed.iphone.horizontal {
  height: 300px; }
.os-iphone.fullscreen .grid.fixed.iphone.vertical {
  height: 460px; }
  .os-iphone.fullscreen .grid.fixed.iphone.vertical div.column {
    width: 300px; }

.ipc1 {
  margin-left: 0; }

.ipw_v {
  width: 300px; }

.ipw_h {
  width: 460px; }

.grid.ipod {
  min-width: 99999px;
  width: 99999px;
  margin: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  border: none; }

.os-ipod div {
  font-size: 12px; }
.os-ipod .grid {
  min-width: 99999px;
  width: 99999px;
  opacity: 1 !important; }
.os-ipod .grid.fixed.ipod.horizontal {
  height: 268px;
  width: 960px;
  min-width: 960px;
  padding: 0 -460px; }
.os-ipod .grid.fixed.ipod.vertical {
  height: 416px;
  width: 960px;
  min-width: 960px;
  padding: 0 -466.667px; }

.os-ipod.fullscreen .grid.fixed.ipod.horizontal {
  height: 300px; }
.os-ipod.fullscreen .grid.fixed.ipod.vertical {
  height: 460px; }

.contents_panel {
  z-index: 1;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  display: none; }
  .contents_panel h1 {
    margin-left: 8px; }
  .contents_panel .lFloatclear {
    float: left;
    clear: both; }
  .contents_panel .clearDiv {
    height: 0;
    clear: both; }
  .contents_panel .contentslist {
    background: #000;
    padding-top: 10px;
    max-width: 422px;
    margin: 1.5em auto 1.5em;
    position: relative; }
  .contents_panel .contentitem {
    background: #303030;
    background: -webkit-linear-gradient(top, #303030, #242424);
    background: -moz-linear-gradient(top, #303030, #242424);
    background: -o-linear-gradient(top, #303030, #242424);
    background: -ms-linear-gradient(top, #303030, #242424);
    background: linear-gradient(top, #303030, #242424);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#303030', endColorstr='#242424');
    max-width: 422px;
    cursor: pointer;
    border-top: 1px solid #4d4d4d;
    border-bottom: 2px solid #000;
    margin-bottom: 0px;
    margin-left: 8px;
    margin-right: 8px;
    padding: 8px 8px 8px 8px;
    cursor: pointer; }
  .contents_panel .contentitem:hover, .contents_panel .contentitem:active {
    background: #242424;
    background: -webkit-linear-gradient(top, #242424, #303030);
    background: -moz-linear-gradient(top, #242424, #303030);
    background: -o-linear-gradient(top, #242424, #303030);
    background: -ms-linear-gradient(top, #242424, #303030);
    background: linear-gradient(top, #242424, #303030);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#242424', endColorstr='#303030'); }
  .contents_panel .contentitem img {
    cursor: pointer;
    width: 64px;
    height: 64px;
    float: right;
    margin-left: 8px;
    margin-bottom: 8px; }
  .contents_panel .contenttitle {
    display: block;
    font-weight: lighter;
    font-size: 1em;
    color: #aeaeae;
    padding: 5px 8px 5px 0;
    cursor: pointer; }
  .contents_panel .tocDesc {
    display: block;
    padding: 0;
    margin: 0;
    line-height: 1.25em;
    color: #909090;
    font-size: .75em;
    margin-right: 80px;
    text-align: left; }
  .contents_panel .author {
    float: right;
    clear: both;
    color: #909090;
    padding: 0;
    margin: 0;
    font-size: 75%;
    font-style: italic; }

.os-iphone .contents_thumb {
  display: none; }

.share_panel .addthis_text {
  color: #dfdfdf; }

.share_panel .addthis_toolbox a {
  display: block;
  float: left;
  width: 45%;
  margin: 0 0 1px 2%;
  padding: 1%;
  font-size: 85%;
  white-space: nowrap;
  line-height: 33px;
  border-top: 1px solid #4d4d4d;
  border-bottom: 2px solid #000;
  background: #303030;
  background: -webkit-linear-gradient(top, #303030, #242424);
  background: -moz-linear-gradient(top, #303030, #242424);
  background: -o-linear-gradient(top, #303030, #242424);
  background: -ms-linear-gradient(top, #303030, #242424);
  background: linear-gradient(top, #303030, #242424);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#303030', endColorstr = '#242424'); }
.share_panel .addthis_toolbox a:hover {
  background: #242424;
  background: -webkit-linear-gradient(top, #242424, #303030);
  background: -moz-linear-gradient(top, #242424, #303030);
  background: -o-linear-gradient(top, #242424, #303030);
  background: -ms-linear-gradient(top, #242424, #303030);
  background: linear-gradient(top, #242424, #303030);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#242424', endColorstr = '#303030'); }
.share_panel .action {
  float: left;
  margin-right: 20px;
  color: #dfdfdf;
  vertical-align: baseline; }
.share_panel #yourmessage {
  width: 100%; }
.share_panel .share {
  display: block;
  min-width: 200px;
  float: left;
  margin-bottom: 10px; }
.share_panel label {
  display: block;
  font-size: 100%;
  margin-top: 10px; }
.share_panel .url {
  font-size: 75%;
  line-height: 8px; }

.help_panel .fingerSwipe {
  height: 100px;
  margin: 3px; }
  .help_panel .fingerSwipe img {
    width: 100px;
    height: 100px; }
  .help_panel .fingerSwipe h4 {
    margin: 30px 30px; }

.search_panel .search2 {
  display: none; }
.search_panel .search {
  width: 99%;
  position: relative; }
.search_panel .action {
  float: left;
  margin-right: 20px;
  color: #dfdfdf;
  vertical-align: baseline; }
.search_panel #searchtype {
  padding: 3px; }
.search_panel input, .search_panel label {
  vertical-align: baseline; }
.search_panel label {
  margin-left: 10px; }
.search_panel .searchoptions {
  float: left;
  margin-top: 24px;
  margin-bottom: 24px; }
.search_panel .previousblock {
  float: left;
  position: relative;
  left: -20px; }
.search_panel .nextblock {
  float: right;
  position: relative;
  right: -20px; }
.search_panel .previousblock p, .search_panel .nextblock p, .search_panel .previousblock img, .search_panel .nextblock img {
  display: block;
  float: left;
  text-indent: 0;
  margin-right: 6px;
  color: #dfdfdf;
  font-variant: small-caps; }
.search_panel .contentslist {
  background: #000;
  padding: 30px;
  padding-top: 10px;
  max-width: 422px;
  margin: 1.5em auto 1.5em;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  position: relative; }
.search_panel .contentitem {
  background: #303030;
  background: -webkit-linear-gradient(top, #303030, #242424);
  background: -moz-linear-gradient(top, #303030, #242424);
  background: -o-linear-gradient(top, #303030, #242424);
  background: -ms-linear-gradient(top, #303030, #242424);
  background: linear-gradient(top, #303030, #242424);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#303030', endColorstr = '#242424');
  max-width: 422px;
  cursor: pointer;
  border-top: 1px solid #4d4d4d;
  border-bottom: 2px solid #000;
  margin-bottom: 1px;
  margin-left: 8px;
  margin-right: 8px;
  padding: 8px 8px 8px 8px;
  cursor: pointer; }
.search_panel .contentitem:hover, .search_panel .contentitem:active {
  background: #242424;
  background: -webkit-linear-gradient(top, #242424, #303030);
  background: -moz-linear-gradient(top, #242424, #303030);
  background: -o-linear-gradient(top, #242424, #303030);
  background: -ms-linear-gradient(top, #242424, #303030);
  background: linear-gradient(top, #242424, #303030);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#242424', endColorstr = '#303030'); }
.search_panel .contentitem img {
  cursor: pointer;
  width: 64px;
  height: 64px;
  float: right;
  margin-left: 8px;
  margin-bottom: 8px; }
.search_panel .contenttitle {
  display: block;
  font-weight: lighter;
  font-size: 1em;
  color: #aeaeae;
  padding: 5px 8px 5px 0;
  cursor: pointer; }
.search_panel .h_divider {
  background: url(../../img/h-divider-gradient.png) no-repeat;
  max-width: 422px;
  height: 3px;
  margin-top: 9px;
  margin-bottom: 9px; }
.search_panel .resultdesc {
  display: block;
  padding: 0;
  margin: 0;
  line-height: 1.25em;
  color: #909090;
  font-size: .75em;
  margin-right: 80px;
  text-align: left; }
.search_panel .resultsTitle {
  margin-bottom: 24px;
  color: #909090;
  font-size: 75%;
  margin: 5px 8px; }
.search_panel .keyword {
  color: #CC3333; }

/***
 VARIABLES
***/
/*************************************************/
.articlebarholder {
  position: absolute;
  height: 16px;
  left: 36px;
  right: 36px;
  top: 0px;
  padding: 0px 0px;
  padding-bottom: 4px;
  margin: 0px 0px;
  z-index: 10;
  text-align: center;
  background-color: #333;
  border: solid 1px #333;
  border-bottom: none;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-bottomright: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px; }

.articlebar_line {
  position: absolute;
  left: 3px;
  right: 3px;
  padding: 3px;
  margin: 0px auto; }

.os-android .articlebarholder {
  visibility: hidden;}

.os-iphone .articlebarholder {
  visibility: hidden;}

.os-ipad .articlebarholder {
  visibility: hidden;}

.os-android .articlebar_line {
  visibility: hidden;
}

.os-iphone .articlebar_line {
  visibility: hidden;
}

.os-ipad .articlebar_line {
  visibility: hidden;
}

.articlebar_article, .articlebar_indicator {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  float: left;
  top: -4px;
  height: 14px;
  background-color: #666666;
  border: solid 1px #333;
  border-top: none;
  border-bottom: none;
  -webkit-border-top-left-radius: 0px;
  -webkit-border-top-right-radius: 0px;
  -webkit-border-bottom-right-radius: 0px;
  -webkit-border-bottom-left-radius: 0px;
  -moz-border-radius-topleft: 0px;
  -moz-border-radius-topright: 0px;
  -moz-border-radius-bottomright: 0px;
  -moz-border-radius-bottomleft: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  font-size: 10px;
  color: #000;
  line-height: 12px;
  font-weight: bold;
  text-align: center;
  background-color: #666666;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#737373', endColorstr='#595959');
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#737373', endColorstr='#595959');
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(1, #8c8c8c), color-stop(0.5, #666666), color-stop(0.49, #595959));
  background-image: -webkit-linear-gradient(top, #8c8c8c 0%, #666666 50%, #595959 51%, #595959 100%);
  background-image: -moz-linear-gradient(top, #8c8c8c 0%, #666666 50%, #595959 51%, #595959 100%);
  background-image: linear-gradient(top, #8c8c8c 0%, #666666 50%, #595959 51%, #595959 100%); }

.articlebar_article div, .articlebar_indicator div {
  margin-left: -999em;
  position: absolute;
  font-size: 16px;
  color: #fff;
  line-height: 20px;
  font-weight: bold;
  text-align: left; }

.articlebar_article:hover, .articlebar_indicator:hover {
  background-color: #aaaaaa;
  background-color: #aaaaaa;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b7b7b7', endColorstr='#9d9d9d');
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b7b7b7', endColorstr='#9d9d9d');
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(1, #d0d0d0), color-stop(0.5, #aaaaaa), color-stop(0.49, #9d9d9d));
  background-image: -webkit-linear-gradient(top, #d0d0d0 0%, #aaaaaa 50%, #9d9d9d 51%, #9d9d9d 100%);
  background-image: -moz-linear-gradient(top, #d0d0d0 0%, #aaaaaa 50%, #9d9d9d 51%, #9d9d9d 100%);
  background-image: linear-gradient(top, #d0d0d0 0%, #aaaaaa 50%, #9d9d9d 51%, #9d9d9d 100%); }

.articlebar_article:hover div, .articlebar_indicator:hover div {
  position: absolute;
  top: 20px;
  z-index: 99;
  margin-left: 0; }

.articlebar_currentarticle, .articlebar_indicator {
  background-color: #333333;
  background-color: #333333;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#404040', endColorstr='#262626');
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#404040', endColorstr='#262626');
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(1, #595959), color-stop(0.5, #333333), color-stop(0.49, #262626));
  background-image: -webkit-linear-gradient(top, #595959 0%, #333333 50%, #262626 51%, #262626 100%);
  background-image: -moz-linear-gradient(top, #595959 0%, #333333 50%, #262626 51%, #262626 100%);
  background-image: linear-gradient(top, #595959 0%, #333333 50%, #262626 51%, #262626 100%); }

/**
	The tooltip that shows the article title.
*/
.articlebar_label {
  background-color: #000000;
  color: #ffffff;
  border: solid 1px #ffffff;
  font-size: 12px;
  font-weight: bold;
  padding: 0px 6px; }

.articlebar_label p {
  padding: 4px 4px;
  color: #fff;
  font-weight: normal;
  text-indent: none;
  text-align: left; }

/**
	The indicator holder div.
	This moves and provides a way to show a line or some other 
*/
.articlebar_indicator {
  background-color: #4c83a9;
  position: absolute;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  top: 3px;
  border: none;
  background-color: #4c83a9;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5a90b5', endColorstr='#447597');
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5a90b5', endColorstr='#447597');
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(1, #7da7c5), color-stop(0.5, #4c83a9), color-stop(0.49, #447597));
  background-image: -webkit-linear-gradient(top, #7da7c5 0%, #4c83a9 50%, #447597 51%, #447597 100%);
  background-image: -moz-linear-gradient(top, #7da7c5 0%, #4c83a9 50%, #447597 51%, #447597 100%);
  background-image: linear-gradient(top, #7da7c5 0%, #4c83a9 50%, #447597 51%, #447597 100%); }

.articlebar_indicator div {
  opacity: 0; }

.articlebar_indicator:hover div {
  opacity: 1; }

/**
	The actual indicator text div, 
	attached to the indicator holder.
	It is positioned relative to the indicator holder, 
	allowing them to move as one component.
*/
.articlebar_pagetext {
  position: absolute;
  top: 16px;
  left: 0px;
  text-align: center;
  line-height: 18px;
  font-size: 12px;
  font-weight: bold;
  width: 40px;
  height: 18px;
  background-color: #000;
  color: #ffffff;
  border: solid 2px #ffffff; }

.contents_panel, .print_panel, .help_panel, .search_panel, .share_panel {
  color: #dfdfdf;
  z-index: 1;
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  display: none;
  padding-top: 30px;
  padding-bottom: 40px; }
  .contents_panel .bg, .print_panel .bg, .help_panel .bg, .search_panel .bg, .share_panel .bg {
    background: black;
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    overflow: auto;
    padding: 8px;
    z-index: 1; }
  .contents_panel p, .print_panel p, .help_panel p, .search_panel p, .share_panel p {
    text-indent: 0; }
  .contents_panel .cancel, .print_panel .cancel, .help_panel .cancel, .search_panel .cancel, .share_panel .cancel {
    display: block;
    margin-top: 15px;
    font-size: 75%;
    text-decoration: underline;
    color: #9d9d9d; }
  .contents_panel .cancel:hover, .contents_panel .cancel:active, .print_panel .cancel:hover, .print_panel .cancel:active, .help_panel .cancel:hover, .help_panel .cancel:active, .search_panel .cancel:hover, .search_panel .cancel:active, .share_panel .cancel:hover, .share_panel .cancel:active {
    color: #dfdfdf; }
  .contents_panel .h_divider, .print_panel .h_divider, .help_panel .h_divider, .search_panel .h_divider, .share_panel .h_divider {
    background: url(../../img/h-divider-gradient.png) no-repeat center;
    max-width: 422px;
    height: 3px;
    margin-top: 9px;
    margin-bottom: 9px; }
  .contents_panel .topRow, .print_panel .topRow, .help_panel .topRow, .search_panel .topRow, .share_panel .topRow {
    width: 100%;
    margin-bottom: 24px; }
  .contents_panel .nowrap, .print_panel .nowrap, .help_panel .nowrap, .search_panel .nowrap, .share_panel .nowrap {
    white-space: nowrap; }
  .contents_panel .lFloatclear, .print_panel .lFloatclear, .help_panel .lFloatclear, .search_panel .lFloatclear, .share_panel .lFloatclear {
    float: left;
    clear: both; }
  .contents_panel .floatleft, .print_panel .floatleft, .help_panel .floatleft, .search_panel .floatleft, .share_panel .floatleft {
    float: left; }
  .contents_panel .floatright, .print_panel .floatright, .help_panel .floatright, .search_panel .floatright, .share_panel .floatright {
    float: right; }
  .contents_panel .clearDiv, .print_panel .clearDiv, .help_panel .clearDiv, .search_panel .clearDiv, .share_panel .clearDiv {
    height: 0;
    clear: both; }
  .contents_panel p.inline, .print_panel p.inline, .help_panel p.inline, .search_panel p.inline, .share_panel p.inline {
    color: #dfdfdf;
    display: inline; }
  .contents_panel .floatright, .print_panel .floatright, .help_panel .floatright, .search_panel .floatright, .share_panel .floatright {
    float: right; }
  .contents_panel .floatleft, .print_panel .floatleft, .help_panel .floatleft, .search_panel .floatleft, .share_panel .floatleft {
    float: left; }
  .contents_panel h1, .print_panel h1, .help_panel h1, .search_panel h1, .share_panel h1 {
    display: block;
    color: #aeaeae;
    font-size: 90%;
    font-weight: lighter;
    letter-spacing: 1px;
    font-family: Tahoma, Geneva, sans-serif;
    margin-bottom: .5em;
    text-align: left;
    text-transform: uppercase; }
  .contents_panel ul, .print_panel ul, .help_panel ul, .search_panel ul, .share_panel ul {
    width: 90%;
    max-width: 600px;
    margin: 0 auto; }
  .contents_panel li, .print_panel li, .help_panel li, .search_panel li, .share_panel li {
    font-family: 'Lora', serif;
    list-style: none;
    display: list-item;
    text-align: -webkit-match-parent;
    border: 1px solid #666;
    background-color: #fff;
    margin: 5px;
    -moz-border-radius: 1em 1em 1em 1em;
    border-radius: 1em 1em 1em 1em; }
    .contents_panel li h3, .print_panel li h3, .help_panel li h3, .search_panel li h3, .share_panel li h3 {
      font-family: 'Lora', serif;
      font-size: 1.3em;
      color: #333;
      text-align: center;
      padding: 6px 0 0 0;
      margin: 0 auto;
      font-weight: bold; }
    .contents_panel li h4, .print_panel li h4, .help_panel li h4, .search_panel li h4, .share_panel li h4 {
      font-size: 1em;
      color: #333;
      text-align: center;
      padding: 3px 0 0 0;
      margin: 0 auto;
      font-weight: normal; }
  .contents_panel .close, .print_panel .close, .help_panel .close, .search_panel .close, .share_panel .close {
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: pointer;
    background: url("../../img/close2.png");
    padding: 10px; }
  .contents_panel .button, .print_panel .button, .help_panel .button, .search_panel .button, .share_panel .button {
    -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
    background: -moz-linear-gradient(center top, #ededed 5%, #dfdfdf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ededed', endColorstr = '#dfdfdf');
    background-color: #ededed;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    display: inline-block;
    color: #777777;
    font-family: arial;
    font-size: 15px;
    font-weight: bold;
    padding: 3px 9px;
    text-decoration: none;
    text-shadow: 1px 1px 0px #ffffff; }
  .contents_panel .button:hover, .print_panel .button:hover, .help_panel .button:hover, .search_panel .button:hover, .share_panel .button:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
    background: -moz-linear-gradient(center top, #dfdfdf 5%, #ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#dfdfdf', endColorstr = '#ededed');
    background-color: #dfdfdf; }
  .contents_panel .button:active, .print_panel .button:active, .help_panel .button:active, .search_panel .button:active, .share_panel .button:active {
    position: relative;
    top: 1px; }

.share_panel_inner, .print_panel_inner, .contents_panel_inner, .help_panel_inner, .search_panel_inner, .searchresultscontainer {
  background: #212121;
  padding: 8px;
  padding-bottom: 24px;
  max-width: 422px;
  margin: auto;
  margin-top: 30px;
  margin-bottom: 30px;
  position: relative;
  -moz-box-shadow: 2px 2px 3px #000;
  -webkit-box-shadow: 2px 2px 3px #000;
  box-shadow: 2px 2px 3px #000;
  border: 2px solid #333;
  border-radius: 5px; }

.os-iphone .no-ios {
  display: none; }

.os-ipad .no-ios {
  display: none; }

.os-iphone .ios-only {
  display: block; }

.os-ipad .ios-only {
  display: block; }

.ios-only {
  display: none; }

body.os-iphone .ios-only {
  display: block; }

.panel_visible {
  visibility: visible;
  display: block;
  opacity: 1; }
