/*!
 * Custom Global CSS - Andy L.W.L
 */
html, body {	
	 font-family: 'PT Sans', 'Helvetica Neue', Arial, sans-serif !important;	 
}
/*-----------------------------------------------------------------------------------------------------
                               sitewide
-------------------------------------------------------------------------------------------------------*/
body
{
  background: #FFFFFF;
  
  //  background: #b3dced; /* Old browsers */
  //  background: -moz-linear-gradient(-45deg, #b3dced 0%, #29b8e5 50%, #bce0ee 100%); /* FF3.6-15 */
  //   background: -webkit-linear-gradient(-45deg, #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* Chrome10-25,Safari5.1-6 */
  //  background: linear-gradient(135deg, #b3dced 0%,#29b8e5 50%,#bce0ee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  //  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#bce0ee',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    
    /*background: url(../img/homepage-gradient.png);*/
 //   background-attachment: fixed;
 //   background-position: center;
 //   background-size: 100% 100%;
 //   min-height: 100%;
    
   /* background: rgba(0,13,51,1);
    background: -moz-linear-gradient(left, rgba(0,13,51,1) 0%, rgba(128,180,231,1) 93%, rgba(138,193,245,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,13,51,1)), color-stop(93%, rgba(128,180,231,1)), color-stop(100%, rgba(138,193,245,1)));
    background: -webkit-linear-gradient(left, rgba(0,13,51,1) 0%, rgba(128,180,231,1) 93%, rgba(138,193,245,1) 100%);
    background: -o-linear-gradient(left, rgba(0,13,51,1) 0%, rgba(128,180,231,1) 93%, rgba(138,193,245,1) 100%);
    background: -ms-linear-gradient(left, rgba(0,13,51,1) 0%, rgba(128,180,231,1) 93%, rgba(138,193,245,1) 100%);
    background: linear-gradient(to right, rgba(0,13,51,1) 0%, rgba(128,180,231,1) 93%, rgba(138,193,245,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000d33', endColorstr='#8ac1f5', GradientType=1 );*/

}

/* Copied from custom.css */

* {
    outline: none !important;
    box-shadow: none;
}


 .h1, .h2, .h3, h1, h2, h3 {
            margin-top: 0px;
            margin-bottom: 0px;
        }

        
.btn {
    border-radius: 0;
    transition: background 0.5s cubic-bezier(.17,.67,.83,.67);
}

#overlay-public
{
    background-color: rgba(255, 255, 255, 0.0);
    position: relative;
	overflow: visible;
}

#overlay-default
{
    background-color: rgba(255, 255, 255, 0.0);
    position: relative;
    min-height:100%;
    overflow: visible;
}

.headerspacer 
{
	height: 60px;
	width: 100%;
	display: block;
}

.notify_red {
    background-color: #FF0000;
    float: left;
    display: inline-block;
    width: 5px;
    height: 70px;
    margin: 0px 10px 0px 0px;
}

.notify_green {
    background-color: #75BB38;
    float: left;
    display: inline-block;
    width: 5px;
    height: 70px;
    margin: 0px 10px 0px 0px;
}

.notify_message {
   display: inline-block;
   width: 360px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   margin-right: 20px;
}
@media (min-width: 768px) {
    .navbar-right {
        margin-top:0px;
    }
}

.featherlight-iframe .featherlight-content {
    width:auto;
    height:auto;
}

.padtop20 {
	margin-top: 20px;
}

.padtop10 {
	margin-top: 10px;
}

.rounded20 {
    padding: 20px;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -moz-box-shadow: 0 0 3px #888;
    -webkit-box-shadow: 0 0 3px #888;
    box-shadow: 0 0 3px #888;	
}

.whitebg {
	background: #FFFFFF;
}

.content_panel {
	margin-bottom: 60px;
}

.loop_header_logo {
    position: relative;
    display: inline-block;
    left: 13%; 
}

/* Flash Alert to Override Bootstrap.css */
.alert {
	margin-bottom: 0px !important;
	
}

a {
	color: #2DA5D8;
}

video {
    cursor:pointer;
}


video:hover {
    cursor: hand;
}

audio {
    cursor:pointer;
}


audio:hover {
    cursor: hand;
}

.iframe_content_panel {
	min-height: 300px;
	max-height: 500px;
	padding: 10px;
}

/*.ui-helper-hidden-accessible { display:none; }
.ui-autocomplete {

}*/

#autocomplete-panel {
    position: absolute;
    padding: 0px 10px 10px 10px;
    min-width: 300px;
    max-width: 500px;
    line-height: 20px;
    border: 1px solid #5D5D5D;
    background-color: #FFF;
    margin-left: 200px;
    font-size: 11px;
    border: 1px solid #5D5D5D;
    box-shadow: 5px 5px 2px rgba(0,0,0, 0.2);
    display: none;
    z-index: 9997;
	top: 60px;
}

.autocomplete ul li
{
    list-style: none;
    display: block;
}

.ui-autocomplete a { 
	color: #5D5D5D;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}
 


/*-----------------------------------------------------------------------------------------------------
                                navbar
-------------------------------------------------------------------------------------------------------*/
#navigation, .navbar-default
{
    /*position: fixed;
    top: 0px;
    z-index:9998;*/
    width: 100%;
    border-radius: 0px;
    border: 0;
    border-bottom: 1px solid #E864A0;
}

.logolink {
    width:20%; 
    display:inline-block; 
    height: 50px;
    position: absolute;
    top: 5px;
    cursor: pointer;
}

.login-width
{
    
    width:35%;
}

.forget-width
{
    width:40%;
}

.producer-width
{
     width:45%;
}



@media (max-width: 768px) {
   /* .navbar-top { */
        background-color: #FFFFFF;
        background-image: url(../img/loop-trans-noslogan.png);
        background-position: center;
        background-size: 80px 40px; 
        background-repeat: no-repeat;
        display: block;
        height: 50px;
        }
    .navbar {
        background-color: #FFFFFF;
        background-position: center;
        background-size: 100px 50px;
        background-repeat: no-repeat;
        margin-bottom: 0px;
        padding: 5px 5px;
        min-height: 0;
        height: 60px;
    }
    .login-width
    {

        width:50% !important;
    }
    
    .forget-width
    {
        width:60%;
    }
    .producer-width
    {
         width:60% !important;
    }

    
}

@media (min-width: 769px) {
    .navbar {
        background-color: #FFFFFF;
       /* background-image: url(../img/loop-trans-noslogan.png);*/
        background-position: center;
        background-size: 100px 50px;
        background-repeat: no-repeat;
        margin-bottom: 0px;
        padding: 5px 5px;
        min-height: 0;
    }
}

.navbar-header {
    vertical-align: middle;
    width: 100%;
}

.browse-cat {
    font-size: 14px;
    border: 1px solid #5D5D5D;
    border-radius : 5px;
    margin: 3px 0 0 0;
    padding: 10px;
    cursor: default;
    display: inline-block;

}

.navbar-default .navbar-nav>li>a{
    font-size: 14px;
    transition: all 0.5s cubic-bezier(.17,.67,.83,.67);
    color: #5D5D5D;
    margin: 10px 10px;
    padding: 0;
    line-height: 28px;
    text-transform: capitalize;
}

.navbar-default .navbar-nav>li>p {
    font-size: 14px;
    transition: all 0.5s cubic-bezier(.17,.67,.83,.67);
    color: #5D5D5D;
    margin: 10px 20px;
    padding: 0;
    line-height: 28px;
    text-transform: capitalize;
}

.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus
{
    color: #2DA5D8;
}
.navbar-default .navbar-brand {
    color: #000;
    padding: 5px 15px;  
    font-size: 19px;  
    line-height: 100%;  
    height: auto;
}

.nav-wrap 
{
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9999;
}

/*----------------------------------------------------------------------------------------------------
                                    FOOTER
-----------------------------------------------------------------------------------------------------*/
.main-footer
{
    background-color: rgba(255,255,255,1);
    border-top: 1px solid #E864A0;
    padding: 0px 0px;
    position: fixed; 
    z-index: 9998;
    bottom: 0;
    width: 100%;
    height: 35px;
}

.main-footer p {
    font-size: 10px;
}

.copyright
{
    float: left;
    display: inline-block;
    position: relative;
    margin-left: 10px; 
    font-weight: bold;
    color: #5D5D5D;
	width:99%;

}

.otherlinks {
    float: right;
    position: relative;
    margin-top: 10px;
    margin-right: 10px;
    display: inline-block;
    font-size: 10px;
    font-weight: bold;
}

.otherlinks ul li {
    margin-left: 10px;
    margin-right: 10px;
}

/*-----------------------------------------------------------------------------------------------------
                                main page
-------------------------------------------------------------------------------------------------------*/
#intropage {
	margin-top: 5%;
	text-align: center;
}
.supercharge {
	width: 50%;
	float: left;
	margin-bottom: 20px;
}
.drive {
	width: 50%;
	float: right;
	margin-bottom: 20px;
}
.evidence {
    background: rgba(91, 91, 91, 0);
    border-radius: 0 0 8px 8px;
    padding: 0 20px 20px;
    box-sizing: border-box;
    position: relative;
}
.evidence ul {
	list-style: none;
}
.evidence ul li {
    float: left;
    width: 33%;
    text-align: center;
}

.evidence ul li h3 {
    font-size: 20px;
    color: #5D5D5D;
    padding: 20px 0 50px;
}

.evidence ul li h3 span {
    color: #ccc;
    font-size: 16px;
    font-weight: 400;
}


.inner-banner {
    background: rgba(91, 91, 91, 0);
    border-radius: 8px 8px 0 0;
    padding: 30px 20px 10px;
	text-align: center;
}
.inner-banner h1 {
	/* color: #E864A0; */
    color: #5D5D5D; 
}

.inner-banner hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #5D5D5D;
    margin: 1em 0;
    padding: 0; 
}

.banner-searchBox {
    width: 33%;
    padding-top: 5px;
    position: relative;
    float: left;
    margin: 0 0 0 9%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}


.banner-searchBox input[type='text'] {
    padding: 18px 12px;
    overflow: visible;
    outline: none;
    margin: 0;
    border: 1px solid #5D5D5D;
    border-radius: 3px;
    background: #fff;
    font-size: 18px;
    width: 100%;
    line-height: 24px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.banner-msg .banner-cta .or {
    float: left;
    width: 16%;
}

.banner-msg .banner-cta .or div {
    padding: 20px 0;
    border-radius: 50%;
    color: #5D5D5D;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    border: 4px solid rgba(91, 91, 91, 1);
    width: 69px;
    margin: 0 auto;
}

.banner-cta .post-box {
    float: left;
    width: 33%;
    padding-top: 5px;
}

.banner-msg .banner-cta .post-box .btnGreenFlat {
    font-size: 20px;
    padding: 16px 15px 18px;
    width: 100%;
    line-height: 24px;
    box-sizing: border-box;
}
.btnGreenFlat:hover {
    background: #376aa5;
    color: #fff;
    text-decoration: none;
}

.btnGreenFlat {
    background: #4c83c3;
    cursor: pointer;
    line-height: 18px;
    margin: 0 !important;
    border: none;
    padding: 8px 15px;
    display: inline-block;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-clip: padding-box;
    width: auto;
    font-size: .8rem;
    color: #fff;
    outline: none;
    position: relative;
    font-size: inherit;
}

.banner-searchBox a {
    display: block;
}

.banner-searchBox a {
    position: absolute;
    top: 15px;
    right: 10px;
    padding: 10px 15px;
    font-size: 19px;
    border-bottom-width: 1px !important;
}

/*-----------------------------------------------------------------------------------------------------
                              search page
-------------------------------------------------------------------------------------------------------*/


.srchCatID {
	width: 200px;
}

@media (max-width: 768px) {
    .searchPanel {
            display: inline-block;
            margin: 3px 0 0 10px;
            height: 40px;
            width: 150px;
    }
}

@media (min-width: 770px) {
    .searchPanel {
            display: inline-block;
            margin: 3px 0 0 10px;
            height: 40px;
            width: 200px;
    }
}

.searchform .searchField {
    padding: 6px;
    width: 100%;
}

#searchsubmit {
    position:relative;
    right: 0px;
    top: 0px;
}

#searchQuery {
    margin-top: 5px;
}

.searchDropdownWrapper {
	margin: 0px;
	height: 25px;
	display: inline-block;
	position: absolute;
}
.searchFieldWrapper {
	/*margin-left: 23%;*/
	height: 25px;
	width:300px;
	position: relative;
	display: inline-block;
}
.searchFieldWrapper input, .searchFieldWrapper img {
	position: absolute; 
	display: inline-block;
}
.searchsubmit {
	left: 260px;
}
.searchFieldWrapper img {
	top: 8px; 
	z-index:8888;
	left: 170px;
}
.browseSearchform .searchsubmit, .searchform .searchsubmit {
	position: absolute;
	top: 3px;
	right: -7px;
	color: #a6a7a8;
	width: 34px;
	height: 28px;
	font-size: 17px;
	line-height: 21px;
	text-align: center;
	font-weight: 400;
	background: 0 0;
	border: 0;
	border-left: 1px dotted #a6a7a8;
	cursor: pointer;
	outline: 0;
}
/*-----------------------------------------------------------------------------------------------------
                              courses page
-------------------------------------------------------------------------------------------------------*/

/**
*
* Animate.css
* From : http://daneden.me/animate/
*
**/
.animated {
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -ms-animation-duration: 1s;
  -o-animation-duration: 1s;
  animation-duration: 1s; }

.animated.hinge {
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -ms-animation-duration: 2s;
  -o-animation-duration: 2s;
  animation-duration: 2s; }

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.3); }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05); }

  70% {
    -webkit-transform: scale(0.9); }

  100% {
    -webkit-transform: scale(1); } }

@-moz-keyframes bounceIn {
  0% {
    opacity: 0;
    -moz-transform: scale(0.3); }

  50% {
    opacity: 1;
    -moz-transform: scale(1.05); }

  70% {
    -moz-transform: scale(0.9); }

  100% {
    -moz-transform: scale(1); } }

@-o-keyframes bounceIn {
  0% {
    opacity: 0;
    -o-transform: scale(0.3); }

  50% {
    opacity: 1;
    -o-transform: scale(1.05); }

  70% {
    -o-transform: scale(0.9); }

  100% {
    -o-transform: scale(1); } }

@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3); }

  50% {
    opacity: 1;
    transform: scale(1.05); }

  70% {
    transform: scale(0.9); }

  100% {
    transform: scale(1); } }

.bounceIn {
  -webkit-animation-name: bounceIn;
  -moz-animation-name: bounceIn;
  -o-animation-name: bounceIn;
  animation-name: bounceIn; }

@-webkit-keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px); }

  80% {
    -webkit-transform: translateY(10px); }

  100% {
    -webkit-transform: translateY(0); } }

@-moz-keyframes bounceInUp {
  0% {
    opacity: 0;
    -moz-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateY(-30px); }

  80% {
    -moz-transform: translateY(10px); }

  100% {
    -moz-transform: translateY(0); } }

@-o-keyframes bounceInUp {
  0% {
    opacity: 0;
    -o-transform: translateY(2000px); }

  60% {
    opacity: 1;
    -o-transform: translateY(-30px); }

  80% {
    -o-transform: translateY(10px); }

  100% {
    -o-transform: translateY(0); } }

@keyframes bounceInUp {
  0% {
    opacity: 0;
    transform: translateY(2000px); }

  60% {
    opacity: 1;
    transform: translateY(-30px); }

  80% {
    transform: translateY(10px); }

  100% {
    transform: translateY(0); } }

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  -moz-animation-name: bounceInUp;
  -o-animation-name: bounceInUp;
  animation-name: bounceInUp; }

@-webkit-keyframes bounceInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateY(30px); }

  80% {
    -webkit-transform: translateY(-10px); }

  100% {
    -webkit-transform: translateY(0); } }

@-moz-keyframes bounceInDown {
  0% {
    opacity: 0;
    -moz-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateY(30px); }

  80% {
    -moz-transform: translateY(-10px); }

  100% {
    -moz-transform: translateY(0); } }

@-o-keyframes bounceInDown {
  0% {
    opacity: 0;
    -o-transform: translateY(-2000px); }

  60% {
    opacity: 1;
    -o-transform: translateY(30px); }

  80% {
    -o-transform: translateY(-10px); }

  100% {
    -o-transform: translateY(0); } }

@keyframes bounceInDown {
  0% {
    opacity: 0;
    transform: translateY(-2000px); }

  60% {
    opacity: 1;
    transform: translateY(30px); }

  80% {
    transform: translateY(-10px); }

  100% {
    transform: translateY(0); } }

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  -moz-animation-name: bounceInDown;
  -o-animation-name: bounceInDown;
  animation-name: bounceInDown; }

@-webkit-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateX(30px); }

  80% {
    -webkit-transform: translateX(-10px); }

  100% {
    -webkit-transform: translateX(0); } }

@-moz-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateX(30px); }

  80% {
    -moz-transform: translateX(-10px); }

  100% {
    -moz-transform: translateX(0); } }

@-o-keyframes bounceInLeft {
  0% {
    opacity: 0;
    -o-transform: translateX(-2000px); }

  60% {
    opacity: 1;
    -o-transform: translateX(30px); }

  80% {
    -o-transform: translateX(-10px); }

  100% {
    -o-transform: translateX(0); } }

@keyframes bounceInLeft {
  0% {
    opacity: 0;
    transform: translateX(-2000px); }

  60% {
    opacity: 1;
    transform: translateX(30px); }

  80% {
    transform: translateX(-10px); }

  100% {
    transform: translateX(0); } }

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  -moz-animation-name: bounceInLeft;
  -o-animation-name: bounceInLeft;
  animation-name: bounceInLeft; }

@-webkit-keyframes bounceInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -webkit-transform: translateX(-30px); }

  80% {
    -webkit-transform: translateX(10px); }

  100% {
    -webkit-transform: translateX(0); } }

@-moz-keyframes bounceInRight {
  0% {
    opacity: 0;
    -moz-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -moz-transform: translateX(-30px); }

  80% {
    -moz-transform: translateX(10px); }

  100% {
    -moz-transform: translateX(0); } }

@-o-keyframes bounceInRight {
  0% {
    opacity: 0;
    -o-transform: translateX(2000px); }

  60% {
    opacity: 1;
    -o-transform: translateX(-30px); }

  80% {
    -o-transform: translateX(10px); }

  100% {
    -o-transform: translateX(0); } }

@keyframes bounceInRight {
  0% {
    opacity: 0;
    transform: translateX(2000px); }

  60% {
    opacity: 1;
    transform: translateX(-30px); }

  80% {
    transform: translateX(10px); }

  100% {
    transform: translateX(0); } }

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  -moz-animation-name: bounceInRight;
  -o-animation-name: bounceInRight;
  animation-name: bounceInRight; }

@-webkit-keyframes rotateIn {
  0% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: center center;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateIn {
  0% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: center center;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateIn {
  0% {
    -o-transform-origin: center center;
    -o-transform: rotate(-200deg);
    opacity: 0; }

  100% {
    -o-transform-origin: center center;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateIn {
  0% {
    transform-origin: center center;
    transform: rotate(-200deg);
    opacity: 0; }

  100% {
    transform-origin: center center;
    transform: rotate(0);
    opacity: 1; } }

.rotateIn {
  -webkit-animation-name: rotateIn;
  -moz-animation-name: rotateIn;
  -o-animation-name: rotateIn;
  animation-name: rotateIn; }

@-webkit-keyframes rotateInUpLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInUpLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInUpLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInUpLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(90deg);
    opacity: 0; }

  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  -moz-animation-name: rotateInUpLeft;
  -o-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft; }

@-webkit-keyframes rotateInDownLeft {
  0% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: left bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInDownLeft {
  0% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: left bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInDownLeft {
  0% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: left bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInDownLeft {
  0% {
    transform-origin: left bottom;
    transform: rotate(-90deg);
    opacity: 0; }

  100% {
    transform-origin: left bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  -moz-animation-name: rotateInDownLeft;
  -o-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft; }

@-webkit-keyframes rotateInUpRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInUpRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInUpRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(-90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInUpRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(-90deg);
    opacity: 0; }

  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  -moz-animation-name: rotateInUpRight;
  -o-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight; }

@-webkit-keyframes rotateInDownRight {
  0% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -webkit-transform-origin: right bottom;
    -webkit-transform: rotate(0);
    opacity: 1; } }

@-moz-keyframes rotateInDownRight {
  0% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -moz-transform-origin: right bottom;
    -moz-transform: rotate(0);
    opacity: 1; } }

@-o-keyframes rotateInDownRight {
  0% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(90deg);
    opacity: 0; }

  100% {
    -o-transform-origin: right bottom;
    -o-transform: rotate(0);
    opacity: 1; } }

@keyframes rotateInDownRight {
  0% {
    transform-origin: right bottom;
    transform: rotate(90deg);
    opacity: 0; }

  100% {
    transform-origin: right bottom;
    transform: rotate(0);
    opacity: 1; } }

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  -moz-animation-name: rotateInDownRight;
  -o-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight; }


/**
*
* Responsive list
*
**/
@media (max-width: 768px) {
    .course-box1{
        display: inline-block;
        width: 19% !important;
        height: 220px !important;
        margin: 5px;
    }
    .teaser {
        width: 100%;
        background-color: #5D5D5D;
        text-align: center;
        padding: 20px 10px;
        min-height: 600px !important;
        max-height: 800px !important;
    }
    .content img {
        width: 100%;
        margin: 0 !important;
        height: 100px !important; 
      }
      
    .card-front p {
        font-size: 10px !important;
        line-height: 1.3em;
        color: #3d3d3d;
        width: 90%;
        margin-left: 10px;
    }
    
    .card-back p {
        font-size: 11px !important;
    }
      
    .ellipsis-2lines {
        display: -webkit-box;
         overflow: hidden;
         height: 40px !important;
         -webkit-line-clamp: 3 !important;
         -webkit-box-orient: vertical;
         text-overflow: ellipsis;
    }
    
    .ellipsis-7lines {
        display: -webkit-box;
        overflow: hidden;
        height: 85px !important;
        margin-bottom: 20px;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
    }
}

@media (min-width: 769px) {
    .course-box1{
        display: inline-block;
        width: 19% !important;
        height: 240px !important;
        margin: 5px;
    }
    
     .ellipsis-7lines {
        display: -webkit-box;
        overflow: hidden;
        height: 85px !important;
        margin-bottom: 20px;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;
    }
    
     .content img {
        width: 100%;
        margin: 0 !important;
        height: 123px !important; 
        box-shadow: 0px 5px 5px #888888;
      }
}

.addWishlist {
    color: #FFFFFF;
    margin-top: 2px;
    float: left;
}

.addWishlist:hover {
    color: #E864A0;
    cursor: pointer;
}

.delWishlist {
    color: #E864A0; 
    margin-top: 2px;
    float: left;
}

.delWishlist:hover {
    color: #FFFFFF; 
}

.wishlist-btn {
    color: #FFFFFF;
    background-color: #E864A0;
    display: block;
}

.wishlist-btn:hover {
    background-color: #851447;
    color: #FFFFFF;
}

.wishlisted-btn {
    color: #FFFFFF;
    background-color: #2DA5D8;
    display: block;
}

.wishlisted-btn:hover {
    background-color: #337ab7;
    color: #FFFFFF;
}

.wishlisted {
    margin-top: 2px;
    float: left;
    color: #E864A0; 
}

.responsive {
  width: 100%;
  height: 100%;
}

.content {
  float: left;
  width: 100%;
  height: 100%;
  padding: 0 !important;
}
.content img {
  width: 100%;
  margin: 0 !important;
  max-height: 123px; 
}
.content li {
  float: left;
  border: 1px solid #2c2c2c;
  width: 33.2%;
  height: 33%;
  position: relative;
  overflow: hidden;
}

.course-info {  
    display: inline-block;
    float: left;
    width: 70%;
    text-align: left;
    margin-bottom: 60px;
    padding-right: 10px;
    border-right: 1px solid #EFEFEF;
}

.course-extended-info {
    margin-top: 20px;
   /* border-top:1px solid #ccc;*/
    display: block;
}

.course-extended-info .ratings{
   margin:20px 0 20px 0;
   padding-bottom: 20px;
   border-bottom: 1px solid #CCC;
   text-align: center;
}

.course-details {
    display: inline-block;
    float: right;
    width: 30%;
    padding: 10px;
    text-align: center;
}

.course-pricing {
    display: block;
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
    min-height: 80px;
    max-height: 240px;
}

.course-params {
    text-align: left;
    font-size: 13px;
}

.course-params .list-item {
    margin-left: 10px;
    margin-bottom: 5px;
    display: flex;
}
.course-params .list-left {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 100px;
    width: 100px;
    display: inline-block;
}
.course-params .list-right {
    font-weight: 700;
}

.course-status {
    position: relative;
    float: left;
    left: 10px;
    top: 20px;
    font-size: 20px;
    margin: 0;
    z-index: 1000;
    background-color: #FFF;
}

.lecture-course {
   max-height: 1600px;
}

.lecture_description {
    padding: 0 0 10px 0;
    border: 1px solid #EFEFEF;
    margin: -5px 0 -1px 11px;
    width: 98%;
}

.lecture_description p {
    margin: 0 0 0 10px;
}
 
.lecture-course .lecture_content {
    position: relative;
    border-left: 1px solid #000;
    width: 95%;
    margin-left: 22px;
    padding-bottom: 10px;
}
.card-front {
     cursor: default;
     background-color: #FFF;
}
.card-back {
    cursor: default;     
    padding: 20px;
}

.card-back a{
}

.card-back a:hover {    
    text-decoration: underline;
    font-size: 15px;
    color: #FFFFFF !important;
}
  
  .card-back p{
      text-align: left;
      color: #FFFFFF !important;
  }
  
    /* Colors Hover */ 
    .content li:hover {
      cursor: pointer; }
      .content li:hover .card-front {
        -webkit-transform: rotateX(50deg);
        -moz-transform: rotateX(50deg);
        -ms-transform: rotateX(50deg);
        -o-transform: rotateX(50deg);
        transform: rotateX(50deg);
        -webkit-transform: perspective(1000) rotateX(50deg);
        -moz-transform: perspective(1000) rotateX(50deg);
        -ms-transform: perspective(1000) rotateX(50deg);
        -o-transform: perspective(1000) rotateX(50deg);
        transform: perspective(1000) rotateX(50deg); }
      .content li:hover .card-back {
        z-index: 950;
        -webkit-transform: rotateX(0deg);
        -moz-transform: rotateX(0deg);
        -ms-transform: rotateX(0deg);
        -o-transform: rotateX(0deg);
        transform: rotateX(0deg);
        -webkit-transform: perspective(1000) rotateX(0deg);
        -moz-transform: perspective(1000) rotateX(0deg);
        -ms-transform: perspective(1000) rotateX(0deg);
        -o-transform: perspective(1000) rotateX(0deg);
        transform: perspective(1000) rotateX(0deg); }
    
  .content .card-front,
  .content .card-back {
    text-align: left;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 400ms;
    -moz-transition: -moz-transform 400ms;
    -o-transition: -o-transform 400ms;
    transition: transform 400ms;
    display: block;
    height: 100%;
    position: absolute;
    width: 100%; }
  .content .card-front {
    -webkit-transform: perspective(1000) rotateX(0);
    -moz-transform: perspective(1000) rotateX(0);
    -ms-transform: perspective(1000) rotateX(0);
    -o-transform: perspective(1000) rotateX(0);
    transform: perspective(1000) rotateX(0);
    z-index: 900; }
  .content .card-back {
    -webkit-transform: rotateX(-180deg);
    -moz-transform: rotateX(-180deg);
    -ms-transform: rotateX(-180deg);
    -o-transform: rotateX(-180deg);
    transform: rotateX(-180deg);
    z-index: 800; }
  
  .content h2 {
    font-size: 28px;
    width: 100%;
    text-align: left;
    text-transform: uppercase;
    color: #FFFFFF !important;
  }
  .content h2 b {
    float: right;
    width: 55%; 
  }
  .card-front p {
    line-height: 1.3em;
    color: #3d3d3d;
    width: 90%;
    margin-left: 10px;
  }


@media (min-width: 440px) and (max-width: 768px) {
  .content h2 {
    font-size: 20px; }
  .content p {
    font-size: 13px; }
  .content li {
    width: 33.1%; } }
@media (max-width: 439px) {
  .content h2 {
    font-size: 15px; }
  .content p {
    font-size: 13px; }
  .content li {
    width: 33%; } }
@media (max-height: 450px) {
  .content h2 {
    font-size: 22px; }
    .content h2 b {
      width: 100%; }
  .content li {
    width: 33%; } }


.myCourses {
	border-bottom: 1px solid #ccc;
}

.goCourses-header {
    background-color: #5D5D5D;
    height: 50px;
    padding: 5px;
    color: #FFFFFF;
    box-shadow: 5px 5px 2px rgba(0,0,0, 0.2); 
}

.goCourses-title {
    width: 50%;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.goCourses-title h4 {
    font-size: 1em;
    margin: 10px 0;
}

.goCourses-links {
    text-align: right;
    margin-top: 3px;
    font-size: 1.2em;
    float: right;
    display: inline-block;
    width: 50%;
}

.goCourses-links a {
    color: #FFF;
}

.goCourses-links a:hover {
    color: yellow;
}

.goCourses-links img{
    border-radius: 15px;
}

.goCourses-links .course-owner{
    margin-left: 5px;
    margin-right: 20px;
}

.goCourses-links span{
    margin-left: 10px;
    margin-right: 10px;
}

.section-header{
    min-height: 50px;
    padding: 10px;
    width: 100%;
    background-color: #E9E9E9;
}

.lecture-item {
    position: relative;
    width: 100%;
    padding: 0 10px 0 10px;
    min-height: 80px;
    max-height: 5000px;
    margin-top: -20px;
}

/*.lecture-item .content:hover {
    height: 90px; 
    margin-bottom: 30px;
}*/

.lecture-item .content {
    height: 60px; 
    position: relative; 
    overflow: hidden;
    transition:height 0.5s; 
    -webkit-transition:height 0.5s; 
    padding: 10px 10px 10px 20px !important;
    border-left: 1px solid #5D5D5D; 
}

.curriculum-panel {
    float: left;
    width: 60%;
    display: inline-block;
    padding: 10px;
}

/*.course-info {
    float: right;
    text-align: center;
    width: 70%;
    display: inline-block;
    padding: 10px;
}*/
.arrow-up {
        position: relative;
        margin-top: -10px;
        margin-left: 80px;
	width: 0; 
	height: 0; 
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid black;
}

.paginator {
    position:relative;
    text-align: center;
    margin-top: 20px;
    display: block;
    width: 100%;
}

.paginator ul li {
    margin-left: 5px;
    margin-right: 5px;

}

.paginator ul li {
    margin-left: 5px;
    margin-right: 5px;

}

.paginator ul li a {
    color: #FFF;
}

.paginator ul li a:hover {
    color: #2DA5D8;  
}
.categories-panel {
    position: absolute;
    width: 200px;
    min-height: 100px;
    max-height: 100%;
    z-index: 9996;
    padding: 0 0 10px 10px;
    border: 1px solid #5D5D5D;
    box-shadow: 5px 5px 2px rgba(0,0,0, 0.2);
    display: none;
    top: 60px;
}

.ellipsis-2lines {
  display: -webkit-box;
  overflow: hidden;
  height: 36px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;

}

.ellipsis-7lines {
  display: -webkit-box;
  overflow: hidden;
  height: 115px;
  margin-bottom: 20px;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

.cat_icon {
    font-size: 15px;
    width: 20px;
}
.channels .tabs>li>a {
    color: #fff;
    opacity: .7;
    padding: 0 0 10px 0;
    margin: 0;
    display: block;
    background: 0 0;
    border: 0;
    border-radius: 0;
    font-size: 15px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
    cursor: default;
}

.nav-tabs {
    border-bottom: 1px solid #ddd;
}
.nav {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
    
}
.channels .tabs>li {
    margin-right: 30px;
    margin-bottom: 0;
    float: none;
    display: inline-block;
}
.nav>li {
    position: relative;
    display: block;
}

.nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
}
.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}
.channels .tabs>li.active>a {
    box-shadow: 0 -5px 0 rgba(255,255,255,.5) inset;
    opacity: 1;
    cursor: pointer;
}
.left-category li {
    float: left;
    width: 100%;
}

.left-category li a {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    font-weight: 600;
    font-size: 10px;
    padding: 5px;
    height: 25px;
	
}

.left-category li a:hover {
	color: #000;
	background: #eeeeee;  
}

.channel-courses-list {
    text-align: left;
    /*margin-right: -15px;*/
    margin-bottom: 20px;
}
.channel-courses-list .course-box {
    width: 200px;
    height: 250px;
}
.course-header {
    background-color: #5D5D5D;
    border: 1px solid #E864A0;
    border-radius: 0 0 5px 5px;
    height: 50px;
    min-width: 100px;
    margin-top: -1px;
    margin-bottom: 20px;
    padding: 5px;
    text-align: center;
    color: #FFFFFF;
}

.parent {
	position:relative;
}

.child {
	display: block;
	position: absolute;
	background-color: rgba(60, 60, 60, 0.8);
	z-index: 9999;
	min-width: 250px;
	max-width: 300px;
	min-height: 100px;
	max-height: 500px;
	left: 185px;
        top: -5px;
	padding: 10px; 
	border: 1px solid #DDDDDD;
	box-shadow: 3px 3px 2px #888;
}

.child a {
	color: white !important;
}

.child a:hover {
	color: black !important;
}

.course_panel {
        margin-top: 20px;
	display: inline-block;
	width:100%;
	height:100%;
}

.course_panel h4, .categories h4{
	color: #FFF;
}


.categories {
	display: inline-block;
	float: left;
	width:19%;
	height:100%;
	border-right:1px solid #ccc;
	margin-right:10px;	
}


.cat_panel {
	background: rgba(255,255,255, 0.8);
	margin-bottom: 10px;
}

.cat_panel h4 {
	color: #E864A0 !important;
	margin: 0px !important;
	padding-top: 5px !important;
	padding-bottom: 15px !important;
}

/* Courses display panel */
.price {
        width: 100%;
	color: #E864A0 !important;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	margin: 0 5px 10px 10px; 
}
.current-price {
    font-weight: 700;
    font-size: 28px;
    color: rgba(0,0,0,.8);
    margin: 20px;
}

.skillsfuture {
    background-color: #FF0000;
    width: 100%;
    height: 28px;
    color: #FFF;
    padding: 5px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}
/* Courses Curriculum */

.curriculum_listing {
	width: 95%;
	margin-bottom: 60px;
}

.curriculum tr {
		width: 100%;
}

.curriculum tr th {
	border-bottom: 1px solid #666666;
	font-size: 12px;
	padding: 10px;
}

.curriculum tr td {
	border-top: 1px solid #666666;
	border-bottom: 1px solid #666666;
	color: #2DA5D8;
	padding: 10px;
}

.curriculum tr td a {
	text-decoration: none; 
}

.lecture_title {
	display: inline-block;
	padding: 10px 0 10px 10px;
}

.lecture_object {
	display: inline-block;
	float: right;
        margin-top: 10px;
        font-size: 30px;
}

/* Ratings Panel */
.dashboard {
	font-size: 30px;
	margin:10px;
	color: #5F5D5D;
}

.dashboard:hover {
	color: #2DA5D8;
	text-decoration: none;
}

.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
    background: #75BB38 !important;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    border: none;
    color: #FFFFFF;
    display: inline-block;
    /*float: left;*/
    padding: 5px 20px;
}


.badge.red {
  position: relative;
  background: #fa623f;
  border-color: #fa5a35;
  background-image: -webkit-linear-gradient(top, #fc9f8a, #fa623f);
  background-image: -moz-linear-gradient(top, #fc9f8a, #fa623f);
  background-image: -o-linear-gradient(top, #fc9f8a, #fa623f);
  background-image: linear-gradient(to bottom, #fc9f8a, #fa623f);
}
 
.badge {
  position: relative;
  left: -10px;
  top: -10px;
  margin-right: -20px;
}


.s0-rating.static.maroon span:before, 
.s05-rating.static.maroon span:before,
.s1-rating.static.maroon span:before, 
.s15-rating.static.maroon span:before,
.s2-rating.static.maroon span:before, 
.s25-rating.static.maroon span:before,
.s3-rating.static.maroon span:before,
.s35-rating.static.maroon span:before,
.s4-rating.static.maroon span:before,
.s45-rating.static.maroon span:before,
.s5-rating.static.maroon span:before {
	color: #D94D38;
}

.s0-rating.static.green span:before, 
.s05-rating.static.green span:before,
.s1-rating.static.green span:before, 
.s15-rating.static.green span:before,
.s2-rating.static.green span:before, 
.s25-rating.static.green span:before,
.s3-rating.static.green span:before,
.s35-rating.static.green span:before,
.s4-rating.static.green span:before,
.s45-rating.static.green span:before,
.s5-rating.static.green span:before {
	color: #75BB38;
}

.s0-rating.static.blue span:before, 
.s05-rating.static.blue span:before,
.s1-rating.static.blue span:before, 
.s15-rating.static.blue span:before,
.s2-rating.static.blue span:before, 
.s25-rating.static.blue span:before,
.s3-rating.static.blue span:before,
.s35-rating.static.blue span:before,
.s4-rating.static.blue span:before,
.s45-rating.static.blue span:before,
.s5-rating.static.blue span:before {
	color: #2DA5D8;
}


.s0-rating.smaller span:before, 
.s05-rating.smaller span:before, 
.s1-rating.smaller span:before,
.s15-rating.smaller span:before, 
.s2-rating.smaller span:before,
.s25-rating.smaller span:before, 
.s3-rating.smaller span:before,
.s35-rating.smaller span:before, 
.s4-rating.smaller span:before,
.s45-rating.smaller span:before, 
.s5-rating.smaller span:before {
	font-size: 15px;
}

.s0-rating.static span:before,
.s05-rating.static span:before,
.s1-rating.static span:before,
.s15-rating.static span:before,
.s2-rating.static span:before,
.s25-rating.static span:before,
.s3-rating.static span:before,
.s35-rating.static span:before,
.s4-rating.static span:before,
.s45-rating.static span:before,
.s5-rating.static span:before {
	color:  #75BB38;
}
 .s0-rating.static span:before {
	font-family: FontAwesome;
	content: "\f006 \f006 \f006 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
.s05-rating.static span:before {
	font-family: FontAwesome;
	content: "\f123 \f006 \f006 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
 .s1-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f006 \f006 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
} 
.s15-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f123 \f006 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
 .s2-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f006 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
.s25-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f123 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
 .s3-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f005 \f006 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
.s35-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f005 \f123 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
 .s4-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f005 \f005 \f006";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
.s45-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f005 \f005 \f123";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}
 .s5-rating.static span:before {
	font-family: FontAwesome;
	content: "\f005 \f005 \f005 \f005 \f005";
	/*color: #aaa;*/
	color: #75BB38;
	font-size: 20px;
	line-height: 1;
	letter-spacing: 4px;
	cursor: default;
}


@media only screen
and (min-device-width : 481px)
and (max-device-width : 648px) 
{    
     body
    {      
       background: none !important;
       border: solid 1px red;
    }
}


.js-simple-collapse-inner ul, .js-simple-collapse-inner ul li {
    list-style: default !important;
    margin-bottom: 10px;
    padding-left: 10px;
}



/*--------------------------------------------------
	  **Tech And All Social Icons Roll Over**
---------------------------------------------------*/
.social-img {
	padding: 0!important;
	margin: 0!important;
	list-style-type: none!important;
}
.social-img li{
	float: left!important;
	margin-right: 2px!important;
	margin-bottom: 2px!important;
	padding: 0px!important;
	display: inline!important;
	width: auto!important;

}			
.social-img li a {
	-moz-transition: all 0.3s ease 0s;
	display: block!important;
	float: left!important;
	height: 100%!important;
	margin: 0!important;
	padding: 0!important;
	width: 40px!important;
	height: 40px!important;
	text-indent: -9999px!important;
}
.social-img li a:hover {
	background-position: 0 -40px!important;
}
.social-img li a {
	background-color:transparent;
}
.social-img li.aim a {
	background: url(../img/aim.png) no-repeat 0 0;
}
.social-img li.aim a:hover {
	background-color: #e95a00;
}
.social-img li.apple a {
	background: url(../img/apple.png) no-repeat 0 0;
}
.social-img li.apple a:hover {
	background-color: #606060;
}
.social-img li.behance a {
	background: url(../img/behance.png) no-repeat 0 0;
}
.social-img li.behance a:hover {
	background-color: #18a3fe;
}
.social-img li.blogger a {
	background: url(../img/blogger.png) no-repeat 0 0;
}
.social-img li.blogger a:hover {
	background-color: #fb913f;
}
.social-img li.cargo a {
	background: url(../img/cargo.png) no-repeat 0 0;
}
.
.social-img li.delicious a {
	background: url(../img/delicious.png) no-repeat 0 0;
}
.social-img li.facebook a {
	background: url(../img/facebook.png) no-repeat 0 0;
}
.social-img li.facebook a:hover {
	background-color: #3b5998;
}
.social-img li.flickr a {
	background: url(../img/flickr.png) no-repeat 0 0;
}
.social-img li.flickr a:hover {
	background-color: #f1628b;
}
.social-img li.google a {
	background: url(../img/google.png) no-repeat 0 0;
}
.social-img li.google a:hover {
	background-color: #dd4b39;
}
.social-img li.googleplus a {
	background: url(../img/googleplus.png) no-repeat 0 0;
}
.social-img li.googleplus a:hover {
	background-color: #d94a39;
}
.social-img li.html5 a {
	background: url(../img/html5.png) no-repeat 0 0;
}
.social-img li.html5 a:hover {
	background-color: #f3642c;
}
.social-img li.linkedin a {
	background: url(../img/linkedin.png) no-repeat 0 0;
}
.social-img li.linkedin a:hover {
	background-color: #71b2d0;
}
.social-img li.orkut a {
	background: url(../img/orkut.png) no-repeat 0 0;
}
.social-img li.orkut a:hover {
	background-color: #ed2590;
}
.social-img li.paypal a {
	background: url(../img/paypal.png) no-repeat 0 0;
}
.social-img li.paypal a:hover {
	background-color: #32689a;
}
.social-img li.picasa a {
	background: url(../img/picasa.png) no-repeat 0 0;
}
.social-img li.picasa a:hover {
	background-color: #444;
}
.social-img li.pinterest a {
	background: url(../img/pinterest.png) no-repeat 0 0;
}
.social-img li.pinterest a:hover {
	background-color: #cb2027;
}
.social-img li.rss a {
	background: url(../img/rss.png) no-repeat 0 0;
}
.social-img li.rss a:hover {
	background-color: #fe9900;
}
.social-img li.skype a {
	background: url(../img/skype.png) no-repeat 0 0;
}
.social-img li.skype a:hover {
	background-color: #18b7f1;
}
.social-img li.tumblr a {
	background: url(../img/tumblr.png) no-repeat 0 0;
}
.social-img li.tumblr a:hover {
	background-color: #3a5976;
}
.social-img li.twitter a {
	background: url(../img/twitter.png) no-repeat 0 0;
}
.social-img li.twitter a:hover {
	background-color: #48c4d2;
}
.social-img li.vimeo a {
	background: url(../img/vimeo.png) no-repeat 0 0;
}
.social-img li.vimeo a:hover {
	background-color: #62a0ad;
}
.social-img li.wordpress a {
	background: url(../img/wordpress.png) no-repeat 0 0;
}
.social-img li.wordpress a:hover {
	background-color: #464646;
}

.social-img li.yelp a {
	background: url(../img/yelp.png) no-repeat 0 0;
}
.social-img li.yelp a:hover {
	background-color: #c41200;
}
.social-img li.youtube a {
	background: url(../img/youtube.png) no-repeat 0 0;
}
.social-img li.youtube a:hover {
	background-color: #f45750;
}

/* Copied from custom.css */


/* user this code for Forgot password heading */

h1.heading {
	font-size:32px;
	margin-bottom: 20px;
}
h2.heading {
    font-size:20px;
    margin-bottom: 20px;
} 

.form-control:focus {
border-color: #3acab1;
box-shadow: none;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: rgba(255, 255, 255, 0);
}

.navbar-default .navbar-toggle {
    border-color: rgba(221, 221, 221, 0);
    margin: 0;
    line-height: 100%;
}

.navbar-toggle {
    padding: 0;
    border-radius: 0;
}

button.navbar-toggle .ion-navicon {
    font-size: 2em;
    color: #fff;
}

.row
{
	margin-right: 0px;
    margin-left: 0px;
}
ul li
{
    list-style: none;
    display: inline-block;
}
li a
{
    text-decoration: none;
}

button.create_course {
    background: #4985b8;
    margin-bottom: 10px;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 18px;
    clear: both;
}
.main_content 
{
    padding: 50px 0px;
}

iframe
{
    width: 100%;
}
.form-control
{
    border-radius: 0px;
}

.starting-text
{
    font-weight: bold;
    text-shadow: 1px 1px 1px #000;
    letter-spacing: 2px;
}
.bottom 
{
    width: 100%;
    position: absolute;
    bottom: 2%;
}
.bottom a
{
    color: rgba(192, 192, 192, 0.5);
}
h5 
{
    padding-top: 22px;
    font-size: 18px;
}



.services
{
    width: 100%;
    overflow: hidden;
    position: relative;
}
.about-service 
{
    font-size: 16px;
    padding: 5px 10px 0px 10px;
}
.about-service h3 {
    font-size: 33px;
}

.service-icon i 
{
    padding: 20px 0px;
    font-size: 5em;
    transition: font-size 0.5s;
    display: table-cell;
    vertical-align: middle;
}
.service-icon
{
    display: table;
    min-height: 140px;
    text-align: center;
    width: 100%;
}
hr
{
    border-color: rgb(101,85,124);
}
.full
{
    width: 25%;
}
.fa-code
{
    color: cadetblue;
}
.fa-desktop
{
    color: lightslategray;
}
.fa-th
{
    color: rgb(114, 184, 211);
}
.fa-gamepad
{
    color: rgba(0, 0, 128, 0.58);
}
.fa-lightbulb-o
{
    color: grey;
}
.fa-stack-overflow
{
    color: #C09553;
}
.service:hover .service-icon i
{
    font-size: 7em;
}
.service:hover .about-service h3 
{
    color: rgb(175, 104, 77)
}
.service
{
    text-align: center;
}

 .input-group
 {
    padding: 18px 0px;
 }
 .send
 {
    float: left;
 }
 .map
 {
    padding: 18px 0px;
 }
 #contact
 {
    padding-bottom: 80px;
 }
 
.btn-primary {
    color: #fff;
    background-color: #3acab1;
    border-radius: 0;
    border-color: #3acab1;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #16a085;
    border-color: #16a085;
}

.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
    background-color: #3acab1;
    border-color: #3acab1;
}

.pagination {
    border-radius: 0;
}

.pagination>li:first-child>a, .pagination>li:first-child>span {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.pagination>li:last-child>a, .pagination>li:last-child>span {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.navbar-fixed-top, .navbar-fixed-bottom {
    z-index: 99999;
}

.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open>.dropdown-toggle.btn-default {
    color: #FFF;
    background-color: #3acab1;
    border-color: #3acab1;
}

.pagination>li>a, .pagination>li>span {
    color: #16a085;
}

#port-items .col-md-4 {
    padding: 0;
}

.input-group-addon {
    border-radius: 0;
}

@media (max-width: 712px) {

}

@media (max-width: 400px) {
    #port-items .col-xs-6 {
        width: 100%;
    }

    .navbar-fixed-top, 
    .navbar-fixed-bottom {
        position: static;
    }

    #portfolio .btn {
        margin-bottom: 10px;
    }
}


 .main_content figure {
        padding: 0px 105px;
    }

    
           .noList {
            margin:0px;
            padding:0px;
            list-style: none;
        }
        .noList li {
            float:left;
        }
        .z-tabs.flat, .z-tabs.flat > ul > li > a {
            color: #374858;
            color: #2C3E50;
            text-shadow: none;
        }
        @media (min-width: 960px) {
            #demo-tabs-vertical.z-tabs.vertical.medium > ul.z-tabs-nav {
                min-width: 240px;
                width: 25%;
            }
        }
        .z-tabs.flat.vertical.top-left.z-rounded.z-bordered > ul.z-tabs-nav > li > a {
            -webkit-border-radius: 3px 0 0 3px;
            -moz-border-radius: 3px 0 0 3px;
            border-radius: 3px 0 0 3px;
        }
        .z-tabs.flat.z-spaced.vertical > ul.z-tabs-desktop > li > a {
            margin-bottom: 1px;
        }
        .z-tabs.flat.clean.vertical > ul.z-tabs-nav > li > a {
            text-align: left;
        }
        .z-tabs.flat.contained > ul > li > a:hover, .z-tabs.flat.clean > ul > li > a:hover {
            background: #ECEDEE;
        }
        .z-tabs.flat.vertical > ul.z-tabs-nav > li > a {
            margin: 0 0 0 0;
            text-align: left;
        }
        .z-tabs.flat.medium > ul > li > a {
            font-size: 13px;
            padding: 16px 24px;
        }
        .z-tabs {
            position: relative;
        }
        .z-tabs.vertical {
            padding: 19px 0;
        }
        .z-tabs.flat {
            -webkit-font-smoothing: subpixel-antialiased; 
			font-family: 'PT Sans', 'Helvetica Neue', Arial, sans-serif !important;
            font-weight: normal;
            line-height: 1.55em;
            font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
        }
        .z-tabs.flat.vertical.z-bordered.top-left.medium > ul.z-tabs-nav {
            border-width: 0 5px 0 0;
        }
        .z-tabs.flat.vertical > ul.z-tabs-nav {
            margin-left: 0;
            margin-right: 0;
        }
        .z-tabs.flat > ul.z-tabs-mobile {
            opacity: 1;
        }
        .z-tabs.flat.flat-peter-river > ul, .z-tabs.flat.flat-peter-river > .z-container {
            border-color: #2DA5D8;
        }
        .z-tabs.flat.clean.vertical.top-left.z-rounded.z-bordered > ul.z-tabs-desktop {
            -webkit-border-radius: 6px 0 0 6px;
            -moz-border-radius: 6px 0 0 6px;
            border-radius: 6px 0 0 6px;
        }
        .z-tabs.flat.vertical.z-bordered.top-left.medium > ul.z-tabs-nav {
            border-width: 0 5px 0 0;
        }
        .z-tabs.flat.z-spaced.vertical.top-left > ul.z-tabs-desktop {
            margin: 0 1px 0 0;
        }
        .z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-first, .z-tabs.clean.vertical.z-rounded > ul.z-tabs-desktop > li.z-first > a {
            -webkit-border-radius: 5px 5px 0 0;
            -moz-border-radius: 5px 5px 0 0;
            border-radius: 5px 5px 0 0;
        }
        .z-tabs.flat.vertical > ul.z-tabs-nav > li.z-active {
            z-index: 0;
        }
        .z-tabs, .z-tabs > ul, .z-tabs > ul > li, .z-tabs > ul > li > a {
            position: relative;
            margin: 0;
            padding: 0;
            border: 0;
            outline: 0;
            display: block;
            outline: 0 none;
            text-decoration: none;
            list-style: none;
            list-style-type: none;
        }
        .z-tabs .z-tabs *, .z-tabs ul, .z-tabs ul li, .z-tabs ul li a, .z-tabs .z-container .z-content {
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            -webkit-touch-callout: none;
            outline: none;
        }
        .z-tabs.vertical > ul {
            float: left;
            border-width: 1px 0 1px 1px;
            min-width: 200px;
            width: 25%;
        }
        .z-tabs.flat.contained > ul > li > a:hover, .z-tabs.flat.clean > ul > li > a:hover {
            background: #e4e4e4;
        }
        .z-tabs > ul, .z-tabs > ul > li > a, .z-tabs > .z-container {
            border-color: #CECECE;
            border-style: solid;
        }
        .z-tabs.flat.flat-peter-river > ul.z-tabs-nav > li.z-active > a, .z-tabs.flat.flat-peter-river > ul.z-tabs-mobile.z-state-closed > li a, 
        .z-tabs.flat.flat-peter-river > ul.z-tabs-mobile > li a {
            background: #2DA5D8;
        }
        .z-tabs.flat > ul.z-tabs-nav > li.z-active > a {
            background: #bdc3c7;
            color: #fff;
            text-shadow: none;
            box-shadow: none;
        }
        .z-tabs.clean > ul > li.z-active > a fa {
            color:#fff !important;
        }
        .z-tabs.flat > ul > li > a, .z-tabs.clean > ul > li.z-active > a, .z-tabs.flat > ul > li > a {
            font-weight: bold;
        }
        .z-tabs, .z-tabs > ul, .z-tabs > ul > li, .z-tabs > ul > li > a, .z-tabs > .z-container, 
        .z-tabs > .z-container > .z-content, .z-tabs > .z-container > .z-content > .z-content-inner {
            -moz-box-sizing: content-box;
            -webkit-box-sizing: content-box;
            box-sizing: content-box;
        }
        .z-tabs > .z-container {
            padding: 0;
            margin: 0;
            border-width: 1px;
            background: #fff;
            position: relative;
            overflow: hidden;
        }
        .z-tabs.flat.vertical > .z-container {
            border-width: 0;
            margin: 0;
        }
        .z-tabs.flat.vertical > .z-container > .z-content > .z-content-inner {
            padding: 0 2em;
        }
        .z-tabs > ul > li > a {
            cursor: pointer;
            background-color: #eee;
        }
        .top {
            padding: 15px 0;
        }
        #course-approval-header.upsell, #course-approval-header.approved {
            border-top: 6px solid #ff0000!important;
            margin-bottom: 20px;
        }
        #wrapper2 {
            border-top: 2px solid #ff0000;
        }
        .course-header-container {
            padding:10px;
        }
        .userCPheaderWrapper {
            width: 100%;
            height: 53px;
            background-color: #eee;
            box-shadow: 0px 1px 3px #333;
            z-index: 9999;
            position: relative;
        }
        .srchCatList {
            padding: 6px;
            font-weight: 400;
        }
        .selectList {
            min-height: 32px;
            height: 32px !important;
        }
        .selectList, .textarea, .textfield {
            width: 100%;
            font-weight: 700;
            color: #4D4D4D;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            padding: 7px;
            margin-right: 15px;
            background: #fff;
            border: 1px solid #AAA;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            -o-border-radius: 3px;
            border-radius: 3px;
            font-size: 14px;
            box-shadow: inset 0 1px 4px rgba(0,0,0,.15);
            -webkit-transition: box-shadow 90ms ease-in,color 120ms ease-in;
            -moz-transition: box-shadow 90ms ease-in,color 120ms ease-in;
            transition: box-shadow 90ms ease-in,color 120ms ease-in;
            outline: 0;
        }
        
        input[type=password], input[type=text] {
            padding: 8px 6px;
        }
        input[type=password], input[type=text], textarea {
            padding: 0 6px;
            -moz-border-radius: 5px; 
            -webkit-border-radius: 5px;
            border-radius: 5px;
            -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.12);
            -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.12);
            box-shadow: inset 0 1px 3px rgba(0,0,0,.12);
        }
        input, textarea {
            border: 1px solid #999;
            resize: none;
        }
        .s0-rating.static.maroon span:before, 
		.s05-rating.static.maroon span:before,
		.s1-rating.static.maroon span:before, 
		.s15-rating.static.maroon span:before,
		.s2-rating.static.maroon span:before, 
		.s25-rating.static.maroon span:before,
		.s3-rating.static.maroon span:before,
		.s35-rating.static.maroon span:before,
		.s4-rating.static.maroon span:before,
		.s45-rating.static.maroon span:before,
		.s5-rating.static.maroon span:before {
            color: #D94D38;
        }
        .s0-rating.smaller span:before, 
        .s05-rating.smaller span:before, 
		.s1-rating.smaller span:before,
        .s15-rating.smaller span:before, 
		.s2-rating.smaller span:before,
        .s25-rating.smaller span:before, 
		.s3-rating.smaller span:before,
        .s35-rating.smaller span:before, 
		.s4-rating.smaller span:before,
        .s45-rating.smaller span:before, 
		.s5-rating.smaller span:before {
            font-size: 15px;
        }
		
        .s0-rating.static span:before,
        .s05-rating.static span:before,
		.s1-rating.static span:before,
		.s15-rating.static span:before,
		.s2-rating.static span:before,
		.s25-rating.static span:before,
		.s3-rating.static span:before,
		.s35-rating.static span:before,
		.s4-rating.static span:before,
		.s45-rating.static span:before,
		.s5-rating.static span:before {
            color: #fba617;
        }
		 .s0-rating.static span:before {
            font-family: FontAwesome;
            content: "\f006 \f006 \f006 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		.s05-rating.static span:before {
            font-family: FontAwesome;
            content: "\f123 \f006 \f006 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		 .s1-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f006 \f006 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        } 
		.s15-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f123 \f006 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		 .s2-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f006 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		.s25-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f123 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		 .s3-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f005 \f006 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		.s35-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f005 \f123 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		 .s4-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f005 \f005 \f006";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		.s45-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f005 \f005 \f123";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
		 .s5-rating.static span:before {
            font-family: FontAwesome;
            content: "\f005 \f005 \f005 \f005 \f005";
            color: #aaa;
            font-size: 20px;
            line-height: 1;
            letter-spacing: 4px;
            cursor: default;
        }
        
        .ml10 {
            margin-left: 10px;
        }
        .save-money .old-price {
            text-decoration: line-through;
        }
        .dib {
            display: inline-block;
        }
        .course-cta--buy {
            color: #fff;
            background-color: #75BB38;
        }
        .course-cta--buy:hover, .course-cta--buy:focus {
            color: #fff;
            background-color: #159d1a;
        }
        .course-cta {
            padding: 11px 12px;
            font-size: 15px;
            line-height: 1.35135;
            border-radius: 2px;
            font-weight: 400;
            text-align: center;
            vertical-align: middle;
            touch-action: manipulation;
            cursor: pointer;
            background-image: none;
            border: 1px solid transparent;
            white-space: nowrap;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            margin: 5px 0;
            width: 100%;
            display: block;
        }
        .list {
            font-size: 13px;
        }
        ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        .list .list-item {
            margin-bottom: 5px;
            display: flex;
        }
        .list .list-left {
            display: block;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            min-width: 100px;
            width: 100px;
            display: inline-block;
        }
        .list .list-right {
            font-weight: 700;
        }
        .cur-list .cur-list-row-detail {
            display: none;
            background-color: #fff;
        }
        .tipsy{
            font-size:11px;
            padding:5px;
            position:absolute;
            z-index:100000;
        }
        .tipsy-inner{
            padding:5px 8px 4px;
            background-color:#000;
            color:#fff;
            max-width:200px;
            text-align:center;
            border-radius:3px;
            -moz-border-radius:3px;
            -webkit-border-radius:3px;
        }
        .tipsy-arrow{
            position:absolute;
            background:url(../img/tipsy.gif) no-repeat top left;
            width:9px;
            height:5px
        }
        .tipsy-n .tipsy-arrow{top:0;left:50%;margin-left:-4px}
        .tipsy-nw .tipsy-arrow{top:0;left:10px}
        .tipsy-ne .tipsy-arrow{top:0;right:10px}
        .tipsy-s .tipsy-arrow{bottom:0;left:50%;margin-left:-4px;background-position:bottom left}
        .tipsy-sw .tipsy-arrow{bottom:0;left:10px;background-position:bottom left}
        .tipsy-se .tipsy-arrow{bottom:0;right:10px;background-position:bottom left}
        .tipsy-e .tipsy-arrow{top:50%;margin-top:-4px;right:0;width:5px;height:9px;background-position:top right}
        .tipsy-w .tipsy-arrow{top:50%;margin-top:-4px;left:0;width:5px;height:9px}
		
		
		
/* Bootstrap navigation override */

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {
	padding-left: 10px;
	padding-right: 10px;
}

h1{
    font-size:30px;
}

h1.box-heading{
    font-size:22px;
}

h1.course{
     font-size:18px !important;
     margin:10px 0px;
}


h1.userprofile{
     font-size:24px !important;    
}

.login-pane{
      /*width: 50%;*/
}
        
    .changepwd
    {
            width: 40%;
    }
     .profilesection
    {
        vertical-align:top;
        width:25%;        
    }



@media only screen and (max-device-width: 440px) {
    
    .login-width
    {
        width: 92% !important;
    }
    .forget-width
    {
        width: 92% !important;
    }
    .producer-width
    {
        width: 100% !important;
    }
    .navbar
    {
            height: 165px !important;
    }
    .browse-cat
    {
        margin: 114px 0 0 90px !important;
    }
    .searchPanel
    {
        display:none !important;
    }
    .navbar-nav
    {
       margin : -162.5px 34px !important;
    }
    .nav>li
    {
       text-align: center !important; 
    }
    .navbar-nav .open .dropdown-menu
    {
        background-color:#75bb38 !important;
        position:relative;
    }
    .navbar-default .navbar-nav .open .dropdown-menu>li>a
    {
        color:#FFFFFF;
    }
    .selecttopic
    {
        width: 90% !important;
    }
    img.aboutuslogo
    {
        width: 100% !important;
    }
    .login-pane
	{
		width: 100% !important;
	}

    .changepwd
    {
            width: 70% !important;
    }
    .course-box1
    {
         width: 50% !important;
    }
    .tduserprofle
    {
        float:left !important;
    }
    .biographytext
    {
        width:260px;
    }
    .profilesection
    {
        vertical-align:top;
        width:76%;
        float:left !important;
    }
    .profileimageuploadwidth
    {
            width:262px;
    }
}

@media screen and (device-aspect-ratio: 40/71) 
{
    .browse-cat {
        margin: 114px 0 0 59px !important;
    }
    
    .changepwd
    {
            width: 85% !important;
    }
    .biographytext
    {
            width: 229px !important;
    }
    .profilesection
    {
            width: 85% !important;
    }
}




.paginator ul li.active a{
    color:#e864a0 !important;
	font-weight: bold;
}

.content-bottom
{
    text-align: right !important;
    font-size:12px;
}