.main {
width: 500px;
}
.cbp-qtrotator {
width: 500px;
height: 180px;
position: relative;
float: left;
margin: 0;
padding-top: 11px
}
.cbp-qtcontent {
width: 100%;
height: auto;
position: absolute;
min-height: 180px;
top: 0;
z-index: 2;
display: none
}
.cbp-qtrotator .cbp-qtcontent.current {
display: block
}
.cbp-qtrotator blockquote {
margin: 40px 0 0 0;
padding: 0
}
.cbp-qtrotator blockquote p {
font-family: 'texgyreadventorbold', sans-serif;
font-size: 2em;
color: #333;
font-weight: 300;
margin: 0.4em 0 1em
}
.cbp-qtrotator blockquote footer {
font-size: 1.2em
}
.cbp-qtrotator blockquote footer:before {
content: '― '
}
.cbp-qtrotator .cbp-qtcontent img {
float: right;
margin: 50px 0 0 50px
}
.cbp-qtprogress {
position: absolute;
background: #f00;
height: 2px;
width: 0%;
z-index: 1000
}

.test_main {
width: 280px;
margin-left:auto;
margin-right:auto;
}
.test_cbp-qtrotator {
width: 280px;
height: 180px;
position: relative;
float: left;
margin: 0;
padding-top: 11px
}
.test_cbp-qtcontent {
width: 100%;
height: auto;
position: absolute;
min-height: 180px;
top: 0;
z-index: 2;
display: none
}
.test_cbp-qtrotator .test_cbp-qtcontent.current {
display: block
}
.test_cbp-qtrotator blockquote {
margin: 40px 0 0 0;
padding: 0
}
.test_cbp-qtrotator blockquote p {
font-family: 'texgyreadventorregular', sans-serif;
font-size: 1.2em;
color: #333;
font-weight: 300;
margin: 0.4em 0 1em
}
.test_cbp-qtrotator blockquote footer {
font-size: 1.2em
}
.test_cbp-qtrotator blockquote footer:before {
content: '― '
}
.test_cbp-qtrotator .test_cbp-qtcontent img {
float: right;
margin: 50px 0 0 50px
}
.test_cbp-qtprogress {
position: absolute;
background: #f00;
height: 2px;
width: 0%;
z-index: 1000
}