
.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.hidden {
  display: none;
  visibility: hidden;
}

.visible-phone {
  display: none !important;
}

.visible-tablet {
  display: none !important;
}

.hidden-desktop {
  display: none !important;
}

@media (min-width: 1200px) {
    
}

@media (max-width: 1024px) {

.friend-square{ 
	margin: 0 10px 20px 20px; 
	padding:5px;
	background:#FFF;
	float: left;
	display: inline-block;
	width:320px;
	height:180px;
	border: 1px solid #9f9f9f;
	border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	box-shadow: 0px 1px 3px #fff; -moz-box-shadow: 0px 1px 3px #fff; -webkit-box-shadow: 0px 1px 3px #fff;
	}
  
}

/*ipad vertical*/

@media (max-width: 980px) {

  body {
    padding: 0; margin:0;
    /* taking out 75px top padding */
    background: #dddddd url(../img/mega-man-bg.gif) top left repeat;
  }
  
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    position: static;
  }

  .navbar .brand { width:120px; padding:0; height:auto; margin:0; background: transparent;}
  .navbar .brand img { width:120px; }
  
  .navbar-inner{ height: auto; width:auto;} 

  	.friend-square{ 
	margin: 10px auto; 
	padding:5px;
	background:#FFF;
	float: none;
	display: block;
	width:300px;
	height:auto;
	border: 1px solid #9f9f9f;
	border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	box-shadow: 0px 1px 3px #fff; -moz-box-shadow: 0px 1px 3px #fff; -webkit-box-shadow: 0px 1px 3px #fff;
	}
  
  .top-avatar{
  color: #FFF;
  font-family: 'Ropa Sans', sans-serif;
  font-size: 14px;
  text-transform:uppercase;
  text-shadow: -1px -1px 0px #004779;
  cursor: pointer;
  padding:5px 0 0 0;
  width:150px;
}
	.top-avatar label{font-size:18px; display: inline; line-height:1em;}
	.top-avatar  span.theavatar{
	  margin:0 5px; 
	  float: left; 
	  display: inline;
	  border-radius: 5px;
	  -moz-border-radius: 5px;
	  -webkit-border-radius: 5px;
	  -webkit-box-shadow: inset 0px 0px 6px 1px rgba(0, 0, 0, 3);        
	  -moz-box-shadow: inset 0px 0px 6px 1px rgba(0, 0, 0, 3);          
	  box-shadow: inset 0px 0px 6px 1px rgba(0, 0, 0, 3);
	  width:35px;
	  height:35px;	 
	}
	    
  .nav-collapse {
    clear: both;
	float: none;	
  }
  .nav-collapse .nav {
    float: none;
    margin: 0;
  }
  .nav-collapse .nav > li {
    float: none;
	display:block;
	padding-left: 10px;
	width:100%;
  }
  .nav-collapse .nav > li > a {
    margin-bottom: 2px;
  }
  .nav-collapse .nav > .divider-vertical {
    display: none;
  }
  .nav-collapse .nav .nav-header {
    color: #999999;
    text-shadow: none;
  }
  .nav-collapse .nav > li > a,  .nav-collapse .dropdown-menu a {
    padding: 6px 15px;
    text-indent: 10px;
    line-height: 2em;
    color: #bbb;
  }
  .nav-collapse .btn {
    padding: 12px;
    font-weight: normal;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
  }
  .nav-collapse .dropdown-menu li + li a {
    margin-bottom: 2px;
  }
  .nav-collapse .nav > li > a:hover,
  .nav-collapse .dropdown-menu a:hover {
    background-color: #222222;
  }
  .nav-collapse.in .btn-group {
    padding: 0;
    margin-top: 5px;
  }
  .nav-collapse .dropdown-menu {
    position: static;
    top: auto;
    left: auto;
    display: block;
    float: none;
    max-width: none;
    padding: 0;
    margin: 0 15px;
    background-color: transparent;
    border: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .nav-collapse .dropdown-menu:before,
  .nav-collapse .dropdown-menu:after {
    display: none;
  }
  .nav-collapse .dropdown-menu .divider {
    display: none;
  }

  .navbar .nav-collapse .nav.pull-right {
    float: none;
    margin-left: 0;
  }
  .nav-collapse,
  .nav-collapse.collapse {
    height: 0;
    overflow: hidden;
  }
  .navbar .btn-navbar {
    display: block;
  }
  .navbar-static .navbar-inner {
    padding-right: 10px;
    padding-left: 10px;
  }
  
  /*nav collapse*/
.navbar .nav li{padding:0 5px; border-bottom:1px solid #333; background: transparent; }
.navbar .nav li a{
	display: block;
	height: auto;
	width:100%;
	background: rgba(0, 55, 102, 0.25);
	padding:5px 10px;
	margin:0;
	font-size:1.25em;
	text-indent:0;
	color:#ddd;
	}
	.navbar .nav li a#plans-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#map-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#contacts-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#vip-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li.active{background: rgba(0, 55, 102, 0.75);} 
	
	.navbar .nav li a span.navText{text-indent: 0; display: inline-block;}
	
	#friendCount{position: relative; text-indent: 60px; margin:0; padding:0; background: none; display: inline-block; color: #FFF; font-weight: bold;}
	

#yourZone{
	padding: 0 0 0 20px; 
	height:30px; 
	width:208px;
	font-family: 'Ropa Sans', sans-serif; 
	background: #444 url(../img/sidebar-bottom-embed-line.gif) bottom left repeat-x;
	border-right: 1px solid #16212a;
	display: table-cell;
	}

.sub-section-nav ul li{height: 45px;}
.sub-section-nav ul li a{font-size:17px; color:#9ca8b1; text-shadow: -1px -1px 0px #333; text-decoration: none; line-height:2.7em; text-transform:uppercase; display:block;}	

	  
  
}

@media (min-width: 980px) {
  .nav-collapse.collapse {
    height: auto !important;
    overflow: visible !important;
  }  
 
}


@media (max-width: 767px) {
  .visible-phone {
    display: inline-block !important;
  }
  .hidden-phone {
    display: none !important;
  }
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important;
  }
}


@media (min-width: 768px) and (max-width: 979px) {

  .visible-tablet {
    display: inherit !important;
  }
  .hidden-tablet {
    display: none !important;
  }
  .hidden-desktop {
    display: inherit !important;
  }
  .visible-desktop {
    display: none !important ;
  }
  
  .row {
    margin-left: -20px;
    *zoom: 1;
  }
  .row:before,
  .row:after {
    display: table;
    content: "";
  }
  .row:after {
    clear: both;
  }
  [class*="span"] {
    float: left;
    margin-left: 20px;
  }
  .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 724px;  }

  .row-fluid {
    width: 100%;
    *zoom: 1;
  }
  .row-fluid:before,
  .row-fluid:after {
    display: table;
    content: "";
  }
  .row-fluid:after {
    clear: both;
  }
  .row-fluid [class*="span"] {
    display: block;
    float: left;
    width: 100%;
    min-height: 28px;
    margin-left: 2.762430939%;
    *margin-left: 2.709239449638298%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
  }
  .row-fluid [class*="span"]:first-child {
    margin-left: 0;
  }
  
}


@media (max-width: 767px) {
    
  .hidden-phone {
    display: none !important;
  }
  
  body { margin:0; padding:0 0 55px 0;  }
  
   .navbar .brand { width:95px; padding:0; height:auto; margin:0; background: transparent;}
  .navbar .brand img { width:95px; margin: 2px 0 0 0; }
  
  .navbar-fixed-top,
  .navbar-fixed-bottom {
  margin:0;
  }
  .container-fluid {
    padding: 0;
	margin:0;
  }
  
  .container {
    width: auto;
  }
 
  #map_canvas{width:auto; height:200px; margin:0; padding:0;}
  
  .nav-collapse {
    -webkit-transform: translate3d(0, 0, 0);	
  }
  

  
  /*nav collapse*/
  .navbar{height: auto;  padding:0; margin:0; }
  .navbar .nav li{padding:0; margin:0; background: transparent; border: none; display: block; border-bottom:1px solid #333;}
  .navbar .nav li a{
	display: block;
	height: auto;
	width:100%;
	background: rgba(0, 55, 102, 0.25);
	padding:5px;
	margin:0;
	text-indent:0;
	color:#ddd;
	}
	.navbar .nav li a#plans-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#map-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#contacts-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li a#vip-btn span{background: transparent; width:auto; height:auto;}
	.navbar .nav li.active{background: rgba(0, 55, 102, 0.75);}  


  .navbar-fixed-top{ height:auto; padding:0; margin:0; }		
  .navbar-inner{ height:auto; padding:0; margin:0; }
  .navbar .brand{ height:auto; padding:0; margin:0; }
 
#main{width:100%; height:auto; display:  block; background: none;}


.sidebar select{background:#e8e8e8; color:#535761; font-size:16px; padding:6px 10px; display: block; overflow:hidden; width:100%; vertical-align: middle;
	 border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
	 }


.sidebar-button{display:block; width:94%; text-align:center; cursor: pointer; font-size:16px; margin-bottom:6px; padding: 8px 0;}

	 
  
/* ---- TABLE HEADER --*/
  
  #professor{display: block; width: 100%; }

  #yourZone{
	padding: 10px 0 15px 15px; 
	height:auto; 
	width:auto;
	font-family: 'Ropa Sans', sans-serif; 
	background: #444 url(../img/sidebar-bottom-embed-line.gif) bottom left repeat-x;
 	display: block;
 	border:none;
	}
	#yourZone span{padding: 2px 4px;}

  .sub-section-nav{
	padding: 0; 
	height:auto; 
	font-family: 'Ropa Sans', sans-serif;
	display: block;
  }
  .sub-section-nav ul li{height: auto; padding:5px;}
  .sub-section-nav ul li:first-child{padding-left: 15px;}
  .sub-section-nav ul li a{font-size:12px !important; text-decoration: none; line-height:2.5em !important; text-transform:uppercase; display: inline-block;}		
  
 
/* ---- SIDE BAR --*/
	.sidebar{
	  width:100%; 
	  height:auto;
	  display: block;
	  border: none;
	  position:absolute;
	  bottom: 0;
	  position:fixed;
	  background: #444;
	  border-top: 1px solid #111;

	}
	.sidebar label.title{
		text-align:center; display: inline-block; width:30%; height:45px; padding:0; margin:5px 0 5px 5px; font-size:1em; line-height:3.5em;
		text-shadow: -1px -1px 1px #111;
		border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;
		border: 1px solid #222; 
		z-index:10;
		
	}
	
	
	#currentlyAt{ display:none; padding: 10px; }
	#newCheckin{ display:none; padding: 10px;}
	#featuredDeal{  display:none; padding: 10px;}
	/*
	.footer-side-accordion div{ margin-top:300px; 
		-webkit-transition: margin 0.5s ease-out;
		-moz-transition: margin 0.5s ease-out;
		-o-transition: margin 0.5s ease-out;
		z-index:1;
		}
	.footer-side-accordion label:hover > div{ margin-top:0px; }
	*/
	

/* ---- MAIN AREA ----*/
	.megaman{	
		width: auto;
		display: block;
		margin: 0;
		padding: 0;
	}
	
	.friend-square{ 
	margin: 10px auto; 
	padding:5px;
	background:#FFF;
	float: none;
	display: block;
	width:90%;
	height:auto;
	border: 1px solid #9f9f9f;
	border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	box-shadow: 0px 1px 3px #fff; -moz-box-shadow: 0px 1px 3px #fff; -webkit-box-shadow: 0px 1px 3px #fff;
	}


footer p{
padding:10px;
color: #FFF;
font-size: 0.6em;
text-transform: uppercase;	
text-align: center;
}

/* ---- MODALS ----*/

.modal-open .dropdown-menu {
  z-index: 2050;
}

.modal-open .dropdown.open {
  *z-index: 2050;
}

.modal-open .popover {
  z-index: 2060;
}

.modal-open .tooltip {
  z-index: 2070;
}

.modal-backdrop {
  /*position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;*/
  z-index: 1040;
  width: 100%;
  height: 100%;
  background: #000000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop,
.modal-backdrop.fade.in {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.modal, #joinModal {
  position: fixed;
  top: 30px;
  left: 1%;
  z-index: 1050;
  width: 80%;
  margin: 0 auto;
  overflow: auto;
  background: #444 url(../img/sidebar-bottom-embed-line.gif) bottom left repeat-x;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 6px;
  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);

}

.modal.fade {
  top: 25%;
  -webkit-transition: opacity 0.3s linear, top 0.3s ease-out;
     -moz-transition: opacity 0.3s linear, top 0.3s ease-out;
      -ms-transition: opacity 0.3s linear, top 0.3s ease-out;
       -o-transition: opacity 0.3s linear, top 0.3s ease-out;
          transition: opacity 0.3s linear, top 0.3s ease-out;
}

.modal.fade.in {
  top: 50%;
}

.modal-header {
  padding: 9px 15px;
  border-bottom: 1px solid #eee;
}

.modal-header .close {
  margin-top: 2px;
}

.modal-body {
  max-height: 400px;
  padding: 15px;
  overflow-y: auto;
}

.modal-form {
  margin-bottom: 0;
}

.modal-footer {
  padding: 14px 15px 15px;
  margin-bottom: 0;
  text-align: right;
  background-color: #f5f5f5;
  border-top: 1px solid #ddd;
  -webkit-border-radius: 0 0 6px 6px;
     -moz-border-radius: 0 0 6px 6px;
          border-radius: 0 0 6px 6px;
  *zoom: 1;
  -webkit-box-shadow: inset 0 1px 0 #ffffff;
     -moz-box-shadow: inset 0 1px 0 #ffffff;
          box-shadow: inset 0 1px 0 #ffffff;
}

.modal-footer:before,
.modal-footer:after {
  display: table;
  content: "";
}

.modal-footer:after {
  clear: both;
}

.modal-footer .btn + .btn {
  margin-bottom: 0;
  margin-left: 5px;
}

.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}


.accordion-inner{padding:0;}

#listCheckins .btn-group{padding: 0; margin: 0 0 0 5px; float: left;}
#listCheckins .btn-group button{vertical-align: top; padding: 5px 6px;}
#listCheckins form select{ margin: 10px 5px 0 5px;}	
#listCheckins form button#checkin_submit{ margin: 10px 0 0 0;}
span.buttonVenueTitle{font-size: 1.10em;}
span.buttonVenueAddress{font-size: 0.7em; color:#666 !important;}

/* INDEX */

#notifications{margin: 10px auto; width: 90%; background: #FFF; 
	border: 1px solid #9f9f9f;
	border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;
	box-shadow: 0px 1px 3px #fff; -moz-box-shadow: 0px 1px 3px #fff; -webkit-box-shadow: 0px 1px 3px #fff;
}
body#frontPage #notifications{padding:10px;}


body#frontPage h3{font-weight: normal; background: #f7f7f7; border-bottom: 1px solid #e8e8e8; padding-left: 10px;}
.indxBox{padding: 5px; line-height: 1.25em; color: #666; font-size: 1em;}
.indxDeal{margin:5px; padding: 5px; line-height: 1.25em; color: #666; font-size: 1em; border: 1px dotted #ddd;}
.indxDeal .dealTitle{ width: auto; float: none; display:block;}

.vipDetails{float: right; width: 150px;}
.vipExtraDetails{display: block; margin: 5px 0; float: none; clear: both;}

/*Create Plan Page */
.create-plan-venue{float: none; display:block; width:100%;}
.create-plan-eta{float: none; display:block; margin: 10px 0; width:100%;}
.planVenue{margin:10px 0; clear:both;}
  
ul.idTabs li a{font-size: 0.8em;}  

.goingcontainer{margin-bottom: 5px}

.venuecheckList{ width: auto; float: none; padding: 5px;}
  
  .btn-group-social .btn{ margin: 0px 0px 10px 0; }
  form#checkinConfirm select{width: 100%; height: 36px; padding: 7px; font-size: 1.25em; text-transform: uppercase;}
    #checkin_submit{width: 100%;}
    
.full-size{ padding: 10px;}  

.sidebar-button{width: auto;}

} /* eof media */


