/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jun 8, 2015, 10:58:47 AM
    Author     : prasad.pawar
*/


/*debug starts*/
#shellGridDebug{display:none;width: 100%;height:100%;position: absolute;z-index: 99999;}
#shellGridDebug div{  height:100%;  opacity: 0.5; }
#shellGridDebug div:nth-child(odd){background-color: red;}
#shellGridDebug div:nth-child(even){background-color: green;}
/*debug ends*/
.commonNavigation, .subCommonNavigation, .shellNavigationBtn{
    width: 46px;
    height: 70px;
    cursor: pointer;
    background-repeat: no-repeat;
}
.commonNavigation, .subCommonNavigation{
    position: absolute;
    z-index: 51000;  /*  update due to end of lesson and title visible issue; */
    top: 50%;
}

.left-arrow, .sub-left-arrow{
    margin-left: -46px;
    left: 5%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.right-arrow, .sub-right-arrow{
    right: 2%;
    -webkit-transform: translateY(-50%) scaleX(-1);
    -moz-transform: translateY(-50%) scaleX(-1);
    -ms-transform: translateY(-50%) scaleX(-1);
    -o-transform: translateY(-50%) scaleX(-1);
    transform: translateY(-50%) scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}
.topbar{
    z-index: 1;
    height: 43px;
}

.winterCourse .topbar , .summerCourse .topbar{
    display:inline-block;
}

.topbarWrapper{
    position: relative;
    z-index: 50001;
}

.winterCourse .topbarWrapper , .summerCourse .topbarWrapper{
    text-align:center;
}

.topbarLine{
    height: 43px;
}
.topbarGraphic{
    height: 29px;
    background-repeat: no-repeat;
    background-position: center;
}
.headerText{
    position: relative;
    top: 13px;
    text-align: center;
    font-size: 30px;
    color: #ff3d00;
}

.winterCourse.spanOne .headerText{
    top:4px;
    margin: 0px -67px;
}

.summerCourse.spanOne .headerText{
    top:-6px;
    margin: 0px 15px;
    color: #ffffff;
    font-size: 36px;
}

.winterCourse.spanTwo .headerText, .summerCourse.spanTwo .headerText{
    top:0px;
}


.videoPlayReplayButtonProp{
    cursor: pointer;
    z-index: 1;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    position: absolute;
    width: 165px;
    height: 165px;
}

.video-player{
    position: relative;
    border-radius: 6px;
    overflow: hidden;
    border-top-right-radius: 0px;
}
.videoPopup{
    z-index: 9999;
    margin: 0px; padding: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.9);
}
#videoItem{
    left: 6%;
    margin-left: -52px;
    top: 78px;
    position: absolute;
    z-index: 5;
}
#videoBtnImg{
    width: 43px;
    height: 38px;
}
.videoModel{
    position: relative;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    left: -50%;

    /*top: 78px;*/


    /*    top: 50%;
        transform: translateY(-50%);*/
}
.videoBtn{
    position: relative;
    cursor: pointer;
}
.videoBtnProp{
    position: relative;
}
.UITextWrappedButton>div{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);    
    transform: translateY(-50%);
    padding: 0 20px 0 20px;
}
/*    READING TEMPLATE CSS BEGINS */

.readingPopup{
    z-index: 500;
    margin: 0px; padding: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.9);
}

#readingItem{
    left: 6%;
    margin-left: -52px;
    top: 138px;
    position: absolute;
    z-index: 10;
}
.readingBtn{
    position: relative;
    cursor: pointer;
}
.readingBtnProp{
    position: relative;
}

.readingModel{
    position: relative;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    left: -50%;
}

#readingBtnImg{
    background-image: url("../resource/media/image/readingIconButton.png");
}
.readingTitleImage{
    background-image: url("../resource/media/image/readingIconBig.png");
    width: 39px;
    height: 40px; 
    display: table-cell;
}
.readingTitleContainerDiv
{
    margin: auto;
    margin-top: 4%;
    display: table;
}

.readingContentText
{
    margin: 20px 0;
    font-size: 20px;
    color: #fff;
    text-align: left;
    line-height: 24px;
    max-height: 294px;
    overflow: auto;
}

.readingTitleText
{
    display: table-cell;
    vertical-align: middle;
    font-size: 20px;
    color: #fff;
    padding-left: 8px;
}

#readingBtnImg{
    width: 43px;
    height: 38px;
}

.readingInstructionScreen
{
    max-height:432px;
    max-width: 800px;
    border-radius: 6px;
    padding: 30px;
    display: table;
    margin: 0 auto;
    background-color: #fe7e41;
}

.cross-box-reading{
    cursor: pointer;
    max-width: 50px;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-radius: 5px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    position: relative;
    left: -1px;
}



/*    READING TEMPLATE CSS ENDS */

.UIIconBtnStyle>div{
    padding: 0 3px 0 3px;
}
#shell-menu-popup .menuItemWrapper.disabled {
    cursor: default;
    opacity: 0.5;
}
.winterCourse #shell-menu-popup .subMenuItemWrapper.disabled , .summerCourse #shell-menu-popup .subMenuItemWrapper.disabled {
    cursor: default;
    opacity: 0.5;
}
#shell-menu-popup .menuItems{
    display: inline-block;
    /*width: 120px;*/ /*width will be added dynamically*/
    color: #696969;
}
.winterCourse #shell-menu-popup .subMenuItems , .summerCourse #shell-menu-popup .subMenuItems{
    display: inline-block;
    /*width: 120px;*/ /*width will be added dynamically*/
    /*color: #696969;*/
}
#shell-menu-popup  .menuItems{
    display: inline-block;
    /*width: 120px;*/ /*width will be added dynamically*/
    color: #696969;
}
#shell-menu-popup .menuItemWrapper:hover:not(.disabled) .menuItems{
    color: white;
}
.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled) .menuItems , .summerCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled) .menuItems{
    color: white;
}
/*.winterCourse #shell-menu-popup  .subMenuItems{
    font-family: "salsaregular";
    font-size: 18px;
    display: inline-block;
}*/
.winterCourse #shell-menu-popup .subMenuItemWrapper:last-child , .summerCourse #shell-menu-popup .subMenuItemWrapper:last-child {
    border-bottom: 4px solid white;
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.5);
}
/*.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled){
    background-color: #f4a540;
    color: white;
}*/
.winterCourse #shell-menu-popup .subMenuItemWrapper:last-child , .summerCourse #shell-menu-popup .subMenuItemWrapper:last-child{
    /*    border-bottom: 0px;
        box-shadow:none;*/
}
.winterCourse #shell-menu-popup .subMenuPopup , .summerCourse #shell-menu-popup .subMenuPopup {
    margin-top: -8px;
    /*margin: 10px 5px 0px 5px;*/
}
.winterCourse #shell-menu-popup .subMenuItemWrapper .statusBox , .summerCourse #shell-menu-popup .subMenuItemWrapper .statusBox{
/*    margin-right: -21px;
    margin-left: 50px;*/
}
.winterCourse #shell-menu-popup .subMenuItemWrapper , .summerCourse #shell-menu-popup .subMenuItemWrapper{
    /*padding: 7px 0px 7px 0px;*/
    margin: 0px 10px 0px 10px;
    cursor: pointer;
    text-align: center;
    padding-top: 7px;
    padding-bottom: 7px;
    /*padding: 10px 17px 10px 17px;*/
}
.winterCourse #shell-menu-popup .subMenuItemWrapper:not(.disbaled) , .summerCourse #shell-menu-popup .subMenuItemWrapper:not(.disbaled){
    color: #696969;
}
.winterCourse #shell-menu-popup .menuItemWrapper:nth-child(2) , .summerCourse #shell-menu-popup .menuItemWrapper:nth-child(2){
    border-bottom: 0px;
    box-shadow:none;
}
/*.winterCourse #shell-menu-popup .subMenuItemWrapper{
    border-bottom: 1px solid rgba(0,0,0,0.5);
}*/
/*.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled){
    background-color: #ff3d00;
    color: white;
}*/
/*.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled){
    background-color: #ff3d00;
    color: white;
}*/
/*.winterCourse #shell-menu-popup .subMenuItemWrapper{
    border-bottom: 1px solid rgba(0,0,0,0.5);
}
.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled){
    background-color: #ff3d00;
    color: white;
}*/
/*.winterCourse #shell-menu-popup .subMenuItemWrapper{
    border-bottom: 4px solid white;
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.5);
}
.winterCourse #shell-menu-popup .subMenuItemWrapper:hover:not(.disabled){
    background-color: #f4a540;
    color: white;
}*/
#shell-menu-popup .menuItemWrapper:last-child{
    border-bottom: 0px;
    box-shadow:none;
}


.cross-box{
    cursor: pointer;
    max-width: 50px;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    border-radius: 5px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    position: relative;
    left: -1px;
}
.cross-border{
    height: 48px;
    border-radius: 4px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.cross-border-reading{
    border-radius: 4px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
#footer1{
    height: 73px;
    background-repeat: no-repeat;
}
#footer2{
    height: 98px;
    background-repeat: no-repeat;
    background-position: right;
    display: none;
}
.UITextButton{
    cursor: pointer;
    border-radius: 5px;
    display: inline-block;
    padding-bottom: 8px;
}
.UITextWrappedButton{
    border-radius: inherit;
    display: inline-block;
}
#shell-menu-button{
    cursor: pointer;
    width: 46px;
    position: absolute;
    z-index: 51500;  /*  update due to end of lesson and title visible issue; */
    right: 15px;
}
#shell-menu-popup {
    border-radius: 10px;
    background-color: white;
}
#shell-menu-popup .menuItemWrapper{
    margin: 5px 10px 5px 10px;
    cursor: pointer;
    padding: 10px 17px 10px 17px;
}

.menuTriangle{
    z-index: -1;
    position: absolute;
    top: -6px;
    right: 6px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20px 20px 20px;
}
#shell-menu-popup-wrapper{
    display: none;
    right: 11px;
    position: absolute;
    z-index: 51001;
}
.dialogProp{
    color: white;
    font-size: 21px;
    text-align: center;
    width: 700px;
    height: 470px;
    background-color: #ff8300;
    box-shadow: 0px 7px #ff5800;
    border-radius: 5px;
}
#alert-wrapper{
    z-index: 501;
    background-color: rgba(0,0,0,0.8);
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
}
.alertTitle {
    font-size: 30px;
    display: inline-block;
    height: 42px;
    margin: 18px 0 18px 0;
}
.alertText{
    position: relative;
    /* vertical-align: middle; */
    display: inline-block;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.alert-icon{
    float: left;
    margin-right: 17px;
    width: 47px;
    height: 42px;
}

#end-lesson{
    position: absolute;
    top: 0px;
    z-index: 50500;  /*  update due to end of lesson and title visible issue; */
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.9);
}
#end-lesson-img{
    background: url("../resource/media/image/end_lesson.png");
    width: 637px;
    height: 453px;
    margin: auto;
    margin-top: 94px;
    position: relative;
}

.spanOne #end-lesson-img{
    background: url("../resource/media/image/end_lesson_g2.png");
}

#end-assessment{
    position: absolute;
    top: 0px;
    z-index: 50500;  /*  update due to end of lesson and title visible issue; */
    width: 100%;
    height: 100%;
}
#end-assessment-img{
    background: url("../resource/media/image/end_lesson.png");
    width: 637px;
    height: 453px;
    margin: auto;
    margin-top: 94px;
    position: relative;
}
#end-assessment-container{
    width: 317px;
    height: 445px;
    margin: auto;
    /*margin-top: 94px;*/
    position: relative;
    border:2px solid #2a1c65;
    background-color: #ffffff;
    box-shadow: -4px 4px 0px rgba(0,0,0,0.75); 
    border-radius: 7px;
    opacity: 0;
    top: 50%;
    -webkit-transform: translatey(-50%);
    -moz-transform: translatey(-50%);
    transform: translatey(-50%);
    -ms-transform: translatey(-50%);

}


#end-reviewUnit {
    position: absolute;
    top: 0px;
    z-index: 50500;
    width: 100%;
    height: 100%;
}

#end-reviewUnit-container{
    width: 317px;
    height: 445px;
    margin: auto;
    /*margin-top: 94px;*/
    position: relative;
    border:2px solid #2a1c65;
    background-color: #ffffff;
    box-shadow: -4px 4px 0px rgba(0,0,0,0.75); 
    border-radius: 7px;
    opacity: 0;
    top: 50%;
    -webkit-transform: translatey(-50%);
    -moz-transform: translatey(-50%);
    transform: translatey(-50%);
    -ms-transform: translatey(-50%);

}

.end-points {
    position: absolute;
    width: 140px;
    top: 328px;
    left: 245px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 24px;
}
.hrLine{
    margin: auto;
    margin-bottom: 20px;
    width: 84%;
    border-bottom: 3px dotted white;
}
.dialogParent{
    top: 50%;
    position: relative;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    margin: 0 auto;
    display: table;
    border: 1px solid white;
    border-radius: 5px;
    box-shadow: 0px 7px 1px #fff;
}
.alertCloseBtn{
    position: absolute;
    bottom: 22px;
}
.alertButtonParentCommonProp{
    position: absolute;
    width: 100%;
    bottom: 35px;
}
.contentText{
    line-height: 126%;
    width: 89%;
    margin: auto;
}
.okButtonProp{
    margin: 0 2% 0 2%;
}
.speaker {
    background-repeat: no-repeat;
    width: 28px;
    height: 29px;
    cursor: pointer;
}
.speaker:hover {
    background-repeat: no-repeat;
}
.page-count {
    position: absolute;
    bottom: 0px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 5px;
    width: 100%;
    color: #e1e1e1;
    font-size: 16px;
}
/*disabled button*/
.UITextWrappedButton.disabledButtonStyle, .UITextButton:hover .disabledButtonStyle.UITextWrappedButton {
    cursor: default;
    background-color: #afc3c2;
    color: #dae4e5;
    box-shadow: 0px 7px #dae4e5;
}
#cross-btn{
    position: relative;
    background-repeat: no-repeat;
}

/*activity speakers starts*/
.SHELL_ACTIVITY_SPEAKER {
    width:28px;
    height:29px;
}
.SHELL_ACTIVITY_SPEAKER_DISABLE {
    width:28px;
    height:29px;
}
.SHELL_ACTIVITY_SPEAKER :hover{
    cursor: pointer;
}

/*activity speakers end*/

#play-button{
    background-image:  url(../resource/media/image/PlayButton.png);
}
#replay-button{
    background-image:  url(../resource/media/image/replay_button.png);
}
#videoBtnImg{
    background-image: url(../resource/media/image/video_play_Button.png);
}
.alert-icon{
    background-image: url(../resource/media/image/alertIcon.png);
}

/*Video Activity screen Starts*/

.VIDEOACTSCR-PLAY
{
    cursor: pointer;
    background-image: url(../resource/media/image/PlayButton.png);
}

.VIDEOACTSCR-PLAYING
{
    cursor: pointer;
    background-image: none;
}

.VIDEOACTSCR-REPLAY
{
    cursor: pointer;
    background-image: url(../resource/media/image/replay_button.png);
}

.VIDEOACTSCR-BUFFER
{
    background-image: url("../resource/media/image/vid-buffering.gif");
}

/*Video Activity screen Ends*/

/*End activity screen starts*/
.SPAN_END_ACTIVITY{
    position:relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.SPAN_END_SCREEN_MSG , #end-reviewUnit_Practice .SPAN_END_SCREEN_MSG{
    color:#fff;
    position:relative;
    width: 472px;
    height: 457px;
    background:url(../resource/media/image/end_activity.png) no-repeat;
    /*center*/
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
}

.SPAN_GENERIC_END_MSG{
    line-height: 1.2;
    font-size: 55px;
    text-shadow:  -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000,5px 6px 0px #2a1c65, 0px 0px 5px #2a1c65;
}

.SPAN_END_SCREEN_LINGO{
    width:218px;
    height: 186px;
    background:url("../resource/media/image/endScreenLingo.png") no-repeat;
    position:absolute;
    bottom:0;
    left:-1000px;
}

.END_SCREEN_LARGE_TEXT
{
    font-size: 90px;
    text-shadow:  -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000,8px 10px 0px #2a1c65,0px 0px 5px #2a1c65;
}

.SPAN_END_SCREEN_TEXT{
    text-align: center;
    -webkit-transform:rotate(-6deg);
    -moz-transform:rotate(-6deg);
    -ms-transform:rotate(-6deg);
    -o-transform:rotate(-6deg);
    transform:rotate(-6deg);
    letter-spacing: 3px;
    position: relative;
    left: 10px;
}

.SPAN_SCORE_SPECIFIC_MESSAGE{
    max-width: 300px;
    margin-top:5px;
}

/*End activity screen ends*/

.SPAN_DRAG_STYLE{
    font-size: 26px;
    color: #f0f0f0;
    cursor: pointer;
    text-align: center;
    border-radius: 6px;
    vertical-align: middle;
    display: table-cell;
    background-color: #1fb2ff;
    /*box-shadow: 0px 4px #0083ea;*/
    /*width: 150px;*/
    min-width: 150px;
    /*height: 41px;*/
    line-height: 43px;
}
.SPAN_DRAG_STYLE:hover{
    background-color: #4671e1;
    /*box-shadow: 0px 4px #004ac3;*/
}

.dragParentStyle .SPAN_DRAG_STYLE.disabled {
    cursor: default;
    /*opacity: 0.45;*/
    background-color: #b9b9b9;
    box-shadow: 0px 4px #a2a2a2;
}
.dragParentStyle .SPAN_DRAG_STYLE.disabled:hover{
    background-color: #b9b9b9;
    box-shadow: 0px 4px #a2a2a2;
}

.SPAN_DRAG_STYLE.ui-draggable-disabled {
    cursor: default;
}
.dragParentStyle .SPAN_DRAG_STYLE.disabled.ui-draggable-disabled:hover {
    cursor: default;
    background-color: #b9b9b9;
    box-shadow: 0px 4px #a2a2a2;
}
/*.SPAN_DRAG_STYLE.ui-draggable-disabled:hover{
    background-color: #1fb2ff;
    box-shadow: 0px 4px #0080eb;
}*/
.dragParentStyle{
    padding: 5px;
    text-align: center;
    margin-top: 15px;
    margin-right: 18px;
    background-color: rgba(255,255,255,0.2);
    display: inline-block;
    border-radius: 6px;
    vertical-align: top;
}
.spanOne .dragParentStyle{
    padding-bottom: 10px;    /* draggables are touchin at bottom issue is fixed by this*/
}
.spanTwo .dragParentStyle{
    padding-bottom: 8px;   /* draggables are touchin at bottom issue is fixed by this*/
}
.dropStyle{
    vertical-align: middle;
    margin: 5px 12px;
    background-color: #d2d2d2;
    /*width: 150px;*/
    height: 45px;
    border-radius: 6px;
    display: inline-block;
    position: relative;
}
.activityHolder
{
    padding-top: 0px;
}
.progressContainer{
    text-align: center;
    display: table;
    margin: 0 auto;
    height: 8.7%;
}

.audioProgressTableCell {
    display: table-cell;
    vertical-align: middle;
}
.audioProgressMiddleAligner {
    display: inline-block;
    height: 100%;
    width: 1px;
    vertical-align: middle;
}

.audioProgressBarOuter{
    position: relative;
    display: inline-block;
    width: 250px;
    height: 12px;
    background-color: #dedede;
    margin: 8px auto;
    border: 1px solid #201800;

    border-radius: 6px;
    overflow: hidden;
    vertical-align: middle;
    box-shadow: 0px 0px 0px 3px rgba(255,255,255, 0.15);
}

.audioProgressBar
{
    position: absolute;
    left:0px;
    top:0px;
    height: 100%;
    width:0%;
    background-color: #a47d00 ;
}

.winterCourse.spanOne .audioProgressBar{
    background-color: #de620a;
}

.winterCourse.spanTwo .audioProgressBar{
    background-color: #deab3e;
}

.summerCourse.spanOne .audioProgressBar{
    background-color: #006172;
}

.summerCourse.spanTwo .audioProgressBar{
    background-color: #dcb954;
}

#progressBarSpeaker
{
    position: relative;
    cursor: pointer;
    display: inline-block;
    margin-left: 12px;
    top: 0px;
    vertical-align: middle;
}

.media-parent {
    overflow: hidden;
    padding: 0px 5px;
}

.content-parent.content-with-image {
    padding: 0px 5px;
}

/*end-lesson*/
#end-lesson-container{
    width: 317px;
    height: 445px;
    margin: auto;
    /*margin-top: 94px;*/
    position: relative;
    border:2px solid #2a1c65;
    background-color: #ffffff;
    box-shadow: -4px 4px 0px rgba(0,0,0,0.75); 
    border-radius: 7px;
    opacity: 0;
    top: 50%;
    -webkit-transform: translatey(-50%);
    -moz-transform: translatey(-50%);
    transform: translatey(-50%);
    -ms-transform: translatey(-50%);

}

/* speech Recognition Style */
.leftOutText{
    box-shadow: 0px -2px 0px white inset;
    display: inline-block;
}
.underlineText{
    text-decoration: underline;
}
.correct{
    color: #0ebf01;
}

@media screen and (max-height: 580px)
{

    .page-count {
        text-align: right;
        padding-right: 5px;
    }
}

/*MCQ Start */
.SPAN_MCQ_OPTION{
      margin: 0 auto;
}
/*MCQ End */

/**********Winter course styles start************/

.winterCourse #shellTopbarLeft, .winterCourse #shellTopbarRight, .winterCourse #shellTopbarMiddle{
    display: inline-block;
    float:left;
}

.winterCourse #shellTopbarMiddle{
    display:-webkit-flex;
    display: flex;
    align-items: center;
}
/**********Winter course styles end**********/

/**********Summer course styles start************/

.summerCourse #shellTopbarLeft, .summerCourse #shellTopbarRight, .summerCourse #shellTopbarMiddle{
    display: inline-block;
    float:left;
}

.summerCourse #shellTopbarMiddle{
    display:-webkit-flex;
    display: flex;
    align-items: center;
}
/**********Summer course styles end**********/

/*=========== REVIEW UNIT STYLE START ===============*/

.REVIEW_SPAN_GENERIC_END_MSG{
    line-height: 1.2;
    font-size: 55px;
    text-shadow:  -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000,5px 6px 0px #2a1c65, 0px 0px 5px #2a1c65;
}

.REVIEW_SPAN_END_SCREEN_SPEAKING_TEXT{
    text-align: center;
    -webkit-transform:rotate(-6deg) scale(0.9);
    -moz-transform:rotate(-6deg) scale(0.9);
    -ms-transform:rotate(-6deg) scale(0.9);
    -o-transform:rotate(-6deg) scale(0.9);
    transform: rotate(-6deg) scale(0.9);
    letter-spacing: 3px;
    position: relative;
    left: -15px;
    top: -20px;
}

.REVIEW_SPAN_END_SCREEN_TEXT{
    text-align: center;
    -webkit-transform:rotate(-6deg) scale(0.9);
    -moz-transform:rotate(-6deg) scale(0.9);
    -ms-transform:rotate(-6deg) scale(0.9);
    -o-transform:rotate(-6deg) scale(0.9);
    transform: rotate(-6deg) scale(0.9);
    letter-spacing: 6px;
    position: relative;
    left: 30px;
    top: 10px;
}

.REVIEW_END_SCREEN_LARGE_TEXT
{
    font-size: 90px;
    text-shadow:  -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000,8px 10px 0px #2a1c65,0px 0px 5px #2a1c65;
}
/*=========== REVIEW UNIT STYLE ENDS ===============*/