/* General styling */
* { margin: 0px; padding: 0px;}
 
body {font-family: Arial; font-size: 10pt;}
 
ul{margin: 10px 0; list-style-type: none;}
 
hr {border: medium none; border-bottom: 1px solid #ccc; margin-bottom: 10px;}

.wrapper {width: 100%; font-size: 12pt; margin:0; padding: 0;}
p {	margin-top: 1.5em;} 
.listing-content {margin:0; padding: 0;}
.listing-content p {margin:0; padding:0;}
.listing-content figure {padding:0; margin:0; }
.listing-content figure img {max-width: 100%;}
.footer p {font-size: 7pt; text-align:center; padding:0;}

@media all and (min-width: 1020px){
	.wrapper {width: 640px;  margin: 10px auto;}

	/* Menu */
	.menu {float: left;  width: 200px;}
 	.left_menu { margin: 0;}
    .left_menu li {border-bottom: 1px solid #ccc; }
    .left_menu li:last-child {border-bottom: medium none;}
    .left_menu > li > ul,
    .left_menu > li > ul > li > ul { margin: 0 0 0 30px; display:none;}
    .left_menu li a {color: #222;text-decoration: none; display: block; padding: 5px;}
    .left_menu li a:hover {background: #222; color: #fff;}
             
	/* Listing Content */
	.listing-content {float: left; padding: 20px;}
    .listing-content .item-data {color: #999; font-size: 11px;}
    .listing-content figure {text-align: center;}
    .listing-content .price-block {font-size: 22px; font-weight: bold; text-align: right;}
    .listing-content p {line-height: 16px; margin-top: 1em;}
}

/* Info element block */
	.info {font-weight: bold; margin: 10px 0; display: block;}
 
    .info::before {
        content: 'i';
        padding: 5px 0;
        font-size: 15px;
        border: 1px solid lightblue;
        border-radius: 65px;
        width: 23px;
        height: 12px;
        display: inline-block;
        text-align: center;
        font-family: initial;
        background: lightblue;
        color: white;
        margin-right: 6px;
    }

 
/* Auto-Generated Character List */
	.PlentyArticleCharacterList {margin: 0 10;}
    .PlentyArticleCharacter > div {float: left;}
    .PlentyArticleCharacterName {font-weight: bold; margin-right: 5px; }
 
 
/* Clearfix */
.clearfix:before,
.clearfix:after,
.PlentyArticleCharacter {
    content: " "; /* 1 */
    display: table; /* 2 */
}
.clearfix:after, .PlentyArticleCharacter:after {clear: both;}
.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 40%;

    width:  250px;
	height: 250px;

	float: left;

	margin-top: 10px;
	margin-right: 10px;
	padding-top: 10px;
}

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

.container {
	text-align: center;
    padding: 2px 16px;
}

.card img {
	display:block;
	margin:auto;

	width: auto;
	height: 125px;
}
.clear {margin: 1rem 0; clear:both;} 
