/**
 * @file
 * Visual styles for Corporate Lite's tabs.
 */
.nav-tabs {
  border-bottom:  1px solid #ddd;   
  margin: 10px 0 20px;
  -webkit-box-shadow: inset 0 -2px 3px rgba(203, 196, 130, 0.06);
  box-shadow: inset 0 -2px 3px rgba(203, 196, 130, 0.06);  
  display: flex;
  -webkit-overflow-scrolling: touch;  
}

@media screen and (max-width: 600px) {
.nav-tabs {
	overflow-x: auto;
    overflow: auto;
	}
}

@media screen and (max-width: 768px) {
.nav-tabs {
	overflow-x: auto;
    overflow: auto;
	}
}

@media screen and (max-width: 1024px) {
.nav-tabs {
	overflow-x: auto;
    overflow: auto;
	}
}
	
.nav-tabs > li > a {
  margin-right:0;
  border: 1px solid transparent;
  padding: 1em ;
  display: block;
  font-weight: 400;
  text-transform: uppercase;
  color: #292929;
  text-decoration: none;  
  border-bottom: 3px solid transparent;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;  
    height: 65px;
   line-height: 30px;
    width: auto;
    text-align: center;
    font-size: 1.4rem; 	
}

.nav-tabs>li { margin-bottom:0 ; margin-left:0.5em;margin-right:0.5em; background-color: whitesmoke;}
.nav-tabs>li.active,  
.nav-tabs > li:hover{
  margin-bottom: -1px;
  border-bottom: 1px solid #fff;  
}
.nav-tabs > li:hover{
  border-left:1px solid #ddd;border-right:1px solid #ddd;
  border-radius: 4px 4px 0 0;}

@media screen and (max-width: 900px) {
.nav-tabs > li {
  width: 20%; 
  } 

   
.view-id-newpagecourses .nav-tabs > li {
    width: 60%; line-height: 10px;
} 

}
@media screen and (max-width: 600px) {
.nav-tabs > li {
  width: 25%;
  display: block;
  } 

.view-id-newpagecourses .nav-tabs > li {
  width: 50%;
}

.nav-tabs>li { margin-bottom:0 ; margin-left:0.3em;margin-right:0.3em; background-color: whitesmoke;}

.nav-tabs  {
  margin: 0; 
} 

}

@media screen and (max-width: 600px) {
  .view-id-newpagecourses .nav-tabs,
  .page-node-406 .nav-tabs {
      position: relative!important;
      display: flex;
      flex-direction: row;
  }
}
.view-id-newpagecourses .view-filters,
.page-node-406 .view-filters {padding-top:1em}

.view-id-newpagecourses .nav-tabs,
.page-node-406 .nav-tabs{
   position: absolute;
  right: 0; z-index:10;
   background-color: #fff!important;
   margin: 10px 0 30px;  
   border-bottom: none;  
  }
  

.view-id-newpagecourses   .nav-tabs>li ,
.page-node-406 .nav-tabs>li { float:right}


 
.view-id-newpagecourses .nav-tabs > li.active > a,
.view-id-newpagecourses  .nav-tabs > li > a:hover,  
.view-id-newpagecourses  .nav-tabs > li > a:focus,
.view-id-newpagecourses  .nav-tabs > li.active > a:focus, 
.view-id-newpagecourses .nav-tabs > li.active > a:hover
{
  background-color: #257b93;
  color:#fff;
  border-left: 0;
  border-right:0;
  border-top: 0;
}
.page-node-406 .nav-tabs > li.active > a,
.page-node-406  .nav-tabs > li > a:hover,  
.page-node-406  .nav-tabs > li > a:focus,
.page-node-406  .nav-tabs > li.active > a:focus, 
.page-node-406 .nav-tabs > li.active > a:hover
{
  background-color: #257b93;
  color:#fff;
  border-left: 0;
  border-right:0;
  border-top: 0;
}

.view-id-newpagecourses .nav-tabs > li > a,
.page-node-406 .nav-tabs > li > a {
  border: 0;
  height: 50px;
  line-height: 25px;
  font-weight:400;
  text-transform: none;
}

.view-id-newpagecourses .nav> li:first-child > a:before,
.page-node-406 .nav> li:first-child > a:before{
content:'\f00b'; 
font-family: 'FontAwesome';
font-size:14px;
display:inline;
 padding-right:0.5em; 
}
.view-id-newpagecourses .nav> li:nth-child(2) > a:before,
.page-node-406 .nav> li:nth-child(2) > a:before{
  content:'\f00a'; 
  font-family: 'FontAwesome';
  font-size:14px;
  display:inline;
  padding-right:0.5em;
  }
/**********************************************/



.headings-wide-spacing-enabled .nav-tabs > li > a {
  letter-spacing: 0.2em;
}
.nav-tabs li a i {
  padding-right: 10px;
  font-size: 20px;
}
.nav-tabs > li > a:hover {
  text-decoration: none;
  border: none;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  text-decoration: none;
  background-color: #fff; 
  border-top: 3px solid #257b93 ;  
  color:  #000101;
  font-weight: bold;
}
 
@media (max-width: 1024px) {
	.nav-tabs > li > a {
	 line-height: 15px;
	}
}

@media (max-width: 768px) {
  .nav-tabs > li > a {
    font-size: 0.8rem;
    padding: 12px 15px 6px;
    margin: 0 2px;
    line-height: 20px;
    position: relative;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
  }
  
  .nav-tabs ~ .tab-content {
    padding: 15px;
  }
  .nav-tabs > li {flex-shrink: 0;}
}
@media (min-width: 992px) {
  .col-md-3 .nav-tabs > li > a {
    font-size: 13px;
    padding: 8px 10px;
  }
  .col-md-3 .nav-tabs ~ .tab-content {
    padding: 20px 10px;
  }
}
@media (min-width: 1200px) {
  .col-md-3 .nav-tabs > li > a {
    padding: 14px 15px 8px;
  }
  .col-md-3 .nav-tabs ~ .tab-content {
    padding: 20px;
  }
}


.tab-content>.active{
	-webkit-animation: cd-fade-in .5s;
    animation: cd-fade-in .5s;}
@-webkit-keyframes cd-fade-in{0%{opacity:0}100%{opacity:1}}
@keyframes cd-fade-in{0%{opacity:0}100%{opacity:1}}
	
/*tabs @colored regions*/
.region--light-typography .nav-tabs > li > a {
  color: #ffffff;
}
.region--light-typography .nav-tabs > li > a:hover,
.region--light-typography .nav-tabs > li > a:focus,
.region--light-typography .nav-tabs > li.active > a,
.region--light-typography .nav-tabs > li.active > a:focus,
.region--light-typography .nav-tabs > li.active > a:hover {
  border-bottom-color: #ffffff;
  color: #ffffff;
}

/*primary tabs*/
ul.tabs.primary {
  margin-bottom: 20px;
}

/*Vertical Tabs*/
.nav-tabs.nav-tabs--vertical {
  display: table-cell;
  min-width: 20%;
  border-right-color: transparent;
  border: 0;
}
.nav-tabs.nav-tabs--vertical + .tab-content {
  display: table-cell;
  max-width: 80%;
}
.nav-tabs.nav-tabs--vertical > li {
  float: none;
}
.nav-tabs.nav-tabs--vertical > li > a {
  min-width: 70px;
  padding-top: 0;
  margin: 0 0px 15px;
  text-align: center;
}
.nav-tabs.nav-tabs--vertical > li > a {
  border-right-color: transparent;
}
.nav-tabs.nav-tabs--vertical ~ .tab-content {
  padding-left: 20px;
}

/*Fancy Tabs*/
.nav-tab__title {
  font-size: 40px;
  text-transform: none;
  font-weight: 400;
}
.headings-wide-spacing-enabled .nav-tab__title {
  letter-spacing: 0.25em;
  text-transform: uppercase;
}
.nav-tab__subtitle {
  display: block;
  font-size: 16px;
  text-transform: none;
}
.nav-tabs.nav-tabs--fancy > li > a {
  padding: 35px 25px 40px;
  background-color: transparent;
  border-color: transparent;
  border-width: 2px;
  border-radius: 0;
  margin: 0;
  color: #2d2d2d;
}
.nav-tabs.nav-tabs--fancy > .active > a,
.nav-tabs.nav-tabs--fancy > .active > a:focus,
.nav-tabs.nav-tabs--fancy > .active > a:hover,
.nav-tabs.nav-tabs--fancy > li > a:focus,
.nav-tabs.nav-tabs--fancy > li > a:hover {
  border-width: 2px;
  background-color: transparent;
}
.nav-tabs.nav-tabs--fancy > li > a:hover {
  background-color: transparent;
  border-color: transparent;
}
.nav-tabs.nav-tabs--fancy + .tab-content {
  padding: 0;
  border-width: 0px;
  border-style: none;
  border-radius: 0px;
  background-color: transparent;
}

/*Fancy Tabs @colored-regions*/
.region--light-typography .nav-tabs.nav-tabs--fancy > li > a {
  color: #ffffff;
}
.region--light-typography .nav-tabs.nav-tabs--fancy > .active > a,
.region--light-typography .nav-tabs.nav-tabs--fancy > .active > a:focus,
.region--light-typography .nav-tabs.nav-tabs--fancy > .active > a:hover,
.region--light-typography .nav-tabs.nav-tabs--fancy > li > a:focus,
.region--light-typography .nav-tabs.nav-tabs--fancy > li > a:hover {
  border-color: #ffffff;
  color: #ffffff;
  background-color: transparent;
}
.region--light-typography.region--colored-background .nav-tab__subtitle {
  color: #ffffff;
}
