/** Pet profile reset code by Bug@Subeta **/

/* Correct box-sizing for everything.
 * A box-sizing of border-box makes sure padding is included in an element's dimensions.
 */
* {
    box-sizing: border-box;
}

/* Reset traits for outer wrapper containers.
 */
html,body {
    height:100%;
    padding:0;
    margin:0;
}
#page,#content,.container-fluid,#main-content {
    padding:0;
    margin:0;
    width:auto!important;
    position:static;
    min-height:100%;
  	height:100%;
    background:none;
    background-color:transparent;
    border:0;
    border-right:0;
}
#page {
    margin:0!important;
}
#main-content {
    background-image: none;
    float: none;
}
#content {
    height: 100%!important;
    overflow: unset;
}

/* Hide elements:
   - header, footer, sidebar, bookmarks
   - random events, news banner, and hustler
   - floating items
*/
iframe,#postcards,#header,#menu,#events-bubble-wrapper,#sidebar,#bookmarks,#rightbg,#random_events,.hustler,.floating_item,.new-news-announcement-banner {
    display: none!important;
}

/* This is the div that is the direct parent of the different pet information sections.
 * #pet_info has 60% width by default, this code resets that.
 */
#pet_info {
    min-width: unset;
    width: auto;
}

/* We get rid of the float because these containers have no business being floated,
 * and are much easier to work with via the display attribute
 * which can be overwritten as there is no !important here.
 */
#column_1, #column_2, #column_3, #pet_treasure {
    margin: 0;
    padding: 0;
    float: none!important;
    display: inline-block;
    vertical-align: top;
    width: unset;
}
#pet_desc, #pet_friends {
    margin: 0;
    padding: 0;
    display: block;
    width: unset;
}
#pet_info>br, br[clear='all'] {
    display: none;
}

/* Now we are going to correct/reset some styles on the specific profile sections. */

/* Pet statistics
 * - Correct the inner height of stat bars
 */
.statbar div.stat {
    height: 100%;
}

/* Pet treasure */


/* Pet friends
 * - Change from float to inline-block so that they remain in document flow
 */
.friend_div {
    float: none;
    height: auto;
    display: inline-block;
    vertical-align: top;
}