/***** CALENDAR *****/
.hb-calendar, .hb-calendar * { -webkit-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.hb-calendar { border-right: 1px solid #333; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: left; font-family: 'Mabry Pro'; margin-bottom: 20px; padding-right: 50px; width: 50%; }
.hb-calendar a { color: inherit; text-decoration: none; transition: .2s; }
/***** MONTHS *****/
.hb-months { margin-bottom: 30px; position: relative; text-align: center; }
.hb-months:after { content: ""; display: table; clear: both; }
.hb-current-month { line-height: 32px; font-size: 32px; text-transform: uppercase; }
.hb-current-month span { display: inline-block; margin-left: 10px; line-height: 20px; color: #333 !important; }
.hb-change-month { position: absolute; top: 3px; display: inline-block; width: 47px; height: 24px; background-position: center center; background-repeat: no-repeat; }
.hb-prev-month { left: 0px; background-image: url("calendario-left.png"); }
.hb-next-month { right: 0px; background-image: url("calendario-right.png"); }
/***** DAYS *****/
.hb-days { background-color: #fff; border-radius: 3px; height: auto; margin: 0 auto; padding: 0; width: 100%; }
.hb-days:after { content: ""; display: table; clear: both; }
.hb-day { border-radius: 1px; display: inline-block; float: left; font-size: 28px; height: 80px; line-height: 80px; margin: 1px; text-align: center; transition: all 0.2s ease 0s; width: 13%; border: 1px solid #fff }
.hb-day.hb-day-name { color: #c4c4c4; font-size: 23px; height: 60px; }
.hb-day.hb-day-active { background-color: #ff6600; border-color: #333; color: #333; cursor: pointer; }
.hb-day.hb-day-active:hover { background-color: #e0762f; color: #fff; }
.hb-day.hb-day-selected, .hb-day.hb-day-selected:hover { background-color: #e4e4e4; color: #fff; cursor: default; }
/*DETAIL CALENDAR*/

.box-calendar { width: 100%; display: inline-block; }
#hb-event-list { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; float: right; padding-left: 50px; width: 50%; }
#hb-event-list h3 { color: #333; display: inline-block; font-family: 'PT Sans'; font-size: 32px; font-weight: 300; line-height: 42px; margin-bottom: 30px; text-align: center; text-transform: uppercase; width: 100%; }
#hb-event-list .myrow { float: left; width: 100%; margin-bottom: 30px; }
#hb-event-list .myrow > li { border-bottom: 1px solid #c4c4c4; display: inline-block; padding: 10px 0; width: 100%; }
#hb-event-list .mytesto { color: #999; font-size: 16px; margin-bottom: 5px; margin-top: 5px; }
#hb-event-list .mytesto a { display: none; }
#hb-event-list h5 { font-size: 26px; letter-spacing: 2px; line-height: 26px; margin-bottom: 5px; }
.infoevent { font-size: 12px; font-weight: 700; text-transform: uppercase; }
#hb-event-list .mybutton { float: right; margin: 0; padding: 10px; }
#hb-event-list .mybutton.tocart img { max-width: 15px; }
#hb-event-list .box-calendar > img { float: left; height: auto; margin: 30px 20px 40px 0; width: 30%; }
/* LOADER */
.hb-loading:before { content: url("iconLoadingOrange.gif"); display: block; width: 100%; text-align: center; }
.hb-error { padding: 10px 15px; background-color: #f2dede; border: 1px solid #ebccd1; border-radius: 3px; color: #b84442; }
/*ASIDE*/
aside .hb-calendar { border-right: 0 none; padding: 0; width: 100%; }
aside .hb-current-month { font-size: 24px; }
aside .hb-day.hb-day-name { font-size: 16px; height: 30px; line-height: 25px; }
aside .hb-day { font-size: 21px; height: 40px; line-height: 40px; }
aside .hb-change-month { background-size: 30px auto; width: 30px; }
aside #hb-event-list { float: left; padding-left: 0; width: 100%; }
#hb-event-list h3 { font-size: 25px; margin-top: 30px; line-height: 32px; }
 @media only screen and (max-width: 960px) {
.hb-current-month { font-size: 19px; line-height: 33px; }
.hb-day.hb-day-name { font-size: 16px; }
.hb-day { font-size:19px; height: 60px; line-height: 60px; }
}
 @media only screen and (max-width: 767px) {
#hb-event-list h3 { font-size: 24px; margin-bottom: 20px; }
.hb-calendar { border-bottom: 1px solid #333; border-right: 0; box-sizing: border-box; float: none; display: block; margin-left: auto; margin-right: auto; margin-bottom: 20px; padding-right: 0; width: 90%; padding-bottom: 20px; }
#hb-event-list { float: none; display: block; margin-left: auto; margin-right: auto; padding-left: 0; width: 90%; }
}
 @media only screen and (max-width: 580px) {
.hb-change-month { width: 35px; background-size: 30px auto; }
}