@media only screen and (min-width: 1200px) {

	.container-fluid{
		width: 50%;
	}
	
}

@media only screen and (max-width: 1200px) {

	.container-fluid{
		width: 100%;
	}
	
}

@media only screen and (max-width: 950px){
	

}

@media only screen and (max-width: 550px){
	#joinTop{
		width: 100%;
	}
	
	#joinBottom{
		width: 100%;
	}
		
	#register{
		width: 100%;
	}

	#reserve{
		width: 100%;

	}
	
	#visit{
		width: 100%;
	}
	
	#full{
		width: 100%;
	}
	
	#selectholder{
		font-size: 0.6em;
	}
	#textHeader{
		font-size: 0.7em;
	}
	
	#extra{
		font-size: 12px;
	}
	
	#topics{
		padding-top: 0px;
	}
	
	#registerBox{
		height: 35px; 	
	}

	#selectBox{
		height: 35px;
		padding: 0px;
	}
	#tooltip{
		width: 100%;
	}
	
	#logo{
		width: 35%;
	}
	
	#classBox{
		margin-top: 2%;
	}
		
	#footerText{
		font-size: 10px;
	}
	

	#scheduleGap{
		margin-top: 2%;
	}
	
	#classButton{
		width: 100%;
	}
	
	#gapVideo{
		margin-top: 3%;
	}	
	
}



@media only screen and (min-width: 375px){
	#textHeader{
		font-size: 12px;
	}
}
@media only screen and (min-width: 414px){
	#textHeader{
		font-size: 13px;
	}
}
@media only screen and (min-width: 500px){
	#textHeader{
		font-size: 1em;
	}
}
@media only screen and (min-width: 550px){
	#textHeader{
		font-size: 1.2em;
	}
	
	
}
.textHeader{
	text-align: center;
}

.classBox{
	border: 2px solid #aaa;
	padding: 2%;
	line-height: 1.5;
}

.classButton {
	padding: 0.7%;
  color: #fff;
  display: inline-block;
  background: #e74c3c;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-family: arial;
  font-size: 17px;
  text-decoration: none;
  border-bottom: 0.2em solid #e32f1c;
  position: relative;
 width: 100%;
 text-align: center;
}
.classButton:hover, .classButton:focus {
  background: #e43725;
  color: #fdf3f2;
}

.classButton:before, .classButton:after {
  display: inline-block;
  font-family: entypo;
  position: absolute;
}
.classButton:active {
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  -webkit-transform: scale(0.92);
  transform: scale(0.92);
}


.tooltipMobile{
  position: relative;
  z-index: 1;
  width: 40%;
  padding: 10px;
  border: 1px solid #eee;
  background-color: #3498db;
  color: #fff;
  font-weight: bold;
  text-align: center;
  
}

.noRadius{
	border-radius: 0px;
}

.tableHover:hover{
	background-color: #eee;
}

#arrow:before {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 89px;
  z-index: 2;
  display: block;
  width: 0;
  border-style: solid;
  border-width: 11px 11px 0;
  border-color: #3498db transparent;
}

#arrow:after {
  content: "";
  position: absolute;
  bottom: -9px;
  left: 90px;
  z-index: 3;
  display: block;
  width: 0;
  border-style: solid;
  border-width: 10px 10px 0;
  border-color: #3498db transparent;
}

.text{
	height: 2.4em;
	padding-left: 1%;
	width: 100%;
	border: 1px solid #ccc;
}

.extra{
	font-size: 17px;
	color: #fff;
}

.registerBox{
	height: 4%;
	padding-left: 3%;
	width: 100%;
	margin-top: 1%;
	border: 1px solid #ccc;
}

.style{

	text-align: center;

}

.style:hover{
	border-bottom: 7px solid #fff;
	border-right: 7px solid #fff;	
}

  .carousel-inner > .item > img,
  .carousel-inner > .item > img {
      width: 100%;
      margin: auto;
  }

.topics{
	padding-top: 3%;
} 
  
.join {
  padding: 1% 2%;
  color: #d8e6fc;
  display: inline-block;
  background: #e67e22;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-family: arial;
  font-size: 1em;
  text-decoration: none;
  position: relative;
  text-align: center;
  width: 35%;
}
.join:hover, .join:focus {
  background: #e67e22;
  color: #eff5fe;
  text-decoration: none;
}

.join:before, .join:after {
  display: inline-block;
  font-family: entypo;
  position: absolute;
}
.join:active {
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  -webkit-transform: scale(0.92);
  transform: scale(0.92);
}
.join:hover, .join:focus {
  box-shadow: 0 0 0 5px #f1c40f;
}

.register {
  width:40%;
  background:#e67e22;
  border:0;
  padding:4%;
  font-family:'Open Sans',sans-serif;
  font-size:16px;
  color:#fff;
  cursor:pointer;
  transition:background .3s;
  -webkit-transition:background .3s;
}
.register:hover, .register:focus {
  background: #e67e22;
  color: #effef0;
}

.register:before, .register:after {
  display: inline-block;
  font-family: entypo;
  position: absolute;
}

.register:hover, .register:focus {
  box-shadow: 0 0 0 5px #f1c40f;
}

.reserve {
  padding: 1.3%;
  text-align: center;
  color: #fff;
  display: inline-block;
  background: #27ae60;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-family: arial;
  font-size: 15px;
  text-decoration: none;
  border-bottom: 0.1em solid #2ecc71;
  position: relative;
  width: 40%;
  float: right;
}
.reserve:hover, .reserve:focus {
  background: #27ae60;
  color: #effef0;
}

.reserve:before, .reserve:after {
  display: inline-block;
  font-family: entypo;
  position: absolute;
}
.reserve:active {
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  -webkit-transform: scale(0.92);
  transform: scale(0.92);
}
.reserve:hover, .reserve:focus {
  box-shadow: 0 0 0 5px #90f799;
}

.visit {
	padding: 0.7%;
  /*
  Setting the color based on the background, as described above (1)
  */
  /*
  Adding the icons, see (2)
  */
  color: #fff;
  display: inline-block;
  background: #e74c3c;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-family: arial;
  font-size: 15px;
  text-decoration: none;
  border-bottom: 0.2em solid #e32f1c;
  position: relative;
 width: 15%;
}
.visit:hover, .visit:focus {
  background: #e43725;
  color: #fdf3f2;
}

.visit:before, .visit:after {
  display: inline-block;
  font-family: entypo;
  position: absolute;
}
.visit:active {
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  -webkit-transform: scale(0.92);
  transform: scale(0.92);
}
.visit:hover, .visit:focus {
  box-shadow: 0 0 0 5px #f29f97;
}

.full {
  padding: 1.3%;
	text-align: center;
  color: #7f8c8d;
  display: inline-block;
  background: #ccc;
  font-family: arial;
  font-size: 15px;
  text-decoration: none;
  position: relative;
  width: 35%; 
}
.full:hover, .full:focus {
  background: #ccc;
  color: #7f8c8d;
}



.tabbed_box {
    margin: 0px auto 0px auto;
    width: 100%;
}

.tabbed_box h4 {
    font-family:Arial, Helvetica, arial;
    font-size:23px;
    color:#aaa;
    letter-spacing:-1px;
    margin-bottom:10px;
}

.tabbed_box h4 small {
    color:#e3e9ec;
    font-weight:normal;
    font-size:9px;
    font-family:Verdana, Arial, Helvetica, arial;
    text-transform:uppercase;
    position:relative;

    letter-spacing:0px;
}
.tabbed_area {
	width: 100%;
    background-color: transparent;
    padding:8px;    
}

ul.tabs {
background: transparent;
padding-bottom: 0px;
margin-bottom: 0px;
height: 19px;
}
ul.tabs li {
    list-style:none;
    display:inline;
}

ul.tabs li a {
    background-color:#464c54;
    color:#fff;
    padding:8px 14px 8px 14px;
    text-decoration:none;
    font-size:9px;
    font-family:Verdana, Arial, Helvetica, arial;
    font-weight:bold;
    text-transform:uppercase;
}
ul.tabs li a:hover {
    background-color:#2f343a;
    border-color:#2f343a;
}
ul.tabs li a.active {
    background-color:#ecf0f1;
    color:#282e32; 
    border-top: 2px solid #000;
}
.content {
    background-color:#ecf0f1;
    padding:10px;
}
#content_2, #content_3 { display:none; }
ul.tabs {
    margin:0px; padding:0px;
    margin-top:5px;
    margin-bottom:6px;
}
.content ul {
    margin:0px;
    padding:0px 20px 0px 20px;
}
.content ul li {
    list-style:none;
    padding-bottom:15px;
    font-size:13px;
}
.content ul li a {
    text-decoration:none;
    color:#3e4346;
}
.content ul li a small {
    color:#8b959c;
    font-size:9px;
    text-transform:uppercase;
    font-family:Verdana, Arial, Helvetica, arial;
    position:relative;
    left:4px;
    top:0px;
}

ul.tabs li a {
    background-image:url(images/tab_off.jpg);
    background-repeat:repeat-x;  
    background-position:bottom;
}
ul.tabs li a.active {
    background-image:url(images/tab_on.jpg);
    background-repeat:repeat-x;
    background-position:top; 
}
.content {
    background-image:url(images/content_bottom.jpg);
    background-repeat:repeat-x;  
    background-position:bottom; 
}

li{
	font-weight: bold;
}

a:hover{
	text-decoration: none;
	font-weight: bold;
}

a.weight{
	font-weight: bold;
}

a:active{
	text-decoration: none;
}
a:visited{
	text-decoration: none;
}



/* Tabs panel */
.tabbable-panel {
  border:1px solid #eee;
 background-color: #eee;

}

/* Default mode */
.tabbable-line > .nav-tabs {
  border: none;
  margin: 0px;
}
.tabbable-line > .nav-tabs > li {

}
.tabbable-line > .nav-tabs > li > a {
  border: 0;
  margin-right: 0;
  color: #737373;
  background-color: #eee;
   
}
.tabbable-line > .nav-tabs > li > a > i {
  color: #a6a6a6;
  background-color: #eee;
}
.tabbable-line > .nav-tabs > li.open, .tabbable-line > .nav-tabs > li:hover {
 background-color: #fff;
 border-bottom: 4px solid #fff;
}
.tabbable-line > .nav-tabs > li.open > a, .tabbable-line > .nav-tabs > li:hover > a {
  border: 0;
  background: none !important;
  color: #333333;
}
.tabbable-line > .nav-tabs > li.open > a > i, .tabbable-line > .nav-tabs > li:hover > a > i {
  color: #a6a6a6;
}
.tabbable-line > .nav-tabs > li.open .dropdown-menu, .tabbable-line > .nav-tabs > li:hover .dropdown-menu {
  margin-top: 0px;
}
.tabbable-line > .nav-tabs > li.active {
  border-bottom: 1px solid #fff;
  position: relative;
}
.tabbable-line > .nav-tabs > li.active > a {
  border: 0;
  color: #333333;
    background-color: #fff;
	border-top: 4px solid #e74c3c;
}
.tabbable-line > .nav-tabs > li.active > a > i {
  color: #404040;
}
.tabbable-line > .tab-content {

  background-color: #fff;
  border: 0;
  padding: 15px 0;
}
.portlet .tabbable-line > .tab-content {
  padding-bottom: 0;
}

/* Below tabs mode */

.tabbable-line.tabs-below > .nav-tabs > li {
  border-top: 4px solid transparent;
}
.tabbable-line.tabs-below > .nav-tabs > li > a {
  margin-top: 0;
}
.tabbable-line.tabs-below > .nav-tabs > li:hover {
  border-bottom: 0;
  border-top: 4px solid #fbcdcf;
}
.tabbable-line.tabs-below > .nav-tabs > li.active {
  margin-bottom: -2px;
  border-bottom: 0;
  border-top: 4px solid #f3565d;
}
.tabbable-line.tabs-below > .tab-content {
  margin-top: -10px;
  border-top: 0;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
}

/*Divider*/
 .divider {
  display: flex;
}
.divider:before, .divider:after {
  content: "";
  flex: 1;
}

.line {
  align-items: center;
  margin: 1em -1em;
}
.line:before, .line:after {
  height: 1px;
  margin: 0 1em;
}

.one-line:before, .one-line:after {
  background: black;
}

.bannerLabel{
	border: 1px solid #3498db;
	background-color: #3498db;
	text-align: left;
	padding-top: 1%;	
	padding-left: 1%;

}

.bannerText{
	font-size: 24px;
	color: #fff	
}

.floatLeft {
	float:left;
}

.floatRight {
	float:right;
}

option:disabled { color: #ddd; }