@font-face {
    font-family: "Helvetica Black";
    src: url("/fonts/Helvetica-Black.otf");
}
.yii-debug-toolbar_position_bottom {
	display:none!important;
}
@font-face {
    font-family: 'NarkisBlockCondensedMF';
    src: url(/fonts/NarkisBlock-Condensed_MFW.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NarkisBlockRegularMF';
    src: url(/fonts/narkisblock-regular_mfw.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NarkisBlockCondensedBoldMF';
    src: url(/fonts/NarkisBlockCon-Bold_MFW.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NarkisBlockCondensedThin';
    src: url(/fonts/NarkisBlock-CondensedThin.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NarkisBlockMediumMF';
    src: url(/fonts/NarkisBlock-Medium_MFW.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'NarkisBlockBold';
    src: url(/fonts/NarkisBlock-Bold.woff) format('woff');
    font-weight: normal;
    font-style: normal;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: right;
}

html,
body {
    height: 100%;
    direction: rtl;
    text-align: right;
    font-family: 'NarkisBlockCondensedThin';
    color: #000000;
}

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
}

.wrap > .container {
    padding: 30px 15px 20px;
}

.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    padding-left: 5px;
}

a.asc:after {
    content: /*"\e113"*/ "\e151";
}

a.desc:after {
    content: /*"\e114"*/ "\e152";
}

.sort-numerical a.asc:after {
    content: "\e153";
}

.sort-numerical a.desc:after {
    content: "\e154";
}

.sort-ordinal a.asc:after {
    content: "\e155";
}

.sort-ordinal a.desc:after {
    content: "\e156";
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    padding: 15px;
    border: none;
}

@media (min-width: 768px) {
    .navbar-nav > li {
        float: right;
    }

    .navbar-right {
        margin-right: -30px;
        padding-top: 33px;
    }
}

.viewer-name {
    color: #7d419b;
    font-size: 30px;
    line-height: 27px;
    letter-spacing: -0.75px;
    padding-top: 6px;
}

.menu-space:after {
    position: absolute;
    content: "";
    top: 0;
    left: -8px;
    height: 36px;
    background: #000;
    width: 1px;
}

.nav li > form > button.logout {
    color: #000;
    padding: 7px 15px;
    font-size: 23px;
    line-height: 27px;
    letter-spacing: -0.57px;
}

@media (max-width: 767px) {
    .nav li > form > button.logout {
        display: block;
        text-align: left;
        width: 100%;
        padding: 10px 15px;
    }
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
    text-decoration: none;
}

.nav > li > form > button.logout:focus {
    outline: none;
}

.login nav.navbar,
.breadcrumb {
    display: none;
}

.login {
    background: url('/images/login-back.jpg') center center no-repeat;
    background-size: cover;
}

@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
    .login {
        background: url('/images/login-back.jpg') center center no-repeat;
        background-size: cover;
        padding-top: 200px;
    }

}

label {
    font-weight: normal;
}

.login {
    font-size: 24px;
}

.login .main-logo {
    display: inline-block;
    margin-bottom: 4px;
}

.login h1 {
    font-family: "Helvetica Black";
    color: #7d419b;
    font-size: 76px;
    text-transform: uppercase;
    letter-spacing: -1.91px;
    margin: 0;
    line-height: 77px;
}

.login h2 {
    font-family: NarkisBlockCondensedMF;
    line-height: 33px;
    font-size: 36px;
    margin: 0 0 18px;
    letter-spacing: -0.9px;
}

.login .col {
    width: 408px;
    margin: auto;
    font-family: 'NarkisBlockCondensedThin';
}

.btn-submit {
    color: #fff;
    text-align: center;
    height: 50px;
    background: #7d419b;
    line-height: 50px;
    width: 100%;
    margin: 45px 0 7px;
    border-radius: 0;

	font-weight:600;
}

#forgot-password--form .btn-submit {
    line-height: 42px;
}

.login_bottom_line {
    /*line-height: 20px;*/
}

.login_bottom_line a {
    font-size: 20px;
    color: #000;
    text-align: center;
    border-bottom: 1px solid #000;
    line-height: 20px;
    display: inline-block;
    letter-spacing: -0.5px;
}

.login_bottom_line a:hover, .login_bottom_line a:focus {
    text-decoration: none;
}

.login input[type=password],
.login input[type=text],
.login input[type=tel] {
    background: transparent;
    border: 1px solid #999;
    border-radius: 0;
    height: 50px;
    line-height: 50px;
    font-size: 25px;

}

.login .field-loginform-rememberme {
    display: none;
}

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

.login h6 {
    font-size: 16px;
    letter-spacing: -0.4px;
    margin: 0;
}

.field-forgotpasswordform-username .help-block {
    margin-bottom: 0;
}

.field-forgotpasswordform-username label.control-label {
    font-family: "NarkisBlockCondensedMF";

}

h3.pw-instructions {
    margin: 43px 0 17px;
}

/*Home page*/

body.site {
    background: #f5f5f5;
    padding-top: 100px;
}

nav, .navbar-brand {
    background: #fff;
    height: 100px;
}

.navbar-brand img {
    padding-top: 9px;
}

#new-lessons {
    border-left: 1px solid #b2b1b1;
    margin-bottom: 40px;
}
#spec-lessons a > img,
#spec-lessons a > div,
#viewed-lessons a > img,
#viewed-lessons a > div,
#new-lessons a > img,
#new-lessons a > div,
#family-lessons a > img,
#family-lessons a > div {
    height: 105px;
    width: 105px;
    background-size: cover;
    border-radius: 50%;
    display: block;
    border: 1px solid #7d419b;
}

#new-lessons > div {
    display: inline-block;
    text-align: center;
}

#viewed-lessons a,
#spec-lessons a,
#new-lessons a {
    display: inline-block;
    vertical-align:top;
    height:160px;
    text-align: center;
    margin-left: 15px;
}

.vid-link span.class-name{
    width: 110px;
    display: block;
    line-height: 19px;
    margin-top: 7px;

}

.view-title {
    color: #7d419b;
    font-size: 50px;
    line-height: 27px;
    letter-spacing: -0.75px;
    margin-bottom: 5px;
}

.view-title.viewed {
    font-size: 43px;
    line-height: 27px;
    letter-spacing: -0.65px;
    margin-bottom: 30px;
}

.view-title.viewed span {
    transition: all .2s linear;
    display: inline-block;
    margin: 0 15px;
}

.view-title.viewed[aria-expanded=true] span {
    transform: rotate(-90deg);
}

.view-text {
    font-size: 23px;
    line-height: 27px;
    letter-spacing: -0.57px;
    margin-bottom: 55px;
}

.family-title {
    font-size: 24px;
    font-weight: bold;
    color: rgb(44, 62, 80);
    margin-bottom: 15px;
    margin-top: 24px;
    text-transform: uppercase;
    letter-spacing: 1px;
    border-bottom: 2px solid rgb(52, 152, 219);
    display: inline-block;
    padding-bottom: 5px;
}

.model-content .family-title img.family-title-icon {
    margin: 0 !important;
    width: 50px !important;
}

.family-lessons > .vid-link {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.vid-link > img {
    border: 1px solid #7d419b;
}

.vid-link .bg {
    background-color: rgba(140, 98, 162, 0.8);
    height: 105px;
    width: 105px;
    position: absolute;
    color: #fff;
    border-radius: 50%;
}

.vid-link .bg span {
    color: #fff;
    line-height: 30px;
    display: block;
}

.vid-link .bg img {
    padding-top: 30px;
}

.vid-link span {
    font-size: 17px;
    line-height: 27px;
    color: #000;
    letter-spacing: -0.41px;
}

.side-heading {
    color: #7d419b;
    font-size: 43px;
    line-height: 27px;
    letter-spacing: -0.65px;
    margin: 18px 0 27px
}

.side-text {
    font-size: 22px;
    line-height: 24px;
    letter-spacing: -0.55px;
}

.side-text a {
    color: #0000ff;
    font-size: 15px;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: 0.53px;
    text-decoration: underline;
    font-family: "Helvetica Black";
}

.model-content {
    background: white;
    border: 2px solid #7d419b;

}

.model-content img:not(.family-lessons img) {
    width: 59px;
    height: auto;
    display: block;
    margin: 0 auto 35px;
}

.model-content .btn-submit {
    height: 44px;
    width: 112px;
    margin: auto;
    font-size: 19px;
    line-height: 27px;
    letter-spacing: -0.5px;
}

.modal-body {
    text-align: center;
    font-size: 23px;
    letter-spacing: -0.41px;
    line-height: 20px;
}

.modal-body a:not(.family-lessons a) {
    color: #0000ff;
    text-decoration: underline;
    line-height: 27px;
    letter-spacing: -0.57px;
}

.modal-header {
    padding: 55px 0 15px 0;
    text-align: center;
    border: none;
    font-size: 30px;
    letter-spacing: -0.75px;
    line-height: 27px;
    margin: 15px 36px 0px;
}

.family-dialog .modal-header {
    background: url('/images/crew_academy_for_popup.png') right no-repeat;
    background-size: contain;
}

.modal-footer {
    text-align: center;
    padding: 40px 0 60px;
    border: none;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 720px;
    }
}


/* ==========================================================================
   VIDEO PAGE	
   ========================================================================== */

body.site.site-view-lesson {padding-top:0;}
.site-view-lesson nav{height:44px;display:none;}
.site-view-lesson .navbar-brand{height:auto;}
.site-view-lesson .navbar-brand img{max-width: 33px; padding-top: 0;  margin-top: -10px;}
.site-view-lesson .navbar-right{padding-top:0;}
.site-view-lesson .navbar{min-height:37px;overflow:hidden;display:none;}
.site-view-lesson .wrap > .container {padding:0;width:100%;}
.site-view-lesson .wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto 0;
    padding: 0 0 0;
}

/****************** MODAL FORGOT PASSWORD *******************/
.modal-open .site-login,.modal-open .site-index{
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}
.basic_modal .modal-content{
    border: 0;
    border-radius: 0;
    box-shadow:unset;
    height:100%;
}
.basic_modal .modal-dialog{
    max-width: none;
    width: 55.8vw;
    height: 35vw;
    border: 2px solid #7d4199;
    border-radius: 0;
    background-color:#fff;
    transition: unset;
    -webkit-transform: unset;
    transform: unset;
}
.basic_modal .modal-header{
    display: block;
    border-bottom: 0;
}
.basic_modal .modal-header button.close{
    float: left;
    opacity: 1;
} 
.basic_modal .modal-body{
    color: #000000;
    max-width: 37vw;
    margin:auto;
}   
.basic_modal .modal-body h2{
    color: #000000;
    font-family: 'NarkisBlockCondensedThin';
    font-size:2.34375vw;
    margin: 1.3vw auto 0.5vw;
}
.basic_modal .modal-body h3{
    color: #000000;
    font-size: 1.8229vw;
    line-height: 1.8229vw;
    margin-bottom: 5.2vw;
} 

#forgotPasswordModal .modal-dialog{
    /*height: 83vh;*/
    display: block;
    margin: 12vw auto;
    width:43.8vw;
    height: 23.5vw;
}

#forgotPasswordModal .form-horizontal .form-group {
    margin:0;
}

#forgotPasswordModal .modal-body {
    padding-top:0;
}

#forgotPasswordModal .modal-body img{
    width:3.05vw;
}

#forgotPasswordModal .modal-body h2{
    margin: 1vw;
}

#forgotPasswordModal .modal-body h3{
    margin: 0 6vw 2vw;
}

#forgotPasswordModal .modal-header{padding-bottom:0;}

#forgotPasswordModal .modal-header img{width:1.15vw;}
#forgotPasswordModal .modal-body h4{
    color: #000000;
    color: #7d4199;
    font-family: 'NarkisBlockCondensedMF';
}

#forgotPasswordModal .modal-body .sub_content_with_form h3{
    margin-bottom: 1vw;
}
#forgotPasswordModal .modal-body .sub_content_with_form form label{
    padding-top:1vw;
    color:#000;
}
#forgotPasswordModal .modal-body .sub_content_with_form form input{
    font-size:1.5vw;
    color:#000;
    width: 11.55vw;
    height: 1.98vw;
    line-height:2.8125vw;
    border-color:#9564ac;
    margin: 0.3vw auto 0 auto;
}
.basic_modal .modal-body button{
    width:13.02vw;
    height:3.4375vw;
    background-color:#7d4199;
    color:#fff;
    margin:auto;
    display:block;
}

#forgotPasswordModal.basic_modal .modal-body button {
    margin-top:0;
    width: 9.1vw;
    height: 2.4vw;
}

#forgotPasswordModal.basic_modal .modal-body .forgot_password_error{
    color:#a94442;
    font-weight: 700;
}
/****************** MODAL FORGOT PASSWORD *******************/
.modal-open .site-login,.modal-open .site-index{
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}
.basic_modal .modal-content{
    border: 0;
    border-radius: 0;
    box-shadow:unset;
    height:100%;
}
.basic_modal .modal-dialog{
    max-width: none;
    width: 55.8vw;
    height: 35vw;
    border: 2px solid #7d4199;
    border-radius: 0;
    background-color:#fff;
    transition: unset;
    -webkit-transform: unset;
    transform: unset;
}
.basic_modal .modal-header{
    display: block;
    border-bottom: 0;
}
.basic_modal .modal-header button.close{
    float: left;
    opacity: 1;
}
.basic_modal .modal-header {padding: 1vw 1.5vw;}
.basic_modal .modal-body{
    color: #000000;
    max-width: 37vw;
    margin:auto;
}   
.basic_modal .modal-body h2{
    color: #000000;
    margin: 1.3vw auto 0.5vw;
}
.basic_modal .modal-body h3{
    color: #000000;
    margin-bottom: 5.2vw;
} 

#forgotPasswordModal .modal-dialog{
    /*height: 83vh;*/
    display: block;
    margin: 12vw auto;
    width:45vw;
    height: 30vw;
}

#forgotPasswordModal .form-horizontal .form-group {
    margin:0;
}

#forgotPasswordModal .modal-body {
    padding-top:0;
}

#forgotPasswordModal .modal-body img{
    width:3.05vw;
}

#forgotPasswordModal .modal-body h2{
    margin: 1vw;
}

#forgotPasswordModal .modal-body h3{
    margin: 0 0vw 2vw;
}

#forgotPasswordModal .modal-header{padding-bottom:0;}

#forgotPasswordModal .modal-header img{width:1.15vw;}
#forgotPasswordModal .modal-body h4{
    color: #000000;
    color: #7d4199;
    font-family: 'NarkisBlockCondensedMF';
}

#forgotPasswordModal .modal-body .sub_content_with_form h3{
    margin-bottom: 1vw;
}
#forgotPasswordModal .modal-body .sub_content_with_form form label{
    color:#000;
}
#forgotPasswordModal .modal-body .sub_content_with_form form input{
    color:#000;
    width: 11.55vw;
    height: 2.5vw;
    border-color:#9564ac;
    margin: 0.3vw auto 0 auto;
}
.basic_modal .modal-body button{
    width:13.02vw;
    height:3.4375vw;
    background-color:#7d4199;
    color:#fff;
    margin:auto;
    display:block;
}

#forgotPasswordModal.basic_modal .modal-body button {
    margin-top:0;
    width: 9.1vw;
    height: 2.4vw;
}

#forgotPasswordModal.basic_modal .modal-body .forgot_password_error{
    color:#a94442;
    font-weight: 700;
}

#forgotPasswordModal .modal-body .sub_content_with_form form .help-block-error {
    font-weight: 700;
    min-height:1.5vw;
    margin:0 auto;
    color: #a94442;
    display: block!important;
    /*width: 11.55vw;*/
    text-align:center;
    line-height:1;
    font-size:1.8vw;
}

/** Loader **/
#loader_gif{
    z-index: 99999;
    margin-top: -50px;
    margin-left: -50px;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: rgba(0,0,0,0.7);
}

#loader_gif .page_loading_gif{
    position: fixed;
    top: 50%;
    right: 50%;
    margin: -0.5em -0.5em 0 0;
    font-size: 96px;
    width: 1em;
    height: 1em;
    overflow: hidden;
    display: block;
    background: #fff;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
}
.select2-results,#select2-sub_employee-container{
	font-family:'sans-serif';
}
.select2-search__field{direction:rtl!important;}
.select2-container--krajee .select2-search--dropdown .select2-search__field {

    background-position:left 10px top 7px!important;
	font-family:'sans-serif';
	
  
}
.btn-cancel {
    color: #fff;
    text-align: center;
    height: 50px;
    background: darkgrey;
    line-height: 50px;
    width: 100%;
    margin: 45px 0 7px;
    border-radius: 0;

	font-weight:600
}
.model-content .btn-cancel {
    height: 44px;
    width: 112px;
    margin: auto;
    font-size: 19px;
    line-height: 27px;
    letter-spacing: 0.1px;
}

.disclaimer-layer {
	position: fixed;
	height: 72%;
	width: 75%;
	top: 12%;
	left: 12%;
	/*transform: translate(-12%, -18%);*/
	background: #FAE7B7;
	border-radius: 8px;
	z-index: 1050; /* Above most content */
	display: none; /* Hidden by default */
	min-width: 300px;
	/* Shadow only, no faded background */
	box-shadow: 0 10px 30px rgba(0,0,0,0.3); 
}
.disclaimer-content{
	position: relative;
	margin: 30px;
	font-size: 30px; 
}