@charset "utf-8";
/* CSS Document */

div#page {
	width:90%;
	margin:auto;	
}

.mobile-show {
	display:none;
}

@media only screen and (max-width: 45em) {
	
div#page {
	width:100%;
}

.mobile-show {
	display:block;
}
.mobile-hide {
	display:none;
}
.mobile-center {
	text-align:center;
}
	
div.sidebar_spacer {
	margin:0;
}	
	
div.userbar_button {
	padding:0 5px;
}

.userbar_button.menu-arrow {
    background-position: 95% 55%;
	padding-right: 18px;
}	
	
#text_banner {
	content:url('https://ibbits.com/images/layout/text_banner_mini.gif');
}
	
#sidebar_top, #sidebar  {
	clear:both;
	width:100%;
	margin:0;
}

#sidebar_top .sidebar_box {
	margin:0;
	border-width:0 0 1px 0;
}

#sidebar .sidebar_box {
	margin:0;
	margin-bottom:-1px;
	border-width:1px 0 1px 0;
}

.ibbox_info .ibbox_name { /*allows for companion ibbit's name to take up more horizontal space on mobile*/
	max-width:none;
}

#content p:first-child {
	padding-top:1.5em;
}

div#content {
	clear:both;
	margin:0;
	
}

div#content_wrap {
	margin:0;
}

div#content {
	padding-top:0;
}

.systemmessage {
	margin:0;
	margin-top:-1px;
	border-width:1px 0 1px 0;
}
.dropdown {
	width:100%;
}
.dropdown-child a {
	font-size:1em;
	padding: 20px;
}

.container { /* use on div's where you want the padding to be the same as a p element */
	margin:0 10px .5em 10px;
}
.fullsize { /* use on divs that should become full width on mobile */
	float:none;
	clear:both;
	width:100% !important;
	margin-left:0 !important;
	margin-right:0 !important;
	max-width:none !important;
	display:block !important;
}
.touchable { /*use on things where you want increased padding for touch devices */
	padding: 10px !important;
}
.nomargin {
	margin:0 !important;
}
#topbottom {
	right:0;
}
	
.bubble.right.mobile-transform:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 15px 10px 0;
	border-color: #FFFFFF transparent;
	display: block;
	width: 0;
	z-index: 1;
	margin-top:0;
	top:100%;
	left: 50%;
}
.bubble.left.mobile-transform:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 0 10px 15px;
	border-color: #FFFFFF transparent;
	display: block;
	width: 0;
	z-index: 1;
	margin-left: -10px;
	top: -15px;
	left: 50%;
}
.bubble.bottom.mobile-transform:after {
left: 50%;
}
}
@media only screen and (max-width: 450px) {

/* hide userbar menu arrow if desired
.userbar_button.menu-arrow {
	background-image:none;
	padding-right: 0px;
}	*/
.userbar_button.menu-arrow.arrow-down {
	background-image:none;
}
	
#text_banner {
	content:url('https://ibbits.com/images/layout/text_banner_mini.gif');
}
	

}