@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');
/*************************************************
*  General Styles
*************************************************/
* { -webkit-box-sizing:border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

html,body{
    font-family:'gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    margin:0;
    padding:0;
    color:#000;
    /*text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    -webkit-tap-highlight-color: rgba(0,0,0,0);*/
    overflow-y:hidden;
    overflow-x:hidden; /* This one cause you not to be able to click overflowed form elements in Android */
}
body{
    background-color:#e8e8e8;
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
}
body>div.Android,
body>div.iPad,
body>div.iPhone,
body>div.WindowsPhone,
body>div.Desktop{
    height:100%;
}
button{
    background-color:transparent;
    cursor:pointer;
}
button:focus{
    outline:none;
}
button,
input,
textarea,
select{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    color:#000;
    box-shadow:none;
}
a{
    cursor:pointer;
    color:#000;
    text-decoration:none;
    outline:0;
}
a:hover{
    text-decoration:none;
}
h1{
    font-size:17px;
    font-weight:500;
    padding-top:25px;
    margin-bottom:5px;
    margin-top:0;
    font-family: gotham;
}
h2{
    font-size:19px;
    font-weight:500;
    line-height:2;
    margin:9px 0 0 0;
    font-family: gotham;
}
h3{
    font-size:14px;
    font-weight:500;
    color:#8e8e8e;
    white-space:nowrap;
    margin:2px 0 0 0;
}
.cursor{
    cursor: pointer !important;
}
strong{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-weight:500;
}
::-webkit-input-placeholder {
    color:#aaa;
    font-size:15px;
}
:-moz-placeholder {
    color:#aaa;
    font-size:15px;
}
::-moz-placeholder {
    color:#aaa;
    font-size:15px;
}
:-ms-input-placeholder {
    color:#aaa;
    font-size:15px;
}
.Desktop .grayscale,
.iPhone .grayscale,
.iPad .grayscale,
.WindowsPhone .grayscale{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    opacity:0.4;
    filter:alpha(opacity=40);
}
.iPhone .grayscale,
.iPad .grayscale,
.Android .grayscale{
    -webkit-transform: translate3d(0,0,0);
}
.Android .grayscale{
    opacity:0.25;
    filter:alpha(opacity=25);
}
.drillDown{
    cursor:pointer;
}
.drillDown:after{
    content:"";
    height:50px;
    width:10px;
    background-position:-156px -1316px;
    position:absolute;
    right:12px;
    top:50%;
    margin-top:-25px;
}
.drillDown.sharedWith{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    padding:0 15px 0 0;
}
.insertLink{
    text-align:right;
    margin:-10px 0 -10px 0;
    height:44px;
}
.insertLink a{
    color:#1ca0c8;
    cursor:pointer;
    line-height:44px;
    display:inline-block;
    padding:0 10px 0 20px;
}
.linkImportClassMessenger{
    margin-top: 1px;
    margin-bottom: 13px;
    display: inline-flex;
}
.linkImportClassMessenger a{
    line-height:14px;
    font-size:14px;
    padding:10px 40px 10px 0;
    background:url(../images/class_messenger_icon.png) no-repeat right top;
    background-size:32px;
    margin-right:10px;
    margin-left:10px;
}
#signUpScreenChildren section div.insertLink {
    background: #e4e5ed;
    padding-top: 10px;
    font-size: 16px;
}
#signUpScreenChildren .signUpScreenChildrenChildInfo {
    padding: 0 !important;
}
.pageExplanation{
    text-align:center;
    padding:0 10px;
    font-size:17px;
}
.updated{
    background:#fbeed1 !important;
}
.mainPanel .mainPage,
.inlineBox .subPage,
.shadowBox .subPage{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    height:100%;
    width:100%;
    position:absolute;
    padding-top:48px;
    overflow:hidden;
}
.sendMessage_messageText_content,
.selectableText,
textarea,
input,
article p,
article p *,
article h2,
article h2 *,
article h3,
article h3 *,
.postInputBox,
.textInput,
#addRecipientsEditableSpan,
.editableElement,
.chatEntries *,
.editSection *,
article.calendarEvent > .hgroup *,
[contenteditable="true"]{
    -webkit-user-select: auto;
    -moz-user-select: element;
    -ms-user-select: element;
}
.selectableText,
.postInputBox,
.textInput,
#addRecipientsEditableSpan,
.editableElement,
.chatEntries *,
.editSection *{
    -ms-user-select: text;
}
nav.mainNavBar,
nav.subNavTabs,
.orgNav,
.metaNavWrapper,
.addCurSection,
.sidePanel,
article footer,
article > .hgroup *,
article .dateDisplay,
.translateLink,
article .imageFeedbackControl,
.drillDown.sharedWith,
.chatInput button,
div#messageTrayIcon,
.showQuickLinks .quickLinks{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
label.mutedStatus{
    background:#f2f2f2;
    color:#000;
    display:block;
    text-indent:0;
    font-size:13px;
    border-bottom:1px solid #f2f2f2;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:1px;
    border-top:1px solid #f2f2f2;
    border-bottom:1px solid #d9d9d9;
    padding: 10px;
    line-height: 1.35;
    z-index:2;
}
label.mutedStatus a{
    color:#1ca0c8;
    text-decoration:underline;
}
label.mutedStatus ~ .contentArea .orgNav{
    top:30px;
}
.inlineAddBtn{
    cursor:pointer;
}
.inlineAddBtn:after{
    content: "+";
    color: #666;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size: 25px;
    line-height: 23px;
    vertical-align: middle;
    margin-left: 5px;
    margin-top: -5px;
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    text-indent: 0;
    cursor:pointer;
}
.ng-hide{
    display:none;
}
.translateLink{
    font-size:13px;
    white-space:nowrap;
    display:inline-block !important;
}
.translateLink a:after{
    content:"\0000a0\00b7\0000a0";
    color:#1ca0c8;
}
.translateLink a:last-of-type:after{
    content:"";
}
/*Webhook: Layout fix for translateLink*/
article.newConnection.noFooter span + .translateLink a{
    color:#1ca0c8;
    position:absolute;
    margin-top:-62px;
    text-indent:12px;
}
/*Webhook: show new indicator*/
.pgHeader:empty{
    display:none;
}
.exitFS{
    display:none !important;
}





/*************************************************
*  Sprite Styles: Retina Images
*
*  List all selectors using which
*  uses the retina sprite here.
*  The background-size of the retina
*  sprite needs to updated below if
*  the dimensions of the sprite changes.
*
*************************************************/
.logo:after,
body:before,
body:after,
body>div:first-of-type>div:first-of-type:before,
body>div:first-of-type>div:first-of-type:after,
.mainNavBar .scrollableNav:before,
.mainNavBar:after,
.actionBar:before,
.actionBar:after,
.subPanel:before,
.mainNavBar a,
.mainNavBar:after,
div.recommendIcon,
.quickLinks div.addButton,
.quickLinks ul li:after,
.calendarAddEvent ul li:after,
.filterControl a.addChild .profileM,
.filterControl a.addSpouse .profileM,
.actionBar .backButton:before,
.actionButtons button:after,
.actionButtons ul li:after,
.actionButtons button.editEntry:after,
nav.newMessage .nextButton,
button.addLocation,
.autoSuggestPage .contentAutoSuggest span.newEntry:after,
.calendarDateHeader .AddEventInline,
.calendarInvite footer.acceptanceControl button:before,
.inviteRequest footer.acceptanceControl button:before,
.driverControl a.driverCircles,
.postView .chatInput button.like:before,
.postView .chatInput button.likeSelected:before,
.postView .chatInput button.share:before,
article footer li.like:before,
article .imageFeedbackControl li.like:before,
article footer li.likeSelected:before,
article footer li.share:before,
article footer li.addConnection:before,
article .feedbackCounts .like:before,
article .feedbackCounts .comment:before,
.entryOptions:before,
.selectOption:after,
a.loadMorePosts,
a.loadMorePosts:after,
.drillDown:after,
.removeSection,
.formLayout .nextButton,
.formLayout .switchControl input + label:before,
.formLayout .locationBrowse,
.formLayout .dateControl:after,
.formLayout .moreOptions button,
.formLayout .inputGroupV input:checked + label:after,
.formLayout .inputGroupV input:checked ~ .radioIndicator:after,
.formLayout .input-help li:before,
.formLayout .input-help li.valid:before,
.formLayout section .listGroupV .addActivities button:before,
.formLayout button.clearInput,
.formLayout .circles button.createCircle .circleName:after,
.formLayout section .inputGroupDiv div.selected:after,
.postOptions .addGroups:after,
.postOptions .addGroups:before,
.postOptions li .browseDesktop,
.postOptions li .browsePhone,
.postOptions li .postFb:before,
.postOptions li .reshareOption:before,
.postOptions li .scheduleOption:before,
.postOptions li .membersManagerOptions:before,
.postOptions li .noCommentOption:before,
.contactList .hgroup button.addContact,
.contactList .hgroup button.removeContact,
.contactList .hgroup button.addCircles,
.contactList .hgroup button.pendingInvite,
.peopleListing .hgroup button.addCircles:after,
.contactList .scrollView .hgroup button.addAll:after,
.contactList .scrollView .hgroup button.removeAll:after,
.contactList .actionButtons button,
.circles button.createCircle span.circleName:after,
.actionBarInput .searchBox:before,
.actionBarInput .emailBox:before,
.circles article .horizontalList .addMore:after,
.circles .filterControl:before,
.userProfileInfo .profileActions button:before,
.profilePage .howConnected .profileM:before,
.chatWindow .closeButton,
.chatWindow .scrollView.chatEntries div.entry:before,
.chatInput input[type='file'],
nav.actionBarInput ul.actionButtons button.clearInput,
button.removeFromMsg:after,
.inviteCircles .peopleListing .listHeader button.removeFromMsg:before,
footer.options button:after,
footer.options li div:after,
.createAccountPage .facebookSignup button:before,
.profilePage .formLayout section.drillDown:after,
.editProfileMyChild .formLayout .selectedList .enterLoc,
.eventForm .contentEventForm label.importantEvent:before,
article.importantEvent h2:before,
.locationAddress a.callLocation,
.navDrawer .subNavBar li a:before,
.menuButton:after,
#orgHome.menu .actionBar .backButtonOnly:after,
.recipients span.selected span span:before,
.recipients span span span.selected:before,
.formLayout .selectedList .selected:after,
.autoSuggestPage .contentAutoSuggest .selected:after,
.createAccountPage .signupRole li div:before,
.viewCircleFilters:before,
.autoSuggest section.locations .hgroup:before,
.circlesTab .circles article .groupListing a:after,
.actionSheet .groupActions button:before,
.alertBox .groupActions button:before,
.tags:before,
.circleGroupHeader h2:before,
.headerBloomz .addFromSource button,
#addPost .postCreateNew .actionBar h1 span.tags:after,
#addUpdateEvent .eventForm .actionBar h1 span.tags:after,
.childAttributeCoachMarks .aboutLocks,
div.peopleListing .formLayout section p.cardHeader:after,
.welcomeMsg:before,
.mainNavBar ul li a:before,
.scPermissionsVisible:before,
.scPermissionsHidden:before,
.freWalkthrough .walkthrough section h2:before,
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span:before,
article.scLayout footer.verticalBtns li.selected:before,
.verifiedParentBadge img,
.verifiedExplanation.circleMembers .verifiedBy li:before,
.orgNav li.moreOpt a,
.inviteCircles .peopleCheckBox .formLayout section .hgroup button.seeMembers:after,
#orgHome .peopleListing .groupedListing .verticalList .hgroup button,
.chatWindow .actionBar .onlineStatus:after,
.orgInfoPage .contentArea .formLayout>section.newSection a:before,
.orgInfoPage .contentArea .formLayout>section.editSection .removeSection,
.orgInfoPage .contentArea .formLayout>section.editSection .editContactInfo,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveDown,
.postOptions li .browseDesktop + label:before,
.recipientPickerCtrl .actionBar.selectGroups .sourceType a,
div.chatWindow #recipientHeader .nextButton,
.profilePage.profileOrg .actionBar .nextButton:after,
.calendarSwitcher:after,
.recipientPickerCtrl .externalSource:before,
.recipientPickerCtrl .externalSource:after,
.recipientPickerCtrl .peopleListing.peopleCheckBox .formLayout section .hgroup button.removeContact:after,
.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:after,
.formLayout section.signatureSwitcher:after,
.formLayout .plusBtn,
.recipientPickerCtrl .circles button.circle.hasLogo.addChild:before,
.add-new-profile:after,
article .feedbackControl li.inviteOthers img,
article .feedbackControl li.viewCalendar img,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li:before,
.attachedFiles li button.remove,
#imageDraw .audio .remove,
.attachedFiles li a:before,
.formLayout .selectStyles:after,
.recipientPickerCtrl .importBtn,
.recipientPickerCtrl .phoneContactsBtn,
article footer.acceptanceControl li:before,
.verifyMembers.subPage .verficationBtns button,
.horizontalList .hgroup .addMember,
.volunteeredTasks .myTask:before,
.taskInput button.moreOpt,
.taskListing .taskOptions .taskOptionButtons li:after,
.enablePhoneContacts .accessSwitch:before,
.enablePhoneContacts .accessSwitch:after,
.enablePhoneContacts.step1 span,
.enablePhoneContacts.step1 span:before,
.calendarWrapper .dragger span:before,
.invitationPersonal .childProfile .remove,
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:after,
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:before,
.eventEndRepeat .contentEventEndRepeat .formLayout>section.selected:after,
.deviceSupport .scrollView:before,
.alertBox .dialogBox .dialogButtons.fbSignInBtns li button.primaryBtn:before,
.formLayout .linkControl.deleteOption,
.calendarInviteDetail .acceptanceStatus:before,
.actionBar ul.nextButton li.edit,
.actionBar ul.nextButton li.add,
.photoAlbums .photo.selected .entryOptions:after,
.listEditControls li a,
.inlineToolTip .success:before,
.iPhone .addCurSection button,
.iPhone .orgNav a,
.iPhone .orgNavMenu li a:after,
.navDrawer .subNavBar .trayActions li.username a.verifiedUser,
div.formPadding .formLayout .linkControl.addIcon:after,
form.formPadding .formLayout .linkControl.addIcon:after,
.taskListing .taskInput:before,
.recommendBloomz .emptyPanelMsg a:before,
.actionBar .nextButton.recommendBloomz,
.recommendBloomzTip.inlineToolTip p:before,
#rolePicker .circles .roleIcon .circleName:after,
#mailClients .formLayout a:before,
.sliderWrapper .arrows .slidePrev:after,
.sliderWrapper .arrows .slideNext:after,
.sliderWrapper .options a,
.optionListing.circleThumbnail:before,
section.fullPage .social:before,
.addCurSection button,
.addCurSectionStudent button,
#quickTours section.optionListing.circleThumbnail:after,
.appStorePicker .storeListing a,
.inviteBox .downloadInstructions a:before,
.recipients>span.selected>span>span:after,
.recipients>span>span>span.selected:after,
.bloomzNotification p:before,
.viewCount:before,
#media .folder a:before,
.activityFeed .folder a:before,
.calendarInviteDetail .acceptanceStatus:before,
#_albumPicker .recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo.addAlbum,
#imageDraw .postOptions li button:before,
.behaviorManagementItemIcon.behaviorManagementClassIcon,
.behaviorManagementItemIcon.behaviorManagementAddIcon,
.awardsAddIcon .awardsItemIcon,
.pickStudentAvatar .avatar.cam,
.behaviorManagementHeader .behaviorManagementSelectDay a:after,
.behaviorManagementAttendanceHeaderButtons .icon,
.attendanceStatusIcons,
.membersManageOptionIcon,
.quietHours .remove,
.subNavTabsStudentProfileCode .icon,
.messageIcons,
.messageWrapperFileIcon .insertPhoto label,
.messageWrapperFileIcon .attachFiles label,
.notificationsColumns input[type=button],
.awardsItem.addSkill .awardsItemIcon img,
#addRecipient .nextButton,
#messageTrayIcon:before,
#notificationCenterIcon:before,
.storeListingModal .appStoreDownload,
.storeListingModal .playStoreDownload,
.createJoinGroup .icon,
.behaviorUndoButton,
.behaviorSelectMultipleButton,
.behaviorFullScreenButton,
.calendarDatePickerRangeDate .icon,
.bulkImportRadio.selected,
.bulkImportButtons .checked,
#addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherItem,
#addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherHelp,
.signupOccurrences .formPadding .radio.radioSelected,
.communityEngagementCard ul li .iconsprite,
#orgHome .communityPage .actionBar .backButtonOnly:after,
#orgHome .communityPage .actionBar .backButtonOnly:after,
nav.mainNavBar .navClassOptions>div:before,
nav.subNavBar .navClassOptions>div:before,
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-left-single-arrow:after,
.subNavTabs span.premiumCalendar:before,
.scrollView h1.subInlineTabs .premiumCalendar:before,
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-right-single-arrow:after,
.addRoster .addParentSlotTash,
.behaviorInlineMenu ul li div .icon{
    background-image: url(../images/sprite@2x.png?20180314);
.celebrationSurpriseBackground,
.behaviorInlineMenu ul li div .icon,
.communityManage .buttonIsSelected
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat:no-repeat;
}
/* Have in separate definition because this style failes on FF causing entire sprite to not load */
#deviceType.chrome .videoPlayerChromeWebBrowser video::-webkit-media-controls-fullscreen-button{
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat:no-repeat;
}
@media screen
and (min-width:768px){
    .showCoachMarks .mainNavBar li a:before{
        background-image: url(../images/sprite@2x.png?20180516);
        background-size: 704px 2170px;
        background-repeat:no-repeat;
    }
}

.showCoachMarks .quickLinks:before,
.showCoachMarks .scrollView section.updates h1:after,
.showCoachMarks .scrollView .contentArea>.filterControl li:last-child:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .editMyProfile .inputProfile:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .friendRequests:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .myFamily .addSpouse:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .myFamily .addChild:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .editMyProfile .inputProfile:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .friendRequests:after,
.showCoachMarks.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .inputProfile:after,
.showCoachMarks.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .circleColorPicker:after,
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutSchools:after,
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutLocks:after,
.enablePhoneContacts .switchTip:before{
    background-image: url(../images/spriteCoachMarks@2x.png?20180314);
    background-size: 230px 150px;
    background-repeat:no-repeat;
}
.postOptions li .shareOptions:before{
   background-image: url(../images/ic_share.png) !important;
    background-size: contain;
    background-repeat:no-repeat;
}




/********************************************
* Disable text selection
********************************************/
.actionBar,
.subInlineTabs,
.mainTabBar{
    -webkit-user-select: none;
    -ms-user-select: none;
}



/********************************************
* Student Layout
********************************************/
.studentLayout .recipients span span span{
    color:#000;
}
.studentLayout .recipients>span>span>span:after{
    display:none;
}



/*********************************************
* Android Only
*********************************************/
.Android .grayscale{
    -webkit-transform: translate3d(0,0,0);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
}



/*********************************************
* Animation Mask: Prevent all clicks while
* animations are in progress.
*********************************************/
.animationMask{
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
}



/*********************************************
* Hide for Mobile
*********************************************/
.logo.logo_hideMob,
#mainNavBar.mainNavBar_hideMob{
    display:none;
}



/*********************************************
* Coach Marks:  General
*********************************************/
.showCoachMarks .scrollView>.contentArea:before,
.showCoachMarks .scrollView>div>.contentArea:before,
.showCoachMarks .scrollView>.formLayout:first-of-type:before,
.contactList.showCoachMarks .scrollView:before{
    content:"";
    background:rgba(0,0,0,.7);
    height:100%;
    width:100%;
    position:absolute;
    left:0;
    top:0;
    box-shadow:inset 0 -30px 100px rgba(0,0,0,.8);
    display:block;
}
.contactList.showCoachMarks .scrollView>.formLayout:before{
    display:none;
}
.contactList.showCoachMarks .scrollView{
    border-color:#000;
}
.showCoachMarks .scrollView{
    overflow:hidden !important;
}
.showCoachMarks{
    display:block;
}
.coachMarkClick,
.Desktop .sidePanel .coachMarkClick,
.Desktop .sidePanel .coachMarkSkip{
    display:none;
}
.showCoachMarks .coachMarkClick{
    display:inline-block;
    position:absolute;
    top:50%;
    left:50%;
    background:rgba(0, 0, 0, .5);
    padding:12px 10px 8px 10px;
    font-size:18px;
    border:1px solid #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color:#fff;
    cursor:pointer;
    margin-left:-75px;
    font-family:'firetoRain';
    text-shadow:0 1px 3px rgba(0,0,0,1);
    font-size:17px;
    min-width:85px;
    text-align:center;
}
.coachMarkSkip{
    display:none;
    position:absolute;
    top:50%;
    left:50%;
    text-align:left;
    width:130px;
    color:#3bc7f7;
    text-decoration:underline;
    cursor:pointer;
    font-family:'firetoRain';
    text-shadow:0 1px 3px rgba(0,0,0,1);
    font-size:14px;
    margin-left:-2px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.coachMedium:before{
    content:attr(data-coachmark);
    font-family:'firetoRain';
    text-shadow:0 1px 3px rgba(0,0,0,1);
    font-size:17px;
    line-height:1.35;
    display:none;
    position:absolute;
    color:#fff;
    white-space:normal;
    text-align:left;
    text-indent:0;
}
.coachSmall:before{
    content:attr(data-coachmark);
    font-family:'firetoRain';
    text-shadow:0 1px 3px rgba(0,0,0,1);
    font-size:14px;
    line-height:1.35;
    display:none;
    position:absolute;
    color:#fff;
    white-space:normal;
    text-align:left;
    text-indent:0;
}




/*********************************************
* Coach Marks:  Main Nav
*********************************************/
.showCoachMarks .mainNavBar li a:after{
    content:"";
    width:1px;
    height:20px;
    background:rgba(255,255,255,.4);
    display:block;
    position:absolute;
    top:57px;
    left:20px;
}
.showCoachMarks .mainNavBar li a:before{
    content:attr(data-coachmark);
    top:80px;
    left:25px;
    display:block;
    position:absolute;
    white-space:nowrap;
    transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    -webkit-transform-origin:0 0;
    transform-origin: 0 0;
    text-indent:0;
    text-shadow:0 1px 3px rgba(0,0,0,1);
    font-family:'firetoRain';
    color:#fff;
}
.showCoachMarks .logo span:after{
    content:"";
    width:1px;
    height:20px;
    background:rgba(255,255,255,.4);
    display:block;
    position:absolute;
    top:57px;
    left:48px;
}
.showCoachMarks .logo span:before{
    top:80px;
    left:53px;
    display:block;
    white-space:nowrap;
    transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    -webkit-transform-origin:0 0;
    transform-origin: 0 0;
}
.showCoachMarks .quickLinks:before{
    width:120px;
    right:57px;
    bottom:2px;
    display:block;
    padding:0 46px 15px 0;
    background-position:94px 39px;
    background-repeat:no-repeat;
}
.showCoachMarks .scrollView section.updates h1:after{
    content:"";
    display:block;
    position:absolute;
    width:24px;
    height:24px;
    top:128px;
    margin-left:-6px;
    background-position:-157px -12px;
}
.showCoachMarks .scrollView section.updates h1:before{
    top:142px;
    margin-left:18px;
    display:block;
}
.showCoachMarks .scrollView .contentArea>.filterControl li:last-child{
    position:relative;
}
.showCoachMarks .scrollView .contentArea>.filterControl li:last-child:after{
    content:"";
    display:block;
    position:absolute;
    width:24px;
    height:24px;
    top:35px;
    right:3px;
    background-position:-191px -11px;
    display:none;
}
.showCoachMarks .scrollView .contentArea>.filterControl li:last-child:before{
    text-align:right;
    top:47px;
    right:27px;
    width:200px;
    display:none;
}
/* Forces coachmark to be hidden.
   Careful: If element use before or after pseudo classes, it'll hide those as well. */
.forceHideCoachMark:before,
.forceHideCoachMark:after{
    display:none !important;
}



/****************************************************
* Coach Marks:  FRE My Profile Page (Step 1 Profile)
****************************************************/
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile{
    position:relative;
}
.freProfileMine.showCoachMarks,
.freProfileMine.showCoachMarks .coachMarkClick,
.freProfileMine .coachMedium:before,
.freProfileMine .coachSmall:before,
.freProfileMine.coachMark1 .scrollView>.formLayout .suggestedConnections,
.freProfileMine.coachMark1 .scrollView>.formLayout .suggestByCircles,
.freProfileTeacher.showCoachMarks,
.freProfileTeacher.showCoachMarks .coachMarkClick,
.freProfileTeacher .coachMedium:before,
.freProfileTeacher .coachSmall:before,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .suggestedConnections,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .suggestByCircles{
    display:none;
}{
    display:none;
}
/* Profile Photo */
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile .inputProfile:before,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile .inputProfile:before{
    display:block;
    width:160px;
    top:175px;
    left:-95px;
}
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile .inputProfile:before{
    top:184px;
}
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile .inputProfile:after,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile .inputProfile:after{
    content:"";
    background-position:-12px -59px;
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    height:84px;
    width:128px;
    position:absolute;
    display:block;
    left:-120px;
    top:63px;
}
/* Gender Picker */
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:before,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:before{
    display:block;
    width:90px;
    top:54px;
    right:-40px;
}
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after{
    content:"";
    background-position:-195px -12px;
    height:23px;
    width:17px;
    position:absolute;
    display:block;
    right:-25px;
    top:23px;
    transform: rotate(-60deg);
    -ms-transform: rotate(-60deg);
    -webkit-transform: rotate(-60deg);
}



/*********************************************
* Coach Marks:  FRE My Profile Page (Step 2)
*********************************************/
/* Spouse & Friend Invite */
.freProfileMine.coachMark2 .scrollView>.formLayout .suggestedConnections,
.freProfileMine.coachMark2 .scrollView>.formLayout .suggestByCircles,
.freProfileMine.coachMark2 .scrollView>.formLayout .myFamily{
    display:none;
}
.freProfileMine.coachMark2 .scrollView>.formLayout .friendRequests{
    background-color:transparent;
}
.freProfileMine.coachMark2 .scrollView>.formLayout .friendRequests h2{
    color:#fff;
    text-shadow:none;
}
.freProfileMine.coachMark2 .scrollView>.formLayout .friendRequests:before{
    display:block;
    width:100%;
    top:200px;
    left:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 30px;
}
.freProfileMine.coachMark2 .scrollView>.formLayout .friendRequests:after{
    content:"";
    background-position:-195px -12px;
    height:23px;
    width:17px;
    top:125px;
    right:20px;
    position:absolute;
    display:block;
    transform: rotate(-7deg);
    -ms-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
}
.freProfileTeacher.coachMark2 .scrollView>.formLayout:before,
.freProfileTeacher.coachMark3 .scrollView>.formLayout:before{
    display:none;
}



/*********************************************
* Coach Marks:  FRE My Profile Page (Step 3)
*********************************************/
/* My Family */
.freProfileMine.coachMark3 .scrollView>.formLayout .friendRequests,
.freProfileMine.coachMark3 .scrollView>.formLayout .suggestedConnections,
.freProfileMine.coachMark3 .scrollView>.formLayout .suggestByCircles{
    display:none;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily{
    background-color:transparent;
    border-bottom:none;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily h2,
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily .profileNameBelow:after{
    color:#fff;
    text-shadow:none;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily .addSpouse:before{
    display:block;
    width:130px;
    top:80px;
    left:14px;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily .addSpouse:after{
    content:"";
    background-position:-155px -12px;
    height:23px;
    width:17px;
    top:66px;
    left:-8px;
    position:absolute;
    display:block;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily .addChild:before{
    display:block;
    width:135px;
    top:-10px;
    left:110px;
}
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily .addChild:after{
    content:"";
    background-position:-83px -8px;
    height:30px;
    width:60px;
    top:-26px;
    left:45px;
    position:absolute;
    display:block;
    transform: rotate(-29deg);
    -ms-transform: rotate(-29deg);
    -webkit-transform: rotate(-29deg);
}



/*********************************************
* Coach Marks:  FRE Add Child Profile (Step 1)
*********************************************/
/* Profile Photo */
.editProfileMyChild.coachMark1 .coachMarkClick{
    display:none;
}
.editProfileMyChild.coachMark1 .coachMarkSkip{
    display:inline-block;
    top:333px;
    left:50%;
    margin-left:-144px;
}
.editProfileMyChild.coachMark1 .inputProfile{
    z-index:auto;
}
.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .inputProfile:before{
    display:block;
    width:160px;
    top:167px;
    left:-110px;
}
.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .inputProfile:after{
    content:"";
    background-position:-12px -59px;
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    height:84px;
    width:128px;
    position:absolute;
    display:block;
    left:-140px;
    top:58px;
}
/* Color Picker */
.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .circleColorPicker:before{
    display:block;
    width:130px;
    top:180px;
    left:50%;
    margin-left:23px;
}
.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .circleColorPicker:after{
    content:"";
    background-position:-195px -12px;
    transform: rotate(-38deg);
    -ms-transform: rotate(-38deg);
    -webkit-transform: rotate(-38deg);
    height:25px;
    width:20px;
    position:absolute;
    display:block;
    left:50%;
    top:150px;
    margin-left:98px;
}
.editProfileMyChild.coachMark1{
    overflow:visible;
}



/*********************************************
* Coach Marks:  FRE Add Child Profile (Step 2)
*********************************************/
/* Schools and Activities */
.editProfileMyChild.coachMark2 .coachMarkClick{
    background:transparent;
    margin-left:0;
    left:0px;
    top:214px;
    height:100%;
    width:100%;
    text-indent:-9999px;
    border:none;
}
.editProfileMyChild.coachMark2 .scrollView>.formLayout .autoSuggest{
    position:relative;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks{
    background:none;
    display:block;
    position:absolute;
    width:100%;
    margin-top:-103px;
    border-bottom:none;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutSchools{
    background:none;
    width:100%;
    text-indent:15px;
    text-shadow:none;
    color:#fff;
    margin:-2px 0 5px 0;
    position:relative;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutSchools:before{
    display:block;
    width:290px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 20px 0 100px;
    margin-top:-58px;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutSchools:after{
    content:"";
    background-position:-80px -8px;
    height:30px;
    width:58px;
    position:absolute;
    display:block;
    left:-58px;
    top:-41px;
    margin-left:98px;
    transform: rotate(-69deg);
    -ms-transform: rotate(-69deg);
    -webkit-transform: rotate(-69deg);
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutLocks{
    width:24px;
    height:24px;
    right:9px;
    top:-89px;
    position:absolute;
    background-position:-469px -1329px;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutLocks:before{
    display:block;
    position:absolute;
    right:11px;
    top:-43px;
    text-align:left;
    width:200px;
}
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutLocks:after{
    content:"";
    background-position:-157px -12px;
    height:25px;
    width:20px;
    position:absolute;
    display:block;
    right:7px;
    top:-25px;
    transform: rotate(166deg);
    -ms-transform: rotate(166deg);
    -webkit-transform: rotate(166deg);
}





/****************************************************
* Coach Marks:  "Add From" Pages
****************************************************/
.showCoachMarks .addFromSource,
.showCoachMarks .addFromSource li{
    overflow:visible;
    text-align:left;
}
.showCoachMarks .addFromSource li:before{
    transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    -webkit-transform-origin:0 0;
    transform-origin: 0 0;
    display:block;
    width:auto;
    white-space:nowrap;
    top:75px;
    left:26px;
}
.showCoachMarks .addFromSource li:after{
    content:"";
    height:17px;
    width:1px;
    top:55px;
    left:21px;
    position:absolute;
    display:block;
    background-color:rgba(255,255,255,.4);
}
.showCoachMarks.contactList .coachMarkClick{
    top:390px;
    margin-left:-23px;
}
.showCoachMarks.contactList .addFromSource:before{
    top:295px;
    padding:0 0 0 25px;
    width:197px;
    display:block;
}
.showCoachMarks.contactList .addFromSource:after{
    content:"";
    display:block;
    position:absolute;
    top:300px;
    left:69px;
    padding:0;
    width:15px;
    height:1px;
    background-color:rgba(255,255,255,.4);
}



/*********************************************
* scrollView Styles
*********************************************/
.scrollView{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background:#fff;
    position:relative;
    height:100%;
    overflow-y:auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling:touch; /* required for smooth scrolling on iPhone */
    -webkit-transform: translateZ(0); /* to prevent lag on Chrome */
}
.scrollView * {
    -webkit-overflow-scrolling:auto;  /* required for smooth scrolling on iPhone */
    outline: none !important;
}
.iPhone .scrollView,
.iPad .scrollView{
    border-top:1px solid transparent;  /* required for iPhone and iPad.  was showing black bg when scrolling to top and bottom */
}



/*********************************************************************
 * iPhone/iPad blinks if overflow-scrolling set to auto.
 * iPhone/iPad needs it set to auto so the user can scroll the tray.
 * The solution is to time the blink to happen right when we bounce
 * the tray open.  This way, the blink happens offscreen
 ********************************************************************/
.showDrawer.noTouchScroll .scrollView{
    -webkit-overflow-scrolling:auto;
}
.showDrawer.noTouchScroll .carousel{
    -webkit-overflow-scrolling:auto;
}


.homeTab .scrollView,
.postsTab .scrollView,
.calendarTab .scrollView,
.circleDetails .scrollView,
.postView .scrollView,
.postCreateNew .scrollView.createPost,
.profilePage .scrollView,
.accountSettings .scrollView,
.accountSettingsPassword .scrollView,
.accountSettingsCalendarSubscribe .scrollView,
.createAccountPage .scrollView,
.forgotPasswordPage .scrollView,
.calendarTab .scrollView,
.eventForm .scrollView,
.calendarEventDetails .scrollView,
.inviteBloomzLoc .scrollView,
.joinGroup .scrollView,
.createCirclePage .scrollView,
.verifiedExplanation.circleMembers .scrollView,
#orgHome .scrollView,
.orgSettingsPage .scrollView,
.orgColorPicker .scrollView,
.editMembershipSettings .scrollView,
.newCommunityRequest .scrollView,
#colorPicker .scrollView,
.circlesTab .displayingPendingTab .scrollView,
.circlesTab .scrollView,
.importCalendar .scrollView,
#noPhoneContactsAccess .scrollView,
.calendarSettings .scrollView,
.messagesTab .scrollView,
.volunteerAsks .scrollView,
#newClass .scrollView,
#orgHome .orgSignupsPage .scrollView,
.inviteBox .scrollView,
#reviewablePosts .scrollView,
#discardedPosts .scrollView,
#scheduledPosts .scrollView,
#media .scrollView,
.scrollView.awards,
#editName .scrollView,
#studentMilestone .scrollView,
.loginAccountClassMessenger .scrollView,
#importClassMessenger .scrollView{
    background:#edeef3;
    /*background-color: #f2f2f2;*/
}
.downloadApp .scrollView{
    background:#f7f7f7;
    /*background-color: #f2f2f2;*/
}
.spouseInvite .scrollView,
.spouseInvite .formPadding,
.noMarginLayout #volunteer .scrollView,
#orgHome .orgMessagesPage .chatPanel,
#orgHome .orgInfoPage .scrollView,
#createJoinGroup.getInvitedPage .createAccountPage .scrollView{
    background:#fff;
}
.postsTab .scrollView{
    overflow-y:scroll;
}




/*********************************************
* Active states for listing pages
*********************************************/
.highlightableRow{
    transition: background, border;
    -webkit-transition: background, border;
    transition-delay: .08s;
    -webkit-transition-delay:.08s;
    cursor:pointer;
}
.notScrolling div.highlightableRow:active,
.notScrolling span.highlightableRow:active,
.notScrolling label.highlightableRow:active{
    background:#f1f1f1;
    border-bottom:1px solid #d9d9d9;
}
.notScrolling .formLayout section.highlightableRow:active,
.notScrolling article.highlightableRow:active,
.notScrolling article .highlightableRow:active{
    background:#f1f1f1;
}

.notScrolling article.highlightableRow.hgroup:active,
.notScrolling article .highlightableRow.hgroup:active{
    background:#f1f1f1;
    border-bottom:none;
}
.notScrolling .navDrawer .subNavBar li>a.highlightableRow:active{
    background-color:#22232a;
}
.notScrolling .navDrawer .subNavBar .trayActions li>a.highlightableRow:active{
    border-top:1px solid #000;
}
.notScrolling .circlesTab .circleCardsListing article .groupListing a.highlightableRow:active{
    background:#fff6e1;
    border-left:2px solid #fff6e1;
    border-right:2px solid #fff6e1;
}



/*********************************************
* slide out by setting the left value from
* left:0%
* left:-100%
*********************************************/
.onStage{
    width:100%;
    top:0;
}
/*********************************************
* slide in by setting the left value from
* left:100%
* left:0%
*********************************************/
.offStage{
    left:100%;
    top:0;
    width:100%;
    position:absolute;
}



/*************************************************
*  Logo
*************************************************/
.logo{
    display:block;
    width:100%;
    height:48px;
    position:absolute;
    text-indent:-9999px;
    top:0px;
    left:0px;
}
.logo:after{
    content:"";
    display:block;
    position:absolute;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    background-position:-463px -424px;
    border: none;
    width: 32px;
    height: 32px;
    top: 8px;
    left: 8px;
}
.logo.noNavTray{
    width:44px;
    display:block;
}
.logo.noNavTray:after{
    background-position:-116px -10px;
    width:36px;
    border-right:0;
    box-shadow:none;
    height:36px;
    top:7px;
    left:6px;
}
.logo:active:after{
    background-color:#e1e1e1;
}
.logo.noNavTray:active:after{
    background-color: transparent !important;
}
.logo ~ .actionBar .backButtonOnly{
    display:none;
}

/*************************************************
*  Main Panel (main areas of site)
*************************************************/
.mainPanel{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background-color:#e8e8e8;
    overflow:hidden;
    box-shadow:0 5px 20px rgba(0,0,0,.4);
    z-index:2;
}
#beforeMainPanel{
    position:absolute;
    height:100%;
    z-index:3;
}
#genericControls{
    z-index:1;
}



/********************************************
* Side Panel (Messages)
********************************************/
.sidePanel{
    width:300px;
    height:100%;
    /*right:12px;*/
    right:10px;
    position:absolute;
    overflow:visible;
    padding-top:127px;
    display:block;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    pointer-events:none;
}
.sidePanel *{
    pointer-events:all;
}
/*.sidePanel:before{
    content: "";
    width: 1px;
    height: 47px;
    display: block;
    background: rgba(0,0,0,.3);
    position: absolute;
    top: 63px;
}*/
.sidePanel>div{
    height:100%;
}
.sidePanel .mainPage{
    height:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    /*border-left:1px solid #c3c3c3;*/
}
.sidePanel .mainPage .scrollView{
    overflow:hidden;
    /**border-left:1px solid #fff;*/
    background:#fff;
    padding-bottom:50px;
}
.sidePanel .mainPage .scrollView::-webkit-scrollbar{
    width: 6px;  /* for vertical scrollbars */
}
.sidePanel .mainPage .scrollView::-webkit-scrollbar-track{
    /*background:#f1f1f1;*/
    background:#fff;
}
.sidePanel .mainPage .scrollView::-webkit-scrollbar-thumb{
    background: rgba(0, 0, 0, 0.18);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.sidePanel .mainPage .scrollView::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}
.sidePanel .mainPage .scrollView:hover{
    overflow-x:hidden;
    overflow-y:scroll;
    overflow-y:auto;
    -webkit-overflow-scrolling: touch;
}
.sidePanel .mainNavBar,
.sidePanel .metaNav,
.sidePanel .logo{
    display:none;
}
.sidePanel ul.filterControl,
.sidePanel .viewCircleFilters,
.sidePanel .circleFilters{
    display:none;
}
.sidePanel h1{
    display:none;
}
.sidePanel .contentArea{
    margin-left:0;
    margin-right:0;
    padding-top:0;
    background:#fff;
}
.sidePanel .messages .message:first-of-type:after{
    display:none;
}
.sidePanel .messages .message{
    box-shadow:none;
    background:transparent;
    margin-bottom:0;
    /*padding:16px 0 16px 20px;*/
    padding:15px;
    border:none;
}
.sidePanel .messages .message:after{
    content: "";
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    top: 0px;
    left: 16px;
    border-top: 1px dashed #cecece;
}
.sidePanel .messages .message h3{
    position:absolute;
    left:10px;
    right:auto;
    top:47px;
    width:40px;
    text-align:center;
}
.sidePanel .messages .message h3 time{
    background:#f1f1f1;
    top:0px;
    padding:0;
    font-size:12px;
}
.sidePanel .messages .message h2 .profileM{
    font-size:14px;
}
.sidePanel .messages .message p{
    font-size:13px;
    max-height:34px;
    padding-right:1px;
}
.sidePanel .messageTextPanel{
    font-size: 13px;
    line-height: 16px;
    max-height:32px;
    color:#9e9e9e;
}
.sidePanel .messageTextPanel.showPptsRoles, .sidePanel .showPptsRoles { color:#424242; font-weight:500; }
.sidePanel .quickLinks{
    display: none;
}
.sidePanel .quickLinks:after{
    display:block;
}
.sidePanel .addCurSection button{
    left:auto;
    margin-left:10px;
}
.sidePanel .persistentEmptyPanelMsg h2{
    margin-top:12px;
}


/*
.sidePanel .persistentEmptyPanelMsg:before{
    content: "";
    display: none;
    position: absolute;
    border-top: 1px dashed #cecece;
    left: 16px;
    width: 100%;
    margin-top: -9px;
}*/
.endMsgDivider{
    /*padding-left:20px;*/
    padding-left:15px;
    padding-right:15px;
    width: 100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:none;
}
.endMsgDivider:before{
    content:"";
    /*border-top: 1px dashed #cecece;*/
    border-top: 1px solid #e4e5ed;
    left: 16px;
    width: 100%;
    height:1px;
    display:block;
}
.sidePanel .messages .message + .endMsgDivider{
    display:block;
}



.sidePanel .messagesTab .loadMoreEntries{
    display:none;
}
.sidePanel .messagesTab .addCurSection{
    bottom:20px;
}

.sidePanel .messagesTab .loadMoreEntries.loadMoreSearchMessages{
    display: block !important;
    margin-left: -150px !important;
}

/*  Seeing content through scroll area when
transitioning inlineboxes out. */
.inlineBox.slideRightOut:before{
    content:"";
    animation:FadeIn .1s;
    -webkit-animation:FadeIn .1s;
    -webkit-animation-timing-function:ease;
    position:absolute;
    display:block !important;
    width:100%;
    height:100%;
    left:0;
    right:0px;
    z-index:1;
    background:#e8e8e8;
}



/********************************************
* Message Tray Icon
********************************************/
div#messageTrayIcon{
    position:absolute;
    top:33px;
    right:1px;
    width:100%;
    height:100%;
}
div#messageTrayIcon .toggleTray{
    display:none;
    cursor:pointer;
    position:fixed;
    width:36px;
    height:36px;
}
div#messageTrayIcon .toggleTray.desktopRes{
    display:none;
}
div#messageTrayIcon .toggleTray.mobileRes{
    display:block;
}
div#messageTrayIcon:before{
    content:"";
    background-position:-524px -415px;
    /*background-color:rgba(0,0,0,.05);*/
    position:absolute;
    top:0;
    right:10px;
    width:36px;
    height:36px;
    text-indent:-9999px;
    cursor:pointer;
    display:block;
    /*-webkit-border-radius:0 5px 0 0;
    -moz-border-radius:0 5px 0 0;
    border-radius:0 5px 0 0;
    border-left: 1px solid rgba(0,0,0,.05);*/
}
.hideSidePanel div#messageTrayIcon:before{
    border-left: 1px solid transparent;
}
div#messageTrayIcon .badge{
    text-align: center;
    text-indent: 0;
    min-width: 18px;
    display: block;
    height: 18px;
    padding: 0 3px;
    color: #fff;
    position: absolute;
    top: 1px;
    right: 0px;
    font-size: 10px;
    line-height: 20px;
    text-shadow: none;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    box-shadow: inset 0px -1px 0px rgba(0,0,0,.1);
    background: #e86c6c;
}


/*************************************************
*  Hide/Show Message Tray
*************************************************/
#_sidechat,
.showSidePanel #_sidechat{
    display:block;
}
.hideSidePanel #_sidechat{
    display:none;
}
.hideSidePanel div#messageTrayIcon{
    width:36px;
    height:44px;
}
.hideSidePanel div#messageTrayIcon:before{
    background-color:transparent;
    border-left:1px solid transparent;
}
.showSidePanel #_sidechat .sidePanel,
.showSidePanelMobile #_sidechat .sidePanel{
    animation: SlideLeftIn .4s;
    -webkit-animation: SlideLeftIn .4s;
    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;
}







/*************************************************
*  Action Sheet
*************************************************/
.actionSheet{
    display:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:200%;
    border-top:1px solid #fff;
    -webkit-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
}
.actionSheet>div{
    position:relative;
    width:100%;
    height:100%;
    display:table;
}
.actionSheet>div:before{
    content:"\0000a0";
    width:100%;
    display:table-row;
    background:rgba(0,0,0,.5);
    height:auto;
}
.actionSheet .dialogBox{
    width:100%;
    height:1px;
    text-align:center;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:table-row;
    background:#fff;
    text-shadow:none;
    color:rgba(0,0,0,.8);
    font-size:18px;
    border-radius:10px;
}
.Android .actionSheet>div:before,
.WindowsPhone .actionSheet>div:before{
    content:"\0000a0";
    background:rgba(0,0,0,.5);
    height:100%;
}
.Android .actionSheet .dialogBox,
.WindowsPhone .actionSheet .dialogBox{
    background:rgba(255,255,255,.9);
}
.actionSheet .dialogBox .dialogMessage{
    display:table-cell;
    padding:15px;
    border-top:1px solid rgba(0,0,0,.15);
}
.actionSheet .dialogBox .dialogMessage textarea{
    margin-top:5px;
    background:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    padding:10px;
    height:64px;
    border:1px solid #c3c3c3;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-appearance: none;
    outline: none;
}
.communityRequestModal textarea{
    margin-top:5px;
    background:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    padding:10px;
    height:104px;
    border:1px solid #c3c3c3;
    width:95%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-appearance: none;
    outline: none;
}
.showActionSheet{
    display:block;
    animation:actionSheetIn .3s;
    -webkit-animation:actionSheetIn .3s;
    animation-timing-function:ease;
    -webkit-animation-timing-function:ease;
}
.hideActionSheet{
    display:none;
    animation:actionSheetOut .6s;
    -webkit-animation:actionSheetOut .6s;
    animation-timing-function:ease;
    -webkit-animation-timing-function:ease;
    height:1px;
    opacity:0;
    filter:alpha(opacity=0);
}



/*************************************************
*  Alert Box
*************************************************/
.alertBox{
    display:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    border-top:none;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    background:rgba(37,37,37,.4);
    padding:50px 20px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.alertBox .topLink{
    text-align: right;
    cursor: pointer;
    color: #FFF;
    text-decoration: underline;
    text-shadow: none;
    margin-bottom: 2px;
}
.alertBox>div{
    position:relative;
    width:100%;
    max-width:270px;
    height:auto;
    display:table;
    margin:0 auto;
}
.alertBoxAwards>div{
    position:relative;
    width:100%;
    max-width:300px;
    height:auto;
    display:table;
    margin:60px auto 0 auto;
}
.alertBoxAwardSelected>div{
    margin: 0 auto;
    height: 100px !important;
}
.alertBoxAwardSelected>div .dialogBox{
    height:100px !important;
}
.alertBox .dialogBox{
    width:100%;
    height:1px;
    text-align:center;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:table-row;
    background:rgba(255,255,255,.6);
    text-shadow:none;
    color:rgba(0,0,0,.8);
    font-size:18px;
}
.alertBoxAwards .dialogBox nav{
    text-align:left;
}
.alertBoxAwards .actionBar{
    width: 20%;
    border: none;
    background: none;
    box-shadow: none;
}
.alertBox .dialogBox .dialogMessage{
    display:table-cell;
    padding:15px 0 0 0;
    padding:0;
    border-top:1px solid rgba(0,0,0,.15);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 2px 3px rgba(0,0,0,.2);
    background:rgba(255,255,255,.95);
}
.alertBoxAwards .dialogBox .dialogMessage{
    display:table-cell;
    padding:8px 0 0 0;
    border-top:1px solid rgba(0,0,0,.15);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 2px 3px rgba(0,0,0,.2);
    background:rgba(255,255,255,.9)
}
.alertBox .dialogBox .formLayout{
    text-align:left;
}
.alertBox .dialogBox div.formPadding>.formLayout:last-of-type{
    margin-bottom:0;
}
.alertBox .dialogBox .dialogMessage .formPadding{
    min-height:0;
    background:transparent;
}
.alertBox .dialogBox .formLayout .alertTime .separateTime .datePicker,
.alertBox .dialogBox .formLayout .separateTime .timePicker .onlyTime{
    padding:0;
}
.showAlertBox{
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -ms-flex-align:center;
    align-items: center;
    animation:alertBoxIn .2s;
    -webkit-animation:alertBoxIn .2s;
    animation-timing-function:ease;
    -webkit-animation-timing-function:ease;
}
.hideAlertBox{
    display:none;
}
.alertBox .dialogBox .loadingL{
    width:50px;
    height:50px;
    margin:10px auto 20px auto;
}
.alertBox .warningMessage{
    color:#aa4749;
    display:block;
    margin-top:22px;
    max-height:92px;
    overflow:auto;
    padding:10px;
}
.alertBox .importTemplate{
    width:297px;
    height:109px;
    margin:5px;
}




/*************************************************
*  Action Sheet & Alert Box: Header Styles
*************************************************/
.actionSheet .dialogBox h1,
.alertBox .dialogBox h1{
    font-size:20px;
    padding:5px 10px;
    margin-top:0;
    /*text-shadow:0 1px 0px rgba(255,255,255,1);*/
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding: 10px;
    background: rgba(0,0,0,0.05);
    border-bottom: 1px solid #e4e5ed;
}
.actionSheet .dialogBox h1 strong,
.alertBox .dialogBox h1 strong{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:20px;
    display:block;
    max-width: 260px;
    margin: 0 auto;
}
.actionSheet .dialogBox h1>span,
.alertBox .dialogBox h1>span {
    font-weight: normal;
    display: inline-block;
    margin-top: 8px;
}
.alertBox .dialogBox h1 strong.noBottomGap{
    margin-bottom:5px;
}
.alertBox .dialogBox h1 strong.noBottomGap:last-child { margin-bottom:0; }
.actionSheet .dialogBox h1 a,
.alertBox .dialogBox h1 a{
    color:#53c8e6;
    text-decoration:underline;
    white-space:nowrap;
}
.actionSheet .dialogBox .dialogMessage h3{
    font-weight:bold;
    color:#000;
    padding: 10px 10px; background: rgba(0,0,0,0.1); letter-spacing: 0.03rem; font-size: 15px;
}
.actionSheet .dialogBox .dialogMessage h3:empty { display:none; }

.actionSheet .dialogBox h1 strong{
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.dontTruncateTitle.actionSheet .dialogBox h1 strong{
    white-space: normal !important;
}
.actionSheet .dialogBox h1 .formPadding,
.alertBox .dialogBox h1 .formPadding{
    padding:10px 0 0 0;
}
.actionSheet .dialogBox p,
.alertBox .dialogBox p{
    padding-left:10px;
    padding-right:10px;
}



/*************************************************
*  Action Sheet & Alert Box: Button Styles
*************************************************/
.actionSheet .dialogBox button,
.alertBox .dialogBox button,
.alertBox .dialogBox .attachFiles{
    width:100%;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:none;
    border:1px solid #e4e5ed;
    border-top:none;
    background:rgba(255,255,255,.5);
    box-shadow:0 1px 4px rgba(0,0,0,.1);
    text-shadow:0 1px 0px rgba(255,255,255,1);
    line-height: 44px;
    font-size: 16px;
    display: block;
    margin: 0;
    box-shadow: none;
    font-weight: 500;
    text-shadow: none;
}
.actionSheet .dialogBox button:active,
.alertBox .dialogBox button:active,
.alertBox .dialogBox .attachFiles:active{
    background:rgba(90,90,90,.25);
}
.actionSheet .dialogBox button.cancelBtn,
.alertBox .dialogBox button.cancelBtn{
    border-top:1px solid #e4e5ed !important;
    margin-top:15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border-top: 0;
    margin-top: 0;
    border-radius:0;
    background:transparent !important;
    color: #e86c6c;
    border-bottom:0;
    border-left:0;
    border-right:0;
}
.actionSheet .dialogBox button.hightLightButton{
    color: #e86c6c;
    border-top:1px solid #e4e5ed;
    margin-top:15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
     border-radius:0;
}
.actionSheet .dialogBox .dialogButtons button:first-of-type,
.alertBox .dialogBox .dialogButtons button:first-of-type{
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
    margin-top:10px;
    /*border-top:1px solid #e4e5ed;*/
    margin-top: 0;
    border-radius:0;
}
.actionSheet .dialogBox .dialogButtons button:nth-last-of-type(2),
.alertBox .dialogBox .dialogButtons button:nth-last-of-type(2){
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
    border-radius:0;
}
.actionSheet .dialogBox button.primaryBtn,
.alertBox .dialogBox button.primaryBtn,
.alertBox .dialogBox .dialogButtons li label.primaryBtn{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.actionSheet .dialogBox h1 button,
.alertBox .dialogBox h1 button,
.alertBox .dialogBox h1 .attachFiles{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:1px solid #d3d3d3;
    box-shadow:none;
    margin:10px 0 3px 0;
}
.actionSheet .dialogBox h1 button:active,
.alertBox .dialogBox h1 button:active,
.alertBox .dialogBox h1 .attachFiles:active{
    border:1px solid #a5a5a5;
}
.actionSheet .dialogBox h1 button:first-of-type,
.alertBox .dialogBox h1 button:first-of-type,
.alertBox .dialogBox h1 .attachFiles:first-of-type{
    margin-top:32px;
}
.alertBox .dialogBox .dialogButtons li label{
    display:block;
    cursor:pointer;
    color:#53c8e6;
    text-shadow:#fff 0px 1px 0px;
    height:46px;
}
.alertBox .dialogBox .dialogButtons li label:active{
    background:rgba(90,90,90,.25);
}
.alertBox .dialogBox .dialogButtons.fbSignInBtns li button{
    color:#39569c;
}
.alertBox .dialogBox .dialogButtons.fbSignInBtns li button.primaryBtn:before{
    content: "";
    width: 22px;
    height: 22px;
    display: inline-block;
    margin: -4px 6px 0 0;
    padding: 0;
    vertical-align: middle;
    border: none;
    background-position: -86px -963px;
    background-color: #39569c;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}



/*************************************************
*  Action Sheet & Alert Box: Button Groups
*************************************************/
.actionSheet .buttonGroup,
.headerButtonsGroup .buttonGroup,
.alertBox .buttonGroup{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:table;
    table-layout:fixed;
    list-style:none;
    padding:0;
    width:100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:none;
    border:1px solid #e4e5ed;
    background:rgba(255,255,255,.5);
    box-shadow:0 1px 4px rgba(0,0,0,.1);
    line-height:44px;
    font-size:20px;
    margin:10px 0 0 0;
}
.buttonGroup.buttonVerticalList li{
    display: table-row !important;
}
.buttonGroup.buttonVerticalList li button{
    border-bottom: 1px solid #e8e8e8;
}
.headerButtonsGroup .buttonGroup{
    border-top:1px solid rgba(0,0,0,.12);
}
.headerButtonsGroup .buttonGroup,
.alertBox .buttonGroup{
    -moz-border-radius-topleft:0;
    -webkit-border-radius-topleft:0;
    border-top-left-radius:0;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    border:none;
    /*border-top:1px solid #e4e5ed;*/
    border-top:1px solid #e4e5ed;
    background:none;
    box-shadow:none;
}
.actionSheet .buttonGroup li,
.headerButtonsGroup .buttonGroup li,
.alertBox .buttonGroup li{
    display:table-cell;
    border-right:1px solid rgba(0,0,0,.1);
    vertical-align:top;
}
.actionSheet .buttonGroup li:last-of-type,
.headerButtonsGroup .buttonGroup li:last-of-type,
.alertBox .buttonGroup li:last-of-type{
    border-right:none;
}
.actionSheet .dialogBox .dialogButtons .buttonGroup button:first-of-type,
.headerButtonsGroup .buttonGroup button:first-of-type,
.alertBox .dialogBox .dialogButtons .buttonGroup button:first-of-type{
    border-top:none;
    margin-top:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.actionSheet .buttonGroup button,
.headerButtonsGroup .buttonGroup button,
.alertBox .buttonGroup button{
    margin:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:none;
    background:transparent;
    box-shadow:none;
    line-height:44px;
    white-space:nowrap;
}
.alertBox .buttonGroup button{
    color:#53c8e6;
}
.alertBoxAwards .buttonGroup button{
    color:#9d9d9d;
    font-size: 17px !important;
    font-weight: bold;
}
.actionSheet .buttonGroup button:active,
.headerButtonsGroup .buttonGroup button:active,
.alertBox .buttonGroup button:active{
    background:rgba(90,90,90,.25);
}
.alertBox .dialogBox .dialogButtons .buttonGroup button:active,
.headerButtonsGroup .buttonGroup button:active{
    border-top:1px solid transparent;
}
.headerButtonsGroup{
    border-bottom: 1px solid #e4e5ed !important;
}
.alertBox .dialogBox .dialogButtons .buttonGroup .attachFiles{
    border:none;
    background:transparent;
    box-shadow:none;
}
.actionSheet .groupActions button,
.alertBox .groupActions button{
    font-size:13px;
    line-height:1;
    padding:43px 0 7px 0;
    position:relative;
}
.actionSheet .groupActions button:before,
.alertBox .groupActions button:before{
    content:"";
    position:absolute;
    display:block;
    width:48px;
    height:48px;
    top:0px;
    left:50%;
    margin-left:-24px;
}
.actionSheet .groupActions button.post:before,
.alertBox .groupActions button.post:before{
    background-position:-71px -296px;
}
.actionSheet .groupActions button.event:before,
.alertBox .groupActions button.event:before{
    background-position:-135px -296px;
}
.actionSheet .groupActions button.message:before,
.alertBox .groupActions button.message:before{
    background-position:-263px -296px;
}
.actionSheet .groupActions button.people:before,
.alertBox .groupActions button.people:before{
    background-position:-327px -296px;
}
.actionSheet .groupActions button.group:before,
.alertBox .groupActions button.group:before{
    background-position:-391px -296px;
}



/*************************************************
*  Popover
*************************************************/
.popover{
    width:100%;
    height:100%;
    position:fixed;
    display:none;
    top:0;
    left:0;
}
.popover>div{
    display:table-cell;
    vertical-align:middle;
    width:100%;
    padding:74px 24px;
}
.popover>a{
    position:fixed;
}
.popover .dialogBox{
    width:100%;
    height:100%;
    max-width:270px;
    max-height:420px;
    margin:0 auto;
    background:#fff;
    position:relative;
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
    border-radius:8px;
    box-shadow:0 4px 20px rgba(0,0,0,.7);
    z-index:2;
}
.popover.animateIn{
    background-color:rgba(0,0,0,.4);
    display:table;
}
.desktop .popover.animateIn,
.iPhone .popover.animateIn,
.iPad .popover.animateIn{
    -webkit-animation:FadeIn .3s;
    animation:FadeIn .3s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.popover.animateIn .dialogBox{
    -webkit-animation:bounceInDown .6s;
    animation:bounceInDown .6s;
    -webkit-animation-delay:.3s;
    animation-delay:.3s;
    -webkit-animation-fill-mode:backwards;
    -moz-animation-fill-mode:backwards;
    -ms-animation-fill-mode:backwards;
    -o-animation-fill-mode:backwards;
    animation-fill-mode:backwards;
}
.popover .dialogBox .dialogMessage{
    display:table;
    height:100%;
    width:100%;
    -webkit-border-radius:0 0 8px 8px;
    -moz-border-radius:0 0 8px 8px;
    border-radius:0 0 8px 8px;
    overflow:hidden;
}
.popover .dialogBox .dialogHeader{
    display:table-row;
}
.popover .dialogBox .dialogHeader h1{
    display:table-cell;
    height:1px;
    vertical-align:middle;
    text-align:center;
    text-shadow:none;
    padding:16px;
    color:#000;
    font:19px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height:24px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-border-radius:8px 8px 0 0;
    -moz-border-radius:8px 8px 0 0;
    border-radius:8px 8px 0 0;
}
.popover .dialogBox .dialogBody{
    display:table-row;
}
.popover .dialogBox .dialogBody>div{
    display:table-cell;
    padding:20px 20px 0 20px;
    line-height:1.5;
}
.popover .dialogBox .dialogBody>div h1{
    padding-top:0;
    font:1.2em 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.popover .dialogBox .dialogBody>div ul{
    padding-left:20px;
}
.popover .dialogBox .dialogBody>div.videoWrapper{
    vertical-align:middle;
    background:#000;
}
.popover .dialogBox .dialogBody>div.videoWrapper img{
    height:254px;
    display:block;
    margin:0 auto;
    cursor:pointer;
}
.popover .dialogBox .dialogBody>div.videoWrapper .videoPlayer video{
    max-width: 237px;
    max-height:420px;
    display:block;
    margin:2px auto;
}
.popover .dialogBox .dialogButtons{
    display:table-row;
}
.popover .dialogBox .dialogButtons{
    display:table-cell;
    height:1px;
    padding:16px;
}
.popover .dialogBox .dialogButtons button{
    width:100%;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:18px;
    color:#000;
    border:1px solid;
    border-color:#d3d3d3;
    background:#e8e8e8;
    padding:0 12px;
    line-height:40px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.popover .dialogBox .dialogButtons button.primaryBtn{
    color:#fff;
    border-color:#2fc6fa #2fc6fa #27AAD7 #2fc6fa;
    background:#2fc6fa;
}
.popover .dialogBox button.cancelBtn{
    text-indent:-9999px;
    width:30px;
    height:30px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    position:absolute;
    right:-20px;
    top:-15px;
    padding:0;
    background:#000;
    border:0;
}
.popover .dialogBox button.cancelBtn:before, .popover .dialogBox button.cancelBtn:after{
    content:"";
    height: 14px;
    width: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
.popover .dialogBox button.cancelBtn:before {
    transform:rotate(45deg);
}
.popover .dialogBox button.cancelBtn:after{
    transform:rotate(-45deg);
}
.popover .softDismiss{
    width:100%;
    height:100%;
    left:0;
    top:0;
    position:absolute;
    display:block;
    z-index:1;
    text-indent:-9999px;
}
.popover .dialogBox.ptConf .dialogHeader h1{
    background-color:#dc392f;
    color:#fff;
}
.popover .dialogBox.posts .dialogHeader h1{
    background-color:#60b517;
    color:#fff;
}
.popover .dialogBox.volunteers .dialogHeader h1{
    background-color:#fd82ab;
    color:#fff;
}
.popover .dialogBox.general .dialogHeader h1,
.popover .dialogBox.demoClass .dialogHeader h1{
    background-color:#53c8e6;
    color:#fff;
}
.popover .dialogBox.profilePhoto .dialogHeader h1{
    color:#000;
    border-bottom:1px solid #c3c3c3;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f5f5f5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5));
    background: -webkit-linear-gradient(top, #ffffff 0%,#f5f5f5 100%);
    background: -o-linear-gradient(top, #ffffff 0%,#f5f5f5 100%);
    background: -ms-linear-gradient(top, #ffffff 0%,#f5f5f5 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f5f5f5 100%);
    height:48px;
}
.popover .dialogBox.profilePhoto .addPhoto{
    padding:0;
}
.popover .dialogBox.profilePhoto .addPhoto .emptyPanelMsg img{
    width:100px;
    height:100px;
}
.popover .dialogBox.profilePhoto .addPhoto section.formLayout section.emptyPanelMsg{
    margin:0;
}






/*************************************************
*  Inline Tool Tip
*************************************************/
.inlineToolTip,
.formLayout section.inlineToolTip{
    background:#fdf8e4;
    color:#555;
    padding-top:20px !important;
    padding-bottom:5px !important;
    padding-left:5px;
    padding-right:5px;
    border-bottom:1px solid #e4e5ed !important;
    margin-bottom:1px;
}
.inlineToolTip .dismissInlineToolTip,
.toolTipMsg .dismissInlineToolTip,
.formLayout section.inlineToolTip .dismissInlineToolTip{
    text-indent:-9999px;
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    top:0px;
    right:0px;
}
.inlineToolTip .dismissInlineToolTip:after,
.toolTipMsg .dismissInlineToolTip:after,
.formLayout section.inlineToolTip .dismissInlineToolTip:after{
    content:"x";
    color:#d1c69b;
    position:absolute;
    width:24px;
    height:24px;
    line-height:24px;
    text-align:center;
    text-indent:0;
    top:0;
    left:0;
}
.inlineToolTip h2,
.formLayout section.inlineToolTip h2{
    margin:0;
}
.inlineToolTip p,
.formLayout section.inlineToolTip p{
    font-size:13px;
    margin:0 0 15px 0;
    padding-left:10px;
    line-height : 20px;
}
#signUpScreen .inlineToolTip p {
    text-align: center;
    font-size: 15px;
}
.inlineToolTip em,
.formLayout section.inlineToolTip em{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-style:normal;
    font-weight:normal;
}
.inlineToolTip em.underline,
.formLayout section.inlineToolTip em.underline{
    text-decoration:underline;
}
.inlineToolTip em.orange,
.formLayout section.inlineToolTip em.orange{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#e77e02;
}
.inlineToolTip li,
.formLayout section.inlineToolTip li{
    margin-bottom:15px;
    font-size:13px;
}
.inlineToolTip a,
.formLayout section.inlineToolTip a{
    color:#1ca0c8;
}
#importClassMessenger .inlineToolTip ul,
#importClassMessenger .formLayout section.inlineToolTip ul{
    margin-top:-12px;
    margin-bottom:-8px;
}
#importClassMessenger .inlineToolTip li,
#importClassMessenger .formLayout section.inlineToolTip li{
    margin-bottom: 0;
    line-height: 20px;
    text-indent: 0;
}
.inlineToolTip .success,
.formLayout section.inlineToolTip .success{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#4db600;
    display:block;
    margin-bottom:1px;
    padding-left:30px;
}
.inlineToolTip .success:before,
.formLayout section.inlineToolTip .success:before{
    content:"";
    width:20px;
    height:20px;
    display:block;
    position:absolute;
    margin-left:-20px;
    margin-top:-3px;
    background-position:-405px -907px;
}
.inlineToolTip .success ~ p,
.formLayout section.inlineToolTip .success ~ p{
    padding-left:30px;
}
.inlineToolTip button,
.formLayout section.inlineToolTip button{
    margin:0 10px;
    float:right;
    font-size:14px;
    line-height:26px;
    height:30px;
    background:#fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:1px solid;
    border-color:#e4e5ed #e4e5ed #b5b5b5 #e4e5ed;
    background: #53c8e6;
    padding: 0 18px;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    border-radius: 50px;
    border: 0;
    color:#fff;
}
.inlineToolTip button ~ p,
.formLayout section.inlineToolTip button ~ p{
    overflow:hidden;
}
.postsTab .inlineToolTip,
.calendarTab .inlineToolTip{
    margin-top: -10px !important;
}
.postsTab .inlineToolTip.recommendBloomzTip{
    margin-top:0 !important;
    margin-left:-2px !important;
    padding-right: 268px;
}
.hideSidePanel .postsTab .inlineToolTip.recommendBloomzTip{
    margin-left:0px !important;
    padding-right: 10px;
}
.postsTab .inlineToolTip,
.calendarTab .inlineToolTip,
.orgCalendarPage .inlineToolTip,
.communityPage .inlineToolTip,
#communityMembersView .inlineToolTip{
    padding:20px 10px 5px 10px;
    width:100%;
    /*margin-left:-10px !important;*/
    position:relative;
    border-bottom:1px solid #ded7c1;
}

#communityMembersView .membersContainer{
    margin-top:15px;
}
.orgCalendarPage .inlineToolTip{
    margin-top:1px;
}
.actionBar .inlineToolTip{
    position: absolute;
    padding: 10px !important;
    line-height: 1 !important;
    left: 0;
    margin-top: 0px;
    width: 100%;
}
.actionBar .inlineToolTip p{
    margin-bottom:0;
}
.actionBar .inlineToolTip ~ .actionButtons .recipientsListLabel:after{
    display:none;
}
.postCreateNew .inlineToolTip,
.postCreateNew .formLayout section.inlineToolTip{
    margin-bottom:-1px;
}



/*************************************************
*  Entry Options: i.e. delete, rename, edit
*************************************************/
.entryOptions{
    content:"";
    position:absolute;
    display:block;
    width:44px;
    height:44px;
    right:0;
    top:0;
    text-indent:-9999px;
    overflow:hidden;
    cursor:pointer;
    z-index:9999 !important;
}
.ie .entryOptions{
    z-index:9999 !important;
}
.entryOptions:before{
    content:"" !important;
    display:block !important;
    width:44px !important;
    height:44px !important;
    background-position:-263px -1140px !important;
    /*opacity:.30 !important;
    filter:alpha(opacity=30) !important;
    transform: scale(1.3);*/
    /*background-position:0 0 !important;*/
}
.entryOptions:hover:before{
    opacity:1 !important;
    filter:alpha(opacity=100) !important;
}
.circleMembers .entryOptions{
    margin:-15px -10px 0 0;
}



/*************************************************
*  Verified Parent Badge
*************************************************/
.verifiedParentBadge{
    width:30px;
    height:30px;
    position:absolute;
    top:-10px;
    right:-20px;
    overflow:hidden;
    z-index:1;
    text-indent:0;
    display: none !important;
}
.verifiedParentBadge img{
    width:30px;
    height:30px;
    z-index:1;
    position:relative;
    background-position:-333px -906px;
    border:none;
}
.verifiedParentBadge:after{
    content:"";
    position:absolute;
    width:0;
    height:0;
    top:0px;
    right:-26px;
    border:26px solid;
    border-color:#a6e0d9 transparent transparent transparent;
}



/*************************************************
*  Verified Parent Badge: For search results
*************************************************/
.contentBloomz .verifiedParentBadge{
    top:-13px;
    right:-15px;
}



/*************************************************
*  Verified Parent Badge: For profile page
*************************************************/
.userProfileInfo .verifiedParentBadge{
    top:0;
    right:0;
}



/*************************************************
*  Verified Parent Explanation Page
*************************************************/
.shadowBox .subPage.circleMembers.verifiedExplanation,
.inlineBox .subPage.circleMembers.verifiedExplanation{
    padding-top:64px;
}
.verifiedExplanation.circleMembers .peopleListing{
    padding:15px;
}
.verifiedExplanation.circleMembers .peopleListing .formLayout{
    box-shadow:0px 1px 2px rgba(0, 0, 0, .05);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow:hidden;
}
.verifiedExplanation.circleMembers .peopleListing .formLayout .hgroup{
    min-height:82px;
}
.verifiedExplanation .verifiedBy{
    padding:0 10px;
    width:100%;
    margin:10px 0 0 -10px;
    overflow:auto;
    border-top:1px solid #f2f2f2;
}
.verifiedExplanation .verifiedBy h2{
    margin-top:11px;
    text-indent:5px;
    font-size:19px;
    line-height:1.25;
}
.verifiedExplanation .verifiedBy ul{
    margin:0 0 11px 0;
    padding:0;
    text-decoration:none;
}
.verifiedExplanation .verifiedBy li{
    line-height:1.25;
    text-indent:7px;
    font-size:15px;
}
.verifiedExplanation .verifiedBy li:before{
    content:"";
    width:12px;
    height:12px;
    display:inline-block;
    margin-right:5px;
    background-position:-410px -911px;
}
.verifiedExplanation .explanatoryText{
    padding:20px 10px 10px 10px;
}
.verifiedExplanation .explanatoryText h2{
    font-size:19px;
    line-height:1.25;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif
}
.verifiedExplanation .explanatoryText p{
    font-size:15px;
    line-height:1.25;
    margin:0;
}





/*************************************************
*  Content Area
*************************************************/
.contentWrapper{
    overflow-x:hidden;
}
.contentArea{
    padding:10px 10px 10px 10px;
    background-color:#edeef3;
    /*background-color:#f2f2f2;*/
    /*overflow-x:hidden;*/
}
.contentArea section{
    margin-bottom:11px;
}
.contentArea .formLayout section{
    margin-bottom:0;
}




/*************************************************
*  Main Navigation
*************************************************/
.mainNavBar{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    height:49px;
    min-height:49px;
    width:100%;
    display:block;
    position:absolute;
    left:0;
    top:0;
    text-align:left;
    border-bottom:1px solid #c3c3c3;
    background:#ffffff; /* Old browsers */
    background:-moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%); /* FF3.6+ */
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */
    background:-webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */
    background:-o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%); /* Opera 11.10+ */
    background:-ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%); /* IE10+ */
    background:linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%); /* W3C */
    padding-left:75px;
    font-family: gotham;
}
.iPhone .mainNavBar,
.iPad .mainNavBar{
    -webkit-transform: translate3d(0,0,0);
}
.mainNavBar ul{
    padding:0;
    margin:0;
    display:table;
    width:100%;
    text-align:center;
}
.mainNavBar ul:before{
    content:"";
    width:16px;
    height:1px;
    position:absolute;
    left:0;
    top:48px;
    background: -moz-linear-gradient(left,  rgba(232,232,232,1) 0%, rgba(232,232,232,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(232,232,232,1)), color-stop(100%,rgba(232,232,232,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%); /* W3C */
}
.mainNavBar ul:after{
    content:"";
    width:16px;
    height:1px;
    position:absolute;
    right:0px;
    top:48px;
    background: -moz-linear-gradient(left,  rgba(232,232,232,0) 0%, rgba(232,232,232,1) 99%, rgba(232,232,232,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(232,232,232,0)), color-stop(99%,rgba(232,232,232,1)), color-stop(100%,rgba(232,232,232,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(232,232,232,0) 0%,rgba(232,232,232,1) 99%,rgba(232,232,232,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(232,232,232,0) 0%,rgba(232,232,232,1) 99%,rgba(232,232,232,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(232,232,232,0) 0%,rgba(232,232,232,1) 99%,rgba(232,232,232,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(232,232,232,0) 0%,rgba(232,232,232,1) 99%,rgba(232,232,232,1) 100%); /* W3C */
}
.mainNavBar li{
    margin:0 1px 0 0;
    list-style:none;
    display:table-cell;
    position:relative;
}
.mainNavBar a{
    display:inline-block;
    margin-top:5px;
    width:43px;
    height:38px;
    text-indent:-9999px;
    color:#000;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    position:relative;
}
.mainNavBar .moreNavOpt,
.mainNavBar .moreOpt{
    display:none;
}
div.recommendIcon{
    display:none;
}


@media screen
and (max-width:767px){
    .iPhone .mainNavBar a,
    .iPhone .orgNav a{
        background:none !important;
    }
    .mainNavBar .showMoreOpt .moreNavOpt{
        display:block;
        position:absolute;
        background-color:#373842;
        right:0;
        width:100%;
        text-align:left;
        text-indent:0;
        white-space:nowrap;
        line-height:50px;
        border-top:1px solid #464852;
        border-bottom:1px solid #272934;
        box-sizing:border-box;
        text-shadow:none;
        z-index:2;
    }
    .mainNavBar .showMoreOpt .moreNavOpt a{
        text-indent:0;
        text-align:center;
        color:#b3b3b3;
        background:none;
        width:100%;
        line-height:50px;
        height:51px;
        margin:0;
        font-size:20px;
        -moz-border-radius:0;
        -webkit-border-radius:0;
        border-radius:0;
    }
    .mainNavBar .showMoreOpt .invitePeople.moreNavOpt{
        display:none;
    }
    .mainNavBar .showMoreOpt .hideMenu.moreNavOpt{
        background: rgba(0,0,0,.4);
        text-indent: -9999px;
        border: none;
        margin-top: 49px;
        height: 1000px;
        z-index:1;

    }
    .mainNavBar .showMoreOpt .moreNavOpt.selected a{
        background-color:#22232c;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(6){
        margin-top:49px;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(7){
        margin-top:102px;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(8){
        margin-top:155px;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(9){
        margin-top:208px;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(10){
        margin-top:261px;
    }
    .mainNavBar .showMoreOpt li:nth-of-type(11){
        margin-top:314px;
    }
    .mainPanelBehavior article footer li::before{
        content:attr(data-short) !important;
    }
    .postDataDetails li{
       width: 90vw !important;
    }
}
.mainNavBar ul.navFilters{
    display:none;
    height:auto;
}
.mainNavBar .badge{
    text-align:center;
    text-indent:0;
    min-width:12px;
    display:block;
    height:18px;
    padding:0 3px;
    color:#fff;
    position:absolute;
    top:2px;
    right:2px;
    font-size:12px;
    line-height:20px;
    text-shadow:none;
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    border-radius:9px;
    box-shadow:inset 0px -1px 0px rgba(0,0,0,.1);
    background:#ff0204;
}
.mainNavBar .profile{
    border-top:1px solid #272a33;
    display:none;
}
.mainNavBar .profile a{
    border-top:1px solid #454850;
    background:none;
    position:relative;
    overflow:hidden;
    margin-bottom:1px;
}
.mainNavBar .profile .profileS{
    margin:6px 8px;
    text-indent:0;
}
.mainNavBar .home a,
.orgNav .home a{
    background-position:-10px -67px;
}
.mainNavBar .calendar a,
.orgNav .calendar a{
    background-position:-75px -67px;
}
.mainNavBar .info a,
.orgNav .info a{
    background-position:-584px -542px;
}
.mainNavBar .chat a,
.orgNav .chat a{
    background-position:-139px -67px;
}
.mainNavBar .photos a,
.orgNav .photos a{
    background-position:-585px -242px;
}
.mainNavBar .volunteer a,
.orgNav .volunteer a{
    background-position:-1352px -242px;
}
.mainNavBar .circles a,
.orgNav .circles a{
    background-position:-202px -67px;
}
.mainNavBar .profile a,
.orgNav .profile a{
    background-position:-267px -67px;
    display:none;
}
.mainNavBar .account a,
.orgNav .account a{
    background-position:-331px -67px;
}
.mainNavBar .feedback a,
.orgNav .feedback a{
    background-position:-395px -67px;
}
.mainNavBar .search a,
.orgNav .search a{
    background-position:-460px -67px;
}
.mainNavBar .signout a,
.orgNav .signout a{
    background-position:-584px -67px;
}
.mainNavBar .more a,
.orgNav .more a{
    background-position:-520px -67px;
}
.mainNavBar .invitePeople a,
.orgNav .invitePeople a{
    background-position:-647px -67px;
}
.mainNavBar .invitePeople a:before,
.orgNav .invitePeople a:before{
    opacity:1;
    filter:alpha(opacity=100);
}
.mainNavBar .recommend a:before,
.orgNav .recommend a:before{
    opacity:1;
    filter:alpha(opacity=100);
}
.mainNavBar .selected.home a,
#orgHome :not(.showMenu) .orgNav .selected.home a{
    background-position:-10px -122px;
}
.mainNavBar .selected.calendar a,
#orgHome :not(.showMenu) .orgNav .selected.calendar a{
    background-position:-75px -122px;
}
.mainNavBar .selected.info a,
#orgHome :not(.showMenu) .orgNav .selected.info a{
    background-position:-584px -602px;
}
.mainNavBar .selected.chat a,
#orgHome :not(.showMenu) .orgNav .selected.chat a{
    background-position:-139px -122px;
}
.mainNavBar .selected.circles a,
#orgHome :not(.showMenu) .orgNav .selected.circles a{
    background-position:-202px -122px;
}
.mainNavBar .selected.photos a,
#orgHome :not(.showMenu) .orgNav .selected.photos a{
    background-position:-712px -122px;
}
.mainNavBar .selected.volunteer a,
#orgHome :not(.showMenu) .orgNav .selected.volunteer a{
    background-position:-1352px -297px;
}
.mainNavBar .selected.profile a,
#orgHome :not(.showMenu) .orgNav .selected.profile a{
    background-position:-267px -122px;
    display:none;
}
.mainNavBar .selected.account a,
#orgHome :not(.showMenu) .orgNav .selected.account a{
    background-position:-331px -122px;
}
.mainNavBar .selected.feedback a,
#orgHome :not(.showMenu) .orgNav .selected.feedback a{
    background-position:-395px -122px;
}
.mainNavBar .selected.search a,
#orgHome :not(.showMenu) .orgNav .selected.search a{
    background-position:-460px -122px;
}
.mainNavBar .selected.signout a,
#orgHome :not(.showMenu) .orgNav .selected.signout a{
    background-position:-584px -122px;
}
.mainNavBar .selected.more a,
#orgHome :not(.showMenu) .orgNav .selected.more a{
    background-position:-520px -67px;
}
.mainNavBar .selected.invitePeople a,
#orgHome :not(.showMenu) .orgNav .selected.invitePeople a{
    background-position:-584px -122px;
}
.mainNavBar .bloomzLogo{
    position: absolute;
    width: 165px;
    top: 0;
    height: 64px;
    text-indent: -9999px;
    cursor:pointer;
}
.mainNavBar .bloomzLogo:active{
    background:transparent;
}



/*************************************************
*  Main Navigation SVG
*************************************************/
.mainNavBar a svg,
.orgNav a svg{
    position:absolute;
    top:0;
    left:50%;
    width:32px;
    height:32px;
    margin-left:-16px;
    margin-top:2px;
    display:block;
    margin-left:0;
    left:0;
}
.mainNavBar li a svg.selectedIcon,
.mainNavBar li.selected a svg,
.orgNav li a svg.selectedIcon,
.orgNav li.selected a svg{
    display:none;
}
.mainNavBar li.selected a svg.selectedIcon,
.orgNav li.selected a svg.selectedIcon{
    display:block;
}




/*************************************************
*  Sub Panel (Nav Drawer)
*************************************************/
.subPanel{
    background:#f2f2f2;
    width:100%;
    height:100%;
    position:absolute;
    -webkit-transform: translate3d(0,0,0);
}




/****************************************************
*  Meta Navigation (Account settings, profile, help)
****************************************************/
.metaNav{
    top:20px;
    right:0;
    width:100%;
    text-align:center;
    position:fixed;
    white-space:nowrap;
}
.metaNav .metaNavWrapper{
    width:100%;
    margin:0 auto;
    max-width:1068px;
    padding:0 8px;
    text-align:right;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.metaNav a{
    margin-left:12px;
    color:#fff;
    font-size:15px;
    font-family:'focoitalic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-shadow:none;
    text-decoration:underline;
}
.metaNav span{
    color:#fff;
    font-size:15px;
    font-family:'focoitalic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-shadow:none;
}
.metaNav .profilePhoto img{
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    vertical-align:middle;
    width:40px;
    height:40px;
}



/*************************************************
*  Navigation Drawer
*************************************************/
.navDrawer{
    height:100%;
}
.subNavBar{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    height:100%;
    display:block;
    position:relative;
    overflow:hidden !important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:72px;
}
.subNavBar .scrollableNav{
    overflow:hidden;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    width:100%;
    height:100%;
    position:relative;
}
.subNavBar .scrollableNav::-webkit-scrollbar{
    width: 10px;  /* for vertical scrollbars */
}
.subNavBar .scrollableNav::-webkit-scrollbar-track{
    background:rgba(255,255,255,.1);
}
.subNavBar .scrollableNav::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.25);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.subNavBar .scrollableNav::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}





.WindowsPhone .subNavBar{
    width:246px;
}
.navDrawer .subNavBar ul{
    padding:0;
    margin:0;
}
.navDrawer .subNavBar li{
    list-style:none;
    border-top:1px solid transparent;
    padding:0;
    margin:0;
}
.navDrawer .subNavBar li>a{
    line-height:34px;
    color:#b3b3b3;
    font-size:19px;
    text-shadow:none;
    text-indent:50px;
    display:block;
    border-top:1px solid #363842;
}
.navDrawer .subNavBar li.selected>a{
    background-color:#22232a;
    border-top:1px solid #000;
}
.navDrawer .subNavBar li.username{
    margin-top:20px;
}
.navDrawer .subNavBar li.username:active{
    background:none;
    border-top:1px solid transparent;
}
.navDrawer .subNavBar li.username .profileS{
    display:inline-block;
    text-indent:0;
    position:absolute;
    width:64px;
    height:64px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    top:50px;
    left:50%;
    margin-left:-32px;
    border:none;
    box-shadow:0 2px 5px rgba(0,0,0,.1);
}
.navDrawer .username .profileS img{
    width:64px;
    height:65px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
.navDrawer .subNavBar ul.navFilters{
    border:none;
}
.navDrawer .subNavBar ul.navFilters>li>span,
.navDrawer .subNavBar ul.navFilters>li>span:active{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size: 12px;
    color:#616161;
    text-indent:17px;
    background:none;
    text-transform: uppercase;
    margin-top: 1px;
    margin-bottom: 2px;
}
.navDrawer .subNavBar ul.trayActions{
    display:table;
    table-layout:fixed;
    width:100%;
    margin-top:123px;
    margin-bottom:16px;
    border-bottom:1px solid #23242f;
    box-shadow:0 1px 0 #4b4d57;
}
.navDrawer .subNavBar .trayActions li{
    display:table-cell;
    position:relative;
    padding:0 3px;
}
.navDrawer .subNavBar ul.navFilters ul li a:before{
    left:40px;
    margin-top:-2px;
}
.navDrawer .subNavBar .trayActions li>a{
    font-size: 10px;
    text-align: center;
    text-indent:0;
    border-top:1px solid transparent;
    line-height:74px;
    height:50px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.navDrawer .subNavBar .trayActions li.username{
    width:1px;
    padding:0;
}
.navDrawer .subNavBar .trayActions li.username a{
    width:233px;
    height:120px;
    position:absolute;
    top:0;
    margin:-124px 0 0 10px;
    font-size:24px;
    color:#fff;
    line-height:49px;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    text-indent:0;
    text-align:center;
    font-family:'focoitalic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.navDrawer .subNavBar li.username a:before{
    display:none;
}
.notScrolling .navDrawer .subNavBar li.username a.highlightableRow:active{
    background-color:transparent;
    border-top:1px solid transparent;
}
.navDrawer .subNavBar .trayActions li.username a.verifiedUser{
    width:20px;
    height:20px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    border:2px solid #fff;
    background-color:#a4e0d9;
    background-position:-468px -906px;
    display:block;
    position:absolute;
    left:133px;
    top:50px;
    text-indent:-9999px;
}
.navDrawer .subNavBar li a:before{
    content:"";
    display:block;
    height:33px;
    width:44px;
    position:absolute;
    left:50%;
    margin-left:-22px;
    opacity:.5;
    filter:alpha(opacity=50);
}
.navDrawer .subNavBar>ul:not(.navFilters){
    padding-bottom:19px;
}
.navDrawer .subNavBar li.home a:before{
    background-position:-10px -180px;
}
.navDrawer .subNavBar li.calendar a:before{
    background-position:-75px -180px;
}
.navDrawer .subNavBar li.chat a:before{
    background-position:-139px -180px;
}
.navDrawer .subNavBar li.circles a:before{
    background-position:-202px -180px;
}
.navDrawer .subNavBar li.profile a:before{
    background-position:-267px -180px;
}
.navDrawer .subNavBar li.account a:before{
    background-position:-584px -422px;
}
.navDrawer .subNavBar li.feedback a:before{
    background-position:-647px -422px;
}
.navDrawer .subNavBar li.search a:before{
    background-position:-460px -180px;
}
.navDrawer .subNavBar li.invitePeople a:before{
    background-position:-584px -482px;
}
.navDrawer .subNavBar li.recommend a:before{
    background-position:-647px -482px;
}
.navDrawer .subNavBar .trayActions li a:before{
    opacity:1;
    filter:alpha(opacity=100);
}
.navDrawer .subNavBar .badge{
    text-indent:0;
    min-width:15px;
    display:block;
    height:15px;
    background:#51c1e4;
    color:#fff;
    position:absolute;
    font-size:15px;
    line-height:18px;
    text-shadow:none;
    left:225px;
    text-align:center;
    padding:3px;
    margin-top:-28px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    box-shadow: -2px 2px 0px rgba(0,0,0,.3);
}



/*************************************************
*  Navigation Drawer: Nav Filters
*************************************************/
.navDrawer ul.navFilters,
.mainNavBar ul.navFilters{
    margin:0 0 -1px 0;
    padding-top:0;
    position:relative;
    border-top:1px solid transparent;
    overflow:hidden;
}
.navDrawer ul.navFilters:last-of-type,
.mainNavBar ul.navFilters:last-of-type{
    margin-bottom:6px;
}
.navDrawer ul.navFilters>li,
.mainNavBar ul.navFilters>li{
    border-top:0px;
}
.navDrawer ul.navFilters>li:active,
.mainNavBar ul.navFilters>li:active{
    background:transparent;
    border-top:0;
}
.navDrawer ul.navFilters ul,
.mainNavBar ul.navFilters ul{
    padding-top:0;
    margin-top:4px;
    margin-bottom:28px;
}
.navDrawer ul.navFilters>li>span,
.navDrawer ul li>span.separator,
.mainNavBar ul.navFilters>li>span,
.mainNavBar ul li>span.separator{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#616161;
    font-size:12px;
    text-shadow:none;
    line-height:32px;
    height:36px;
    display:block;
    text-indent:13px;
    white-space:nowrap;
    font-weight:500;
    border-top:1px solid transparent;
    border-bottom:1px solid transparent;
}
.navDrawer ul.navFilters>li>span,
.navDrawer ul>li>span.separator,
.mainNavBar ul.navFilters>li>span,
.mainNavBar ul>li>span.separator{
    text-indent:17px;
}
.navDrawer ul.navFilters>li>span:active,
.navDrawer ul>li>span.separator:active,
.mainNavBar ul.navFilters>li>span:active,
.mainNavBar ul>li>span.separator:active{
    background:none !important;
    border-top:1px solid transparent !important;
}
.navDrawer ul>li>span.separator{
    margin-top:-4px;
}
.mainNavBar ul>li>span.separator{
    margin-top:-12px;
}
.navDrawer ul.separateMenuItems li:last-of-type{
    margin:0;
}
.navDrawer ul.separateMenuItems li:nth-child(2){
    margin:10px 0 0 0;
}
.navDrawer ul.navFilters:last-of-type:after,
.mainNavBar ul.navFilters:last-of-type:after{
    content:"";
    width:100%;
    height:1px;
    display:block;
    border-top:1px solid #282a33;
    background:#464850;
    position:absolute;
    bottom:-8px;
    top:auto;
}
.navDrawer ul.navFilters ul li a,
.mainNavBar ul.navFilters ul li a{
    font-size:14px;
    line-height:32px;
    height:31px;
    text-indent:58px;
    display:block;
    width:100%;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    white-space:nowrap;
    color:#212121;
    text-shadow:none;
    marign-top:0;
    margin-bottom:0;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-right: 10px;
    box-sizing: border-box;
}
.mainNavBar ul.navFilters ul li a{
    text-indent:58px;
    line-height:32px;
    height:31px;
}
.navDrawer ul.navFilters ul li a:before,
.mainNavBar ul.navFilters ul li a:before{
    height:33px;
    width:44px;
    left:4px;
    margin-top:0;
}
.mainNavBar ul.navFilters ul li a:before{
    left:17px;
    top:-2px;
}
.mainNavBar ul.navFilters ul li:last-child span:last-of-type{
    margin-bottom:8px;
}
.mainNavBar ul.navFilters ul li a.moreTags{
    border-top:1px solid transparent;
    margin-bottom:31px;
}
.navDrawer ul a.moreTags:before,
.mainNavBar ul a.moreTags:before{
    background-position:-204px -1204px;
}
.navDrawer ul.navFilters .moreNavOpt,
.mainNavBar ul.navFilters .moreNavOpt{
    display:none;
}
.navDrawer ul.navFilters .showMore .moreNavOpt,
.navDrawer ul.navFilters.showMore .moreNavOpt,
.mainNavBar ul.navFilters .showMore .moreNavOpt,
.mainNavBar ul.navFilters.showMore .moreNavOpt{
    display:block;
}
.navDrawer ul.navFilters .showMore a.moreTags,
.navDrawer ul.navFilters.showMore a.moreTags,
.mainNavBar ul.navFilters .showMore a.moreTags,
.mainNavBar ul.navFilters.showMore a.moreTags{
    margin-top:0;
}
.mainNavBar ul.separateMenuItems{
    padding-top:0;
    position:relative;
    margin:11px 0 -4px 0;
    display:none;
}
.navDrawer ul.separateMenuItems{
    padding-top:0;
    position:relative;
    margin:0px 0 -4px 0;
    display:table;
    width:100%;
}
.navDrawer ul.navFilters li ul li{
    height: 31px;
}
.navDrawer ul.navFilters li span.selected,
.navDrawer ul.navFilters li span:active,
.navDrawer ul.navFilters li>a.selected,
.navDrawer ul.navFilters li>a:active,
.mainNavBar ul.navFilters li span.selected,
.mainNavBar ul.navFilters li span:active,
.mainNavBar ul.navFilters li>a.selected,
.mainNavBar ul.navFilters li>a:active{
    background-color:#e4e5ed;
}
.mainNavBar ul.navFilters li.selected,
.mainNavBar ul.navFilters li.active,
.navDrawer ul.navFilters li.selected,
.navDrawer ul.navFilters li.active{
    /*background-color:#22232a !important;*/
    background-color:#e4e5ed !important;
}
.navDrawer ul.navFilters li.selected,
.navDrawer ul.navFilters li:active,
.mainNavBar ul.navFilters li.selected,
.mainNavBar ul.navFilters li:active{
    background-color:transparent;
}
.navDrawer ul.navFilters li ul li span,
.navDrawer ul.navFilters li ul li>a,
.mainNavBar ul.navFilters li ul li span,
.mainNavBar ul.navFilters li ul li>a{
    background-color:transparent;
    display:block;
}
ul.navFilters ul.communityListing{
    margin:-2px 0 23px 0 !important;
}
ul.navFilters ul.communityListing li:first-of-type,
ul.navFilters ul.communityListing li.loadMoreEntries + li{
    border-top:none;
}
ul.navFilters ul.communityListing li:last-of-type{
    border-bottom:none;
}
.mainNavBar ul.navFilters ul.communityListing li a{
    width: 267px;
}
ul.navFilters ul.communityListing li a img{
    width:24px;
    height:24px;
    background-size:cover;
    background-color:#373842;
    position: absolute;
    margin-left: -33px;
    margin-top: 3px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
}
    .mainNavBar ul.navFilters ul.communityListing li a img{
        margin-left: -33px !important;
    }
ul.navFilters ul.communityListing li span:active a img,
ul.navFilters ul.communityListing li .selected a img{
    background-color:#22232a;
}
ul.navFilters ul.communityListing li a img[style*="placeholder"]{
    display:none;
    background-color:transparent;
}
ul.navFilters ul.communityListing li.demoClass{
    padding-top: 0;
    margin-bottom: 5px;
    margin-top: 0;
}
.mainNavBar ul.navFilters ul.communityListing li.demoClass a{
    text-align: left;
    text-indent: 28px;
}
ul.navFilters ul.communityListing li.demoClass .tagClasses>span{
    margin-top:-5px;
    overflow:hidden;
}
ul.navFilters ul.communityListing li span.communityColor{
    position:absolute;
    width: 4px;
    height: 31px;
    display: inline-block;
    background: #0989aa;
    margin-left: 2px !important;
}
.subNavBar ul.navFilters:first-of-type ul.communityListing li span.communityColor{
    background:transparent;
}
li.home {
    border-left:4px solid transparent;
}
.mainNavBar ul.navFilters li ul li{
    height: 31px !important;
}
.demoClass span.communityColor {
    background: #e96f6d !important;
}

.mainNavBar ul.navFilters li ul li span,
ul.navFilters ul.communityListing li span.communityContent{
    display: inline-block !important;
    overflow: unset !important;
    width:100%;
}
ul.navFilters ul.communityListing li span.communityContent.hasNotification:before,
li.home.hasNotification:before{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #4bc1e6;
    position: absolute;
    margin-left: 7px;
    margin-top: 12px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}
ul.navFilters ul.communityListing li{
    cursor: pointer;
}



/*************************************************
*  Navigation Drawer: loading indicator
*************************************************/
.navDrawer ul.navFilters .loadMoreEntries,
.mainNavBar ul.navFilters .loadMoreEntries{
    background:#373843;
    border:none;
    height:37px;
    line-height:37px;
    padding-bottom:0;
    text-indent: 58px;
    text-align: left;
    text-shadow:none;
    color:#b3b3b3;
    position:relative;
    top:auto;
    left:0;
}
.navDrawer ul.navFilters .loadMoreEntries + li,
.mainNavBar ul.navFilters .loadMoreEntries + li{
    border-top:none;
}
.navDrawer ul.navFilters .loadMoreEntries:after,
.mainNavBar ul.navFilters .loadMoreEntries:after{
    margin:-36px 0 0 16px;
    background:url(../images/ajax-loader3.gif) no-repeat center;
    background-size:24px;
    width:30px;
    height:34px;
}
.otherMessages .loadMoreEntry{
    margin:0 0 0 90px !important;
    background:url(../images/ajax-loader2.gif) no-repeat center;
    background-size:24px;
    width:30px;
    height:34px;
}
.navDrawer ul.navFilters .loadMoreEntries{
    text-indent:51px;
    padding-left:7px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.navDrawer ul.navFilters .loadMoreEntries:after{
    margin:-36px 0 0 9px;
}



/*************************************************
*  Navigation Drawer: Child Profile Links
*************************************************/
.navDrawer .subNavBar ul.filterControl,
.mainNavBar ul.filterControl{
    margin-top:-6px;
    padding:12px;
    width:100%;
    position:relative;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.mainNavBar ul.filterControl{
    margin-top:-10px;
    display:none;
    padding:12px 12px 0 24px;
}
.navDrawer .subNavBar ul.filterControl:before,
.mainNavBar ul.filterControl:before{
    content:"";
    width:100%;
    height:1px;
    display:block;
    border-top:1px solid #282a33;
    background:#464850;
    position:absolute;
    margin-top:-7px;
    margin-left:-12px;
}
.mainNavBar ul.filterControl:before{
    margin-top:-39px;
}
.navDrawer .subNavBar ul.filterControl li,
.mainNavBar ul.filterControl li{
    margin:0 6px 10px 0;
    display:inline-block;
}
.navDrawer .subNavBar ul.filterControl li a:before,
.mainNavBar ul.filterControl li a:before{
    display:none;
}
.navDrawer .subNavBar ul.filterControl li:first-of-type,
.mainNavBar ul.filterControl li:first-of-type{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
    width:100%;
    margin:-2px 0 18px -24px;
    color:#b3b3b3;
    line-height:26px;
    height:25px;
    padding:0 0 0 36px;
    font-size:12px;
    text-shadow:none;
    text-indent:-19px;
    text-transform:uppercase;
    border-top:1px solid rgba(255,255,255,.1);
    border-bottom:1px solid #23252e;
    background: rgb(60,62,71); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(60,62,71,1) 0%, rgba(56,59,69,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(60,62,71,1)), color-stop(100%,rgba(56,59,69,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c3e47', endColorstr='#383b45',GradientType=0 )"; /* IE6-9 */
}
.navDrawer .subNavBar ul.filterControl li:first-of-type{
    text-indent:-11px;
}
.navDrawer .subNavBar ul.filterControl li:first-of-type{
    margin-top:-6px;
}
.navDrawer .subNavBar ul.filterControl li:last-of-type a{
    margin-bottom:0;
}



/*************************************************
*  Navigation Drawer: Menu Button
*************************************************/
.menuButton,
#orgHome.menu .actionBar .backButtonOnly{
    display:block;
    width:67px;
    height:48px;
    position:absolute;
    text-indent:-9999px;
    top:0px;
    left:0px;
    cursor:pointer;
    z-index:1;
    background:none;
}
.menuButton:after,
#orgHome.menu .actionBar .backButtonOnly:after{
    content:"";
    background-position:-96px -4px;
    display:block;
    width:65px;
    height:48px;
    position:absolute;
    top:0px;
    left:0px;
    border:none;
    border-right:1px solid #e2e2e2;
    box-shadow: 1px 0px 0px #fff;
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
}
.menuButton:active,
#orgHome.menu .actionBar .backButtonOnly:active{
    opacity:1;
    filter:alpha(opacity=100);
}
.menuButton:active:after,
#orgHome.menu .actionBar .backButtonOnly:active:after{
    background-color:#e1e1e1;
}
#orgHome.menu .actionBar h1{
    padding-left:75px;
}
.mainPanel.showDrawer + #genericControls .inlineBox.menu .backButtonOnly{
    width:100%;
    height:100%;
    position:absolute;
    animation:navdrawerLogoIn .4s;
    -webkit-animation:navdrawerLogoIn .4s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}



/*************************************************
*  Navigation Drawer Animation
*************************************************/
div.showDrawer .logo,
div.showDrawer ~ #genericControls .logo{
    width:100%;
    height:100%;
}
div.hideDrawer .logo,
div.hideDrawer ~ #genericControls .logo{
    width:100%;
    height:48px;
}
.showDrawer ~ #genericControls #beforeMainPanel{
    width:256px;
    animation:SlideRightIn .4s;
    -webkit-animation:SlideRightIn .4s;
    animation-timing-function:ease;
    -webkit-animation-timing-function:ease;
/*    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
*/    display:block;
}
.hideDrawer ~ #genericControls #beforeMainPanel{
    width:256px;
    animation:SlideLeftOut .4s;
    -webkit-animation:SlideLeftOut .4s;
    animation-timing-function:ease;
    -webkit-animation-timing-function:ease;
    -webkit-animation-fill-mode:forwards;
    -moz-animation-fill-mode:forwards;
    -ms-animation-fill-mode:forwards;
    -o-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
    -webkit-overflow-scrolling:auto;
    display:block;
}
.hideDrawer ~ #genericControls #beforeMainPanel{
    left: -400px; /* This is needed for iOS 8.1.  Without it, the group pages will not scroll */
}
.showDrawer ~ #genericControls #_communityView .orgNavMenu,
.showDrawer ~ #genericControls #_communityView .orgNav,
.showDrawer ~ #genericControls #_communityView .quickLinks{
    pointer-events:none;
}
#beforeMainPanel{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    margin-left: 0;
    overflow: hidden;
    box-shadow:rgba(0, 0, 0, 0.4) 4px 0px 10px 0px;
    display:none;
}
#beforeMainPanel #_bloomzTray{
    z-index:2;
    position:absolute;
    height:100%;
    width:100%;
}
.Desktop .navDrawer .subNavBar{
    overflow-y:auto;
}
.Desktop .navDrawer .subNavBar::-webkit-scrollbar{
    width: 10px;  /* for vertical scrollbars */
}
.Desktop .navDrawer .subNavBar::-webkit-scrollbar-track{
    background:rgba(255,255,255,.1);
}
.Desktop .navDrawer .subNavBar::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.25);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.Desktop .navDrawer .subNavBar::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}




/*************************************************
*  Navigation Options
*************************************************/
nav.mainNavBar .navClassOptions,
nav.subNavBar .navClassOptions{
    height:72px;
    border-top:1px solid #272a33;
    display:block;
    /*box-shadow:0 -2px 10px rgba(0,0,0,.15);
    background:#3c3e47;
    background:-moz-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
    background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(60,62,71,1)),color-stop(100%,rgba(56,59,69,1)));
    background:-webkit-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
    background:-o-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
    background:-ms-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
    background:linear-gradient(to bottom,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
    filter:"progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c3e47', endColorstr='#383b45',GradientType=0 )";*/
    background:#f2f2f2;
    border-top-color:#f2f2f2;
    text-align:center;
    /*box-shadow:0 0 5px rgba(0,0,0,.15);*/
    box-shadow:-2px -2px 4px rgba(37,37,37,0.1);
}
nav.mainNavBar .navClassOptions>div,
nav.subNavBar .navClassOptions>div{
    width:25%;
    height:100%;
    display:inline-block;
    /*margin:0 4px;*/
    color:#b3b3b3;
    text-shadow:none;
    font-size:10px;
    text-align:center;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-top:46px;
    cursor:pointer;
    position:relative;
    font-weight:500;
}
nav.mainNavBar .navClassOptions>div:before,
nav.subNavBar .navClassOptions>div:before{
    content:"";
    display:block;
    width:32px;
    height:32px;
    position:absolute;
    top:12px;
    left:50%;
    margin-left:-16px;
}
nav.mainNavBar .navClassOptions .inviteToGroups:before,
nav.subNavBar .navClassOptions .inviteToGroups:before{
    background-position:-590px -483px;
}
nav.mainNavBar .navClassOptions .addGroups:before,
nav.subNavBar .navClassOptions .addGroups:before{
    background-position:-208px -424px;
}
nav.mainNavBar .navClassOptions .settings:before,
nav.subNavBar .navClassOptions .settings:before{
    background-position:-589px -423px;
}
nav.mainNavBar .navClassOptions .support:before,
nav.subNavBar .navClassOptions .support:before{
    background-position:-653px -423px;
}
nav.mainNavBar .navClassOptions .inviteToGroups { color:#e86c6c; }
nav.mainNavBar .navClassOptions .addGroups { color:#43c1da; }
nav.mainNavBar .navClassOptions .settings { color:#212121; }
nav.mainNavBar .navClassOptions .support { color:#ffa21e; }
nav.subNavBar .userHeader{
    min-height: 86px;
    margin-bottom: -30px;
    -webkit-border-top-left-radius: 9px;
    -moz-border-radius-topleft: 9px;
    border-top-left-radius: 9px;
    background-image: none !important;
    background-color: #eee;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.userHeader .bloomzTransparentLogo{
    height: 60px;
    width: 150px;
    margin-top: 20px;
    margin-left: 20px;
    position: absolute;
    cursor: pointer;
    background-image: url(../images/sprite@2x.png?20180314);
    background-position: -231px -5px;
    background-size: 560px;
    height: 33px;
    width: 150px;
    margin-left: 10px;
    top: 0;
    left: 0;
}
.userHeader .bloomzTransparentLogo {
    background-image: url(../images/sprite@2x.png?20180314);
    background-position: -231px -5px;
    background-size: 560px;
    height: 33px;
    width: 150px;
    margin-left: 10px;
    top:0;
    left:0;
}

nav.subNavBar .userHeader .userProfilePhoto{
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    position: absolute;
    cursor: pointer;
    object-fit: cover;
    position: static;
    margin-top: 55px;
    margin-left: 10px;
    margin-bottom: 10px;

}
.mainSideBar .userHeader .userProfilePhoto{
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    /*box-shadow: 0 2px 6px rgba(0,0,0,.5);
    margin-left: 200px;
    margin-top: 50px;*/
    position: absolute;
    cursor:pointer;
    object-fit:cover;
    position: static;
    margin-top: 70px;
    margin-left: 10px;
    margin-bottom:10px;
}
.mainSideBar:before{
    display: none !important;
}
.mainSideBar .userHeader{
    min-height: 86px;
    margin-bottom: -30px;
    -webkit-border-top-left-radius: 9px;
    -moz-border-radius-topleft: 9px;
    border-top-left-radius: 9px;
    background-image:none !important;
    background-color:#eee;
    margin-bottom:0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

@media screen and (max-width:768px){
    /*.mainSideBar .userHeader{
        display: none;
    }*/
}


/*********************************************
* SubNav Tabs
*********************************************/
.hasSubTabs{
    padding-top:86px !important;
}
.hasSubTabs .actionBar{
    box-shadow:inset 0 -1px rgba(0,0,0,.15) !important;
}
.hasSubTabs .subNavTabs{
    display:table;
}
.subNavTabs{
    display:none;
    position:absolute;
    top:50px;
    height:36px;
    line-height:36px;
    background:#1f89a7;
    width:100%;
    box-shadow:inset 0 -1px rgba(0,0,0,.1), 0 2px 4px rgba(0,0,0,.05);
}
.subNavTabs span{
    font-size:14px;
    line-height:36px;
    display:table-cell;
    padding:0 7px;
    width:1px;
    background:rgba(0,0,0,.08);
    color:#fff;
    text-shadow:none;
    cursor:pointer;
    position:relative;
    white-space:nowrap;
    text-align:center;
    font-family:gotham;
}
.subNavTabs span.leaveEmpty{
    width:auto;
    cursor:default;
    background:transparent;
    box-shadow:none;
}
.subNavTabs span.selected:after{
    content: "";
    background: #fff;
    height: 3px;
    width: 100%;
    position: absolute;
    bottom: 0;
    display: block;
    /*margin-left: -7px;*/
    left:0;
    z-index:2;
}

.subNavTabs span.showNewTag:before{
    content: "New!";
    position: absolute;
    display: block !important;
    top: 0;
    margin-top: 6px;
    margin-left: 36px;
    width: auto;
    line-height: 10px;
    z-index: 0;
    font-size: 11px;
    color: #e86c6c !important;
}
.mainPage.hasSubTabs .actionBar{
    box-shadow:none !important;
    border-bottom:1px solid #e4e5ed;
}
.mainPage .subNavTabs{
    top:49px;
    height:37px;
    line-height:37px;
    background:#fff;
    box-shadow:inset 0 -1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.05);
}
/*.mainPage .subNavTabs span{
    color:#787878;
    background:none;
    box-shadow:none;
}*/
.mainPage .subNavTabs span.selected{
    color:#212121;
}
.mainPage .subNavTabs span.selected:after{
    background:#53c8e6;
}




/*********************************************
* Sub Inline Tabs
*********************************************/
.scrollView h1.subInlineTabs{
    text-align:center;
    white-space:nowrap;
    margin:0 auto;
    padding:0;
}
.subInlineTabsCommunityColor .subItemSelected{
    color: #fff;
}
.scrollView h1.subInlineTabs.noMarginBottom{
    margin-bottom:0;
}
.scrollView h1.subInlineTabs:after{
    display:none;
}
.scrollView h1.subInlineTabs span{
        display: none;
    padding: 2px 14px;
    line-height: 24px;
    text-shadow: none;
    font-size: 14px;
    color: #000;
    border: 1px solid #e4e5ed;
    background: #fff;
    margin: 0 0 0 -1px;
    cursor: pointer;
}
.scrollView h1.subInlineTabs span.noPadding{
    padding: 0;
}
.scrollView h1.subInlineTabs span div{
    padding:0 10px;
}
.scrollView h1.subInlineTabs span.selected{
    background: #53c8e6;
    color: #fff;
}
.scrollView h1.subInlineTabs span:first-of-type{
    -moz-border-radius:4px 0 0 4px;
    -webkit-border-radius:4px 0 0 4px;
    border-radius:4px 0 0 4px;
    border-left-width:1px;
}
.scrollView h1.subInlineTabs span:last-of-type{
    -moz-border-radius:0 4px 4px 0;
    -webkit-border-radius:0 4px 4px 0;
    border-radius:0 4px 4px 0;
}
.scrollView h1.subInlineTabs .edit{
    height:24px;
    white-space:nowrap;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:14px;
    color:#1ca0c8;
    text-decoration:underline;
    line-height:26px;
    display:inline-block;
    vertical-align:middle;
    position:relative;
    float:right;
    margin:0 0 10px 0;
}
.scrollView h1.subInlineTabs .edit:before{
    content:attr(data-selectLong);
}
.subNavTabs span.premiumCalendar:before,
.scrollView h1.subInlineTabs .premiumCalendar:before{
    content: '';
    display: inline-block;
    width: 13px;
    height: 16px;
    background-position: -281px -669px;
    margin-bottom: -1px;
    margin-right: 4px;
}

.subPage .subNavTabs span.premiumCalendar:before{
    background-position: -281px -609px;
}

.subPage.drawingToolPage{
    height: 96% !important;
    width: 100% !important;
    max-height: 100% !important;
    max-width: 100% !important;
    top: 0 !important;
    /*left: 0 !important;
    top: 0 !important;
    margin-left: unset !important;
    max-height: unset !important;*/
}





/*************************************************
*  Quick Links
*************************************************/
.quickLinksWrapper{
    position:static;
}
.quickLinksWrapper .menuOptWrapper .clipping{
    width: 100%;
}
.quickLinks{
    display:inline-block;
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    box-sizing:border-box;
}
.quickLinks:after{
    content:"";
    display:block;
    position:absolute;
    right:7px;
    bottom:14px;
    width:56px;
    height:56px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    box-shadow:0px 5px 15px rgba(0,0,0,.25);
    background-color:#2ab3de;
    z-index:3;
}
.quickLinks:active:after{
    background-color:#0bacd3;
}
.quickLinks .menuOptWrapper{
    height:100%;
    overflow:auto;
    position:relative;
    z-index:2;
}
.quickLinks .clipping{
    height:100%;
    overflow-x:hidden;
    overflow-y:auto;
    display:table;
}
.quickLinks div.addButton,
.createActivity div.addButton{
    background-position:-1px -232px;
    position:absolute;
    right:5px;
    bottom:12px;
    width:60px;
    height:60px;
    text-indent:-9999px;
    cursor:pointer;
    z-index:12;
}
.orgSignupsPage .quickLinks div.addButton,
.volunteerAsks .quickLinks div.addButton,
.calendarTab .quickLinks div.addButton,
.orgCalendarPage .quickLinks div.addButton{
    background-position:-128px -230px;
    position:absolute;
    right:4px;
    bottom:11px;
    width:60px;
    height:60px;
    text-indent:-9999px;
    cursor:pointer;
    z-index:4;
    font-family: gotham;
}
@media screen and (min-width:768px){
    .addButton.addButtonMainView{
        background:#53c8e6 !important;
    }
}

.orgSignupsPage .quickLinks div.addButton,
.volunteerAsks .quickLinks div.addButton{
    background-position: -386px -231px;
}


.calendarTab .quickLinks:after,
.orgCalendarPage .quickLinks:after,
.calendarTab .quickLinks div.addButton,
.orgCalendarPage .quickLinks div.addButton {
    display: none;
}
.calendarTab .showQuickLinks .quickLinks:after,
.orgCalendarPage .showQuickLinks .quickLinks:after,
.calendarTab .showQuickLinks .quickLinks div.addButton,
.orgCalendarPage .showQuickLinks .quickLinks div.addButton {
    display: block;
}
.mobileQuickLink{
    display: none !important;
}
@media screen and (max-width:767px){
    .mobileQuickLink{
        display: block !important;
    }
}
.calendarAddEvent li {
    background:rgba(255,255,255,.8);
    border-bottom:1px solid #e4e5ed;
}
.calendarAddEvent ul,
.quickLinks ul{
    text-shadow:none;
    font-size:14px;
    text-align:left;
    padding:0 0 0 15px;
    margin:0;
    position:relative;
    display:table-cell;
    vertical-align:bottom;
}
.Android .quickLinks ul,
.WindowsPhone .quickLinks ul{
    /*background:rgba(0,0,0,.3);*/
}
.quickLinks ul:before{
    content: "";
    border-top: 1px solid #aaa;
    display: block;
    width: 100%;
    position: relative;
    left: -15px;
    padding-right: 15px;
}
.quickLinks ul.quickLinksListWrapper:before { left:0; border-color:#e4e5ed; }

/* Add Menu */
.calendarAddEvent li,
.quickLinks li{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    text-align:left;
    text-indent:38px;
    width:100%;
    height:auto;
    min-height:54px;
    line-height:54px;
    display:inline-block;
    padding:0;
    color:#000;
    list-style:none;
    position:relative;
    z-index:2;
    cursor:pointer;
    box-sizing:border-box;
    background:rgba(255,255,255,1);
}
.quickLinks li span:before{
    content:"";
    width:15px;
    position:absolute;
    left:-15px;
    top:0;
    height:100%;
    padding-bottom:1px;
    display:block;
    background:#fff;
}
.calendarAddEvent li span,
.quickLinks li span{
    display:block;
    font-family:'Gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:0;
    font-size: 13px;
    line-height: 20px;
    color: #8e8e8e;
    margin:-15px 0 10px 0;
    padding:0 6px 0 40px;
}
.calendarAddEvent ul li:after,
.quickLinks ul li:after{
    content:"";
    width:66px;
    height:48px;
    position:absolute;
    left:12px;
    top:2px;
    margin-left:-33px;
}
.quickLinks ul li.closeQuickLinks{
    text-indent:-9999px;
    height:1px;
    min-height:64px;
    line-height:1px;
}
.quickLinks ul li.closeQuickLinks span{
    height:1px;
    margin:0;
}
.quickLinks ul li.closeQuickLinks:after{
    display:none;
}
    .firefox .quickLinks .closeQuickLinks{
        display: none !important;
    }
.calendarAddEvent ul li:last-of-type:before,
.quickLinks ul li:last-of-type:before{
    height:48px;
}
.quickLinks .optionCreatePost{
    color:#5aae00;
}
.quickLinks .optionCreateSlideshow{
    color:#2394e0;
}
.quickLinks .optionCreateAlbum{
    color:#17bdcd;
}
.quickLinks .optionUploadPhotos{
    color:#5aae00;
}
.quickLinks .optionUploadDocuments{
    color:#2845c3;
}
.quickLinks .optionCreateStudentWork{
    color:#2845c3;
}
.quickLinks .optionCreateHealthCheckRequest{
    color:#2845c3;
}
.quickLinks .optionCreateAwards{
    color:#fdb82c;
}
.quickLinks .optionCreateDailyActivity{
    color:#fdb82c;
}
.quickLinks .optionAttendence{
    color:#87c558;
}
.calendarAddEvent .optionCreateEvent,
.quickLinks .optionCreateEvent{
    color:#17bdcd;
}
.quickLinks .optionCreateMessage{
    color:#1a97df;
}
.quickLinks .optionCreateAnnouncement{
    color:#961de2;
}

.quickLinks .optionAddStudents{
    color: #2fc6fa;
}
.calendarAddEvent .optionCreateVolunteer,
.quickLinks .optionCreateVolunteer{
    color:#f279a2;
}
.calendarAddEvent .optionCreatePTEvent{
    color:#d43525;
}
.quickLinks .optionCreatePTEvent{
    color:#d43525;
    text-indent:-9999px;
}
.quickLinks .optionCreatePTEvent:before{
    content:"Conferences/Office Hours";
    position:absolute;
    left:38px;
    text-indent:0;
    background-color:transparent !important;
}
.quickLinks .optionCreateAlert{
    color:#d43525;
}
.quickLinks .optionCreateCircle{
    color:#1a97df;
}
.quickLinks .optionCreateSubGroup{
    color:#64b51c;
}
.quickLinks ul li:active:after{
    opacity:0.3;
    filter:alpha(opacity=30);
}
.quickLinks .optionCreatePost:after{
    background-position:-572px -1497px;
}
.quickLinks .optionCreateSlideshow:after{
    background-position:-635px -1851px;
}
.quickLinks .optionCreateAlbum:after{
    background-position:-445px -1851px;
}
.quickLinks .optionUploadPhotos:after{
    background-position:-540px -1851px;
}
.quickLinks .optionUploadDocuments:after{
    background-position:-636px -1497px;
}
.quickLinks .optionCreateStudentWork:after{
    background-position:-636px -1497px;
}
.quickLinks .optionCreateHealthCheckRequest:after{
    background-position:-636px -1497px;
}
.quickLinks .optionCreateAwards:after {
    background-position:2px -1497px;
}
.quickLinks .optionCreateDailyActivity:after {
    background-position:-382px -1618px;
}
.quickLinks .optionAttendence:after {
    background-position:-63px -1498px;
}
.calendarAddEvent .optionCreateEvent:after,
.quickLinks .optionCreateEvent:after{
    background-position:-255px -1617px;
}
.quickLinks .optionCreateMessage:after{
    background-position:-126px -1497px;
}
.quickLinks .optionCreateCircle:after{
    background-position:-127px -1437px;
}
.quickLinks .optionCreateSubGroup:after{
    background-position:-318px -1374px;
}
.quickLinks .optionCreateAnnouncement:after{
    background-position:-190px -1497px;
}
.quickLinks .optionAddStudents:after{
    background-position: -60px -830px;
}
.calendarAddEvent .optionCreateVolunteer:after,
.quickLinks .optionCreateVolunteer:after{
    background-position:-508px -1497px;
}
.calendarAddEvent .optionCreatePTEvent:after,
.quickLinks .optionCreatePTEvent:after{
    background-position:-446px -1618px;
}
.quickLinks .optionCreateAlert:after{
    background-position:-383px -1497px;
}
.quickLinks .upgradeOption div:after{
    content:" premium";
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:10px;
    color:#e86c6c;
    vertical-align: super;
}

.quickLinks .quickLinkFree div:after{
    content:" Free for limited time";
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:10px;
    color:#e86c6c;
    vertical-align: super;
}

.quickLinks,
#orgHome .quickLinks,
#userProfile_ .quickLinks,
.volunteerAsks .quickLinks .optionCreatePost,
.volunteerAsks .quickLinks .optionCreateSlideshow,
.volunteerAsks .quickLinks .optionCreateAlbum,
.volunteerAsks .quickLinks .optionUploadPhotos,
.volunteerAsks .quickLinks .optionUploadDocuments,
.volunteerAsks .quickLinks .optionCreateStudentWork,
.volunteerAsks .quickLinks .optionCreateHealthCheckRequest,
.volunteerAsks .quickLinks .optionCreateAwards,
.volunteerAsks .quickLinks .optionCreateDailyActivity,
.volunteerAsks .quickLinks .optionAttendence,
.volunteerAsks .quickLinks .optionCreateMessage,
.volunteerAsks .quickLinks .optionCreateAnnouncement,
.volunteerAsks .quickLinks .optionCreateAlert,
.volunteerAsks .quickLinks .optionCreateCircle,
.volunteerAsks .quickLinks .optionCreateSubGroup,
.volunteerAsks .quickLinks .optionCreateEvent,
.calendarTab .quickLinks .optionCreatePost,
.calendarTab .quickLinks .optionCreateSlideshow,
.calendarTab .quickLinks .optionCreateAlbum,
.calendarTab .quickLinks .optionUploadPhotos,
.calendarTab .quickLinks .optionUploadDocuments,
.calendarTab .quickLinks .optionCreateStudentWork,
.calendarTab .quickLinks .optionCreateHealthCheckRequest,
.calendarTab .quickLinks .optionCreateAwards,
.calendarTab .quickLinks .optionCreateDailyActivity,
.calendarTab .quickLinks .optionAttendence,
.calendarTab .quickLinks .optionCreateMessage,
.calendarTab .quickLinks .optionCreateAnnouncement,
.calendarTab .quickLinks .optionCreateAlert,
.calendarTab .quickLinks .optionCreateCircle,
.calendarTab .quickLinks .optionCreateSubGroup,
.orgCalendarPage .quickLinks .optionCreatePost,
.orgCalendarPage .quickLinks .optionCreateSlideshow,
.orgCalendarPage .quickLinks .optionCreateAlbum,
.orgCalendarPage .quickLinks .optionUploadPhotos,
.orgCalendarPage .quickLinks .optionUploadDocuments,
.orgCalendarPage .quickLinks .optionCreateStudentWork,
.orgCalendarPage .quickLinks .optionCreateAwards,
.orgCalendarPage .quickLinks .optionCreateDailyActivity,
.orgCalendarPage .quickLinks .optionAttendence,
.orgCalendarPage .quickLinks .optionCreateMessage,
.orgCalendarPage .quickLinks .optionCreateAnnouncement,
.orgCalendarPage .quickLinks .optionCreateAlert,
.orgCalendarPage .quickLinks .optionCreateCircle,
.orgCalendarPage .quickLinks .optionCreateSubGroup,
.orgSignupsPage .quickLinks .optionCreateEvent,
.orgSignupsPage .quickLinks .optionCreatePost,
.orgSignupsPage .quickLinks .optionCreateSlideshow,
.orgSignupsPage .quickLinks .optionCreateAlbum,
.orgSignupsPage .quickLinks .optionUploadPhotos,
.orgSignupsPage .quickLinks .optionUploadDocuments,
.orgSignupsPage .quickLinks .optionCreateStudentWork,
.orgSignupsPage .quickLinks .optionCreateHealthCheckRequest,
.orgSignupsPage .quickLinks .optionCreateAwards,
.orgSignupsPage .quickLinks .optionCreateDailyActivity,
.orgSignupsPage .quickLinks .optionAttendence,.timelines.contentArea
.orgSignupsPage .quickLinks .optionCreateMessage,
.orgSignupsPage .quickLinks .optionCreateAnnouncement,
.orgSignupsPage .quickLinks .optionCreateAlert,
.orgSignupsPage .quickLinks .optionCreateCircle,
.orgSignupsPage .quickLinks .optionCreateSubGroup,
.orgSignupsPage .quickLinks .optionCreateSubGroup,
.orgHomePage .quickLinks .optionCreateAlbum,
.orgHomePage .quickLinks .optionUploadPhotos,
.orgHomePage .quickLinks .optionUploadDocuments,
.postsTab .quickLinks .optionUploadDocuments,
.postsTab .quickLinks .optionUploadPhotos,
.postsTab .quickLinks .optionCreateAlbum
{
    display:none;
}

.postsTab .quickLinks,
.calendarTab .quickLinks,
.mediaTab .quickLinks,
.volunteerAsks .quickLinks,
#orgHome .orgMediaPage .quickLinks,
#orgHome .orgHomePage .quickLinks,
#userProfile_ .orgHomePage .quickLinks,
#orgHome .orgCalendarPage .quickLinks,
#orgHome .orgSignupsPage .quickLinks,
.forceShowQuickLinks .quickLinks{
    display:block;
}
.labelNewQuickLinks {
    color: rgb(232, 108, 108) !important;
    font-weight: bold;
    font-style: italic;
    font-size:12px !important;
    display:inline-block !important;
    padding-left:7px !important;
}



.initQuickLinks .quickLinks{
    height:1px;
}
.initQuickLinks .quickLinks ul{
    display:none;
}
.initQuickLinks .quickLinks .addButton{
    transform:rotate(0deg);
    -webkit-transform:rotate(0deg);
}
.showQuickLinks .quickLinks{
    height:100%;
}
.showQuickLinks .quickLinks:after{
    animation:menuBtnSlideDown .3s ease;
    -webkit-animation:menuBtnSlideDown .3s ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
    margin-bottom:1px;
}
.showQuickLinks .quickLinks ul{
    animation:menuRotateIn .3s ease;
    -webkit-animation:menuRotateIn .3s ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
    max-height:500px;
    overflow-y:visible;
}
.shadowBox .quickLinks ul { background: #f0f2f4; background-color:transparent; }
.postsTab .showQuickLinks .quickLinks .addButton,
.orgMediaPage .showQuickLinks .quickLinks .addButton,
.orgHomePage .showQuickLinks .quickLinks .addButton{
    animation:menuBtnSlideDown .3s ease;
    -webkit-animation:menuBtnSlideDown .3s ease;
    -webkit-transition-delay:.2s;
    transition-delay:.2s;
    transform:rotate(135deg);
    -webkit-transform:rotate(135deg);
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.volunteerAsks .showQuickLinks .quickLinks div.addButton,
.calendarTab .showQuickLinks .quickLinks div.addButton,
.orgSignupsPage .showQuickLinks .quickLinks div.addButton,
.orgCalendarPage .showQuickLinks .quickLinks div.addButton{
    animation:menuBtnSlideDown .3s ease;
    -webkit-animation:menuBtnSlideDown .3s ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.hideQuickLinks .quickLinks{
    animation:menuSizeDown .6s;
    -webkit-animation:menuSizeDown .6s;
    height:1px;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.hideQuickLinks .quickLinks:after{
    animation:menuBtnSlideUp .3s ease;
    -webkit-animation:menuBtnSlideUp .3s ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.hideQuickLinks .quickLinks ul{
    animation:menuRotateOut .6s;
    -webkit-animation:menuRotateOut .6s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.postsTab .hideQuickLinks .quickLinks .addButton,
.orgHomePage .hideQuickLinks .quickLinks .addButton{
    animation:menuBtnSlideUp .3s ease;
    -webkit-animation:menuBtnSlideUp .3s ease;
    -webkit-transition-delay:.2s;
    transition-delay:.2s;
    transform:rotate(0deg);
    -webkit-transform:rotate(0deg);
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.orgSignupsPage .hideQuickLinks .quickLinks div.addButton,
.volunteerAsks .hideQuickLinks .quickLinks div.addButton,
.calendarTab .hideQuickLinks .quickLinks div.addButton,
.orgCalendarPage .hideQuickLinks .quickLinks div.addButton{
    animation:menuBtnSlideUp .3s ease;
    -webkit-animation:menuBtnSlideUp .3s ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
    font-family: gotham;
}

/* Quick Links Shadow */
.showQuickLinks .quickLinksShadow{
    width: 100%;
    height: 100%;
    position:fixed;
    background:rgba(0,0,0,.5);
    display:block;
    margin-top: -50px;
}
.profilePage .quickLinksWrapper .quickLinksShadow{
    width: 100% !important;
    /*height: 550px !important;*/
    position:absolute !important;
    margin-top: 0;
    background:rgba(0,0,0,.3) !important;
    /*background:#edeef3;*/
}
.profilePage .showQuickLinks .menuOptWrapper{
    overflow: hidden !important;
}
.profilePage .carousel{
    position: inherit;
}

/*************************************************
*  Add Button for Current Section
*************************************************/
.addCurSection{
    display:none;
}


.messagesTab .addCurSection,
.mediaTab .addCurSection,
.volunteerAsks .addCurSection,
.circlesTab .addCurSection,
.circlesTab .addCurSectionStudent,
#orgHome .orgMembersPage .addCurSection,
#orgHome .orgSignupsPage .addCurSection,
#orgHome .orgMediaPage .addCurSection,
#orgHome .orgInfoPage .addCurSection{
    position:absolute;
    left:auto;
    bottom:14px;
    right:7px;
    display:block;
    height:56px;
    width:56px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    border:none;
    background:#2ab3de;
    box-shadow:0px 5px 15px rgba(0,0,0,.25);
}
.addCurSection button,
.addCurSectionStudent button{
    border:none;
    width:100%;
    height:100%;
    text-indent:-9999px;
}
.messagesTab .addCurSection button{
    background-position:-258px -231px;
}
.mediaTab .addCurSection button{
    background-position:-322px -231px;
}
.circlesTab .addCurSection button{
    background-position:-194px -231px;
}
.volunteerAsks .addCurSection button{
    background-position:-386px -231px;
}
#orgHome .orgMembersPage .addCurSection button{
    background-position:-194px -231px;
}
#orgHome .orgManagePage .addCurSection button{
    background-position:-3px -232px;
}
#orgHome .orgSignupsPage .addCurSection button{
    background-position:-386px -231px;
}
#orgHome .orgMediaPage .addCurSection button{
    background-position:-322px -231px;
}
#orgHome .orgInfoPage .addCurSection button{
    background-position:-450px -231px;
}






/*************************************************
*  Keyboard Styles
*************************************************/
.keyboard .eventForm footer.options,
.keyboard .quickLinks{
    display:none;
}
.keyboard .shadowBox div.eventForm,
.keyboard .inlineBox div.eventForm{
    padding-bottom:0;
}
.keyboard:before,
.keyboard:after{
    display:none !important;
}
.keyboard .scrollView{
    border-bottom:1px solid rgba(195,195,195,1);
}
.keyboard #postView .scrollView,
.keyboard #eventView .scrollView,
.keyboard #orgHome .scrollView,
.keyboard #messageView .scrollView{
    border-bottom:none;
}
.keyboard .recipientPickerCtrl .resultsListing{
    padding-bottom:135px !important;
}



/*************************************************
*  Action Bar
*************************************************/
.mainPage>.actionBar{
    display:none;
}
.actionBar{
    width:100%;
    display:block;
    position:absolute;
    left:0;
    top:0;
    height:48px;
    min-height:48px;
    border-bottom:1px solid #e8e8e8;
    background:#ffffff; /* Old browsers */
    /*background:-moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%);
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5));
    background:-webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:-o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:-ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%);*/
}
.communityPage .actionBar{
    background:#ffffff; /* Old browsers */
    /*background:-moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%);
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5));
    background:-webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:-o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:-ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
    background:linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%);*/
}
.actionBar .actionButtons{
    position:absolute;
    top:0;
    right:0;
}
.actionBar .actionButtons li:last-of-type{
    margin-right:10px;
}
.actionBar .actionButtons button.search:after{
    display:block;
    background-position:-454px -64px;
}
.actionBar .actionButtons button.search,
.actionBar .actionButtons button.addToCircle{
    background:none;
}
.forceTruncate{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}



/*************************************************
*  ActionBar: Search Bar
*************************************************/
.shadowBox .subPage.hasSearchBar{
    padding-top:94px;
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout{
    background:#fff;
    margin-top:0;
    padding:7px 15px 7px 15px;
    border:solid #e4e5ed;
    border-width:1px 0;
    /*box-shadow:inset 0 1px 0 rgba(255,255,255,1);*/
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .selectedList{
    min-height:23px;
    margin-top:0;
    color:#666;
    text-shadow:none;
    text-align:center;
    padding:0;
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .selectedList span{
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    line-height:29px;
    height:29px;
    background:#dedede;
    border:1px solid #dedede;
    width:100%;
    text-align:left;
    white-space:nowrap;
    text-overflow:clip;
    overflow-y:hidden;
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .selectedList span:focus{
    background:#fff;
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .selectedList span:focus + .placeHolderText,
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .selectedList span:active + .placeHolderText{
    text-align:left;
}
.shadowBox .subPage.hasSearchBar .actionBar .formLayout .placeHolderText{
    top:6px;
    line-height: 18px;
    left:0;
    color:#8d8d8f;
    text-shadow:none;
    text-align:center;
    width:100%;
    pointer-events:none;
    text-indent:10px;
}



/*************************************************
*  ActionBar: Location Search
*************************************************/
.locationsAutoSuggest label{
    overflow:visible !important;
}
.locationsAutoSuggest .autoSuggestResults{
    position:absolute;
    width:100%;
    height:20px;
}
.ie .locationsAutoSuggest .autoSuggestResults{
    max-width:580px;
}
.locationsAutoSuggest .placeLocationBoxResultsNotListed{
    box-shadow:0 2px 6px rgba(0,0,0,0.3);
    color:#53c8e6;
    text-align:center;
    text-indent:0;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}




/*************************************************
*  ActionBar: Form Row
*************************************************/
.shadowBox .subPage.formRow{
    padding-top:94px;
}
.shadowBox .subPage.formRow .actionBar>.formLayout{
    background:#f2f2f2;
    margin-top:0;
    padding:0;
    border:solid #c3c3c3;
    border-width:1px 0;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1);
    background:#fff;
    border-color:#e4e5ed;
    box-shadow:none;
}
.shadowBox .subPage.formRow .actionBar .formLayout>section{
    background-color:transparent !important;
    border-bottom:0;
}




/*************************************************
*  Child Filters
*************************************************/
.filterControl li{
    list-style:none;
    display:inline-block;
    padding:4px 0;
    margin:0 2px 0 3px;
}
.filterControl a{
    margin:0;
    display:inline-block;
    padding:0;
}
div .filterControl a.addChild .profileM,
div .filterControl a.addSpouse .profileM{
    text-indent:-9999px;
    text-align:left;
    border:1px dashed #aaa;
    color:#aaa;
    width:32px;
    height:32px;
    margin-top:0;
    background-position:-462px -1023px;
}
div .filterControl a.addChild:active .profileM,
div .filterControl a.addSpouse:active .profileM{
    background-color:#e1e1e1;
    border:1px solid rgba(170,170,170,.3);
}
div .filterControl a.addChild .profileM:before,
div .filterControl a.addSpouse .profileM:before{
    display:none;
}
.filterControl a.addChild .profileM img,
.filterControl a.addSpouse .profileM img{
    display:none;
}
 .filterControl a.childFilter{
    vertical-align:middle;
    margin-top:-4px;
    height:32px;
    width:33px;
    position:relative;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
 .filterControl a.childFilter .profileM{
    width:30px;
    height:30px;
    margin-top:2px;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
    position:absolute;
    top:0;
    left:-1px;
    text-align:left;
    background:#fff;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
 .filterControl a.childFilter .profileM:before{
     width:30px;
     height:30px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
 }
 .filterControl a.childFilter .profileM img{
    width:30px;
    height:30px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}



/*************************************************
*  Child Filters: Positioning on main pages
*************************************************/
.contentArea .filterControl{
    background:#e8e8e8;
    text-align:right;
    margin:0 auto -32px auto;
    padding:15px 0 0 5px;
    min-height:5px;
}



/*************************************************
*  Action Bar:  Action Buttons
*************************************************/
.actionButtons{
    margin:0;
    padding:0;
}
.actionButtons>li{
    list-style:none;
    display:inline-block;
    padding:0;
    margin:0;
    position:relative;
}
.actionButtons button{
    width:40px;
    height:48px;
    border:none;
    text-indent:-9999px;
    border-left:1px solid #c3c3c3;
    -moz-border-radius-topright:7px;
    -webkit-border-radius-topright:7px;
    border-top-right-radius:7px;
}
.actionButtons button:after{
    content:"";
    width:48px;
    height:48px;
    position:absolute;
    right:0;
    top:0;
}
.actionButtons .showMenu ul{
    display:block;
}
.actionButtons ul{
    position:absolute;
    right:0;
    color:#fff;
    text-shadow:none;
    font-size:15px;
    text-align:center;
    padding:0;
    display:none;
}
.actionButtons ul li{
    width:64px;
    padding:40px 0 8px 0;
    list-style:none;
    position:relative;
}
.actionButtons ul li:after{
    content:"";
    width:64px;
    height:64px;
    position:absolute;
    top:0;
    left:0;
}
.actionButtons ul li{
    background-color:#92e4ff;
}
.actionButtons ul li:nth-child(1){
    background-color:#1284a7;
}
.actionButtons ul li:nth-child(2){
    background-color:#2399be;
}
.actionButtons ul li:nth-child(3){
    background-color:#3bb1d6;
}
.actionButtons ul li:nth-child(4){
    background-color:#51c1e4;
}
.actionButtons ul li:nth-child(5){
    background-color:#65d3f7;
}
.actionButtons ul li:nth-child(6){
    background-color:#92e4ff;
}
.actionButtons button.editEntry:after{
    background-position:-265px -1136px;
    opacity: .5;
    filter: alpha(opacity=50);
}



/* Styles for Create Post Menu */
.actionButtons .createPost:after{
    background-position:0 -229px;
}
.actionButtons .createPostMenu .optionPost1:after{
    background-position:-128px -295px;
}
.actionButtons .createPostMenu .optionPost2:after{
    background-position:-128px -295px;
}
.actionButtons .createPostMenu .optionPost3:after{
    background-position:-128px -295px;
}
.actionButtons .showMenu .createPost:after{
    background-position:-64px -229px;
}


/* Styles for Create Event Menu */
.actionButtons .createEvent:after{
    background-position:0px -289px;
}
.actionButtons .createEventMenu .optionEvent:after{
    background-position:-128px -295px;
}
.actionButtons .createEventMenu .optionDropOff:after{
    background-position:-192px -295px;
}
.actionButtons .createEventMenu .optionPickUp:after{
    background-position:-256px -295px;
}
.actionButtons .showMenu .createEvent:after{
    background-position:-64px -289px;
}


/* Styles for Create Circle Menu */
.actionButtons button.createCircle:after{
    background-position:0 -349px;
}
.actionButtons .showMenu button.createCircle:after{
    background-position:-64px -349px;
}



/* Styles for Add To Circle Menu */
.actionButtons .addToCircle:after{
    background-position:-445px -1016px;
}
.actionButtons .addToCircleMenu .optionPost:after{
    background-position:-128px -415px;
}
.actionButtons .addToCircleMenu .optionEvent:after{
    background-position:-192px -415px;
}
.actionButtons .addToCircleMenu .optionPeople:after{
    background-position:-256px -415px;
}
.actionButtons .showMenu .addToCircle:after{
    background-position:-64px -408px;
}


/* Styles for Create Message Menu */
.actionButtons button.createMessage:after{
    background-position:0 -469px;
}
.actionButtons .showMenu button.createMessage:after{
    background-position:-64px -469px;
}





/*************************************************
*  Action Bar:  Acceptance Buttons
*************************************************/
.actionButtons .moreOptions,
.actionButtons .decline,
.actionButtons .accept
{
    padding:0;
    border-left:none;
    width:39px;
    height:48px;
    position:relative;
}
.actionButtons .moreOptions:after,
.actionButtons .decline:after,
.actionButtons .accept:after{
    content:"";
    width:39px;
    height:48px;
    position:absolute;
    right:0;
    top:0;
}
.actionButtons .moreOptions:after{
    background-position:-395px -415px;
}
.actionButtons .decline:after{
    background-position:-332px -415px;
}
.actionButtons .accept:after{
    background-position:-269px -415px;
}
.actionButtons .inviteStatus{
    display:none;
    position:relative;
    padding-right:20px;
    margin-right:10px;
}
.actionButtons .inviteStatus:after{
    content:"";
    width:10px;
    height:10px;
    border:solid #000;
    border-width:0 1px 1px 0;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari and Chrome */
    display:inline-block;
    position:absolute;
    right:0;
    top:0;
}



/*************************************************
*  Action Bar:  Back Buttons
*************************************************/
.actionBar h1{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-align:center;
    /*font-size:20px;*/
    font-size:18px;
    position:absolute;
    top:0;
    padding-top:4px;
    width:100%;
    margin-top:0;
    line-height:40px;
    overflow:hidden;
    word-break:normal;
    white-space:nowrap;
    padding:4px 70px;
    background:#fff;
}
.mainPage .actionBar h1{
    padding:4px 80px 4px 48px;
    text-align:left;
}


/*************************************************
*  Action Bar:  Back Buttons
*************************************************/
.actionBar .backButton{
    /*font-size:21px;*/
    line-height:48px;
    display:inline-block;
    z-index:1;
    text-indent:0;
    color:#53c8e6;
    margin-top:0px;
    position:relative;
    padding:0 10px 0 15px;
    min-width:40px;
    font-family: gotham;
}
.actionBar .backButton:active{
    opacity:.3;
    filter:alpha(opacity=30);
}
.actionBar .backButton:after{
    content:"\0000a0";
    /* inject a space to prevent back button from collapsing*/
}



/*************************************************
*  Action Bar:  Back Button Only - No Text
*************************************************/
.actionBar .backButtonOnly{
    display:inline-block;
    z-index:1;
    width:48px;
    height:48px;
    background-position:-73px -1317px;
    margin-top:0px;
    position:relative;
    padding:0 10px 0 0;
    text-indent:25px;
    vertical-align:middle;
    outline:none;
}
.actionBar .backButtonOnly:active{
    opacity:.3;
    filter:alpha(opacity=30);
}
.actionBar .backButtonOnly{
    background:none;
    color:#53c8e6;
}
.actionBar .backButtonOnly:after{
    content:"";
    display:block;
    width:13px;
    height:13px;
    border:solid;
    border-width:0 0 2px 2px;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    position:absolute;
    top:16px;
    left:19px;
    color:inherit;
}




/*************************************************
*  Action Bar: Next Buttons
*************************************************/
.actionBar .nextButton{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    position:absolute;
    top:-3px;
    right:0;
    /*font-size:21px;*/
    line-height:48px;
    display:block;
    padding:0 15px 0 10px;
    color:#53c8e6;
    margin-top:2px;
}
.actionBar .nextButton:active{
    opacity:.3;
    filter:alpha(opacity=30);
}
.actionBar .nextButton.disabled{
    color:#c3c3c3;
    cursor: auto;
}
.actionBar ul.nextButton{
    padding:0 5px 0 0;
}
.actionBar ul.nextButton li{
    list-style:none;
    display:inline-block;
}
.actionBar ul.nextButton li.edit,
.actionBar ul.nextButton li.add{
    width:38px;
    height:48px;
    text-indent:-9999px;
    margin-left:-4px;
    cursor: pointer;
}
.actionBar ul.nextButton li.edit{
    background-position:-584px -1316px;
}
.actionBar ul.nextButton li.add{
    background-position:-460px -1016px;
}
.hideSidePanel .actionBar ul.nextButton li.add{
    margin-right: 13px;
}
.actionBar .nextButton.recommendBloomz{
    width:44px;
    height:44px;
    display:block;
    text-indent:-9999px;
    padding:0;
    right:44px;
    background-position:-640px -535px;
}



/*************************************************
*  Action Bar: Event Details
*************************************************/
.forMine,
.forReceived,
.forAccepted,
.forOther,
.actionBarEventAlert,
.eventAlertDetailsPage .chatInput,
.eventAlertDetailsPage .invitationDetails,
.actionBarEventAlert,
.contentEventAlert{
    display:none;
}
.eventMine .forMine,
.eventReceived .forReceived,
.eventAccepted .forAccepted,
.eventOther .forOther,
.eventAlertDetailsPage .actionBarEventAlert,
.eventAlertDetailsPage .contentEventAlert{
    display:block;
}
.actionButtons .eventShare,
.actionButtons .eventInvite,
.actionButtons .eventAlert,
.actionButtons .eventEdit{
    width:39px;
    height:48px;
    position:relative;
    margin:0;
    padding:0;
}
.eventMine .forMine button:after,
.eventAccepted .forAccepted button:after{
    width:39px;
}
.eventMine .forMine button.selected:after,
.eventAccepted .forAccepted button.selected:after{
    background-position-y:-475px;
}
.actionButtons .eventShare:after{
    background-position:-77px -415px;
}
.actionButtons .eventRemind:after{
    background-position:-523px -415px;
}
.actionButtons .eventInvite:after{
    background-position:-13px -415px;
}
.actionButtons .eventAlert:after{
    background-position:-141px -415px;
}
.actionButtons .eventEdit:after{
    background-position:-205px -415px;
}
.showMenu .moreOptionsMenu li{
    width:130px;
    padding:15px 0;
    font-size:15px;
}
.showMenu .moreOptionsMenu li:after{
    display:none;
}



/*****************************************************
*  User Profiles: Extra Large
*  Hide name by setting overflow:hidden on .profileXL
*****************************************************/
.profileXL{
    background:#666;
    width:70px;
    height:70px;
    white-space:nowrap;
    font-size:30px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:inline-block;
    text-indent:0;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    cursor:pointer;
}
.profileXL img{
    height:71px;
    width:70px;
    margin:-1px 15px 0 0;
    opacity:.90;
    filter:alpha(opacity=90);
    vertical-align:middle;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    background-position:center center;
    background-size:cover;
    background-color:#fff;
}



/*****************************************************
*  User Profiles: Large
*****************************************************/
.profileL{
    width:100%;
    height:60px;
    overflow:hidden;
    white-space:nowrap;
    line-height:21px;
    font-size:17px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:inline-block;
    text-indent:0;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.profileL:not(.draftsListing):before{
    content:"";
    width:60px;
    height:60px;
    background:#bbb;
    line-height:60px;
    text-align:center;
    color:#fff;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    text-shadow:none;
    text-indent:2px;
    display:block;
    position:absolute;
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
    border-radius:100px;
}
.profileL:after{
    content:attr(data-displayname);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    margin-left:-70px;
    padding-right:30px;
    width:100%;
    height:24px;
    overflow:hidden;
    word-wrap:break-word;
    white-space:nowrap;
    display:inline-block;
    text-overflow:ellipsis;
    margin-top:-5px;
    text-indent:70px;
}
.profileL.householdListing:after{
    margin-bottom:17px;
}
.onlineStatus .profileL:after{
    content:attr(data-displayname);
    background:url(../images/statusOnline.png) right no-repeat;
    background-size:9px 9px;
    padding-right:12px;
}
.profileL img{
    height:60px;
    width:60px;
    margin:0 10px 0 0;
    opacity:.85;
    filter:alpha(opacity=85);
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
    border-radius:100px;
    background-position:center center;
    background-size:cover;
    background-color:#fff;
}



/*************************************************
*  User Profiles: Medium
*************************************************/
.profileM{
    width:100%;
    height:40px;
    overflow:hidden;
    white-space:nowrap;
    line-height:20px;
    font-size:15px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:inline-block;
    text-indent:0;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.award .profileM:before{
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    border-radius: 50% !important;
    background: transparent;
    border: 1px solid #e4e5ed;
    width: 60px;
    height: 60px;
    margin-left: -5px;
    margin-top: 0;
    margin-left: -3px;
    margin-top: 2px;
}

.profileM:before{
    content:"";
    width:40px;
    height:40px;
    line-height:40px;
    text-align:center;
    background:#bbb;
    color:#fff;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    text-indent:2px;
    text-shadow:none;
    display:block;
    position:absolute;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    border-radius:50px;
}
.profileNotImage:before{
    content:initial;
}
.profileM:after{
    content:attr(data-displayname);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    margin-left:-52px;
    padding-right:40px;
    width:100%;
    height:24px;
    overflow:hidden;
    white-space:nowrap;
    display:inline-block;
    text-overflow:ellipsis;
    text-indent:50px;
}
.onlineStatus .profileM:after{
    content:attr(data-displayname);
    background:url(../images/statusOnline.png) right no-repeat;
    background-size:9px 9px;
    padding-right:14px;
}
.profileM img{
    vertical-align:top;
    height:40px;
    width:40px;
    margin:0 12px 0 0;
    opacity:.85;
    filter:alpha(opacity=85);
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    background-position:center center;
    background-size:cover;
    background-color:#fff;
    border-radius:50px;
}
.postEntryHeader .profileM img{
    height:48px;
    width:48px;
    margin-top:4px;
}
.postEntryHeader .profileM:before{
    margin-top:4px;
    width: 48px;
    height: 48px;
    line-height: 48px;
}
.postEntryHeader h3,
.postEntryHeader .metaInfo{
    margin-left:6px;
    white-space:nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: Gotham-book;
    line-height: 1.3;
    font-size: 14px;
}
.postEntryHeaderAdminNotification h3{
    margin-top: -24px !important;
}
.postEntryHeaderWebhook h3{
    margin-top:-24px !important;
}
.postEntryHeaderWebhook .profileM:after {
    margin-top: 5px;
}
.new .postEntryHeaderWebhook h3{
    margin-top:-27px !important;
}
.new .postEntryHeaderWebhook .profileM:after {
    margin-top: 3px;
}
.postEntryHeader.postWithoutSignature .profileM:after{
    margin-top: 7px;
}
.postEntryHeader{
    margin-right: 20px;
}
article .postEntryHeader.postWithoutSignature .metaInfo{
    margin-top: -10px !important;
    margin-bottom: 24px !important;
}
a:active .profileM img{
    opacity:.7;
    filter:alpha(opacity=70);
}
.highlightableRow:active .profileM img{
    opacity:.95;
    filter:alpha(opacity=95);
}
.pickPersonM{
    background:#f2f2f2;
    border:1px dashed #aaa;
    text-indent:0;
    text-align:center;
    font-size:14px;
    line-height:40px;
    color:#8e8e8e;
}
.pickPersonM img{
    display:none;
}
.suggestProfileThumb .profileM{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    opacity:0.3;
    filter:alpha(opacity=30);
    background:rgba(0,0,0,.4);
}
.iPhone .suggestProfileThumb .profileM,
.iPad .suggestProfileThumb .profileM{
    -webkit-transform: translate3d(0,0,0);
}
.childFilter .profileM:before{
    color:#000;
    line-height:30px;
    font-size:14px;
    text-indent:2px;
}



/*************************************************
*  User Profiles: Small
*************************************************/
.profileS{
    background:#bbb;
    width:27px;
    height:27px;
    overflow:hidden;
    white-space:nowrap;
    line-height:38px;
    font-size:21px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.profileS img{
    height:28px;
    width:27px;
    margin:-1px 10px 0 0;
    opacity:.85;
    filter:alpha(opacity=85);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    background-position:center center;
    background-size:cover;
    background-color:#fff;
}
.profileS:before{content:"";
    width:27px;
    height:27px;
    line-height:27px;
    text-align:center;
    color:#fff;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:12px;
    text-shadow:none;
    text-indent:2px;
    display:block;
    position:absolute;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.profileS:after{
    content:attr(data-displayname);
}
.onlineStatus .profileS:after{
    content:attr(data-displayname);
    background:url(../images/statusOnline.png) right no-repeat;
    background-size:9px 9px;
    padding-right:12px;
}



/*************************************************
*  User Profiles: No Profile Photos
*************************************************/
.profileL.noProfilePhoto:before,
.profileM.noProfilePhoto:before,
.profileS.noProfilePhoto:before{
    content:attr(data-displayinitial);
    background-color:transparent;
}
.profileL.noProfilePhoto img,
.profileM.noProfilePhoto img,
.profileS.noProfilePhoto img{
    opacity:1;
    filter:alpha(opacity=100);
}
.newConnection .connectionPhoto .profileM.noProfilePhoto:before{
    line-height:100px;
    font-size:20px;
}
.profilePage .filterControl a.childFilter .profileM.noProfilePhoto:before{
    line-height:41px;
}



/*************************************************
*  User Profiles: Display Name Below
*************************************************/
.profileNameBelow{
    overflow:visible;
}
.profileNameBelow:after{
    content:attr(data-displayname);
    display:block;
    position:absolute;
    font-size:10px;
    color:#666;
    width:40px;
    text-align:center;
    white-space:normal;
    line-height:10px;
    overflow:hidden;
    text-indent:0;
    margin-top:3px;
    margin-left:0;
    padding-right:0;
    max-height:22px;
}
.filterControl .profileNameBelow:after{
    padding-left:0;
}
.addChild .profileNameBelow,
.addSpouse .profileNameBelow{
    border-color:transparent;
}
.addChild .profileNameBelow:after,
.addSpouse .profileNameBelow:after{
    top:20px;
    top: 45px;
}



/*************************************************
*  User Profiles: Status Indicators
*************************************************/
.groupChatCount{
    background:transparent;
    border:1px solid #e4e5ed;
    z-index:1;
    position:absolute;
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    border-radius:9px;
    -moz-border-radius-topright: 0;
    -webkit-border-radius-topright: 0;
    border-top-right-radius: 0;
    font-size:12px;
    text-align:center;
    padding:0;
    width:39px;
    height:39px;
    margin:-2px 0 0 -47px;
    text-indent:-9999px;
    border-radius: 50%;
}
.groupChatCount:after{
    content:"";
    display:block;
    border:solid #dedede;
    border-width:1px;
    z-index:1;
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    border-radius:9px;
    -moz-border-radius-topright: 0;
    -webkit-border-radius-topright: 0;
    border-top-right-radius: 0;
    font-size:12px;
    text-align:center;
    padding:0;
    width:40px;
    height:40px;
    text-indent:-9999px;
    margin: -28px 0 0 2px;
    border-radius: 50%;
}



/*************************************************
*  User Profiles: Group Logo
*************************************************/
.profileM.groupLogo img,
.profileM.groupLogo:before{
    /*-moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;*/
}



/**************************************************************
*  COMMON:  List of Options with Explanations
*  OPTIONAL:  "circleThumbnail" - circular icon to left of opt
***************************************************************/
section.optionListing,
.formLayout section.optionListing{
    padding:20px 12px;
    border-bottom:1px solid #e4e5ed;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    cursor:pointer;
}
section.optionListing h2,
.formLayout section.optionListing h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:17px;
    line-height:24px;
    text-indent:0;
    margin:0;
    line-height:1;
    margin:12px 0 0 0;
}
section.optionListing p,
.formLayout section.optionListing p{
    font-size:15px;
    line-height:24px;
    color:#8e8e8e;
    padding:0;
    margin:4px 0 0 0;
}
section.optionListing p.important,
.formLayout section.optionListing p.important{
    color:#e86c6c;
}
section.optionListing p + p,
.formLayout section.optionListing p + p{
    margin-top:24px;
}
section.optionListing.circleThumbnail,
.formLayout section.optionListing.circleThumbnail{
    padding-left:100px;
    min-height:88px;
    padding-top:10px;
    padding-bottom:10px;
}
section.optionListing.circleThumbnail:before{
    content:"";
    background-color:#eef6f7;
    width:73px;
    height:73px;
    display:inline-block;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    position:absolute;
    /*margin:-10px 0 0 -88px;*/
    margin:0 0 0 -88px;
}





.behaviorOptBtns{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow:1px 1px 0px #d6d7d7;
    background:#fafafa;
    display:inline-block;
    line-height:0;
    float:left;
    margin:-8px 0 0 -1px;
    font-size:0;
}
.behaviorOptBtns a{
    border-left:1px solid #e8e8e8;
    display:inline-block;
    width:42px;
    height:35px;
    margin:0 !important;
}
.behaviorOptBtns a:first-of-type{
    border-right: none;
}
.behaviorUndoButton{
    background-position:-139px -423px;
}
.behaviorSelectMultipleButton{
    background-position:-75px -423px;
}
.behaviorFullScreenButton{
    background-position:-11px -423px;
}





/* Circular Thumbnails:  Behavior Management Options */
#behaviorManagementOptions section.optionListing.comingSoon h2:after{
    content:"Coming \00a0 Soon";
    color: #e86c6c !important;
    font-weight: normal;
    font-style: italic;
    font-size: 12px !important;
    display: inline-block !important;
    padding-left: 7px !important;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
#behaviorManagementOptions section.optionListing{
    padding-left:56px;
}
#behaviorManagementOptions .formLayout > label{
    position: initial !important;
}
#behaviorManagementOptions section.optionListing:before{
    background-color:transparent;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    width:48px;
    height:48px;
    margin-left:-52px;
    margin-top:-13px;
}
#behaviorManagementOptions .behaviorManagementAttendance:before{
    background-position:-71px -1498px;
}
#behaviorManagementOptions .behaviorManagementFullScreen:before{
    background-position:-582px -1674px;
}
#behaviorManagementOptions .behaviorManagementClassGoal:before{
    background-position:-327px -1498px;
}
#behaviorManagementOptions .behaviorManagementReports:before{
    background-position:-8px -1616px;
}
#behaviorManagementOptions .behaviorManagementAwardTypes:before{
    background-position:-6px -1496px;
}
#behaviorManagementOptions .behaviorManagementSettings:before{
    background-position:-644px -1615px;
}
#behaviorManagementOptions .behaviorManagementReset:before{
    background-position:-582px -1734px;
}



/* Circular Thumbnails:  Invite Input Types */
.optionListing.circleThumbnail.inviteEmail:before{
    background-position:-313px -1183px;
}
.optionListing.circleThumbnail.invitePlus:before{
    background-position:-443px -1004px;
}
.optionListing.circleThumbnail.inviteManual:before{
    background-position:-123px -1183px;
}
.optionListing.circleThumbnail.inviteBulk:before{
    background-position:-633px -1243px;
}
.optionListing.circleThumbnail.inviteAccessCode:before{
    background-position:-59px -1183px;
}

.optionListing.circleThumbnail.suggestedInvite:before{
    background-image: url(../images/suggestedInviteIcon.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.optionListing.circleThumbnail.browseMember:before{
     background-position:-60px -830px;
}

.optionListing.circleThumbnail.roleResidentialRenter:before{
    background-image: url(../images/Renter.png);
}
.optionListing.circleThumbnail.roleResidentialOwner:before{
    background-image: url(../images/Owner.png);
}
.optionListing.circleThumbnail.roleCommercialBusinessOwner:before{
    background-image: url(../images/BusinessOwner.png);
}
.optionListing.circleThumbnail.roleCommercialResidentialLandlord:before{
    background-image: url(../images/ResidentialLandlord.png);
}
.optionListing.circleThumbnail.roleEmployee:before{
    background-image: url(../images/Staff.png);
}
.optionListing.circleThumbnail.roleCityManager:before{
    background-image: url(../images/CityManager.png);
}
.optionListing.circleThumbnail.roleElectedOfficial:before{
    background-image: url(../images/ElectedOfficial.png);
}
.optionListing.circleThumbnail.roleSupervisor:before{
    background-image: url(../images/Supervisor.png);
}


/* Circular Thumbnails:  Role Types */
.optionListing.circleThumbnail.roleTeacher:before{
    background-position:-250px -1304px;
}
.optionListing.circleThumbnail.roleRoomParent:before{
    background-position:-186px -1306px;
}
.optionListing.circleThumbnail.roleParent:before{
    background-image: url(../images/Parent.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.optionListing.circleThumbnail.roleStudent:before{
    background-position:-314px -1304px;
}
.optionListing.circleThumbnail.rolePta:before{
    background-position:-123px -1365px;
}
.optionListing.circleThumbnail.roleSchoolAdmin:before{
    background-position:5px -1424px;
}
.optionListing.circleThumbnail.roleEveryOne:before{
    background-image: url(../images/everyone.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.optionListing.circleThumbnail.roleStudentParents:before{
    background-position:-505px -703px;
}

.optionListing.circleThumbnail.StudentSpecificCode:before{
    background-image: url(../images/StudentSpecificCode.png);
}

.optionListing.circleThumbnail.StudentGenericCode:before{
    background-image: url(../images/Generic_StudentCode.png);
}

.optionListing.circleThumbnail.StudentSpecificCode:before,
.optionListing.circleThumbnail.StudentGenericCode:before,
.optionListing.circleThumbnail.roleResidentialRenter:before,
.optionListing.circleThumbnail.roleResidentialOwner:before,
.optionListing.circleThumbnail.roleCommercialBusinessOwner:before,
.optionListing.circleThumbnail.roleCommercialResidentialLandlord:before,
.optionListing.circleThumbnail.roleEmployee:before,
.optionListing.circleThumbnail.roleCityManager:before,
.optionListing.circleThumbnail.roleElectedOfficial:before,
.optionListing.circleThumbnail.roleSupervisor:before{
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}



/* Circular Thumbnails:  Quick Tour Success */
.optionListing.circleThumbnail.tourSuccessEmail:before{
    background-position:-444px -521px;
}
.optionListing.circleThumbnail.tourSuccessContent:before{
    background-position:-505px -521px;
}

/* Circular Thumbnails:  Recommend Bloomz */
.optionListing.circleThumbnail.recommendColleagues:before{
    background-position:-641px -772px;
    background-color:#c1d979;

}
.optionListing.circleThumbnail.recommendEmail:before{
    background-position:-387px -772px;
    background-color:#8accee;
}
.optionListing.circleThumbnail.recommendBlogs:before{
    background-position:-451px -772px;
    background-color:#f1c56f;
}



/*************************************************
*  Welcome Messages
*************************************************/
.welcomeMsg,
.enterAppOptions{
    display:none;
}
.welcome1 .contentWelcome1,
.welcome2 .contentWelcome2,
.welcome3 .contentWelcome3,
.welcome4 .contentWelcome4,
.welcome5 .contentWelcome5{
    display:block;
}
.welcome1 .enterAppOptions,
.welcome2 .enterAppOptions,
.welcome3 .enterAppOptions,
.welcome4 .enterAppOptions,
.welcome5 .enterAppOptions{
    display:block;
}
.welcomeMsg{
    color:#fff;
    text-shadow:none;
    min-width:320px;
    text-align:center;
    overflow-x:hidden;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 0%, #f7f7f7 9%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(9%,#f7f7f7)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 0%,#f7f7f7 9%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 0%,#f7f7f7 9%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 0%,#f7f7f7 9%); /* IE10+ */
    background: linear-gradient(to bottom,  #ffffff 0%,#f7f7f7 9%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 )"; /* IE6-9 */
}
.welcomeMsg:before{
    content:"";
    width:220px;
    height:40px;
    margin:22px auto 0 auto;
    background-position:-270px -7px;
    display:none;
}
.welcomeMsg:after{
    content:"";
    width:287px;
    height:411px;
    display:block;
    margin:0 auto;
    left:50%;
    background:url(../images/spriteLanding@2x.jpg?03042016) no-repeat;
    background-position:-34px -10px;
    background-size:1148px 411px;
}
.welcomePage .subPage{
    padding-top:0;
}
.welcomePage .contentArea{
    background:none;
    /*min-height:0;*/
    padding:10px 0 0 0;
    margin:-4px auto 0 auto;
}
.welcomeMsg h2{
    margin:10px auto;
    font-size:19px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height:24px;
    color:#fff;
}
.welcomeMsg p{
    font-size:15px;
    margin:0 25px 15px 25px;
    line-height:18px;
    opacity:.8;
    filter:alpha(opacity=80);
}
.contentWelcome3 p{
    margin:0 17px 15px 17px;
}
.welcomeMsg .welcomePager{
    position:absolute;
    width:100%;
    bottom:0;
    padding:5px 0 70px 0;
    border-top:1px solid rgba(0,0,0,.2);
    box-shadow:0 -2px 2px rgba(0,0,0,.1);
}
.welcomeMsg .welcomePager.showingStudentLogin{
    bottom:0;
    padding-bottom:120px;
}
@media screen
and (min-height:580px)
and (max-width:767px){
    .welcomeMsg .welcomePager{
        box-shadow:none;
        border-top:none;
    }
}
@media screen
and (min-height:680px)
and (min-width:768px){
    .welcomeMsg .welcomePager{
        box-shadow:none;
        border-top:none;
    }
}
@media screen
and (max-height:777px)
and (min-width:768px){
    .welcomePage .subPage{
        height:94% !important;
        top:3% !important;
    }
}
@media screen
and (max-height:710px)
and (min-width:768px){
    .welcomeMsg h2{
        margin:24px 0 16px 0 !important;
    }
}
.welcomeMsg .welcomePager button{
    width:16px;
    height:16px;
    text-indent:-9999px;
    border:none;
    position:relative;
    padding:0;
    margin:0;
}
.welcomeMsg .welcomePager button:after{
    content:"";
    width:8px;
    height:8px;
    display:inline-block;
    background:rgba(227,227,227,1);
    position:absolute;
    left:4px;
    top:4px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.welcomeMsg .welcomePager button.selected:after{
    background:#2fc6fa;
}
.welcomePage .enterAppOptions{
    position:absolute;
    bottom:0;
    padding:12px 5px 5px 5px;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.welcomePage .enterAppOptions ul{
    display:table;
    table-layout:fixed;
    width:100%;
    padding:0;
    margin:0;
}
.welcomePage .enterAppOptions li{
    list-style:none;
    display:table-cell;
    padding:0 9px 0 0;
}
.welcomePage .enterAppOptions li:first-of-type{
    padding-left:5px;
}
.welcomePage .enterAppOptions li:last-of-type{
    padding-right:5px;
}
.welcomePage .enterAppOptions a{
    display:block;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    margin:0 0 10px 0;
    line-height:40px;
    text-align:center;
    border:1px solid #e8e8e8;
    background:#fff;
    width:100%;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    white-space:nowrap;
    overflow:hidden;
    box-shadow: 0 2px 6px rgba(37,37,37,0.1);
}
.welcomePage .enterAppOptions a:active{
    border:1px solid #bdbdbd;
    background:#e4e5ed;
}
.welcomePage .enterAppOptions a.primaryBtn{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
     border:1px solid #2fc6fa;
    color:#fff;
    text-shadow:none;
    background:#2fc6fa;

}
.welcomePage .enterAppOptions a.primaryBtn:active{
    border:1px solid #0076a8;
    background: rgb(4,163,220); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(4,163,220,1) 0%, rgba(15,144,193,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(57,191,232,1)), color-stop(100%,rgba(57,191,232,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(4,163,220,1) 0%, rgba(15,144,193,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(4,163,220,1) 0%, rgba(15,144,193,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(4,163,220,1) 0%, rgba(15,144,193,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(4,163,220,1) 0%, rgba(15,144,193,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#05a3dc', endColorstr='#0f90c3',GradientType=0 )"; /* IE6-9 */
}
.welcomePage .enterAppOptions .studentLoginBtn{
    padding:0 5px;
}
.welcomePage .scrollView{
    border:none;
    overflow:hidden;
}



/*************************************************
*  Welcome Messages 1
*************************************************/
.welcomePage .welcome1 .contentWelcome1{
    background:url(../images/herobg.gif) #66697c no-repeat;
    background-position:-152px bottom;
    background-size:311px 183px;
}
.welcomePage .welcome1 .contentWelcome1:after{
    content:"";
    background:url(../images/herofront.png)no-repeat;
    background-size:100%;
    width:100%;
    height:548px;
    position:absolute;
    top:118px;
    margin-left:0;
    left:0;
}
.welcomePage .welcome1 .contentWelcome1:before{
    position:relative;
    z-index:1;
    display:block;
}
.welcomePage .welcome1 .contentWelcome1 .contentArea:before{
    content:"";
    background:url(../images/herobg.gif) no-repeat;
    background-size:311px 183px;
    background-position:45px 0px;
    width:150px;
    height:75px;
    position:absolute;
    display:block;
    top:83px;
    right:0;
}
.welcomePage .welcome1 .contentWelcome1 .contentArea:after{
    content:"";
    width:100%;
    height:82px;
    background:#fff;
    display:block;
    position:absolute;
    top:0;
}
.welcomePage .welcome1 h2{
    position:absolute;
}
.welcomePage .welcome1 .welcomePager{
    border-top:none;
    box-shadow:none;
}



/*************************************************
*  Welcome Messages 2
*************************************************/
.welcomePage .welcome2 .contentWelcome2{
    background:#67697c;
}
.welcomePage .welcome2 .contentWelcome2 .welcomePager,
.welcomePage .welcome2 .enterAppOptions{
    background:#67697c;
}
.welcomePage .welcome2 .contentWelcome2:after{
    background-position:0 0;
}



/*************************************************
*  Welcome Messages 3
*************************************************/
/*.welcomePage .welcome3 .contentWelcome3{
    background:#97c800;
}
.welcomePage .welcome3 .contentWelcome3 .welcomePager,
.welcomePage .welcome3 .enterAppOptions{
   background:#97c800;
}
.welcomePage .welcome3 .contentWelcome3:after{
    background-position:-287px 0;
}
.welcomePage .welcome3 .enterAppOptions a.primaryBtn{
    background:#62d7ff;
    border:1px solid #62d7ff;
}
.welcomePage .welcome3 .welcomePager button.selected:after{
    background:#62d7ff;
}*/




/*************************************************
*  Welcome Messages 4
*************************************************/
.welcomePage .welcome4 .contentWelcome4{
    background:#43c1dc;
}
.welcomePage .welcome4 .contentWelcome4 .welcomePager,
.welcomePage .welcome4 .enterAppOptions{
    background:#43c1dc;
}
.welcomePage .welcome4 .contentWelcome4:after{
    background-position:-574px 0;
}
.welcomePage .welcome4 .enterAppOptions a.primaryBtn{
    background:#62d7ff;
    border:1px solid #62d7ff;
}
.welcomePage .welcome4 .welcomePager button.selected:after{
    background:#62d7ff;
}



/*************************************************
*  Welcome Messages 5
*************************************************/
.welcomePage .welcome5 .contentWelcome5{
    background:#e86c6c;
}
.welcomePage .welcome5 .contentWelcome5 .welcomePager,
.welcomePage .welcome5 .enterAppOptions{
    background:#e86c6c;
}
.welcomePage .welcome5 .contentWelcome5:after{
    background-position:-861px 0;
}




/*************************************************
*  Welcome Teacher
*************************************************/
.welcomingTeacher .actionBar h1{
    padding:4px 0;
}
.welcomingTeacher .formLayout section,
.iPhone .welcomingTeacher .formLayout section{
    border-bottom:none;
}
.welcomingTeacher .formLayout .defaultBtn + .defaultBtn{
    padding-top:0;
}
.welcomingTeacher .formLayout section p{
    padding:28px 20px 0 20px;
    text-align:center;
    color:#aaa;
}
.welcomingTeacher .emptyPanelMsg{
    margin:0;
    padding:0 !important;
    max-width:none;
}
.welcomingTeacher .emptyPanelMsg button{
    margin-top:10px;
    width:100%;
}
.welcomingTeacher .emptyPanelMsg button ~ button{
    margin-top:8px;
}
.welcomingTeacher .introVideo{
    background:#000;
    width:100%;
    padding:5px 0;
}
.welcomingTeacher div.videoPlayer{
    background:#000;
    width:100%;
    padding:5px 0;
}
.welcomingTeacher div.videoPlayer.videoPlayerWeb{
    padding:0;
}
.welcomingTeacher .btnWrapper{
    padding:0 15px 10px 15px;
    text-indent:0;
}
.welcomingTeacher .introVideo img{
    height: 600px;
    display:block;
    margin:0 auto;
    cursor:pointer;
}



/*************************************************
*  Email Verification Dialog
*************************************************/
.alertBox .dialogBox .emailVerificationDialog h1 strong{
    font-size:19px;
    margin-bottom:8px;
}
.alertBox .dialogBox .emailVerificationDialog p{
    margin:0 10px 18px 10px;
    font-size:15px;
}
.alertBox .dialogBox .emailVerificationDialog p a{
    color:#10994f;
    text-decoration:underline;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.alertBox .dialogBox .emailVerificationDialog p~a{
    color:#1ca0c8;
    text-decoration:underline;
    font-size:15px;
    display:inline-block;
    margin-bottom:20px;
}
.alertBox .dialogBox .newFreEmail input{
    padding-left:10px;
}



/*************************************************
*  Verify Email Address:  Change Email
*************************************************/
.changedEmailAddress section.formLayout section.emptyPanelMsg{
    padding-top:0;
    text-align:left;
}
.changedEmailAddress section.formLayout section.emptyPanelMsg p{
    padding:0;
    color:#000;
}
.changedEmailAddress section.formLayout section.emptyPanelMsg p strong{
    color:#10994f;
    text-decoration:underline;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.changedEmailAddress section.formLayout section.emptyPanelMsg a{
    text-decoration:underline;
    color:#1ca0c8;
}



/***************************************************
*  Not Supported Device Message
***************************************************/
.shadowBox.deviceSupport .subPage{
    padding-top:0;
}
.deviceSupport .scrollView{
    background:url(../images/deviceSupport.gif) no-repeat center 96px #f7f7f7;
    background-size:282px 600px;
}
.deviceSupport .scrollView:before{
    content:"";
    width:220px;
    height:40px;
    display:block;
    margin:22px auto 0 auto;
    background-position:-270px -7px;
}
.deviceSupport .scrollView .contentArea{
    background:none;
    text-align:center;
    max-width:210px;
    padding:0;
    margin:150px auto 0 auto;
}
.deviceSupport .scrollView h2{
    font-size:21px;
    line-height:27px;
    color:#546569;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.deviceSupport .scrollView p{
    margin:0;
    color:#849aa0;
    font-size:17px;
    line-height:27px;
}
.deviceSupport .scrollView .primaryBtn{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    border: 1px solid #2fc6fa;
    background: #2fc6fa;
    color: #fff;
    text-shadow: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    margin: 20px 0 5px 0;
    line-height: 40px;
    text-align: center;
    width: 100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
}




/*************************************************
*  Download App
*************************************************/
.downloadApp{
    padding-top:0 !important;
}
.downloadApp .actionBar{
    display:none;
}
.downloadApp section.formLayout section.emptyPanelMsg{
    padding-top:8px;
    background:transparent;
}
.downloadApp .emptyPanelMsg h2{
    font-size:29px;
    color:#000;
    line-height:1.25;
    margin-top:-6px;
}
.downloadApp .emptyPanelMsg p{
    margin:0 auto 18px auto;
    padding:0;
    max-width:274px;
}
.downloadApp .emptyPanelMsg p:after{
    content:"";
    display:block;
    margin:30px auto 0 auto;
    width:165px;
    height:159px;
    background:url(../images/downloadApp.png);
    background-size:165px 159px;
}
.downloadApp .emptyPanelMsg button{
    width:100%;
}
.downloadApp .emptyPanelMsg a{
    display:block;
    line-height:44px;
    color:#1ca0c8;
}
.downloadApp .toMobileSite{
    cursor:pointer;
    font-size:12px;
    color:#aaa;
    line-height:16px !important;
    text-indent:0;
    position:absolute;
    bottom:0;
    width:100%;
    text-align:center;
    padding:0px 20px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.downloadApp .toMobileSite p{
    border-top:1px solid #ddd;
    margin:0;
    padding:10px 0;
}
.downloadApp .toMobileSite a{
    text-decoration:underline;
    color:#1ca0c8;
    line-height:16px !important;
    display:inline;
}



/*************************************************
*  App Store Picker
*************************************************/
.appStorePicker .contentArea{
    display:table;
    height:100%;
    width:100%;
    padding:0;
}
.appStorePicker .contentArea .storeListing{
    display:table-cell;
    margin:0;
    padding:0;
    list-style:none;
    text-align:center;
    vertical-align:middle;
    height:100%;
}
.appStorePicker .contentArea .storeListing li{
    margin:12px auto;
    display:block;
    width:182px;
}
.appStorePicker .contentArea .storeListing li:first-of-type{
    margin-top:-25px;
}
.appStorePicker .contentArea .storeListing a{
    width:182px;
    height:60px;
    display:inline-block;
    text-indent:-9999px;
}
.appStorePicker .contentArea .storeListing a.appStoreDownload{
    background-position:-5px -349px;
}
.appStorePicker .contentArea .storeListing a.playStoreDownload{
    background-position:-198px -349px;
}

/*************************************************
*  Add a photo
*************************************************/
.addPhoto section.formLayout section.emptyPanelMsg{
    padding-top:8px;
    background:transparent;
}
.addPhoto .emptyPanelMsg h2{
    font-size:24px;
    color:#000;
    line-height:1.25;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    margin:7px 0 32px 0;
    text-indent:0;
}
.addPhoto .emptyPanelMsg p{
    margin:5px auto 24px auto;
    padding:0;
    max-width:250px;
}
.addPhoto .emptyPanelMsg button{
    width:100%;
}
.addPhoto .emptyPanelMsg a{
    display:block;
    line-height:44px;
    color:#1ca0c8;
}
.addPhoto .emptyPanelMsg img{
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    margin-bottom:0;
    border:1px solid rgba(0,0,0,.3);
    width:120px;
    height:120px;
}
.addPhoto .emptyPanelMsg button{
    max-width:220px;
    display:block;
    margin:0 auto;
}
.addPhoto .profileExamples{
    background:#e8e8e8;
    text-align:center;
    text-indent:0;
    padding:8px;
    line-height:0;
    border-bottom:1px dashed #c3c3c3 !important;
}
.addPhoto .profileExamples img{
    margin:8px 6px;
    width:48px;
    height:48px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    background-size:cover;
    background-position:center;
}
.addPhoto .isLoading{
    position:relative;
}

.addPhoto .isLoading:before{
    content:"";
    display:block;
    background:url(../images/ajax-loader.gif) center #e8e8e8 no-repeat;
    position:absolute;
    top:-107px;
    left:1px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    z-index:1;
    opacity:0.9;
    filter:alpha(opacity=90);
}



/*************************************************
*  Create Account
*************************************************/
#signUpGroupCode .createAccountPage .formLayout .linkControl,
#signUpScreen .createAccountPage .formLayout .linkControl,
#login .createAccountPage .formLayout .linkControl,
#signupData .createAccountPage .formLayout .linkControl,
#loginAsClassMessenger .loginAccountClassMessenger .formLayout .linkControl{
    /*padding-left:11px;*/
}
#signUpGroupCode .createAccountPage .formLayout .linkControl,
#getInvited .createAccountPage .formLayout .linkControl,
#signUpScreen .createAccountPage .formLayout .PTA{
    /*padding-left:40px;*/
}
#getInvited .createAccountPage .formLayout .signUpLanguage,
#signUpGroupCode .createAccountPage .formLayout .signUpLanguage,
#signUpScreen .createAccountPage .formLayout .signUpLanguage{
    padding-left:41px;
    padding-left: 145px;
    text-indent: 0;
    font-family: 'Gotham-book';
}
#accessCodeEnter .createAccountPage .formLayout,
#getInvited .createAccountPage .formLayout,
#signUpGroupCode .createAccountPage .formLayout,
#signUpScreen .createAccountPage .formLayout,
#login .createAccountPage .formLayout,
#signupData .createAccountPage .formLayout,
#editName .createAccountPage .formLayout,
#loginAsClassMessenger .loginAccountClassMessenger .formLayout{
    min-height:0;
    padding-top:0;
    padding:0;
}
#getInvited .createAccountPage footer.formLayout,
#signUpGroupCode .createAccountPage footer.formLayout,
#signUpScreen .createAccountPage footer.formLayout,
#login .createAccountPage footer.formLayout,
#signupData .createAccountPage footer.formLayout,
#loginAsClassMessenger .loginAccountClassMessenger footer.formLayout{
    background: transparent;
    border: none;
    box-shadow: none;
}
#loginAsClassMessenger .actionBar h1{
    padding:4px 48px;
}
.createAccountPage .formLayout,
.loginAccountClassMessenger .formLayout{
    padding:16px 15px 0 15px;
}
.createAccountPage .formLayout:empty,
.loginAccountClassMessenger .formLayout:empty{
    padding:0;
}
.createAccountPage .formLayout section,
.loginAccountClassMessenger .formLayout section{
    margin-left:0;
}
.createAccountPage .formLayout section:first-of-type,
.loginAccountClassMessenger .formLayout section:first-of-type{
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
}
.createAccountPage form.fbSigninOption,
.createAccountPage form.fbSignupOption{
    padding-bottom:0;
    margin-bottom:-16px;
}
.createAccountPage form.fbSigninOption section:last-of-type,
.createAccountPage form.fbSignupOption section:last-of-type{
    border-bottom:none;
}
.createAccountPage .facebookSignup + section{
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
}
.createAccountPage .formLayout section:last-of-type,
.loginAccountClassMessenger .formLayout section:last-of-type{
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
}
.createAccountPage .formLayout section.leadInput{
    display:block;
    padding:10px;
    text-indent:0;
    line-height:1.25;
    border:none;
}
.createAccountPage .formLayout section.leadInput label{
    text-indent:0;
}
.createAccountPage .formLayout section.leadInput textarea{
    margin-top:0px;
    height:46px;
    padding:0;
    margin-top:5px;
}
.createAccountPage .formLayout .ptaFooter{
    position:absolute;
    left:0;
    padding:15px 11px;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.createAccountPage .ptaSpecific{
    box-shadow: none !important;
    border: none !important;
}
.createAccountPage .facebookSignup{
    padding:0;
    margin:0;
    text-indent:0;
    background:#e8e8e8;
    border-bottom:none;
}
.createAccountPage .facebookSignup button{
    color:#fff;
    margin:0;
    width:100%;
    text-align:left;
    background:#3a589b;
    border:1px solid #103485;
    position:relative;
    text-indent:50px;
    font-size:18px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    padding:0 12px;
    height:44px;
    line-height:44px;
}
.createAccountPage .facebookSignup button:active{
    background:#1a3777;
    border:1px solid #001e60;
}
.createAccountPage .facebookSignup button:before{
    content:"";
    width:42px;
    height:42px;
    display:inline-block;
    position:absolute;
    left:0;
    top:0;
    background-position:-76px -956px;
    border-right:1px solid #103485;
}
.createAccountPage .facebookSignup button:active:before{
    border-right:1px solid #001e60;
}
.createAccountPage .facebookSignup span{
    display:block;
    text-align:center;
    margin-bottom:-5px;
}
.createAccountPage .facebookSignup p{
    text-align:center;
    font-size:13px;
    margin-top:7px;
    padding:0;
    color:#777;
}
.createAccountPage footer,
.loginAccountClassMessenger footer{
    padding-top:15px;
    text-align:center;
}
.createAccountPage footer p,
.loginAccountClassMessenger footer p{
    padding-bottom:50px;
}
.createAccountPage footer button,
.loginAccountClassMessenger footer button{
    width:100%;
    margin:0;
    font-size:18px;
    margin-bottom:-2px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    position:relative;
    z-index:2;
}
.createAccountPage footer a,
.loginAccountClassMessenger footer a{
    color:#53c8e6;
}
.createAccountPage .showPasswordControl,
.loginAccountClassMessenger .showPasswordControl{
    border-bottom:none !important;
}
#signUpGroupCode .createAccountPage .showPasswordControl,
/*#signUpScreen .createAccountPage .showPasswordControl,
#login .createAccountPage .showPasswordControl,*/
#signupData .createAccountPage .showPasswordControl,
#loginAsClassMessenger .loginAccountClassMessenger .showPasswordControl{
    padding:0 0 10px 0;
    background:#e8e8e8;
    position:relative;
    z-index:2;
}
#signUpGroupCode .createAccountPage .showPasswordControl .formLayout,
#signUpScreen .createAccountPage .showPasswordControl .formLayout,
#login .createAccountPage .showPasswordControl .formLayout,
#signupData .createAccountPage .showPasswordControl .formLayout,
#loginAsClassMessenger .loginAccountClassMessenger .showPasswordControl .formLayout{
    padding:0;
}
#signUpGroupCode .createAccountPage .showPasswordControl .formLayout>section,
#signUpScreen .createAccountPage .showPasswordControl .formLayout>section,
#login .createAccountPage .showPasswordControl .formLayout>section,
#signupData .createAccountPage .showPasswordControl .formLayout>section,
#loginAsClassMessenger .loginAccountClassMessenger .showPasswordControl .formLayout>section{
    background:transparent;
    border:none;
}
#signUpGroupCode .createAccountPage .showPasswordControl .formLayout>section>label,
#signUpScreen .createAccountPage .showPasswordControl .formLayout>section>label,
#login .createAccountPage .showPasswordControl .formLayout>section>label,
#signupData .createAccountPage .showPasswordControl .formLayout>section>label,
#loginAsClassMessenger .loginAccountClassMessenger .showPasswordControl .formLayout>section>label{
    font-size: 16px;
    color: #666;
    display: block;
    text-align: right;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-right: 64px;
}
#loginAsClassMessenger .textLoginClassMessenger{
    text-align: center;
}
#loginAsClassMessenger .textLoginClassMessenger .disclaimer{
    font-size:15px;
}
#loginAsClassMessenger .fieldClassMessenger{
    padding-left: 10px !important;
}
#loginAsClassMessenger .formClassMessenger{
    padding: 10px !important;
}



/*************************************************
*  Create Account: embedded on website
*************************************************/
.website{
    animation:none !important;
    -webkit-animation:none !important;
}
.website.getInvitedPage .createAccountPage{
    padding-top:0;
}
.website .createAccountPage .formLayout{
    padding:5px 5px 0 5px;
    min-height:0;
    margin-bottom:-5px;
}
.website .createAccountPage .formLayout section{
    display:inline-block;
    border:none;
    margin:0 6px 12px 0;
    box-shadow:none;
    position:relative;
    width:48%;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    line-height:32px;
}
.website .createAccountPage .formLayout section label{
    width:100%;
    height:22px;
    display:inline-block;
    text-indent:-9999px;
    margin-left:-10px;
}
.website .formLayout label input[type='text'],
.website .formLayout label input[type='email'],
.website .formLayout label input[type='password'],
.website .formLayout label input[type='date'],
.website .formLayout label input[type='datetime'],
.website .formLayout label input[type='datetime-local'],
.website .formLayout label input[type='time'],
.website .formLayout label input[type='tel'],
.website .formLayout label input[type='number'],
.website .formLayout textarea{
    padding-left:10px;
    padding-right:10px;
}
.website .createAccountPage .formLayout section.leadInput{
    width:98%;
    background:transparent;
    margin-top:30px;
    display:block;
}
.website .createAccountPage .formLayout section.leadInput label{
    height:auto;
    text-shadow:none;
    color:#fff;
    text-indent:0;
}
.website .createAccountPage .formLayout section.leadInput label span{
    display:block;
    color:#adb0d0;
    font-size:15px;
    margin:-5px 0 10px 0;
}
.website .createAccountPage .formLayout section.leadInput label textarea{
    background:#fff;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    padding:10px;
    height:116px;
}
.website .createAccountPage .formLayout section.selectPTA label{
    text-indent:10px;
    height:22px;
    font-size:18px;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-right:20px;
    line-height:22px;
    margin-bottom:-6px;
}
.website .createAccountPage .formLayout section label .linkControl{
    margin-top:-20px;
    margin-bottom:-10px;
    min-height:20px;
    line-height:20px;
    text-indent:54px;
}
.website .createAccountPage .formLayout section label .linkControl.placeholder{
    text-indent:-9999px;
}
.website .createAccountPage .formLayout section.selectPTA label{
    color:#aaa;
}
.website .createAccountPage .formLayout section.selectPTA label + label{
    padding-right:0;
}
.website .createAccountPage .formLayout section.selectPTA label + label .linkControl{
    background:#fff;
    position:relative;
    text-indent:0;
    padding-left:10px;
}
.website .createAccountPage .formLayout section label .drillDown:after{
    height:32px;
    background-position:-156px -1324px;
    margin-top:-8px;
    right:4px;
}
.website .createAccountPage .formLayout footer p{
    display:none;
}
.website .createAccountPage .formLayout .splitInput span.validationMsg{
    left:10px;
}
.website .createAccountPage .formLayout .highlight .splitInput{
    margin-bottom:21px;
}
.website .createAccountPage form + footer{
    padding:10px;
}
.website .createAccountPage form + footer p{
    text-align:left;
    padding:15px;
    background:#fffadb;
    font-size:20px;
    color:#666;
    text-shadow:none;
    box-shadow:1px 1px 3px rgba(0,0,0,.2);
    margin:0;
    line-height:1.35;
}
.website .createAccountPage .formLayout footer button{
    vertical-align:middle;
    color:#fff;
    font-size:20px;
    padding:0 20px;
    outline:none;
    display:inline-block;
    cursor:pointer;
    height:50px;
    line-height:50px;
}
.website .createAccountPage .backButton{
    display:none;
}
.website .createAccountPage{
    padding-top:0;
}
.website .createAccountPage .actionBar{
    display:none !important;
}
.website .createAccountPage .scrollView{
    background:#67697c;
    border-top:none;
    overflow:hidden !important;
}
.website .createAccountPage .signupRole{
    border-bottom:1px solid transparent;
    background:#67697c;
    margin-bottom:20px;
    padding-top:0;
}
.website .createAccountPage.roleSelected .signupRole{
    padding-top:63px;
}
.website .createAccountPage .signupRole h1{
    text-align:left;
    text-indent:-9999px;
    position:relative;
}
.website .createAccountPage .signupRole h1:after{
    content:"Select an option below";
    position:absolute;
    text-indent:0;
    display:block;
    left:0;
    top:0;
}
.website .createAccountPage .signupRole ul{
    margin:15px 0 0 0;
}
.website .createAccountPage .signupRole ul:before{
    content:attr(data-helpText);
    height:30px;
    line-height:30px;
    text-indent:5px;
    text-align:left;
    display:block;
    background:#66697c;
    position:absolute;
    top:71px;
    width:100%;
    z-index:2;
    color:#fff;
    text-shadow:none;
}
.website .createAccountPage .signupRole li{
    padding:74px 43px 0 5px;
    font-size:20px;
    color:#666;
    z-index:1;
}
.website .createAccountPage .signupRole li span{
    white-space:nowrap;
    color:#e3e3e3;
    text-shadow:none;
}
.website .createAccountPage .signupRole li span.selected{
    color:#fff;
}
.website .createAccountPage .signupRole li span:before{
    content:"";
    display:inline-block;
    background:#525463;
    width:20px;
    height:20px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    margin-right:10px;
    margin-bottom:-3px;
    vertical-align:baseline;
}
.website .createAccountPage .signupRole li span.selected:before{
    background:#53c8e6;
}
.website .createAccountPage .signupRole li span:after{
    display:none;
}
.website .createAccountPage .formLayout footer{
    text-align:left;
    padding-top:0;
}
.website .createAccountPage .formLayout footer button{
    background:#e86c6c;
     -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:none;
    box-shadow:0 1px 2px rgba(0,0,0,.4);
    box-shadow:none;
    height:41px;
    line-height:41px;
    width:auto;
    text-shadow:none;
}
.website .formLayout .highlight{
    background:#ffe5e4;
}
.website .formLayout .highlight .validationMsg{
    display:none;
}
.website .formLayout .highlight input::-webkit-input-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:-moz-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input::-moz-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:-ms-input-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:focus::-webkit-input-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:focus:-moz-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:focus::-moz-placeholder {
    color:#a94f4e;
}
.website .formLayout .highlight input:focus:-ms-input-placeholder {
    color:#a94f4e;
}
@media screen
and (max-width:355px)
and (min-height:320px){
    .website .createAccountPage .signupRole h1{
        width:174px;
        display:inline-block;
        white-space:nowrap;
        margin-bottom:0px;
        font-family:'focoitalic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
        font-size:19px;
    }
    .website .createAccountPage .signupRole ul{
        margin:15px auto 0 auto;
    }
    .website .createAccountPage .signupRole li{
        padding:74px 5px 0 5px;
    }
    .website .createAccountPage .signupRole p{
        padding-bottom:30px;
    }
}



/*************************************************
*  Create Account: Role Selected
*************************************************/
.website.getInvitedPage .createAccountPage.roleSelected .scrollView{
    overflow-y:auto;
}
.website.getInvitedPage .createAccountPage.roleSelected p{
    padding-left:15px;
    padding-right:15px;
}
.website .roleSelected .signupRole{
    animation:none;
    -webkit-animation:none;
    margin-top:-200px;
}
.website .roleSelected .signupRole li span{
    padding-top:10px;
}



/*************************************************
*  Create Account: Pick Role
*************************************************/
.getInvitedPage .createAccountPage .scrollView{
    overflow-y: auto;
}
.createAccountPage .signupRole{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background:#fff;
    height:100%;
    text-align:center;

}
.createAccountPage .signupRole .haveInvite{
    padding-bottom:16px;
    margin-bottom:16px;
    background:#fef7e4;
    border-bottom:1px solid #e4e5ed;
}
.createAccountPage .signupRole .haveInvite p{
    padding:0;
    margin-top:0;
    font-size:14px;
}
.createAccountPage .signupRole .haveInvite p input{
    width:230px;
    border:1px solid #e4e5ed !important;
    -webkit-appearance: none;
    outline:none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    line-height:42px;
    height:42px;
    margin-top:16px;
    padding:0 10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.createAccountPage .signupRole .haveInvite p .primaryBtn{
    display:none;
}

.createAccountPage .signupRole .haveInvite p input:focus + .primaryBtn,
.createAccountPage .signupRole .haveInvite p input:valid + .primaryBtn{
    display:inline-block;
    margin-left:8px;
}

.createAccountPage .signupRole h1{
    font-size:21px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    padding-left:8px;
    padding-right:8px;
}
.createAccountPage .signupRole>h1 + p{
    margin-top:-2px;
}
.createAccountPage .signupRole ul{
    display:block;
    margin:24px auto 0 auto;
    padding:0;
    position:relative;
    max-width:208px;
}
.createAccountPage .signupRole li{
    display:inline-block;
    list-style:none;
    width:50%;
    padding:84px 0 0 0;
    position:relative;
    cursor:pointer;
    margin-bottom:24px;
}
.createAccountPage .signupRole li span{
    display:inline-block;
    font-size:14px;
}
.createAccountPage .signupRole li div{
    position:relative;
}
.createAccountPage .signupRole li div:before{
    content:"";
    width:72px;
    height:72px;
    position:absolute;
    top:-80px;
    left:50%;
    margin-left:-36px;
    background:#eef6f7;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
.createAccountPage .signupRole li.roomParentRole div:before{
    background-position:-188px -1305px;
}
.createAccountPage .signupRole li.teacherRole div:before{
    background-position:-251px -1304px;
}
.createAccountPage .signupRole li.ptaLeaderRole div:before{
    background-position:-316px -1305px;
}
.createAccountPage .signupRole li.schoolRole div:before{
    background-position:4px -1424px;
}
.createAccountPage .signupRole li.coachRole div:before{
    background-position:-320px -1307px;
}
.createAccountPage .signupRole li.createGroup div:before{
    background-position:-316px -1305px;
}
.createAccountPage .signupRole li span:after{
    content:"";
    width:64px;
    height:2px;
    position:absolute;
    bottom:-10px;
    left:50%;
    margin-left:-32px;
}
.createAccountPage .signupRole li.parentRole span.selected:after{
    background:#bc4d80;
}
.createAccountPage .signupRole li.teacherRole span.selected:after{
    background:#85ad4e;
}
.createAccountPage .signupRole li.ptaLeaderRole span.selected:after{
    background:#5f89b5;
}
.createAccountPage .signupRole li.coachRole span.selected:after{
    background:#423f97;
}
.createAccountPage .signupRole li.createGroup span.selected:after{
    background:#5f89b5;
}



/*************************************************
*  Create Account: Role Selected
*************************************************/
.getInvitedPage .createAccountPage.roleSelected .scrollView{
    overflow-y:auto;
}
.getInvitedPage .createAccountPage.roleSelected p{
    padding-left:15px;
    padding-right:15px;
}
.roleSelected .signupRole{
    animation:roleSelected .6s;
    animation-timing-function:ease;
    -webkit-animation:roleSelected .6s;
    -webkit-animation-timing-function:ease;
    height:259px;
    margin-top:-224px;
}
.roleSelected .signupRole li span{
    padding-top:10px;
}



/*************************************************
*  Create Account: Join Class
*************************************************/
#_signUpGroupCode .inviteHeader{
    padding:0 !important;
}
#_signUpGroupCode .inviteHeader .userProfileInfo{
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
}
#_signUpGroupCode .inviteHeader .invitesWrapper{
    padding:15px 15px 4px 15px;
}



/*************************************************
*  Create Account: Which Child Attends?
*************************************************/
#signUpScreenChildren .inviteHeader{
    padding:0;
}
#signUpScreenChildren .childInfo:first-of-type,
#registerCitizens .childInfo:first-of-type{
    margin-top:0;
}
#signUpScreenChildren .childInfo,
#registerCitizens .childInfo{
    margin-top:25px;
    background:transparent;
}



/*************************************************
*  Create Account: Verify Email Address
*************************************************/
.verifyUserIdentity .emptyPanelMsg{
    padding-top:24px !important;
    text-indent:0;
}
.verifyUserIdentity .emptyPanelMsg img{
    width:152px;
    height:140px;
    margin-bottom:23px;
}
.verifyUserIdentity .emptyPanelMsg .messageWrapper{
    font-size:17px;
    line-height:1.35;
    margin-bottom:20px;
    color:#000;
}
.verifyUserIdentity .emptyPanelMsg .message {
    margin-top: 8px;
    display: block;
}
.verifyUserIdentity .emptyPanelMsg .emailAddress{
    color:#10994f;
    text-align: center;
    overflow: hidden;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
.verifyUserIdentity .btnWrapper button{
    display:block;
    width:100%;
}
.verifyUserIdentity a{
    color:#1ca0c8;
    margin-top:12px;
    display:block;
}
.verifyUserIdentity a.parentEmailChange{
    display: inline;
    text-decoration: underline;
}



/*************************************************
*  Login
*************************************************/
.createAccountPage section.loginSupport{
    border-bottom:0;
    z-index:2;
    /*background:#e8e8e8 !important;*/
}
.createAccountPage section.loginSupport p{
    font-size:15px;
    padding:0;
    margin:0;
    padding:8px 0 10px 0;
    cursor:pointer;
}
.createAccountPage section.loginSupport a{
    color:#53c8e6;
    line-height:2;
    display:inline;
}
.createAccountPage section.loginSupport a.forgotPswd{
    margin-top:12px;
}
.createAccountPage section.contactSupport{
    position:absolute;
    bottom:0;
    left:0;
    border-bottom:none;
    background:#e8e8e8;
    padding:0 20px !important;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    z-index:1 !important;
    position:relative;
    margin-top:15px;
}
.createAccountPage section.contactSupport p{
    border-top:1px solid #ccc;
    font-size:14px;
    text-align:center;
    color:#8e8e8e;
    padding:16px 0;
    margin:0;
}
.createAccountPage section.contactSupport a{
    display:inline;
}
.paddingTop{
    -webkit-margin-before:15px;
}
.skipImportButton{
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    margin: 0 0 10px 0;
    margin-left:185px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #e8e8e8;
    background: #53c8e6;
    width: 25%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
}

.importCleverClass .noMarginBottom{
   margin-bottom: 0 !important;
}
.importCleverClass .buttonIsNotSelected,
.importCleverClass .buttonIsSelected{
   width: 20px;
   height: 20px;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border-radius: 10px;
   padding: 0;
   border: 2px solid #ccc;
   background-color: #fff;
   position: relative;
   left: 15px;
   top: 10px;
   text-indent: -1000px;
   content: "";
}
.importCleverClass .buttonIsSelected{
   border: 2px solid #53c8e6;
   width: 20px;
   height: 20px;
   background-position: -214px -853px;
}

.orLine {
  text-align: center;
  padding-right:10px;
  padding-left:10px;
  border-bottom: 1px solid #a3a8af;
  line-height: 0.1em;
  margin: 10px 0 25px;
}

.orLineBgdClr{
   /*margin: 15px 135px 15px !important;
   width:45% !important;*/
   padding-right:7px !important;
   border-color: #e4e5ed;
}
.orLineBgdClr span{
   background-color:white !important;
}
.orLine span{
   background:#e8e8e8;
   padding:0 10px;
}
.formPadding .orLine span {
    background: #f0f2f4;
}
.signUpCleverBtn{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:18px;
    color:#fff;
    width:45%;
    margin:5px 0 5px 5px;
    border:1px solid;
    border-color:#2fc6fa #2fc6fa #27AAD7 #2fc6fa;
    background:#2fc6fa;
    padding:0 12px;
    line-height:40px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.logInBtn {
    background-color:white !important;
    color:black !important;
    font-weight:500 !important;
    border-color: #e4e5ed !important;
    width: 90%;
    margin-left: 0;
    font-size: 15px;
    border-radius:50px;
}
.logInBtn img {
   margin-right: 5px;
}

.easyImportClever {
    background:url(../images/Logo@1x.png) no-repeat right !important;
    text-align:left !important;
    float:right;
}
.easyImportGoogleClassroom {
    background:url(../images/google-icon.png) no-repeat right !important;
    text-align:left !important;
    float:right;
}
.importCleverClassesTab{
    min-height:10px;
    margin-top: 10px;
    position: relative;
}
.importCleverClassesTab div{
    display: grid;
    width: fit-content;
    position: absolute;
    right: 0;
    top: 0;
    grid-gap: 5px;
}
.importCleverClassesTab div button{
    height: 35px;
    /*font-size: 16px !important;*/
    line-height: 1px !important;
    color: #fff;
    border: 0;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    padding: 0 20px;
    border-radius: 50px;
    font-weight: bold;
}
.fadeOutUnImportableGroups{
    opacity:0.5 !important;
}
.loadingImport{
    content: "";
    background: rgba(0,0,0,.6);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: block;
    z-index:9999 !important;
}
.loadingImport img{
    position: absolute;
    top: 45%;
    left: 48%;
    width: 50px;
    align-items: center;
}
.loadingImport span{
    position: absolute;
    top: 55%;
    left: 43%;
    color: #e8e8e8;
}
.unClickable{
    opacity:0.5 !important;
}
.mySignUpsTabSelect {
    text-decoration:none !important;
    font-weight:bolder !important;
    font-size: 14.5px !important;
}
.contentsToBeImported{
    display: grid !important;
    grid-template-columns: 50%;
    grid-auto-flow: column;
}
.contentsToBeImported div span{
    font-size:14px;
}
.contentsToBeImported div{
    display: table-cell;
    line-height:28px;
    padding-bottom: 5px;
}
.contentsToBeImportedBtn{
    position:relative !important;
    margin-right:20px;
}
.noClickOnImport{
    pointer-events:none;
    color: #c3c3c3 !important;
    cursor: auto;
}
.instructionsTextButton{
    font-size: 10px;
    position: initial;
    display: inline-block !important;
    margin-left: 50px;
    line-height: 10px !important;
    width: 170px !important;
    text-align:left !important;
    text-indent:initial;
}
.myActivitiesTabSelect {
    font-weight:bolder !important;
    font-size: 14.5px !important;
    text-decoration: underline !important;
}

.contactsTypeColumn{
    display: flex;
    flex-flow: column;
    margin-left: 15px;
}

.contactsTypeColumn div{
    font-size: 14px;
    border-bottom-style: none;
    display: flex;
    margin-top: 3px;
}

.contactsTypeColumn div button{
    position: relative !important;
    margin-right: 10px;
    top: unset !important;
}

.contactsTypeColumn div span{
    line-height: 20px;
}

/*************************************************
*  No Margin Layout
*************************************************/
.noMarginLayout article{
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    border:none;
    border-top:1px solid rgba(255,255,255,.5);
    border-bottom:1px solid #f2f2f2;
    margin-bottom:0;
}
.noMarginLayout section>article:last-of-type{
    border-bottom:1px solid #f2f2f2;
}
.noMarginLayout .contentArea{
    padding:0;
}
.noMarginLayout .contentArea .filterControl{
    padding-right:15px;
}
.noMarginLayout .scrollView h1{
    text-indent:15px;
}



/*************************************************
*  No Margin Layout: Calendar Specific
*************************************************/
.noMarginLayout .contentArea section.calendarEvents{
    margin-bottom:0;
}
.noMarginLayout .contentArea section.calendarEvents .calendarEvent{
    border:none;
}
.noMarginLayout .contentArea section.calendarEvents article:first-of-type{
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.noMarginLayout .contentArea section.calendarEvents>:last-child{
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border-bottom:none;
}



/*************************************************
*  Persistent Empty Panel Message
*************************************************/
.persistentEmptyPanelMsg{
    font-size:15px;
    line-height:20px;
}
.persistentEmptyPanelMsg h2{
    font:normal 15px/1.35 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    padding:30px 30px 17px 25px;
    line-height:27px;
    color:rgba(0,0,0,.4);
    text-shadow:none;
    max-width:550px;
    /*background: #e8e8e8;*/
}
.persistentEmptyPanelMsg h2.transparent{
    background: transparent;
}
.persistentEmptyPanelMsg ul{
    margin:0;
    padding:0 30px 30px 45px;
    /*max-width:550px;*/
}
.persistentEmptyPanelMsg li{
    margin-bottom:10px;
    color:rgba(0,0,0,.4);
    text-shadow:none;
    font-family: 'Gotham-book';
}
.persistentEmptyPanelMsg li a{
    color:#1ca0c8;
    text-decoration:underline;
}


/*************************************************
*  Posts: Scheduled
*************************************************/
.contentArea div.scheduledPostsLink{
    display: flex;
    justify-content: flex-end;
}
.contentArea div.scheduledPostsLink section,
.contentArea section.highlightedLink{
    text-align:right;
    margin: 0;
    clear: both;
}
.contentArea div.scheduledPostsLink section a,
.contentArea section.highlightedLink a{
    font-size:14px;
    color:#1ca0c8;
    text-decoration:underline;
    margin-left:4px;
}
.contentArea div.scheduledPostsLink + #welcomeTeacherCard{
    margin-top:7px;
}
.contentArea div.scheduledPostsLink:empty + #welcomeTeacherCard{
    margin-top:0;
}
.contentArea #communityContent div.scheduledPostsLink{
    margin:10px 0 -7px 0;
}
.contentArea #communityContent div.scheduledPostsLink:empty{
    margin:0;
}




/*************************************************
*  Posts: Updates
*************************************************/
article{
    background:#fff;
    border:1px solid #e4e5ed;
    /*border-bottom:1px solid #e4e5ed;*/
    margin-bottom:10px;
    padding:10px 10px 48px 10px;
    position:relative;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .05);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    box-shadow: none;
    border-color: #e4e5ed;
}
article:after{
    content:"";
    width:4px;
    height:100%;
    max-height:60px;
    position:absolute;
    left:0px;
    top:0;
    opacity:0;
    visibility:hidden;
}
article .hgroup .profileM{
    vertical-align:top;
    overflow:hidden;
}
article .hgroup{
    margin-top:-10px;
    padding-left:50px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
    margin-bottom:16px;
}
article .entryOptions + p{
    padding-right:25px;
}
article>p{
    margin:0 0 -8px 0;
}
article .hgroup ~ p{
    margin-top:15px;
    padding-right:0;
}
article a .hgroup,
article .hgroup a{
    color:#000;
}
article h2{
    font-size:15px;
    height:40px;
    overflow:hidden;
}
article h3{
    margin-top:-23px;
    margin-bottom:3px;
    overflow:hidden;
    text-overflow:ellipsis;
}
article h3 span{
    height:24px;
    line-height:24px;
    display:inline-block;
}
article .hgroup .profileM{
    position:absolute;
    left:0;
    top:0;
    overflow:visible;
}
article .hgroup .profileM a{
    position:inherit;
}
article span.postTitle{
    margin:0;
    font:normal 16px/20px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
article span.postTitle:empty{
    display:none;
}
article p,
article .activityView{
    font-size:15px;
    line-height: normal;
    overflow:hidden;
    margin-bottom:0;
    word-wrap:break-word;
    display:block;
    cursor:pointer;
}
article p.commentedBy{
    overflow:hidden !important;
}
article p:empty{
    display:none;
}
article p span{
    cursor:pointer;
    margin-right:4px;
}
article p span.overage{
    background:#fbeed1 !important;
    color:#000;
}
article .videoPhoto {
    position: relative;
}

article p img,
article div.images img,
article img.captionImage,
article .videoPhoto img{
    max-width: 100%;
    margin:10px 0 0 0;
    display:block;
}
article time + span:before{
    content:" - ";
    font-family:'Gotham_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:14px;
    color:#8e8e8e;
    vertical-align:middle;
}
article.message time:after{
    display:none;
}
article.resharedUpdate p image{
    margin-bottom:10px;
}
article p time{
    color:#8e8e8e;
}
a.loadMorePosts{
    width:50px;
    height:50px;
    position:absolute;
    right:15px;
    margin-top:-15px;
    text-indent:-9999px;
    background-position:-125px -1088px;
    border:none;
}
article.urgentPost{
    border-top:3px solid #da3c37 !important;
}
.notScrolling article.update .hgroup:active{
    border-bottom:none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
article p span.postTitle{
    cursor:pointer;
    display:block !important;
}
.updates article p span{
    cursor:pointer;
    display:inline;
    margin-right:1px;
}
.updates article p span.singlePhoto{
    display:block;
    margin-bottom:10px;
}
.updates article p span.singlePhoto img {
    max-width:100%;
    width:auto;
    height:auto;
}
.updates article p img{
    cursor:pointer;
}
article .metaInfo{
    margin:-7px 0 16px 0;
    min-height:22px;
    cursor:pointer;
}
article .videoPhoto { width: 100%;
    max-width: inherit; }
article .videoPhoto img {
    max-width: 100%;
    width: 100%;
}
.postContentWrapper img.captionImage {
    max-width: 100%;
    width:auto;
    height:auto;
}
article .metaInfo .articleSource{
    display:none;
}
article .metaInfo .tags{
    display: inline-block;
    font-size: 10px;
    line-height: 20px;
    height: 20px;
    padding: 0 6px 0 20px;
    position: relative;
    margin: 20px 5px 5px 0;
    border: 1px solid;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
article .metaInfo .tags:before{
    height: 20px;
    position: absolute;
    left: 2px;
    top: -4px;
}
article .metaInfo .tagGeneral{
    display:none;
}
article .metaInfo time,
article .metaInfo .activityType{
    font-size: 14px;
    color: #8e8e8e;
    display:inline-block;
    vertical-align:middle;
    height:16px;
}
article .metaInfo .activityType:before{
    display:none;
}




/*************************************************
*  Full Screen Posts: Multiple Photo Layout
*************************************************/
.multiplePhotosWrapper{
    display:block !important;
    clear: both;
}
.updates article p span.multiplePhotos,
article p .multiplePhotos{
    display:inline-block;
    overflow:visible;
    position:relative;
}
article p .multiplePhotos img{
    max-width:90%;
    margin:10px auto 20px auto;
    border:5px solid #fff;
    box-shadow:0 0px 2px rgba(0,0,0,.3);
    z-index:2;
    position:relative;
    width:auto;
    height:auto;
}
.ie article p .multiplePhotos img{
    width: 415px;
}
.ie.hideSidePanel article p .multiplePhotos img{
    width: 615px;
}
article p .multiplePhotos:after{
    content:"";
    width:90%;
    height:75px;
    display:block;
    position:absolute;
    bottom:15px;
    left:50%;
    margin-left:-46%;
    box-shadow:0 1px 1px rgba(0,0,0,.2);
    background:#fff;
    transform: rotate(1deg);
    -ms-transform: rotate(1deg);
    -webkit-transform: rotate(1deg);
}
article p .multiplePhotos:before{
    content:"";
    width:88%;
    height:80px;
    display:block;
    position:absolute;
    bottom:10px;
    left:50%;
    margin-left:-46%;
    box-shadow:0 1px 1px rgba(0,0,0,.2);
    background:#fff;
    transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -webkit-transform: rotate(2deg);
}
article p .multiplePhotos .numPhotos{
    position:absolute;
    z-index:3;
    bottom:35px;
    right:5%;
    background:rgba(255,255,255,.7);
    display:inline-block;
    padding:0 10px;
    text-shadow:none;
    font-size:14px;
    line-height:20px;
    background: #53c8e6;
    padding: 2px 10px;
    color: #fff;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    border-radius: 50px 0 0 50px;
}



/*************************************************
*  Full Screen Posts: Post Updates
*************************************************/
.showFullScreen .scrollView{
    overflow:visible;
}
.Android .showFullScreen .scrollView{
    overflow:auto;
    border-top:1px solid black;
}
.showFullScreen .messages,
.Desktop .showFullScreen .sidePanel,
.showFullScreen .logo,
.showFullScreen .quickLinks,
.showFullScreen .mainNavBar,
.showFullScreen .actionBar,
.showFullScreen .chatInput,
.showFullScreen .photoAlbums article{
    display:none !important;
}
.showFullScreen .inlineBoxTop{
    position:fixed;
}
.showFullScreen .inlineBox .subPage{
    padding:0;
}
.showFullScreen .photoAlbums>div{
    overflow:visible;
}
.showFullScreen .photoAlbums article.fullScreen{
    display:block !important;
}
.showFullScreen .hgroup h2{
    text-indent:-9999px;
}
.Android .showFullScreen .mainPage,
.Android .showFullScreen .subPage{
    padding:0;
}
article.fullScreen{
    position:fixed;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background:#000;
    padding:0;
    border:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
article.fullScreen.update .resharedUpdate{
    position:absolute;
    top:0;
    padding:0;
    margin:0;
    border:0;
    max-width:100%;
    width:100%;
    height:100%;
    background:#000;
}
article.fullScreen .entryOptions,
article.fullScreen .hgroup h2 .profileM,
article.fullScreen .hgroup h3{
    display:none;
}
article.fullScreen .highlightableRow.hgroup, .cursorDefault .profileM{
    cursor:default;
}
article.fullScreen .highlightableRow.hgroup:active{
    background:transparent;
}
article.fullScreen p{
    position:relative;
    top:0;
    left:0;
    max-width:600px;
    max-height:600px;
    margin:0 auto;
    overflow:visible;
    width:100%;
    height:100%;
    text-align:center;
}
article.fullScreen p img{
    margin:0 auto;
    max-width:100%;
    max-height:100%;
}
article span.topCommandBar {
    display:none !important
}
article p a,
span.translateLink > a{
    color:#1ca0c8;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
article .hgroup ~ p a{
    color:#1ca0c8;
    text-decoration:none;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
article.fullScreen span.topCommandBar {
    right:0;
    top:0;
    position:fixed;
    color:rgba(255,255,255,.5);
    background:rgba(255,255,255,0);
    text-shadow:none;
    z-index:6000;
    display:block !important;
}
article a.downloadBtn,
article a.doneBtn {
    float:right;
    color:rgba(255,255,255,.5);
    background:rgba(255,255,255,0);
    text-shadow:none;
    z-index:6000;
    display:block;
    text-indent:0;
    padding:8px 16px;
    text-align:right;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    text-decoration:none;
}
article.fullScreen p span{
    display:none;
}
article.fullScreen p span.singlePhoto,
article.fullScreen p span.singlePhoto span{
    display:block;
}
article.fullScreen .feedbackCounts{
    bottom:20px;
    position:absolute;
    text-shadow:none;
    z-index:1;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
}
article.fullScreen .feedbackCounts .sharedWith{
    right:16px;
    position:absolute;
}
.postView article.fullScreen footer,
article.fullScreen footer{
    border-top:1px solid #000;
    box-shadow:0 -20px 40px rgba(0,0,0,1);
    display:block;
}
article.fullScreen footer ul{
    background:#333;
}
article.fullScreen footer li{
    background-color:#333;
    border-right:1px solid #000 !important;
    text-shadow:none;
}
article.fullScreen footer li:active{
    background-color:#222;
    border-right:1px solid #000;
    text-shadow:none;
}
article.fullScreen footer li:before{
    opacity:.5;
    filter:alpha(opacity=50);
}
article.fullScreen footer li.likeSelected:before{
    opacity:1;
    filter:alpha(opacity=100);
}
.postView article.fullScreen .metaInfo,
article.fullScreen .metaInfo{
    position:absolute;
    bottom:20px;
    text-shadow:none;
    z-index:1;
    width:100%;
    padding:0 10px;
    margin-bottom:30px;
    overflow:hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    white-space:nowrap;
}



/*************************************************
*  Full Screen Profile Photos
*************************************************/
.showFullScreen .profileOthers .scrollView .theirProfile,
.showFullScreen .profileMyStudent .scrollView .theirProfile,
.showFullScreen .profileOthersChild .scrollView .theirChildProfile{
    width:100%;
    height:100%;
    position:fixed;
    left:0;
    top:0;
}
.showFullScreen .profileOthers .scrollView .theirProfile .profileXL,
.showFullScreen .profileMyStudent .scrollView .theirProfile .profileXL,
.showFullScreen .profileOthersChild .scrollView .theirChildProfile .profileXL{
    position:fixed;
    width:100%;
    height:100%;
    left:1px;
    top:0;
    padding:15px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background:#000;
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    color:#fff;
    text-shadow:none;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
.showFullScreen .profileOthers .scrollView .theirProfile .profileXL img,
.showFullScreen .profileMyStudent .scrollView .theirProfile .profileXL img,
.showFullScreen .profileOthersChild .scrollView .theirChildProfile .profileXL img{
    display:block;
    margin:0 auto 10px auto;
    width:100%;
    max-width:300px;
    height:300px;
}
.showFullScreen .profilePage .userProfileInfo ul{
    display:none;
}
.showFullScreen .profilePage{
    overflow:visible;
}
.showFullScreen .verifiedParentBadge{
    display:none;
}



/*************************************************
*  Post Footers: Likes/Comments
*************************************************/
article.noFooter{
    padding-bottom:0;
}
article.noFooter .metaInfo{
    margin-bottom:10px;
}
article.noFooter .connectionPhoto{
    margin-bottom:0;
}
article.noFooter>footer{
    display:none;
}
article .imageFeedbackControl,
article footer{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#8e8e8e;
    font-size:15px;
    border-top:1px solid #e4e5ed;
    position:absolute;
    bottom:2px;
    left:1px;
    width:99%;
    background:#fafafa;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
}
article .imageFeedbackControl ul,
article footer ul{
    margin:0;
    padding:0;
    list-style:none;
    display:block;
    width:100%;
    white-space:nowrap;
}
article .imageFeedbackControl li,
article footer li{
    height:39px;
    line-height:39px;
    display:inline-block;
    cursor:pointer;
    padding:0 8px;
    font-size:15px;
    border-right:1px solid #e4e5ed;
}
article footer li:only-child{
    border-right:none !important;
}
article .imageFeedbackControl li.like,
article .imageFeedbackControl li.comment,
article footer li.like,
article footer li.likeSelected,
article footer li.thank,
article footer li.thankSelected,
article footer li.share,
article footer li.comment{
    height:39px;
    line-height:39px;
    border:none;
    border-right:1px solid #e4e5ed;
    text-align:center;
    margin:0;
    position:relative;
}
article .imageFeedbackControl li.like,
/*article footer li.like*/ {
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    text-indent:0;
    text-align:left;
    white-space:nowrap;
    overflow:visible;
    padding:0 4px 0 0;
}
article .imageFeedbackControl li.like:before,
article footer li.like:before,
article footer li.likeSelected:before{
    content:"";
    float:left;
    width:44px;
    height:37px;
}
article footer li.like.disabled{
    opacity: .4;
    filter: alpha(opacity=40);
    cursor:auto;
}
article footer{
    height:40px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:hidden;
    background:transparent;
    width:100%;
}
article footer li{
    vertical-align:top;
    text-align:center;
    color:#707b7f;
}
article .imageFeedbackControl{
    clear: both;
    display: block;
}
article footer li.like:before,
.likeActivity:before{
    background-position:-7px -1141px;
}

.addStudentTemplate:before{
    background-position:-72px -1141px;
}
article footer li.likeSelected:before,
.likeActivity.liked:before{
    background-position:-7px -1201px;
}
article footer li.share{
    min-width:64px;
}
article .imageFeedbackControl li.comment,
article footer li.comment{
    line-height:39px;
    height:39px;
    margin:0;
    min-width:100px;
}
article .imageFeedbackControl li.comment span,
article footer li.comment span{
    margin-right:6px;
    display:inline-block;
}
article .imageFeedbackControl li.comment span:last-of-type,
article footer li.comment span:last-of-type{
    margin-right:0;
}
article .imageFeedbackControl li.comment.disabled,
article footer li.comment.disabled {
    color: rgba(112, 123, 127, 0.5);
}
article footer.feedbackControl .secondaryBtn{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#707b7f;
}
article footer.feedbackControl li:only-child{
    width:100%;
    text-align:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border-right:none;
}
article.teacherPost footer li.share{
    min-width:42px;
    padding:0 10px;
}
article.teacherPost footer li.comment{
    min-width:108px;
    padding:0 10px;
}
article footer li.thank{
    display:none;
    color:#8e8e8e;
    padding:0 10px;
    min-width:76px;
}
article footer li.thankSelected{
    color:#ff5b88;
}
article footer li.thank.plural:after{
    content:"s";
}
article .imageFeedbackControl li.comment .plural:after,
article footer li.comment .plural:after{
    content:"s";
}
article footer li:active,
article footer li.addConnection:active{
    background:#f1f1f1;
}
article .feedbackCounts{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    vertical-align:middle;
    padding:0 0 0 90px;
    margin:10px 0 20px 0;
    height:24px;
    text-align:right;
    overflow:hidden;
}
article .feedbackCounts .counts{
    position:absolute;
    padding-left:10px;
    left:0;
    margin-top:-1px;
    text-align:left;
}
article .feedbackCounts .counts:before{
    display:none;
}
article .feedbackCounts .counts span{
    padding-right:6px;
}
article .feedbackCounts span{
    color:#8e8e8e;
    font-size:15px;
    white-space:nowrap;
}
article .feedbackCounts span:before{
    content:"";
    display:inline-block;
    width:20px;
    height:24px;
    vertical-align:middle;
}
article .feedbackCounts>span{
    padding-right:0;
}
article .feedbackCounts>span:before{
    display:none;
}
article .feedbackCounts .like:before{
    background-position:-150px -1150px;
}
article .feedbackCounts .comment:before{
    background-position:-214px -1150px;
}
article .feedbackCounts .sharedWith{
    margin-top:1px;
    padding-right:0;
}
article .feedbackCounts .sharedWith span{
    padding:0;
}
article .feedbackCounts .sharedWith span:before{
    display:none;
}
article .feedbackCounts .sharedWith:before{
    width:28px;
    height:28px;
    margin-top:-7px;
}
article.teacherPost footer li.thank{
    display:inline-block;
}
article.teacherPost footer li.like{
    display:none;
}
article.teacherPost .feedbackCounts .like:before{
    display:none;
}
article.teacherPost .feedbackCounts .like:after{
    content:"\0000a0thank";
}
article.teacherPost .feedbackCounts .like.plural:after{
    content:"\0000a0thanks";
}
.postView.teacherPostDetails .chatInput button.like:before,
.postView.teacherPostDetails .chatInput button.likeSelected:before{
    display:none;
}
.postView.teacherPostDetails .chatInput button.like:after{
    content:"Thx!";
    color:#8e8e8e;
    display:block;
    width:46px;
    height:39px;
    text-indent:10px;
    position:absolute;
    left:0;
    top:-3px;
}
.postView.teacherPostDetails .chatInput button.likeSelected:after{
    color:#ff5b88;
}



/*************************************************
*  Post Footers: Add to Circle
*************************************************/
article footer li.addConnection{
    height:39px;
    line-height:39px;
    border:none;
    background:none;
    text-align:left;
    width:100%;
    padding:0;
    color:#8e8e8e;
}
article footer li.addConnection:before{
    content:"";
    float:left;
    width:44px;
    height:37px;
    background-position:-71px -1141px;
    vertical-align:middle;
}




/*************************************************
*  Post Footers: Circle Listing Options
*************************************************/
.circles article footer{
    overflow:hidden;
    display:block;
    width:100%;
}
.circles article footer div{
    display:table-cell;
    border-collapse:collapse;
    border-right:1px solid #e4e5ed;
    text-align:center;
    vertical-align:top;
}
.circles article footer div:last-of-type{
    border-right:none;
}
.circles article footer button{
    height:39px;
    line-height:39px;
    padding:0 4px;
    margin:0;
    border:none;
    text-align:center;
    width:100%;
    overflow:hidden;
    position:relative;
}
.circles article footer button.suggested:before{
    content:"*";
    font-size:20px;
    text-align:left;
    display:block;
    color:#fff;
    width:30px;
    height:30px;
    text-indent:12px;
    line-height:57px;
    position:absolute;
    right:-15px;
    top:-15px;
    background:#53c8e6;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari and Chrome */
}
.circles article footer button.suggested,
.circles article footer button.addPeople{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#000;
}



/*************************************************
*  Post Type: Announcements
*************************************************/
.announcementUpdates article .feedbackCounts,
.announcementUpdates article .feedbackControl,
.announcementUpdates article .profileM img,
.announcementUpdates article .profileM:before,
.announcementUpdates article h3,
.announcementUpdates article:after,
.announcementUpdates .tags{
    display:none;
}
.announcementUpdates article{
    padding-bottom:20px;
}
.announcementUpdates .carousel article{
    margin-bottom:0;
}
.announcementUpdates article .hgroup{
    background:#006b8d;
    padding:0 10px;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    width:100%;
    margin:-19px 0 0 -10px;
    -moz-border-radius-topleft:3px;
    -webkit-border-radius-topleft:3px;
    border-top-left-radius:3px;
    -moz-border-radius-topright:3px;
    -webkit-border-radius-topright:3px;
    border-top-right-radius:3px;
}
.announcementUpdates article .hgroup h2{
    height:28px;
}
.announcementUpdates article .entryOptions{
    height:28px;
    text-indent:-9999px;
}
.announcementUpdates article .entryOptions:before{
    background-position:-199px -1146px !important;
    height:28px !important;
    opacity: .6 !important;
    filter: alpha(opacity=60) !important;
}
.announcementUpdates article .entryOptions:hover:before{
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}
.announcementUpdates .profileM:after{
    font-family: Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    font-size:15px;
    margin-left:0;
    text-indent:10px;
    line-height:30px;
    height:auto;
    color:#fff;
    text-shadow:none;
}
.announcementUpdates article p{
    margin-top:12px;
    height:64px;
    overflow:hidden;
}
.announcementUpdates article .hasImg{
    padding-left:72px;
}
.announcementUpdates article .hasImg .singlePhoto{
    position:absolute;
    top:44px;
    left:10px;
    width:64px;
    height:64px;
    margin:0;
}



/* Announcement Cover*/
.announcementUpdates article.hasImg{
    background:rgba(0,0,0,.1);
}
.announcementUpdates article.hasImg .hgroup{
    z-index:3;
    cursor:default;
}
.announcementUpdates article.hasImg .entryOptions{
    z-index:4;
}
.announcementUpdates article.hasImg p,
.announcementUpdates article.hasImg .metaInfo,
.announcementUpdates article.hasImg .articleSource,
.announcementUpdates article.hasImg .metaInfo time,
.announcementUpdates article.hasImg .metaInfo time + span:before{
    position:relative;
    color:rgba(255,255,255,.95);
    text-shadow:0 1px 5px rgba(0,0,0,.6);
    z-index:3;
}
.announcementUpdates article.hasImg p .postTitle{
    font-size: 17px;
    line-height: 21px;
    margin-top: -3px;
}
.announcementUpdates article.hasImg p{
    margin:0 0 -7px 0;
    padding-top:52px;
    height:34px;
    font-size:14px;
    cursor:pointer;
}
.announcementUpdates article.hasImg p span{
    height:34px;
    line-height:18px;
}
.announcementUpdates article.hasImg:before{
    content:"";
    display:block;
    width:100%;
    height:100%;
    position:absolute;
    left:0;
    top:0;
    background:linear-gradient(to top, rgba(0,0,0,.7), rgba(0,0,0,.4), rgba(0,0,0,.2), rgba(0,0,0,.2));
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    z-index:2;
}
.announcementUpdates article span.singlePhoto.videoPhoto{
    display:none !important;
}
.announcementUpdates article .bgCover{
    display:none;
}
.announcementUpdates article.hasImg .bgCover{
    display:block;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
    background-image:url(http://dev.bloomz.net:8000/api/photo/827f3c52-ea16-4030-925c-d8f0a3cfbd02?width=420&height=420);
    background-size:cover;
    background-position:center 25%;
    overflow:hidden;
    -webkit-border-radius:10px 10px 3px 3px;
    -moz-border-radius:10px 10px 3px 3px;
    border-radius:10px 10px 3px 3px;
}







.announcementUpdates article p span.postTitle{
    height:auto;
    margin-bottom:0;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height:21px;
}
.announcementUpdates article p span{
    height:44px;
    overflow:hidden;
    line-height:21px;
}
.announcementUpdates article .metaInfo{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color:#8e8e8e;
    margin-bottom:0;
    margin-top:8px;
}
.announcementUpdates article .metaInfo .articleSource{
    display:inline;
}
.announcementUpdates article .articleSource,
.announcementUpdates article time{
    font-size:14px;
    color:#8e8e8e;
    font-family:'Gotham_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    vertical-align: middle;
}
.announcementUpdates:empty{
    display:none;
}







.announcementUpdates article p span.translateLink{
    background:#fff;
    position:absolute;
    height:24px;
    margin:-24px 0 0 0;
    overflow:visible;
    bottom:47px;
}
.announcementUpdates article p span.translateLink:before{
    content:"";
    height:24px;
    width:35px;
    display:inline-block;
    vertical-align:middle;
    position:absolute;
}


.announcementUpdates article p[dir="ltr"] span.translateLink{
    right:0;
    padding:0 15px 0 5px;
}
.announcementUpdates article p[dir="ltr"] span.translateLink:before{
    margin-left:-40px;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}



.announcementUpdates article p[dir="rtl"] span.translateLink{
    left:0;
    padding:0 5px 0 15px;
}
.announcementUpdates article p[dir="rtl"] span.translateLink:before{
    margin-right:-40px;
    background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 )"; /* IE6-9 */

}




/*************************************************
*  Post Type:  Welcome Get Started
*************************************************/
.welcomeGetStarted .hgroup:after,
.welcomeGetStarted .steps,
.welcomeGetStarted .steps .completed:before,
.welcomeGetStarted .steps .current:before,
.welcomeGetStarted .steps li.current:last-of-type a:after{
    background-image:url(../images/welcomePost.png?04132015);
    background-size:1000px 377px;
}
.welcomeGetStarted{
    padding:0;
    margin-top:3px;
}
.welcomeGetStarted .steps{
    background-position:left bottom;
    margin:0 0 40px 0;
    padding:21px 0 64px 60px;
    list-style:none;
    background-repeat: no-repeat;
}
.welcomeGetStarted .steps li{
    background-color:#fff;
}
.welcomeGetStarted .steps li.hide {
    display: none;
}
.welcomeGetStarted .hgroup{
    background-color:#97e2fa;
    width:100%;
    padding:0;
    margin:0;
    border:1px solid #8cd4ea;
    border-bottom:0px;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    height:91px;
}
.welcomeGetStarted .hgroup:after{
    content:"";
    width:95px;
    height:90px;
    display:block;
    background-position:-78px -208px;
    right:5px;
    position:absolute;
}
.welcomeGetStarted .hgroup h2{
    color:#171949;
    text-shadow:none;
    position:absolute;
    left:0;
    bottom:50%;
    margin:0 0 -5px 0;
    line-height:1;
    height:auto;
    width:100%;
    padding:0 0 0 18px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font:24px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.welcomeGetStarted .hgroup h3{
    color:#171949;
    text-shadow:none;
    position:absolute;
    left:0;
    top:50%;
    margin:5px 0 0 0;
    line-height:1.25;
    white-space:normal;
    width:100%;
    padding:0 0 0 18px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:15px;
}
.welcomeGetStarted.noFooter .steps{
    margin-bottom:0;
}
.welcomeGetStarted .steps a{
    color:#1ca0c8;
    font:14px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height:32px;
}
.welcomeGetStarted .steps a:hover{
    text-decoration:underline;
}
.welcomeGetStarted .steps li:before{
    content:"";
    background:rgba(142, 142,142, .4);
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    width:9px;
    height:9px;
    display:block;
    position:absolute;
    margin:11px 0 0 -36px;
}
.welcomeGetStarted .steps .completed a,
.healthCheckStepList .steps .completed a{
    color:#aaaaaa;
}
.welcomeGetStarted .steps .completed:before{
    content:"";
    background-color:transparent;
    width:28px;
    height:28px;
    display:block;
    background-position:-206px -204px;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    margin:1px 0 0 -45px;
}
.welcomeGetStarted .steps .current:before{
    content:"";
    background-color:transparent;
    width:28px;
    height:28px;
    display:block;
    background-position:-206px -270px;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    margin:1px 0 0 -45px;
}
.welcomeGetStarted:not(.parentCard) .steps li:last-of-type{
    background:transparent;
    position:absolute;
    right:15px;
    bottom:54px;
}
.welcomeGetStarted.noFooter:not(.parentCard) .steps li:last-of-type{
    bottom:14px;
}
.welcomeGetStarted:not(.parentCard) .steps li:last-of-type a{
    color:#b8b8b8;
    font-style:italic;
    font-size:14px;
    display:inline-block;
    pointer-events:none;
}
.welcomeGetStarted:not(.parentCard) .steps li:last-of-type a:hover{
    text-decoration:none;
}
.welcomeGetStarted:not(.parentCard) .steps li:last-of-type:before{
    display:none;
}
.welcomeGetStarted:not(.parentCard) .steps li.current:last-of-type a{
    pointer-events:auto;
    color:#3a3d87;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.welcomeGetStarted:not(.parentCard) .steps li.current:last-of-type a:after{
    content:"";
    background-color:transparent;
    width:40px;
    height:28px;
    display:inline-block;
    vertical-align:middle;
    background-position:-266px -273px;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    margin:0 -4px 0 8px;
}




/*************************************************
*  Post Type:  Teachers You May Know
*************************************************/
article.teachersYouMayKnow{
    padding:0;
    margin-top:10px;
}
article.teachersYouMayKnow .hgroup{
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    border:solid #aac7c6;
    border-width:1px 1px 0 1px;
}
.teachersYouMayKnow .hgroup{
    display: table;
    width: 100%;
    padding: 0;
    background:#c6dddc;
    margin-top:0;
    min-height:90px;
    position:relative;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.teachersYouMayKnow .hgroup:before{
    content:"";
    width:204px;
    height:114px;
    background-image:url(../images/tymkPost.png?07182017);
    background-size:cover;
    display:block;
    margin:15px 0 0 -102px;
    position:absolute;
    left:50%;
}
.teachersYouMayKnow .hgroup h2{
    display: table-cell;
    vertical-align: middle;
    overflow:visible;
    height:auto;
    font:16px/18px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-weight:normal;
    color:#284342;
    text-shadow:0 1px 0 rgba(255,255,255,.3);
    text-align:center;
    padding:132px 16px 16px 16px;
}
.hideSidePanel.Desktop .teachersYouMayKnow .hgroup h2{
    padding-left: 50px;
    padding-right: 50px;
}
.teachersYouMayKnow .hgroup h2 a{
    color:#1ca0c8;
    text-decoration: underline;
}
.teachersYouMayKnow .formLayout{
    margin-bottom:39px;
}
.teachersYouMayKnow .inputGroupV{
    overflow:hidden;
}
.teachersYouMayKnow .inputGroupV>span{
    display:block;
    line-height:0;
}
.teachersYouMayKnow .seeMore ~ label{
    width:40px !important;
    padding:12px 0 !important;
    border:none !important;
    display:inline-block !important;
    margin-left:-10px !important;
}
.teachersYouMayKnow .seeMore ~ a{
    color:#1ca0c8;
    display:inline-block;
    line-height:49px;
    vertical-align:top;
    padding:0 20px 0 0;
    text-indent:0;
    width:100%;
}
.scheduledPostsLink ~ #teachersYouMayKnowCard .update.teachersYouMayKnow{
    margin-top:32px;
}




/*************************************************
*  Post Type:  Carousel
*************************************************/
.carousel{
    white-space:nowrap;
    overflow-y:hidden;
    overflow-x:scroll;
    -webkit-overflow-scrolling:touch;
}
.carousel *{
    -webkit-overflow-scrolling:auto;
}
.carousel::-webkit-scrollbar{
    height:1px;
}
.carousel::-webkit-scrollbar-track{
    background:#e8e8e8;
}
.carousel::-webkit-scrollbar-thumb{
    background:#e8e8e8;
}
.Desktop  .carousel{
    overflow-x:scroll;
}
.Desktop .carousel::-webkit-scrollbar{
    height:8px;
}
.Desktop .carousel::-webkit-scrollbar-track{
    background:#e8e8e8;
}
.Desktop .carousel::-webkit-scrollbar-thumb{
    background:rgba(0,0,0,.05);
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}
.Desktop .carousel:hover::-webkit-scrollbar-thumb{
    background:rgba(0,0,0,.3);
}



/*************************************************
*  Post Type:  Announcement Carousel
*************************************************/
.announcementUpdates .carousel{
    height:160px;
    padding:0;
    width:100%;
    margin-left:0;
    margin-bottom:-18px;
}
.announcementUpdates .carousel>div{
    display:inline-block;
    width:95%;
    margin:0 12px 0 0;
    white-space:normal;
    max-width:320px;
    vertical-align:top;
}
.announcementUpdates .carousel>div:only-child{
    width:100%;
    max-width:none;
}
.announcementUpdates .carousel article{
    height:150px;
}
.logoCover {
    text-indent: 0;
    color: white;
    font-size: 11px;
    font-weight: 800;
    text-shadow: none;
}

.sponsorLogo {
    height: 100% !important;
    max-height: 90px;
    display: flex !important;
    position: absolute !important;
    left: 90px !important;
    width: auto !important;
}

.sponsorLogo img{
    background-repeat:no-repeat !important;
    background-size:contain !important;
    bottom:0;
    background-position:center !important;
    cursor: pointer;
    width:62px !important;
    height:62px !important;
}

.postViewSponsorLogo:before {
    background-image: url(../images/giftbox.png);
    background-color:transparent;
    background-repeat: no-repeat;
    background-size: contain;
}
.postViewSponsorLogo:before {
    background-position: 4px -2px;
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    opacity: 0.6;
    padding-right: 7px;
}

/*************************************************
*  Post Type:  Announcement Carousel (DESKTOP)
*************************************************/
.Desktop .announcementUpdates .carousel{
    margin-bottom:18px;
    padding-bottom:6px;
}



/*************************************************
*  Post Type:  Upcoming & Calendar Events
*************************************************/
.calendarEvents article{
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
}
.calendarEvents article:after{
    max-height:200px;
}
.calendarEvents article.calendarEvent:first-of-type{
    padding-top:5px;
}
.calendarEvents article:first-of-type{
    border-top:1px solid #e4e5ed;
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
}
.calendarEvents>:last-child{
    padding-bottom:5px;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
}
.calendarEvent:after{
    max-height:200px;
}
.calendarEvent h3 span:empty{
    display:none;
}
.calendarEvent,
.calendarDateHeader{
    margin-bottom:0;
    border-top:none;
    border-bottom:none;
    padding-bottom:10px;
}
.calendarDateHeader{
    line-height:45px;
    height:45px;
    padding:0;
    border-top:1px solid #e4e5ed;
}
.calendarDateHeader h2{
    line-height:45px;
    height:45px;
    font-size:15px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:15px;
    margin:0;
    padding:0;
}
.calendarDateHeader .AddEventInline{
    height:44px;
    width:33px;
    background-position:-462px -1017px;
    text-indent:-9999px;
    position:absolute;
    right:2px;
    top:0;
    border:none;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.calendarDateHeader .AddEventInline:active{
    background-color:#f1f1f1;
}
.calendarEvent{
    padding:0 5px;
}
.calendarEvent h2{
    margin-top: 6px;
    overflow: hidden;
    overflow: visible;
    line-height: 20px;
    height: auto;
    font-family: gotham;
}
.calendarEvent h3.tagGeneralEvent{
    display:none;
}
.calendarEvent .hgroup{
    margin-top:-2px;
    padding:1px 5px 8px 80px;
    cursor:pointer;
}
.calendarEvent .hgroup h3{
    margin:-1px 0 0 0;
}
.calendarEvent .hgroup h3.tags{
    margin:-7px 0 -4px 0;
}
.calendarEvent .hgroup:active{
    border-bottom:none !important;
}
.calendarEvent .hgroup time{
    position:absolute;
    top:10px;
    left:10px;
    color:#000;
}
.calendarEvent .hgroup time:before{
    content:"";
}
.calendarEvent .driverSet{
    position:absolute;
    z-index:2;
    top:10px;
    right:10px;
    width:40px;
    height:40px;
    border:none;
    background:none;
}
.calendarEvent .driverSet .profileM{
    position:absolute;
    overflow:hidden;
    left:0;
    top:0;
}
.contentArea .calContainer:empty{
    display:none;
}



/*************************************************
*  Post Type:  Calendar Events - Tasks
*************************************************/
.volunteeredTasks{
    margin-top:-10px;
    padding-bottom:15px;
}
.volunteeredTasks .myTask{
    padding:18px 0 8px 120px;
    position:relative;
    cursor:pointer;
}
.volunteeredTasks .myTask:before{
    content:"";
    width:24px;
    height:24px;
    display:block;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    background:#ace67a;
    position:absolute;
    margin:-4px 0 0 -35px;
    background-position:-466px -904px;
    z-index:1;
}
.volunteeredTasks .myTask:after{
    content:"";
    width:2px;
    height:100%;
    display:block;
    background:#e4e5ed;
    position:absolute;
    margin-left:-24px;
    top:0;
}
.volunteeredTasks .myTask:last-of-type:after{
    height:20px;
}
.volunteeredTasks .myTask .taskTime{
    display:block;
    color:#8e8e8e;
    margin-top:4px;
}


/*************************************************
*  Post Type:  Event - Declined Invite
*************************************************/
article.declinedEvent h2{
    text-decoration: line-through;
}



/*************************************************
*  Post Type:  Event - Pending Invite
*************************************************/
article.pendingAcceptance .hgroup{
    border:1px dashed #aaa;
    padding:1px 5px 4px 79px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    color:#8e8e8e;
    margin-bottom:2px;
}
article.pendingAcceptance .hgroup time,
article.pendingAcceptance.calendarEvent h2.tags + h2 + h3,
article.pendingAcceptance.calendarEvent h2.tags + h2,
article.pendingAcceptance.calendarEvent h2.tagGeneralEvent + h2 + h3,
article.pendingAcceptance.calendarEvent h2.tagGeneralEvent + h2{
    color:#8e8e8e;
}
article.pendingAcceptance h2:after{
    height:36px;
    right:7px;
    top:7px;
}



/*************************************************
*  Post Type:  Event Invite
*************************************************/
.calendarInvite{
    padding-bottom:0;
    padding-left:15px;
}
.calendarInvite .hgroup{
    padding-left:0;
}
.calendarInvite .hgroup time{
    display:block;
    margin-top:8px;
}
#calendarViewControl .calendarInvite .hgroup time{
    margin-top:0 !important;
}
.calendarInvite .hgroup time:before{
    content:"";
}
.calendarInvite h3 .tags{
    margin:-3px 0 0 0;
}
.calendarInvite h3 .tags:first-of-type{
    margin-top:-4px;
}
.calendarInvite h3 .tags:last-of-type{
    margin-bottom:0;
}
.calendarInvite h2 span{
    font: 16px/20px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.calendarInvite h2 .profileM{
    font-weight:normal;
    font:14px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    background:transparent;
    text-indent:0px;
    margin-top:27px;
    color:#8e8e8e;
}
.calendarInvite h2 .profileM:before{
    display:none;
}
.calendarInvite h2 .profileM:after{
    margin-left:0;
    text-indent:20px;
}
.calendarInvite h2 .profileM img{
    display:none;
}
.calendarInvite h3{
    margin-top:13px;
    white-space:normal;
}
.calendarInvite .postBody{
    padding:0 20px 20px 20px;
}
.calendarInvite .postBody h2{
    margin-top:14px;
    margin-bottom:-16px;
    font-size:15px;
    font-family: Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
.calendarInvite .postBody p{
    margin-top:2px;
    margin-bottom:1px;
    font-size:15px;
}
article div.attending{
    padding:8px 0 11px 0px;
    white-space:nowrap;
    overflow:hidden;
    margin-left:-3px;
    margin-bottom:10px;
}
article div.attending a{
    display:inline-block;
    margin-right:4px;
    padding-top:4px;
    vertical-align:middle;
}
article div.attending a:first-of-type{
    margin-right:4px;
    padding-right:5px;
    border-right:1px solid #e4e5ed;
}
article div.attending .profileM{
    overflow:hidden;
    width:40px;
}
article div.attending .loadMoreContacts{
    text-align:left;
    padding:0;
    line-height:38px;
    vertical-align:middle;
    min-width:40px;
    border:none;
}
article div.attending a.circles{
    padding-right:5px;
    margin-right:6px;
}
article div.attending a.circles .circle{
    margin-left:0;
    margin-bottom:0;
}
article div.attending a.circles .circleName{
    text-indent:-9999px;
}
article div.attending a.circles .circleName:after{
    top:-39px;
}



/*************************************************
*  Post Type:  Event Invite Details
*************************************************/
.calendarInviteDetail{
    margin-top:15px;
}
.calendarInviteDetail footer.options{
    display:none;
}
.calendarInviteDetail .calendarInvite{
    padding-left:0;
}
.calendarInviteDetail .changeStatus {
    text-decoration: underline;
    cursor: pointer;
}
.calendarInviteDetail .calendarInvite .postBody p span,
.calendarInviteDetail .calendarInvite h2 a{
    cursor:text;
}
.eventAttendees{
    padding:0px 0px 0px 0px;
}
.eventPosts article time:before{
    content:"";
}
.eventAttendees h2{
    border-top:1px solid #e4e5ed;
    line-height:50px;
    height:50px;
    margin:0;
    text-indent:10px;
    position:relative;
}
.eventAttendees h2:first-child{
    border-top:none;
}
.eventAttendees div.attending{
    margin:-20px 0 0 10px;
}




/*************************************************
*  Post Type:  Updates
*************************************************/
.driverControl{
    background:#ddd;
    position:relative;
    z-index:1;
    margin:15px 0 -10px -10px;
    padding:18px 9px 18px 9px;
    border:1px solid;
    border-color:#b0b0b0 #e4e5ed #d9d9d9 #e4e5ed;
    color:#000;
    text-align:center;
}
.driverControl:after{
    content:"";
    width:10px;
    height:10px;
    background:#fff;
    border:#b0b0b0 solid;
    border-width:0 1px 1px 0;
    position:absolute;
    top:-6px;
    right:22px;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari and Chrome */
}
.driverControl p{
    padding:0;
    margin:0;
}
.driverControl .profileM{
    position:relative;
    border:none;
    width:39px;
    z-index:1;
}
.driverControl a.driverOption,
.driverControl a.driverSelected{
    border:none;
    display:inline-block;
    position:relative;
    padding:3px;
}
.driverControl a.driverOption:after,
.driverControl a.driverSelected:after{
    content:"";
    width:41px;
    height:42px;
    background:#fff;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    position:absolute;
    top:2px;
    left:2px;
}
.driverControl a.driverSelected{
    background:#a7d428;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    width:39px;
    height:40px;
}
.driverControl a.driverCircles{
    display:inline-block;
    width:45px;
    height:46px;
    vertical-align:top;
    border:none;
    text-indent:-9999px;
    background-position:-202px -118px;
}



/*************************************************
*  Post Type:  New Connection
*************************************************/
.newConnection{
    min-height:105px;
}
.newConnection .connectionPhoto{
    padding-top:10px;
    display:block;
    margin-bottom:29px;
    line-height:20px;
    overflow: hidden;
    cursor:pointer;
    font-size:15px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.newConnection .context,
.newConnection .verifiedParent{
    font-size:15px;
    color:#8e8e8e;
    display:block;
    line-height:20px;
    white-space:normal;
}
.carousel .newConnection .context,
.carousel .newConnection .verifiedParent{
    white-space:nowrap;
}
.newConnection .commonConnections{
    display:none;
}
.newConnection .connectionPhoto .profileM{
    width:50px;
    height:50px;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    margin:-1px 10px 10px 0;
    float:left;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:19px;
}
.newConnection .connectionPhoto .profileM:before{
    width:50px;
    height:50px;
    /*-moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;*/
}
.newConnection .connectionPhoto .profileM img{
    width:50px;
    height:50px;
    /*-moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;*/
    margin:0 10px 0 0;
}
.newConnection .connectionPhoto .profileM:after{
    display:none;
}
.newConnection .connectionPhoto p{
    margin-top:0;
    overflow:hidden;
    margin-bottom:10px;
    font:16px/20px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.newConnection .connectionPhoto p+p{
    margin-top:-12px;
}
.carousel .newConnection .connectionPhoto p{
    margin-top:0;
}
article.update .resharedUpdate.newConnection{
    padding-top:0;
    padding-bottom:0;
}
article.update .resharedUpdate.newConnection p{
    padding-bottom:10px;
}
article.update .carousel .resharedUpdate.newConnection p{
    padding-bottom: 0;
    margin-top: 0 !important;
    padding-top: 8px;
}
article.update .resharedUpdate.newConnection .connectionPhoto{
    margin-bottom:0;
}




/*************************************************
*  Post Type:  New Connection Aggregation
*************************************************/
.Desktop .connectionAggregation{
    margin-bottom:30px;
    padding-bottom:25px;
}
.Desktop .connectionAggregation .carousel{
    padding:0 21px 17px 21px;
    margin:0 0 -40px -21px;
    min-height:328px;
}
.Desktop .connectionAggregation.noFooter .carousel{
    min-height:328px;
}
.Desktop .connectionAggregation .hgroup + .carousel{
    min-height:350px;
}
.Desktop .connectionAggregation.noFooter .hgroup + .carousel{
    min-height:310px;
}
.Desktop article.connectionAggregation.noFooter,
.Desktop .connectionAggregation{
    margin-bottom:25px;
}
article.connectionAggregation.noFooter,
.connectionAggregation{
    margin-bottom:15px;
    min-height:354px;
    padding-bottom:25px;
}
.connectionAggregation:after{
    display:none;
}
.connectionAggregation .carousel{
    width:100%;
    padding:0 21px 20px 21px;
    margin:0 0 -35px -21px;
    min-height:345px;
}
.connectionAggregation.noFooter .carousel{
    min-height:320px;
}
.connectionAggregation.noFooter .hgroup + .carousel{
    min-height:342px;
}
.connectionAggregation .hgroup + .carousel{
    min-height:342px;
}
.connectionAggregation .carousel .resharedUpdate.newConnection{
    display:inline-block;
    margin-right:10px;
    vertical-align:top;
}
.connectionAggregation .carousel .resharedUpdate.newConnection:last-of-type{
    margin-bottom:-12px;
    margin-right:0;
}
.carousel .resharedUpdate.newConnection,
.carousel article.update .resharedUpdate.newConnection:last-of-type{
    width:260px;
    height:303px;
    margin-bottom:-12px;
}
.connectionAggregation .carousel .resharedUpdate.newConnection:only-child{
    margin-right:0;
    width:268px;
}
article.update.connectionAggregation .carousel .newConnection .threeLines.hideProfilePhoto .profileM:after{
    margin-top:-4px;
}
.connectionAggregation .carousel .newConnection .threeLines h3{
    margin-top:-31px;
}
.connectionAggregation .carousel .newConnection .threeLines h3+h3{
    margin-top: -11px;
    margin-bottom: -4px;
}
.carousel .welcomeMember.resharedUpdate.newConnection,
.carousel article.update .welcomeMember.resharedUpdate.newConnection:last-of-type,
.carousel .verifyMember.resharedUpdate.newConnection,
.carousel article.update .verifyMember.resharedUpdate.newConnection:last-of-type{
    height:286px;
}
.carousel article.verifyMember footer ul{
    display:table;
    table-layout:fixed;
}
.carousel article.verifyMember footer li{
    display:table-cell;
    font-size:14px;
    padding:0 10px;
}
.resharedUpdate.newConnection .profileM:after{
    padding-right:0;
}
.carousel .resharedUpdate.newConnection .connectionPhoto{
    width:255px;
    height:auto;
    margin-left:-9px;
    margin-bottom:0;
    padding:193px 8px 0 55px;
    position:relative;
    z-index:2;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.carousel .resharedUpdate.newConnection:only-child .connectionPhoto{
    width:268px;
}
.carousel .resharedUpdate.newConnection .connectionPhoto .profileM,
.carousel .resharedUpdate.newConnection .connectionPhoto .profileM img,
.carousel .resharedUpdate.newConnection .connectionPhoto .profileM:before{
    width:258px;
    height:188px;
    margin:0;
    position:absolute;
    top:3px;
    left:0;
    border-radius: 50%;
    max-width: 200px;
    top: 0;
    width: 100%;
    right: 0;
    margin: auto;
}
.carousel .resharedUpdate.newConnection:only-child .connectionPhoto .profileM,
.carousel .resharedUpdate.newConnection:only-child .connectionPhoto .profileM img,
.carousel .resharedUpdate.newConnection:only-child .connectionPhoto .profileM:before{
    width:266px;
}

.resharedUpdate.newConnection .connectionPhoto p{
    margin-bottom:0;
}
.carousel .resharedUpdate.newConnection .connectionPhoto p span{
    font-size:14px;
    margin-top:-3px;
    text-overflow:clip;
    height:18px;
    display:block;
}
.resharedUpdate.newConnection .connectionPhoto p span.commonConnections{
    display:inline-block;
    background:rgba(255,255,255,.7);
    margin-right:0;
    line-height:20px;
    position:absolute;
    right:2px;
    bottom:62px;
    padding:0 5px;
    text-shadow:none;
}
.resharedUpdate.newConnection.welcomeMember .connectionPhoto p span.commonConnections,
.resharedUpdate.newConnection.verifyMember .connectionPhoto p span.commonConnections{
    bottom:10px;
}
.resharedUpdate.newConnection .feedbackControl{
    height:56px;
    overflow:visible;
}
.resharedUpdate.newConnection.welcomeMember .feedbackControl,
.resharedUpdate.newConnection.verifyMember .feedbackControl{
    height:40px;
}
.resharedUpdate.newConnection .feedbackControl .addConnection{
    text-indent:-9999px;
    width:48px;
    border-right:1px solid #e4e5ed !important;
    box-shadow:1px 0 0 #fff;
    height:56px;
    z-index:3;
    position:relative;
}
.resharedUpdate.newConnection .feedbackControl .addConnection:before{
    background-position:-72px -832px;
    height:56px;
}
.resharedUpdate.newConnection .feedbackControl .addConnection.pendingAcceptance:before{
    background-position:-136px -772px;
}
.resharedUpdate.newConnection .feedbackControl .addConnection.pendingAcceptance:after{
    content:attr(data-pendingMsg);
    display:block;
    position:absolute;
    z-index:4;
    text-indent:4px;
    margin-top:-6px;
    line-height:20px;
    font-size:10px;
    color:#ff6c00;
    width:48px;
    text-align:center;
}
article.update .resharedUpdate.inviteRequest{
    padding-top:0;
    padding-bottom:0;
}
article.update .resharedUpdate.inviteRequest .inviteRequest button{
    cursor:auto;
}
.resharedUpdate .circleRequests{
    margin-bottom:0;
}
.resharedUpdate .circleRequests article,
.resharedUpdate .circleRequests article:first-of-type{
    background:transparent;
    margin-bottom:0;
    border:none;
    box-shadow:none;
    padding:0;
}
.resharedUpdate .circleRequests button.circle{
    margin-left:0;
}
.resharedUpdate .circleRequests article .hgroup{
    margin-bottom:10px;
    top:1px;
}
.resharedUpdate .circleRequests article .hgroup h3:first-of-type{
    margin-left:0;
    margin-top:-6px;
}
.resharedUpdate .circleRequests article .hgroup h3 + h3{
    margin-top:-13px;
    margin-left:0;
    color:#000;
}
.resharedUpdate .circleRequests article .hgroup h3 .updated{
    display:inline;
}
article.update .carousel .resharedUpdate.newConnection{
    padding-top:10px;
}
article.update .carousel .resharedUpdate.newConnection .connectionPhoto{
    margin-bottom:15px;
}
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto{
    padding-left:0;
    margin-bottom:0;
}
article.update>.hgroup.hideProfilePhoto{
    padding-left:0;
}
article.update>.hgroup.hideProfilePhoto .profileM:before{
    display:none;
}
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto img,
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto .profileM:before{
    display:none;
}
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto .profileM:after{
    margin-left:0;
    text-indent:1px;
    font-size:15px;
}
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto.singleLine .profileM{
    height:21px;
}
article.update .carousel .resharedUpdate.newConnection .hideProfilePhoto.singleLine h2{
    height:21px;
}




/*************************************************
*  Post Type:  Joined using your referral
*************************************************/
article.joinedUsingYourReferral .carousel .resharedUpdate.newConnection{
    height:263px;
}
article.joinedUsingYourReferral .carousel>article{
    margin-top:10px;
}
.joinedUsingYourReferral .hgroup + .carousel{
    min-height:318px !important;
}
.Desktop .joinedUsingYourReferral .hgroup + .carousel{
    min-height:328px !important;
}




/*************************************************
*  Post Type: Albums
*************************************************/
article.album{
    padding:0 0 41px 0;
    overflow:hidden;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}
article.album .hgroup{
    padding:5px;
    position:absolute;
    z-index:1;
    bottom:30px;
    width:100%;
}
.notScrolling article.album.highlightableRow.hgroup:active,
.notScrolling article.album .highlightableRow.hgroup:active{
    background:none;
}
article.album .hgroup h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    line-height:1;
    color:rgba(255,255,255,.9);
    text-shadow:0 0 10px rgba(0,0,0,1);
    margin:0 0 1px 0;
    height:auto;
    overflow:visible;
    padding:0 10px;
}
article.album .hgroup h3{
    font-size:14px;
    line-height:16px;
    color:rgba(255,255,255,.9);
    text-shadow:0 0 10px rgba(0,0,0,1);
    margin:0;
    overflow:visible;
    padding:0 10px;
    white-space:normal;
}
article.album p{
    margin:0;
    height:213px;
    max-height:300px;
    max-width:none;
    overflow:hidden;
    position:relative;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    background:#52595F;
    display:block;
    background-size:cover !important;
    background-position:center;
}
article.album p:before{
    content:"";
    display:block;
    position:absolute;
    box-shadow:inset 0 -50px 100px rgba(0,0,0,.4);
    width:100%;
    height:100%;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
}
article.album.emptyAlbum p{
    background-image:url(../images/emptyAlbum.jpg) !important;
}
article.album.emptyAlbum p:before{
    box-shadow:none;
}
article.album.emptyAlbum .hgroup h2,
article.album.emptyAlbum .hgroup h3{
    text-shadow:none;
}
article.album img{
    margin:0;
    max-width:none;
    max-height:none;
}
article.album .feedbackControl ul{
    display:table;
    table-layout:fixed;
}
article.album .feedbackControl li{
    display:table-cell;
    padding:0;
    text-align:center;
}
article.album footer.feedbackControl li,
article.album footer.feedbackControl li:only-child{
    text-align:center;
}
article.album .feedbackControl li:last-of-type{
    border-right:none;
}




/*************************************************
*  Post Type: Photos
*************************************************/
article.photo{
    /*-moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    border:none;
    background:none;*/
    padding:0;
    max-width:420px;
    margin:0 auto 24px auto;
}
article.photo .hgroup{
    position:absolute;
    bottom:-5px;
    left:10px;
    margin:0;
    padding:0;
}
article.photo .hgroup h2{
    margin:0;
    height:auto;
    font-size:10px;
    color:#8e8e8e;
    text-shadow:none;

}
article.photo p{
    margin:0;
    max-width:none;
    max-height:300px;
    overflow:hidden;
    width:100%;
    background-size:cover;
    background-position:center;
    background-color:#dedede;
}
article.photo img{
    margin:0;
    max-height:none;
    width:100%;
    height:auto;
}
article.photo p img{
    background-color:#dedede;
    min-height:120px;
}





/*************************************************
*  Post Type:  Friend Request
*************************************************/
.contentArea .friendRequests{
    margin-bottom:0;
}
.contentArea .friendRequests article:first-of-type{
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
}
.contentArea .friendRequests article:last-of-type{
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
}


/*************************************************
*  Post Type:  Invitation Request Button Styles
*************************************************/
.contentArea .inviteRequest{
    padding:0;
    margin-bottom:15px;
    min-height:60px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow:hidden;
}
.contentArea .calendarInvite{
    padding:0 0 50px 0;
    margin-bottom:-1px;
    min-height:60px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow:hidden;
    margin-bottom:15px
}
.contentArea .calendarInvite:last-of-type{
    margin-bottom:-1px;
}
.inviteRequest .hgroup{
    top:10px;
    padding-left:60px;
    margin-bottom:55px;
}
.calendarInvite .hgroup{
    top:10px;
    padding-left:0;
    text-indent:20px;
}
.inviteRequest .hgroup .profileM{
    left:10px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.inviteRequest .hgroup .profileM:after{
    text-indent:46px;
}
.calendarInvite .hgroup .profileM{
    left:0;
}
.calendarInvite div.attending{
    padding:19px 10px 11px 20px;
}
.inviteRequest h3{
    text-indent:0px;
    margin-top:-17px;
}
.calendarInvite h3{
    text-indent:0px;
    margin-top:14px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:20px;
}
div.subPage:not(.eventReceived) .calendarInvite{
    padding-bottom:5px;
}
div.subPage:not(.eventReceived) .calendarInvite .acceptanceControl{
    display:none;
}
.inviteRequest .acceptanceControl,
.calendarInvite .acceptanceControl{
    border-top:none;
    height:39px;
    height: auto;
    padding: 10px;
}
.inviteRequest .acceptanceControl ul,
.calendarInvite .acceptanceControl ul{
    display:table;
    table-layout:fixed;
    width:100%;
}
.inviteRequest .acceptanceControl li,
.calendarInvite .acceptanceControl li{
    /*display:table-cell;
    border-right:1px solid #e4e5ed;*/
    text-indent:0;
    padding:0;
    margin-right:5px;
}
.inviteRequest .acceptanceControl li:before,
.calendarInvite .acceptanceControl li:before{
    display:none;
}




.inviteRequest .acceptanceControl li:last-of-type,
.calendarInvite .acceptanceControl li:last-of-type{
    border-right:none;
}
.inviteRequest .acceptanceControl button,
.calendarInvite .acceptanceControl button{
    width:100%;
    border:none;
    background:none;
    height:35px;
    line-height:35px;
    padding:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border:1px solid transparent;
    border-top:1px solid #e4e5ed;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    padding: 0 20px;
    border-radius: 50px
}
.inviteRequest .acceptanceControl button:before,
.calendarInvite .acceptanceControl button:before{
    content:"";
    display:inline-block;
    vertical-align:middle;
    border: none;
    width:20px;
    height:40px;
    margin:0 4px 0 0;
    padding:0;
}
.inviteRequest .acceptanceControl button.accept:before,
.calendarInvite .acceptanceControl button.accept:before{
    background-position:-281px -421px;
    width:15px;
}
.inviteRequest .acceptanceControl button.decline:before,
.calendarInvite .acceptanceControl button.decline:before{
    background-position:-347px -421px;
    width:11px;
}
.inviteRequest .acceptanceControl button.accept:before,
.calendarInvite .acceptanceControl button.accept:before,
.inviteRequest .acceptanceControl button.decline:before,
.calendarInvite .acceptanceControl button.decline:before { width:0; margin:0; display: none; }

.inviteRequest .acceptanceControl button.tentative:before,
.calendarInvite .acceptanceControl button.tentative:before{
    background-position:-410px -421px;
    width:11px;
    display: none;
}




/* Current Selection */
.inviteRequest .acceptanceControl.eventAccepted button.accept,
.calendarInvite .acceptanceControl.eventAccepted button.accept,
.acceptanceControl.eventAccepted li.accept{
    background-color:#81ac00;
    border:1px solid #6d9400;
    color:#fff;
    text-shadow:none;
}
.inviteRequest .acceptanceControl.eventDeclined button.decline,
.calendarInvite .acceptanceControl.eventDeclined button.decline,
.acceptanceControl.eventDeclined li.decline{
    background-color:#ff6f6f;
    border:1px solid #cc5856;
    color:#fff;
    text-shadow:none;
}
.inviteRequest .acceptanceControl.eventTentative button.tentative,
.calendarInvite .acceptanceControl.eventTentative button.tentative,
.acceptanceControl.eventTentative li.tentative{
    background-color:#f1c56f;
    border:1px solid #d7aa51;
    color:#fff;
    text-shadow:none;
}
.inviteRequest .acceptanceControl.eventAccepted button.accept:before,
.calendarInvite .acceptanceControl.eventAccepted button.accept:before,
.acceptanceControl.eventAccepted li.accept:before{
    background-position:-281px -481px;
}
.inviteRequest .acceptanceControl.eventDeclined button.decline:before,
.calendarInvite .acceptanceControl.eventDeclined button.decline:before,
.acceptanceControl.eventDeclined li.accept:before{
    background-position:-347px -481px;
}
.inviteRequest .acceptanceControl.eventTentative button.tentative:before,
.calendarInvite .acceptanceControl.eventTentative button.tentative:before,
.acceptanceControl.eventTentative li.accept:before{
    background-position:-410px -481px;
}



/*
.inviteRequest footer.acceptanceControl button.accept:active:before{
    border:1px solid rgba(0,99,127,.2);
    background:rgba(0,99,127,.1);
}
.inviteRequest footer.acceptanceControl button.decline:active:before{
    border:1px solid rgba(0,0,0,.2);
    background:rgba(0,0,0,.1);
}
*/




/*************************************************
*  Post Type:  Invite to Circle or Group
*************************************************/
section.circleRequests div .inviteRequest{
    margin-bottom:15px;
}
section.circleRequests .inviteRequest .hgroup{
    margin-top:-20px;
}
section.circleRequests article button.circle,
.formLayout section.circleRequests button.circle{
    top:12px;
    left:2px;
}
section.circleRequests article h3{
    margin-left:8px;
    margin-top:0;
    width:100%;
}
section.circleRequests article h3 span{
    width:100%;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 10px 0 0;
}



/*************************************************
*  Post Type:  Shared an Event
*************************************************/
article.update .resharedUpdate{
    margin:13px 0 0 0;
    padding:10px 10px 0 10px;
    position:relative;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
article.update .resharedUpdate,
article.update .carousel .resharedUpdate.newConnection,
.articleSnippet article{
    background:#fafafa;
    border:1px solid #ececec;
    border-bottom:1px solid #ddd;
    box-shadow:none;
    padding-bottom:10px;
}
article.update .resharedUpdate.calendarInvite{
    padding:0 0 3px 0;
    margin-bottom:20px;
}
article.update .resharedUpdate:last-of-type{
    margin-bottom:28px;
}
article.update .calendarInvite.resharedUpdate:last-of-type{
    margin-bottom:8px;
}
article.update .resharedUpdate:last-of-type ~ .metaInfo{
    margin-top:-10px;
}
article.update .resharedUpdate.update h3{
    margin-top:-23px;
}
article.update .resharedUpdate .hgroup + p:last-of-type{
    margin-bottom:-21px;
}

article.update .calendarInvite .profileM{
    top:0;
    left:-5px;
    text-indent:10px;
}
article.update .calendarInvite .profileM:before{
    display:none;
}
article.update .calendarInvite .profileM:after{
    margin-left:-5px;
    padding-right:0;
}
.resharedUpdate.calendarInvite h3:last-child{
    padding-bottom:5px;
}
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li{
    border-right:1px solid #e4e5ed;
    margin-right:-3px;
    padding:0 10px;
}
article footer.acceptanceControl li{
    margin-right:-3px;
    border-radius: 50px;
    padding: 10px 20px;
    margin: 0 5px 0 0;
    line-height: 1;
    height: auto;
}
article footer.acceptanceControl li:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li:before{
    content:"";
    width:11px;
    height:39px;
    display:inline-block;
    margin-right:4px;
    vertical-align:middle;
    position: relative;
    top: -2px;
}
article footer li.dismiss:before{
    display: none !important;
}
.calendarInviteDetail article footer.acceptanceControl li:before,
.calendarInvites article footer.acceptanceControl li:before,
.carousel article footer.acceptanceControl li:before{
    display:none;
}
article footer.acceptanceControl li.accept:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.accept:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.accept:before{
    width:15px;
    background-position:-281px -420px;
    display:none;
}
article footer.acceptanceControl li.decline:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.decline:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.decline:before{
    background-position:-347px -420px;
    display:none;
}
article footer.acceptanceControl li.tentative:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.tentative:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.tentative:before{
    background-position:-410px -420px;
}
article footer.acceptanceControl li.ignore:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.ignore:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.ignore:before{
    display:none;
}




article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl.eventAccepted li.accept:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl.eventAccepted li.accept:before{
    width:15px;
    background-position:-281px -481px;
}
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl.eventDeclined li.decline:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl.eventDeclined li.decline:before{
    background-position:-347px -481px;
}
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl.eventTentative li.tentative:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl.eventTentative li.tentative:before{
    background-position:-410px -481px;
}




article footer.acceptanceControl li.selected,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected{
    color:#fff;
    text-shadow:none;
}
article footer.acceptanceControl li.selected.accept,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.accept,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.accept{
    background-color:#81ac00;
}
article footer.acceptanceControl li.selected.decline,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.decline,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.decline{
    background-color:#ff6f6f;
}
article footer.acceptanceControl li.selected.tentative,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.tentative,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.tentative{
    background-color:#f1c56f;
}
article footer.acceptanceControl li.selected.ignore,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.ignore,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.ignore{
    color:#707b7f;
    text-shadow:#fff 0 1px 0;
}
article footer.acceptanceControl li.selected.accept:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.accept:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.accept:before{
    background-position:-281px -480px;
}
article footer.acceptanceControl li.selected.decline:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.decline:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.decline:before{
    background-position:-347px -480px;
}
article footer.acceptanceControl li.selected.tentative:before,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li.selected.tentative:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li.selected.tentative:before{
    background-position:-410px -480px;
}
article.update .changeNotice{
    margin-top:-10px;
    margin-bottom:2px;
    padding:0 10px;
    max-width:none;
}
article.update .changeNotice ~ .metaInfo{
    padding-left:10px;
}
article.update .changeNotice .updated{
    display:inline;
}



/*************************************************
*  Post Type:  Reshared Comment
*************************************************/
article.update .resharedUpdate .messages{
    margin:0;

}
article.update .resharedUpdate .messages .message{
    padding:0;
    background:transparent;
    box-shadow:none;
    border:none;
}



/*************************************************
*  Post Type:  Smart Card Default Layout
*************************************************/
article.scLayout .profileM:before{
    display:none;
}
article.scLayout h2{
    height:30px;
    margin-top:16px;
    padding:0 90px 0 15px;
    line-height:1;
}
article.scLayout h3{
    display:none;
}
article.scLayout p{
    margin-top:-3px;
    margin-bottom:55px;
    padding:0 95px 0 15px;
}
article.scLayout .hgroup{
    padding-left:0;
}
article.scLayout .hgroup h2{
    height:auto;
}
article.scLayout .profileM{
    height:auto;
    position:relative;
}
article.scLayout .profileM:after{
    margin-left:0;
    text-indent:0;
    padding-right:0;
    line-height:1;
    white-space:normal;
    padding-bottom:0;
    height:auto;
}
article.scLayout .scPermissionsVisible,
article.scLayout .scPermissionsHidden{
    display:none;
}
article.scLayout footer li.skip{
    color:#8e8e8e;
}
article.scLayout footer li.skip:after,
.archivedClassesBtn:after{
    content:"»";
    display:inline-block;
    padding-left:4px;
    font-size:24px;
    color:rgba(142,142,142,.6);
    text-indent:0;
    vertical-align:top;
}
article.scLayout footer li{
    height:38px;
    line-height:38px;
    text-align:center;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border-right:1px solid #e4e5ed;
    color:#707b7f;
}



/*************************************************
*  Post Type:  Smart Card Profile Completion
*************************************************/
article.scProfileCompletion{
    padding:10px 0 0 0;
}
article.scProfileCompletion .scPermissionsVisible,
article.scProfileCompletion .scPermissionsHidden{
    margin:15px 0 0 -3px;
    display:inline-block;
    color:#8e8e8e;
    font-size:14px;
    text-decoration:none;
}
article.scProfileCompletion .scPermissionsVisible:before,
article.scProfileCompletion .scPermissionsHidden:before{
    content:"";
    width:30px;
    height:30px;
    display:inline-block;
    background-position:-464px -1326px;
    vertical-align:middle;
}
article.scProfileCompletion .scPermissionsHidden:before{
    background-position:-464px -1386px;
}
article.scProfileCompletion .profileProgress{
    text-align:right;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    height:1px;
    position:absolute;
    padding-right:28px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
article.scProfileCompletion .profileProgress canvas{
    margin:5px 0 -4px 0;
}
article.scProfileCompletion .profileProgress span{
    display:block;
    height:1px;
    overflow:visible;
    font-size:10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-right:2px;
    color:#8e8e8e;
}
article.scProfileCompletion .profileProgress ~ .uploadPhoto .inputProfile{
    top:73px;
}
article.scProfileCompletion .uploadPhoto{
    text-align:right;
    position:absolute;
    width:100%;
    padding-right:28px;
    margin:-10px 0 0 0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
article.scProfileCompletion .uploadPhoto:after{
    display:none; /* without this the WP8 updates tab would have jerky scroll */
}
article.scProfileCompletion .uploadPhoto ~ p{
    min-height:44px;
    cursor:default;
}
article.scProfileCompletion .inputProfile{
    position:absolute;
    right:95px;
    top:0;
    display:inline;
    width:auto;
}
article.scProfileCompletion .inputProfile .profileM:after{
    word-wrap:normal;
    white-space:normal;
    height:30px;
    margin-top: -2px;
    font-size: 13px
}
article.scProfileCompletion .inputProfile label.chooseFile{
    padding-left:0;
    width:60px;
    height:60px;
    text-indent:-9999px;
}
article.scProfileCompletion .inputProfile label.chooseFile input{
    height:1px;
    outline:none;
    margin-top:200px;
}
article.scProfileCompletion .inputProfile .choosePhoto{
    width:50px;
    height:24px;
    width:60px;
    height:60px;

}
article.scProfileCompletion .inputProfile .profileM img{
    width:62px;
    height:62px;
}



/*************************************************
*  Post Type:  Smart Card Vertical Action Buttons
*************************************************/
article.scLayout footer.verticalBtns{
    height:auto;
    overflow:visible;
    position:relative;
    border-top:none;
    margin-top:-40px;
}
article.scLayout footer.verticalBtns ul{
    display:block;
}
article.scLayout footer.verticalBtns li{
    display:block;
    border-top:1px solid #e4e5ed;
    border-right:none;
    text-align:left;
    text-indent:42px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    padding-right:10px;
}
article.scLayout footer.verticalBtns li:before{
    content:"";
    display:block;
    position:absolute;
    width:17px;
    height:17px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    padding:0;
    border:2px solid #ccc;
    background:#fff;
    margin:8px 8px 8px 12px;
}
article.scLayout footer.verticalBtns li.selected:before{
    background-position:-213px -853px;
    border-color:#53c8e6;
}
article.scLayout footer.verticalBtns li.skip{
    position:absolute;
    right:0;
    bottom:0;
    padding-right:10px;
    text-indent:15px;
}
article.scLayout footer.verticalBtns li.skip:before{
    display:none;
}



/*************************************************
* Quick Tour Menu
*************************************************/
#quickTours section.optionListing{
    padding:20px 10px 23px 88px;
}
#quickTours section.optionListing p{
    margin-top:1px;
    max-width:300px;
}
#quickTours section.optionListing.circleThumbnail:before{
    content:attr(data-dur);
    text-indent:0;
    text-align:center;
    font-size:14px;
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px;
    width:64px;
    height:auto;
    margin:3px 0 0 0;
    left:12px;
    line-height: 1;
    padding:44px 0 5px 0;
    color:#fff;
    text-shadow:none;
}
#quickTours section.optionListing.circleThumbnail:after{
    content:"";
    width:30px;
    height:30px;
    display:block;
    position:absolute;
    left:29px;
    top:33px;
}
#quickTours section.optionListing.circleThumbnail.tourPTConf:before{
    background-color:#dc392f;
}
#quickTours section.optionListing.circleThumbnail.tourPTConf:after{
    background-position:-481px -1580px;
}
#quickTours section.optionListing.circleThumbnail.tourPost:before{
    background-color:#60b517;
}
#quickTours section.optionListing.circleThumbnail.tourPost:after{
    background-position:-607px -1550px;
}
#quickTours section.optionListing.circleThumbnail.tourVR:before{
    background-color:#fd82ab;
}
#quickTours section.optionListing.circleThumbnail.tourVR:after{
    background-position:-545px -1550px;
}
#quickTours section.optionListing.circleThumbnail.tourDemoClass:before{
    background-color:#53c8e6;
}
#quickTours section.optionListing.circleThumbnail.tourDemoClass:after{
    background-position:-670px -1580px;
}
#quickTours section.optionListing.circleThumbnail.completed:before{
    background-color:#edf6f7;
    text-indent:-9999px;
}
#quickTours section.optionListing.circleThumbnail.completed:after{
    background-position:-522px -959px;
    width:40px;
    height:40px;
    left:24px;
    top:34px;
}



/*************************************************
*  Quick Tour Email Preview
*************************************************/
#quickTourEmailPreview .emailSample{
    display:table;
    height:100%;
    width:100%;
}
#quickTourEmailPreview .emailHeader{
    display:table-row;
    border-bottom:1px solid black;
    height:50px;
    background:#f1f1f1;
}
#quickTourEmailPreview .emailHeader div{
    display:table-cell;
    padding:10px 0 0 10px;
}
#quickTourEmailPreview .emailHeader span{
    display:block;
    line-height:1.25;
    text-indent:0;
    font-size:15px;
}
#quickTourEmailPreview .emailHeader span.sender:before{
    content:"From:";
    font-weight:bold;
    margin-right:5px;
}
#quickTourEmailPreview .emailHeader span.subject{
    font-weight:normal;
    padding-bottom:10px;
    border-bottom:1px solid #c9c9c9;
}
#quickTourEmailPreview .emailHeader span.subject:before{
    content:"Subject:";
    font-weight:bold;
    margin-right:5px;
}
#quickTourEmailPreview .emailBody{
    display:table-row;
    height:100%;
    text-indent:0;
}
#quickTourEmailPreview .emailBody div{
    display:table-cell;
    overflow:hidden;
}
#quickTourEmailPreview .emailBody iframe{
    height:100%;
}



/*************************************************
*  Add Post
*************************************************/
#addPost .postCreateNew,
#composeEmail .postCreateNew,
#communityInfoCardEdit .postCreateNew{
    padding-bottom:50px;
}
#addPost .postCreateNew .selectGroups,
#composeEmail .postCreateNew .selectGroups,
#communityInfoCardEdit .postCreateNew .selectGroups{
    display:block;
}
#addPost .postCreateNew .actionBarCircles .circlesBox,
#composeEmail .postCreateNew .actionBarCircles .circlesBox,
#communityInfoCardEdit .postCreateNew .actionBarCircles .circlesBox{
    padding:0 66px 0 44px;
}
#addPost .postCreateNew .actionBarCircles .circlesBox.schedulePostTitle {
    padding-right: 105px;
}
#addPost .postCreateNew .actionBarCircles .circlesBox,
#composeEmail .postCreateNew .actionBarCircles .circlesBox,
#communityInfoCardEdit .postCreateNew .actionBarCircles .circlesBox{
    display:block;
}
#addPost .postCreateNew .actionBar h1#addPost_postType,
#composeEmail .postCreateNew .actionBar h1#addPost_postType,
#communityInfoCardEdit .postCreateNew .actionBar h1#addPost_postType{
    padding:4px 66px 4px 44px;
}
#addPost .postCreateNew .actionBar h1 span,
#composeEmail .postCreateNew .actionBar h1 span,
#communityInfoCardEdit .postCreateNew .actionBar h1 span{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid rgba(0,0,0,.15);
    box-shadow:0 0 0 1px rgba(255,255,255,1);
    height: 36px;
    line-height: 37px;
    margin-top: 1px;
    font-size:19px;
    text-align:left;
    text-indent:10px;
    cursor:pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:hidden;
    padding-right: 30px;
    text-overflow: ellipsis;
}
#addPost .postCreateNew .actionBar h1 span:active,
#composeEmail .postCreateNew .actionBar h1 span:active,
#communityInfoCardEdit .postCreateNew .actionBar h1 span:active{
    background:#e8e8e8;
}
#addPost .postCreateNew .actionBar h1 span.tags:after,
#composeEmail .postCreateNew .actionBar h1 span.tags:after,
#communityInfoCardEdit .postCreateNew .actionBar h1 span.tags:after{
    content:"";
    width:20px;
    height:30px;
    position:absolute;
    display:block;
    top:9px;
    right:72px;
    background-position:-278px -1145px;
    opacity: .6;
    filter:alpha(opacity=60);
}
#addPost .createPost,
#composeEmail .createPost,
#communityInfoCardEdit .createPost{
    border-bottom:none;
}
#addPost .createPost section,
#composeEmail .createPost section,
#communityInfoCardEdit .createPost section{
    padding:10px 10px 0 10px;
    border:none;
    text-indent:0;
}
#addPost .createPost .calendarInvite h2 .profileM:after,
#composeEmail .createPost .calendarInvite h2 .profileM:after,
#communityInfoCardEdit .createPost .calendarInvite h2 .profileM:after{
    text-indent:10px;
}

#addPost .formLayout,
#composeEmail .formLayout,
#communityInfoCardEdit .formLayout{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    height:100%;
    padding:10px;
}
#composeEmail .formLayout{
    padding: 0 !important;
}
#addPost .formLayout .formLayout,
#composeEmail .formLayout .formLayout,
#communityInfoCardEdit .formLayout .formLayout{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    height:auto;
    padding:0;
    margin-bottom:10px;
    min-height:0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
    border: 1px solid #e4e5ed;
    border-bottom: 1px solid #e4e5ed;
    overflow:visible;
    background:#fff;
}
#addPost .formLayout section,
#communityInfoCardEdit .formLayout section{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:auto;
    padding-bottom:25px;
}
#communityInfoCardEdit .formLayout section{
    min-height:245px;
}
#addPost .formLayout section.separateTime,
#composeEmail .formLayout section.separateTime,
#communityInfoCardEdit .formLayout section.separateTime{
    min-height:0px;
    padding:0 0 0 10px;
    border-bottom:1px solid #e4e5ed;
    overflow:visible;
    background:transparent;
}
#addPost .formLayout section.createPostBody,
#createAlert section.createPostBody,
#composeEmail .formLayout section.createPostBody,
#communityInfoCardEdit .formLayout section.createPostBody{
    overflow:visible;
    overflow-x:auto;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    border-top:none !important;
    border-bottom:1px solid #e4e5ed;
    margin-bottom:20px;
    min-height:310px;
    position:relative;
}
#addPost .formLayout section.createPostBody.announcementType,
#composeEmail .formLayout section.createPostBody.announcementType,
#communityInfoCardEdit .formLayout section.createPostBody.announcementType{
    min-height:195px;
}
#addPost .formLayout section.createPostBody.isTemplateEdit{
    min-height: 313px;
}
#addPost .placeHolderText,
#composeEmail .placeHolderText,
#communityInfoCardEdit .placeHolderText,
#createAlert .placeHolderText{
    padding:10px 15px 15px 0;
    font-size:15px;
    line-height:20px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing: border-box;
    box-sizing:border-box;
    display:inline-block;
    position:absolute;
    margin-top:3px;
    text-indent:0;
    font-family: gotham-book;
}
#addPost .postInputBox,
#composeEmail .postInputBox,
#communityInfoCardEdit .postInputBox,
#createAlert .postInputBox{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    padding:5px 0 0 0;
    font-size:15px;
    line-height:20px;
    border:1px solid transparent;
    min-height:48px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
    font-family: gotham-book;
}
#addPost .postInputBox:focus,
#composeEmail .postInputBox:focus,
#communityInfoCardEdit .postInputBox:focus,
#createAlert .postInputBox:focus{
    border-color:#fff;
    box-shadow:none;
    -webkit-appearance:none;
    outline:none;
}
#addPost .postInputBox a,
#composeEmail .postInputBox a,
#communityInfoCardEdit .postInputBox a,
#createAlert .postInputBox a{
    color:#1ca0c8;
}
#addPost_photoPicker{
    max-height:350px;
    max-width:100%;
}
#addPost .circleAddToCircles section.circles{
    height:auto;
    padding-left:0;
    padding-right:0;
}
#addPost .circleAddToCircles .cautiousBtn{
    padding:10px 10px 7px 10px;
}
.circleAddToCircles section.circles{
    border-bottom:none;
}


/*************************************************
*  Add Post: Inline Recipient Picker
*************************************************/
.inlineRecipientListing .recipients{
    border:none;
    padding:1px 24px 3px 47px;
    margin:12px 0 12px 0;
    min-height:27px;
    max-height:none;
    line-height:20px;
    font-size:15px;
}
.inlineRecipientListing .recipients label{
    background:transparent !important;
    text-indent:4px;
    font-size:15px;
    border:none;
    color:#000;
    display:inline-block;
    position:absolute;
    font-family: Gotham;
}
.householdForm input,
.householdForm select{
    padding-left: 170px !important;
}


/*************************************************
*  Add Post: Subject Line
*************************************************/
#addPost .createPost .subjectLine,
#createAlert .subjectLine,
#composeEmail .createPost .subjectLine,
#communityInfoCardEdit .createPost .subjectLine{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:6px 0 10px 10px;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .05);
    border:none;
    background:#fff;
}
#addPost .createPost .subjectLine input,
#createAlert .subjectLine input,
#addPost .createPost .subjectLine span,
#composeEmail .createPost .subjectLine input,
#communityInfoCardEdit .createPost .subjectLine input{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    background:transparent;
    width:100%;
    padding:0 10px 12px 0;
    height:45px;
    font-size:15px;
    color:#000;
    border:1px solid transparent;
    border-bottom:1px solid #e4e5ed;
    -webkit-appearance: none;
    cursor:text;
}

.voiceContentScreen div,
.smsContentScreen div{
    margin-bottom: 1px;
    font-size: 14px !important;
}

.voiceContentScreen .communityManage .buttonIsSelected,
.voiceContentScreen .communityManage .buttonIsNotSelected,
.smsContentScreen .communityManage .buttonIsSelected,
.smsContentScreen .communityManage .buttonIsNotSelected{
    top: 10px;
    left: 0px;
    margin-right: 5px;
    text-indent: -9999px;
}

.voiceContentScreen span,
.smsContentScreen span {
    font-size: 14px !important;
}
#addPost .createPost .subjectLine input:focus,
#composeEmail .createPost .subjectLine input:focus,
#communityInfoCardEdit .createPost .subjectLine input:focus{
    border:1px solid transparent;
    border-bottom:1px solid #e4e5ed;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
#addPost .createPost .subjectLine ~ .createPostBody,
#createALert .subjectLine ~ .createPostBody,
#composeEmail .createPost .subjectLine ~ .createPostBody,
#communityInfoCardEdit .createPost .subjectLine ~ .createPostBody{
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
}


/*************************************************
*  Add Post: Categories
*************************************************/
#addPost .createPost .tags{
    display:inline-block;
    font-size:17px;
    line-height:20px;
    height:20px;
    padding:0 6px 0 20px;
    position:relative;
    margin:25px 0 5px 0;
}
#addPost .createPost .tags:before{
    height:20px;
    position:absolute;
    left:2px;
    top:-4px;
}
#addPost .createPost .tagGeneral:before{
    width:20px;
}



/***************************************
* Post Options
***************************************/
.postOptions{
    background:#fff;
    border-bottom:none;
    border-top:1px solid #e8e8e8;
    position:relative;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50px;
}
.postOptions ul:not(.optionsList){
    border-top:1px solid #fff;
    list-style:none;
    padding:0;
    text-align:right;
    margin:0;
    display:table;
    table-layout:fixed;
    width:100%;
}
.postOptions li{
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    font-size:11px;
    padding-top:13px;
    position:relative;
}
.postOptions li button{
    font-size:11px;
    margin-top:-1px;
    overflow:visible;
}
.postOptions li .insertVideo,
.postOptions li .insertPhoto,
.postOptions li .insertVideo,
.postOptions li .attachFiles{
    cursor:pointer;
}
.postOptions li .browseDesktop,
.postOptions li .browsePhone,
.pickStudentAvatar .browseDesktop {
    width:28px;
    height:50px;
    display:inline-block;
    text-indent:-9999px;
    padding:0;
    outline:none;
    vertical-align:middle;
    margin-right:6px;
}
.postOptions li .browseDesktop::-ms-browse,
.postOptions li .browseDesktop::-ms-value,
.pickStudentAvatar .browseDesktop::-ms-browse ,
.pickStudentAvatar .browseDesktop::-ms-value {
    border:none;
    opacity:0;
    filter:alpha(opacity=0);
}
.postOptions li .browseDesktop:active,
.pickStudentAvatar .browseDesktop:active,
.postOptions li .browsePhone:active{
    opacity:0.6;
    filter:alpha(opacity=60);
}
.postOptions li .browseDesktop,
.pickStudentAvatar .browseDesktop{
    display:none;
}
.postOptions li .browseDesktop + label,
.pickStudentAvatar .browseDesktop + label,
#handleAudioInput ul li{
    line-height:49px;
    display:block;
    padding-left:0;
    cursor:pointer;
    white-space:nowrap;
    font-family: gotham;
}
.postOptions li .browseDesktop + label:active,
.pickStudentAvatar .browseDesktop + label:active{
    opacity:0.6;
    filter:alpha(opacity=60);
}
.postOptions li .browseDesktop + label:before{
    content:"";
    display:inline-block;
    height:30px;
    width:32px;
    margin:0 0 0 -16px;
    vertical-align:middle;
    position:absolute;
    top:0;
    left:50%;
}
.postOptions li .insertPhoto .browseDesktop + label:before,
.inputImageVideoActivity div .attachImage+label:after{
    background-position:-209px -1024px;
}
.postOptions li .insertVideo .browseDesktop + label:before{
    background-position:-464px -1684px;
}
.postOptions li .attachFiles .browseDesktop + label:before{
    background-position:-144px -1023px;
}
.postOptions li .browseDesktop + label:after,
.postOptions li button:after{
    content:attr(data-abbrText);
}
.postOptions li .browsePhone{
    background-position:-210px -1016px;
}
.postOptions .addGroups{
    width:55%;
    height:36px;
    line-height:40px;
    display:inline-block;
    position: absolute;
    top:0px;
    right:0px;
    padding:0;
    border:none;
    border-left:1px solid #e4e5ed;
    text-align:left;
    text-indent:42px;
    color:#8e8e8e;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    cursor:pointer;
}
.postOptions .addGroups:active{
    background:#e4e5ed;
    border-left:1px solid #c3c3c3;
}
.postOptions .addGroups:before{
    content:"";
    position:absolute;
    top:0;
    display:block;
    width:47px;
    height:36px;
    background-position:-265px -1020px;
}
.postOptions .addGroups:after{
    content:"";
    position:absolute;
    top:0;
    right:5px;
    display:block;
    width:15px;
    height:36px;
    background-position:-156px -1321px
}
.postOptions li .reshareOption{
    height:50px;
    width:100%;
    padding:0;
    display:block;
    margin:0;
    border:none;
    position:relative;
}
.postOptions li .reshareOption:before{
    content:"";
    width:23px;
    height:50px;
    display:inline-block;
    margin:0 6px 0 0;
    padding:0;
    vertical-align:middle;
    border:none;
    background-position:-341px -1017px;
}
.postOptions li .reshareOption.blockReShareSelected:before{
    background-position:-405px -1017px;
}
.postOptions li .reshareOption:active,
.postOptions li .blockReShareSelected:active{
    opacity:0.6;
    filter:alpha(opacity=60);
}
.postOptions li .postFb,
.postOptions li .shareOptions,
.postOptions li .scheduleOption,
.postOptions li .RoboCallOption,
.postOptions li .membersManagerOptions,
.postOptions li .noCommentOption,
.postOptions li .annotationRecordOption,
#imageDraw .postOptions li button{
    height:50px;
    width:100%;
    padding:0;
    display:block;
    border:none;
    position:relative;
}
.postOptions li .postFb:before,
.postOptions li .shareOptions:before,
.postOptions li .scheduleOption:before,
.postOptions li .RoboCallOption:before,
.postOptions li .membersManagerOptions:before,
.postOptions li .noCommentOption:before,
.postOptions li .annotationRecordOption:before,
#imageDraw .postOptions li button:before,
.inputImageVideoActivity .annotationRecordOption:before{
    content:"";
    width:32px;
    height:30px;
    display:inline-block;
    margin:-12px 0 0 -16px;
    padding:0;
    position:absolute;
    top:0;
    left:50%;
    vertical-align:middle;
    border:none;
}
.postOptions li .annotationRecordOption:before{
    top: 4px;
}
.postOptions li .postFb:before{
    background-position:-209px -482px;
}
.fbSelected .postOptions li .postFb:before{
    background-position:-209px -542px;
}
.postOptions li .scheduleOption:before,
.postOptions li .membersManagerOptions:before{
    background-position:-337px -1145px;
}
.postOptions li .RoboCallOption:before{
    background-image:url(../images/roboCallgray1.png);
    background-size: contain;
}
.postOptions li .RoboCallOption.roboCallSelected:before{
    background-image:url(../images/roboCallgreen.png);
    background-size: contain;
}
.postOptions li .scheduleOption.scheduleSelected:before{
    background-position:-401px -1145px;
}
.postOptions li .postFb:active,
.postOptions li .scheduleOption:active,
.postOptions li .membersManagerOptions:active,
.postOptions li .scheduleSelected:active{
    opacity:0.6;
    filter:alpha(opacity=60);
}

.postOptions li .membersManagerOptions.buttonCommunityManageFotter{
    height: 30px;
    height: 35px;
    margin-top: 0px !important;
}
.postOptions li .noCommentOption:before{
    background-position:-464px -599px;
}
.postOptions li .noCommentOption.noCommentSelected:before{
    background-position:-464px -659px;
}
.postOptions li .noCommentOption:active,
.postOptions li .noCommentSelected:active{
    opacity:0.6;
    filter:alpha(opacity=60);
}
.postOptions li.shareFB{
    /*position:static;*/
}
.postOptions li .fbPageTitle{
    display:none;
}
.fbSelected{
    padding-bottom:77px !important;
}
.fbSelected .postOptions{
    margin-top:27px;
}
.fbSelected .postOptions li .postFb:active{
    opacity:0.3;
    filter:alpha(opacity=30);
}
.fbSelected .postOptions li .postFb + .fbPageTitle{
    display:block;
    position:absolute;
    background:#39569c;
    bottom:64px;
    width:100%;
    height:28px;
    left:0;
    line-height:28px;
    text-shadow:none;
    color:#fff;
}
.fbSelected .postOptions li .postFb + .fbPageTitle ul{
    display:table;
    margin:0 auto;
    list-style:none;
    width:auto;
    border:none;
}
.fbSelected .postOptions li .postFb + .fbPageTitle li{
    display:table-cell;
    padding:0 5px;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
    border:none;
}
.fbSelected .postOptions li .postFb + .fbPageTitle li:first-of-type{
    max-width:240px;
}
.fbSelected .postOptions li .postFb + .fbPageTitle li a{
    color:#fff;
    text-decoration:underline;
}
section.scheduledFor{
    -webkit-animation: fadeinInput 1s;
    -moz-animation: fadeinInput 1s;
    -ms-animation: fadeinInput 1s;
    -o-animation: fadeinInput 1s;
    animation: fadeinInput 1s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
section.scheduledFor label{
    /*font-size:18px;*/
    line-height:59px;
}
section.scheduledFor .separateTime .altDatePicker{
    margin-top:-59px;
}
section.scheduledFor .separateTime{
    border-bottom:none !important;
}
section.scheduledFor .separateTime .datePicker{
    /*font-size:17px;*/
    width:100px;
    margin-left:105px;
}
section.scheduledFor .separateTime .timePicker input{
    /*font-size:17px;*/
}
#imageDraw .postOptions li button.selected{
    color:#00a3d1;
}
#imageDraw .postOptions li button.annotationRecordOption.selected{
    color:#c03521;
}
#imageDraw .loadingShadowBox {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.2);
}
#imageDraw .loadingShadowBox:after{
    content: "";
    background-image: url("../images/loadingL.gif");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
    background-color:rgba(255,255,255,.85);
    width: 100px;
    height: 84px;
    margin:-42px 0 0 -50px;
    display: block;
    left: 50%;
    top: 50%;
    position: absolute;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 2px 10px rgba(0,0,0,.5);
}

.loadingSpinner:after,
.translateLink.showTranslateLoading:after,
.fileUploadInProcess:before{
    content: "";
    background-image: url("../images/loadingL.gif");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    display: block;
    width: 25px;
    height: 20px;
    position: absolute;
    top: 13px;
    right: 10px;
}

.translateLink.showTranslateLoading{
    align-items: center;
    display: inline-flex !important;
    pointer-event: none;
}

.translateLink.showTranslateLoading:after{
    position: relative;
    top: 0;
    right: 0;
    display: inline-block;
}

.loadingSpinner.nextButton{
    padding-right: 40px;
}

.loadingSpinner.withinButton:after{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    top: unset;
    right: unset;
}

.postOptions li .annotationSelectOption:before{
    background-position:-15px -1685px;
}
.postOptions li .annotationDrawOption:before{
    background-position:-79px -1685px;
}
.postOptions li .annotationArrowOption:before{
    background-position:-144px -1685px;
}
.postOptions li .annotationTextOption:before{
    background-position:-208px -1685px;
}
.postOptions li .annotationRecordOption:before,
.inputImageVideoActivity .annotationRecordOption:before{
    background-position:-272px -1685px;
}

.inputImageVideoActivity .annotationRecordOption:before{
    margin: 0;
    position: inherit;
    left: 5px;
    top:2px;
}

.postOptions li .annotationUndoOption:before{
    background-position:-336px -1685px;
}
.postOptions li .annotationRedoOption:before{
    background-position:-400px -1685px;
}



.postOptions li .annotationSelectOption.selected:before{
    background-position:-15px -1745px;
}
.postOptions li .annotationDrawOption.selected:before{
    background-position:-79px -1745px;
}
.postOptions li .annotationArrowOption.selected:before{
    background-position:-144px -1745px;
}
.postOptions li .annotationTextOption.selected:before{
    background-position:-208px -1745px;
}
.postOptions li .annotationRecordOption.selected:before,
.inputImageVideoActivity .annotationRecordOption.selected:before{
    background-position:-272px -1745px;
}
.postOptions li .annotationUndoOption.selected:before{
    background-position:-336px -1745px;
}
.postOptions li .annotationRedoOption.selected:before{
    background-position:-400px -1745px;
}






/*************************************************
*  Post: Photo Bound Box
*************************************************/
.boundingBoxPhoto{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border:none;
    padding:0;
    overflow:hidden;
    text-align:center;
    overflow:hidden;
    line-height:1px;
    position:relative;
    display:inline-block;
    width:auto;
    margin-top: 20px;
}
.boundingBoxPhoto:active{
    border:none;
}
.boundingBoxPhoto .remove,
.studentTemplateMainContainer .remove,
.audio.addPost .remove,
#post-content-placeholder .remove{
    display:none;
    width:20px;
    height:20px;
    position:absolute;
    right:2px;
    top:2px;
    text-indent:-9999px;
    cursor:pointer;
    -webkit-transform: translate3d(0,0,0);
    background:#000;
    box-shadow:0 2px 2px rgba(37,37,37,0.02);
    font-size:0;
    border-radius:50%;
}
.boundingBoxPhoto .remove:before, .boundingBoxPhoto .remove:after,
.studentTemplateMainContainer .remove:before, .studentTemplateMainContainer .remove:after,
.audio.addPost .remove:before, .audio.addPost .remove:after {
    content: "";
    height: 10px;
    width: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius: 10px;
}
.boundingBoxPhoto .remove:before, .studentTemplateMainContainer .remove:before, .audio.addPost .remove:before { transform:rotate(45deg); }
.boundingBoxPhoto .remove:after, .studentTemplateMainContainer .remove:after, .audio.addPost .remove:after { transform:rotate(-45deg); }


.audio.addPost .remove{
    position: relative !important;
    float: right;
    top: 40px;
    right: -5px;
    z-index: 9999;
}
.boundingBoxPhoto .remove,
.studentTemplateMainContainer .remove,
.audio.addPost .remove{
    opacity:.8;
    filter:alpha(opacity=80);
    display: block;
}
.boundingBoxPhoto .remove:hover,
.studentTemplateMainContainer .remove:hover,
.studentTemplateContainer,
.audio.addPost .remove:hover{
    opacity:1;
    filter:alpha(opacity=100);
}
.audio.addPost .remove:after{
    text-indent:5px !important;
}
.studentTemplateMainContainer .remove:after{
    text-indent: 5px;
}
.boundingBoxPhoto.audioControls{
    background: #f1f3f4;
    border-radius: 25px;
    white-space: nowrap;
    width: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.boundingBoxPhoto.audioControls audio{
    width: 88%;
}
.boundingBoxPhoto.audioControls a{
    background-position: -522px -1080px;
    height: 35px;
    width: 40px;
    margin-left: -10px;
}
.boundingBoxPhoto.audioControls span{
    position: absolute;
    top: 15px;
    left: 35%;
}
.boundingBoxPhoto .remove:after{
    top: 0px;
}
.boundingBoxPhoto img{
    max-width:420px;
    width:100%; /* Needed for images wider than 420px.  Without will cause horizontal scrolling. */
    /*max-height:420px;  (With it will cause images taller 420px to be distorted. With it will cause full width in compose, but when displayed will be scaled down to 420px height from server.) */
}
.boundingBoxPhoto.selected.uploading:after {
    content: attr(data-displaystatus);
    position: absolute;
    display: block;
    top: 20px;
    left: 10px;
    color: #fff;
    font-size: 14px;
    text-shadow: 0 2px 5px rgba(0,0,0,.2);
}
.boundingBoxPhoto.selected.uploading > img,
.boundingBoxPhoto.selected.uploading > video{
    max-width:100%;
    max-height:320px;
    opacity: 0.4;
    filter: alpha(opacity=40);
    filter: blur(5px);
    -webkit-filter: blur(5px);
}
.imageDrawActive:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    color: #fff;
    text-shadow: none;
    top:0;
}
.videoPlay:after,
.imageDrawActive:after{
    content: "Click to edit";
    cursor: pointer;
    display: inline-block;
    width: 100px;
    position: absolute;
    top: 50%;
    color: #fff;
    text-shadow: none;
    font-size: 16px;
    background: rgba(0, 0, 0, 0.5);
    line-height: 30px;
    height: 30px;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    margin-left: -50px;
    text-align:center;
    margin-top:-10px;
    left:50%;
}
span.singlePhoto.videoPhoto {
    display: block !important;
    cursor: pointer;
    overflow:auto;
    max-width: 500px;
    width: 100%;
}
.videoPhoto .videoPlay:after,
.imageDrawActive.videoType:after,
.videoPlay.fromAlbum:after{
    content: url(../images/playThumbnail.png) "\00a0 \00a0 Play";
    width:86px;
    margin-left:-43px !important;
    margin-top:-20px;
}
.videoWrapper{
    display: inline-block !important;
    position: relative;
    margin: 0 0 10px 0;
    float:left;
    width: auto;
    min-height: 30px;
    max-width: 420px;
}
.videoWrapper img{
    float:left;
    margin:0 !important;
}
.uploading .videoWrapper>img{
    opacity: 0.3;
    filter: blur(3px);
}
.boundingBoxPhoto.uploading{
    background: black !important;
}
.boundingBoxPhoto.uploading video {
    filter: blur(5px);
    opacity: 0.3 !important;
    display: block !important;
}
.boundingBoxPhoto.uploading .videoPlay {
    display: none;
}
.boundingBoxPhoto.uploading .videoPlayer  {
    background: black;
}
.boundingBoxPhoto .videoWrapper {
    margin: 0 !important;
}
.videoWrapper videogular vg-media video{
    max-width: 420px;
    max-height: 420px;
    width: auto;
    height: auto;
}
article.update .videoPlayerPhone videogular vg-media video{
    max-width: 100%;
}
.videoWrapper videogular vg-media video::-webkit-media-controls-volume-slider,
.videoWrapper videogular vg-media video::-webkit-media-controls-mute-button{
    display:none;
}
.videoWrapper videogular vg-media video::-webkit-media-controls-panel{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border: solid rgba(0,0,0,.1);
    border-width: 0 1px 1px 1px;
}
.videoPlayerChromeWebBrowser video::-webkit-media-controls {
    overflow: hidden !important
}
.videoPlayerChromeWebBrowser video::-webkit-media-controls-enclosure {
    margin-left: auto;
    width:100%;
}
.videoPlayerChromeWebBrowser video::-webkit-media-controls-fullscreen-button{
    margin-right: -1px;
    overflow: visible;
    box-shadow: inset -1px -1px rgba(0,0,0,.1);
    padding-right: 5px;
    width: 120px;
    position: absolute;
    right: 0;
    background-color:#fafafa;
    background-position:68px -485px;
}
.videoPlayerChromeWebBrowser video::-webkit-media-controls-timeline{
    position: relative;
    z-index: 2;
}





/*************************************************
*  Post: Video Bound Box
*************************************************/
.typeVideo .boundingBoxPhoto{
    background:#000;
}
.ie .typeVideo .boundingBoxPhoto.uploading{
    background:#fff;
}
.typeVideo .boundingBoxPhoto video{
    opacity:.96;
}



/*************************************************
*  Post: Attachments
*************************************************/
.attachedFiles{
    margin-top:20px;
}
.attachedFiles ul{
    list-style:none;
    padding:0 35px 0 0;
    font-size:17px;
    margin:0;
}
.attachedFiles li{
    list-style:none;
    padding:0;
    font-size:15px;
    line-height:40px;
    position:relative;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.attachedFiles li a:before{
    content:"";
    width:42px;
    height:42px;
    display:inline-block;
    vertical-align:middle;
}
.attachedFiles li.typeLoading a:before{
    background: url(../images/ajax-loader2.gif) no-repeat;
    background-position:5px 3px;
}
.attachedFiles li.typeDocument a:before{
    background-position:-586px -1258px;
}
.attachedFiles li.typeSpreadsheet a:before{
    background-position:-650px -1258px;
}
.attachedFiles li.typePresentation a:before{
    background-position:-522px -1258px;
}
.attachedFiles li.typePDF a:before{
    background-position:-458px -1258px;
}
.attachedFiles li.typeZip a:before{
    background-position:-330px -1258px;
}
.attachedFiles li.typeImage a:before{
    background-position:-266px -1258px;
}
.attachedFiles li.typeVideo a:before{
    background-position:-394px -1198px;
}
.attachedFiles li.typeAudio a:before{
    background-position:-203px -1258px;
}
.attachedFiles li.typeOther a:before{
    background-position:-394px -1258px;
}
.attachedFiles li a{
    line-height:40px;
    display:inline-block;
    vertical-align:middle;
    overflow:hidden;
    text-overflow:ellipsis;
    width:100%;
    padding:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    color:#000;
}
.attachedFiles li button.remove{
    width:42px;
    height:42px;
    text-indent:-9999px;
    position:absolute;
    right:-42px;
    border:none;
    background-position:-584px -1018px;
    background-color:transparent;
    opacity:.4;
    filter:alpha(opacity=40);
}
.Desktop .attachedFiles li button.remove{
    opacity:0;
    filter:alpha(opacity=0);
}
.Desktop .attachedFiles li:hover button.remove{
    opacity:.4;
    filter:alpha(opacity=40);
}
.attachedFiles li button.remove:hover,
.attachedFiles li button.remove:active,
.Desktop .attachedFiles li button.remove:hover,
.Desktop .attachedFiles li button.remove:active{
    opacity:1;
    filter:alpha(opacity=100);
}




/*************************************************
*  Post: Snippet
*************************************************/
div.articleSnippet{
    position:relative;
    margin-top:13px;
    max-width:420px;
}
div.articleSnippet article .snippetImg{
    width:100px;
    height:100px;
    background-size:cover;
    background-position:center;
    float:left;
    margin-right:10px;
}
div.articleSnippet article{
    padding-bottom:10px;
    max-width:420px;
    background:#fafafa;
    overflow: auto;
}
div.articleSnippet article h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    width:auto;
    margin:0;
    height:auto;
    text-indent:0;
    line-height:1.25;
    font-size:14px;
}
div.articleSnippet article .linkToArticle{
    display:block;
    font-size:14px;
    line-height:16px;
    padding-bottom:12px;
}
div.articleSnippet article p{
    margin:0;
    padding:0;
    font-size:14px;
    line-height:16px;
    max-height:48px;
    overflow:hidden;
}
div.articleSnippet .remove{
    display:none;
    width:50px;
    height:50px;
    position:absolute;
    top:-10px;
    right:-10px;
    text-indent:-9999px;
    cursor:pointer;
}
div.articleSnippet .remove{
    opacity:.8;
    filter:alpha(opacity=80);
}
div.articleSnippet .remove:hover{
    opacity:1;
    filter:alpha(opacity=100);
}
div.articleSnippet .remove:after{
    content:"X";
    width:20px;
    height:20px;
    line-height:21px;
    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
    border:2px solid #fff;
    position:absolute;
    top:4px;
    right:4px;
    display:block;
    text-indent:0;
    text-align:center;
    color:#fff;
    box-shadow:0 2px 2px rgba(0,0,0,1);
    background:rgba(0,0,0,.7);
    text-shadow:none;
    font-family:arial;
    font-size:14px;
}
div.articleSnippet.selected .remove{
    display:block;
}
article.update .resharedUpdate .hgroup + p:last-of-type + .articleSnippet{
    margin-top:34px;
}





/*************************************************
*  Post: Share Calendar Event
*************************************************/
#addPost .resharedUpdate{
    padding:15px 0 0 0;
    margin:15px 0 0 0;
    position:relative;
    background:#fff;
    border:1px solid;
    border-color:#e1e1e1 #e1e1e1 #e9e9e9 #e1e1e1;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:none;
}
#addPost .resharedUpdate .hgroup + p{
    margin-top:0;
}
#addPost .resharedUpdate .hgroup + p:last-of-type{
    margin-bottom:15px;
}
#addPost .calendarInvite h2 .profileM{
    text-indent:5px;
}
#addPost .calendarInvite h3{
    padding-left:15px;
    margin-top:-2px;
}
#addPost .calendarInvite .postBody{
    margin-top:-14px;
    padding:0 0 20px 0;
}
#addPost .update .profileM{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:15px;
}
#addPost .update h3{
    padding-left:15px;
    margin-top:-30px;
}



/*************************************************
*  Post: Group Welcome Message
*************************************************/
article.update.groupWelcome{
    padding-bottom:0;
}
article.update.groupWelcome .feedbackControl{
    position:relative;
    height:auto;
    border-top:none;
    overflow:visible;
    background:transparent;
    margin-top:20px;
}
article.update.groupWelcome .feedbackControl ul{
    overflow:visible;
}
article.update.groupWelcome .feedbackControl li{
    display:block;
    border-top:1px solid #e4e5ed;
    width:100%;
    height:50px;
    line-height:50px;
    color:#000;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-align:left;
    margin-left:-10px;
    padding:0 20px 0 0;
    overflow:hidden;
    text-overflow:ellipsis;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
}
article.update.groupWelcome .feedbackControl li.drillDown:after{
    right:0;
}
article.update.groupWelcome .feedbackControl li img{
    content:"";
    width:32px;
    height:32px;
    display:inline-block;
    margin:-4px 5px 0 10px;
    vertical-align:middle;
}
article .feedbackControl li.inviteOthers img{
    background-position:-653px -1384px;
}
article .feedbackControl li.viewCalendar img{
    background-position:-653px -1444px;
}
.postsTab article.update.groupWelcome .groupMembers,
.postsView article.update.groupWelcome .groupMembers{
    margin:14px 0 -15px 0;
}


/*************************************************
*  Post: Group Member Horiz Listing
*************************************************/
.postsTab article.update .groupMembers{
    background:transparent;
    padding:0;
    margin:0 0 0 13px;
    border:none;
    box-shadow:none;
}
.postsTab article.update .groupMembers a:first-of-type{
    border:none;
    margin-right:4px;
    padding-right:0;
}
.postsTab article.update .calendarInvite + .groupMembers{
    margin-top:-28px;
}
.postsTab article.update .calendarInvite + .groupMembers .labelAttendees{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:17px;
    padding-top:10px;
    display:block;
    margin-left:-3px;
    margin-bottom:-7px;
}
.postsTab article.update .changeNotice .labelEventUpdates{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    display:block;
    margin:0 0 0 -10px;
    padding:10px 10px 0 10px;
    width:100%;
}
.postsTab article.update .calendarInvite ~ .groupMembers,
.postsTab article.update .calendarInvite ~ .messages{
    margin-top:-10px;
}
.postsTab article.update .messages .labelComments{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:17px;
    display:block;
    text-indent:10px;
    margin:24px 0 -4px 0;
    position:relative;
    z-index:1;
    padding-top:10px;
}
.postsTab article.update .calendarInvite ~ * label{
    border-top:1px solid #ececec;
    max-width:420px;
}
.postsTab article.update .calendarInvite + * label{
    border-top:none;
}



/*************************************************
*  Post: Date display graphic
*************************************************/
article .dateDisplay{
    width:55px;
    list-style:none;
    text-align:center;
    background:#fff;
    border-bottom:1px solid #e4e4e4;
    padding:0 0 2px 0;
    -moz-border-radius-topleft:3px;
    -webkit-border-radius-topleft:3px;
    border-top-left-radius:3px;
    -moz-border-radius-topright:3px;
    -webkit-border-radius-topright:3px;
    border-top-right-radius:3px;
    overflow:hidden;
    position:absolute;
    margin:11px;
    box-shadow:1px 0px 5px rgba(0,0,0,.08);
}
article .dateDisplay .month{
    background:#d71a00;
    color:#fff;
    font-size:12px;
    line-height:17px;
    height:16px;
    text-shadow:none;
    box-shadow:1px 0px 0px #d71a00;
}
article .dateDisplay .date{
    font-size:24px;font-size: 24px;
    margin:3px 0 1px 0;
}
article .dateDisplay .day{
    font-size:9px;
    margin-top:-4px;
}
article .dateDisplay + .hgroup{
    margin:-7px 0 -2px 56px;
    top:0;
}
article .dateDisplay + .hgroup h2 .profileM:after{
    margin-top:0px;
    padding-right:10px;
}
article .dateDisplay + .hgroup h3{
    margin-top:9px;
    overflow:visible;
}
article .dateDisplay + .hgroup h3 .tags{
    margin:-5px 0 0 -2px;
    font-size:14px;
}
article .dateDisplay + .hgroup h3 .tags:before{
}
article .dateDisplay ~ .postBody{
    padding-bottom:5px;
}



/*************************************************
*  Post: Detail View
*************************************************/
.postView{
    padding-bottom:46px;
}
.postView .contentArea{
    padding-top:20px;
}
.postView .actionBar .backButton{
    text-indent:-9999px;
}
.postView .actionBar .backButton:before{
    background-position:-63px -1318px;
}
.postView article p span{
    cursor:default;
}
.postView article.postContent{
    padding:10px;
}
.postView article.postContent .profileM{
    width:40px;
    overflow:hidden;
}
.postView article.postContent>span{
    margin-right:5px;
}
.postView article .feedbackControl,
.postView article .feedbackCounts{
    display:none;
}
.postView article.update p{
    margin-bottom:0;
    cursor:default;
}
.postView article .bgCover{
    display:none !important;
}
.postView .chatInput button.like,
.postView .chatInput button.likeSelected,
.postView .chatInput button.share{
    right:auto;
    left:0;
    height:39px;
    width:46px;
    line-height:39px;
    text-indent:-9999px;
    border: none;
    background:none;
    text-align:left;
    padding:0;
    margin:5px 0 0 0;
    position:absolute;
    z-index:1;
}
.postView .chatInput button.disabled.like,
.postView .chatInput button.disabled.likeSelected{
    opacity:.6;
    filter: alpha(opacity=60);
    cursor:auto;
}
.postView .chatInput button.share{
    left:40px;
}
.postView .chatInput button.like:before,
.postView .chatInput button.likeSelected:before,
.postView .chatInput button.share:before{
    content:"";
    float:left;
    width:44px;
    height:37px;
    display:inline-block;
}
.postView .chatInput button.like:before{
    background-position: -8px -1143px;
}
.postView .chatInput button.likeSelected:before{
    background-position: -8px -1203px;
}
.postView .chatInput button.share:before{
    background-position: -329px -1143px
}
.postView article .metaInfo{
    margin-bottom:0;
    cursor:default;
}
.postView .contentArea article.update{
    /*padding-bottom:28px;*/
    padding-bottom:10px;
}
article .postContentWrapper .metaInfo{
    min-height:0;
}
article .metaInfo .postContentWrapper .tags{
    margin-top:25px;
}



/*************************************************
*  Post: Comments
*************************************************/
.postsTab article.message,
.postView article.message,
.calendarEventDetails article.message{
    margin-bottom:-1px;
    height:auto;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
}
.postsTab .messages .profileM,
.postView .messages .profileM,
.calendarEventDetails .messages .profileM{
    font-size:15px;
    line-height:20px;
}
.postsTab article.message p,
.postView article.message p,
.calendarEventDetails .postView article.message p{
    height:auto;
    padding-bottom:5px;
    font-size:15px;
    line-height:20px;
    margin-top:-36px;
}
.postsTab .messages h1 + article,
.postView .messages h1 + article,
.calendarEventDetails .messages h1 + article{
    -moz-border-radius-topleft:4px;
    -webkit-border-radius-topleft:4px;
    border-top-left-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-radius-topright:4px;
    border-top-right-radius:4px;
}
.postsTab .messages article.message:last-of-type,
.postView .messages article.message:last-of-type,
.calendarEventDetails .messages article.message:last-of-type{
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
}
.postsTab .messages .message,
.postView .messages .message,
.calendarEventDetails .postView .messages .message{
    background:#fff;
}
.postsTab #postView_postCommentsSection.messages .message,
.postView #postView_postCommentsSection.messages .message,
.calendarEventDetails #postView_postCommentsSection.messages .message{
    padding-left:15px;
}
.calendarEventDetails #postView_postCommentsSection.messages h1{
    background:none;
}
#postView .commentsDisabled {
    color: #8e8e8e;
    padding-top: 15px;
}



.messages .message time{
    font-size: 14px;
    color: #8e8e8e;
    font-family: 'Gotham_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    white-space: nowrap;
}


@media screen
and (max-width:787px) {
    #postView .commentsDisabled {
        padding-top: 15px;
    }
}



/*************************************************
*  Post: Comments shown in updates feed
*************************************************/
.postsTab .messages{
    margin:-20px 0 16px 0;
}
.postsTab article.message{
    box-shadow:none;
    border:none;
    padding:10px;
}
.postsTab article.message p span{
    display: inline;
}



/*************************************************
*  Post: Detail View - Inappropriate Flag
*************************************************/
.postView.flaggedItem{
    padding-bottom:85px;
}
.postView.flaggedItem .actionBar h1{
    padding:4px 40px;
}
.postView.flaggedItem .flaggedItemControl{
    box-shadow:0 -1px 3px rgba(0,0,0,.05);
    height:39px;
    position:absolute;
    width:100%;
    background:#f5f5f5;
    border-top:1px solid #c3c3c3;
}
.postView.flaggedItem .flaggedItemControl ul{
    margin:0;
    display:table;
    height:39px;
    width:100%;
    padding:0;
}
.postView.flaggedItem .flaggedItemControl li{
    list-style:none;
    display:table-cell;
    border-right:1px solid #c3c3c3;
    line-height:39px;
    text-align:center;
    cursor:pointer;
}
.postView.flaggedItem .flaggedItemControl li:active{
    background:#f1f1f1;
}
.postView.flaggedItem .flaggedItemControl li:first-of-type{
    min-width:65px;
}
.postView.flaggedItem .flaggedItemControl li:last-of-type{
    border-right:none;
}
.postView.flaggedItem .flaggedItemControl + .chatInput{
    box-shadow:none;
}
article.flaggedComment.message p{
    margin:0;
}
article.flaggedComment .hgroup{
    display:none;
}



/*************************************************
*  Post: Empty Panel Message
*************************************************/
.emptyPanelMsg,
ul.emptyPanelMsg{
    text-align:left;
    line-height:1.35;
    border-bottom:none;
    color:#8e8e8e;
    font-size:17px;
    max-width:500px;
    padding:3px 0 0 0;
    margin:18px auto 18px auto;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
ul.emptyPanelMsg{
    padding:0 0 0 30px;
}



/*************************************************
*  Post: View Counts
*************************************************/
.viewCount:before{
    content:"";
    background-position:-589px -665px;
    display:inline-block;
    vertical-align:middle;
    width:32px;
    height:32px;
}

.callCount.viewCount:before{
    background-position: -399px -1082px;
}


/*************************************************
*  Main Calendar
*************************************************/
.calendarWrapper{
    display:table;
    height:100%;
    width:100%;
}



/*************************************************
*  Main Calendar: Search Bar
*************************************************/
.calendarWrapper .searchBar{
    display:table-row;
    height:1px;
    background:#f2f2f2;
}
.calendarWrapper .searchBar ul{
    margin:0;
    padding:0;
}
.calendarWrapper .searchBar li{
    padding:0 15px;
    margin-top:1px;
    border-top:1px solid #fff;
    list-style:none;
}
.calendarWrapper .searchBar input{
    background:#dedede;
    border:none;
    height:29px;
    line-height:29px;
    margin-top:8px;
    text-align:center;
    font-size:18px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    width:100%;
    box-sizing:border-box;
    padding:0 8px;
}
.calendarWrapper .searchBar input:focus{
    background:#fff;
    text-align:left;
    outline:none;
}
.calendarWrapper .searchBar input::-webkit-input-placeholder {
    color:#000;
    font-size:18px;
}
.calendarWrapper .searchBar input:-moz-placeholder {
    color:#000;
    font-size:18px;
}
.calendarWrapper .searchBar input::-moz-placeholder {
    color:#000;
    font-size:18px;
}
.calendarWrapper .searchBar input:-ms-input-placeholder {
    color:#000;
    font-size:18px;
}
.calendarWrapper .searchBar input:focus::-webkit-input-placeholder {
    color:#aaa;
    font-size:18px;
}
.calendarWrapper .searchBar input:focus:-moz-placeholder {
    color:#aaa;
    font-size:18px;
}
.calendarWrapper .searchBar input:focus::-moz-placeholder {
    color:#aaa;
    font-size:18px;
}
.calendarWrapper .searchBar input:focus:-ms-input-placeholder {
    color:#aaa;
    font-size:18px;
}



/*************************************************
*  Main Calendar: Days Header
*************************************************/
.calendarWrapper .daysLabel{
    display:table-row;
    height:1px;
    background:#f2f2f2;
}
.calendarWrapper .daysLabel ul{
    padding:0;
    margin:0;
    display:table;
    table-layout:fixed;
    width:100%;
}
.calendarWrapper .daysLabel li{
    font-size:13px;
    color:#c3c3c3;
    height:15px;
    line-height:15px;
    padding-top:10px;
    list-style:none;
    display:table-cell;
    text-align:center;
}



/*************************************************
*  Main Calendar: Date Header
*************************************************/
.calendarWrapper .datePicker{
    height:1px;
    background:#f2f2f2;
    display:table-row;
    padding-bottom:15px;
}
.calendarWrapper .datePicker .scrollMask{
    width:100%;
    white-space:nowrap;
    overflow-x:scroll;
    -webkit-overflow-scrolling:touch;
}
.calendarWrapper .datePicker .scrollMask::-webkit-scrollbar{
    height:1px;
}
.calendarWrapper .datePicker .scrollMask::-webkit-scrollbar-track{
    background:transparent;
}
.calendarWrapper .datePicker .scrollMask::-webkit-scrollbar-thumb{
    background:transparent;
}
.calendarWrapper .datePicker .scrollMask:hover::-webkit-scrollbar-thumb{
    background:transparent;
}
.calendarWrapper .datePicker section{
    width:100%;
    display:inline-block;
    position:relative;
}
.calendarWrapper .datePicker ul{
    padding:0;
    margin:0;
    list-style:none;
    display:table;
    table-layout:fixed;
    width:100%;
}
.calendarWrapper .datePicker li{
    display:table-cell;
    text-align:center;
    line-height:40px;
    height:40px;
    font-size:18px;
}
.calendarWrapper .datePicker li.disabled{
    color:#c3c3c3;
}



/*************************************************
*  Main Calendar: Dragger
*************************************************/
.calendarWrapper .dragger{
    display:table-row;
    height:1px;
}
.calendarWrapper .dragger span{
    height:14px;
    line-height:14px;
    background:#f2f2f2;
    display:block;
    cursor:n-resize;
}
.calendarWrapper .dragger span:before{
    content:"";
    width:30px;
    height:14px;
    display:block;
    margin:0 auto;
    background-position:-18px -1095px;
}



/*************************************************
*  Main Calendar: Entries
*************************************************/
.calendarWrapper .eventListing{
    display:table-row;
}
.calendarWrapper .eventListing .scrollView{
    border-top:1px solid #c3c3c3;
}
.calendarWrapper .eventListing .scrollView .contentArea{
    padding-top:15px;
}



/*************************************************
*  Main Calendar: Calendar Views
*************************************************/
#calendar.calendarTab .scrollView>div,
.orgCalendarPage .scrollView,
.orgCalendarPage .scrollView>div{
    height:100% !important;
}
#calendar.calendarTab .scrollView>div .contentArea,
.orgCalendarPage .scrollView>div .contentArea{
    min-height:100%;
    padding-bottom:10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
#calendar.calendarTab .calendarViews,
.orgCalendarPage .calendarViews{
    display:table;
    height:100%;
    width:100%;
    position:relative;
}
#calendar.calendarTab .calendarViews .btn-group,
.orgCalendarPage .btn-group{
    display:table-row;
    height:44px;
    text-align:center;
}
#calendar.calendarTab .calendarViews .calendar,
.orgCalendarPage .calendarViews .calendar{
    display:table-row;
}

/* Calendar Control */
.bloomzCalendar .calendarViews .fc-widget-content{
    border-color:transparent;
}

/* Date navigation */
.bloomzCalendar .calendarViews .fc-toolbar.fc-header-toolbar{
    padding:18px;
    margin-bottom:0;
    background:#fff;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
    border:1px solid #e4e5ed;
    border-bottom:none;
}
.bloomzCalendar .calendarViews .fc-toolbar.fc-header-toolbar .fc-left h2{
    font-size:20px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-today-button{
    color:#000;
    background:transparent;
    border:none;
    text-transform:capitalize;
    box-shadow:none;
    padding:0;
    position: relative;
    top: 2px;
}
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-state-disabled{
    opacity:.3;
    filter:alpha(opacity=30);
    text-decoration:none;
}
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-button{
    background:transparent;
    border:none;
    box-shadow:none;
    margin-left:0;
    padding:0;
}
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-left-single-arrow:after{
    content: "";
    width: 24px;
    background-position:-341px -610px;
    display: block;
    height: 17px;
}
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-right-single-arrow:after{
    content: "";
    width: 24px;
    background-position:-342px -670px;
    display: block;
    height: 17px;
}

/* Calendar table */
.bloomzCalendar .calendarViews .fc-view-container{
    background:#fff;
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
    border:solid #e4e5ed;
    border-bottom-color:#e4e5ed;
    border-width:0 1px 1px 1px;
}


/* Calendar table header */
.bloomzCalendar .calendarViews .fc-widget-header{
    border:none;
}
.bloomzCalendar .calendarViews .fc-day-header{
    color:#8e8e8e;
    font-weight:normal;
    font-size:12px;
    border:none;
    white-space:nowrap;
}
.bloomzCalendar .calendarViews .fc-agendaWeek-view .fc-day-header{
    white-space:normal !important;
}

.bloomzCalendar .calendarViews .fc-head-container{
    border-bottom:1px solid #dadada;
}
.bloomzCalendar .calendarViews .fc-divider{
    background:#fff;
    border:solid #dadada;
    border-width:1px 0;
}



/* Calendar table time access */
.bloomzCalendar .calendarViews .fc-axis{
    font-size:12px;
    border-right:1px solid #dadada;
}
.bloomzCalendar .calendarViews .fc-axis.fc-widget-header{
    border-right:1px solid transparent;
    position:relative;
}
.bloomzCalendar .calendarViews .fc-axis.fc-widget-header:after{
    content:"";
    display:block;
    height:1px;
    background:#fff;
    position:absolute;
    width:100%;
    left:0;
    bottom:-1px;
}



/* Calendar table body */
.bloomzCalendar .calendarViews .fc-day-top{
    font-size:12px;
}
.bloomzCalendar .calendarViews .fc-day-number{
    padding:5px 5px 0 5px;
}
.bloomzCalendar .calendarViews td.fc-day.fc-today{
    background:#fffce8;
}
.bloomzCalendar .calendarViews td.fc-day.fc-past{
    background:#f5f5f5;
    cursor:default;
}
.bloomzCalendar .calendarViews td.fc-day-top.fc-other-month{
    color:#aaa;
    opacity:1;
    filter:alpha(opacity=100);
}
.bloomzCalendar .calendarViews .fc-day{
    border-color:#ebebeb;
    cursor:pointer;
}
.bloomzCalendar .calendarViews .fc-content-skeleton{
    pointer-events:none;
}
.bloomzCalendar .calendarViews .fc-content-skeleton a{
    pointer-events:auto;
}
.bloomzCalendar .fc-event.tagNewEvent{
    background: rgba(0,0,0,.05);
    border: 1px dashed rgba(0,0,0,.2);
    color: rgba(0,0,0,.5);
}
.bloomzCalendar .fc-content,
.bloomzCalendar .fc-content .fc-time,
.bloomzCalendar .fc-content .fc-title{
    text-shadow:none !important;
    font-size:12px;
}{
    text-shadow:none !important;
    font-size:12px;
}
.bloomzCalednar .fc-more-cell div{
    padding:0 4px;
}
.bloomzCalendar a.fc-more{
    font-size:12px;
    color:#1ca0c8;
    text-decoration:underline;
    display: block;
    margin:3px 4px 1px 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align:center;
}
.bloomzCalendar .fc-event{
    padding:1px 2px;
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px;
}



/* Calendar table body - Agenda view */
.bloomzCalendar .calendarViews .fc-agenda-view .fc-time-grid tr .fc-widget-content{
    border-top:1px solid #ebebeb !important;
}
.bloomzCalendar .calendarViews .fc-agenda-view .fc-time-grid tr.fc-minor .fc-widget-content{
    border-top:1px solid transparent !important;
}
.bloomzCalendar .calendarViews .fc-agenda-view .fc-day{
    border-left:1px solid transparent;
}



/*************************************************
*  Form Styles:  Label Column Width
*************************************************/
.formLayout .inputGroupH,
.formLayout .inputGroupV label,
.formLayout textarea,
.formLayout .highlight .inputProfile + .validationMsg,
.formLayout section .listGroupV li,
.formLayout .linkControl{
    /*text-indent:100px;*/
    text-indent:110px;
}
.formLayout .pudControl,
.formLayout .filterControl,
.formLayout .inputProfile label{
    padding-left:100px;
}
.formLayout .separateTime .datePicker,
.formLayout .separateTime .timePicker .onlyTime{
    margin-left:145px;
    position:relative;
}

.formLayout .separateTime .timePicker select.onlyTimePicker{
    margin-left:100px;
}
.formLayout.lunchBreak .separateTime .timePicker select.onlyTimePicker{
    margin-left:200px;
}
.formLayout.lunchBreak .separateTime .timePicker .onlyTime{
    margin-left:200px;
    position:relative;
    padding-right:0;
    width:90px;
}
.formLayout select{
    padding-left: 145px;
}
.formLayout section .switchControl input + label{
    text-indent:145px;
}
.formLayout .selectedList{
    padding-left:105px;
}



/*************************************************
*  Form Styles:  General
*************************************************/
.formLayout{
    padding:0;
    margin-bottom:-1px;
}
.iPhone .formPadding .formLayout, .iPad .formPadding .formLayout, .Android .formPadding .formLayout,
.iPhone .actionBar section.formLayout, .iPad .actionBar section.formLayout, .Android .actionBar section.formLayout,
.iPhone .profilePage .formLayout, .iPad .profilePage .formLayout, .Android .profilePage .formLayout,
.iPhone .createAccountPage .fbSigninOption, .iPad .createAccountPage .fbSigninOption, .Android .createAccountPage .fbSigninOption,
.iPhone .createAccountPage .fbSignupOption, .iPad .createAccountPage .fbSignupOption, .Android .createAccountPage .fbSignupOption,
.iPhone div.locationFilter, .iPad div.locationFilter, .Android div.locationFilter,
.iPhone div.locationFilter .formLayout, .iPad div.locationFilter .formLayout, .Android div.locationFilter .formLayout,
.iPhone div.locationFilter .formLayout:last-of-type, .iPad div.locationFilter .formLayout:last-of-type, .Android div.locationFilter .formLayout:last-of-type,
.iPhone section.circleGroupHeader, .iPad section.circleGroupHeader, .Android section.circleGroupHeader,
.iPhone .peopleListing .formLayout, .iPad .peopleListing .formLayout, .Android .peopleListing .formLayout,
.iPhone .verifiedExplanation.circleMembers .formLayout, .iPad .verifiedExplanation.circleMembers .formLayout, .Android .verifiedExplanation.circleMembers .formLayout,
.iPhone .verifiedExplanation.circleMembers .formLayout:last-of-type, .iPad .verifiedExplanation.circleMembers .formLayout:last-of-type, .Android .verifiedExplanation.circleMembers .formLayout:last-of-type,
.iPhone .labelTop .formPadding, .iPad .labelTop .formPadding, .Android .labelTop .formPadding,
.iPhone .labelTop .formLayout, .iPad .labelTop .formLayout, .Android .labelTop .formLayout,
.iPhone .labelTop .peopleListing .formLayout:last-of-type, .iPad .labelTop .peopleListing .formLayout:last-of-type, .Android .labelTop .peopleListing .formLayout:last-of-type{
    min-height:0;
}
.iPhone .formLayout, .iPad .formLayout, .Android .formLayout,
.iPhone .formPadding, .iPad .formPadding, .Android .formPadding,
.iPhone .editProfileMine .formLayout, .iPad .editProfileMine .formLayout, .Android .editProfileMine .formLayout,
.iPhone .editProfileMyChild .formLayout, .iPad .editProfileMyChild .formLayout, .Android .editProfileMyChild .formLayout,
.iPhone .freProfileMine .formLayout, .iPad .freProfileMine .formLayout, .Android .freProfileMine .formLayout,
.iPhone .freProfileTeacher .formLayout, .iPad .freProfileTeacher .formLayout, .Android .freProfileTeacher .formLayout,
.iPhone .peopleListing .formLayout:last-of-type, .iPad .peopleListing .formLayout:last-of-type, .Android .peopleListing .formLayout:last-of-type,
.iPhone .chatWindow .scrollView.chatEntries, .iPad .chatWindow .scrollView.chatEntries,  .Android .chatWindow .scrollView.chatEntries{
    /*min-height:550px;*/
}
.formLayout:after{
    content:"";
    height:100%;
    position:fixed;
    background:rgba(0,0,0,0);
    top:0;
    left:0;
    width:1px;
}
.formLayout section{
    background:#fff;
    border-bottom:1px solid #e8e8e8;
    display:block;
    padding:0; /* 15px right else will have h-scroll on browse people*/
    text-indent:10px;
    position:relative;
    line-height:44px;
    font-size:16px;
    z-index:1;
}
.formLayout section.subOption{
    padding-left:16px !important;
}
.formLayout section.disabled label{
    opacity: 0.4;
    filter: alpha(opacity=40);
    cursor:default !important;
}
.formLayout section.disabled .switchControl{
    opacity: 0.4;
    filter: alpha(opacity=40);
    cursor:default !important;
}
.notScrolling .formLayout section.disabled.highlightableRow:active{
    background:#fff;
    cursor:default !important;
}



.formLayout section p{
    line-height:1.25;
    text-indent:0;
    /*font-size:18px;*/
}
.formLayout section h1{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#000;
    font-weight:bold;
    margin:-3px 0 -7px -15px;
    width:100%;
    line-height:40px;
    padding:0px 15px;
    font-size:20px;
}
.formLayout section h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:15px;
    font-size:15px;
}
.formLayout section .inlineAction{
    position:absolute;
    font-size:18px;
    right:15px;
    top:3px;
    background:#fff;
    text-indent:10px;
    display:inline-block;
}
.formLayout button.clearInput,
nav.actionBarInput ul.actionButtons button.clearInput{
    width:37px;
    height:29px;
    right:14px;
    top:10px;
    text-indent:-9999px;
    position:absolute;
    margin:0;
    background-color:rgba(255,255,255,.9);
    background-position:-141px -965px;
    border:none;
    opacity:0.5;
    filter:alpha(opacity=50);
    display:none;
}
nav.actionBarInput ul.actionButtons button.clearInput:after{
    display:none;
}
.formLayout>label,
.formLayout>div>label,
.addStudentsList>label,
.verifyMembers .formLayout>section>label,.invitedLabel{
    background:#fff;
    color:#666;
    display:block;
    text-indent:15px;
    line-height:30px;
    min-height:30px;
    font-size:14px;
    border-bottom:1px solid #e4e5ed;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:0;
    border-top:1px solid #e4e5ed;
    z-index:2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.formLayout>label .editList,
.formLayout>div>label .editList{
    padding:0 10px;
    text-indent:0;
    cursor:pointer;
    color:#1ca0c8;
    position:absolute;
    right:0;
    background:#f2f2f2;
}
section.formLayout section.emptyPanelMsg{
    text-align: center;
    padding:100px 20px 0px 20px;
    line-height:1.35;
    border-bottom:none;
    color:#aaa;
    font-size:15px;
}
section.formLayout section.emptyPanelMsg.ptaMembersOnly{
    background:#e8e8e8;
    margin-bottom:-1px !important;
    margin-right:0;
    max-width:none;
}
section.formLayout section.emptyPanelMsg.ptaMembersOnly p{
    margin-bottom:0;
}



/*************************************************
*  Form Styles:  Remove Form Group
*************************************************/
.removeFormGroup{
    width:20px;
    height:20px;
    position:absolute;
    right:0px;
    text-indent:-9999px;
    cursor:pointer;
    margin-top:-5px;
    -webkit-transform: translate3d(0,0,0);
    background:#000;
    box-shadow:0 2px 2px rgba(37,37,37,0.02);
    font-size:0;
    border-radius:50%;
}
.removeFormGroup{
    opacity:.8;
    filter:alpha(opacity=80);
}
.removeFormGroup:hover{
    opacity:1;
    filter:alpha(opacity=100);
}
.removeFormGroup:before, .removeFormGroup:after {
    content: "";
    height: 10px;
    width: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius: 10px;
}
.removeFormGroup:before { transform:rotate(45deg); }
.removeFormGroup:after { transform:rotate(-45deg); }


/*************************************************
*  Form Styles:  Button Styles
*************************************************/
.formLayout button{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    /*font-size:18px;*/
    color:#000;
    text-shadow:none;
    border:1px solid #d3d3d3;
    background-color:#e8e8e8;
    padding:0 12px;
    line-height:40px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    white-space:nowrap;
    outline:0;
}
.formLayout button::-moz-focus-inner {
    border:0;
}
.formLayout button:active{
    border:1px solid #bdbdbd;
    background:#e4e5ed;
}
.fullWidthBtn{
    padding:15px;
}
.fullWidthBtn button{
    display:block;
    width:100%;
}




/*************************************************
*  Form Styles:  Buttons - Default
*************************************************/
.formLayout section.defaultBtn{
    padding:10px;
}
.defaultBtn{
    height:auto !important;
}
button.defaultBtn,
.defaultBtn button{
    display:block;
    width:100%;
    font-family:'Gotham', Verdana, "Helve.inviteRequest footer.acceptanceControlticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:18px;
    text-shadow:none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    color:#000;
    background-color:#ffffff;
    line-height:40px;
    margin:2px 0;
}
.formLayout section.defaultBtn:empty{
    border-bottom:none;
}
.formPadding .formLayout button.defaultBtn,
.formPadding .formLayout button.defaultBtn:active{
    border:none;
    margin:0;
}
.formLayout button.defaultBtn.disabledBtn,
.formLayout button.defaultBtn:active,
.formPadding .formLayout.acceptanceButtons button.defaultBtn:active{
    background:#e4e5ed;
    border:1px solid #bdbdbd;
    cursor:default;
    color:rgba(0,0,0,.3);
}
.formLayout button.disabledBtn{
    line-height:40px;
    border: 1px solid #cfcfcf;
    border-bottom: 1px solid #e4e5ed;
    background: #e4e5ed;
    cursor: default;
    color: rgba(0,0,0,.3);
}
.acceptanceButtons button.defaultBtn,
.acceptanceButtons .defaultBtn button{
    border:1px solid #e4e5ed;
    background-color:#efefef;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #000;
    padding: 13px 25px;
    line-height: 1;
    font-size: 14px;
    text-indent: 0;
    border-radius: 50px;
    border: 0;
    font-weight: bold;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);

}

.acceptanceButtons button.defaultBtn.cancelBtn { background-color:#e86c6c; border-color:#e86c6c; color:#fff; }



/*************************************************
*  Form Styles:  Buttons - Primary
*************************************************/
.formLayout button.primaryBtn{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #fff;
    padding: 13px 25px;
    line-height: 1;
    font-size: 14px;
    text-indent: 0;
    background: #53c8e6;
    border-radius: 50px;
    border: 0;
    font-weight: bold;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
}
.formLayout button.primaryBtn:active,
.formLayout button.primaryBtn.disabledBtn,
.formLayout button.primaryBtn:hover{
    background:#44bfdf;
}
.formLayout button.primaryBtn.disabledBtn,
.formLayout button.primaryBtn:active{
    cursor:default;
}
.formPadding .formLayout button.primaryBtn{
    display:block;
    width:100%;
    margin:0;
}
.formLayout button.primaryBtn.loadingIndicator:before{
    content: "";
    width:16px;
    height:16px;
    display: inline-block;
    vertical-align: middle;
    margin:-2px 6px 0 -22px;
    background: url(../images/ajax-loader5.gif) no-repeat center;
    opacity:0.5;
    filter:alpha(opacity=60);
}



/*************************************************
*  Form Styles:  Buttons - Cautious
*************************************************/
.formLayout section.cautiousBtn{
    padding:10px;
}
.cautiousBtn{
    height:auto !important;
}
button.cautiousBtn,
.cautiousBtn button{
    margin:0;
    display:block;
    width:100%;
    font-family:'Gotham', Verdana, "Helve.inviteRequest footer.acceptanceControlticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    /*font-size:20px;*/
    text-shadow:none;
    color: #fff;
    background-color: #e86c6c;
    border-color: #e86c6c;
}
.formLayout section.cautiousBtn:empty{
    border-bottom:none;
}
.formPadding .formLayout button.cautiousBtn{
    border:none;
}



/*************************************************
*  Form Styles: Terms and Privacy
*************************************************/
section.fullPage{
    height:auto;
    padding:10;
    border-top:none;
    min-height:100%;
    color:#262626;
}
section.fullPage:after{
    display:none;
}
section.fullPage article{
    padding:0 20px 25px 20px;
    max-width:500px;
    border:none;
    box-shadow:none;
}
section.fullPage h2{
    font-size:30px;
    line-height:1.25;
    color:#262626;
    margin:30px 0 0 0;
    font-weight:bold;
    height:auto;
}
section.fullPage h3{
    font-size:19px;
    color:#262626;
    margin:19px 0;
    font-weight:bold;
}
section.fullPage p{
    font-size:15px;
    line-height:1.5;
    padding:1em 0;
    margin-top:0;
}
section.fullPage p b,
section.fullPage li b{
    color:#262626;
}
section.fullPage li{
    line-height:1.5;
    padding-bottom:1em;
    margin-left:26px;
    list-style:circle;
}
section.fullPage a{
    color:#1ca0c8;
}
section.fullPage ul{
    margin-bottom:-30px;
    padding:0;
}
section.fullPage ul ul{
    margin-left:4px;
    margin-top:16px;
    margin-bottom:8px;
}
section.fullPage .social{
    display:inline-block;
    padding-top:45px;
    margin:-10px 5px 0 5px;
    position:relative;
    color:#262626;
    font-size:10px;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    text-indent:-9999px;
    width:60px;
    border:1px solid rgba(0,0,0,.1);
    border-radius:50%;
}
section.fullPage .social:before{
    content:"";
    width:40px;
    height:40px;
    position:absolute;
    top:10px;
    left:50%;
    margin-left:-20px;
}
section.fullPage .fb:before{
    background-position:-523px -781px;
}
section.fullPage .twitter:before{
    background-position:-587px -782px;
}
.whatItMeans{
    border-collapse:collapse;
}
.whatItMeans td{
    vertical-align:top;
    border-collapse:collapse;
}
.whatItMeans td:nth-child(odd){
    padding-right:24px;
}
.whatItMeans td:nth-child(even){
    display:none;
}




/*************************************************
*  Form Styles: Unsubscribe
*************************************************/
.unsubscribe section.fullPage h2{
    text-align:center;
    margin-bottom:10px;
}



/*************************************************
*  Form Styles: Block Display
*************************************************/
.formLayout .blockDisplay .linkControl{
    margin-top:-27px;
    text-indent:-2px;
}
.formLayout .blockDisplay .drillDown:after{
    margin-top:-12px;
}



/*************************************************
*  Form Styles: Form Padding
*************************************************/
div.formPadding,
form.formPadding{
    background:#f0f2f4;
    padding:10px;
}



div.formPadding h1,
form.formPadding h1{
    text-indent:4px;
    color:#6d6d72;
    text-transform: uppercase;
    padding-top:16px;
    font-size:15px;
    line-height:32px;
    margin-bottom:1px;
}



div.formPadding>.formLayout,
form.formPadding>.formLayout,
div.formPadding>div>.formLayout,
.accountSettingsCalendarSubscribe div.formPadding .formLayout,
.accountSettingsCalendarSubscribe form.formPadding .formLayout{
    background:#fff;
    box-shadow:0 2px 2px rgba(37,37,37,0.02);
    border:1px solid #e8e8e8;
    /*border-bottom:1px solid #e4e5ed;*/
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:hidden;
    margin-bottom:10px;
}
div.formPadding>.formLayout>section,
form.formPadding>.formLayout>section,
div.formPadding>.formLayout>ng-form>section,
form.formPadding>.formLayout>ng-form>section{
    padding:0;
    background:transparent;
    text-indent:15px;
    text-indent:10px;
}
div.formPadding .formLayout section.autoSuggest,
form.formPadding .formLayout section.autoSuggest{
    padding:0;
}
div.formPadding .formLayout section.autoSuggest .selectedList,
form.formPadding .formLayout section.autoSuggest .selectedList{
    padding-left:140px;
}
div.formPadding .formLayout section.autoSuggest label,
form.formPadding .formLayout section.autoSuggest label{
    text-indent:15px;
    background:transparent;
}
div.formPadding .formLayout .linkControl,
form.formPadding .formLayout .linkControl{
    padding-left:10px;
    padding-left: 145px;
    text-indent: 0;
}

div.formPadding .formLayout .labelVolunteer,
form.formPadding .formLayout .labelVolunteer{
    padding-left:155px;
}

div.formPadding .formLayout .linkControl.addIcon:after,
form.formPadding .formLayout .linkControl.addIcon:after{
    content:"";
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    left:115px;
    bottom:16px;
    background-position:-20px -849px;
}
div.formPadding>.formLayout:last-of-type,
form.formPadding>.formLayout:last-of-type{
    margin-bottom:10px;
}
div.formPadding>.formLayout>section:last-child,
form.formPadding>.formLayout>section:last-child,
div.formPadding>.formLayout>div>section:last-child,
form.formPadding>.formLayout>div>section:last-child,
div.formPadding>.formLayout>ng-form>section:last-child,
form.formPadding>.formLayout>ng-form>section:last-child{
    border-bottom:1px solid transparent;
}
div.formPadding .detailsInput,
form.formPadding .detailsInput{
    min-height:85px;
}
div.formPadding .pudControl:before,
form.formPadding .pudControl:before{
    content:"";
    background:#fff;
    width:100%;
    height:5px;
    display:block;
    position:absolute;
    left:-25px;
    top:-8px;
    padding:0 5px 0 25px;
}
div.formPadding .separateTime,
form.formPadding .separateTime{
    margin-bottom:1px;
}
div.formPadding label.importantEvent:before,
form.formPadding label.importantEvent:before{
    content:"";
    width:16px;
    height:16px;
    position:absolute;
    display:block;
    background-position:-343px -1093px;
    top:17px;
    left:97px;
}
article.importantEvent .hgroup h2:before{
    content:"";
    display:inline-block;
    width:12px;
    height:16px;
    background-position:-343px -1093px;
    position:absolute;
    margin:9px 0 0 -14px;
}
div.formPadding .eventTitleSection,
form.formPadding .eventTitleSection{
    box-shadow:none;
    border:none;
    overflow:visible;
}
div.formPadding .autoSuggest label:after,
form.formPadding .autoSuggest label:after{
    display:none;
}
div.formPadding .autoSuggest label .selectedList,
form.formPadding .autoSuggest label .selectedList{
    margin-bottom:0;
}
div.formPadding .autoSuggest,
form.formPadding .autoSuggest{
    overflow:visible;
    margin-bottom:0;
    padding-bottom:50px;
}
div.formPadding .contentAutoSuggest,
div.formPadding .contentAutoSuggest .formLayout,
div.formPadding .contentAutoSuggest .formLayout section,
form.formPadding .contentAutoSuggest,
form.formPadding .contentAutoSuggest .formLayout,
form.formPadding .contentAutoSuggest .formLayout section{
    background:transparent;
    border-left:none;
    border-right:none;
}
div.formPadding .autoSuggest .selectedList span:last-of-type,
form.formPadding .autoSuggest .selectedList span:last-of-type{
    margin-bottom:12px;
}
div.formPadding .contentAutoSuggest .formLayout section span,
form.formPadding .contentAutoSuggest .formLayout section span{
    border-top:1px solid #f1f1f1;
    border-bottom:1px solid #dcdcdc;
    text-indent:10px;
}
div.formPadding .contentAutoSuggest .formLayout section span:first-of-type,
form.formPadding .contentAutoSuggest .formLayout section span:first-of-type{
    border-top:none;
}
div.formPadding .contentAutoSuggest .formLayout section span:last-of-type,
form.formPadding .contentAutoSuggest .formLayout section span:last-of-type{
    border-bottom:none;
}



/*************************************************
*  Form Styles:  Date Picker Control
*************************************************/
.formLayout .separateTime .datePicker{
    color:#666;
    /*font-size:18px;*/
    position:relative;
    display:inline-block;
    text-indent:3px;
    padding:0;
    cursor:pointer;
    width:110px;
    background: #fff;
    height: 30px;
}
.formLayout .separateTime .datePicker:after{
    content:",";
}
.formLayout .separateTime .altDatePicker{
    margin-top:-46px;
    text-indent:0;
    padding-left:6px;
}
.formLayout .separateTime .altDatePicker .datePicker:focus{
    background:#eaf9ff;
    border-top:1px solid transparent;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.formLayout .separateTime .nextButton{
    right:0;
}
.formLayout .separateTime .removeSection{
    right:10px;
}




/*********************************************
*  Form Styles:  Date Picker
*********************************************/
#CalendarControlIFrame{
    display:none;
    left:0px;
    position:absolute;
    top:0px;
    height:250px;
    width:250px;
    z-index:99;
}
#CalendarControl{
    position:absolute;
    background-color:#fff;
    margin:0;
    padding:0;
    display:none;
    z-index:100;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    margin-left:-62px;
}
#CalendarControl table{
    font-size:14px;
    background:#373842;
    text-shadow:none;
    box-shadow:0 2px 10px rgba(0,0,0,.4);
    border:1px solid #000;
    min-width:230px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    position:relative;
}
#CalendarControl th{
    font-weight:normal;
    color:rgba(255,255,255,.5);
    border:1px solid transparent;
    height:2em;
    cursor:default;
}
#CalendarControl th a{
    text-decoration:none;
    color:#fff;
    padding:1px;
}
#CalendarControl td{
    text-align:center;
    width:30px;
    height:30px;
    line-height:30px;
}
#CalendarControl td:empty{
    width:0;
    height:0;
    line-height:0;
}
#CalendarControl td a{
    width:24px;
    height:24px;
    line-height:24px;
    margin:0 auto;
}
#CalendarControl .header{
    background-color:#22232a;
    text-shadow:none;
}
#CalendarControl .header .year{
    padding-left:5px;
}
#CalendarControl .weekday,
#CalendarControl .weekend,
#CalendarControl .current{
    display:block;
    text-decoration:none;
    border:1px solid transparent;
    color:rgba(255,255,255,.8);
}

#CalendarControl .rangeCustom .day a.customCurrentFirst,
#CalendarControl .rangeDay .current{
    -moz-border-radius:13px;
    -webkit-border-radius:13px;
    border-radius:13px;
    color:#fff;
    border:1px solid #49bfe5;
}

#CalendarControl .rangeAll .day:hover a,
#CalendarControl .rangeDay .day:hover a,
#CalendarControl .rangeCustom .day:hover a{
    background:rgba(255,255,255,.15);
    -moz-border-radius:13px;
    -webkit-border-radius:13px;
    border-radius:13px;
}
#CalendarControl .rangeDay .weekday:active,
#CalendarControl .rangeDay .weekend:active{
    background:rgba(0,0,0,.3);
    border:1px solid rgba(0,0,0,.3);
}

#CalendarControl .rangeCustom td.customCurrentFirst a,
#CalendarControl .rangeCustom td.currentSelected a,
#CalendarControl .rangeMonth td.currentSelected a,
#CalendarControl .rangeWeek td.currentSelected a{
    color: #fff;
    border: 1px solid #49bfe5;
    border-top: 1px solid #49bfe5;
    border-bottom: 1px solid #49bfe5;
    border-right: 0;
    border-left: 0;
    width: 100%;
}
#CalendarControl .rangeCustom td.currentSelected.firstSelectedDay a,
#CalendarControl .rangeMonth td.currentSelected.firstSelectedDay a,
#CalendarControl .rangeWeek td.currentSelected.firstSelectedDay a{
    -webkit-border-top-left-radius: 13px;
    -webkit-border-bottom-left-radius: 13px;
    -moz-border-radius-topleft: 13px;
    -moz-border-radius-bottomleft: 13px;
    border-top-left-radius: 13px;
    border-bottom-left-radius: 13px;
    border-left: 1px solid #49bfe5;
    display: block;
    width: 85%;
    float: right;
}
#CalendarControl .rangeCustom td.currentSelected.lastSelectedDay a,
#CalendarControl .rangeMonth td.currentSelected.lastSelectedDay a,
#CalendarControl .rangeWeek td.currentSelected.lastSelectedDay a{
    -webkit-border-top-right-radius: 13px;
    -webkit-border-bottom-right-radius: 13px;
    -moz-border-radius-topright: 13px;
    -moz-border-radius-bottomright: 13px;
    border-top-right-radius: 13px;
    border-bottom-right-radius: 13px;
    border-right: 1px solid #49bfe5;
    display: block;
    width: 85%;
    float: left;
}
#CalendarControl .rangeWeek .currentWeek{
    color:#fff;
    border:1px solid #49bfe5 !important;
}
#CalendarControl .rangeWeek .currentWeek td{
    color:#fff;
    border-top:1px solid #49bfe5 !important;
    border-bottom:1px solid #49bfe5 !important;
}
#CalendarControl .week .day{
    border-bottom:1px solid #373842;
}
#CalendarControl .rangeMonth:hover .week .day,
#CalendarControl .rangeWeek .week:hover .day{
    background:rgba(255,255,255,.15);
}

#CalendarControl .rangeMonth:hover  td.day1,
#CalendarControl .rangeWeek .week:hover td.day:first-child,
#CalendarControl .rangeWeek .week:hover td.day1{
    -webkit-border-top-left-radius: 13px;
    -webkit-border-bottom-left-radius: 13px;
    -moz-border-radius-topleft: 13px;
    -moz-border-radius-bottomleft: 13px;
    border-top-left-radius: 13px;
    border-bottom-left-radius: 13px;
}

#CalendarControl .rangeMonth:hover .week td.dayLast,
#CalendarControl .rangeWeek .week:hover td.day:last-child,
#CalendarControl .rangeWeek .week:hover td.dayLast,
#CalendarControl .rangeWeek .currentWeek td.day:last-child{
    -webkit-border-top-right-radius: 13px;
    -webkit-border-bottom-right-radius: 13px;
    -moz-border-radius-topright: 13px;
    -moz-border-radius-bottomright: 13px;
    border-top-right-radius: 13px;
    border-bottom-right-radius: 13px;
}

#CalendarControl .previous{
    text-align:left;
}
#CalendarControl .next{
    text-align:right;
}
#CalendarControl .previous,
#CalendarControl .next {
    padding:1px 0;
    font-size:1.4em;
}
#CalendarControl .previous a,
#CalendarControl .next a{
    color:#fff;
    text-decoration:none;
    overflow:hidden;
    position:relative;
    text-indent:-9999px;
    display:inline-block;
    width:44px;
    text-align:left;
}
#CalendarControl .previous a:after,
#CalendarControl .next a:after{
    content:"";
    width:10px;
    height:10px;
    top:10px;
    display:block;
    position:absolute;
    border:solid rgba(255,255,255,.4);
}
#CalendarControl .previous a:hover:after,
#CalendarControl .next a:hover:after{
    border-color:rgba(255,255,255,.8);
}
#CalendarControl .previous a:after{
    left:12px;
    border-width:1px 0 0 1px;
    transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
#CalendarControl .next a:after{
    right:12px;
    border-width:1px 1px 0 0;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
#CalendarControl .next a{
    color:#fff;
    text-decoration:none;
}
#CalendarControl .title{
    text-align:center;
    color:rgba(255,255,255,.8);
    text-transform:uppercase;
    cursor:default;
}
#CalendarControl .empty{
}
#CalendarControl .closeCal{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    text-indent:-9999px;
}
#CalendarControl table.tabs{
    font-size:14px;
    text-shadow:none;
    border:none;
    background:#22232a;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    position:relative;
    border-spacing:0;
    border-collapse: collapse;
}
    #CalendarControl table.tabs .active{
        background: #373842;
    }


/*************************************************
*  Form Styles:  Time Picker Control
*************************************************/
.formLayout .separateTime{
    z-index:auto;
}
.formLayout .separateTime .timePicker{
    display:inline-block;
    text-indent:0;
}
.formLayout .separateTime .timePicker input{
    color:#666;
    font-size:15px;
    position:relative;
    display:inline-block;
    padding:0 2px;
    width:78px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
}
.formLayout .separateTime .timePicker input:focus{
    background:#eaf9ff;
    border-top:1px solid transparent;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.formLayout .separateTime .timePicker select{
    display:none;
    -webkit-appearance:listbox;
    -moz-appearance: listbox;
    position:absolute;
    height:210px;
    width:88px;
    background:#fff;
    margin-top:1px;
    margin-left:1px;
    box-shadow:0px 1px 1px rgba(0,0,0,.5);
    font-size:15px;
    padding:0;
}
.formLayout .separateTime .timePicker select:active,
.formLayout .separateTime .timePicker select:focus{
    background:#fff;
}
.formLayout .separateTime .timePicker .closeTimePicker{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:600%;
    text-indent:-9999px;
    display:none;
}
.formLayout .separateTime .showTimePicker .timePicker .closeTimePicker{
    display:inline;
}
.contentEventForm .formPadding .formLayout{
    overflow:visible;
}
.formLayout .alertTime input{
    border:1px solid transparent;
    background:transparent;
    margin-left:30px;
    width:110px;
    color:#666;
    font-size:18px;
}
.formLayout .alertTime input:focus{
    background:#eaf9ff;
}







/*************************************************
*  Form Styles:  Input Group (Listed Horizontally)
*************************************************/
.formLayout .inputGroupH{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
    top:3px;
    left:0;
    display:block;
    width:100%;
    line-height:37px;
    margin:-50px 0 0 0;
    padding:5px 0 7px 12px;
    /*font-size:18px;*/
    color:#666;
    white-space:nowrap;
}
.formLayout .inputGroupH label{
    white-space: nowrap;
    text-indent: 0;
    text-align: center;
    min-width: 20px;
    padding: 2px 13px 0;
    margin-right: 0;
    margin: 4px -1px 4px 0;
    line-height: 25px;
    display: inline-block;
    cursor: pointer;
    border: 1px solid #e4e5ed;
    position: relative;
    background:#fff;
}
.formLayout .inputGroupH label:active{
    border:1px solid #e4e5ed;
    background:#e4e5ed;
}
.formLayout .inputGroupH label:first-of-type{
    -moz-border-radius-topleft:6px;
    -webkit-border-radius-topleft:6px;
    border-top-left-radius:6px;
    -moz-border-radius-bottomleft:6px;
    -webkit-border-radius-bottomleft:6px;
    border-bottom-left-radius:6px;
    border:1px solid #ddd;
}
.formLayout .inputGroupH label:active:first-of-type{
    border:1px solid #e4e5ed;
}
.formLayout .inputGroupH label:last-of-type{
    -moz-border-radius-topright:6px;
    -webkit-border-radius-topright:6px;
    border-top-right-radius:6px;
    -moz-border-radius-bottomright:6px;
    -webkit-border-radius-bottomright:6px;
    border-bottom-right-radius:6px;
}
.formLayout .inputGroupH input{
   display:none;
}
.formLayout .inputGroupH input:checked + label,
.formLayout .inputGroupH label.genderSelected{
    color: #fff;
    background-color: #53c8e6;
    border-color: #fff;
}
.formLayout .inputGroupH input:checked + label:active{
    color: #fff;
    background-color: #53c8e6;
    border-color: #fff;
}



/*************************************************
*  Form Styles:  Input Group (Listed Vertically)
*************************************************/
.formLayout .inputGroupV{
    position:relative;
    left:0;
    display:block;
    line-height:37px;
    margin:-45px 0 0 0;
    padding:0;
    font-size:18px;
    color:#666;
    white-space:nowrap;
}
.formLayout .inputGroupV label{
    white-space:normal;
    padding:0 20px;
    margin:6px -3px 6px -6px;
    line-height:25px;
    display:block;
    position:relative;
    cursor:pointer;
    line-height: 1;
    font-size: 16px;
}
.formLayout .inputGroupV input{
    display:none;
}
.formLayout .inputGroupV .radioIndicator{
    width:50px;
    height:50px;
    margin:0;
    position:absolute;
    display:block;
    top:-14px;
    left:-14px;
}
.formLayout .inputGroupV input + label:after,
.formLayout .inputGroupV input:checked + label.notCheckable:after,
.formLayout .inputGroupV input ~ .radioIndicator:after,
.formLayout .inputGroupV input:checked ~ .radioIndicator:after{
    content:"";
    border:2px solid #ccc;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    width:18px;
    height:18px;
    position:absolute;
    left:24px;
    top:26px;
    background:none;
}
.formLayout .inputGroupV input:checked + label:after,
.formLayout .inputGroupV input:checked ~ .radioIndicator:after,
.formLayout .inputGroupV input.isSelected + label:after{
    background-position:-213px -854px;
    border-color:#53c8e6;
}




/*************************************************
*  Form Styles:  Input Group (Full Width)
*************************************************/
.formLayout section .inputGroupV:first-child{
    margin-top:0;
}
.formLayout section .inputGroupV:first-child label{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-indent:0px;
    border-bottom:1px solid #e4e5ed;
    margin:0;
    padding:12px 15px 12px 40px;
    width:100%;
    overflow:hidden;
}
.formLayout section .inputGroupV:first-child label:after,
.formLayout section .inputGroupV:first-child label.notCheckable:after{
    left:10px;
    top:13px;
}
.formLayout section .inputGroupV:first-child img{
    vertical-align:text-bottom;
    margin-right:10px;
}
.formLayout section .inputGroupV:first-child label:first-of-type{
    margin-top:0;
}
.formLayout section .inputGroupV:first-child label:last-of-type{
    margin-bottom:-2px;
}


.formLayout section .inputGroupV:first-child label h3{
    margin-left:0;
    padding-left:10px;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}



/*************************************************
*  Form Styles:  Input Group Div (Full Width)
*************************************************/
.formLayout section .inputGroupDiv div{
    border-bottom:1px solid #e4e5ed;
    /*font-size:18px;*/
    color:#666;
    position:relative;
    padding:12px 15px 12px 40px;
    line-height:25px;
    text-indent:0;
    font-size:15px;
    font-family: 'Gotham-book';
}
.formLayout section .inputGroupDiv:not(.noMultiSelect) div:after{
    content:"";
    width:18px;
    height:18px;
    position:absolute;
    left:10px;
    top:13px;
    border:2px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.formLayout section .inputGroupDiv div:last-of-type{
    border-bottom:none;
}
.formLayout section .inputGroupDiv .alertTime div:after{
    display: none;
}
.formLayout section .inputGroupDiv div.selected:after{
    background-position:-213px -854px;
    background-position:-214px -855px;
    border-color:#53c8e6;
}



/******************************************************
*  Form Styles:  Unordered List
*******************************************************/
.formLayout section ul.listGroupV:first-child{
    margin-top:0;
}
.formLayout section ul.listGroupV:first-child li{
    text-indent:0px;
}
.formLayout section ul.listGroupV{
    list-style:none;
    padding:0;
    margin-top:-47px;
    margin-left:0;
    margin:-47px 0 0 0;
}
.formLayout section .listGroupV li{
    color:#666;
    font-size:18px;
    margin-left:15px;
}
.formLayout section .listGroupV li .groupActivitiesAdd{
    position:absolute;
    right:15px;
    background:#fff;
    text-indent:10px;
}
.formLayout section .listGroupV li img{
    vertical-align:text-bottom;
}



/*************************************************
*  Form Styles:  Input Profile Information
*************************************************/
.formLayout .inputProfile{
    position:relative;
    display:block;
    width:100%;
    height:100px;
    margin:10px 0 0 0;
    padding:0;
    font-size:18px;
    color:#666;
}
.formLayout .inputProfile:active{
    opacity:0.5;
    filter:alpha(opacity=50);
}
.formLayout .inputProfile label{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    text-indent:-9999px;
    width:100%;
    margin-bottom:-5px;
}
.formLayout .inputProfile input[type='text']{
    padding-left:15px;
    padding-right:15px;
}
.formLayout .inputProfile .profileM{
    position:absolute;
    width:70px;
    height:70px;
    top:0;
    left:9px;
    z-index:1;
    text-align:center;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.iPhone .formLayout .inputProfile .profileM,
.iPad .formLayout .inputProfile .profileM,
.Android .formLayout .inputProfile .profileM{
    z-index:2;
}
.formLayout .inputProfile .profileM img{
    width:72px;
    height:72px;
    position:absolute;
    left:-1px;
    margin-top:-19px;
    background-color:transparent;
    /*background-color:#fff;*/
    width:100%;
    height:auto;
}
.formLayout .inputProfile .choosePhoto{
    text-indent:0;
    text-align:center;
    font-size:15px;
    line-height:16px;
    /*height:34px;*/
    height:60px;
    width:60px;
    padding:18px 5px;
    white-space:normal;
    background:#fff;
    border:1px dashed #aaa;
    color:#aaa;
    overflow:hidden;
    box-shadow:3px -3px 0px rgba(0,0,0,.2);
    -webkit-box-shadow:3px -3px 0px rgba(0,0,0,.2);
    -moz-box-shadow:3px -3px 0px rgba(0,0,0,.2);
    cursor:pointer;
    border-radius:50px;
}
.formLayout .inputProfile label.chooseFile{
    position:absolute;
    display:inline-block;
    width:70px;
    height:70px;
    overflow:hidden;
    top:5px;
    left:9px;
    margin:0;
    z-index:2;
    cursor:pointer;
    text-indent:0;
}
.formLayout .inputProfile label.chooseFile input{
    width:100%;
    height:100%;
    left:0px;
    position:relative;
    cursor:pointer;
    opacity:0;
    filter:alpha(opacity=0);
}

.formLayout .inputProfile .choosePhoto img,
.formLayout .inputProfile .chooseFile img{
    opacity:1;
    filter:alpha(opacity=100);
}
.formLayout .inputProfile .choosePhoto img.choosePhotoLoader,
.formLayout .inputProfile .chooseFile img.choosePhotoLoader {
    opacity:1;
    filter:alpha(opacity=100);
    z-index: 1001;
    background: url(../images/ajax-loader.gif) no-repeat #e8e8e8 center;
}

.iPhone .formLayout .inputProfile label.native,
.iPad .formLayout .inputProfile label.native,
.Android .formLayout .inputProfile label.native{
    z-index:1;
}


/*************************************************
*  Form Styles:  Inputs Text Boxes and Text Areas
*************************************************/
.formLayout label input[type='text'],
.formLayout label input[type='email'],
.formLayout label input[type='password'],
.formLayout label input[type='date'],
.formLayout label input[type='datetime'],
.formLayout label input[type='datetime-local'],
.formLayout label input[type='time'],
.formLayout label input[type='tel'],
.formLayout label input[type='number'],
.formLayout textarea{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    background:transparent;
    width:100%;
    padding:0 10px 0 145px;
    height:50px;
    font-size:15px;
    color:#666;
    margin-top:-48px;
    border:1px solid transparent;
    -webkit-appearance: none;
    cursor:text;
    font-family: 'Gotham-book';
}
.formLayout label input[type='text'].wideLabel,
.formLayout label input[type='email'].wideLabel,
.formLayout label input[type='password'].wideLabel,
.formLayout label input[type='date'].wideLabel,
.formLayout label input[type='datetime'].wideLabel,
.formLayout label input[type='datetime-local'].wideLabel,
.formLayout label input[type='time'].wideLabel,
.formLayout label input[type='tel'].wideLabel,
.formLayout label input[type='number'].wideLabel,
.formLayout textarea.wideLabel{
    padding: 0 10px 0 130px !important;
}
.formLayout label input[type='text'][disabled],
.formLayout label input[type='email'][disabled],
.formLayout label input[type='password'][disabled],
.formLayout label input[type='date'][disabled],
.formLayout label input[type='datetime'][disabled],
.formLayout label input[type='datetime-local'][disabled],
.formLayout label input[type='time'][disabled],
.formLayout label input[type='tel'][disabled],
.formLayout label input[type='number'][disabled]{
    color:#666666;
    -webkit-text-fill-color: #666666;
}

.formLayout label input[type='date'],
.formLayout label input[type='datetime'],
.formLayout label input[type='datetime-local'],
.formLayout label input[type='time']{
    line-height:50px;
}
.formLayout label input[type='text'].modalEdit,
.formLayout label input[type='email'].modalEdit,
.formLayout label input[type='password'].modalEdit,
.formLayout label input[type='date'].modalEdit,
.formLayout label input[type='datetime'].modalEdit,
.formLayout label input[type='datetime-local'].modalEdit,
.formLayout label input[type='time'].modalEdit,
.formLayout label input[type='tel'].modalEdit,
.formLayout label input[type='number'].modalEdit,
.formLayout textarea.modalEdit{
    cursor:pointer;
    color:transparent; /* So blinking cursor doesn't show up */
    text-shadow: 0px 0px 0px #666; /* use text shadow to show text */
}
.formLayout label input[type='text']:focus,
.formLayout label input[type='email']:focus,
.formLayout label input[type='password']:focus,
.formLayout label input[type='date']:focus,
.formLayout label input[type='datetime']:focus,
.formLayout label input[type='datetime-local']:focus,
.formLayout label input[type='time']:focus,
.formLayout label input[type='tel']:focus,
.formLayout label input[type='number']:focus,
.formLayout textarea:focus{
    border:1px solid transparent;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
.formLayout label input[type='date']:focus,
.formLayout label input[type='datetime']:focus,
.formLayout label input[type='datetime-local']:focus,
.formLayout label input[type='time']:focus,
.formLayout select:focus{
    background:rgba(160,228,255,.2);
    border-bottom:1px solid #cedde2;
    margin-bottom:-1px;
}

.Desktop .formLayout label input[type='date']:focus,
.Desktop .formLayout label input[type='datetime']:focus,
.Desktop .formLayout label input[type='datetime-local']:focus,
.Desktop .formLayout label input[type='time']:focus,
.Desktop .formLayout select:focus{
    background:none;
    border-bottom:0;
    margin-bottom:0;
}


.formLayout label input[type='text'].modalEdit:focus,
.formLayout label input[type='email'].modalEdit:focus,
.formLayout label input[type='password'].modalEdit:focus,
.formLayout label input[type='date'].modalEdit:focus,
.formLayout label input[type='datetime'].modalEdit:focus,
.formLayout label input[type='datetime-local'].modalEdit:focus,
.formLayout label input[type='time'].modalEdit:focus,
.formLayout label input[type='tel'].modalEdit:focus,
.formLayout label input[type='number'].modalEdit:focus,
.formLayout textarea.modalEdit:focus{
    border:1px solid transparent;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
.formLayout label input[type='number']::-webkit-outer-spin-button,
.formLayout label input[type='number']::-webkit-inner-spin-button,
.redeemPointsSelection input[type=number]::-webkit-outer-spin-button,
.redeemPointsSelection input[type=number]::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}
.formLayout label input[type='number'],
.redeemPointsSelection input[type=number]{
    -moz-appearance:textfield; /* hide FF spinner */
}
.formLayout textarea{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    height:37px;
    padding:8px;
    text-indent:0;
    overflow:auto;
    resize:vertical;
}
.formLayout textarea.labelStyle::-webkit-input-placeholder {
    color:#000;
    font-size:20px;
}
.formLayout textarea.labelStyle:-moz-placeholder {
    color:#000;
    font-size:20px;
}
.formLayout textarea.labelStyle::-moz-placeholder {
    color:#000;
    font-size:20px;
}
.formLayout textarea.labelStyle:-ms-input-placeholder {
    color:#000;
    font-size:20px;
}



/*************************************************
*  Form Styles: Editable Span
*************************************************/
.formLayout section .editableElement{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    min-height:48px;
    line-height:18px;
    width:100%;
    margin:-48px 0 0 0;
    padding:14px 0 0 145px;
    border:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    -webkit-appearance: none;
    outline:none;
    font-size:15px;
    text-indent:0;
    color:#666;
    word-wrap:break-word;
    -ms-word-wrap:break-word;
}
.formLayout section .placeHolderText{
    color:#aaa;
    position:absolute;
    top:3px;
    text-indent:110px;
    font-size:18px;
}



/*************************************************
*  Form Styles:  Input splits into two on focus
*************************************************/
.formLayout .splitInput{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-indent:0;
    margin-top:-1px;
    display:table;
    padding-left:1px;
    width:100%;
}
.formLayout .splitInput span{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:table-cell;
    text-indent:0;
    margin:-1px 0 -5px 0;
    padding-right:10px;
    width:106px;
}
.formLayout .splitInput span:nth-child(2){
    width:auto;
    padding-right:0;
}
.formLayout .highlight .splitInput{
    margin-bottom:13px;
    background:rgba(252, 46, 0, .07);
}
.formLayout .splitInput span.validationMsg{
    margin:-7px 0 -15px 0;
    display:inline;
    position:absolute;
    top:42px;
    left:10px;
    width:100%;
    left:0px;
    text-indent:10px;
}
.formLayout .highlight .splitInput input[type='text']{
    background:transparent;
}
.formLayout .splitInput span input{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    display:inline-block;
    margin:0;
    text-indent:0;
    height:33px;
    font-size:18px;
    color:#666;
    border:none;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    padding:0 5px;
}
.createAccountPage .splitInput span input:focus{
    border:1px solid transparent;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
}



/*************************************************
*  Form Styles:  Show Password
*************************************************/
div div.formPadding>.showPasswordControl,
div div.formPadding>.showPasswordControl{
}
div div.formPadding>.showPasswordControl,
div div.formPadding>.showPasswordControl section{
    background:transparent;
    border:none;
    box-shadow:none;
}
div div.formPadding>.showPasswordControl .switchControl{
    right:0;
}
div div.formPadding>.showPasswordControl section>label{
    font-size:15px;
    color:#666;
    display:block;
    text-align:right;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-right:64px;
}


/*************************************************
*  Form Styles:  Invite Email Input
*************************************************/
.formLayout .emailPartner{
    overflow:auto;
    border-bottom:none;
}
.formLayout .emailPartner .submitBtn{
    position:absolute;
    right:0px;
    top:2px;
}



/*************************************************
*  Form Styles:  Input Text Box Buttons
*************************************************/
.formLayout .locationBrowse{
    width:52px;
    height:52px;
    text-indent:-9999px;
    position:absolute;
    background-position:-266px -1074px;
    top:0;
    right:0;
    border:none;
}
.formLayout .plusBtn{
    width:52px;
    height:52px;
    text-indent:-9999px;
    position:absolute;
    background-position:-62px -1133px;
    top:0;
    right:0;
    border:none;
}



/*************************************************
*  Form Styles:  Select Options
*************************************************/
.formLayout select{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    background:none;
    height:37px;
    border:none;
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
    font-size:16px;
    color:#666;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-right:25px;
    -moz-appearance: window;
    font-family: "Gotham-book";
}
.formLayout select::-ms-expand{
    display: none;
}
.formLayout select:focus{
    border:1px solid transparent;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
.formLayout .selectStyles{
    margin-top:-48px;
    text-indent:0;
}
.iPhone .formLayout .selectStyles,
.iPad .formLayout .selectStyles,
.Android .formLayout .selectStyles{
    margin-top:-48px;
}
.formLayout .selectStyles:after{
    content:"";
    height:50px;
    width:10px;
    background-position:-156px -1316px;
    position:absolute;
    right:12px;
    top:0;
}
.formLayout .selectStyles.noDrillDown select{
    padding-right:0;
}
.formLayout .selectStyles.noDrillDown:after{
    display:none;
}



/*************************************************
*  Form Styles:  Number of Classes Picker
*************************************************/
.formLayout.numCircles .inputGroupH{
    margin-top:-7px;
    padding:0;
    text-indent:0;
    display:table;
}
.formLayout.numCircles .inputGroupH label{
    margin:0 -4px 0 0;
    line-height:40px;
    display:table-cell;
    border:1px solid #e4e5ed;
    background:#fff;
    border-right-color:transparent;
}

.formLayout.settingOptions .inputGroupH{
    display:grid;
}
.formLayout.settingOptions .inputGroupH label{
    width: fit-content;
    min-width: calc(100% - 32px);
}



/*************************************************
*  Form Styles:  Date Control
*************************************************/
.formLayout .dateControl{
    list-style:none;
    margin:0;
    padding:0;
}
.formLayout .disabled.separateTime .dateControl {
    opacity: 0.4;
    filter: alpha(opacity=40);
}
[disabled="disabled"] {
    opacity: 0.4;
    filter: alpha(opacity=40);
}



/*************************************************
*  Form Styles:  Link Control
*************************************************/
.formLayout .linkControl{
    color:#666;
    font-size:15px;
    margin-top:-47px;
    margin-bottom:-2px;
    padding-left:15px;
    display:block;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    padding-right:5px;
    min-height:48px;
    font-family: 'Gotham-book';
}
.formLayout .linkControl.right{
    text-align: right;
    margin-right: 10px;
}
.formLayout .linkControl.drillDown{
    padding-right:20px;
    margin-bottom:0;
}
.formLayout .linkControl.placeholder{
    color:#aaa;
}
.formLayout .linkControl.cautious{
    color:#d52604;
}
.formLayout .linkControl.deleteOption{
    height:50px;
    width:30px;
    background-position:-647px -1315px;
    position:absolute;
    right:0;
    padding:0;
}
.formLayout .linkControl.deleteOption:active{
    background-color:#f1f1f1;
}



/*************************************************
*  Form Styles:  Color Picker Control
*************************************************/
.formLayout section.colorPicker{
    margin-bottom:0;
}
.formLayout .colorPicker input,
.formLayout .colorPicker span{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-shadow:none;
    /*font-size:18px;*/
    display:inline-block;
    width:124px;
    height:32px;
    line-height:32px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    border:none;
    text-align:left;
    text-indent:5px;
    outline:none;
    line-height:34px;
    text-align:center;
}
.formLayout .colorPicker .lightText{
    color:#fff;
}
.formLayout .colorPicker .darkText{
    color:#000;
}
.colorPickerSpectrum{
    box-shadow:0px 1px 4px rgba(0,0,0,.8);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:none !important;
    background:rgba(255,255,255,.95) !important;
}
#colorPicker .colorPicker{
    padding-bottom:120px;
}
#colorPicker .formLayout>section{
    border:none;
}
.iPhone ~ .colorPickerSpectrum{
    box-shadow:none;
    margin-top:2px;
    margin-left:10px;
}



/*************************************************
*  Form Styles:  Calendar Color
*************************************************/
.formLayout .colorPicker.calendarColor span{
    text-indent:-9999px;
    width:15px;
    height:15px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    top:16px;
    right:16px;
}



/*************************************************
*  Form Styles:  Signature Switcher
*************************************************/
div.formPadding>.formLayout>section.signatureSwitcher,
form.formPadding>.formLayout>section.signatureSwitcher,
.formLayout>section.signatureSwitcher{
    padding:5px;
    text-indent:0;
    line-height:normal;
    white-space:nowrap;
    overflow:hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.formLayout section.signatureSwitcher:after{
    content: "";
    height: 50px;
    width: 10px;
    background-position: -156px -1316px;
    position: absolute;
    right: 12px;
    margin-top:-4px;
}
.formLayout section.signatureSwitcher:before{
    content:"";
    height:50px;
    width:80px;
    background-position:-128px -1316px;
    position:absolute;
    right:0;
    margin-top:-4px;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0.01) 0%, rgba(255,255,255,1) 54%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.01)), color-stop(54%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 54%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 54%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 54%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 54%,rgba(255,255,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}
.formLayout section.signatureSwitcher img{
    width:40px;
    height:40px;
    display:inline-block;
    vertical-align:middle;
    margin-right:10px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
/*.formLayout section.signatureSwitcher img.userProfile{
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.formLayout section.signatureSwitcher img.groupProfile{
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}*/
.formLayout section.signatureSwitcher .hgroup{
    display:inline-block;
    vertical-align:middle;
    white-space:nowrap;

}
.formLayout section.signatureSwitcher .hgroup h2{
    text-indent:0;
    line-height:1;
    margin:0 0 3px 0;
}
.formLayout section.signatureSwitcher .hgroup h3{
    text-indent:0;
    line-height:1;
    margin:0;
}
#addPost .formLayout section.signatureSwitcher,
#communityInfoCardEdit .formLayout section.signatureSwitcher,
#composeEmail .formLayout section.signatureSwitcher{
    min-height:0;
    padding-bottom:10px;
    background-color:transparent;
    overflow-x:hidden;
}



/*************************************************
*  Form Styles:  Signature Picker
*************************************************/
#signaturePicker .recipientPickerCtrl .peopleListing .profileM:after{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:45px;
}
#_signaturePicker .recipientPickerCtrl .peopleListing .profileM img{
    margin-left:-11px;
}
#_signaturePicker .recipientPickerCtrl .peopleListing .profileM:before{
    margin-left:-11px;
}
#_signaturePicker .recipientPickerCtrl .peopleListing .profileM:after{
    text-indent:57px;
}



/*************************************************
*  Form Styles:  Switch Control
*************************************************/
.formLayout section .switchLabel{
    display:block;
    line-height:1.25;
    text-indent:0;
    padding:11px 60px 12px 10px;
}
.formLayout section .switchControl{
    width:46px;
    height:30px;
    position:absolute;
    top:0;
    right:0;
}
.formLayout section .switchControl input{
    display:none;
}
.formLayout section .switchControl input + label{
    top:0;
    left:0;
    width:46px;
    height:30px;
    display:block;
    cursor:pointer;
    color:#666;
    font-size:15px;

}
.formLayout section .switchControl input + label:before{
    content:"";
    top:8px;
    right:8px;
    width:46px;
    height:30px;
    display:block;
    position:absolute;
    background-position:-10px -1385px;
}
.formLayout section .switchControl input:checked + label:before{
    background-position:-10px -1325px;
}
.formLayout section.autoSuggest .switchControl label:after{
    display:none;
}
.formLayout .autoSuggest .switchControl{
    top:-10px;
}
.formLayout .autoSuggest .switchControl label{
    margin-top:3px;
}
.formLayout section .fullWidthSwitch,
.formLayout section .fullWidthSwitch input + label{
    width:100%;
    height:47px;
}



/*************************************************
*  Form Styles:  Privacy Control
*  (overwrites .switchControl)
*************************************************/
.formLayout section .privacyControl{
    width:30px;
}
.formLayout section .privacyControl input + label{
    width:30px;
}
.formLayout section .privacyControl input + label:before{
    width:30px;
    height:30px;
    background-position:-464px -1324px;
}
.formLayout section .privacyControl input:checked + label:before{
    background-position:-464px -1384px;
}
.formLayout section .privacyControl input + label:active:before{
    opacity:.5;
    filter:alpha(opacity=50);
}
.formLayout section .privacyControl input:checked + label:active:before{
    opacity:.1;
    filter:alpha(opacity=10);
}




/*************************************************
*  Form Styles:  Auto Suggest
*************************************************/
div .formLayout section.autoSuggest{
    padding:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
}
.formLayout section.autoSuggest .placeHolderText{
    text-indent:120px;
    top:0;
}
.contentAutoSuggest{
    display:none;
}
.editTitle .contentAutoSuggest{
    margin:0;
    background:#eee;
    display:block;
}
.formLayout section.editTitle label:after{
    border-bottom:1px solid #bbb;
}
.formLayout section.autoSuggest label{
    padding:0;
    display:block;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    line-height:51px;
    background:#fff;
    text-indent:15px;
    width:100%;
}
.autoSuggest .contentAutoSuggest .formLayout section{
    width:100%;
    background:#fff;
    border-bottom:none;
    padding:0;
    margin:0;
}
.contentAutoSuggest .formLayout section:first-of-type h1{
    border-top:none;
}
.contentAutoSuggest .formLayout section:last-of-type{
    border-bottom:none;
}
.contentAutoSuggest .formLayout h1{
    line-height:24px;
    margin:-1px 0 0 0;
    padding:0;
    text-indent:20px;
    border-top:1px solid #ccc;
    border-bottom:1px solid #dcdcdc;
    background:#e4e5ed;
    font-size:14px;
    color:#666;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:0px;
}
.autoSuggest .contentAutoSuggest .formLayout{
    margin:0;
    padding:0;
    border-bottom:none;
    position:relative;
}
.contentAutoSuggest section span{
    display:block;
    font-size:18px;
    line-height:50px;
    margin-left:0px;
    text-indent:25px;
    border-top:1px solid #fff;
    border-bottom:1px solid #e4e5ed;
}
.contentAutoSuggest button.clearInput{
    right:0;
    top:18px;
}
.contentAutoSuggest .browseMore:before{
    display:none;
}
.contentAutoSuggest .browseMore{
    border-top:1px solid #fff;
    border-bottom:1px solid #dcdcdc;
    text-indent:30px;
    font-size:18px;
    display:block;
}
.contentAutoSuggest .moreSuggestions{
    display:none;
}
.autoSuggestPage .contentAutoSuggest span.newEntry:after{
    content:"";
    display:block;
    position:absolute;
    background-color:#fff;
    background-position:-461px -1022px;
    border:1px solid #e3e3e3;
    top:7px;
    right:12px;
    width:34px;
    height:34px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    margin-top:0;
}
.autoSuggestPage .contentAutoSuggest span[class='activityType newEntry selected']:after{
    background-position:-524px -1022px;
}
.autoSuggestPage.activityPicker .actionBar label{
    border:none;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg{
   padding: 15px;
    max-width: inherit;
    background: #eff0f8;
    width: auto;
    margin: 10px;
    border-radius: 5px;
    border: 1px solid #e4e5ed;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg h2,
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg p {
    max-width:250px;
    margin:0 auto;
    color:#000;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg h2{
    font-size:21px;
    line-height:31px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg p{
    padding-bottom:22px;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg button {
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #fff;
    padding: 13px 25px;
    line-height: 1;
    font-size: 14px;
    text-indent: 0;
    background: #53c8e6;
    border-radius: 50px;
    border: 0;
    font-weight: bold;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    display:inline-block;
    width:auto;
}
.autoSuggest .contentAutoSuggest .formLayout .emptyPanelMsg button:hover {
    background: #44bfdf;
}

/*************************************************
*  Form Styles:  Auto Suggest - Activities
*************************************************/
.formLayout section.autoSuggest .activityType{
    padding-left:0;
    position:relative;
}




/*************************************************
*  Form Styles:  Auto Suggest - Locations
*************************************************/
.locationPicker .actionBar .selectedList{

}
.autoSuggest section.locations .hgroup{
    line-height:50px;
    border-top:1px solid #fff;
    border-bottom:1px solid #e4e5ed;
    position:relative;
    min-height:78px;
}
.autoSuggest section.locations .hgroup h2{
    text-indent:0;
    margin:18px 0 0 0;
    line-height:20px;
    padding:0 70px 0 25px;
}
.autoSuggest section.locations p{
    padding:0 70px 0 25px;
    margin-top:0;
    color:#aaa;
    word-wrap:break-word;
}
.autoSuggest section.locations p .city,
.autoSuggest section.locations p .state,
.autoSuggest section.locations p .zip{
    display:inline;
}
.autoSuggest section.locations p .country{
    display:none;
}
.autoSuggest section.locations p .state:before{
    content:' ,'
}
.autoSuggest section.locations span{
    display:block;
    font-size:16px;
    line-height:1.25;
    margin-left:0;
    text-indent:0;
    border-top:none;
    border-bottom:none;
}
.autoSuggest section.locations:after{
    display:none;
}
.autoSuggest section.locations .hgroup:before{
    display:none;
}
.autoSuggest section.locations.drillDown .hgroup h2{
    padding:0 40px 0 25px;
}
.autoSuggest section.locations.drillDown p{
    padding:0 40px 0 25px;
}
.autoSuggest section.locations.drillDown .hgroup:before{
    background-position:-139px -1320px;
    border:none;
    right:0;
    top:50%;
    margin-top:-20px;
}
.autoSuggest section.locations .hgroup.newEntry:before{
    display:none;
}
.autoSuggest section.locations .hgroup.newEntry:after{
    width:41px;
    height:41px;
    top:6px;
    right:15px;
    background-position:-458px -1019px;
}




/*************************************************
*  Form Styles:  Pick Up / Drop Off Control
*************************************************/
.formLayout .pudControl{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    list-style:none;
    margin:4px 0 0 0;
    position:relative;
    display:inline-block;
    width:100%;
    text-indent:0;
}
.formLayout .pudControl li{
    position:relative;
    line-height:27px;
    display:inline-block;
    width:80px;
    height:50px;
    margin-bottom:-15px;
    cursor:pointer;
}
.formLayout .pudControl .pud{
    left:47px;
    top:12px;
    font-size:14px;
    line-height:14px;
    color:#666;
    position:absolute;
    text-indent:0px;
    white-space:nowrap;
}
.formLayout .pudControl .profileM{
    position:absolute;
    margin-top:5px;
}
.formLayout .pudControl .profileM img{
    vertical-align:middle;
}
.newEvent .driverControl{
    margin-top:-1px;
    margin-bottom:0;
    margin:-1px 0 0 0;
    text-align:left;
    padding-top:22px;
    padding-right:9px;
    padding-bottom:9px;
    padding:15px 9px 9px 15px;
    text-indent:0;
    border-bottom:1px solid #d9d9d9;
}
.newEvent .driverControl p{
    display:none;
    margin-bottom:3px;
}
.newEvent .driverControl a:first-of-type{
    margin-left:0;
}
.setDropOff,
.setPickUp{
    display:block;
}
.setPickUp p.pickUpMsg,
.setDropOff p.dropOffMsg{
    display:block;
}
.newEvent .setPickUp:after{
    right:auto;
    left:130px;
    display:block;
}
.newEvent .setDropOff:after{
    right:auto;
    left:223px;
    display:block;
}



/*************************************************
*  Form Styles:  Child filter Control
*************************************************/
.formLayout .filterControl{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    position:relative;
    left:0;
    text-indent:0;
    vertical-align:top;
    width:100%;
    margin-top:-42px;
    margin-bottom:0;
}
.formLayout .filterControl li:first-child{
    margin-left:12px;
}
.formLayout .filterControl li{
    display:inline-block;
}
.formLayout .circleColor:after{
    top:50px;
}
.formLayout .childFilter{
    display:inline-block;
    vertical-align:top;
}



/*************************************************
*  Form Styles:  Circle Picker Control
*************************************************/
.viewCircleFilters{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:14px;
    text-align:right;
    display:block;
    width:100%;
    z-index:1;
    margin:24px auto -48px auto;
    position:relative;
    padding-right:11px;
}
.viewCircleFilters:before{
    content:"";
    width:16px;
    height:24px;
    display:inline-block;
    vertical-align:middle;
    background-position:-408px -1329px;
    margin-right:4px;
}
.contentArea section.circleFilters{
    padding:0 10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:hidden;
    margin:15px auto -28px auto;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    background:#fff;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    max-height:36px;
    opacity:0;
    filter:alpha(opacity=0);
    -webkit-transform: translate3d(0,0,0);
}
.circleFilters h2{
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    margin:2px 0 5px 0;
}
.circleFilters .circles{
    display:inline-block;
}
.circleFilters .circles button.circle{
    margin:0 3px 33px 3px;
}
.circleFilters .circles button.circle .circleName:after{
    top:-39px;
}
.circleFilters .circles button.circle .circleName:before{
    content:attr(data-displayname);
    display:block;
    position:absolute;
    font-size:12px;
    color:#666;
    width:46px;
    text-align:center;
    white-space:normal;
    line-height:10px;
    overflow:hidden;
    max-height:32px;
    text-indent:0;
    margin-top:-1px;
}
.circleFilters .circles button.circle .circleName{
    text-indent:-9999px;
}



/*************************************************
*  Form Styles:  Circle Picker Control: Collapsed
*************************************************/
.contentArea section.collapseCirclesFilter{
    margin:15px auto -28 auto;
    max-height:36px;
    opacity:0;
    filter:alpha(opacity=0);
    animation:hideCircleFilter .6s;
    animation-timing-function:ease;
    -webkit-animation:hideCircleFilter .6s;
    -webkit-animation-timing-function:ease;
}



/*************************************************
*  Form Styles:  Circle Picker Control: Expand
*************************************************/
.contentArea section.expandCirclesFilter{
    margin:15px auto 15px auto;
    max-height:300px;
    opacity:1;
    filter:alpha(opacity=100);
    animation:showCircleFilter 1s;
    animation-timing-function:ease;
    -webkit-animation:showCircleFilter 1s;
    -webkit-animation-timing-function:ease;
}


/*************************************************
*  Form Styles:  More Options
*************************************************/
.formLayout .moreOption{
    display:none;
}
.formLayout .moreOptions{
    padding:0;
    text-align:right;
    border-bottom:none;
    cursor:pointer;
}
.formLayout .moreOptions button{
    width:50px;
    height:50px;
    text-indent:-9999px;
    background-position:-140px -660px;
    border:none;
    cursor:pointer;
}



/*************************************************
*  Form Styles:  Footer Options
*************************************************/
footer.options{
    overflow:auto;
    z-index:1;
    width:100%;
    text-align:center;
    overflow:visible;
    position:relative;
    border:1px solid #d7d7d7;
    border-bottom:1px solid #bababa;
    box-shadow:inset 0 1px 0 #fff, 0 1px 0 #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    display:block;
    background: #efefef; /* Old browsers */
    background: -moz-linear-gradient(top,  #efefef 0%, #ececec 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#ececec)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #efefef 0%,#ececec 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #efefef 0%,#ececec 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #efefef 0%,#ececec 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #efefef 0%,#ececec 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#ececec',GradientType=0 )"; /* IE6-9 */
}
footer.options li{
    width:48px;
    margin:0 0 2px 0;
    border:none;
    color:#777;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 1);
    font-size:12px;
    vertical-align:bottom;
    padding:34px 0 8px 0;
    position:relative;
    cursor:pointer;
    display:table-cell;
    border-left:1px solid #fff;
    border-right:1px solid #e4e5ed;
}
footer.options li:first-of-type{
    border-left:none;
}
footer.options li:last-of-type{
    border-right:none;
}
footer.options ul{
    margin:0;
    padding:0;
    width:100%;
    display:table;
    table-layout:fixed;
}
footer.options li:active{
    background-color:rgba(0,0,0,.08);
}
footer.options li div{
    position:relative;
}
footer.options li div:after{
    content:"";
    width:46px;
    height:38px;
    position:absolute;
    left:50%;
    margin-left:-24px;
    top:-27px;
}
footer.options p{
    line-height:1.25;
    padding:0 10px;
}



/*************************************************
*  Form Styles: List Segments
*************************************************/
.formLayout .listSegments{
    text-align:center;
    padding:6px 15px 7px 10px;
    margin:0;
    overflow:hidden;
    border-bottom:1px solid #e4e5ed;
    margin-bottom:-1px;
}
.formLayout .listSegments .inputGroupH{
    margin:0 auto;
    padding:0 0 0 0;
    text-indent:0;
    display:block;
    width:100%;
}
.formLayout .listSegments .inputGroupH label{
    padding:0;
}
.formLayout .numSegments2 .inputGroupH label{
    width:50%;
}
.formLayout .numSegments3 .inputGroupH label{
    width:33%;
}
.formLayout .numSegments4 .inputGroupH label{
    width:25%;
}



/*************************************************
*  Form Styles: selected List
*************************************************/
.formLayout .selectedList{
    border:none;
    padding:0 0 0 105px;
    margin:-51px 0 0 0;
    overflow-y:auto;
    position:relative;
    -webkit-overflow-scrolling:touch;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.formLayout .selectedList label{
    position:absolute;
    left:6px;
    top:10px;
    width:inherit;
}
.formLayout .selectedList span{
    font-size:15px;
    color:#666;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:inline-block;
    float:left;
    line-height:30px;
    padding:0 10px;
    margin:0 1px 3px 1px;
    border:1px solid;
    max-width:85%;
    text-indent:0;
    text-overflow:ellipsis;
    overflow-x:hidden;
    white-space:nowrap;
    background:#f2f2f2;
    border:1px solid #f2f2f2;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.formLayout .selectedList .selected{
    color:#326187;
    background:#b8defa;
    border:1px solid #6fafdc;
    overflow:hidden;
    position:relative;
}
.formLayout .selectedList .selected:after{
    content:"";
    display:block;
    width:64px;
    height:32px;
    position:absolute;
    top:0;
    left:50%;
    margin-left:-12px;
    background-position:-467px -1083px;
}
.formLayout label .selectedList input[type='text']{
    padding-left:0;
}



.formLayout .selectedList .enterLoc{
    display:inline-block;
    position:absolute;
    right:0;
    margin-top:1px;
    text-indent:-9999px;
    width:44px;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    border:none;
    border-left:1px solid #ddd;
    background-position:-269px -666px;
    box-shadow:-1px 0 0 rgba(255,255,255,.5);
}
.formLayout .selectedList .selected .enterLoc{
    border-left:1px solid #a4cbea;
    box-shadow:-1px 0 0 rgba(255,255,255,.5);
    background-color:#d3eafa;
}
.formLayout .selectedList .textInput{
    background:transparent;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    white-space:normal;
    max-width:none;
    vertical-align:middle;
    margin:0;
    cursor:pointer;
    border:1px solid transparent;
}
.formLayout .selectedList .textInput:focus{
    outline:none;
    -webkit-appearance: none;
}
#_pickActivityCenter .formLayout .selectedList input.textInput,
#_pickPlaceLocation .formLayout .selectedList input.textInput{
    width:100%;
    background:red;
    margin:-1px 0 0 -15px;
    border: none;
    box-sizing: border-box;
    height:30px;
    line-height:30px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background: #dedede;
    text-align:center;
    padding:0;
}
#_pickActivityCenter .formLayout .selectedList input.textInput:focus,
#_pickActivityCenter .formLayout .selectedList input.textInput:valid,
#_pickPlaceLocation .formLayout .selectedList input.textInput:focus,
#_pickPlaceLocation .formLayout .selectedList input.textInput:valid{
    text-align:left;
    text-indent:15px;
    background:#fff;
}



/*************************************************
*  Form Styles:  When nested in actionBar
*************************************************/
.actionBar .formLayout{
    margin:0;
    padding:0;
}



/*************************************************
*  Form Validation
*************************************************/
.formLayout .highlight input[type='text'],
.formLayout .highlight input[type='email'],
.formLayout .highlight input[type='password'],
.formLayout .highlight input[type='date'],
.formLayout .highlight input[type='datetime'],
.formLayout .highlight input[type='datetime-local'],
.formLayout .highlight input[type='time'],
.formLayout .highlight input[type='tel'],
.formLayout .highlight input[type='number'],
.formLayout .highlight .editableElement,
.formLayout .highlight textarea,
.formLayout .highlight .inputGroupH,
.formLayout .highlight .inputGroupV,
.formLayout .highlight .dateControl,
.formLayout .highlight .pudControl,
.formLayout .highlight .filterControl,
.formLayout .highlight select,
.formLayout .highlight .linkControl,
.formLayout input.ng-invalid.ng-dirty{
    border:1px solid transparent;
}
.formLayout .highlight input[type='text']:focus,
.formLayout .highlight input[type='email']:focus,
.formLayout .highlight input[type='password']:focus,
.formLayout .highlight input[type='date']:focus,
.formLayout .highlight input[type='datetime']:focus,
.formLayout .highlight input[type='datetime-local']:focus,
.formLayout .highlight input[type='time']:focus,
.formLayout .highlight input[type='tel']:focus,
.formLayout .highlight input[type='number']:focus,
.formLayout .highlight .editableElement:focus,
.formLayout .highlight textarea:focus,
.formLayout .highlight select:focus,
.formLayout .ng-invalid.ng-dirty:focus{
    border:1px solid transparent;
}
.formLayout .highlight .validationMsg,
#printCalendarEvents .validationMsg,
#roboCallNumber .validationMsg,
.behaviorNotifyOption .validationMsg,
#_createCollection .validationMsg,
.generalSettings .validationMsg {
    font-family:'Gotham_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
    font-size:15px;
    text-align:left;
    color:#bf6062;
    line-height:25px;
    padding:0;
    margin-top:-15px;
    position:relative;
}
.formLayout .highlight .inputProfile + .validationMsg{
    margin-top:-34px;
    padding-left:15px;
}



/*************************************************
*  Form Validation: AngularJS validation styles
*************************************************/
.formLayout .input-help{
    line-height:1.25;
    text-indent:0;
    padding:0 10px 5px;
    margin-top:0;
    font-size:15px;
    font-weight:normal;
    color: #e86c6c;
}
.formLayout .input-help h4{
    margin:0;
    font-weight:normal;
}
.formLayout .input-help ul{
    list-style:none;
    padding:0 0 0 4px;
}
.formLayout .input-help li:before,
.formLayout .input-help li.valid:before{
    content:"";
    width:9px;
    height:9px;
    display:inline-block;
    margin-right:5px;
}
.formLayout .input-help li:before{
    background-position:-77px -629px;
}
.formLayout .input-help li.valid:before{
    background-position:-77px -599px;
}
.formLayout .input-help li.valid{
    color:#3a7d34;
}



/*************************************************
*  Contact List: ActionBar (Add From Source)
*************************************************/
.contactList .actionBar{
    height:49px;
    /*border-bottom:none;
    box-shadow:inset 0px -1px 0px #c3c3c3;
    -moz-box-shadow:inset 0px -1px 0px #c3c3c3;
    -webkit-box-shadow:inset 0px -1px 0px #c3c3c3;*/
}
.addFromSource button.addToCircle:after{
    display:block;
    background-position:-446px -1020px;
}
.addFromSource button.addToCircle{
    background:none;
}
.addFromSource{
    height:48px;
    padding-left:3px;
    margin:0;
    overflow:hidden;
}
.addFromSource button{
    width:36px;
    height:36px;
    background:none;
    background-color:#c5c5c5;
    margin-top:7px;
    border:none;
    margin:7px 3px 0 2px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    cursor:pointer;
    position:relative;
    text-indent:-9999px;
    vertical-align:top;
}
.addFromSource button:active{
    border:transparent;
    background-color:#e4e5ed;
}
.addFromSource li{
    position:relative;
    padding-bottom:6px;
    overflow:hidden;
    display:inline-block;
}
.addFromSource li:last-of-type{
    margin-right:15px;
}
.addFromSource li:last-of-type,
.addFromSource li:last-of-type{
    margin-right:0;
}
.addFromSource button.addBloomz{
    background-position:-13px -901px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.addFromSource button.addFacebook{
    background-position:-77px -901px;
}
.addFromSource button.addAddressBook{
    background-position:-141px -901px;
}
.addFromSource button.addEmail{
    background-position:-206px -901px;
}
.addFromSource button.search{
    background-position:-270px -901px;
}
.headerBloomz .addFromSource button.allConnections{
    background-image:none;
    text-indent:0;
    text-align:center;
    padding:2px 0 0 0;
    width:82px;
    text-shadow:none;
    line-height:1;
    color:#fff;
    font-size:14px;
}
.addFromSource button:after{
    display:none;
}
.inviteBloomz .addFromSource .addBloomz,
.inviteBloomzLoc .addFromSource .addBloomz,
.inviteBloomzTeacher .addFromSource .addBloomz{
    background-color:#50c0e3;
}
.inviteBloomz .addFromSource .addBloomz:active,
.inviteBloomzLoc .addFromSource .addBloomz:active,
.inviteBloomzTeacher .addFromSource .addBloomz:active,
.inviteBloomzAllConnections .addFromSource .addBloomz:active{
    background-color:#21a4d6;
}
.inviteFacebook .addFromSource .addFacebook{
    background-color:#3a589a;
}
.inviteFacebook .addFromSource .addFacebook:active{
    background-color:#122c6a;
}
.inviteAddressBook .addFromSource .addAddressBook{
    background-color:#00a200;
}
.inviteAddressBook .addFromSource .addAddressBook:active{
    background-color:#007b00;
}
.inviteBloomzAllConnections .addFromSource .allConnections{
    background-color:#50c0e3;
}
.inviteEmail .addFromSource .addEmail{
    background-color:#ff6a12;
}



/*************************************************
*  Contact List: Page Header
*************************************************/
.contactList .actionBar .formLayout{
    margin:0 0 0 64px;
    padding:0 0 1px 0;
    border-bottom:1px solid #e4e5ed;
}
.contactList .actionBar .formLayout section,
.contactList .listHeader{
    text-align:center;
    padding:6px 15px 7px 10px;
    margin:0;
    overflow:hidden;
}
.contactList .actionBar .formLayout h2,
.contactList .listHeader h2{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:20px;
    line-height:28px;
    margin-bottom:-4px;
    text-indent:0;
}
.contactList .listHeader h2{
    margin-top:4px;
}
.contactList .actionBar .formLayout h3,
.contactList .listHeader h3{
    display:block;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-indent:0;
    line-height:1;
    margin-top:11px;
    margin-bottom:10px;
    color:#000;
}
.contactList .listHeader h3{
    margin-top:4px;
    overflow:visible;
}
.contactList .listHeader h3:first-of-type{
    margin-top:20px;
}
.contactList .listHeader p{
    margin:5px 0 0 0;
    padding:0;
    font-size:15px;
    text-align:center;
}
.contactList .listHeader h2 + h3:first-of-type{
    margin-top:4px;
}
.contactList .listHeader h3 input{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    width:100%;
    height:37px;
    padding:0 10px;
    color:#666;
    margin:0;
    background:#fff;
    outline:none;
    -webkit-appearance: none;
}
.contactList .listHeader h3 input:focus{
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
.contactList .actionBar .formLayout section,
.contactList .listHead section{
    margin-top:-1px;
}



div.peopleListing .formLayout p.cardHeader{
    text-align:left;
    font-size:18px;
    padding-left:0;
    display:none;
    cursor:pointer;
}
div.peopleListing .formLayout p.cardHeader:after{
    content: "";
    height: 50px;
    width: 10px;
    background-position:-156px -1331px;
    position: absolute;
    right: 12px;
}
div.peopleListing .formLayout .expanded p.cardHeader,
div.peopleListing .formLayout .collapsed p.descript,
div.peopleListing .formLayout .collapsed h3,
div.peopleListing .formLayout .collapsed button{
    display:none;
}
div.peopleListing .formLayout .collapsed p.cardHeader,
div.peopleListing .formLayout .expanded p.descript{
    display:block;
}



div.peopleListing .formLayout section.inviteTeacherCard{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:10px;
    background:#fff;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    margin-bottom:15px;
    padding:10px;
    position:relative;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
div.peopleListing .formLayout section.inviteTeacherCard p{
    padding:0 5px;
}
div.peopleListing .formLayout section.inviteTeacherCard h2{
    font-size:18px;
}
div.peopleListing .formLayout section.inviteTeacherCard h3:first-of-type{
    margin-top:10px;
}
div.peopleListing .formLayout section.inviteTeacherCard .addContact{
    width:100%;
    display:block;
}
div.peopleListing .formLayout section.inviteTeacherCard button{
    float:right;
}
div.peopleListing .formLayout section.inviteTeacherCard button:first-of-type{
    margin-left:4px;
}



/*************************************************
*  Contact List: Content Area
*************************************************/
.contactList{
    height:100%;
}
.peopleListing .profileM img{
    width:50px;
    height:50px;
}
#addPost .formLayout section.peopleListing{
    height:auto;
    padding-left:10px;
}
.peopleListing{
    display:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
}
.inviteBloomz .contentBloomz,
.inviteBloomz .actionBar section.headerBloomz,
.inviteBloomzLoc .contentBloomzLoc,
.inviteBloomzLoc .actionBar section.headerBloomz,
.inviteBloomzTeacher .contentBloomzTeacher,
.inviteBloomzTeacher .actionBar section.headerBloomz,
.inviteBloomzAllConnections .actionBar section.headerBloomz,
.inviteBloomzAllConnections .contentBloomzAllConnections,
.inviteFacebook .contentFacebook,
.inviteEmail .contentEmail,
.inviteAddressBook .contentAddressbook,
.inviteSearchResults .contentSearchResults,
.inviteCircles .contentInviteCircles{
    display:block;
}
.headerBloomz{
    border-bottom:1px solid #e4e5ed;
    padding-bottom:1px;
}
.peopleListing .formLayout{
    padding-bottom:0;
}
.peopleListing .formLayout section{
    border-bottom:1px solid #f2f2f2;
    text-indent:0;
    padding:4px 15px 11px 0;
    margin-top:0px;
}

.studentsList.peopleListing.contentBloomzLoc .formLayout section{
    margin-top:1px !important;
    min-height:80px !important;
}

.peopleListing.contentBloomz .formLayout section{
    min-height:50px;
}
.peopleListing .profileM{
    overflow:visible;
    color:#000;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
}
.peopleListing .profileM img{
    vertical-align:top;
}
.peopleListing .hgroup h3{
    margin:-35px 0 -8px 0;
    text-indent:73px;
    overflow:hidden;
}
.peopleListing .formLayout section .hgroup{
    position:relative;
}
.peopleListing .formLayout section .hgroup:not(.importCleverClass) button{
    position:absolute;
    right:6px;
    top:-1px;
    width:41px;
    height:41px;
    text-indent:-9999px;
    background-color:#fff;
    border:1px solid;
    border-color:#e4e5ed;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    z-index:1;
}
.peopleListing .formLayout section .hgroup.noIcon button{
    display: none
}
.iPhone .peopleListing .formLayout section .hgroup button,
.iPad .peopleListing .formLayout section .hgroup button{
    top:8px;
}
.peopleListing .formLayout section.horizontalList .hgroup button.addCircles,
.peopleListing .formLayout section.horizontalList .hgroup button.pendingInvite{
    text-indent:-9999px;
}
.peopleListing .formLayout section .hgroup button.addCircles{
    text-indent:0px;
    text-align:center;
    padding:12px 0 11px 0;
    color:#93c400;
    text-shadow:none;
    background:none;
    font-size:18px;
    background:#fff;
}
.peopleListing .hgroup button.addCircles:after{
    content:"";
    display:inline-block;
    vertical-align:middle;
    width:15px;
    height:20px;
    background-position:-89px -791px;
}
.peopleListing .formLayout section .hgroup .memberStatus{
    position:absolute;
    top:8px;
    right:8px;
    line-height:normal;
}
.peopleListing .formLayout section .hgroup button.isConnected,
.peopleListing .formLayout section .hgroup button.isMuted,
.peopleListing .formLayout section .hgroup button.pendingInvite,
.recipientPickerCtrl .peopleListing .formLayout section .hgroup button.isConnected,
.recipientPickerCtrl .peopleListing .formLayout section .hgroup button.isMuted,
.recipientPickerCtrl .peopleListing .formLayout section .hgroup button.pendingInvite{
    text-indent:0px;
    text-align:center;
    padding:5px 6px;
    color:#555;
    text-shadow:none;
    background:none;
    font-size:12px;
    border:none;
    cursor:default;
    width:auto;
    height:auto;
    line-height:1;
    background-image:none !important;
    background-color:#f4f4f4;
    position:relative;
    top:auto;
    right:auto;
    margin:0 2px;
    box-shadow:-4px 0px 0px #fff;
}
.recipientPickerCtrl .selectAllGroups{
    color: #53c8e6;
    cursor: pointer;
    position: absolute;
    right: 10px;
    z-index: 4000;
    top: 6px;
}
.peopleListing .formLayout section .hgroup .memberStatus button:first-of-type{
    box-shadow:-10px 0px 5px #fff;
}

/* for connection status on member listing page */
.peopleListing .formLayout section .hgroup:after{
    content:"";
    width:15px;
    height:100%;
    position:absolute;
    right:-15px;
    top:-1px;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0.01) 0%, rgba(255,255,255,1) 18%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.01)), color-stop(18%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 18%,rgba(255,255,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}
/* for add button in recipient picker */
.peopleListing.contentSearchResults .formLayout section .hgroup:after{
    width:80px;
}
.iPhone .peopleListing .formLayout section .hgroup:after,
.iPad .peopleListing .formLayout section .hgroup:after{
    top:8px;
}
.peopleListing .formLayout section .highlightableRow:active:after{
    content:"";
    width:70px;
    height:60px;
    position:absolute;
    right:-15px;
    top:-5px;
    background: -moz-linear-gradient(left,  rgba(241,241,241,0.01) 0%, rgba(241,241,241,1) 18%, rgba(241,241,241,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(241,241,241,0.01)), color-stop(18%,rgba(241,241,241,1)), color-stop(100%,rgba(241,241,241,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(241,241,241,0.01) 0%,rgba(241,241,241,1) 18%,rgba(241,241,241,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(241,241,241,0.01) 0%,rgba(241,241,241,1) 18%,rgba(241,241,241,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(241,241,241,0.01) 0%,rgba(241,241,241,1) 18%,rgba(241,241,241,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(241,241,241,0.01) 0%,rgba(241,241,241,1) 18%,rgba(241,241,241,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}
.peopleListing .hgroup button.addContact{
    background-position:-77px -839px;
}
.peopleListing .formLayout section .hgroup button.removeContact{
    background-position:-141px -839px;
    border:none;
    cursor:default;
}
.peopleListing .formLayout section .hgroup button.addAll,
.peopleListing .formLayout section .hgroup button.removeAll{
    width:41px;
    height:31px;
    text-indent:10px;
    line-height:31px;
    color:#bdbdbd;
    text-shadow:none;
    padding:0;
    background:#fff;
    top:12px;
}
.peopleListing .formLayout section .hgroup button.removeAll{
    color:#53c8e6;
}
.peopleListing .hgroup button.addAll:after,
.peopleListing .hgroup button.removeAll:after{
    content:"";
    width:9px;
    height:8px;
    position:absolute;
    left:5px;
    top:11px
}
.peopleListing .hgroup button.addAll:after{
    background-position:-82px -855px;
}
.peopleListing .hgroup button.removeAll:after{
    background-position:-145px -856px;
}
.formLayout section.personContext{
    background:#e8e8e8;
    padding:1px 15px 5px 0;
}
.personContext .profileM{
    margin-left:-5px;
}
.personContext .profileM:after{
    margin-left: -55px;
    text-indent: 55px;
}
.personContext .profileM img{
    margin-right:15px;
}
.personContext .hgroup h3{
    text-indent:62px;
    padding-left:0;
}
.personContext .hgroup h2 a{
    cursor:default;
}



/*************************************************
*  Contact List: Grouped Listing
*************************************************/
.peopleListing .groupedListing{
    padding:10px;
}
.peopleListing .groupedListing section{
    background:#e8e8e8;
    border-bottom:1px solid #e8e8e8;
    padding:0px;
}
.peopleListing .groupedListing section.listHeader{
    margin-left:0px;
    padding-top:7px;
}
.peopleListing .groupedListing .hgroup{
    background:#fff;
    padding-top:3px;
    padding-bottom:11px;
    border-bottom:1px solid #f2f2f2;
    overflow:hidden;
    min-height:50px;
}
.peopleListing .groupedListing .hgroup:empty{
    border-bottom:none;
    padding:0;
}
.peopleListing .groupedListing .hgroup:first-of-type{
    min-height:45px;
}
.peopleListing .groupedListing .hgroup:first-of-type:after{
    width:20px;
}
.peopleListing .groupedListing .hgroup:last-of-type{
    border:none;
}
.peopleListing .groupedListing .hgroup h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.iPhone .peopleListing .groupedListing .hgroup h2,
.iPad .peopleListing .groupedListing .hgroup h2{
    margin-top:-2px;
}
.peopleListing .groupedListing .hgroup:first-of-type h2{
    cursor:pointer;
}
.peopleListing .groupedListing section:last-of-type{
    margin-bottom:15px;
}



/*************************************************
*  Contact List: Grouped Listing (Vertical)
*************************************************/
.peopleListing .groupedListing .verticalList .hgroup button{
    right:11px;
    top:13px;
}
.peopleListing .groupedListing .verticalList .hgroup:after{
    right:0px;
    top:2px;
}
.peopleListing .groupedListing .verticalList{
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    overflow:hidden;
    margin-bottom:15px;
}
.peopleListing .groupedListing .verticalList .hgroup .profileM{
    margin-left:0px;
}
.peopleListing .groupedListing .verticalList .hgroup:first-of-type h2{
    margin-top:8px;
}
.peopleListing .groupedListing .verticalList .hgroup h3{
    text-indent:64px;
}
.peopleListing .groupedListing .verticalList .loadMore{
    display:none;
}
.peopleListing .groupedListing .verticalList div>label{
    background:#f9f9f9;
    border-bottom:1px solid #f2f2f2;
    color:#666;
    font-size:15px;
    line-height:1.25;
    display:block;
    margin:0;
    padding:0;
    padding:7px 12px;
    height:auto;
}
.peopleListing .groupedListing .verticalList .profileWithChildren h2{
    padding-left:10px;
}
.peopleListing .groupedListing .verticalList .profileWithChildren h3{
    text-indent:86px !important;
    margin-top:-62px;
}
.peopleListing .groupedListing .verticalList .profileWithChildren h3 + h3{
    margin-top:-30px;
    margin-bottom:-10px;
}
.peopleListing .groupedListing .verticalList .profileWithChildren .contactsChildren{
    background:#fff;
    display:block;
    padding:0 15px 0 0;
    position:relative;
    overflow:visible;
    z-index:2;
    margin:-13px 0 0 85px;
}
.peopleListing .groupedListing .verticalList .profileWithChildren .emailPhone + .contactsChildren{
    margin-top: 0 !important;
}
.peopleListing .groupedListing .verticalList .profileWithChildren .contactsChildren .profileS{
    display: block;
    float: left;
    margin: 0 4px 4px 0;
}
.peopleListing .emailPhone{
    margin-top:-10px;
}
.peopleListing h4{
    text-indent:71px;
    margin: 0;
    font-size: 15px;
    line-height: 20px;
}
.peopleListing .profileEmailPhone{
    color: #1ca0c8;
}
.peopleListing .profileWithChildren h4{
   text-indent: 86px !important;
}

.peopleListing .profileWithChildren .emailPhoneManageTab h4{
   text-indent: 97px !important;
   margin-top: 10px !important;
   margin-left: 11px;
}



/*************************************************
*  Contact List: Grouped Listing (Horizontal)
*************************************************/
.formLayout section.horizontalList{
    text-indent:0px;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    overflow:hidden;
    margin-bottom:15px;
}
.horzListNoShadow{
    box-shadow:none !important;
    -moz-border-radius:0px !important;
    -webkit-border-radius:0px !important;
    border-radius:0px !important;
    border:none !important;
    border-bottom:1px solid #f2f2f2 !important;
}
.horizontalList{
    overflow:hidden;
    height:56px;
    margin-bottom:7px;
    white-space:nowrap;
}
.horizontalList .profileM{
    width:40px;
    overflow:hidden;
}
.peopleListing .horizontalList .showMore{
    display:none;
}
.peopleListing .horizontalList .hgroup{
    display:inline-block;
    margin:0 1px 30px 0;
    padding:6px 0 5px 0;
    border:none;
    position:absolute;
    top:-64px;
    left:0px;
    vertical-align:top;
}
.peopleListing .communityMemberListing .horizontalList .hgroup ~ .hgroup{
    margin-right:-3px;
}
.peopleListing .groupedListing .horizontalList .hgroup:first-of-type{
    display:block;
    margin:0;
    padding:3px 0 0 0;
    height:105px;
    margin-top:0px;
    top:0px;
    left:0px;
    background:#fff;
}
.peopleListing .groupedListing .horizontalList .hgroup:nth-child(2){
    margin-left:12px;
}
.peopleListing .horizontalList .hgroup:last-of-type{
    border:none;
}
.peopleListing .groupedListing .horizontalList .hgroup:first-of-type h2{
    width:auto;
    margin-top:8px;
}
.peopleListing .groupedListing .horizontalList .hgroup h2{
    width:44px;
    overflow:hidden;
    margin-top:-3px;
    position:relative;
    z-index:1;
    padding-left:3px;
    padding-top:4px;
}
.peopleListing .groupedListing .horizontalList .hgroup .profileM{
    margin-left:-15px;
}
.peopleListing .groupedListing .horizontalList .hgroup button.addContact,
.peopleListing .groupedListing .horizontalList .hgroup button.removeContact,
.peopleListing .groupedListing .horizontalList .hgroup button.addCircles,
.peopleListing .groupedListing .horizontalList .hgroup button.pendingInvite{
    right:1px;
    top:7px;
    width:46px;
    height:46px;
    background:transparent;
    border:2px solid transparent;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    z-index:0;
    cursor:pointer;
}
.contentBloomzLoc.peopleListing .groupedListing .horizontalList .hgroup:first-of-type>div{
    width:auto;
}
.contentBloomzLoc.peopleListing .groupedListing .horizontalList .hgroup>div{
    width:47px;
    position:relative;
}
.contentBloomzLoc.peopleListing .formLayout section.horizontalList .hgroup button.pendingInvite{
    top:1px;
}






.peopleListing .groupedListing .horizontalList .hgroup button.removeContact{
    border-color:#51c1e4;
    top:4px;
}
.peopleListing .groupedListing .horizontalList .hgroup button.pendingInvite{
    border-color:#ff6c00;
    top:4px;
}
.peopleListing .groupedListing .horizontalList .hgroup button.addCircles{
    border-color:#93c400;
    top:4px;
}
.peopleListing .groupedListing .horizontalList .hgroup button.addAll,
.peopleListing .groupedListing .horizontalList .hgroup button.removeAll{
    right:11px;
    top:12px;
}
.peopleListing .groupedListing .horizontalList .hgroup h3,
.peopleListing .groupedListing .horizontalList .hgroup:after{
    display:none;
}










.peopleListing .groupedListing .horizontalList .loadMore{
    text-indent:0;
    vertical-align:top;
    background:#e8e8e8;
    text-align:center;
    height:40px;
    min-height:40px;
    min-width:37px;
    line-height:40px;
    margin:12px 0 0 0;
    color:#666;
    padding:0 3px 0 0;
    cursor:pointer;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
    font-size:18px;
    margin-top:7px;
}
.peopleListing .groupedListing .horizontalList .loadMore span{
    display:block;
    padding:0 5px;
    color:#8e8e8e;
    font-size:15px;
    cursor:pointer;
}



/*************************************************
*  Multiselection of People
*************************************************/
.peopleCheckBox .formLayout label,.invitedLabel{
    text-indent:10px;
    display:block;
    /*border-top:0;*/
    /*border-bottom:0;*/
}
.peopleCheckBox .profileM{
    margin-left:35px;
}
.peopleCheckBox .hgroup h2{
    overflow:hidden;
}
.peopleCheckBox .formLayout section .hgroup:after{
    right:-15px;
    width:25px;
    height:50px;
}
.peopleCheckBox .hgroup h3{
    text-indent:106px;
}
.peopleCheckBox .formLayout section .hgroup button.addToMsg,
.peopleCheckBox .formLayout section .hgroup button.removeFromMsg{
    width:20px;
    height:20px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    padding:0;
    border:2px solid #e4e5ed;
    background-color:#fff;
    position:absolute;
    left:26px;
    top:13px;
}
.peopleCheckBox .formLayout section .hgroup button.removeFromMsg{
    border-color:#53c8e6;
}
.communityManage .buttonIsSelected:after,
.importCleverClass .buttonIsSelected:after,
.peopleCheckBox .formLayout section .hgroup button.removeFromMsg:after{
    content:"";
    width:20px;
    height:20px;
    display:block;
    position:absolute;
    top:-2px;
    left:-2px;
    background-position:-212px -852px;
}

.importCleverClass.symptomsSummary .buttonIsSelected:after,
.importCleverClass.symptomsSummary .buttonIsNotSelected:after{
    width: 30px;
    height: 30px;
}

.importCleverClass.symptomsSummary .buttonIsSelected:after{
    background-position: -242px -2075px;
}

.importCleverClass.symptomsSummary .buttonIsNotSelected:after{
    background-position: -273px -2075px;
}

.peopleCheckBox .onlineStatus:after{
    right:0;
    top:9px;
}



/*************************************************
*  Contact List: Bloomz Specific
*************************************************/
.shadowBox .contactList,
.inlineBox .contactList{
    padding-top:98px;
}
#inviteSpouseSearch.shadowBox .inviteSearchResults,
#inviteSpouseSearch.inlineBox .inviteSearchResults,
#memberListing .inviteSearchResults{
    padding-top:47px;
}
.contentBloomz{
    background:#fff;
}
.inviteBloomz .contentBloomz{
    background:#e8e8e8;
}
#searchMembers .contactList .actionBarSearch,
#searchMembers .contactList .actionBarEmail{
    margin-top:49px;
}
#searchMembers .contactList .actionBarSearch .actionButtons .searchBox:before,
#searchMembers .contactList .actionBarEmail .actionButtons .emailBox:before{
    top:2px;
}
#memberListing .inviteCircles .circles .circle{
    margin:0;
}
#memberListing .inviteCircles .peopleListing .formLayout section .hgroup button.circle{
    padding-left:0;
}
#memberListing .circles button.circle .circleName:after{
    left:4px;
    top:-8px;
}
#memberListing .circles button.circle:before,
#memberListing .inviteCircles .peopleListing .formLayout section .hgroup button.circle{
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
#memberListing .formLayout section.horizontalList{
    box-shadow:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:none;
}





#memberListing .formLayout .circles h2 button.circle .circleName{
    top:10px;
}
#memberListing .formLayout section.circles button.groupIcon{
    right:auto;
    left:10px;
    top:13px;
    -moz-border-radius:50% !important;
    -webkit-border-radius:50% !important;
    border-radius:50% !important;
}
#memberListing .formLayout section.circles button.groupIcon:before{
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
#memberListing .formLayout section.circles button.groupIcon .circleName:after{
    top:3px;
    left:10px;
}
#memberListing .formLayout section.circles.noselect h3{
    text-indent:73px;
    margin-top:26px;
}
#memberListing .formLayout section.circles.noselect button.hasLogo .circleName{
    top:15px;
}
#memberListing .formLayout>section{
    padding:0;
}









#memberListing .circles button.hasLogo .circleName:after{
    display:none;
}
#memberListing .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo{
    background-position:0;
    background-repeat:no-repeat;
    background-size:cover;
    border:none;
    height:56px;
    width:56px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    right:auto;
    left:10px;
}
#memberListing .circles button.circle:before{
    width:56px;
    height:56px;
}
#memberListing .circles button.circle.hasLogo:before{
    border:1px solid rgba(0,0,0,.3);
    margin-top:-1px;
    margin-left:-1px;
    background:none;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
#memberListing .circles button.circle.hasLogo .count{
    top:-4px;
    right:-4px;
}
#memberListing .circles button.circle.hasLogo.addChild{
    background:#fff
}
#memberListing .circles button.circle.hasLogo.addChild:before{
    background-position:-458px -1018px;
    border:1px dashed #aaa;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    -moz-border-radius-topright: 0;
    -webkit-border-radius-topright: 0;
    border-top-right-radius: 0;
}
#memberListing .listLabelAction {
    color: #53c8e6;
    cursor: pointer;
    position: absolute;
    right: 10px;
}
#memberListing .listLabelAction.explainLabel {
    right: inherit !important;
    text-decoration: underline;
}




/*************************************************
*  Contact List: Bloomz (Scope Picker)
*************************************************/
.contactList .listHeader .centerScope{
    text-align:left;
    text-indent:10px;
}
.contactList .listHeader .centerScope:after{
    content:"x";
    display:inline-block;
    width:15px;
    height:15px;
    position:relative;
    margin:-2px 0 0 5px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    vertical-align:middle;
    color:#8e8e8e;
}

/*************************************************
*  Contact List: Bloomz (enter location)
*************************************************/
.contentBloomzLoc .groupedListing:not(.invitedSectionManage){
    background:#e8e8e8;
}
.contentBloomzLoc .groupedListing section:last-of-type{
    margin-bottom:0;
}
div .contentBloomzLoc .groupedListing .hgroup:last-of-type{
    border-top:1px solid transparent;
}
.contentBloomzLoc .formLayout section.listHeader{
    padding-left:15px;
    background:#e8e8e8;
}
.contentBloomzLoc .listHeader .helpText{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:block;
    text-align:left;
    font-size:15px;
    line-height:15px;
    padding:0 10px 10px 10px;
}
.contentBloomzLoc .formLayout section{
    min-height:50px;
}
.contentBloomzLoc .formLayout section.listHeader{
    padding-top:0;
    margin-top:0;
    border-bottom:none
}
.contentBloomzLoc .groupedListing .hgroup:last-of-type{
    border-top:1px solid #f2f2f2;
}
.contentBloomzLoc .hgroup h2{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:10px 0 3px 15px;
    line-height:15px;
    margin-top:0px;
    text-indent:0;
}
.contentBloomzLoc .horizontalList .hgroup:first-of-type h2{
    text-indent:10px;
}
.horizontalList .hgroup:first-of-type h2.drillDown{
    padding-right:30px;
}
.horizontalList .hgroup:first-of-type h2.drillDown:after{
    margin-top:-4px;
    height:32px;
    background-position:-156px -1324px;
    z-index:1;
}
.horizontalList .hgroup:first-of-type .addMember{
    height:46px;
    width:40px;
    background-position:-458px -1014px;
    text-indent:-9999px;
    position:absolute;
    right:0 !important;
    top:0 !important;
    border:none;
    -moz-border-radius:0 3px 0 0;
    -webkit-border-radius:0 3px 0 0;
    border-radius:0 3px 0 0;
    margin-top:-11px;
}
.horizontalList .hgroup:first-of-type .addMember:active{
    background-color:#f1f1f1;
}
.horizontalList .hgroup:first-of-type .joinBtn,
.verticalList .hgroup:first-of-type .joinBtn{
    font-size:14px;
    height:30px;
    line-height:30px;
    width:auto;
    position:absolute;
    right:7px !important;
    top:12px !important;
    text-indent:0;
    margin-top:-11px;
    padding:0 7px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    background-color: #fff;
    border: 1px solid #e4e5ed;
    border-bottom: 1px solid #b5b5b5;
    box-shadow:15px 0 0 #fff;
}
.verticalList .hgroup:first-of-type .joinBtn{
    margin-top:5px;
}
.horizontalList .hgroup:first-of-type .joinBtn:before,
.verticalList .hgroup:first-of-type .joinBtn:before{
    content:"";
    display:block;
    width:10px;
    height:30px;
    background:#fff;
    position:absolute;
    margin-left:-18px;
}
.verticalList .hgroup:first-of-type h2.drillDown{
    padding-right:30px;
}
.verticalList .hgroup:first-of-type h2.drillDown:after{
    z-index:1;
}
.verticalList .hgroup:first-of-type .addMember{
    height:61px;
    width:40px;
    background-position:-458px -1008px;
    text-indent:-9999px;
    position:absolute;
    right:0 !important;
    top:4px !important;
    border:none;
    -moz-border-radius:0 3px 0 0;
    -webkit-border-radius:0 3px 0 0;
    border-radius:0 3px 0 0;
    margin-top:-4px;
}
.verticalList .hgroup:first-of-type .addMember:active{
    background-color:#f1f1f1;
}
.peopleListing.contentBloomzLoc .groupedListing .horizontalList .hgroup h2 .profileM{
    margin-left:0;
}
.contentBloomzLoc .hgroup p{
    margin:0;
    color:#8e8e8e;
    font-size:15px;
    line-height:15px;
}
.contentBloomzLoc .hgroup p .address{
    display:block;
}
.contentBloomzLoc .hgroup p .city:after{
    content:", "
}
.contentBloomzLoc .formLayout section .hgroup button.addLocation{
    background-color:#fff;
    background-position:-268px -1081px;
    top:8px;
    right:0;
}
.contentBloomzLoc .locationFilter{
    padding:10px 10px 0 10px;
}
.contentBloomzLoc .locationFilter + .formLayout{
    padding-top:0;
}
.contentBloomzLoc .locationFilter .formLayout section{
    text-indent:10px;
    font-size:18px;
}
.contentBloomzLoc .locationFilter>.formLayout>section{
    padding-bottom:0;
}



/*************************************************
*  Contact List: Bloomz (enter teacher)
*************************************************/
.contentBloomzTeacher{
    background:#e8e8e8;
}
.contentBloomzTeacher .formLayout{
    background:#e8e8e8;
}
.contentBloomzTeacher .formLayout section.listHeader{
    padding-left:0;
    background:#e8e8e8;
}
.contentBloomzTeacher .formLayout section .hgroup:after{
    height:50px;
    width:68px;
}
.contentBloomzTeacher .verticalList .hgroup .profileM img{
    vertical-align:top;
}
.contentBloomzTeacher .horizontalList .hgroup .profileM img{
    vertical-align:middle;
}
.contentBloomzTeacher .hgroup h2{
    overflow:hidden;
}
.contentBloomzTeacher .formLayout section .hgroup button.addToMsg,
.contentBloomzTeacher .formLayout section .hgroup button.removeFromMsg{
    top:8px;
}
.contentBloomz .formLayout button.clearInput{
    top:52px;
}


/*************************************************
*  Contact List: Facebook Specific
*************************************************/
.contentFacebook{
    background:#e8e8e8;
}
.contentFacebook .groupedListing .verticalList .hgroup .profileM img{
    vertical-align:middle;
}
.contentFacebook .groupedListing .hgroup h3{
    display:none;
}
.contentFacebook .signInFB{
    text-align:center;
}


/*************************************************
*  Contact List: Email Invite Specific
*************************************************/
.contentEmail{
    background:#e8e8e8;
}



/*************************************************
*  Contact List: Browse People (grouping results)
*************************************************/
.groupedListing .horizontalList:after,
.groupedListing .verticalList:after{
    content:"";
    display:inline-block;
    width:2px;
    height:47px;
    max-height:64px;
    position:absolute;
    left:9px;
    top:4px;
}
.groupedListing .verticalList:after{
    height:51px;
}



/*************************************************
*  Invite to Groups
*************************************************/
#inviteToPicker .actionBar h1{
    padding:4px 40px 4px 73px;
}
#inviteToPicker .peopleListing .formLayout section .hgroup .addToMsg{
    display:none;
}
#inviteToPicker .inviteCircles .circles .circle{
    margin-left:13px;
}

/*************************************************
* Group Types
*************************************************/
#groupTypes .inviteCircles .circles .circle{
    margin-left:13px;
}


/*************************************************
*  Add Recipients
*************************************************/
.actionBarCircles{
    position:absolute;
}
.subPage .actionBarCircles ul.actionButtons li.circlesBox{
    margin-right:0;
    height:38px;
    overflow:visible;
}
.recipients{
    background:#fff;
    border:solid #c3c3c3;
    border-width:0 0 1px 0;
    padding:4px 3px 0px 28px;
    margin:9px 0 10px 0;
    max-height:70px;
    min-height:30px;
    overflow-y:auto;
    position:relative;
    -webkit-overflow-scrolling:touch;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    cursor:text;
}
.recipients>span{
    position:relative;
}
.recipients label{
    position:absolute;
    left:6px;
    top:7px;
    left: 13px;
    top: 5px;
    width:inherit;
}
.recipients>span>span{
    display:inline-block;
    margin:0px 2px 0px 0;
    max-width:90%;
    height:20px;
    min-height:20px;
}
.recipients span span span:not(.recipientsHoverList){
    position:relative;
    text-overflow:ellipsis;
    text-shadow:none;
    white-space:nowrap;
    cursor:pointer;
    display:block;
    margin:0 0 -9px 0 !important;
    padding:0 1px;
    height:20px;
    line-height:20px;
    background:none;
    border:1px solid #fff;
    color:#0099d4 !important;
    overflow-x:hidden;
    overflow-y:hidden;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.recipients span.selected span span,
.recipients span span span.selected{
    color:#0099d4 !important;
    background:transparent;
    border:1px solid transparent;
    padding-right:20px;
    text-decoration:underline;
}
.recipients>span>span>span:after{
    content: ",";
}
.recipients>span.selected>span>span:after,
#student_name>span.selected:after,
.recipients>span>span>span.selected:after{
    padding-left:16px;
    background-position:-660px -611px;
    position:absolute;
    right:0;
}
.recipients .textInput{
    background:transparent;
    border:none;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    white-space:normal;
    vertical-align:middle;
    margin:1px 0 4px 0;
    display:inline-block;
    max-width:none;
    min-width:10px;
    vertical-align:top;
    line-height:24px;
    padding-left:5px;
}
.recipients .textInput:focus{
    outline:none;
    -webkit-appearance: none;
}
nav.newMessage li.circlesBox{
    padding:0 6px 0 43px;
}
nav.newMessage .nextButton{
    display:inline-block;
    z-index:1;
    width:48px;
    height:48px;
    background-position:-73px -1317px;
    margin-top:0px;
    position:absolute;
    left:0;
    padding:0;
    text-indent:25px;
    vertical-align:middle;
    text-indent:-9999px;
}
nav.newMessage .nextButton:active{
    opacity:.3;
    filter:alpha(opacity=30);
}



/******************************************************
*  Recipient Picker Control: ActionBar
*******************************************************/
.recipientPickerCtrl{
    height:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}



/******************************************************
*  Recipient Picker Control: ActionBar
*******************************************************/
.recipientPickerCtrl nav.actionBar{
    display:none;
}
.recipientPickerCtrl .recipients .placeHolderText{
    color:#aaa;
    position:absolute;
    margin:4px 0 0 14px;
}
.recipientPickerCtrl .recipientsListLabel{
    position:absolute;
    text-indent:5px;
    margin-top:13px;
}



/******************************************************************
*  Recipient Picker Control: position recipients list label on top
******************************************************************/
.recipientPickerCtrl.labelTop.modeAddPeople{
    padding-top:48px;
}
.recipientPickerCtrl.labelTop.modeAddPeople .actionBar.selectGroups{
    height:48px;
}
.recipientPickerCtrl.labelTop.modeAddPeople .actionBar .actionButtons{
    top:109px;
    height:64px;
    background:#e8e8e8;
}
.recipientPickerCtrl.labelTop .recipientsListLabel{
    background:#fef9e3;
    position:relative;
    width:100%;
    display:block;
    padding:13px 10px 15px 10px;
    margin:-16px 0 16px -10px;
    border-bottom:1px solid #e4e5ed;
    text-indent:-9999px;
    font-size:13px;
    color:#555;
    cursor:pointer;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
}
.recipientPickerCtrl.labelTop .recipientsListLabel:after{
    content:attr(data-labelTop);
    display:block;
    left:0;
    background:#fff9e3;
    margin-top:-12px;
    padding:0 5px 5px 5px;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-indent:0;
}
.recipientPickerCtrl.labelTop .recipients{
    padding-left:3px;
    box-shadow:0 1px 2px rgba(0,0,0,.09);
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    margin-top:10px;
}
.recipientPickerCtrl.labelTop.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox{
    padding:2px 10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.recipientPickerCtrl.labelTop .scrollView{
    background:#e8e8e8;
    /*border-top:none;*/
}
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout{
    border-bottom:1px solid #e8e8e8;
}
.recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout{
    border-bottom:1px solid #e4e5ed;
}
.recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout:empty{
    display:none;
}
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout>.formPadding{
    padding-top:0;
}
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout>section:first-of-type .hgroup{
    border-top:1px solid #c3c3c3;
}
.recipientPickerCtrl.labelTop .inviteCircles .scrollView div:first-of-type h1{
    border-top:none;
}
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout section ~ h1{
    margin:0;
}
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout section ~ h1:first-of-type{
    border-top:1px solid #c3c3c3;
}
.recipientPickerCtrl.labelTop .scrollView h1{
    line-height:16px;
    font-size:15px;
    font-weight:normal;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    padding:20px 10px 0 10px;
    text-indent:0;
    margin:0 0 5px 0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background:#e8e8e8;
}
.recipientPickerCtrl .roleSwitcher{
    border:1px solid #c3c3c3;
    padding:3px 5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    cursor:pointer;
    padding: 7px 8px;
    font-size: 13px;
    display: inline-block;
    height: auto;
    min-height: 20px;
    line-height: 1;
    position: relative;
    top: -2px;
}
.recipientPickerCtrl .roleSwitcher:after{
    content:"";
    border:5px solid;
    border-color:#000 #fff #fff #fff;
    display:inline-block;
    margin-top: 0;
    position: relative;
    top: 4px;
    margin-left: 5px;
    opacity: 0.4;
}
.recipientPickerCtrl .actionBar h1{
    padding:4px 60px 4px 40px;
    /*border-bottom:1px solid #e4e5ed;*/
}





.recipientPickerCtrl .inviteCircles .contentInviteCircles .recipientsWrapper{
    padding:0 10px;
}
.recipientPickerCtrl .recipientsWrapper .recipients .placeHolderText{
    top:0;
    padding:8px 5px;
}
.recipientPickerCtrl .recipientsWrapper .recipients{
    height:auto;
    min-height:37px;
    max-height:none;
    padding:10px 5px 0 5px;
}



/******************************************************
*  Recipient Picker Control: Bulk Import
*******************************************************/
#inviteTeachers .recipientPickerCtrl.labelTop.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox,
#composeEmail .recipientPickerCtrl.labelTop.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox{
    padding-right:10px;
}
.Desktop #inviteTeachers .recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .actionBarCircles ul.actionButtons li.circlesBox,
.Desktop #composeEmail .recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .actionBarCircles ul.actionButtons li.circlesBox{
    padding-right:53px;
}
.recipientPickerCtrl .importBtn{
    width:43px;
    background-position:-649px -1259px;
    position:absolute;
    right:15px;
    margin-top:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-top:36px;
    font-size:10px;
    text-align:center;
    display:none;
}
.Desktop .recipientPickerCtrl .importBtn{
    display:block;
}
#inviteTeachers .formLayout textarea,
#composeEmail .formLayout textarea{
    height:388px;
    margin-top:0;
    -ms-user-select: element; /* For Select text in IE */
}
#composeEmail .formLayout textarea{
    height:auto;
    min-height: 100px;
}
#inviteTeachers .scrollView .toolTipMsg,
#composeEmail .scrollView .toolTipMsg{
    top: -15px;
}
.recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt{
    padding-top:48px;
}
.recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .circlesBox{
    padding-right:53px;
    list-style:none;
}
.recipientPickerCtrl.labelTop .bulkImpt .recipientsListLabel{
    display:none;
}
.recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .actionBar.selectGroups{
    height:48px;
}
.recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .actionBar .actionButtons{
    top:48px;
}




/******************************************************
*  Recipient Picker Control: Phone Contacts
*******************************************************/
.recipientPickerCtrl .phoneContactsBtn{
    width:43px;
    background-position:-329px -1199px;
    position:absolute;
    right:8px;
    margin-top:11px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-top:36px;
    font-size:10px;
    text-align:center;
    display:block;
}
.Desktop .recipientPickerCtrl .phoneContactsBtn{
    display:none;
}



/******************************************************
*  Recipient Picker Control: ActionBar (modeShowTabs)
*******************************************************/
.recipientPickerCtrl.modeShowTabs{
    padding-top:110px;
}
.recipientPickerCtrl .actionBar.selectGroups{
    height:110px;
}
.recipientPickerCtrl.modeNewPicker .forModeShowTabs,
.recipientPickerCtrl.modePickerSingleTabs .forModeShowTabs,
.recipientPickerCtrl.modeShowTabs .forModeShowTabs{
    display:block;
}
.recipientPickerCtrl .actionBarInput .actionButtons li{
    padding:0 75px 0 5px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType{
    background:#f2f2f2;
    border:solid #c3c3c3;
    border-width:1px 0;
    position:absolute;
    height:60px;
    bottom:-1px;
    padding:0 15px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    background:#fff;
    border:1px solid #e4e5ed;
    border-left:0;
    border-right:0;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType ul{
    display:table;
    table-layout:fixed;
    padding:0;
    height:100%;
    width:auto;
    margin:0 auto;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType li{
    display:table-cell;
    text-align:center;
    padding:0;
    width:90px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType a{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    white-space:nowrap;
    display:block;
    font-size:10px;
    color:#666;
    height:58px;
    border:none;
    padding:38px 0 0 0;
    margin:0;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .addContacts{
    background-position:-434px -1195px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .addGroups{
    background-position:-496px -1195px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .addCommunities{
    background-position:-560px -1195px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .pendingInvites{
    background-position:-624px -1195px
}



.recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addContacts{
    background-position:-434px -1135px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addGroups{
    background-position:-496px -1135px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addCommunities{
    background-position:-560px -1135px;
}
.recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .pendingInvites{
    background-position:-624px -1135px;
}



.recipientPickerCtrl .actionBar.selectGroups .sourceType .selected a{
    color:#53c8e6;
}



@media screen
and (max-width:386px){
    .recipientPickerCtrl .actionBar.selectGroups .sourceType li{
        width:70px;
    }

    .recipientPickerCtrl .actionBar.selectGroups .sourceType .addContacts{
        background-position:-444px -1195px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .addGroups{
        background-position:-506px -1195px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .addCommunities{
        background-position:-570px -1195px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .pendingInvites{
        background-position:-634px -1195px
    }



    .recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addContacts{
        background-position:-444px -1135px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addGroups{
        background-position:-506px -1135px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .addCommunities{
        background-position:-570px -1135px;
    }
    .recipientPickerCtrl .actionBar.selectGroups .sourceType .selected .pendingInvites{
        background-position:-634px -1135px;
    }
}



/***************************************************************************************
*  Recipient Picker Control: ActionBar (modeSearchResults, modeHideTabs)
****************************************************************************************/
.recipientPickerCtrl.modeHideTabs,
.recipientPickerCtrl.modeSearchResults{
    padding-top:48px;
}
.recipientPickerCtrl.modeHideTabs .actionBar.selectGroups,
.recipientPickerCtrl.modeSearchResults .actionBar.selectGroups{
    height:48px;
}
.recipientPickerCtrl.modeHideTabs .forModeShowTabs,
.recipientPickerCtrl.modeSearchResults .forModeShowTabs{
    display:block;
}
.recipientPickerCtrl.modeHideTabs .forModeShowTabs .sourceType,
.recipientPickerCtrl.modeSearchResults .forModeShowTabs .sourceType{
    display:none;
}



/***************************************************************************************
*  Recipient Picker Control: ActionBar (modeAddPeople)
****************************************************************************************/
.recipientPickerCtrl.modeAddPeople{
    padding-top:104px;
    height:105px;
}
.recipientPickerCtrl.modeAddPeople .actionBar.selectGroups{
    height:105px;
}
.recipientPickerCtrl.modeAddPeople .forModeShowTabs{
    display:block;
}
.recipientPickerCtrl.modeAddPeople .forModeShowTabs .sourceType{
    display:none;
}
.recipientPickerCtrl.modeAddPeople .actionBar .actionButtons{
    top:49px;
    background:#f2f2f2;
    border-top:1px solid #c3c3c3;
    height:54px;
}
.recipientPickerCtrl.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox{
    padding:2px 15px;
}



/***************************************************************************************
*  Recipient Picker Control: ActionBar (modeHideTabsAndRecipients & modeMainPanel)
****************************************************************************************/
.recipientPickerCtrl.modeHideTabsAndRecipients{
    padding-top:93px;
}
.recipientPickerCtrl.modeHideTabsAndRecipients.communityMembers{
    padding-top:0px;
}
.recipientPickerCtrl.modeHideTabsAndRecipients.communityMembers .searchBar{
    right:0px;
}
.recipientPickerCtrl.modeMainPanel{
    padding-top:46px;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .actionBar{
    height:95px;
}
.recipientPickerCtrl .forModeMainPanel.actionBar.selectGroups{
    height:95px;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs,
.recipientPickerCtrl.modeMainPanel nav.actionBar.forModeMainPanel{
    display:block;
    background-color:transparent;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .actionButtons,
.recipientPickerCtrl.modeMainPanel .actionButtons{
    display:block;
    width:100%;
    height:46px;
    top:48px;
    position:absolute;
    background:#f2f2f2;
    border-top:1px solid #c3c3c3;
    border-bottom:1px solid #e4e5ed;
    box-shadow:inset 0 1px 0 rgba(255,255,255,1);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:7px 15px;
    padding: 0;
    border: 0;
    box-shadow: none;
    background:transparent;
}
.recipientPickerCtrl.modeMainPanel .actionButtons{
    border-bottom:none;
}
.actionButtonsStatic{
    position: static !important;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar .searchBox:before,
.recipientPickerCtrl.modeMainPanel .searchBar .searchBox:before{
    display:none;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar .searchBox:last-of-type,
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar .searchBox div,
.recipientPickerCtrl.modeMainPanel .searchBar .searchBox:last-of-type,
.recipientPickerCtrl.modeMainPanel .searchBar .searchBox div,
.delivery-report-filter .searchBar .searchBox{
    margin:0;
    display:block;
    width:100%;
    height:100%;
    padding:0;
    border:none;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input,
.recipientPickerCtrl.modeMainPanel .searchBar input,
.delivery-report-filter .searchBar input{
    width:100%;
    height:100%;
    display:block;
    outline:none;
    border:none;
    padding:0 10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    text-align:center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background:#dedede;
    background: transparent;
    border-radius: 50px;
    text-align:left;
    padding:0 20px 0 40px;
    min-height:46px;
}

.communityManageSearchBar .searchBox, .mainPanelSearchBar .searchBox { background: #fff; border-radius: 50px; position: relative; }
.communityManageSearchBar .searchBar:before, .mainPanelSearchBar .searchBar:before {
    content: "";
    position: absolute;
    left: 15px;
    top: 14px;
    height: 13px;
    width: 13px;
    border: 2px solid #757575;
    border-radius: 50%;
    background: #fff;
    z-index:3;
}

.communityManageSearchBar .searchBar:after, .mainPanelSearchBar .searchBar:after {
    content: "";
    position:absolute;
    left: 26px;
    top: 22px;
    height: 8px;
    width: 2px;
    background:#757575;
    transform:rotate(-45deg);
    z-index:2;
}
/*
.recipientPickerCtrl.modeHideTabsAndRecipients.communityMembers .searchBar.searchBar-with-select:before, .recipientPickerCtrl.modeHideTabsAndRecipients.communityMembers .searchBar.searchBar-with-select:after { display:none; }
*/
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input::-webkit-input-placeholder,
.recipientPickerCtrl.modeMainPanel .searchBar input::-webkit-input-placeholder{
    color:#8d8d8f;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input:-moz-placeholder,
.recipientPickerCtrl.modeMainPanel .searchBar input:-moz-placeholder{
    color:#8d8d8f;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input::-moz-placeholder,
.recipientPickerCtrl.modeMainPanel .searchBar input::-moz-placeholder{
    color:#8d8d8f;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input:-ms-input-placeholder,
.recipientPickerCtrl.modeMainPanel .searchBar input:-ms-input-placeholder{
    color:#8d8d8f;
}
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar input:focus,
.recipientPickerCtrl.modeHideTabsAndRecipients .searchBar.withKeyword input,
.recipientPickerCtrl.modeMainPanel .searchBar input:focus,
.recipientPickerCtrl.modeMainPanel .searchBar.withKeyword input{
    text-align:left;
    background:#fff;
    color:#8d8d8f;
}



/**********************************************************
*  Recipient Picker Control: ActionBar (noSearch)
***********************************************************/
.recipientPickerCtrl.modeHideTabsAndRecipients.noSearch{
    padding-top:47px;
}
.recipientPickerCtrl.modeHideTabsAndRecipients.noSearch .forModeHideTabs{
    height:auto;
}
.recipientPickerCtrl.modeHideTabsAndRecipients.noSearch .forModeHideTabs .searchBar{
    display:none;
}
.recipientPickerCtrl.modeMainPanel.noSearch .searchBar{
    display:none;
}
.recipientPickerCtrl.modeMainPanel.noSearch .forModeMainPanel.actionBar.selectGroups{
    height:107px;
}
.recipientPickerCtrl.modeMainPanel.noSearch{
    padding-top:59px;
}



/**********************************************************
*  Recipient Picker Control: ActionBar (noTabs)
***********************************************************/
.recipientPickerCtrl.modeMainPanel.noTabs{
    padding-top:46px;
}
.recipientPickerCtrl.modeMainPanel.noTabs .actionBar.selectGroups .sourceType{
    display:none;
}
.recipientPickerCtrl.modeMainPanel.noTabs .forModeMainPanel.actionBar.selectGroups{
    height:95px;
}


/*************************************************
*  Recipient Picker Control: Body
*************************************************/
/*
.recipientPickerCtrl .recipients>span>span{
    display:inline-block;
    margin:0px 2px 0px 0;
    max-width:80%;
    height:20px;
    min-height:20px;
}
.recipientPickerCtrl .recipients>span>span>span{
    display:block;
    margin:0 0 -9px 0 !important;
    padding:0 1px;
    height:20px;
    line-height:20px;
    max-width:none;
    min-height:0;
    background:none;
    border:1px solid #fff;
    color:#000;
    overflow-y:hidden;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.recipientPickerCtrl .recipients>span>span>span:after{
    content: ",";
}
.recipientPickerCtrl .recipients>span.selected>span>span,
.recipientPickerCtrl .recipients>span>span>span.selected{
    color:#0099d4 !important;
    background:transparent;
    border:1px solid transparent;
}

.recipientPickerCtrl .recipients>span.selected>span>span:after,
.recipientPickerCtrl .recipients>span>span>span.selected:after{
    padding-left:16px;
    background-position:-660px -611px;
    background-image:url(../images/sprite@2x.png?20180516);
    background-size:703px 1665px;
}*/

.recipientPickerCtrl .inviteCircles .formLayout .circles h3{
    text-indent:-9999px;
    margin-top:10px;
}
.recipientPickerCtrl .inviteCircles .formLayout .circles h3.important{
    color:#e86c6c;
}
.recipientPickerCtrl .inviteCircles .formLayout .circles.multiline h3{
    text-indent: 108px;
    text-indent: 42px;
    margin-bottom: -22px;
    margin-top: 20px !important;
}

.recipientPickerCtrl .inviteCircles .formLayout .circles.multiline.wordwrap h3{
    padding:15px 20px 20px 71px;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    white-space:normal;
    line-height:18px;
    text-indent:0 !important;
}
.recipientPickerCtrl .inviteCircles .formLayout .circles.multiline.wordwrap .hgroup:after{
    display:none;
}


.recipientPickerCtrl .inviteCircles .formLayout .circles.multiline.noselect  h3{
    text-indent: 76px;
    text-indent: 17px;
}
.recipientPickerCtrl .circles button.circle{
    margin-bottom:0;
}
.recipientPickerCtrl .circles.multiline button.circle .circleName:after{
    top:2px;
}
.recipientPickerCtrl .circles button.circle .circleName:after{
    top:-6px;
}
.recipientPickerCtrl .displayingPendingTab .circles button.circle .circleName:after{
    top:1px;
}
.recipientPickerCtrl .displayingPendingTab section.circleRequests article h3{
    margin-left:0;
}
.recipientPickerCtrl .formLayout .circles.multiline h2 button.circle .circleName {
    top: 10px;
}
.recipientPickerCtrl .formLayout .circles h2 button.circle .circleName{
    top:18px;
}
.recipientPickerCtrl .inviteCircles .peopleListing .formLayout section .hgroup button.circle,
.recipientPickerCtrl .circles button.circle:before{
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
.recipientPickerCtrl .peopleListing .formLayout section .hgroup button{
    right:12px;
    top:14px;
    z-index:2;
}
.recipientPickerCtrl .inviteCircles .peopleListing .formLayout section .hgroup:after{
    width:140px;
}
.recipientPickerCtrl .inviteCircles .peopleListing.peopleCheckBox .formLayout section .hgroup:after{
    width:1px;
}
.recipientPickerCtrl .inviteCircles .peopleListing .listHeader button{
    padding:11px 10px 0 40px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:19px;
    padding-left:35px;
    white-space:nowrap;
}
.recipientPickerCtrl .inviteCircles .peopleListing .listHeader button:before{
    left:-11px;
}
.recipientPickerCtrl .inviteCircles .peopleListing .formLayout section .noIcon .hgroup button.circle,
.recipientPickerCtrl .noIcon.circles button.circle:before,
.recipientPickerCtrl .noIcon.circles button.circle .circleName:after{
    display:none;
}
.recipientPickerCtrl .noIcon.circles button.circle{
    background:none !important;
    width:0;
    padding:0;
}
.recipientPickerCtrl .inviteCircles .formLayout .noIcon.circles h2 button.circle .circleName{
    text-indent:0;
}
.recipientPickerCtrl .highlightContact{
    background:#f4fcff;
    border-bottom:1px solid #dae4e7;
}
.recipientPickerCtrl .peopleListing .formLayout section.highlightContact .hgroup:after{
    background: -moz-linear-gradient(left,  rgba(244,252,255,0.01) 0%, rgba(244,252,255,1) 18%, rgba(244,252,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(2244,252,255,0.01)), color-stop(18%,rgba(244,252,255,1)), color-stop(100%,rgba(244,252,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(244,252,255,0.01) 0%,rgba(244,252,255,1) 18%,rgba(244,252,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(244,252,255,0.01) 0%,rgba(244,252,255,1) 18%,rgba(244,252,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(244,252,255,0.01) 0%,rgba(244,252,255,1) 18%,rgba(244,252,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(244,252,255,0.01) 0%,rgba(244,252,255,1) 18%,rgba(244,252,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}
.recipientPickerCtrl .peopleListing .profileM:after{
    margin-top:-15px;
    vertical-align:middle;
    text-indent: 57px;
}
.recipientPickerCtrl .peopleListing .profileM img{
    vertical-align:middle;
}
.recipientPickerCtrl .inviteCircles .contentInviteCircles .formLayout{
    padding-bottom:0;
}
.recipientPickerCtrl .inviteCircles .contentInviteCircles .formLayout.fullWidthBtn{
    padding-bottom:15px;
}
.recipientPickerCtrl .loadMoreLink{
    display:block;
    line-height:71px;
    height:71px;
    width:100%;
    border-bottom:1px solid #e4e5ed;
    padding:0 10px 0 24px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:19px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
}
.recipientPickerCtrl .verifiedParentBadge{
    top:0;
    right:0;
}
.recipientPickerCtrl .peopleListing .hgroup h3 + h3{
    margin-top:-30px;
    margin-bottom:-10px;
    margin-top: 15px !important;
    margin-bottom: -10px;
    padding-left: 69px;
    padding-left: 62px;
}
.recipientPickerCtrl .recipientPickerContactsLabel {
    color: #53c8e6;
    cursor: pointer;
    position: absolute;
    right: 15px;
    z-index: 10000;
    /*margin-top: 6px;*/
}
#recipientPicker .recipientPickerCtrl .recipientPickerContactsLabel {
    display: block;
    /*padding: 10px;*/
    text-align: right;
    /*border-bottom: 1px solid #e4e5ed;
    position: static;*/
    color: #53c8e6;
    /*padding-top:0;
    padding-bottom:0;*/
    margin-top:5px;
    margin-right: 20px;
}

/*************************************************
*  Recipient Picker Control: Profile with Family
*************************************************/
.recipientPickerCtrl .peopleListing .profileWithChildren .hgroup{
    min-height:78px;
}
.recipientPickerCtrl .peopleListing .profileWithChildren h2{
    text-indent:0;
    padding-top:0;
}
.recipientPickerCtrl .peopleListing .profileWithChildren h3{
    text-indent:114px;
    margin-top:-60px;
}
.recipientPickerCtrl .peopleListing .profileWithChildren h3 + h3{
    margin-top:-29px;
    margin-bottom:5px;
}
.recipientPickerCtrl .peopleListing .profileWithChildren .contactsChildren{
    background:#fff;
    display:block;
    padding:0 15px 0 0;
    position:relative;
    overflow:visible;
    z-index:2;
    margin:-14px 0 0 115px;
}
.recipientPickerCtrl .peopleListing .profileWithChildren .contactsChildren .profileS{
    display:block;
    float:left;
    margin:0 4px 4px 0;
}
.recipientPickerCtrl .peopleListing .formLayout section.profileWithChildren .hgroup:after{
    display:none;
}
.recipientPickerCtrl .profileWithChildren .profileL{
    overflow:visible;
    color:#000;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    padding-left:44px;
}
.recipientPickerCtrl .profileWithChildren .profileL img{
    vertical-align:top;
}

.recipientPickerCtrl .peopleCheckBox .formLayout section.profileWithChildren .hgroup button.addToMsg,
.recipientPickerCtrl .peopleCheckBox .formLayout section.profileWithChildren .hgroup button.removeFromMsg{
    top:38px;
}



/*******************************************************
*  Recipient Picker Control: Profile With Invite Button
*******************************************************/
.recipientPickerCtrl .peopleListing.peopleCheckBox .formLayout section .hgroup button.addContact{
    width: 20px;
    height: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: 2px solid #ccc;
    background: #fff;
    padding:0;
    top:24px;
}
.recipientPickerCtrl .peopleListing.peopleCheckBox .formLayout section .hgroup button.removeContact{
    width: 20px;
    height: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    border: 2px solid #53c8e6;
    background: #fff;
    padding:0;
    top:24px;
    background-position: -212px -852px;
}
.recipientPickerCtrl .peopleListing.peopleCheckBox .formLayout section .hgroup button.removeContact:after{
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    top: -2px;
    left: -2px;
    background-position: -212px -852px;
}



/*************************************************
*  Recipient Picker Control: Connection Requests
*************************************************/
.recipientPickerCtrl .contentInviteCircles .pendingInvitations .friendRequests,
.recipientPickerCtrl .contentInviteCircles .pendingInvitations .circleRequests{
    padding-bottom: 30px;
}
.recipientPickerCtrl .peopleListing .friendRequests,
.recipientPickerCtrl .peopleListing .circleRequests{
    background:#e8e8e8;
    margin:-6px 0 0 0;
    padding:15px 12px 3px 12px;
}
.recipientPickerCtrl .peopleListing .friendRequests .profileM,
.recipientPickerCtrl .peopleListing .circleRequests .profileM,
.recipientPickerCtrl.browseOnly .peopleListing .friendRequests .profileM,
.recipientPickerCtrl.browseOnly .peopleListing .circleRequests .profileM{
    margin:0;
}
.recipientPickerCtrl .peopleListing .friendRequests .inviteRequest .hgroup{
    padding-left:0;
}
.recipientPickerCtrl .peopleListing .circleRequests .inviteRequest .hgroup{
    padding-left:0;
    margin:-25px 0 47px 0;
}
.recipientPickerCtrl .peopleListing .circleRequests .hgroup h2{
    margin-bottom:-5px;
}
.recipientPickerCtrl .peopleListing .friendRequests .hgroup h3,
.recipientPickerCtrl .peopleListing .circleRequests .hgroup h3,
.recipientPickerCtrl.browseOnly .peopleListing .friendRequests .hgroup h3,
.recipientPickerCtrl.browseOnly .peopleListing .circleRequests .hgroup h3{
    margin:-21px 0 -15px 0;
    text-indent:60px;
}
.recipientPickerCtrl .peopleListing .friendRequests .hgroup h3 span,
.recipientPickerCtrl .peopleListing .circleRequests .hgroup h3 span{
    text-indent:0;
}
.recipientPickerCtrl .peopleListing .circleRequests button.circle .circleName:after{
    top:0px;
}



/*********************************************************
*  Recipient Picker Control: Add from external sources
*********************************************************/
.recipientPickerCtrl .externalSource{
    display:block;
    line-height:71px;
    height:71px;
    width:100%;
    border-bottom:1px solid #e4e5ed;
    padding:0 10px 0 24px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:19px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
}
.recipientPickerCtrl .externalSource:before{
    content:"";
    display:inline-block;
    width:36px;
    height:36px;
    vertical-align:middle;
    margin:-2px 10px 0 -8px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    background-color:#c5c5c5;
}
.recipientPickerCtrl .externalSource.sourcePhone:before{
    background-position:-141px -901px;
    background-color:#cba15c;
}
.recipientPickerCtrl .externalSource.sourceFb:before{
    background-position:-78px -901px;
    background-color:#465fa4;
}
.recipientPickerCtrl .externalSource:after{
    content:"";
    display:block;
    position:absolute;
    right:12px;
    top:20px;
    width:30px;
    height:30px;
    background-position:-145px -1325px;
}



/******************************************************
*  Recipient Picker Control: If org has logo
*******************************************************/
.recipientPickerCtrl .circles button.hasLogo .circleName:after{
    display:none;
}

.recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo{
    background-position:0;
    background-repeat:no-repeat;
    background-size:cover;
    border:none;
    height:48px;
    width:48px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}
.recipientPickerCtrl .circles button.circle.hasLogo:before{
    background:rgba(0,0,0,.04);
    border:none;
}
.recipientPickerCtrl .circles button.circle.hasLogo.addChild:before,
.add-new-profile:after{
    display:block;
    background-position:-451px -1011px;
    background-color:#f2f2f2;
    width:56px;
    height:56px;
    border:none;
}
.recipientPickerCtrl .circles button.circle.hasLogo .count{
    top:-4px;
    right:-4px;
}
.recipientPickerCtrl .circles button.circle.hasLogo.addChild{
    background:#fff
}
.recipientPickerCtrl .inviteToTryBloomz button.circle.hasLogo:before {
    background-position:-451px -1011px;
}
.recipientPickerCtrl .inviteCircles .peopleListing .formLayout .inviteToTryBloomz section .hgroup:after{
    display:none;
}
.recipientPickerCtrl .inviteToTryBloomz h3{
    white-space:normal;
    text-indent:0 !important;
    line-height:1.25;
    padding:14px 10px 20px 75px;
}



/******************************************************
*  Recipient Picker Control: Messages Tab
*******************************************************/
.recipientPickerCtrl.chatWindow.modeShowTabs,
.recipientPickerCtrl.chatWindow.modeSearchResults{
    padding-bottom:0;
}
.recipientPickerCtrl.chatWindow .recipients{
    padding-bottom:2px;
    border:0;
}
.recipientPickerCtrl.chatWindow.modeShowTabs .chatInput,
.recipientPickerCtrl.chatWindow.modeSearchResults .chatInput{
    display:block;
}
.recipientPickerCtrl.chatWindow.modeShowTabs .actionBarInput .actionButtons li,
.recipientPickerCtrl.chatWindow.modeSearchResults .actionBarInput .actionButtons li{
    padding:0 75px 0 5px;
}
.recipientPickerCtrl.chatWindow.modeShowTabs .actionBarInput .nextButton,
.recipientPickerCtrl.chatWindow.modeSearchResults .actionBarInput .nextButton{
    text-indent:0;
    background:none;
    width:auto;
    padding:0 15px 0 10px;
}
.recipientPickerCtrl.chatWindow.modeShowTabs .scrollView,
.recipientPickerCtrl.chatWindow.modeSearchResults .scrollView{
    background:#fff;
}




/******************************************************
*  Recipient Picker Control: Browse Only Mode
*******************************************************/
.recipientPickerCtrl.browseOnly .inviteCircles .peopleListing .listHeader button:before,
.recipientPickerCtrl.browseOnly .addToMsg,
.recipientPickerCtrl.browseOnly .removeFromMsg{
    display:none;
}
.recipientPickerCtrl.browseOnly .inviteCircles .peopleListing .listHeader button{
    padding-left:25px;
}
.recipientPickerCtrl.browseOnly .inviteCircles .circles .circle{
    margin:0;
}
.recipientPickerCtrl.browseOnly .peopleCheckBox .profileM{
    margin-left:12px;
}
.recipientPickerCtrl.browseOnly .peopleCheckBox .hgroup h3{
    text-indent:77px;
}
.recipientPickerCtrl.browseOnly .inviteCircles .formLayout .circles h3{
    text-indent:75px;
}
.recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren h3{
    text-indent:85px
}
.recipientPickerCtrl.browseOnly .profileWithChildren .profileL{
    padding-left:15px;
}
.recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren .contactsChildren{
    margin-left:85px;
}
.recipientPickerCtrl.browseOnly .inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers{
    background:transparent;
    width:100%;
}
.recipientPickerCtrl.browseOnly .inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:after{
    position:absolute;
    right:10px;
    margin-top:-35px;
}



/*************************************************
*  Recipient Picker: FRE Community Picker
*************************************************/
#_freCommunityPicker .recipientPickerCtrl{
    padding-top:48px;
}
#_freCommunityPicker h2.createCircleOption,
#_freCommunityPicker h2.createClassOption,
#_freCommunityPicker h2.createCommunityOption,
#_freCommunityPicker h2.createCircleOption{
    font-size:17px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:10px 20px 20px 20px;
    line-height:24px;
}
#_freCommunityPicker .contactList .listHeader{
    padding:0;
}
#_freCommunityPicker .contactList .listHeader label{
    text-align:left;
}



/*************************************************
*  Recipient Picker:  Search Results popup
*************************************************/
div.searchResultsOverlay{
    width:90%;
    margin:10px 0 0 -45%;
    position:absolute;
    max-height:226px;
    overflow:auto;
    box-shadow:0 1px 8px rgba(0,0,0,.3);
    left:50%;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid rgba(0,0,0,.2);
    -webkit-transform: translate3d(0,0,0);
}
div.searchResultsOverlay:empty{
    display:none;
}
div.searchResultsOverlay>section:last-of-type{
    border-bottom:none;
}



/*************************************************
*  Phone Contacts: Empty Panel Message
*************************************************/
#noPhoneContacts .emptyPanelMsg{
    padding:44px 15px 27px 15px !important;
    margin-top:18px;
    width:100%;
}
#noPhoneContacts .emptyPanelMsg h2{
    font-size: 21px;
    line-height: 31px;
    font-family: 'Gotham',Verdana,"HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,sans-serif;
    text-indent: 0;
    color:#000;
}
#noPhoneContacts .emptyPanelMsg h2 + p{
    margin-top:0;
    color:#000;
}



/*************************************************
*  Phone Contacts: No Access
*************************************************/
#noPhoneContactsAccess .scrollView h1{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:21px;
    text-align:center;
    max-width:260px;
    margin:25px auto 30px auto;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg{
    background:#fff;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    padding:30px 25px 88px 25px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    max-width:270px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg h2{
    max-width:178px;
    margin:0 auto;
    font-size:15px;
    color:#000;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg h2:first-of-type:before{
    content:"1) ";
    position:absolute;
    margin-left:-20px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg h2:last-of-type:before{
    content:"2) ";
    position:absolute;
    margin-left:-20px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg p{
    max-width:178px;
    margin:0 auto;
    position:relative;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts.step1 span{
    font-size:10px;
    color:#000;
    padding-top:44px;
    margin:6px 20px 35px 0;
    display:inline-block;
    width:44px;
    text-align:center;
    position:relative;
}
.enablePhoneContacts.step1 span.settings{
    background-position:-202px -780px;
}
.enablePhoneContacts.step1 span.privacy{
    background-position:-266px -780px;
}
.enablePhoneContacts.step1 span.contacts{
    background-position:-330px -780px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts.step1 span:last-of-type{
    margin-right:0;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts.step1 span:before{
    content:"";
    width:20px;
    height:20px;
    display:block;
    position:absolute;
    top:12px;
    right:-21px;
    background-position:-150px -1330px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts.step1 span:last-of-type:before{
    display:none;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .accessSwitch{
    display:block;
    line-height:44px;
    height:44px;
    border:solid #c8c7cc;
    border-width:1px 0px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .accessSwitch{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:18px;
    color:#000;
    position:relative;
    margin-top:6px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .accessSwitch:before{
    content:"";
    width:29px;
    height:43px;
    display:inline-block;
    vertical-align:middle;
    margin-right:16px;
    background-position:-527px -7px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .accessSwitch:after{
    content:"";
    width:58px;
    height:43px;
    display:block;
    background-position:-1px -1318px;
    position:absolute;
    top:0;
    right:0;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .switchTip{
    width:74px;
    color:#10994f;
    font-family:'firetoRain';
    font-size:15px;
    display:block;
    position:absolute;
    top:70px;
    right:-35px;
}
#noPhoneContactsAccess .scrollView .emptyPanelMsg .enablePhoneContacts .switchTip:before{
    content:"";
    width:19px;
    height:22px;
    display:block;
    margin-left: -20px;
    margin-top: -13px;
    position:absolute;
    background-position:-157px -48px;
}



/*************************************************
*  Contact List: Invite Circles
*************************************************/
.shadowBox .inviteCircles,
.inlineBox .inviteCircles{
    padding-top:0;
}
.inviteCircles .actionBarInput{
    display:block;
    overflow-y:visible;
}
.inviteCircles .contentInviteCircles{
    border-bottom:none;
}
.inviteCircles .contentInviteCircles .formLayout{
    padding-bottom:17px;
}
.inviteCircles .contentInviteCircles .formLayout section{
    padding:0;
}
.inviteCircles .contentInviteCircles .formLayout .emptyPanelMsg{
    max-width:320px;
}
.inviteCircles .contentInviteCircles .formLayout .emptyPanelMsg>section{
    border-bottom:none;
    padding-top:30px;
    background:#e8e8e8;
    color:#8e8e8e;
}
.inviteCircles .contentInviteCircles .formLayout .emptyPanelMsg>section p{
    margin:0;
}
.inviteCircles .contentInviteCircles h1{
    font-size:17px;
    margin:26px 8px 3px 8px;
}
.inviteCircles .contentInviteCircles div:first-of-type h1{
    padding-top:21px;
    border-top:1px solid #e4e5ed;
    margin:0px 8px 3px 0;
    padding-left:0;
}
.inviteCircles .contentInviteCircles{
    padding-left:0;
}
.inviteCircles .contentInviteCircles .formLayout section.horizontalList{
    border:none;
    box-shadow:none;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.inviteCircles .peopleListing .groupedListing .horizontalList .hgroup:first-of-type h2,
.inviteCircles .peopleListing .groupedListing .verticalList .hgroup:first-of-type h2{
    margin-top:4px;
    text-indent:44px;
}
.inviteCircles footer.circles{
    display:none;
}
.inviteCircles .peopleListing .formLayout section .hgroup h2 button{
    left:0;
    top:25px;
}
.inviteCircles .peopleListing .formLayout section .hgroup:first-of-type h2 button{
    top:8px;
}
.inviteCircles .peopleListing .groupedListing .verticalList .hgroup .profileM{
    margin-left:30px;
}
.inviteCircles .peopleListing .groupedListing .verticalList .hgroup h3{
    text-indent:91px;
}
.inviteCircles .peopleListing .formLayout section .hgroup:after{
    width:70px;
    right:-50px;
}
.inviteCircles .peopleListing .formLayout section.circles .hgroup:after{
    right:5px;
}
.inviteCircles .peopleListing section.listHeader{
    text-align:left;
    padding:4px 0 15px 0px;
    line-height:0;
    border-bottom:1px solid #e4e5ed;
}
.inviteCircles .peopleListing .listHeader button{
    display:inline-block;
    background:none;
    border:none;
    color:#000;
    text-shadow:none;
    font-size:18px;
    text-align:left;
    padding:14px 10px 5px 40px;
    margin:0;
    width:100%;
}
.inviteCircles .peopleListing .listHeader button:before{
    content:"";
    display:inline-block;
    margin-right:5px;
    width:16px;
    height:16px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    padding:0;
    border:2px solid #ccc;
    position:relative;
    top:4px;
    left:-16px;
}
.inviteCircles .peopleListing .listHeader button.removeFromMsg:before{
    border-color:#53c8e6;
    background-position:-214px -854px;
}



/*************************************************
*  Invite Circles: Hide Circle Picker
*************************************************/
.hideCirclePicker ~ div.peopleListing{
    padding-left:0;
}
.hideCirclePicker .headerBloomz{
    margin-left:0 !important;
}
.hideCirclePicker ~ footer.circles{
    display:none !important;
}



/*************************************************
*  Invite Circles: Search Results
*************************************************/
.inviteCirclesSearch .contentInviteCircles{
    display:none;
}
.inviteCirclesSearch .contentSearchResults{
    display:block;
    padding-left:0;
}
.inviteCircles .peopleListing .formLayout section .hgroup{
    display:block;
    overflow:hidden;
    padding:6px 15px 11px 0;
    min-height:47px;
}
.inviteCircles .peopleListing .formLayout section.horizontalList{
    margin-bottom:0;
    height:auto;
}
.inviteCircles .peopleListing .formLayout section.horizontalList>section.groupListing{
    padding-left:50px;
    border-top:1px solid #e4e5ed;
    border-bottom:none;
}
.inviteCircles .peopleListing .formLayout section.horizontalList .hgroup{
    margin:0;
    padding:3px 0 0 0;
    top:0;
    min-height:68px;
}
.inviteCircles .peopleListing .formLayout section.verticalList div.hgroup h3{
    margin:0;
}
.inviteCircles .peopleListing .formLayout section .hgroup:after{
    width:70px;
    right:-55px;
    top:0;
    z-index:1;
}
.inviteCircles .peopleCheckBox .formLayout section .hgroup:first-of-type button{
    left:12px;
}
.inviteCircles .peopleListing .formLayout section .hgroup button.circle{
    width:56px;
    height:56px;
    padding:0;
    border:none;
    -moz-border-radius:24px;
    -webkit-border-radius:24px;
    border-radius:24px;
}
.inviteCircles .circles .circle:not(.removeLeftMargin){
    margin-left:33px;
    margin-left:26px;
}
.inviteCircles .formLayout .circles h2{
    margin-top:0;
}
.inviteCircles .formLayout .circles h3{
    text-indent:102px;
    margin-top:21px;
}
.inviteCircles .formLayout .circles h2 button.circle .circleName{
    text-indent:68px;
}
.inviteCircles .peopleListing .formLayout section.circles{
    padding:0;
}
.inviteCircles .peopleListing .formLayout section .hgroup button .count{
    text-indent:0;
    display:none;
}
.inviteCircles .peopleCheckBox .formLayout section .hgroup button.addToMsg,
.inviteCircles .peopleCheckBox .formLayout section .hgroup button.removeFromMsg{
    top:24px;
}
.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers{
    top:0;
    left:auto;
    right:0;
    width:56px;
    height:100%;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border-width:0 0 0 1px;
    border-color:#f1f1f1;
    z-index:2;
}
.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:active{
    background:#f1f1f1;
    border-color:#e4e5ed;
}
.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:after{
    content:"";
    width:30px;
    height:30px;
    display:block;
    margin-top:-40px;
    margin-left:1px;
    background-position:-145px -1325px;
}




/*************************************************
*  Contact List: Community Picker
*************************************************/
.inviteCircles .peopleListing .formLayout .circles.communities button.circle .count{
    display:none;
}
.inviteCircles .peopleListing .formLayout section.communities .hgroup button.circle,
.inviteCircles .peopleListing .formLayout .circles.communities button.circle:before{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}
.inviteCircles .peopleListing .formLayout .circles.communities h3{
    text-indent:-9999px;
}
.inviteCircles .peopleListing .formLayout .circles.communities h2 button.circle .circleName{
    line-height:35px;
}
.inviteCircles .peopleListing .formLayout .circles.communities .hgroup button.seeMembers{
    display:none;
}
.inviteCircles .peopleListing .formLayout .circles.communities .hgroup:after{
    display:none;
}
.inviteCircles .peopleListing .formLayout .circles.communities button.circle .circleName:after{
    background-position:-33px 0;
}



/*************************************************
*  Contact List: Circle Picker
*************************************************/
.contactList footer.circles{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:64px;
    left:0px;
    top:0px;
    height:100%;
    position:absolute;
    background:#fff;
    border-right:1px solid #c3c3c3;
    overflow-y:hidden;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    padding:0;
    text-align:left;
}
.iPhone .contactList footer.circles,
.iPad .contactList footer.circles{
    overflow-x:auto;
}
.Android .contactList footer.circles,
.WindowsPhone .contactList footer.circles{
    overflow-y:auto;
}
.contactList footer.circles::-webkit-scrollbar{
    width: 4px;  /* for vertical scrollbars */
}
.contactList footer.circles::-webkit-scrollbar-track{
    background: #f5f5f5;
}
.contactList footer.circles::-webkit-scrollbar-thumb{
    background: rgba(0, 0, 0, 0.18);
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.contactList footer.circles:hover{
    overflow-x:hidden;
    overflow-y:scroll;
}
.contactList footer.circles>:first-child{
    margin-top:75px;
}
.contactList footer.circles .circle.selected:after{
    content:"";
    position:absolute;
    width:4px;
    height:48px;
    height:48px;
    background:#42bfe8;
    left:-8px;
    top:0px;
}
.contactList footer.circles .circle.selected .circleName{
    color:#53c8e6;
}
.contactList footer.circles .circle .circleName:after{
    top:-39px;
}



/*************************************************
*  Circles Icon
*************************************************/
.circles button.circle{
    overflow:visible;
    width:45px;
    height:47px;
    border:none;
    -moz-border-radius:24px;
    -webkit-border-radius:24px;
    border-radius:24px;
    margin-left:9px;
    margin-bottom:33px;
    text-indent:0px;
    padding-left:2px;
    position:relative;
    font-size:10px;
    background-color:#f2f2f2 !important;
    cursor:pointer;
}
.circles button.circle .circleName{
    width:100%;
    position:absolute;
    top:47px;
    line-height:1;
    left:0;
    text-overflow:ellipsis;
    display:block;
}
.circles button.circle .count{
    position:absolute;
    top:-2px;
    right:-2px;
    display:block;
    background:#fff;
    min-width:14px;
    min-height:18px;
    line-height:18px;
    border:1px solid #d3d3d3;
    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
    padding:0 2px;
    width:20px;
    height:20px;
}
.circles button.circle .count:empty{
    display:none;
}
.circles button.circle:before{
    content:"";
    width:48px;
    height:48px;
    border:none;
    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
    display:block;
}
.circles button.circle .circleName:after{
    content:"";
    width:32px;
    height:32px;
    display:block;
    left:12px;
    top:2px;
    position:absolute;
}
.circles .inviteRequest button.circle .circleName:after{
    left:7px;
}
.circles button.createCircle{
    background:#fff;
    width:44px;
    height:46px;
}
.circles button.createCircle:before{
    border:2px dashed #cecece;
    background:#fff;
    width:38px;
    height:38px;
}
footer.circles button.createCircle span.circleName{
    word-spacing:9999px;
}
.circles button.createCircle span.circleName:after{
    background-position:-463px -1024px;
}
div.circles button.tempCircle{
    width:45px;
    height:47px;
}
div .circles button.tempCircle:before{
    border-style:dashed;
    border-width:2px;
    width:38px;
    height:38px;
    opacity:.5;
    filter:alpha(opacity=50);
}



/*************************************************
*  Circles: Listing Page
*************************************************/
.circlesTab .circleCardsListing article{
    padding:0;
    margin-bottom:15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.circlesTab .inviteCircles .peopleListing .formLayout section.circles{
    padding-left:15px;
}
.circlesTab .inviteCircles .peopleListing .formLayout.resultsListing section .hgroup button.seeMembers{
    border-color:transparent;
}
.circlesTab .circleCardsListing article:after{
    height:41px;
}
.circlesTab .circleCardsListing article h2{
    height:33px;
}
.circlesTab .circleCardsListing article h3{
    display:none;
}
.circlesTab .circleCardsListing article button.circle,
.circlesTab .formLayout .circleCardsListing button.circle{
    background:none;
    border:none;
    top:0;
    width:100%;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    margin:0;
    left:0;
    text-align:left;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.circlesTab .circleCardsListing article button.circle:before,
.circlesTab .formLayout .circleCardsListing button.circle:before{
    background:none;
    border:none;
    height:auto;
}
.circlesTab .circleCardsListing article button.circle .circleName,
.circlesTab .formLayout .circleCardsListing button.circle .circleName{
    top:15px;
    text-indent:35px;
    line-height:20px;
    display:inline-block;
    width:auto;
    position:relative;
    top:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    vertical-align:top;
}
.circlesTab .circleCardsListing button.circle .circleName:after{
    margin-top:-1px;
    margin-left:-5px;
}
.circlesTab .circleCardsListing button.circle .count{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#000;
    position:relative;
    background:none;
    border:none;
    display:inline-block;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    font-size:19px;
    top:8px;
    margin-left:0px;
}
.circlesTab .circleCardsListing button.circle .count:before{
    content:"(";
}
.circlesTab .circleCardsListing button.circle .count:after{
    content:")";
}
.circlesTab .circleCardsListing article .horizontalList{
    text-indent:0;
    padding-left:10px;
    margin-bottom:0px;
    min-height:8px;
}
.circlesTab .circleCardsListing article .groupListing{
    margin:0;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
    position:relative;
    box-shadow:inset 0px 2px 3px rgba(0, 0, 0, .08);
}
.circlesTab .circleCardsListing article .groupListing:before{
    content:"";
    display:block;
    height:10px;
    width:100%;
    position:absolute;
    margin-top:-10px;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
    z-index:1;
}
.circlesTab .circleCardsListing article .groupListing a{
    position:relative;
    overflow:visible;
    display:block;
    height:40px;
    line-height:40px;
    text-indent:15px;
    background:#fefaf1;
    font-size:15px;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    border-bottom-right-radius:4px;
    border-top:1px solid #ede9e1;
    border-left:2px solid #fefaf1;
    border-right:2px solid #fefaf1;
}
.circlesTab .circleCardsListing article .groupListing a:after{
    content:"";
    height:40px;
    width:10px;
    background-position:-156px -1321px;
    position:absolute;
    right:12px;
}
.circlesTab .circleCardsListing article .groupListing + footer.feedbackControl{
    background:transparent;
}
.circlesTab .circleCardsListing article footer.feedbackControl{
    top:0px;
    position:relative;
}
.circlesTab .contentInviteCircles .contentArea{
    padding-bottom:0;
    margin-bottom:-20px;
}
.circlesTab .contentInviteCircles .circleRequests,
.circlesTab .contentInviteCircles .friendRequests{
    padding:1px 15px 0 15px;
    margin-bottom:-20px;
}
.circlesTab .pendingInvitations h1{
    border-top:none !important;
    padding-top:0 !important;
    text-indent:0 !important;
}
.circlesTab .pendingInvitations>section{
    margin-top:0 !important;
    margin-bottom:0 !important;
    padding:24px 15px 0 15px !important;
}
.circlesTab .pendingInvitations>section:first-of-type h1{
    padding-top:10px !important;
}
.circlesTab .pendingInvitations>section:last-of-type{
    margin-bottom:24px !important;
}
.circlesTab .pendingInvitations .welcomeMember h3{
    text-indent:0;
    margin-top:-26px;
}
.circlesTab .pendingInvitations .welcomeMember h3 span{
    text-indent:3px;
}
.circlesTab .pendingInvitations .welcomeMember .connectionPhoto{
    padding-top:26px;
}



.circles article{
    border-top:1px solid #fff;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
}
.circles article:first-of-type{
    border-top:1px solid #fff;
    -moz-border-radius-topleft:5px;
    -webkit-border-radius-topleft:5px;
    border-top-left-radius:5px;
    -moz-border-radius-topright:5px;
    -webkit-border-radius-topright:5px;
    border-top-right-radius:5px;
}
.circles article:last-of-type{
    -moz-border-radius-bottomleft:5px;
    -webkit-border-radius-bottomleft:5px;
    border-bottom-left-radius:5px;
    -moz-border-radius-bottomright:5px;
    -webkit-border-radius-bottomright:5px;
    border-bottom-right-radius:5px;
}
.formLayout .circles{
    text-indent:0;
}
.circles article button.circle,
.formLayout .circles button.circle{
    position:absolute;
    padding:2px 30px 3px 2px;
    color:#666;
    text-shadow:none;
    left:50px;
    top:15px;
}
.circles article button.circle .circleName,
.circles .calendarInvite .postBody h2 button.circle .circleName,
.formLayout .circles h2 button.circle .circleName{
    position:absolute;
    top:7px;
    width:285px;
    font-size:15px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:56px;
    text-align:left;
    color:#000;
    height:35px;
    overflow:hidden;
    white-space:nowrap;
}
.circles.circleCardsListing article button.circle .circleName{
    line-height:35px;
}
.circles article h3{
    text-indent:0px;
    margin-top:7px;
    display:inline-block;
    margin-left:10px;
}
.formLayout section.circles .inputGroupV:first-child label{
    text-indent:0;
}
.formLayout .circles h3{
    text-indent:45px;
    margin-top:17px;
    display:inline-block;
    margin-left:10px;
}
.circles article .horizontalList{
    text-indent:60px;
}
.circles article .horizontalList h2{
    margin-top:22px;
    text-indent:0;
    height:inherit;
}
.circles article .horizontalList{
    height:auto;
}
.circles article .horizontalList .hgroup{
    display:inline-block;
    position:relative;
    width:auto;
    height:auto;
    padding:0;
    margin-top:-10px;
    margin-right:2px;
    overflow:visible;
}
.circles article .horizontalList .hgroup .profileM{
    overflow:hidden;
    position:static;
    margin-bottom:10px;
    border:1px solid #fff;
}
.circles article .horizontalList .hgroup h3{
    display:none;
}
.circles article .horizontalList .loadMore{
    text-indent:0;
    vertical-align:top;
    background:#e8e8e8;
    text-align:center;
    height:40px;
    min-width:37px;
    line-height:40px;
    margin:12px 0 0 0;
    color:#666;
    padding:0 3px 0 0;
    cursor:pointer;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.circles article .horizontalList .addMore{
    text-indent:0;
    vertical-align:middle;
    text-align:center;
    height:44px;
    width:44px;
    line-height:25px;
    margin-top:-18px;
    text-indent:-9999px;
    position:relative;
    cursor:pointer;
    position:absolute;
    right:2px;
    top:18px;
}
.circles article .horizontalList .addMore:after{
    content:"";
    width:33px;
    height:42px;
    position:absolute;
    right:6px;
    top:8px;
    background-position:-272px -178px;
}
.circles .filterControl{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    padding:0 15px 10px 117px;
    margin:-14px 0 0 0;
    position:relative;
    background:#fff;
    white-space:normal;
}
.circles .filterControl li:first-child{
    margin:0 0 -10px -1px;
    padding:0;
    display:block;
    font-size:15px;
    color:#8e8e8e;
}
.circles .filterControl:before{
    content:"";
    position:absolute;
    width:28px;
    height:30px;
    left:86px;
    top:-5px;
    display:block;
    background-position:-147px -1261px;
}
.circles .activity_AllConnections .feedbackControl div{
    border:none;
}
.circles .activity_AllConnections .feedbackControl button.details,
.circles .activity_AllConnections .feedbackControl button.post,
.circles .activity_AllConnections .feedbackControl button.more,
.circles .activity_AllConnections .feedbackControl button.message,
.circles .activity_AllConnections .feedbackControl button.event{
    display:none;
}
.circles .activity_AllConnections .feedbackControl button.addPeople,
.circles .activity_AllConnections .feedbackControl button.suggested,
.circles .activity_AllConnections .feedbackControl button.members{
    border-right:1px solid #e4e5ed;
}



/*************************************************
*  Circles: Create Edit
*************************************************/
.createCirclePage .autoSuggest .selectedList span{
    width:95%;
    max-width:95%;
}
.createCirclePage .formLayout label input[type='text'],
.createCirclePage .formLayout label input[type='email'],
.createCirclePage .formLayout label input[type='password'],
.createCirclePage .formLayout label input[type='date'],
.createCirclePage .formLayout label input[type='datetime'],
.createCirclePage .formLayout label input[type='datetime-local'],
.createCirclePage .formLayout label input[type='time'],
.createCirclePage .formLayout label input[type='tel'],
.createCirclePage .formLayout label input[type='number'],
.createCirclePage .formLayout textarea,
.createCirclePage .formLayout section .editableElement,
.createCirclePage .formLayout .filterControl,
.createCirclePage .formLayout .selectedList{
    padding-left:145px;
    padding-right:10px;
    border:1px solid transparent;
}
.createCirclePage .formLayout .filterControl li:first-child{
    margin-left:0;
}
.createCirclePage div.formPadding .formLayout section.autoSuggest .selectedList{
    padding-left:135px;
}
.createCirclePage .formLayout .linkControl{
    border-bottom:none !important;
}
.createCirclePage .formLayout section .placeHolderText{
    text-indent:140px;
}
.createCirclePage div.formPadding .formLayout section.autoSuggest .selectedList a{
    color:#666;
}
.createCirclePage div.formPadding .formLayout section.autoSuggest .selectedList .addMembersLink{
    background:#fff;
    border-color:transparent;
}
.circleDetails .circleGroupHeader section,
.createCirclePage .circleGroupHeader section{
    padding:0 15px 0 64px;
}
.createGroupHeader,
.createGroupHeader section{
    border-bottom:1px solid #6ea336;
    background:#6ea336;
    margin-bottom:-1px;
}
.createCircleHeader,
.createCircleHeader section{
    border-bottom:1px solid #53c8e6;
    background:#53c8e6;
    margin-bottom:-1px;
}
.createCommunityHeader,
.createCommunityHeader section{
    border-bottom:1px solid #814aa3;
    background:#814aa3;
    margin-bottom:-1px;
}
.circleDetails .circleGroupHeader section h2:before,
.createCirclePage .circleGroupHeader section h2:before{
    margin-left:-55px;
    /*margin-top:20px;*/
    margin-top:6px;
}
.circleDetails .circleGroupHeader section h2,
.circleDetails .circleGroupHeader section p,
.createCirclePage .circleGroupHeader section h2,
.createCirclePage .circleGroupHeader section p{
    color:#fff;
    text-shadow:none;
}
.circleDetails .circleGroupHeader h2.createInviteOption:before,
.createCirclePage .circleGroupHeader h2.createInviteOption:before{
    background-position:-390px -1436px;
}
.circleDetails .circleGroupHeader h2.createCircleOption:before,
.createCirclePage .circleGroupHeader h2.createCircleOption:before{
    background-position:-262px -1436px;
}
.circleDetails .circleGroupHeader h2.createClassOption:before,
.createCirclePage .circleGroupHeader h2.createClassOption:before{
    background-position:-262px -1436px;
}
.circleDetails .circleGroupHeader h2.createCommunityOption:before,
.createCirclePage .circleGroupHeader h2.createCommunityOption:before{
    background-position:-70px -1436px;
}
.circleDetails .circleGroupHeader h2.createGroupOption:before,
.createCirclePage .circleGroupHeader h2.createGroupOption:before{
    background-position:-326px -1436px;
}
div.createCirclePage .formLayout section.autoSuggest div.selectedList{
    padding:9px 10px 0 145px;
    position:relative;
    margin-bottom:0;
}
div.createCirclePage .formLayout section.autoSuggest div.selectedList span{
    padding:0;
    border:1px solid transparent;
}
div.createCirclePage .formPadding>.formPadding{
    padding:0;
}
div.createCirclePage .explainLink {
    color: #1ca0c8;
    font: 16px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height: 32px;
}
#_communityView{
    position:relative;
}
.displayingMainPanel + #genericControls #_communityView{
    display:none;
}
.hidingMainPanel .scrollView{
    -webkit-overflow-scrolling:auto !important;
}
.displayingMainPanel ~ #genericControls .scrollView{
    -webkit-overflow-scrolling:auto !important;
}
.hidingMainPanel ~ #genericControls .activeCtrl .scrollView{
    -webkit-overflow-scrolling:touch !important;
}
.hidingMainPanel ~ #genericControls .inactiveCtrl .scrollView{
    -webkit-overflow-scrolling:auto !important;
}
.hidingMainPanel.showDrawer ~ #genericControls .activeCtrl .scrollView,
.hidingMainPanel.showDrawer ~ #genericControls .carousel{
    -webkit-overflow-scrolling:auto !important;
}
.hidingMainPanel .quickLinks{
    display:none;
}



/*************************************************
*  Circles: Create Circle/Group Menu
*************************************************/
.createCircleGroupMenu .circleGroupHeader section{
    cursor:pointer;
}
.circleGroupHeader section{
    padding:20px 15px 0 65px;
}
.circleGroupHeader section h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:21px;
    margin-top:0;
    text-indent:0;
    line-height:24px;
}
.circleGroupHeader section h2:empty{
    margin-top:0;
}
.circleGroupHeader section h2:empty ~ p{
    padding:20px 0;
}
.circleGroupHeader h2:before{
    content:"";
    width:50px;
    height:50px;
    display:block;
    position:absolute;
    margin-left:-55px;
}
.circleGroupHeader h2.createInviteOption:before{
    background-position:-390px -1376px;
}
.circleGroupHeader h2.createCircleOption:before{
    background-position:-262px -1376px;
}
.circleGroupHeader h2.createClassOption:before{
    background-position:-262px -1376px;
}
.circleGroupHeader h2.createCommunityOption:before{
    background-position:-70px -1376px;
}
.circleGroupHeader h2.createGroupOption:before{
    background-position:-326px -1376px;
}
.circleGroupHeader h2.invitePeopleOption:before{
    background-position:-198px -1376px;
}
.circleGroupHeader section p{
    margin:0;
    color:#8e8e8e;
    display:table-cell;
    height:50px;
    vertical-align:middle;
    padding:0 0 20px 0;
}



/*************************************************
*  Circles: Details Page
*************************************************/
.circleDetails{
    padding-bottom:47px;
}
.circleDetails .scrollView{
    border-bottom:none;
}
.circleDetails .circles article{
    padding:10px 0 25px 0;
}
.circleDetails .circles article>.hgroup,
.circleDetails .circles article h3{
    display:none;
}
.circleDetails .circles article .horizontalList{
    text-indent:0;
    margin:-8px 0 13px 10px;
}
.locationMap{
    width:100%;
    height:150px;
    overflow:hidden;
    border-bottom:1px solid #b8b8b8;
}
.locationAddress{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:absolute;
    width:100%;
    top:0;
    padding:0 15px;
    background-color:transparent !important;
}
.locationAddress p{
    display:block;
    background:rgba(255,255,255,.9);
    padding:7px 62px 7px 12px;
    font-size:15px;
    color:#666;
    border-bottom:1px solid #e4e5ed;
    box-shadow:0px 0px 4px rgba(0, 0, 0, .09);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    min-height:63px;
    margin:15px auto 0 auto;
    position:relative;
}
.locationAddress p span{
}
.locationAddress p .name{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#000;
    display:block;
}
.locationAddress p .address{
    display:block;
}
.locationAddress a.callLocation{
    position:absolute;
    display:block;
    width:50px;
    height:100%;
    right:0;
    top:0;
    border:none;
    border-left:1px solid #e3e3e2;
    text-indent:-9999px;
    background-position:-392px -1067px;
}
.addressHousehold{
    font-size: 14px;
    line-height: 16px !important;
    display: inline-block;
}



/*************************************************
*  Circles: Members Page
*************************************************/
.shadowBox .subPage.circleMembers,
.inlineBox .subPage.circleMembers{
    padding-top:94px;
}
.iPhone .shadowBox .subPage.circleMembers,
.iPhone .inlineBox .subPage.circleMembers,
.iPad .shadowBox .subPage.circleMembers,
.iPad .inlineBox .subPage.circleMembers{
    padding-top:99px;
}



/*************************************************
*  Circles: Members Page Search Header
*************************************************/
.circleMembers li.searchBox{
    padding-left:48px;
}
.circleMembers .actionBarSearch h1{
    padding:4px 86px;
}
.actionBarSearch .actionButtons li.addBtn,
.actionBarSearch .actionButtons li.searchBtn,
.actionBarSearch .actionButtons li.editBtn{
    position:absolute;
    z-index:9000;
    width:40px;
    display:block;
    right:0;
    text-indent:-9999px;
    padding:0;
    top:0;
}

.actionBarSearch .actionButtons .addToCircle:after{
    left:0;
    width:40px;
    background-position:-523px -1013px;
}

.actionBarSearch .actionButtons li.searchBtn{
    right: 10px;
}
.actionBarSearch .actionButtons.searchBar{
    margin-top:49px;
    padding-right:64px;
    left:64px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.iPhone .actionBarSearch .actionButtons.searchBar,
.iPad .actionBarSearch .actionButtons.searchBar{
    margin-top:52px;
}
.actionBarSearch.hideCirclePicker .actionButtons.searchBar{
    margin-top:49px;
    padding-right:0;
    left:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.actionBarSearch .actionButtons.searchBar .searchBox,
.actionBarEmail .actionButtons.searchBar .emailBox{
    background:#e4e5ed;
    padding:7px;
}
.actionBarSearch .actionButtons.searchBar .searchBox>div,
.actionBarEmail .actionButtons.searchBar .emailBox>div{
    margin-top:0;
}
.actionBarSearch .actionButtons.searchBar .searchBox:before,
.actionBarEmail .actionButtons.searchBar .emailBox:before{
    left:10px;
}
.actionBarSearch .actionButtons li.editBtn{
    right: 40px;
}
.actionBarSearch .actionButtons li.editBtn button:after{
    width:40px;
}
.actionBarSearch .actionButtons li.editBtn button.deselected:after{
    background-position:-576px -1315px;
}
.actionBarSearch .actionButtons li.editBtn button.selected:after{
    background-position:-576px -1375px;
}



/*************************************************
*  Circles: Members Body
*************************************************/
.circleMembers .peopleListing{
    display:block;
}
.circleMembers .indentWrapper,
.connectionSearchResults .indentWrapper{
    padding-left:64px;
    height:100%;
}
.connectionSearchResults .hideCirclePicker ~ .indentWrapper,
.circleMembers .hideCirclePicker ~ .indentWrapper{
    padding-left:0px;
}
.circleMembers .groupedListing{
    padding:0;
}
.circleMembers .peopleListing .formLayout section.horizontalList,
.circleMembers .peopleListing .formLayout section.verticalList{
    overflow-y:hidden;
    box-shadow:none;
    border:none;
    margin-bottom:0;
}
.circleMembers .peopleListing .formLayout section.horizontalList h2{
    text-indent:15px;
}
.circleMembers .peopleListing .formLayout section.horizontalList .hgroup:nth-child(1) h2{
    text-indent:15px;
}
.circleMembers .peopleListing .formLayout section.horizontalList .hgroup:nth-child(2){
}
.circleMembers .peopleListing .formLayout section.verticalList .hgroup h2{
    margin-left:15px;
}
.circleMembers .peopleListing .formLayout section.verticalList .hgroup h3{
    margin-top:-35px;
}



.circleMembers .peopleListing .formLayout section.horizontalList h2 a{
    width:40px;
    height:40px;
    display:block;
}
.circleMembers .peopleListing .formLayout section.horizontalList h2 a>span{
    width:40px;
    height:40px;
    display:block;
    margin-left:0;
}
.circleMembers .peopleListing .groupedListing .horizontalList .hgroup .profileM{
    margin-left:0;
}
.circleMembers .peopleListing .formLayout section{
    overflow-y:auto;
    overflow-x:hidden;
    min-height:80px;
    padding:0 20px 0 10px;
}
.circleMembers .peopleListing .formLayout section.emptyPanelMsg{
    padding:100px 20px 0 10px;
}
.circleMembers .peopleListing .formLayout section.groupedListing,
.circleMembers .peopleListing .formLayout section.groupedListing .verticalList,
.circleMembers .peopleListing .formLayout section.groupedListing .horizontalList{
    padding:0;
}
.circleMembers .peopleListing .profileM{
    margin-left:0;
}
.circleMembers .peopleListing h2{
    text-indent:0;
}
.circleMembers .peopleListing h3{
    text-indent:70px;
    margin-top:-60px;
}
.circleMembers .peopleListing .contactsChildren{
    background:#fff;
    display:block;
    padding:0 15px 0 0;
    position:relative;
    overflow:visible;
    z-index:2;
    margin:-14px 0 0 70px;
}
.circleMembers .peopleListing .contactsChildren .profileS{
    display:block;
    float:left;
    margin:0 4px 4px 0;
}
.circleMembers .peopleListing .formLayout section .hgroup:after{
    display:none;
}
.circleMembers .profileL{
    overflow:visible;
    color:#000;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:18px;
}
.circleMembers .profileL img{
    vertical-align:top;
}
.circleMembers .peopleListing .hgroup button.removeContact{
    background-position:-13px -779px;
    top:10px;
    right:0px;
}
.circleMembers .peopleListing .hgroup button.removeContact:after{
    content:"";
    width:10px;
    height:60px;
    display:block;
    position:absolute;
    top:-20px;
    left:-11px;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 38%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(38%,rgba(255,255,255,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 38%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 38%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 38%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 38%,rgba(255,255,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
}
.circleMembers .peopleListing .hgroup button.removeContact:before{
    content:"";
    width:30px;
    height:19px;
    display:block;
    position:absolute;
    background:#fff;
    top:-20px;
    left:-1px;
}



/*************************************************
*  Join Group Page
*************************************************/
.joinGroup .circleCardsListing:first-of-type{
    margin-top:15px;
}
.joinGroup .circleCardsListing article{
    padding-left:0;
    padding:0;
}
.joinGroup .circleCardsListing .hgroup{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.joinGroup .circleCardsListing article h3{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:5px;
    display:block;
    white-space:normal;
    margin:-2px 0 0 10px;
}
.joinGroup .circleCardsListing article h3 span{
    display:block;
    width:100%;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 10px 0 0;
}
.joinGroup .circleCardsListing article h3 span.description{
    margin-top:16px;
    height:auto;
    white-space:normal;
}
.joinGroup .circleCardsListing article .horizontalList{
    text-indent:65px;
    margin-bottom:5px;
}
.joinGroup .circleCardsListing article button.circle{
    margin-left:5px;
    top:12px;
    left:4px;
}
.joinGroup .circleCardsListing article button.circle .circleName{
    top:0px;
    height:50px;
}
.joinGroup .circleCardsListing article button.circle .circleName:after{
    top:8px;
}
.joinGroup .circleCardsListing .filterControl{
    text-align:left;
    background:#f5f5f5;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-right-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    padding-top:22px;
    padding-left:15px;
    margin-top:-10px;
}
.joinGroup .circleCardsListing .filterControl:after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    display:block;
    width:100%;
    height:10px;
    background:#fff;
    border-bottom:1px solid #e4e5ed;
    border-bottom-left-radius:4px;
    -moz-border-radius-bottomleft:4px;
    -webkit-border-radius-bottomleft:4px;
    border-bottom-right-radius:4px;
    -moz-border-radius-bottomright:4px;
    -webkit-border-radius-bottomright:4px;
    box-shadow:0px 2px 3px rgba(0, 0, 0, .08);
}
.joinGroup .circleCardsListing .filterControl:before{
    top:17px;
    left:30px;
}
.joinGroup .circleCardsListing .filterControl li:first-child{
    margin:10px 0 10px 50px;
}
.joinGroup .circleCardsListing .filterControl li:nth-child(2){
    margin-left:55px;
}



/*************************************************
*  Connections: Search Results
*************************************************/
.connectionSearchResults .contentSearchResults{
    display:block;
}
#groupMembers .connectionSearchResults{
    padding-top:94px;
}



/*************************************************
*  Volunteer Ask
*************************************************/
.volunteerAskListing h1{
    margin:0 0 0 -10px;
    width: 100%;
    padding: 25px 10px 5px 10px;
}
article.volunteerAsk{
    padding:0 10px 3px 20px;
    cursor:pointer;
}
article.volunteerAsk:after{
    max-height:none;
}
article.volunteerAsk h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    overflow:visible;
    height:auto;
    line-height:20px;
    margin-bottom:13px;
    margin-top:0;
    padding:16px 10px 0 0;
    font-size:15px;
}
article.volunteerAsk h3{
    margin-top:-12px;
    margin-bottom:2px;
    font-size:15px;
}
article.volunteerAsk h3.tags{
    margin:9px 0 5px 80px;
}
article.volunteerAsk time{
    font-size:15px;
    color:#8e8e8e;
}
article.volunteerAsk .statusIndicator{
    width:72px;
    height:6px;
    background:#e4e5ed;
    text-indent:-9999px;
    display:block;
    position:absolute;
    margin:-22px 0 0 2px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    overflow:hidden;
}
article.volunteerAsk .statusIndicator span{
    height:6px;
    display:block;
    left:0;
    top:0;
}
article.volunteerAsk .statusIndicator.filled span{
    background:#039803;
}
article.volunteerAsk .statusIndicator.needHelp span{
    background:#ff0304;
}



/*************************************************
*  Messages: Listing Page
*************************************************/
.messagesTab .contentArea .filterControl{
    background:#fff;
}
.contentArea section.messages{
    margin-bottom:0;
}
.messages h1{
    margin-bottom:0;
    padding-bottom:5px;
    border-bottom:1px solid #f2f2f2;
    background:#fff;
}
.messages h1:only-child{
    background:transparent;
    border-bottom:0;
}
.studentAwards .award,
.messages .message{
    padding:15px 15px 15px 36px;
    margin-bottom:0;
    overflow:hidden;
    cursor:pointer;
}
.postsTab .update .messages .message{
    padding:8px 15px 5px 15px;
    border:none;
    margin-top:-3px;
}
.update .messages .message{
    padding:0 15px 32px 15px;
    border:none;
    margin-top:-2px;
}
.messages .message .profileM{
    z-index:2;
}
.messages .message .profileM:after{
    text-indent:45px;
}
.notScrolling .messages .message:active{
    border-top:1px solid #f1f1f1;
}
.messages .message.unread:before{
    content:"";
    display:block;
    width:10px;
    height:10px;
    background:#4bc1e6;
    position:absolute;
    margin-left:-15px;
    margin-top:12px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
}
.messages .message h3{
    display:inline-block;
    position:absolute;
    right:0px;
    top:12px;
}
.messages .message h3 time{
    background:#fff;
    padding:0 10px 0 5px;
}
.messages .message h3 time:before{
    display:none;
}
.studentAwards .award p,
.messages .message p{
    margin:-20px 0 0 49px;
    line-height:20px;
    padding:0;
    overflow:hidden;
    position:relative;
    z-index:2;
}
.messagesTab .messages .message p{
    max-height:42px;
}
.messages .emptyPanelMsg{
    text-align: center;
    padding:80px 20px 0px 20px;
    line-height:1.35;
    border-bottom:none;
    color:#8e8e8e;
    font-size:18px;
}
.message .onlineStatus .profileM:after{
    width:auto;
    max-width:100%;
    background-position-y:4px;
    text-indent:54px;
}
.messages .message p time:before,
.messages .message p[dir="rtl"] time:after {
    content:"\00a0-\00a0";
    display: inline;
}
.messages .message p[dir="rtl"] time:before {
    display: none;
}
.messagesTab .message .profileM:after{
    text-indent:52px;
}
.studentAwards .award time,
.messagesTab .messages .message time{
    position: absolute;
    /*top: 1px;
    right: 10px;*/
    top: -3px;
    right: 0;
    font-size: 11px;
    color: #898989;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.messagesTab .messages .message time:before{
    display:none;
}



/*************************************************
*  Chat Window: ActionBar
*************************************************/
div.chatWindow.modeShowThread .actionBar.selectGroups{
    display:block;
    height:49px;
}
div.chatWindow .actionBarInput .actionButtons li{
    padding:0 45px;
    display:block;
}
div.chatWindow #recipientHeader .nextButton{
    text-indent:-9999px;
    background-position:-9px -837px;
    width:45px;
    padding:0;
    margin-top:0;
}
div.chatWindow .actionBar.hasOptions h1 {
    padding: 4px 90px 4px 40px !important
}
div.chatWindow .sourceType{
    display:none;
}
div.chatWindow .actionBar .onlineStatus:after {
    content:"";
    display:inline-block;
    background-position:-25px -969px;
    width:15px;
    height:15px;
    margin:7px 0 0 2px;
}
.formLayout .nextButton {
    text-indent:-9999px;
    background-position:-9px -837px;
    width:45px;
    padding:0;
    margin-top:0;
    position: absolute;
    height: 45px;
    right: 22px;
    top: 0px;
}



/*************************************************
*  Chat Window: Content Area
*************************************************/
.chatWindow .chatScrollWrapper{
    height:100%;
}
.chatWindow .scrollView{
    display:none;
}
.chatWindow.modeShowThread .chatPanel{
    display:block;
}
.shadowBox div.chatWindow,
.inlineBox div.chatWindow{
    padding-bottom:47px;
}
.chatWindow .scrollView.chatEntries{
    font-size:15px;
    line-height:20px;
    overflow-y:auto;
    overflow-x:hidden;
    padding:0 6px 8px 8px;
    width:100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.shadowBox .chatWindow .scrollView.chatEntries.groupChat{
    padding-top:65px;
}
.chatWindow .scrollView.chatEntries.groupChat{
    padding-top:35px;
}
.chatWindow .scrollView.chatEntries .time{
    text-align:center;
    width:100%;
    display:block;
    padding:28px 0 4px 0;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:-14px;
    background:#fff;
    padding:5px;
    background:rgba(0,0,0,0.03);
}
.chatWindow .scrollView.chatEntries .time time{
    padding:0 5px;
    color:#9e9e9e;
    font-size:13px;
}
.chatWindow .scrollView.chatEntries div.entry{
    padding:7px 10px;
    max-width:65%;
    margin:8px 0 0px 0;
    clear:both;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    position:relative;
    word-break:break-word;
    text-align:left;
    display:inline-block;
}
.chatWindow .scrollView.chatEntries .entryByMe{
    text-align:right;
    background:transparent;
}
.chatWindow .scrollView.chatEntries .byMe{
    background:#2fc6fa;
    border:1px solid #2fc6fa;
    color:#fff;
    text-shadow:none;
    /*float:right;*/
    margin-right:10px !important;
}
.chatWindow .scrollView.chatEntries .byMe a{
    color:#fff;
    text-decoration:underline;
}
.chatWindow .scrollView.chatEntries .entryByOthers{
    text-align:left;
}
.chatWindow .scrollView.chatEntries .byOthers{
    background: #fff;
    border: 1px solid #e4e5ed;
    /*float:left;*/
    margin-left:56px !important;
}
.chatWindow .scrollView.chatEntries .byOthers a{
    color:#1ca0c8;
    text-decoration:underline;
}
.chatWindow .scrollView.chatEntries div.entry:before{
    content:"";
    width:10px;
    height:10px;
    position:absolute;
    display:block;
}
.chatWindow .scrollView.chatEntries .byMe:before{
    right:-10px;
    top:15px;
    background-position:-109px -1019px;
}
.chatWindow .scrollView.chatEntries .byOthers:before{
    left:-10px;
    top:12px;
    background-position:-106px -1047px;
}

.chatWindow .scrollView.chatEntries .entryImage .entry.byOthers{
    background:none;
}
.chatWindow .scrollView.chatEntries .entryImage .entry{
    padding:0;
    max-width:70%;
    margin-bottom:-4px;
}
.chatWindow .scrollView.chatEntries .entryImage .entry>div{
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    background:#000;
    overflow:hidden;
    min-width:80px;
    min-height:80px;
}
.chatWindow .scrollView.chatEntries .entryImage .entry.entryProgress>div{
    background:#e9eeef;
}
.chatWindow .scrollView.chatEntries .entryImage .entry.byOthers>div{
    margin-top: 18px;
    min-height: inherit;
    position: relative;
}

.chatWindow .scrollView.chatEntries .entryImage .entry.byMe>div{
    margin-bottom:-8px;
}


.chatWindow .scrollView.chatEntries .entryImage img.thumb{
    width: 100%;
    margin-right: -10px;
    opacity: 0.9;
    filter: alpha(opacity=90);
    min-width:80px;
    min-height:80px;
    background:#fff;
    /* Note: If a different image size is displayed then make sure the js is also fixed.*/
    height: 320px;
    object-fit:cover;
}
.chatWindow .scrollView.chatEntries .entryImage.entryByMe img.thumb{
    float: left;
}
.chatWindow .scrollView.chatEntries .entryImage .entryProgress img.thumb{
    opacity: 0.3 !important;
    filter: alpha(opacity=30) !important;
    margin-right: 10px;
}
.chatWindow .scrollView.chatEntries .entryImage .entryProgress .progress{
    position: relative;
    top: -10px;
    right: -290px
}


.chatWindow .attachedFiles{
    background: rgba(255,255,255,.2);
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    padding: 5px;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

.chatWindow .scrollView.chatEntries .entryImage .byMe,
.chatWindow .scrollView.chatEntries .entryImage .byOthers{
    border:none !important;
}
.chatWindow .scrollView.chatEntries .entryImage .byOthers .thumb{
    margin:0 0 -5px 0;
}
.chatWindow .scrollView.chatEntries .entryImage .byOthers .username{
    position: absolute;
    z-index: 1;
    top: -6px;
    margin:0;
    color: #444 !important;
    text-shadow: none !important;
}
.chatWindow .scrollView.chatEntries .entryImage .byOthers .msgTime{
     position: absolute;
    right: 10px;
    top: 5px;
    font-size: 12px;
    opacity: 0.8;
    z-index: 1;
    margin-top: -3px;
    color: #898989 !important;
    margin-right: 0;
    bottom: 6px;
}
.chatWindow .scrollView.chatEntries .entryImage .username{
    position: absolute;
    margin: 0 0 0 15px;
    bottom: 8px;
    color: #fff !important;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1) !important;
}
.chatWindow .scrollView.chatEntries .entryImage .msgTime{
    top:auto;
    bottom: 0;
    font-weight: bold;
    font-size: 12px;
    color: #fff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .1) !important;
    margin-right: 0;
    z-index:1;
}
.chatWindow .scrollView.chatEntries .entryImage .byMe .username{
    display:none;
}
.chatWindow .scrollView.chatEntries .entryImage .entry:before,
.chatWindow .scrollView.chatEntries .entryProgress .entry:before{
    display: none !important;
}
.chatWindow .scrollView.chatEntries .entryImage .entry.byOthers{
    background: #fff;
    border: 1px solid #e4e5ed !important;
    margin-left: 56px !important;
    padding: 15px 10px 7px 10px;
    max-width: 65%;
    margin: 8px 0 0px 0;
    clear: both;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    border-radius: 7px;
    position: relative;
    word-break: break-word;
    text-align: left;
    display: inline-block;
}
.chatWindow .scrollView.chatEntries .entryProgress div{
    color:#FFF;
}
.chatWindow .scrollView.chatEntries .entryProgress.multiple div{
    font-size:12px;
    min-width:110px;
    min-height:110px;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
}
.chatWindow .scrollView.chatEntries span.username{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color:#fff;
    position:relative;
    white-space:nowrap;
    margin:0 0 4px 0;
    padding-right:54px;
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
}
.chatWindow .scrollView.chatEntries .byOthers span.username{
    color:#444;
}
.chatWindow .scrollView.chatEntries .msgTime{
    position:absolute;
    right:10px;
    top:5px;
    color:#fff;
    font-size:12px;
    opacity:0.8;
    filter:alpha(opacity=80);
}
.chatWindow .scrollView.chatEntries .byOthers .msgTime{
    color:#898989;
}
.chatWindow .scrollView.chatEntries .entryByOthers .msgViewCount{
    padding:8px 10px 12px 10px;
    margin:0 0 0 52px;
    font-size:12px;
    color:#9e9e9e;
    text-decoration:underline;
    cursor:pointer;
    display:inline-block;
}
.chatWindow .scrollView.chatEntries .entryByMe .msgViewCount{
    padding:8px 14px 12px 10px;
    font-size:12px;
    color:#9e9e9e;
    text-decoration: underline;
    cursor:pointer;
    display:inline-block;
}
.chatWindow .scrollView.chatEntries div.entry img.profilePhoto{
    height:40px;
    width:40px;
    -moz-border-radius:10px 0 10px 10px;
    -webkit-border-radius:10px 0 10px 10px;
    border-radius:10px 0 10px 10px;
    position:absolute;
    left:-52px;
    margin-top:-8px;
    border-radius:100px;
}
.chatWindow .messageEntrySnippet{
    cursor:pointer;
    background:rgba(255, 255, 255, .7);
    height:100%;
    padding:8px;
    margin:0 0 10px -1px;
    margin-bottom:10px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #ececec;
    border-bottom-color:#ddd;
    font-size:14px;
    line-height:1.35;
    overflow:auto;
}
.chatWindow .messageEntrySnippet + span{
    display:block;
    padding:0 8px;
}
.chatWindow .byMe .messageEntrySnippet{
    background:#1dbef4;
    border:1px solid #00a7d9;
    border-bottom-color:#0097c4;
}
.chatWindow .snippetTextWrapper{
    overflow:hidden;
    max-height:38px;
}
.chatWindow .messageEntrySnippet .snippetTitle{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
}
.chatWindow .messageEntrySnippet .snippetImg{
    width:36px;
    height:36px;
    background-size:cover;
    margin:1px 8px 0 0;
    float:left;
}
.chatWindow .byMe .messageEntrySnippet.snippetTitle{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
}

.dialogMessage img:not(.memberList-profile) {
    width: 100%;
}



/*************************************************
*  Chat Window: Input Message
*************************************************/
.chatInput{
    position:relative;
    width:100%;
    height:46px;
    bottom:0;
    background:#f0f4f8;
    border-top:1px solid #e4e5ed;
    -webkit-transform: translate3d(0,0,0);
    box-shadow:0 -1px 3px rgba(0,0,0,.05);
}
.chatInput>div{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    padding:0 0 0 5px;
    height:47px;
    position:relative;
}
.chatInput>div>div,
.chatInput>div>form{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    height:47px;
    position:relative;
    display:table;
}
.chatInput .messageWrapper{
    display:table-cell;
    position:relative;
    width:100%;
}
.chatInput input[type='file']{
    position:absolute;
    left:0;
    top:3px;
    width:50px;
    height:38px;
    overflow:hidden;
    text-indent:-9999px;
    cursor:pointer;
    background-position:-199px -1020px;
}
.chatInput input[type='text'],
.chatInput .editableElement{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    min-height:27px;
    max-height:120px;
    line-height:20px;
    font-size:15px;
    margin:5px 0 0 0;
    padding:3px 8px 0 8px;
    vertical-align:middle;
    -webkit-appearance: none;
    color:#000;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    outline:none;
    overflow-x:hidden;
    overflow-y:auto;
    position:absolute;
    width:inherit;
    bottom:10px;
    border:1px solid #c3c3c3;
    border-color:#c3c3c3 #c3c3c3 #adadad #c3c3c3;
    box-shadow:0 1px 4px rgba(0,0,0,.15);
    background:#fff;
}
.chatInput input[type='text']:empty,
.chatInput .editableElement:empty{
    background:transparent;
    border:1px solid transparent;
    box-shadow:none;
}
.chatInput input[type='text']:focus,
.chatInput .editableElement:focus,
.chatInput .editableElement.highlightInput{
    border:1px solid #c3c3c3;
    border-color:#c3c3c3 #c3c3c3 #adadad #c3c3c3;
    outline:none;
    -webkit-appearance: none;
    box-shadow:0 1px 4px rgba(0,0,0,.15);
    background:#fff;
}

.chatInput .editableElement .sendMessage_messageText_content{
    outline:none;
    -webkit-appearance: none;
    min-height:25px;
}
.chatInput .buttonWrapper{
    display:table-cell;
    width:5px;
    padding:8px;
}
.chatInput button,
.bloomzButton{
    height:30px;
    padding:0 12px;
    margin:0;
    border:1px solid #009fe3;
    color:#fff;
    text-shadow:none;
    background:#00aae6;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    position: relative;
    white-space: nowrap;
}
.chatInput button:active{
    opacity:0.3;
    filter:alpha(opacity=30);
}
.chatInput .placeHolderText{
    color:#aaa;
    position:absolute;
    top:8px;
    text-indent:9px;
    font-size:15px;
    width:100%;
    margin-left:0;
    height:30px;
    line-height:30px;
    z-index:3001 !important;
    overflow:hidden;
}
.chatInput .placeHolderTextStudent {
    overflow:visible;
}
.chatInput .placeHolderTextStudent {
    padding-left: 10px;
    text-indent: 0;
}
.chatInput article{
    margin:0;
    border:none;
    box-shadow:none;
    height:56px;
}
.chatInput article footer{
    height:56px;
    border:none;
}
.chatInput article footer li{
    height:56px;
    line-height:46px;
}
.chatInput article footer li:before{
    display:none;
}
.chatInput .no-padding{
    margin-left: -36px !important;
}
.addStudent .no-padding{
    margin-left: 0 !important;
}
.messageWrapper > .placeHolderText > a {
    text-decoration: underline;
}
.chatInputSnippet {
    height:100%;
    background:rgba(250, 250, 250, 1);
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    padding:5px;
    margin:5px 0;
    border:1px solid #ececec;
    border-bottom-color:#ddd;
    font-size:14px;
    line-height:1.35;
    overflow:auto;
}
.chatInputSnippet .snippetTextWrapper{
    overflow:hidden;
    max-height:38px;
}
.chatInputSnippet .snippetTitle{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
}
.chatInputSnippet .snippetImg{
    width:36px;
    height:36px;
    background-size:cover;
    margin:1px 8px 0 0;
    float:left;
}
.chatInputSnippet .remove{
    width:50px;
    height:50px;
    position:absolute;
    top:-3px;
    right:-6px;
    text-indent:-9999px;
    cursor:pointer;
}
.chatInputSnippet .remove{
    opacity:.8;
    filter:alpha(opacity=80);
}
.chatInputSnippet .remove:hover{
    opacity:1;
    filter:alpha(opacity=100);
}
.chatInputSnippet .remove:after{
    content:"X";
    width:20px;
    height:20px;
    line-height:21px;
    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
    border:2px solid #fff;
    position:absolute;
    top:5px;
    right:10px;
    display:block;
    text-indent:5px;
    color:#fff;
    box-shadow:0 2px 2px rgba(0,0,0,1);
    background:rgba(0,0,0,.7);
    text-shadow:none;
    font-family:arial;
    font-size:14px;
}
.chatInputSnippet.selected .remove{
    display:block;
}
.inviteCircles + .chatScrollWrapper .chatInputSnippet{
    display:none;
}
#sendMessage .actionBar h1{
    padding:4px 40px;
}
#sendMessage .actionBar h1 span{
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}
#sendMessage_messageText{
    background:rgba(245,245,245,.75);
    border:1px solid transparent;
    box-shadow:none;
}
#sendMessage_messageText.hasData {
    background:rgba(245,245,245,1);
    border:1px solid #c3c3c3;
    border-color:#c3c3c3 #c3c3c3 #adadad #c3c3c3;
    box-shadow:0 1px 4px rgba(0,0,0,.15);
    outline:none;
    -webkit-appearance: none;
}
.chatWindow .chatInput .placeHolderText{
    color:#000;
}


/*************************************************
*  Chat Window: Browse Recipients
*************************************************/
div.chatWindow.modeShowTabs .contentInviteCircles{
    display:block;
}
div.chatWindow.modeShowTabs .sourceType{
    display:block;
}



/*************************************************
*  Chat Window: Search Results
*************************************************/
div.chatWindow.modeSearchResults .contentInviteCircles{
    display:block;
}
div.chatWindow.modeShowTabs .sourceType{
    display:block;
}



/*************************************************
*  Chat Window: Circle Picker
*************************************************/
.chatWindow footer.chatPicker{
    width:50px;
    left:0px;
    top:0px;
    height:100%;
    position:absolute;
    background:#f8f8f8;
    border-right:1px solid #c3c3c3;
    overflow:hidden;
    -webkit-overflow-scrolling:touch;
    padding:0;
    text-align:left;
    -webkit-transform: translate3d(0,0,0);
}
.Android .chatWindow footer.chatPicker{
    overflow-y:auto;
}
.chatWindow footer.chatPicker::-webkit-scrollbar{
    width: 4px;  /* for vertical scrollbars */
}
.chatWindow footer.chatPicker::-webkit-scrollbar-track{
    background: #f5f5f5;
}
.chatWindow footer.chatPicker::-webkit-scrollbar-thumb{
    background: rgba(0, 0, 0, 0.18);
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.chatWindow footer.chatPicker:hover{
    overflow-x:hidden;
    overflow-y:scroll;
}
.chatWindow footer.chatPicker>:first-child{
    margin-top:58px;
}
.chatWindow footer.chatPicker>:last-child{
    margin-bottom:50px;
}
.chatWindow.modeShowThreads .hgroup{
    margin-left:6px;
    width:40px;
}
.chatWindow .chatPicker .profileM{
    width:37px;
    height:37px;
}
.chatWindow .chatPicker .selected{
    position:relative;
}
.chatWindow .chatPicker .selected:before{
    content:"";
    display:block;
    width:42px;
    height:42px;
    position:absolute;
    border:2px solid #51c1e4;
    z-index:1;
    left:-3px;
    top:-3px;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
.messageWrapperAddStudent input[type=text]{
    margin-left: -38px !important;
    width: calc(100% - 28px) !important;

}

.messageWrapperAddStudent input[type=text]:empty{
    border:none !important;
}

.messageWrapperAddStudent input[type=text]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #53c8e6;
  font-size:15px;
}
.messageWrapperAddStudent input[type=text]::-moz-placeholder { /* Firefox 19+ */
  color: #53c8e6;
  font-size:15px;
}
.messageWrapperAddStudent input[type=text]:-ms-input-placeholder { /* IE 10+ */
  color: #53c8e6;
  font-size:15px;
}
.messageWrapperAddStudent input[type=text]:-moz-placeholder { /* Firefox 18- */
  color: #53c8e6;
  font-size:15px;
}

.messageWrapperAddStudent input[type=text]:focus::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color:#FFF !important;
}
.messageWrapperAddStudent input[type=text]:focus::-moz-placeholder { /* Firefox 19+ */
  color:#FFF !important;
}
.messageWrapperAddStudent input[type=text]:focus:-ms-input-placeholder { /* IE 10+ */
  color:#FFF !important;
}
.messageWrapperAddStudent input[type=text]:focus:-moz-placeholder { /* Firefox 18- */
  color:#FFF !important;
}

.messageWrapperAddStudent .buttonWrapper{
    display: none;
}
.messageWrapperAddStudent input[type=text]:focus,
.messageWrapperAddStudent input[type=text]:valid{
    border: 1px solid #c3c3c3 !important;
    background-color: #FFF !important;
}
.messageWrapperAddStudent input[type=text]:focus + .buttonWrapper,
.messageWrapperAddStudent input[type=text]:valid + .buttonWrapper{
    display:inline-block;
    float: right;
    margin-right: 45px;
}

.iPhone .chatWindow .chatPicker .selected:before,
.iPad .chatWindow .chatPicker .selected:before,
.Android .chatWindow .chatPicker .selected:before{
    top:3px;
}
.chatWindow .chatPicker .groupChatCount{
    z-index:1;
    position:absolute;
    margin:28px 0 0 28px;
    padding:0;
    text-indent:-2px;
    left:0px;
}
.chatWindow .chatPicker .selected .groupChatCount{
    margin:25px 0 0 25px;
    left:0px;
    border-color:#51c1e4;
}



/*************************************************
*  Chat: New Group Chat
*************************************************/
.shadowBox div.newMessage,
.inlineBox div.newMessage{
    padding-bottom:47px;
}
.newMessage .peopleListing{
    padding-left:0;
}
.newMessage .actionBarMessage{
    display:block;
}




/*************************************************
*  QR Code
*************************************************/
#inviteByStudentQr button:active{
    opacity:0.3;
    filter:alpha(opacity=30);
}
#studentQrFrame{
    border: 0;
    width: 100%;
    overflow-y: hidden;
    margin: 0;
    padding: 0;
    height: 480px;
}
.studentQrFooter{
    position:absolute;
    width:100%;
    bottom:0;
    padding:8px 4px;
    background:#f5f5f5;
    border-top:1px solid #c3c3c3;
    box-shadow:0 -1px 3px rgba(0,0,0,.05);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.studentQrFooter ul{
    list-style:none;
    display:table;
    width:100%;
    padding:0;
    margin:0;
}
.studentQrFooter li{
    display:table-cell;
    padding:0 4px;
}
.studentQrFooter button {
    display:block;
    width:100%;
    height: 35px;
    padding:0 12px;
    border:1px solid #009fe3;
    color:#fff;
    text-shadow:none;
    background:#00aae6;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    position: relative;
    white-space: nowrap;
}
#inviteByStudentQr .subPage{
    padding-bottom:52px;
}
#inviteByStudentQr .formLayout{
    margin-bottom:0;
}
#inviteByStudentQr .formLayout .highlightableRow{
    text-indent:0;
}



/*************************************************
*  Group Access Code Settings
*************************************************/
.refreshGroupAccessCode{
    position:absolute;
    right:0;
    top:0;
    padding:0 10px;
    text-indent:0;
    color:#53c8e6;
}
.inviteBox .groupCode {
    padding-left: 20px;
}
.inviteBox .communityCode {
    padding-left: 70px !important;
    padding-left: 190px !important;
    position: relative;
    top: 4px;
}
.inviteBox .downloadInstructions{
    text-align:center;
    margin-top:40px;
}
.inviteBox .downloadInstructions a{
    display:inline-block;
    margin:0 12px;
    font-size:14px;
}
.inviteBox .downloadInstructions a:before{
    content:"";
    width:63px;
    height:63px;
    display:block;
    background-position:-447px -1247px;
    background-color:rgba(255,255,255,.5);
    margin:0 auto 8px auto;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    box-shadow:0 1px 1px rgba(0,0,0,.1), inset 0 1px 0px rgba(255,255,255,.8);
}

/*******************************************************
*  Print Instructions for adding Parents and Students  *
********************************************************/

.instructionsText {
    text-align:center;
    color:black !important;
    font-size:16px !important;
}

.layouts section {
    background:white !important;
    border-radius:5px;
    margin-bottom:15px;

}

.layouts section div div {
    font-size:17px !important;
}

.layouts section div {
    padding-bottom:5px;
}


.instructionsPara div p {
    margin-top:1px;
    font-size:15px;
    padding-left:15px;

}

.InstructionsClsName {
    text-align:center;
    color:black !important;
    padding-top:0 !important;
    border-bottom:1px solid #e4e5ed;
}

.codeRow {
  width:100%;
}

.codeRow tr{
    border-bottom: 1px solid #e8e8e8;
}

.codeRow tr td {
  text-align:center;
}

.codeData div p{
    padding-left:45px;
    font-size:15px;
}

.dropDownLanguage{
    background:white !important;
    color:black !important;
    border-radius:0 !important;
    border:1px solid black !important;
}

.dropDownLanguageOptions{
    bottom:100% !important;
    position:absolute;
}

.dropDownLanguageOptions li{
    display: inline-block;
    background-color: #f2f2f2;
    min-width: 290px;
    height:40px;
    border-bottom:1px solid #e8e8e8;
    padding-left:20px;
    padding-top:15px;
    font-size:18px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 9001;
}

.dropDownLanguageOptions div {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.parentInstructions{
    height:820px;
    width:470px;
    border:none;
}
/*************************************************
*  Calendar: New Event
*************************************************/
.newEvent .actionBar,
.newEvent .scrollView,
.newEvent footer.options,
.newEvent .chatInput{
    display:none;
}
.shadowBox div.eventForm,
.inlineBox div.eventForm{
    background-color:#e8e8e8;
}
.shadowBox div.eventForm form,
.inlineBox div.eventForm form{
    height:100%;
}



/*************************************************
*  Calendar: New Event - Event Creation Form
*************************************************/
.eventForm .actionBarEventForm,
.eventForm .contentEventForm,
.eventForm footer.options{
    display:block;
}
.eventForm .contentEventForm input[name='Location']{
    padding-left:142px;
}
.eventForm .contentEventForm .tags{
    cursor:pointer;
}
#addUpdateEvent .eventForm .actionBar h1#addEvent_eventTag,
#addUpdateEvent .eventForm .actionBar h1#addEvent_calendarSwitcher{
    padding:2px 66px 2px 44px;
    text-align:left;
}
#addUpdateEvent .eventForm .actionBar h1 .calendarSwitcher label{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
#addUpdateEvent .eventForm .actionBar h1 .calendarSwitcher .calColor{
    display:inline-block;
    width:14px;
    height:14px;
    background:#53c8e6;
    padding:0;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    border:0;
    margin-right:4px;
}
#addUpdateEvent .eventForm .actionBar h1 span{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:inline-block;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    height: 36px;
    line-height: 37px;
    margin-top: 4px;
    font-size:16px;
    text-align:left;
    text-indent:10px;
    cursor:pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:visible;
    text-overflow: ellipsis;
    position:relative;
    vertical-align: middle;
}
#addUpdateEvent .eventForm .actionBar h1 span.tags:after,
#addUpdateEvent .eventForm .actionBar h1 span.calendarSwitcher:after{
    content:"";
    border:solid;
    width:6px;
    height:6px;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    border-width:0 2px 2px 0;
    color:inherit;
    margin:0 0 4px 7px;
    display:inline-block;
}
#addUpdateEvent .eventForm .formLayout .highlight .selectedList input[type='text']{
    background:none;
}
#addUpdateEvent .eventForm .actionBar h1 .calendarSwitcher.disableSwitcher{
    border: transparent 1px solid;
    box-shadow: none;
    text-align: center;
    padding: 0;
    cursor:default;
    color:#000;
}
#addUpdateEvent .eventForm .actionBar h1 .calendarSwitcher.disableSwitcher:active{
    background:transparent;
}
#addUpdateEvent .eventForm .actionBar h1 span.calendarSwitcher.disableSwitcher:after,
#addUpdateEvent .eventForm .actionBar h1 span.calendarSwitcher.disableSwitcher .calColor{
    display:none;
}
#addUpdateEvent .eventForm .actionBar h1 span.tagVolunteer{
    cursor:default;
}
#addUpdateEvent .eventForm .actionBar h1 span.tagVolunteer:after{
    display:none;
}



/*************************************************
*  Calendar: Inline Calendar Switcher
*************************************************/
section.formLayout.calendarSwitcher label a{
    color:#53c8e6;
    white-space:normal;
    line-height:20px;
    text-indent:0;
    padding:14px 28px 14px 130px !important;
    min-height:0;
}
section.formLayout.calendarSwitcher label a:before{
    content:"";
    display:inline-block;
    width:14px;
    height:14px;
    background:#53c8e6;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    border:0;
    vertical-align: middle;
    margin:0 4px 3px -18px;
    padding:0;
}
section.formLayout.calendarSwitcher.disableSwitcher a{
    cursor:default;
}
section.formLayout.calendarSwitcher.disableSwitcher .highlightableRow:active{
    background:transparent;
}
section.formLayout.calendarSwitcher.disableSwitcher .drillDown:after{
    display:none;
}



/*************************************************
*  Calendar: Enter Tasks
*************************************************/
.taskListing{
    background:transparent !important;
}
.contentEventForm .formPadding .formLayout.taskListing{
    padding-bottom: 20px;
}
.taskListingHeader{
    padding-top:5px;
}
.taskListing .taskInput{
    background:#fff !important;
}
.taskListing .taskInput:first-of-type{
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
}
.taskListing .taskInput label input.task[type='text']{
    padding:0 90px 0 36px;
}
.taskListing .taskInput:before{
    content:"";
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    top: 10px;
    left: 8px;
    opacity:0.3;
    filter:alpha(opacity=30);
}
.taskListing .taskInput.needItem:before{
    background-position:-593px -905px;
}
.taskListing .taskInput.needPeople:before{
    background-position:-530px -905px;
}


.taskListing .taskInput label input.quantity{
    padding:0;
    width:50px;
    right:40px;
    position:absolute;
    text-align:center;
    border:solid #e4e5ed;
    border-width:0 1px;
    margin-top:-49px;
    opacity:0;
    filter:alpha(opacity=0);
    z-index:1;
}
.taskListing .taskInput label input.quantity:focus{
    opacity:1;
    filter:alpha(opacity=100);
}
.taskListing .taskInput label input.quantity:focus + .quantityMask{
    display:none;
}
.taskListing .taskInput label .quantityMask{
    padding:0;
    width:48px;
    height:50px;
    line-height:50px;
    right:40px;
    color:#666;
    font-size:18px;
    position:absolute;
    text-align:center;
    border:solid #e4e5ed;
    border-width:0 1px;
    margin-top:-49px;
    display:block;
    text-align:center;
    text-indent:0;
}
.taskListing .taskInput label .quantityMask:before{
    content:"x";
    margin-left:1px;
    font-size:15px;
}
.taskListing .taskInput button.moreOpt{
    background-position:-76px -1081px;
    background-color:#fff;
    text-indent:-9999px;
    border:none;
    width:40px;
    position:absolute;
    right:0;
    top:0;
}



/*************************************************
*  Calendar: Enter Tasks - More Options
*************************************************/
.taskListing .taskOptions section{
    margin-bottom:0;
    border:none;
    border-bottom:1px solid #e9e4cf;
    background:#fffbec;
}
.taskListing .taskOptions{
    padding-bottom:14px;
    background:#e8e8e8;
}
.taskListing .taskOptions label{
    color:#666;
}



/*************************************************
*  Calendar: Enter Tasks - More Option Buttons
*************************************************/
.taskListing .taskOptions + .taskInput{
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
}
.taskListing .taskOptions .taskOptionButtons:after{
    content:"";
    display:block;
    height:25px;
    background:#e8e8e8;
    position:absolute;
    width:100%;
    padding:0 10px;
    margin:-5px 0 0 -10px;
    z-index:1;
}
.taskListing .taskOptions .taskOptionButtons ul{
    padding:0;
    margin:0;
    list-style:none;
    text-indent:-9999px;
    display:table;
    table-layout:fixed;
    width:100%;
    background:#fffbec;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
    position:relative;
    z-index:2;
}
.taskListing .taskOptions .taskOptionButtons li{
    display:table-cell;
    border-right:1px solid #e9e4cf;
    position:relative;
}
.taskListing .taskOptions .taskOptionButtons li:last-of-type{
    border-right:none;
}
.taskListing .taskOptions .taskOptionButtons li:after{
    content:"";
    width:64px;
    height:47px;
    display:block;
    position:absolute;
    top:0;
    left:50%;
    margin-left:-32px;
}
.taskListing .taskOptions .taskOptionButtons li.photoTask:after{
    background-position:-320px -957px;
}
.taskListing .taskOptions .taskOptionButtons li.duplicateTask:after{
    background-position:-383px -957px;
}
.taskListing .taskOptions .taskOptionButtons li.deleteTask:after{
    background-position:-447px -957px;
}
.taskListing .taskOptions + .taskFooter{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    overflow:hidden;
}



/*************************************************
*  Calendar: Enter Tasks - Footer
*************************************************/
.taskListing .taskFooter{
    /*border-bottom:none !important;*/
    border: 1px solid #e8e8e8;
}
.taskListing .taskFooter ul{
    background:#fafafa;
    padding:0;
    margin:0;
    list-style:none;
    font-size:15px;
    text-indent:-7px;
    display:table;
    table-layout:fixed;
    width:100%;
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
    overflow:hidden;
}
.taskListing .taskFooter li{
    display:table-cell;
    text-align:center;
    border-right:1px solid #e4e5ed;
}
.taskListing .taskFooter li:last-of-type{
    border-right:none;
}
.taskListing .taskFooter a{
    color:#707b7f;
    display:block;
}
.taskListing .taskFooter a:active{
    background:#f1f1f1;
}
.taskListing .taskFooter a:before{
    content:"+\0000a0"
}



/*************************************************
*  Calendar: New Event - Tag
*************************************************/
.eventTag .actionBarEventTag,
.eventTag .contentEventTag{
    display:block;
}
.eventTag .contentEventTag .formLayout section .inputGroupDiv div:after{
    display:none;
}
.eventTag .contentEventTag .formLayout section .inputGroupDiv div{
    padding:0 0 0 10px;
}
.eventTag .contentEventTag .formLayout>section{
    border-bottom:none;
}



/*************************************************
*  Calendar: New Event - Time
*************************************************/
.eventTime .actionBarEventTime,
.eventTime .contentEventTime{
    display:block;
}



/*************************************************
*  Calendar: New Event - Invite
*************************************************/
.eventInvite .actionBarEventInvite,
.eventInvite .contentEventInvite{
    display:block;
}



/*************************************************
*  Calendar: New Event - Share
*************************************************/
.eventShare .actionBarEventShare,
.eventShare .contentEventShare{
    display:block;
}



/*************************************************
*  Calendar: New Event - Repeat
*************************************************/
.eventRepeat .actionBarEventRepeat,
.eventRepeat .contentEventRepeat{
    display:block;
}
#addPost .pickTags .formLayout,
#addPost .pickTags .formLayout>section{
    border-bottom:0;
    padding:0;
    padding-bottom:0;
    overflow:visible;
}
.eventRepeat .contentEventRepeat .formLayout>section{
    border-bottom:0;
}
.eventRepeat .contentEventRepeat .repeatDayPicker{
    margin-top:-10px;
    display:none;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
}
.eventRepeat .contentEventRepeat .repeatDayPicker label.repeatFrequency{
    position: absolute;
    line-height: 40px;
    margin-top: -1px;
    margin-left: 30px;
    color:#666;
    font-size:18px;
}

.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles{
    padding:0;
    border-bottom:none;
    margin-top:-45px;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:after{
    top:8px;
    background-position:-214px -854px;
    border-color:#53c8e6;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:before{
    content:"";
    display:block;
    height:50px;
    width:10px;
    background-position:-156px -1316px;
    position:absolute;
    right:12px;
    top:-7px;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles select{
    padding:0 25px 0 200px;
    color:#1ca0c8;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .inputGroupH{
    margin-top:0;
    padding-top:6px;
    border:none;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .inputGroupH:after{
    display:none;
}
.eventRepeat .contentEventRepeat .repeatDayPicker .inputGroupH label{
    padding: 0 8px;
    border-radius: 0;
    background: #fff;
    border: 1px solid #e4e5ed;
    margin: 0 -1px;
}
.eventRepeat .formLayout .inputGroupH input:checked + label, .eventRepeat .formLayout .inputGroupH label.genderSelected {
    color: #fff;
    border-color: #53c8e6;
    background-color: #53c8e6;
}



/*************************************************
*  Calendar: New Event - Repeat
*************************************************/
.eventEndRepeat .actionBarEventEndRepeat,
.eventEndRepeat .contentEventEndRepeat{
    display:block;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section{
    padding:0;
    line-height:25px;
    text-indent:0;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section label{
    /*font-size:18px;*/
    font-size:15px;
    text-indent:40px;
    text-indent: 40px;
    display: block;
    box-sizing: border-box;
    padding:12px 0;
    position:relative;
    z-index:1;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section input{
    margin:-38px 0 -12px 0;
    padding:0 10px 0 40px !important;
    width:100%;
    margin-left:-40px;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section.separateTime input{
    display:inline-block;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section.separateTime .dateControl{
    position:relative;
    z-index:1;
}
/*.eventEndRepeat .contentEventEndRepeat .formLayout>section input:focus{
    background:rgba(0,182,255,.1) !important;
}*/
.eventEndRepeat .contentEventEndRepeat .formLayout>section.numberOccurrences input{
    padding:0 10px 0 225px !important;
    margin-left:0;
    position:relative;
    z-index:1;
    cursor:pointer;
}
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime .altDatePicker,
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime label>span{
    min-height:46px;
    padding-left:150px;
    display:block;
    margin-top:-46px;
    background-color:transparent !important;
    border:none !important;
}
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime label>span{
    margin-bottom:-12px;
    min-height:55px;
}
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime label>span input:focus{
    background-color:transparent !important;
    border:none !important;
}
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime.selected label>span{
    background:rgba(0,182,255,.1) !important;
}
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime .altDatePicker .datePicker,
.eventEndRepeat .contentEventEndRepeat .formLayout .separateTime label>span input{
    margin-top:8px;
    padding-left:150px;
    margin-top: 18px;
    background: transparent;
    margin-left: 0;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section:after{
    content:"";
    width:18px;
    height:18px;
    position:absolute;
    left:10px;
    top:13px;
    border:2px solid #ccc;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
}
.eventEndRepeat .contentEventEndRepeat .formLayout>section.selected:after{
    background-position:-214px -854px;
    background-position:-214px -855px;
    border-color:#53c8e6;
}
.eventEndRepeat .contentEventEndRepeat .validationMsg{
    ine-height:1.25;
    text-indent:0;
    padding:3px 10px 0px 10px;
    margin-top:0;
    font-size:15px;
    font-weight:normal;
    color:#aa4749;
}
/*#CalendarControl.isVisible ~ .Desktop .eventEndRepeat .contentEventEndRepeat .dateControl{
    height:310px;
}
#CalendarControl.isVisible ~ .Desktop .eventEndRepeat .contentEventEndRepeat .formLayout .separateTime .altDatePicker{
    background:rgba(0,182,255,.1) !important;
    min-height:54px;
}
#CalendarControl.isVisible ~ .Desktop .eventEndRepeat .contentEventEndRepeat .dateControl .datePicker{
    background:none !important;
}*/






/*************************************************
*  Calendar: New Event - Alert
*************************************************/
.eventAlert .actionBarEventAlert,
.eventAlert .contentEventAlert{
    display:block;
}

.eventAlert .contentEventAlert .formLayout>section{
    border-bottom:0;
    padding:0;
}
.formLayout section .inputGroupDiv .alertTime{
    z-index:auto;
}
.formLayout section .inputGroupDiv .alertTime div{
    padding:0;
    border:0;
}
.formLayout section .inputGroupDiv .alertTime>div{
    padding:1px 0 0 0;
}
.formLayout section .inputGroupDiv .alertTime .separateTime{
    margin-top:18px;
    border:none;
    background:transparent;
    margin-left:40px;
}
.formLayout .alertTime .separateTime .datePicker, .formLayout .separateTime .timePicker .onlyTime{
    border:1px solid transparent;
    line-height: 26px;
    padding: 0 10px;
    width: 100px;
}
.formLayout .alertTime .separateTime,
.formLayout .alertTime .separateTime .dateControl,
.formLayout .alertTime .separateTime .dateControl li:focus{
    outline:none;
}



/****************************************************
*  Calendar: New Event - Volunteer Occurrence Picker
****************************************************/
.formLayout section.volunteerOccurrence{
    padding:10px 5px;
}
.volunteerOccurrence h2{
    line-height:24px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.volunteerOccurrence h3{
    line-height:24px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.volunteerOccurrence.drillDown:after{
    top:20px;
}



/*************************************************
*  Calendar: View Event Details
*************************************************/
.calendarEventDetails{
    padding-bottom:46px;
}
.calendarEventDetails .calendarInvite{
    padding-left:0;
}
.calendarEventDetails .calendarInvite .hgroup h2{
    height:auto;
    text-indent:0;
    padding:0 20px;
    line-height:20px;
    margin-top:20px;
    word-wrap: break-word;
}
.calendarEventDetails .calendarInvite .hgroup h2 .profileM{
    text-indent:0;
    position:relative;
    margin-top:13px;
    height:auto;
}
.calendarEventDetails .calendarInvite .hgroup h2 .profileM:before{
    display:none;
}
.calendarEventDetails .calendarInvite .hgroup h2 .profileM:after{
    text-indent:0;
    margin:0;
    padding:0;
}
.calendarEventDetails .calendarInvite h3{
    margin-top:-9px;
    margin-bottom:21px;
    line-height: 1.3;
}
.calendarEventDetails .scrollView{
    border-bottom:none;
}
.calendarEventDetails .contentArea{
    padding-bottom:0;
}
.calendarEventDetails .chatInput{
    bottom:auto;
}
.calendarEventDetails .chatInput button.like{
    display:none;
}
.calendarEventDetails .postOptions{
    border-top:none;
    border-top:1px solid rgba(195,195,195,.4);
    bottom:0;
    position:absolute;
    width:100%;
}
.calendarEventDetails section.messages{
    margin-bottom:10px;
}
.calendarInviteDetail .acceptanceStatus{
    display:none;
    margin:-25px 0 0 -10px;
    padding:12px 10px 12px 10px;
    width:100%;
    line-height:8px;
    color:#fff;
    text-shadow:none;
    margin:-25px -10px 10px -10px;
    width: auto;
    font-family: gotham-book;
    font-weight: normal;
    font-size: 14px;
}
.calendarInviteDetail .acceptanceStatus span {
    display:block;
    line-height:1.25;
    padding:0 5px 0 25px;
    margin-bottom:3px;
}
.calendarInviteDetail .acceptanceStatus span:last-child {
    margin-bottom:0;
}
.calendarInviteDetail .acceptanceStatus span:first-child {
    font-family: gotham;
    font-size: 16px;
}
.calendarInviteDetail .acceptanceStatus a{
    color:#fff;
    text-decoration:underline;
}
.eventMine .calendarInviteDetail .calendarInvite{
    padding-bottom:0;
}
.calendarInviteDetail .acceptanceStatus:before{
    content:"";
    display:inline-block;
    vertical-align:middle;
    border: none;
    width:20px;
    height:40px;
    margin:-9px 0 0 6px;
    padding:0;
    position:absolute;
}
.eventAccepted .calendarInviteDetail .acceptanceStatus{
    display:block;
    background-color:#80ae00;
    border-top:1px solid #6c9600;
}
.eventAccepted .calendarInviteDetail .acceptanceStatus:before{
    background-position:-281px -481px;
    width:15px;
}
.eventDeclined .calendarInviteDetail .acceptanceStatus{
    display:block;
    background-color:#ff6e6b;
    border-top:1px solid #ce5753;
}
.eventDeclined .calendarInviteDetail .acceptanceStatus:before{
    background-position:-347px -481px;
    width:11px;
}
.eventTentative .calendarInviteDetail .acceptanceStatus{
    display:block;
    background-color:#f3c669;
    border-top:1px solid #d8ab49;
}
.eventTentative .calendarInviteDetail .acceptanceStatus:before{
    background-position:-410px -481px;
    width:11px;
}
.eventOther .calendarInviteDetail .acceptanceStatus{
    display:block;
    background-color:#aaa;
}
.eventAlertDetailsPage{
    padding-bottom:0px;
}
.eventAlertDetailsPage .scrollView{
    background:#fff;
}




/*************************************************
*  Calendar: View Event Details (Tabs)
*************************************************/
.calendarEventTabs{
    background:rgba(239,239,239,.98);
    height:44px;
    width:100%;
    line-height:44px;
    padding:18px 10px 0 10px;
    margin:0 0 0 -10px;
    border-bottom:1px solid #c3c3c3;
    box-sizing:content-box;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:-18px;
    z-index:15;
    background: #fff;
    margin: 0;
    width: auto;
    padding: 0;
    border: 0;
}
/*.calendarEventTabs:before{
    content:"";
    background: -moz-linear-gradient(top,  rgba(232,232,232,1) 0%, rgba(232,232,232,0) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(232,232,232,1)), color-stop(100%,rgba(232,232,232,0)));
    background: -webkit-linear-gradient(top,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%);
    background: -o-linear-gradient(top,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%);
    background: -ms-linear-gradient(top,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%);
    background: linear-gradient(to bottom,  rgba(232,232,232,1) 0%,rgba(232,232,232,0) 100%);
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#00e8e8e8',GradientType=0 )";
    display:block;
    height:18px;
    width:100%;
    position:absolute;
    margin:-18px 0 0 -15px;
}*/
.calendarEventTabs+div,
.calendarEventTabs+section{
    margin-top:2px;
}
.calendarEventTabs~div,
.calendarEventTabs~section{
    position:relative;
    z-index:10;
}
.calendarEventTabs ul{
    list-style:none;
    display:table;
    text-align:center;
    width:100%;
    margin:0;
    padding:0;
    overflow:visible;
    background:#fff;
}
.calendarEventTabs li.tabVolunteers,
.calendarEventTabs li.tabComments,
.calendarEventTabs li.tabAttendees{
    cursor:pointer;
}
.calendarEventTabs li{
    display:table-cell;
    font-size:15px;
    position:relative;
    color:#707b7f;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.calendarEventTabs li.selected:after{
    content:"";
    height:2px;
    width:100%;
    display:block;
    position: absolute;
    z-index: 15;
    left: 0;
    bottom: 0;
    right: 0;
}
.calendarEventTabs li.selected.tabVolunteers:after{
    background:#fd82ab;
}
.calendarEventTabs li.selected.tabComments:after{
    background:#33add7;
}
.calendarEventTabs li.selected.tabAttendees:after{
    background:#80ad00;
}

.calendarEventTabs ~ .calendarInviteDetail{
    margin:0;
}
.calendarEventTabs ~ .calendarInviteDetail .eventAttendees{
    padding:0 10px;
    width:100%;
    box-sizing:content-box;
    /*margin:0 0 0 -10px;*/
    box-shadow:none;
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    margin:0;
    width:auto;
}
.calendarEventTabs ~ .calendarInviteDetail .eventAttendees h2{
    padding:0 10px;
    width:100%;
    /*margin-left:-10px;*/
}
.calendarEventTabs ~ .messages .message,
.calendarEventTabs ~ .messages .message:last-of-type{
    padding:15px 10px !important;
    box-sizing:content-box;
    width:100%;
    margin-left:-10px;
    box-shadow:none;
    border:none;
    -moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
    border-radius:0 !important;
}
.calendarEventTabs ~ section:last-of-type{
    margin-bottom:0;
}



/*************************************************
*  Calendar: Volunteer Details View
*************************************************/
.calendarInstanceSwitcher{
    text-align:center;
    margin-top:-30px;
    border-bottom:1px dashed rgba(0,0,0,.1);
    padding:0 15px;
    width:100%;
    margin-left:-15px;
}
.calendarInstanceSwitcher ul{
    list-style:none;
    display:table;
    padding:0;
    margin:0;
    width:100%;
}
.calendarInstanceSwitcher li{
    display:table-cell;
    height:60px;
    vertical-align:top;
}
.calendarInstanceSwitcher .instanceSwitcher{
    cursor:pointer;
}
.calendarInstanceSwitcher .date{
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    display:block;
    color:#707b7f;
    font-size:21px;
    padding-top:11px;
    margin-bottom:-5px;
}
.calendarInstanceSwitcher .link{
    color:#1ca0c8;
    font-size:14px;
}
.calendarInstanceSwitcher .prevBtn,
.calendarInstanceSwitcher .nextBtn{
    text-indent:-9999px;
    position:relative;
    width:40px;
    line-height:60px;
    font-size:30px;
}
.calendarInstanceSwitcher .prevBtn a,
.calendarInstanceSwitcher .nextBtn a{
    display:block;
    width:100%;
    padding:0 7px;
    position:relative;
}
.calendarInstanceSwitcher .prevBtn a{
    margin-left:-14px;
}
.calendarInstanceSwitcher .prevBtn a:after,
.calendarInstanceSwitcher .nextBtn a:after{
    color:#707b7f;
    position:absolute;
    cursor:pointer;
    width:40px;
    display:block;
    text-indent:0;
    top:0;
}
.calendarInstanceSwitcher .prevBtn.disabled a:after,
.calendarInstanceSwitcher .nextBtn.disabled a:after{
    color:#c9c9c9;
}
.calendarInstanceSwitcher .prevBtn a:after{
    content:"«";
}
.calendarInstanceSwitcher .nextBtn a:after{
    content:"»";
}



/*************************************************
*  Calendar: Volunteer Details View: Requests
*************************************************/
.volunteerRequests{
    /*padding:0 15px 0 15px;*/
    margin:0 !important;
}
.volunteerRequests article{
    margin-bottom:0;
    padding:10px 25px 25px 25px;
    box-shadow:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:none;
    border-bottom:1px dashed #e4e5ed;
    background:#fff;
    width:100%;
    box-sizing:content-box;
    /*margin-left:-25px !important;*/
    width:auto;
}
.volunteerRequests article:last-of-type{
    border-bottom:none;
}
.volunteerRequests article h2{
    margin:2px 0 -6px 0;
}
.volunteerRequests article>h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    overflow:visible;
    height:auto;
    line-height:20px;
    padding-bottom:7px;
    padding-right:60px;
    padding-top:7px;
}
.volunteerRequests article p{
    font-size:14px;
    color:#000;
}
.volunteerRequests article p span:empty{
    display:none;
}




.volunteerRequests article button{
    margin: 0;
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 14px;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    height: 30px;
    line-height: 30px;
    padding: 0px 15px;
    background: #53c8e6;
    font-weight: bold;
    border: 0;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    color: #fff;
}
.volunteerRequests article button:before{
    content:attr(data-signup);
}
.volunteerRequests article time{
    color:#000;
}
.volunteerRequests label{
    color:#707b7f;
    text-align:center;
    display:block;
    line-height:33px;
    background:rgba(242,242,242,.98);
    padding:0 25px;
    width:100%;
    margin-left:-25px;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    top:45px;
    z-index:1;
}
.volunteers .volunteerProfile{
    padding:18px 0 0 40px;
    overflow:hidden;
}
.volunteers .volunteerProfile:before{
    content:"";
    display:block;
    width:2px;
    height:66px;
    background:#e4e5ed;
    position:absolute;
    left:33px;
    margin-top:-18px;
}
.volunteers .volunteerProfile:last-of-type:before{
    height:40px;
}
.volunteers .volunteerProfile .quantity{
    position:absolute;
    color:#fff;
    margin:0 0 0 -38px;
    width:24px;
    height:24px;
    line-height:24px;
    display:block;
    background:#ace67a;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    text-align:center;
    text-shadow:none;
}
.volunteers .volunteerProfile .quantity{
    position:absolute;
    color:#fff;
    margin:0 0 0 -38px;
    width:24px;
    height:24px;
    line-height:24px;
    display:block;
    background:#ace67a;
    -moz-border-radius:12px;
    -webkit-border-radius:12px;
    border-radius:12px;
    text-align:center;
    text-shadow:none;
}
.volunteers article .hgroup{
    margin-top:0;
}
.volunteers .hgroup h2:before,
.volunteers .hgroup h2:after{
    display:none;
}
.volunteers article .hgroup .profileM:after{
    text-indent:45px;
}
.volunteers .hgroup .signupComment{
    white-space:normal;
    margin-top:2px;
    overflow:visible;
    line-height:1.25;
    height: auto;
    display:block;
}
.volunteers .hgroup span+.signupComment{
    margin-top:8px;
}
.volunteers .hgroup .signupComment:before{
    content:"\201C";
}
.volunteers .hgroup .signupComment:after{
    content:"\201D";
}
.volunteerRequests article button.viewAllOccurrences{
    position: relative;
    margin: 0;
    width: 100%;
    top: auto;
    right: auto;
    font-size: 14px;
    color: #fff;
    text-shadow: none;
    background: #53c8e6;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    text-indent: 0;
    border-radius: 50px;
    font-weight: bold;
    border: 0;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
}





/***************************************************
*  Calendar: Volunteer Details View: Request Filled
****************************************************/
.volunteerRequests article.filled h2{
    text-decoration:line-through;
    text-shadow:none;
}
.volunteerRequests article.filled h2:before,
.volunteerRequests article.filled h2:after{
    content:"\0000a0";
}
.volunteerRequests article.filled button{
    background:#ededed;
    border:1px solid #d5d5d5;
    border-bottom:1px solid #bbb;
    color:rgba(0,0,0,.3);
}
.volunteerRequests article.filled button:before{
    content:attr(data-filled);
}
.accountSettingsPassword .formLayout #changePasswordForm_oldpassword2 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    background: transparent;
    width: 100%;
    padding: 0 10px 0 140px;
    height: 50px;
    font-size: 15px;
    color: #666;
    margin-top: -48px;
    border: 1px solid transparent;
    -webkit-appearance: none;
    cursor: text;
}

/**************************************************************************
*  Account Settings
***************************************************************************/
.accountSettingsPassword .formLayout input[type='text'],
.accountSettingsPassword .formLayout input[type='email'],
.accountSettingsPassword .formLayout input[type='password'],
.accountSettingsPassword .formLayout #changePasswordForm_oldpassword2{
    padding-left:160px;
}

.accountSettingsPassword .changePhone input[type='text'],
.accountSettingsPassword .changePhone input[type='tel'],
.accountSettingsPassword .changePhone input[type='password']{
    padding-left:180px !important;
}




/**************************************************************************
*  Calendar Settings
***************************************************************************/
.calendarToggle{
    overflow: hidden;
    text-overflow:ellipsis;
    padding-right: 60px !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.calendarToggle label{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.calendarToggle>label{
    display:block;
    position:relative;
}
.formLayout section.calendarToggle  .switchControl input + label,
.calendarToggle .switchControl label{
    width:60px;
    position:absolute;
    right:0;
    left:auto;
}
.calendarToggle label .calendarColor{
    width:16px;
    height:16px;
    display:inline-block;
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
    border-radius:8px;
    vertical-align:middle;
    margin:-5px 10px 0 5px;
    display:none; /* Hiding until we have cal colors */
}



/**************************************************************************
*  Email Settings
***************************************************************************/
#emailSettings div.formPadding>.formLayout>section{
    text-indent:0;
}
#emailSettings div.formPadding>.formLayout>section>label{
    display:block;
    padding:10px 60px 10px 10px;
    line-height:1.5;
}



/**************************************************************************
*  User Profile classes:
*
*  class="profileMine"
*  class="profileMySpouse"
*  class="profileMyChild"
*  class="profileOthers"
*  class="profileOrg"
*
*  class="editProfileMine"
*  class="editProfileMyChild"
*  class="editClassCircle"
*
*  class="freProfileMine"
*  class="freProfileTeacher"
*
*  class="invitationPersonal"
*  class="invitationGroup"
*
***************************************************************************/


/* Defaults */
.profilePage .nextButton,
.profilePage .myFamily,
.profilePage .mySpouse,
.profilePage .myProfile,
.profilePage .myChildProfile,
.profilePage .howConnected,
.profilePage .commonConnections,
.profilePage .userConnections,
.profilePage .suggestedConnections,
.profilePage .suggestByCircles,
.profilePage .theirProfile,
.profilePage .theirFamily,
.profilePage .theirChildProfile,
.profilePage .childActivities,
.profilePage .editMyProfile,
.profilePage .myInfoEdit,
.profilePage .editMyChildProfile,
.profilePage .actionBarEditProfile,
.profilePage .childInfoEdit,
.profilePage .actionBarFREProfile,
.profilePage .friendRequests,
.profilePage .howManyCircles,
.profilePage .editCircleColor,
.profilePage .circleInfoEdit,
.profilePage .studentRoster,
.profilePage .childAttributeCoachMarks,
.profilePage .invitationMessage{
    display:none;
}



/* Profile Mine */
.profileMine .friendRequests,
.profileMine .nextButton,
.profileMine .myFamily,
.profileMine .myProfile,
.profileMine .userConnections,
.communityProfilePage .nextButton,
.profilePage.communityRequest .nextButton,
.profilePage.getVerified .nextButton{
    display:block
}



/* Profile My Spouse */
.profileMySpouse .mySpouse,
.profileMySpouse .theirProfile,
.profileMySpouse .commonConnections,
.profileMySpouse .userConnections{
    display:block
}



/* Profile My Child */
.profileMyChild .nextButton,
.profileMyChild .myChildProfile,
.profileMyChild .childActivities{
    display:block
}



/* Profile Other's */
.profileOthers .howConnected,
.profileOthers .theirProfile,
.profileOthers .theirFamily,
.profileOthers .commonConnections,
.profileOthers .userConnections{
    display:block;
}


/* Profile Other's Child */
.profileOthersChild .theirChildProfile,
.profileOthersChild .childActivities{
    display:block
}



/* Profile Org */
.profileOrg .userProfileInfo,
.profileOrg .nextButton{
    display:block;
}


/* Profile My Student */
.profileMyStudent .nextButton,
.profileMyStudent .howConnected,
.profileMyStudent .theirProfile,
.profileMyStudent .theirFamily,
.profileMyStudent .commonConnections,
.profileMyStudent .userConnections{
    display:block;
}


/* Edit Profile Mine */
.editProfileMine .actionBar,
.editProfileMine .scrollView>.contentArea,
.editProfileMine .genderPicker{
    display:none;
}
.editProfileMine .actionBarEditProfile,
.editProfileMine .nextButton,
.editProfileMine .editMyProfile,
.editProfileMine .myInfoEdit{
    display:block;
}
.editProfileMine.showCoachMarks .coachMarkClick,
.editProfileMine.showCoachMarks .scrollView>.formLayout:before{
    display:none;
}



/* Edit Profile My Child */
.editProfileMyChild .actionBar,
.editProfileMyChild .scrollView>.contentArea{
    display:none;
}
.editProfileMyChild .actionBarEditProfile,
.editProfileMyChild .nextButton,
.editProfileMyChild .editMyChildProfile,
.editProfileMyChild .childInfoEdit{
    display:block;
}



/* Edit Class Circle */
.editClassCircle .actionBar,
.editClassCircle .scrollView>.contentArea .updates{
    display:none;
}
.editClassCircle .actionBarEditProfile,
.editClassCircle .nextButton,
.editClassCircle .editCircleColor,
.editClassCircle .circleInfoEdit,
.editClassCircle .studentRoster{
    display:block;
}



/* FRE Complete My Profile */
.freProfileMine .actionBar,
.freProfileMine .scrollView>.contentArea{
    display:none;
}
.freProfileMine .friendRequests,
.freProfileMine .actionBarFREProfile,
.freProfileMine .nextButton,
.freProfileMine .editMyProfile,
.freProfileMine .myFamily,
.freProfileMine .suggestedConnections,
.freProfileMine .suggestByCircles{
    display:block
}



/* FRE Complete Teacher Profile */
.freProfileTeacher .actionBar,
.freProfileTeacher .scrollView>.contentArea{
    display:none;
}
.freProfileTeacher .actionBarFREProfile,
.freProfileTeacher .nextButton,
.freProfileTeacher .editMyProfile,
.freProfileTeacher .howManyCircles,
.freProfileTeacher .suggestByCircles{
    display:block
}



/* Invitation: Personal */
.invitationPersonal .theirProfile,
.invitationPersonal .invitationMessage{
    display:block;
}
.invitationPersonal .updates{
    display:none;
}



/* Invitation: Group */
.invitationGroup .theirProfile,
.invitationGroup .invitationMessage{
    display:block;
}
.invitationGroup .updates{
    display:none;
}



/*************************************************
*  User Profile Page
*************************************************/
.profilePage .formLayout section input[type='date']{
    padding-right:30px;
}
.profilePage .formLayout section h2{
    font-family: Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    text-indent:0;
    margin-top:14px;
}
.profilePage .formLayout section h2 .profileXL img{
    width:71px;
    width:100%;
    height: 100%;
    margin: 0 0 0 -1px;
    object-position: center center;
    object-fit: cover;
}
.profilePage .formLayout section h3 span{
    display:block;
    margin: 8px 0;
    line-height: 1.2;
}
.profilePage .formLayout section.drillDown:after{
    top:14px;
}
.profilePage .formLayout section.horizontalList{
    border:none;
    box-shadow:none;
}
.profilePage .actionBar h1{
    padding:4px 88px;
}



/*************************************************
*  User Profile: Profile Info
*************************************************/
.profilePage .formLayout section.userProfileInfo{
    background:#006b8d;
    text-align:center;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:3px 0 12px 0;
    border-bottom:1px solid inherit;
    padding:10px;
}
.profilePage .userProfileInfo>h2{
    color:#fff;
    text-shadow:none;
    text-align:center;
    text-indent:0;
    margin-top:15px;
    line-height:1.25;
}
.profilePage .userProfileInfo>h3{
    color:#fff;
    text-shadow:none;
    margin:10px 0;
    text-indent:0;
    white-space:normal;
}
.profilePage .userProfileInfo>h3 + h3{
    margin-top:3px
}
.profilePage .userProfileInfo h3:empty{
    display:none;
}
.profilePage .userProfileInfo>h3 span{
    display:block;
    line-height:16px;
    font-size:14px;
}
.profilePage .userProfileInfo>h3 span:first-of-type{
    font-size:15px;
}
.profilePage .userProfileInfo .profileXL{
    /*border:2px solid #fff;*/
    overflow:hidden;
    /*margin-left:-1px;*/
    box-shadow:3px -3px 0px rgba(0,0,0,.2);
    -webkit-box-shadow:3px -3px 0px  rgba(0,0,0,.2);
    -moz-box-shadow:3px -3px 0px  rgba(0,0,0,.2);
}
.profilePage .userProfileInfo .profileXL {
    position:relative;
}
.profilePage .userProfileInfo .profileXL:after {
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    border:2px solid #fff;
    border-radius:50%;

}
.profilePage .userProfileInfo ul{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:table;
    width:100%;
    margin:0 0 -8px 0;
    padding:4px 8px 0 8px;
    margin: 0;
    padding: 0;
    border-radius: 4px;
    position: relative;
    overflow: hidden;
}
.profilePage .userProfileInfo .profileActions li{
    list-style:none;
    display:table-cell;
    padding:0 4px;
    text-indent:0;
    width:50%;
}
.profilePage .userProfileInfo .profileActions button{
    color:#fff;
    background:rgba(255,255,255,.2);
    border:none;
    width:100%;
    margin:0;
    height:33px;
    font-size:15px;
    line-height:35px;
    padding:0;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 1px 2px rgba(0,0,0,.1);
}
.profilePage .userProfileInfo .profileActions button:active{
    background:rgba(0,0,0,.3);
}
.profilePage .userProfileInfo .profileActions button:before{
    content:"";
    display:inline-block;
    width:26px;
    height:26px;
    line-height:26px;
    position:relative;
    vertical-align:middle;
    margin:-2px 4px 0 0;
}
.profilePage .userProfileInfo .profileActions button.addContact:before{
    background-position:-272px -847px;
}
.profilePage .userProfileInfo .profileActions button.inCircles:before{
    background-position:-588px -847px;
}
.profilePage .userProfileInfo .profileActions button.removeContact:before{
    background-position:-524px -847px;
}
.profilePage .userProfileInfo .profileActions button.sendMessage:before{
    background-position:-339px -847px;
}
.profilePage .userProfileInfo .profileActions button.changePswd:before{
    background-position:-403px -847px;
}
.profilePage .userProfileInfo .profileActions button.signOut:before{
    background-position:-467px -847px;
}
.profilePage.profileOrg .userProfileInfo .profileXL{
    border:none;
    box-shadow:none;
}
.profilePage.profileOrg .userProfileInfo .profileXL img{
    opacity:1;
    filter:alpha(opacity=100);
}
.profilePage.profileOrg .formLayout .userProfileInfo h2{
    margin-top:12px;
}
.profilePage.profileOrg .userProfileInfo .profileActions button.addContact:before{
    display:none;
}
.profilePage.profileOrg .actionBar .nextButton{
    width: 40px;
    height: 48px;
    text-indent: -9999px;
    margin-top:0;
    margin-right:5px;
}
.profilePage.profileOrg .actionBar .nextButton:after{
    content: "";
    width: 48px;
    height: 48px;
    position: absolute;
    right: 0;
    top: 0;
    background-position:-450px -415px;
}
.profilePage .userProfileInfo .communityLogo{
    width:48px;
    height:48px;
    position:absolute;
    margin-left:56px;
    margin-top:20px;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
}



/*************************************************
*  User Profile: My Profile Info
*************************************************/
.profilePage .formLayout .userProfileInfo h2{
    margin-top:9px;
    margin-bottom:0;
}
.profilePage .formLayout .userProfileInfo .inputProfile,
.profilePage .formLayout .userProfileInfo .inputProfile{
    margin:0 0 -32px -72px;
    text-align:center;
    width:inherit;
    display:inline-block;
}
.profilePage .formLayout .userProfileInfo label.chooseFile,
#orgSettings .profilePage .formLayout .userProfileInfo label.chooseFile{
    left:auto;
    padding:0;
}
.profilePage .formLayout .userProfileInfo .inputProfile .profileM,
#orgSettings .formLayout .userProfileInfo .inputProfile .profileM{
    left:auto;
}
.profilePage .formLayout .userProfileInfo .inputProfile .profileM:before,
#orgSettings .formLayout .userProfileInfo .inputProfile .profileM:before{
    display:none;
}
.profilePage .formLayout .userProfileInfo .inputProfile .profileM:after,
#orgSettings .formLayout .userProfileInfo .inputProfile .profileM:after{
    margin-left:-3px;
    padding:0;
    width:60px;
    height:72px;
    overlow:hidden;
    word-wrap:normal;
    white-space:normal;
    text-indent:0;
}



/*************************************************
*  Edit Child Profile
*************************************************/
.profilePage.editChild .formLayout .userProfileInfo .inputProfile .profileM:after{
    content:attr(data-optionalmsg);
    margin:-7px 0 0 0;
}
.profilePage.editChild .newOnly{
    display:none;
}



/*************************************************
*  New Child Profile
*************************************************/
.profilePage.newChild .formLayout section.editMyChildProfile{
    width:100%;
    padding:3px 10px 0 10px;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    margin-left:-10px;
    margin-top:-10px;
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
}
.profilePage.newChild .scrollView{
    background:#e8e8e8;
}
.profilePage.newChild .scrollView>.formLayout{
    padding:10px 10px 40px 10px;
}
.profilePage.newChild .formLayout .userProfileInfo .inputProfile .profileM:after{
    content:attr(data-optionalmsg);
    margin:-7px 0 0 0;
}
.profilePage.newChild .editOnly{
    display:none;
}
.profilePage.newChild section.autoSuggest>label{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:17px;
    background-color:transparent;
    margin:-37px 0 9px 0;
    text-indent:0;
}
.profilePage.newChild p.descript{
    margin:-7px 0 15px 0;
    color:#666;
    padding: 0 15px;
}
.profilePage.newChild section{
    border-bottom:1px solid transparent;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-top:50px;
}
.profilePage.newChild section.autoSuggest .selectedList{
    margin:0;
    padding:0;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper{
    padding-left:15px;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type{
    padding-left:0;
    padding-right:0;
    overflow:hidden;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span{
    line-height:38px;
    padding:0 15px;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span:before{
    content:"";
    width:44px;
    height:37px;
    display:block;
    background-position:-71px -1141px;
    vertical-align:middle;
    float:left;
    margin-left:-15px;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:nth-last-child(2){
    margin-bottom:15px;
}
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper span.textInput{
    display:block;
    width:100%;
    color:#fff;
    margin:0;
    border-top:1px solid #e4e5ed;
    background: #53c8e6;
    border-top-left-radius:0;
    border-top-right-radius:0;
}
.profilePage.newChild .newOnly.knownAs{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    box-shadow:0px 1px 2px rgba(0, 0, 0, .09);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.profilePage.newChild .newOnly.knownAs h1{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size:17px;
    padding:0;
    margin:-32px 0 8px 0;
    text-indent:0;
    font-weight:normal;
}
.profilePage.newChild .newOnly.knownAs label{
    display:table;
    width:100%;
    overflow:hidden;
    border-top:1px solid #e4e5ed;
    color:#8e8e8e;
}
.profilePage.newChild .newOnly.knownAs span{
    display:table-cell;
    white-space:nowrap;
    text-indent:0;
    font-size:18px;
}
.profilePage.newChild .newOnly.knownAs span.parent{
    max-width:119px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-right:10px;
    text-indent:15px;
    position:relative;
}
.profilePage.newChild .newOnly.knownAs .descript{
    padding:0 15px 15px 15px;
    margin:5px 0 0 0;
}
.profilePage.newChild .newOnly.knownAs span.parent:after{
    content:"\0000a0(";
    position:absolute;
    right:3px;
    text-indent:0;
}
.profilePage.newChild .newOnly.knownAs span.relationship{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 10px 0 2px;
}
.profilePage.newChild .newOnly.knownAs span.relationship:after{
    content:")";
}
.profilePage.newChild .newOnly.knownAs span.child input{
    background:#ffffe4;
    border-color:#f5f5d6 #ededcf #dbdbbc #ededcf;
    padding:0;
    display:inline;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0 0 0 5px;
    width:auto;
    width:100%;
    height:33px;
    /*-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;*/
    border-radius:0;
    background:transparent;
    border-color:transparent;
}
.profilePage.newChild .newOnly.knownAs span.child input:focus{
    color:#000;
}
.profilePage.newChild .knownAs .validationMsg,
.profilePage.newChild .knownAs.newOnly .validationMsg{
    display:block;
    padding:5px;
    text-indent: 10px;
    font-size: 12px;
}



/*************************************************
*  FRE: Invitation Card
*************************************************/
.userProfileInfo .theirProfile>h3,
.userProfileInfo .theirProfile .profileActions{
    display:none;
}
.userProfileInfo .invitationMessage{
    text-align:left;
    padding:0;
}
.userProfileInfo .invitationMessage .invitesWrapper{
    padding:10px 10px 0 10px;
}
.userProfileInfo .invitationMessage article{
    padding:10px 10px 5px 10px;
    background:rgba(255,255,255,.9);
    box-shadow: 0 4px 5px rgba(37,37,37,0.15);
    vertical-align:top;
}
.userProfileInfo .invitationMessage .profileM:after{
    padding:0;
}
.userProfileInfo .invitationMessage h3{
    margin-top:0;
    text-indent:0;
    color:#006a8e;
    overflow:visible;
    white-space:normal;
    margin-top: -16px;
}
#signUpGroupCode .userProfileInfo .invitationMessage h3{
    margin-top: -20px !important;
}
.userProfileInfo .invitationMessage h2 + h3.inviteMessage{
    color:#000;
}
.userProfileInfo .invitationMessage h3 + h3{
    margin-top:-3px;
    color:#000;
}
.userProfileInfo .invitationMessage h3 span{
    line-height:19px;
    height:auto;
}
.userProfileInfo .invitationMessage p{
    padding:0;
}
.userProfileInfo .invitationMessage .communityLogo{
    position:static;
    margin:8px auto 5px auto;
    display:block;
}
.profilePage.spouseInvite .acceptanceButtons ul{
    margin-top:0;
}
.invitationMessage h2 {
    height: 28px;
}
.invitationMessageSignature {
    height: 32px;
    text-indent: 2px !important;
}




/* Child Profile */
.invitationPersonal .childProfile{
    padding:10px 15px 15px 15px;
    border-bottom:1px solid #f2f2f2;
    position:relative;
}
.invitationPersonal .childProfile h3:first-of-type{
    margin-top:-32px;
}
.invitationPersonal .childProfile h3{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:50px;
}



.invitationPersonal .childProfile .remove{
    width:42px;
    height:42px;
    text-indent:-9999px;
    position:absolute;
    top:8px;
    right:5px;
    border:none;
    background-position:-647px -1318px;
    background-color:transparent;
    opacity:.4;
    filter:alpha(opacity=40);
}
.invitationPersonal .childProfile .remove:hover,
.invitationPersonal .childProfile .remove:active{
    opacity:1;
    filter:alpha(opacity=100);
}
.invitationPersonal .childProfile .undo{
    color:#1ca0c8;
    border:none;
    font-size:13px;
    position:absolute;
    right:10px;
    top:20px;
}
.invitationPersonal .childProfile.removed .profileM:after{
    color:#8e8e8e;
    text-decoration:line-through;
    text-shadow:none;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.invitationPersonal .childProfile.removed .profileM img{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    opacity:0.4;
    filter:alpha(opacity=40);
}



/* Carousel */
.userProfileInfo .invitationMessage .carousel{
    padding-left:0;
    padding-right:0;
    padding-bottom:10px;
    margin-bottom:-1px;
}
.userProfileInfo .invitationMessage .carousel article{
    display:inline-block;
    width:85%;
    white-space:normal;
    margin:0 6px 0 0;
}
.userProfileInfo .invitationMessage .carousel article.singleProfile{
    display:inline-block;
    width:96%;
    white-space:normal;
    margin:0 6px 0 0;
}


/* Personal Invites */
.invitationPersonal .invitationMessage h2 img,
.invitationPersonal .invitationMessage h2 .profileM:before{
    display:none;
}
.invitationPersonal .invitationMessage .hgroup{
    padding:0;
}
.invitationPersonal .invitationMessage .profileM:after{
    margin-left:0;
    text-indent:0;
}


/* Joining Group: Get Verified */
.getVerified .userProfileInfo h3{
    color:#000;
    padding:0 10px 5px 10px;
}
.getVerified .userProfileInfo h3 span{
    display:block;
    background:rgba(255,255,255,.9);
    box-shadow:0px 1px 2px rgba(0, 0, 0, .4);
    padding:10px;
    border:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    line-height:1.25;
    text-align:left;
    text-shadow:#fff 0px 1px 0px;
}
.getVerified .userProfileInfo h3 span em{
    display:block;
    font-style:normal;

}
.getVerified.profilePage .formLayout section h2{
    margin-top:0;
}
.getVerified.profilePage .inviteCircles .peopleListing .formLayout section .hgroup{
    border-bottom:1px solid #f2f2f2;
}




/*************************************************
*  FRE: Acceptance Control
*************************************************/
.profilePage div.formPadding>.formLayout.acceptanceButtons{
    padding:0;
    border:none;
    box-shadow:none;
    background:transparent;
}
.profilePage .acceptanceButtons ul{
    list-style:none;
    display:table;
    width:100%;
    padding:0;
    margin:10px 0;
}
.profilePage .acceptanceButtons li{
    display:table-cell;
    padding-right:10px;
    width:50%;
}
.profilePage .acceptanceButtons li:last-of-type{
    padding-right:0;
}
.profilePage .acceptanceButtons button{
    width:100%;
}
/*.profilePage .acceptanceButtons button.defaultBtn{
    border:1px solid #cfcfcf;
    border-bottom:1px solid #e4e5ed;
}*/
.profilePage .formPadding + .acceptanceButtons{
    margin-top:-18px;
}



/*************************************************
*  User Profile: How Connected
*************************************************/
.profilePage .howConnected .profileM{
    margin-right:20px;
}
.profilePage .howConnected .circles{
    display:inline-block;
    position:relative;
    vertical-align:top;
    margin-top:-18px;
    height:90px;
    width:54px;
    margin-right:15px;
}
.profilePage .howConnected .circles button{
    margin:0;
}
.profilePage .howConnected .profileM:before{
    content:"";
    width:17px;
    height:17px;
    display:inline-block;
    position:absolute;
    margin-left:-20px;
    margin-top:12px;
    background-position:-88px -1270px;
}
.profilePage .howConnected h2 + a .profileM:before{
    display:none;
}



/*************************************************
*  User Profile: Family
*************************************************/
.profilePage .userListing{
    text-indent:0;
    padding:3px 15px 37px 15px;
}
.profilePage .formLayout section.userListing h2{
    margin:5px 0 -11px 0;
}
.profilePage .userListing .profileM{
    word-wrap:normal;
    margin-right:5px;
    width:40px;
}
.profilePage .userListing p{
    margin:-5px 0 30px 0;
    padding:0;
    font-size:15px;
    color:#8e8e8e;
}
.profilePage .filterControl{
    padding:3px 15px 5px 15px;
    margin-top:0;
}
.profilePage .formLayout section.filterControl h2{
    margin-top:14px;
    margin-bottom:4px;
}
.profilePage .filterControl a.childFilter{
    width:43px;
    height:43px;
    margin:0 6px 30px 0;
}
.profilePage .filterControl a.childFilter .profileM{
    width:40px;
    height:70px;
    border-radius:50%;
        margin-top: 0;
}
.profilePage .filterControl a.childFilter .profileM.spouseInvited{
    height:40px;
}
.profilePage .filterControl a.childFilter .profileM img{
    width:40px;
    height:41px;
    border-radius:50%;
}
.profilePage .filterControl a.childFilter .profileM:before{
    width:40px;
    height:41px;
    border-radius:50%;
}
.profilePage .filterControl a.addChild .profileM,
.profilePage .filterControl a.addSpouse .profileM{
    width:41px;
    height:42px;
    background-position:-460px -1019px;
    overflow:visible;
    border-radius:50%;
}
/*.profilePage .filterControl a.addChild .profileM:after,*/
.profilePage .filterControl a.addSpouse .profileM:after{
    margin-top:26px;
}
/*.profilePage .filterControl a.addChild,*/
.profilePage .filterControl a.addSpouse{
    margin-right:20px;
}
.profilePage .filterControl a.addSpouse + a.addChild{
    margin-left:-14px;
}
.profilePage .filterControl a.childFilter:last-of-type{
    margin-right:6px;
}
.profilePage .filterControl .addFamily{
    border-top:1px solid #e4e5ed;
    width:100%;
    padding:0 15px;
    margin-left:-15px;
}
.profilePage .filterControl .addFamily:first-of-type{
    border-top:none;
}
.profilePage .filterControl .addFamily ul{
    display:table;
    padding:0 0 0 10px;
    margin:0;
}
.profilePage .filterControl .addFamily li{
    display:table-cell;
    vertical-align:top;
    padding-top:20px;
}
.profilePage .filterControl .addFamily li p{
    padding-left:10px;
    margin-bottom:20px;
    cursor:pointer;
}
.freProfileMine.profilePage .filterControl a.childFilter{
    display:block;
}


/*************************************************
*  User Profile: Spouse Invite
*************************************************/
.profilePage .formLayout section.friendRequests{
    padding:1px 15px;
    border-bottom:none;
}
.profilePage .friendRequests .inviteRequest{
    padding:0;
    margin-bottom:25px;
}
.profilePage .friendRequests .inviteRequest h3{
    text-indent:0;
    margin-top:-21px;
    height:42px;
}



/*************************************************
*  User Profile: Connections Summary
*************************************************/
.profilePage section.circles{
    padding:3px 15px 0px 15px;
}
.profilePage section.circles h1{
    display:none;
}
.profilePage section.circles h2{
    margin:5px 0 -8px 0;
    position:static;
}
.profilePage section.circles article h3{
    text-indent:0;
    line-height:1.25;
    margin:-3px 0 5px 0;
    display:block;
    white-space:normal;
    line-height:20px;
}
.profilePage section.circles .hgroup{
    padding-left:0;
    margin:0;
}
.profilePage section.circles .hgroup>div{
    margin:0 2px 0 0;
}
.profilePage section.circles .hgroup>div:empty{
    margin:0;
}
.profilePage section.circles .hgroup .groupUserListing{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    top:96px;
    width:100%;
    font-size:13px;
    position:absolute;
    color:#666;
    word-spacing:2px;
    margin:0;
    padding:0;
    line-height:1;
}
.profilePage section.circles .hgroup .groupUserListing:after{
    content:"";
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 )"; /* IE6-9 */
    width:10px;
    height:20px;
    position:absolute;
    right:0;
    display:block;
    top:0;
}
.profilePage section.circles .hgroup .groupUserListing li{
    list-style:none;
    display:inline-block;
    margin-right:3px;
}
.profilePage section.circles .hgroup .groupUserListing li:after{
    content:",";
}
.profilePage section.circles .hgroup .groupUserListing li:last-of-type:after{
    content:"";
}
.profilePage section.circles article{
    box-shadow:none;
    border:none;
    padding:0;
}
.profilePage section.circles button.circle{
    background:none;
    height:inherit;
    width:inherit;
    padding:0;
    position:static;
    display:block;
    text-align:left;
    -moz-border-radius:none;
    -webkit-border-radius:none;
    border-radius:0;
    margin:0;
    top:0;
}
.profilePage section.circles button span.count{
    display:none;
}
.profilePage section.circles article h2 button.circle .circleName{
    font-family: Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    position:relative;
    border:none;
    font-size:18px;
    text-indent:0;
    display:inline-block;
    width:auto;
    top:0;
}
.profilePage section.circles button:before,
.profilePage section.circles button.circle .circleName:after{
    display:none;
}
.profilePage section.circles .horizontalList{
    background:transparent;
    border-bottom:0;
    margin-bottom:0;
    padding:0;
    text-indent:0;
}
.profilePage section.circles article .horizontalList h2{
    margin-top:0px;
}
.profilePage section.circles article .horizontalList .loadMore{
    font-size:18px;
    line-height:40px;
    margin-top:4px;
}



/*************************************************
*  User Profile: Suggested Connections
*************************************************/
.profilePage section.suggestedConnections article section.horizontalList{
    max-width:280px;
    display:inline-block;
    padding-bottom:0;
    vertical-align:top;
}
.profilePage section.suggestedConnections article section.horizontalList .loadMore{
    width:40px;
    height:40px;
    line-height:40px;
    margin-top:1px;
}
.profilePage section.suggestedConnections article section.horizontalList .loadMore a{
    color:#666;
}
.profilePage section.suggestedConnections article{
    margin-bottom:15px;
}
.profilePage section.suggestedConnections h3 span{
    height:inherit;
}
.profilePage section.suggestedConnections .profileM.invited{
    border:1px solid #ff6c00;
}
.profilePage section.suggestedConnections .profileM.invited img{
    border: 1px solid #fff;
    width: 38px;
    height: 38px;
}



/*************************************************
*  User Profile: Suggest by Circles
*************************************************/
.profilePage .suggestByCircles .circles article button.circle,
.profilePage .formLayout .suggestByCircles .circles button.circle{
    left:0px;
}
.profilePage .suggestByCircles h3{
    margin:11px 0 -4px 0;
    white-space:normal;
    line-height:1.25;
}
.profilePage .suggestByCircles .circles{
    display:inline-block;
    position:relative;
    vertical-align:top;
    margin:3px 0 0 0;
    height:90px;
    width:54px;
    background:#fff;
}
.profilePage .suggestByCircles .circles button{
    margin:0;
}
.profilePage .suggestByCircles .circles button .circleName:after{
    top:-39px;
}



/*************************************************
*  User Profile: Child Activities
*************************************************/
.formLayout section.childActivities{
    padding:0;
}
.profilePage .formLayout section.childActivities h2{
    margin-top:0;
    padding:17px 0 0 15px;
}
.childActivities ul{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    width:100%;
    padding:1px 13px 11px 15px;
    margin:0;
    text-indent:0;
}
.childActivities li{
    display:inline-block;
    list-style:none;
    background:#f2f2f2;
    width:33%;
    margin:-1px;
    margin-bottom:3px;
    padding-top:3px;
    text-indent:5px;
    border-left:2px solid #fff;
    white-space:nowrap;
    text-overflow:ellipsis;
}
.childActivities li:last-of-type{
    border-right:2px solid #fff;
}


/*************************************************
*  User Profile: Org Details
*************************************************/
.profilePage .orgInfoPage .contentArea{
    min-height:0;
    padding-bottom:0;
}
.profilePage .orgInfoPage .contentArea .formLayout>section.editSection .removeSection,
.Desktop .profilePage .orgInfoPage .contentArea .formLayout>section.editSection:hover .removeSection,
.Desktop .profilePage .orgInfoPage .contentArea .formLayout>section.editSection:hover .editContactInfo,
.profilePage .orgInfoPage .contentArea .formLayout>section.editSection:hover .removeSection,
.profilePage .orgInfoPage .contentArea .formLayout>section.editSection:hover .editContactInfo{
    display:none;
}
.profilePage .orgInfoPage .contentArea .editSection div h2{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}



/*************************************************
*  User Profile: Edit My Profile
*************************************************/
.editProfileMine .formLayout section.myInfoEdit{
    padding:0;
    border-bottom:none;
}
.editProfileMine .formLayout section:last-of-type{
    border-bottom:1px solid #e4e5ed;
}
.editProfileMine .scrollView{
    background:#fff;
}



/*************************************************
*  User Profile: Edit Child Profile
*************************************************/
.editProfileMyChild .formLayout section.editMyChildProfile{
    padding-bottom:0;
}
.editProfileMyChild .formLayout .circleColorPicker{
   margin-bottom: 0;
    margin: auto;
    padding: 5px;
    border-radius: 4px;
    box-sizing: border-box;
}
.editProfileMyChild .formLayout section.childInfoEdit{
    padding:0;
    border-bottom:none;
}
.editProfileMyChild .scrollView{
    background:#fff;
}
.editProfileMyChild .formLayout{
    border-bottom:none;
}
.editProfileMyChild .userProfileInfo h3{
    margin:5px 0 4px 0;
}
.editProfileMyChild .formLayout section:last-of-type{
    border-bottom-color:#e4e5ed;
}
.editProfileMyChild .formLayout .selectedList{
    padding:9px 0 7px 135px;
    position:relative;
    margin-bottom:5px;
}
.editProfileMyChild .formLayout .selectedList .textInput{
    width:100%;
    margin-left:1px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:1px solid transparent;
}
.editProfileMyChild .formLayout .selectedList .textInput:active{
    background-color:#e1e1e1;
}
.editProfileMyChild .formLayout .selectedList .location,
.editProfileMyChild .formLayout .selectedList .activityType{
    max-width:100%;
    width:100%;
    padding-right:44px;
    box-shadow:-1px 0 0 rgba(255,255,255,.5);
    text-shadow:0 1px 0 rgba(255,255,255,.5);
    position:relative;
}
.editProfileMyChild .formLayout .autoSuggest .selectedItemWrapper{
    position:relative;
    overflow:auto;
    padding-right:54px;
}
.editProfileMyChild .formLayout section.childInfoEdit .cautiousBtn{
    padding:10px;
    border-bottom:none;
}



/*************************************************
*  User Profile: Edit Child Profile (color picker)
*************************************************/
.editMyProfile .genderPicker{
    border-bottom:none;
    padding-right:0;
    text-indent:0;
    background:transparent;
}
.editMyProfile .genderPicker .inputGroupH{
    padding:0;
    text-indent:0;
    margin-bottom:10px;
}
.editMyProfile .genderPicker .inputGroupH label{
    padding:0;
    text-indent:0;
    width:30%;
}



/*************************************************
*  User Profile: Edit Class Circle
*************************************************/
.editClassCircle .formLayout section.circleInfoEdit{
    padding:0;
    border-bottom:none;
}
.editClassCircle .studentRoster h1{
    margin-top:5px;
}
.editClassCircle .studentRoster article{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:0;
}
.editClassCircle .studentRoster input{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    margin:0;
    padding:0 8px;
    width:50%;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
    border:none;
    border-left:1px solid #e4e5ed;
    height:44px;
    background:transparent;
    font-size:18px;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.editClassCircle .studentRoster input:first-of-type{
    border:none;
}
.editClassCircle .studentRoster input[type='email']{
    border:none;
    border-top:1px solid #e4e5ed;
    width:100%;
}



/*************************************************
*  User Profile: FRE Complete My Profile
*************************************************/
.freProfileMine .scrollView{
    background:#fff;
}
.freProfileMine.profilePage .formLayout section.userProfileInfo{
    background:transparent;
}
.freProfileMine .formLayout .inputProfile label.chooseFile{
    width:122px;
    height:128px;
}
.freProfileMine .inputProfile{
    margin:13px 0 -32px -120px !important;
}
.freProfileMine .formLayout .inputProfile .profileM,
.freProfileMine .formLayout .inputProfile .profileM img{
    width:120px;
    height:120px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    padding:0;
    margin:0;
    left:0;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
}
.freProfileMine .formLayout .inputProfile .profileM{
    border:1px solid rgba(0,0,0,.3);
}
.freProfileMine .editMyProfile h3{
    margin:72px 20px 5px 20px;
}
.freProfileMine .editMyProfile h3 span{
    font-size:24px !important;
    color:#000;
    line-height:1.15;
}
.freProfileMine .editMyProfile h3 a{
    display:none;
}
.freProfileMine .genderPicker{
    padding-bottom:37px;
    border-bottom:1px solid #e4e5ed;
}
.freProfileMine .myFamily{
    border-bottom:none !important;
    padding-bottom:0;
}
.freProfileMine .fullWidthBtn{
    padding-top:0;
}



/*************************************************
*  User Profile: FRE Complete My Profile
*************************************************/
.freProfileTeacher .scrollView{
    background:#fff;
}
.freProfileTeacher .editMyProfile h3{
    margin-bottom:0;
}
.freProfileTeacher .editMyProfile h3 a{
    color:#fff;
}



/*************************************************
*  User Profile: FRE Complete My Profile
*************************************************/
.profilePage .formLayout section.howManyCircles{
    padding:0 15px;
}
.profilePage .formLayout section.howManyCircles h2{
    margin-top:3px;
}
.profilePage .howManyCircles .inputGroupH{
    padding-left:0;
    text-indent:0;
    margin:-5px 0 10px 0;
}



/*************************************************
*  User Profile: Connections Page
*************************************************/
.shadowBox div.userProfileConnections,
.inlineBox div.userProfileConnections{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-top:100px;
}
.userProfileConnections .scrollView{
    background:#fff;
    padding-left:0;
}



/*************************************************
*  FRE Walkthrough
*************************************************/
.freWalkthrough .walkthrough{
    max-width:320px;
    margin:0 auto;
}
.freWalkthrough .walkthrough>section{
    min-height:68px;
    border-bottom:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding:3px 0 2px 0;
}
.freWalkthrough .walkthrough section p{
    font-size:14px;
    margin:0;
    color:#8e8e8e;
    padding:0 5px 0 70px;
}
.freWalkthrough .walkthrough section.descriptions{
    min-height:0;
    padding-top:0;
}
.freWalkthrough .walkthrough section.descriptions p{
    margin-top:14px;
    color:#000;
    padding:0 5px 5px 15px;
}
.freWalkthrough .walkthrough section h2{
    font-size:14px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:70px;
    margin:0 0 -4px 0;
}
.freWalkthrough .walkthrough section h2:before{
    content:"";
    width:50px;
    height:50px;
    display:block;
    position:absolute;
    margin:4px 0 0 15px;
}



.freWalkthrough .walkthrough section.discoverParents h2:before{
    background-position:-274px -1389px;
    width:28px;
    height:23px;
    margin:10px 0 0 28px;
}
.freWalkthrough .walkthrough section.connectWithTeachers h2:before{
    background-position:-454px -1622px;
}
.freWalkthrough .walkthrough section.organizeCarpools h2:before{
    background-position:-134px -1622px;
}
.freWalkthrough .walkthrough section.schoolEvents h2:before{
    background-position:-263px -1622px;
}
.freWalkthrough .walkthrough section.instantMessaging h2:before{
    background-position:-134px -1503px;
}
.freWalkthrough .walkthrough section.recommendations h2:before{
    background-position:-198px -1503px;
}



/*************************************************
*  ActionBar Search/Invite Email
*************************************************/
.actionBarInput{
    display:none;
}
.actionBarInput ul{
    width:100%;
}
.actionBarInput li{
    display:none;
    padding:0 85px 0 5px;
    margin-right:0;
}
.actionBarInput .actionButtons li:last-of-type {
    margin-right:0;
}
.actionBarInput .backButton{
    width:50px;
}
.actionBarInput .backButton:before{
    left:20px;
}
.actionBarInput li.searchBox div,
.actionBarInput li.emailBox div{
    margin-top:8px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:35px;
    background:#fff;
    border:1px solid #c3c3c3;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.actionBarInput li input{
    font-size:18px;
    color:#666;
    height:28px;
    width:100%;
    text-indent:0;
    right:10px;
    border:1px solid #c3c3c3;
    -webkit-appearance: none;
    padding-left:0;
    padding-right:0;
}
.actionBarInput li.newMessage input{
    text-indent:10px;
}
.actionBarInput li input:focus{
    border:1px solid #c3c3c3;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
    padding-left:0;
    padding-right:0;
}
.actionBarSearch,
.actionBarSearch .searchBox,
.actionBarEmail,
.actionBarEmail .emailBox,
.actionBarMessage .newMessage,
.inviteCircles .actionBarCircles .circlesBox{
    display:block;
}
.actionBarInput .actionButtons .searchBox input,
.actionBarInput .actionButtons .emailBox input{
    border:none;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}
.actionBarInput .actionButtons .searchBox:before,
.actionBarInput .actionButtons .emailBox:before{
    content:"";
    width:28px;
    height:28px;
    background-color:#fff;
    position:absolute;
    left:6px;
    top:9px;
}
.actionBarInput .actionButtons .searchBox:before{
    background-position:-272px -966px;
}
.actionBarInput .actionButtons .emailBox:before{
    background-position:-206px -965px;
}
.actionBarInput .backButtonOnly ~ .actionButtons .emailBox,
.actionBarInput .backButtonOnly ~ .actionButtons .searchBox{
    padding-left:48px;
}
.actionBarInput .backButtonOnly ~ .actionButtons .emailBox:before,
.actionBarInput .backButtonOnly ~ .actionButtons .searchBox:before{
    left:50px;
}
#inviteSpouseSearch .actionBarInput .actionButtons li.emailBox{
    padding-top:8px;
}
#inviteSpouseSearch .actionBarInput .actionButtons li.emailBox:before{
    top:10px;
    background-color:transparent;
    width:32px;
}
#inviteSpouseSearch .actionBarInput .actionButtons li.emailBox input{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    padding-left:38px;
    border:1px solid #c3c3c3;
    height:32px;
    line-height:32px;
}
#inviteSpouseSearch .actionBarInput .actionButtons li.emailBox input{
    line-height:32px;
}



/*************************************************
*  Create Event
*************************************************/
footer.options .invite div:after{
    background-position:-7px -602px;
}
footer.options .repeat div:after{
    background-position:-71px -602px;
}
footer.options .drivers div:after{
    background-position:-136px -602px;
}
footer.options .volunteer div:after{
    background-position:-390px -602px;
}
footer.options .alert div:after{
    background-position:-201px -602px;
}
footer.options .location div:after{
    background-position:-265px -602px;
}
footer.options .important div:after{
    background-position:-327px -602px;
}


footer.options .invite.selected div:after{
    background-position:-7px -662px;
}
footer.options .repeat.selected div:after{
    background-position:-71px -662px;
}
footer.options .drivers.selected div:after{
    background-position:-136px -662px;
}
footer.options .volunteer.selected div:after{
    background-position:-390px -662px;
}
footer.options .alert.selected div:after{
    background-position:-201px -662px;
}
footer.options .location.selected div:after{
    background-position:-265px -662px;
}
footer.options .important.selected div:after{
    background-position:-327px -662px;
}



/*************************************************
*  Choose Activity Center
*************************************************/
.formLayout section .inputGroupV:first-child .activityEntry label,
.formLayout section .inputGroupV:last-child .activityEntry label,
.formLayout section .inputGroupV .activityEntry label{
    padding-top:20px;
    padding-bottom:18px;
}
.activityEntry .activityName{
    font-weight:bold;
    display:block;
}
.activityEntry .activityAddress{
    display:block;
}
.activityEntry .activityPhone{
    display:block;
}
.formLayout section .inputGroupV:first-child .activityEntry label:after{
    right:17px;
    top:20px;
}




/*************************************************
*  Auto Suggest Page
*************************************************/
.autoSuggestPage .actionBar .formLayout{
    padding:53px 70px 0 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
}
.autoSuggestPage .actionBar .selectedList{
    padding:3px 5px 0 5px;
    border:1px solid #c3c3c3;
    background:#fff;
    max-height:80px;
    min-height:42px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.autoSuggestPage .contentAutoSuggest{
    display:block;
}
.autoSuggestPage .formLayout section.autoSuggest{
    border-bottom:0;
}
.autoSuggestPage .contentAutoSuggest .selected:after{
    content:"";
    width:25px;
    height:25px;
    display:block;
    position:absolute;
    right:17px;
    margin-top:-35px;
    background-position:-20px -1028px;
}
.autoSuggestPage .contentAutoSuggest .locations .selected:after{
    margin-top:-60px;
}
.autoSuggestPage .contentAutoSuggest .formLayout{
    min-height:100px;
}
.autoSuggestPage .placeHolderText{
    color:#aaa;
    position:absolute;
    top:7px;
    text-indent:110px;
    font-size:18px;
    line-height:32px;
    text-indent:16px;
}



/*************************************************
*  Create Child Profile
*************************************************/
.formLayout section .listGroupV .addActivities{
    text-align:right;
}
.formLayout section .listGroupV .addActivities button{
    text-indent:15px;
    position:relative;
    padding:0 0 0 8px;
    margin:0;
}



/*************************************************
*  Group Icons:  Add "groupIcon"
*************************************************/
.inviteCircles .peopleListing .formLayout section .hgroup button.groupIcon,
.inviteCircles .peopleListing .formLayout section .hgroup button.groupIcon:before,
.circles button.groupIcon,
.circles button.groupIcon:before{
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
}


/*************************************************
*  Circle Color Picker
*************************************************/
.circleColorPicker{
    display:inline-block;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    background:#fff;
    padding:0;
    margin:0 auto;
    overflow:hidden;
    text-indent:0;
}
.circleColorPicker ul{
    padding:0;
    margin:0;
    text-indent:0;
}
.circleColorPicker li{
    list-style:none;
    display:block;
    text-indent:-9999px;
    width:32px;
    s
    padding:0;
    margin:0;
    float:left;
    position:relative;
    cursor:pointer;
    height: 20px;
}
.circleColorPicker li:active:after{
    content:"";
    display:block;
    width:16px;
    height:16px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    position:absolute;
    top:8px;
    left:8px;
    background:rgba(255,255,255,.3);
    width: 12px;
    height: 12px;
    top: 4px;
    left: 10px;
}
.circleColorPicker li.selected:after{
    content:"";
    display:block;
    width:16px;
    height:16px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:8px;
    position:absolute;
    top:8px;
    left:8px;
    background:#fff;
    width: 12px;
    height: 12px;
    top: 4px;
    left: 10px;
}



/*************************************************
*  Child Colors: Gray  (Used for Parents)
*************************************************/
.filterControl .circleColor_gray,
article.circleColor_gray:after,
.groupedListing section.circleColor_gray:after,
.profileMyChild .formLayout section.circleColor_gray,
.editProfileMyChild .formLayout section.circleColor_gray,
.profileOthersChild .formLayout section.circleColor_gray,
.circleColorPicker li.circleColor_gray,
.profileL.noProfilePhoto.circleColor_gray img,
.profileM.noProfilePhoto.circleColor_gray img,
.profileS.noProfilePhoto.circleColor_gray img{
    background:#ccc;
}
.filterControl .circleColor_gray .noProfilePhoto:before{
    color:#8f8f8f;
}
.circles button.circleColor_gray:before{
    border:1px solid #ccc;
}
.recipients span.circleColor_gray span{
    border-top:1px solid #ccc;
}



/*************************************************
*  Child Colors: Pink
*************************************************/
.filterControl .circleColor_pink,
article.circleColor_pink:after,
.groupedListing section.circleColor_pink:after,
.profileMyChild .formLayout section.circleColor_pink,
.editProfileMyChild .formLayout section.circleColor_pink,
.editClassCircle .formLayout section.circleColor_pink,
.profileOthersChild .formLayout section.circleColor_pink,
.circleColorPicker li.circleColor_pink,
.profileL.noProfilePhoto.circleColor_pink img,
.profileM.noProfilePhoto.circleColor_pink img,
.profileS.noProfilePhoto.circleColor_pink img{
    background:#fc4b93;
}
.filterControl .circleColor_pink .noProfilePhoto:before{
    color:#fc4b93;
}
.circles button.circleColor_pink:before{
    border:1px solid #fc4b93;
}
.recipients span.circleColor_pink span{
    border-top:1px solid #fc4b93;
}



/*************************************************
*  Child Colors: Light Pink
*************************************************/
.filterControl .circleColor_lightpink,
article.circleColor_lightpink:after,
.groupedListing section.circleColor_lightpink:after,
.profileMyChild .formLayout section.circleColor_lightpink,
.editProfileMyChild .formLayout section.circleColor_lightpink,
.editClassCircle .formLayout section.circleColor_lightpink,
.profileOthersChild .formLayout section.circleColor_lightpink,
.circleColorPicker li.circleColor_lightpink,
.profileL.noProfilePhoto.circleColor_lightpink img,
.profileM.noProfilePhoto.circleColor_lightpink img,
.profileS.noProfilePhoto.circleColor_lightpink img{
        background:#ff93bf;
}
.filterControl .circleColor_lightpink .noProfilePhoto:before{
    color:#ff93bf;
}
.circles button.circleColor_lightpink:before{
    border:1px solid #ff93bf;
}
.recipients span.circleColor_lightpink span{
    border-top:1px solid #ff93bf;
}




/*************************************************
*  Child Colors: Orange
*************************************************/
.filterControl .circleColor_orange,
article.circleColor_orange:after,
.groupedListing section.circleColor_orange:after,
.profileMyChild .formLayout section.circleColor_orange,
.editProfileMyChild .formLayout section.circleColor_orange,
.editClassCircle .formLayout section.circleColor_orange,
.profileOthersChild .formLayout section.circleColor_orange,
.circleColorPicker li.circleColor_orange,
.profileL.noProfilePhoto.circleColor_orange img,
.profileM.noProfilePhoto.circleColor_orange img,
.profileS.noProfilePhoto.circleColor_orange img{
    background:#ff9a2d;
}
.filterControl .circleColor_orange .noProfilePhoto:before{
    color:#ff9a2d;
}
.circles button.circleColor_orange:before{
    border:1px solid #ff9a2d;
}
.recipients span.circleColor_orange span{
    border-top:1px solid #ff9a2d;
}




/*************************************************
*  Child Colors: Light Orange
*************************************************/
.filterControl .circleColor_lightorange,
article.circleColor_lightorange:after,
.groupedListing section.circleColor_lightorange:after,
.profileMyChild .formLayout section.circleColor_lightorange,
.editProfileMyChild .formLayout section.circleColor_lightorange,
.editClassCircle .formLayout section.circleColor_lightorange,
.profileOthersChild .formLayout section.circleColor_lightorange,
.circleColorPicker li.circleColor_lightorange,
.profileL.noProfilePhoto.circleColor_lightorange img,
.profileM.noProfilePhoto.circleColor_lightorange img,
.profileS.noProfilePhoto.circleColor_lightorange img{
    background:#ffc98e;
}
.filterControl .circleColor_lightorange .noProfilePhoto:before{
    color:#ffc98e;
}
.circles button.circleColor_lightorange:before{
    border:1px solid #ffc98e;
}
.recipients span.circleColor_lightorange span{
    border-top:1px solid #ffc98e;
}



/*************************************************
*  Child Colors: Yellow
*************************************************/
.filterControl .circleColor_yellow,
article.circleColor_yellow:after,
.groupedListing section.circleColor_yellow:after,
.profileMyChild .formLayout section.circleColor_yellow,
.editProfileMyChild .formLayout section.circleColor_yellow,
.editClassCircle .formLayout section.circleColor_yellow,
.profileOthersChild .formLayout section.circleColor_yellow,
.circleColorPicker li.circleColor_yellow,
.profileL.noProfilePhoto.circleColor_yellow img,
.profileM.noProfilePhoto.circleColor_yellow img,
.profileS.noProfilePhoto.circleColor_yellow img{
    background:#ffd200;
}
.filterControl .circleColor_yellow .noProfilePhoto:before{
    color:#ffd200;
}
.circles button.circleColor_yellow:before{
    border:1px solid #ffd200;
}
.recipients span.circleColor_yellow span{
    border-top:1px solid #ffd200;
}



/*************************************************
*  Child Colors: Light Yellow
*************************************************/
.filterControl .circleColor_lightyellow,
article.circleColor_lightyellow:after,
.groupedListing section.circleColor_lightyellow:after,
.profileMyChild .formLayout section.circleColor_lightyellow,
.editProfileMyChild .formLayout section.circleColor_lightyellow,
.editClassCircle .formLayout section.circleColor_lightyellow,
.profileOthersChild .formLayout section.circleColor_lightyellow,
.circleColorPicker li.circleColor_lightyellow,
.profileL.noProfilePhoto.circleColor_lightyellow img,
.profileM.noProfilePhoto.circleColor_lightyellow img,
.profileS.noProfilePhoto.circleColor_lightyellow img{
    background:#ffe14d;
}
.filterControl .circleColor_lightyellow .noProfilePhoto:before{
    color:#ffe14d;
}
.circles button.circleColor_lightyellow:before{
    border:1px solid #ffe14d;
}
.recipients span.circleColor_lightyellow span{
    border-top:1px solid #ffe14d;
}



/*************************************************
*  Child Colors: Green
*************************************************/
.filterControl .circleColor_green,
article.circleColor_green:after,
.groupedListing section.circleColor_green:after,
.profileMyChild .formLayout section.circleColor_green,
.editProfileMyChild .formLayout section.circleColor_green,
.editClassCircle .formLayout section.circleColor_green,
.profileOthersChild .formLayout section.circleColor_green,
.circleColorPicker li.circleColor_green,
.profileL.noProfilePhoto.circleColor_green img,
.profileM.noProfilePhoto.circleColor_green img,
.profileS.noProfilePhoto.circleColor_green img{
    background:#64b32a;
}
.filterControl .circleColor_green .noProfilePhoto:before{
    color:#64b32a;
}
.circles button.circleColor_green:before{
    border:1px solid #64b32a;
}
.recipients span.circleColor_green span{
    border-top:1px solid #64b32a;
}



/*************************************************
*  Child Colors: Light Green
*************************************************/
.filterControl .circleColor_lightgreen,
article.circleColor_lightgreen:after,
.groupedListing section.circleColor_lightgreen:after,
.profileMyChild .formLayout section.circleColor_lightgreen,
.editProfileMyChild .formLayout section.circleColor_lightgreen,
.editClassCircle .formLayout section.circleColor_lightgreen,
.profileOthersChild .formLayout section.circleColor_lightgreen,
.circleColorPicker li.circleColor_lightgreen,
.profileL.noProfilePhoto.circleColor_lightgreen img,
.profileM.noProfilePhoto.circleColor_lightgreen img,
.profileS.noProfilePhoto.circleColor_lightgreen img{
    background:#abe77f;
}
.filterControl .circleColor_lightgreen .noProfilePhoto:before{
    color:#abe77f;
}
.circles button.circleColor_lightgreen:before{
    border:1px solid #abe77f;
}
.recipients span.circleColor_lightgreen span{
    border-top:1px solid #abe77f;
}



/*************************************************
*  Child Colors: Blue
*************************************************/
.filterControl .circleColor_blue,
article.circleColor_blue:after,
.groupedListing section.circleColor_blue:after,
.profileMyChild .formLayout section.circleColor_blue,
.editProfileMyChild .formLayout section.circleColor_blue,
.editClassCircle .formLayout section.circleColor_blue,
.profileOthersChild .formLayout section.circleColor_blue,
.circleColorPicker li.circleColor_blue,
.profileL.noProfilePhoto.circleColor_blue img,
.profileM.noProfilePhoto.circleColor_blue img,
.profileS.noProfilePhoto.circleColor_blue img{
    background:#2d96de;
}
.filterControl .circleColor_blue .noProfilePhoto:before{
    color:#2d96de;
}
.circles button.circleColor_blue:before{
    border:1px solid #2d96de;
}
.recipients span.circleColor_blue span{
    border-top:1px solid #2d96de;
}



/*************************************************
*  Child Colors: Light Blue
*************************************************/
.filterControl .circleColor_lightblue,
article.circleColor_lightblue:after,
.groupedListing section.circleColor_lightblue:after,
.profileMyChild .formLayout section.circleColor_lightblue,
.editProfileMyChild .formLayout section.circleColor_lightblue,
.editClassCircle .formLayout section.circleColor_lightblue,
.profileOthersChild .formLayout section.circleColor_lightblue,
.circleColorPicker li.circleColor_lightblue,
.profileL.noProfilePhoto.circleColor_lightblue img,
.profileM.noProfilePhoto.circleColor_lightblue img,
.profileS.noProfilePhoto.circleColor_lightblue img{
    background:#7dbce7;
}
.filterControl .circleColor_lightblue .noProfilePhoto:before{
    color:#7dbce7;
}
.circles button.circleColor_lightblue:before{
    border:1px solid #7dbce7;
}
.recipients span.circleColor_lightblue span{
    border-top:1px solid #7dbce7;
}



/*************************************************
*  Child Colors: Purple
*************************************************/
.filterControl .circleColor_purple,
article.circleColor_purple:after,
.groupedListing section.circleColor_purple:after,
.profileMyChild .formLayout section.circleColor_purple,
.editProfileMyChild .formLayout section.circleColor_purple,
.editClassCircle .formLayout section.circleColor_purple,
.profileOthersChild .formLayout section.circleColor_purple,
.circleColorPicker li.circleColor_purple,
.profileL.noProfilePhoto.circleColor_purple img,
.profileM.noProfilePhoto.circleColor_purple img,
.profileS.noProfilePhoto.circleColor_purple img{
    background:#952dde;
}
.filterControl .circleColor_purple .noProfilePhoto:before{
    color:#952dde;
}
.circles button.circleColor_purple:before{
    border:1px solid #952dde;
}
.recipients span.circleColor_purple span{
    border-top:1px solid #952dde;
}



/*************************************************
*  Child Colors: Light Purple
*************************************************/
.filterControl .circleColor_lightpurple,
article.circleColor_lightpurple:after,
.groupedListing section.circleColor_lightpurple:after,
.profileMyChild .formLayout section.circleColor_lightpurple,
.editProfileMyChild .formLayout section.circleColor_lightpurple,
.editClassCircle .formLayout section.circleColor_lightpurple,
.profileOthersChild .formLayout section.circleColor_lightpurple,
.circleColorPicker li.circleColor_lightpurple,
.profileL.noProfilePhoto.circleColor_lightpurple img,
.profileM.noProfilePhoto.circleColor_lightpurple img,
.profileS.noProfilePhoto.circleColor_lightpurple img{
    background:#bb7fe5;
}
.filterControl .circleColor_lightpurple .noProfilePhoto:before{
    color:#bb7fe5;
}
.circles button.circleColor_lightpurple:before{
    border:1px solid #bb7fe5;
}
.recipients span.circleColor_lightpurple span{
    border-top:1px solid #bb7fe5;
}



/*********************************************
* Post Tags
*********************************************/
#addPost div.pickTags{
    padding-bottom:0;
}
.tags:before{
    content:"";
    display:inline-block;
    width:20px;
    height:29px;
    margin-right:0;
    margin-top:2px;
    vertical-align:middle;
    background-position:50px 50px;
}
.eventTag .actionBar .tags{
    display:none;
}
.contentEventRepeat .tags:before,
.eventTag .tags:before{
    width:48px;
    height:48px;
    margin:6px 10px 6px 0;
}
.pickTags.postCreateNew .formLayout section .inputGroupDiv div:after{
    display:none;
}
.pickTags.postCreateNew .formLayout section .inputGroupDiv div{
    padding:0 0 0 10px;
}
.pickTags.postCreateNew .formLayout>section{
    border-bottom:none;
}



.tags{color:#000;}
.navFilters a:before{background-position:-522px -1443px;}
.navFilters a.tags:before{background-position:-601px -1548px}
.actionBar .tags:before { width: 20px; margin-left: 0px; height: 20px; margin-top: 0; position: relative; top: -5px; margin-right: 2px; transform: scale(1.2); }
.contentEventRepeat .tags:before{background-position:-581px -1498px}

.tagAccomplishments{color:#ffba00;}
.navFilters a.tagAccomplishments:before{background-position:-664px -1578px;}
.tagAccomplishments:before{background-position:-645px -1583px}
.pickTags .tagAccomplishments:before{background-position:-645px -1618px;}
.eventTag .tagAccomplishments:before{background-position:-645px -1618px;}

.tagActivities{color:#ff9b12;}
.navFilters a.tagActivities:before{background-position:-91px -1548px;}
.tagActivities:before{background-position:-72px -1554px;}
.pickTags .tagActivities:before{background-position:-72px -1498px;}
.eventTag .tagActivities:before{background-position:-72px -1498px;}

.tagAnnouncements{color:#961de2;}
.navFilters a.tagAnnouncements:before{background-position:-219px -1548px;}
.tagAnnouncements:before{background-position:-200px -1554px;}
.pickTags .tagAnnouncements:before{background-position:-200px -1498px;}
.eventTag .tagAnnouncements:before{background-position:-200px -1498px;}

.tagAssignment{color:#2b4ac0;}
.navFilters a.tagAssignment:before{background-position:-40px -1584px;}
.tagAssignment:before{background-position:-8px -1584px;}
.pickTags .tagAssignment:before{background-position:-8px -1618px;}
.eventTag .tagAssignment:before{background-position:-8px -1618px;}

.tagBirthday{color:#18becd;}
.navFilters a.tagBirthday:before{background-position:-104px -1584px;}
.tagBirthday:before{background-position:-72px -1584px;}
.pickTags .tagBirthday:before{background-position:-72px -1618px;}
.eventTag .tagBirthday:before{background-position:-72px -1618px;}

.tagClassUpdate{color:#2b4ac0;}
.navFilters a.tagClassUpdate:before{background-position:-486px -1554px;}
.tagClassUpdate:before{background-position:-454px -1554px;}
.pickTags .tagClassUpdate:before{background-position:-454px -1498px;}
.eventTag .tagClassUpdate:before{background-position:-454px -1498px;}

.navFilters a.tagClasses:before{background-position:-522px -1383px;}
.navFilters a.tagCombinedView:before{background-position:-268px -1203px;}
.navFilters a.tagHome:before{background-position: -11px -180px;}
.navFilters a.tagCommunities:before{background-position:-522px -1443px;}

.tagDropOff, .tagPickUp{color:#61b518;}
.navFilters a.tagDropOff:before, .tagPickUp:before{background-position:-168px -1584px;}
.tagDropOff:before, .tagPickUp:before{background-position:-136px -1584px;}
.pickTags .tagDropOff:before, .pickTags .tagPickUp:before{background-position:-136px -1618px;}
.eventTag .tagDropOff:before, .eventTag .tagPickUp:before{background-position:-136px -1618px;}

.tagFieldTrip{color:#996633;}
.navFilters a.tagFieldTrip:before{background-position:-232px -1584px;}
.tagFieldTrip:before{background-position:-200px -1584px;}
.pickTags .tagFieldTrip:before{background-position:-200px -1618px;}
.eventTag .tagFieldTrip:before{background-position:-200px -1618px;}

.tagGeneral{color:#61b518;}
.navFilters a.tagGeneral:before{background-position:-601px -1548px}
.tagGeneral:before{width:1px;margin-left:0;}
.actionBar .tagGeneral:before{width:20px; margin-left:0px; background-position:-581px -1554px}
.contentEventRepeat .tagGeneral:before{background-position:-581px -1498px}
.createPost .tagGeneral:before{background-position:-581px -1554px}

.tagGeneralEvent{color:#18becd;}
.navFilters a.tagGeneralEvent:before{background-position:-296px -1584px;}
.tagGeneralEvent:before{background-position:-264px -1584px;}
.pickTags .tagGeneralEvent:before{background-position:-264px -1618px;}
.eventTag .tagGeneralEvent:before{background-position:-264px -1618px;}

.navFilters a.tagGroups:before{background-position:-521px -1322px;}

.tagLessons{color:#2b4ac0;}
.navFilters a.tagLessons:before{background-position:-677px -1554px}
.tagLessons:before{background-position:-645px -1554px}
.pickTags .tagLessons:before{background-position:-645px -1498px}
.eventTag .tagLessons:before{background-position:-645px -1498px}

.tagParty{color:#18becd;}
.navFilters a.tagParty:before{background-position:-360px -1584px;}
.tagParty:before{background-position:-328px -1584px;}
.pickTags .tagParty:before{background-position:-328px -1618px;}
.eventTag .tagParty:before{background-position:-328px -1618px;}

.tagPlayDate{color:#ffba00;}
.navFilters a.tagPlayDate:before{background-position:-424px -1584px;}
.tagPlayDate:before{background-position:-392px -1584px;}
.pickTags .tagPlayDate:before{background-position:-392px -1618px;}
.eventTag .tagPlayDate:before{background-position:-392px -1618px;}

.tagPTMeeting{color:#dc3a30;}
.navFilters a.tagPTMeeting:before{background-position:-488px -1584px;}
.tagPTMeeting:before{background-position:-456px -1584px;}
.pickTags .tagPTMeeting:before{background-position:-456px -1618px;}
.eventTag .tagPTMeeting:before{background-position:-456px -1618px;}

.tagQuestion{color:#2495e1;}
.navFilters a.tagQuestion:before{background-position:-154px -1548px;}
.tagQuestion:before{background-position:-136px -1554px;}
.pickTags .tagQuestion:before{background-position:-136px -1498px;}
.eventTag .tagQuestion:before{background-position:-136px -1498px;}

.tagRecommendations{color:#ffba00;}
.navFilters a.tagRecommendations:before{background-position:-27px -1549px;}
.tagRecommendations:before{background-position:-8px -1554px}
.pickTags .tagRecommendations:before{background-position:-8px -1500px;}
.eventTag .tagRecommendations:before{background-position:-8px -1500px;}

.tagRegDeadline{color:#2b4ac0;}
.navFilters a.tagRegDeadline:before{background-position:-550px -1584px;}
.tagRegDeadline:before{background-position:-518px -1584px;}
.pickTags .tagRegDeadline:before{background-position:-518px -1618px;}
.eventTag .tagRegDeadline:before{background-position:-518px -1618px;}

.tagSell{color:#61b518;}
.navFilters a.tagSell:before{background-position:-282px -1548px;}
.tagSell:before{background-position:-264px -1554px;}
.pickTags .tagSell:before{background-position:-264px -1498px;}
.eventTag .tagSell:before{background-position:-264px -1498px;}

.tagSystem{color:#8e8e8e;}
.navFilters a.tagSystem:before{width:1px;margin-left:0;}
.tagSystem:before{width:1px;margin-left:0;}
.pickTags .tagSystem:before{width:1px;margin-left:-3px;}
.eventTag .tagSystem:before{width:1px;margin-left:-3px;}

.tagTest{color:#2b4ac0;}
.navFilters a.tagTest:before{background-position:-614px -1584px;}
.tagTest:before{background-position:-582px -1584px}
.pickTags .tagTest:before{background-position:-582px -1618px}
.eventTag .tagTest:before{background-position:-582px -1618px}

.tagTips{color:#18becd;}
.navFilters a.tagTips:before{background-position:-347px -1548px;}
.tagTips:before{background-position:-328px -1554px;}
.pickTags .tagTips:before{background-position:-328px -1498px;}
.eventTag .tagTips:before{background-position:-328px -1498px;}

.tagUrgent{color:#dc3a30;}
.navFilters a.tagUrgent:before{background-position:-410px -1548px;}
.tagUrgent:before{background-position:-392px -1554px;}
.pickTags .tagUrgent:before{background-position:-392px -1498px;}
.eventTag .tagUrgent:before{background-position:-392px -1498px;}

.tagVolunteer{color:#fd82ab;}
.navFilters a.tagVolunteer:before{background-position:-537px -1548px;}
.tagVolunteer:before{background-position:-516px -1554px;}
.pickTags .tagVolunteer:before{background-position:-516px -1498px;}
.eventTag .tagVolunteer:before{background-position:-516px -1498px;}

.tagStudentWork{color:#2b4ac0;}
.tagStudentWork:before{background-position:-644px -1554px;}
.pickTags .tagStudentWork:before{background-position:-644px -1498px;}
.eventTag .tagStudentWork:before{background-position:-644px -1498px;}

.tagStudent{color:#2b4ac0;}
.tagStudent:before{background-position:-644px -1554px;}
.navFilters a.tagStudent:before{ background-position: -268px -123px; transform: scale(0.7); }
.pickTags .tagStudent:before{background-position:-644px -1498px;}
.eventTag .tagStudent:before{background-position:-644px -1498px;}



/*********************************************
* Activity Icons: Circles
*********************************************/
.circles button.circle .circleName:after{
    background-image: url(../images/activities@2x.png);
    background-color:transparent;
    background-size: 320px 1000px;
}



/*********************************************
* Activity Icons: Color
*********************************************/
.activityType{
    font-size:15px;
    color:#000;
}
.activityType:before{
    background-image: url(../images/activities@2x.png);
    background-color:transparent;
    background-size: 320px 1000px;
}
.activityType:before{
    background-position:0px -32px;
    content:"";
    display:inline-block;
    vertical-align:middle;
    width:32px;
    height:32px;
}
.circles button .circleName:after{
    background-position:0 -32px;
}
.activity_AllConnections:before,
.circles button.activity_AllConnections .circleName:after{
    background-position:-32px 0;
}
.activity_Personal:before,
.circles button.activity_Personal .circleName:after{
    background-position:-32px 0;
}
.activity_Soccer:before,
.circles button.activity_Soccer .circleName:after{
    background-position:-96px 0;
}
.activity_Camp:before,
.circles button.activity_Camp .circleName:after{
    background-position:-128px 0;
}
.activity_Ballet:before,
.circles button.activity_Ballet .circleName:after{
    background-position:-160px 0;
}
.activity_Speech:before,
.circles button.activity_Speech .circleName:after{
    background-position:-192px 0;
}
.activity_Performance:before,
.circles button.activity_Performance .circleName:after{
    background-position:-224px 0;
}
.activity_Writing:before,
.circles button.activity_Writing .circleName:after{
    background-position:-256px 0;
}
.activity_Music:before,
.circles button.activity_Music .circleName:after{
    background-position:-288px 0;
}
.activity_School:before,
.circles button.activity_School .circleName:after{
    background-position:0 -64px;
}
.activity_Tennis:before,
.circles button.activity_Tennis .circleName:after{
    background-position:-32px -64px;
}
.activity_Art:before,
.circles button.activity_Art .circleName:after{
    background-position:-64px -64px;
}
.activity_Tech:before,
.circles button.activity_Tech .circleName:after{
    background-position:-96px -64px;
}
.activity_Class:before,
.circles button.activity_Class .circleName:after{
    background-position:-128px -64px;
}




/*********************************************
* Activity Icons: Gray
*********************************************/
.activityGray_AllConnections:before,
.circles button.activityGray_AllConnections .circleName:after{
    background-position:-32px -32px;
}
.activityGray_Personal:before,
.circles button.activityGray_Personal .circleName:after{
    background-position:-32px -32px;
}
.activityGray_Personal:before,
.circles button.activityGray_Personal .circleName:after{
    background-position:-64px -32px;
}
.activityGray_Soccer:before,
.circles button.activityGray_Soccer .circleName:after{
    background-position:-96px -32px;
}
.activityGray_Camp:before,
.circles button.activityGray_Camp .circleName:after{
    background-position:-128px -32px;
}
.activityGray_Ballet:before,
.circles button.activityGray_Ballet .circleName:after{
    background-position:-160px -32px;
}
.activityGray_Speech:before,
.circles button.activityGray_Speech .circleName:after{
    background-position:-192px -32px;
}
.activityGray_Performance:before,
.circles button.activityGray_Performance .circleName:after{
    background-position:-224px -32px;
}
.activityGray_Writing:before,
.circles button.activityGray_Writing .circleName:after{
    background-position:-256px -32px;
}
.activityGray_Music:before,
.circles button.activityGray_Music .circleName:after{
    background-position:-288px -32px;
}
.activityGray_School:before,
.circles button.activityGray_School .circleName:after{
    background-position:0 -96px;
}
.activityGray_Tennis:before,
.circles button.activityGray_Tennis .circleName:after{
    background-position:-32px -96px;
}
.activityGray_Art:before,
.circles button.activityGray_Art .circleName:after{
    background-position:-64px -96px;
}
.activityGray_Tech:before,
.circles button.activityGray_Tech .circleName:after{
    background-position:-96px -96px;
}
.activityGray_Class:before,
.circles button.activityGray_Class .circleName:after{
    background-position:-128px -96px;
}



/*********************************************
* LoadMoreEntries
*********************************************/
.loadMoreEntries,.loadingData{
    display:block;
    text-align:center;
    line-height:0;
    height:4px;
    width:100% !important;
    text-indent:-9999px;
    position:fixed;
    left:0;
    z-index:3;
    margin-top:-10px;
}
.loadingData{
     margin-top:0;
}
.loadMoreEntries:after,.loadingData:after{
    content:"";
    display:block;
    height:5px;
    width:100%;
    margin:0;
    background:url(../images/ajax-loader4.gif) no-repeat center;
    background-size:100%;
    border-radius: 50px;
}
.showQuickLinks ~ .scrollView .loadMoreEntries{
    display:none;
}
.postCreateNew .loadMoreEntries{
    position:absolute;
    left:0;
    top:10px !important;
    margin-left:0;
    width:100%;
}
.postsTab .loadMoreEntries,
.messagesTab .loadMoreEntries{
    margin-top:1px;
}
.communityPage .loadMoreEntries{
    top: 2px;
    left : 0 !important;
    margin : 0 !important;
}
.loadingContacts{
    top:9px !important;
    z-index:9002 !important;
}
.loadMoreEntries.assignmentCreate{
    top: 10px;
    z-index: 9999;
    margin-left: -540px;
}

/*********************************************
* add child button in Recipient picker
*********************************************/
.addChildRecipientPicker{
    left: 420px;
    position: absolute;
    top: 20px;
    width: 60px;
    height: 30px;
    font-size: 14px !important;
    line-height: 0px !important;
    z-index:9999;
}




/*********************************************
* LoadMoreEntries Bottom
*********************************************/
.loadMoreEntries.bottom{
    position:relative;
    height:auto;
    top:auto !important;
}
.loadMoreEntries.bottom:after{
    background:url(../images/ajax-loader.gif) no-repeat center;
    width:32px;
    height:32px;
    margin:20px auto 20px auto !important;
}



/********************************************
* Demo ClassLoader
********************************************/
#_demoClass .alertBox{
    position:absolute;
}



/*********************************************
* Toast Notifications
*********************************************/
#toast{
    width:80%;
    display:none;
    position:fixed;
    bottom:78px;
    left:50%;
    margin-left:-40%;
    background:rgba(0, 0, 0, .78);
    border:1px solid #000;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
    border-radius:7px;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, .5);
}
#toast p,
#toast a{
    text-align:center;
    margin:8px 20px;
    color:#d7d7d7;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
}

#toast.errorToast{
    background:#f9eebb;
    border:1px solid #f1c466;
    box-shadow:0px 2px 4px rgba(0,0,0,.2);
}
#toast.errorToast p,
#toast.errorToast a{
    color:#262626;
    text-shadow:none;
}



/*********************************************
* Warning Strip:  Adjust Timezone
*********************************************/
.timezoneWarning.bloomzNotification p:before{
    background-position:-531px -669px
}




/*********************************************
* Shadow Box
*
* Setting shadowBox to position fixed
* caused the shadow on iPad landscape mode
* did not cover up the messages panel.
*
* Setting shadowBox to position absolute
* causes an undesirable outer gray box
* around non-logged in pages.
*
*********************************************/
.shadowBox{
    position:fixed;
    width:100%;
    height:100%;
    left:0;
    top:0;
    margin-left:0;
    overflow:hidden;
    display:block;
}
#_sidechat ~ div .shadowBox{
    position:absolute; /* applies only after you log in */
}
.shadowBox .subPage{
    position:relative;
    display:block;
    height:100%;
    width:100%;
    background:#fff; /* makes white line below shadowbox not as noticable */
}
.shadowBox .actionButtons button,
.inlineBox .actionButtons button{
    border-left:none;
}
.noScroll{
    display:none;
}






/*********************************************
* Inline Box
*********************************************/
.inlineBox{
    position:absolute;
    width:100%;
    height:100%;
    left:0;
    top:0;
    margin-left:0;
    overflow:hidden;
}
.inlineBox .subPage{
    position:relative;
    display:block;
    height:100%;
    background:#e8e8e8;
}





/*********************************************
* Org Pages
*********************************************/
#orgHome .communityPage .logo{
    width:1px;
}
#orgHome .communityPage .logo:after{
    display:none;
}
#orgHome .communityPage .actionBar .backButtonOnly{
    display:inline-block;
}
.showDrawer ~ #genericControls #orgHome .communityPage .actionBar .backButtonOnly{
    width:100%;
    height:100%;
    position:fixed;
    height:1024px;
}
#orgHome .communityPage{
    padding-top:98px;
}
#orgHome .contentArea{
    padding-top:0;
}
#orgHome .contentArea .orgProfile h2,
#orgHome .contentArea .userProfileInfo h2{
    margin-top:-1px;
}
#orgHome .actionBar .actionButtons button.orgEdit:after{
    background-position:-524px -71px;
}
#orgHome .actionBar .actionButtons button.orgEdit.leaveGrp:after{
    background-position:-524px -71px;
    opacity:1;
    filter:alpha(opacity=100);
}
#orgHome .actionBar .actionButtons button.orgEdit.leaveGrp:hover:after{
    opacity:1;
    filter:alpha(opacity=100);
}
#orgHome .actionBar .actionButtons li:last-of-type{
    margin-right:5px;
}
#orgHome .actionBar .actionButtons.grpSettings li:last-of-type{
    margin-right:0;
}

#communityMembersView .header.actionBar{
    display: block !important;
    z-index: 1000 !important;
}

#orgHome .isSubgroup .actionBar h1 div{
    height:30px;
    line-height:30px;
}
#orgHome .actionBar h1 span.breadcrumb{
    display:none;
}
#orgHome .isSubgroup .actionBar h1 span.breadcrumb{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height: 10px;
    height: 10px;
    font-size: 12px;
    margin-top: -3px;
    display: block;
    color:#8e8e8e;
}




#communityMembersView .contentArea,
#orgHome .contentArea{
    position:relative;
}
#communityMembersView .peopleListing,
#orgHome .peopleListing{
    display:block;
    padding-left:0;
}
#communityMembersView .peopleListing .groupedListing .horizontalList .hgroup button.addContact,
#communityMembersView .peopleListing .groupedListing .horizontalList .hgroup button.removeContact,
#communityMembersView .peopleListing .groupedListing .horizontalList .hgroup button.addCircles,
#communityMembersView .peopleListing .groupedListing .horizontalList .hgroup button.pendingInvite,
#orgHome .peopleListing .groupedListing .horizontalList .hgroup button.addContact,
#orgHome .peopleListing .groupedListing .horizontalList .hgroup button.removeContact,
#orgHome .peopleListing .groupedListing .horizontalList .hgroup button.addCircles,
#orgHome .peopleListing .groupedListing .horizontalList .hgroup button.pendingInvite{
    right: 1px;
    top: 7px;
    width: 46px;
    height: 46px;
    background: transparent;
    border: 2px solid transparent;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px;
    -moz-border-radius-topright: 0;
    -webkit-border-radius-topright: 0;
    border-top-right-radius: 0;
    z-index: 0;
    cursor: pointer;
}
#communityMembersView .contentBloomzLoc .hgroup:first-of-type h2,
#orgHome .contentBloomzLoc .hgroup:first-of-type h2{
    font-family: Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    font-size:19px;
    line-height:25px;
}
#communityMembersView .contentBloomzLoc .groupedListing,
#orgHome .contentBloomzLoc .groupedListing:not(.invitedSectionManage){
    padding-top:0;
}
#communityMembersView .orgMembersPage .groupedListing,
#orgHome .orgMembersPage .groupedListing{
    padding-left:0;
    padding-right:0;
}
#communityMembersView .orgMembersPage .groupedListing h1,
#orgHome .orgMembersPage .groupedListing h1{
    margin-top:0;
}
#communityMembersView .orgMembersPage .contentArea,
#orgHome .orgMembersPage .contentArea{
    padding:0;
}
#communityMembersView .orgMembersPage .contentArea section,
#orgHome .orgMembersPage .contentArea section{
    margin-bottom:0;
}
#communityMembersView .orgMembersPage .scrollView>section section.orgProfile,
#orgHome .orgMembersPage .scrollView>section section.orgProfile{
    margin:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView{
    background:#fff;
    overflow:visible;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView:empty,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView:empty{
    display:none;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView .forModeHideTabs,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView .forModeHideTabs{
    box-shadow:inset 0 -1px rgba(0,0,0,.1);
    border-bottom:0;
}
#communityMembersView .orgMembersPage .contentBloomzLoc .formLayout section.listHeader,
#orgHome .orgMembersPage .contentBloomzLoc .formLayout section.listHeader{
    background:#fff;
}
#communityMembersView .orgMembersPage .showResults #communityContent,
#orgHome .orgMembersPage .showResults #communityContent{
    display:none;
}
#communityMembersView .orgMembersPage .hideResults .recipientPickerCtrl.browseOnly,
#orgHome .orgMembersPage .hideResults .recipientPickerCtrl.browseOnly{
    overflow:hidden;
    height:48px;
}
#communityMembersView .orgMembersPage .hideResults #communityContent,
#orgHome .orgMembersPage .hideResults #communityContent{
    padding:15px 15px 0 15px;
}
#communityMembersView .orgMembersPage .hideResults #communityContent .scrollView h1#communityEvents_addMember,
#orgHome .orgMembersPage .hideResults #communityContent .scrollView h1#communityEvents_addMember{
    margin-top:0;
    cursor:pointer;
}
#communityMembersView .orgMembersPage .hideResults #communityContent .scrollView .formPadding,
#orgHome .orgMembersPage .hideResults #communityContent .scrollView .formPadding{
    padding:0 0 10px 0;
}
#communityMembersView .orgMembersPage .hideResults #communityContent .scrollView .formPadding section,
#orgHome .orgMembersPage .hideResults #communityContent .scrollView .formPadding section{
    min-height:48px;
}
#communityMembersView .orgMembersPage .hideResults #communityContent .scrollView .formPadding section label,
#orgHome .orgMembersPage .hideResults #communityContent .scrollView .formPadding section label{
    line-height:48px;
    display:block;
    cursor:pointer;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly{
    padding-top:0;
    position:relative;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .backButtonOnly,
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs h1,
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .nextButton,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .backButtonOnly,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs h1,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .nextButton{
    display:none;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs{
    top:48px;
    height:48px;
    position:static;
    background:#f2f2f2;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .actionButtons.searchBar,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .actionButtons.searchBar{
    top:0;
    border:none;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients label,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients label{
    top:96px;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing{
    padding:15px 10px;
}
.iPhone #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing.formLayout:last-of-type,
.Android #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing.formLayout:last-of-type,
.iPhone #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing.formLayout:last-of-type,
.Android #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .groupedListing.formLayout:last-of-type{
    min-height:0;
}
#communityMembersView .orgMembersPage .contentArea section.horizontalList,
#communityMembersView .orgMembersPage .contentArea section.verticalList,
#orgHome .orgMembersPage .contentArea section.horizontalList,
#orgHome .orgMembersPage .contentArea section.verticalList{
    margin-bottom:10px;
}
#communityMembersView .orgMembersPage .peopleListing .formLayout section,
#orgHome .orgMembersPage .peopleListing .formLayout section{
    padding-right:0;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren{
    padding-top:0;
    overflow:auto;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly .profileWithChildren .profileL,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly .profileWithChildren .profileL{
    padding-left:5px;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly .profileWithChildren .profileL:after,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly .profileWithChildren .profileL:after{
    margin-top:-6px;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren h3,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren h3{
    text-indent:85px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-right: 10px;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren .contactsChildren,
#orgHome .orgMembersPage .recipientPickerCtrl.browseOnly .peopleListing .profileWithChildren .contactsChildren{
    margin-left:85px;
}
#communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients label,
#orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients label{
    top:49px;
}
#orgHome .contentBloomzLoc .groupedListing .verticalList .hgroup h3{
    text-indent:70px;
    min-height:47px;
}
#orgHome .contentBloomzLoc .hgroup.loadMore{
    vertical-align:inherit;
    text-align: center;
    height: 39px;
    min-width: 37px;
    line-height: 39px;
    top:-64px;
    min-height:39px;
}
#orgHome .contentBloomzLoc .hgroup.loadMore span{
    background:#e8e8e8;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    -moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;
}
#orgHome .peopleListing .groupedListing .horizontalList .hgroup.moreOnly{
    display:none;
}
#orgHome .contentBloomzLoc .groupedListing .invitedSectionManage){
    padding-top:10px 0 0 0;
}

.Desktop .scrollView>section section.orgProfile,
.Desktop .scrollView .contentArea > section.orgProfile,
.scrollView>section section.orgProfile,
.scrollView section section.orgProfile{
    min-height:160px;
    width:100%;
    padding:0 10px;
    margin:0 0 0 -10px;
    background-color:#006c8e;
    position:relative;
    background-size:cover;
    background-position:center;
    width:auto;
    margin:0 -10px;
}
.welcomePostIcon{
    background-color:#006c8e;
}
.Desktop .scrollView>section section.orgProfile.noLogo,
.scrollView>section section.orgProfile.noLogo{
    min-height:50px;
}
.Desktop .scrollView>section section.orgProfile.noLogo h2,
.scrollView>section section.orgProfile.noLogo h2{
    display:none;
}
.orgProfile button.setCover:after{
    content:attr(data-editcover);
}
.orgProfile.isLoading button.setCover:after{
    content:attr(data-loadingcover);
}
.orgProfile.isLoading button.setCover:before{
    content:"";
    width:16px;
    height:16px;
    display:inline-block;
    background:url(../images/ajax-loader.gif) no-repeat;
    background-size:cover;
    vertical-align:middle;
    margin-top:-3px;
    margin-right:5px;
}
.orgProfile h2{
    text-indent:-99999999px;
}
.orgProfile h2 img{
    position:absolute;
    left:0;
    background:transparent;
    width:56px;
    height:56px;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    background-size:cover;
    opacity:1;
    filter:alpha(opacity=100);
    margin:0;
}
.orgProfile h3{
    margin:-30px auto 15px auto;
    color:#fff;
    text-shadow:none;
    white-space: normal;
    line-height: 1.25;
    text-indent:0;
    padding:0 15px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    max-width:320px;
}
.orgNav{
    position:absolute;
    top:63px;
    left:0;
    margin:0;
    padding:0;
    width:100%;
    height:50px;
    opacity:.98;
    filter:alpha(opacity=98);
    box-sizing:border-box;
}
.orgNav ul, #orgHome .subNavTabs .orgNav ul {
    position:relative;
    list-style:none;
    padding:0 43px 0 0;
    margin:0;
    height:50px;
    overflow:hidden;
    white-space: nowrap;
    width:100%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background:#fff;
    /*background-color:#1f89a7;
    box-shadow:inset 0 -1px 0 rgba(0,0,0,.3)*/
}
.orgNav ul::-webkit-scrollbar{
    width: 10px;  /* for vertical scrollbars */
    height: 5px;
}
.orgNav ul::-webkit-scrollbar-track{
    background:rgba(255,255,255,.1);
}
.orgNav ul::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.25);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.orgNav ul::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}
.orgNav li, #orgHome .subNavTabs .orgNav li {
    display:inline-block;
    position:relative;
    height: auto;
    line-height: inherit;
}

.orgNav li > span {
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    opacity:0;
    visibility:hidden;
    width: 100%;
    box-shadow: none;
    background:#53c8e6;
}
.subNavTabs .orgNav li > span { bottom:0; }
.orgNav li.selected > span { opacity:1; visibility:visible; }
.orgNav li a, #orgHome .subNavTabs .orgNav li a {
    border:none;
    margin:0;
    font-size:15px;
    line-height:50px;
    padding:0 7px;
    /*color:#fff;*/
    display:inline-block;
    text-shadow:none;
    text-indent:0 !important;
    position:relative;
    color: #616161;
    height: auto;
    width: auto !important;
    font-family: gotham;
}
.orgNav li.selected a, #orgHome .subNavTabs .orgNav li.selected a { color:#212121; }
#orgHome .subNavTabs .orgNav li a:before { display:none !important; }
.orgNav li a:after {
    content: "";
    background: #fff;
    height: 3px;
    width: 100%;
    position: absolute;
    bottom: 2px;
    display: block;
    margin-left: -7px;
    z-index: 2;
    display:none;
}
.orgNav li.selected a{
    /*background-color:rgba(230,230,230,.4);
    box-shadow:inset 0 -1px 0 rgba(0,0,0,.2);*/
    color: #212121;
}

.orgNav li.selected a:after {
    background: #53c8e6;
}
.orgNav .profileActions li a:after { background: transparent; }
.orgNav .profileActions li.selected a:after { background: #53c8e6; }

.orgNav li.moreOpt{
    position:absolute;
    top:0px;
    right:0px;
}
.orgNav li.moreOpt a{
    text-indent:-9999px;
    width:30px;
    background-position:-138px -1077px;
}
.groupTypeclass .orgNav li a:after, .groupTypecomm .orgNav li a:after { display:none; }


/*************************************************
*  Org Pages: Cover Photo
**************************************************/
.Desktop .scrollView>section section.orgProfile.hasCover,
.scrollView>section section.orgProfile.hasCover{
    height:180px;
    background-size:cover;
}
.orgProfile.hasCover~.orgNav{
    opacity:0.9;
    filter:alpha(opacity=90);
}
.orgProfile.hasCover h2,
.orgSettingsPage .orgProfile.hasCover h2{
    left:10px;
    margin:0;
    bottom:10px;
    width:60px;
    height:60px;
    position:absolute;
}
.orgSettingsPage .orgProfile.hasCover .inputProfile{
    margin-left:0;
}
.orgProfile.hasCover h2 .profileXL.isLoading:before{
    content:"";
    width:60px;
    height:60px;
    display:block;
    background:url(../images/ajax-loader.gif) center #e8e8e8 no-repeat;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
}
.orgProfile.hasCover h2 .profileXL>img,
.orgSettingsPage .orgProfile.hasCover h2 .profileM{
    border:2px solid rgba(255,255,255,1) !important;
    box-shadow:0 0 1px rgba(0,0,0,1) !important;
    border-radius:100px;
}
.communityPage .orgProfile.hasCover{
    display:none;
}
.communityPage.orgHomePage .orgProfile.hasCover{
    display:block;
}
.orgProfile.hasCover .buttonGroup{
    margin:0;
    color:#666;
    font-size:14px;
    line-height:26px;
    height:30px;
    background:rgba(255,255,255,.9);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border:1px solid;
    border-color:#e4e5ed #e4e5ed #b5b5b5 #e4e5ed;
    position:absolute;
    right:10px;
    top:10px;
    border-radius: 50px;
}
.orgProfile.hasCover .buttonGroup button{
    color:#666;
    font-size:14px;
    line-height:26px;
    height:30px;
    border:none;
    background:transparent;
    border-left:1px solid #e4e5ed;
}
.orgProfile.hasCover .buttonGroup button:first-of-type{
    border-left:none;
}
.orgProfile.hasCover .buttonGroup button:last-of-type{
    border-right:none;
}



/*************************************************
*  Org Pages: Show Menu
**************************************************/
#orgHome .showMenu .orgNavMenu{
    display:block;
}
.orgNavMenu{
    top:0px;
    left:0;
    width:100%;
    height:100%;
    text-align:center;
    overflow:hidden;
    position:fixed;
    top:0;
    margin:0;
    padding:49px 0 0 0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    display:none;
}
.orgNavMenu .scrollWrapper{
    height:100%;
    overflow:auto;
}
.orgNavMenu ul{
    list-style:none;
    margin:0;
    overflow:auto;
    height:100%;
    width:100%;
    padding:0;
    background:rgba(0,0,0,.4) !important;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    position:relative;
    display:table;
}
.orgNavMenu ul::-webkit-scrollbar{
    width: 10px;  /* for vertical scrollbars */
}
.orgNavMenu ul::-webkit-scrollbar-track{
    background:rgba(255,255,255,.1);
}
.orgNavMenu ul::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.75);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.orgNavMenu ul::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}
.orgNavMenu li{
    width:100%;
    display:table-row;
    height:50px;
    background:#373842;
}
.orgNavMenu li a{
    border:none;
    margin:0;
    line-height:50px;
    text-shadow:none;
    width:100%;
    display:block;
    padding:0;
    margin-bottom:0;
    color:#b3b3b3;
    font-size:20px;
    border-top:1px solid #464851;
    border-bottom:1px solid #272933;
}
#orgHome .actionBar .actionButtons.grpSettings button.orgEdit{
    width:36px;
}
.orgNavMenu li a:after,
#orgHome .actionBar .actionButtons button.orgEdit:after{
    content:"";
    width:36px;
    height:30px;
    display:block;
    margin-top:10px;
    margin-left:1px;
    position:absolute;
    right:0;
}
.orgNavMenu li.selected a{
    background:#22232b;
}
.orgNavMenu li.moreOpt{
    height:100%;
    background:none;
}
.orgNavMenu li.moreOpt a{
    text-indent:-9999px;
    width:100%;
    height:100%;
    font-size:1px;
    line-height:1;
}
.orgNavMenuDismiss{
    display:none;
}



/*********************************************
* Org Pages: Info Tab
*********************************************/
.keyboard .orgInfoPage .quickLinks{
    display:none;
}
.orgInfoPage .contentArea .orgNav{
    margin-bottom:0;
}
.orgInfoPage .contentArea .orgNavMenu+.formLayout{
    margin-top:-15px;
}
.orgInfoPage .scrollView{
    overflow-x:hidden;
}
.orgInfoPage .contentArea{
    padding-bottom:0;
}
.orgInfoPage .contentArea #communityContent{
    margin-bottom:0;
}
.orgInfoPage .contentArea #communityContent>div{
    background:#fff;
    overflow-x:auto;
    padding:0 15px;
    width:100%;
    /*margin-left:-15px;*/
}
.orgInfoPage .contentArea .formLayout{
    margin-bottom:0;
    min-height:0;
}
.orgInfoPage .contentArea .formLayout a{
    color:#1ca0c8;
}
.orgInfoPage .contentArea .formLayout .attachedFiles a{
    color:#000;
}
.orgInfoPage .contentArea .formLayout .newSection a{
    color:#000;
}
.orgInfoPage .contentArea .formLayout>section{
    padding:15px 15px 10px 15px;
    width:100%;
    /*margin-left:-15px;*/
    margin-bottom:0;
}
.orgInfoPage .contentArea .formPadding .formLayout>section{
    padding:0;
    width:auto;
    margin-left:0;
}
.orgInfoPage .contentArea .formLayout>section h2{
    margin-bottom:-15px;
    text-indent:0;
}
.orgInfoPage .contentArea .formLayout>section p,
.orgCalendarPage .contentArea .formLayout>section p,
.orgMediaPage .contentArea .formLayout>section p,
.orgSignupsPage .contentArea .formLayout>section p,
.orgMembersPage .contentArea .formLayout>section p,
.orgHomePage .contentArea .formLayout>section p{
    font-size:17px;
    padding:0;
}
.orgInfoPage .contentArea .formLayout>section.contactInfo h2{
    text-indent:8px;
}
.orgInfoPage .contentArea .formLayout>section.contactInfo p{
    padding:0 8px;
}
.orgInfoPage .contentArea .formLayout>section.editSection div{
    font-size:15px;
    line-height:20px;
    text-indent:0;
    padding:5px 32px 5px 5px;
    margin:0;
    outline:none;
    border:1px solid #fff;
    position:relative;
    font-family:Gotham-book;
}
.orgInfoPage .contentArea .formLayout>section.editSection div.attachedFiles{
    margin-top:20px;
}
.orgInfoPage .contentArea .formLayout>section.editSection div.editHeader{
    padding-right:32px;
    max-width:385px;
}
.orgInfoPage .contentAreaarticle.update .resharedUpdate .formLayout>section.editSection div.editBody{
    margin-bottom:17px;
    max-width:420px;
}
.Desktop .orgInfoPage .contentArea .formLayout>section.editSection div:focus{
    background:#fffee5;
    border:1px dotted #bdbb80;
}
.orgInfoPage .contentArea .formLayout>section.editSection img{
    max-height: 420px;
    max-width: 100%;
    margin-top: 20px;
    display: inline-block;
    width: 25%;
    padding-right: 10px;
}
span.infoBodyText {
    display: block;
}
.removeSection,
.orgInfoPage .contentArea .formLayout>section.editSection .removeSection{
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    right:22px;
    top:11px;
    text-indent:-9999px;
    overflow:hidden;
    background-position:-657px -1327px;
    opacity:.35;
    filter:alpha(opacity=35);
}
.Desktop .orgInfoPage .contentArea .formLayout>section.editSection .removeSection,
.Desktop .orgInfoPage .contentArea .formLayout>section.editSection .editContactInfo,
.Desktop .orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp,
.Desktop .orgInfoPage .contentArea .formLayout>section.editSection .editMoveDown{
    display:none;
}
.orgInfoPage .contentArea .formLayout>section.editSection:hover .removeSection,
.orgInfoPage .contentArea .formLayout>section.editSection:hover .editContactInfo,
.orgInfoPage .contentArea .formLayout>section.editSection:hover .editMoveUp,
.orgInfoPage .contentArea .formLayout>section.editSection:hover .editMoveDown,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveDown{
    display:block;
}
.orgInfoPage .contentArea .formLayout>section.editSection .editContactInfo{
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    right:22px;
    top:30px;
    text-indent:-9999px;
    overflow:hidden;
    background-position:-592px -1327px;
    opacity:.5;
    filter:alpha(opacity=50);
    margin-top:-10px;
}
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp{
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    right: 22px;
    top: 58px;
    text-indent:-9999px;
    overflow:hidden;
    background-position:-530px -1688px;
    opacity:.5;
    filter:alpha(opacity=50);
    margin-top:-10px;
}
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveDown{
    width:24px;
    height:24px;
    display:block;
    position:absolute;
    right: 22px;
    top: 58px;
    text-indent:-9999px;
    overflow:hidden;
    background-position:-530px -1748px;
    opacity:.5;
    filter:alpha(opacity=50);
    margin-top:-10px;
}
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp + .editMoveDown{
    top: 86px;
}
.orgInfoPage .contentArea .formLayout>section.editSection div h2{
    margin:0;
    line-height:20px;
}
.orgInfoPage .contentArea .formLayout>section.newSection{
    font-size:17px;
    margin:0 0 0 -15px;
    padding-top:5px;
    background:#f1f1f1;
}
.orgInfoPage .contentArea .formLayout>section.newSection a{
    display:block;
    width:100%;
    margin-bottom:-10px;
}
.orgInfoPage .contentArea .formLayout>section.newSection a:before{
    content:"";
    width:24px;
    height:24px;
    display:inline-block;
    vertical-align:middle;
    margin-left:-10px;
    margin-right:2px;
    margin-top:-5px;
    background-position:-84px -1148px;
}
.orgInfoPage .contentArea .formPadding{
    padding-top:20px;
}
.orgInfoPage .contentArea .formLayout>section.ptaInfo{
    font-size:17px;
    margin:-15px 0 0 -15px;
}
.orgInfoPage .contentArea .formLayout>section.ptaInfo a{
    display:block;
    width:100%;
    margin-bottom:-10px;
}
.orgInfoPage .contentArea .formLayout>section.ptaInfo a:before{
    content:"";
    width:24px;
    height:24px;
    display:inline-block;
    vertical-align:middle;
    margin-left:-10px;
    margin-right:2px;
    margin-top:-5px;
    background-position:-84px -1148px;
}
.orgInfoPage .contentArea .formLayout .emptyPanelMsg,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg,
.orgManagePage .contentArea .formLayout .emptyPanelMsg,
.orgHomePage .contentArea .formLayout .emptyPanelMsg{
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    padding:44px 15px 27px 15px;
    background:#e8e8e8;
    background-color: #edeef3;
    max-width:none;
    margin-bottom:0;
    font-family:gotham-book;
}
.orgInfoPage .contentArea .formLayout .emptyPanelMsg h2,
.orgInfoPage .contentArea .formLayout .emptyPanelMsg p,
.orgInfoPage .contentArea .formLayout .emptyPanelMsg button,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg h2,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg p,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg button,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg h2,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg p,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg button,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg h2,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg p,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg button,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg h2,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg p,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg button,
.orgHomePage .contentArea .formLayout .emptyPanelMsg h2,
.orgHomePage .contentArea .formLayout .emptyPanelMsg p,
.orgHomePage .contentArea .formLayout .emptyPanelMsg button,
.orgManagePage .contentArea .formLayout .emptyPanelMsg h2,
.orgManagePage .contentArea .formLayout .emptyPanelMsg p,
.orgManagePage .contentArea .formLayout .emptyPanelMsg button{
    max-width:550px;
    margin:0 auto;
    color:#000;
    width:100%;
}
.orgInfoPage .contentArea .formLayout .emptyPanelMsg h2,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg h2,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg h2,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg h2,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg h2,
.orgHomePage .contentArea .formLayout .emptyPanelMsg h2,
.orgManagePage .contentArea .formLayout .emptyPanelMsg h2{
    font-size:21px;
    line-height:31px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent:0;
}
.orgInfoPage .contentArea .formLayout .emptyPanelMsg p,
.orgCalendarPage .contentArea .formLayout .emptyPanelMsg p,
.orgMediaPage .contentArea .formLayout .emptyPanelMsg p,
.orgSignupsPage .contentArea .formLayout .emptyPanelMsg p,
.orgMembersPage .contentArea .formLayout .emptyPanelMsg p,
.orgHomePage .contentArea .formLayout .emptyPanelMsg p,
.orgManagePage .contentArea .formLayout .emptyPanelMsg p{
    padding-bottom:22px;
}



/*********************************************
* Org Pages: Messages Tab
*********************************************/
.orgMessagesPage .contentArea{
    padding:0;
    height:100%;
}
.orgMessagesPage .noScrollView,
.orgMessagesPage #communityContent,
.orgMessagesPage .chatWindow{
    height:100%;
}
.orgMessagesPage .chatWindow .chatScrollWrapper{
    padding-bottom:47px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}



/*********************************************
* Org Pages: Volunteer Tab
*********************************************/
.orgSignupsPage .scrollView .contentArea{
    background:#e8e8e8;
}
.orgSignupsPage .volunteerAskListing{
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
    width:100%;
    margin-left:-10px !important;
}
.orgSignupsPage .volunteerAskListing h1{
    margin-top:-15px;
    padding-top:35px;
}
.orgSignupsPage .volunteerAskListing .volunteerAsk{
}
.orgSignupsPage .volunteerAskListing .volunteerAsk h3{
    padding-right:10px;
}



/*********************************************
* Org Pages: Photo Album Tab
*********************************************/
.photoAlbums{
    padding:12px 5px 0 5px;
}
.photoAlbums>div{
    display:inline-block;
    width:100%;
    box-sizing:border-box;
    overflow:hidden;
    padding:0;
    position:relative;
    vertical-align: top;
}
.photoAlbums.editMode,
.photoAlbums.selectMode{
    padding-bottom:80px;
}
.photoAlbums.editMode .entryOptions,
.photoAlbums.selectMode .entryOptions{
    display:block;
}
.photoAlbums .entryOptions{
    display:none;
    right:auto;
    left:0;
    text-indent:-9999px;
}
.photoAlbums .entryOptions:before{
    display:none;
}
.photoAlbums .entryOptions:after{
    content:"";
    display:block;
    position:absolute;
    width:24px;
    height:24px;
    background:rgba(0,0,0,.2);
    top:9px;
    left:9px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    border:1px solid #fff;
    box-shadow:0 1px 1px rgba(0,0,0,.3);
}
.photoAlbums .photo.selected .entryOptions:after{
    background-color: #53c8e6;
    background-position: -467px -905px;
    border-color: #53c8e6;
}
.photoAlbums article.selected p{
    opacity:0.2;
    filter:alpha(opacity=20);
}





/* For all upload progress bars */
.photoAlbums .ui-progressbar,
.photoAlbumGallery .ui-progressbar{
    z-index:1;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    overflow:visible;
    position:absolute;
    width:160px;
    top:70px;
    right:20px;
}

.photoAlbums .ui-progressbar:before,
.photoAlbumGallery .ui-progressbar:before{
    content:"";
    background:#fff;
    width:160px;
    height:8px;
    position:absolute;
    display:block;
    z-index:2;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 1px 5px rgba(0,0,0,.1);
}
.photoAlbums .ui-progressbar:after,
.photoAlbumGallery .ui-progressbar:after{
    content:"";
    background:rgba(242,242,242,.9);
    box-shadow: 0 2px 5px rgba(0,0,0,.6);
    width:180px;
    height:45px;
    position:absolute;
    display:block;
    margin:-11px 0 0 -10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.photoAlbums .ui-progressbar .ui-progressbar-value,
.photoAlbumGallery .ui-progressbar .ui-progressbar-value{
    -moz-border-radius:4px 0 0 4px;
    -webkit-border-radius:4px 0 0 4px;
    border-radius:4px 0 0 4px;
    background:#da3c37;
    position:absolute;
    z-index:2;
    border:none;
    margin:0;
    height:8px;
}
.photoAlbums .ui-progressbar .progress-label,
.photoAlbumGallery .ui-progressbar .progress-label{
    position: absolute;
    z-index:2;
    font-size:12px;
    font-weight:normal;
    top:14px;
    left:auto;
    padding:0 5px;
    width:100%;
    box-sizing:border-box;
    text-align:right;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
    color: #000;
}



/* For album tab view only */
.photoAlbums>div .ui-progressbar{
    border:solid #e4e5ed;
    border-width:0 1px;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    height:8px;
    background:rgba(255,255,255,.6);
    position:relative;
    margin-bottom:-9px;
    width:100%;
    top:0;
    left:0;
}
.photoAlbums>div .ui-progressbar:before,
.photoAlbums>div .ui-progressbar:after{
    display:none;
}
.photoAlbums>div .ui-progressbar .ui-progressbar-value{
    -moz-border-radius:4px 0 0 0;
    -webkit-border-radius:4px 0 0 0;
    border-radius:4px 0 0 0;
}
.photoAlbums>div .ui-progressbar .progress-label{
    color: #fff;
    text-shadow:0 2px 5px rgba(0,0,0,1);
}



/* For album post updates only */
article.photoAlbums{
    padding:10px 10px 25px 10px;
    padding:10px 10px 50px 10px;
}
article.photoAlbums footer{
    overflow:visible;
}
article.photoAlbums footer .ui-progressbar{
    margin-top:-45px;
    margin-right:-1px;
    border:none;
    top:-18px;
    right:34px;
}



/*************************************************
*  Album Picker
**************************************************/
#_albumPicker .inviteCircles .circles .circle{
    margin-left:0;
}
#_albumPicker .recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo{
    border:1px solid rgba(0,0,0,.3);
    padding:0;
}
#_albumPicker .recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo:before{
    display:none;
}
#_albumPicker .recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo.addAlbum{
    background-position:-452px -1012px;
    border:1px dashed #aaa;
}
#_albumPicker .inviteCircles .formLayout .circles h2 button.circle .circleName{
    text-indent:72px;
}



/*********************************************
* Documents
*********************************************/
#media .folder,
.activityFeed .folder{
    width: auto;
    background: #fff;
    border: 1px solid #e4e5ed;
    padding: 10px;
    position: relative;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 5px 5px 0;
    text-align:center;
}
#media .folder a,
.activityFeed .folder a{
    display:block;
    width:84px;
    text-align:center;
    font-size:11px;
    color:#53c8e6;
    text-shadow:none;
    height:12px;
    padding:60px 0 10px 0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.activityFeed .folder a{
    width: unset !important;
    padding-top: 0 !important;
}
#media .folder:not(.activityFolders) a:before{
    content:"";
    width:56px;
    height:56px;
    display:block;
    position:absolute;
    top:5px;
    left:0;
    right:0;
    margin-left: auto;
    margin-right: auto;
    background-position:-642px -712px;
}
#media .folder.hasContent a:before{
    background-position:-578px -712px;
}
/* Add breakpoint so can fit 4
folders per row for iPhone6 and up*/
@media screen
and (min-width:375px)
and (max-width:405px){
    #media .folder a,
    .activityFeed .folder a{
        width:76px;
    }
}




/*************************************************
*  List Edit Controls
**************************************************/
.listEditControls{
    display:block;
    z-index:3;
    padding:0;
    overflow:visible;
    height:1px;
    text-align:center;
    position:fixed;
    width:100%;
    top:auto;
    border-top:1px solid #bababa;
}
@media screen
and (max-width:767px){
    .listEditControls{
        bottom:57px !important;
        left:0 !important;
        top:auto !important;
    }
}
.listEditControls ul{
    width:100%;
    list-style:none;
    display:table;
    margin:0 auto;
    padding:6px 10px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    box-shadow: 0 0px 20px rgba(0,0,0,0.3);
    background:#fff;
    box-sizing:border-box;
}
.listEditControls li{
    display:table-cell;
    padding-top:0;
    vertical-align:top;
}
.listEditControls li.disabled{
    opacity: 0.3;
    cursor: default;
}
.listEditControls li a{
    display:inline-block;
    padding-top:33px;
    font-size:10px;
    width:50px;
    margin:0 2px;
    cursor:pointer;
}
.listEditControls .download a{
    background-position:-517px -1081px;
}
.listEditControls .selectAll a{
    background-position:-391px -721px;
}
.listEditControls .deselectAll a{
    background-position:-391px -721px;
}
.listEditControls .copyTo a{
    background-position:-579px -1081px;
}
.listEditControls .setCover a{
    background-position:-643px -1081px;
}
.listEditControls .delete a{
    background-position:-580px -1022px;
}
.listEditControls .header{
    position:absolute;
    width:100%;
    display:none;
    top:0;
    font-size:12px;
    line-height:20px;
    margin-left:0;
    -moz-border-radius:6px 6px 0 0;
    -webkit-border-radius:6px 6px 0 0;
    border-radius:6px 6px 0 0;
    background:#000;
    color:#fff;
    text-shadow:none;
    text-indent:8px;
    text-align:left;
    padding:1px;
    width: auto;
    left: 0;
    right: -2px;
}
.listEditControls .close{
    position:absolute;
    width:20px;
    height:20px;
    text-indent:-9999px;
    display:none;
    top:0;
    right:0;
}
.listEditControls .close a{
    width:20px;
    height:20px;
    padding:0;
    display:block;
}
.listEditControls .close:after{
    content:"X";
    width:20px;
    height:20px;
    line-height:21px;
    position:absolute;
    top:0;
    right:0;
    display:block;
    text-indent:0;
    color:#fff;
    text-shadow:none;
    font-family:arial;
    font-size:10px;
    cursor:pointer;
}



/*************************************************
*  Org Settings
**************************************************/
.orgSettingsPage .orgNav{
    padding:0;
    margin-left:0;
    margin-bottom:0;
    z-index:1000;
    top:1px;
    top:0;
    position: sticky;
}
/*.orgSettingsPage .orgNav + section{
    margin-top:58px;
}*/
.orgSettingsPage .scrollView>section section.orgProfile,
.Desktop .orgSettingsPage .scrollView>section section.orgProfile{
    padding:0;
    margin-left:0;
    margin-top:50px;
}
.orgSettingsPage .orgNav ul{
    margin-left:0;
    padding:0;
    padding:0;
    overflow: auto hidden;
    height: 55px;
}
.orgSettingsPage .orgNav li{
    text-align:center;
    margin-left:0;
    padding:0;
}
.orgSettingsPage .orgNav li a{
    margin:0;
    display:block;
}
.orgSettingsPage .orgProfile,
.communityPage .orgProfile{
    text-align:center;
    margin-top:0;
    position:static;
}
.orgSettingsPage .orgProfile h2,
.communityPage .orgProfile h2{
    display:inline-block;
    margin:0 auto;
}
.orgSettingsPage .formLayout section .formPadding h1,
.communityPage .formLayout section .formPadding h1{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    padding:0;
    margin-left:0;
    font-size: 17px;
    font-weight: normal;
    padding-top: 11px;
    margin-bottom: -5px;
    text-indent:2px;
}
.orgSettingsPage .scrollView>.formLayout>section{
    border-bottom:none;
}
.orgSettingsPage .orgProfile h2 img,
.communityPage .orgProfile h2 .choosePhoto img{
    margin-left:0;
}
.orgSettingsPage .formLayout .inputProfile,
.communityPage .formLayout .inputProfile{
    margin-left:-50px;
    margin-top:35px;
}
.orgSettingsPage .formLayout .inputProfile.noBorder .choosePhoto,
.communityPage .formLayout .inputProfile.noBorder .choosePhoto{
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
}
.orgSettingsPage .formLayout .inputProfile.noBorder .choosePhoto:before,
.communityPage .formLayout .inputProfile.noBorder .choosePhoto:before{
    display:none;
}
.orgSettingsPage .formLayout .inputProfile.noBorder .choosePhoto:after,
.communityPage .formLayout .inputProfile.noBorder .choosePhoto:after{
    text-indent:0;
    margin-left:0;
    padding:0;
    white-space:normal;
    height:40px;
}
.orgSettingsPage .profileXL{
    background:transparent;
}
.orgSettingsPage .explainLink {
    color: #53c8e6;
    font: 16px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height: 32px;
}



/*********************************************
* Org Pages: Verify Members
*********************************************/
.verifyMembers.subPage .peopleListing{
    display:block;
}
.verifyMembers.subPage .peopleListing .groupedListing{
    padding:0;
}
.verifyMembers.subPage .headerActionsDescript{
    background:#f2f2f2;
    opacity:.98;
    filter:alpha(opacity=98);
    border-bottom:1px solid #c3c3c3;
}
.verifyMembers.subPage .headerActionsDescript p{
    margin:0;
    padding:20px 15px;
    text-align:center;
    font-size:14px;
}
.verifyMembers.subPage .headerActionsDescript p strong{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display:block;
    margin-bottom:11px;
}
#verificationApproval .verifyMembers.subPage .headerActions { background:#fff; }
.verifyMembers.subPage .headerActions{
    display:table;
    table-layout:fixed;
    list-style:none;
    background:#f2f2f2;
    border-bottom:1px solid #e4e5ed;
    margin:-1px 0 0 0;
    padding:0;
    width:100%;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-ms-sticky;
    position:-o-sticky;
    position:sticky;
    top:-1px;
    opacity:.98;
    filter:alpha(opacity=98);
}
.verifyMembers.subPage .headerActions li{
    display:table-cell;
    text-align:center;
    line-height:38px;
    border:solid #dfdfdf;
    border-width:1px 1px 0 0;
}
.verifyMembers.subPage .headerActions li:last-of-type{
    border-right:none;
}
.verifyMembers.subPage .headerActions li a{
    display:block;
}
.verifyMembers.subPage .headerActions li a:active{
    background:#e9e9e9;
}
.verifyMembers.subPage .peopleListing .formLayout section .verficationBtns{
    display:inline-block;
    position:absolute;
    line-height:50px;
    top:0;
    right:0;
    padding:7px 7px 0 4px;
    background:#fff;
    box-shadow:#fff -10px -1px 12px;
}
.verifyMembers.subPage .peopleListing .formLayout section .verficationBtns button{
    width:34px;
    height:34px;
    -moz-border-radius:17px;
    -webkit-border-radius:17px;
    border-radius:17px;
    display:inline-block;
    position:static;
    margin:8px 2px 4px 2px;
    text-indent:-9999px;
}
.verifyMembers.subPage .verficationBtns .accept{
    border-color:#4bc1e6;
    background-position:-272px -544px
}
.verifyMembers.subPage .verficationBtns .accept:active{
    background-color:#eafaff;
}
.verifyMembers.subPage .verficationBtns .decline{
    border-color:#e4e5ed;
    background-position:-336px -423px;
}
.verifyMembers.subPage .verficationBtns .decline:active{
    background-color:#f2f2f2;
}
.verifyMembers.subPage .peopleListing .formLayout section .verficationBtns button:only-child{
    background:#fff;
    line-height:40px;
    width:auto;
    height:40px;
    border-color:#e4e5ed;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    display:inline-block;
    position:static;
    margin:4px 2px;
    text-indent:0;
}
.verifyMembers .formLayout>section>label{
    top:39px;
}
.iPhone .verifyMembers.subPage .peopleListing .groupedListing .hgroup h2,
.iPad .verifyMembers.subPage .peopleListing .groupedListing .hgroup h2{
    margin-top:9px;
}



/*************************************************
*  PTA Profile Settings
**************************************************/
#orgSettingsPTA .orgSettingsPage .scrollView,
#orgSettingsPTA .orgSettingsPage .contentArea .formLayout>section.newSection{
    background:#fff;
}
#orgSettingsPTA .orgSettingsPage .contentArea{
    padding-bottom:0;
}
#orgSettingsPTA .orgSettingsPage .orgProfile{
    margin-bottom:-15px;
}



/*************************************************
*  Pick Email Client
**************************************************/
#mailClients .formLayout a{
    display:block;
    text-align:center;
    height:64px;
}
#mailClients .formLayout a:before{
    content:"";
    height:100%;
    display:block;
    margin:0 auto;
}
#mailClients .formLayout a.clientDefault:before{
    content:"Default Email App";
    /*font-family:"Myriad Set Pro","Lucida Grande","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif";*/
    line-height:68px;
    /*font-size:27px;*/
    background:none;
    width:100%;
    color:#2d54a3;
    font-size: 20px;
}
#mailClients .formLayout a.clientGmail:before{
    background-position:-11px -707px;
    width:112px;
}
#mailClients .formLayout a.clientYahoo:before{
    background-position:-130px -707px;
    width:156px;
}
#mailClients .formLayout a.clientAol:before{
    background-position:-298px -707px;
    width:78px;
}
#mailClients .formLayout a.clientOutlook:before{
    background-position:-395px -707px;
    width:210px;
}



/*************************************************
*  Animations:  All elements which needs to be
*  animated should be listed here
**************************************************/
.shadowBox,
.shadowBox .subPage,
.offStage,
.onStage,
.mainPanel{
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}



/*************************************************
*  Animations: Panels
**************************************************/

.slideLeftIn{
    animation:SlideLeftIn .3s;
    -webkit-animation:SlideLeftIn .3s;
    -webkit-animation-timing-function:ease;
}
.slideLeftOut{
    animation:SlideLeftOut .3s;
    -webkit-animation:SlideLeftOut .3s;
    -webkit-animation-timing-function:ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.slideRightIn{
    animation:SlideRightIn .3s;
    -webkit-animation:SlideRightIn .3s;
    -webkit-animation-timing-function:ease;
}
.slideRightOut{
    animation:SlideRightOut .3s;
    -webkit-animation:SlideRightOut .3s;
    -webkit-animation-timing-function:ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.slideUpIn{
    animation:SlideUpIn .3s;
    -webkit-animation:SlideUpIn .3s;
    -webkit-animation-timing-function:ease;
}
.slideUpOut{
    animation:SlideUpOut .3s;
    -webkit-animation:SlideUpOut .3s;
    -webkit-animation-timing-function:ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.slideDownIn{
    animation:SlideDownIn .3s;
    -webkit-animation:SlideDownIn .3s;
    -webkit-animation-timing-function:ease;
}
.slideDownOut{
    animation:SlideDownOut .3s;
    -webkit-animation:SlideDownOut .3s;
    -webkit-animation-timing-function:ease;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.fadeIn{
    animation:FadeIn 1s;
    -webkit-animation:FadeIn 1s;
    -webkit-animation-timing-function:ease;
}
.fadeOut{
    animation:FadeOut 1s;
    -webkit-animation:FadeOut 1s;
    -webkit-animation-timing-function:ease;
    left:-100%;
    opacity:0;
    filter:alpha(opacity=0);
}



/*************************************************
*  z-indexes
*************************************************/

/* Animation Mask */
.animationMask{
    z-index:10000;
}

/* Toast Notifications */
#toast{
    z-index:6000;
}


/* Rounded Corners */
body:before,
body:after,
body>div:first-of-type>div:first-of-type:before,
body>div:first-of-type>div:first-of-type:after{
    z-index:5000;
}


/* Dialog Boxes */
.actionSheet,
.alertBox{
    z-index:4500;
}


/* Popover */
.popover{
    z-index:4450;
}



/* Date Picker */
.formLayout .separateTime .timePicker select,
.showTimePicker .timePicker select,
.showTimePicker .timePicker input{
    z-index:4400;
}
.formLayout .separateTime .timePicker .closeTimePicker{
    z-index:4300;
}
#CalendarControl,
#CalendarControl table,
.formLayout .separateTime .datePicker{
    z-index:14200;
}
#CalendarControl .closeCal{
    z-index:14100;
}

/* Slideshow control */
.sliderWrapper {
    z-index: 3999;
}

/* Full Screen Profile Photos */
.showFullScreen div#userProfile_,
.showFullScreen .profileOthers .scrollView,
.showFullScreen .profileMyStudent .scrollView,
.showFullScreen .profileOthersChild .scrollView,
.showFullScreen .profileMyStudent .scrollView section.theirProfile,
.showFullScreen .profileOthers .scrollView section.theirProfile,
.showFullScreen .profileOthersChild .scrollView section.theirChildProfile{
    z-index:3900;
}



/* Full Screen Posts */
.showFullScreen #postView,
article.fullScreen,
article.fullScreen:before,
article.fullScreen p a.doneBtn,
article.fullScreen p img{
    z-index:3850;
}



/* Nav Tray for Mobile Devices */
#beforeMainPanel{
    z-index:3800;
}



div.showDrawer .logo,
div.showDrawer ~ #genericControls .logo{
    z-index:3780;
}


/* Edit List Control */
.listEditControls,
.toolTipMsg,
div.shadowBoxTop div.toolTipMsg{
    z-index:13750;
}



/* Shadow Box - Top Layer */
div.shadowBoxTop .logo{
    z-index:3710;
}
div.shadowBoxTop nav,
div.shadowBoxTop footer{
    z-index:3700;
}

/* download app. when this is displayed the user has no other ui choice other than download the app during fre */
.downloadAppPage {
    z-index: 3520 !important;
}

/* Coach Marks: Shadow Boxes */
div.shadowBoxTop >.showCoachMarks .coachMarkClick,
div.shadowBoxTop >.showCoachMarks .coachMarkSkip,
.freProfileMine.coachMark1 .scrollView>.formLayout .editMyProfile,
.freProfileMine.coachMark2 .scrollView>.formLayout .editMyProfile,
.freProfileMine.coachMark2 .scrollView>.formLayout .friendRequests,
.freProfileMine.coachMark3 .scrollView>.formLayout .editMyProfile,
.freProfileMine.coachMark3 .scrollView>.formLayout .myFamily,
.freProfileTeacher.coachMark1 .scrollView>.formLayout .editMyProfile,
.editProfileMyChild.showCoachMarks .scrollView>.formLayout .editMyChildProfile,
.editProfileMyChild.coachMark1 .circleColorPicker,
.editProfileMyChild.coachMark2 .childAttributeCoachMarks{
    z-index:3510;
}
div.shadowBoxTop>.showCoachMarks,
div.shadowBoxTop>.showCoachMarks .scrollView>.contentArea:before,
div.shadowBoxTop>.showCoachMarks .scrollView>div>.contentArea:before,
div.shadowBoxTop>.showCoachMarks .scrollView>.formLayout:before{
    z-index:3500;
}
.iPhone #orgHome .quickLinks,
.iPhone #userProfile_ .quickLinks{
    z-index:3470;
}
.iPhone .orgNav{
    z-index:3460;
}
.orgNavMenu{
    z-index:3451;
}
.orgNavMenuDismiss{
    z-index:3450;
}
label.mutedStatus{
    z-index:3400;
}
label.demoClassStatus{
    background:#fdf8e4;
    line-height:1.35;
    padding:16px 20px;
}
div.shadowBoxTop .placeHolderText,
div.shadowBoxTop .contactList .actionBar,
div.shadowBoxTop div.chatWindow .actionBar,
div.shadowBoxTop div.chatWindow .chatInput{
    z-index:3300;
}
div.shadowBoxTop .contactList.showCoachMarks footer.circles{
    z-index:3250;
}
div.shadowBoxTop .contactList.showCoachMarks .scrollView:before{
    z-index:3200;
}
#messageThreadNotificationBar{
    z-index:3010;
}
article.award .skillPoints{
    z-index:3006;
}
.recipientPickerCtrl .actionBar .nextButton,
.recipientPickerCtrl .actionBar .backButton,
.recipientPickerCtrl .actionBar .backButtonOnly,
div.shadowBoxTop div.removeFormGroup,
.showQuickLinks ~ .scrollView:before,
.actionBar .inlineToolTip,
.recipientPickerCtrl .contentInviteCircles div.searchResultsOverlay,
#imageDraw .loadingShadowBox,
div.shadowBoxTop div.studentAwards{
    z-index:3004;
}
div.shadowBoxTop .formLayout>label,
div.shadowBoxTop .formLayout>div>label,
.contentAutoSuggest .formLayout h1,
#addPost .formLayout .timePickerWrapper,
#communityInfoCardEdit .formLayout .timePickerWrapper,
#composeEmail .formLayout .timePickerWrapper,
.recipientPickerCtrl .actionBar .actionButtons,
.recipientPickerCtrl.labelTop .scrollView>.formLayout>.formLayout section ~ h1,
.shadowBox .formLayout>section.calendarToggle>label,
#activityTypes .actionBar .nextButton,
.chatWindow .scrollView.chatEntries .time,
#positionButtonPost,.invitedLabel{
    z-index:3003;
}
div.shadowBoxTop div,
div.shadowBoxTop section,
div.shadowBoxTop span.validationMsg,
div.shadowBoxTop .contactList footer.circles,
div.shadowBoxTop .chatWindow footer.chatPicker,
.chatInput .editableElement,
.recipientPickerCtrl .recipientsListLabel /* invite message page.  the tip was not showing when z-index:3400 */{
    z-index:3002;
}
div.shadowBoxTop .subPage{
    z-index:3001;
    /*height:auto;*/
}
div.shadowBoxTop:after{
    z-index:3000;
}
div.shadowBoxTop{
    z-index:3000;
}



/* Profile Page Quick Links */
.profilePage .quickLinks{
    z-index:2501;
}
.profilePage .showQuickLinks .quickLinksShadow{
    z-index:2500;
}


/* Shadow Box - Middle Layer */
div.shadowBoxMiddle nav,
div.shadowBoxMiddle footer{
    z-index:2004;
}
div.shadowBoxMiddle .placeHolderText,
div.shadowBoxMiddle .contactList .actionBar,
div.shadowBoxMiddle div.chatWindow .actionBar,
div.shadowBoxMiddle div.chatWindow .chatInput{
    z-index:2003;
}
div.shadowBoxMiddle div,
div.shadowBoxMiddle section,
div.shadowBoxMiddle span.validationMsg,
div.shadowBoxMiddle .contactList footer.circles,
div.shadowBoxMiddle .chatWindow footer.chatPicker{
    z-index:2002;
}
div.shadowBoxMiddle .subPage{
    z-index:2001;
}
div.shadowBoxMiddle:after{
    z-index:2000;
}
div.shadowBoxMiddle{
    z-index:2000;
}



/* Shadow Box - Bottom Layer */
.shadowBox nav,
.shadowBox footer{
    z-index:1010;
}
.shadowBox .orgNav{
    z-index:1005;
}
.shadowBox .placeHolderText,
.shadowBox .contactList .actionBar,
.shadowBox div.chatWindow .actionBar,
.shadowBox div.chatWindow .chatInput,
.shadowBox .verifyMembers.subPage .headerActions{
    z-index:1004;
}
.shadowBox .formLayout>label,
.shadowBox .formLayout>div>label,
.shadowBox .formLayout>section>label,.invitedLabel{
    z-index:1003;
    font-size: 15px;
    font-weight: 100;
}
.shadowBox div,
.shadowBox section,
.shadowBox span.validationMsg,
.shadowBox .contactList footer.circles,
.shadowBox .chatWindow footer.chatPicker{
    z-index:1002;
}
.shadowBox .subPage{
    z-index:1001;
}
.shadowBox:after{
    z-index:1000;
}
.shadowBox{
    z-index:1001;
}








/* Side Panel */
div#messageTrayIcon,
div#notificationCenterIcon{
    z-index:901;
}
.sidePanel{
    z-index:900;
}

/* Inline Box - Top */
div.inlineBoxTop{
    z-index:630;
}

/* Inline Box - Middle */
div.inlineBoxMiddle{
    z-index:620;
}

/* Inline Box - Bottom */
.inlineBox{
    z-index:610;
}



/* Desktop: Quick Links */
@media screen
and (min-width:800px){
    .Desktop .quickLinks{z-index:600;}
    .Desktop .quickLinkStudent{z-index:2501;}
}




/* Demo Class: Quick Links */
@media screen
and (min-width:500px)
and (max-width:520px){
    .inIFrame .Desktop .communityPage .quickLinks{z-index:600;}
}



.showDrawer ~ #genericControls #orgHome .communityPage .actionBar,
.showDrawer ~ #genericControls #orgHome .communityPage .subNavTabs{
    z-index:595;
}



/* Quick Links */
.quickLinks{
    z-index:590;
}
.showQuickLinks .quickLinksShadow{
    z-index:589;
}
@media screen
and (max-width:767px){
    .showQuickLinks ~ div#messageTrayIcon{
        z-index:588;
    }
    .communityManage .itemsList .profileL{
        padding-top: 0 !important;
    }
}




/* Org Nav */
.orgNav ~ .scrollView .loadMoreEntries{
    z-index:586;
}
.orgNav{
    z-index:585;
}


/* Volunteer Help Filter */
@media screen and (max-width:768px){
    .volunteerHeader.actionBar {
        z-index:560;
    }
}




/* Logo */
.logo{
    z-index:510;
}



/* Groups Panel - iPad+ */
@media screen and (min-width:768px){
    #_communityView{
        z-index:490;
    }
}




/* Main Navigation */
#_mainPanelContainer:after{
    z-index:451;
}
.mainNavBar{
    z-index:450;
}



/* Inline Box: Non-Mobile */
@media screen and (min-width:768px){
    div.inlineBoxTop{z-index:440;}
    div.inlineBoxMiddle{z-index:420;}
    .inlineBox{z-index:400;}
}


div.recommendIcon{
    z-index:300;
}

.sidePanel:before{
    z-index:221;
}

/* iPhone Quick Links*/
.addCurSection{
    z-index:220;
}




.communityPage .addCurSection button{
    z-index:215;
}


/* Action Bar */
.iPhone .mainPage>.actionBar,
.iPhone .mainPage>.subNavTabs{
    z-index:210;
}
.actionBar,
.subNavTabs{
    z-index:200;
}
.forModeMainPanel.actionBar{
    z-index:199;
}



/* Coach Marks: Main Page*/
.mainPanel .showCoachMarks .coachMarkClick,
.mainPanel .showCoachMarks .coachMarkSkip,
.mainPanel .showCoachMarks .scrollView section.updates h1:before,
.mainPanel .showCoachMarks .scrollView section.updates h1:after,
.mainPanel .showCoachMarks .scrollView .contentArea>.filterControl li:last-child:before,
.mainPanel .showCoachMarks .scrollView .contentArea>.filterControl li:last-child:after,
.mainPanel .showCoachMarks .scrollView #postsList>section:first-of-type h1 + article:after,
.mainPanel .showCoachMarks .scrollView #postsList>section:first-of-type h1 + div article:after{
    z-index:160;
}
@media screen and (min-width:768px){
    .mainPanel .showCoachMarks .scrollView .contentArea>.filterControl li:last-child{
        z-index:160;
    }
}
.mainPanel .showCoachMarks,
.mainPanel .showCoachMarks .scrollView>.contentArea:before,
.mainPanel .showCoachMarks .scrollView>div>.contentArea:before,
.mainPanel .showCoachMarks .scrollView>.formLayout:before{
    z-index:150;
}



/* Panels: Off Stage */
.offStage{
    z-index:100;
}




/*************************************************
*  Sprite Styles: Retina Images
*
*  List all selectors using which
*  uses the retina sprite here.
*  The background-size of the retina
*  sprite needs to updated below if
*  the dimensions of the sprite changes.
*
*************************************************/
.logo:after,
body:before,
body:after,
body>div:first-of-type>div:first-of-type:before,
body>div:first-of-type>div:first-of-type:after,
.mainNavBar .scrollableNav:before,
.mainNavBar:after,
.actionBar:before,
.actionBar:after,
.subPanel:before,
.mainNavBar a,
.mainNavBar:after,
div.recommendIcon,
.quickLinks div.addButton,
.createActivity div.addButton,
.quickLinks ul li:after,
.calendarAddEvent ul li:after,
.filterControl a.addChild .profileM,
.filterControl a.addSpouse .profileM,
.actionBar .backButton:before,
.actionButtons button:after,
.actionButtons ul li:after,
.actionButtons button.editEntry:after,
nav.newMessage .nextButton,
button.addLocation,
.autoSuggestPage .contentAutoSuggest span.newEntry:after,
.calendarDateHeader .AddEventInline,
.calendarInvite footer.acceptanceControl button:before,
.inviteRequest footer.acceptanceControl button:before,
.driverControl a.driverCircles,
.postView .chatInput button.like:before,
.postView .chatInput button.likeSelected:before,
.postView .chatInput button.share:before,
article footer li.like:before,
.likeActivity:before,
article .imageFeedbackControl li.like:before,
article footer li.likeSelected:before,
article footer li.share:before,
article footer li.addConnection:before,
article .feedbackCounts .like:before,
article .feedbackCounts .comment:before,
.entryOptions:before,
.selectOption:after,
a.loadMorePosts,
a.loadMorePosts:after,
.drillDown:after,
.removeSection,
.formLayout .nextButton,
.formLayout .switchControl input + label:before,
.formLayout .locationBrowse,
.formLayout .dateControl:after,
.formLayout .moreOptions button,
.formLayout .inputGroupV input:checked + label:after,
.formLayout .inputGroupV input.isSelected + label:after,
.formLayout .inputGroupV input:checked ~ .radioIndicator:after,
.formLayout .input-help li:before,
.formLayout .input-help li.valid:before,
.formLayout section .listGroupV .addActivities button:before,
.formLayout button.clearInput,
.formLayout .circles button.createCircle .circleName:after,
.formLayout section .inputGroupDiv div.selected:after,
.postOptions .addGroups:after,
.postOptions .addGroups:before,
.postOptions li .browseDesktop,
.postOptions li .browsePhone,
.postOptions li .postFb:before,
.postOptions li .reshareOption:before,
.postOptions li .scheduleOption:before,
.postOptions li .membersManagerOptions:before,
.postOptions li .noCommentOption:before,
.postOptions li .annotationRecordOption:before,
.contactList .hgroup button.addContact,
.contactList .hgroup button.removeContact,
.contactList .hgroup button.addCircles,
.contactList .hgroup button.pendingInvite,
.peopleListing .hgroup button.addCircles:after,
.contactList .scrollView .hgroup button.addAll:after,
.contactList .scrollView .hgroup button.removeAll:after,
.contactList .actionButtons button,
.circles button.createCircle span.circleName:after,
.actionBarInput .searchBox:before,
.actionBarInput .emailBox:before,
.circles article .horizontalList .addMore:after,
.circles .filterControl:before,
.userProfileInfo .profileActions button:before,
.profilePage .howConnected .profileM:before,
.chatWindow .closeButton,
.chatWindow .scrollView.chatEntries div.entry:before,
.chatInput input[type='file'],
nav.actionBarInput ul.actionButtons button.clearInput,
button.removeFromMsg:after,
.inviteCircles .peopleListing .listHeader button.removeFromMsg:before,
footer.options button:after,
footer.options li div:after,
.createAccountPage .facebookSignup button:before,
.profilePage .formLayout section.drillDown:after,
.editProfileMyChild .formLayout .selectedList .enterLoc,
.eventForm .contentEventForm label.importantEvent:before,
article.importantEvent h2:before,
.locationAddress a.callLocation,
.navDrawer .subNavBar li a:before,
.menuButton:after,
#orgHome.menu .actionBar .backButtonOnly:after,
.recipients span.selected span span:before,
.recipients span span span.selected:before,
.formLayout .selectedList .selected:after,
.autoSuggestPage .contentAutoSuggest .selected:after,
.createAccountPage .signupRole li div:before,
.viewCircleFilters:before,
.autoSuggest section.locations .hgroup:before,
.circlesTab .circles article .groupListing a:after,
.actionSheet .groupActions button:before,
.alertBox .groupActions button:before,
.tags:before,
.circleGroupHeader h2:before,
.headerBloomz .addFromSource button,
#addPost .postCreateNew .actionBar h1 span.tags:after,
#addUpdateEvent .eventForm .actionBar h1 span.tags:after,
.childAttributeCoachMarks .aboutLocks,
div.peopleListing .formLayout section p.cardHeader:after,
.welcomeMsg:before,
.mainNavBar ul li a:before,
.scPermissionsVisible:before,
.scPermissionsHidden:before,
.freWalkthrough .walkthrough section h2:before,
.profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span:before,
article.scLayout footer.verticalBtns li.selected:before,
.verifiedParentBadge img,
.verifiedExplanation.circleMembers .verifiedBy li:before,
.orgNav li.moreOpt a,
.inviteCircles .peopleCheckBox .formLayout section .hgroup button.seeMembers:after,
#orgHome .peopleListing .groupedListing .verticalList .hgroup button,
.chatWindow .actionBar .onlineStatus:after,
.orgInfoPage .contentArea .formLayout>section.newSection a:before,
.orgInfoPage .contentArea .formLayout>section.editSection .removeSection,
.orgInfoPage .contentArea .formLayout>section.editSection .editContactInfo,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveUp,
.orgInfoPage .contentArea .formLayout>section.editSection .editMoveDown,
.postOptions li .browseDesktop + label:before,
.recipientPickerCtrl .actionBar.selectGroups .sourceType a,
div.chatWindow #recipientHeader .nextButton,
.profilePage.profileOrg .actionBar .nextButton:after,
.calendarSwitcher:after,
.recipientPickerCtrl .externalSource:before,
.recipientPickerCtrl .externalSource:after,
.recipientPickerCtrl .peopleListing.peopleCheckBox .formLayout section .hgroup button.removeContact:after,
.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:after,
.formLayout section.signatureSwitcher:after,
.formLayout .plusBtn,
.recipientPickerCtrl .circles button.circle.hasLogo.addChild:before,
.add-new-profile:after,
article .feedbackControl li.inviteOthers img,
article .feedbackControl li.viewCalendar img,
article.update .resharedUpdate.calendarInvite ~ .feedbackControl.acceptanceControl li:before,
article.update .resharedUpdate.inviteRequest ~ .feedbackControl.acceptanceControl li:before,
.attachedFiles li button.remove,
#imageDraw .audio .remove,
.attachedFiles li a:before,
.formLayout .selectStyles:after,
.recipientPickerCtrl .importBtn,
.recipientPickerCtrl .phoneContactsBtn,
article footer.acceptanceControl li:before,
.verifyMembers.subPage .verficationBtns button,
.horizontalList .hgroup .addMember,
.volunteeredTasks .myTask:before,
.taskInput button.moreOpt,
.taskListing .taskOptions .taskOptionButtons li:after,
.enablePhoneContacts .accessSwitch:before,
.enablePhoneContacts .accessSwitch:after,
.enablePhoneContacts.step1 span,
.enablePhoneContacts.step1 span:before,
.calendarWrapper .dragger span:before,
.invitationPersonal .childProfile .remove,
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:after,
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:before,
.eventEndRepeat .contentEventEndRepeat .formLayout>section.selected:after,
.deviceSupport .scrollView:before,
.alertBox .dialogBox .dialogButtons.fbSignInBtns li button.primaryBtn:before,
.formLayout .linkControl.deleteOption,
.calendarInviteDetail .acceptanceStatus:before,
.actionBar ul.nextButton li.edit,
.actionBar ul.nextButton li.add,
.photoAlbums .photo.selected .entryOptions:after,
.listEditControls li a,
.inlineToolTip .success:before,
.iPhone .addCurSection button,
.iPhone .orgNav a,
.iPhone .orgNavMenu li a:after,
.navDrawer .subNavBar .trayActions li.username a.verifiedUser,
div.formPadding .formLayout .linkControl.addIcon:after,
form.formPadding .formLayout .linkControl.addIcon:after,
.taskListing .taskInput:before,
.recommendBloomz .emptyPanelMsg a:before,
.actionBar .nextButton.recommendBloomz,
.recommendBloomzTip.inlineToolTip p:before,
#rolePicker .circles .roleIcon .circleName:after,
#mailClients .formLayout a:before,
.sliderWrapper .arrows .slidePrev:after,
.sliderWrapper .arrows .slideNext:after,
.sliderWrapper .options a,
.optionListing.circleThumbnail:before,
section.fullPage .social:before,
.addCurSection button,
.addCurSectionStudent button,
#quickTours section.optionListing.circleThumbnail:after,
.appStorePicker .storeListing a,
.inviteBox .downloadInstructions a:before,
.recipients>span.selected>span>span:after,
.recipients>span>span>span.selected:after,
#student_name>span.selected:after,
.bloomzNotification p:before,
.viewCount:before,
#media .folder a:before,
.activityFeed .folder a:before,
.calendarInviteDetail .acceptanceStatus2s:before,
#_albumPicker .recipientPickerCtrl .inviteCircles .peopleListing .formLayout .circles .hgroup button.circle.hasLogo.addAlbum,
#imageDraw .postOptions li button:before,
.behaviorManagementItemIcon.behaviorManagementClassIcon,
.behaviorManagementItemIcon.behaviorManagementAddIcon,
.awardsAddIcon .awardsItemIcon,
.pickStudentAvatar .avatar.cam,
.behaviorManagementHeader .behaviorManagementSelectDay a:after,
.behaviorManagementAttendanceHeaderButtons .icon,
.attendanceStatusIcons,
.membersManageOptionIcon,
.quietHours .remove,
.subNavTabsStudentProfileCode .icon,
.messageIcons,
.messageWrapperFileIcon .insertPhoto label,
.messageWrapperFileIcon .attachFiles label,
.notificationsColumns input[type=button],
.awardsItem.addSkill .awardsItemIcon img,
.awardsItem.editSkill .awardsItemIcon img,
#addRecipient .nextButton,
#messageTrayIcon:before,
#notificationCenterIcon:before,
.storeListingModal .appStoreDownload,
.storeListingModal .playStoreDownload,
.createJoinGroup .icon,
.behaviorUndoButton,
.behaviorSelectMultipleButton,
.behaviorFullScreenButton,
.calendarDatePickerRangeDate .icon,
.bulkImportRadio.selected,
.bulkImportButtons .checked,
#addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherItem,
#addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherHelp,
.signupOccurrences .formPadding .radio.radioSelected,
#orgHome .communityPage .actionBar .backButtonOnly:after,
.communityEngagementCard ul li .iconsprite,
#orgHome .communityPage .actionBar .backButtonOnly:after,
#orgHome .communityPage .actionBar .backButtonOnly:after,
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-left-single-arrow:after,
.subNavTabs span.premiumCalendar:before,
.scrollView h1.subInlineTabs .premiumCalendar:before,
.behaviorInlineMenu ul li div .icon,
.simpleSwitchControl,
button.buttonIsSelected:after,
button.buttonIsNotSelected:after,
.bloomzCalendar .calendarViews .fc-header-toolbar .fc-icon-right-single-arrow:after,
.boundingBoxPhoto.audioControls a,
.inputImageVideoActivity div .attachAudio+label:after,
.inputImageVideoActivity div .attachImage+label:after,
.inputImageVideoActivity .annotationRecordOption:before,
.collectionList h2:before,
.addStudentTemplate:before,
.createNoticeTemplate:after,
.upgradeText:before,
.disallowed-icon:before,
.date-filter:before{
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat:no-repeat;
}

.videoPlayerChromeWebBrowser video::-webkit-media-controls-fullscreen-button{
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat:no-repeat;
}
@media screen
and (min-width:768px){
    .showCoachMarks .mainNavBar li a:before{
        background-image: url(../images/sprite@2x.png?20180516);
        background-size: 704px 2170px;
        background-repeat:no-repeat;
    }
}

.showCoachMarks .quickLinks:before,
.showCoachMarks .scrollView section.updates h1:after,
.showCoachMarks .scrollView .contentArea>.filterControl li:last-child:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .editMyProfile .inputProfile:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .friendRequests:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .myFamily .addSpouse:after,
.showCoachMarks.freProfileMine .scrollView>.formLayout .myFamily .addChild:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .editMyProfile .inputProfile:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .editMyProfile .genderPicker .inputGroupH label:last-of-type:after,
.showCoachMarks.freProfileTeacher .scrollView>.formLayout .friendRequests:after,
.showCoachMarks.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .inputProfile:after,
.showCoachMarks.editProfileMyChild.coachMark1 .scrollView>.formLayout .editMyChildProfile .circleColorPicker:after,
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutSchools:after,
.editProfileMyChild.coachMark2 .childAttributeCoachMarks .aboutLocks:after,
.enablePhoneContacts .switchTip:before{
    background-image: url(../images/spriteCoachMarks@2x.png?03022018);
    background-size: 230px 150px;
    background-repeat:no-repeat;
}



/*************************************************
*  postView: Input Message
*************************************************/
.postView .chatInput>div{
    padding-left:46px;
}
.postView .chatInput .addStudent{
    padding-left:10px;
}
.postView .chatInput input[type='file']{
    position:absolute;
    left:0;
    top:3px;
    width:50px;
    height:38px;
    overflow:hidden;
    text-indent:-9999px;
    cursor:pointer;
    background-position:-199px -600px;
}
.postView .chatInput input[type='text']{
    width:100%;
    height:30px;
    margin:5px 0 0 0;
    padding:0;
    line-height:24px;
    text-indent:5px;
    -webkit-appearance: none;
    border:1px solid #c3c3c3;
}
.postView .chatInput input[type='text']:focus{
    border:1px solid #c3c3c3;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    outline:none;
    -webkit-appearance: none;
}
.postView .messages h1{
    background:transparent;
}



/*************************************************
*  Remove Chat Heads for now
*************************************************/
.chatWindow footer.chatPicker,
.chatWindow .closeButton{
    display:none;
}
.chatWindow .actionBar .backButton{
    border-right:1px solid transparent;
    background:transparent;
}
.chatWindow .actionBar h1:after{
    left:0;
}



/*************************************************
*  Mobile Portrait and smaller
*************************************************/
@media screen
and (max-width:767px){

    body{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        padding:0 !important;
    }
    .showCoachMarks .mainNavBar li a:before{
        background:none;
    }
    #genericControls,
    #genericControls>#_communityView,
    .keyboardWrapper{
        height:100%;
    }
    #genericControls>#_sidechat{
        height:auto;
    }
    div.showDrawer ~ #genericControls .inlineBox .subPage{
        padding-left:0;
    }
    div.showDrawer ~ #genericControls #_communityView .scrollView{
        -webkit-overflow-scrolling:auto;
    }
}


/**********************************
SmartFeed
***********************************/
.profilePictureUpdatePost .connectionPhoto .inputProfile{
    float:right;
    width:20%;
}

.profilePictureUpdatePost .connectionPhoto .inputProfile .choosePhoto{
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
}
.profilePictureUpdatePost .connectionPhoto .inputProfile .choosePhoto:before{
    display:none;
}
.profilePictureUpdatePost .connectionPhoto .inputProfile .choosePhoto:after{
    text-indent:0;
    margin-left:0;
    padding:0;
    white-space:normal;
    height:40px;
}

.album footer input.browseDesktop{
    display:none;
}

/*PT Event*/
.slotListing label.slotTimes{
    font-size: medium;
}
.slotListing label.lunchSlot div{
    line-height: 15px;
    margin-bottom: 16px;
    margin-top: -7px;
    font-size: 14px;
    text-indent: 13px;
    text-decoration: none !important;
}
.slotListing label.slotTimesStriked{
    text-decoration: line-through;
}

.slotListing .dayHeader {
    text-align:left;
    margin-bottom:15px;
    margin-top:10px;
    font-weight:bold;
    padding-left:10px;
}
.slotDuration .selectedList input:focus + span.durationMask{
    display: none;
}
.slotDuration .selectedList input + span.durationMask{
    display: block;
    position: absolute;
    margin-top: -40px;
    margin-bottom: 10px;
    margin-left: 101px;
    background: transparent;
    vertical-align: middle;
    border: none;
    cursor: pointer;
}
.slotDuration .durationMask:after{
    content: " min";
}
.slotListing .dayHeader.nSlots {
    right: 55px;
    position: absolute;
}
.slotListing .ptSlotAdd {
    text-align: center;
    font-size: medium;
    cursor: pointer;background:#fafafa;
    color:#707b7f;
    font-size:15px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    text-indent: -7px !important;
}
.slotListing .ptslot label{
    font-size:18px;
}
.slotListing .desktopAddNewDate {
    visibility: hidden;
    height: 0px;
    position: absolute;
    top: -10px;
    left: 80px;
}
.slotListing .ptcSlotsAddMoreDates {
    text-align: center;
}
.slotListing .ptcSlotsAddMoreDates a{
    display:block
}
.slotListing .ptcSlotListingAddNewDateiOS {
    text-align: center;
}
.slotListing .ptcSlotListingAddNewDateiOS>label {
    cursor: pointer;
    width: 100%;
    position: absolute;
    left:0;
    background: rgb(242, 242, 242);
    border-bottom-color: rgba(0, 0, 0, .2);
    border-bottom-style: solid;
    border-bottom-width: 1px;
}
.slotListing .ptcSlotListingAddNewDateiOS>input {
    opacity: 0;
    position: absolute;
    width: 1px;
    height: 1px;
}
.slotListing .day {
    border: 0 !important;
    float: right;
    width: 0px;
    height: 0px;
}
.slotListing .removeSection{
    right:12px;
}
.slotListing section.dayHeaderWrapper{
    position:relative;
    background:transparent;
    border:0;
    box-shadow:none;
    margin-bottom:0;
}
.dayHeaderWrapper .bulkActions{
    width: 24px;
    height: 24px;
    display: block;
    position: relative;
    top: -15px;
    right:auto !important;
    float:right;
    opacity: .35;
    filter: alpha(opacity=35);
    margin:10px 13px 0 0;
    overflow:visible;
}
.dayHeaderWrapper .bulkActions.removeSection{
    right:22px;
}
.dayHeaderWrapper .bulkActions.noSlots{
    width:auto;
    margin-right:0;
    cursor:default;
}
.dayHeaderWrapper .bulkActions.noSlots:before{
    right:auto;
    position: relative;
}
.dayHeaderWrapper .undoAll{
    position:relative;
    font-size:15px;
    margin-top:-6px !important;
    height:24px;
    line-height:24px;
}
.dayHeaderWrapper .bulkActions:before{
    content: attr(data-text);
    text-align: right;
    color: #000;
    text-indent: 0;
    display: block;
    position: absolute;
    margin-top: 5px;
    width: auto;
    white-space: nowrap;
    right: 32px;
}
.formLayout button.removeSlot {
    float:right;
    height:30px;
    margin-top:11px;
    margin-right:3px;
    vertical-align:text-top;
    line-height:30px;
    background:none;
    border:none;
    color:#1ca0c8;
}
.formLayout .dateControl li {
    position: relative;
}
.PTEvent .formLayout .separateTime .datePicker{
    padding-left: 4px;
}
.PTEvent div.formPadding .formLayout .linkControl, form.formPadding .formLayout .linkControl{
    /*padding-left: 45px;*/
    padding-left: 145px;
    text-indent:0;
}
.ptConfFooterForm {
    top: 8px;
    left: 8px;
    position: relative;
}
.ptConfFooterForm button {
    position: static;
    margin-right: 8px;
}
#_sendPtInvite #addPost .postCreateNew{
    padding-bottom:0;
}




/**********************************
* Class Creation
***********************************/
#newClass .orgProfile.hasCover{
    height: 200px;
    padding:0;
    margin-left:0;
    margin-top:49px;
}
#newClass .orgNav{
    padding-top:0;
    top:0;
}
#newClass .contentArea{
    padding:0 0 40px 0;
}
#newClass .contentArea .formLayout>section{
    margin-bottom:0;
}







/*Progress bar*/
.ui-progressbar {
    position: relative;
}
.progress-label {
    position: absolute;
    left: 50%;
    top: 4px;
    font-weight: bold;
    text-shadow: 1px 1px 0 #fff;
}

/***********************************
*  Recommend Bloomz Options
************************************/
#recommendPicker section.optionListing.circleThumbnail:before{
    width:56px;
    height:56px;
    margin:-4px 0 0 -70px;
}
#recommendPicker section.optionListing.circleThumbnail,
#recommendPicker .formLayout section.optionListing.circleThumbnail{
    padding-left:84px;
}
#recommendPicker section.optionListing h2.noSubtext{
    margin-top:12px;
}


/**********************************
* Recommend Bloomz
***********************************/
.recommendBloomz .formLayout section h1{
    line-height:24px;
}
.recommendBloomz section.formLayout section.emptyPanelMsg{
    padding-top:78px;
}
.recommendBloomz .emptyPanelMsg a{
    width:72px;
    display:inline-block;
    padding-top: 90px;
    margin:32px 16px;
    text-align:center;
    text-indent:0;
    position:relative;
    font-size:15px;
    line-height:1;
}
.recommendBloomz .emptyPanelMsg a:before{
    content:"";
    width:72px;
    height:72px;
    display:block;
    position:absolute;
    top:0;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
}
.recommendBloomz .emptyPanelMsg a.recommendEmail:before{
    background-position:-380px -765px;
    border:1px solid #53c8e6;
}
.recommendBloomz .emptyPanelMsg a.recommendURL:before{
    background-position:-441px -765px;
    border:1px solid #ffb900;
}
.recommendBloomzTip.inlineToolTip,
.formLayout section.recommendBloomzTip.inlineToolTip{
    background:#fff;
    border-bottom:1px dashed #e4e5ed !important;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.recommendBloomzTip.inlineToolTip p{
    padding:0 10px;
    margin-bottom:10px;
    text-align:center;
}
.recommendBloomzTip.inlineToolTip p:before{
    content:"";
    width:20px;
    height:22px;
    display:block;
    text-indent:-9999px;
    background-position:-659px -548px;
    display:inline-block;
    vertical-align:middle;
    margin-right:4px;
}
.hideHeartIcon p{
    text-align:left !important;
}
.hideHeartIcon p:before{
    width:0px !important;
    visibility:hidden;
    margin-right:0px !important;
}
.recommendBloomzTip.inlineToolTip .dismissInlineToolTip:after,
.formLayout section.recommendBloomzTip.inlineToolTip .dismissInlineToolTip:after{
    color:#8e8e8e;
}
.recommendUrlCopy{
    margin:32px 0 20px -66px;
    padding:10px;
    background:#fafafa;
    border:1px solid;
    border-color:#ececec #ececec #dddddd #ececec;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    line-height:22px;
    text-indent:0;
    text-align:center;
}
#recommendPicker .recommendUrlCopy:empty{
    display:none;
}
.recommendUrlCopy .getLinkExplanation{
    max-width:270px;
    margin:0 auto 10px auto;
    display:block;
    color:black;
    font-size:17px;
}
.recommendUrlCopy .getLinkUrl{
    display:block;
    width:100%;
    height:42px !important;
    margin-top:0 !important;
    margin-bottom:10px;
    background:#fff5da;
    font-size:15px;
    border:1px solid rgba(0,0,0,.2);
    color:#000;
    padding:10px;
    line-height:1;
    text-indent:0;
    text-align:left;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    outline: none;
    -webkit-user-select:auto;
    white-space: nowrap;
    overflow: hidden;
}
.recommendUrlCopy .getLinkUrl:focus{
    border:1px solid rgba(0,0,0,.2);
}
.recommendBloomz .emptyPanelMsg footer span{
    text-decoration:underline;
    cursor:pointer;
}



/*************************************************
*  Teachers You May Know
*************************************************/
#recommendColleagues .teachersYouMayKnow .hgroup{
    min-height:112px;
}
#teachersYouMayKnowCard .title > a{
    text-decoration: underline;
}
#recommendColleagues .teachersYouMayKnow .formLayout{
    margin-bottom:0;
}




/**********************************
* Tool Tips
***********************************/
.toolTipMsg{
    position:absolute;
    background:#fdf8e3;
    box-shadow:0 1px 2px rgba(0,0,0,.1);
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid;
    border-color:rgba(0,0,0,.15) rgba(0,0,0,.15) rgba(0,0,0,.2) rgba(0,0,0,.15);
    padding:12px;
}
.toolTipMsg p{
    font-size:13px !important;
    text-indent:0;
    text-shadow:none;
    text-align:left;
    margin:0;
}
.toolTipMsg p a{
    color:#1ca0c8;
}
.toolTipMsg.tl:before,
.toolTipMsg.tm:before,
.toolTipMsg.tr:before,
.toolTipMsg.lt:before,
.toolTipMsg.lm:before,
.toolTipMsg.lb:before,
.toolTipMsg.rt:before,
.toolTipMsg.rm:before,
.toolTipMsg.rb:before,
.toolTipMsg.bl:before,
.toolTipMsg.bm:before,
.toolTipMsg.br:before{
    content:"";
    width:10px;
    height:10px;
    background:#fdf8e3;
    display:block;
    position:absolute;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin:0 0;
    transform-origin: 0 0;
    border:solid rgba(0,0,0,.15);
}
.toolTipMsg.tl:before{
    border-width:1px 0 0 1px;
    left:18px;
    top:-9px;
}
.toolTipMsg.tm:before{
    border-width:1px 0 0 1px;
    margin-left:0px;
    left:50%;
    top:-9px;
}
.toolTipMsg.tr:before{
    border-width:1px 0 0 1px;
    right:8px;
    top:-9px;
}
.toolTipMsg.lt:before{
    border-width:0 0 1px 1px;
    left:-1px;
    top:10px;
}
.toolTipMsg.lm:before{
    border-width:0 0 1px 1px;
    margin-top:-8px;
    left:-1px;
    top:50%;
}
.toolTipMsg.lb:before{
    border-width:0 0 1px 1px;
    margin-bottom:5px;
    left:-1px;
    bottom:10px;
}
.toolTipMsg.rt:before{
    border-width:1px 1px 0 0;
    right:-12px;
    top:10px;
}
.toolTipMsg.rm:before{
    border-width:1px 1px 0 0;
    margin-top:-8px;
    right:-12px;
    top:50%;
}
.toolTipMsg.rb:before{
    border-width:1px 1px 0 0;
    margin-bottom:5px;
    right:-12px;
    bottom:10px;
}
.toolTipMsg.bl:before{
    border-width:0 1px 1px 0;
    left:18px;
    bottom:-4px;
}
.toolTipMsg.bm:before{
    border-width:0 1px 1px 0;
    margin-left:0px;
    left:50%;
    bottom:-4px;
}
.toolTipMsg.br:before{
    border-width:0 1px 1px 0;
    right:8px;
    bottom:-4px;
}
.toolTipMsg.animateIn{
    -webkit-animation:flipInX .6s;
    animation:flipInX .6s;
    -webkit-animation-delay:1s;
    animation-delay:1s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}



/**********************************
* Tool Tip Types
***********************************/
.toolTipMsg.tipTray{
    width:140px;
    margin:38px 0 0 20px;
}





/**********************************
* Tool Tips: Invitation Input Focus
***********************************/
.inviteSubject {
    padding-left:10px;
    font-size: medium;
    white-space: nowrap;
    border-bottom:1px solid #e4e5ed;
}

.inviteSubject .subjectTitle{
    color: #aaa;
}


.alertBox .dialogBox button.verifyButtons{
    /*width:90%;
    margin-left:5%;
    margin-bottom: 10px;*/
}

.videoPlayerWeb {
    align-content: center;
    margin: 0 auto;
    background:#f5f5f5;
}

.videoPlayerPhone {
    height: 378px;
    align-content: center;
    margin: 0 auto;
}

article.update .videoPlayerPhone {
    height: 100%;
}

div.videoPlayer video {
    display:block;
}

div.videoPlayer videogular {
    display: inline;
}



/**********************************
* Slideshow Control
***********************************/
.sliderWrapper {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #3795B6;
    background: -moz-linear-gradient(-45deg,  #cbbacc 0%, #2580b3 100%);
    background: -webkit-linear-gradient(-45deg,  #cbbacc 0%,#2580b3 100%);
    background: linear-gradient(135deg,  #cbbacc 0%,#2580b3 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbbacc', endColorstr='#2580b3',GradientType=1 );
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding:0;
}
.sliderWrapper .slide {
    height: 100%;
    width: 100%;
    max-width:1600px;
    display: block;
    position: relative;
    overflow: auto;
    text-align:center;
    outline: none;
    overflow:visible;
    margin:0 auto;
}
.sliderWrapper .slide .slideSoftDismiss{
    display:block;
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
}
.sliderWrapper .slide #imageWrapper{
    position:relative;
    display:inline-block;
    background:rgba(0,0,0,.85);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow:0 5px 20px rgba(0,0,0,.4);
    width:100%;
    height:100%;
    margin-top:-1px;
    padding-bottom: 60px;
}
.sliderWrapper .slide img {
    display: block;
    margin: 0 auto;
    position: relative;
    margin-top:0;
}
.sliderWrapper .slide img.showImage {
    visibility : visible;
}
.sliderWrapper .slide img.hideImage {
    visibility : hidden;
}
.sliderWrapper .zoom {
    -webkit-overflow-scrolling: touch;
}
.sliderWrapper .arrows {
    top:0;
    right:20px;
    padding:0;
    height:1px;
}
.sliderWrapper .arrows a {
    color: #ddd;
}
.sliderWrapper .arrows .back:after{
    background-position:-96px -4px;
}
.sliderWrapper .arrows .slidePrev,
.sliderWrapper .arrows .slideNext{
    position:absolute;
    height:90%;
    text-indent:-9999px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    z-index:1;
    margin-top: 30px;
}
.sliderWrapper .arrows .slidePrev img,
.sliderWrapper .arrows .slideNext img{
    width:100%;
    height:100%;
    opacity:0;
}
.sliderWrapper .arrows .slidePrev{
    left:0;
    width:20%;
}
.sliderWrapper .arrows .slideNext{
    right:0;
    width:20%;
}
.sliderWrapper .arrows .slidePrev:after,
.sliderWrapper .arrows .slideNext:after{
    content:"";
    display:block;
    width:40px;
    height:64px;
    position:absolute;
    top:50%;
    margin-top:-32px;
    opacity:0.6;
    filter:alpha(opacity=60);
}
.sliderWrapper .arrows .slidePrev:after{
    left:0;
    background-position:-584px -948px;
}
.sliderWrapper .arrows .slideNext:after{
    right:0;
    background-position:-651px -948px;
}
.sliderWrapper .arrows .slideClose{
    text-indent:-9999px;
    position:absolute;
    display:inline-block;
    width:30px;
    height:30px;
    right:0;
    margin:5px 5px 0 0;
    z-index:1;
    background:#000;
    border-radius:50px;
}
.sliderWrapper .arrows .slideClose:before, .sliderWrapper .arrows .slideClose:after{
    content:"";
    height: 14px;
    width: 2px;
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
.sliderWrapper .arrows .slideClose:before {
    transform:rotate(45deg);
}
.sliderWrapper .arrows .slideClose:after{
    transform:rotate(-45deg);
}
.sliderWrapper .options{
    position:absolute;
    bottom:0px;
    height:60px;
    text-align:left;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    z-index:2;
    padding:0 12px;
    display: flex;
    width: 100%;
}
.sliderWrapper .options a{
    display:inline-block;
    height:50px;
    width:40px;
    text-indent:-9999px;
    text-align:left;
    opacity:0.7;
    filter:alpha(opacity=70);
}
.sliderWrapper .options a.slideDownload{
    background-position:-649px -1012px;
}
.sliderWrapper .options a.slideZoom{
    background-position:-649px -889px;
}
.sliderWrapper .options a.slideLike{
    background-position:-523px -472px;
}
.sliderWrapper .options a.slideLikeSelected{
    background-position: -13px -1193px
}

.sliderWrapper .options a.slideOptions{
    background:none;
    text-indent:0;
    width:auto;
    padding:0 15px;
    height:50px;
    line-height:50px;
    text-shadow:0 2px 4px rgba(0,0,0,.5);
    color:#fff;
    margin-top:0;
    vertical-align:bottom;
}
.sliderWrapper .options a.slideOptions:hover{
    background:rgba(0,0,0,.5);
    border-radius: 5px;
}
.sliderWrapper .zoom .arrows .slidePrev,
.sliderWrapper .zoom .arrows .slideNext,
.sliderWrapper .zoom #imageWrapper:after{
    display:none !important;
}
.sliderWrapper .zoom #imageWrapper{
    overflow:auto;
}
.sliderWrapper .zoom .options a.slideZoom{
    background-position:-649px -829px;
}
.sliderWrapper .slideLikesCount,
.sliderWrapper .slideCommentsCount{
    color: #FFF !important;
    opacity: .70 !important;
    filter: alpha(opacity=70) !important;
    text-indent: 0 !important;
    text-shadow: none;
    font-weight: bold;
    padding-top: 20px;
    margin: 0 5px;
    cursor: pointer;
}
.sliderWrapper .slideLikesCount:hover,
.sliderWrapper .slideCommentsCount:hover{
    opacity: 1;
    filter: alpha(opacity=100);
}
.sliderWrapper .commentsDisabled .slideLike{
    opacity: .5 !important;
    filter: alpha(opacity=50) !important;
    cursor:default !important;
}
.sliderWrapper .commentsDisabled .slideLike:hover{
    opacity: .5 !important;
    filter: alpha(opacity=50) !important;
}
.sliderWrapper .imageCaption{
    position: absolute;
    bottom: 48px;
    position:absolute;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    z-index:3;
    padding:12px 20px 0 20px;
    width: 100%;
    text-align: left !important;
}
.sliderWrapper .options:before{
    content:"";
    width:100%;
    height:140px;
    position:absolute;
    left:0;
    bottom:0;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 )"; /* IE6-9 */
}
.sliderWrapper .imageCaption span{
    color: #fff;
    text-shadow:0 2px 6px rgba(0,0,0,.5);
}
.sliderWrapper .imageCaption .readMoreLink .more{
    background: #000;
}
.readMore .content a{
    color:#FFF !important;
}
.readMore a.translateLink{
    color:#1ca0c8 !important;
}
.readMore,
.readMore span{
    word-wrap: break-word;
}
.sliderWrapper .readMore a{
    color:#fff !important;
    text-decoration:underline;
}
.bloomzSliderDiv .readMore a.translateLink{
    color:#FFF !important;
}
/*
.Desktop .sliderWrapper #imageWrapper + .imageSliderFooter{
    visibility: hidden;
}
.Desktop .sliderWrapper #imageWrapper:hover + .imageSliderFooter,
.Desktop .sliderWrapper .imageSliderFooter:hover{
    visibility: visible !important;
}
*/
.sliderWrapper .zoom{
    overflow:hidden;
    background:#000;
}
.Desktop .sliderWrapper .zoom .options{
    bottom:15px;
    height:45px;
}
.Desktop .sliderWrapper .zoom #imageWrapper::-webkit-scrollbar{
    width: 15px;  /* for vertical scrollbars */
    height: 15px;  /* for horizontal scrollbars */
}
.Desktop .sliderWrapper .zoom #imageWrapper::-webkit-scrollbar-track,
.Desktop .sliderWrapper .zoom #imageWrapper::-webkit-scrollbar-corner{
    background:#000;
}
.Desktop .sliderWrapper .zoom #imageWrapper::-webkit-scrollbar-thumb{
    background: rgba(255, 255, 255, 0.25);
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.Desktop .sliderWrapper .zoom #imageWrapper::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}



/*******************************
* iFramed Demo Class
********************************/
#_demoClass .subPage {
    padding-top: 0 !important;
}
#_demoClass iframe {
    width: 100%;
    height: 100%;
    max-width:533px;
    background:#e8e8e8;
}
#_demoClass .scrollView{
    overflow:hidden;
}
#_demoClass .scrollView:after {
    display: none;
}
#_demoClass .inlineBox .subPage .scrollView::-webkit-scrollbar {
    width: 0 !important;
}
#_demoClass .loadMoreEntries {
    position: relative !important;
}
#_demoClass .loadMoreEntriesText {
    text-align: center;
    top: 20px;
    line-height: 0;
}
li.demoClass .tagClasses{
    margin-top:-1px;
}
li.demoClass #title {
    position:absolute;
    top:-3px;
    height:35px;
    line-height:35px;
    overflow:visible;
    border-top:none;
}
li.demoClass sup {
    color: rgb(232, 108, 108);
    font-weight: bold;
    font-size: x-small;
}
#demoClassTooltip {
    display:none;
}
.orgHomePage #demoClassTooltip {
    display:block;
}
.iPhone #_demoClass .scrollView,
.iPhone #_demoClass .scrollView {
    border-top: none !important;
}
.inIFrame .iPhone .communityPage.orgMembersPage .backButtonOnly:after,
.inIFrame .iPhone .communityPage.orgInfoPage .backButtonOnly:after{
    display:block;
}
.inIFrame .iPhone .communityPage.orgMembersPage .backButtonOnly:before,
.inIFrame .iPhone .communityPage.orgInfoPage .backButtonOnly:before{
    display:none;
}

.inIFrame .communityPage .backButtonOnly{
    width:auto;
    text-indent:10px;
}
.inIFrame .communityPage .backButtonOnly:after,
.inIFrame .iPhone .communityPage.showMenu .backButtonOnly:after{
    display:none;
}
.inIFrame .communityPage .backButtonOnly:before,
.inIFrame .iPhone .communityPage.showMenu .backButtonOnly:before{
    content:"Exit Demo";
    line-height:48px;
    text-shadow:none;
    display:block;
}
.inIFrame .chatWindow .scrollView.chatEntries {
    padding-bottom: 100px;
}
.inIFrame #messageTrayIcon,
.inIFrame #notificationCenterIcon{
    display:none !important;
}
.inIFrame #orgHome .communityPage .actionBar h1{
    text-align: right;
    padding: 4px 17%;
    font-size: 13px;
    line-height: 16px;
    color: #787878;
}
.inIFrame #orgHome .actionBar .actionButtons{
    right:0 !important;
}
#autoTranslate {
    background-color: rgba(0, 0, 0, 0.1);
}
.scheduledPostTimeStamp {
    margin-top: 20px;
}
/* Controls that are used both in signup flow and inside the application */
#supportedLanguages.isLoggedInUser,
div#_roleChooser div#signUpScreen.isLoggedInUser,
div#_signUpGroupCodeChildren div#signUpScreenChildren.isLoggedInUser {
    background: rgba(0, 0, 0, 0.4) !important;
}





.inviteVideo,
.ptVideo{
    padding-top:20px;
    background:rgba(0,0,0,.8);
    border:1px solid #000;
    margin-top:-1px;
}
.inviteVideo .close:after,
.ptVideo .close:after{
    content:"X";
    width:20px;
    height:20px;
    line-height:21px;
    -moz-border-radius:20px;
    -webkit-border-radius:20px;
    border-radius:20px;
    border:2px solid #fff;
    position:absolute;
    top:78px;
    right:18px;
    display:block;
    text-indent:6px;
    color:#fff;
    box-shadow:0 2px 2px rgba(0,0,0,1);
    background:rgba(0,0,0,.7);
    text-shadow:none;
    font-family:arial;
    font-size:14px;
    z-index:4000;
}
.inviteVideo video,
.ptVideo video {
    height:320px;
    width:100%;
}





/* end of styles required for iFrame for rendering the demo class */

@media screen
and (min-width:768px){
    .mainPanelInlineNotice {
        display: none !important;
    }
}

#messageThreadNotificationBar {
    border-top: 1px solid #e4e5ed;
    text-align: center;
    position: absolute;
    width: 100%;
}
#messageThreadNotificationBar .inlineToolTip{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    background: #ffd525;
}
#messageThreadNotificationBar .inlineToolTip p{
    padding-left:0;
}
.orgInfoPage .subPage .contentArea {
    /*background-color: white;*/
    margin-right:0;
}
.no-br br{
    display: none;
}
.addStudentsView{
    padding-bottom: 46px !important;
}
.addStudentsList{
    padding:0!important;
    background:#fff !important;
}
.addStudentsList{
    background:#fff !important;
}
.addStudentsMessagePanel{
    color: #8e8e8e;
    text-align: center;
    border-bottom: none !important;
    margin-top: 40px;
    margin-top: 15px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    padding: 20px;
}
.formLayout .addStudentsMessagePanel { padding: 20px; }
.addStudentsMessagePanel h2{
    line-height:24px;
    margin-top:0 !important;
    text-indent:0 !important;
}
.addStudentsMessagePanel a{
    font-size:15px;
    color:#1ca0c8;
    /*padding-bottom:72px;*/
    display:block;
}
.addStudentsTextareaMultipleNames{
    height:130px !important;
}
.noBorder section{
    border:none !important;
}
.editStudentName{
    text-decoration: underline;
}
.editStudentName:focus{
    outline: 0px solid transparent;
}
.editStudentPanel{
    margin-top: 48px;
    padding-bottom: 0 !important;
}
.studentParentsSignature{
    margin-top: 25px !important;
    white-space: normal !important;
    line-height: 20px;
    text-indent: 0 !important;
    padding-left: 63px;
}
.parentsSignatureVerification{
    margin-top: -12px !important;
}
.contentInviteCircles .studentParentsSignature{
    padding-left: 114px !important;
}
.recipientsFrom {
    margin: 0px 2px 0px 5px !important;
}
.placeholderFrom {
    margin: 3px 2px 0px 5px !important;
    color: #ABABAB;
}
.actionBarTabs{
    height:84px;
}
.selectStudents {
    height: 48px !important;
}
.selectStudentsList {
    padding-top: 48px !important;
}
.studentList {
    padding-top: 46px !important;
}
.timelineStudent {
    margin-top: 46px !important;
}
.buttonPlusPost {
    background-position: -2px -232px !important;
}
#positionButtonPost {
    bottom: 8px;
}
section.newStudent{
    -webkit-animation: fadeinInput 1.5s;
    -moz-animation: fadeinInput 1.5s;
    -ms-animation: fadeinInput 1.5s;
    -o-animation: fadeinInput 1.5s;
    animation: fadeinInput 1.5s;
    -webkit-animation-fill-mode:both;
    -moz-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    -o-animation-fill-mode:both;
    animation-fill-mode:both;
}
.waitingPostStudent {
    padding: 13px 0 0 0;
    background-color: white;
    border-radius: 5px;
    border-top: 3px solid #FFCA0F;
    font-size: 15px;
}
.waitingLabelPostStudent{
    padding: 15px 0 0 15px;
}
.marginPostStudent{
    margin-top: 17px;
}
.labelSearchStudents {
    padding-left: 5px !important;
}
.pickStudentAvatar .loadMoreEntries{
    width: 100%;
    position: absolute;
    left: 252px;
}
.pickStudentAvatar .avatar.cam{
    content: "";
    display: inline-block;
    background-position: -903px -1017px;
    margin:0 !important;
    background-color:transparent;
}
.Desktop .pickStudentAvatar .avatar.cam{
    background-position:-454px -1014px;
    position: unset !important;
}
.pickStudentAvatar .avatar{
    display:inline-block;
    margin: 5px !important;
    height: 50px !important;
    width: 50px !important;
    border: none !important;
    vertical-align:top;
}
.pickStudentAvatarClose{
    height: 25px;
    width: 25px;
    position: absolute;
    top: -12px;
    right: -12px;
    background: #fff;
    box-shadow: 0 0px 4px rgba(37,37,37,0.2);
    border: 1px solid #e8e8e8;
    border-radius: 50px;
    font-size:0;
}
.pickStudentAvatarClose:before, .pickStudentAvatarClose:after {
    content:"";
    height:12px;
    width:2px;
    position:absolute;
    left:1px;
    right:0;
    top:-1px;
    bottom:0;
    margin:auto;
    background:#000;
}
.pickStudentAvatarClose:before { transform:rotate(45deg); }
.pickStudentAvatarClose:after { transform:rotate(-45deg); }
.clear{clear: both;}

.buttonRemoveStudent:before {
    margin: 0 !important;
    display: inline !important;
}
.pickStudentAvatarWrap{
    height: 276px!important;
    overflow: auto !important;
    border-bottom:none !important;
    padding:6px !important;
    text-align:left !important;
}
.verifyRequestParentSignature{
    margin-top: -23px !important;
}
.verifyRequestOptionalMessage{
    margin-top:-10px !important;
    position: relative;
    line-height: 14px;
    min-height: unset !important;
}
.notListedLink{
    color: #53c8e6 !important;
}
.labelOptions{
    padding-left: 15px !important;
}
#addRecipient {
    width: 41px;
    height: 45px;
    min-height: 45px;
    padding: 0;
    margin: 0;
    background: #fff;
    border: none;
    position: absolute;
    left: calc(100% - 54px) !important;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    top:initial !important;
    margin-top: 2px;
    width: 40px;
    height: 35px;
    min-height: 36px;
}
.ie #addRecipient{
    margin-top: 73px;
}
@media screen and (max-width:767px){
    .ie #addRecipient{
        margin-top:2px;
    }
}

#addRecipient .nextButton {
    text-indent: -9999px;
    background-position: -9px -837px;
    width: 45px;
    padding: 0;
    margin-top: 0;
    background-position: -10px -839px;
}





/******************************
* Behavior Mgmt: Student Grid
******************************/
.behaviorManagementHeader{
    font-size:20px;
    margin:24px 10px 9px 10px !important;
    text-align:right;
    position:relative;
}
.behaviorManagementHeader .scheduledPostsLink{
    line-height:1;
}
.behaviorManagementHeader a{
    font-size: 14px;
    color: #1ca0c8;
    text-decoration: underline;
    margin-left: 4px;
}
.behaviorManagementHeader .behaviorManagementSelectDay{
    position: absolute;
    bottom:0;
}
.behaviorManagementHeader .behaviorManagementSelectDay a{
    color:#000;
    text-decoration:none;
    font-size:17px;
}
.behaviorManagementHeader .behaviorManagementSelectDay a:after{
    content: "";
    display: inline-block;
    width: 24px;
    height: 12px;
    background-position:-277px -1153px;
    opacity: .30;
    filter: alpha(opacity=30);
}

.behaviorManagementSelectDay .entryOptions{
    left: 30px;
    top: -8px;
    font-size:1.1em;
}
.behaviorManagementContent{
    margin: 10px auto 0 auto !important;
    /*padding: 0 10px !important;*/
    clear: both;
}
.behaviorManagementItem{
    background: #fff;
    /*width: 64px;*/
    width: 80px;
    height: 112px;
    border:1px solid #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    box-shadow: 1px 1px 0px #d6d7d7;
    display: inline-block;
    margin:9px 5px;
    padding-bottom:16px;
    cursor: pointer;
    font-size: 16px;
    line-height: 13px;
    position:relative;
    vertical-align:top;
    overflow:hidden;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
}
.behaviorManagementItemBadge{
    display: flex;
    flex-direction: column;
    position: absolute;
    right: 0;
    top: 0;
    height: calc(100% - 35px);
}
.behaviorManagementItemBadge > div{
    color: #48b078;
    font-size: 11px;
    text-align: right;
    font-weight: bolder;
}
.behaviorManagementItemBadge > div.remaining{
    color: #53c8e6;
}
.behaviorManagementItem .attendanceStatusIconsWrapper{
    display: none;
}
.behaviorManagementItem.behaviorManagementItemAttendance .attendanceStatusIconsWrapper{
    display: block !important;
}
.behaviorManagementItem.behaviorManagementItemAttendance .attendanceStatusIcons{
    position: absolute;
    margin-top: 3px;
    margin-left: -29px;
}
.behaviorManagementItem.behaviorManagementItemAttendance .behaviorManagementItemIcon{
    margin-top: 15px !important;
    height: 70px !important;
    background-size: contain;
    background-repeat: no-repeat;
    width:50px;
}

.behaviorManagementItemBadge > div[data-pointVal^="-"]{
    color:#bc4b36;
}
.behaviorManagementItemBadge > div:not(.remaining)[data-pointVal="0"]{
    color:#ccc;
}
.behaviorManagementItemName{
    color: #555;
    font-size:12px;
    text-align: center;
    width:100%;
    overflow: hidden;
    margin: 0 auto;
    position:absolute;
    padding: 0 1px;
    box-sizing: border-box;
    text-overflow: ellipsis;
    white-space: nowrap;
    bottom:5px;
    font-family: Gotham;
    height: 26px;
}
.behaviorManagementItemName.isSingleLineItem {
    bottom: 10px;
}
#milestones .behaviorManagementItemName{
    bottom:0 !important;
}
#milestones .behaviorManagementItemName .secondLine{
    line-height: 10px;
}
.behaviorManagementItemName span,
.behaviorManagementItemName time{
    display:block;
    line-height:1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-indent:0;
}
.behaviorManagementItemName .firstLine{
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.behaviorManagementItemName .secondLine{
    font-size:10px;
}
.behaviorManagementItemName .secondLine:empty:before{
    content:"\00a0";
}
.behaviorManagementItemIcon{
    width:50px;
    height:50px;
    margin:22px auto;
    text-indent:-9999px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.behaviorManagementItemIcon.behaviorManagementClassIcon{
    background-position:-455px -715px;
}
.behaviorManagementItemIcon.behaviorManagementAddIcon{
    background-position:-455px -1012px;
}
.behaviorManagementItemLink{
    text-decoration: underline !important;
    border-top: 1px solid #cfcfcf;
    padding-top: 2px;
}
.behaviorManagementItemLink:hover, .behaviorManagementItemLink:hover *{
    color: #1ca0c8;
}
.behaviorManagementItem.isAttendance{

}
.behaviorManagementItem.isAttendance .behaviorManagementItemIcon{
    background-size: contain;
    background-repeat: no-repeat;
}

/**************************************
* Behavior Mgmt: Student Profile Grid
**************************************/
.studentProfileGrid.behaviorManagementContent .behaviorManagementItemIcon{
    width: 48px;
    height: 48px;
    margin-top: 20px;
}
.studentProfileGrid.behaviorManagementContent .behaviorManagementClassIcon{
    background-position:-452px -710px;
}
.studentProfileGrid.behaviorManagementContent .behaviorManagementAddIcon{
    background-position:-452px -1011px;
}
.studentProfileGrid.behaviorManagementContent .behaviorManagementItem{
}



/******************************
* Behavior Mgmt: Options
******************************/
.behaviorManagementAttendance{
    color: #87c558;
}
#behaviorManagementAttendance .formLayout+section{
    min-height: 0 !important;
}
#behaviorManagementAttendance .formLayout section{
    border-bottom:1px solid #f2f2f2;
}

#behaviorManagementAttendance .peopleListing{
    display:block !important;
}
    #behaviorManagementAttendance .peopleListing section{
        margin-top:-9px;
    }
    #behaviorManagementAttendance .peopleCheckBox .profileM{
        margin-left: 0 !important;
    }

.behaviorManagementFullScreen{
    color: #961de2;
}
.behaviorManagementClassGoal{
    color: #da2515;
}
.behaviorManagementReports{
    color: #008dde;
}
.behaviorManagementStuGoal{
    color: #008dde;
}
.behaviorManagementAwardTypes{
    color: #eab931;
}
.behaviorManagementSettings{
    color: #30c2d1;
}
.behaviorManagementReset{
    color: #961de2;
}
/******************************
* Behavior Mgmt: Multi-select
******************************/
.behaviorManagementItem.behaviorManagementItemSelected{
    border:1px solid #1cbadd;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
    -moz-box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
    box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
}
.behaviorManagementItem.behaviorManagementItemHighlighted{
    border:1px solid #1cbadd;
    -webkit-box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
    -moz-box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
    box-shadow: 0px 0px 2px 1px rgba(163,219,231,1);
}
.behaviorManagementItem.itemDisabled{
    opacity:0.4;
    filter:alpha(opacity=40);
    cursor: default;
}

.behaviorManagementItem.itemAbsent{
    opacity:0.35;
    filter:alpha(opacity=35);
}
.behaviorManagementItem.itemAbsent .behaviorManagementItemIcon{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    filter: grayscale(100%);
}
#behaviorManagementAttendance .behaviorManagementItem.itemAbsent,
#behaviorManagementAttendance .behaviorManagementItem.itemAbsent .behaviorManagementItemIcon{
    opacity:1 !important;
    filter:alpha(opacity=100) !important;
    filter: none !important;
    -webkit-filter: none !important;
}
.behaviorManagementItem.itemAbsent .behaviorManagementItemBadge > div{
    color:#8e8e8e !important;
}
.bulkImport{
    opacity:0.4;
    filter:alpha(opacity=40);
}
.recommended::after{
    content:"  Recommended";
    color:orange;
}
.reset .behaviorManagementItem.itemAbsent .behaviorManagementItemIcon{
    opacity:1 !important;
    filter:alpha(opacity=100) !important;
}

.behaviorManagementSelectMultiple,
.behaviorManagementSelectMultiple .scrollView,
.behaviorManagementSelectMultiple .scrollView .formLayout,
.behaviorManagementSelectMultiple .scrollView .formLayout section{
    background: #e8e8e8;
    border:none;
}
#behaviorManagementSelectMultiple{
    animation:none !important;
}
.behaviorManagementSelectMultiple .subNavTabs{
    display: block !important;
    position: static !important;
    background: #f2f2f2 !important;
}
.behaviorManagementSelectMultiple .subNavTabs span{
    color: #8c8c8c !important;
    background: none;
}
.behaviorManagementSelectMultiple .subNavTabs span.selected:after{
    background: #09b4e6 !important;
}
.behaviorManagementSelectMultiple .behaviorManagementContent .behaviorManagementItem:first-of-type{
    margin-left: -4px;
}

.behaviorManagementSummary{
    height: 38px;
    margin-top: 15px;
}
.behaviorManagementSummaryDivisor{
    border: 1px solid #e8e8e8;
    position: absolute;
    width: 100%;
}
.behaviorManagementSummaryCount{
    color: #00b4d4;
    font-size: 25px;
    text-align: center;
    margin-left: -9px;
}
.behaviorManagementSummaryDescription{
    color: #555;
    font-size:12px;
    text-align: center;
    width:100%;
    overflow: hidden;
    margin-top:4px;
    margin-left: -5px;
    padding: 0 4px;
    box-sizing: border-box;
    text-overflow: ellipsis;
    white-space: nowrap;
    bottom:4px;
}
.behaviorManagementItem.behaviorManagementItemMilestone{
    border: none;
    box-shadow: none;
    width:33.3%;
    margin:0 0 32px 0;
}
.behaviorManagementItem.behaviorManagementItemMilestone .behaviorManagementItemName{
    padding:0 4px;
}
.milestonesFeed .loadMoreEntries{
    position: absolute !important;
    left: 0 !important;
    margin: 0 !important;
}

/******************************
* Behavior Mgmt: Attendance
******************************/
.appFullScreen .behaviorManagementAttendanceHeaderOptions{
    padding-top: 38px;
}
.appFullScreen .hideOnFS{
    display: none;
}
.appFullScreen .showOnFS{
    display: inline-block !important;
}
@media screen and (min-width: 768px){
    #behaviorManagementSelectMultiple .scrollView h1.subInlineTabs{
        margin-top: 10px !important;
    }
    #behaviorManagementSelectMultiple .scrollView h1.subInlineTabs span{
        display: inline-block !important;
    }
    #behaviorManagementReports.inlineBox .subPage .scrollView,
    #behaviorManagementAttendance.inlineBox .subPage .scrollView{
        padding-right: 300px;
    }
    .hideSidePanel #behaviorManagementReports.inlineBox .subPage .scrollView,
    .hideSidePanel #behaviorManagementAttendance.inlineBox .subPage .scrollView{
        padding-right: 0;
    }
}
.behaviorManagementAttendanceHeaderButtons ul.buttonGroup{
    margin-top:0;
    line-height:36px;
    border-top:1px solid #dadada;
}
.behaviorManagementAttendanceHeaderButtons ul li button{
    font-size: 14px !important;
    line-height:36px !important;
    text-indent: 20px;
    width:100%;
    padding:0 6px;
}
.behaviorManagementAttendanceHeaderButtons button:active{
    border-top:none !important;
    background:rgba(0,0,0,.05) !important;
}
.behaviorManagementAttendanceHeaderButtons button .icon{
    content: "";
    height: 25px;
    width: 25px;
    position: absolute;
    margin-top: 6px;
    margin-left: -25px;
}
.ie .behaviorManagementAttendanceHeaderButtons button .icon{
    margin-left: 40px;
}
.behaviorManagementAttendanceHeaderButtons .allPresent,
.behaviorManagementAttendanceHeaderButtons .allAbsent{

}
.behaviorManagementAttendanceHeaderButtons .allPresent .icon{
    background-position:-23px -668px;
}
.behaviorManagementAttendanceHeaderButtons .allAbsent .icon{
    background-position:-151px -668px;
    opacity:.5;
    filter:alpha(opacity=50);
}
#behaviorManagementAttendance .hgroup h2{
    padding:12px 0 3px 40px !important;
}
#behaviorManagementAttendance .hgroup h3{
    text-indent: 108px !important;
    margin-top:-34px;
    margin-bottom:-4px;
}

#behaviorManagementAttendance .isListView .headerButtonsGroup{
    border-bottom: 1px solid #f2f2f2 !important;
}
#behaviorManagementAttendance .behaviorManagementAttendanceHeaderOptions{
    padding: 10px 0;
    margin: 0;
    height: 50px;
}
#behaviorManagementAttendance.isListView .behaviorManagementAttendanceHeaderOptions{
    background:#FFF;
    border-bottom: 1px solid #f2f2f2;
}
#behaviorManagementAttendance.isGridView .behaviorManagementAttendanceHeaderOptions{
    border-bottom: 1px solid #e8e8e8;
}
.attendanceStatusIcons,
.membersManageOptionIcon{
    left:32px !important;
    background-position:-213px -607px;
    border: none !important;
    width:24px !important;
    height:24px !important;
    -webkit-border-radius:0 !important;
    -moz-border-radius:0 !important;
    border-radius:0 !important;
    position: absolute;
    margin-left: -21px;
    display: block !important;
    margin-top: 17px;
}

.membersManageOptionIcon.selected{
    background-position: -213px -853px;
    width: 19px !important;
    height: 19px !important;
    left: 13px !important;
    top: 9px !important;
    border: 2px solid #53c8e6 !important;
    -moz-border-radius: 10px;
    -webkit-border-radius: 50px !important;
    border-radius: 10px;
    background-color: #FFF;
    margin: 0 auto;
    padding: 0 !important;
}
.membersManageOptionIcon{
    margin-top: 7px;
}
.attendanceStatusIcons.attendancePresentIcon{
    background-position:-21px -607px !important;
}
.attendanceStatusIcons.attendanceTardyIcon{
    background-position:-85px -607px !important;
}
.attendanceStatusIcons.attendanceAbsentIcon{
    background-position:-149px -607px !important;
}

.addEditAwardForm input[type=text], .addEditAwardForm input[type=number]{
    padding-left: 125px !important;
}
.addEditAwardForm .icon{
    margin: 0 auto;
    width: 80px !important;
    height: 80px;
    cursor: pointer;
}





/*******************************
* awards
********************************/
#skillPicker{
    animation:none;
}
#skillPicker.edit .subPage{
    padding:87px 0 0px 0;;
}
#skillPicker .subPage{
    padding:90px 0 39px 0;
    background: #e8e8e8;
}
#skillPicker .actionBar{
    box-shadow:none;
    border-bottom:1px solid #e4e5ed;
}
    #skillPicker .actionBar.awardMode{
        border-bottom:none;
        box-shadow: inset 0 -1px rgba(0,0,0,.15) !important;
    }
    #skillPicker .actionBar.awardMode h1{
        text-shadow: none !important;
        /*color: #FFF;*/
    }
    #skillPicker .actionBar.awardMode .backButtonOnly{
        /*color: #FFF;*/
    }
.dialogHeaderAward {
    height: 62px;
    border-bottom: 2px solid #c3c3c3;
}
.giveAwardMessageBar {
    display: block;
    width: 100%;
    background: #f2f2f2;
    border-top: 1px solid #c3c3c3;
    box-shadow: inset 0 1px 0 rgba(255,255,255,1);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px;
}
.giveAwardMessageBar>li{
    list-style: none;
}
.giveAwardMessageBar input.hasText {
    text-align:left;
}
.giveAwardMessageBar input {
    width: 100%;
    height: 100%;
    display: block;
    outline: none;
    border: none;
    margin-top: 10px;
    padding: 6px 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background: #dedede;
}

.profilePage .subNavTabsStudentProfile{
    top: 0;
    position: relative;
    margin:-12px -10px 0;
    /*padding: 0 10px;*/
    width: -webkit-fill-available;
    width: fill-available;
    width: -moz-fill-available;
    display: inline-flex;
}
.profilePage .subNavTabsStudentProfileHigher{
    margin-top: 29px;
}
.subNavTabsStudentProfile,
.subNavTabsAwards {
    position: absolute;
    height: 37px !important;
    line-height: 36px;
    width: 100%;
    display: block;
    white-space:nowrap;
    top: 90px;
    /*box-shadow:inset 0 -1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.05);*/
    overflow-x: visible;
    background: #fff;
    border-top:1px solid #e4e5ed;
    border-bottom:1px solid #e4e5ed;
    font-family: gotham;
}
.subNavTabsStudentProfile {
    /*background: #f2f2f2 !important;*/
}
.studentProfileTabs,
.studentAwards{
    overflow:visible;
    margin-top:-41px;
    position: relative;
}
    .studentAwards{
        margin-top:0px;
    }
.studentAwards::-webkit-scrollbar{
    height:0;
}
.studentAwards::-webkit-scrollbar-track{
    background:transparent;
}
.studentAwards::-webkit-scrollbar-thumb{
    background:transparent;
}
.studentAwards .subNavTabsAwards{
    top: 0px !important;
    display: table;
    width: 100%;
    position:relative;
    border-bottom:0;
    table-layout: fixed;
}
.subNavTabsStudentProfile span{
    padding:0 4px !important;
    background: #fff !important;
    color: #8e8e8e !important;
    text-align: center !important;
    display:inline-block !important;
    cursor: pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:14px;
    /*line-height:36px !important;*/
    line-height:34px !important;
    vertical-align:top;
    position:relative;
    /*border-bottom:1px solid #c2c2c2;*/
    width:25%;
}
.subNavTabsAwards span {
    padding:0 4px !important;
    text-align: center !important;
    display:table-cell !important;
    cursor: pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:14px;
    line-height:40px !important;
    vertical-align:top;
    position:relative;
    border-bottom:1px solid #e4e5ed;
}
.editMode .awardsCategory {
    background: #fff;
    color: #8e8e8e;
}
.awardMode .awardsCategory {
    color: #FFF !important;
    text-shadow: none;
    background: rgba(0,0,0,.08);
    display: table-cell !important;
}
.addUpdateTeamName input{
    color: #b4b4b4;
    width: 95%;
    text-align: center;
    height: 32px;
    margin: 10px auto 0 auto;
    font-size: 26px;
    border: none;
}
.subNavTabsStudentProfile span.selected{
    color: #1ca0c8 !important;
    border-bottom:1px solid #1ca0c8;
}
.editMode .awardsCategory.selected{
    color: #1ca0c8;
    border-bottom:1px solid #1ca0c8;
}
.editMode .awardsCategory.selected:after{
    background: #1ca0c8 !important;
}
.awardMode .awardsCategory.selected {
    color: #FFF !important;
    /*border-bottom:1px solid rgba(0,0,0,0.05);*/
}


.subNavTabsStudentProfile span.selected:after,
.subNavTabsAwards span.selected:after {
    content:"";
    height:3px;
    width:100%;
    bottom:0;
    display:block;
    margin-left: -4px !important;
    position:absolute;
    background: #1ca0c8;
}
.awardMode .awardsCategory.selected:after{
    background: #FFF !important;
}

.awards{
    height:100%;
}
.awards .notesWrapper{
    border: 0;
}
.awards .awardDate{
    position: absolute;
    margin-left: 115px;
    font-size: 16px;
}
.awards .notesWrapper .formLayout section {
    text-indent:4px;
    border-bottom:1px solid #e4e5ed;
    padding:0 10px;
}
.awards .notesWrapper .formLayout section:last-child { border-bottom:0; }
.awards .notesWrapper .separateTime .timePicker .onlyTime{
    margin-left:52px;
}
.awards .notesWrapper .awardsNotesPadding,
.awards .notesWrapper input[type='datetime-local']{
    padding-left: 145px !important;
}
.formLayoutAwards {
    padding-left: 0 !important;
}
.awardsWrapper{
    background: #fff;
    overflow: auto;
    margin-bottom: -1px;
    border: 1px solid #e8e8e8;
    overflow: hidden;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    border-radius: 5px;
}
.addNotesItem{
    display: block;
    clear:both;
    background:#fff;
    overflow:auto;
    margin-bottom:-1px;
    border-bottom:1px solid #e4e5ed;
    overflow: visible;
    margin: 10px 10px 0 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding-bottom: 3px;
}
.addNotesItem .addNotesSkill{
    display: inline-block;
}
.addNotesItem .addNotesSkill .awardsItem{
    width: 95px;
    box-shadow: none;
}
.addNotesItem .addNotesInfo{
    display: inline-block;
    border-left: 1px solid #e4e5ed;
    width: calc(100% - 100px);
}
.addNotesItem .addNotesInfo .formLayout section:last-child{
    border-bottom: none !important;
}

.addNotesItem .awardsNotesPadding,
.addNotesItem input[type='datetime-local']{
    padding-left: 10px !important;
}
.addNotesItem .datePicker {
    margin-left: 0px !important;
}
.awardsNegativeMargin{
    margin-top:-42px !important;
}
.awardFooterMultipleButton{
    text-align: left !important;
}
.awardFooterMultipleButton.selected {
    min-width: 160px !important;
}
@media screen and (max-width:767px){
    .awardFooterMultipleButton.selected {
        width: 160px !important;
    }
}
.awardFooterMultipleButton button{
    text-align: left !important;
    text-indent: 40px;
}
.awardsItem{
    width: 25%;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    height: 84px;
    box-shadow:1px 1px 0 #f0f0f0;
    float: left;
    margin: 0;
    cursor: pointer;
    font-size: 16px;
    line-height: 13px;
    position: relative;
    vertical-align: top;
}
.awardsItem.addSkill .awardsItemIcon img{
    background-position:-458px -1017px;
}
.awardsEditItem{
    width: 24.7% !important;
}
    .awardsEditItem img{
        position: absolute;
        top: 5px;
        left: 0;
        max-height: 80px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }
.awardsItemBadge {
    font-size: 13px;
    text-align: center;
    position: absolute;
    right: 14px;
    top: 2px;
    height: 24px;
    width: 25px;
    /*background: #48b078;
    color: #fff;*/
    color:#48b078;
    line-height: 25px;
    border-radius: 50px;
}
.awardsItemBadge[data-pointVal^="-"]{
    color:#e86c6c;
}
.awardsItemBadge[data-pointVal="0"]{
    color:#ccc;
}
.awardsItemIcon {
    height: 100%;
    text-indent: -9999px;
    padding-top:14px;
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
}
.awardsItemIcon img{
    width:40px;
    height:40px;
    display:block;
    margin:0 auto;
}
.awardsItemName{
    color: #000;
    font-size: 10px;
    display: table;
    width: 100%;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
    padding: 0 8px;
    box-sizing: border-box;
    height: 32px;
    top: -32px;
    margin: 0 auto;
}
.awardsItemName>div{
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    line-height:1.25;
}
.awardsItemName span{
    display: block;
    max-height: 25px;
    overflow: hidden;
    text-overflow: clip;
}
.awardsAddIcon .awardsItemIcon{
    background-position:-447px -996px;
}
.alertBoxAwardSelected .dialogBox .dialogMessage {
    background: rgba(255,255,255,1);
}
.studentAwardSelected{
    background: #fff !important;
}
.studentSelected {
    color: #000;
    font-size: 22px;
    text-align: center;
    font-weight: bold;
    width: 150px;
    padding: 0 4px;
    margin-left: 93px;
}
.awardSelected{
    color: #9d9d9d;
    font-size: 13px;
    text-align: center;
    width: 150px;
    margin-left: 93px;
    padding: 0 4px;
}
.formLayoutAwardSelected {
    border: none !important;
    box-shadow: none !important;
}
.pickAwardIcon{
    width: 50px !important;
    height: 50px;
    cursor: pointer;
}
.awardsFooter{
    position: absolute;
    bottom: 0;
    height: 38px;
}
.buttonGroupAwards li {
    padding-top: 0;
}
.buttonGroupAwards li{
    border-right: 1px solid #c3c3c3 !important;
}
.buttonGroupAwards li:last-child{
    border-right: none !important;
}
.buttonGroupAwards li button{
    width: 100%;
    height: 38px;
    border: none;
    font-size: 17px;
    font-weight: bold;
    color: #666;
}
.studentContentArea {
    padding-top: 12px !important;
}
.studentAwardsArea {
    /*padding: 12px 0 0 0 !important;*/
}
.studentAwardsArea .subNavTabsStudentProfile{
    /*margin-left:0;*/
}
.studentAwardsArea .studentAwards{
    margin-bottom: 0;
    border: 1px solid #e4e5ed;
    padding-top: 1px;
    background: #fff;
    /*margin-top: 10px;*/
    margin-top: 25px;
    border-radius: 5px;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
}
.studentAwardsArea .award{
    padding:20px 20px 0px 20px;
}
.studentAwardsArea .award .byLine {
    font-size: 14px;
    color: #898989;
}
.studentAwardsArea .award .skillPoints{
    display: inline-block;
    position: absolute;
    background: #48b078;
    text-align: center;
    min-width: 21px;
    min-height: 20px;
    line-height: 19px;
    border-radius: 12px;
    box-sizing: border-box;
    padding: 0 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin-left: 31px;
    margin-top: -7px;
    border: 1px solid #48b078;
    color: #fff;
    font-size: 12px;
}
    .skillPointsRetract{
        margin-left:0 !important;
        left: 135px !important;
    }
        .skillPointsRetractImage img{
            width: 40px !important;
            height: 40px !important;
            margin-left: -10px !important;
        }
    .skillPointsRetractName{
        text-align: left;
        display: block;
        margin-left: 27px;
        margin-top: -8px;
    }
    .skillPointsRetractByLine{
        text-align: left;
        display: block;
        margin-left: 65px;
        margin-top:-15px !important;
    }
    .skillPointsClear{
        clear: both;
        height: 10px;
        border:1px solid #000;
    }
.studentAwardsArea .award .skillPoints[data-pointVal^="-"]{
    background:#e86c6c;
    border: 1px solid #e86c6c;
}
.studentAwardsArea .award .skillPoints[data-pointVal="0"]{
    background:#e4e5ed;
    border: 1px solid #e4e5ed;
}
.studentAwardsArea .award .profileM:before{
    background:transparent;
    border:1px solid #e4e5ed;
    width:60px;
    height:60px;
    margin-left: -5px;
    margin-top: 0;
    margin-left: -3px;
    margin-top: 2px;
}
.studentAwardsArea .award .profileM img{
    opacity:1;
    margin-top: 5px;
    margin-right: 24px;
    border-radius: 50% !important;
    position: relative;
    left: 2px;
    width:50px !important;
    height:50px !important;
}
.studentAwardsArea .award .metaData {
    color: #898989;
    font-size: 14px;
    left: 77px;
    position: relative;
    margin-top: -21px;
    margin: -34px 0 16px 0;
    line-height: 1.3;
}
.studentAwardsArea .award p{
    margin:-11px 0 15px 78px;
    font-size:14px;
    line-height:16px;
}



/**************************************
* Coming Soon Behavior Mgmt features
**************************************/
.behaviorOptionsAttendanceUpcoming h1:after,
.behaviorOptionsFullScreen h1:after,
.behaviorOptionsClassGoalUpcoming h1:after,
.behaviorOptionsReportsUpcoming h1:after,
.behaviorSettingsUpcoming h1:after{
    content:"";
    width:156px;
    height:240px;
    display:block;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
    margin:10px auto 0 auto;
    box-shadow:0 1px 5px rgba(0,0,0,.1);
    background-color:#fff;
}
.behaviorOptionsAttendanceUpcoming h1:after{
    background-image:url(../images/comingAttendance.jpg);
}
.behaviorOptionsFullScreen h1:after{
    background-image:url(../images/comingFullScreen.jpg);
}
.behaviorOptionsClassGoalUpcoming h1:after{
    background-image:url(../images/comingClassGoals.jpg);
}
.behaviorOptionsReportsUpcoming h1:after{
    background-image:url(../images/comingReports.jpg);
}
.behaviorSettingsUpcoming h1:after{
    background-image:url(../images/comingSettings.jpg);
}
.behaviorModalAwardStudentName{
    text-align: left;
}
.behaviorModalAwardName{
    text-align: left;
}
.behaviorModalAwardIcon{
    float: left;
    top: 17px;
    left: 29px;
    border: 1px solid #e4e5ed;
    -webkit-border-radius: 99px;
    -moz-border-radius: 99px;
    border-radius: 99px;
    padding: 7px;
    position: absolute;
    width: 50px !important;
    height: 50px !important;
}
.behaviorModalAwardPointsNegative{
    color: #bc4b36 !important;
}
.align-right {
    text-align: right;
}
    .behaviorModalAwardPointsNegative{
        color: #bc4b36 !important;
    }
.behaviorManagementMilestoneAchieved{
    background: #FFF !important;
}
    .behaviorManagementMilestoneAchieved .dialogMessage{
        background: #FFF url(https://s10.postimg.org/yvn6likwp/image.png)!important;
        background-repeat: no-repeat !important;
    }

    .behaviorManagementMilestoneAchievedImage{
        background-repeat: no-repeat  !important;
        background-position: bottom  !important;
        height: 130px;
        width: 76px;
        position: absolute;
        left: 0;
        top:50px;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }
    .behaviorManagementMilestoneAchievedPoints{
        padding-top: 92px;
        font-size: 25px;
        text-align: center;
        font-weight: bold;
        margin-left: 6px;
        color: #FFF;
    }
    .behaviorManagementMilestoneAchievedText{
        font-size: 26px;
        color: #6f6f6f;
        margin-bottom: 25px;
        margin-top: 180px;
    }
.behaviorManagementMilestoneAchievedImageFadeIn {
    -webkit-animation: behaviorManagementMilestoneAchievedImageFadeIn 2s ease-in-out forwards;
    -moz-animation: behaviorManagementMilestoneAchievedImageFadeIn 2s ease-in-out forwards;
    -o-animation: behaviorManagementMilestoneAchievedImageFadeIn 2s ease-in-out forwards;
    animation: behaviorManagementMilestoneAchievedImageFadeIn 2s ease-in-out forwards;
}
.behaviorManagementMilestoneAchievedImageFadeOut {
    -webkit-animation: behaviorManagementMilestoneAchievedImageFadeOut 2s ease-in-out forwards;
    -moz-animation: behaviorManagementMilestoneAchievedImageFadeOut 2s ease-in-out forwards;
    -o-animation: behaviorManagementMilestoneAchievedImageFadeOut 2s ease-in-out forwards;
    animation: behaviorManagementMilestoneAchievedImageFadeOut 2s ease-in-out forwards;
}
@-webkit-keyframes behaviorManagementMilestoneAchievedImageFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@-moz-keyframes behaviorManagementMilestoneAchievedImageFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@-o-keyframes behaviorManagementMilestoneAchievedImageFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@keyframes behaviorManagementMilestoneAchievedImageFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}

@-webkit-keyframes behaviorManagementMilestoneAchievedImageFadeIn { 0% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@-moz-keyframes behaviorManagementMilestoneAchievedImageFadeIn {0% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@-o-keyframes behaviorManagementMilestoneAchievedImageFadeIn {0% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@keyframes behaviorManagementMilestoneAchievedImageFadeIn {0% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}

.behaviorManagementShowPointsModal .dialogMessage,
.behaviorManagementShowPointsModal .studentAwardsArea{
    padding: 0 !important;
}
.behaviorManagementShowPointsModal .profileM{
    text-align: left;
    text-indent: 11px;
}
.behaviorManagementShowPointsModal p{
    text-align: left;
}
.behaviorManagementShowPointsModal .profileM img{
    width: initial;
}
.behaviorManagementShowPointsModal .skillPoints{
    margin-left: -88px !important;
}
.behaviorManagementShowPointsModal .studentAwardsArea .award {
    padding-top:25px;
    padding-bottom:10px;
}
.behaviorManagementShowPointsModal article{
    border: none !important;
    box-shadow: none !important;
}
.behaviorManagementShowPointsModal .award .metaData {
    margin-left: 9px;
    text-align: left;
}
.behaviorManagementShowPointsModal .award .metaData .byLine {
    width: 75%;
    white-space: nowrap;
    overflow: hidden;
}
.behaviorManagementShowPointsModal .buttonGroup{
    margin-top: -10px;
}

.behaviorManagementTeamView .backButtonOnly{
    position: absolute;
    left: 0;
}
    .behaviorManagementTeamView form h1{
        padding-top: 10px !important;
        height: 350px;
        overflow: hidden;
        overflow-y: auto;
    }
    .behaviorManagementTeamView .forceTruncate{
        width: 180px;
        margin: 0 auto;
    }
    .behaviorManagementTeamView .behaviorManagementContent{
        margin-top:20px !important;
    }

.studentAwardsSummary{
    /*background-color:#fff;*/
    width:100%;
    margin-bottom:0 !important;
    padding:0 10px 12px 10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
#behaviorManagementReports .studentAwardsSummary{
    background: transparent;
}
.studentAwardsSummary .studentNameLink{
    color: #1ca0c8;
    text-decoration: underline;
    cursor:pointer;
}
.studentAwardsSummary .classesLinks{
    margin-right: 14px !important;
    padding: 10px 0 !important;
}
.studentAwardsSummary .summaryBox{
    /*-moz-border-radius:5px 5px 0 0;
    -webkit-border-radius:5px 5px 0 0;
    border-radius:5px 5px 0 0;
    border:1px solid #e4e5ed;*/
    display: table;
    width: 100%;
    margin-bottom: 20px;
    background: #fff;
    padding: 15px;
    border: 1px solid #e4e5ed;
    border-radius: 5px;
    margin-bottom: 0;
}
.studentAwardsArea .studentAwards .studentAwardsSummary .summaryBox {
    border: 0;
    margin-bottom: 15px;
    padding: 0;
}
.studentRangePicker{
    margin:15px !important;
    font-family: gotham;
}
        .calendarDatePickerRangeDate .icon{
            display: inline-block;
            width: 44px;
            height: 44px;
            background-position: -263px -1140px;
            opacity: .30;
            filter: alpha(opacity=30);
            margin-top: -10px;
            margin-left: -8px;
            position: absolute;
        }
            .calendarDatePickerRangeDate:hover .icon{
                opacity: 1;
                filter: alpha(opacity=100);
            }
    .rangePicker, .classPicker{
        display: inline-block;
        width: 50%;
        cursor: pointer;
    }
        .classPicker {
            font-size:13px;
            color: #1ca0c8;
            text-decoration: underline;
            text-align: right;
        }
        .classPickerDayCare {
            width:auto;
            display: inline;
            margin-top: 18px;
        }
        .classPickerWithoutUnderline{
            text-decoration: none !important;
            cursor: default !important;
        }
.studentAwardsSummary .summaryBox section.chart{
    width:100px;
    display: table-cell;
    vertical-align: middle;
    border-right: 1px solid #f2f2f2;
    padding: 20px 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.studentAwardsSummary .summaryBox section.chart:last-child { border-right:0; }
.studentRangePicker section {
    border: none !important;
}
.studentRangeReports{
    border-bottom: 1px solid #CCC;
    padding-bottom: 10px;
}
.studentAwardsSummary .summaryBox canvas.chart{
    width:76px !important;
    height:76px !important;
    margin:0 auto;
}
.studentAwardsSummary .summaryBoxReport .donutChart canvas.chart{
    width:76px !important;
    height:76px !important;
    margin:0 auto;
}
.studentAwardsSummary .summaryBoxReport .lineChart canvas.chart{
    width:76px !important;
    height:30px !important;
    margin:0 auto;
}
.studentAwardsSummary .charInfo{
    position: absolute;
    margin-top: 21px;
    text-align: center;
    font-size: 13px;
    width: 100px;
}
.mainPanelBehavior .studentAwardsSummary .charInfo{
    /*margin-top: 6px;*/
    top:-7px;
    width: 90px;
}
.mainPanelBehavior .studentAwardsSummary .charInfo .charInfoDescription{
    margin-top:-30px !important;
}
#behaviorReportingControl .studentAwardsSummary .charInfo{
    /*margin-top: 20px !important;*/
    top: -21px;
}
.studentAwardsSummary .charInfo .charInfoDescription{
    color: #999;
}
.studentAwardsSummary .summaryBox .data{
    display: inline-flex;
    padding: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 0;
    background: #f0f4f8;
    border: 1px solid #dfe0e8;
    border-radius:5px;
    width: 100%;
    justify-content: space-between;
}
.studentAwardsSummary .summaryBox .chartTitle{
    font-weight: bold;
    color: #333;
}
.studentAwardsSummary .summaryBox .data.fullwidth{
    width: 100%;
}
.studentAwardsSummary .summaryBox .data h2{
    font-weight: bold;
    line-height: 25px;
    margin-top:0;
    font-weight: 500;
    margin-bottom: 7px;
}
.studentAwardsSummary .summaryBox .data ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
.studentAwardsSummary .summaryBox .data ul li{
    color:#555;
    font-size: 14px;
    line-height: 20px;
    text-transform: lowercase;
    text-indent:0;
    display: inline-block;
    margin-right: 30px;
    display:block;
    margin:0 0 3px 0;
}
.studentAwardsSummary .summaryBox .data ul li:last-child {  margin-right:0; }
.studentAwardsSummary .summaryBox .data ul li div{
    text-transform: capitalize !important;
}
.studentAwardsSummary .summaryBox .data ul li a, .studentAwardsSummary .summaryBox .data ul li .behaviorSummaryCategory {
    text-decoration:underline;
    color:#53c8e6;
    display: inline-block;
    margin-right: 15px;
    display:block;
    margin:0 0 3px 0;
}
.studentAwardsSummary .summaryBox .data ul li .behaviorSummaryCategory:last-child {  margin-right:0; }
.studentAwardsSummary .milestones{
    width: 100%;
    overflow: hidden;
    margin: -1px 0 0 0;
    height: 50px;
    display: table;
    -webkit-print-color-adjust: exact !important;
    background: #f0f4f8;
    border: 1px solid #dfe0e8;
    border-radius: 5px;
}
.studentAwardsSummary .milestones ul{
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: -10px;
    display:table;
    table-layout:fixed;
}
.studentAwardsSummary .milestones ul li{
    text-align:center;
    border-right:1px solid #e4e5ed;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    cursor:pointer;
    overflow:hidden;
    color:#b4b4b4;
    vertical-align:top;
    line-height:50px;
    display:table-cell;
    position:relative;
    min-width:50px;
    background:#f0f4f8;
}
.studentAwardsSummary .milestones ul li:before{
    content:"";
    width:100%;
    height:100%;
    display:block;
    background:rgba(0,0,0,.02);
    position:absolute;
    pointer-events:none;
}
.studentAwardsSummary .milestones ul li .milestoneWrapper{
    height:50px;
}
.studentAwardsSummary .milestones ul li img{
    width:46px;
    margin-top:-7px;
}
.studentAwardsSummary .milestones ul li .milesonePoints{
    width: 100%;
    text-align: center;
    position: absolute;
    color: #FFF;
    font-weight: bold;
    font-size: 10px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
    margin-top: 7px;
}
.studentAwardDetails .milesonePoints{
    width: 100%;
    text-align: center;
    position: absolute;
    color: #FFF;
    font-weight: bold;
    font-size: 15px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
    margin-top: 92px;
}
.studentAwardDetails .milestoneName{
    font-size: 20px;
    font-weight: bold;
}
.studentAwardsSummary .milestones ul li .link{
    padding-top:10px;
}
.studentAwardsSummaryReports .charInfoNumber{
    margin-top: -13px;
    padding-right: 8px;
}
.studentAwardsSummaryReports .charInfoNumber{
    margin-top: -13px;
    padding-right: 8px;
}
.studentAwardsSummaryReports .charInfoDescription{
   color: #999;
    margin-top: -32px;
    padding-right: 8px;
}
.studentAwardsSummaryReports h2{
    text-indent: 10px !important;
}
.studentAwardsSummaryReports .summaryBox{
    border:none !important;
    /*margin-top: -18px !important;*/
}
.studentAwardsSummaryReports .summaryBox .chart{
    border-right: 0 !important;
}
.studentMilestones{
    background-color: #FFF !important;
    width: 100%;
    margin-bottom: -10px !important;
}
.studentMilestones .scheduledPostsLink {
    padding-right: 30px !important;
}
.lineMilestones {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    padding: 0;
    margin-right: 30px;
    margin-left: 20px;
    margin-top: 30px;
}
.studentAwardDetails{
    /*background-color: #FFF !important;*/
}
.studentAwardDetails .studentAwardDetails{
    border-bottom: 1px solid #ededed;
}
.studentAwardDetails .flower{
    text-align: center;
}
.studentAwardDetails .flower.milestone{
    margin-top: -30px;
    margin-left: 80px;
}
.studentAwardDetails .flower img{
    height:152px;
    margin: 0 auto;
}
.studentAwardDetails .points{
    width: 100%;
    text-align: center;
    padding-top: 100px;
    color: #FFF;
    font-weight: bold;
    font-size: 25px;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
}
.studentAwardDetails .content{
    margin:0 auto 28px auto;
    text-align:center;
    font-size:14px;
    line-height:20px;
    max-width:300px;
    padding:0 10px;
}
.studentAwardDetails .message{
    display:block;
    font-size:15px;
}
.studentAwardDetails .class{
    color:#a3a3a3;
}
.tPromptForBehaviorManagementFeature h1:after{
    content:"";
    display:block;
    width:156px;
    height:184px;
    background:#fff url(../images/comingBehaviorMgmt.jpg) top no-repeat;
    background-size:156px 240px;
    margin:10px auto 0 auto;
}
.divDeleteAward {
    padding-top: 0 !important;
}
.btnDeleteAward{
    background: none !important;
    border: none !important;
    color: #ff3b30 !important;
    margin:0 !important;
    padding:2px 12px !important;
}

.subNavTabsStudentProfileCode{
    position: static !important;
}
.scrollViewStudentCode{
    top: 8px !important;
}
.scrollViewStudentCodeForm{
    margin-top:10px !important;
}
.scrollViewStudentCode .linkControl{
    padding-left: 185px !important;
}
.scrollViewStudentCodeForm input[type='text']{
    padding-left: 180px !important;
}
.studentLoginTop{}
.subNavTabsStudentProfileCode .icon{
    background-position: -142px -1021px;
    width: 30px;
    height: 30px;
    display: block;
    cursor: pointer;
    margin: 5px auto;
}
.subNavTabsStudentProfileCode .iconScanQRCode{
    background-position: -911px -1021px;
}
.subNavTabsStudentProfileCode .iconEnterClassCode{
    background-position: -839px -1202px;
    width: 50px !important;
}
#behaviorManagementReports .scrollView,
#behaviorManagementReports .studentRangeReports{
    /*margin:0 !important;
    padding:24px 8px 8px 8px;*/
}
#behaviorManagementReports .studentAwardsSummary .summaryBox .data{
    /*padding-left:0;*/
}






/****************************************
* Styles for Support search popover
***************************************/
#supportSearchPopover .searchResultsOverlayWrapper { z-index: 3003 !important; }
#supportSearchPopover .searchResultsOverlayWrapper .supportSearchArticleWrapper {
    min-height:0 !important;
    line-height:18px !important;
    padding-bottom:0 !important;
}
#supportSearchPopover .searchResultsOverlayWrapper .article-autocomplete-body { display: none; }
#supportSearchPopover .searchResultsOverlayWrapper .article-autocomplete-subject {
    font-size: 14px;
    text-decoration: underline;
}
#supportSearchPopover .closeSearchResultsOverlay{
    content: "X";
    width: 20px;
    height: 20px;
    line-height: 21px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    border: 2px solid #fff;
    position: absolute;
    top: 138px;
    right: 28px;
    display: block;
    text-indent: 0;
    text-align: center;
    color: #fff;
    box-shadow: 0 2px 2px rgba(0,0,0,1);
    background: rgba(0,0,0,.7);
    text-shadow: none;
    font-family: arial;
    font-size: 14px;
    margin-top: -15px;
    margin-right: -15px;
    z-index: 9999;
}
.messageWrapperPhotoIcon .placeHolderText,
.messageWrapperPhotoIcon .editableElement{
    margin-left: 52px !important;
    width: calc(100% - 55px) !important;
}
.messageTextPanel{
    margin-top: -37px;
    font-size: 17px;
    line-height: 23px;
    max-height: 46px;
    overflow: hidden;
    padding:0 12px 0 54px;
}
.messageTextPanel .messageIcons{
    margin-top: 25px;
}
.messageTextPanel .messageText{
    word-wrap: break-word;
}
.messageTextPanel.removeMarginTop{
    margin-top: -7px;
}
.showPptsRoles{
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px !important;
    padding-right: 40px;
    font-weight: 600;
    height: 24px;
    color:#424242;
    margin-top: -37px;
}
.messageWrapperPhotoIcon input[type='file']{
    left:0 !important;
}
.messageWrapperPhotoIcon input[type='file']:focus{
    outline:none;
}
.messageWrapperPhotoIcon .selectRecipient {
    opacity: .4;
    filter: alpha(opacity=40);
}
.messageIcons{
    position: absolute;
    left: 0;
    top: 3px;
    width: 50px;
    height: 38px;
    overflow: hidden;
    text-indent: -9999px;
    cursor: pointer;
    margin-left: 65px;
    margin-top: 37px;
}
.messageIcons.photo{
    background-position: -199px -1020px;
}
.messageIcons.file{
    background-position: -137px -1021px;
}
#messages .messageIcons{
    margin-left: 79px;
}
.messageIcons + span.messageText{
    margin-left: 85px;
}
.messageWrapperPhotoIcon .buttonWrapper button{
    z-index: 4000 !important;
}
    .messageWrapperFileIcon .browseDesktop{
        display: none;
    }
    .messageWrapperFileIcon .attachFiles label,
    .messageWrapperFileIcon .insertPhoto label{
        background-position: -142px -1022px;
        width: 39px;
        height: 30px;
        display: block;
        position: absolute;
        cursor: pointer;
        margin-top: 5px;
        top:0px;
        opacity:1;
    }
@media screen and (max-width:767px){
    .firefox .messageWrapperFileIcon .attachFiles label,
    .firefox .messageWrapperFileIcon .insertPhoto label{
        margin-top: -20px;
    }
}
    .messageWrapperFileIcon .attachFiles label{
        margin-left: 50px;
    }
    .messageWrapperFileIcon .insertPhoto label{
        background-position: -201px -1023px;
        padding-left: 10px;
    }
    .messageWrapperFileIcon .placeHolderText,
    .messageWrapperFileIcon .editableElement{
        margin-left:90px !important;
        width: calc(100% - 90px) !important;
    }
.iPhone #supportSearchPopover .closeSearchResultsOverlay{
    top: 128px;
    right: 23px;
}
.choosePhotoOptions {
    position: absolute;
    display: inline-block;
    width: 70px;
    height: 70px;
    overflow: hidden;
    top: 5px;
    left: 9px;
    margin: 0;
    z-index: 1002;
    cursor: pointer;
    text-indent: 0;
}

@-moz-document url-prefix() {
    li.demoClass #title {
        position:absolute;
        top:2px;
        height:35px;
        line-height:35px;
        overflow:visible;
        border-top:none;
    }
    ul.navFilters ul.communityListing li.demoClass .tagClasses > span {
        margin-top: -1px;
    }
}
button::-moz-focus-inner {
    border: 0;
}

.notificationsColumns{
    float: right;
    clear: both;
    margin:0;
    padding: 0;
}
.notificationsTwoColumns{
    width: 90px;
}
.notificationsColumns .item{
    display: inline-table;
    width: 37px;
    font-size: 10px;
    text-align: center;
    margin:0;
    padding: 0;
    cursor: pointer;
    line-height: 10px;
}
.formLayout .notificationsColumns{
    position: absolute;
    right: 20px;
    top: 0;
}
.iPhone .notificationsColumnsLabel{
    margin-right:-4px;
}
.iPhone .formLayoutBigLabel .messageCheckBox,
.Android .formLayoutBigLabel .messageCheckBox{
    font-size: 12px !important;
}
.Desktop .notificationsColumns.notificationsColumnsLabel{
    padding-right: 20px;
}
.formLayout .notificationsBigLabel{
    font-size: 17px;
}
.iPhone .formLayout .notificationsBigLabel{
    font-size: 15px !important;
}
.Android .formLayout .notificationsBigLabel{
    font-size: 14px !important;
}
.formLayout .notificationsColumns .item{
    height: 42px;
    margin-left: 0;
    width: 35px;
}
.iPhone .labelNotifications .notificationsColumns .item:last-child{
  border-right: 10px solid #e8e8e8;
}
.Desktop .formLayout .notificationsColumns .item{
  margin-left: 4px;
}
.Desktop .formLayout .notificationsColumns .item:last-child{
  border-right: 1px solid #FFF;
}
.notificationsColumns input[type=button]{
    cursor:pointer;
    content: "";
    width: 18px;
    height: 18px;
    left: 10px;
    top: 13px;
    border: 2px solid #ccc;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 10px;
    background-color: #FFF;
    margin: 0 auto;
    padding: 0 !important;
}
.notificationsColumns .selected input[type=button]{
    background-position: -213px -854px;
    border-color: #53c8e6;
}
.notificationsColumns .disabled input[type=button]{
    border-color: #F5F5F5;
}
.dialogBox .notificationsSettings .labelClicable{
    color: #53c8e6;
    text-align: center;
    cursor: pointer;
}
.notificationSettings .formLayout .linkControl span{
    position: absolute;
    right: 30px;
    top: 2px;
}
.notificationSettings .formLayout.phoneSetting .linkControl span{
    top: 5%;
}
.notificationSettings .labelNotifications{
    padding-right: 5px !important;
}

.storeListingModal{
    list-style: none;
    margin-right: 30px;
}
.storeListingModal .appStoreDownload{
    background-position:-5px -349px;
    display: block;
    width: 182px;
    height: 60px;
    margin: 10px auto;
    text-indent: -99999px;
}
.storeListingModal .playStoreDownload{
    background-position:-198px -349px;
    display: block;
    height: 60px;
    margin: 10px auto;
    text-indent: -99999px;
    width: 183px;
}

.quietHours .repeatDayPicker .inputGroupH{
    padding: 12px 15px !important;
    margin-left: -100px;
}
.quietHoursTimeStart .timePicker{
    position: absolute !important;
    margin-top: 41px !important;
    margin-left: -212px !important;
    border:none !important;
    padding: 0 !important;
}
.quietHours .remove{
    border: none !important;
    width:24px !important;
    height:24px !important;
    background-position:-653px -607px;
    background-color: transparent !important;
    right: 20px !important;
    top: 10px !important;
    position: absolute;
}
.quietHoursPeriodMoveToFront{
    z-index:3100 !important;
    position: relative;
}
.quietHoursPeriodMoveToBack{
    z-index:100 !important;
}
.quietHoursTimeStart{
    margin-top: 35px;
    margin-left: 70px;
}
.quietHoursTimeEnd{
    margin-left: 180px;
    margin-top: 50px;
}
.quietHoursTimeStart input, .quietHoursTimeStart select,
.quietHoursTimeEnd input, .quietHoursTimeEnd select{
    margin-left: -80px !important;
}
.quietHoursTimeSeparator{
    position: absolute;
    margin-left: 83px;
}
.iPhone .quietHoursTimeStart,
.iPad .quietHoursTimeStart{
    margin-top: 0;
    margin-left: 83px;
}
.iPhone .quietHoursTimeEnd,
.iPad .quietHoursTimeEnd{
    margin-top: -47px;
    margin-left: 210px;
}
.iPhone .separateTime,
.iPad .separateTime{
    min-height: 50px !important;
    border: none !important;
}
.quietHours{
    border: none !important;
}
.iPhone .quietHoursTimeSeparator,
.iPad .quietHoursTimeSeparator{
    margin-top: -47px;
    margin-left: 112px;
}
.formLayoutBigLabel,
.iPhone .formLayoutBigLabel,
.iPad .formLayoutBigLabel{
    width: 100% !important;
}

.quietHoursTimeStart .timePicker,
.quietHoursTimeEnd .timePicker{
    position: absolute !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    border:none !important;
    padding: 0 !important;
}

.quietHoursMessageToolTip{
    text-align: left !important;
    padding-top: 10px !important
}
.quietHoursMessageBackground{
    background-color: #F5F5F5;
}
 .quietHoursMessageBackground *{
    opacity:0.8;
    filter:alpha(opacity=80);
 }

.quietHoursMessageToolTip .profilePhoto{
    float: left;
    width: 40px;
    height: 40px;
    -moz-border-radius: 10px 0 10px 10px;
    -webkit-border-radius: 10px 0 10px 10px;
    border-radius: 10px 0 10px 10px;
    margin: 0 5px 0 0;
}
.parentsSignature {
    margin-top: 13px !important;
    white-space: normal !important;
    line-height: 20px;
    text-indent: 0 !important;
}
.noHighlightSelectAll {
    color: #666 !important;
    cursor: default !important;
}
.reinviteButton{
    display: none;
}
.studentButtonFix{
    position: absolute !important;
    bottom: 10px !important;
}
.reinviteAllButton{
    display: none;
}
.loadMoreEntriesAwards{
    left: 0 !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    position: static !important;
    margin-bottom:-4px;
}
.verticalList .reinviteAllButton{
    float: right;
    width: 100px;
    display: block;
    font-size: 14px;
    color: #53c8e6;
    margin-top: -39px;
    height: 35px;
}
.verticalList .reinviteButton{
    width: 69px !important;
    display: block !important;
    background: #FFF !important;
    height: 28px !important;
    text-indent: 0 !important;
    padding: 0 !important;
    top: 40px !important;
}

.reinviteSignatureOverflow{
    width: calc(100% - 90px) !important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
    .reinviteButton span{
        font-size: 14px;
        margin-top: -7px;
        display: block;
    }
.editMembershipSettings div.formPadding .formLayout .linkControl{
    padding-left:145px;
}

/******************************
* Video
******************************/
video::-webkit-media-controls-panel{
    box-shadow:0 -1px 1px rgba(0,0,0,.1);
    border:1px solid rgba(0,0,0,.2);
    border-top:none;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
video::-webkit-media-controls-volume-slider-container,
video::-webkit-media-controls-volume-slider,
video::-webkit-media-controls-mute-button {
    display: none !important;
}

.noLabel {
    padding: 0 10px 0 20px !important;
}

#addEvent_slotDuration, #addEvent_break {
    padding-left: 110px;
}

/********************************************
* Notification Center Icon
********************************************/
.notificationCenter{
    background-color: #e8e8e8 !important;
}
div#notificationCenterIcon{
    width: 36px;
    height: 44px;
    margin-top: -97px;
    right: 38px;
    position: absolute;
}
/*.hideSidePanel div#notificationCenterIcon{
    right: 38px;
}
.showSidePanel div#notificationCenterIcon{
    right: 38px;
}*/
div#notificationCenterIcon .toggleTray{
    display:none;
    cursor:pointer;
    position:fixed;
    width:36px;
    height:36px;
}
.notificationCenterIconMobile{
    display: none;
}
@media screen and (max-width: 767px){
    .notificationCenterIconMobile{
        display: block;
        top: 1px !important;
        right: 45px !important;
    }
    div#notificationCenterIcon{
        margin-top: 0;
        position: absolute;
        top: 6px !important;
    }
    .communityPage .notificationCenterIconMobile:before{
        /*background-position:-461px -355px !important;*/
    }
    .mobileTabs{
        display: block;
    }
    .desktopTabs{
        display: none;
    }
}
@media screen and (min-width: 768px){
    .mobileTabs{
        display: none;
    }
    .desktopTabs{
        display: block;
    }
}
div#notificationCenter .subPage{
    background: #e8e8e8 !important;
    padding-bottom:0;
}
div#notificationCenterIcon .toggleTray.desktopRes{
    display:none;
}
div#notificationCenterIcon .toggleTray.mobileRes{
    display:block;
}
div#notificationCenterIcon:before{
    content:"";
    background-position:-398px -358px;
    position:absolute;
    top:0;
    right:0;
    width:36px;
    height:36px;
    text-indent:-9999px;
    cursor:pointer;
    display:block;
    border-left:1px solid transparent;
    background-repeat: repeat !important;
}
div#notificationCenterIcon .badge{
    text-align: center;
    text-indent: 0;
    min-width: 18px;
    display: block;
    height: 18px;
    padding: 0 3px;
    color: #fff;
    position: absolute;
    top: 1px;
    right: -3px;
    font-size: 10px;
    line-height: 20px;
    text-shadow: none;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    box-shadow: inset 0px -1px 0px rgba(0,0,0,.1);
    background: #e86c6c;
}

.displayOnlyInvites{
    padding-top: 0 !important;
}
#notificationCenter .hasSubTabs{
    padding-top:99px !important;
}
#notificationCenter .hasSubTabs .subNavTabs,
#notificationCenter .hasSubTabs .orgNav{
    top:49px;
}
#notificationCenter .contentNotificationCenter{
    padding:10px 10px 40px 10px;
}
#notificationCenter .inviteCircles .contentInviteCircles div:first-of-type h1 {
    border: none !important;
}
#notificationCenter .inviteCircles .contentInviteCircles {
    background-color: #e8e8e8 !important;
}
#notificationCenter .subPage .contentInviteCircles{
    overflow-y: hidden !important;
}
#notificationCenter .circleRequests .inviteRequest .hgroup {
    padding-left: 0;
    margin: -15px 0 50px 0;
}
#notificationCenter .circleRequests .hgroup h2 {
    /*margin-bottom: -7px;*/
}
#notificationCenter .circles .circle {
    margin: 0;
    border-radius:50px;
}
#notificationCenter .formLayout section .hgroup button.circle,
#notificationCenter .circles button.circle:before {
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
#notificationCenter .circleRequests .invitation .hgroup h3{
    margin: -21px 0 -15px 0;
    text-indent: 60px;
}
#notificationCenter .circleRequests h3.parentListContentFull{
    margin-top: -15px !important;
    position: absolute;
}
#notificationCenter .circleRequests .hgroup h2{
    margin-bottom: -5px !important;
}
#notificationCenter .postEntry h3:not(.commentModerationPost){
    margin-top: -18px !important;
    margin-left: 10px !important;
    position: absolute;
}
#notificationCenter .circleRequests .hgroup h3 span {
    text-indent: 0;
    margin-top: -2px;
}
.notificationCenter .removeScroll{
    overflow: hidden !important;
}
.requestAccessEmail{
    margin-top: -3px;
    margin-bottom: 25px;
}
#notificationCenter article .dateDisplay + .hgroup h3{
    padding-left:10px;
}




/******************************
* Timezones
******************************/
.listCountry{
    margin-top: 45px !important;
}
.searchCountry{
    display: block;
    width: 100%;
    height: 46px;
    top: 48px !important;
    position: absolute;
    background: #fff;
    border-top: 1px solid #e4e5ed;
    border-bottom: 1px solid #e4e5ed;
    box-shadow: inset 0 1px 0 rgba(255,255,255,1);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 7px 15px;
}
.searchBoxCountry{
    margin: 0 !important;
    display: block !important;
    width: 100%;
    height: 100%;
    padding: 0 !important;
    border: none;
    list-style: none !important;
    position: relative !important;
}
.searchBoxCountry div{
    margin: 0;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    box-sizing: border-box;
    background: #fff;
    border-radius: 3px;
}
.searchBoxCountry input{
    border: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
    height: 100%;
    display: block;
    outline: none;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    background: #dedede;
    /*font-size: 18px;*/ font-size: 16px;
    color: #666;
    text-indent: 0;
    right: 10px;
    -webkit-appearance: none;
}
.searchBoxCountry input:focus {
    text-align: left;
    background: #fff;
    color: #8d8d8f;
}
.searchBoxCountry input{
    border: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
    height: 100%;
    display: block;
    outline: none;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
    background: #dedede;
}
.ajustTimezone{
    text-decoration: underline;
}
.creditsList{
    list-style: none;
    margin:0;
    padding: 0;
}
.creditsList li{
    margin:0;
    padding: 0;
}
.creditsList li img {
    width: 100%;
    max-width:405px;
    display:block;
    margin:0 auto;
}
.creditsList li .canPurchase{
    cursor: pointer;
}

.inlineToolTipGreen{
    background: #60c580;
    color:#FFF !important;
    border-bottom:1px solid #4ea469 !important;
    text-shadow:none;
}
.inlineToolTipGreen p{
    font-size:14px;
}
.inlineToolTipGreen a{
    color:#FFF !important;
    text-decoration: underline;
}
.inlineToolTipCenter{
    text-align: center;
}
.showPasswordModalControl{
    background: none !important;
    border: none !important;
}
.showPasswordModalControl label{
    font-size: 16px;
    float: right;
    margin-right: 65px;
}

/******************************
* Import Class Messenger
******************************/
#importClassMessenger .formLayout .classMessenger button.addToMsg,
#importClassMessenger .formLayout .classMessenger button.removeFromMsg {
    width: 20px;
    height: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 0;
    border: 2px solid #ccc;
    background-color: #fff;
    position: absolute;
    left: 12px;
    top: 13px;
    text-indent: -9999px;
}
#importClassMessenger .formLayout .classMessenger h3{
    padding-left: 30px;
    /*font-size: 18px;*/ font-size: 16px;
    color: #000;
}
#importClassMessenger .formLayout .classMessenger button.removeFromMsg {
    border-color: #53c8e6;
}
#importClassMessenger .formLayout .classMessenger button.removeFromMsg:after {
    content: "";
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    top: -2px;
    left: -2px;
    background-position: -212px -852px;
}
.titleModalClassMessenger{
    font-size: 20px;
    font-weight: bold !important;
}
.logoClassMessenger{
    width: 40%;
}
#addSlot_EndTime{
    margin-left: -30px;
}
.createJoinGroup{
    height: 100%;
    width: 100%;
    display:table;
    padding: 10px;
    box-sizing: border-box;
    border: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-direction: row;
    flex-direction: row;
}
.shadowBox.loginPage, #forgotPassword, #createJoinGroup, #signUpScreen, #getInvited {
    /*display: flex;
    align-items: center;*/
}

.shadowBox .subPage.createAccountPage, #forgotPassword .forgotPasswordPage {
    /*max-width: 400px;
    margin-left:auto;
    margin-right:auto;*/
    /*height:auto;*/
    /*top:0;*/
    max-width:800px;
}

.shadowBox .subPage.recipientPickerCtrl { max-width:1080px; }
#forgotPassword .forgotPasswordPage { max-width: 800px; }
.createAccountPage .formPadding { background: transparent; }
form.formPadding>.formLayout.resetPasswordBtn { background: transparent; box-shadow: none; border: 0; overflow: inherit; }
.createJoinGroup > div{
    /*display:table-cell;
    height: 50%;
    border-top: 1px solid #e4e5ed;*/
    cursor: pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    vertical-align: middle;
    padding: 10px !important;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
.createJoinGroup .wrapper{
    display: block;
    text-align: center;
    vertical-align: middle;
    /* border-bottom: 1px solid #e4e5ed; */
    padding: 25px;
    width: 100%;
    box-sizing: border-box;
    height: 100%;
    border-radius: 10px;
    color:#fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.createJoinGroup .joinExistingClassGroup .wrapper {
    background-color: #e86c6c;
}
.createJoinGroup .createNewClassGroup .wrapper {
    background-color: #57c8dc;
}
.createJoinGroup > div:last-of-type .wrapper{
    /*border-bottom:none;*/
}
.createJoinGroup h1{
    text-align: center;
    padding:8px 0 0 0;
    font:20px/24px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.createJoinGroup h1 span{
    font:16px/24px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.createJoinGroup .icon{
    height:100px;
    width:100px;
    display:inline-block;
    transform: scale(0.7);
    margin: -15px 0;
}
.createJoinGroup .joinExistingClassGroup .icon{
    background-position:-174px -1800px;
}
.createJoinGroup .createNewClassGroup .icon{
    background-position:-302px -1800px;
}
.pac-container { z-index: 10000 !important; }
.createJoinGroup .signUpCleverBtn.logInBtn {
    max-width: 430px;
    align-items: center;
    display: inline-flex;
    justify-content: center;
    white-space: nowrap;
}

.hiddenscrollbars::-webkit-scrollbar {
    display: none;
}
.awardFeedNav{
    padding:0 44px;
    margin:-45px 0 12px 0;
    background:#fff;
    text-align:center;
    padding:8px 0 0 0;
    width: 200px;
}
.awardFeedNav .datePicker{
    background: transparent;
    border: none;
    text-align: center;
    cursor: pointer;
    font-size:15px;
    color:#000;
}
    .awardFeedNav .datePicker:hover{
        color: #000;
    }
    .awardFeedNav .datePicker .icon{
        background-position: -264px -1130px;
    }
.awardFeedNav .datePicker .icon{
    display: none;
}
.awardFeedNav .datePicker span{
    text-decoration: underline;
}

.awardFeedNav li{
    list-style: none;
    display: inline-block;
    font-weight: bold;
    line-height:40px;
}
.awardFeedNavCurrent{
    text-align: center;
}
.awardFeedNavBefore,
.awardFeedNavAfter{
    width:44px;
    height:44px;
    cursor: pointer;
    position:absolute;
}
.awardFeedNavBefore{
    left:0;
}
.awardFeedNavBefore:before{
    content:"";
    width:6px;
    height:6px;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    display:block;
    top:16px;
    position:absolute;
    left:20px;
    border:#aaa solid;
    border-width:0 0 2px 2px;
}
.awardFeedNavAfter{
    margin-left: 15px;
}
.awardFeedNavAfter:before{
    content:"";
    width:6px;
    height:6px;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    display:block;
    top:16px;
    position:absolute;
    right:20px;
    border:#aaa solid;
    border-width:2px 2px 0 0;
}
.awardFeedNavInactive{
    color:#CCC !important;
}
.behaviorSummaryCategory{
    cursor: pointer;
    text-decoration:underline;
}
.behaviorReportingContent{
    margin-top: 0px;
    background: #FFF !important;
}
.behaviorReportingContent .studentAwards{
    border:none !important;
    margin-top: -24px;
    padding-top:0;
}
.behaviorReportingContent .summaryBox li>span{
    display:block;
}


#orgHome .orgInfoPage.communityDocuments .scrollView,
.orgInfoPage.communityDocuments .contentArea #communityContent>div{
   background: #f2f2f2 !important;
}
.orgInfoPage.communityDocuments .contentArea #communityContent>div {
   padding-left:0;
   padding-right:0;
}
.hideMenuNav .hidableMenu {
    display: none;
}
.hideMenuNav > section{
    margin-top: 0 !important;
}
.calendarDatePickerRangeDate input{
    border:none;
    cursor: pointer;
}
.pac-container {
    z-index: 10000 !important;
    width: auto !important;
    position: initial !important;
    left: 0 !important;
    right: 0 !important;
    display: block !important;
}
.pac-container:empty{
    display: none !important;
}
.placeLocationBoxResultsNotListed{
    cursor: pointer;
    font-size: 15px;
    padding: 5px 0;
    background: #FFF;
    border-top: 1px solid #CCC;
}
@media screen and (min-width: 768px){
    #notificationCenter .loadMoreEntries {
        margin-top: 50px;
    }
    .notificationCenterTitle{
        width: 75%;
        margin:0 auto;
    }
}
#notificationCenter .loadMoreEntries {
    position: absolute;
    z-index: 9999;
    margin-top: 0px;
    left: 0 !important;
    margin-left: 0 !important;
}

#notificationCenter .postVerificationRequestEntry .threeLines{
    margin-top: 10px;
    min-height: 115px;
}
#notificationCenter .postVerificationRequestEntry .verificationMessage{
    min-height: 150px;
}
#notificationCenter .verificationMessage{
    margin-bottom: 10px;
    height: auto;
    font-size: 14px;
    color: #8e8e8e;
}
#notificationCenter .postVerificationRequestEntry .fourLines{
    margin-top: 10px;
    min-height: 140px !important;
}
#notificationCenter .postVerificationRequestEntry .threeLines h3.verifyRequestParentSignature{
    margin-top: -10px !important;
    position: absolute;
}
#notificationCenter .postVerificationRequestEntry .highlightableRow h2+h3{
    margin-top: -25px;
    margin-left: 0;
    position: absolute;
}
#notificationCenter .postVerificationRequestEntry .highlightableRow.header h2+h3{
    margin-top: -20px !important;
    margin-left: 5px !important;
}
#notificationCenter .postVerificationRequestEntry .threeLines h3{
    margin-left: 0;
}
#notificationCenter .postVerificationRequestEntry .noCarrousel .connectionPhoto{
    display: none;
}
.contentNotificationCenter .entryOptions,
#postView .entryOptions{
    display: none !important;
}
#postView .entryOptions.comment{
    display: block !important;
}
#notificationCenter .postVerificationRequestEntry .connectionAggregation{
    min-height: 0;
    padding-bottom: 0 !important;
    margin-bottom: 10px;
}
#notificationCenter .deletedPostsLink{
    font-size: 14px;
    color: #1ca0c8;
    text-decoration: underline;
    margin:0 0 8px 4px;
    text-align: right;
    display: block;
}
#notificationCenter .calendarInvite .hgroup time{
    margin-top: 30px;
    margin-top: 42px;
}
.ie #notificationCenter .calendarInvite .hgroup time{
    margin-left: -20px;
}
.ie #notificationCenter .calendarInvite .hgroup .tagVolunteer{
    margin-left: -25px;
}
#notificationCenter .calendarInvite{
    min-height: 95px;
}
#notificationCenterIcon.desktop{
    display: none;
}

@media screen and (min-width: 768px){
    #notificationCenterIcon.desktop{
        display: block;
    }
}
.selectUnselectAll{
    position: absolute;
    display: block;
    margin-top: 7px;
    z-index: 1000;
    font-size: 14px;
    color: #1ca0c8;
    cursor: pointer;
    right: 10px;
    background: #f2f2f2;
    padding: 2px 5px;
}


.currentNotificationCenter #notificationCenterIcon:before{
    /*background-color: rgba(0,0,0,.05);
    border-left: 1px solid rgba(0,0,0,.05);*/
    background-color:#e6e9ec;
}
#notificationCenter .notificationCenterWithFooter{
    padding-bottom:37px;
}
#notificationCenter .multiAcceptance{
    border:none;
    border-top:1px solid #e4e5ed;
    border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    background:#fff;
    margin-bottom:0;
    height: auto;
    padding-top: 0;
    padding-bottom: 42px;
}


#notificationCenter .multiAcceptance .acceptanceControl{
    display:none;
    border-top: 1px solid #fff;
    top: 0;
}



#notificationCenter .multiAcceptance .acceptanceControl ul{
    /*display:table;
    table-layout:fixed;*/
}
#notificationCenter .multiAcceptance .acceptanceControl li{
    /*display:table-cell;*/
    padding: 0 25px;
}
#notificationCenter .multiAcceptance footer.acceptanceControl li {
    /* display: table-cell; */
    padding: 8px 25px;
    margin-top: -4px;
}
#notificationCenter .multiAcceptance .acceptanceControl li:last-of-type{
    border-right:none;
}
#notificationCenter .notificationCenterWithFooter .multiAcceptance .acceptanceControl{
    display:block;
}

#notificationCenter article.update .resharedUpdate .hgroup + p:last-of-type{
    margin-bottom:0 !important;
}


.notificationCenterWithFooter .accept,
.notificationCenterWithFooter .decline{
    cursor: pointer;
}
.notificationCenterWithFooter .buttonDisabled{
    opacity:0.4;
    filter:alpha(opacity=40);
    cursor: default;
}
#_communityRequest .formLayout label input[type='text']{
    /*padding-left: 110px !important;*/
}

.manageMembers, .selectAllMemberGroup{
    text-decoration: underline;
    float: right;
    font-size: 14px;
    margin-top: 25px;
    color: #1ca0c8;
    cursor: pointer;
}
.selectAllMemberGroup {
    margin-right: 10px;
    margin-top: 0;
}
.manageMembersList .profileM{
    margin-left: 30px !important;
}
.labelInherit{
    position: inherit !important;
}
.manageMembersList h3{
    margin-top: -45px;
    margin-left: 85px;
}

.safari.Desktop .manageMembersList h3{
        margin-top: -35px !important;
    }
.safari.Desktop .groupSignature{
    margin-top: -50px !important;
}
.postOptions{
    text-shadow:none;
}
.postOptions li .membersManagerOptions.selectAllMembers:before{
    background-position:-403px -722px;
}
.postOptions li .membersManagerOptions.inviteMembers:before{
    background-position:-273px -722px;
}
.postOptions li .membersManagerOptions.reInviteMembers:before{
    background-position:-273px -722px;
}

.postOptions li .membersManagerOptions.editMembers:before{
    background-position:-274px -1024px;
}
.postOptions li .membersManagerOptions.removeMembers:before{
    background-position:-591px -1024px;
}
.postOptions li .membersManagerOptions.addMembers:before{
    background:url(../images/add_to_class.png);
}
.postOptions li .membersManagerOptions.verifyStudents:before{
    background:url(../images/verify_students.png);
}

.postOptions li .membersManagerOptions.addMembers:before,
.postOptions li .membersManagerOptions.archiveUnArchive:before,
.postOptions li .membersManagerOptions.editSettings:before,
.postOptions li .membersManagerOptions.addModerator:before,
.postOptions li .membersManagerOptions.verifyStudents:before{
    background-position: -2px -2px !important;
    background-size: 110% !important;
}

.postOptions li .membersManagerOptions.archiveUnArchive:before{
    background:url(../images/ArchiveIcon.png);
}

.postOptions li .membersManagerOptions.editSettings:before{
    background:url(../images/SettingsIcon.png);
}

.postOptions li .membersManagerOptions.addModerator:before{
    background:url(../images/moderator.png);
}
.membersManagerSearchWrapper{
    margin-top: 0px;
    border-bottom: 1px solid #cfcfcf;
    padding: 0;
    text-indent: 0;
    padding: 2px 10px;
    padding: 5px 10px;
    background: transparent;
    border: 0;
    padding-top:0;
    padding-left:0;
    padding-right:0;
}
.membersManagerSearchWrapper input {
    box-sizing: border-box;
    border:none;
    text-align: center;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background: #dedede;
    width: 100%;
    padding:0 5px;
    height: 32px;
    Height: 40px;
    background: #fff;
    /*border-radius: 50px;*/
    text-align: left;
    padding: 2px 20px;
}
    .membersManagerSearchWrapper input:focus,
    .membersManagerSearchWrapper input:valid {
        text-align: left;
        background-color: #FFF;
    }

@media screen and (min-width: 768px){
    .postView.membersManager{
        padding-bottom: 60px !important;
    }
    .membersManagerOptions{
        margin-top:3px !important;
    }
}
.manageMembersWrapper{
    margin-top: -8px;
}
.manageMembersWrapper .membersManagerSearchSection {
    background-color: #f2f2f2;
}
.manageMembersWrapper .memberInvited{
    float: right;
    margin-top: -50px;
    border-radius: 5px;
    background: #f4f4f4;
    font-size: 12px;
    padding: 0px 6px;
    line-height: 20px;
    text-align: center;
    text-indent: 0;
    margin-right: 5px;
}
.updates article p span.postHeaderFlag{
    display: none;
}
article.new .messages .message time:before,
article.new.hasComment .newFlag,
.isNew #behaviorSummaryFeedSection:before,
article.new .membersNumber:before,
article.new .metaInfo time:before{
    content: "NEW";
    display: inline-block;
    background: #ff6666;
    padding: 0 8px;
    margin-right: 5px;
    border-radius: 15px;
    color: #fff;
    text-shadow: none;
    font-size: 12px;
}

.newMemberTagInPost:after {
    content: "NEW";
    display: inline !important;
    background: #ff6666;
    padding: 0 8px;
    position: relative;
    float: right !important;
    margin-left: 5px;
    border-radius: 15px;
    color: #fff;
    text-shadow: none;
    font-size: 12px;
}

article.new .membersNumber:before{
    height:20px;
}

article.editedFlag .messages .message time:before,
article.editedFlag.hasComment .editedFlagF,
article.editedFlag .metaInfo time:before,
article.editedFlag .updatedEvent:before{
    content: "EDITED";
    display: inline-block;
    background: #ff6666;
    padding: 0 8px;
    margin-right: 5px;
    border-radius: 15px;
    color: #fff;
    text-shadow: none;
    font-size: 12px;
}
.updates article p span.postHeaderFlag.newFlag{
    height: 17px;
    font-style: italic;
    padding: 0px 7px;
    display: inline-block !important;
}

article.new.hasComment .messages .message time{
    display: block !important;
    margin-top: 6px;
}
article.new.hasComment article.resharedUpdate time:before{
    display: none !important;
}
article.editedFlag.hasComment time:before{
    display: none !important;
}
article.editedFlag.hasComment article.resharedUpdate time:before{
    display: inline-block !important;
}
.postView article.new.hasComment time:before{
    display: none !important;
}
.postView article.editedFlag.hasComment time:before{
    display: inline-block !important;
}
.communityClassesAndGroups .hgroup{
    height: 50px !important;
}
.communityClassesAndGroups .hgroup h2{
    min-height: 68px;
    height: 68px;
    margin: -2px 5px 5px 13px !important;
}
.communityClassesAndGroups .hgroup h3{
    text-indent: 0 !important;
    display: block !important;
    margin-bottom: 0 !important;
    margin-top: -25px !important;
    margin-left: 84px !important;
}
.groupedListingNoPadding{
    padding: 0 !important;
}
.communityClassesAndGroups section{
    margin:0 !important;
    -moz-border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    border-bottom: 1px solid #e4e5ed !important;
}
.communityClassesAndGroups label{
    display: block;
    margin: 20px 10px 10px;
}
.communityClassesAndGroups .count {
    /*display: none !important;*/
}
.loadingProfileInProgress{
    margin-top: -9px !important;
    margin-left: -10px !important;
}
.addPostEditCaptionWrapper{
    padding:0 !important;
    margin-top:32px;
}
.addPostEditCaptionWrapper .addPostEditCaption{
    color:#8e8e8e;
    font-size:14px;
    line-height:16px;
    overflow: hidden !important;
    padding:8px 0;
}
.addPostEditCaptionWrapper .addPostEditCaption::-webkit-input-placeholder{
    color:#aaa;
    font-size:14px;
    line-height:16px;
}
.addPostEditCaptionWrapper .addPostEditCaption:-moz-placeholder{
    color:#aaa;
    font-size:14px;
    line-height:16px;
}
.addPostEditCaptionWrapper .addPostEditCaption::-moz-placeholder{
    color:#aaa;
    font-size:14px;
    line-height:16px;
}
.addPostEditCaptionWrapper .addPostEditCaption:-ms-input-placeholder{
    color:#aaa;
    font-size:14px;
    line-height:16px;
}

article.photo p.caption{
    max-height: none !important;
    padding-top: 0;
}
.mediaTab .albumEditingCaptionWrapper,
.mediaTab .albumViewingCaptionWrapperEdit,
#orgHome .albumEditingCaptionWrapper,
.photoAlbumGallery .albumEditingCaptionWrapper{
    margin-top: -42px;
    position: absolute;
    z-index: 100;
    width: 100%;
    height:42px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.mediaTab .albumViewingCaptionWrapper,
#orgHome .albumViewingCaptionWrapper,
.photoAlbumGallery .albumViewingCaptionWrapper{
    margin-top: -41px;
    padding-top:10px;
    position: absolute;
    width:100%;
    cursor:pointer;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+14,0+14,0.55+86 */
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 14%, rgba(0,0,0,0.55) 86%, rgba(0,0,0,0.55) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 14%,rgba(0,0,0,0.55) 86%,rgba(0,0,0,0.55) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 14%,rgba(0,0,0,0.55) 86%,rgba(0,0,0,0.55) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#8c000000',GradientType=0 );
}
.Desktop .mediaTab .albumViewingCaptionWrapper,
.Desktop #orgHome .albumViewingCaptionWrapper,
.Desktop .photoAlbumGallery .albumViewingCaptionWrapper{
    visibility:hidden;
}
.mediaTab .photo:hover .albumViewingCaptionWrapper,
.mediaTab .photo .albumViewingCaptionWrapper.hasCaption,
.photoAlbumGallery .photo:hover .albumViewingCaptionWrapper,
.photoAlbumGallery .photo .albumViewingCaptionWrapper.hasCaption,
#orgHome .photo:hover .albumViewingCaptionWrapper,
#orgHome .albumViewingCaptionWrapper.hasCaption{
    visibility:visible;
}
.albumViewingCaptionWrapper > div{
    font-size: 14px !important;
    text-shadow: none;
    padding: 7px;
    color: rgba(255,255,255,.7);
    overflow: hidden;
    height: 17px;
    line-height: 21px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.albumViewingCaptionWrapperEdit{
    background: #fdf8e3;
}
.albumEditingCaptionWrapper{
    padding: 3px;
}
.albumCaptionButtonEditing{
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius:5px;
    border: none;
    background: #0092c9;
    color: #fff;
    padding: 4px 12px;
    position: absolute;
    right: 6px;
    top: -6px;
}
.albumCaptionEditing{
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow:0 2px 3px rgba(0,0,0,.2);
    padding:6px;
    margin-top:-13px;
}
.albumCaptionEditing textarea{
    font-size: 14px !important;
    overflow: hidden !important;
    margin: 0 !important;
    border: none;
    width: 100%;
    display:block;
    padding-right: 64px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    max-height:100px;
}
.postImageCaption{
    color:#8e8e8e;
    display:block;
    margin:12px 4px 0 4px;
    font-size:14px;
    line-height:16px;
}
.readMore{
    display: block;
}
    .readMore .more{
        display: none;
    }

.readMoreLink{
    overflow: hidden;
    display: block;
}
    .readMoreLink .more{
        display: block;
        position: absolute;
        background: #fff;
        padding: 0 4px;
        right: 10px;
        margin-top: 16px;
        text-decoration: underline;
        cursor: pointer;
    }
    .readMoreLink .more:before{
        content: "";
        display: block;
        width: 16px;
        height: 16px;
        margin-left: -19px;
        position: absolute;
        background: -moz-linear-gradient(left, rgba(255,255,255,0.01) 0%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(left, rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to right, rgba(255,255,255,0.01) 0%,rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03ffffff', endColorstr='#ffffff',GradientType=1 );
    }
    .readMoreAll{
        overflow: none;
    }
    .readAll .more{
        display: none !important;
    }

article .imageFeedbackControl{
    position: static;
    border-top: none;
    background:transparent;
    margin: 20px -10px -30px;
    border-top: 1px solid #e4e5ed;
    width: auto;
    padding: 0 10px;
    margin: 20px -10px -30px;
    margin:0;
}
article .imageFeedbackControl li{
    border: none !important;
    cursor: pointer;
}
    article .imageFeedbackControl li.like{
        width: 35px;
        margin-left:-4px;
    }
    article .imageFeedbackControl li.like:before{
        background-position: -395px -601px;
    }
    article .imageFeedbackControl li.likeSelected:before{
        background-position: -395px -661px;
    }
    article .imageFeedbackControl li.comment{
        position: absolute;
        font-size: 14px;
        color: #38accf;
        cursor: pointer;
        margin-left: -8px;
    }
.imageFeedbackControl.disabledMediaComment li.like{
    cursor:default !important;
}
.imageFeedbackControl.disabledMediaComment{
    opacity:.5;
    filter:alpha(opacity=50);
}
.studentTimelineWitoutClass{
    /*margin-top: -15px;*/
    margin-top: 0;
}
.contentNotificationCenter .loadMoreEntries{
    margin-top:-8px !important;
}
.contentNotificationCenter .unread:before{
    content: "";
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background: #4bc1e6;
    position: absolute;
    margin-top: -3px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    z-index: 1000;
    right: 0px;
    float: right;
    margin-right: 6px;
}
.Desktop.hideSidePanel .contentNotificationCenter .unread:before{
    margin-right:0 !important;
}
.printCalendarEvents .linkControl{
    margin-left: 32px !important;
    padding-left: 110px !important;
    line-height: 35px !important;
    text-indent: 0 !important;
    padding-top: 6px !important;
}
.printCalendarEvents .scrollView{
    background:#e8e8e8 !important;
}
.printCalendarEvents .dateControl{
    margin-left: 40px;
}
.printCalendarEvents .dateControl li{
    border-bottom: 1px solid #e4e5ed !important;
}
.printCalendarEvents .dateControl li:last-child{
    border-bottom: none !important;
}
.postView .entryOptions:before{
    display: none;
}
.postView .comments .entryOptions:before{
    display: block;
}
.unofficialCommunity, .unofficialCommunity * {
    background-color: #edeef3;
    /*background-color: #f2f2f2;*/

}
.unofficialCommunity .formLayout .emptyPanelMsg,
.unofficialCommunity .formLayout .emptyPanelMsg h2,
.unofficialCommunity .formLayout .emptyPanelMsg p,
.unofficialCommunity .formLayout .emptyPanelMsg ul li{
    text-align: left !important;
    color:#333 !important;
    max-width: 95% !important;
    width: 95% !important;
}
.unofficialCommunity .formLayout .emptyPanelMsg p{
    margin-top: 15px;
    line-height: 25px;
}
.unofficialCommunity .formLayout .emptyPanelMsg p{
    margin-top: 15px;
    line-height: 25px;
}
.unofficialCommunity .formLayout .emptyPanelMsg ul{
    margin: 0;
    font-size: 16px;
}
    .unofficialCommunity .formLayout .emptyPanelMsg ul li{
        margin: 0;
        padding: 0;
        text-indent: 10px;
    }
.unofficialCommunity .formLayout .emptyPanelMsg p.center{
    text-align: center !important;
    padding-bottom: 0;
}
.unofficialCommunity .inviteThem{
    color: #3aa9d1;
    text-decoration: underline;
}
.unofficialCommunity .requestSchoolAccess{
    display: block;
    margin: 30px auto 10px auto;
    max-width: 500px;
    width:100%;
    border: 1px solid #43c1da;
    text-align: center;
    padding: 12px 25px;
    text-decoration: none;
    background: #43c1da;
    /*font-size: 18px;*/ font-size: 16px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color:#fff;
    font-weight:bold;
}
.hide {
    display: none !important;
}




/*****************************************
* YEARBOOK CREATION
*****************************************/
#yearbookCreateScenes .addBottomPadding{
    padding-bottom: 44px !important;
}
.yearbookModal article{
    background: transparent;
    border: none;
    box-shadow: none;
}
.yearbookModal article h2{
    overflow: initial;
}
#yearbookCreateScenes .scrollViewHidden{
    overflow: hidden !important;
}
#yearbookCreateScenes .postOptions{
    background-color: #eee;
    height: 50px;
}
#yearbookCreateScenes .postOptions li{
    border-left:1px solid #fff;
    border-right:1px solid #d8d8d8;
}
#yearbookCreateScenes .postOptions li:first-of-type{
    border-left:none;
}
#yearbookCreateScenes .postOptions li:last-of-type{
    border-right:none;
}
#yearbookCreateScenes .cursor{
    cursor: pointer;
}
#yearbookCreateScenes .postOptions button{
    margin-top: -1px;
    text-shadow: rgb(255, 255, 255) 0px 1px 0px;
    overflow: visible;
    width: 100%;
    float: left;
    height: 38px;
    border: none;
    font-size: 17px;
    color: #666;
    text-align: center !important;
    margin-top:-8px;
}
#yearbookCreateScenes .postOptions li:last-of-type button{
    font-weight: bold;
}
#yearbookCreateScenes .sceneObjects{
    overflow: hidden;
    background-color:#e8e8e8;
}
#yearbookCreateScenes .currentScene .sceneObjects{
    overflow-y: auto !important;
}
#yearbookCreateScenes .scrollViewHidden{
    overflow: hidden !important;
}
#yearbookCreateScenes .postOptions{
    background-color: #eee;
    height: 50px;
}
#yearbookCreateScenes .cursor{
    cursor: pointer;
    overflow: hidden;
}
#yearbookCreateScenes .postOptions button{
    margin-top: -1px;
    text-shadow: rgb(255, 255, 255) 0px 1px 0px;
    overflow: visible;
    width: 100%;
    float: left;
    height: 38px;
    border: none;
    font-size: 17px;
    color: #666;
    text-align: center !important;
    margin-top:-8px;
}
#yearbookCreateScenes .postOptions li:last-of-type button{
    font-weight:bold;
}
#yearbookCreateScenes .loadMoreEntries{
    z-index: 10001;
    top: 258px !important;
}
#yearbookCreateScenes .addImage .loadMoreEntries{
    z-index: 10001;
    position: absolute !important;
    margin-top: -235px !important;
}
.ie #yearbookCreateScenes .loadMoreEntriesGeneral{
    left: 0 !important;
}
#yearbookCreateScenes .sceneObjects{
    overflow: hidden;
}

#yearbookCreateScenes .isEditingStep .scenePreview{
    display:inline-block;
    top:0;
    cursor:pointer;
}
#yearbookCreateScenes .isEditingStep .currentScene .scenePreview{
    margin-right:0;
    cursor:default
}

#yearbookCreateScenes .isEditingStep .currentScene ~ .sceneItem .scenePreview{
    display:inline-block;
}


#yearbookCreateScenes .isEditingStep .currentScene + .sceneItem .scenePreview{
    display:inline-block;
}

#yearbookCreateScenes .currentScene .scenePreview{
    z-index:1;
}
#yearbookCreateScenes .scenePreview,
#yearbookCreateScenes .currentScene + .sceneItem .scenePreview{
    z-index:2;
}


#yearbookCreateScenes .postOptions button.disabled{
    color: #c3c3c3;
}

.yearbookScenes .yearbookScenePreview{
    overflow: hidden;
    background-color: #eee;
    text-indent:0;
}
.scenePreview .sceneImage{
    cursor: pointer;
}
.currentScene .scenePreview .sceneImage{
    cursor: default;
}
.yearbookScenes .scenePreview{
    height: 200px;
    padding:20px 0 10px 0;
    position:relative;
}
.yearbookScenes .sceneTitleWrap{
    height: 24px;
    margin-top: -24px;
}
.yearbookScenes .sceneTitle{
    color: #ababab;
    font-size: 11px;
    line-height: 24px;
    text-shadow:none;
}
.yearbookScenes .margins{
    display: none;
    height: 247px;
    margin: 0 !important;
    padding: 0 !important;
    /*display: inline-block;*/
}
.yearbookScenes .sceneMedia{
    background-color: #373742;
    display: inline-block;
    white-space: nowrap;
    min-width:100%;
    text-indent:0;
}
.yearbookScenes .sceneMedia .sceneItem{
    margin:0 !important;
    /*padding:230px 0 0 0 !important;*/
    text-align: center;
    vertical-align:top;
    display:inline-block;
    z-index:1;
}

.yearbookScenes .sceneMedia .sceneInfoDescription{
    padding:20px 0 0 0;
}
    .yearbookScenes .sceneMedia .sceneInfoDescription.sampleVideo a{
        text-decoration: underline;
        color: #53c8e6;
    }
.yearbookScenes .sceneMedia .sceneItem .sceneImage img{
    width: 320px;
    height: 180px;
    margin:5px auto;
    border:2px solid #000;
}

.yearbookScenes .removeMedia{
    width: 28px;
    height: 28px;
    line-height: 28px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    display: block;
    text-indent: 0;
    color: #fff;
    cursor: pointer;
    text-shadow: none;
    font-family: arial;
    font-size: 14px;
    margin-top: -10px;
    margin-left: 260px;
    position: absolute;
    background: #000;
    border: 2px solid #FFF;
}

#yearbookSelectImages .removeImage{
    width: 28px;
    height: 28px;
    margin-top: -10px;
    float: right;
    line-height: 28px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    display: block;
    text-indent: 0;
    color: #fff;
    cursor: pointer;
    text-shadow: none;
    font-family: arial;
    font-size: 14px;
    background: #000;
    border: 2px solid #FFF;
    margin-right: -10px;
}

.yearbookScenes .sceneOverlay{
    width: 325px;
    height: 183px;
    margin:0 auto;
    background-size: cover;
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
    border-radius:8px;
    box-shadow:0 2px 6px rgba(0,0,0,1);
    position:absolute;
}

.yearbookScenes .isEditingStep .sceneOverlay{
    position:relative;
    opacity:.2;
    filter:alpha(opacity=20);
}
.yearbookScenes .isEditingStep .currentScene .sceneOverlay{
    opacity:1;
    filter:alpha(opacity=100);
}

.yearbookScenes .isEditingStep .itemText{
    opacity:.2;
    filter:alpha(opacity=20);
    text-shadow:none;
}
.yearbookScenes .isEditingStep .currentScene .itemText{
    opacity:1;
    filter:alpha(opacity=100);
}



.yearbookScenes .sceneMedia .sceneItem .sceneItemContainer{
    width: 280px;
    margin:20px auto 20px auto;
}

.yearbookScenes .sceneMedia .sceneItem .sceneItemContainer input[type=text]{
    background-color: #fff;
    border:1px solid #d4d4d4;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow:0 2px 5px rgba(0,0,0,.1);
    width: 268px;
    height: 26px;
    padding: 3px;

}
.yearbookScenes .sceneItem .scenePreview .itemText {
    position: absolute;
    z-index: 10001;
    text-align: center;
    font-size: 11px;
    overflow: hidden;
    left:16px;
    top:16px;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.yearbookScenes .sceneMedia .sceneItem .sceneImageImage{
    text-indent: 0;
    line-height: 0;
    position: relative;
}
.yearbookScenes .sceneMedia .sceneItem .sceneImageImage .addImage{
    background-color: #f3f3f3;
    border: 1px dashed rgba(0,0,0,.2);
    border-radius: 6px;
}
.yearbookScenes .sceneMedia .sceneItem .sceneImageImage canvas{
    border-radius: 6px;
    overflow:hidden;
    box-shadow:0 2px 5px rgba(0,0,0,.1);
}



.yearbookScenes .sceneMedia .sceneItem .sceneImageImage div.addImage{
    padding: 60px 0;
    cursor: pointer;
    text-decoration: underline;
    color: #53c8e6;
    text-shadow: none;
    font-size:13px;
    box-shadow:0 2px 5px rgba(0,0,0,.1);
}

.yearbookScenes .sceneMedia .sceneItem .sceneImageCaption{
    background-color: #FFF;
    text-align: left;
}

#scenesPreview .sceneItem{
    width: 100%;
    background: #373742;
}
#scenesPreview .scenePreview{
    width: 325px;
    margin:0 auto;
    padding: 30px 0 10px 0;
}
#scenesPreview .sceneOverlay{
    margin: 0;
}
#scenesPreview .sceneTitleWrap{
    text-align: center;
}
#scenesPreview .scenePreviewItem{
    cursor: pointer;
}






.upgradePlanButton{
    width: 100%;
    padding: 5px;
    margin: 10px 0;
}

.formLayoutEmptyPanel{
    background: #e8e8e8 !important;
    background-color: #f2f2f2 !important;
}
.showMoreAlbuns{
    position: absolute !important;
    text-align: right !important;
    width: 130px !important;
    margin-left: 0 !important;
    right: 0 !important;
    text-align: left !important;
    color: #53c8e6 !important;
    cursor: pointer !important;
}
.scenePreview .videoWrapperCover,
.scenePreview .videoWrapper videogular vg-media video {
    width: 325px !important;
}
.sceneItemContainer .loadMoreEntries{
    position: static !important;
}
.sampleVideo p{
    white-space: normal;
    text-align: left;
    font-size: 16px !important;
}
.sampleVideo button{
    border:1px solid #0098c2;
    color:#fff;
    text-shadow:none;
    background: rgb(57,191,232); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(57,191,232,1) 0%, rgba(59,174,212,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(57,191,232,1)), color-stop(100%,rgba(59,174,212,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(57,191,232,1) 0%,rgba(59,174,212,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(57,191,232,1) 0%,rgba(59,174,212,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(57,191,232,1) 0%,rgba(59,174,212,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(57,191,232,1) 0%,rgba(59,174,212,1) 100%); /* W3C */
    filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#39bfe8', endColorstr='#3baed4',GradientType=0 )"; /* IE6-9 */
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    height:32px;
    line-height:32px;
    margin-top:8px;
    padding:0 15px 0 10px;
    width:auto;
    text-indent:0;
    background-position:initial !important;
}
.sceneMedia{
    left: 0px;
    position: relative;
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
}
.ie .sceneMedia{
    transition: .5s !important;
}
.sliderWrapper #videoWrapper{
    z-index: 1000 !important;
}
.sliderWrapper .videoWrapper{
    position: static !important;
}
.currentScene .sceneObjects {
    position: absolute !important;
}
#_upgradeOption .scrollView{
    background: #e8e8e8;
}
.sliderWrapper .videoWrapper videogular vg-media video{
    max-width: none !important;
    max-height: none !important;
}

.hasNoClass.scrollView,
.hasNoClass.scrollView .emptyPanelMsg{
    background: #e8e8e8 !important;
    max-width: none !important;
    text-align: left !important;
}
.hasNoClass.scrollView .emptyPanelMsg{
    margin: 0;
}
    .hasNoClass.scrollView .emptyPanelMsg p{
        font-size: 16px !important;
    }
    .hasNoClass.scrollView .emptyPanelMsg a{
        color: #1ca0c8;
    }
.videoCaptionEditContainer{
    margin-top: 30px;
    margin-left: -20px;
}
#addPost .readMore{
    display: none !important;
}
.videoPhoto .readMore {
    clear: both;
}
#addUpdateEvent .firstSubStep {
    background: #f0f2f4;
}
    #addUpdateEvent .firstSubStep .taskListing h1{
        font-size: 16px;
        margin: -20px 0 10px 20px;
        text-indent: 4px;
        color: #6d6d72;
        font-weight: bold !important;
    }
    #addUpdateEvent .firstSubStep .taskFooter ul li{
        cursor: pointer;
    }
    #addUpdateEvent .taskListing .taskInput label .quantityMask{
        height: 95px;
    }
    #addUpdateEvent .taskListing .hasVolunteer .taskInput label .quantityMask{
        height: 175px;
    }

    #addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherItem,
    #addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherHelp{
        background-position: -135px -713px;
        height: 50px;
        width: 50px;
        margin: 45px auto 5px auto;
        opacity:0.4;
        filter:alpha(opacity=40);
    }
    #addUpdateEvent .firstSubStep .taskFooter ul li .addAnotherHelp{
        background-position: -199px -713px;
    }
    #addUpdateEvent .secondSubStep.taskListing h1{
        font-size: 16px;
        margin: -8px 0 10px 10px;
        font-weight: bold !important;
        text-transform: none;
    }
    #addUpdateEvent .taskListing .volunteers {
        margin-left: 24px;
    }
        #addUpdateEvent .taskListing .volunteers .highlightableRow{
            margin-top: -10px;
        }
            #addUpdateEvent .taskListing .volunteers .quantity span{
                display: block;
                position: absolute;
                margin-left: -2px;
            }

        #addUpdateEvent .taskListing .volunteers .highlightableRow h3{
            margin-top: -31px;
            margin-bottom: 3px;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-left: 55px;
            height: 40px;
        }
.taskListing .itemDate, .taskListing .itemNotes{
    color: #9b9b9b;
    margin-left: 28px;
    font-size: 15px;
    line-height: 15px;
    margin-bottom: 5px;
}
.updateOption .formPadding section.formLayout {
    overflow: initial !important;
}
.signupOccurrences .formPadding{
    height: 250px;
    overflow-y: auto;
}
    .signupOccurrences .formPadding label {
        cursor: pointer;
    }
    .signupOccurrences .formPadding .disabled label{
        color: #666;
    }
    .signupOccurrences .formPadding .disabled label time{
        color: #666;
        text-decoration: line-through;
    }
    .signupOccurrences .formPadding .radio {
        display: inline-block;
        position: absolute;
        width: 16px;
        height: 16px;
        left: 10px;
        top: 13px;
        border: 2px solid #ccc;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        margin:-1px 10px 0 -5px;
    }
        .signupOccurrences .formPadding .radio.radioSelected{
            background-position: -214px -854px;
            border-color: #53c8e6;
        }
    .signupOccurrences .formPadding .text{
        margin-left: 16px;
        display: inline-block;
    }
    .iPhone .signupOccurrences .formPadding .text{
        margin-left: 36px;
    }
    .signupOccurrences .backButtonOnly{
        margin-top: 8px;
        position: absolute;
        top: 13px;
        left: 11px;
        display: block;
        width: 25px;
        height: 25px;
    }
    .signupOccurrences .backButtonOnly span{
        color: #53c8e6 !important;
        display: block;
        width: 13px;
        height: 13px;
        border: solid;
        border-width: 0 0 2px 2px;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        color: inherit;
        margin-top: 5px;
        margin-left: 7px;
    }
    .goToItemOccurences{
        position: absolute !important;
        width: 13px !important;
        right: 13px;
        margin-top: 14px;
        color: #666666 !important;
        display: block;
        width: 13px;
        height: 13px;
        border: solid;
        border-width: 0 0 2px 2px;
        transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(225deg);
        position: absolute;
    }
    .taskItemRepeatText{
        display: block;
        margin-top: -10px;
        font-size: 17px;
        line-height: 25px;
        color: #CCC;
    }
.accountDeleteFooter{
    padding-bottom: 45px !important;
}
.accountDelete .scrollView{
   background: #e8e8e8 !important;
}
.accountDelete .scrollView .persistentEmptyPanelMsg p{
    margin: 20px;
    line-height: 26px;
}
.accountDelete .scrollView .persistentEmptyPanelMsg p.title{
    /*font-size: 18px;*/ font-size: 16px;
}
.accountDelete .emailPhoneHightlight{
    font-weight: bold !important;
}
.accountDeleteButton{
    background: #e86c6c;
    text-align: center;
    display: block;
    color: #fff;
    font-family:Gotham;
}
.accountLogoutButton {
    background: #53c8e6;
    display: block;
    text-align: center;
    color: #fff;
    font-family:Gotham;
}
.accountDelete .postOptions button{
    margin-top: -1px;
    text-shadow: rgb(255, 255, 255) 0px 1px 0px;
    overflow: visible;
    width: 100%;
    float: left;
    height: 38px;
    border: none;
    font-size: 17px;
    color: #666;
    text-align: center !important;
    margin-top:-8px;
}
.accountDelete .postOptions li:last-of-type button{
    font-weight: bold;
}
.accountDelete .formLayout section .editableElement,
.accountDelete .reasonText{
    margin-left: 85px;
}
    .accountDelete .formLayout section input {
        margin-left: 55px;
    }
    .accountDelete .formLayout section .editableElement{
        width: 80%;
    }
.accountDeleteModal article{
    background: transparent;
    border: none;
    box-shadow: none;
    height: 120px;
}
    .accountDeleteModal article a{
        color: #53c8e6;
        text-decoration: underline;
    }
.accountDeleteModalConfirm article{
    height: 190px;
}
.accountDeleteModalConfirm.userHasGroups article{
    height: 245px;
}

.accountDeleteModal article h2{
    overflow: initial;
}

#orgSettings .postOptions{
    display: none;
}
#orgSettings .membersManager .postOptions{
    display: block;
}
.behaviorSelectTheme img{
    display: block;
    width: 100%;
    max-width:256px;
}
.iPhone .contentEventRepeatCommunity .inputGroupDiv:first-of-type{
    padding-top:50px;
}
#photoOptionsDiv .download a, .listEditControls .download a{
    width: 56px;
}
.extraMarginRsvp{
    margin-left: 15px;
}
.signUpButtonDisabled{
    color:#CCC;
}
.noficationsDisabled{
    position: absolute;
    z-index: 10000;
}
.noficationsDisabled.bloomzNotification p:before{
    display: none;
}
.noficationsDisabled.bloomzNotification p{
    padding-left: 10px;
}
.bulkImportText{
    padding: 20px 12px;
    line-height: 24px;
}
.bulkImportImageHeader{
    text-align: center;
}
.bulkImportImageHeader img{
    margin-top: 10px;
    margin-bottom: -4px;
}
.contentLinkClassId .bulkImportImageHeader{
    background: #63ada9;
}
.instructionStep .bulkImportImageHeader{
    background: #3e518f;
}
.bulkImportText h1{
    font-size: 19px;
    font-weight: bold;
}
.bulkImportText a{
    color: #53c8e6;
    text-decoration: underline;
    cursor: pointer;
}
.bulkImportText .tip,
.bulkImportText .required{
    color: red;
}
.bulkImportText .required{
    font-size: 12px;
    line-height: 10px;
}
.bulkImportText .divisor{
    width: 100%;
    height: 1px;
    background: #CCC;
    margin: -20px 0 20px 0;
}
.bulkImportDivisor{
    width: 95%;
    height: 1px;
    background: #CCC;
    margin: 10px auto 10px auto;
}
    .bulkImportLastUploaddedFiles {
        font-size: 14px;
        color: #999;
    }
.bulkImportButtons{
    padding:0 12px;
}
.bulkImportButtons .center{
    text-align: center !important;
}

.contentLinkClassId,
.bulkImportGetTemplates{
    width: 100%;
    background: #FFF;
    height: 100%;
}
.bulkImportGetTemplates .bulkImportText{
    width: 95%;
    margin:0 auto;
}
.bulkImportGetTemplates .radioButtonContent, .bulkImportGetTemplates .descriptionContent{
    display: inline-block;
    vertical-align: top;
}
    .bulkImportGetTemplates .radioButtonContent{
        width: 28px;
        cursor: pointer;
    }
    .bulkImportGetTemplates .descriptionContent{

    }
    .bulkImportGetTemplates .descriptionContent h2{
        font-size: 17px;
        font-weight: bold;
        line-height: 10px;
    }
    .bulkImportGetTemplates .descriptionContent p{
        font-size: 14px;
        line-height: 14px;
    }
.bulkImportText .optionGroup{
    display: block;
}
.bulkImportText .optionGroupBig{
    margin-bottom: 20px;
}
.descriptionContent .noLineHeight{
    line-height: 1.45 !important;
    margin-top: 0;
}
.bulkImportRadio{
    width: 16px;
    height: 16px;
    margin-top: 3px;
    left: 10px;
    top: 13px;
    border: 2px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
    .bulkImportRadio.selected{
        background-position: -214px -854px;
        border-color: #53c8e6;
    }
.bulkImportModal h2{
    font-size: 20px !important;
    height: 100px !important;
}
#bulkImport .bulkImportSuccess,
#bulkImport .bulkImportError{
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #01a53b;
    margin-bottom: 40px;
}
    #bulkImport .bulkImportError{
        color: #c03521;
    }
.bulkImportButtons .checked{
    width: 16px;
    height: 16px;
    margin-top: 3px;
    left: 10px;
    top: 13px;
    background-position: -470px -908px;
    display: inline-block;
    float: right;
}
.bulkImportAlertModal article{
    border: none;
    box-shadow: none;
}
.bulkImportButtons button,
.bulkImportButtons label.button,
.fullWidthBlueButton{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    border: 1px solid #2fc6fa;
    color: #fff;
    text-shadow: none;
    background: #2fc6fa;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    margin: 0 0 10px 0;
    text-align: left;
    width: 100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    white-space: nowrap;
    overflow: hidden;
    font-size: 16px;
    padding: 16px 12px;
}
#bulkImport .stepTransition{
    transition: all .5s ease !important;
}
#bulkImport .getTemplateStep,
#bulkImport .contentLinkClassId,
#bulkImport .instructionStep{
    position: absolute;
    margin-top: 100vh;
    opacity:0;
    filter:alpha(opacity=0);
}
#bulkImport .stepActive{
    margin-top: 0 !important;
    opacity:1;
    filter:alpha(opacity=100);
    overflow-x: hidden;
    overflow-y:auto;
    height:100% !important;
}

.bulkImportOverflowHidden{
    overflow: hidden !important;
}
#bulkImport .link{
    cursor: pointer;
    text-decoration: underline;
    color: #53c8e6;
}
#bulkImport .instructionStep{
    z-index: 100;
}
#bulkImport .getTemplateStep{
    z-index: 101;
}
#bulkImport .contentLinkClassId{
    z-index: 102;
}
.deviceType .bulkImportModal h2{
    font-size:14px !important;
}
.bulkImportModal h2{
    padding:10px;
}
.deviceType .bulkImportAlertButton{
    font-size: 16px !important;
}
.bulkImportErrorList{
    padding-left:10px;
    color: red;
}
.bulkImportSuccessList{
    padding-left:10px;
    color: green;
}
#addEventOptions .scrollView{
    background: rgb(232, 232, 232);
}
.fc-month-view .fc-event.tagNewEvent .fc-time{
    display:none;
}
#bloomzCalendarModalAddEvent{
    position: absolute;
    z-index: 9999;
}
    #bloomzCalendarModalAddEvent .bottomArrowContent,
    #bloomzCalendarModalAddEvent .topArrowContent,
    #bloomzCalendarModalAddEvent .leftArrowContent,
    #bloomzCalendarModalAddEvent .rightArrowContent{
        display: none;
    }
    #bloomzCalendarModalAddEvent .content{
        max-width:340px;
        background: #FFF;
        display:inline-block;
        border:1px solid #e4e5ed;
        border-radius: 5px;
    }
    #bloomzCalendarModalAddEvent.bottom .bottomArrowContent{
        display: block;
        margin-left: 150px;
        position: relative;
        margin-top: -25px;
    }
    #bloomzCalendarModalAddEvent.top .topArrowContent{
        display: block;
        margin-left: 150px;
        position: relative;
    }
    #bloomzCalendarModalAddEvent.left .leftArrowContent{
        display:inline-block;
    }
    #bloomzCalendarModalAddEvent.right .rightArrowContent{
        display:inline-block;
    }
    #bloomzCalendarModalAddEvent.threeItems .leftArrowContent,
    #bloomzCalendarModalAddEvent.threeItems .rightArrowContent{
        position: relative;
        top: -92px;
        left: 1px;
    }
        #bloomzCalendarModalAddEvent.twoItems .leftArrowContent,
        #bloomzCalendarModalAddEvent.twoItems .rightArrowContent{
            position: relative;
            top: -54px;
            left: 1px;
        }
        #bloomzCalendarModalAddEvent .rightArrowContent{
            left:-3px !important;
        }
        .bottomArrow{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 15px 0 15px;
            border-color: #FFF transparent transparent transparent;
            position: relative;
            z-index: 1;
            bottom: -18px;
        }
        .bottomArrowBackground{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 15px 0 15px;
            border-color: #e4e5ed transparent transparent transparent;
            position:relative;
        }
        .topArrow{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 15px 15px 15px;
            border-color: transparent transparent #FFF transparent;
            position: relative;
            z-index: 1;
            top: 22px;
        }
        .topArrowBackground{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 0 15px 15px 15px;
            border-color: transparent transparent #e4e5ed transparent;
            position:relative;
        }
        .leftArrow{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 15px 15px 0;
            border-color: transparent #FFF transparent transparent;
            position: relative;
            top: 30px;
            z-index: 1;
            left: 2px;
        }
        .leftArrowBackground{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 15px 15px 0;
            border-color: transparent #e4e5ed transparent transparent;
            position:relative;
        }
        .rightArrow{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 0 15px 15px;
            border-color: transparent transparent transparent #FFF;
            position:relative;
            top: 30px;
            z-index: 1;
        }
        .rightArrowBackground{
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 15px 0 15px 15px;
            border-color: transparent transparent transparent #e4e5ed;
            position:relative;
            left:2px;
        }
#bloomzCalendarModalAddEvent .calendarAddEvent li:last-of-type{
    border-bottom:none;
}
#bloomzCalendarModalAddEvent .calendarAddEvent li{
    margin-left:-9px;
}
.calendarAddEvent ul li:after{
    margin-left:-22px;
    margin-top: 9px;
}
.calendarAddEvent li{
    text-indent: 49px;
}
.calendarAddEvent li span{
    padding-left: 49px;
}
#signupData .footer{
    margin: 55px auto 0 auto;
}
.Desktop #signupData .footer{
    margin: 25px auto 0 auto;
}
.rzslider .rz-pointer{
    -webkit-box-shadow: 0px 1px 3px 0px rgba(50, 50, 50, 0.85);
    -moz-box-shadow: 0px 1px 3px 0px rgba(50, 50, 50, 0.85);
    box-shadow: 0px 1px 3px 0px rgba(50, 50, 50, 0.85);
    background: #FFF !important;
}
.rzslider .rz-bubble{
    display: none !important;
}
.tileSize .rzslider .rz-bar.rz-selection{
    background: #0db9f0 !important;
}
.tileSize .rzslider .rz-bar-wrapper{
    visibility: visible !important;
}
.tileSize .rzslider .rz-bar{
    background: #d8e0f3;
}
.rzslider .rz-selection{

}
.rzslider .rz-pointer.rz-active:after{
    background: #FFF !important;
}
.communitySettingsSlider{
    width: 200px;
    float: right;
    position: absolute;
    right: 17px;
    top: -13px;
}
.postUpgradeToEnterCaptionMessage{
    font-size: 15px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #999 !important;
    margin-top: -10px !important;
}
.actionSheetHighLight{
    color: #e86c6c;
    font-size: 10px !important;
    margin: -3px 0px 0 5px;
    cursor: pointer;
    vertical-align: super;
}

#communityEngagementCard .subPage,
.communityEngagementContent .scrollView{
    background: #e8e8e8 !important;
}
.communityEngagementContent .options{
    float: right;
    color: #1ca0c8;
    text-decoration: underline;
    font-size: 15px;
    cursor: pointer;
}

@media screen and (min-width: 768px){
    .communityEngagementContent .loadMoreEntries{
        margin-top:-50px !important;
    }
}
.communityEngagementContent .rangeSortWrapper,
.communityEngagementContent .report{
    margin:16px 10px 10px 10px;
}
.hideSidePanel .communityEngagementContent .rangeSortWrapper,
.hideSidePanel .communityEngagementContent .report{
    /*margin:40px 10px 0 10px !important;*/
}

    .communityEngagementContent .rangeSortWrapper .altDatePicker{
        font-size:15px;
    }
    .communityEngagementContent .rangeSortWrapper .sortOption{
        float: right;
        color: #1ca0c8;
        text-decoration: underline;
    }
    .communityEngagementContent .report{
        margin-top:10px;
    }
    .communityEngagementContent .report .title{
        background: #00a1d4;
        /*font-size: 18px;*/ font-size: 16px;
        color: #FFF;
        padding:8px 10px;
        text-shadow:none;
        font-weight: bold;
        border-top: 1px solid #e4e5ed;
        border-right: 1px solid #e4e5ed;
        -moz-border-radius-topleft: 4px;
        -webkit-border-radius-topleft: 4px;
        border-top-left-radius: 4px;
        -moz-border-radius-topright: 4px;
        -webkit-border-radius-topright: 4px;
        border-top-right-radius: 4px;
    }

    .communityEngagementContent h3{
        font-weight:  bold !important;
        /*font-size: 18px;*/ font-size: 16px;
        color: #000;
    }

    .communityEngagementContent .totalActivity{
        font-size: 14px;
        color: #666;
        vertical-align: bottom;
    }
    .communityEngagementContent{
        white-space: nowrap;
    }
    .communityEngagementContent li{
        white-space: initial !important;
    }
    .shadowBox .communityEngagementContent{
        padding:10px;
    }
    .communityEngagementContent .rotate{
        height: 138px;
        white-space: nowrap;
        width: 10%;
        vertical-align: bottom;
        font-size: 14px;
        text-align: center;
        position:relative;
    }
    .communityEngagementContent .rotate div{
        transform: translate(0, 0) rotate(90deg);
        transform-origin: right;
        position: absolute;
        font-weight:bold !important;
        right:50%;
        margin-left: 4px;
    }
    .communityEngagementContent .posts div{
        color: #6ebb2b;
    }
    .communityEngagementContent .media div{
        color: #ffa52b;
    }
    .communityEngagementContent .events div{
        color: #3ec8d6;
    }
    .communityEngagementContent .awards div{
        color: #fdc044;
    }
    .communityEngagementContent .activities div{
        color: #fdc044;
    }
    .communityEngagementContent .awardsActivities div{
        color: #fdc044;
    }
    .communityEngagementContent .portfolio div{
        color: #3853c7;
    }
    .communityEngagementContent .conferences div{
        color: #e56860;
    }
    .communityEngagementContent .voluntereed div{
        color: #fd96b8;
    }
    .communityEngagementContent .likesComments div{
        color: #ff5888;
    }
    .communityEngagementContent .messages div{
        color: #2f97dd;
    }
    .communityEngagementContent .loadMoreEntries{
        z-index: 10001;
        margin-top: -50px;
        margin-left: 0;
        position: absolute;
        left: 0;
    }
    .communityEngagementContent .tableContainer {
        padding:0;
        border: 1px solid #e4e5ed;
        border-bottom: 1px solid #e4e5ed;
        border-right: 1px solid #e4e5ed;
        margin-bottom: 10px;
        position: relative;
        box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-top: 1px solid #e4e5ed;
        -moz-border-radius-bottomleft: 4px;
        -webkit-border-radius-bottomleft: 4px;
        border-bottom-left-radius: 4px;
        -moz-border-radius-bottomright: 4px;
        -webkit-border-radius-bottomright: 4px;
        border-bottom-right-radius: 4px;
        border-top: none !important;
        overflow:auto;
    }
    .communityEngagementContent .upgradeMessage {
        text-align:center;
        padding:15px;
        background:#FFF;
        -moz-border-radius-bottomleft: 4px;
        -webkit-border-radius-bottomleft: 4px;
        border-bottom-left-radius: 4px;
        -moz-border-radius-bottomright: 4px;
        -webkit-border-radius-bottomright: 4px;
        border-bottom-right-radius: 4px;
        white-space: initial !important;
    }
    .communityEngagementContent .upgradeMessage a {
        color: #53c8e6;
    }
    .communityEngagementContent table .engagement{
        vertical-align: bottom;
    }
    .communityEngagementContent table{
        border-spacing:0;
        border-collapse:collapse;
        background: #FFF;
    }
    .communityEngagementClassName{
        width: 130px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        display: block;
    }

    @media screen
    and (max-width:580px){
        .communityEngagementClassName{
            width: 90px !important;
        }
    }
    .communityEngagementContent table td,
    .communityEngagementContent table tr{
        padding:0;
    }
    .communityEngagementContent tr td:first-child{
        padding-left:20px !important;
    }
    .communityEngagementContent table {
        width: 100%;
    }
    .communityEngagementContent table thead td{
        padding:15px 0;
        border-bottom:2px solid #f1f1f1;
    }
    .communityEngagementContent tbody tr td{
        padding-top:10px !important;
        padding-bottom:10px !important;
        font-size: 12px;
        color: #5b5b5b;
        text-align:center;
        border-right:1px solid #f1f1f1;
        padding:0 5px;
        vertical-align:middle;
    }
    .communityEngagementContent tbody tr td:last-child{
        border-right: none !important;
    }
    .communityEngagementContent tbody tr:nth-child(odd) {
        background-color: #fafafa;
     }
    .communityEngagementContent tbody tr td.left{
        text-align: left;
        font-size: 14px;
        wrap:no-wrap;
    }
    .communityEngagementContent tbody tr td strong{
        color: #1d1d1d;
        font-weight:bold !important;
    }
    .communityEngagementContent tbody tr td strong.link{
        color: #75b2d0;
        cursor: pointer;
    }
    .communityEngagementContent tbody tr td span{
        color:#a8a8a8;
        display: block;
        font-size: 12px;
    }
.communityEngagementContent .reportFooter{
    font-size: 14px;
    margin: 10px 20px 0 20px;
    padding-bottom:30px;
}
    .communityEngagementContent .lastUpdate{
        color: #999999;
    }
    .communityEngagementContent .learnHowSavings{
        text-decoration: none !important;
        cursor: pointer;
        float: right;
    }
    .communityEngagementContent .learnHowSavings a{
        color: #52b2d0;
        text-decoration: none !important;
        border-bottom:1px solid #52b2d0;
    }
.communityEngagementCardWrapper{
    /*margin:10px !important;
    padding:10px;*/
}
.communityEngagementCard{
    background: #FFF;
    margin-top: 2px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 2px 3px rgba(37,37,37,0.1);
    border-radius: 5px;
    max-width: 500px;
    width: 100%;
    position:relative;
}
.communityEngagementContent .subPage .forceTruncate{
    width: 90%;
}
.communityEngagementContent .subPage .title.forceTruncate{
    width: auto !important;
}
.communityEngagementCard .info,
.communityEngagementCard .header{
    width: 100%;
}
.communityEngagementCard .info h3{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 60%;
    display: block;
}
    .communityEngagementCard .header{
        background-color: #3fcfee;
        height:88px;
    }
        .communityEngagementCard .header .image{
            width: 60px;
            height: 60px;
            display: inline-block;
            border: 2px solid #FFF;
            -webkit-border-radius: 100px;
            -moz-border-radius: 100px;
            border-radius: 100px;
            margin: 10px;
            overflow:hidden;
        }
        .communityEngagementCard .header .image .imageBg{
            width: 60px;
            height: 60px;
            background-size: cover !important;
        }
        .communityEngagementCard .header .info{
            display: inline-block;
            padding:10px;
            position:absolute;
            text-shadow: none;
            color: #FFF;
            margin-top:30px;
            font-size:18px;
            line-height:20px;
        }
        .communityEngagementCard .header .info h3{
            font-weight: bold !important;
            /*font-size: 18px;*/ font-size: 16px;
            color: #FFF !important;
        }
        .communityEngagementCard .header .info .teachers{
            white-space: initial !important;
            padding-right: 10px;
        }

    .communityEngagementCard .content{
        margin:-15px 10px 20px 10px;
    }
    .communityEngagementCard ul{
        clear: both;
        padding-top:20px;
    }
    .communityEngagementCard ul li{
        display:block;
        width:50%;
        float: left;
        line-height:28px;
        margin:0 !important;
    }

    @media screen
    and (max-width:768px){
        .communityEngagementCard ul{
            padding: 20px;
        }
    }
    .communityEngagementCard ul li .icon,
    .communityEngagementCard ul li .iconsprite{
        width: 10px;
        position: absolute;
        width: 26px;
        height: 19px;
        margin-top: 4px;
    }
    .communityEngagementCard ul li .total{
        display: inline-block;
        width: 26px;
        text-align: right;
    }

    .communityEngagementCard .cardWrapper,
    .communityEngagementCard ul li .icon{
        background-image:url(https://d374ttv1tjyiv3.cloudfront.net/api/v3/photo/3e9df52c-4e5d-4df6-8f80-5ba5b599586c);
        background-size:96px 96px;
    }
    .communityEngagementCard .cardWrapper{
        width: 12px;
        height: 32px;
        background-position: -73px -65px;
        position: absolute;
        display: block;
        right: 25px;
        margin-top: -5px;
    }
    .communityEngagementCard ul li.posts .icon{background-position:-2px -6px;}
    .communityEngagementCard ul li.posts .label{color:#60b517;}

    .communityEngagementCard ul li.volunteers .icon{
        background-position: -36px -6px;
        zoom: 1.1;
    }
    .communityEngagementCard ul li.volunteers .label{color:#fc82ab;}

    .communityEngagementCard ul li.events .icon{
        background-position: -3px -38px;
        margin-top: 3px;
        zoom: 1.1;
    }
    .communityEngagementCard ul li.events .label{color:#19becd;}

    .communityEngagementCard ul li.medias .icon{background-position:-33px -37px;}
    .communityEngagementCard ul li.medias .label{color:#ff9b12;}

    .communityEngagementCard ul li.conferences .icon{background-position:-4px -69px;}
    .communityEngagementCard ul li.conferences .label{color:#df4c43;}

    .communityEngagementCard ul li.likesComments .icon{
        background-position: -36px -70px;
        zoom: 1.05;
    }
    .communityEngagementCard ul li.likesComments .label{color:#ff4f81; width:96px;}

    .communityEngagementCard ul li.awards .iconsprite{
        background-position: 0px -1553px;
        margin-top: -2px !important;
        zoom: 1.4;
        margin-left: -5px;
    }
    .communityEngagementCard ul li.awards .label{color:#fdb82c;}


    .communityEngagementCard ul li.messages .iconsprite{
        margin-top: -2px !important;
        margin-left: -3px;
        background-position: -132px -1498px;
        zoom: .7;
        width: 50px;
        height: 40px;
    }
    .communityEngagementCard ul li.messages .label{color:#2f97dd;}

    .communityEngagementCard ul li.portfolios .iconsprite{
        background-position: -642px -1558px;
        zoom: 1.3;
    }

    .communityEngagementCard ul li.portfolios .label{color: #3c4ec9;}

    .communityEngagementCard ul li .label{
        font-size:14px;
        font-weight: normal;
        text-indent: 30px;
        display: inline-block;
    }
    .communityEngagementCard ul li:nth-child(2):after {
         clear: both;
    }
        .clear{
            clear: both;
        }
    .communityEngagementCard .content{
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }
    .communityEngagementCard .hours{
        text-align: center;
        display: block;
        padding: 20px 0 !important;
        border: none;
        border-bottom: none !important;
        border-top: 1px solid #CCC;
        margin: 20px !important;
        color: #666;
    }
    .communityEngagementCard .hours .label{
        font-size: 12px;
        line-height: 20px;
    }
    .communityEngagementCard .hours .time{
        font-weight: bold;
        font-size: 20px;
    }
    .communityEngagementContent .message{
        margin: 40px;
        text-align: center;
        font-size: 14px;
    }
.communityEngagementCardSchoolLabel{
    background: #F5F5F5 !important;
}
.communityEngagementCardSchoolLabel td{
    font-weight: bold;
    background: #F5F5F5 !important;
    text-align: left !important;
    font-size: 15px !important;
    font-weight: bolder !important;
    border: 1px solid #e4e5ed !important;
    color: #333 !important;
}
#composeEmail .inlineRecipientListing .recipients{
    padding-left: 10px;
}
#composeEmail .recipientPickerCtrl.labelTop.modeAddPeople.bulkImpt .circlesBox{
    padding-right: 0 !important;
}

#composeEmail .recipientPickerCtrl.labelTop .recipientsListLabel{
    width: 100% !important;
}
#composeEmail .formLayout.clean{
    box-shadow:none !important;
    border :none !important;
}
.iPhone .mobileMarginTop{
    margin-top: 35px;
}
.iPhone #composeEmail .inviteSubject{
    padding:0 10px;
}
#composeEmail .emailImage{
    margin: 20px;
    max-width:100%;
}
.iPhone #composeEmail .emailImage{
    text-align: center;
}
.loadMoreEntriesPlaceholder{
    height: 60px;
}
.composeEmailImageShared{
    width:90%;
}
.calendarPickerPhoto{
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    /*-moz-border-radius-topright:0;
    -webkit-border-radius-topright:0;
    border-top-right-radius:0;*/
    height: 40px;
    width: 40px;
    background-size: cover !important;
    float: left;
    margin-right: 10px;
    cursor:pointer;
}
.calendarPickerName{
    margin-top:11px !important;
    cursor:pointer;
}
.fc-ltr .fc-time-grid .fc-event-container{
    margin-right:10% !important;
}
.loadMoreEntriesCalendar{
    margin-top: -52px !important;
}
.noResize{
    resize: none !important;
}
.noOverflow{
    overflow: hidden !important;
}

#communitySettingsBehaviorTile{
    position: absolute;
    z-index: 9999;
    width: 110px;
}
#communitySettingsBehaviorTile .item{

}
#communitySettingsBehaviorTile .item .icon{
    width: 80px;
    height: 125px;
    background-size: cover;
}
#communitySettingsBehaviorTile .behaviorManagementItemName .behaviorManagementItemBadge > div{
    font-size:14px;
}
#communitySettingsBehaviorTile .behaviorManagementItemName .behaviorManagementItemName{
    font-size:14px;
}
    #communitySettingsBehaviorTile .behaviorManagementItemName .secondLine{
        font-size:13px;
        line-height:1.2;
    }

.responsiveMenuInline{
    margin: 20px 8px;
}
    .responsiveMenuInline ul{
        margin: 0;
        padding: 0;
        overflow: hidden;
        height:35px;
    }
        .responsiveMenuInline ul li{
            display: inline-block;
            padding:0 8px;
            margin:0;
            list-style: none;
            color: #53c8e6;
            cursor: pointer;
            text-decoration: underline;
            font-size: 14px;
            font-weight:bold;
            line-height:30px;
            text-align: center;
        }
        .safari .responsiveMenuInline ul li{
            padding: 0 10px;
        }
        .responsiveMenuFloat ul li div span,
        .responsiveMenuInline ul li div span{
            display: inline-block;
            font-weight: bold;
        }

.responsiveMenuInline ul li,
.responsiveMenuFloat ul li{
    cursor:pointer;
}
.behaviorInlineMenu .responsiveMenuFloat span.icon,
.behaviorInlineMenu .responsiveMenuInline span.icon{
    width: 22px;
    height: 20px;
    margin-right: 2px;
}

.behaviorInlineMenu .responsiveMenuFloat span.icon{
    margin-right: 3px !important;
}
.behaviorInlineMenu .responsiveMenuFloat .title{
    font-size: 14px;
    font-weight: bold !important;
}
.responsiveMenuFloat{
    background: #fff;
    position: absolute;
    z-index: 100;
    width:170px;
    border: 1px solid #b3b3b3;
    margin-top: -15px;
    -webkit-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
}
    .hideResponsiveFloatMenu{
        margin-top:-99999px;
    }
    .responsiveMenuFloatArrow{
        background: #fff;
        width: 15px;
        height: 15px;
        display: block;
        -moz-border-radius: 20px 0 0 0;
        -webkit-border-radius: 20px 0 0 0;
        border-radius: 20px 0 0 0;
        transform: rotate(225deg);
        -webkit-transform: rotate(225deg);
        position: absolute;
        bottom: 58px;
        left: auto;
        right: 23px;
        z-index: 1;
        box-shadow: 4px 4px 8px rgba(0, 0, 0, .25);
        border: solid rgba(100, 100, 100, .4);
        border-width: 0 1px 1px 0;
        position:absolute;
        top: -9px;
    }

    .responsiveMenuFloat ul{
        margin: 15px;
        padding: 0;
    }
        .responsiveMenuFloat ul li {
            list-style: none;
            margin: 10px 0;
            line-height:20px;
        }
.Android .responsiveMenuInline ul li.behaviorManagementFullscreen,
.WindowsPhone .responsiveMenuInline ul li.behaviorManagementFullscreen,
.iPad .responsiveMenuInline ul li.behaviorManagementFullscreen,
.iPhone .responsiveMenuInline ul li.behaviorManagementFullscreen,
.appFullScreen .responsiveMenuInline ul li.behaviorManagementFullscreen{
    display:none !important;
}
.upgradePage .emptyPanelMsg{
    margin: 30px 20px;
    color: #333;
}
.upgradePage .center{
    text-align: center;
}
.upgradePage .emptyPanelMsg h2{
    font-size: 21px;
    line-height: 31px;
    color: #333 !important;
    font-weight: bold;
}
.chatPanel * {
    -webkit-user-select: text !important;  /* Chrome 49+ */
    -moz-user-select: text !important;     /* Firefox 43+ */
    -ms-user-select: text !important;      /* No support yet */
    user-select: text !important;          /* Likely future */
}

.readMoreLessContainer, .readMoreLessContainer *
.readMoreLess * {
    line-height: 20px !important;
}
.readMoreLessContent.crop {
    overflow: hidden;
}
.readMoreLessContainer{
    position: absolute;
    margin-left: -99999px;
    top: -9999999px;
    z-index: -10000;
}
.readMoreLessLink{
    cursor:pointer;
    color: #1ca0c8;
    font-size:13px;
    font-family:Gotham, Verdana, HelveticaNeue-Light, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, sans-serif;
}
.readMoreLessLink:after{
    content: "\0000a0\00b7\0000a0";
    color: #1ca0c8;
}
.hideDot .readMoreLessLink:after{
    content: '' !important;
}
.photoPickerHidden{
    position: absolute;
    margin-left: -99999px;
    top: -9999999px;
    z-index: -10000;
}
.recipientPickerHideSelect .hgroup .selectButton{
    display: none;
}
.recipientPickerHideSelect .hgroup .groupSignature{
    /*text-indent: 107px !important;*/
}
.recipientPickerHideSelect .hgroup{
    /*margin-left: -30px !important;*/
}
.signupsWrapper{
    margin-top: 10px;
}
.timelines .peopleListing{
    display: block !important;
}
@media screen and (min-width: 768px){
    .timelines.contentArea{
        /*margin-left: 257px !important;
        margin-right: 248px !important;*/
    }
    .hideSidePanel .mainPanel .timelines.contentArea {
        margin-right: 0 !important;
        padding-right: 0;
    }
}
@media screen and (max-width: 768px){
    .timelines.contentArea{
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
.mainPanelSearchBar{
    /*margin-top: -10px !important;*/
    padding-top: 0 !important;
    position:relative;
}
.mainBadge{
    text-indent: 0 !important;
    text-align: center;
    text-indent: 0 !important;
    min-width: 12px;
    display: block;
    height: 18px;
    padding: 0 3px;
    color: #fff;
    position: absolute;
    top: 4px;
    font-size: 12px;
    line-height: 20px;
    text-shadow: none;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    box-shadow: inset 0px -1px 0px rgba(0,0,0,.1);
    background: #ff0204;
    z-index: 1000;
    left: 5px;
}
.themeColor .color{
    width: 25%;
    display: inline-block;
    height: 40px;
}
.themeColor .content, .themeColor .content table{
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
    border: none;
    border-spacing: 0;
    border-collapse: collapse;
}
.themeColor .content table tr,
.themeColor .content table tr td{
    padding: 0;
    margin: 0;
    border: none;
    cursor: pointer;
}
.mainPanelBehavior article footer li{
    width: 33.333333% !important;
    padding: 0 !important;
    text-align: center !important;
    font-weight:500;
}
    .mainPanelBehavior .infoWrapper,
    .mainPanelBehavior .imageWrapper{
        display: inline-block;
        vertical-align:top;
        min-height: 90px;
    }
    .extraPaddingTop h1{
        padding-top: 40px !important;
    }
    .mainPanelBehavior .imageWrapper{
        width: 70px;
        margin-top: 20px;
    }
        .mainPanelBehavior .imageWrapper .avatar{
            background-size: cover !important;
            -moz-border-radius:100px;
            -webkit-border-radius:100px;
            border-radius:100px;
            overflow: hidden;
            border: 1px solid #CCC;
            width: 55px;
            height: 55px;
        }
        .mainPanelBehavior .infoWrapper h2{
            font-size: 16px;
            height: 40px;
            overflow: hidden;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            display: inline-block;
            text-overflow: ellipsis;
            font-weight: bolder !important;
        }
        .mainPanelBehavior .infoWrapper ul{
            list-style: none;
            margin: 0;
            padding: 0;
        }
        .mainPanelBehavior .infoWrapper ul li{
            line-height: 21px;
            font-size: 16px;
        }
        .mainPanelBehavior .infoWrapper ul li span{
            color: #b1b1b1;
        }
.mainPanelBehavior .childrenList{
    background: #fff;
    border: 1px solid #e4e5ed;
    border-bottom: 1px solid #e4e5ed;
    position: relative;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 0;
    margin-top: -1px;
    padding: 0;
    -moz-border-radius:4px 4px 0 0;
    -webkit-border-radius:4px 4px 0 0;
    border-radius:4px 4px 0 0;
    overflow:hidden;
    width:100%;
}
.mainPanelBehavior .childrenList:last-of-type{
    -moz-border-radius:0 0 4px 4px;
    -webkit-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
}
.mainPanelBehavior .childrenList .studentAwardsSummary .summaryBox .data{
    /*padding-left:0;*/
}
.mainPanelBehavior .childrenList .studentAwardsSummary .summaryBox .data ul li{
    text-transform: none;
}

#postViewContainer .documentPost .postContentWrapper{
    margin-top: 25px;
}
.documentPost .postContentWrapper{
    background: #fafafa;
    border: 1px solid #efefef;
    margin: 0 0 40px 0;
    padding: 5px 20px 20px 20px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.documentPost .postContentWrapper .postTitle{
    margin-bottom: 15px;
}
.documentPost .postContentWrapper .metaInfo{
    display: none;
}
.responsiveMenuInline{
    margin: 20px 8px;
}
.responsiveMenuInline ul{
    margin: 0;
    padding: 0;
    overflow: hidden;
    height:35px;
    text-align:right;
}
.responsiveMenuInline ul li{
    display: inline-block;
    padding:0 8px;
    margin:0;
    list-style: none;
    color: #53c8e6;
    cursor: pointer;
    text-decoration: underline;
    font-size: 14px;
    font-weight:500;
    line-height:30px;
    text-align: center;
}
.safari .responsiveMenuInline ul li{
    padding: 0 10px;
}
.responsiveMenuFloat ul li div span,
.responsiveMenuInline ul li div span{
    display: inline-block;
}
.responsiveMenuInline ul li,
.responsiveMenuFloat ul li{
    cursor:pointer;
}
.behaviorInlineMenu .responsiveMenuFloat span.icon,
.behaviorInlineMenu .responsiveMenuInline span.icon{
    width: 22px;
    height: 20px;
    margin-right: 2px;
    margin-bottom:-2px;
}

.behaviorInlineMenu .responsiveMenuInline .behaviorManagementUndo span.icon{ background-position: -21px -2017px; width: 20px; zoom:.9}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementSelect span.icon{ background-position: -53px -2016px; zoom:.9;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementTeams span.icon{ background-position: -85px -2016px; zoom: .9; width: 23px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementStudents span.icon{ background-position: -85px -2016px; zoom: .9; width: 23px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementReports span.icon{ background-position: -216px -2018px; zoom: .9; width: 16px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementClassGoal span.icon{ background-position: -153px -2018px; width: 16px; zoom: .9;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementReset span.icon{ background-position: -185px -2018px; zoom: .9; width: 15px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementFullscreen span.icon{ background-position: -308px -2017px; width: 20px; zoom: .9}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementAttendance span.icon{ background-position: -120px -2018px; zoom: .9; width: 16px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementAllPresent span.icon{ background-position: -245px -2020px; zoom: .8}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementCheckin span.icon{ background-position: -245px -2020px; zoom: .8}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementAllAbsent span.icon{ background-position: -276px -2020px; zoom: .8}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementCheckout span.icon{ background-position: -276px -2020px; zoom: .8}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementViewAsGrid span.icon{ background-position: -344px -2017px; width: 16px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementViewAsList span.icon{ background-position: -344px -2017px; width: 16px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementPrintPage span.icon{ background-position: -377px -2017px; width: 15px;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementSelectAll span.icon{ background-position: -53px -2016px;  zoom:.9;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementUnselectAll span.icon{ background-position: -53px -2016px;  zoom:.9;}
.behaviorInlineMenu .responsiveMenuInline .behaviorManagementSettings span.icon{ background-position: -408px -2019px;  zoom:.9;width: 22px;}

.behaviorInlineMenu .responsiveMenuFloat span.icon{
    margin-right: 3px !important;
}
.behaviorInlineMenu .responsiveMenuFloat .title{
    font-size: 14px;
    font-weight: bold !important;
}

.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementUndo span.icon{ background-position: -21px -2076px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementSelect span.icon{ background-position: -54px -2076px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementTeams span.icon{ background-position: -85px -2076px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementStudents span.icon{ background-position: -85px -2076px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementReports span.icon{ background-position: -212px -2078px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementClassGoal span.icon{ background-position: -150px -2078px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementReset span.icon{ background-position: -181px -2078px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementSettings span.icon{ background-position: -408px -2079px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementFullscreen span.icon{ background-position: -310px -2077px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementAttendance span.icon{ background-position: -116px -2078px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementAllPresent span.icon{ background-position: -245px -2080px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementCheckin span.icon{ background-position: -245px -2080px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementAllAbsent span.icon{ background-position: -276px -2080px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementCheckout span.icon{ background-position: -276px -2080px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementViewAsGrid span.icon{ background-position: -344px -2077px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementViewAsList span.icon{ background-position: -344px -2077px; }
.behaviorInlineMenu .responsiveMenuFloat .behaviorManagementPrintPage span.icon{ background-position: -378px -2077px; }

.responsiveMenuFloat{
    background: #fff;
    position: absolute;
    z-index: 100;
    width:170px;
    border: 1px solid #b3b3b3;
    margin-top: -15px;
    -webkit-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.25);
}
    .hideResponsiveFloatMenu{
        margin-top:-99999px;
    }
    .responsiveMenuFloatArrow{
        background: #fff;
        width: 15px;
        height: 15px;
        display: block;
        -moz-border-radius: 20px 0 0 0;
        -webkit-border-radius: 20px 0 0 0;
        border-radius: 20px 0 0 0;
        transform: rotate(225deg);
        -webkit-transform: rotate(225deg);
        position: absolute;
        bottom: 58px;
        left: auto;
        right: 23px;
        z-index: 1;
        box-shadow: 4px 4px 8px rgba(0, 0, 0, .25);
        border: solid rgba(100, 100, 100, .4);
        border-width: 0 1px 1px 0;
        position:absolute;
        top: -9px;
    }

    .responsiveMenuFloat ul{
        margin: 15px;
        padding: 0;
    }
        .responsiveMenuFloat ul li {
            list-style: none;
            margin: 10px 0;
            line-height:20px;
        }
.Android .responsiveMenuInline ul li.behaviorManagementFullscreen,
.WindowsPhone .responsiveMenuInline ul li.behaviorManagementFullscreen,
.iPad .responsiveMenuInline ul li.behaviorManagementFullscreen,
.iPhone .responsiveMenuInline ul li.behaviorManagementFullscreen,
.appFullScreen .responsiveMenuInline ul li.behaviorManagementFullscreen{
    display:none !important;
}
.subPageInline .scrollView{
    background: #e8e8e8;
}

@media screen and (min-width:768px){
    /*.subPageInline h1{
        padding: 19px 288px 4px 278px !important;
    }
    .subPageInline .nextButton{
        right: 273px !important;
        top: 12px;
    }*/
}
.appFullScreen .subPageInline .nextButton{
    right: 0 !important;
}
.appFullScreen .inlineBox .actionBar:after{
    display: none !important;
}
#behaviorManagementTrack .responsiveMenuInline ul{
    margin-top:30px;
}
#behaviorManagementTrack .actionBar h1 .forceTruncate{
    margin: 0 100px 0 25px;
    padding: 0 !important;
}
@media screen and (max-width: 767px){
    #behaviorManagementTrack .actionBar h1 .forceTruncate{
        margin: 0 50px 0 5px;
    }
}
@media screen and (min-width: 768px){
    #myContacts .formLayout.resultsListing{
        margin-top: 25px !important;
    }
}
#myContacts .scrollView{
    background: #e8e8e8;
}
#communityMembersView .inlineToolTip{
    position:static;
}
@media screen and (max-width: 767px){
    #communityMembersView .inlineToolTip {
        position: absolute !important;
        z-index:1000;
        min-height: 45px;
    }
    #communityMembersView .recipientPickerCtrl.modeHideTabsAndRecipients .actionBar{
        margin-top:22px !important;
    }
    #communityMembersView .membersContainer{
        margin-top: 115px !important;
    }
    #communityMembersView .inviteCircles.searchMode{
        margin-top: 115px;
    }
    #communityMembersView .requestedMembers{
        margin-top: 160px;
        margin-bottom:-100px;
    }
}
@media screen and (max-width: 1023px) and (min-width: 768px) {
    #communityMembersView .inlineToolTip{
        margin-top:10px !important;
    }
    #communityMembersView .recipientPickerCtrl.modeHideTabsAndRecipients .actionBar{
        margin-top: 80px;
        min-height: 45px;
    }
}

#communityMembersView .recipientPickerCtrl{
    background: #e8e8e8;
}
#communityMembersView .peopleListing .groupedListing .verticalList .profileWithChildren h3,
#communityMembersView .peopleListing .profileWithChildren h4{
    text-indent: 95px !important;
}
#communityMembersView .requestedMembers{
    margin-top: 60px;
}
.hideSidePanel #_demoClass .activeCtrl:before,
.hideSidePanel .currentDemoClass #notificationCenterIcon,
.hideSidePanel .currentDemoClass #messageTrayIcon{
    display: none !important;
}
.mainPanelTimeline .formLayout h1{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size: 17px;
    font-weight: 500;
    padding-top: 15px;
    margin-bottom: 5px;
    margin-top: 0;
    background: #e8e8e8;
}
.studentPortfolioList{
    cursor:pointer;
    padding-left: 10px !important;
    padding-right: 10px !important;
    min-height: 60px !important;
}
.studentPortfolioList .imageWrapper,.studentPortfolioList .infoWrapper{
    display:inline-block;
}

.studentPortfolioList .imageWrapper{
    width: 75px;
    height: 75px;
    margin-right: 10px;
}
.studentPortfolioList .imageWrapper .image{
    width: 70px;
    height: 70px;
    background-size: cover !important;
    border: 1px solid #e4e5ed;
    background:url(../images/portfolioPlaceholder.png);
    border-radius:50%;
}
.studentPortfolioList .infoWrapper{
    width: auto;
    color: #8e8e8e;
    font-size: 14px;
    line-height: 20px;
    vertical-align: top;
    margin-top:10px;
}
.studentPortfolioList .infoWrapper .studentName{
    font-weight: 500;
    font-size: 16px;
    color: #000;
}
.whiteBackground .contentArea{
    background: #FFF !important;
}
.behaviorStudentFeed{
    margin-top: 40px;
}
.mainPanelBehavior .behaviorStudentFeed .studentAwardsSummary .charInfo{
    margin-top: 20px;
    width: 100px;
}
.mainPanelBehavior .behaviorStudentFeed .studentAwardsSummary .charInfo .charInfoDescription{
    margin-top: 0px !important;
}
.mainPanelBehavior .loadMoreEntries{
    margin-top: -10px !important;
    margin-left: -10px;
    position: absolute !important;
}
.mainPanelBehavior .studentRangePicker{
    text-align: right;
    margin-top: -22px !important;
    color: #53c8e6;
    text-decoration: underline;
    font-size: 14px;
    width: calc(100% - 10px);
    margin-left: 0 !important;
    margin-right: 35px !important
}
.mainPanelBehavior .studentRangePicker .rangePicker{
    width: 150px;
    float: right;
    text-decoration: underline !important;
}
.mainPanelBehavior .studentRangePicker .datePicker span {
    white-space: nowrap;
 }
 .mainPanelBehavior .studentRangePicker .datePicker .icon{
     display: none;
 }
 .outsideMessagesLink{
     /*background: #f2f2f2 !important;*/
     padding:16px 8px !important;
     text-align:left;
     font-size:14px;
 }
 .outsideMessagesLink, .outsideMessagesLinkCollapse{
    color: #53c8e6;
    text-decoration: underline;
    cursor:pointer;
}
.outsideMessagesLinkCollapse{
    font-size: 13px;
    position: absolute;
    right: 8px;
    margin-top: 18px;
}
.outsideMessagesList{
    background: #fff !important;
    cursor:default;
}




.messages article.outsideMessagesList + article:not(.outsideMessagesList):after{
    left:0;
    border-top:0;
    border-bottom:1px solid rgba(0,0,0,.3);
    box-shadow:0 -2px 12px rgba(0,0,0,.5);
}



@media screen and (max-width: 767px){
    .outsideMessagesLink{
        background: #373842 !important;
        padding:0 !important;
        text-decoration: none !important;
    }
    .outsideMessagesLink .wrapper{
        background: #51535b;
        width: 80%;
        display: block;
        margin: 10px auto;
        padding: 10px;
        text-align: center;
        color: #FFF;
        text-decoration: none;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        text-shadow: 0 1px 3px rgba(0,0,0,1);
        box-shadow: 1px 2px 0px rgba(0,0,0,.1);

    }
    .hasNotification .wrapper{
        padding-bottom: 15px;
    }
    .outsideMessagesList {
        background: #51535b !important;
    }
}
.outsideMessagesLink span.notification{
    display: none;
}
.outsideMessagesLink.hasNotification span.notification{
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #4bc1e6;
    margin-top: 12px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    margin-right: 4px;
}

.chatScrollWrapper *,
.postView *{
    -webkit-touch-callout: text !important;
    -webkit-user-select: text !important;
     -khtml-user-select: text !important;
       -moz-user-select: text !important;
        -ms-user-select: text !important;
            user-select: text !important;
}

.allGroupsTitle{
    position: relative;
    z-index: 1000;
    margin-top: -100px;
    font-size: 20px;
    line-height: 16px;
    color:#53c8e6;
    color: #212121;
    width: 100%;
    text-align: left;
    padding-left: 315px;
    margin-bottom: 100px;
    font-weight: bold;
    font-family: gotham;
}

@media screen and (min-width: 768px){
    .mainPanel .timelines .contentArea{
        margin-right:0 !important;
    }
}
.documentPostTitle{
    margin: 10px 0;
    font-weight: bold;
    font-size: 16px;
    color: #000;
    display: none;
}
.documentPost .documentPostTitle{
    display: block;
}

.sortByTimeline{
    font-size: 14px;
    z-index: 1000;
    padding-right: 10px;
    float: right;
    color: #53c8e6;
    text-decoration: underline;
    cursor:pointer;
}
@media screen and (min-width: 768px){
    .hideMainNav{
        display: none !important;
    }
}

.mainPanelBehavior .persistentEmptyPanelMsg h2 {
    background: transparent !important;
}

#mainPanel .forModeMainPanel{
    margin-top:48px !important;

    margin-top: 0 !important;
    position: relative;
    left: 0;
    right: 0;
    top: 0;
    margin-bottom: 10px;
    border-bottom:0;
}

#notificationCenter .postVerificationRequestEntry .tags.tagSystem{
    margin-left: 3px;
    margin-top: 3px;
}
#notificationCenter .postVerificationRequestEntry .emailOrPhone{
    margin-top: -3px !important;
    margin-left: -3px !important;
    position: relative;
    top: -6px;
}
.announcementUpdates .announcementLinks{
    display: none !important;
}

.simpleSwitchControl{
    top: 4px;
    width: 46px;
    height: 30px;
    display: inline-block;
    position: absolute;
    background-position: -10px -1385px;
    left: 3px;
}
.simpleSwitchControl.on{
    background-position: -10px -1325px
}
.buttonWithSimpleSwitchControl{
    padding-left: 20px;
}
.awardsItem.editSkill .awardsItemIcon img{
    background-position: -588px -1321px;
    border: 2px solid #e4e5ed;
    border-radius: 100px;
    width: 35px;
    height: 35px;
    margin-top: 0;
}
#skillPicker .inlineToolTip{
 margin-left: -10px;
}
.awardsItem.isSelected{
    background: #edfafe !important;
    border: 1px solid #f0f0f0;
}
.skillSelectedTimesWrapper{
    height: 68px;
}
.skillSelectedTimes{
    padding: 0;
    height: 40px;
    width: 40px;
    background: #00badf;
    color: #FFF;
    text-shadow: none;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    border-radius: 100px;
    text-align: center;
    vertical-align: middle;
    margin: 15px auto 0 auto;
}
.skillSelectedTimesInfo{
    padding-top: 14px;
    font-weight: bold;
}
#skillPicker .nextButton{
    /*color: #FFF;*/
    text-shadow: none;
}
#skillPicker .nextButton.disabled{
    /*opacity:0.5;
    filter:alpha(opacity=50);
    text-shadow: rgba(0, 0, 0, .4) 0px 1px 0px;*/
}
.editClassGoal .remove button{
    color: #e86c6c;
}
.editClassGoal h1,
.editClassGoal p{
    margin: 0 !important;
}
.editClassGoal p{
    margin-bottom: 10px !important;
}
.editClassGoal .formPadding{
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
    padding-bottom: 0;
}
.editClassGoal .formPadding section{
    margin: 0;
    border-radius: 0;
    border-left: none;
    border-right: none;
}
.editClassGoal .formPadding{
    padding: 0;
    margin: 0;
}
.editClassGoal .dialogButtons{
    margin-top: -11px;
}
.editClassGoal .formLayout label input[type='text']{
    padding-left: 60px;
}
.editClassGoal div.option{
    margin-top:10px;
    margin-bottom:10px;
    border-top: 1px solid #53c8e6;
    border-left: 1px solid #53c8e6;
    border-bottom: 1px solid #53c8e6;
    min-width: 45px;
    padding:0 5px;
    float: left;
    text-align: center;
    color: #53c8e6;
    font-weight: bold;
    cursor:pointer;
    text-indent: 0 !important;
}
.editClassGoal div.option.first {
    margin-left:10px;
    border: 1px solid #53c8e6;
    border-right: none;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
}
.editClassGoal div.option.last {
    margin-right:10px;
    width: 70px;
    border: 1px solid #53c8e6;
    -webkit-border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    -moz-border-radius-bottomright: 6px;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
}
.editClassGoal div.option.last.selected span,
.editClassGoal div.option.last input{
    display: none;
}
.editClassGoal div.option.last span,
.editClassGoal div.option.last.selected input{
    display: block;
}
.editClassGoal div.option.last input{
    width: 55px;
    text-align: center;
    height: 45px;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    background: #009ad3;
    border: none;
    margin: 0 auto;
}
.editClassGoal div.option.last input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #FFFFFF;
}
.editClassGoal div.option.last input::-moz-placeholder { /* Firefox 19+ */
    color: #FFFFFF;
}
.editClassGoal div.option.last input:-ms-input-placeholder { /* IE 10+ */
    color: #FFFFFF;
}
.editClassGoal div.option.last input:-moz-placeholder { /* Firefox 18- */
    color: #FFFFFF;
}
.editClassGoal div.option.last input::-webkit-outer-spin-button,
.editClassGoal div.option.last input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.editClassGoal div.option.last input{
    -moz-appearance: textfield;
}

.editClassGoal div.option.last input:focus{
    outline: none;
}
.editClassGoal div.option.selected{
    background: #53c8e6;
    color: #FFF;
  }

@media screen and (min-width:768px){
    .editClassGoal div.option.first{
        margin-left: 25px;
    }
    .editClassGoal div.option{
        min-width: 60px;
    }
}
.block{
    display:block;
}
#behaviorClassGoalStatus{
    cursor:pointer;
    background: #FFF;
    margin: 10px 15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #e4e5ed;
    -webkit-box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    -moz-box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
    padding: 15px;
    height: 100px;
}
.behaviorClassGoalStatusHightlight{
    border: 1px solid #20bde0 !important;
}
.behaviorClassGoalStatusSprite{
    background-image: url(../images/welcomePost.png?04132015);
    background-size: 1000px 377px;
}
.behaviorClassGoalStatusCar{
    display: block;
    width: 36px;
    height: 20px;
    background-position-y: -274px;
    background-position-x: -265px;
    position: absolute;
    margin-top: 30px;
}
.behaviorClassGoalStatusRoad{
    height: 20px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    background-position-y: -339px;
    background-position-x: -65px;
    margin-top: 40px;
}
.behaviorClassGoalStatusStartPoints,
.behaviorClassGoalStatusCurrentPoints,
.behaviorClassGoalStatusGoal{
    font-size: 11px;
    color: #666;
    display: block;
}
.behaviorClassGoalStatusStartPoints{
    width: 10px;
    text-align: center;
}
.behaviorClassGoalStatusCurrentPoints{
    text-align: center;
    position: absolute;
    margin-top: -12px;
    color: #333;
    width: 36px !important;;
    text-align: center;
}
.behaviorClassGoalStatusFlag{
    width: 36px;
    height: 40px;
    background-position-y: -200px;
    background-position-x: -265px;
    margin-top: 40px;
    margin-top: -16px;
    float: right;
    margin-right: -10px;
}
.behaviorClassGoalStatusFlagWrapper{
    width: 100%;
    height: 10px;
    margin-top: -80px;
}
.behaviorClassGoalStatusName{
    text-align: right;
    margin-right: 18px;
    margin-top: 20px;
    font-size: 11px;
    overflow: hidden;
    height: 13px;
    text-overflow: ellipsis;
}
.behaviorClassGoalStatusGoal{
    margin-top: -11px;
    text-align: right;
}
.behaviorModalAwardWrapper{
    margin:15 0;
}
.behaviorModalAwardWrapper h1{
    text-transform: none !important;
    font-weight: bold !important;
    color: #333 !important;
}
.behaviorModalAwardWrapper.multiple h1{
    text-align: left !important;
}
.behaviorModalAwardWrapper .behaviorModalAwardInfo{
    margin: 10px 0;
}
.behaviorModalAwardPoints{
    font-size: 20px;
    color: #139e53;
    -moz-border-radius: 99px;
    padding: 3px;
    font-weight: bold;
}
.behaviorModalAwardList{
    text-align: left;
    margin-bottom: 10px;
}
.behaviorModalAwardList .pickAwardIcon{
    display: inline-block;
}
.behaviorModalAwardListWrapper{
    max-height: 400px;
    overflow-x: auto;
}
.behaviorModalAwardList .behaviorModalAwardInfo{
    display: inline-block;
    vertical-align: top;
    padding-top: 8px;
}
#behaviorSummaryFeedSection{
    background: #fff;
    cursor: pointer;
    border: 1px solid #e4e5ed;
    border-bottom: 1px solid #e4e5ed;
    margin-bottom: 10px;
    padding: 10px 10px 10px 10px;
    position: relative;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, .05);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#behaviorSummaryFeedSection h1{
    padding-top: 0;
}
.isNew #behaviorSummaryFeedSection h1{
    margin-top: -17px !important;
    text-indent: 44px;
}

#behaviorSummaryFeedSection .summaryBox{
    background: #f6f6f6;
}
#behaviorSummaryFeedSection .studentAwardsSummary{
    padding-left: 0;
    padding-right: 0;
}
#behaviorSummaryFeedSection .studentAwardsSummary .summaryBox section.chart{
    border-right: 1px solid #ececec;
}
#behaviorSummaryFeedSection .carousel .studentAwardsSummary{
    display: inline-block;
    width: 240px !important;
    margin-right: 15px;
    vertical-align: top;
}
#behaviorSummaryFeedSection .carousel .studentAwardsSummary .chart,
#behaviorSummaryFeedSection .carousel .studentAwardsSummary .charInfo{
    width: 76px;
}
#behaviorSummaryFeedSection .carousel .studentAwardsSummary .charInfo{
    position: static !important;
}
#behaviorSummaryFeedSection .carousel .studentAwardsSummary .chart .donutChart{
    margin-top:-55px !important;
}
.communitySettingsSlider{
    margin-right:60px;
}
.communitySettingsResetTile{
    float: right;
    margin-right: 15px;
    color: #53c8e6;
    text-decoration: underline;
}

.mainPanelBehavior article footer li::before{
    content:attr(data-long);
}

#postsList{
    margin-top: 0px;
}
.photoAlbums .hgroup.highlightableRow{
    right: 0 !important;
    text-align: right;
}

.celebrationSurprise h3{
    font-size: 20px;
    font-weight: bold;
    margin: 0;
    padding: 0;
    line-height: 20px;
}
.celebrationSurprise h4{
    font-size: 22px;
    line-height: 22px;
    margin: 5px 0 15px 0;
    font-weight: bold;
    height: 40px;
}

.celebrationSurpriseFadeIn {
    -webkit-animation: celebrationSurpriseAnimationFadeIn 7s ease-in-out forwards;
    -moz-animation: celebrationSurpriseAnimationFadeIn 7s ease-in-out forwards;
    -o-animation: celebrationSurpriseAnimationFadeIn 7s ease-in-out forwards;
    animation: celebrationSurpriseAnimationFadeIn 7s ease-in-out forwards;
}
.celebrationSurpriseFadeOut {
    -webkit-animation: celebrationSurpriseAnimationFadeOut 3s ease-in-out forwards;
    -moz-animation: celebrationSurpriseAnimationFadeOut 3s ease-in-out forwards;
    -o-animation: celebrationSurpriseAnimationFadeOut 3s ease-in-out forwards;
    animation: celebrationSurpriseAnimationFadeOut 3s ease-in-out forwards;
}
@-webkit-keyframes celebrationSurpriseAnimationFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@-moz-keyframes celebrationSurpriseAnimationFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@-o-keyframes celebrationSurpriseAnimationFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}
@keyframes celebrationSurpriseAnimationFadeOut {0% { opacity: 1; visibility: visible; } 100% { opacity: 0; visibility: hidden;}}

@-webkit-keyframes celebrationSurpriseAnimationFadeIn {0% { opacity: 0; visibility: hidden; } 40% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@-moz-keyframes celebrationSurpriseAnimationFadeIn {0% { opacity: 0; visibility: hidden; } 40% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@-o-keyframes celebrationSurpriseAnimationFadeIn {0% { opacity: 0; visibility: hidden; } 40% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}
@keyframes celebrationSurpriseAnimationFadeIn {0% { opacity: 0; visibility: hidden; } 40% { opacity: 0; visibility: hidden;} 100% { opacity: 1; visibility: visible;}}


.celebrationSurprise h4 .surpriseSubtitle{
    position: absolute;
}
.celebrationSurprise img{
    width: 100px !important;
}
.celebrationSurprise .celebrationSurpriseIcon{
    height: 140px;
}
.celebrationSurprise .surpriseIcon{
    position: absolute;
}
.celebrationSurpriseBackgroundLeft,
.celebrationSurpriseBackgroundRight{
    background-position: 0px -1789px;
    width: 80px;
    height: 65px;
}
.celebrationSurpriseBackgroundRight{
    width: 80px;
    height: 65px;
    float: right;
    background-position-x: -80px;
    margin-top: -65px;
}
.celebrationClassGoal img{
    width: 155px !important;
    margin: 0 0 20px 0;
    height: 122px;
}
.classGoalReachedCard{
    margin:10px 15px !important;
    padding-top: 20px;
}
.classGoalReachedCardImage,
.classGoalReachedCardContent {
    display: inline-block;
}
.classGoalReachedCardImage img{
    width: 120px;
}
.classGoalReachedCardContent{
    padding-left: 10px;
    vertical-align: top;
    padding-top: 10px;
}
.classGoalReachedCardContent h3{
    font-size: 22px;
    line-height: 26px;
    margin: 0;
    padding: 0;
}
.classGoalReachedCardContent h3.extraPadding{
    padding-top: 15px;
}
.classGoalReachedCardContent h4{
    font-size: 30px;
    line-height: 60px;
    margin: 0;
    padding: 0;
}
.celebrationClassGoalAnimation {
    -webkit-animation: celebrationClassGoalAnimation 3s; /* Safari 4+ */
    -moz-animation:    celebrationClassGoalAnimation 3s; /* Fx 5+ */
    -o-animation:      celebrationClassGoalAnimation 3s; /* Opera 12+ */
    animation:         celebrationClassGoalAnimation 3s; /* IE 10+, Fx 29+ */
  }

@-webkit-keyframes celebrationClassGoalAnimation{
    0%   { opacity: 0; }
    50%  { opacity: 0; }
    100% { opacity: 1; }
}
@-moz-keyframes celebrationClassGoalAnimation{
    0%   { opacity: 0; }
    50%  { opacity: 0; }
    100% { opacity: 1; }
}
@-o-keyframes celebrationClassGoalAnimation{
    0%   { opacity: 0; }
    50%  { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes celebrationClassGoalAnimation{
    0%   { opacity: 0; }
    50%  { opacity: 0; }
    100% { opacity: 1; }
}
.photoAlbums .profileM,
.photoAlbums .metaInfo {
    text-align: left !important;
}
.orgCalendarPage .communityCalendarEvents{
    margin-top: 10px;
}
.quickLinksListWrapper{
    margin-left: 0px !important;
    padding-left: 0px !important;
}
.quickLinksListWrapper li{
    padding-left: 15px !important;
}
.quickLinksListWrapper li::after{
    margin-left: -20px !important;
}
article.hasComment article.message p{
    margin-bottom:-10px !important;
}
article.hasComment article.message p{
    margin-top:-35px !important;
}
article.hasComment article.message time{
    height: 26px !important;
}
.postView .announcementsTimeFooter{
    display: none !important;
}

.communityManageContent{
    display: block !important;
}
.communityManageSearchBar .actionButtons.searchBar{
    top:0px !important;
    padding-right:15px;
    position:relative !important;
    left:0;
    height:auto;
}
.communityManageSearchBar{
    /*border-bottom: 1px solid #CCC;
    height: 40px;*/
    margin-top: 15px;
}
.communityManageContent .searchBox{
    width: 95%;
    padding-right: 120px;
    box-sizing: border-box;
}
.communityManageContent .contentInviteCircles{
    margin-top: 18px !important;
}
.communityManageContent .searchBox input{
    /*height: 32px !important;*/
}
.communityManageContent .searchBar-with-select.searchBar-searchOptions .searchBox {
    width: calc(62% - 70px);
}
.communityManageContent .searchBar-with-select.searchBar-searchOptions .searchBox:nth-last-child(2) {
    padding-right: 0;
}
.communityManageContent .searchOptions{
    font-size: 14px;
    width: 70px;
    text-align: right;
    font-family: gotham;
}
.communityManageContent .searchBar-with-select li.searchBox:first-child + .searchOptions {
    margin-right: 5px;
    width: 10%;
    margin: 10px 0;
}
.communityManageSearchBar .searchBar.searchBar-with-select.searchBar-searchOptions {
    padding-right: 0;
    font-size:0;
    padding-bottom: 20px;
}
.communityManageContent .searchOptions a{
    color: #53c8e6;
    text-decoration:underline;
}
.communityManageContent .hgroup h2{
    margin-left: 45px !important;
    padding-left: 0 !important;
}
.communityManageContent .invitedSectionManage .hgroup h2{
    margin-left: 0px !important;
}
.communityManageContent .recipientPickerCtrl.browseOnly .peopleCheckBox .hgroup h3{
    text-indent: 100px !important;
}
.communityManageContent .recipientPickerCtrl.browseOnly .addToMsg,
.communityManageContent .recipientPickerCtrl.browseOnly .removeFromMsg{
    display: block;
}
.communityManage .itemsList{
    background: #FFF;
    margin: 0;
    padding: 0;
}
.communityManage .itemsList .profileL{
    padding-left: 10px;
    position: relative;
}
.communityManage .itemsList .profileL img,
.communityManage .itemsList .profileL:before{
    width: 41px;
    height: 41px;
}
.communityManage .itemsList .profileL:after{
    margin-top: 0px !important;
    font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-weight: normal;

}
.communityManage .noMarginBottom{
    margin-bottom: 0 !important;
}
.communityManage .buttonIsNotSelected,
.communityManage .buttonIsSelected{
    width: 20px;
    height: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 0;
    border: 2px solid #ccc;
    background-color: #fff;
    position: relative;
    left: 15px;
    top: 35px;
    text-indent: -1000px;
    content: "";
}

.communityManage .itemsListWrapper{
    margin-top: 15px;
}
#communityManageActions .communityManage .itemsListWrapper{
    margin-top: 5px !important;
}
.communityManage .itemsListWrapper .groupActions{
    float: right;
    margin-right: 10px;
    cursor: pointer;
    color: #53c8e6;
}
.communityManage .buttonIsSelected{
    border: 2px solid #53c8e6;
    width: 20px;
    height: 20px;
    background-position: -214px -853px;
}
.communityManage .itemsList .hgroup{
    border-bottom:1px solid #f2f2f2;
    min-height: 100px !important;
}
.communityManage .itemsList .hgroup h3{
    margin-top: -43px !important;
    text-indent: 95px !important;
}
.communityManage .itemsList label{
    background: #f2f2f2;
    color: #666;
    display: block;
    text-indent: 15px;
    line-height: 30px;
    min-height: 30px;
    font-size: 14px;
    border-bottom: 1px solid #f2f2f2;
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky;
    top: 0;
    border-top: 1px solid #f2f2f2;
    z-index: 9999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: gotham;
}
.communityManage .warning{
    font-size: 14px;
    margin-top: 10px;
    color: red;
    margin-left: 95px;
    margin: 10px 10px 15px 95px;
}
.communityManage .modeHideTabsAndRecipients{
    padding-top: 0 !important;
}
#communityManageActions .subPage {
    padding-bottom: 50px;
    background: #eeeeee !important;
}

.fadeTranslateLink{
    opacity:0;
    transition:opacity 0.5s ease-in;
}

.removeTxtDecoration{
    text-decoration:none !important;
}

.scrollViewAccountDelete{
    margin-bottom:-45px !important;
}
.captchabox{
    width: 300px;
    margin: 0 auto;
}
#yearbookSelectImages .loadMoreEntries{
    margin-top: 0 !important;
}
#yearbookSelectImages .mediaWrapper{
    display:inline-block;
    margin: 10px;
    height: 150px;
    width: 200px;
    font-size: 12px;
    text-align: center;
    line-height: 150px;
    cursor: pointer;
    width: 45%;
    box-sizing: border-box;
    background: #F5F5F5;
}
#yearbookSelectImages .mediaWrapper .orientation{
    border: 1px dashed #CCC;
    background-size: cover;
    margin-top: 5px;
    margin-left: 5px;
    margin-right: 5px;
    height: 137px;

}
#yearbookSelectImages .mediaWrapper .orientation.portraid{
    margin-left: 50px !important;
    margin-right: 50px !important;
}
#yearbookSelectImages .center{
    text-align: center !important;
}
#notificationCenter .calendarInvite .hgroup h2{
    height: auto !important;
}
#notificationCenter h3.ptcDate{
    margin-top: 15px !important;
}
#notificationCenter h3.ptcDate time{
    margin-top: 0 !important;
}

.buttonCommunityManageFotter{
    border: none;
}
.buttonCommunityManageFotter .icon{
    display: inline-block;
    height: 30px;
    width: 32px;
    margin: 0 0 0 -16px;
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: 50%;
}
.buttonCommunityManageFotter label{
    display: block;
    margin-top: 17px;
}
.buttonEditSettings .icon{
    background-position: -331px -70px;
}
.buttonAddMembers .icon,
.buttonAddToAnotherGroupClass .icon{
    background-position: -462px -1024px;
}
.buttonRemoveStudent .icon,
.buttonDeleteGroup .icon,
.buttonRemoveFromGroup .icon{
    background-position: -589px -1024px;
}
.buttonChangeRole .icon{
    background-position: -651px -1980px;
}
.buttonAddParentsToChild .icon,
.buttonParentLinkedWithWrongChild .icon{
    background-position: -272px -70px;
}
.groupTypecomm .communityManagerParent,
.groupTypecomm .communityManagerStudent,
.groupTypeclass .communityManagerSubGroup,
.groupTypecomm .communityManagerSubGroup,
.groupTypeclass .communityManagerStaffList,
.groupTypeclass .communityManagerStudent{
    margin-top: 15px !important;
}
#communityManageActions .communityManage .itemsListWrapper.communityManagerStaffList {
    margin-top: -10px !important;
}
.communityManagerStaffList .itemsList{
    border-bottom: 1px solid #f2f2f2;
    margin-bottom: -1px;
}
.communityManageModeratorLabel{
    background: #fd9827;
    padding: 5px 10px;
    font-size: 11px;
    margin-top: 3px;
    float: right;
    text-shadow: none;
    color: #fff;
    font-weight: bold;
}
.userName{
    padding-top: 65px;
    color: #212121;
    text-shadow: none;
    padding-left: 15px;
    font-size: 14px;
    font-weight: bold;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: fit-content;
    float: right;
    max-width: 180px;
}
.addRoster .toolTip{
    background: rgb(253, 248, 228);
    color: #333;
    padding: 12px;
    font-size: 13px;
    border-bottom: 1px solid #CCC;
}
.addRoster .toolTip a{
    color: #53c8e6;
    text-decoration: underline;
    cursor: pointer;
}
.addRoster .browseLink{
    float: right;
    margin-right: 10px;
    color: #53c8e6;
    text-decoration: underline;
    cursor: pointer;
}
.addRoster .slot{
    border-top: 1px solid #e4e5ed;
}
.addRoster .slotLabel,
.addRoster .slotLabelWithStudent,
.addRoster .slotInput{
    display: inline-block;
}
.addRoster .slotLabel{
    width: 30px;
    font-size: 12px;
}
.addRoster .slotLabelWithStudent{
    width: 100px;
    font-size: 12px;
    overflow:hidden;
    text-overflow:ellipsis;
}
.addRoster .slotLabelWithStudent .firstName{
    font-size: 16px;
    line-height: 20px;
    overflow:hidden;
    text-overflow:ellipsis;
    margin-top: 8px;
}
.addRoster .slotLabelWithStudent .lastName{
    font-size: 12px;
    line-height: 15px;
    overflow:hidden;
    text-overflow:ellipsis;
}
.addRoster .slotInput{
    width: calc(100% - 50px);
    vertical-align: middle;
}
.addRoster .slotInput.withStudent{
    width: calc(100% - 170px);
    vertical-align: top;
}
.addRoster .slotInput input {
    width: 100%;
    font-size: 16px;
    line-height: 35px;
    border: none;
    vertical-align: top;
    float: left;
}
.searchResultsAddRoster .addToMsg{
    width: 20px !important;
    height: 20px !important;
    -moz-border-radius: 10px !important;
    -webkit-border-radius: 10px !important;
    border-radius: 10px !important;
    padding: 0 !important;
    border: 2px solid #ccc !important;
    background-color: #fff !important;
    position: absolute !important;
    left: 26px !important;
    top: 25px !important;
}
.recomended{
    color:#e77e02;
    font-weight: bold;
}
.addRoster .addParentSlot{
    color: #53c8e6;
    font-size: 16px;
    cursor: pointer;
    display: block;
    line-height: 20px;
    text-indent: 0;
    margin: 8px 0 7px 0;
}
.addRoster .addParentSlotTash{
    padding-left: 16px;
    background-position: -660px -611px;
    position: absolute;
    width: 20px;
    height: 20px;
}
.addRoster .searchResultsOverlay{
    margin-top:45px !important;
}
.recipientPickerTabsWrapper{
    background: #f2f2f2;
    border: solid #c3c3c3;
    border-width: 1px 0;
    position: absolute;
    height: 42px;
    top: 43px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}
.recipientPickerTabs{
    display: table;
    position: absolute;
    line-height: 36px;
    width: 100%;
    white-space: nowrap;
    background: #f2f2f2 !important;
    box-shadow: inset 0 -1px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.05);
}
.recipientPickerTabs span {
    padding:0 4px !important;
    background: #f2f2f2 !important;
    color: #8e8e8e !important;
    text-align: center !important;
    display:table-cell !important;
    cursor: pointer;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    font-size:14px;
    line-height:40px !important;
    vertical-align:top;
    position:relative;
    border-bottom:1px solid #c2c2c2;
}
.recipientPickerTabs span.selected {
    color: #53c8e6 !important;
    border-bottom:1px solid #53c8e6;
}
.recipientPickerTabs span.selected:after {
    content:"";
    height:3px;
    width:100%;
    bottom:0;
    display:block;
    background: #53c8e6 !important;
    margin-left: -4px !important;
    position:absolute;
}
.shadowBox .recipientPickerCtrl.modeShowTabs{
    padding-top:84px;
}
.signature{
    margin-left:-3px;
}
.parentPermission{
    padding: 0 0 5px 4px;
    line-height: 20px;
    font-weight: bolder;
}
.parentPermission .notice{
    color: #bf6062;
}
.parentEmail{
    padding-left: 5px !important;
}
.studentSignUp .studentName{
    line-height: 20px;
    font-size: 20px;
    color: black;
    padding: 15px 0 0 12px;
}
.no-border-bottom{
    border-bottom: none !important;
}
.chatWindow.modeNewPicker{
    padding-bottom: 0;
}
.chatWindow.modeNewPicker .scrollView{
    display: block !important;
}
.chatWindow.modePickerSingleTabs .scrollView{
    display: block !important;
}
.center-text{
    text-align: center !important;
}
.no-background{
    background: none !important;
}
.no-padding{
    padding: 0 !important;
}
.top-margin-3{
    margin-top: 3px !important;
}
.top-margin-73{
    margin-top: 73px !important;
}
.top-margin-10{
    margin-top: 10px !important;
}
.padding-2{
    padding: 2px !important;
}
.padding-5{
    padding: 5px !important;
}
.communitySearchBar{
    margin-top: -2px !important;
    padding-top: 0 !important;
}
.negative-margin-top-50{
    margin-top: -50px;
}
.student-profile-settings-image-header{
    display: block;
    margin-left: auto;
    margin-right: auto;
    border-radius: 8px 0 8px 8px;
    vertical-align: middle;
    width: 100px;
    height: 100px;
}
.primary-text-color{
    color:#53c8e6 !important;
}
.manageStudentsDetails{
    position: absolute;
    font-size: 14px;
    color: gray;
    line-height: 15px;
    display: inline-block;
    left: 66px;
    margin-top: 5px;
}
.manageStudentsDetails ul{
    list-style: none;
    position: relative;
    top: 10px;
    left: -40px;
}
.studentJoinedTag{
    float: right;
    color: green;
}

.studentCodeDetails {
    display: inline-flex;
    flex-direction: column;
    right: 0px;
    position:absolute;
    padding-right: 45px;
    text-align:center;
    top: 0;
 }

/* alignment adjustments when the buttonis hidden*/
.hideBtn{
    padding-top: 15px !important;
    padding-left:0px !important;
}
.simple-view-user-picture{
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    border-radius:50%;
    width:60px;
    height:60px;
    position:absolute;
    bottom:9px;
    left: 5px;
    box-shadow:0 2px 6px rgba(0,0,0,.5);
    z-index:1;
}
.min-height-70{
    min-height: 70px !important;
}
.left-align-text{
    text-align: left !important;
}
h2.helper-caption{
    padding-left: 72px;
    padding-top: 10px;
    font-size: 14px;
    font-color: grey;
    line-height: 18px;
}
section.student-view-container{
    margin-top: 0px;
}

.student-view-container section h1{
    padding-left: 5px;
}

.backToClassesArrow:before{
   content: "";
    width: 10px;
    height: 10px;
    border-left: 3px solid #212121;
    border-bottom: 3px solid #212121;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin-left: 5px;
    margin-right: 5px;
    vertical-align: middle;
    top: -1px;
    transform: rotate(45deg);
}

.noMessagesToShow {
    justify-content:center;
    padding-top:20px !important;
    margin-left:29px !important;
}

.highlightText{
    color:#53c8e6;
    text-decoration:underline;
    display:block;
}
.adList {
    width: inherit !important;
    margin-left:0 !important;
    min-height: 280px !important;
    display:flex !important;
    justify-content: center;
    padding: 0 !important;
}

.adList iframe{
    width: 258px;
    min-height: inherit;
    margin: 0;
    position: absolute;
    top: 0px;
    background-position: center center;
    background-size: cover;
    width:auto !important;
    object-fit:fill;
    height:275px;
}

.adList img{
    width: 258px;
    min-height: inherit;
    margin: 0;
    position: relative;
    top: 0px;
    background-position: center center;
    background-size: cover;
    width: -moz-available;
    width: -webkit-fill-available;
    object-fit: contain;
    height:275px;
}

.carousel .adList img{
    position: absolute;
    left: 0;
}

#advertisementCollection .carousel article{
    padding-top: 0;
}

/*.highlightPostsUpdatedToday {
    border: 2px solid #40b6d7 !important;
}*/
.highlightPostsUpdatedToday {
    position:relative;
}
.highlightPostsUpdatedToday .postEntryHeader .metaInfo:not(.scheduledAssignment):before {
    content: "Today";
    display: inline-block;
    background: #53c8e6;
    padding: 2px 8px;
    margin-right: 5px;
    border-radius: 15px;
    color: #fff;
    text-shadow: none;
    font-size: 12px;
    margin-top: 2px;
}
.moderatorTag{
    min-width: 90px;
    font-size: 13px;
    color: white;
    background-color: orange;
    text-align: center;
    float: right;
    margin-right: 10px;
    border-radius: 5px;
    padding: 2px 10px 0;
    line-height: 25px;
}

.teachersList {
    height: 48px !important;
}
.teachersList div.recipientPickerTabsWrapper{
    display:none !important;
}
.shadowBox div.chatWindow.modeNewPicker{
    padding-bottom: 0 !important;
}

#studentsListScrollview{
    /*height:90%;*/
}

.gradeSelectValidationMsg{
    position: absolute !important;
    text-indent: 0;
    left: 10px;
    bottom: -5px;
}

.text-indent-30 select{
    text-indent: 30px;
}

.filteredRoleDisplay{
    border: 1px solid #53c8e6;
    border-radius: 10px;
    padding-left: 11px;
    padding-right: 22px;
    color: #53c8e6;
}

/*************************************************
*  access modes icons
*************************************************/
.optionListing.circleThumbnail.middleOrHighSchoolMode:before{
    background-image: url(../images/normalmode@3x.png);
}

.optionListing.circleThumbnail.elementaryMode:before{
    background-image: url(../images/simplemode@3x.png);
}

.optionListing.circleThumbnail.noStudentAccess:before{
    background-image: url(../images/dontgivestudent@3x.png);
}

.optionListing.circleThumbnail.accessMode:before{
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.invitedSectionManage{
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-bottom: 0px !important;
}

.addChildCommunityManage{
    float: right;
    position: relative;
    top: -60px;
    margin-right: 20px;
    border: 1px solid #d3d3d3;
    background-color: #e8e8e8;
    padding: 0 12px;
    line-height: 40px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    left:0px;
    white-space:nowrap;
}

.studentManageWithNoSelectOptn {
    padding-top: 20px !important;
    padding-left: 0 !important;
}

.recipientsNewPicker{
    max-height: 45px;
    border:0;
}
.groupsPicker .removeLeftMargin {
    margin-left: 0px !important;
}
.emailPhoneStaffTab {
    position: relative;
    top: -30px;
}

.communityManage .drillDown:after{
    width:40px;
    top: 80px;
}
.roomParentTag {
    color: black;
    font-size: 12px;
    border: 1px solid #efe9e9;
    border-radius: 5px;
    padding-left: 5px;
    padding-right: 5px;
    display: block;
    right: 5px;
    position: relative;
    margin-bottom: 5px;
    text-align: center;
    background-color: #efe9e9;
}
.commentApprovalMsg{
    padding: 0;
    font-size: 15px;
    position: relative;
    top: -10px;
}
.eventPostComments article:not(:last-child){
    border-bottom: 1px solid #e4e5ed !important;
}
.GothamFont{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.commentModerationPost{
    margin-top: -12px !important;
    text-indent: 1px !important;
}
.sharedWithMaxWidth{
    max-width: 350px;
    text-overflow: ellipsis;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
}
.adVideo{
    width: 100% !important;
}
.adVideo img{
    width: inherit;
    height: 275px !important;
}

.groupNameWithRoles{
    display: flex !important;
    flex-direction: column;
    max-height: 95px;
    min-height: 122px !important;
}

.groupNameWithRoles h2 button{
    position: relative !important;
    z-index: 9999 !important;
}

.groupNameWithRoles .circleName{
    white-space: normal !important;
    word-break: break-word;
    height: auto !important;
    width: 400px !important;
    text-indent: 0 !important;
    margin-left: 72px !important;
    top: 10px !important;
}

.groupNameWithRoles h3{
    /*margin: 0 !important;*/
    margin: 15px 0 0 0 !important;
    text-indent: 95px !important;
}

.groupNameWithRoles h3 span{
    top: -10px;
    position: relative;
}
.removePadding h2{
    padding-top: 20px !important;
    padding-left: 0 !important;
}
.communityManage .itemsList .hgroup.removePadding h3 {
    text-indent: 80px !important;
}

.peopleListing .profileWithChildren .hgroup.removePadding .emailPhoneManageTab h4{
   text-indent: 85px !important;
}

.recipientsHoverList,
.toolTipSection{
    width: 320px;
    color: black;
    border: 1px solid gray;
    background-color: #fff;
    text-align: left;
    font-size: 12px;
    z-index: 9999;
    border-radius: 6px;
    visibility: hidden;
    padding: 5px 12px;
    white-space: normal;
    overflow-wrap: break-word;
    position: fixed;
    line-height: 1.25;
}

.toolTipSection.tooltip-show{
    visibility: visible;
}

.toolTipSection p{
    margin: 0;
}

.addStudentRecipient{
    z-index: 9999  !important;
    background-color: whitesmoke  !important;
}

.addStudentsInputWithAddBtn{
    width: -webkit-fill-available;
    margin-left: 40px !important;
}
.selectedStudentRecipients{
    color: #0099d4;
    padding: 0 1px;
    overflow: hidden;
}
.selectedStudentRecipients.selected{
    padding-right: 20px;
    color: #0099d4;
    text-decoration: underline;
}
.selectedStudentRecipients:after{
    content: ", ";
    right: unset !important;
}
.accountLevelSettings>section>label{
    border: none;
    background: #e8e8e8;
}
.switchSubTextScholarships{
    text-indent: 0;
    font-size: 16px;
    padding: 10px;
    line-height: 1.5;
}

.behaviorNotifyOption label .drillDown:after{
    margin-top: -25px;
}
.validationMsg.msgForSetting{
    text-indent:0;
    padding-left: 10px;
    line-height: 20px;
}
.optionsList li:not(:last-child){
    border-bottom: 1px solid #e4e5ed;
}

.advancedOptions{
    display: block;
    font-size: 14px;
    min-height: 15px;
    padding-bottom: 10px;
}

.optionsList li .browseDesktop + label{
    line-height: 40px;
}

.optionsList:after{
    content: '';
    width: 15px;
    height: 15px;
    border-bottom: 1px solid #e4e5ed;
    border-right: 1px solid #e4e5ed;
    position: absolute;
    transform: rotate(45deg);
    bottom: -9px;
    background: #fff;
    left: 20%;
}

.deletedSnippet{
    opacity: 0.4;
    pointer-events: none;
}
.optionsList{
    display: none;
    position: absolute;
    bottom: 120%;
    border: 1px solid #e4e5ed;
    background: #fff;
    max-width: 150px;
    border-radius: 5px;
    left: -14px;
    bottom: calc(100% + 19px);
    right: 0;
    margin: auto;
}
.optionsList.top.right{
    bottom: -160%;
}

.draftsListing .optionsList.top.right{
    bottom: unset;
    top: 30px;
    float: right;
    z-index: 99999;
    right: 20px;
    position: relative;
    float: right;
}

.optionsList.right{
    right: 5%;
}

.optionsList ul{
    border: none;
    line-height: 40px;
    padding: 0;
    margin:0;
    text-align: center;
    min-width: 160px;
}

.optionsList li{
    display: block;
    font-size: 14px;
    padding: 0;
    font-size: 14px !important;
    padding: 0 5px;
}
.optionsList li .actionSheetHighLight {
    font-size: inherit;
    margin: 10px 0 4px;
    display: block;
    line-height: 1;
}
#recordOption .optionsList li{
    line-height: 20px;
    z-index: 1;
    overflow-wrap: break-word;
}

.optionsList li:not(:last-child){
    border-bottom: 1px solid #e4e5ed;
}

.optionsList li .browseDesktop + label{
    line-height: 40px;
}

.optionsList:after,
.addAudio:after{
    content: '';
    width: 15px;
    height: 15px;
    border-bottom: 1px solid #e4e5ed;
    border-right: 1px solid #e4e5ed;
    position: absolute;
    transform: rotate(45deg);
    bottom: -9px;
    background: #fff;
    left: 20%;
    left: 0;
    right: 0;
    margin: auto;
}

.optionsList.top:after,
.addAudio.top:after{
    transform: rotate(225deg);
    top: -9px;
    left: 80%;
}

.optionsList.right:after{
    left: 80%;
}

.highlightOption {
    color:#53c8e6;
}

#shareOptions.optionsList li.highlightOption:after {
    content: '';
    width: 5px;
    height: 10px;
    display: inline-block;
    transform: rotate(45deg) translateY(-2px);
    border: 2px solid;
    border-width: 0px 2px 2px 0px;
    margin-left: 10px;
    border-color: #53c8e6;
}

#shareOptions.optionsList li{
    padding: 0 0 0 10px;
    text-align: left;
    cursor: pointer;
}

.dropDownIcon:after{
    content: "";
    height: 20px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    background-position: -278px -1151px;
}

.draftTemplate {
    height: 20px;
    width: 20px;
    right: 20px;
    position: absolute;
    cursor: pointer;
}

.shareRecipientsListing{
    text-indent: 0;
    overflow-y: auto;
    line-height: 20px;
    display: -webkit-inline-box;
    font-size: 15px;
    color: #53c8e6;
    padding: 5px;
    flex: 1;
    border: 1px solid #e4e5ed;
    margin: 2px 9px 2px 2px;
    height: 50px;
    border-radius: 4px;
}

.shareRecipientsListing span:after{
    content: ", ";
}

.audioCountIndicator{
    display: inline-block;
    margin-left: -30px;
    font-size: 14px;
    color: #53c8e6;
}

.webRssURL{
    margin-top: 0;
    width: 73%;
    height: 40px;
    user-select: none;
    text-indent: 0;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.webRssURL + button{
    position: absolute;
    right: 5px;
    height: 35px;
    margin-top: 5px;
    line-height: 20px;
    padding: 0 15px;
    border-radius: 0;
    background: #53c8e6;
    border-color: #53c8e6;
    color: #fff;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
}

.shareOptionsCount{
    text-align:center;
    min-width:12px;
    height:18px;
    padding:0 3px;
    color:#fff;
    position:absolute;
    top:2px;
    right:14px;
    font-size:12px;
    line-height:20px;
    -moz-border-radius:9px;
    -webkit-border-radius:9px;
    border-radius:9px;
    background: #53c8e6;
    left: calc(50% + 15px);
    right: auto;
}

#shareOptions ul li:before,
#handleAudioInput ul li:before{
    content: "";
    display: inline-block;
    width: 30px;
    height: 25px;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-size: contain;
    margin-top: -5px;
}

#shareOptions ul li.fbShare:before,
.postSharedWith .shareFacebook::after{
    background-image: url(../images/facebook.png);
}

#shareOptions ul li.twitterShare:before,
.postSharedWith .shareTwitter::after{
    background-image: url(../images/twitterX.png);
}

#shareOptions ul li.rssShare:before,
.postSharedWith .shareWebRss::after{
    background-image: url(../images/web.png);
}

#handleAudioInput ul li.recordAudio:before{
    background-image: url(../images/recording.png);
}

#handleAudioInput ul li.attachAudio:before{
    background-image: url(../images/recording2.png);
}
.mainNavBar li.archivedClassesBtn {
    display: block;
    /*border-left: 4px solid #ffa21e;*/
    color: #000;
    background: rgba(0,0,0,0.03);
    margin-top:13px;
}
.archivedClassesBtn{
    width: 100%;
    line-height: 35px;
    text-indent: 15px;
    color: #212121;
    text-shadow: none;
    font-size: 14px;
    cursor:pointer;
}
.archivedClassesBtn:after{
    float: right;
    margin-right: 10px;
    color: inherit;
}

.unArchiveBtnGroup{
    width: 90px;
    height: 30px;
    font-size: 12px;
    border-radius: 5px;
    border: 1px solid #53c8e6;
    background: #53c8e6;
    color: #fff;
    text-align: center;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
}

.postSearchResults{
    position: absolute;
    width: -webkit-fill-available;
    width: -moz-available;
    max-height: 200px;
    background: #fff;
    overflow-y: auto;
    border: 1px solid #e4e5ed;
    border-radius: 5px;
    margin-top: 7px;
    box-shadow: 0 2px 2px rgba(37,37,37,0.02);
}

.postSearchResults section span.message{
    padding: 10px;
    max-height: 2.7em;
    line-height: 1.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -moz-box;
    cursor: pointer;
    margin: 0;
    padding-top: 0;
}

.postSearchResults section {
    margin-bottom: 0;
}

.postSearchResults section span.title{
    display: block;
    margin: 10px 10px 0px 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.highlightSearchText{
    background: #f9eb3f;
}

.postSearchResults section:not(:last-of-type){
    border-bottom: 1px dotted black;
}

.postSearchResults::-webkit-scrollbar,
.switchProfilesContent::-webkit-scrollbar{
    width: 6px;
}
.studentTemplateContainer::-webkit-scrollbar,
.studentResponses::-webkit-scrollbar,
.settingOptions::-webkit-scrollbar,
.filter-by-options div::-webkit-scrollbar,
.queueList::-webkit-scrollbar{
    height: 8px;
}
.postSearchResults::-webkit-scrollbar-thumb,
.activityFeed .horizontalScroll::-webkit-scrollbar-thumb,
.studentTemplateContainer::-webkit-scrollbar-thumb,
.studentResponses::-webkit-scrollbar-thumb,
.settingOptions::-webkit-scrollbar-thumb,
.filter-by-options div::-webkit-scrollbar-thumb,
.queueList::-webkit-scrollbar-thumb,
.switchProfilesContent::-webkit-scrollbar-thumb{
    background: rgba(0, 0, 0, 0.18);
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
}
.postSearchResults::-webkit-scrollbar-thumb:hover,
.activityFeed .horizontalScroll::-webkit-scrollbar-thumb:hover,
.studentTemplateContainer::-webkit-scrollbar-thumb:hover,
.studentResponses::-webkit-scrollbar-thumb:hover,
.settingOptions::-webkit-scrollbar-thumb:hover,
.filter-by-options div::-webkit-scrollbar-thumb:hover,
.queueList::-webkit-scrollbar-thumb:hover,
.switchProfilesContent::-webkit-scrollbar-thumb:hover{
    background:#7d7d7d;
}

#postsSearchCommunity nav button,
#postsSearch nav button{
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0);
    background-color: #53c8e6;
    padding: 0 12px;
    line-height: 0px !important;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    left: 0px;
    white-space: nowrap;
    color: white;
    height: 45px;
    margin-left: 2px;
    top: 2px;
    font-size: 15px;
    border: 0;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    padding: 0 20px;
    border-radius: 50px;
    font-weight: bold;
}

#postsSearchCommunity nav,
#postsSearch nav{
    display: inline-flex;
    width: -webkit-fill-available;
    width: -moz-available;
    width: inherit;
}
.phoneNumberNotificationCenter{
    font-size: 14px;
    line-height: 25px;
    bottom: 12px;
    margin-bottom: -15px;
    position: relative;
}

.messageCheckBox{
    font-size: 12px;
    line-height: 1.3;
    display: block;
    position: absolute;
    bottom: 6px;
    text-indent: -7px;
    padding-left: 15px;
    font-family: gotham-book;
}

/*====================
   CITY CSS
======================*/

.householdForm.division{
    border-bottom: 1px solid #e4e5ed;
    padding-bottom: 20px;
}

.addToOtherGroups{
    height: auto;
    overflow: hidden;
    padding-bottom: 90px !important;
}

.addToOtherGroups section.highlightableRow{
    border: 1px solid #e2e2e2;
    border-radius: 2px;
    font-size: 16px;
}

.cityInvite{
    padding-bottom: 20px;
    border-bottom: 1px solid #e2e2e2;
}

.lessContent{
    max-height: 255px;
}

.showMoreButton{
    display: block;
    overflow: hidden;
    position: absolute;
    bottom: 50px;
    width: 100%;
    text-align: center;
}

.showMoreButton button{
    border-radius: 20px;
    border: 1px solid #e2e2e2;
    background: #e2e2e2;
}

.citizenVerification ul li{
    padding-left: 23px;
    line-height: 1.25;
    list-style-type: none;
    font-size: 14px;
    width: 80%;
    color: #8e8e8e;
}

.addToOtherNh{
    display: inline-block;
    border: 1px solid #e2e2e2;
    width: 80%;
    left: 12%;
}

.addToOtherNh a{
    min-height: unset !important;
    margin-top: -30px !important;
}

/* New Css
=======================*/
.flag-list {
position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0;
    display: flex;
    flex-wrap: wrap;
    width: auto;
 }
.flag-list li { display:inline-block; width: 14px;  margin-right: 0; height: 14px; }
.flag-list li:last-child { margin-right:0; }
.flag-list li img, .recipientPickerCtrl .profileWithChildren .flag-list li img { width: 100%; height: 100%; background-size: 100% auto; background-position: top center; margin:0; opacity:1;border-radius:0; }
.flag-list.pos-top-right { top:0; right:0; bottom:auto; left:auto;  }
.communityFlagBox {position:relative;}


.studentAwardsSummary .summaryBox section.chart { position:relative; width:150px; }
.chart .charInfo {
    height: 40px;
    line-height:40px;
    width: 40px;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.studentAwardsSummary .charInfo .charInfoNumber { font-size:18px; font-family: focobold; font-weight: normal; text-indent: 0; margin-bottom: 10px; line-height:1.9; }
.studentAwardsSummary .charInfo .charInfoNumber:last-child { margin-bottom:0; }
.studentAwardsSummary .summaryBox canvas.chart { min-width:125px; min-height:125px; }
.chart-time {
        position: absolute;
    bottom: 15px;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 0 20px rgba(0,0,0,0.15);
    max-width: 85px;
    margin: auto;
    padding: 9px 10px;
    border-radius: 50px;
    text-align: center;
    font-family: focobold;
    letter-spacing: 0.05rem;
    font-size: 15px;
    height: 36px;
    line-height: 18px;
    text-indent: 0;
}

.location{
    border-bottom: 1px solid #e4e5ed;
    /*font-size: 18px;*/ font-size: 16px;
    color: #666;
    position: relative;
    padding: 12px 15px 12px 40px;
    line-height: 25px;
    text-indent: 0;
}

.edit-location-list { padding:0; }
.edit-location-list .highlightableRow { border-bottom: 1px solid #e4e5ed; /*font-size: 18px;*/ font-size: 16px; color: #666; position: relative; padding: 12px 20px; padding-right:85px; }
.edit-location-list .highlightableRow:last-child { border-bottom:0; }
.edit-location-list .highlightableRow a { position: absolute; top: 12px; right: 15px; height: 25px; width: 25px; font-size: 0; padding: 2px; box-sizing: border-box; }
.edit-location-list .highlightableRow .location-edit { right:50px; }
.edit-location-list .highlightableRow a img { width:100%; height:auto; }
.communityFlagBox .flag-list.pos-top-right { top: 0; right: 5px; }
.communityManageContent .searchBar-with-select .searchBox-select { width: 37%; padding-right: 2%; position: relative; z-index: 4; }
.communityManageContent .searchBar-with-select .searchBox { width: 62%; }
.custom-select { position: relative; border-radius: 5px; }
.select-gray { background: #dedede; }
.custom-select select { height:auto; padding:6px 35px 6px 10px; font-size:15px; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; appearance:none; position:relative; z-index:1; background:none; line-height:1.25; width: 100%; border-radius: 0; border: 0; }
.custom-select select::-ms-expand { display:none; }
.custom-select:after { content:''; border-top:solid 6px #000; border-right:solid 6px transparent; border-left:solid 6px transparent; position:absolute; right:18px; top:50%; margin-top:-3px; opacity: 0.3; }
.select-box { padding: 15px 20px; }
.select-box .custom-select select { padding-top: 10px; padding-bottom: 10px; }

/*#healthCare .actionBar.healthMode h1, #healthCare .actionBar .backButtonOnly, #healthCare .actionBar .nextButton { text-shadow: none !important; color: #FFF; }*/
.importCleverClass .symptomsCheck button{ position: static; top: unset; left:  unset; font-size:0; }
.importCleverClass .symptomsCheck button.buttonIsSelected:after{ position: relative; top: -42px; left: unset; }
.reportContainer{ background: #fff; width: 100%; overflow-x:auto; }
.reportContainer td { border: 1px solid #c9c9c9; text-indent: 10px; }
.reportContainer tr { border: 1px solid #c9c9c9; }

.quickLinks .optionCreateHealthCheckRequest, .quickLinks .optionCreateHealthCheckRequest,.calendarAddEvent .optionCreateHealthCheckRequest, .quickLinks .optionCreateHealthCheckRequest  { color: #e93d3d; }
.quickLinks .optionCreateStudentReport:after, .quickLinks .optionCreateHealthCheckRequest:after ,.calendarAddEvent .optionCreateHealthCheckRequest:after, .quickLinks .optionCreateHealthCheckRequest:after{ background-image:url(../images/helth-report.png); background-position: center center; background-size: 40px; }
.quickLinks .optionStudentAssignment, .quickLinks .optionStudentAssignment { color: #dd8345; }
.quickLinks .optionStudentAssignment:after, .quickLinks .optionStudentAssignment:after { background-image:url(../images/assignment-ico.png); background-position: center center; background-size: 35px; }
.quickLinks .optionCreateForm:after{ background-image:url(../images/form.png); background-position: center center; background-size: 30px; }
.quickLinks .optionCreateForm{ color: #27276D; }
.quickLinks .optionCreateNewsletter:after{ background-image:url(../images/newsletter.png); background-position: center center; background-size: 30px; }
.quickLinks .optionCreateNewsletter{ color: #FF9800 }
.quickLinks .optionCreatePoll:after, .quickLinks .optionCreatePoll:after{ background-image:url(../images/poll.png); background-position: center center; background-size: 32px; }
.quickLinks .optionCreatePoll{ color: #2329d6; }


.healthReportInfo .calendarDateHeader { border: 0; box-shadow: 0 2px 1px rgba(0,0,0,0.05); border-radius: 3px; line-height: 1.25; height: auto; margin-bottom:10px; }
.healthReportInfo .calendarDateHeader:last-child { margin-bottom:0; }
.HealthReport-date { font-size: 18px; font-size: 16px; font-weight:bold; font-family: focobold; display: block; padding: 10px 40px 10px 20px; position: relative; cursor:pointer; font-size: 15px; }
.HealthReport-date:after { content: ""; position: absolute; top: 13px; bottom: 0; right: 15px; height: 8px; width: 8px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); }
.TableResponsive { position: relative; overflow-y: hidden; overflow-x: auto; }
.healthReportTable table { border-top: 1px solid #e8e8e8; width:100%; }
.healthReportTable table tr { border: 0; }
.healthReportTable table th, .healthReportTable table td { border-bottom: 1px solid #e8e8e8; border-top: 0; border-left: 0; border-right: 0; padding: 7px 10px; /*font-weight:bold; font-family: focobold;*/ text-align: center; text-indent: 0; letter-spacing: 0.03rem; }
.healthReportTable table tr:last-child td { border-bottom:0; }



.healthReportTable table th { font-size:15px; text-transform:uppercase; background:#eaf9f9; }
.healthReportTable table td { font-size:15px; min-width: 80px; }

.healthReportTable table th:first-child, .healthReportTable table td:first-child { text-align:left; min-width: 180px; }
.healthReportTable table .importCleverClass button { top: 0; left: 0; right: 0; margin: auto; font-size: 0; border-color: transparent;}
.healthReportTable table td div { padding: 7px 10px; min-height: 36px; box-sizing: border-box; display: flex; align-items: center; border-bottom: 1px solid #e8e8e8; margin-right: -2px; }
.healthReportTable table tr.conductedBy td { padding: 7px 10px; }

.healthReportMonth { margin: 10px 0 10px 2px; text-shadow: none; /*font-size: 18px;*/ font-size: 16px; /*font-weight: bold; font-family: focobold;*/ text-indent: 0; padding: 0; letter-spacing: 0.03rem;  }
.conductedBy, .healthReportTable table td.conductedBy { color: #53c8e6; }
.HealthReport-date span { font-size: 16px; display: inline-block; margin-left: 5px; color: #909090; }

.healthReportTable table td div.TableResponsive {
    display: block;
    margin-right: 0;
    padding: 0;
    border: 0;
    width: 100%;
    /*max-width: 497px;*/
}
.healthReportTable table td table td { /*padding:0;*/ vertical-align:top; height: 50px; }
.healthReportTable table tr:last-child td div { padding:0; }
.healthCare-form-title { text-align: center; margin-bottom: 20px; margin-top: 10px; }
.healthCare-form-title h1 { margin: 0 0 10px; padding: 0; font-size: 22px; font-family: focobold; }
.healthCare-form-title p { margin: 0; }
.awards .notesWrapper.healthCare-form-list { border:0; }
.healthCare-form-list .symptomsCheck { border: 1px solid #e4e5ed; background: #fff; border-radius: 5px; margin-bottom: 0px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.healthCare-form-list .symptomsCheck:after { content:""; display:table; clear:both; }
.symptomsCheck .symptomsImg { float: left; padding: 15px; }
.symptomsCheck .symptomsImg figure { margin: 0; width: 50px; max-height:50px; }
.symptomsCheck .symptomsImg figure img { width: 100%; height: auto; background-repeat: no-repeat; background-size: 100% 100%;}
.symptomsDetails { display: block; overflow: hidden; width: 100%; font-family: Gotham-book; line-height: 1.4; }
.symptomsCheck .symptomsCheckbox { float: right; width: 40px; text-align: center; padding: 10px; height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.or-separate { display: block; font-size: 17px; font-family: focobold; margin-top: 20px; text-align: center; position: relative; margin-bottom: 20px;}
.or-separate:after { content: ""; height: 1px; background: rgba(0,0,0,0.1); width: 100%; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; z-index: -1; }
.or-separate span { position:relative; z-indent:2; background:#efebef; padding:0 15px; }

.healthreportfill { background: #fff; }
.healthreportfill .profileWithChildren { border-bottom: 1px solid #f2f2f2; padding: 15px; margin: 0; }
.healthreportfill .profileWithChildren .communityFlagBox { margin: 0; padding-right:40px; }
.healthreportfill .profileWithChildren .communityFlagBox a { display: block; font-size:0; }
.healthreportfill .profileWithChildren .profileL { height:auto; padding-top:0 !important; }
.healthreportfill .profileWithChildren .profileL img, .healthreportfill .profileWithChildren .profileL:not(.draftsListing):before { height: 40px; width: 40px; }
.healthreportfill .profileWithChildren .profileL:after { height: 32px; }
.healthreportfill .flag-list li { width: 25px; height: 25px; }
.healthreportfill  .communityFlagBox .flag-list.pos-top-right { height:25px; top:0; bottom:0; margin:auto; }
.classPickerFlags { width: 100%;font-size: 13px;color: #53c8e6;text-decoration: underline;text-align: right;width:95%;cursor:pointer;}
.recipientPickerCtrl .communityManageContent .searchBar-with-select .searchBox:last-child {width: 60%; display: inline-block;}
.recipientPickerCtrl .communityManageContent .searchBar-with-select li.searchBox:first-child { width: 90%;}
/*====================
   ACTIVITY FEED CSS
======================*/

.activityFeedListContainer {
    display: flex;
    overflow-y: hidden;
    overflow-x: auto;
    justify-content: flex-start;
}

.activityFeedListContainer.expandedView{
    flex-wrap: wrap;
    justify-content: space-between;
}

.activityListChild{
    width: 210px;
    height: 220px;
    margin: 10px;
    border: 1px solid #e4e5ed;
    border-radius: 6px;
    background: #fff;
    position: relative;
    cursor:pointer;
}

.activityAssign{
    position: absolute;
    top: 42%;
    right: 5px;
    color: white;
    padding: 5px 13px;
    font-size: 13px;
    background: #40b6d7;
    border: transparent;
    border-radius: 25px;
    z-index: 9999;
}

.activityListChild div.coverImage{
    width: inherit;
    height: 65%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.activityListChild div.coverImage{
    width: inherit !important;
    height: 66.64%;
    object-fit: fill;
    border-radius: 10px 10px 0 0;
    width: 100%;
}

.collectionEntry div.coverImage {
    height: 100%;
}

.activityListChild .activityInfo {
    font-size: 14px;
    line-height: 18px;
    text-indent: 5px !important;
    border-top:1px solid #e4e5ed;
    padding-top: 10px;
    background:#fff;
}

.collectionEntry .activityInfo{
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    width: fill-available;
    height: fill-available;
    width: -moz-fill-available;
    height: -moz-fill-available;
    position: absolute;
    bottom: 0;
    padding: 10px;
    border-radius: 10px;
}

.activityListChild .activityInfo span{
    line-height: 20px;
    display: inline-block;
    overflow: hidden;
    width: 70%;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align:middle;
}

.activityInfo span.ownerName {
    font-size: 15px;
    margin: 15px 0 0 -5px;
    margin-top:0;
}

.collectionEntry div .collectionName {
    max-height: 3.25em;
    width: 100%;
    overflow: hidden;
    white-space: normal;
    line-height: 22px;
    -webkit-line-clamp: 3;
    display: block;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    margin-bottom: 5px;
    font-weight: normal;
    font-size: 17px;
}

.activityInfo img,
.templateInfo img{
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 5px;
    background-size: contain !important;
}

.activityInfo .likeCount{
    font-size: 11px;
    text-indent: 10px;
}

.likeActivity:before,
.addStudentTemplate:before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 10px;
    width: 40px;
    height: 40px;
}

.disallowed-icon:before{
    content: "";
    display: block;
    position: absolute;
    top: 25px;
    left: 10px;
    width: 25px;
    height: 25px;
    background-position: -150px -609px;
}

.addStudentTemplate:before{
    left: 0;
    top: 6px;
}

.createActivity{
    position: absolute;
    bottom: 10px;
    z-index: 10;
    right: 26%;
}

.createActivity:after{
    content:"";
    display:block;
    width:56px;
    height:56px;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    border-radius:50%;
    box-shadow:0px 5px 15px rgba(0,0,0,.25);
    background-color:#2ab3de;
    z-index:3;
}
.createActivity:active:after{
    background-color:#0bacd3;
}

.activityInput input{
    box-sizing: border-box;
    width: 100%;
    color: #000;
    border: 1px solid #e4e5ed;
    -webkit-appearance: none;
    cursor: text;
    text-indent: 10px;
    border-radius:3px;
    font-family: Gotham-book;
}

.activityInput .title{
    height: 35px;
}

.activityInput .instructions{
    min-height: 150px;
    border: 1px solid #e4e5ed;
    padding: 15px;
    border-radius:3px;
    font-family: gotham-book;
    font-size:15px;
}

.activityForm{
    height: auto;
    background: #fff;
    border-radius: 7px;
    padding: 0 10px;
    padding-bottom: 30px;
}

.showParentInstructions{
    text-transform: uppercase;
    border-bottom: 1px solid #c9c9c9;
    padding-bottom: 5px;
    margin-top: 20px;
    cursor: pointer;
}

.activityAdvOpn{
    display: none;
}

.activityAdvOpn.expanded{
    display: block;
}

.inputImageVideoActivity div{
    height: 30px;
    width: 30px;
    float: right;
    margin-right: 10px;
    margin-top: 10px;
}

.instructionsContainer .languageSelection{
    font-size: 14px;
    text-align: right;
}

.inputImageVideoActivity div label:after{
    content: "";
    display:block;
    height: 30px;
    background-position: -272px -1683px;
}

.inputImageVideoActivity div label{
    display:block;
}

.inputImageVideoActivity div input{
    display: none;
}

.createActivity div.addButton{
    right: -2px;
    bottom: -3px;
}

.instructionsContainer{
    border: 1px transparent;
    padding-bottom: 20px;
}

.collectionList h2{
    font-size: 18px !important;
    margin-left: -40px;
    width: 80%;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}

.collectionList{
    display: flex !important;
    align-items: center;
}

.collectionList svg{
    margin-left: 35px;
}

.activityCreateForm .gradeSelection{
    border: 1px solid #e4e5ed;
    position: relative;
    padding: 0 10px;
    border-radius:3px;
    color: black;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 35px;
    flex-grow: 1;
}

.activityCreateForm .gradeSelection>span{
    padding-left: 145px;
    color: #666;
    margin-top: -35px;
    text-transform: none;
    min-height: 24px;
    font-size: 15px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    font-family: Gotham-book;
}

.toggleOpenOptions{
    position: relative;
    font-size: 14px;
    text-indent: 5px;
    font-weight: bold;
}

.toggleOpenOptions:after{
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border: solid #c9c9c9;
    border-width: 0 0px 3px 3px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    display: inline-block;
    right: 30px;
    top: 0;
}

.toggleOpenOptions.optionsVisible:after{
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    top: 5px;
}
section.activityCreateForm p {
    font-family: Gotham-book;
}
.instructionsContainer .languageSelection span {
    font-family: Gotham-book;
}

.collectionListing{
    display: flex !important;
    justify-content: flex-start;
    overflow-x: auto;
    flex-flow: row;
    white-space: normal;
    padding-bottom: 10px;
}

.collectionListing .folder{
    margin-right: 10px !important;
    background: #fff;
    padding: 15px !important;
    border-radius: 5px;
    position: relative !important;
}

.collectionListing .folder a:before{
    top: 12px !important;
}

.activityFeed .horizontalScroll::-webkit-scrollbar{
    height: 7px;
}

.activityFeed h2{
    font-weight: bold;
    font-size: 15px;
    color: #424242;
    text-indent: 10px;
}

.activityCreateForm .validationMsg{
    font-size: 13px;
    color:#aa4749;
    font-style: italic;
    display: block;
    line-height: 12px;
}

.trendingSearches{
    display: flex;
    justify-content: flex-start;
    margin: 10px 0 10px 0;
}
.trendingSearches div{
    border: 1px solid #fbfbfb;
    padding: 10px;
    border-radius: 25px;
    background: #fbfbfb;
    font-weight: bold;
    font-size: 15px;
    margin-right: 10px;
}

.searchContainer{
    display: flex;
    flex-direction: row;
    position:relative;
}

.searchContainer .search-child{
    margin-right: 10px;
    font-size: 14px;
}

.searchContainer .search-child select,
.folderSelection select,
.searchContainer .search-child .date-filter{
    padding: 15px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #dedede;
    height: 99%;
}

.searchContainer .search-child input{
    width: 100%;
    border-radius: 5px;
    border: 1px solid #dedede;
    padding: 15px;
    height: auto;
}

.otherOption{
    color: #40b6d7;
    position: absolute;
    top: 5px;
    right: 0;
    font-size: 14px;
    cursor: pointer;
}

.centeredMsg{
    position: absolute;
    top: 50%;
    left: 45%;
    font-size: 16px;
    color: #666;
    font-weight: 500;
}

.activityViewPage{
    padding-top: 76px !important;
    padding-bottom: 20px;
}
.activityViewPage .assignButton { top: 13px; }
.activityViewPage .likeActivity:before { top:5px; }
.activityView .gradeSubjectInfo div{
    font-weight: bold;
    padding: 10px 0;
}

.activityView .gradeSubjectInfo div span{
    border: 1px solid #c9c9c9;
    background-color: #f5f5f5;
    padding: 3px 6px;
    border-radius: 20px;
    font-size: 14px;
    margin-left: 5px;
    font-weight: normal;
}

.activityInNotificationCenter{
    width: -webkit-fill-available;
    width: fill-available;
    width: -moz-fill-available;
    border-radius: 0;
}

.studentTemplateContainer{
    padding: 10px;
    border: 1px solid #c9c9c9;
    border-radius: 5px;
    overflow-x: auto;
    position: relative;
    display: flex;
    flex-direction: row;
}

.studentTemplateContainer>div{
    min-width: 100px;
    margin-right: 10px;
}

.studentTemplateContainer img{
    height: 100px;
    width: 100px;
    margin-right: 10px;
    object-fit: contain;
}

.studentTemplateContainer span{
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 10px !important;
    display: block;
}

.studentTemplateContainer article{
    margin-bottom: 0 !important;
}

.studentTemplateContainer article p{
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #fff;
}

[contentEditable=true]:empty:not(:focus):before{
    content: attr(data-placeholder);
    color: gray;
}

.activityInput .instructions:focus{
    border: 2px solid #B4CAF3;
    outline: 2px ridge #B4CAF3;
    box-shadow : 2px #B4CAF3;
}

.activityInput .title:focus{
    border: 2px solid #B4CAF3;
    outline: 2px ridge #B4CAF3;
    box-shadow : 2px #B4CAF3;
}

.instructionsContainer .subText{
    display: block;
    position: absolute;
    font-size: 14px;
    line-height: 0;
    text-indent: 5px;
    color: #6d6d72;
    font-weight: bold;
}

.activityCreateForm h1{
    color: black !important;
    font-weight: normal !important;
}

#drawingTool.fullScreen{
    position: fixed !important;
    height: 104vh;
    width: 100vw;
}
.addAudio{
    display: grid;
    position: absolute;
    right: 65px;
    border: 1px solid #666;
    background: #e8e8e8;
    visibility: hidden;
}

.addAudio span{
    border-bottom: 1px solid #666;
    padding: 0 20px;
    line-height: 35px;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
}

.addAudio input{
    display: none;
}

.inputImageVideoActivity .annotationRecordOption{
    position: relative;
}

.inputImageVideoActivity .annotationRecordOption span{
    font-size: 11px;
    bottom: -10px;
    position: absolute;
    margin-left: 7px;
}

.activityFeed .feedTooltip{
    top: 0;
    margin-left: -14px !important;
    position: absolute;
    width: 100%;
}

.activityFeed .behaviorInlineMenu{
    margin-top: 60px;
}



.healthCheckStepList { text-align: center; padding:15px; }
.healthCheckStepList ul { margin: 0; padding: 0; list-style: none; font-size: 0; }
.healthCheckStepList ul li { display: inline-block; width: 33.333333%; font-size: 15px; padding: 0 5px; position:relative; overflow:hidden; box-sizing: border-box; vertical-align:top; }
.healthCheckStep .no { display: block; height: 40px; width: 40px; margin: 0 auto 10px; text-align: center; line-height: 40px; /*font-size: 18px;*/ font-size: 16px; background: #fff; border: 1px solid #e4e5ed; border-radius: 100px; position:relative; }
.healthCheckStep span { display: block; width: 100%; line-height: 1.25; }
.healthCheckStep .no:after, .healthCheckStep .no:before { content: ""; height: 1px; width: 500px; background: #e4e5ed; position: absolute; top: 0; margin: auto; bottom: 0; }
.healthCheckStep .no:after { left: 100%; }
.healthCheckStep .no:before { right: 100%; }
li:first-child .healthCheckStep .no:before { display:none; }
li:last-child .healthCheckStep .no:after { display:none; }
.active .healthCheckStep .no { background: #53c8e6; color: #fff; border-color:#53c8e6; }
.active .healthCheckStep { color: #53c8e6; }
.completed .healthCheckStep .no { background: #98d317; color: #fff }
.completed .healthCheckStep .stepTitle { color: #98d317}

.noSymptoms-btn-box { padding: 15px; width: 100%; box-sizing: border-box; }

.noSymptoms-btn.primaryBtn { font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; /*font-size: 18px;*/ font-size: 16px; color: #fff; border: 1px solid; border-color: #2fc6fa #2fc6fa #27AAD7 #2fc6fa; background: #2fc6fa; padding: 0 12px; line-height: 40px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; display: flex; width: 100%; box-sizing: border-box; align-items: center; text-align: center; justify-content: center; }
.symptomsCheck .noSymptoms-btn.primaryBtn button { margin-left: auto; background: transparent; border-color: #fff; font-size:0; }
.symptomsCheck .noSymptoms-btn.primaryBtn a { margin-left:auto; display: block; height: 20px; width: 20px; }
.noSymptoms-btn-box .or-separate { margin-bottom:0; }
.noSymptoms-btn-box .or-separate span { background:#efebef; }
.symptomsCheck .noSymptoms-btn.primaryBtn button.buttonIsSelected:after { background-position: -469px -907px; }
.eventTag .tags.tagHealthCheck:before { background-image: url(../images/helth-report.png); background-position: center center; background-size:80% 80%; background-repeat:no-repeat; }
.eventTag .tags.tagHealthCheck { color: #e93d3d }

.calendarInvite .eventDetailslist h2 .profileM img { display:block; }
.calendarInvite .eventDetailslist article.update { margin: 0; padding: 0; border: 0; }
.eventDetailslist .calendarInvite { min-height: 80px; }
article.eventDetailslist { padding-bottom: 10px;}
.eventDetailslist span.activitySoccer { display: block;  padding-top: 15px; padding-bottom: 15px; font-size: 14px; font-weight: normal; color: #8e8e8e; }

.calendarInvite .eventDetailslist .hgroup { padding-left: 50px; top: 0; text-indent: inherit; }
.calendarEventDetails .calendarInvite .eventDetailslist .hgroup h2 .profileM { position:absolute; margin-top:0; }
.calendarInvite .eventDetailslist { padding: 0 10px; }
.calendarEventDetails .calendarInvite .eventDetailslist h3 {  margin-top: 17px; margin-bottom: 4px; padding-left: 5px; }
.calendarEventDetails .calendarInvite .eventDetailslist .hgroup h2 .profileM:after { margin-left: 14px; padding-right: 40px; text-indent: 50px; position: absolute; top: 0; left: 0; font-size: 16px; font-family: 'focoregular', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; color: #000; }
.healthSubmit-popup .subPage { padding: 50px 0 0 0; background: #e8e8e8;}
.healthSubmit-list .white-box { border-bottom: 1px solid #e6e6e6;/*font-size: 18px;*/ font-size: 16px;color: #666;position: relative; padding: 12px 20px; background: #fff;text-align: left;}
.healthSubmit-popup .actionBar { text-align:left; }
.healthSubmit-popup .actionBar .backButtonOnly {color: #fff;}
.healthSubmit-popup .actionBar .noBottomGap {color: #fff;}
.tagHealthCheck { color: #e93d3d }
.actionBar .tags.tagHealthCheck:before, .tagHealthCheck:before {
background-image: url(../images/helth-report.png); background-position: center center; background-size:100% 100%; background-repeat:no-repeat; width: 20px; margin-left: 0px; height: 20px; display: inline-block; vertical-align: middle; position: relative; top: -4px; margin-right: 8px; }
.quickLinks li.optionCreateStudentReport { color: #e93d3d; }
.calendarInvite td a { color: #1ca0c8; text-decoration: underline; }
.reportTable { margin-top:10px; }
.reportTable table { width:100%; }
.reportTable table td { padding:8px 0; border-bottom:1px solid #dedede; font-size:16px; }
.reportTable table tr:last-child td { border-bottom:0; }
.hyper-link, .fr-wrapper a {color: #0099d4;text-decoration: underline;}
nav.subNavTabsStudentProfile.subNav-top {position: static;margin-top: 15px;}
.editHealth {border-bottom: 1px solid #e6e6e6;/*font-size: 18px;*/ font-size: 16px;color: #666;position: relative;padding: 12px 15px 12px 40px;line-height: 25px;text-indent: 0;}
.editHealth.edit-health-list { padding:15px; }
.edit-health-btn { margin-bottom:10px; }
.edit-health-btn a { display: block; font-family: 'focoregular', Helvetica, sans-serif; /*font-size: 18px;*/ font-size: 16px; color: #fff; border: 1px solid; border-color: #2fc6fa #2fc6fa #27AAD7 #2fc6fa; background: #2fc6fa; padding: 0 12px; line-height: 40px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; text-align: center; text-shadow: none; }
.edit-health-list .highlightableRow, .edit-health-list .ui-state-default { border-bottom: 1px solid #e6e6e6; padding-bottom: 10px; margin-bottom: 10px; }
.edit-health-list .highlightableRow:last-child, .edit-health-list .ui-state-default:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
.edit-health-list .highlightableRow a, .edit-health-list .ui-state-default a { display: flex; align-items: center; }
.edit-health-list .highlightableRow a:after, .edit-health-list .ui-state-default a:after { content:""; display:table; clear:both; }
.edit-health-list .highlightableRow a img, .edit-health-list .ui-state-default a img { width: 50px; margin-right: 10px; min-width: 50px; }
.edit-health-list .highlightableRow a span, .edit-health-list .ui-state-default a span { display:block; overflow:hidden; font-size: 16px; line-height: 1.5; }
.formLayout label .HealthQuestionselect { padding: 0 10px 0 125px; height: 50px; font-size: 16px; color: #666; margin-top: -48px; background: transparent; border: 1px solid transparent; text-align: left; }
.formLayout label .HealthQuestionselect .placeHolderText { position: static; height: auto; text-indent: 0; }
.formLayout label .HealthQuestionselect .placeHolderText:focus { outline:none; box-shadow:none; }
div.formPadding>.formLayout.sticker-select { border-bottom:0; }
.StickerList { text-align: center; }
.StickerList img { margin: 0 5px 5px 0; }
.formLayout label textarea.HealthQuestionselect { min-height: 150px; padding-top: 10px; padding-bottom: 10px; height: auto; }
.edit-health-list .ui-state-default { background: transparent; border-width: 0 0 1px 0; position: relative; padding-top:10px; margin-bottom:0; }
.edit-health-list .ui-state-default.ui-sortable-helper { background:#f0f4f8; }
.edit-health-list .ui-state-default a { padding-right: 25px; position: relative; z-index: 1; cursor:move; }
.edit-health-list .ui-state-default a:after { content:""; background-image: url(../images/sprite@2x.png); background-size: 704px 2170px; background-repeat: no-repeat; position: absolute; right: -3px; top: 0; bottom:0; margin:auto; height: 25px; width: 25px; background-position: -467px -426px; transform: scale(0.8); z-index:2; cursor:pointer; }
.edit-health-list .ui-state-default.notSort a { padding-right : 0px; }
.edit-health-list .ui-state-default.notSort a:after { display:none; }


.classPickerList { margin: 0 0 15px 0; }
.classPickerList .classPicker { line-height: 1.45; display: block; width: 100%; border: 1px solid #e0e0e0; background: #fff; border-radius: 5px; padding: 12px 15px; font-size: 16px; box-sizing: border-box; text-decoration: none; font-family: focoregular; text-align: left; text-indent: 0; }
.alertBox .dialogBox .dialogMessage .selectGroupPopup { margin-top: -15px; border-radius: 5px; }
.selectGroupPopup .formLayout { background: #e8e8e8; padding: 10px; margin:0; }
.selectGroupPopup .formLayout .highlightableRow { margin-bottom: 1px; background: #fff; border-radius: 3px; padding: 9px 15px; font-size: 16px; font-family: focoregular; position:relative; padding-right: 35px; }
.selectGroupPopup .formLayout .highlightableRow:after { content:""; border: 2px solid #bdbdbd; width: 14px; height: 14px; position: absolute; top: 10px; right: 10px; border-radius: 50%; }
.selectGroupPopup .formLayout .highlightableRow:before { content: ""; width: 20px; height: 20px; display: block; position: absolute; top: 9px; right: 8px; background-position: -212px -852px; background-image: url(../images/sprite@2x.png); background-size: 704px 2170px; background-repeat: no-repeat; transform: scale(0.92); opacity:0; visibility:hidden; }
.selectGroupTitle { text-align: center; }
.selectGroupPopup .formLayout .highlightableRow.selected:after { border-color:#019bd0; }
.selectGroupPopup .formLayout .highlightableRow.selected:before { opacity:1; visibility:visible; }

.imageCount{
    position: absolute;
    top: 20px;
    right: 10px;
    border: 1px solid #e8e8e8;
    width: 40px;
    text-align: center;
    border-radius: 5px;
    background: #dbdbdb;
}

.submittedWork{
    position: relative;
    height: 210px;
    overflow: visible;
    display: flex;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    height: -webkit-fill-available;
    height: -moz-fill-available;
    height: fill-available;
}

.submittedWork.responsePostView{
    height: unset;
}

.mediaSelection{
    grid-template-columns: 50% 50%;
    justify-items: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 0.5%;
    max-width: 570px;
    width:100%;
}

.mediaSelection div {
    width: 210px;
    height: 190px;
    border-radius: 5px;
    font-size: 20px;
    background: #fff;
    font-family: focobold;
    font-weight: normal;
    padding: 20px;
    box-sizing: border-box;
    color: #4c4a4a;
    position:relative;
    flex: 0 0 31%;
    max-width: 31%;
    margin: 1%;
}
.mediaSelection div:after { content:""; position:absolute; bottom:15px; right:15px; height:100px; width:100px; background-size: 100% 100%; background-repeat: no-repeat; background-position: bottom right; }
.mediaSelection .photo:after { background-image: url(../images/ic_photo.png); }
.mediaSelection .draw:after { background-image: url(../images/ic_drawing.png); }
.mediaSelection .video:after { background-image: url(../images/ic_video.png); }
.mediaSelection .upload:after { background-image: url(../images/ic_upload.png); }
.mediaSelection .link:after { background-image: url(../images/ic_link.png); }
.mediaSelection .note:after { background-image: url(../images/ic_note.png); }

.studentResponses{
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    padding-top: 10px;
    padding-bottom: 10px;
    background: #e8e8e8;
}

.studentResponses div.response{
    height: 85px;
    width: 130px;
    display: inline-block;
    margin-right: 10px;
}

.studentResponses div.responseCover{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 90px;"
}

.responseCover span{
    display: block;
    text-align: center;
    color: white;
    padding: 2px;
    font-size: 13px;
}

.studentResponses div.responder{
    height: 24px;
    width: 130px;
    background: #f6f7f7;
    text-align: center;
    border-radius: 0 0 5px 5px;
    border: 1px solid #f1f1f1;
    text-overflow: ellipsis;
    overflow: hidden;
}
.loadMoreEntries.loadMoreEntries-bottom { top: 0; height: 8px; margin: 10px 0 !important; left: 0; box-sizing: border-box; width: 100%; position: relative; border-radius: 50px; overflow: hidden; }
.loadMoreEntries.loadMoreEntries-bottom:after { height: 8px; }

.healthReportTable td table { border: 0; width: 100%; }
#addRecipient.actionBar.icon-with-label { display: flex; flex-direction: row; width: auto; left: auto !important; right: 12px; line-height: 1; border-radius: 0; font-family:gotham; }
.actionBar.icon-with-label .nextButton { position: relative; }
.actionBar.icon-with-label span { display: block; line-height: 44px; line-height: 39px; height: auto; padding-right: 10px; color: #1ca0c8; margin-left: -5px; cursor:pointer; }

.addStudent #addRecipient.actionBar.icon-with-label { left:-12px !important; right:auto; font-size: 15px; margin-top:4px; }
.communityManage .chevronIcon { position:relative; padding-right:35px; }
.communityManage .chevronIcon:after { content: ""; position: absolute; top: -4px; bottom: 0; margin:auto; right: 15px; height: 8px; width: 8px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); }
.communityManage .communityManagerStaffList .chevronIcon .manageStudentsDetails { width: 75%; box-sizing: border-box; }
.communityManage .communityManagerStaffList .chevronIcon .manageStudentsDetails ul { padding-left: 0; left: 0; }
.communityManage .communityManagerStaffList .chevronIcon .manageStudentsDetails li { display: block; overflow: hidden; text-overflow: ellipsis; }
.profilePage .formLayout section h3 label { display:inline-block; margin:0 2px; }
.profilePage .formLayout section h3 label a { color:#fff; }
.profilePage .formLayout section h3 label span { display:inline; margin: 0 0 0 2px; }


#launchScreen.shadowBox:before { display:none; }
.shadowBox .scrollView.welcomeMessage { background: transparent; border: 0; max-height: inherit; overflow: auto; min-height: 390px; height: calc(100% - 90px); display:flex; flex-direction:column; }
.scrollView.welcomeMessage { display: flex; align-items: center; justify-content: center; padding-bottom:175px; flex-direction: column; position: relative; }
.welcomePage .welcomeMessage .contentArea { margin:auto 0; width:100%; padding:50px 0; /*position:relative;*/ }

/*.welcome-logo { height: 56px; min-height: 56px; width: 190px; background-image: url(../images/sprite@2x.png); background-size: 704px 2170px; background-repeat: no-repeat; background-position: -290px 0; display: block; margin: 20px auto; }
}*/
.welcomePage .subPage.welcome1 {
    overflow: auto;
}
.welcome-logo {
    padding: 15px;
    background: #fff;
    display: block;
    width: 100%;
}

.welcome-logo:after{
    height: 56px;
    min-height: 56px;
    width: 190px;
    background-image: url(../images/sprite@2x.png);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    background-position: -290px 0;
    display: block;
    margin: auto;
    content: "";
}

.rss-header-logo:after{

    min-height: 56px;
    background-image: url(../images/sprite@2x.png);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    display: block;
    content: "";
    background-position: -91px -8px;
    transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    border: none;
    width: 32px;
    height: 32px;
    left: 8px;
    background-size: 564px 1870px;
    margin-top: 15px;
}

.rss-header-text{
    font-family : 'Quicksand';
    font-size: 25px;
    margin-top: 15px;
    margin-left: -10px;
    font-weight: bold;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rssFeedNavBar a {
    display: flex;
}

.welcomePage .welcomeMessage .contentArea h1 { margin: 0; padding: 0; width: 100%; text-align: center; font-size: 34px; font-weight: bold; font-family: 'focobold'; line-height: 1.3; }

#login .formPadding .formLayout button.logInBtn { display:flex; align-items:center; justify-content: center}
#login .logInBtn img { margin-top:0; }

.contextNameLoop { display:inline-block; width:100%; color:#2fc6fa; }
.bounce-in{ -webkit-animation: bounce-in-top 1s both; animation: bounce-in-top 1s both; }
@-webkit-keyframes bounce-in-top {
  0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  38% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; }
  55% { -webkit-transform: translateY(-10px); transform: translateY(-10px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  72%,100% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
}
@keyframes bounce-in-top {
  0% { -webkit-transform: translateY(-30px); transform: translateY(-30px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  38% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; opacity: 1; }
  55% { -webkit-transform: translateY(-10px); transform: translateY(-10px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  72%, 100% { -webkit-transform: translateY(0); transform: translateY(0); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
}
.welcomePage .enterAppOptions li { display:block; padding:0; }
.welcomePage .enterAppOptions li:last-of-type, .welcomePage .enterAppOptions li:first-of-type { padding:0; }
.welcomePage .enterAppOptions a.primaryBtn {  border-radius:100px; font-family: 'focobold', Verdana; }
.welcomePage .enterAppOptions a { font-family: 'focobold', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; background-color: #fff; border-radius: 50px; border-color: #fff; color: #2fc6fa; }
.welcomePage .enterAppOptions a:hover { color:#fff; border-color:#2fc6fa; background:#2fc6fa; }

.welcomePage .subPage .enterAppOptions { padding:0 20px; position: static; background: #fff; }
/*.welcomePage { display: flex; align-items: center; }*/

.communityManageContent .invitedSectionManage .archivedClassesList .chevronIcon:after { content: ""; position: absolute; top: -4px; bottom: 0; margin:auto; right: 15px; height: 8px; width: 8px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); }
.communityManageContent .invitedSectionManage .archivedClassesList .chevronIcon button { float: left;}
.communityManageContent .invitedSectionManage .archivedClassesList .hgroup h2 { padding-left: 0;float: left;margin-top: 0; margin-left: 20px !important;width:calc(100% - 40px);}
.communityManageContent .invitedSectionManage .archivedClassesList .hgroup:first-of-type h2 { margin-top : 0;}


.assignButton{
    position: absolute;
    top: 5px;
    right: 50px;
    border: 1px solid #00a3d1;
    background: #00a3d1;
    padding: 5px 11px;
    border-radius: 4px;
    text-shadow: none;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 3px rgba(0,0,0,.06);
    color: white;
}
.instructionsHeader{
    border: 1px solid #666;
    border-radius: 30px;
    padding: 5px 15px;
}

.instructionsHeader:hover{
    border-width: 0;
    color: white;
    background: #019bd0;
}


.health-repo-delete { background-image: url(../images/sprite@2x.png); background-size: 704px 2170px;
    background-position: -592px -1025px;
    background-repeat: no-repeat;
    height: 29px;
    width: 29px;
    display: block;
    margin: -5px auto 10px;
    font-size: 0; }

.no-shadow { box-shadow:none !important; }
.no-border { border:none !important; }
.m-0 { margin:0 !important; }
.addFlag-list > div { position: relative; padding: 10px 15px; padding-right:70px; border-bottom: 1px solid #e4e5ed; }
.addFlag-list .btnDeleteAward { position: absolute; top: 0; right: 0; line-height: 35px; background-position: -1290px -1020px !important; background-image: url(../images/sprite@2x.png) !important; background-size: 704px 2170px !important; font-size: 0; height: 40px; width: 40px; }
.addFlagBtn { padding: 10px; }
.addFlagBtn .btn { position: relative; background-color: #1ca0c8; padding: 12px 15px; color: #fff; font-size: 16px; display: block; text-align: center; font-family: focobold; text-shadow: none; border-radius: 5px; }
.flagSetting:after { content:""; display:table; clear:both; position:static; }
.flagSetting .flagSettingLabel { float:left; width:100%; }
.flagSetting .highlightableRow { float:left; width:50%; box-sizing:border-box; border-bottom:0 !important; }
.saveBtn.primaryBtn { width: 100%; font-family: 'focoregular', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; font-size: 18px; color: #fff; border: 1px solid #1ca0c8; background: #1ca0c8; padding: 0 12px; line-height: 40px; border-radius: 4px; }
.saveBtnGroup { padding: 10px; }
#awardPicker.shadowBox .subPage { padding-top:91px; }

.flag-btn-group .primaryBtn + .primaryBtn { margin-top:10px; }
.primaryBtn.deleteBtn { background: #ff3b30; border-color: #ff3b30; display:block; box-sizing: border-box; text-align: center; }
.primaryBtn.deleteBtn:hover { background: #e32c21; border-color: #e32c21; }
.flag-box { display: block; width: 10px; height: 16px; position: relative; overflow:hidden; }
.flag-box:after { content: ""; position: absolute; left: 0; right: 0; bottom: -8px; height: 10px; width: 10px; background: #fff; transform: rotate(45deg); }
.awardsItem .flag-box { position: absolute; top: -20px; bottom: 0; left: 0; right: 0; margin: auto; width: 20px; height: 30px; z-index:-1; }
.awardsItem .flag-box:after { height: 20px; width: 20px; bottom: -13px; }
.profileM.noProfileImg:after { margin: 0; }

.profileM .flag-box:after { height: 12px; width: 12px; }
.profileM .flag-box { position: absolute; left: 14px; margin: auto; top: 16px; height: 20px; width: 12px; }

.flag-sticker {height: 50px;width: 50px; margin: 0 auto;text-align: center;}
.flag-sticker .flag-box {height: 36px; width: 25px; margin: 0 auto;}
.flag-sticker .flag-box:after {height: 21px; width: 21px; margin: auto;bottom: -15px; left: 1px;}
.behaviorModalAwardList .flag-sticker {
    display: inline-block;
    height: 36px;
    vertical-align: middle;
}
.behaviorModalAwardList .flag-sticker ~ .behaviorModalAwardInfo {
    padding-top: 0;
}
.addFlag-list > div .flag-box { display:inline-block; vertical-align: middle; position: relative; top: -2px; margin-right: 6px; }

.assignButton{ position: absolute;top: 5px;right: 50px;border: 1px solid #00a3d1; background: #00a3d1;padding: 5px 11px;border-radius: 4px;text-shadow: none;box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 3px rgba(0,0,0,.06);color: white;}
.instructionsHeader{border: 1px solid #666;border-radius: 30px;padding: 5px 15px;}
.instructionsHeader:hover{    border-width: 0;color: white; background: #019bd0;}


article footer li.decline, article footer li button.decline { background: #e86c6c !important; border-color:#e86c6c !important; color:#fff; }
article footer li.accept, article footer li button.accept { background: #43c1da !important; border-color:#43c1da !important; color:#fff; }
article footer li button.tentative { background: #fff !important; border-color: #cfd2d2 !important;}
.alertBox .dialogBox .updateOption .formLayout { border: 0; border-radius: 0; box-shadow: none; }
.alertBox .dialogBox .updateOption .formPadding { padding: 0; }
.alertBox .updateOption .buttonGroup { margin-top: 0; }
.alertBox .dialogBox .updateOption h1 span { /*font-size: 18px;*/ font-size: 16px; }
.shadowBox .scrollView { background: #f0f2f4; border-top:1px solid #e4e5ed; }
.contentEventAlert .formLayout section, .contentEventRepeat .formLayout section { border: 1px solid #e4e5ed; border-radius: 5px; }

.actionBar .recipients { border:0; padding-top: 0; padding-left: 50px; }
.formPadding .formLayout>div>label { border-top: 0; background: #fff; margin: 0 0; padding-top: 5px; font-family:gotham; }
#activityTypes .formPadding .contentAutoSuggest .formLayout section span { text-indent: 0; border-bottom: 0; min-height:inherit; }
#activityTypes .formPadding .contentAutoSuggest .formLayout section span span { border-top:0; }
.formPadding .formLayout select { font-size:15px; }
#_createCollection .formLayout label input[type='text'] { padding-left: 160px; height: 54px; }
.behaviorInlineMenu .responsiveMenuInline { margin: 0; }
.mainPanelTimeline .contentArea .formLayout h1 { background: #edeef3; margin: 10px 0 0; text-indent: 0; padding: 0 5px; }
.studentAwardsArea .healthReportMonth { padding: 0 20px; margin: 15px 0 5px 0; display: block; }
.editStudentPanel.formLayout>label { border-top: 0; }

.healthReportTable table tr:last-child td div { border-bottom:0; }


.searchBar-with-select .custom-select { background:#fff; border-radius:50px; }
.searchBar-with-select .custom-select select { height:46px; padding-left:15px; }
.communityManageContent .searchBar-with-select .searchBox input { padding-left: 25px; }
.recipientPickerCtrl .communityManageContent .searchBar-with-select li.searchBox:first-child input { padding-left: 40px; }

.inviteRequest .acceptanceControl button.accept { background: #43c1da; border-color:#43c1da; color:#fff; }
.inviteRequest .acceptanceControl button.decline { background: #e86c6c; border-color:#e86c6c; color:#fff; }
.inviteCircles .peopleListing .memberListing .formLayout section .hgroup { min-height: 70px; }

div.rzslider .rz-pointer { width: 25px; height: 25px; top:-11px; }


#postsSearch nav button.search-ico-btn, #postsSearchCommunity nav button.search-ico-btn { height:45px; width:45px; font-size:0; position:relative; background-color:#9e9e9e; cursor:default; }
button.search-ico-btn:before { content: ""; position: absolute; left: 15px; top: 14px; height: 13px; width: 13px; border: 2px solid #fff; border-radius: 50%; background: #9e9e9e; z-index: 3; }
button.search-ico-btn:after { content: ""; position: absolute; left: 26px; top: 22px; height: 8px; width: 2px; background: #fff; transform: rotate(-45deg); z-index: 2; }

#postsSearch nav .withKeyword + button.search-ico-btn, #postsSearchCommunity nav .withKeyword + button.search-ico-btn { background:#53c8e6; cursor:pointer; }
.withKeyword + button.search-ico-btn:before { background:#53c8e6; }


nav.mainNavBar .mainSideBar ul { margin-bottom: 13px; padding-bottom: 0; }

.postCreateNew .optionsList.top.right { right: 27px; left: auto; bottom: auto; top: calc(100% + 19px); }
.postCreateNew .optionsList.right:after { left: auto; top: auto; bottom: calc(100% - 8px); right: 20px; }
.mr-0 { margin-right:0 !important; }
#studentsListScrollview .formLayout section h2 { margin: 0; }
#studentsListScrollview .formLayout section .hgroup > div { display: block; min-height: 46px; }
.shadowBox .chatInput { background: #fff; }
.shadowBox .chatInput .addStudentRecipient { background: #fff !important; }
button.removeMembers { color: #e86c6c; }
.studentAwardsSummary .chart .charInfo .charInfoDescription { margin-top: -15px; position: absolute; left: 50%; transform: translateX(-50%); }
form.formPadding .formLayout .linkControl span.ng-binding { text-indent: 100px; display: block; }
#createGroup form.formPadding .formLayout .linkControl span.ng-binding { text-indent: 0; }


article footer li.like:before, article footer li.comment:before, article footer li.viewed:before, article .imageFeedbackControl li.like:before { content:""; height:25px; width:25px; display:inline-block; background-image: url(../images/sprite@2x.png); background-size: 704px 2170px; background-repeat: no-repeat; top: 0; position: relative; vertical-align: top; margin: 8px 6px 0 0; }
article footer li.like:before { background-position:-490px -2029px; }
article footer li.comment:before, article .imageFeedbackControl li.comment:before { background-position:-530px -2029px; }
article footer li.viewed:before { background-position:-566px -2029px; }
article .imageFeedbackControl li.like:before { background-position:-490px -2060px; }
article footer li.like.likeSelected:before, article .imageFeedbackControl li.like.likeSelected:before { background-position:-490px -2092px; }
article footer ul.post-update li { border-right:0; position:relative; }
article footer ul.post-update li:after { content:""; position:absolute; top:0; right:0; bottom:0; margin:auto; width:1px; height:17px; background:#e4e5ed; }
article footer ul.post-update li:last-child:after { display:none; }
article footer li { color:#212121; }

.userHeader .userName { cursor:pointer; white-space: normal; line-height: 1.1; }
body .bloomzNotification { position:absolute; bottom:0; left:0; right:0; z-index:9999; text-align:center; }
body .bloomzNotification p { background: #ffd525; box-shadow: 0 0 20px #f6bc69; margin:0; }


.subNavTabs .orgNav, #orgHome .subNavTabs .orgNav { position: relative; left: 0; top: 0; padding-left: 10px; }
#orgHome .subNavTabs .orgNav { top:0 !important; height: 51px !important; background: #fff; border-top: 1px solid #e4e5ed; }
.sidePanel .messagesTab .addCurSection { background: #fff !important; border-bottom: 1px solid #e4e5ed !important; }
#orgHome .sidePanel .messagesTab .addCurSection { border-top: 1px solid #e4e5ed;  }
.subNavTabs { border-bottom: 1px solid #e4e5ed; }


.albumViewingCaptionWrapper.albumViewingCaptionWrapperEdit { padding-bottom: 15px; }
.albumViewingCaptionWrapper.albumViewingCaptionWrapperEdit div { padding:0 10px; }
.chatEntries .time { padding: 10px 10px; font-size: 13px; font-weight: bold; text-align:center; }
.entryByMe { background: #fff; padding: 15px; }
.entryByMe .byMe { position: relative; }
.entryByMe .byMe .msgTime { position: absolute; top: 0; right: 0; font-size: 14px; font-weight: 500; color: #8e8e8e; }
.entryByMe .byMe span a { color: #53c8e6; }
.entryByMe .byMe .username { padding-right: 65px; display: block;  }
.msgViewCount { font-size: 14px; font-weight: 500; color: #8e8e8e; }

.shadowBox .scrollView .scrollView { max-height: inherit; border-top:0; }
#sendMessage.shadowBox .formPadding .chatInput { margin: 10px -10px -6px; width: auto; }
.Desktop #imageDraw .subPage, .iPad #imageDraw .subPage { padding:20px 0; }
.postContentWrapper { color: #8e8e8e; font-weight: normal; font-family: gotham-book; }
.postContentWrapper .postTitle { color: #000; margin-bottom: 7px; /*font-size: 18px;*/ font-size: 16px; }

.behaviorInlineMenu { margin-top: 10px; }
footer.feedbackControl.acceptanceControl { display:none; }
.calendarInviteDetail > h1 { padding-top: 0; }

.peopleListing .profileM { height: 50px; }
.peopleListing .profileM:before { height: 45px; width: 45px; }
.peopleListing .profileM img { height: 45px; width: 45px; }
.alertBox .dialogBox .editClassGoal h1 + p { margin-top: 10px !important; }
#_communitySettings .formLayout label input[type='text'] { padding-left: 270px; }
.orgSettingsPage h1 .explainLink { text-transform: none; text-decoration: underline; }
.iframe-box { max-width: 550px; margin: 20px auto; }
.iframe-responsive { position: relative; overflow:hidden; padding-top:56.25%; }
.iframe-box iframe { position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; }
.cur_createJoinGroup .createJoinGroup { max-height: 350px; }

section.formLayout:empty, section.inlineToolTip:empty { display: none; }
.inputActivity:after { content:""; display:table; clear:both; }
.inputImageVideoActivity.inputActivity div { float:left; }
.inputImageVideoActivity.inputActivity { position:relative; }
.inputActivity .addAudio { border: 1px solid #e4e5ed; background: #fff; max-width: 150px; border-radius: 5px; left: 0; top: calc(100% + 19px); }
.inputActivity .addAudio span { border-bottom: 1px solid #e4e5ed; }
.inputActivity .addAudio.top:after { top: -8px; left: 13px; right:auto; bottom: auto; right:auto; }

.advancedOptions:after { content: ""; display: table; clear: both; }
.add-child-box { display: flex; flex-wrap: wrap; }
.profilePage.newChild .newOnly.knownAs .add-child-box span { max-width: 110px; font-size:16px; }
.createPostBody div[image="image"] { display: inline-block; width: 25%; padding: 0 10px 10px 0; }
.formLayout .selectStyles:after { top: -4px; }
div.formPadding>.formLayout.formBtn { background: transparent; box-shadow: none; border: 0; overflow: inherit; }



.assignButton{ position: absolute;top: 5px;right: 50px;border: 1px solid #00a3d1; background: #00a3d1;padding: 5px 11px;border-radius: 4px;text-shadow: none;box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 3px rgba(0,0,0,.06);color: white;}
.instructionsHeader { border-radius: 30px; padding: 8px 20px 6px; background: #53c8e6; color: #fff; font-size: 16px; font-weight: bold; box-shadow: 3px 3px 7px rgba(0,0,0,0.1); }
.instructionsHeader:hover{ background: #48bddb; }
.health-repo-delete { background-image: url(../images/sprite@2x.png); background-size: 704px 2170px; background-position: -592px -1025px;background-repeat: no-repeat;height: 29px;width: 29px;display: block;margin: -5px auto 10px;font-size: 0; }

.deleteLink { float: right; padding: 0 15px }
.deleteLink a { color: #1ca0c8; text-decoration: none; }
.reinviteDeleteAllButton { display:none; }
.reinviteDeleteAllButton:after { content:""; display:table; clear:both; }
.verticalList .reinviteDeleteAllButton { display: block; line-height: 1; text-align: right;width:80%; }
.reinviteDeleteAllButton .reinviteAllButton { margin-top: 18px;display: inline-block;height: auto; line-height: 1; width: auto;margin-left: 15px;float: none; margin-right: 25px; }


.appFullScreen #behaviorManagementReports.inlineBox .subPage .scrollView, .appFullScreen #behaviorManagementAttendance.inlineBox .subPage .scrollView { padding-right: 0; overflow-y: auto; }
.notificationSettings div section:last-child { margin-bottom:0; }

.folder-box { max-width: 60px; margin: 0 auto; width: 100%; cursor:pointer; }
.folder-box svg { width:100%; height:auto; }
.folder-box svg path { fill:#53c8e6; }
.folder-open { display:none; }
.folder.hasContent .folder-open { display:block; }
.folder.hasContent .folder-close { display:none; }
.photoAlbums .media-folder-list { display: flex; width: auto; flex-wrap: wrap; flex-direction: row; }
.photoAlbums .media-folder-list .folder { max-width: 150px; flex: 0 0 150px; }
#media .media-folder-list .folder:not(.activityFolders) a:before { position:relative; top: 0; margin-bottom: 8px; }
#media .media-folder-list .folder a { display:block; text-align:center; font-size:12px; color:#53c8e6; padding: 0; height: auto; width: 100%; white-space: normal; }
.communityManageContent .invitedSectionManage .hgroup h2 {  position:relative; }
.communityManageContent .invitedSectionManage .hgroup h2:after { top: 25px; right: 0; }
#verificationApproval .peopleListing .hgroup h3 { margin: -43px 0 0 0; text-indent: 66px !important; padding-left: 0; }

.appFullScreen .shadowBox .subPage { max-height: 70vh; top: 3vh; }
.emptyPanelMsg .formLayout button { font-weight:bold; font-size: 14px; line-height: 32px; width: auto; white-space: nowrap; box-shadow: 3px 3px 7px rgba(0,0,0,0.1); padding: 0 20px; border-radius: 50px; background: #53c8e6; color:#fff; }
section.summaryBox:empty { display:none; }
div#notificationCenter .subPage.notificationCenterWithFooter { padding-bottom: 42px; }
.contentNotificationCenter article.update .resharedUpdate { max-height: inherit; padding-bottom: 10px !important; }


.formLayout .parents-delete-form input[type='number'] { margin-top: 0; padding-left: 10px; background: #fff; border-color:#cccdd5; }
.parents-delete-form > div { margin-bottom: 5px; font-family: 'focobold', Verdana; }
.parents-remove-text-align {text-align : left;}

#notificationCenter footer.feedbackControl.acceptanceControl { display: block; background: #fff; border: 0; height: auto; padding: 10px; }
.contentNotificationCenter article.update .resharedUpdate { background: #fff; }

#addFamilyFbScreen .profilePage .filterControl .addFamily li p:last-child { margin-bottom: 0; margin-top: 12px; }
#addFamilyFbScreen .profilePage .filterControl a.addSpouse .profileM:after { margin-top: 6px; }

.postCreateNew #sendPost.optionsList.top.right { /*max-width: 215px; width: 100%;*/ width: 225px; right: 37px; }
#sendPost.optionsList ul * { white-space: nowrap; }
#sendPost.optionsList ul li .actionSheetHighLight { display: inline; }
#recipientPicker .inviteCircles .peopleListing .formLayout section .hgroup { min-height: 70px; }


button.membersManagerOptions.removeMembers { color: inherit; }
.scrollView .contentArea { background: transparent; }
.formPadding .addNotesInfo .formLayout select { padding-left: 10px; }
div.formPadding section.formLayout[ng-show="!isMultiple"] { overflow: inherit; }

.messages .message .hgroup + p { margin-bottom: 0; margin-top: -35px; }
#behaviorReportingControl .studentAwardsSummary { padding-left: 0; padding-right: 0; }
#behaviorReportingControl .studentAwardsSummary > br { display: none; }
#behaviorReportingControl .behaviorReportingContent .studentAwards { margin-top: 0; border: 1px solid #e4e5ed !important; border-radius: 5px; overflow: hidden; }
.messages .labelComments { margin: 0 0 10px 0; display: block; }
.actionSheet .dialogBox h1>span[ng-show="params.message"] { font-weight: 300; font-family: 'Gotham-book'; font-size: 80%; line-height: 1.5; }
section.scheduledFor .separateTime .altDatePicker { padding-left: 145px; }
section.scheduledFor .separateTime .altDatePicker input[type="text"] { margin-left: 0; }

.peopleListing .hgroup h3 { /*margin-left:6px;*/ }
.subPage.congratulations-popup .scrollView { background: #fff; }
.subPage.congratulations-popup .scrollView .formLayout { margin: 0; padding: 15px; }
.freWalkthrough.congratulations-popup .walkthrough section.descriptions p { margin-top: 0; }
.chatInput .messageWrapper { background: #fff; margin-top: 5px; top: 0px; font-size: 0; display: table; }
.inlineBox .chatInput>div .editableElement { position: relative; top: 0; bottom: 0; margin-top: 0; }

.subPage .chatInput .messageWrapper { display: table-cell; margin-top: 0; }
div#_printInstructions { font-family: gotham-book; }
.shadowBox .addRosterView .peopleListing .formLayout { overflow: inherit; }
.shadowBox .addRosterView .peopleListing .searchResultsAddRoster { box-shadow: 0 2px 2px rgba(37,37,37,0.02); border: 1px solid #e8e8e8; }
.shadowBox .addRosterView .peopleListing .searchResultsAddRoster > .formLayout:last-child { padding-bottom: 0; border-bottom: 0; }

.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles { margin-top: -38px; }
.eventRepeat .contentEventRepeat .repeatDayPicker .selectStyles:after { display:none; }

.actionBar .recipients > span > span { max-width:inherit; }
.peopleListing.scrollView .scrollView { padding: 10px; }
h1.pgHeader { font-family: gotham; }
.editStudentPanel { font-family: gotham; }

.actionBar.studentProfile .simple-view-user-picture { width: 40px; height: 40px; bottom: auto; top: 3px; left: 30px; }
div#createJoinGroup.getInvitedPage { box-shadow: none; background: transparent; }
.StudentJoinCode #student-feed-view .formPadding { background:transparent; }
.StudentJoinCode.shadowBox .recipientPickerCtrl.modeHideTabsAndRecipients { padding-top:0 !important; }
.assignment-info-box { border: 1px solid #e4e5ed; padding:15px; padding-right:100px; font-family: gotham; font-size: 14px; margin-bottom: 10px; box-shadow: 0 2px 2px rgba(37,37,37,0.02); border-radius: 5px; position: relative; min-height: 50px; }
.assignment-info-box span { white-space: nowrap; display: block; overflow: hidden; text-overflow: ellipsis; }
.assignment-info-btn button { position: absolute; top: 0; right: 10px; background: #53c8e6; border: 0; color: #fff; padding: 6px 15px; border-radius: 50px; height: 30px; bottom: 0; margin: auto; width: 80px; text-align: center; transition:0.35s all; }
.assignment-info-btn button:hover { background:#2ab3de; }
.subPage.verifyUserIdentity section.emptyPanelMsg {  background: transparent; }
#addPost .createPost .subjectLine { padding-bottom: 0; }
.postContentWrapper .readMoreLess { /*font-size: 16px; font-family: 'focoregular';*/ color: #000; }
.parentPermission { margin: 15px 0; line-height: 1.3; font-size: 14px; }
.update .calendarInvite ~ .feedbackControl li.like { display:none; }

#notificationCenter footer.feedbackControl.acceptanceControl li.comment:before { display:none; }



.awards.scrollView {max-height: 84%;}
.awards.scrollView.awardsWithNoSelection {max-height: inherit;}

.cols:after { content:""; display:table; clear:both; }
.cols { margin-left:-5px; margin-right:-5px; }
.col { float:left; padding-left:5px; padding-right:5px; }
.cols2 .col { width:50%; }
.BehaviorReportTabBox { padding:10px 0; }
.BehaviorReportTabBox * { box-sizing:border-box; }
.separateTime ul.formPadding { padding: 0; margin: 10px 0 0 0; list-style: none; }
.SummaryChartBox { display: flex; align-items: center; margin-bottom: 10px; }
.SummaryChart { width: 70px; display: flex; align-items: center; margin-right: 10px; padding-right: 35px; position: relative; }
.BehaviorReportTabBox .SummaryChart h4 { display: block; text-align: center; /*font-size: 14px;*/ font-weight:normal; position: absolute; top: -4px; right:-10px; color: #1ca0c8; position:static; }
.BehaviorReportTabBox .SummaryChart h4 span { color:#000; margin-left:5px; }
.BehaviorReportTabBox h4 { margin: 0; }
.BehaviorReportTable table th, .BehaviorReportTable table td { border: 1px solid #e4e5ed; padding: 10px 15px !important; background:#fff; border-right: 0 !important; border-left: 0 !important; }
.BehaviorReportTable table th {  background: #f0f2f4; text-align:left; }
.BehaviorReportTable table th:last-child { /*min-width: 150px;*/ }
.BehaviorReportTable table td { cursor:pointer; }
.BehaviorReportTable table td.reportIco, .staffDataTable table td.reportIco { padding: 2px !important; text-align:center; }
.communityEngagementContent .BehaviorReportTable table td { font-size:15px; text-align:left; }
figure.Behavior-health-img { width: 30px; height: 30px; margin: 0 auto 0 0; }
figure.Behavior-health-img img { width: 100%; height: 100%; background-repeat: no-repeat; background-size: 100% 100%; }
.BehaviorReportTable table th:first-child, .BehaviorReportTable table td:first-child { text-align:left; white-space: nowrap; }

.BehaviorReportTabBox ul.dateControl .rangeSortWrapper { margin: -47px 0 0 0 !important; margin: -41px 0 0 0 !important; padding-left: 65px; background: transparent; border: 0; position:relative;font-family: 'Gotham-book';color:#666; padding-left: 145px;text-indent: 10px; }
.BehaviorReportTabBox ul.dateControl .rangeSortWrapper section.rangePicker { width: 100%; border: 0; }
.BehaviorReportTabBox ul.dateControl .rangeSortWrapper section.rangePicker .altDatePicker { border: 0; }

.BehaviorReportTabBox ul.dateControl .calendarDatePickerRangeDate .icon { margin:0; top:0; right:0; }
.BehaviorReportTable table th.data-shorting { padding-right: 23px !important; position: relative;}
.communityEngagementContent tbody tr td.text-left { text-align:left; }
.BehaviorReportTable table th#count, .BehaviorReportTable table th#points { width: 150px; min-width: 150px; max-width: 150px;  }
.BehaviorReportTable table th.interactions, .BehaviorReportTable table td.interactions { width: 150px; min-width: 150px; max-width: 150px; text-align:left; white-space: normal; }
.data-shorting { cursor:pointer; }
.data-shorting .data-short { position: absolute; top: -4px; right: 7px; bottom: 0; height: 0; width: 0; margin:auto; }
.data-shorting .data-short:before, .data-shorting .data-short:after { content:""; position: absolute; top: 0; right: 0; height: 0; width: 0; border-right: 4px solid transparent; border-left: 4px solid transparent; margin: auto; }
.data-shorting .data-short:before { border-bottom: 6px solid #999; bottom: calc(100% + 4px); }
.data-shorting .data-short:after { border-top: 6px solid #999; top: calc(100% + 4px); }
.data-shorting.descending .data-short:before { top:0; bottom:0; margin:auto; }
.data-shorting.descending .data-short:after { display:none; }
.data-shorting.ascending .data-short:before { display:none; }
.data-shorting.ascending .data-short:after { top:0; bottom:0; margin:auto; }

.descending, .ascending { cursor:pointer; }
.ProgressBar { height: 10px; width: 100%; background: #f53b39; border-radius: 50px; position: relative; }
.ProgressBar .Progress { position: absolute; top: 0; bottom: 0; left: 0; height: 100%; background: #8bc24a; border-radius: 50px; }
.progressLevel { display: flex; align-items: center; margin-top: 5px; }
table tr td .progressLevel span { font-size: 14px; color: #000; font-weight: normal; }
.LevelGood { margin-right: auto; }
.LevelBad { margin-left: auto; color:#f53b39; }

.BehaviorReportTable { position: relative; width: 100%; overflow: auto; border: 1px solid #e4e5ed; }

.communityEngagementContent .BehaviorReportTable table, .communityEngagementContent .BehaviorReportTable tbody tr:nth-child(odd) { background:transparent; }
.communityEngagementContent .BehaviorReportTable table .staffTable-head th { background:transparent; border-color: transparent; font-family: 'focoreguar', Helvetica, sans-serif; font-weight: normal; }
table .SummaryChartBox { margin-bottom:0; flex-direction:column; align-items: start; }
.SummaryChartTitle { padding-left: 40px; margin-top: -13px; }
.StaffName { display: block; font-size: 22px; margin: 15px 0; font-weight: bold; letter-spacing: 0.06rem; }
.staffDataList { background: #fff; margin-bottom: 10px; border-radius: 3px; position: relative; overflow: hidden;clear:both; }
.staffData { padding: 10px; position:relative; cursor:pointer;display: flex;justify-content: space-between; }
.staffData:after { content:""; position:absolute; top:-3px; right:10px; bottom:0; margin:auto; height:6px; width:6px; border-right:2px solid #000; border-bottom:2px solid #000; transform:rotate(45deg); transition:0.35s all; }
.staffData.active:after { transform: rotate(225deg); top: 3px; }
.staffDataTable { position:relative; overflow:auto; border-top:1px solid #e4e5ed; }
.staffDataTable table { width:100%; }
.staffDataTable table td img { width: 30px; }
.communityEngagementContent .staffDataTable tbody tr td { font-size:14px; border-bottom: 1px solid #e4e4ed; border-right:0; padding: 10px 15px; }
.communityEngagementContent .staffDataTable tbody tr:nth-child(odd) { background:transparent; }
.TabsStudentSubNav nav.subNavTabsStudentProfile { background:transparent !important; box-shadow: none; text-align: center; margin-bottom: 10px; }

.TabsStudentSubNav .subNavTabsStudentProfile span { background: #fff !important; font-weight: normal; font-family: 'focoregular'; color: #000 !important; margin: 0 1px 0 0; border-bottom: 0 !important; text-shadow:none; }
.TabsStudentSubNav .subNavTabsStudentProfile span:after { display:none !important; }
.TabsStudentSubNav .subNavTabsStudentProfile span.selected { color:#fff !important; background: #1ca0c8 !important; }

.behaviorInlineMenu .StaffBehaviorMenu.responsiveMenuInline { text-align: center; display: flex; margin-bottom: 20px; }
.behaviorInlineMenu .StaffBehaviorMenu.responsiveMenuInline ul { height: auto; display: flex; align-items: center; justify-content: center; margin: auto; border: 2px solid #0ca1ca; border-radius: 5px; }
.behaviorInlineMenu .StaffBehaviorMenu.responsiveMenuInline ul li { height: 40px; width: auto; display: flex; align-items: center; padding: 7px; }
.behaviorMenu-ico { height: 30px; width: 30px; display: block; padding: 3px; }
.behaviorMenu-ico svg { height: 100%; width: 100%; }
.behaviorMenu-ico svg path { fill: #0ca1ca; }
.behaviorInlineMenu .active { background: #0ca1ca; color:#fff; }
.behaviorInlineMenu .active .behaviorMenu-ico svg path  {  fill: #fff; }

.chart-top-box { margin-bottom:10px; }
.chart-filter-title h2 { font-weight: bold; font-size: 22px; }
.form-group label { font-family: 'focoregular'; }
.col.chart-filter-title { width:40% !important; }
.col.chart-filter-col { width:60% !important;float:right; }
.ChartNameList ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; border-top: 1px solid #dedede;padding: 5px 0 5px 0;}
.ChartNameList ul li { flex: 0 0 auto; padding: 0 5px; width: 33.33333%; margin: 5px 0 5px 0; line-height: 1; }
.ChartNameBox { display: inline-block; position: relative; padding-left: 15px;cursor:pointer;font-size:13px }
.ChartNameBox:before { content:""; height: 8px; width: 8px; position: absolute; left: 0; top: 4px; border:1px solid #c0c0c0; opacity:1; visibility:visible; }
.active .ChartNameBox:before { opacity:0; visibility:hidden; }
.ChartNameBox .ChartNameCheck { height: 10px; width: 10px; position: absolute; left: 0; top: 4px;  }
.active .ChartNameBox .ChartNameCheck { opacity:1; visibility:visible; }
.staffTable-head-ico-box { display:flex; align-items:center; }
.staffTable-head-ico { height:30px; width:30px; min-width:30px; margin-right:10px; }
.staffTable-head-ico img { height:100%; width:100%; background-repeat:no-repeat; background-size:100%; }
.BehaviorReportTabBox .dateControl .formLayout > section { min-height: 49px; }
.selectMemberDialog .actionBar .backButtonOnly { float: left; }
.staffDataTable td { border-right: 1px solid #e4e5ed; border-bottom: 1px solid #e4e5ed; padding: 10px; vertical-align: top; }
.staffDataTable td:last-child { border-right:0; }
.staffDataTable tr:last-child td { border-bottom:0; }
.staffDataTable td strong { display: block; margin-bottom: 5px; }
.BehaviorReportTable table { width:100%; border: 0; border-spacing: 0; overflow:auto;}
.BehaviorReportTable table td:first-child.reportIco { text-align: center; width: 80px; }
.StaffTitle { position: relative; padding-left: 40px; }
.StaffBack { position: absolute; left: 11px; top: -3px; bottom: 0; height: 13px; width: 13px; margin: auto; border-left: 3px solid #1ca0c8; border-bottom: 3px solid #1ca0c8; transform: rotate(45deg); }
.awards.scrollView.awardsWithNoSelection {max-height: 85% !important;}

.profileM.noProfileImg:after { width: auto !important;margin-left: 20px;}
.profileM.awardName:after { width: 70px !important;overflow: hidden; margin-top: 10px; white-space: normal; text-overflow: inherit; height: auto; text-align: center; padding: 0; margin-left: -10px; text-indent: 0; font-size: 14px; line-height: 1; word-break: break-word;}
article .hgroup.awardName-hgroup { padding-left: 70px;}

.addFlag-list {cursor:pointer;}
.awards.scrollView.awardsWithNoSelection {max-height: inherit;}

.sftp-model .actionBar { background:#fff; }
.sftp-model .formLayout select { padding-left: 125px; margin-top: -48px; display: block; height: 50px; font-size: 16px; }
.sftp-model .buttonGroup { margin:10px 0 0; padding:0; list-style:none; }
.sftp-model .formLayout .required { font-size:0; text-indent:0; color:#f00; font-style: normal; }
.sftp-model .formLayout .required:after { content:"*"; font-size:20px; }
.sftp-model .formLayout label > span { font-size: 17px; }

section.sftp-run-btn { padding: 10px; }
.formLayout .sftp-run-btn button { background-color: #53c8e6; display: block; width: 100%; border-color: transparent; font-weight: bold; text-shadow: none; color: #fff; }
.sftp-list label button { position: absolute; top: 7px; right: 7px; font-size: 16px; line-height: 30px; }
.sftp-list .highlightableRow label input[type='text'] { padding-left: 150px; padding-right: 73px; text-overflow: ellipsis; }
.sftp-list .highlightableRow label .custom-select { padding-left: 133px; margin-top: -48px; box-sizing: border-box; }
.formLayout section.sftp-table { font-size: 15px; line-height: 1.4; overflow:auto; border-top:0; }
.formLayout section.sftp-table table { width:100%; }
.sftp-table tr:first-child td { font-family:'focoreBold', Helvetica, sans-serif; font-weight:bold; border-top:0;    border-top: 1px solid #e4e5ed; }
.sftp-table tr td { white-space: nowrap; padding: 4px 5px; border:0; border-top: 1px solid #e4e5ed; border-right: 1px solid #e4e5ed; text-indent:0; }
.sftp-table tr td:last-child { border-right:0; }
.sftp-table tr:last-child td { border-bottom:0; }
.formLayout section.readmore-link { padding: 10px; font-size: 16px; line-height: 1.3; text-indent: 0; }
.readmore-link a { display: block;font-size: 17px; text-align: left;color: #2ab3de;line-height: 1.4;padding: 0 10px; position: relative;text-indent: 0;margin: -10px 0 10px 0;text-decoration:underline; }

.formLayout section.fileStatus-link { padding: 10px; font-size: 16px; line-height: 1.3; text-indent: 0; }
.fileStatus-link a { text-decoration:underline; color: #2ab3de }

article.sftpCollapse { margin: 0; border: 0; padding: 0; }
.collapseTrigger { display:block; position:relative; padding:10px 25px 10px 40px; border-bottom: 1px solid #e4e5ed; line-height: 1.25;text-indent: 0;font-family: 'focoreBold', Helvetica, sans-serif;cursor:pointer;margin-left:5px;}
.collapseTrigger:after { content:""; position: absolute;top: -2px;right: 12px;bottom: 0;border-right: 2px solid gray;border-bottom: 2px solid gray;height: 8px;width: 8px; margin: auto;transform: rotate(45deg); }
.open > .collapseTrigger:after { transform: rotate(225deg); top: 3px; }
.bulkImportValidationMsg { font-family: 'focolight_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; display: block;font-size: 15px; text-align: left;color: #bf6062;line-height: 1.4;padding: 0 10px; position: relative;text-indent: 0;margin: -10px 0 10px 0;}
.sftp-list article.sftpCollapse { margin-bottom: 10px; }
.schoolImportCheck .formLayout button.addToMsg,
.schoolImportCheck .formLayout button.removeFromMsg { width: 20px; height: 20px; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; padding: 0; border: 2px solid #ccc; background-color: #fff; position: absolute; left: 12px; top: 13px; text-indent: -9999px; }
.schoolImportCheck .formLayout h3{ padding-left: 30px; font-size: 16px; color: #000;margin-top: 5px; }
.schoolImportCheck .formLayout button.removeFromMsg { border-color: #019bd0; }
.schoolImportCheck .formLayout button.removeFromMsg:after { content: ""; width: 20px; height: 20px; display: block; position: absolute; top: -2px; left: -2px; background-position: -212px -852px; }
.schoolImportCheck .formLayout .contactsTypeColumn div { margin-bottom:5px; }

.bulkImportInstructionMsg {font-family: 'focolight_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;display: block; font-size: 15px;text-align: left; color: #a1a0a0; line-height: 1.4;padding: 0 10px; position: relative; text-indent: 0;margin: -10px 0 5px 0;}
.status-error { display: block; color: rgb(232, 108, 108); padding: 5px 5px; }

.collapseTriggerLastStatus {display: block;position: relative;padding: 10px 25px 10px 10px;border-bottom: 1px solid #e4e5ed;line-height: 1.25;text-indent: 0; cursor: pointer;}
.collapseTriggerLastStatus:after { content:""; position: absolute;top: -2px;right: 12px;bottom: 0;border-right: 2px solid gray;border-bottom: 2px solid gray;height: 8px;width: 8px; margin: auto;transform: rotate(45deg); }
.open > .collapseTrigcollapseTriggerLastStatusger:after { transform: rotate(225deg); top: 3px; }
.exportManageTab { min-height: 35px; margin-top: 15px;}
.exportManageTab label {line-height: 35px;}
.exportManageTab label button {position: absolute; right: 10px;height: 35px;font-size: 16px !important; line-height: 1px !important; color: white !important;border: 1px solid #d3d3d3; padding: 0 12px; border-radius: 4px;}

.messageTrayIcon:after { content: ""; position: absolute; top: 0; bottom: 0; right: 6px; height: 8px; width: 8px; border-top: 2px solid #555; border-right: 2px solid #555; transform: rotate(45deg); margin: auto; }
.hideSidePanel .messageTrayIcon:after { display:none; }

.custom-slider.rzslider { height: 10px; font-size: 13px; }
.custom-slider.rzslider, .custom-slider.rzslider .rz-bar { height: 10px; }
.custom-slider.rzslider .rz-tick { height:15px; width:15px; }
.custom-slider.rzslider .rz-tick.rz-selected { background: #3db3d1; }
.custom-slider.rzslider .rz-tick { background: #d3d9e7; }
.custom-slider.rzslider ul li:nth-child(2n+2) span { top: 10px; }

.custom-slider.rzslider .rz-bar-wrapper .rz-bar.rz-selection { background: #53c8e6; }

span.rzslider-span.rzslider-selection-bar:before {content: '';height: 40px;top: 20px;width: 2px;background: #040404;position: absolute;}

span.rzslider-span.rzslider-selection-bar:after {content: '';height: 40px;top: 20px; width: 2px; background: #040404; position: absolute; right: 0;}

span.rzslider-span.rzslider-selection-bar > span:before {content: '';height: 2px;top: 43px;width: 100%;background: #040404;position: absolute;}

.custom-slider.rzslider .rz-bar-wrapper .rz-bar.rz-selection:after {content: 'Shared Account Access';position: absolute;text-align: center;left: 50%; top: 43px; transform: translateX(-50%);z-index: 2; background: #fff;padding: 6px 10px 3px;line-height: 1;}
.custom-slider.rzslider .rz-bar-wrapper .rz-bar.rz-selection:before {content: ""; width: 100%;left: 0;right: 0;border: 1px solid #ddd;height: 15px;top: 42px; position: absolute;border-top: 0;z-index: 1;}
span.rz-pointer.rz-pointer-min:before {content: ''; right: 100%;position: absolute; background: transparent !important;width: auto;height: auto;top: 53px; line-height: 1;}

.hideLow{}
.hideHigh{}

.highlightableRow > article > *:nth-child(2) { bottom: 10.5px !important;font-size: 13px;transform: translateX(-50%); background-color: #fff;z-index:3003;line-height : 1;}

.highlightableRow > article > *:nth-child(3) {bottom: 10.5px !important; font-size: 13px;transform: translateX(50%);background-color: #fff; z-index:3003;line-height : 1;}

.custom-slider.rzslider:before {content: '';position:absolute;bottom: -47px;background-color: #ddd;height: 1px;width: 100%;left: 0;z-index: 1;}
span.rz-pointer.rz-pointer-max:after {content: '';left: 100%; position: absolute;background: transparent !important;width: auto;height: auto; top: 53px;line-height: 1;}

span.rz-bar-wrapper {bottom-left : 1px solid;}

.custom-slider .rzslider .rzslider-pointer {    bottom: -2px;}

.rzslider-full-bar:before {content: '';height: 43px;top: 17px;width: 2px;background: #040404;position: absolute;left: 0;}

.rzslider-full-bar:after { content: ''; height: 43px;top: 17px;width: 2px; background: #040404;position: absolute;right: 0;}

.custom-slider .rzslider .rzslider-full-bar .rzslider-bar:before {content: '';height: 2px;top: 43px;width: 100%;background: #040404;position: absolute;}
.custom-slider.rzslider { width:98%; }
.custom-slider.rzslider ul li:last-child span {left: auto;right: 0; transform: none;text-align: right;}

.rzslider ul li .rz-tick-value { top: -37px; left:5px;}


.custom-slider.rzslider .rz-selection {  background: orange;}

.custom-slider.rzslider .rz-pointer {  width: 8px;  height: 20px;  top: auto; /* to remove the default positioning */  bottom: 0;  background-color: #333;  border-top-left-radius: 3px;  border-top-right-radius: 3px;}

.custom-slider.rzslider .rz-pointer:after {  display: none;}

.custom-slider.rzslider .rz-bubble {  bottom: 14px;}

.custom-slider.rzslider .rz-limit {  font-weight: bold;  color: orange;}

.custom-slider.rzslider .rz-tick {  width: 2px;  height: 20px;  margin-left: 4px;  border-radius: 0;  background: #ffe4d1;  top: -1px;}

.custom-slider.rzslider .rz-tick.rz-selected {  background: orange;}
.smallTitle { background: #f2f2f2;color: #666;display: block;text-indent: 15px;line-height: 30px;min-height: 30px; font-size: 14px;border-bottom: 1px solid #f2f2f2;border-top: 1px solid #f2f2f2; z-index: 2; overflow: hidden; text-overflow: ellipsis;white-space: nowrap;float: left; width: 100%; }
.formLayout .linkControl.drillDown { padding-left: 145px; text-indent: 10px; }
.contentEventRepeat section { background: transparent; border: 0 !important; box-shadow: none; }
.report-radio { text-align: left; }
.formLayout section .report-radio .highlightableRow { background: transparent; border: 0; display: inline-block; padding-bottom:0; }

.scrollView .report { background: white; border-top: 1px solid #e4e5ed;}
a.backButton.leftButton {float: left;}

.subCollapse { padding: 10px; border-top: 1px solid #e4e5ed; }
.subCollapse .staffDataList { border: 1px solid #e4e5ed; }
.subCollapse .staffDataList table tr td { border-top: 0;color:#5b5b5b; vertical-align:middle; }
.subCollapse .staffDataList table tr:last-child td { border-bottom: 0; }
.subCollapse .staffDataList table tr th { border-top:0; white-space: nowrap;}
.subCollapse .staffDataList .staffData + div { border-top: 1px solid #e4e5ed; }
.subCollapse .staffDataList .staffData:after { content:"+"; border: 0; transform: rotate(0); height: 15px; width: 15px; font-size: 20px; text-align: center; line-height: 19px; }
.subCollapse .staffDataList .staffData.active:after { content:"-"; top: -3px }

.calendar .fc-view-container .fc-day-grid-container, .calendar .fc-view-container .fc-time-grid-container { height:auto !important; }

.cols3 .col {width: 33%;}

.calendar .fc-view-container .fc-day-grid-container, .calendar .fc-view-container .fc-time-grid-container { height:auto !important; }
.cf:after{ content:""; display:table; clear:both; }
.healthOption { float: right; width: 130px;display: flex; align-items: center; min-width: 130px;padding: 0 20px;justify-content: space-between;}

.healthOption > span {display: block; text-align: center; width: 40px;min-width: 40px;padding: 10px 5px;}


.healthLabel { background: #fff;font-family: gotham;font-size: 15px;border-bottom: 1px solid #e4e5ed;padding: 0 30px 5px 10px;margin: 0 -15px 5px;line-height: 1.75; }
.editHealth .edit-health-btn {margin: 10px 0 0 0;padding: 10px 0 0 0; border-top: 1px solid #e4e5ed;}

.symptomsLabel { background: #fff; font-family: gotham; font-size: 16px; border-bottom: 1px solid #e4e5ed !important; padding: 8px 15px; margin: 15px 0 -10px; line-height: 1.75; position: relative; z-index: 1; }
.healthCare-form-title p { line-height:1.45; }
.symptomsCategory{padding: 7px 10px; min-height: 36px;box-sizing: border-box;display: flex; align-items: center;border-bottom: 1px solid #e8e8e8 !important;margin-right: -46px;}
.healthSymptomsLabel { background: #fff; font-family: gotham; font-size: 16px;  padding: 8px 15px;  line-height: 1.75; position: relative; z-index: 1; }
.btnDeleteHealth {position: absolute;top: 0;right: 0;line-height: 35px;background-position: -1290px -1020px !important;background-image: url(../images/sprite@2x.png) !important;background-size: 704px 2170px !important;font-size: 0;height: 40px;width: 40px;}

.redeemPointsSelection {
    text-align: -webkit-center;
}

.redeemPointsSelection .studentImage{
    height: 80px;
    border-radius: 50%;
    width: 80px;
    background-position: center;
    background-size: contain;
}

.redeemPointsSelection input{
    border-radius: 25px;
    width: 100px;
    height: 40px;
    border: 2px solid #1ca0c880;
    text-align: center;
    outline: none;
}
.classTypeIcon{
    width: 32px;
    height: 32px;
    position: absolute;
    right: 5%;
    top: 43%;
}

.classTypeIcon.cleverClass,.studentClassTypeIcon.cleverClass{
    background: url(../images/member-clever-icon.png) no-repeat right !important;
}

.classTypeIcon.googleClass,.studentClassTypeIcon.googleClass{
    background: url(../images/google-icon.png) no-repeat right !important;
}

.classTypeIcon.classLinkClass,.studentClassTypeIcon.classLinkClass{
    background: url(../images/classlink-icon.png) no-repeat right !important;
}

.classTypeIcon.powerSchoolClass,.studentClassTypeIcon.powerSchoolClass{
    background: url(../images/power-school-icon.png) no-repeat right !important;
}

.classTypeIcon.sftpClass,.studentClassTypeIcon.sftpClass{
    background: url(../images/member-sftp-icon.png) no-repeat right !important;
}

.classTypeIcon.bloomzClass,.studentClassTypeIcon.bloomzClass{
background-image: url(../images/sprite@2x.png?20180314);
        background-position: -91px -8px;
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        border: none;
        width: 32px;
        height: 32px;
        top: 8px;
        left: 8px;
        background-size: 564px 1870px;
}

.behaviorReportThWidth {/*width: 14vw;min-width: 14vw;max-width: 14vw*/ width: fit-content; width: -webkit-fill-available; min-width: 1vw;max-width: 11vw}
.studentClassInfo{
    width: 60%;
    white-space: nowrap;
    overflow: hidden;
    font-size: 13px;
    display: block;
    text-overflow: ellipsis
}

.reportInlineMenu {
    text-align: right;
    display: flex;
    align-items: center;
    justify-items: end;
}

.addParentsGuardiansIcon{
    width: 10px !important;
    height: 10px !important;
    margin-left: 3px !important;
}

span.choose-report-title {
    margin-left: auto;
    font-weight: 600;
    opacity: 0.4;
}

.healthReportNoRecordMsg{padding: 10px;}

.sticky-col {
  position: -webkit-sticky !important;
  position: sticky !important;
  z-index:2;
}

.first-col {
  width: 50px;
  min-width: 100px;
  max-width: 500px;
  left: 0px;
}

.second-col {
  width: 50px;
  min-width: 100px;
  max-width: 550px;
  left: 100px;
}

.studentSignaturePadding{padding-left:77px !important;}

.classSummaryBox {padding-left : 50px !important;}

.citizenAddress .addressDisplay{
    padding: 0 10px 0 60px;
    font-size: 14px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 80%;
    position: absolute;
}

.selectStyles select,
.addressDisplay{
    color: #666;
    font-size: 14px;
}
.behaviorReportDownloadButton{ right: 10px;height: 35px;line-height: 1px !important;color: #fff;border: 0;box-shadow: 3px 3px 7px rgba(0,0,0,0.1);padding: 0 20px;border-radius: 50px;font-weight: bold;float:right;margin:5px 0;}

.behaviorReportDownloadButtonDiv {margin-top: 20px;    text-align: right;    margin-bottom: 10px;}

.formLayout section .healthDetail div {border-bottom: 1px solid #e4e5ed;color: #666;position: relative;padding: 12px 15px 12px 40px; line-height: 25px; text-indent: 0;font-size: 15px;font-family: 'Gotham-book';}

.healthReportAnchor { color: #1ca0c8;text-decoration: underline;}

.healthReportDetail-img { width:35px !important;height : 35px;margin-top : 10px;}

.healthReportDetail-span {position: absolute;    padding-top: 8px !important;    padding-left: 19px;}

.pickerLoadMoreEntries {margin-top : 0px !important;}
.thEngagementBox h5 { margin: 0 0 10px 0; font-size: 16px;}

.thEngagementBox .staffTable-head-ico-box {font-size: 15px;    margin-bottom: 10px;}
.thEngagementBox .staffTable-head-ico-box span{ min-width: 30px;font-size: 16px;}
.thEngagementBoxVerticalAlign {vertical-align: top;}

.deletedGroupSnippet{ opacity: 0.4;    pointer-events: none;    color : gray !important;}

.importCleverButtonLink{text-decoration: underline;color: #53c8e6;float: right;}

.recipientPickerGroupSelectAll {margin-top:-30px !important;}

.award-flag-box:after {  content: "";    position: absolute;    left: 2px;    right: 0;    bottom: -14px;    height: 20px;    width: 20px;    background: #fff;    transform: rotate(45deg);}

.award-flag-box { display: inline-block;    width: 24px;    height: 36px;    position: relative;    overflow: hidden;}

.reportIconBox {     flex: 0 0 25%;   max-width: 25%;    padding: 0.5%;    cursor:pointer;    }
.reportIconBox > div { border: 1px solid #e0e0e0;   border-radius: 5px;    font-size: 20px;    background: #fff;    font-family: focobold;    font-weight: normal;    box-sizing: border-box;    color: #4c4a4a;    position: relative; }
.reportIconBox img { width : 100%; height:auto;}
.reportIconSelection {    grid-template-columns: 50% 50%;    justify-items: center;    display: flex;    flex-direction: row;    flex-wrap: wrap;    justify-content:center;    margin: 0 auto;    padding: 0.5%;    max-width: 1000px;   width: 100%;}

.reportIconBox span {    position: absolute;    z-index: 1;    text-align: center;    left: 0;    right: 0;    bottom: 0;    background: rgba(255,255,255,0.85);    padding: 10px;    font-size: 18px;    min-height: 60px;    display: flex;    align-items: center; justify-content: center; border-top:1px solid #e0e0e0;}

.reportBackLink{  color: #53c8e6;    float: left;padding-left : 45px;margin-top:5px;}

.reportGroupAllBackLink{ color: #53c8e6;    float: left;padding-left : 45px;margin-top:5px;}


.reportBackArrow{  font-size:24px;position : relative;display:inline-block;top:2px;}
@media screen and (max-width:1200px){
    .reportIconBox { flex: 0 0 33.333333%;   max-width: 33.333333%; }
}
@media screen and (max-width:575px){
    .reportIconBox { flex: 0 0 50%;   max-width: 50%; }
}

.remove{background: #C76868;color: #FFF;font-weight: bold;font-size: 21px;border: 0;cursor: pointer;display: inline-block;padding: 4px 9px;vertical-align: top;line-height: 100%;}
ul.filter-group { margin:0 0px; padding:0; list-style:none;}

ul.filter-group li{margin:0 -10px; position: relative; padding-right: 40px; }

ul.filter-group li:after{content:""; display:table; clear:both;}
ul.filter-group li:last-child{margin-bottom:0;}
ul.filter-group li > div{float:left; width:33.333333%; padding:5px 10px;}
.filter-group .custom-select, .filter-group .form-control { border:1px solid #ddd; background:#fff; border-radius:5px; width:100%; min-height:32px;}
.filter-group .custom-select:after{ z-index:2;}
.filter-group .custom-select select {
    background: transparent;
    border: 0;
}
.filter-group li .btn.btn-danger {
    position: absolute;
    height: 30px;
    width: 30px;
    top: 5px;
    right: 10px;
    background: #e86c6c;
    border: 0;
    color: #fff;
    border-radius: 5px;
    font-size: 20px;
    line-height: 30px;
}
.add-field-box { text-align: right; margin: 5px 10px; }
.add-field-box .add-field-btn { font-size: 14px; color: #fff; height: 32px;
width: auto;
    white-space: nowrap;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
    padding: 0 20px;
    border-radius: 50px;
    font-weight: bold;
    font-family: gotham; border:0;}
.filter-group-box {
    margin: 15px 0;
}
.filter-group-box h5 {
    margin: 0 0 4px;
    font-size: 15px;
}
.pagination-count{float:right;padding-right : 12px;}

.loadCount{text-align: center;background: white;height: 70px;padding-top: 15px;border-bottom: 10px solid #e4e5ed}
.selectionCountText{padding-right : 15px;}
.selectionCountLink {color: #53c8e6;font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;}


.award-flag-box {
    display: inline-block;
    width: 24px;
    height: 36px;
    position: relative;
    overflow: hidden;
}

.classTypeIconInvited {
    width: 30px;
    height: 30px;
    position: absolute;
    right: 5%;
    top: 4%;
}
.backPowerSchool{    display:block !important;}

.collapseTrigger.sftp-icon,.classOrigin.sftpIcon {
    background: url(../images/sftp-icon.png) no-repeat left !important;
}

.collapseTrigger.google-classroom-icon,.classOrigin .googleClassroomIcon{
    background: url(../images/google-icon.png) no-repeat left !important;
}

.collapseTrigger.clever-icon,.classOrigin.cleverIcon {
    background: url(../images/Logo@1x.png) no-repeat left !important;
}

.collapseTrigger.power-school-icon,classOrigin.powerSchoolIcon {
    background: url(../images/power-school-icon.png) no-repeat left !important;
}


.collapseTrigger.classlink-icon,.classOrigin.classlinkIcon {
    background: url(../images/classlink-icon.png) no-repeat left !important;
}

.collapseTrigger.sftp-icon {
    background: url(../images/sftp-icon.png) no-repeat left !important;
}

.collapseTrigger.bulkImport-icon,.classOrigin.bulkImportIcon {
    background: url(../images/bulkImport-icon.png) no-repeat left !important;
}

.date-filter{
    padding-right: 30px !important;
    position: relative;
    margin-left: 50px;
}

.date-filter:before{
    content: '';
    display: block;
    height: 35px;
    width: 44px;
    position: absolute;
    background-position: -73px -124px;
    left: -44px;
    top: 5px;
}

.filter-by-options{
    width: 70%;
    display: flex;
    font-size: 14px;
    font-weight: 600;
    justify-content: flex-end;
    line-height: 3em;
}

.filter-by-options div{
    width: auto;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    color: #212121;
    margin-left: 5px;
    font-size: 12px;
    max-width: 50%;
}

.filter-by-options span{
    padding: 7px 10px;
    background: #c3c3c3;
    border-radius: 15px;
    margin-right: 5px;
    cursor: pointer;
}

.filter-by-options span.selected{
    color: white;
    background-color: #53c8e6;
}

.queueList{
    display: grid;
    grid-gap: 20px;
    height: 200px;
    grid-auto-flow: column;
    grid-auto-columns: 33%;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 10px;
}

.queueList > div{
    background: white;
    border-radius: 10px;
    position: relative
}

.queueList h1{
    padding: 0;
    font-weight: 900;
}

.post-body{
    max-height: 70px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.15;
}

.post-body p{
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin: 0;
}

.queueList .postImage{
    background-size: cover;
    color: white;
    z-index: -2;
}

.queueList .postImage::after{
    content: "";
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1;
    height: 100%;
    background-color: #2121218f;
    border-radius: 10px;
}

.post-queue-footer{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    position: absolute;
    width: 100%;
    bottom: 0;
    padding: 5px;
    background: #e86c6c;
    border-radius: 0 0 5px 5px;
    color: white;
}

.dashboardChart {background: #FFFFFF;border: 1px solid #DEDEDE;box-sizing: border-box;border-radius: 8px;}
.dashboardChartTitle {margin-top: 18px;margin-left: 20px;display: inline-table;}
.dashboardChartTitle img{width: 20px;height: 20px;background-size: cover;background-color: #373842;position: absolute;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;}
.dashboardChartTitle span{margin-left: 44px;font-family: Gotham;font-style: normal;font-weight: 500;font-size: 15px;line-height: 18px;}
section.summaryCharBox {display: table;width: 100%;}
.summaryCharBox .data{display: inline-flex;padding: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 0;width: 100%;justify-content: space-between;}
.summaryRow {width:100%;}.summaryColumn {float: left;width: 50%; padding: 5px;}
.summaryRow :after {content: "";display: table;clear: both;}
@media screen and (max-width: 1199px) { .summaryColumn { width: 100%;  } }
@media screen and (max-width: 600px) {  .summaryColumn { width: 100%;  }}.dashboardChart:after {content: ".";display: block;clear: both; visibility: hidden;}
.summaryColumn ul{margin: 0;padding: 0;list-style: none;font-family: Gotham;font-style: normal;font-weight: bold;font-size: 14px;line-height: 17px;}
.summaryColumn ul li{padding-bottom:15px;}
.summaryColumn .title{font-family: Gotham;font-style: normal;font-weight: bold;font-size: 18px;line-height: 22px;text-align: center;text-transform: uppercase; margin-bottom: 15px;}
.districtDashboardChartDescriptions{    width: 25px;    height: 12px;    border-radius: 10%;    display: inline-block;    margin-right: 10px;}
.alterFill{background: #FF6D68;}
.postFill{background: #FF32E0;}
.announcementsFill{background: #BF534F;}
.attendanceAlertsFill{background: #FFC843;}
.phoneCallsFill{background: #009638;}
.emailsFill{background: #5E96DC;}
.textMessagesFill{background: #0071CE;}
.pushMessagesFill{background: #FF8C05;}
.notContactableFill{background: #FF0000;}
.sentList {height: 238px;background: #FFFFFF;margin-bottom: 20px;padding : 15px;}
.sentList .titleList {font-family: Gotham;font-style: normal;font-weight: 500;font-size: 15px;line-height: 18px;opacity:0.5;}
.sent-title{font-family: Gotham;font-style: normal;font-weight: bold;font-size: 20px;line-height: 24px;margin-top: 5px;}
.sent-body{height: 75px; overflow: hidden;text-overflow: ellipsis;line-height: 1.15;}
.sent-body p{display: -webkit-box;-webkit-line-clamp: 3; -webkit-box-orient: vertical;margin: 0;}
.sent-icon{width: 35px;height: 35px;background: #16D5E9;box-shadow: 0px 4px 10px rgba(22, 213, 233, 0.5);border-radius: 10px;display: block;text-align: center;cursor:pointer;}
 .sent-icon img{ margin-top: 10px; width: 15px;height: 15px; margin-left: 10px;}

.flex-row { margin-left:-10px; margin-right:-10px; display: -ms-flexbox;    display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.flex-col { padding-left:10px; padding-right:10px; margin-bottom:20px; }
.flex-col.col-1-2 { -ms-flex: 0 0 50%;flex: 0 0 50%;max-width: 50%;}
.flex-col .sentList { height:100%; width:100%; margin:0; cursor:pointer;    position: relative;padding-bottom: 45px;}
@media screen and (max-width: 1199px) {
    .flex-col.col-1-2 { -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
    .flex-col { margin-bottom:10px; }
 }

 .sent-description {padding-right: 110px;display: flex;flex-direction: column;position:relative; width:100%; }
.signature-box {margin-top: auto;}
.sentList .sent-action { position: absolute;top: 15px;right: 15px;bottom: 15px; width: 160px;display: flex; flex-direction: column;}
.action-btn { display: flex;align-items: end;justify-content: flex-end;margin-top: auto;}
.action-label { position: absolute;width: 103px;height: 35px; font-family: Gotham;font-style: normal;font-weight: bold;font-size: 15px;line-height: 18px;color: #FFFFFF; background: #FF6D68;float:right;right:0; }
label.label-box.alertLabel {background:#FF6D68;}
label.label-box.announcementsLabel {background:#49AAEC;width:155px;}
label.label-box.announcementsLabel:after {border-top-color: #3999db;}
label.label-box.autoNoticesLabel {background:#666;}
label.label-box.autoNoticesLabel:after {border-top-color: #666;}
label.label-box.deletedPostLabel {background:red;}
label.label-box.deletedPostLabel:after {border-top-color: red;}
.label-box {padding: 0;display: block;background: #ed7b1b;position: relative;color: #fff;font-family: 'Gotham';font-size: 15px;width: 120px;height: 35px;text-align: center;line-height: 35px;float: right;right: 0;margin-right: -22px;font-weight: bold;}
.label-box::after {content: "";position: absolute;top: 100%;right: 0;height: 0;width: 0;border-top: 10px solid #ae5c17;border-right: 11px solid transparent;}
.sent-history{padding-top: 45px;padding-left: 35px;font-family: Gotham;font-style: normal;font-weight: 500;font-size: 14px;line-height: 17px;}
.sent-history .send{color: #D7A530;}
.sent-history .received{color: #49AAEC;}
.sent-history .read{color: #5CB85C;}
.sent-history .responses{color: #666;}
span.sharedWith.activityType.sharedWithMaxWidth.dashboard {ont-size: 14px;color: #8e8e8e;vertical-align: middle;height: 16px;display:inline;}
.sent-description-top {display: flex;}
article .signature-box .hgroup {
    margin-right: 0;
}
.postDeliveryReport{
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
}

.postDeliveryReport > div{
    width: 50%;
    justify-content: center;
    margin: 10px;
}

.postDeliveryReport > div{
    font-size: 14px;
    line-height: 1.5;
}

.postDeliveryReport h1{
    padding: 0 !important;
    margin: 0!important;
    text-align: center
}

#deliverabilityReport h1{
    color: black !important;
    margin-bottom: 10px;
}

#base{
    background-color: white;
}

.postSharedWith{
    align-items: center;
    display: flex;
    padding-left: 40px;
}

.postSharedWith .shareFacebook::after,
.postSharedWith .shareTwitter::after,
.postSharedWith .shareWebRss::after{
    content: '';
    width: 24px;
    height: 24px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    margin: 5px 0px 0 5px;
}

.delivery-report-searchBar{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.delivery-report-searchBar .communityManageSearchBar{
    width: 100%;
    margin-top: 0;
}

.delivery-report-filter .filter-by-options{
    justify-content: flex-start;
}

.delivery-report-filter .filter-by-options div{
    max-width: 100%;
}

.table-container{
    display: block;
    width: 100%;
}

.flex-table{
    display: flex;
    flex-flow: row nowrap;
    transition: 0.5s;
    text-align: center;
    background: white;
}

.flex-table:first-of-type{
    border-top: solid 1px #1565C0;
}

.flex-table:first-of-type{
    background: #53c8e6;
    color: white;
    border-color: #53c8e6;
    word-break: break-word;
    font-weight: 600;
}

.flex-table:not(.header):hover {
    background: #F5F5F5;
    transition: 500ms;
}

.flex-table div{
    width: -webkit-fill-available;
    width: -moz-fill-available;
    width: fill-available;
    padding: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-bottom: solid 1px #d9d9d9;
}

.color-legend {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
    width: 70%;
}

.color-legend-desc{
    display: inline-flex;
    align-items: center;
    margin: 0 10px;
    font-size: 12px;
}

.color-legend-desc img{
    padding-right: 10px;
}

.optionListing.circleThumbnail.roleDistrictAdmin:before {
    background-image: url(../images/district-admin.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleDistrictCommunityMember:before {
    background-image: url(../images/district-community-members.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleDistrictOfficeAdmin:before {
    background-image: url(../images/office-admin.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleDistrictStaff:before {
    background-image: url(../images/district-staff.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleGroupAdmin:before {
    background-image: url(../images/group-admin.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleSchoolCommunityMember:before {
    background-image: url(../images/school-community-members.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleSchoolOfficeAdmin:before {
    background-image: url(../images/school-office-admin.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleSchoolsStaff:before {
    background-image: url(../images/school-staff.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleAttendanceClerk:before {
    background-image: url(../images/attendance-clerk.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

.optionListing.circleThumbnail.roleFoodServicesCoordinator:before {
    background-image: url(../images/food-service.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

    margin-left: -3px;
    margin-top: 2px;
}

.communityManageContent.peopleListing .invitedSectionManage .verticalList .hgroup  >div > h2 {
    margin-top: 2px !important;
    text-indent: 10px;
    width: auto;
}
.peopleListing .formLayout section .hgroup.parentsInvite:not(.importCleverClass) button {
    height: 20px;
    width: 20px;
    border-width: 2px;
    border-radius: 50px;
}
.peopleListing .formLayout section .hgroup.parentsInvite:not(.importCleverClass) button.buttonIsSelected { border-color:#53c8e6; }

.communityManage .itemsListWrapper .loadMoreEntries:not(.loadMoreEntries-bottom){
    top: 0;
}

.schoolImportCheck .formLayout .cf button.addToMsg, .schoolImportCheck .formLayout .cf button.removeFromMsg {
    float: left;
    top:0;
}

.contentsToBeImported div .cf span {
    display: inline;
    overflow: hidden;
    text-indent: 0;
    line-height: 1.3;
    vertical-align: middle;
}

.manageInvitedStaffDetails {
    position: absolute;
    font-size: 14px;
    color: gray;
    line-height: 15px;
    display: inline-block;
    left: 66px;
    margin-top: 5px;
}

.manageInvitedStaffDetails ul {
    list-style: none;
    position: relative;
    top: 10px;
    left: 15px;
}

.peopleListing .emailPhone-invitedPeople{
    margin-top: -10px;
}

.peopleListing .emailPhone-invitedPeople h4 {
    text-indent: 71px;
    margin: 0;
    font-size: 15px;
    line-height: 20px;
    margin-left: 36px;
}

span.displayShareText {
    display: flex;
    align-items: center;
}

.recipient-textOverflow{
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.noChart{text-align:center;padding:30px; 10px;}

.sent-title span {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sendBoxWithoutImage{
width: calc(100% + 17px);
    padding-right: 10px;
}


.sendBoxWithImage{
width: calc(100% - 130px);
    padding-right: 20px;
}

.recipients-text-overflow{
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100px;
}


.districtDashboardChartDescriptions.sendFill {
    background: #FED166;
}


.districtDashboardChartDescriptions.sendFill {
    background: #FED166;
}

.districtDashboardChartDescriptions.receivedFill {
    background: #53C8E6;
}

.districtDashboardChartDescriptions.readFill {
    background: #5CB85C;
}

.cleverContactsCategory{
    margin-left: 45px;
    border: none;
    font-size: 15px !important;
}

.cleverContactsCategory select{
    padding: 0 40px;
    border: 1px solid gray;
    border-radius: 5px;
    -webkit-appearance: menulist;
    width: auto;
}

.cleverContactsCategory select:focus{
    -webkit-appearance: menulist;
    border: 1px solid gray !important;
}

.actionAsterisk{
    color: red;
    font-weight: bold;
}

.dialogHeaderTooltip{
    background: #fdf8e4 !important;
    padding-right: 5px !important;
    border-bottom: 1px solid #e4e5ed !important;
    margin-bottom: 1px;
    font-size: 13px !important;
    margin: 0 0 15px 0;
    padding-left: 10px !important;
    line-height: 20px;
    font-weight: normal !important;
}

.bulkImportTooltip{
    background: #fdf8e4 !important;
    padding-right: 5px !important;
    border-bottom: 1px solid #e4e5ed !important;
    margin-bottom: 1px;
    font-size: 13px !important;
    margin: 0 0 5px 0;
    padding-left: 10px !important;
    line-height: 35px;
    font-weight: normal !important;
}

.fitWidthBlueButton {
    width: auto !important;
}

.bulkImportButtons h1 {
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    padding: 0;
    margin-left: 0;
    font-size: 17px;
    font-weight: normal;
    padding-top: 10px;
    margin-bottom: 10px;
    text-indent: 2px;
    color: #6d6d72;
}

.chooseBulkImportUpload {
    position: relative;
    display: inline-block;
    color: #7f7f7f;
    margin-top: 2px;
    background: white;
    cursor:pointer;
}
.chooseBulkImportUpload input[type="file"]{
    -webkit-appearance:none;
    position:absolute;
    top:0;
    left:0;
    opacity:0;
    width: 100%;
    height: 100%;
}
.recipientPickerCtrl .peopleListing .formLayout section.profileWithChildren .hgroup.chevronIcon.importCleverClass:after {
    display: block;
}

.pickerNoteText{
    color: #555;
    padding-bottom: 5px !important;
    text-align: right;
    font-size: 14px;
    text-decoration: underline;
}

.emailPhone.emailPhoneManageTab.emailPhoneParentTab {
    position: relative;
}

.emailPhone-invitedPeople.invitedEmail {
    position: relative;
}

.attendanceOptionLink{text-decoration: underline;    color: #53c8e6;    float: right;    margin-bottom: 10px;}

.AttendanceReportTable table th { border-bottom: 1px solid black; padding: 10px 15px !important; background:#fff; border-right: 0 !important; border-left: 0 !important; }
.AttendanceReportTable table td { padding: 10px 15px !important; background:#fff; border-right: 0 !important; border-left: 0 !important; color: black !important;    font-weight: 600;}
.AttendanceReportTable table th {  background: #f0f2f4; text-align:left; }
.AttendanceReportTable table th:last-child { /*min-width: 150px;*/ }
.AttendanceReportTable table td { cursor:pointer; }
.AttendanceReportTable table td { font-size:15px; text-align:left; }
.AttendanceReportTable table th:first-child, .AttendanceReportTable table td:first-child { text-align:left; white-space: normal; }
.AttendanceReportTable { position: relative; width: 100%; overflow: auto; border: 1px solid #e4e5ed; }
.AttendanceReportTable table,  .AttendanceReportTable tbody tr:nth-child(odd) { background:transparent; }
.AttendanceReportTable table  th { background:white; border-color: 1px solid black; font-family: 'focoreguar', Helvetica, sans-serif; font-weight: normal; font-weight: 600; }
.AttendanceReportTable table { width:100%; border: 0; border-spacing: 0; overflow:auto;}
.AttendanceReportTable table td:first-child.reportIco { text-align: center; width: 80px; }


.attendance-report{
    display: flex;
    justify-content: center;
    width: 100%;
}

.attendance-report span{
    padding: 0 10px;
}

.attendance-report .datePicker span:first-of-type{
    text-decoration: underline;
}

.AttendanceReportTable tbody tr:nth-child(odd) td {    background-color:#f3f2f1;}

.attendance-report-header {font-size:22px;}
.classPicker.classPickerDayCare.selectGroups-icon {
    position: relative;
    padding-right: 35px;
}

.classPicker.classPickerDayCare.selectGroups-icon:after {
    content: "";
    position: absolute;
    top: -4px;
    bottom: 0;
    margin: auto;
    right: 15px;
    height: 8px;
    width: 8px;
    border-bottom: 2px solid #000;
    border-right: 2px solid #000;
    transform: rotate(45deg);
}
.selectionExpressionBorder{
    border: 1px solid red !important;
}
.profileSignatureLimit{
    cursor: pointer;
    color: white;
    text-decoration: underline;
    font-size: 15px;
    font-weight: bold;
}

span.profileM.picker img {
    width: 40px !important;
}

.validationMsg.msgForSetting.whenToNotifyColor {
    color: #666;
}

.studentItemList {
    display:flex;
    justify-content: space-between;
}

.studentBasicInfo {
    width: 340px;
    min-width: 340px;
    padding-right: 25px;
}
.manageStudentsBasicDetails{
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    margin-top: 2px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.parentsGuardiansLabel,.studentIDLabel,.studentEmailLabel,.studentPhoneLabel,.studentParentLabel{
     color: #8D8D8D;
}

.addParentsGuardians,.studentEmail,.studentPhone,studentParentValue{
color: #1ca0c8;
}

.studentPersonalInfo{
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color:#8D8D8D;
    margin-top: 3px;
}

.manageStudentPersonalInfo {
    width: 230px;
    min-width: 230px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    vertical-align: top;
    padding: 15px 5px;
}
.manageStudentPersonalInfo ul{

    list-style: none;
    position: relative;
    padding: 0;
    margin-top: 0;
}


.studentRole{
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 30px;
    color: #000000;
    text-align: center !important;
    width: 120px;
    height: 28px;
    background: #E6E6E6;
    border-radius: 20px;
    text-align: center;
    padding-top: 7px;
    margin-top: 5px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0 10px;
}

.studentVerificationInfo ul{
    list-style: none;
    position: relative;
    padding: 0;
    margin: 0;
}

.studentClassTypeIcon {
    width: 32px;
    height: 32px;
    margin-right: 28px;
    top: 43%;
}

.searchMemberContainer .search-child{
    display:flex;
}

.searchMemberContainer .search-child select {
    background: transparent;
    border-radius: 5px;
    border: 1px solid #dedede;
    height: 22px;
    border: 1px solid #000000;
    box-sizing: border-box;
    border-radius: 2px;
}

.communityManageFilterArea {
    display:flex;
    padding-bottom: 10px;
    margin-top: -15px;
}

.communityHeaderAction {
    display:flex;
}

.headerActionIcon {
    padding: 15px;
    cursor: pointer;
}

.sortByLabel{
    width: 61px;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    padding-top: 3px;
}

.selectedStudent{
    background: #DCF0F7 !important;
}

.hgroup.itemListBox {
    border: 1px solid #D9D9D9 !important;
    box-sizing: border-box !important;
}

.filterItemList {
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.filterLabel {
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #676767;
    width: 25%;
}

.filterContainer{
    width: calc(62% - 70px);
    background: #FFFFFF;
    border: 1px solid #C7C7C7;
    box-sizing: border-box;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    position: absolute;
    z-index: 999999;
    right: 3%;
    top: 62px;
}

.filterSelection {
    width: 25%;
}

.filter-dropdown{
    width: calc(100% - 30px);
    height: 36px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #b9b7b7;
    margin-left: 20px;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
}

.filter-textbox{
    width: calc(100% - 30px);
    height: 36px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #b9b7b7;
    margin-left: 20px;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
}


.filterValue{
    width:50%;
}

.filter-button{
    width: 120px;
    height: 44px;
    background: #53C8E6;
    border-radius: 4px;
    border: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #FFFFFF;
}

.filterItemList.button {
    float: right;
    padding-top: 30px !important;
    padding-right: 20px;
    padding-bottom: 45px;
}

.filterAction{
    vertical-align: middle;
    padding-left: 25px;
    padding-bottom: -11px;
    margin-bottom: 1px;
}

.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 20px 0;
  border-radius: 4px;
}
.pagination > li {
  display: inline;
}
.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  text-decoration: none;
  background-color: transparent;
  border: 1px solid #1CA0C8;
  font-family: Gotham;
  font-style: normal;
  font-weight: bold;
  font-size: 12px;
  line-height: 14px;
  color: #1CA0C8 !important;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
  margin-left: 0;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
  color: #2a6496;
  background-color: #eee;
  border-color: #ddd;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 2;
    color: #fff !important;
    cursor: default;
    background-color: #1CA0C8;
    border-color: #428bca;
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 14px;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {

   cursor: not-allowed;
   background-color: transparent;
    border: 1px solid #1CA0C8;
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 14px;
    color: #1CA0C8 !important;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
  padding: 10px 16px;
  font-size: 18px;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
  padding: 5px 10px;
  font-size: 12px;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.pagination>li>a, .pagination>li>span { border-radius: 50% !important;margin: 0 5px;}

.bottom-pagination {display: flex;justify-content: space-between;}

.bottom-pagination .pagination-selection{margin: 20px 0; padding-right: 80px;}

.itemPerPage-label {
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 14px;
    color: #545454;
    padding-right: 20px;
}

.parentsGuardiansValue{
    width: 200px;
    word-break: break-all;
    word-wrap: break-word;
    white-space: pre-line;
}

.manageMemberDetails {
    position: relative;
    font-size: 14px;
    color: gray;
    left: 15px;
    top: -29px;
}

.pagination-button{
    width: 32px;
    height: 32px;
    background: #E9E4E4;
    border-radius: 50px;
    justify-content: center;
    display: flex;
    align-items: center;
}

.pagination-img{
    width: 14px;
    height: 14px;
}

.offset-label{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    padding-left: 22px;
    padding-right: 22px;
    padding-top: 8px;
}

.paginationDiv{
    display:flex;
    margin-top: 10px;
}

.pagination-img.pagination-leftArrow {
    transform: rotate(179.71deg);
}

.communityManageHeaderDiv{
    display: flex;
    justify-content: space-between;
}

.editProfileShow {
    padding-right: 310px;
    overflow-y: scroll;
}


/*************************************************
*  Hide/Show Profile Tray
*************************************************/
#_userProfileEditMode,
.showSidePanel #_userProfileEditMode{
    display:block;
}
.hideSidePanel #_userProfileEditMode{
    display:none;
}
.hideSidePanel div#messageTrayIcon{
    width:36px;
    height:44px;
}
.hideSidePanel div#messageTrayIcon:before{
    background-color:transparent;
    border-left:1px solid transparent;
}
.showSidePanel #_userProfileEditMode .sidePanel,
.showSidePanelMobile #_userProfileEditMode .sidePanel{
    animation: SlideLeftIn .4s;
    -webkit-animation: SlideLeftIn .4s;
    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;
}
.memberContentArea{
    background: #F7F7F8;
    border: 1px solid #CECFD5;
    box-sizing: border-box;
    padding-top: 15px;
    padding-left: 12px;
    padding-right: 12px;
    padding-bottom: 15px;
}

.memberContentArea .label{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 19px;
    color: #000000;
}

.memberDetailHeader{
    display: flex;
    justify-content: space-between;
}

.memberProfilePhoto{
    justify-content: center;
    display: flex;
}

.memberProfilePhoto img{
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    position: absolute;
    cursor: pointer;
    object-fit: cover;
    position: static;
    margin-top: 15px;
    margin-bottom: 5px;
}

.memberOption{
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
}

.memberOption:before{
    content: '';
    position: absolute;
    bottom: 50%;
    border-bottom:1px solid #D3D3D3;
    width: 100%;
    z-index:0;
}

.memberOption-button {
    width: 30px;
    height: 30px;
    background: #FFFFFF;
    border: 1px solid #D3D3D3;
    box-sizing: border-box;
    z-index: 9;
    border-radius: 50px;
    text-align: center;
    display: flex;
    margin-left: 12px;
    cursor: pointer;
}

.memberOption-button img{
    width: 16px;
    height: 16px;
    margin: auto;
}

.memberInputArea {
    display: flex;
    flex-direction: column;
    clear: both;
}

.memberInputArea input,.memberContactInfoArea input,.memberInputArea select{
    height: 20px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #b9b7b7;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #00000;
    margin-top  : 5px;
    width: 100%;
    margin-top: 5px;
}

.memberInputArea label{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: #919191;
    margin-top: 5px;
}

.memberInputArea input:focus,.memberContactInfoArea input:focus {
   height: 20px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #147DF9;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #00000;

}

.memberInputArea input:focus + label {
    color:red;
}

.memberRoleArea{
    margin-top: 12px;
}

.memberRoleArea span {
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #504F4F;
}

.memberGradeArea{
    margin-top: 9px;
}

.memberGradeArea span{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #504F4F;
}

.memberContactInfo{
    margin-top: 18px;
}

.memberContactInfo span{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #292929;
    margin-top: 18px;
}

.memberContactInfoArea{
    margin-top: 11px;
}

.memberContactInfoArea span{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #171717;
}

.memberContactPhoneArea, .memberParentsContainer{
    display: flex;
    justify-content: space-between;
}

.addPhoneNumberIcon{
    width: 12px;
    height:12px;
    cursor: pointer;
}

.memberFieldIcon{
    position: absolute;
    left: 91%;
    cursor: pointer;
}

.memberPhone{
    padding-top: 10px;
}

.memberAppUrl{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #171717;
}

.memberNotificationInfo{
    margin-top: 13px;
}

.memberNotificationInfo span{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #3F3F3F;
}

.memberNotificationArea input[type="checkbox"] {
    width: 18px;
    height: 18px;
    border: 2px solid #202020;
    box-sizing: border-box;
    border-radius: 3px;
}

.memberNotificationLabelActive{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #202020;
    margin-top: 5px;
}

.memberNotificationLabelInActive{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #504F4F;
    margin-top: 5px;
}

.memberNotificationArea{
    display: flex;
}

.notificationContent {
    display: flex;
    flex-direction: column;
    margin-right: 30px;
    margin-top: 8px;
}

.memberEmailDigestInfo{
    display: flex;
    margin-top: 17px;
}

.memberEmailDigestInfo span{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #3F3F3F;
}

.memberEmailDigestInfo .inputDiv{
    display: flex;
    margin-left: 15px;
    vertical-align: middle;
    margin-top: -2px;
}

.memberNotificationArea input[type="checkbox"]{
    width: 16px;
    height: 16px;
    border: 2px solid #202020;
    box-sizing: border-box;
    border-radius: 3px;
}

.memberEmailDigestLabelActive{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #202020;
    margin-left: 6px;
}

.memberEmailDigestLabelInActive{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #504F4F;
    margin-left: 6px;
}

.memberEmailDigestContent {
    margin-right: 8px;
}

.memberParentsInfoArea,.membershipInfoArea, .memberMetaInfoArea {
    margin-top: 15px;
}

.memberParentsContainer span,.memberMetaInfoArea span{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #3F3F3F;
}

.parentDiv{
    margin-top: 7px;
}

.parentDiv a{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #1CA0C8;
}

.parentDiv div a{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #1CA0C8;
    margin-top: 7px;
}

.membershipInfoArea span{
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #3F3F3F;
}

.metaInfoContainer{
    margin-top: 7px;
    -webkit-user-select: text !important;  /* Chrome 49+ */
    -moz-user-select: text !important;     /* Firefox 43+ */
    -ms-user-select: text !important;      /* No support yet */
    user-select: text !important;          /* Likely future */
}

.memberMetaInfoArea .metaLabel{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #171717;
}

.memberMetaInfoArea .metaValue{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #504F4F;
}

.memberDetailHeader a{
    cursor: pointer;
}

.deletedActionSnippet{
    opacity: 0.4;
    pointer-events: all;
}

.filter-clear{
    width: 120px;
    height: 44px;
    color: #53C8E6;
    border-radius: 4px;
    border: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    background: #FFFFFF;
    border: 2px solid #53c8e6;
    margin-left: 10px;
}

.filterDiv {
    height: 500px;
    overflow-y: auto;
}

.memberListData{
    height: 500px;
    overflow:auto;
    border-right: 1px solid #d9d9d9;
}

.communityManage .noMarginBottom {
    margin-bottom: 0 !important;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    min-width: 100%;
    display: table;
}

.memberListData .hgroup.itemListBox {
    border-right: 0 !important;
}

.communityManageContent .memberListData section .hgroup h2 {
    margin-left: 0 !important;
    padding-left: 45px !important;
    width: 100%;
}

.manageStudentRoleInfo {
    width: 100px;
    min-width: 100px;
    vertical-align: top;
    padding: 15px 5px;
}

.itemsList.memberListData {
    background: transparent !important;
    height: calc(100vh - 420px);
}

.profileSave {
    padding-bottom: 10px;
    padding-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.profileToggle-icon{
    transform:rotate(179.71deg);
}

.fixedProfileHeader {
    position: sticky;
    z-index: 999;
    top: 0;
    background-color: #f7f7f8;
}

.memberFieldDisabled {
    opacity: 0.5;
    filter: alpha(opacity=40);
    color: #8B8B8B;
}

.memberInputArea input[type='text'][disabled] .memberContactInfoArea input[disabled], .memberInputArea select[disabled]{
    opacity: 0.5;
    filter: alpha(opacity=40);
    color: #8B8B8B;
}

.filterClear{width: 20px;}

.filterPickerDiv{
    width: calc(100% - 30px);
    height: 36px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #b9b7b7;
    margin-left: 20px;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mergeImg{
    transform: rotate(90deg);
}

.student-listing{
    color: gray;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-size: 15px !important;
    display: flex !important;
    flex-flow: row;
    min-height: 100px;
}

.student-listing .first-listing-col{
    flex-grow: 2
}

.advanceBulkImportBox {
    border: 1px solid #e4e5ed;
    background: #fff;
    border-radius: 5px;
    margin-bottom: 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width:33%;
    margin-right: 5px;
    box-shadow:  0 0 10px  rgba(0,0,0,0.6);
    -moz-box-shadow: 0 0 10px  rgba(0,0,0,0.6);
    -webkit-box-shadow: 0 0 10px  rgba(0,0,0,0.6);
    -o-box-shadow: 0 0 10px  rgba(0,0,0,0.6)
}

.advanceBulkImportBox .uploadIcon {
    float: left;
    padding: 15px;
}

.advanceBulkImportBox .uploadIcon figure {
    margin: 0;
    width: 50px;
    max-height: 50px;
}

.advanceBulkImportBox .uploadIcon  figure img {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.advanceImportDetail {
    display: block;
    overflow: hidden;
    width: 100%;
    font-family: Gotham-book;
    line-height: 1.4;
    margin-left : 15px;
}

.uploadRow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.advanceBulkImportBox.middleBox{
    margin-left: 15px;
    margin-right: 15px;
}

.advanceBulkImportBox .uploadIcon input[type=file]{
    position:absolute;
    opacity:0;
    width: 50px;
    height: 50px;
}

.uploadedText {
    font-size: 13px;
    margin-top: -15px;
    color: gray;
}

.advanceBulkImportBox .downloadIcon {
    float: left;
    padding: 15px;
    border-left:2px solid #3E518F;
}

.advanceBulkImportBox .downloadIcon figure {
    margin: 0;
    width: 50px;
    max-height: 50px;
}

.advanceBulkImportBox .downloadIcon  figure img {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.advanceBulkImport-text{width: 760px;height: 36px;top: 266px;font-family: Gotham;font-style: normal;font-weight: 500;font-size: 14px;line-height: 17px;text-align: center;color: #000000;opacity: 0.5;margin-left: 160px;margin-right: 160px;}
.advanceBulkImport-button {width: 207px;height: 40px;background: #2ACBF4;border-radius: 50px;margin: 0 auto;margin-top: 10px;}
.advanceBulkImport-button a {display: block;color: #fff;line-height: 40px;-moz-border-radius: 4px;-webkit-border-radius: 4px;border-radius: 50px;text-align: center;text-shadow: none;font-family: Gotham;font-style: normal;font-weight: bold;font-size: 15px;line-height: 40px;text-align: center;color: #FFFFFF;}
.advanceBulkImport-orLine{text-align: center;padding-right: 10px;padding-left: 10px;border-bottom: 1px solid #c4bcbc;line-height: 0.1em;width: 150px;margin: 0 auto;margin-top: 16px;margin-bottom: 10px;}
.advanceBulkImport-orLine span{font-family: Gotham;font-style: normal;font-weight: 600;font-size: 15px;text-align: center;color: #bcbebe; background: #F0F2F4;    padding: 0 10px;}

.flex-bulkImport-row { margin-left:0px; margin-right:-10px; display: -ms-flexbox;    display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.flex-bulkImport-col { padding-left:10px; padding-right:10px; margin-bottom:20px; }
.flex-bulkImport-col.col-1-3 { -ms-flex: 0 0 33%;flex: 0 0 33%;max-width: 33%;}
.flex-bulkImport-col .bulkImportList { height:100%; width:100%; margin:0; }
@media screen and (max-width: 1199px) {
    .flex-bulkImport-col.col-1-3 { -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%; }
    .flex-bulkImport-col { margin-bottom:10px; }
 }
.bulkImportList {padding: 10px 10px 5px 10px;}
.bulkImportList .title{ margin: 0 auto;text-align: center;font-family: Gotham;font-style: normal;font-weight: bold;font-size: 19px;line-height: 23px;text-align: center;color: #000000;}
.fileupload-title{font-family: Gotham;font-style: normal;font-weight: 500;font-size: 15px;line-height: 18px;text-align: center;color: #000000;opacity: 0.5;padding-top: 15px;padding-bottom: 25px;}
.bulkImport-action{text-align: center;height: 70px;width:33%;margin-top: 12px; margin-bottom: 7px;}
.bulkImport-action-icon{margin-top: 10px;margin-bottom: 5px}
.bulkImport-action-icon img{width: 19px;height: 25px;}
.bulkImport-action-text{font-family: Gotham;font-style: normal;font-weight: 500;font-size: 10px;line-height: 12px;text-align: center;color: #000000;opacity: 0.5;white-space: break-spaces; height: 24px;    width: 64px;margin: 0 auto;    cursor: pointer;}
.bulkImport-action-icon input[type=file] {
   opacity: 0;
    width: 70px;
    height: 50px;
    position: absolute;cursor:pointer;
}
.student-listing .second-listing-col{
    flex-grow: 1
}

.student-listing .first-listing-col ul{
    list-style: none;
    line-height: 1.25;
    position: absolute;
    top: 25px;
    left: 50px;
}

.student-listing .second-listing-col ul{
    list-style: none;
    line-height: 1.25;
}

.student-listing .profileM:after{
    font-size: 18px;
}
.errorSummary{
    color: red;
}

/* =========================
    Auto Notices CSS
============================*/

#createAlert,
#createEmailTemplate{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 17px;
    letter-spacing: 0em;
}

.descMessage{
    font-size: 10px !important;
    font-style: italic;
    color: #5F5F5F;
}

.fill-remaining-section{
    flex-grow: 1;
    margin: 0;
    position: relative;
    z-index: 0 !important;
}

#createAlert .uploadCSV{
    background-image: url(../images/upload-file.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    height: 150px;
    width: 300px;
}

#createAlert .autoNoticesDefinePage section > label a.linkControl,
#createAlert .autoNoticesDefinePage section > label input,
#createEmailTemplate .formTemplateDefinePage section > label a.linkControl,
#createEmailTemplate .formTemplateDefinePage section > label input{
    padding-left: 270px;
    font-size: 15px;
}

#createAlert label{
    font-size: 16px;
    font-weight: 500;
}

.createNoticeTemplate{
    content: "";
    width: 60px;
    height: 60px;
    background: #00a3d1;
    border-radius: 50px;
    position: sticky;
    left: 100%;
    bottom: 15px;
    box-shadow: 0px 0.3em 0.4em rgb(0 0 0 / 30%);
    z-index: 99999;
}

.createNoticeTemplate:after{
    content: "";
    background-position: -1px -232px;
    position: absolute;
    right: 0px;
    width: 60px;
    height: 60px;
    cursor: pointer;
}

.autoNoticesDefinePage,
.formTemplateDefinePage{
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Chrome */
    display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -ms-flex-direction: column;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.autoNoticesDefinePage h1,
.formTemplateDefinePage h1{
    padding: 0;
    font-size: 18px !important;
    font-weight: 500;
}

section.upload-section{
    position: absolute !important;
    height: -webkit-fill-available;
    right: 0;
    top: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.centered-content{
    text-align: center;
    display: inline-flex;
    flex-direction: column;
    font-size: 14px;
}

.full-section-upload-click{
    padding-top: 130px;
    color: #818181;
    font-weight: bolder !important;
    z-index: 9999 !important;
}

.csv-table{
    overflow: auto;
    max-height: 220px;
    background: #fff;
}

.csv-table > div{
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    border-top: 1px solid #DDDDDD;
    border-right: 1px solid #DDDDDD;
    line-height: 20px;
}

.csv-table > div > span{
    padding: 8px 4px;
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.csv-table > div.header > span{
    font-weight: bold;
}

.autoNoticesConfigure h1{
    font-size: 16px !important;
}

.autoNoticesConfigure .csv-table{
    max-height: 200px;
}

.autoNoticesConfigure .csv-filter-section{
    margin: 15px 0;
}

.autoNoticesConfigure .csv-filter-section > div{
    display: flex;
    column-gap: 10px;
    padding: 5px 0;
}

.remove-filter{
    font-size: 35px;
    transform: translate(0,5px) rotate(45deg);
    cursor: pointer;
    display: inline-flex;
    color: #FC0707;
    margin-top: 10px;
}

.add-filter{
    color: #1DB2EA;
    font-size: 15px;
    margin: 10px 0;
    text-align: right;
    display: block !important;
    text-decoration: underline;
    cursor: pointer;
}

.custom-dropDown{
    position: absolute;
    display: none;
    flex-direction: column;
    width: 73%;
    top: 50px;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    color: #252525;
    z-index: 9999 !important;
}

.custom-dropDown ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
    text-indent: 5%;
}

.custom-dropDown ul li{
    text-align: left;
}

.custom-dropDown ul li:nth-child(odd){
    background-color: #F0F0F0;
}

.custom-dropDown ul li:nth-child(even){
    background-color: #fff;
}

.custom-dropDown ul li.selected{
    background-color: #DCF0F6;
    font-weight: bold;
}

#templateSchedule label input[type='checkbox'],
#templateSchedule label input[type='radio']{
    width: 20px;
    height: 20px;
    margin: 0 5px;
}

#templateSchedule div.linkControl label{
    padding: 0 50px;
    font-size: 16px;
    font-weight: 400;
}

#templateSchedule div.linkControl.stretch label{
    flex-direction: column;
}

#templateSchedule div.alertOptions label,
#templateSchedule div.alertOptions label span{
    display: inline-flex;
    align-items: center;
    padding: 0;
    flex:1 1 100%;
}

#templateSchedule div.alertOptions{
    padding-left: 270px;
    display: flex;
}

.day-selection{
    padding: 20px;
}

.day-selection ul{
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
    border: 1px solid #E4E5ED;
}

.day-selection ul li{
    padding: 5px;
    line-height: 15px;
    border: 1px solid #E4E5ED;
}

.day-selection ul li.selected{
    background-color: #53C8E6;
    color: #fff;
}

#createAlert .communityManage .buttonIsSelected,
#createAlert .communityManage .buttonIsNotSelected{
    top: 0;
    text-indent: -10000px;
}

#createAlert .autoNoticesContentPage .createPostBody{
    margin: 0;
    min-height: 390px;
}

#createAlert .autoNoticesContentPage .postContentScreen .createPostBody{
    min-height: 370px;
}

.voiceScreenControls{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.voiceScreenControls > div{
    width: 150px;
    height: 120px;
    background: #EDEEF3;
    box-shadow: 0px 4px 4px rgb(0 0 0 / 25%);
    border-radius: 4px;
    justify-content: space-evenly !important;
    font-weight: bold;
    position: relative;
}

.voiceScreenControls > div span{
    font-size: 18px !important;
}

.centered-flexbox,
.voiceScreenControls > div{
    display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox; /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Chrome */
    display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -ms-flex-direction: column;
    -moz-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.voiceScreenControls .control-icon{
    width: 40px;
    height: 40px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.voiceScreenControls .control-icon.attach-audio{
    background-image: url(../images/recording2.png);
}

.voiceScreenControls .control-icon.record-audio{
    background-image: url(../images/recording.png);
}

.voiceScreenControls .control-icon.stop-recording{
    background-position: -492px -2641px;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 1255px 3282px;
    background-repeat: no-repeat;
}

.voiceScreenControls .orLine{
    margin: 25px 0 25px;
    padding: 0 10em;
}

.voiceScreenControls .control-icon > label{
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    position: absolute;
}

.autoNoticesContentPage .postContentScreen,
.autoNoticesContentPage .voiceContentScreen,
.autoNoticesContentPage .smsContentScreen{
    margin-top: 10px
}

.fr-wrapper{
    z-index: -1 !important;
}

.reviewScreen section.grid-display div{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.reviewScreen section.grid-display{
    padding: 10px 20px;
}

.reviewScreen .boundingBoxPhoto{
    margin-bottom: 20px;
}

.reviewScreen section.grid-display div p:nth-child(2),
.reviewScreen section.grid-display div p:nth-child(3){
    color: #818181;
}

.autoNoticesListing section.flex-row-listing{
    display: flex;
    align-items: center;
    border-radius: 5px;
}

.autoNoticesListing section.flex-row-listing article{
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 0;
    border: 0;
    margin: 0;
    min-width: 0;
}

.autoNoticesListing section.flex-row-listing article div{
    align-items: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.autoNoticesListing section.flex-row-listing,
.invitationEmailTemplateInfo > div.info{
    font-family: Gotham;
    font-size: 14px;
    font-style: normal;
    font-weight: 100;
    letter-spacing: 0em;
    text-align: left;
    color: #3A3A3A;
    padding: 5px;
    line-height: 30px;
    border-bottom: none;
}

.invitationEmailTemplateInfo > div.info h2{
    margin: 0;
}

.invitationEmailTemplateInfo > div.info{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-right: 30px;
    padding: 10px 5px;
}

.invitationEmailTemplateInfo{
    padding: 0 5px !important;
    border-radius: 5px;
    margin-bottom: 10px;
    box-shadow: inset 0 0 0 #fff, 5px 5px 10px #c3c3c373;
    border: 1px solid #c3c3c373;
}

.autoNoticesListing .icon:before,
.invitationEmailTemplateInfo .icon:before{
    content: '';
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 20px;
    height: 20px;
    display: inline-table;
    margin-right: 5px;
    vertical-align: middle;
    margin-bottom: 5px;
    cursor: pointer;
}

.autoNoticesListing .icon.time-icon:before{
    background-image: url(../images/back-in-time.png);
}

.autoNoticesListing .icon.menu-icon:before{
    background-image: url(../images/auto-notice-menu-icon.png);
    width: 15px;
    height: 15px;
    cursor: pointer;
}

.autoNoticesListing .title{
    color: #111111;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
}

.warning{
    align-items: center;
}

.warning:after{
    content: '';
    background-image: url(../images/warning.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 15px;
    height: 15px;
    display: inline-flex;
    margin-left: 5px;
}

.autoNoticesListing .icon.csv-icon:before{
    background-image: url(../images/csv-icon.png);
}

.autoNoticesListing .icon.email-icon:before{
    background-image: url(../images/email-icon.png);
}

.autoNoticesListing .icon.call-icon:before{
    background-image: url(../images/call-center-agent.png);
}

.autoNoticesListing .icon.push-icon:before{
    background-image: url(../images/notification-icon.png);
}

.autoNoticesListing .icon.text-icon:before{
    background-image: url(../images/chat-icon.png);
}

.autoNoticesListing .icon.edit-icon:before,
.invitationEmailTemplateInfo .icon.edit-icon:before{
    background-image: url(../images/edit-icon.png);
}

.invitationEmailTemplateInfo .icon.add-to-folder-icon:before{
    background-image: url(../images/add-to-folder-icon.png);
}

.autoNoticesListing .icon.share-icon:before{
    background-image: url(../images/share-icon.png);
}

.autoNoticesListing .icon.duplicate-icon:before{
    background-image: url(../images/duplicate-icon.png);
}

.autoNoticesListing .switchControl input + label:before {
    top: 0 !important;
    right: 0 !important;
}

#createAlert .validationMsg,
#createEmailTemplate .validationMsg{
    line-height: 0 !important;
    font-size: 12px;
    color: #bf6062;
    font-style: italic;
    position: absolute;
    bottom: 5px;
    display: none;
}

#createAlert .infoMsg{
    line-height: 0 !important;
    font-size: 12px;
    color: #666;
    font-style: italic;
    position: absolute;
    bottom: 5px;
}

#createAlert .postInputBox{
    padding-top: 10px;
    text-indent: 10px;
}

#createAlert .placeHolderText,
#createEmailTemplate .placeHolderText{
    color: #aaa;
    text-indent: 10px;
}

#createAlert #templateSchedule .formLayout .separateTime .datePicker{
    margin-left: 260px;
}

#createAlert .eventEndRepeat .contentEventEndRepeat .formLayout>section.numberOccurrences input{
    padding-left: 270px !important;
}

.sftpInfoForm {
    padding: 0 0 10px 270px;
    display: flex;
    flex-wrap: wrap;
}

.sftpInfoForm > div {
    flex: 1 1 50%;
    display: flex;
    padding: 5px 0;
    line-height: 30px;
}

.sftpInfoForm > div label,
.sftpInfoForm > div input{
    display: block;
    font-size: 16px !important;
    text-indent: 0;
}

#templateSchedule .drillDown:after{
    top: 0;
    margin-top: 0;
}

.second-level-menu{
    position: absolute;
    top: 0;
    left: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%);
    max-height: 12em;
    overflow: auto;
    height: 200px;
    width: 160px;
}

.top-level-menu > li {
    position: relative;
}

.top-level-menu > li:hover,
.second-level-menu > li:hover{
    background: #eee;
}

.top-level-menu li:hover > ul {
    display: inline;
}

.autoNoticesContentPage .fr-dropdown-menu[aria-hidden="false"]{
    overflow: visible !important;
}

.fr-dropdown-menu{
    z-index: 9999;
}

.errorSummary span{
    color: red;
    font-size: 16px;
    padding-left: 12px;
    text-decoration: underline;
}

.sortOrder{padding-left:10px;}

.memberList-profile{
    border-radius: 50px;
    width: 34px;
    height: 34px;
}

.memberList-row {
    height: 106px;
    border: 1px solid #D9D9D9;
    box-sizing: border-box;
}

.memberList-selectButton   {
    top: 0 !important;
}

.memberList-selection {
    width: 50px;
}
.memberList-displayName{
    font-family: Robot, Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 16px;
    color: #000000;
}
.errorSummary ul{
    line-height: 18px;
    margin-top: 1px;
    font-size: 14px;
}

.bulkFileStatusImportText {
    line-height: 24px;
    font-size: 12px;
}

.bulkFileStatusImportText a{
    color: #53c8e6;
    text-decoration: underline;
    cursor: pointer;
}

.memberList-profileDetail{
    width: 50px;
    text-align: center;
    max-width: 50px;
    vertical-align: top;
    padding: 15px 5px;
}

.memberList-studentDetail {
    display: flex;
    padding-top: 5px;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.memberList-table{
    width: 100%;
    border: 0;
    border-collapse: collapse;
}

td.studentFlag {
    text-align: -webkit-right;
    vertical-align: top;
    padding: 15px 5px;
    width: 200px;
    min-width: 200px;
}

.studentFlag div {
    text-align: -webkit-right;
    margin-right: 15px;
}

.memberList-selection {
    width: 50px;
    text-align: center;
    vertical-align: top;
    padding: 20px 5px;
    border: none;
}

.memberList-basicInfo {
    vertical-align: top;
    padding: 15px 5px;
    min-width: 350px;
    width: -webkit-fill-available;
    width: fill-available;
    width: -moz-fill-available;
}

.memberList-selectButton.buttonIsNotSelected,.communityManage:not(.remove-left-auto) .buttonIsSelected {
    left: auto !important;
}

.editProfileButtonActive{
    background: #dc3545 !important;
}

.profileSaveButton{
    width: 70px;
    height: 30px;
    background: #53C8E6;
    border-radius: 4px;
    border: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #FFFFFF;
}

.profileCancelButton{
    width: 70px;
    height: 30px;
    color: #dc3545;
    border-radius: 4px;
    border: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    background: #FFFFFF;
    border: 2px solid #dc3545;
    margin-left: 10px;
}

.memberListModerateTag{
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: white;
    text-align: center !important;
    min-width: 80px;
    height: 28px;
    background: orange;
    border-radius: 20px;
    text-align: center;
    padding-top: 7px;
    margin-top: 5px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.coachTooltip::before{
    content: attr(data-coachmark);
    pointer-events: none;
    color: #fff !important;
    border: 1px solid #212121;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.15);
    background: #212121;
    position: absolute;
    /* display: block !important; */
    text-indent: 0;
    margin-top: -25px;
    margin-left: 20px;
    width: auto;
    padding: 0px 10px;
    line-height: 22px;
    height: auto;
    z-index: 999999;
    -webkit-border-radius: 10px 10px 10px 0;
    -moz-border-radius: 10px 10px 10px 0;
    border-radius: 10px 10px 10px 0;
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
    font-size: 13px;
    visibility: visible;
}

.coachTooltip.reset-password::before{
    margin-top: -50px;
}

.coachTooltip:hover::before {
    opacity: 5 !important;
}

.coachTooltip { z-index:1; }
.coachTooltip:hover {
    z-index:5;
}

button[data-cmd="add_field"],
button[data-cmd="add_message"],
button[data-cmd="insert_placeholder"],
button[data-cmd="remove_placeholder"]{
   border: 1px solid black !important;
    padding: 0 15px 0 10px !important;
    font-size: 14px !important;
    top: 5px;
    height: 30px !important;
}

.fr-command.fr-btn.fr-dropdown:after{
    top: 12px !important;
}

.reviewScreen section.formLayout:not(.grid-display) p{
    font-size: 14px;
    line-height: 1em;
}

.reviewScreen section .mirror-content-info{
    font-weight: bold;
    font-size: 12px;
    font-style: italic;
}

.reviewScreen section.formLayout:not(.grid-display){
    padding: 10px;
}

.reviewScreen section.formLayout:not(.grid-display) h2{
    margin-top: 0;
}

.autonotice-options{
    flex-direction: row !important;
}

.autonotice-options span{
    margin: 2px;
}

.hover-link{
    text-decoration: underline;
    color: #0098f7;
    cursor: pointer;
}

#_communitySettings .generalSettings .formPadding h3{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-weight: normal;
    margin-bottom: -5px;
    font-size: 15px;
}

#_communitySettings .generalSettings .formPadding h1{
    padding: 0;
}

#_communitySettings .generalSettings section.highlightableRow{
    font-size: 14px;
}

.select2-container{
    width: 300px !important;
}

.select2-dropdown{
    z-index: 99999 !important;
}

.recipient-filters > div{
    width: 100% !important;
}

.generalSettings div.formPadding .formLayout .linkControl,
.generalSettings form.formPadding .formLayout .linkControl{
    padding-left: 270px;
}

.recipient-filters select{
    width: 100%;
}

.autoAlertTableHeader{
    background: #53c8e6;
    color: white;
    border-color: #53c8e6;
    font-weight: 600;
    white-space: nowrap;
}

.autoAlertTableBody{
    white-space: nowrap;
}

.autoAlertTable {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

.autoAlertTableBody td{
    border: 1px solid #e8e8e8;
}

.centered-content.csvTable{
     position: relative;
    left: 1%;
    right: 1%;
        width: 100%;
}

.autoNoticesConfigure.formPadding{
    width: 100%
}

.search-child.removeFilter {
    width: 5% !important;
    display: flex;
}

.clearFilterIcon{
    position: absolute;
    left: 92%;
    top: 40%;
    cursor: pointer;
}

.fileUploadInProcess{
    opacity: 0.5;
    pointer-events: none;
}

.fileUploadInProcess:before{
    display: inline-block;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 80%;
    right: 48%;
    z-index: 9999;
}
.alert {
    border-width: 0 1px 4px 1px;
}

.alertsuccess {
    background-color: #28b62c;
    border-color: #24a528;
    color: #ffffff;
}
alert-dismissable, .alert-dismissible {
    padding-right: 35px;
}
.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-user-select: text !important;  /* Chrome 49+ */
    -moz-user-select: text !important;     /* Firefox 43+ */
    -ms-user-select: text !important;      /* No support yet */
    user-select: text !important;          /* Likely future */
}

.alert-dismissable .close, .alert-dismissible .close {
    position: relative;
    top: -2px;
    color: inherit;
}
button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}
.close {
    color: #fff;
    text-decoration: none;
    opacity: 0.4;
}
.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #ffffff;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}

.alertdanger {
    background-color: #ff4136;
    border-color: #ff1103;
    color: #ffffff;
}

.languageChart{
min-height: 150px;
}

@media screen and (max-width: 1199px) { .postDeliveryReport > div {
    width: 50%;
    justify-content: center;
    margin: 10px;
} }
@media screen and (max-width: 600px) { .postDeliveryReport > div {
    width: 50%;
    justify-content: center;
    margin: 10px;
}}
.contactbalityChart{overflow: auto;}
canvas#base {
    width: 100% !important;
}
canvas#languageDoughnut {
    width: 90% !important;
    height: 90% !important;
}

.paginationRightCorner{float: right;    padding-bottom: 10px;}
.paginationRightCorner:after { content:""; clear:both; }

.deliverabilityList-table{
    width: 100%;
    border: 0;
    border-collapse: collapse;
}

.deliverabilityList-table .headerRow{
    padding: 10px;
    border-bottom: solid 1px #d9d9d9;
    background: #53c8e6;
    color: white;
    border-color: #53c8e6;
    word-break: break-word;
    font-weight: 600;
    height: 37px;
}

.deliverabilityList-row{
    transition: 0.5s;
    text-align: center;
    background: white;
    height: 40px;
    border-bottom: solid 1px #d9d9d9;
}

.dashboardFilterContainer{
    width: calc(62% - 70px);
    background: #FFFFFF;
    border: 1px solid #C7C7C7;
    box-sizing: border-box;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    position: absolute;
    z-index: 999999;
    right: 3%;
    top: 65%;
}

.filterDiv.dashboardFilter{
    min-height: 150px;
    overflow-y: auto;
    height: auto;
}

.contactbalityLegendText{
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    display:flex;
}

.notReachableText{
    color: red;
}

.importedLabel {
    text-align: center;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 12px;
    color: #919191;
    margin-top: 5px;
}
img.memberFieldIcon.warningIcon{
    left: 84% !important;
    margin-top: -25px;
    width: 14px;
    height: 14px;
}

.coachWarningTooltip::before {
    content: attr(data-coachmark);
    pointer-events: none;
    color: white !important;
    border: 1px solid #f0ad4e;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.15);
    background: #f0ad4e;
    text-indent: 0;
    margin-top: -50px;
    width: auto;
    padding: 0px 10px;
    line-height: 22px;
    height: auto;
    z-index: 999999;
    -webkit-border-radius: 10px 10px 10px 0;
    -moz-border-radius: 10px 10px 10px 0;
    border-radius: 10px 10px 10px 10px;
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
    font-size: 13px;
    visibility: visible;
    float: right;
    font-weight: 600;
}

.coachWarningTooltip:hover::before {
    opacity: 5 !important;
}

.notice-response-indicator{
    width: 20px;
    height: 20px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 50%;
    padding: 0;
    border: 2px solid #8e8e8e;
    background-color: #fff;
    position: relative;
    text-align: center;
    left: calc(50% - 15px);
    text-indent: -1000px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.notice-response-indicator:after{
    border: 5px solid #8e8e8e;
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.notice-response-indicator.unread,
.notice-response-indicator.unread:after{
    border-color: #4bc1e6;
}

.notice-response-indicator.read,
.notice-response-indicator.read:after{
    border-color: #333;
}

.color-legend-desc .notice-response-indicator{
    margin-right: 10px;
    left: 0;
    min-width: 20px;
}

.premiumStatusBtn{
    width: 100px;
    height: 30px;
    background-color: orange !important;
    border-radius: 5px;
    font-size: 12px;
    color: white !important;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none !important;
}

.premiumStatusBtn.nonPremium{
    background-color: red !important;
}

#createAlert .eventEndRepeat .contentEventEndRepeat .formLayout .separateTime label>span input{
    margin-left: 80px;
}
.remove-profileIcon{
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
    padding-left: 10px;
    cursor: pointer;
}

.noSymptomsLink a{
    text-transform: none;
    text-decoration: underline;
    color: #53c8e6;
    font: 16px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height: 32px;
}

.noSymptomsLink{
    text-align: center;
}

.classOrigin{
    display: block;
    position: relative;
    padding: 10px 25px 10px 40px;
    line-height: 1.25;
    text-indent: 0;
    font-family: 'focoreBold', Helvetica, sans-serif;
    cursor: pointer;
    margin-left: 5px;
}

.deliverabilityList-subjectTd{
    text-align: left;
    color: rgb(83, 200, 230);
    cursor: pointer;
}

.deliverabilityList-table .headerRow th{
    width: 100px;
    min-width: 100px;
    white-space: nowrap;
    padding-right: 10px;
}

.deliverabilityList-table .headerRow .undeliverable-th{
    width: 100px;
}

.recipients.disbaledRecipients{
    pointer-events: none;
    opacity: 0.5;
}

.appFullScreen .flag-list{
    display: none;
}

.importArea{
    display: flex;
    float: right;
}

.importArea div{
    display: flex;
    float: right;
    margin-right: 5px !important;
}

.messagesTab .message .profileM.crossLine:after {
   text-decoration: line-through;
}

.engagementFill{
    width: 32px;
    height: 32px;
    border-radius: 50px;
}

.filterByReport{
    display: flex;
    justify-content: space-between;
}
.groupFilter{
    width: 30%
}
.groupFilter .formLayout .linkControl.drillDown{
    padding-left : 0px !important;
    margin-top: 12px !important;
}

.BehaviorReportTabBox ul.dateControl .rangeSortWrapper{
    padding-left : 0px !important;
    margin: 0 0 0 0 !important;
}

.filterByLabel{
    top: 30%;
}

.interactionsCount{margin-right: 15px;}

.lineChartArea{position: relative;  width:50vw;margin:auto;}

.graphSelectionArea { display: inline-flex;}
.graphSelectionArea .communityManage .memberList-selection{padding: 0px !important}
.coachTooltip.verifyMembers::before{
    margin-top: -30px;
     margin-left: 0px !important;
}

.coachTooltip.verifyStudents::before{
    margin-top: -50px;
    margin-left: -50px; !important;
    border-radius: 10px 10px 10px 10px !important;
}

.deliverabilityListArea{
    overflow: auto;
}

.deliverabilityList-row .leftTextAlign{text-align:left;}

.userContactability {overflow: auto;    height: calc(100vh - 500px);}

span.feedSubject{
  width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

.subPage.newEvent.orgSettingsPage.eventForm{
    width: 100% !important;
}

.coachTooltip.reinvite::before{
    margin-left: -50px; !important;
    border-radius: 10px 10px 10px 10px !important;
}

.report-flag-box {
    display: block;
    width: 25px;
    height: 40px;
    position: relative;
    overflow: hidden;
}

.report-flag-box:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -12px;
    height: 23px;
    width: 30px;
    background: #fff;
    transform: rotate(45deg);
}

.inlineBox .subPage.profilePage,
.inlineBox .subPage.orgSettingsPage{
    padding-top: 74px;
}

.inlineBox .subPage.profilePage .quickLinks{
    padding-left: 300px;
}

.showSidePanel .subPage.profilePage .quickLinks .addButton,
.showSidePanel .subPage.profilePage .quickLinks:after{
    right: 310px;
}

.expiredCount{
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    position: relative;
    font-size: 14px;
    color: #1ca0c8;
    text-decoration: underline;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    cursor: pointer;
}

.autoNoticeFooter{
    height: 50px;
    display: flex !important;
    align-items: center;
}

.autoNoticeFooter li{
    border-radius: 100px;
    padding: 0 10px;
    color: white;
    margin: 5px;
}

.autoNoticeFooter li.respondBtn{
    background-color: #53c8e6 !important;
}

.autoNoticeFooter li.dismissBtn{
    background-color: red;
}

.autoNoticesListing .collapseTriggerLastStatus{
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.autoNoticesListing .collapseTriggerLastStatus button.primaryBtn{
    padding: 10px 15px;
    width: auto;
}

.autoNoticesListing .collapseTriggerLastStatus{
    padding: 10px 15px;
}

.autoNoticesListing .collapseTriggerLastStatus a{
    font-size: 13px;
    text-decoration: underline;
    color: #00a3d1;
}

.autoNoticesListing .collapseTriggerLastStatus:after{
    display: none;
}

.autoNoticeObject section:nth-child(even){
    background: rgb(245, 247, 247) !important;
}

.autoNoticesListing section.autoNoticeObject:nth-child(odd){
    background: rgb(245, 247, 247) !important;
}

.autoNoticesListing article,
.autoNoticesListing section.flex-row-listing,
.autoNoticesListing section.marginTopClassOptions{
    background: unset;
}

#autoAlertsListing{
    margin-top: -60px;
}

.memberParentsInfoArea span {
    font-family: Gotham;
    font-style: normal;
    font-weight: bold;
    font-size: 14px;
    line-height: 17px;
    color: #3F3F3F;
}

.actionSheet .dialogBox li {
    font-size: 17px;
}

.memberStaffInfo{
    font-family: Gotham !important;
    font-style: normal !important;
    font-size: 12px !important;
    line-height: 14px !important;
    color: #504F4F !important;
    font-weight: normal !important;
  }

.profileRoles {
    height: 20px;
    border-style: none;
    background: transparent;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #00000;
    margin-top: 5px;
    width: 100%;
    margin-top: 5px;
}

.customRulesFilter{
    display: table-cell !important;
    padding-bottom: 5px;
    cursor: pointer;
    padding-top: 40px  !important;
}

.customRulesFilter div{
    right: 12px;
    -moz-border-radius: 5px;
    line-height: 32px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display: block;
    color: #53c8e6;
    margin-top: 2px;
    padding-top: -41px;
}

.post-advanced-options{
    color: #019bd0;
    cursor: pointer;
    justify-content: right;
    display: flex;
    padding: 10px;
    font-size: 15px;
}

.upgradeText{
    position: absolute;
    top: 0;
    font-size: 13px;
    right: 10px;
    z-index: 9999;
}

.upgradeText a{
    text-decoration: underline;
    color: #00a3d1;
}

.upgradeText:before{
    content: "";
    width: 25px;
    height: 25px;
    display: inline-flex;
    background-position: -463px -1380px;
    margin-right: 5px;
}

.fr-emoticon{
    background-repeat: no-repeat !important;
    width: 20px;
    height: 20px;
    display: inline-block !important;
}

article.update table{
    border-collapse: collapse;
    empty-cells: show;
    max-width: 100%;
}

article.update td{
    border: 1px solid #DDD;
}

.pickerFilterDisplayBox{
    border: 1px solid #A4A4A4;
    box-sizing: border-box;
    border-radius: 3px;
    margin-left: 10%;
    margin-bottom: 5px;
    margin-right: 8%;
    margin-right: 8%;
}

.customFilterDisplay {
    display: flex;
    font-family: 'Gotham';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #5E5E5E;
    padding-left: 10px;
    padding-top: 5px;
}

.customFilterDisplay .customFilterValue{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-indent: 5px;
}

.recipientCountValue {
    font-family: 'Gotham';
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 18px;
    color: #28A645;
    padding-left: 10px;
}

.pickerFilterArea{
    display: inline-block;
}

.pickerFilterArea.first-box{
    width: 90%;
}

.pickerFilterArea.second-box{
    width: 10%;
    display: inline-flex;
    justify-content: flex-end;
}

.pickerFilterArea.second-box div a{
   padding-right: 5px;
}

.actionSheet .dialogBox .dialogMessage h4 {
    color: #000;
    font-size: 14px;
    font-weight: normal;
    font-family :'gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.notification-setting{
    display: inline-flex;
}

.notification-setting > span{
    background-size: contain;
    background-repeat:no-repeat;
    height: 30px;
    width: 30px;
    margin-right: 7px;
}

.notification-setting .disable-active-icon{
    background-image: url(../images/disable-active.png);
}

.notification-setting .disable-inactive-icon{
    background-image: url(../images/disable-inactive.png);
}

.notification-setting .email-notification-setting-active-icon{
    background-image: url(../images/email-setting-active.png);
}

.notification-setting .email-notification-setting-inactive-icon{
    background-image: url(../images/email-setting-inactive.png);
}

.notification-setting .message-notification-setting-active-icon{
    background-image: url(../images/message-setting-active.png);
}

.notification-setting .message-notification-setting-inactive-icon{
    background-image: url(../images/message-setting-inactive.png);
}

.notification-setting .push-notification-setting-active-icon{
    background-image: url(../images/push-setting-active.png)
}

.notification-setting .push-notification-setting-inactive-icon{
    background-image: url(../images/push-setting-inactive.png);
}

.notification-setting .call-notification-active-icon{
    background-image: url(../images/call-setting-active.png);
}

.notification-setting .call-notification-inactive-icon{
    background-image: url(../images/call-setting-inactive.png);
}

.notification-setting .email-digest-notification-active-icon{
    background-image: url(../images/email-digest-setting-active.png);
}

.notification-setting .email-digest-notification-inactive-icon{
    background-image: url(../images/email-digest-setting-inactive.png);
}

.muteNotifications{
    display: inline-block;
    width: 20px;
    background-image: url(../images/mute-notifications.png);
    background-repeat: no-repeat;
    background-size: contain;
    height: 20px;
    right: 30px;
    position: absolute;
    z-index: 9999;
    cursor: pointer;
}

.message.highlightableRow .muteNotifications{
    right: 5px;
    bottom: 15px;
    top: unset;
}

#emailDigestSettings a.linkControl.drillDown{
    padding-left: 210px;
}

#emailDigestSettings .onlyTime,
#emailDigestSettings select.onlyTimePicker{
    margin-left: 200px;
}

#emailDigestSettings .contentArea{
    padding-top: 10px;
}

.memberListSuspendedTag {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: white;
    text-align: center !important;
    min-width: 80px;
    height: 28px;
    background: red;
    border-radius: 20px;
    text-align: center;
    padding-top: 7px;
    margin-top: 5px;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.suspendedLabel{
    text-align: center;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 12px;
    color: red;
    margin-top: 5px;
}

.restoredLink{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 14px;
    color: #1CA0C8;
    margin-left: 10px;
}

.rssFeedNavBar{
    width: 100%;
    position: absolute;
    background: #1ca0c8;
    display: block;
    max-height: 64px;
    top: 0;
    left: 0;
    z-index: 99999;
}

#rssFeed .scrollView{
    margin-top: 60px;
    max-height: 560px;
    min-height: 560px;
}

.rssFeedNavBar .rss-header-logo{
    display: inline-block;
    padding: 0 1em;
}

.rssFeedList{
    border-bottom: 1px solid black;
    padding: 10px;
    cursor: pointer;
}

.rssFeedList:hover{
    background: #f2f2f2;
}

.rssFeedList .post-date{
    text-align: right;
    font-size: 13px;
    font-style: italic;
    color: #666;
    font-weight: 600;
    margin: 5px 0;
}

.rssFeedList .post-content{
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 14px;
    line-height: 20px;
    margin: 0;
}

.rssFeedNavBarPostView{
    width: 100%;
    background: #1ca0c8 !important;
    display: block;
    max-height: 64px;
    top: 0;
    left: 0;
    z-index: 99999;
}

.rssFeedNavDiv{
    display: flex;
    justify-content: space-between;
}

.rssFeedSignIn{
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #fff;
    padding: 13px 25px;
    line-height: 1;
    font-size: 22px;
    text-indent: 0;
    border-radius: 50px;
    border: 0;
}

.post-header {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    background-color: white;
    padding: 15px 20px;
    margin-bottom: 15px;
}

img.post-header-image {
    float: left;
    max-height: 50px;
    margin-right: 10px;
    vertical-align: middle;
}

.post-header-main-text {
    float: left !important;
}

.post-headerArea{
    margin-bottom: 55px;
}

.rssFeed-image {
    width: 115px;
    height: 100px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.rssFeed-image-area.feedCol {
    margin-right: 15px;
    order: 0;
    height: 100px;
    width: 118px;
    background: #ddd;
    display: inline-block;
}

.feedCol {
    display: inline-block;
    vertical-align: top;
}

h2.rssFeedTitle {
    margin-top: -5px;
}
@media screen and (max-width: 600px)
{
  .feedCol{
       max-width: 100%;
    }
    .feed-container{
       display: inline !important;
    }
}

.feed-container{
   display: flex;
}

.flex-options{
    display: flex;
}

.flex-options > section{
    flex: 1 1 50%;
}

h1.filter-header {
    padding-top: 0px;
    margin: 10px 8px 3px 8px !important;
}

.custom-filter-button{
    width: 80px;
    height: 44px;
    background: #53C8E6;
    border-radius: 4px;
    border: none;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: #FFFFFF;
}

.sorting-area {
    margin-top: 10px;
}

.custom-filter-area{
    margin-left: 10px;
    margin-right: 10px;
}

.customTextareaMultipleNames{
    width: 100%;
    border-radius: 5px;
    border: 1px solid #dedede;
    padding: 15px;
    height: 50px;
}


.filterDropDown{
    padding-left: 5px !important;
    width: 200px !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
    moz-appearance: auto !important;
    margin-left: 60px !important;
}

.autoNoticesFill{background: #808080;}

.persistentEmptyPanelMsg.autoNotices {
    margin-top: 50px;
}

.autoNoticesListing {
    margin-top: 50px;
}

span.studentRelationShipText {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    color: #fff;
    background-color: #6c757d;
    margin-left: 5px;
    margin-right: 5px;
}

span.relationshipType{
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    color: #212529;
    background-color: #f8f9fa;
}

.link-nav{
    font-size: 12px;
    position: absolute;
    right: 22%;
    text-decoration: underline;
    padding-right: 1em;
    cursor: pointer;
}

.filter-container{
    display: flex;
}

.granular-notification-list{
    align-items: center;
    display: flex;
    justify-content: space-between;
}

span.remove-filter.customPicker {
    margin-top: 0;
}

.clear-filter{
    width: 16px;
    height: 16px;
    margin-top: 15px;
    cursor: pointer;
}

.sftpCollapse .notification-settings-header{
    line-height: 35px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    background: none;
}

.group-specific-gates{
    display: inline-flex;
    position: absolute;
    top: 2px;
    right: 5%;
    z-index: 99999 !important;
}

.customFilterArea{
    margin-left: 10px;
    margin-right: 10px;
}

.filterSeparator{
    margin-bottom: 10px;
    border-top: 1px solid #dedede;
    padding-top: 10px;
}

#orgSettings .notification-setting > span{
    line-height: 15px !important;
}

.disable-granular-notifications{
    padding: 5px 0;
    border-bottom: 1px solid #aaa;
    margin: 15px 0;
    font-size: 15px;
    text-align: center;
}

.disable-granular-notifications > a:before,
.show-lock-icon{
    content: "";
    display: inline-block;
    height: 15px;
    width: 15px;
    margin: 0 5px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url(../images/lock-field-icon.png);
}

.recipientPicker-createNewGroup{
    margin: 0 auto;
    text-indent: 15px;
    font-size: 13px;
    margin-top: -4%;
    margin-bottom: 2%;
}

.recipientPicker-createNewGroup a {
    color: #53c8e6;
}

.optionListing.circleThumbnail.roleParentContributor:before {
    background-image: url(../images/parent-contributor-ico.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 50px 50px;
}

#templateSchedule .formLayout section .switchControl input + label:before{
    right: unset;
    left: 270px;
}

.notSuspendedLabel {
    text-align: center;
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 12px;
    color: green;
    margin-top: 5px;
}

.deleted-post-text{
    line-height: 1.15;
    margin-bottom: 15px;
    color: red;
}

.coachTooltip.notification-setting::before{
    margin-top: 30px !important;
    margin-left: 20px !important;
    border-radius: 0px 10px 10px 10px !important;
}

.notificationSettingDeletedSnippet {
    opacity: 0.4;
}

.coachTooltip.notification-setting-emailDigest::before{
    margin-top: 25px !important;
    margin-left: -11px;
    border-radius: 10px 0px 10px 10px !important;
}

.delivery-report-export-btn{
    position: absolute;
    right: 0;
    top: 15px;
    border: 1px solid #2fc6fa;
    color: #fff;
    text-shadow: none;
    background: #2fc6fa;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 600;
    width: 150px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.coachTooltip.notification-setting.email-digest::before {
    margin-top: 30px !important;
    margin-left: -70px!important;
    border-radius: 10px 0px 10px 10px !important;
}

.coachTooltip.notification-setting.push::before {
    margin-top: 30px !important;
    margin-left: -120px!important;
    border-radius: 10px 0px 10px 10px !important;
}
div.shadowBoxTop section:hover {
    z-index: 3003;
}

.shadowBoxNotification:hover{
    z-index: 3003;
}

.schoolToImportPadding{
    margin-left: 10px !important;
}

.importRowVerticalAlign{vertical-align: top;}

.importHeader {
    font-weight: normal;
    padding-top: 11px;
    margin-bottom: -5px;
    text-indent: 2px;
    color: #6d6d72;
    padding: 0;
    line-height: 32px;
}
.importLabelText{
    display: inline;
    overflow: hidden;
    text-indent: 0;
    line-height: 1.3;
    vertical-align: middle;
    font-size: 14px;
}
#memberListDiv .communityManageSearchBar .searchBox{
    width: 100% !important;
    position: relative;
    align-items: center;
    justify-content: center;
    display: inline-flex;
}

#memberListDiv .communityManageSearchBar .searchBox .filterAction{
    padding-right: 15px;
}

.copyLink{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #1CA0C8;
    padding-left: 5px;
}

.roleLabel{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: #919191;
    margin-top: 5px;
}

.inviteLink{
    font-weight: bold;
    text-decoration: underline;
}

.inviteTooltip{
    background: #ffe98c !important;
    position: sticky;
    top: 0;
    z-index: 999;
    padding-right: 5px !important;
    border-bottom: 1px solid #e4e5ed !important;
    margin-bottom: 1px;
    font-size: 13px !important;
    margin: 0 0 5px 0;
    padding-left: 10px !important;
    line-height: 25px;
    font-weight: normal !important;
}

.forceUpdateBtn{
    margin-right: 10px;
    background: #e86c6c !important;
}

.inviteTooltip{
    background: #ffe98c !important;
    position: sticky;
    top: 0;
    z-index: 999;
    padding-right: 5px !important;
    border-bottom: 1px solid #e4e5ed !important;
    margin-bottom: 1px;
    font-size: 13px !important;
    margin: 0 0 5px 0;
    padding-left: 10px !important;
    line-height: 25px;
    font-weight: normal !important;
}

.hgroup.calendarEntry {
    margin-left: 65px !important;
}

#notificationCenter .calendarInvite .hgroup.calendarEntry h2 {
    display: flex !important;
    flex-direction: column-reverse !important;
}

.calendarInvite .hgroup.calendarEntry .profileM{
    position: static !important;
    left: 0 !important;
    text-indent: 0 !important;
    margin-top: 13px !important;
    margin-left: -15px !important;
}

#notificationCenter article .dateDisplay + .hgroup.calendarEntry h3{
    position: static !important;
    padding-left: 0px;
}

#notificationCenter .calendarInvite .hgroup.calendarEntry time{
    margin-left: -10px !important;
}

.calendarInvite .hgroup.calendarEntry{
    text-indent: 0 !important;
    padding-left: 15px !important;
}

#notificationCenter .circleRequests .hgroup.calendarEntry h3 span{
    margin-left: -15px !important;
}

.hgroup.highlightableRow .communityColor{
    display: inline-block;
    position: absolute;
    width: 4px;
    left: -10px;
    height: 100%;
}

.attendance-date-picker{
    display: flex;
    justify-content: center;
    padding: 15px 0;
}

.attendance-date-picker .calendarDatePickerRangeDate .datePicker > span{
    font-size: 14px;
    text-decoration: underline;
    color: #53c8e6;
}



.autoNoticesInListDiv{
    padding: 15px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #dedede;
    height: 99%;
}

.arrow-right {
    width: 0px;
    height: 0px;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;

    border-left: 10px solid #a9a9a9;
}

.arrow-bottom {
    width: 0px;
    height: 0px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 10px solid #a9a9a9;
}

.messageCommunityColor {
    display: inline-block;
    position: absolute;
    width: 4px;
    left: 0px;
}

.messageTimeUnread:after{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #4bc1e6;
    position: absolute;
    right: 5px;
    margin-top: 15px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

.fr-popup{
    z-index: 9999 !important;
}

.emailTemplateListing{
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-column-gap: 20px;
    grid-auto-rows: 25vw;
    grid-row-gap: 40px;
    padding-bottom: 10px;
}

.showSidePanel .emailTemplateListing{
     grid-auto-rows: 20vw;
}

.emailTemplateListing div.templateImg{
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: inset 0 0 0 #fff, 2px 2px 3px #c3c3c34f;
    align-items: center;
    justify-content: center;
    display: flex;
    background: #fff;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 80%;
}

.emailTemplateListing div.templateImg img{
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.emailTemplateListing .templateInfo{
    font-size: 12px;
    line-height: 1.5em;
    padding-top: 5px;
    text-indent: 5px;
    font-family: 'Gotham';
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    color: #666;
}

.emailTemplateListing .templateInfo > span{
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.emailTemplateListing .templateInfo > span.templateTitle{
    font-weight: 600;
    font-size: 15px;
    text-transform: capitalize;
    color: black;
}

.emailTemplateListing .templateAddButton{
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    text-indent: -9999px;
    background-position: -9px -837px;
    width: 45px;
    height: 45px;
    padding: 0;
    margin-top: 0;
}

.default-indication{
    padding: 5px;
    font-size: 10px;
    background: #212121;
    color: white;
    position: absolute;
    top: 5px;
    right: 5px;
    line-height: 10px;
    border-radius: 5px;
    font-family: 'Gotham';
    text-align: center;
    text-indent: 0;
}

.emailTemplateListing .selectedTemplate:after{
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    background-position: -245px -2075px;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    text-indent: -9999px;
    top: 10px;
    right: 10px;
}

.classesTeachings,.classedAttending {
    position: relative;
    left: 8px;
}

.communityContent.classesTeachingList,.communityContent.studentsList {
    position: relative;
    left: 12px;
}

.divClassInfo{
    display: flex;
    justify-content: center;
    position: relative;
    left: 40px;

}

.divClassInfo img {
    width: auto;
    height: 22px;
    opacity: 0.5;
    margin-right: 12px;
}

.divClassInfo span{
    font-size: 14px;
    line-height: 22px;
    height: 31px;
    display: block;
    width: 100%;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    white-space: nowrap;
    color: #212121;
    text-shadow: none;
    marign-top: 0;
    margin-bottom: 0;
    text-overflow: ellipsis;
    overflow: hidden;
    box-sizing: border-box;
    padding-top: -14px;
}

li.liChildren {
    height: 50px !important;
}

span.groupsCollapseTrigger{
    display: block;
    position: relative;
    padding-left: 10px;
    cursor: pointer;
}

.groupsCollapseTrigger:after {
    content:"";
    position: absolute;
    top: -5px;
    right: 10px;
    bottom: 0;
    height: 8px;
    width: 8px;
    margin: auto;
    border-top: 2px solid gray !important;
    border-right: 2px solid gray !important;
    border-bottom: 0px !important;
    transform: rotate(45deg);
}
.groupsCollapseTrigger.open:after {
    transform: rotate(45deg);
    top: 0px;
    content:"";
    position: absolute;
    right: 10px;
    bottom: 0;
    border-right: 2px solid gray !important;
    border-bottom: 2px solid gray !important;
    border-top: 0px !important;
    height: 8px;
    width: 8px;
    margin: auto;
}

.tagStudent.childrenList:before {
    visibility: hidden;
    padding-left: -2px;
}

.filterByChildrenMarginExpand{
    margin-bottom: -23px !important;
}


.filterByChildrenMarginCollapsed{
    margin-bottom: -13px !important;
}

ul.navFilters.studentGroup:last-of-type {
    margin-bottom: 15px;
}

.subPage.fr-fullscreen-wrapper{
    max-width: 100vw !important;
    height: 100vw !important;
    min-height: 100vh !important;
    top: 0 !important;
}

span.classesTeachings {
    font-style: italic;
    color: gray !important;
    text-transform: none !important;
    font-size: 14px !important;
    height: auto !important;
}
.emailTemplateSelectionPost{
    top: 10px;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 1104px 3742px;
    background-repeat: no-repeat;
    width: 42px;
    height: 42px;
    background-position: -732px -1874px;
    right: -48px;
    text-indent: -9999px;
    position: absolute;
    border: none;
    background-color: transparent;
    opacity: .4;
}

.emailTemplateSelectionPost:hover{
    opacity: 1;
    cursor: pointer;
}

.groupChatText{
    font-weight: bold;
    font-size: 15px !important;
}

.messagePrivateReply{
    padding-left: 30px;
    font-size: 13px !important;
}
.messagePrivateReply:after{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #4bc1e6;
    position: absolute;
    right: 100px;
    margin-top: -16px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}
.messageOptionArea{
     background: transparent !important;
    display: flex;
    justify-content: space-between;
}

.chatWindow .scrollView.chatEntries .entryImage .entry.byOthers .username {
    top: 10px;
}

.chatWindow .scrollView.chatEntries .entryImage .entry.byOthers:after
{
    content: "";
    background-image: url(../images/sprite@2x.png);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    width: 10px;
    height: 10px;
    position: absolute;
    display: block;
    left: -10px;
    top: 12px;
    background-position: -106px -1047px;
}
.invitationEmailTemplateInfo .groupsCollapseTrigger:after,
.invitationEmailTemplateInfo .groupsCollapseTrigger.open:after{
    margin: 10px;
    top: 13px;
}

.rssFeedDownloadLink{
    color: #1ca0c8;
    text-decoration: underline;
}

.collapseInviteMemberTrigger { display:block; position:relative; padding:10px 25px 10px 10px; border-bottom: 1px solid #e4e5ed; line-height: 1.25;text-indent: 0;font-family: 'gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;cursor:pointer;margin-left:5px;}
.collapseInviteMemberTrigger:after { content:""; position: absolute;top: -2px;right: 12px;bottom: 0;border-right: 2px solid gray;border-bottom: 2px solid gray;height: 8px;width: 8px; margin: auto;transform: rotate(45deg); }
.open > .collapseInviteMemberTrigger:after { transform: rotate(225deg); top: 3px; }

.collapseTrigger.skyward-icon,.classTypeIcon.skywardClass,.studentClassTypeIcon.skywardClass{
    background: url(../images/skyward-icon.png) no-repeat left !important;
}

span.phoneTypeClass {
    color: #8D8D8D;
    font-size: 10px !important;
}

span.addParentsGuardians.separation {
    margin-left: -3px;
}

p.calendarInviteOptionalMessage div {
    font-family: 'gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    font-weight: normal;
    line-height: 1.2;
    font-size: 15px;
}

.parentsNotificationDefaultTooltip{
    padding-right: 5px !important;
    margin-bottom: 1px;
    font-size: 13px !important;
    margin: 0 0 5px 0;
    padding-left: 10px !important;
    line-height: 35px;
    font-weight: normal !important;
    color: #6d6d72;
    text-indent: 0px !important;
}

.bloomzPaymentNotification,
.bloomzLimitsNotification{
    z-index: 10001;
    top: 0;
    left: 0;
    right: 0;
}

.bloomzPaymentNotification p ,
.bloomzLimitsNotification p {
    background: #ffdd02;
    margin: 0;
    padding: 1rem 3rem 1rem 1rem;
    box-shadow: 0 0 20px #ffdd01;
    width: 100%;
    margin: 10px 0;
    border-radius: 4px;
    font-size: 15px;
    line-height: 1.4;
    color: #000;
    border: 1px solid #ffdd04;
    position: relative;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}
.bloomzLimitsNotification p {
    font-size: 13px;
}
.paymentClose {
    position: absolute;
    top: 1rem;
    right: 0.5rem;
    background: #8a7907;
    color: #dfcea1;
    height: 2rem;
    width: 2rem;
    text-align: center;
    line-height: 2.2rem;
    font-weight: bold;
    border-radius: 50%;
}

.announcementUpdates.announcementTextVisible {}

.announcementUpdates.announcementTextVisible article.hasImg p {
    height: auto;
    margin: 0;
}

.announcementUpdates.announcementTextVisible article.hasImg p span {
    display: block;
}

.announcementUpdates.announcementTextVisible article.hasImg p span p {
    margin: 0;
    padding-top: 15px;
    height: 50px;
    font-size: 15px;
    line-height: normal;
    overflow: hidden;
    margin-bottom: 0;
    word-wrap: break-word;
    display: block;
    cursor: pointer;
}

.announcementUpdates.announcementTextVisible article.hasImg > p {
    padding-top: 10px;
}

#rolePicker .communityManage .buttonIsSelected,
#rolePicker .communityManage .buttonIsNotSelected{
    position: absolute;
    left: 15px !important;
}

section.optionListing.circleThumbnail.communityManage{
    padding-left: 130px;
}

.partialSelection{
    opacity: 0.6;
}


#invitationEmailTemplatesListing .searchContainer select{
    -webkit-appearance: auto;
    width: auto;
    background: #fff !important;
    box-sizing: inherit;
    color: inherit;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.bulkImportGetTemplates .descriptionContent p:last-child {
    margin-bottom: 0;
}

.bulkImportText .optionGroup + .optionGroup {margin-top: 10px;display: flex;}

.optionGroup.subGroup {
    margin-left: 10px;
}

.confirmTextbox{
    height: 20px;
    border-style: none;
    background: transparent;
    border-bottom: 1px solid #b9b7b7;
    font-family: Gotham;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    color: #00000;
    margin-top: 5px;
    width: 100%;
    margin-top: 5px;
}

.postTemplatesDetails{
    display: block;
    padding: 0 10px 10px 10px;
    font-weight: 100;
    color: #8e8e8e;
    width: 60%;
    margin-top: -10px;
    font-size: 13px;
    line-height: 1;
}

section.formLayout.confirm {
    background: none !important;
}

#orgHome .scrollView {
    height: calc(100vh - 71px);
    margin-top: 0;
}

#_createCollection .formLayout section a.colorPicker{
    padding-left: 7em;
}
#toast a {
    text-align: center;
    margin: 8px 0px !important;
    color: #d7d7d7;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 1);
}
.sftp-table table.noBorderPedding > tbody > tr > td {
    padding: 0;
    border: 0;
}

.sftp-table table.noBorderPedding tr td tr:first-child td {
    border-top: 0;
}
#teacherLimitsSummary .communityEngagementContent table thead td{
    font-size: 13px;
    text-align: center;
}

.upgrade-options{
    display: flex;
    justify-content: center;
    background: #f0f2f4 !important;
}

.upgrade-options p {
    background: #f0f2f4 !important;
}

.upgrade-options p > a{
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.4;
    padding: 12px 45px !important;
}

#actionSheet_optionsDiv > button.option-with-subtext{
    line-height: 1.2;
    padding: 5px 0;
}

#actionSheet_optionsDiv > button .option-subtext{
    font-size: 14px;
}

.resetSyncDiv{
    height: 30px;
    text-align: right;
    padding-right: 12px;
}

.resetSyncLink{
    color: #53c8e6;
    font: 16px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    line-height: 32px;
    text-decoration: underline;
}

.import-validationMsg{
    font-family: 'Gotham_italic', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    display: block;
    font-size: 12px;
    text-align: left;
    color: #bf6062;
    margin-top: -10px;
}

.importValidationBorder{
    border: 1px solid red !important;
}

.loadingCommunity{
    content: "";
    background: #66666673;
    position: fixed;
    width: calc(100% - 300px);
    height: 100%;
    bottom: 0;
    left: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999 !important;
}

.loadingCommunity img{
    width: 50px;
    height: 50px;
}


.dialogBox.loadingDialogBox {
    background: transparent !important;
}

section.dialogBox.loadingDialogBox div {
    display: block !important;
    margin: 0 auto;
    max-width: 145px;
    width: 100%;
}

.behaviorManagementItemBadge > div.totalAlloverStudentPoints{
    color: #ccc;
}

.messageTextChildren {
    margin-left: 2px;
    font-family: Gotham-book;
    line-height: 1.3;
    font-size: 12px;
    margin-top: 5px;
    font-weight: 500;
    color: #8e8e8e;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    max-width: 90%;
    display: inline-block;
    position: relative;
    z-index: 99;
}

.messageTextChildren > div{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
    width: 100%;
}

.messageTextPanelMargin{
    margin-top:-23px !important;
}

.behaviorManagementItemName.behaviorManagementItemLink:after {
        content: "";
    width: 30px;
    height: 30px;
    background: url(../images/three-dots.png) no-repeat fixed;
    top: 5px;
    right: -17px;
    position: absolute;
    display: inline-block;
}

 .coachTooltip-behaviorPositivePoints::before {
    content: attr(data-coachmark);
    pointer-events: none;
    color: #fff !important;
    border: 1px solid #212121;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.15);
    background: #212121;
    position: absolute;
    display: block !important;
    text-indent: 0;
    margin-left: calc(100% + 1px);
    width: 100px;
    padding: 5px 10px;
    line-height: 1.25;
    height: auto;
    z-index: 999999;
    -webkit-border-radius: 10px 10px 10px 0;
    -moz-border-radius: 10px 10px 10px 0;
    border-radius: 10px 10px 10px 0;
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
    font-size: 9px;
    visibility: visible;
    bottom: 6px;
    text-align: left;
}

.coachTooltip-behaviorPositivePoints:hover::before {
    opacity: 5 !important;
}


.autonotice-test-options{
    display: inline-flex;
    justify-content: flex-end;
}

.autonotice-test-options > button.primaryBtn{
    margin: 0 5px !important;
}

#autonotice-schedule-listing > table{
    padding: 10px;
    width: 100%;
    line-height: 1.5;
}

#autonotice-schedule-listing > table tr td{
   padding: 10px;
}

#autonotice-schedule-listing > table tr:nth-child(even){
    background: #e8e8e8;
}

#autonotice-schedule-listing > table tr:nth-child(odd){
    background: #FFF;
}

.behaviorManagementItem.behaviorManagementSingleItemHighlighted{
    background: #DCF0F7 !important;
}

article.showMessageFlag{
    position: relative;
}

article.showMessageFlag:before{
    content: "";
    height: 15px;
    width: 15px;
    display: inline-flex;
    position: absolute;
    background: url(../images/flag-message.png) no-repeat center;
    background-size: cover;
    right: 1em;
    top: 2em;
}

.student-scroll-table{
    max-height: 400px;
    overflow: auto;
}

div.student-scroll-table > table th{
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0;
    z-index: 100;
}


.collapsePickerTrigger { display:block; position:relative; border-bottom: 1px solid #e4e5ed; line-height: 1.25;text-indent: 0;cursor: pointer;}
.collapsePickerTrigger:after { content:""; position: absolute;top: -2px;right: 12px;bottom: 0;border-right: 2px solid gray;border-bottom: 2px solid gray;height: 8px;width: 8px; margin: auto;transform: rotate(45deg); }
.open > .collapsePickerTrigger:after { transform: rotate(225deg); top: 3px; }

#recipientPicker .recipientPickerCtrl label + .recipientPickerContactsLabel {
    z-index: 9999;
    top: 0;
}

.groupsPicker {
    position: relative;
}

article.message:hover{
    margin-right: 20px !important;
}

article.message:hover .message-options{
    display: block;
}

article.message .message-options{
    display: none;
}

.message-options{
    position: absolute;
    display: block;
    width: 15px;
    height: 15px;
    right: 0;
    top: 15px;
    text-indent: -9999px;
    overflow: hidden;
    cursor: pointer;
    z-index: 9999 !important;
}

.message-options:after{
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    background-position: -280px -1153px;
    right: 10px;
    position: fixed;
}

a.coachReportTooltip{
    position: relative;
}

.coachReportTooltip:hover::before {
    opacity: 1 !important;
}

.coachReportTooltip:before {
    white-space: pre-line
}

.coachReportTooltip::before {

    word-break: break-all;
    content: attr(data-coachmark);
    pointer-events: none;
    color: #fff !important;
    border: 1px solid #212121;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.15);
    background: #212121;
    position: absolute;
    text-indent: 0;
    width: 100%;
    padding: 0px 5px;
    line-height: 16px;
    height: auto;
    z-index: 999999;
    -webkit-border-radius: 10px 10px 10px 0;
    -moz-border-radius: 10px 10px 10px 0;
    border-radius: 10px 10px 10px 0;
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
    font-size: 10px;
    visibility: visible;
    bottom: 10px;
    left: 22px;
    max-width: 150px;
    min-width: 188px;
    text-align: left;
}

.deliveryReproButtonContent{
    display: flex;
    font-size: 14px;
    font-weight: 600;
    justify-content: flex-end;
    color: white;
    position: absolute;
    right: 15px;
    bottom: 15px;
}

.sent-icon.sent-text {
    display: flex;
    width: calc(100% - 50px);
    width: fit-content;
 }

 .sent-icon span{
     margin-top: 10px;
    margin-left: 5px;
    margin-right: 10px;
 }


.bulkEditSettingCoachTooltip::before{
    content: attr(data-coachmark);
    position: absolute !important;
    white-space: normal;
    pointer-events: none;
    color: #fff !important;
    border: 1px solid #212121;
    box-shadow: 3px 3px 7px rgba(0,0,0,0.15);
    background: #212121;
    display: inline-block !important;
    text-indent: 0;
    padding: 10px;
    line-height: 1.35;
    z-index: 999999;
    -webkit-border-radius: 10px 10px 10px 0;
    -moz-border-radius: 10px 10px 10px 0;
    border-radius: 10px 10px 10px 10px;
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
    font-size: 12px;
    visibility: visible;
    text-align: left;
    bottom: 100%;
    left: 0;
    right: 0;
    margin: 0 0 0 5px;
  }


 .bulkEditSettingCoachTooltip:hover::before, .settingHeaderDiv ul li:hover label::before {
    opacity: 5 !important;
}

.bulkEditSettingCoachTooltip::after{
    content: "";
    position: absolute;
    height: 0;
    width: 0;
    left: 0;
    right: 0;
    border-top: 10px solid black;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    margin: auto;
    bottom: calc(100% - 8px);
    opacity: 0;
}

.bulkEditSettingCoachTooltip:hover::after, .settingHeaderDiv ul li:hover label::after {
    opacity: 5 !important;
}
.settingHeaderDiv ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    width: 100%;
    border: 1px solid #e4e5ed;
    border-radius: 5px;
}

.settingHeaderDiv ul li {
    width: 100%;
    text-align: center;
    border-right: 1px solid #e4e5ed;
    position: relative;
}

.settingHeaderDiv ul li:last-child {
    border-right: 0;
}

.settingHeaderDiv ul li label {
    background: #fff;
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 5px;
    color: #666;
    font-weight: 600;
    font-size: 14px;
    padding: 10px 5px;
    line-height: 1;
}

.settingHeaderDiv ul li input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    margin: 0;
    pointer-events: none;
}

.settingHeaderDiv ul li input:checked+label {
    background: #53c8e6;
    color: #fff;
}

.customCheck-ico{
    display: block;
    position: relative;
    height: 18px;
    width: 18px;
    margin: 0 auto 0;
    top: 8px;
    border-radius: 2px;
     min-width: 18px;
}

.customCheck-ico:after {
    content: "";
    height: 9px;
    width: 6px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    position: absolute;
    top: -4px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    transform: rotate(45deg);
}

.voiceCall{
    background:#08D9D6;
}

.liveCall{
    background: #11999E;
}

.color-legend-desc .customCheck-ico {
    top: 0;
    margin-right: 8px;
    margin-left: 0px;
}


.announcementsSwitch.formLayout section {
    background: transparent;
    border: 0;
    margin-right: 0;
    margin-left: auto;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.formLayout.announcementsSwitch {
    display: flex;
    flex-direction: row;
}

.announcementsSwitch.formLayout section .switchControl.fullWidthSwitch {
    transform: scale(0.6);
    transform-origin: center right;
}

.announcementsSwitch.formLayout section .switchLabel {
    padding: 14px 40px 10px 0;
}

.interactionGoalText{
    font-family: Gotham;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    padding-top: 10px;
}

.goalDiv{
        text-align: right;
}

.importedEventText{
    font: 12px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: red;
    padding-left: 20px;
}

.switchProfiles-listing{
    flex: 1;
    overflow-y: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.switch-profile-content{
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
    align-items: center;
    justify-content: left;
    text-align: left;
    border-bottom: 1px solid #ccc;
    padding: 5px;
}

.switch-profile-content > div:first-child {
    width: 50px;
}

.switch-profile-content > div{
    padding-left: 10px;
}

.switch-profile-content > div:last-child {
    flex: 1;
}

.add-new-profile {
    background-image: url(../images/sprite@2x.png);
    background-size: 704px 2170px;
    background-position: -80px -845px;
    background-repeat: no-repeat;
    height: 30px;
    width: 30px;
    display: block;
    font-size: 0;
}

.communityManageRecipientPicker #memberListDiv {
    padding-top: 93px !important;
}

.communityManageRecipientPicker .filterContainer {
    width: calc(62% - 70px);
    background: #FFFFFF;
    border: 1px solid #C7C7C7;
    box-sizing: border-box;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    border-radius: 4px;
    position: absolute;
    z-index: 999999 !important;
    right: 3%;
    top: 165px;
}

.info-icon:after{
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 410px 1205px;
    background-repeat: no-repeat;
    background-position: -345px -330px;
    position: relative;
    z-index: 9999;
}
.noteInSheet{
    font-weight: bold !important;
    font-family: 'Gotham-book';
    font-size: 70%;
    line-height: 1.25;
    text-align: left !important;
    color: red;

}

.actionSheet.showOnTopOfModalWindow{
    z-index: 4501;
}

.switchUserIcon:before {
    content: "";
    height: 24px;
    width: 24px;
    display: inline-block;
    background-image: url(../images/switch-user.png);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}

.selectedProfileIcon:after {
    content: "";
    background-image: url(../images/sprite@2x.png);
    background-size: 704px 2170px;
    background-position: -115px -2075px;
    background-repeat: no-repeat;
    height: 28px;
    width: 28px;
    display: inline-block;
    position: absolute;
    right: 0;
    top: calc(50% - 14px);;
}

.userProfileInfo .invitationMessage h3 p span {
    margin: 0;
    display: inline-block;
}

.userProfileInfo .invitationMessage h3 p br {
    display:none;
}

.userProfileInfo .invitationMessage h3 p {
    margin: 2px;
    padding: 0;
}
.userProfileInfo .invitationMessage h3 p span br{
  display:none;
}

.divSSO {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    padding-top: 0;
}

.divSSO a {
    display: block;
    margin: 0.4rem;
    padding: 0.6rem;
    box-sizing: border-box;
    font-size: 0;
    background: white;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
}

.divSSO a img {
    width: 30px;
    box-sizing: border-box;
}

.folder-selected{
    border: 1px solid #53c8e6 !important;
}

.postTemplateFolderName{
    line-height: 1.5;
    text-indent: 0;
    font-size: 14px !important;
    margin-top: 5px;
    padding: 0 !important;
    height: auto !important;
    max-width: 100px;
}
nav.mainNavBar .communityManageSearchBar .actionButtons.searchBar:before, nav.mainNavBar .communityManageSearchBar .actionButtons.searchBar:after {
    display: block;
}

.aiAssistantIcon {
    display: flex;
    justify-content: center;
    margin-top: 25px;
}

.aiAssistantDescription {
    display: grid;
    justify-content: center;
}

.aiAssistantDescription .title {
    font-family: Inter;
    font-size: 25px;
    font-weight: 700;
    line-height: 30.26px;
    text-align: center;
    font-family: 'Gotham-book';
    margin-top: 10px;
}

.aiAssistantDescription .description {
    color: #919191;
    width: 200px;
    font-size: 12px;
    font-weight: 400;
    line-height: 14.52px;
    text-align: center;
}

.promptListContent {
    margin-top: 15px;
}

.promptList {
    width: 100%;
    border-radius: 10px;
    background: #EDEEF4;
    border: 2px solid #E4E5ED;
    padding: 20px 15px;
    margin-bottom: 10px;
}

.promptTitle {
    font-size: 15px;
    font-weight: 700;
    line-height: 18.15px;
    text-align: left;
}

.promptDescription {
    font-size: 12px;
    font-weight: 400;
    line-height: 14.52px;
    text-align: left;
    color:  #919191;
}

.staffData.mainTitle {
    font-weight: bold;
}
.assignment-assign-student-class{
    margin-top: 15px !important;
    margin-left: 5px !important;
}

.inviteTooltipForInviteFlow {
    background: #e86c6c;
    position: relative;
    width: 100%;
    display: block;
    padding: 13px 10px 15px 10px;
    margin: -16px 0 25px -10px;
    border-bottom: 1px solid #e4e5ed;
    font-size: 13px;
    color: #fff;
    cursor: pointer;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    font-weight: 600;
}

.inviteTooltipForInviteFlow a {
    color: #fff;
}

.aiInputArea .aiTextArea {
    width: 100%;
    border-radius: 16px;
    border: 1px solid #E4E5ED;
    padding: 10px 92px 10px 10px;
}

.aiInputArea {
    position: sticky;
    font-size: 0;
    margin-bottom: 0;
    bottom: 0;
    z-index: 5;
    background: #fff;
    padding: 15px;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.aiscroll {
    padding: 0 15px;
    overflow: auto;
    max-height: 61vh;
    height: auto;
}


.aiChatWindow .user {
    padding: 10px 15px;
    margin: 8px 0 0px 45px;
    border-radius: 7px;
    text-align: left;
    display: inline-block;
    background: #54C7E6;
    border: 1px solid #54C7E6;
    width: 84%;
    position: relative;
    color: #ffffff;
}

.aiChatWindow .user:before {
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    right: -10px;
    display: block;
    top: 5px;
    background-position: -109px -1019px;
    background-image: url(../images/sprite@2x.png?20180314);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
}

.aiChatWindow  .entryByOthers {
    padding: 10px 15px;
    margin: 8px 0 0px 0;
    border-radius: 7px;
    text-align: left;
    display: inline-block;
    background: #EDEEF4;
    border: 1px solid #EDEEF4;
    width: 93%;
    position: relative;
    color: #000000;
    display: flex;
    margin-left: 24px;
    flex-direction: column;
}

.aiChatWindow  .entryByOthers:before {
    left: -10px;
    top: 10px;
    content: "";
    width: 10px;
    height: 10px;
    position: absolute;
    display: block;
    background-image: url(../images/sprite@2x.png?20180516);
    background-size: 704px 2170px;
    background-repeat: no-repeat;
    left: -10px;
    top: 5px;
    background-position: -106px -1047px;
}

.aiReplayIcon img {
    height: 14px;
    width: 14px;
}

.aiReplayIcon {
    position: absolute;
    top: 10px;
    left: -20px;
}

.AIReportSummary {
    width: 100%;
    background-image: linear-gradient(90.48deg, rgba(138, 0, 246, 0.5) -2.19%, rgba(96, 255, 255, 0.5) 26.83%, rgba(255, 68, 169, 0.5) 65.68%, rgba(255, 248, 92, 0.5) 101.42%);
    position: relative;
    border-radius: 10px;
    margin-top: 11px;
    z-index: 1;
    padding: 15px;
    display: flex;
    font-size: 15px;
}

.AIReportSummary:after {
    content: "";
    background: #fff;
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    border-radius: 10px;
    z-index: -1;
    position: absolute;
}

.AIReportIcon {
    width: 40px;
    padding-right: 10px;
    min-width: 40px;
}

.AIReportIcon img {
    width: 100%;
}

.AIReportSummaryHeader {
    font-weight: bold;
    margin-bottom: 5px;
}
.AIKeywordList {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.AIPositiveKeywordList {
    border: 1px solid;
}

.AIKeywordList > div {
    font-size: 12px;
    font-weight: bold;
    margin: 6px 3px 0 0;
    padding: 6px 14px;
    border-radius: 50px;
    background: linear-gradient(80.41deg, #54C7E6 42.76%, #AEEBFC 94.4%);
    color: #fff;
}
.AIKeywordList > .AINegativeKeywordList { background:rgba(225, 109, 110, 1); }

.AIReportSummaryDescription a{
    color: #53c8e6;
    text-decoration: underline;
}

.AIReportSummaryDescription .aiReportViewMore {
    display: table;
    background: #53c8e6;
    color: #fff;
    text-decoration: none;
    margin-bottom: 0.5rem;
    padding: 0.5rem 0.9rem;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 5px;
}

.aiChatArea .profileM:before {
    display: none;
}

.aiChatArea .profileM:after {
    height: auto;
    text-indent: 0;
    margin: 0;
    padding: 0.4rem 0.8rem 0.1rem 0.8rem;
    color: #fff;
}

.aiChatArea article h2 {
    height: auto;
}

.aiChatArea article h2 .profileM {
    position: static;
    height: auto;
}

.aiChatArea article .hgroup {
    padding: 0;
    margin: -20px -10px 10px;
    border-radius: 5px 5px 0 0;
}

.aiChatArea .timeArea {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
}

.aiChatArea .displayTag p {
    font-weight: 600;
    font-size: 15px;
    margin-top: 0;
}

.aiChatArea .displayTag {
    margin: 5px 0 0;
}

.aiChatArea p .postTitle {
    font-weight: 600;
    font-size: 18px;
}

.aiChatArea article .hgroup ~ p {
    margin-top: 6px;
    font-size: 12px;
 }

body > div.deviceType.showSidePanelMobile ~ div#fc_frame,
body > div.deviceType:has(.currentCommunitySettings) ~ div#fc_frame{
    display: none;
}
.AIReportSummaryDescription { position:relative; }
.AIReportSummaryDescription .AIReportSummaryEdit {
    position: absolute;
    top: -25px;
    right: 0;
    font-size: 0;
}
.AIReportSummaryEdit:after { content: '';
background-image: url(../images/edit-icon.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 20px;
    height: 20px;
    display: inline-table;
    margin-right: 5px;
    vertical-align: middle;
    margin-bottom: 5px;
    cursor: pointer; position:absolute; top:0; right:0; }
body > div.deviceType.hideSidePanel:has(.currentViewPost) ~ div#fc_frame{
    bottom: 85px !important;
}


.labelOptions {
    background-color: #f9f9f9;
    border: 1px solid #ccc;
    padding: 10px;
    cursor: pointer;
    z-index: 10;
}
.labelOptions div {
    margin: 5px 0;
}


.labelOptions{
    position: absolute;
    border-radius: 5px;
    top: 20px;
    left: 20px;
    background-image: url(../images/ai-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    min-width: 250px;
}

.labelOptions div{
    line-height: 22px;
    font-size: 14px;
}

.rewriteArea {
    display: flex;
    column-gap: 20px;
}

.labelOptions .proofRead, .labelOptions .rewrite {
    background-color: rgba(0, 0, 0, 0.08);
    padding: 10px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 50%;
    min-width: calc(50% - 5px);
    align-items: center;
    font-size: 12px;
}
.proofRead img, .rewrite img {
    max-width: 24px;
    width: 100%;
    margin: 0 auto 3px;
}

.rewrite {
    background-color: #bec5b891;
    padding: 10px;
    border-radius: 8px;
}

.friendlyArea {
    border-bottom: 1px solid #9aa195 !important;
}
.labelOptions .rewriteArea {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin: 0;
    font-size: inherit;
}
.labelOptions .rewriteArea {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin: 0;
    font-size: inherit;
}

.friendlyArea > div, .summaryArea > div {
    background: transparent;
    display: flex;
    align-items: center;
    padding: 5px 7px;
    border-radius: 6px !important;!im;!i;!;
    font-size: 12px;
    margin: 0;
    transition: 0.35s all;
}
.friendlyArea > div:hover, .summaryArea > div:hover {
    background: rgba(0, 0, 0, 0.08);
}

.friendlyArea > div img, .summaryArea > div img {
    width: 16px;
    margin: 0 5px 0 0;
    min-width: 16px;
}

.labelOptions .rewriteArea {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin: 0;
    font-size: inherit;
}

.friendlyArea > div, .summaryArea > div {
    background: transparent;
    display: flex;
    align-items: center;
    padding: 5px 7px;
    border-radius: 6px !important;!im;!i;!;
    font-size: 12px;
    margin: 0;
    transition: 0.35s all;
}
.friendlyArea > div:hover, .summaryArea > div:hover {
    background: rgba(0, 0, 0, 0.08);
}

.friendlyArea > div img, .summaryArea > div img {
    width: 16px;
    margin: 0 5px 0 0;
    min-width: 16px;
}

.quickLinks .optionCreateAIAssistant:after {
    background-image: url(../images/AIAssistant_icon.png);
    background-position: center center;
    background-size: 30px;
}

.aiMessageSuggestion {
    display: flex;
    column-gap: 20px;
    justify-content: end;
    margin-bottom: 10px;
    margin-top: 10px;
    position: absolute;
}

.aiMessageSuggestionData {
    width: 230px;
    background-image: linear-gradient(90.48deg, rgba(138, 0, 246, 0.5) -2.19%, rgba(96, 255, 255, 0.5) 26.83%, rgba(255, 68, 169, 0.5) 65.68%, rgba(255, 248, 92, 0.5) 101.42%);
    position: relative;
    border-radius: 50px;
    z-index: 1;
    padding: 12px 15px;
    display: flex;
    font-size: 12px;
    justify-content: center;
    text-wrap: wrap;
    align-items: center;
    cursor: pointer;
}

.aiMessageSuggestionData:after {
    content: "";
    background: #fff;
    left: 2px;
    right: 2px;
    top: 2px;
    bottom: 2px;
    border-radius: 50px;
    z-index: -1;
    position: absolute;
}

.aiMessageSuggestionData p {
    margin: 0;
}

.aiMessageSuggestions {
    display: flex;
    align-items: center;
    column-gap: 10px;
}
.aiMessageSuggestions img {
    width: 30px;
    height: 30px;
}

.aiMessageSuggestions span {
    color: rgba(145, 145, 145, 1);
    font-style: italic;
}

.aiMessageSuggestionData:hover {
    box-shadow: 0 4px 4px 0 rgba(62, 90, 72, 0.3) !important;
    transition: 0.4s;
}

.aiChatNote {
    margin-bottom: 8px;
    line-height: 1.3;
    font-size: 13px;
    color: #636363;
}

.AISuggestionThread {
}

.AISuggestionThreadTitle img {
    height: 30px;
    width: 30px;
}

.AISuggestionThreadArea .suggestion {
    font-weight: 600;
    margin-bottom: 10px;
}

.AISuggestionThreadData {
   font-size: 12px;
    color: #191919;
    margin-bottom: 8px;
    position: relative;
    padding-right: 20px;
    cursor: pointer;
}

.AISuggestionThreadTitle img:after {
    border: 1px solid #000000;
    position: absolute;
    top: 0;
}

.AISuggestionThread {
    background-image: linear-gradient(90.48deg, rgba(138, 0, 246, 0.5) -2.19%, rgba(96, 255, 255, 0.5) 26.83%, rgba(255, 68, 169, 0.5) 65.68%, rgba(255, 248, 92, 0.5) 101.42%);
    position: relative;
    border-radius: 10px;
    z-index: 1;
    padding: 10px;
    display: flex;
    font-size: 12px;
    justify-content: center;
    column-gap: 8px;
    margin: 10px;
}

.AISuggestionThread:after {
    content: "";
    background: #fff;
    left: 2px;
    right: 2px;
    top: 2px;
    bottom: 2px;
    border-radius: 10px;
    z-index: -1;
    position: absolute;
}

.AISuggestionThreadTitle:after {
    content: "";
    left: 50%;
    right: 50%;
    top: 30px;
    bottom: 40px;
    position: absolute;
    width: 1px;
    height: -webkit-fill-available;
    z-index: 0;
    border:  1px solid #E4E5ED;
}

.AISuggestionThreadTitle {
    position: relative;
}

.AISuggestionThreadData span {
    font-weight: 700;
}

.AISuggestionThreadData .messageDescription {margin-top: 5px;font-size: 10px;line-height: 13px;}

.AISuggestionThreadData:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 6px;
    height: 8px;
    width: 8px;
    border-top: 2px solid #555;
    border-right: 2px solid #555;
    transform: rotate(45deg);
    margin: auto;
}

.AIAssistant_icon {
    position: absolute;
    top: -28px;
    right: 117px;
    width: 25px;
    cursor: pointer;
}

.AIAssistant_icon img {
    width: 100%;
    height: auto;
}
.reset-flag-text{
    line-height: 1.15;
    color: red;
}


.postView .contentArea article.update.editEnable{
    padding-bottom: 58px;
}
.promptListDisabled{
    pointer-events: none;
    opacity: 0.5;
}

span.filteredRoleDisplay:after {
    content: "";
    position: absolute;
    top: 18px;
    bottom: 0;
    border-right: 2px solid #53c8e6;
    border-bottom: 2px solid #53c8e6;
    height: 8px;
    width: 8px;
    margin: auto 5px;
    transform: rotate(45deg); 
}

.inviteCircles .peopleListing .formLayout section .hgroup button.seeMembers:after{
    background-image: url(../images/drilldown-filter.png);
    background-size: 60%;
    background-position: 50% 50%;
}

.actionBar .nextButton.arrowIcon {
    display: flex;
    align-items: center;
    color: black;
    background: #53c8e6;
    line-height: 36px;
    top: 4px;
    right: 4px;
    border-radius: 50px;
    padding: 0 15px;
    white-space: nowrap;
}

.actionBar .nextButton.arrowIcon svg,.sendButton svg{
    min-width: 20px;
    margin-left: 5px;
}

.aiInputArea .sendButton {
    position: absolute;
    right: 21px;
    padding: 8px 12px;
    display: flex;
    color: black;
    background: #53c8e6;
    line-height: 36px;
    border-radius: 50px;
    padding: 0 15px;
}

.formTemplateDefinePage .separateTime .altDatePicker {
    padding-left: 120px !important;
}
s

.form-container {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px;
    width: 100%;
    max-width: 800px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    margin: 20px auto;
}

.form-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.form-title {
    width: 70%;
    border: none;
    border-bottom: 1px solid #e0e0e0;
    font-size: 20px;
    font-weight: bold;
    background: none;
    color: #333;
    padding-bottom: 5px;
}

.form-title:focus {
    outline: none;
    border-bottom-color: #007bff;
}

.form-sections {
    padding: 20px;
    background: #f0f2f4;
}

.section-header {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 20px;
    gap: 10px;
}

.section-actions button {
    padding: 8px 16px;
    border-radius: 20px;
    border: none;
    background: #00bcd4;
    color: white;
    cursor: pointer;
    font-size: 14px;
    margin-right: 10px;
}

.form-section-unit {
    background: white;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.section-title input {
    font-size: 18px;
    font-weight: 500;
    border: none;
    outline: none;
    width: 100%;
}

.question-container {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 16px;
    margin-bottom: 16px;
    font: 15px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.question-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.question-title-input {
    flex: 1;
    margin-right: 16px;
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.type-dropdown {
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    min-width: 150px;
}

.question-description {
    margin-bottom: 12px;
}

.description-input {
    width: 100%;
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.question-content {
    margin-bottom: 16px;
}

.short-answer-preview,
.long-answer-preview {
    width: 100%;
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #f5f5f5;
}

.long-answer-preview {
    min-height: 100px;
    resize: vertical;
}

.choice-options .option {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 8px;
}

.choice-options .option input[type="text"] {
    flex: 1;
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.remove-option {
    padding: 4px 8px !important;
    border: none !important;
    background: none !important;
    color: #ff5252 !important;
    cursor: pointer;
    font-size: 18px;
}

.add-option {
    padding: 8px 16px;
    border: none;
    background: #e0e0e0;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 8px;
}

.question-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
}

.question-actions {
    display: flex;
    gap: 8px;
}

.question-actions button {
    padding: 8px;
    border: none;
    background: none;
    cursor: pointer;
    color: #757575;
}

.question-settings {
    display: flex;
    gap: 16px;
    margin-left: 10px;
}

.setting {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.form-section-unit .btnDeleteHealth{
    top: -10px;
    height: 20px;
    width: 20px;
    background-position: -1300px -1030px !important;
}

#fillFormTemplate .form-sections{
    padding: 0 !important;
}

#fillFormTemplate .question-title,
#fillFormTemplate .section-title{
    font-weight: 600 !important;
}

#fillFormTemplate .question-title{
    font-size: 15px;
}

#fillFormTemplate .question-description{
    font-size: 14px;
}

.form-post-action-text {
    margin: 4px;
    font-size: 15px;
    line-height: normal;
    overflow: hidden;
    margin-bottom: 0;
    word-wrap: break-word;
    color: black;
}

.form-post-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    padding: 15px;
    margin: 10px 0;
    background: #fafafa;
}

.form-post-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-post-title {
    font :16px / 20px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #333;
}

.form-post-owner {
    font: 14px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    background: transparent;
    text-indent: 0px;
    color: #8e8e8e;
}

.form-post-due-date {
    font: 14px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    color: #8e8e8e;
}

.button-container {
    margin-left: 20px;
    display: flex;
    align-items: center;
}

.form-post-button {
    background: #53c8e6;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
}

#createEmailTemplate .formTemplateDefinePage label{
    font-size: 16px;
    font-weight: 500;
}

#createEmailTemplate .contentAddQuestions .import-validationMsg.no-margin{
    margin-top: 0;
    text-indent: 5px;
}

#fillFormTemplate .import-validationMsg.no-margin{
    margin-top: 0;
    text-indent: 5px;
}


.response-summary {
    background: #f5f5f5;
    min-height: 100vh;
}

.action-bar {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    background: white;
    border-bottom: 1px solid #e0e0e0;
}

.action-bar h1 {
    flex: 1;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
}

.toggle-view {
    display: flex;
    background: white;
    padding: 8px 16px;
    gap: 24px;
    justify-content: center;
    border-bottom: 1px solid #e0e0e0;
}

.toggle-view button {
    border: none;
    background: none;
    padding: 8px 0;
    color: #666;
    font-size: 14px;
    position: relative;
}

.toggle-view button.active {
    color: #2196f3;
}

.toggle-view button.active:after {
    content: '';
    position: absolute;
    bottom: -9px;
    left: 0;
    right: 0;
    height: 2px;
    background: #2196f3;
}

.responses-container {
    padding: 16px;
}

.question-block {
    background: white;
    border-radius: 8px;
    margin-bottom: 16px;
    padding: 20px !important;
    border: 1px solid #aaa !important;
}

.question-header {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
}

.question-header h3 {
    flex: 1;
    font-size: 16px;
    font-weight: 600;
}

.response-count {
    color: #666;
    font-size: 12px;
    margin-right: 16px;
}

.bar-chart .bar-row {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.option-label {
    width: 120px;
    font-size: 13px;
    color: #333;
}

.bar-container {
    flex: 1;
    height: 24px;
    background: #f5f5f5;
    border-radius: 4px;
    margin: 0 12px;
}

.bar {
    height: 100%;
    background: #8a2be2;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.percentage {
    width: 50px;
    font-size: 13px;
    color: #666;
}

.count {
    width: 40px;
    font-size: 13px;
    color: #666;
}

.pie-chart {
    display: flex;
    gap: 24px;
    align-items: center;
}

.pie-legend {
    flex: 1;
}

.legend-item {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.color-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 8px;
}

.text-responses .text-response {
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.5;
}

.file-responses .file-item {
    display: flex;
    align-items: center;
    padding: 8px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin-bottom: 8px;
}

.download-icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.file-name {
    font-size: 13px;
    color: #2196f3;
}

.toggle-action-bar {
    background: white;
    border-bottom: 1px solid #eee;
    padding: 0 16px;
    text-align: center;
}

.action-buttons button {
    border: none;
    background: none;
    color: #666;
    padding: 12px 16px;
    font-size: 14px;
    position: relative;
}

.action-buttons button.active {
    color: #2196f3;
}

.action-buttons button.active:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: #2196f3;
}

.section-block{
    padding: 15px;
    background: #fff;
    border-radius: 5px;
}

.submit-btn {
    margin-top: 15px;
    padding: 8px 16px;
    background-color: #53c8e6;
    color: white;
    border: none;
    border-radius: 20px;
    cursor: pointer;
    font-size: 12px;
}

.submit-btn:disabled {
    background-color: #cccccc;
    cursor: not-allowed;
}

.option {
    margin-bottom: 10px;
}

.form-instances-container {
    padding: 16px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.form-instances-title {
    font-size: 18px;
    font-weight: 500;
    color: #333;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eee;
}

.form-instances-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-instance-row {
    display: grid;
    grid-template-columns: 48px 1fr 48px;
    align-items: center;
    padding: 12px;
    border-bottom: 1px solid #aaa;
}

.instance-number {
    color: #666;
    font-weight: 500;
    text-align: center;
}

.instance-details {
    padding: 0 12px;
}

.instance-text {
    color: #333;
    font-size: 14px;
}

.instance-actions {
    display: flex;
    justify-content: center;
}

.icon-button {
    background: none;
    border: none;
    padding: 4px;
    cursor: pointer;
    border-radius: 50%;
    transition: background-color 0.2s;
}

.icon-button:hover {
    background: rgba(0,0,0,0.05);
}

.chart-container {
    height: 150px;
    max-height: 150px;
    overflow: hidden;
    max-width: 50%;
}
.voting-results {
    padding: 15px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

.vote-stats {
    margin-top: 20px;
    padding: 10px 0;
    border-top: 1px solid #eee;
}

.total-votes {
    display: block;
    font-weight: bold;
    margin-bottom: 10px;
    color: #333;
}

.vote-percentage {
    margin: 5px 0;
    color: #666;
}

.option-text {
    font-weight: 500;
}

.vote-count {
    color: #4CAF50;
}

.percentage {
    color: #757575;
    margin-left: 5px;
}

canvas.chart-horizontal-bar {
    width: 100% !important;
}

.form-response-info{
    margin-left: auto;
    color: #666;
    font: 12px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.image-container {
    max-width: 200px;
    margin: 10px 0;
}

.image-container img {
    width: 100%;
    height: auto;
    cursor: pointer;
}

.video-container {
    max-width: 300px;
    margin: 10px 0;
}

.video-container video {
    width: 100%;
    height: auto;
}

.file-container {
    display: flex;
    align-items: center;
    padding: 10px;
    border: 1px solid #e0e0e0;
    margin: 5px 0;
    border-radius: 4px;
}

.file-icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.file-name {
    flex-grow: 1;
    margin-right: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.download-btn img {
    width: 100%;
    height: 100%;
}
/* PDF Viewer Container Styles */
.pdf-viewer-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
}

.pdf-nav-button {
    padding: 5px 15px;
    background-color: #1ca0c8;
    color: white;
    border: none;
    border-radius: 3px;
    margin: 0 5px;
    cursor: pointer;
}

.pdf-nav-button:disabled {
    background-color: #cccccc;
    cursor: not-allowed;
}

.pdf-page-info {
    margin: 0 15px;
    font-size: 14px;
}

.pdf-zoom-button {
    padding: 5px 10px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 3px;
    margin: 0 5px;
    cursor: pointer;
}

.pdf-viewer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    position: relative;
    padding: 10px;
}

.pdf-canvas-container {
    width: 100%;
    overflow: auto;
    text-align: center;
    background-color: #f8f8f8;
    border: 1px solid #eee;
}

.pdf-canvas-container canvas {
    display: inline-block;
    margin: 0 auto;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.pdf-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    color: #666;
}

.pdf-error {
    color: #d9534f;
    text-align: center;
    padding: 20px;
    font-size: 14px;
}

/* Make sure the modal has sufficient width */
.selectMemberDialog.pdfViewer {
    max-width: 90%;
    width: 900px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .pdf-viewer-controls {
        flex-wrap: wrap;
    }

    .pdf-nav-button,
    .pdf-zoom-button {
        margin: 5px;
    }
}



.recipientPickerCtrl .peopleListing .hgroup.personEntryArea h3 {

    padding-left: 0;
    text-indent: 112px !important;
    line-height: 2.25;
    margin-bottom: 0 !important;
    padding-left: 0 !important;
    margin-top: -30px;
}

.recipientPickerCtrl .peopleListing .hgroup.personEntryArea h3 + h3 {
    margin-top: 0 !important;
    line-height: 1.25;
    margin-bottom: 7px !important;!
}

.deleteClass.archivingClass {
    font-size: 14px;
}

.form-response-info{
    margin-left: auto;
    color: #666;
    font: 12px 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

.image-container {
    max-width: 200px;
    margin: 10px 0;
}

.image-container img {
    width: 100%;
    height: auto;
    cursor: pointer;
}

.video-container {
    max-width: 300px;
    margin: 10px 0;
}

.video-container video {
    width: 100%;
    height: auto;
}

.file-container {
    display: flex;
    align-items: center;
    padding: 10px;
    border: 1px solid #e0e0e0;
    margin: 5px 0;
    border-radius: 4px;
}

.file-icon {
    width: 24px;
    height: 24px;
    margin-right: 10px;
}

.file-name {
    flex-grow: 1;
    margin-right: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.download-btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.download-btn img {
    width: 100%;
    height: 100%;
}
/* PDF Viewer Container Styles */
.pdf-viewer-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
}

.pdf-nav-button {
    padding: 5px 15px;
    background-color: #1ca0c8;
    color: white;
    border: none;
    border-radius: 3px;
    margin: 0 5px;
    cursor: pointer;
}

.pdf-nav-button:disabled {
    background-color: #cccccc;
    cursor: not-allowed;
}

.pdf-page-info {
    margin: 0 15px;
    font-size: 14px;
}

.pdf-zoom-button {
    padding: 5px 10px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 3px;
    margin: 0 5px;
    cursor: pointer;
}

.pdf-viewer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    position: relative;
    padding: 10px;
}

.pdf-canvas-container {
    width: 100%;
    overflow: auto;
    text-align: center;
    background-color: #f8f8f8;
    border: 1px solid #eee;
}

.pdf-canvas-container canvas {
    display: inline-block;
    margin: 0 auto;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.pdf-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    color: #666;
}

.pdf-error {
    color: #d9534f;
    text-align: center;
    padding: 20px;
    font-size: 14px;
}

/* Make sure the modal has sufficient width */
.selectMemberDialog.pdfViewer {
    max-width: 90%;
    width: 900px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .pdf-viewer-controls {
        flex-wrap: wrap;
    }

    .pdf-nav-button,
    .pdf-zoom-button {
        margin: 5px;
    }
}

.coachTooltip .info-icon:after {
    position: absolute;
    inset: 0;
    margin: auto;
    background-position: -343px -333px;
}

.coachTooltip .info-icon:hover:before {
    margin: 0;
    text-indent: 0;
    opacity: 1 !important;
    visibility: visible;
    position: absolute;
    bottom: 0;
    right: 100%;
    border-radius: 10px 10px 0px 10px;
}

.noResultFound-label{
    background: #f2f2f2;
    color: #666;
    display: block;
    text-indent: 15px;
    line-height: 30px;
    min-height: 30px;
    font-size: 14px;
    border-bottom: 1px solid #f2f2f2;
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: -o-sticky;
    position: sticky;
    top: 0;
    border-top: 1px solid #f2f2f2;
    z-index: 9999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: gotham;
}

.bulkImport-action-icon img {
    cursor: pointer;
}

/* Isolated Newsletter CSS - Scoped to prevent interference with other UI components */

/* Main container with namespace */
.newsletterEditorPage {
    background-color: #f7f7f7;
    height: 100vh;
    display: flex;
    flex-direction: column;
}

.newsletterEditorPage .newsletterContent {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

.newsletterEditorPage .formLayout {
    padding: 0;
    margin: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

/* Editor Content and Layout */
.newsletterEditorPage .editor-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

/* Newsletter panels layout */
.newsletterEditorPage .newsletter-panels {
    display: flex;
    height: 100%;
    overflow: hidden;
    flex: 1;
    gap: 0;
}

/* Panel styling */
.newsletterEditorPage .nl-panel {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    overflow: hidden;
}

.newsletterEditorPage .nl-panel-header {
    padding: 15px 20px;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    position: sticky;
    top: 0;
    z-index: 10;
}

.newsletterEditorPage .nl-panel-header h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.newsletterEditorPage .nl-panel-content {
    flex: 1;
    overflow-y: auto;
    transition: all 0.3s ease;
}

/* Left panel */
.newsletterEditorPage .nl-panel-left {
    width: 30%;
    min-width: 240px;
    border-right: 1px solid #e0e0e0;
    background-color: #f2f2f2;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    max-height: 750px;
    overflow: hidden;
    height: 100%;
}

/* Main panel */
.newsletterEditorPage .nl-panel-main {
    width: 80%;
    min-width: 450px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.newsletterEditorPage .nl-panel-main .nl-panel-content {
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* Back option in panel header when editing a block */
.newsletterEditorPage .nl-back-option {
    display: flex;
    align-items: center;
}

.newsletterEditorPage .nl-back-link {
    display: flex;
    align-items: center;
    color: #3880ff;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    text-transform: capitalize;
}

.newsletterEditorPage .nl-back-icon {
    margin-right: 8px;
    font-size: 18px;
}

/* Template selector */
.newsletterEditorPage .nl-template-selector {
    margin-bottom: 25px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
}

.newsletterEditorPage .nl-template-selector label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #444;
    font-size: 14px;
}

/* Select element shared styling */
.newsletterEditorPage .nl-template-selector select,
.newsletterEditorPage .nl-style-option select,
.newsletterEditorPage .setting-group select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d8d8d8;
    border-radius: 6px;
    background-color: #fff;
    font-size: 14px;
    transition: border-color 0.2s ease;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg fill='%23888' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 16px;
    line-height: 1;
}

.newsletterEditorPage .nl-template-selector select,
.newsletterEditorPage .nl-style-option select {
    height: 38px;
    border: 1px solid #ddd;
    background-color: #fff;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
}

.newsletterEditorPage .nl-template-selector select:focus,
.newsletterEditorPage .nl-style-option select:focus,
.newsletterEditorPage .setting-group select:focus,
.newsletterEditorPage .setting-group input:focus,
.newsletterEditorPage .setting-group textarea:focus,
.newsletterEditorPage .newsletter-title input:focus {
    border-color: #3880ff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(56, 128, 255, 0.1);
}

.newsletterEditorPage .nl-template-selector select:invalid,
.newsletterEditorPage .nl-template-selector select option[value=""] {
    color: #999;
}

/* Block types grid */
.newsletterEditorPage .nl-block-types {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-bottom: 25px;
}

.newsletterEditorPage .nl-block-type {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 15px;
    height: 110px; /* Fixed height for square appearance */
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.newsletterEditorPage .nl-block-type:hover {
    background-color: #f0f7ff;
    border-color: #b8d3ff;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}

.newsletterEditorPage .nl-block-type .icon {
    margin-bottom: 12px;
    height: 40px;
    width: 40px;
    color: #555;
}

.newsletterEditorPage .nl-block-type .name {
    font-size: 13px;
    text-align: center;
    color: #444;
    font-weight: 500;
}

/* Global styles section */
.newsletterEditorPage .nl-global-styles {
    margin-top: 15px;
    padding-top: 20px;
    border-top: 1px solid #e0e0e0;
}

.newsletterEditorPage .nl-global-styles h4 {
    margin: 0 0 15px 0;
    font-size: 16px;
    font-weight: 500;
    color: #444;
}

.newsletterEditorPage .nl-style-option {
    display: block;
    margin-bottom: 15px;
}

.newsletterEditorPage .nl-style-option label {
    font-size: 14px;
    color: #555;
    min-width: 90px;
}

/* Color input styling */
.newsletterEditorPage .nl-style-option input[type="color"],
.newsletterEditorPage .setting-group input[type="color"] {
    width: 36px;
    height: 36px;
    padding: 2px;
    border: 1px solid #d8d8d8;
    border-radius: 6px;
    background: none;
}

/* Settings panel */
.newsletterEditorPage .nl-settings-panel {
    padding: 5px 0;
}

.newsletterEditorPage .setting-group {
    margin-bottom: 18px;
    padding: 12px 15px;
    border-bottom: 1px solid #eee;
}

.newsletterEditorPage .setting-group:last-child {
    border-bottom: none;
}

.newsletterEditorPage .setting-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    font-size: 14px;
    color: #444;
}

.newsletterEditorPage .setting-group input,
.newsletterEditorPage .setting-group textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d8d8d8;
    border-radius: 6px;
    background-color: #fff;
    font-size: 14px;
    transition: all 0.2s ease;
}

.newsletterEditorPage .setting-group textarea {
    min-height: 100px;
    line-height: 1.5;
    resize: vertical;
    white-space: pre-wrap;
    overflow-y: auto;
}

/* Required field indicator */
.newsletterEditorPage .setting-group label.required::after {
    content: '*';
    color: #e53935;
    margin-left: 4px;
}

/* Help text styles */
.newsletterEditorPage .setting-group .help-text {
    display: block;
    font-size: 12px;
    color: #777;
    margin-top: 5px;
    font-style: italic;
}

/* Settings footer */
.newsletterEditorPage .nl-settings-footer {
    margin-top: 30px;
    padding-top: 15px;
    border-top: 1px solid #e0e0e0;
    text-align: right;
    position: sticky;
    bottom: 0;
    background-color: #fff;
    padding: 15px;
    z-index: 10;
}

.newsletterEditorPage .nl-save-settings {
    padding: 10px 20px;
    background-color: #3880ff;
    color: white;
    border: none;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.newsletterEditorPage .nl-save-settings:hover {
    background-color: #2d6ad1;
    box-shadow: 0 2px 8px rgba(56, 128, 255, 0.3);
}

/* Newsletter preview area */
.newsletterEditorPage .nl-newsletter-preview {
    background-color: #fff;
    flex: 1;
    overflow-y: auto;
    padding: 10px 30px;
    min-height: 500px;
    border-radius: 5px;
    box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.05);
}

/* Empty state styling */
.newsletterEditorPage .nl-empty-state {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 300px;
    color: #888;
    font-style: italic;
    text-align: center;
    border: 2px dashed #d8d8d8;
    border-radius: 8px;
    background-color: #f9f9f9;
    padding: 30px;
    line-height: 1.6;
    background-image: linear-gradient(135deg, #f9f9f9 25%, #f5f5f5 25%, #f5f5f5 50%, #f9f9f9 50%, #f9f9f9 75%, #f5f5f5 75%, #f5f5f5 100%);
    background-size: 40px 40px;
    animation: newsletterMoveBackgroundStripes 30s linear infinite;
}

.newsletterEditorPage .nl-empty-state.drop-target-active {
    background-color: rgba(56, 128, 255, 0.05);
    border: 2px dashed rgba(56, 128, 255, 0.3);
}

.newsletterEditorPage .nl-empty-state p {
    font-size: 16px;
    max-width: 300px;
    line-height: 1.5;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    margin: 0;
}

/* Block container */
.newsletterEditorPage .nl-block-container {
    position: relative;
    transition: all 0.2s ease;
    overflow: visible;
    transform: translateZ(0); /* Force a stacking context */
    animation: newsletterFadeIn 0.3s ease;
    border-spacing: 0;
    border-collapse: separate;
    margin: 0;
}

.newsletterEditorPage .nl-block-container:hover {
    border-color: #ccc;
    transform: none;
}

.newsletterEditorPage .nl-block-container.selected {
    border: 2px solid #333;
    box-shadow: 0 0 0 2px #33333354;
    animation: newsletterSlideDown 0.2s ease;
    border-collapse: separate;
    margin: 0 auto;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-radius: 4px 4px 0 0;
    overflow: hidden;
}

div.nl-block-container:first-child {
    border-radius: 4px 4px 0 0 !important;
}

div.nl-block-container:last-child {
    border-radius: 0 0 4px 4px;
}


.readMoreLessContent:has(> table.nl-outer-table) {
    display: flex;
    justify-content: center;
}

.newsletterEditorPage .nl-block-container.selected::after {
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    height: 5px;
    background-color: #333;
    border-radius: 0;
}

.newsletterEditorPage .nl-block-content {
    background-color: #fff;
    border-radius: 0;
    overflow: hidden;
    cursor: pointer;
    position: relative;
}

/* Inline block controls */
.newsletterEditorPage .nl-inline-block-controls {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 100;
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

.newsletterEditorPage .nl-block-container.selected .nl-inline-block-controls {
    opacity: 1;
    pointer-events: all;
}

/* Control buttons */
.newsletterEditorPage .nl-control-buttons {
    display: flex;
    align-items: center;
    background-color: #444;
    border-radius: 4px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.newsletterEditorPage .nl-left-controls {
    margin-left: auto;
    margin-right: auto;
}

.newsletterEditorPage .nl-right-controls {
    margin-right: 15px;
}

.newsletterEditorPage .nl-control-buttons button {
    background: none;
    border: none;
    color: #fff;
    width: 30px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.2s;
    padding: 0;
}

.newsletterEditorPage .nl-control-buttons button svg {
    fill: #fff;
}

.newsletterEditorPage .nl-control-buttons button:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* Specific button styles */
.newsletterEditorPage .nl-drag-handle {
    cursor: grab !important;
    touch-action: none;
    -webkit-user-drag: none;
    user-select: none;
    -webkit-user-select: none;
}

.newsletterEditorPage .nl-drag-handle:active {
    cursor: grabbing !important;
}

.newsletterEditorPage .nl-control-buttons .nl-delete:hover {
    background-color: rgba(255, 0, 0, 0.2);
}

.newsletterEditorPage .nl-arrow-up:hover,
.newsletterEditorPage .nl-arrow-down:hover,
.newsletterEditorPage .nl-duplicate:hover,
.newsletterEditorPage .nl-edit:hover {
    color: #3880ff;
}

.newsletterEditorPage .nl-delete:hover {
    color: #e53935;
}

/* Drag and drop */
.newsletterEditorPage .nl-block-container.is-being-dragged {
    background-color: #f9f9f9;
    border: 2px dashed #3880ff;
    opacity: 0.8;
    pointer-events: none;
    z-index: 9999 !important;
}

.newsletterEditorPage .ui-sortable-helper {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3) !important;
    border: 2px solid #3880ff !important;
    background: #fff !important;
    opacity: 0.85 !important;
    transform: scale(1.02) !important;
    z-index: 10000 !important;
}

.newsletterEditorPage .nl-insertion-point {
    height: 6px;
    background-color: #3880ff;
    margin: 10px 0;
    border-radius: 4px;
    box-shadow: 0 0 10px rgba(56, 128, 255, 0.5);
}

.newsletterEditorPage .nl-block-placeholder {
    border: 2px dashed #3880ff;
    background-color: rgba(56, 128, 255, 0.1);
    height: 80px;
    margin: 10px 0;
    border-radius: 8px;
    box-shadow: inset 0 0 10px rgba(56, 128, 255, 0.1);
}

/* Buttons & Form Controls */
.newsletterEditorPage .toolbar-button {
    background-color: #f5f5f5;
    border: 1px solid #e0e0e0;
    color: #444;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.newsletterEditorPage .toolbar-button:hover {
    background-color: #e0e0e0;
}

.newsletterEditorPage .preview-btn {
    background-color: #f0f7ff;
    border: 1px solid #d0e1f9;
    color: #3880ff;
    padding: 8px 16px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.newsletterEditorPage .preview-btn:hover {
    background-color: #e0eeff;
    box-shadow: 0 2px 5px rgba(56, 128, 255, 0.15);
}

.newsletterEditorPage .upload-btn {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 8px 12px;
    background-color: #f0f7ff;
    border: 1px solid #d0e1f9;
    color: #3880ff;
    border-radius: 6px;
    text-align: center;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.newsletterEditorPage .upload-btn:hover:not([disabled]) {
    background-color: #e0eeff;
    box-shadow: 0 2px 5px rgba(56, 128, 255, 0.15);
}

.newsletterEditorPage .upload-btn[disabled] {
    opacity: 0.7;
    cursor: not-allowed;
    background-color: #f0f0f0;
    color: #888;
    border-color: #ddd;
}

.newsletterEditorPage .edit-template-btn {
    background-color: #3880ff;
    border: 1px solid #3265d1;
    color: #fff;
    padding: 8px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s ease;
}

.newsletterEditorPage .edit-template-btn:hover {
    background-color: #2d6ad1;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Newsletter title */
.newsletterEditorPage .newsletter-title {
    margin: 15px 0;
    width: 100%;
}

.newsletterEditorPage .newsletter-title input {
    width: 100%;
    font-size: 16px;
    font-weight: normal;
    color: #333;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px;
    background-color: #fff;
    box-shadow: none;
    transition: border-color 0.2s ease;
    font-family: 'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
}

/* Remove the redundant editor-header */
.newsletterEditorPage .editor-header {
    display: none;
}

/* Action Bar */
.newsletterEditorPage .actionBar {
    display: flex;
    align-items: center;
    position: relative;
}

.newsletterEditorPage .actionBar h1 {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 1;
}

.newsletterEditorPage .actionBar .editor-actions {
    display: flex;
    gap: 10px;
    margin-left: auto;
    margin-right: 120px;
    position: relative;
    z-index: 2;
}

.newsletterEditorPage .actionBar .backButtonOnly,
.newsletterEditorPage .actionBar .nextButton {
    z-index: 90;
}

/* Block type specific styles */
/* Header Block */
.newsletterEditorPage .header-block {
    padding: 25px 20px;
    background-color: #4CAF50;
    color: white;
    text-align: center;
    line-height: 1.3;
}

.newsletterEditorPage .header-block h1 {
    margin: 10px 0;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.3;
}

.newsletterEditorPage .header-block h2 {
    margin: 5px 0 10px;
    font-size: 18px;
    font-weight: normal;
    opacity: 0.9;
    line-height: 1.3;
}

.newsletterEditorPage .logo-container {
    margin-bottom: 15px;
    position: relative;
}
/*
.newsletterEditorPage .logo-container img {
    max-width: 200px;
    max-height: 60px;
    border-radius: 4px;
}
*/

/* Paragraph Block */
.newsletterEditorPage .paragraph-block {
    padding: 20px;
    line-height: 1.5;
}

.newsletterEditorPage .paragraph-title h3 {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 20px;
    line-height: 1.3;
    color: #333;
}

.newsletterEditorPage .paragraph-content {
    line-height: 1.6;
    min-height: 60px;
    white-space: normal;
    word-break: break-word;
}

.newsletterEditorPage .paragraph-content p {
    margin: 0 0 12px 0;
    line-height: 1.6;
}

/* Paragraph with image layouts */
.newsletterEditorPage .paragraph-with-image {
    display: flex;
    gap: 20px;
    margin-bottom: 15px;
}

.newsletterEditorPage .paragraph-with-image.image-left {
    flex-direction: row;
}

.newsletterEditorPage .paragraph-with-image.image-right {
    flex-direction: row-reverse;
}

.newsletterEditorPage .paragraph-with-image .image-container {
    flex: 0 0 40%;
    max-width: 40%;
}

.newsletterEditorPage .paragraph-with-image .paragraph-content {
    flex: 1;
}

/* Image Block */
.newsletterEditorPage .image-block {
    padding: 15px;
}

.newsletterEditorPage .image-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 150px;
    background-color: #f9f9f9;
    border: 1px dashed #ccc;
    margin: 10px 0;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.newsletterEditorPage .image-placeholder:hover {
    background-color: #e9f1fe;
    border-color: #3880ff;
}

.newsletterEditorPage .image-placeholder span {
    color: #888;
    font-size: 14px;
}

.newsletterEditorPage .image-container {
    margin: 10px 0;
    position: relative;
    display: inline-block;
    line-height: 0;
}

.newsletterEditorPage .image-container img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
}

.newsletterEditorPage .image-caption {
    text-align: center;
    color: #666;
    font-size: 14px;
    margin-top: 8px;
    font-style: italic;
}

.newsletterEditorPage .image-grid {
    display: flex;
    gap: 15px;
}

.newsletterEditorPage .image-grid-2 .image-item,
.newsletterEditorPage .image-grid-3 .image-item {
    flex: 1;
}

/* Add to the newsletter.css file */
.newsletterEditorPage  .change-image-btn {
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
    padding: 4px 8px !important;
    background-color: rgba(0, 0, 0, 0.5) !important;
    color: white !important;
    border: none !important;
    border-radius: 3px !important;
    font-size: 11px !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
    cursor: pointer !important;
    font-weight: normal !important;
    letter-spacing: 0.3px !important;
}

.newsletterEditorPage  .image-container:hover .change-image-btn {
    opacity: 0.7 !important;
}

.newsletterEditorPage  .change-image-btn:hover {
    opacity: 1 !important;
    background-color: rgba(0, 0, 0, 0.7) !important;
}

.newsletterEditorPage .image-container:hover .change-image-btn {
    opacity: 1;
}

.newsletterEditorPage .image-preview {
    margin: 10px 0;
    text-align: center;
}

.newsletterEditorPage .preview-thumbnail {
    max-width: 100%;
    max-height: 120px;
    border-radius: 4px;
    border: 1px solid #eee;
}

/* Button Block */
.newsletterEditorPage .button-block {
    padding: 25px 15px;
    text-align: center;
}

.newsletterEditorPage .btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 500;
    font-size: 16px;
    transition: all 0.2s ease;
    pointer-events: none;
}

.newsletterEditorPage .btn.primary {
    background-color: #3880ff;
    color: white;
    box-shadow: 0 2px 5px rgba(56, 128, 255, 0.3);
}

.newsletterEditorPage .btn.primary:hover {
    background-color: #2d6ad1;
    box-shadow: 0 4px 8px rgba(56, 128, 255, 0.4);
    transform: translateY(-1px);
}

.newsletterEditorPage .btn.secondary {
    background-color: #5c5c5c;
    color: white;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.newsletterEditorPage .btn.secondary:hover {
    background-color: #444;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

.newsletterEditorPage .btn.outline {
    background-color: transparent;
    border: 2px solid #3880ff;
    color: #3880ff;
}

.newsletterEditorPage .btn.outline:hover {
    background-color: rgba(56, 128, 255, 0.05);
    box-shadow: 0 2px 5px rgba(56, 128, 255, 0.15);
    transform: translateY(-1px);
}

/* Divider Block */
.newsletterEditorPage .divider-block {
    padding: 25px 15px;
}

.newsletterEditorPage .divider {
    width: 100%;
}

/* Settings for image blocks */
.newsletterEditorPage .image-settings-list {
    margin-top: 15px;
}

.newsletterEditorPage .image-setting {
    padding: 15px;
    background-color: #f9f9f9;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    margin-bottom: 15px;
}

/* Upload progress indicator */
.newsletterEditorPage .upload-progress-container {
    margin-top: 8px;
    width: 100%;
    height: 5px;
    background-color: #f0f0f0;
    border-radius: 3px;
    overflow: hidden;
}

.newsletterEditorPage .upload-progress-bar {
    height: 100%;
    background-color: #3880ff;
    transition: width 0.3s ease;
}

/* Froala Editor customizations */
.newsletterEditorPage .fr-box.fr-basic {
    border-radius: 6px;
    overflow: hidden;
}

.newsletterEditorPage .fr-box.fr-basic .fr-element {
    min-height: 120px;
    padding: 15px;
    color: #333;
    font-family: inherit;
    line-height: 1.6;
}

.newsletterEditorPage .fr-toolbar {
    border: 1px solid #d8d8d8 !important;
    border-radius: 6px 6px 0 0 !important;
    box-shadow: none !important;
    background-color: #f9fafb !important;
}

.newsletterEditorPage .fr-wrapper {
    border: 1px solid #d8d8d8 !important;
    border-top: none !important;
    border-radius: 0 0 6px 6px !important;
}

.newsletterEditorPage .fr-toolbar.fr-inline {
    max-width: 450px !important;
    background-color: #fff !important;
    border: 1px solid #d8d8d8 !important;
    border-radius: 6px !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15) !important;
}

.newsletterEditorPage .fr-btn-grp {
    margin: 0 !important;
}

.newsletterEditorPage .fr-btn {
    color: #444 !important;
}

.newsletterEditorPage .fr-btn:hover {
    background-color: #f0f7ff !important;
}

.newsletterEditorPage .fr-btn.fr-active {
    color: #3880ff !important;
    background: #e0eeff !important;
}

/* Toast notification styles */
.newsletterEditorPage .nl-toast {
    position: fixed;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 12px 24px;
    border-radius: 8px;
    z-index: 9999;
    font-size: 15px;
    animation: newsletterFadeInUp 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Color palette selector styles */
.newsletterEditorPage .color-palette-selector {
    margin-top: 5px;
    width: 100%;
    padding: 5px;
    border: 1px solid #dcdcdc;
    border-radius: 4px;
    background-color: #f9f9f9;
    max-width: 295px;
}

.newsletterEditorPage .color-palette-grid {
    display: grid;
    grid-template-columns: repeat(8, 2em);
    gap: 5px;
}

.newsletterEditorPage .color-palette-item {
    width: 24px;
    height: 24px;
    border: 1px solid #d0d0d0;
    border-radius: 3px;
    cursor: pointer;
    box-sizing: border-box;
    transition: transform 0.1s ease-in-out, border-color 0.1s ease-in-out;
    position: relative;
    overflow: hidden;
}

.newsletterEditorPage .color-palette-item:hover {
    transform: scale(1.1);
    border-color: #888;
    z-index: 1;
}

.newsletterEditorPage .color-palette-item.selected {
    border: 2px solid #000000;
    transform: scale(1.05);
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.7);
}

.newsletterEditorPage .color-picker-item {
    position: relative;
    overflow: hidden;
    background-color: #ffffff;
    border: 1px dashed #a0a0a0;
}

.newsletterEditorPage .color-picker-item input[type="color"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    border: none;
    padding: 0;
}

.newsletterEditorPage .color-picker-item::before {
    content: '+';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px;
    color: #888;
    pointer-events: none;
}

/* Newsletter blocks */
.newsletterEditorPage .nl-newsletter-blocks {
    max-width: 90%;
    margin: 80px auto;
    border-radius: 5px;
    border-spacing: 0;
    overflow: hidden;
}

.newsletterEditorPage .nl-newsletter-blocks.drop-target-active {
    outline: none;
    background-color: transparent;
}

/* Resize handle for images */
.resize-handle {
    width: 8px !important; /* Smaller from default 12px */
    height: 8px !important; /* Smaller from default 12px */
    background-color: #3880ff !important;
    border: 1px solid #fff !important;
    border-radius: 2px !important;
    cursor: nwse-resize !important;
    z-index: 10 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2) !important;
}

.image-selection-frame {
    border: 1px solid #3880ff !important;
    border-radius: 2px !important;
    box-shadow: 0 0 4px rgba(56, 128, 255, 0.2) !important;
}

/* Make the handles visible only on hover */
.image-container:not(:hover) .resize-handle,
.image-container:not(:hover) .image-selection-frame {
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
}

.image-container:hover .resize-handle,
.image-container:hover .image-selection-frame {
    opacity: 1 !important;
    transition: opacity 0.2s ease !important;
}

.newsletterEditorPage .resize-handle:hover {
    background-color: rgba(45, 106, 209, 1);
}

/* Global cursor style when resizing */
body.is-resizing-nwse, body.is-resizing-nwse * {
    cursor: nwse-resize !important;
}

/* Newsletter template selection */
.newsletterEditorPage .newsletter-content-area,
.newsletter-content-area {
    margin-top: 10px;
    background: #fff;
}

.newsletterEditorPage .newsletter-template-selection,
.newsletter-template-selection {
    padding: 15px 0;
}

.newsletterEditorPage .newsletter-template-selection h2,
.newsletter-template-selection h2 {
    text-align: center;
    margin-bottom: 20px;
    font-size: 16px;
    color: #333;
}

.newsletterEditorPage .template-grid,
.template-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    max-height: 300px;
    overflow-y: auto;
}

.newsletterEditorPage .template-item,
.template-item {
    width: 220px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    margin: 2px;
}

.newsletterEditorPage .template-item:hover,
.template-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-color: #b3e0ff;
}

.newsletterEditorPage .template-preview,
.template-preview {
    height: 140px;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
    border: 1px solid #eee;
}

.newsletterEditorPage .template-preview img,
.template-preview img {
    max-width: 100%;
    max-height: 140px;
}

.newsletterEditorPage .template-preview svg,
.template-preview svg {
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.2));
}

.newsletterEditorPage .template-item h3,
.template-item h3 {
    margin: 5px 0;
    font-size: 14px;
    color: #333;
}

.newsletterEditorPage .template-item p,
.template-item p {
    margin: 3px 0;
    font-size: 12px;
    color: #666;
    line-height: 1.4;
}

.newsletterEditorPage .newsletter-editor-container,
.newsletter-editor-container {
    width: 100%;
    min-height: 400px;
}

/* Newsletter preview */
.newsletterEditorPage .newsletter-preview-container {
    padding: 20px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    position: relative;
}

.newsletterEditorPage .newsletter-preview-container::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 9999;
    border-radius: 4px;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.1);
}

.newsletterEditorPage .newsletter-preview-container::before {
    content: 'View Only';
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    z-index: 99999;
    opacity: 0.8;
}

.newsletterEditorPage .newsletter-preview-content {
    width: 100%;
    min-height: 500px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    background-color: white;
    padding: 0;
    overflow: auto;
    position: relative;
    z-index: 5;
}

.newsletterEditorPage .newsletter-editor-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #444;
    color: white;
    padding: 10px 15px;
}

.newsletterEditorPage .back-to-templates-btn,
.newsletterEditorPage .export-btn {
    background-color: #fff;
    border: 1px solid #ddd;
    color: #333;
    padding: 8px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
}

.newsletterEditorPage .editor-title {
    font-weight: 500;
    font-size: 18px;
    color: #fff;
}

/* Validation styles */
.newsletterEditorPage .validation-error {
    border-color: #e53935 !important;
    background-color: rgba(229, 57, 53, 0.05) !important;
    box-shadow: 0 0 0 2px rgba(229, 57, 53, 0.1) !important;
}

.newsletterEditorPage .validation-error:focus {
    border-color: #e53935 !important;
    box-shadow: 0 0 0 2px rgba(229, 57, 53, 0.2) !important;
}

.newsletterEditorPage .validation-help {
    display: block;
    font-size: 12px;
    color: #e53935;
    margin-top: 4px;
}

/* Visual layout selector */
.newsletterEditorPage .visual-layout-selector {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 10px;
}

.newsletterEditorPage .layout-option {
    display: flex;
    flex-direction: column;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.newsletterEditorPage .layout-option:hover .layout-preview {
    border-color: #3880ff;
}

.newsletterEditorPage .layout-option.selected .layout-preview {
    border-color: #3880ff;
    box-shadow: 0 0 0 2px rgba(56, 128, 255, 0.3);
}

.newsletterEditorPage .layout-option .layout-title {
    font-size: 14px;
    color: #555;
    font-weight: 500;
    margin-bottom: 8px;
}

.newsletterEditorPage .layout-option .layout-preview {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 15px;
    transition: all 0.2s ease;
}

.newsletterEditorPage .layout-option .image-placeholder {
    background-color: #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
    border-radius: 2px;
}

.newsletterEditorPage .layout-option .image-placeholder svg {
    width: 24px;
    height: 24px;
    opacity: 0.7;
}

.newsletterEditorPage .layout-option .two-columns {
    display: flex;
    gap: 10px;
}

.newsletterEditorPage .layout-option .two-columns .image-placeholder {
    flex: 1;
}

.newsletterEditorPage .layout-option .three-columns {
    display: flex;
    gap: 10px;
}

.newsletterEditorPage .layout-option .three-columns .image-placeholder {
    flex: 1;
}

/* Post Tabs */
.post-tabs {
    display: flex;
    margin: 0 10px 15px 10px;
    border-bottom: 1px solid #e0e0e0;
    padding: 0;
    position: relative;
}

.post-tabs .tab-item {
    padding: 8px 15px;
    margin-right: 5px;
    cursor: pointer;
    border-radius: 5px 5px 0 0;
    position: relative;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-bottom: none;
    font-weight: 500;
    font-size: 14px;
}

.post-tabs .tab-item.active {
    color: #1ca0c8;
    border-bottom: 2px solid #1ca0c8;
    font-weight: 500;
    background-color: #fff;
    border-bottom: 1px solid #fff;
    z-index: 1;
}

.post-tabs .new-badge {
    background-color: #ffcc00;
    color: #333;
    font-size: 10px;
    padding: 2px 4px;
    border-radius: 3px;
    margin-left: 5px;
    font-weight: bold;
    text-transform: uppercase;
}

//* Drop target styles */
.newsletterEditorPage .nl-drop-indicator {
    position: absolute;
    border: 2px dashed #3880ff;
    background-color: rgba(56, 128, 255, 0.1);
    border-radius: 6px;
    height: 60px;
    left: 0;
    right: 0;
    z-index: 90;
    pointer-events: none;
    display: none;
    animation: pulse-border 1.5s infinite alternate;
}

.newsletterEditorPage .nl-drop-indicator:after {
    content: '+';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 30px;
    height: 30px;
    background-color: #3880ff;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

@keyframes pulse-border {
    0% { border-color: rgba(56, 128, 255, 0.6); }
    100% { border-color: rgba(56, 128, 255, 1); }
}

.newsletterEditorPage .nl-drop-hover {
    background-color: rgba(56, 128, 255, 0.1) !important;
    border: 2px dashed #3880ff !important;
}

/* Drag and drop helpers */
.newsletterEditorPage .nl-block-drag-helper {
    background: white;
    border: 2px solid #3880ff;
    border-radius: 6px;
    padding: 10px;
    width: 120px !important;
    height: 80px !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    display: flex !important;
    align-items: center;
    justify-content: center;
    opacity: 0.9 !important;
    z-index: 9999 !important;
}

.newsletterEditorPage .nl-block-type.dragging {
    opacity: 0.6;
    transform: scale(1.05);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}

.newsletterEditorPage .nl-newsletter-preview.drag-target {
    background-color: rgba(56, 128, 255, 0.05) !important;
    box-shadow: inset 0 0 0 2px rgba(56, 128, 255, 0.3);
    transition: all 0.2s ease;
}

.newsletterEditorPage .nl-newsletter-preview.drag-over {
    background-color: rgba(56, 128, 255, 0.1) !important;
    box-shadow: inset 0 0 0 3px rgba(56, 128, 255, 0.5);
}

.newsletterEditorPage .nl-insertion-ghost {
    height: 4px;
    background-color: #3880ff;
    margin: 10px 0;
    border-radius: 4px;
    box-shadow: 0 0 8px rgba(56, 128, 255, 0.5);
    animation: newsletterPulse 1.5s infinite;
}

/* Block styling during drag operation */
.block-dragging {
    all: initial;
    display: block;
    background-color: white;
    border: 2px solid #3880ff;
    border-radius: 8px;
    padding: 15px;
    cursor: grabbing;
    font-family: inherit;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    transition: none !important;
    color: #333;
    font-size: 14px;
    text-align: center;
    animation: pulse-border 1.5s infinite;
}

.block-dragging * {
    pointer-events: none;
}

.block-dragging .icon {
    height: 40px;
    width: 40px;
    margin: 0 auto 10px auto;
    display: block;
}

.block-dragging .name {
    font-weight: 500;
    margin-bottom: 5px;
}

/* Student/User specific styles */
.actionSheetHighLightText {
    color: #e86c6c;
}

.textWithImage {
    display: flex;
    align-items: center;
    justify-content: center;
}

.textWithImage figure {
    max-width: 40px;
    width: 20px;
    margin: 0 1rem 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.textWithImage + span {
    margin: 0.8rem 0 0.5rem 0;
    display: inline-block;
    font-size: 12px !important;
}

.textWithImage + span:empty {
    display: none;
}

.newTabImageWrapper figure {
    width: 24px;
    max-width: 24px;
    opacity: 0.3;
}

.optionArea {
    display: flex;
    align-items: center;
    justify-content: center;
}

.newTabImageWrapper {
    max-width: 18px;
    position: absolute;
    right: 5px;
    width: 18px;
    height: 18px;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.newTabImageWrapper figure {
    margin: 0;
    width: auto;
    min-width: inherit;
    max-width: inherit;
    height: 100%;
}

.newTabImageWrapper figure img {
    vertical-align: top;
}

.dialogButtons button {
    position: relative;
}

.support.topNav {
    position: absolute;
    right: 85px;
    top: 38px;
    z-index: 1002;
    width: 30px;
    font-size: 0;
    cursor: pointer;
}

.support.topNav:before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-image: url(../images/supportIcon.png);
    background-repeat: no-repeat;
    background-size: 78%;
    background-position: 50% 50%;
}

.support.topNav img {
    top: -5px;
    right: -11px;
    min-width: 12px;
    height: 18px;
    position: absolute;
}

.studentResult > div {
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0;
    position: relative;
    vertical-align: top;
}

.imageFeedbackControl.studentInfo {
    color: #555;
    font-size: 14px;
    text-align: left;
    font-family: Gotham;
}

.imageFeedbackControl.studentInfo > div {
    margin: 5px 0 5px 0;
}


.profileM.giftIconWrapper:after{
    content:attr(data-displayname);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    margin-left:-52px;
    padding-right:40px;
    height:20px;
    overflow:hidden;
    white-space:nowrap;
    display:inline-block;
    text-overflow:ellipsis;
    text-indent:50px;
    background: url('../images/giftbox.png') no-repeat right center;
    background-size: 12px 12px;
    padding-right: 26px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: auto;
}

.metaData.redemptionWrapper{
    color: #898989 !important;
    font-size: 14px !important;
    left: 78px !important;
    position: relative !important;
    margin-top: -14px !important;
    line-height: 1.3 !important;
}

.coachTooltip-behaviorPositivePoints.schoolTotalPoint {
    color: #800080;
}

.profileM.multipleStudentsAwardIconWrapper:after{
    content:attr(data-displayname);
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    margin-left:-52px;
    padding-right:40px;
    height:20px;
    overflow:hidden;
    white-space:nowrap;
    display:inline-block;
    text-overflow:ellipsis;
    text-indent:50px;
    background: url('../images/multiplestudents-icon.png') no-repeat right center;
    background-size: 16px 16px;
    padding-right: 26px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: auto;
}

.hgroup.awardList::after {
    content: "";
    width: 30px;
    height: 30px;
    background: url(../images/three-dots.png) no-repeat fixed;
    top: 5px;
    right: -17px;
    position: absolute;
    display: inline-block;
}


.coachTooltip-behaviorPositivePoints.studentSelector::before {
    margin-left: calc(100% - 160px);
    border-radius: 10px 10px 0px 10px;
    bottom: 18px;
    width: 140px;
}

/* Scrollbar styling */
.newsletterEditorPage .nl-panel-content::-webkit-scrollbar,
.newsletterEditorPage .nl-newsletter-preview::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.newsletterEditorPage .nl-panel-content::-webkit-scrollbar-track,
.newsletterEditorPage .nl-newsletter-preview::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
}

.newsletterEditorPage .nl-panel-content::-webkit-scrollbar-thumb,
.newsletterEditorPage .nl-newsletter-preview::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    transition: background 0.2s ease;
}

.newsletterEditorPage .nl-panel-content::-webkit-scrollbar-thumb:hover,
.newsletterEditorPage .nl-newsletter-preview::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.25);
}

/* Firefox scrollbar styling */
.newsletterEditorPage .nl-panel-content,
.newsletterEditorPage .nl-newsletter-preview {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.05);
}

/* Handle hover state in Firefox */
.newsletterEditorPage .nl-panel-content:hover,
.newsletterEditorPage .nl-newsletter-preview:hover {
    scrollbar-color: rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.05);
}

/* Make sure scrollbars don't affect layout when appearing */
.newsletterEditorPage .nl-panel-content,
.newsletterEditorPage .nl-newsletter-preview {
    overflow-y: overlay;
}

/* Animations */
@keyframes newsletterFadeInUp {
    from {
        opacity: 0;
        transform: translate(-50%, 20px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

@keyframes newsletterFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes newsletterSlideDown {
    from { transform: translateY(-15px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes newsletterMoveBackgroundStripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 80px 80px;
    }
}

@keyframes newsletterPulse {
    0% { opacity: 0.6; }
    50% { opacity: 1; }
    100% { opacity: 0.6; }
}

@keyframes pulse-border {
    0% { border-color: rgba(56, 128, 255, 0.6); }
    100% { border-color: rgba(56, 128, 255, 1); }
}

/* Responsive Design */
@media (max-width: 1200px) {
    .newsletterEditorPage .newsletter-panels {
        min-height: 450px;
    }

    .newsletterEditorPage .nl-panel-left {
        width: 30%;
    }

    .newsletterEditorPage .nl-panel-main {
        width: 70%;
    }
}

@media (max-width: 991px) {
    .newsletterEditorPage .newsletter-panels {
        flex-direction: column;
        min-height: 0;
    }

    .newsletterEditorPage .nl-panel {
        width: 100% !important;
        min-width: 0;
    }

    .newsletterEditorPage .nl-panel-left {
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }

    .newsletterEditorPage .nl-panel-content {
        max-height: 300px;
    }

    .newsletterEditorPage .nl-block-types {
        grid-template-columns: repeat(3, 1fr);
    }

    .newsletterEditorPage .editor-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .newsletterEditorPage .newsletter-title input {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .newsletterEditorPage .editor-header {
        padding: 15px;
    }

    .newsletterEditorPage .nl-newsletter-preview {
        padding: 20px 15px;
    }

    .newsletterEditorPage .nl-block-types {
        grid-template-columns: repeat(2, 1fr);
    }

    .newsletterEditorPage .image-grid {
        flex-direction: column;
    }

    .newsletterEditorPage .image-item {
        margin-bottom: 15px;
    }

    .newsletterEditorPage .nl-global-styles .nl-style-option {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .newsletterEditorPage .nl-global-styles .nl-style-option label {
        margin-bottom: 5px;
    }

    .newsletterEditorPage .paragraph-with-image {
        flex-direction: column;
    }

    .newsletterEditorPage .paragraph-with-image.image-left,
    .newsletterEditorPage .paragraph-with-image.image-right {
        flex-direction: column;
    }

    .newsletterEditorPage .paragraph-with-image .image-container {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 15px;
    }

    .template-grid {
        gap: 10px;
    }

    .template-item {
        width: 180px;
    }

    .template-preview {
        height: 120px;
    }
}

@media (max-width: 576px) {
    .newsletterEditorPage .nl-block-types {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .newsletterEditorPage .nl-panel-content {
        padding: 15px;
    }

    .newsletterEditorPage .nl-toast {
        width: 90%;
        max-width: none;
        text-align: center;
    }

    .template-grid {
        flex-direction: column;
        align-items: center;
    }

    .template-item {
        width: 90%;
        max-width: 280px;
    }
}

.nl-ghost-block {
    transition: all 0.2s ease;
    pointer-events: none;
    opacity: 0.9;
    user-select: none;
}

@keyframes pulse-border {
    0% { border-color: rgba(56, 128, 255, 0.6); }
    100% { border-color: rgba(56, 128, 255, 1); }
}

.newsletter-template-selection .template-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.image-selection-frame {
    position: absolute;
    pointer-events: none;
    z-index: 5;
    box-shadow: 0 0 0 2px rgba(56, 128, 255, 0.5);
}

.resize-handle {
    position: absolute;
    width: 12px;
    height: 12px;
    background-color: #3880ff;
    border: 2px solid white;
    border-radius: 50%;
    z-index: 10;
    cursor: default;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    transition: background-color 0.2s;
}

.resize-handle:hover {
    background-color: #2d6ad1;
}

.resize-handle-se { cursor: nwse-resize; }
.resize-handle-sw { cursor: nesw-resize; }
.resize-handle-ne { cursor: nesw-resize; }
.resize-handle-nw { cursor: nwse-resize; }
.resize-handle-n { cursor: ns-resize; }
.resize-handle-s { cursor: ns-resize; }
.resize-handle-e { cursor: ew-resize; }
.resize-handle-w { cursor: ew-resize; }

/* Global cursor styles when resizing */
body.is-resizing-se, body.is-resizing-se * { cursor: nwse-resize !important; }
body.is-resizing-sw, body.is-resizing-sw * { cursor: nesw-resize !important; }
body.is-resizing-ne, body.is-resizing-ne * { cursor: nesw-resize !important; }
body.is-resizing-nw, body.is-resizing-nw * { cursor: nwse-resize !important; }
body.is-resizing-n, body.is-resizing-n * { cursor: ns-resize !important; }
body.is-resizing-s, body.is-resizing-s * { cursor: ns-resize !important; }
body.is-resizing-e, body.is-resizing-e * { cursor: ew-resize !important; }
body.is-resizing-w, body.is-resizing-w * { cursor: ew-resize !important; }

/* Hover state for image containers */
.newsletterEditorPage .image-container {
    position: relative;
    transition: all 0.2s ease;
}

.newsletterEditorPage .image-container:hover {
    outline: 2px dashed rgba(56, 128, 255, 0.5);
}

.newsletterEditorPage .image-container img.resizable-image {
    max-width: 100%;
    height: auto;
}


.newsletter-editor-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #444;
    color: white;
    padding: 10px 15px;
}

.back-to-templates-btn, .edit-template-btn {
    background-color: #fff !important;
    border: 1px solid #ddd !important;
    color: #333 !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    line-height: 1 !important;
}

.editor-title {
    font-weight: 500;
    font-size: 18px;
    color: #fff;
}

.newsletter-preview-container::before {
    content: 'View Only';
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    z-index: 99999;
    opacity: 0.8;
}

.newsletter-preview-content {
    width: 100%;
    min-height: 500px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    background-color: white;
    padding: 0;
    overflow: auto;
}

.newsletter-preview-container::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(0 0 0 / 20%) pointer-events: none;
    z-index: 9999;
    border-radius: 4px;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.1);
    pointer-events: none;
}

.nl-control-buttons .block-type-indicator {
    display: inline-block;
    color: white;
    padding: 3px 8px;
    font-size: 12px;
    text-transform: capitalize;
    border-radius: 3px;
    margin-right: 5px;
}

.setting-group > label {
    font-weight: 600 !important;
}
.actionSheet .dialogBox p.note {
    text-align: left;
    font-size: 14px;
}

.nl-container td {
    border: none !important;
}

.resizable-image {
  transition:
    width  0.15s ease-out,
    height 0.15s ease-out;
}

/* smoothness */
.resizable-image {
  transition: width 0.15s ease-out, height 0.15s ease-out;
}
.resizable-image.no-transition {
  transition: none !important;
}



/* Add these styles to your CSS file */
.template-source {
    font-size: 12px;
    color: #666;
    margin-top: 5px;
    padding: 3px 6px;
    background-color: #f5f5f5;
    border-radius: 3px;
    display: inline-block;
}

.template-source.admin {
    background-color: #e3f2fd;
    color: #1976d2;
}

section.formLayout.admintoolSetting {
    padding: 0 0 80px 0;
}

.manageStudentsDetails.saveDraft ul {
    position: static;
}

.support.topNav.messageTrayIcon::before {
    content: "";
    top: 0;
    right: 10px;
}

.support.topNav.messageTrayIcon .badge {
    text-align: center;
    text-indent: 0;
    min-width: 18px;
    display: block;
    height: 18px;
    padding: 0 3px;
    color: #fff;
    position: absolute;
    top: -5px;
    right: -10px;
    font-size: 10px;
    line-height: 20px;
    text-shadow: none;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    box-shadow: inset 0px -1px 0px rgba(0, 0, 0, .1);
    background: #e86c6c;
}

.communityManage .itemsList .hgroup.postDetails h3 {
    margin-top: 0 !important;
    text-indent: 0 !important;
    margin-bottom: 0;
}

.poll-option-text {
    display: inline-block;
    max-width: 250px; /* Adjust based on your design */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
}

.language-selector-container{
    padding: 0 20px;
}

.form-submitted {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
    color: white !important;
}

.resubmit-button:hover {
    color: #495057 !important;
}

.button-container {
    justify-content: flex-end;
}/* Generated by Font Squirrel (http://www.fontsquirrel.com) on March 25, 2013 */


@font-face {

    font-family: 'focobold';

    src: url('/fonts/foco_std_bd-webfont.eot');

    src: url('/fonts/foco_std_bd-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_bd-webfont.woff') format('woff'),

         url('/fonts/foco_std_bd-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_bd-webfont.svg#focobold') format('svg');

    font-weight: normal;
    font-style: normal;


}







@font-face {

    font-family: 'focobold_italic';

    src: url('/fonts/foco_std_bdit-webfont.eot');

    src: url('/fonts/foco_std_bdit-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_bdit-webfont.woff') format('woff'),

         url('/fonts/foco_std_bdit-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_bdit-webfont.svg#focobold_italic') format('svg');

    font-weight: normal;
    font-style: normal;


}







@font-face {

    font-family: 'focoblack';

    src: url('/fonts/foco_std_blk-webfont.eot');

    src: url('/fonts/foco_std_blk-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_blk-webfont.woff') format('woff'),

         url('/fonts/foco_std_blk-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_blk-webfont.svg#focoblack') format('svg');

    font-weight: normal;
    font-style: normal;


}

@font-face {

    font-family: 'focoblack_italic';

    src: url('/fonts/foco_std_blkit-webfont.eot');

    src: url('/fonts/foco_std_blkit-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_blkit-webfont.woff') format('woff'),

         url('/fonts/foco_std_blkit-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_blkit-webfont.svg#focoblack_italic') format('svg');

    font-weight: normal;
    font-style: normal;


}






@font-face {

    font-family: 'focoitalic';

    src: url('/fonts/foco_std_it-webfont.eot');

    src: url('/fonts/foco_std_it-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_it-webfont.woff') format('woff'),

         url('/fonts/foco_std_it-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_it-webfont.svg#focoitalic') format('svg');

    font-weight: normal;
    font-style: normal;


}






@font-face {

    font-family: 'focolight';

    src: url('/fonts/foco_std_lt-webfont.eot');

    src: url('/fonts/foco_std_lt-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_lt-webfont.woff') format('woff'),

         url('/fonts/foco_std_lt-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_lt-webfont.svg#focolight') format('svg');

    font-weight: normal;
    font-style: normal;


}






@font-face {

    font-family: 'focolight_italic';

    src: url('/fonts/foco_std_ltit-webfont.eot');

    src: url('/fonts/foco_std_ltit-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_ltit-webfont.woff') format('woff'),

         url('/fonts/foco_std_ltit-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_ltit-webfont.svg#focolight_italic') format('svg');

    font-weight: normal;
    font-style: normal;


}






@font-face {

    font-family: 'focoregular';

    src: url('/fonts/foco_std_rg-webfont.eot');

    src: url('/fonts/foco_std_rg-webfont.eot?#iefix') format('embedded-opentype'),

         url('/fonts/foco_std_rg-webfont.woff') format('woff'),

         url('/fonts/foco_std_rg-webfont.ttf') format('truetype'),

         url('/fonts/foco_std_rg-webfont.svg#focoregular') format('svg');

    font-weight: normal;
    font-style: normal;


}






@font-face {
    font-family: 'firetoRain';

    src: url('/fonts/setFireToRain.eot');

    src: url('/fonts/setFireToRain.eot?#iefix') format('embedded-opentype'),

         url('/fonts/setFireToRain.woff') format('woff'),

         url('/fonts/setFireToRain.ttf') format('truetype');
}


/* New fonts
===================================*/
@font-face {
    font-family: 'Gotham';
    src: url('/fonts/GothamBlack-Italic.eot');
    src: url('/fonts/GothamBlack-Italic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/GothamBlack-Italic.woff2') format('woff2'),
        url('/fonts/GothamBlack-Italic.woff') format('woff'),
        url('/fonts/GothamBlack-Italic.ttf') format('truetype'),
        url('/fonts/GothamBlack-Italic.svg#GothamBlack-Italic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/GothamBold-Italic.eot');
    src: url('/fonts/GothamBold-Italic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/GothamBold-Italic.woff2') format('woff2'),
        url('/fonts/GothamBold-Italic.woff') format('woff'),
        url('/fonts/GothamBold-Italic.ttf') format('truetype'),
        url('/fonts/GothamBold-Italic.svg#GothamBold-Italic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/GothamBold.eot');
    src: url('/fonts/GothamBold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/GothamBold.woff2') format('woff2'),
        url('/fonts/GothamBold.woff') format('woff'),
        url('/fonts/GothamBold.ttf') format('truetype'),
        url('/fonts/GothamBold.svg#GothamBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-BlackItalic.eot');
    src: url('/fonts/Gotham-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Gotham-BlackItalic.woff2') format('woff2'),
        url('/fonts/Gotham-BlackItalic.woff') format('woff'),
        url('/fonts/Gotham-BlackItalic.ttf') format('truetype'),
        url('/fonts/Gotham-BlackItalic.svg#Gotham-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-MediumItalic.eot');
    src: url('/fonts/Gotham-MediumItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Gotham-MediumItalic.woff2') format('woff2'),
        url('/fonts/Gotham-MediumItalic.woff') format('woff'),
        url('/fonts/Gotham-MediumItalic.ttf') format('truetype'),
        url('/fonts/Gotham-MediumItalic.svg#Gotham-MediumItalic') format('svg');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('/fonts/Gotham-Medium.eot');
    src: url('/fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Gotham-Medium.woff2') format('woff2'),
        url('/fonts/Gotham-Medium.woff') format('woff'),
        url('/fonts/Gotham-Medium.ttf') format('truetype'),
        url('/fonts/Gotham-Medium.svg#Gotham-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham-book';
    src: url('/fonts/GothamBook-Italic.eot');
    src: url('/fonts/GothamBook-Italic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/GothamBook-Italic.woff2') format('woff2'),
        url('/fonts/GothamBook-Italic.woff') format('woff'),
        url('/fonts/GothamBook-Italic.ttf') format('truetype'),
        url('/fonts/GothamBook-Italic.svg#GothamBook-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham-book';
    src: url('/fonts/GothamBook.eot');
    src: url('/fonts/GothamBook.eot?#iefix') format('embedded-opentype'),
        url('/fonts/GothamBook.woff2') format('woff2'),
        url('/fonts/GothamBook.woff') format('woff'),
        url('/fonts/GothamBook.ttf') format('truetype'),
        url('/fonts/GothamBook.svg#GothamBook') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/*************************************************
*
*  768+ RESOLUTION
*
*************************************************/


@media screen
and (min-width:768px){


    /********************************************
    * Create Class
    ********************************************/
    .labelEnableStudentTimeline {
        padding-left: 14px !important;
    }




    /********************************************
    * General Styles
    ********************************************/
    html,body{
        /*background-image: linear-gradient(-225deg, #a8a6c5 0%, #2580B3 100%);
        background: #3795B6;
        background: -moz-linear-gradient(-45deg,  #a8a6c5 0%, #2580b3 100%);
        background: -webkit-linear-gradient(-45deg,  #a8a6c5 0%,#2580b3 100%);
        background: linear-gradient(135deg,  #a8a6c5 0%,#2580b3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a8a6c5', endColorstr='#2580b3',GradientType=1 );*/
        background:#faf8f8;
    }
    body{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        /*padding:23px 15px 0 15px;*/
    }
    .na .shadowBox, /* represents un-authenticated user, before sign in or sign up */
    #login:not(.isLoggedInUser),
    #signUpScreen,
    #signUpScreenChildren,
    #launchScreen,
    #forgotPassword,
    #terms,
    #privacy,
    #supportedLanguages,
    #unsubscribe,
    .StudentJoinCode.shadowBox:before,
     #_verifyUserIdentity .shadowBox{
        /*background-image: linear-gradient(-225deg, #adabc1 0%, #2580B3 100%);
        background: #3795B6;
        background: -moz-linear-gradient(-45deg,  #adabc1 0%, #2580b3 100%);
        background: -webkit-linear-gradient(-45deg,  #adabc1 0%,#2580b3 100%);
        background: linear-gradient(135deg,  #adabc1 0%,#2580b3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#adabc1', endColorstr='#2580b3',GradientType=1 );*/
        background: -moz-linear-gradient(45deg, rgba(0,122,173,1) 0%, rgba(40,199,255,1) 100%);
        background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, rgba(0,122,173,1)), color-stop(100%, rgba(40,199,255,1)));
        background: -webkit-linear-gradient(45deg, rgba(0,122,173,1) 0%, rgba(40,199,255,1) 100%);
        background: -o-linear-gradient(45deg, rgba(0,122,173,1) 0%, rgba(40,199,255,1) 100%);
        background: -ms-linear-gradient(45deg, rgba(0,122,173,1) 0%, rgba(40,199,255,1) 100%);
        background: linear-gradient(45deg, rgba(0,122,173,1) 0%, rgba(40,199,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28c7ff', endColorstr='#007aad',GradientType=1 );
    }
    #terms.inAppTerms {
      background: rgba(0,0,0,.4);
    }
    .noScroll{
        display:block;
        overflow:hidden;
        height:100%;
    }
    /*  Hide for Mobile  */
    .logo.logo_hideMob,
    .mainNavBar.mainNavBar_hideMob{
        display:block;
    }
    .deviceType{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        /*max-width:1068px;*/
        max-width:100%;
        height:100%;
        position:relative;
        margin:0 auto;
        box-shadow:0 5px 20px rgba(0,0,0,.4);
    }
    div.deviceType.fre {
        background: #e8e8e8;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        width: 100%;
        padding: 0 30px 30px 30px;
        margin: -30px -30px 0 -30px;
        box-sizing: content-box;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        margin-left:-30px;
        box-shadow: none;
        max-width: none;
    }
    .deviceType.Desktop.fre .hidingMainPanel {
        opacity: 0;
        filter: alpha(opacity=0);
        padding: 0 !important;
    }
    .inIFrame .Desktop .deviceType {
        margin: 0px 0px 0px 0px;
    }
    .deviceType .keyboardWrapper{
        overflow:hidden;
        width:100%;
        height:100%;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        position:relative;
    }
    .mainPanel{
        box-shadow:none;
        overflow:visible;
    }
    #beforeMainPanel{
        box-shadow:none;
    }
    #beforeMainPanel #bloomzTray{
        opacity:0;
        filter:alpha(opacity=0);
    }
    .mainPanel,
    #beforeMainPanel,
    #genericControls{
        z-index:auto;
    }
    .mainNavBar .bloomzLogo{
        left: 0;
        top: -4px;
        width: 210px;
        z-index: 1;
        background:none;
    }



    /********************************************
    * Mask for Sidepanel and Org Page animations
    ********************************************/




    /********************************************
    * Student Layout
    ********************************************/
    .studentLayout{
        /*max-width:560px;*/
        box-shadow:none;
    }
    .StudentJoinCode.shadowBox .subPage {
        max-width: 800px;
    }
    .studentLayout .inlineBox .subPage{
        padding-left:0;
    }
    .studentLayout .inlineBox .subPage .scrollView,
    .studentLayout.firefox .inlineBox .subPage .scrollView{
        padding-right:0;
    }
    .studentLayout .profilePage .actionBar h1{
        padding:4px 88px;
    }
    .studentLayout .inlineBox .scrollView:after{
        display:none;
    }
    .studentLayout .inlineBox .actionButtons,
    .studentLayout .inlineBox .nextButton{
        right:0;
    }
    .studentLayout .recipients span span span{
        color:#000;
    }
    .studentLayout #orgHome.menu .actionBar h1,
    .studentLayout .mainPanel .actionBar h1,
    .studentLayout .inlineBox .actionBar h1{
        padding:4px 88px;
    }
    .studentLayout .inlineBox .contentArea{
        margin-right:0;
    }




    /********************************************
    * Fullscreen Layout
    ********************************************/
    .appFullScreen{
        max-width:none;
        padding-top:30px;
    }
    .appFullScreen .deviceType{
        zoom:1.25;
    }
    .appFullScreen .deviceType.ie{
        zoom:1;
    }
    .appFullScreen .sidePanel,
    .appFullScreen .mainNavBar{
        display:none !important;
    }
    .appFullScreen .contentArea{
        margin:0 !important;
    }
    .appFullScreen .mainPage{
        padding-top:48px !important;
    }
    .appFullScreen .div.mainPage .quickLinks{
        left:12px;
    }
    .appFullScreen #orgHome .orgNav{
        padding:0 !important;
    }
    .appFullScreen #orgHome .communityPage,
    .appFullScreen #orgHome .communityPage.hasSubTabs{
        padding-top:48px !important;
    }
    .appFullScreen .addCurSection button{
        left:12px !important;
    }
    .appFullScreen .inlineBox .actionBar .backButtonOnly,
    .appFullScreen .inlineBox .actionBar .backButton{
        left:0 !important;
        padding-left:0;
    }
    .appFullScreen .inlineBox .subPage{
        padding-left:0;
        padding-top:48px;
    }
    .appFullScreen .inlineBox .subPage .scrollView{
        padding-right:0;
    }
    .appFullScreen .inlineBox .scrollView:after{
        display:none;
    }
    .appFullScreen .inlineBox .actionButtons,
    .appFullScreen .inlineBox .nextButton{
        top:0;
        right:0;
    }
    .appFullScreen .mainPanel .actionBar,
    .appFullScreen #orgHome .communityPage .actionBar,
    .appFullScreen #communityMembersView .actionBar,
    .appFullScreen .behaviorManagementSelectMultiple .actionBar{
        height:48px;
        line-height:48px;
        min-height:48px;
        padding-top:0;
    }
    .appFullScreen .mainPanel .actionBar:after,
    .appFullScreen #orgHome .communityPage .actionBar:after,
    #communityMembersView .actionBar:after,
    .appFullScreen .behaviorManagementSelectMultiple .actionBar:after{
        display:none;
    }
    #communityMembersView .header.actionBar{
        height:64px !important;
    }
    .appFullScreen .mainPanel .actionBar h1,
    .appFullScreen #orgHome.menu .actionBar h1,
    .appFullScreen #orgHome .communityPage .actionBar h1,
    .appFullScreen #communityMembersView .actionBar h1,
    .appFullScreen .inlineBox .actionBar h1{
        padding:4px 88px !important;
        font-size: 20px;
        line-height:40px;
        color:#000;
    }
    .appFullScreen .inlineBox .contentArea{
        margin-right:0;
    }
    .appFullScreen .recipients span span span{
        color:#000;
    }
    .appFullScreen .profilePage .actionBar h1{
        padding:4px 88px;
    }
    .appFullScreen .behaviorManagementHeader .fullscreen{
        display:none;
    }
    .appFullScreen .exitFS{
        display: inline-block !important;
    }
    .appFullScreen .exitFS:before{
        display:none !important;
    }



    /********************************************
    * Fullscreen Layout - Behavior Management
    ********************************************/
    .appFullScreen .deviceType,
    .appFullScreen.deviceType{
        max-width:none;
        width:100%;
    }
    .appFullScreen .orgNav,
    .appFullScreen .subNavTabs,
    .appFullScreen .quickLinks,
    .appFullScreen .hideOnFullScreen{
        display: none !important;
    }
    .appFullScreen .orgSettingsPage .orgNav{
        display: block !important;
    }
    .appFullScreen .communityMembersSearchBarFullScreen{
        margin-top: 30px !important;
    }
    .appFullScreen .orgMembersPage .addCurSection button,
    .appFullScreen .orgMembersPage .orgEdit,
    .appFullScreen .orgMembersPage .orgNav,
    .appFullScreen .orgMembersPage .persistentEmptyPanelMsg{
        display:none;
    }
    .appFullScreen .orgMembersPage .actionBar h1{
        padding:4px 12px !important;
    }
    .appFullScreen .grpSettings{
        display:none;
    }
    .appFullScreen .orgMembersPage .subInlineTabs,
    .appFullScreen .behaviorManagementSelectMultiple .subInlineTabs{
        margin-bottom:0 !important;
    }
    .appFullScreen .orgMembersPage .subInlineTabs .Teams{
        border-radius: 0 4px 4px 0;
    }
    .appFullScreen .orgMembersPage .subInlineTabs .Members{
        display:none;
    }
    .appFullScreen .orgMembersPage{
        padding-top:48px !important;
    }
    .appFullScreen .mainPage{
        display:none;  /* Hiding mainpanel in fullscreen since it is showing behind SkillsPicker */
    }
    .appFullScreen .behaviorManagementItem{
        width:112px;
        height:116px;
    }
    .appFullScreen .behaviorManagementHeader{
        margin-top:0 !important;
    }
    .appFullScreen .behaviorManagementHeader>section{
        margin-top:0 !important;
        height:28px;
        padding-top:32px;
    }
    .appFullScreen .behaviorManagementItemBadge{
        font-size:18px;
        top:12px;
        right:12px;
    }
    .appFullScreen .behaviorManagementItemBadge.negative{
        margin-top: 20px;
    }
    .appFullScreen .behaviorManagementItemName{
        bottom:6px;
        font-size:16px;
    }
    .appFullScreen .behaviorManagementItemName .secondLine{
        font-size:13px;
    }
    .appFullScreen .ie .inlineBox{
        width: 80% !important;
        overflow: visible !important;
    }
    .appFullScreen .behaviorManagementSummary{
        height: 43px !important;
        margin-top: 15px;
    }
    .appFullScreen .studentProfileGrid.behaviorManagementContent .behaviorManagementItemIcon{
        width:54px;
        height:54px;
    }
    .appFullScreen #_mainPanelContainer:after,
    .appFullScreen .subPage:after{
        display:none;
    }


    /********************************************
    * Rounded Corners
    ********************************************/
    .deviceType,
    .mainPanel,
    .addCurSection,
    #genericControls .subPage,
    #genericControls .actionBar{
        -moz-border-top-left-radius:8px;
        -webkit-border-top-left-radius:8px;
        /*border-top-left-radius:8px;   EPY:Causing slow scrolling in IE11 */
        -moz-border-top-right-radius:8px;
        -webkit-border-top-right-radius:8px;
        /*border-top-right-radius:8px;   EPY:Causing slow scrolling in IE11 */
    }
    nav.mainNavBar{
        -moz-border-top-left-radius:8px;
        -webkit-border-top-left-radius:8px;
        /*border-top-left-radius:8px;   EPY:Causing slow scrolling in IE11 */
    }



    /********************************************
    * Animations
    ********************************************/
    .mainPage,
    .shadowBox{
        animation:none;
        -webkit-animation:none;
    }



    /********************************************
    * Logo
    ********************************************/
    .logo{
        display:none;
    }
    .logo ~ .actionBar .backButtonOnly{
        display:inline-block;
    }




    /********************************************
    * Logo: Menu button to show navigation drawer
    ********************************************/
    .shadowBox .menuButton{
        display:block;
        width:67px;
        height:48px;
        position:absolute;
        text-indent:-9999px;
        top:0px;
        left:0px;
    }
    .shadowBox .menuButton:after{
        background-position:-63px -1316px;
        border-right:none;
        box-shadow:none;
    }
    .shadowBox .menuButton:active:after{
        background-color:transparent;
    }



    /********************************************
    * Loader
    ********************************************/
    .loadMoreEntries{
        width: 1024px;
        left:50%;
        margin-left:-540px;
        margin-top:-10px;
    }
    .loadMoreEntries.bottom{
        width:500px;
        margin-left:-250px !important;
    }
    .communityPage .loadMoreEntries{
        margin-left:-288px;
    }
    .postsTab .loadMoreEntries,
    .messagesTab .loadMoreEntries{
        margin-top:-1px;
    }
    .ie .loadMoreEntries{
        width: 935px;
        left:55%;
    }
    .ie #yearbookCreateScenes .loadMoreEntries{
        width: auto !important;
    }
    .ie #yearbookCreateScenes .loadMoreEntries.loadMoreEntriesGeneral{
        width: 600px !important;
    }
    .ie .loadingUploadImage {
        left:0;
    }
    .ie .communityPage .loadMoreEntries{
        margin-top:130px;
        width: 680px;
    }




    /********************************************
    * Demo Class
    ********************************************/
    #_demoClass .alertBox {
        position: absolute;
    }
    #_demoClass .activeCtrl:before{
        content: "";
        display: block;
        width: 268px;
        height: 63px;
        position: absolute;
        right: 0;
        z-index: 450;
        -webkit-border-radius: 0 8px 0 0;
        -moz-border-radius: 0 8px 0 0;
        border-radius: 0 8px 0 0;
        /*border-bottom:1px solid #c3c3c3;*/
        background: #ffffff;
        /*background: -moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5));
        background: -webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: -o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: -ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%);
        filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5',GradientType=0 )";*/
    }


    /********************************************
    * Demo ClassLoader
    ********************************************/
    .showSidePanel .loadingDemoClass .alertBox{
        width:533px;
    }
    .loadingDemoClass{
        position:relative;
    }
    .loadingDemoClass .alertBox{
        width:100%;
    }



    #orgHome .quickLinks{
        display:inline-block;
    }
    div.mainPage .quickLinks ul,
    div.subPage:not(.profilePage) .quickLinks ul{
        padding:0 0 50px 300px;
    }
    div.mainPage .showQuickLinks ~ .recipientPickerCtrl.modeMainPanel .forModeMainPanel.actionBar.selectGroups,
    div.subPage:not(.profilePage) .showQuickLinks ~ .recipientPickerCtrl.modeMainPanel .forModeMainPanel.actionBar.selectGroups{
        top:-1px; /* Need this because the contacts search bar gets shifted down when showing quicklinks on desktop.  Conflict with translateZ(0) above */
    }
    div.mainPage .showQuickLinks ~ .scrollView:before,
    div.subPage:not(.profilePage) .showQuickLinks ~ .scrollView:before{
        display:none;
    }
    div.mainPage .showQuickLinks .quickLinks,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks{
        width:350px;
        padding:0 10px 65px 0 !important;
        height:100%;
        pointer-events:none;
        width:400px;
    }
    div.mainPage .showQuickLinks .quickLinks *,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks *{
        pointer-events:all;
    }
    div.mainPage .showQuickLinks .quickLinks ul,
    div.mainPage .showQuickLinks .quickLinks .addButton,
    div.mainPage .hideQuickLinks .quickLinks,
    div.mainPage .hideQuickLinks .quickLinks ul,
    div.mainPage .hideQuickLinks .quickLinks .addButton,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks ul,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks .addButton,
    div.subPage:not(.profilePage) .hideQuickLinks .quickLinks,
    div.subPage:not(.profilePage) .hideQuickLinks .quickLinks ul,
    div.subPage:not(.profilePage) .hideQuickLinks .quickLinks .addButton{
        animation:none !important;
        -webkit-animation:none !important;
        transform: none !important;
        -webkit-transform: rotate(0deg) !important;
    }
    .orgHomePage .showQuickLinks .quickLinks .addButton,
    .orgHomePage .hideQuickLinks .quickLinks .addButton,
    .hideQuickLinks .quickLinks:after,
    .showQuickLinks .quickLinks:after{
        animation:none !important;
        -webkit-animation:none !important;
    }
    div.mainPage div .quickLinks ul,
    div.subPage:not(.profilePage) div .quickLinks ul{
        padding:0;
        padding-left:4px;
        border-top:none;
    }
    div.mainPage .quickLinks ul:before,
    div.subPage:not(.profilePage) .quickLinks ul:before{
        display:none;
    }
    div.mainPage .quickLinks li,
    div.subPage:not(.profilePage) .quickLinks li{
        font-family:'Gotham', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
        width:100%;
        height:auto;
        min-height:54px;
        line-height:54px;
        text-align:left;
        padding-top:0;
        font-size:16px;
        text-indent:54px;
        background:rgba(255,255,255,.8);
        /*border-bottom:1px solid #e6e6e6;*/
    }
    div.mainPage .quickLinks li span,
    div.subPage:not(.profilePage) .quickLinks li span{
        display:block;
        padding:0 6px 0 54px;
    }
    .quickLinks li span:before{
        display:none;
    }
    div.mainPage .quickLinks ul li:after,
    div.subPage:not(.profilePage) .quickLinks ul li:after{
        left:26px;
        top:5px;
    }
    div.mainPage .showQuickLinks .quickLinks:before,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks:before{
        content:"";
        background:#fff;
        width:15px;
        height:15px;
        display:block;
        -moz-border-radius: 20px 0 0 0;
        -webkit-border-radius: 20px 0 0 0;
        border-radius: 20px 0 0 0;
        transform:rotate(45deg);
        -webkit-transform:rotate(45deg);
        position:absolute;
        bottom:58px;
        left:auto;
        right:23px;
        z-index:1;
        box-shadow:4px 4px 8px rgba(0, 0, 0, .25);
        border:solid #e4e5ed;
        border-width:0 1px 1px 0;
    }
    div.mainPage .quickLinks,
    div.subPage:not(.profilePage) .quickLinks{
        top:119px;
        left:auto;
        bottom:auto;
        right: 300px;
    }
    div.mainPage .quickLinks:after,
    div.subPage:not(.profilePage) .quickLinks:after{
        display:none !important;
    }
    div.mainPage .quickLinks div.addButton,
    div.subPage:not(.profilePage) .quickLinks div.addButton,
    .calendarTab .quickLinks div.addButton,
    .currentMainPanelContainer .mediaTab .quickLinks div.addButton,
    .volunteerAsks .quickLinks div.addButton,
    .orgCalendarPage .quickLinks div.addButton{
        font-size:14px;
        text-indent:0;
        top:-57px;
        bottom:auto;
        right:12px;
        background-image:none;
        /*border:1px solid rgba(0,0,0,.25);
        box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 2px 3px rgba(0,0,0,.06);*/
        color:#fff;
        text-shadow:none;
        background:rgba(255,255,255,.17);
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        position:absolute;
        height:32px;
        line-height:32px;
        margin-top:24px;
        padding:0 10px;
        width:auto;
        white-space:nowrap;
        box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
        padding:0 20px;
        border-radius:50px;
        font-weight:bold;
        font-family: gotham;
    }
    .hideSidePanel div.mainPage .quickLinks div.addButton,
    .hideSidePanel div.subPage:not(.profilePage) .quickLinks div.addButton,
    .hideSidePanel .calendarTab .quickLinks div.addButton,
    .hideSidePanel .orgCalendarPage .quickLinks div.addButton{
        right:9px;
    }
    .hideSidePanel div.mainPage .quickLinks,
    .hideSidePanel div.subPage:not(.profilePage) .quickLinks{
        top:119px;
        left:auto;
        bottom:auto;
        right:0;
    }





    div.mainPage .quickLinks div.addButton,
    div.subPage:not(.profilePage) .quickLinks div.addButton,
    div.mainPage .quickLinks .AIAssistant_icon{
        display:none;
    }
    .displayingMainPanel .postsTab .quickLinks .AIAssistant_icon {
        display:block;
    }
    .postsTab .quickLinks div.addButton:before,
    div.orgHomePage:not(.profilePage) .quickLinks div.addButton:before{
        content:attr(data-post);
    }
    div.mainPage .showQuickLinks .quickLinks .menuOptWrapper,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks .menuOptWrapper{
        overflow:auto;
        max-height:90%;
        height:auto;
        border:1px solid #e4e5ed;
        /*box-shadow:0px 2px 8px rgba(0,0,0,.3);
        box-shadow: 0 2px 2px rgba(37,37,37,0.02);*/
        border-radius: 5px;
        margin-top: 13px;
    }
    div.mainPage .quickLinks .clipping,
    div.subPage:not(.profilePage) .quickLinks .clipping{
        position:relative;
        max-height:100%;
        overflow-y:auto;
        z-index:3;
    }
    div.mainPage .showQuickLinks .quickLinks .clipping,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks .clipping{
        border-top:0;
        height:auto;
        max-height:100%;
        display:block;
        background:rgba(255,255,255,.98);
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        border-radius:3px;
    }
    div.mainPage .showQuickLinks .quickLinks:before,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks:before{
        transform: rotate(225deg);
        -webkit-transform: rotate(225deg);
        top:-8px;
        left:auto;
        right:52px;
        bottom:auto;
        box-shadow:1px 1px 1px rgba(0, 0, 0, .1);
        z-index:5;
        top:8px;
    }

    div.mainPage .showQuickLinks .quickLinks.showAIPromptList:before {
        right: 122px;
    }

    div.subPage:not(.profilePage) .showQuickLinks .quickLinks:before{
        right:32px;
    }

    div.subPage:not(.profilePage) .showQuickLinks .quickLinks.showAIPromptList:before{
        right:122px;
    }
    div.mainPage .showQuickLinks .quickLinks .addButton,
    div.mainPage .hideQuickLinks .quickLinks .addButton,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks .addButton,
    div.subPage:not(.profilePage) .hideQuickLinks .quickLinks .addButton{
        animation:none;
        transform:rotate(0deg);
        -webkit-animation:none;
        -webkit-transform:rotate(0deg);
    }
    div.mainPage .hideQuickLinks .quickLinks ul,
    div.subPage:not(.profilePage) .hideQuickLinks .quickLinks ul,
    .hidingMainPanel .quickLinks ul,
    .hidingMainPanel .showQuickLinks .quickLinks:before{
        display:none;
    }
    .hidingMainPanel .quickLinks{
        display:block;
    }
    .displayingMainPanel .postsTab .quickLinks div.addButton,
    .displayingMainPanel .calendarTab .quickLinks div.addButton,
    .displayingMainPanel .volunteerAsks .quickLinks div.addButton,
    .orgHomePage:not(.profilePage) .quickLinks div.addButton,
    .orgSignupsPage .quickLinks div.addButton,
    .orgCalendarPage .quickLinks div.addButton,
    .orgManagePage .quickLinks.manageStudentLinks div.addButton,
    .currentMainPanelContainer .mediaTab .quickLinks div.addButton,
    .orgMediaPage:not(.activityTab) .quickLinks div.addButton,
    .orgInfoPage .quickLinks div.addButton{
        display:block !important;
    }
    .calendarTab .quickLinks.calNotEditable div.addButton,
    .volunteerAsks .quickLinks.calNotEditable div.addButton,
    .orgCalendarPage .quickLinks.calNotEditable div.addButton{
        display:none;
    }
    .orgCalendarPage .quickLinks div.addButton:before,
    .calendarTab .quickLinks div.addButton:before{
        content:attr(data-event);
    }
    .orgSignupsPage .quickLinks div.addButton:before,
    .volunteerAsks .quickLinks div.addButton:before{
        content:attr(data-volunteer);
    }
    .orgSignupsPage .quickLinks div.addButton:before,
    .volunteerAsks .quickLinks div.addButton:before{
        content:attr(data-volunteer);
    }

    .orgMediaPage .quickLinks div.addButton:before,
    .orgInfoPage .quickLinks div.addButton:before,
    .mediaTab .quickLinks div.addButton:before{
        content:attr(data-media);
    }

    .orgManagePage .quickLinks.manageStudentLinks div.addButton:before{
        content:attr(data-managestudent);
    }

    .mediaTab.activityTab .quickLinks div.addButton:before{
        content:attr(data-activity);
    }

    .orgSignupsPage .quickLinks .optionCreateEvent,
    .orgSignupsPage .quickLinks .optionCreateCircle,
    .orgSignupsPage .quickLinks .optionCreateAwards,
    .orgSignupsPage .quickLinks .optionAttendence,

    .orgMediaPage .quickLinks .optionCreateEvent,
    .orgMediaPage .quickLinks .optionCreateCircle,
    .orgMediaPage .quickLinks .optionCreateAwards,
    .orgMediaPage .quickLinks .optionAttendence,
    .orgMediaPage .quickLinks .optionCreatePost,
    .orgMediaPage .quickLinks .optionCreateStudentWork,
    .orgMediaPage .quickLinks .optionCreateAnnouncement,
    .orgMediaPage .quickLinks .optionCreateAlert,
    .orgMediaPage .quickLinks .optionCreateMessage,
    .orgMediaPage .quickLinks .optionCreateCircle,
    .orgMediaPage .quickLinks .optionCreateVolunteer,
    .orgMediaPage .quickLinks .optionCreatePTEvent,
    .orgMediaPage .quickLinks .optionCreateSubGroup,
    .orgMediaPage .quickLinks .optionCreateHealthCheckRequest,

    .orgInfoPage .quickLinks .optionCreateEvent,
    .orgInfoPage .quickLinks .optionCreateCircle,
    .orgInfoPage .quickLinks .optionCreateAwards,
    .orgInfoPage .quickLinks .optionAttendence,
    .orgInfoPage .quickLinks .optionCreatePost,
    .orgInfoPage .quickLinks .optionCreateStudentWork,
    .orgInfoPage .quickLinks .optionCreateAnnouncement,
    .orgInfoPage .quickLinks .optionCreateAlert,
    .orgInfoPage .quickLinks .optionCreateMessage,
    .orgInfoPage .quickLinks .optionCreateCircle,
    .orgInfoPage .quickLinks .optionCreateVolunteer,
    .orgInfoPage .quickLinks .optionCreatePTEvent,
    .orgInfoPage .quickLinks .optionCreateHealthCheckRequest,

    .mediaTab .quickLinks .optionCreateEvent,
    .mediaTab .quickLinks .optionCreateCircle,
    .mediaTab .quickLinks .optionCreateAwards,
    .mediaTab .quickLinks .optionAttendence,
    .mediaTab .quickLinks .optionCreatePost,
    .mediaTab .quickLinks .optionCreateStudentWork,
    .mediaTab .quickLinks .optionCreateAnnouncement,
    .mediaTab .quickLinks .optionCreateAlert,
    .mediaTab .quickLinks .optionCreateMessage,
    .mediaTab .quickLinks .optionCreateCircle,
    .mediaTab .quickLinks .optionCreateVolunteer,
    .mediaTab .quickLinks .optionCreatePTEvent,
    .mediaTab .quickLinks .optionCreateDailyActivity,
    .mediaTab .quickLinks .optionCreateSubGroup,
    .orgInfoPage .optionCreateSubGroup,


    .orgCalendarPage .quickLinks .optionCreatePost,
    .orgCalendarPage .quickLinks .optionCreatePost,
    .orgCalendarPage .quickLinks .optionCreateStudentWork,
    .orgCalendarPage .quickLinks .optionCreateAnnouncement,
    .orgCalendarPage .quickLinks .optionCreateAlert,
    .orgCalendarPage .quickLinks .optionCreateMessage,
    .orgCalendarPage .quickLinks .optionCreateCircle,
    .calendarTab .quickLinks .optionCreatePost,
    .calendarTab .quickLinks .optionCreateStudentWork,
    .calendarTab .quickLinks .optionCreateAwards,
    .calendarTab .quickLinks .optionCreateAnnouncement,
    .calendarTab .quickLinks .optionCreateAlert{
        display:none;
    }
    .messagesTab .quickLinks ul,
    .circlesTab:not(.profilePage) .quickLinks ul{
        display:none !important;
    }
    .messagesTab .showQuickLinks .quickLinks:before,
    .circlesTab .showQuickLinks .quickLinks:before{
        display:none !important;
    }
    div.mainPage .quickLinks .optionCreatePost,
    div.subPage:not(.profilePage) .quickLinks .optionCreatePost{
        color:#5aae00;
    }
    div.mainPage .quickLinks .optionCreateEvent,
    div.subPage:not(.profilePage) .quickLinks .optionCreateEvent{
        color:#17bdcd;
    }
    div.mainPage .quickLinks .optionCreateMessage,
    div.subPage:not(.profilePage) .quickLinks .optionCreateMessage{
        color:#1a97df;
    }
    div.mainPage .quickLinks .optionCreateAnnouncement,
    div.subPage:not(.profilePage) .quickLinks .optionCreateAnnouncement{
        color:#961de2;
    }
    div.mainPage .quickLinks .optionCreateVolunteer,
    div.subPage:not(.profilePage) .quickLinks .optionCreateVolunteer{
        color:#f279a2;
    }
    div.mainPage .quickLinks .optionCreatePTEvent,
    div.subPage:not(.profilePage) .quickLinks .optionCreatePTEvent{
        color:#d43525;
        text-indent:-9999px;
    }
    div.mainPage .quickLinks .optionCreatePTEvent:before,
    div.subPage:not(.profilePage) .quickLinks .optionCreatePTEvent:before{
        content:"Conferences/Office Hours";
        position:absolute;
        left:54px;
        text-indent:0;
        background:none !important;
    }
    div.mainPage .quickLinks .optionCreateAlert,
    div.subPage:not(.profilePage) .quickLinks .optionCreateAlert{
        color:#d43525;
    }
    div.mainPage .quickLinks .optionCreateCircle,
    div.subPage:not(.profilePage) .quickLinks .optionCreateCircle{
        color:#1a97df;
    }
    div.mainPage .showQuickLinks .quickLinks .clipping,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks .clipping{
        overflow:visible;
    }
    div.mainPage .showQuickLinks .quickLinks ul li.closeQuickLinks,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks ul li.closeQuickLinks{
        display:block;
        position:fixed;
        top:0;
        background:none;
        left:-10px;
        width:9999px;
        height:9999px;
        z-index:1;
        text-indent:-9999px;
    }
    div.mainPage .showQuickLinks .quickLinks ul li.closeQuickLinks span,
    div.subPage:not(.profilePage) .showQuickLinks .quickLinks ul li.closeQuickLinks span{
        display:none;
    }
    div.mainPage .showQuickLinks .quickLinksShadow{
        background:transparent;
        margin-top:-140px;
        left:0;
    }
    div.subPage:not(.profilePage) .showQuickLinks .quickLinksShadow{
        background:transparent;
        margin-top:-93px;
        left:0;
    }
    #orgHome .communityPage .addCurSection{
        background:none !important;
        z-index:auto;
    }
    .sidePanel .addCurSection:before{
        height:62px;
    }
    .sidePanel .messagesTab .addCurSection{
        /*background:#198aa9;*/
        pointer-events:none;
        right:0;
        top:78px;
        /*height:48px;*/
        height:51px;
        border-radius:0;
        border-bottom:none;
        width:300px;
        /*box-shadow:inset 0 -1px 0 rgba(0,0,0,.3);*/
        background:#fff;
        box-shadow:none;
    }
    .sidePanel .messagesTab .addCurSection *{
        pointer-events:all;
    }
    .sidePanel .messagesTab .addCurSection button{
        margin-top:8px;
    }
    .addCurSection,
    .messagesTab .addCurSection,
    .volunteerAsks .addCurSection,
    .circlesTab .addCurSection,
    .mediaTab .addCurSection,
    #communityMembersView .orgMembersPage .addCurSection,
    #orgHome .orgMembersPage .addCurSection,
    #orgHome .orgSignupsPage .addCurSection,
    #orgHome .orgMediaPage .addCurSection,
    #orgHome .orgInfoPage .addCurSection{
        background: #ffffff; /* Old browsers */
        /* background: -moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5));
        background: -webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: -o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: -ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%);
        background: linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%);
        filter: "progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5',GradientType=0 )"; */
        border-bottom:1px solid #e4e5ed;
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:77px;
        border-radius:0;
        -moz-border-radius:8px 8px 0 0;
        -webkit-border-radius:8px 8px 0 0;
        box-shadow:none;
    }
    .addCurSection button{
        font-size: 14px;
        /*border: 1px solid rgba(0,0,0,.25);*/

        color: #fff;
        text-shadow: none;
        background: #53c8e6;
        /* background: rgba(255,255,255,.16); */
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 3px rgba(0,0,0,.06);
        position: absolute;
        height: 32px;
        line-height: 32px;
        margin-top: 70px;
        padding: 0 10px;
        width: auto;
        text-indent: 0;
        background-position: initial !important;
        top:80px;
        box-shadow: 3px 3px 7px rgba(0,0,0,0.1);
        padding:0 20px;
        border-radius:50px;
        font-weight:bold;
    }
    .mediaTab .addCurSection button{
        display:none;
    }



    /********************************************
    * Action Sheet
    ********************************************/
    .actionSheet{
        height:100%;
        background:rgba(37,37,37,.4);
        border-top:none;
        padding:50px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
    }
    .actionSheet>div{
        max-width:415px;
        height:auto;
        margin:0 auto;
    }
    .ie .actionSheet>div{
        margin:0; /* Need to horizontally center align actionsheet in ie11 */
    }
    .actionSheet>div:before{
        display:none;
    }
    .actionSheet .dialogBox .dialogMessage{
        -moz-border-radius:6px;
        -webkit-border-radius:6px;
        border-radius:6px;
        box-shadow:0 0px 20px rgba(0,0,0,0.3);
        background:#fff;
        padding:0;

    }
    .showActionSheet{
        display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;      /* TWEENER - IE 10 */
        display: -webkit-flex;     /* NEW - Chrome */
        display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-align:center;
        align-items: center;
        animation:actionSheetIn .2s;
        -webkit-animation:actionSheetIn .2s;
        -webkit-animation-timing-function:ease;
    }
    .hideActionSheet{
        animation:actionSheetOut .2s;
        -webkit-animation:actionSheetOut .2s;
        -webkit-animation-timing-function:ease;
        -webkit-animation-fill-mode:both;
        -moz-animation-fill-mode:both;
        -ms-animation-fill-mode:both;
        -o-animation-fill-mode:both;
        animation-fill-mode:both;
    }


    /********************************************
    * Alert Box
    ********************************************/
    .alertBox>div{
        max-width:350px;
        height:auto;
    }

    .bulkImportOptionContent {
        max-width: 550px !important;
        height: auto;
    }



    /********************************************
    * Main Nav Bar
    ********************************************/
    /*  Move mainNavBar from bottom to left  */
    nav.mainNavBar{
        bottom:auto;
        top:0px;
        width:300px;
        border-right:1px solid #f2f2f2;
        border-top:none;
        border-bottom:none;
        background:#f2f2f2;
        height:100%;
        padding-left:0;
        padding-bottom:72px;
        border-radius:0;
        z-index:1001;
    }
    nav.mainNavBar.isNotificationVisible{
        /*padding-bottom:120px;*/
    }
    nav.mainNavBar.isBloomzToolTipVisible{
        height: calc(100% - 72px);
    }
    #mainPanel.isBloomzToolTipVisible{
        position: relative;
    }
    #mainPanel.isBloomzToolTipVisible + #genericControls div.inlineBox{
        top: 72px;
        height: calc(100% - 72px);
    }
    #mainPanel.isBloomzToolTipVisible ~ #genericControls div.sidePanel{
        top: 72px;
    }
    nav.mainNavBar .scrollableNav{
        overflow:hidden;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
        /*width:300px;*/
        width:100%;
        height:100%;
        position:relative;
    }
    nav.mainNavBar .scrollableNav:before{
        content:"";
        background-position:-111px -5px;
        width: 175px;
        height: 45px;
        display:block;
        position:absolute;
        top:9px;
        left:8px;
    }
    nav.mainNavBar ul{
        margin-top:0px;
        /*padding-top:62px;*/
        padding-top: 5px;
        border-top:none;
        text-align:left;
        display:inline-block;
        /*height:0px;*/

    }
    nav.mainNavBar ul:before,
    nav.mainNavBar ul:after{
        display:none;
    }
    nav.mainNavBar ul.separateMenuItems{
        display:table;
    }
    nav.mainNavBar ul li{
        margin-right:0;
        display:block;
        -moz-border-radius:0px;
        -webkit-border-radius:0px;
        border-radius:0px;
        overflow:visible;
        border-top:1px solid transparent;
        /*background:#e6e6e6;*/
        margin-left:12px;
    }
    .mainNavBar ul li.chat{
        display:none !important;
    }
    nav.mainNavBar ul li a{
        text-indent:58px;
        line-height:42px;
        height:40px;
        width:100%;
        margin-top:0;
        color:#212121;
        text-shadow:none;
        font-size:14px;
        background:none;
        font-weight:500;
    }
    nav.mainNavBar ul li a:before{
        content:"";
        display:block;
        height:35px;
        width:44px;
        position:absolute;
        left:11px;
        opacity:.5;
        filter:alpha(opacity=50);
        top:3px;
    }
    nav.mainNavBar ul:not(.navFilters){
        padding-bottom:15px;
    }
    nav.mainNavBar ul.filterControl{
        display:table;
    }
    nav.mainNavBar .mainSideBar ul li { margin-left: 0; }
    nav.mainNavBar ul.filterControl li:last-of-type a{
        margin-bottom:0;
    }
    nav.mainNavBar ul li.signout{
        margin:10px 0;
    }
    nav.mainNavBar ul.separateMenuItems li:last-of-type{
        margin:0;
    }
    nav.mainNavBar ul li.home a:before{
        background-position:-11px -180px;
    }
    nav.mainNavBar ul li.calendar a:before{
        background-position:-76px -180px;
    }
    nav.mainNavBar ul li.chat a:before{
        background-position:-140px -180px;
    }
    nav.mainNavBar ul li.circles a:before{
        background-position:-203px -180px;
    }
    nav.mainNavBar ul li.photos a:before{
        background-position:-713px -185px;
    }
    nav.mainNavBar ul li.volunteer a:before{
        background-position:-647px -359px;
    }
    nav.mainNavBar ul li.profile a:before{
        background:none;
    }
    nav.mainNavBar ul li.more{
        display:none;
    }
    nav.mainNavBar ul li.account a:before{
        background-position:-331px -179px;
    }
    nav.mainNavBar ul li.feedback a:before{
        background-position:-396px -180px;
    }
    nav.mainNavBar ul li.search a:before{
        background-position:-461px -180px;
    }
    nav.mainNavBar ul li.signout a:before{
        background-position:-585px -185px;
        left:11px;
    }
    nav.mainNavBar ul.inviteParentWrapper{
        display:none;
    }
    nav.mainNavBar ul li.invitePeople a:before{
        background-position:-521px -246px;
    }
    nav.mainNavBar ul li.recommend a:before{
        background-position:-648px -482px;
    }
    nav.mainNavBar ul li.selected:before{
        content:"";
        width:4px;
        height:42px;
        background:#4ac0e6;
        position:absolute;
        left:-12px;
        top:-1px;
    }
    nav.mainNavBar ul li.selected{
        background-color:#22232a;
        /*border-top:1px solid #000;*/
    }
    nav.mainNavBar ul.inviteParentWrapper{
        display:table;
    }
    nav.mainNavBar ul.inviteParentWrapper li:active{
        background-color:transparent;
        border-top:0px;
    }
    nav.mainNavBar ul.inviteParentWrapper li a:active{
        background-color:transparent;
    }
    nav.mainNavBar ul li.selected a,
    nav.mainNavBar ul a:active{
        text-shadow:none;
    }
    nav.mainNavBar ul li.selected a span{
        font-family:'Gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
    }
    nav.mainNavBar .badge{
        top:-2px;
        right:5px;
        min-width:12px;
        height:18px;
        line-height:20px;
        text-align:center;
        padding:0 3px;
        -moz-border-radius:9px;
        -webkit-border-radius:9px;
        border-radius:9px;
        background:#e86c6c !important;
        box-shadow:inset 0px -1px 0px rgba(0,0,0,.1);
        z-index:1;
        width:18px;
        right: -5px;
    }
    nav.mainNavBar .badge.support{
        top: 5px;
        right: 5px;
        min-width: 12px;
        height: 18px;
        line-height: 20px;
        text-align: center;
        padding: 0 3px;
        -moz-border-radius: 9px;
        -webkit-border-radius: 9px;
        border-radius: 9px;
        background: #e86c6c !important;
        box-shadow: inset 0px -1px 0px rgba(0, 0, 0, .1);
        z-index: 1;
        width: 18px;
        right: 15px;
        color: white;
    }
    nav.mainNavBar .showMoreOpt .moreOpt,
    nav.mainNavBar .moreNavOpt{
        display:block;
    }
    nav.mainNavBar ul.navFilters{
        display:block;
    }
    nav.mainNavBar ul.navFilters ul{
        padding-bottom:0;
        margin-bottom:23px;
    }
    .mainNavBar ul.navFilters li ul li {
        height:auto !important;
    }
    nav.mainNavBar ul.navFilters li ul li span{
        overflow:hidden;
    }
    nav.mainNavBar ul.navFilters li ul li span a{
    overflow:hidden;
        text-overflow:ellipsis;
        overflow: inherit;
        height: auto;
        line-height: 1.4;
        display: block;
        white-space: normal;
        text-indent: 0;
        padding: 7px 0 7px 58px;
    }
    .mainNavBar ul.navFilters ul li:last-child span:last-of-type {
        margin-bottom: 0;
    }
    ul.navFilters ul.communityListing li span.communityColor { height:100%; }
    .mainNavBar ul.navFilters ul li a:before { top:0; }
    .mainNavBar ul.navFilters ul.communityListing li.demoClass a { text-indent:0; }
    nav.mainNavBar ul.navFilters>li>span,
    nav.mainNavBar ul>li>span.separator{
        font-size:12px;
        text-transform: uppercase;
    }
    nav.mainNavBar a{
        position:static;
    }
    ul.navFilters ul.communityListing{
        margin:-2px 0 7px 0 !important;
    }
    ul.navFilters ul.communityListing li a img{
        margin-top:1px;
    }
    ul.navFilters ul.communityListing li.demoClass .tagClasses>span{
        margin-top:-3px;
    }
    .displayingMainPanel nav.mainNavBar .scrollableNav li.home{
        background-color: #e6e6e6;
        border-top: 1px solid #e6e6e6;
    }
    nav.mainNavBar .scrollableNav li.home{
        margin-top:1px;
    }
    nav.mainNavBar ul.options{
        margin:-2px 0 0 0;
        background:#383b45;
        padding-bottom:0;
    }
    .safari nav.mainNavBar ul.options{
        margin:0px 0 0 0;
        background:#383b45;
        padding-bottom:0;
    }

    /********************************************
    * Main Tab Bar
    ********************************************/
    .studentLayout .subPage:after,
    .shadowBox .subPage:after{
        display: none !important;
    }

    #inviteByStudentQr .subPage:after{
        background:none;
    }
    div#messageTrayIcon{
        width:36px !important;
        width:46px !important;
        height:36px !important;
    }
    div#messageTrayIcon:before{
        height:36px;
        background-position: -524px -418px;
        right: 10px;
    }
    div#messageTrayIcon .toggleTray.desktopRes{
        display:block;
    }
    div#messageTrayIcon .toggleTray.mobileRes{
        display:none;
    }
    div#messageTrayIcon .badge{
        /*top:auto;
        bottom:7px;*/
    }
    div#notificationCenterIcon{
        width:36px !important;
        height:36px !important;
        margin-top:0px;
        top:33px;
        right:45px;
    }
    .quickLinks div#notificationCenterIcon{
        display:none;
    }
    div#notificationCenterIcon .toggleTray.desktopRes{
        display:block;
    }
    div#notificationCenterIcon .toggleTray.mobileRes{
        display:none;
    }
    .currentNotificationCenter #notificationCenterIcon:before{
        /*height:62px;
        top:-15px;
        background-position:-397px -340px;*/
    }
    .displayingMainPanel .mainTabBar{
        display:block;
    }
    .mainTabBar{
        position: absolute;
        padding: 0 0 0 300px !important;
        width: auto;
        height: 1px !important;
        top:35px !important;
        display:none;
        box-sizing:border-box;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        white-space:nowrap;
    }
    .mainTabBar ul{
        padding:0 !important;
        width:auto;
    }
    .mainTabBar li{
        display:inline-block !important;
        height:40px;
        line-height:40px;
        border:none !important;
    }
    .mainTabBar li:before{
        display:none;
    }
    .mainTabBar li a{
        text-indent:-9999px !important;
        padding:0 10px;
        width:32px !important;
    }
    .mainTabBar li a:before{
        display:none !important;
    }
    .mainTabBar li.selected{
        background:transparent !important;
        border-top:1px solid transparent !important;
    }
    nav.mainNavBar .mainTabBar ul li a:before{
        content:attr(data-coachmark);
        pointer-events:none;
        color:#fff !important;
        border:1px solid #212121;
        box-shadow:3px 3px 7px rgba(0,0,0,0.1);
        background:#212121;
        position:absolute;
        display:block !important;
        text-indent:0;
        margin-top:-24px;
        margin-left:20px;
        width:auto;
        padding:0px 10px;
        line-height:22px;
        height:20px;
        z-index:1;
        -webkit-border-radius:10px 10px 10px 0;
        -moz-border-radius:10px 10px 10px 0;
        border-radius:10px 10px 10px 0;
        opacity:0 !important;
        filter:alpha(opacity=0) !important;
        font-size:13px;
    }
    nav.mainNavBar .mainTabBar ul li a:hover:before{
        opacity:1 !important;
        filter:alpha(opacity=100) !important;
    }

    nav.mainNavBar .mainTabBar ul li.showNewTag:after,
    #orgHome .orgNav li.showNewTag:after{
        content: 'New!';
        pointer-events: none;
        position: absolute;
        display: block !important;
        top: 0;
        margin-top: -7px;
        /*margin-left: 24px;*/
        margin-left: 10px;
        width: auto;
        padding: 0px 10px;
        line-height: 22px;
        height: 20px;
        z-index: 0;
        font-size: 11px;
        color: #e86c6c !important;
    }

    #orgHome .orgNav li.showNewTag:after{
        margin-top: -7px;
        right: 0;
        left: auto;
        padding: 0;
    }
    #orgHome nav.subNavTabs .orgNav ul li.showNewTag:after {
        margin-top: -2px;
    }


    /*************************************************
    * Main Nav Bar: User Profile Link
    *************************************************/
    nav.mainNavBar .profile{
        border-top:1px solid #272a33;
        display:block;
        box-shadow:0 -2px 10px rgba(0,0,0,.15);
        background:#3c3e47;
        background:-moz-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
        background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(60,62,71,1)),color-stop(100%,rgba(56,59,69,1)));
        background:-webkit-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
        background:-o-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
        background:-ms-linear-gradient(top,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
        background:linear-gradient(to bottom,rgba(60,62,71,1) 0%,rgba(56,59,69,1) 100%);
        filter:"progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c3e47', endColorstr='#383b45',GradientType=0 )";
    }
    nav.mainNavBar .profile a{
        display:block;
        padding-top:6px;
        width:100%;
        margin-top:0;
    }
    nav.mainNavBar .profile .profileS{
        margin:6px 17px;
    }
    nav.mainNavBar .profile .profileS{
        border:1px solid #fff;
    }
    nav.mainNavBar .profileS:after{
        content:attr(data-displayname);
        font-family:'Gotham-book', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        margin-left:-50px;
        padding-right:0px;
        width:125px;
        overflow:hidden;
        word-wrap:break-word;
        white-space:nowrap;
        text-overflow:ellipsis;
        text-indent:0;
        text-shadow:none;
        font-size:14px;
        top:8px;
        left:108px;
        position:absolute;
        height:39px;
        display:block;
        color:#b3b3b3;
    }



    /*************************************************
    * Main Nav Bar: Scroll Bar Styles (Desktop Only)
    *************************************************/
    .Desktop .mainNavBar .scrollableNav::-webkit-scrollbar{
        width: 10px;  /* for vertical scrollbars */
    }
    .Desktop .mainNavBar .scrollableNav::-webkit-scrollbar-track{
        background:rgba(255,255,255,.1);
    }
    .Desktop .mainNavBar .scrollableNav::-webkit-scrollbar-thumb{
        background: rgba(255, 255, 255, 0.25);
        -moz-border-radius:0px;
        -webkit-border-radius:0px;
        border-radius:0px;
    }
    .Desktop .mainNavBar .scrollableNav::-webkit-scrollbar-thumb:hover{
        background:#7d7d7d;
    }



    /********************************************
    * Message Tray Icon
    ********************************************/
    #_sidechat div#messageTrayIcon .toggleTray{
        width:36px !important;
        height:47px !important;
    }
    .communityPage div#messageTrayIcon{
        display:none;
    }





    /*************************************************
    *  Hide/Show Message Tray
    *************************************************/
    .hideSidePanel #_mainPanelContainer:after,
    .hideSidePanel .subPage:after{
        display:none;
    }
    .hideSidePanel #orgHome.menu .actionBar h1,
    .hideSidePanel .mainPanel .actionBar h1,
    .hideSidePanel .inlineBox .actionBar h1{
        text-indent:0px;
        padding:19px 56px 15px 278px; /* hideChat */
    }
    .hideSidePanel #orgHome .actionBar h1{
        padding-right:150px;
    }
    .hideSidePanel .mainPanel .contentArea{
        margin-right:0; /* hideChat */
    }
    .hideSidePanel .inlineBox .subPage .scrollView{
        padding-right:0; /* hideChat */
    }
    .hideSidePanel .inlineBox .actionButtons,
    .hideSidePanel .inlineBox .nextButton{
        right:120px; /* hideChat */
    }
    .hideSidePanel .postView:not(.addStudentsView) .nextButton,
    .hideSidePanel #communityMembersView .nextButton,
    .hideSidePanel #myContacts .nextButton,
    .hideSidePanel .inlineBox .calendarEventDetails .nextButton{
        right:120px !important;
    }
    .hideSidePanel .currentCommunitySettings .postView .nextButton{
        right:0 !important;
    }
    .hideSidePanel .inlineBox .actionButton.grpSettings{
        right:78px;
    }
    .hideSidePanel .inlineBox .contentArea{
        margin-right:0;
    }
    .hideSidePanel .inlineBox .subPage .chatInput>div{
        position:relative;
        margin-top:3px;
        padding-right:0; /* hideChat */
    }
    .hideSidePanel .inlineBox .scrollView:after{
        display:none;
    }
    .hideSidePanel .orgMessagesPage #messageThreadNotificationBar{
        padding-right: 0;
    }
    .hideSidePanel .circlesTab .pendingInvitations>section{
        margin-right:0 !important;
    }
    .hideSidePanel .recipientPickerCtrl.modeMainPanel .actionButtons{
        padding-right:15px;
    }
    .hideSidePanel .recipientPickerCtrl.modeMainPanel .scrollView > .formLayout{
        padding-right:0;
    }
    .hideSidePanel .scrollView h1.subInlineTabs .edit{
        right:20px;
    }
    .hideSidePanel #orgHome .actionBar .actionButtons.grpSettings{
        right:68px;
    }
    .hideSidePanel .mainPage .subNavTabs,
    .hideSidePanel #orgHome .communityPage.hasSubTabs .subNavTabs{
        padding-right:0;
    }


    .hideSidePanel .subPageInline h1{
        padding-right:80px !important;
    }
    .hideSidePanel .inlineBox .actionBar:after{
        right:125px;
    }
    .hideSidePanel .subPageInline .nextButton{
        right:80px !important;
    }




    .firefox.hideSidePanel .mainPanel .contentArea{
        margin-right:0;
    }
    .firefox.hideSidePanel .inlineBox .subPage .scrollView{
        padding-right:0;
    }



    /*************************************************
    * Nav Drawer
    *************************************************/
    div.showDrawer{
        animation:none;
        -webkit-animation:none;
    }
    div.hideDrawer{
        animation:none;
        -webkit-animation:none;
    }
    /* Touch Scroll */
    .showDrawer .scrollView,
    .hideDrawer .scrollView{
        -webkit-overflow-scrolling:touch;
    }



    /*********************************************
    * Sub Nav Tabs
    *********************************************/
    .subNavTabs{
        display:table;
        top:63px;
        top:77px;
        height:48px;
        line-height:48px;
    }
    .subNavTabs span{
        height:48px;
        line-height:48px;
        box-shadow:inset 0 -1px rgba(0,0,0,.3);
    }
    .firefox .subNavTabs span{
        height:auto !important;
    }
    .mainPage .subNavTabs{
        background:#fff;
        padding:0 0 0 300px;
        top:78px;
        height:48px;
        line-height:48px;
        box-shadow:none;
        box-sizing:border-box;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        font-weight:500;
    }
    .mainPage .subNavTabs span{
        /*background:#198aa9;
        color:#fff;
        box-shadow: inset 0 -1px rgba(0,0,0,.3);*/
        /*line-height:48px;
        color:#616161;
        position:relative;
        padding: 0 15px;*/
    }
    .mainPage .subNavTabs span.selected{
        color:#212121;
    }
    .hasSubTabs{
        padding-top:111px !important;
    }




    /********************************************
    * Action Bar
    ********************************************/
    .inlineBox .actionBar{
        height:63px;
        min-height:63px;
        padding-top:15px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
    }
    .inlineBox .actionBar:before{
        left:67px;
    }
    .inlineBox .actionBar:after{
        content: "";
        width: 1px;
        display: block;
        height: 72px;
        right: 310px;
        top: 0px;
        background: #e0e0e0;
        border-right: 1px solid #eee;
        position:absolute;
    }
    .inlineBox .studentProfile:after{
        display: none !important;
    }
    #orgHome.inlineBox .actionBar:after{
        display:none;
    }
    /*  Shift actionBar right for mainNavBar  */
    #orgHome.menu .actionBar h1,
    .mainPanel .actionBar h1{
        text-indent:0px;
        padding:4px 300px 4px 300px; /* showChat */
    }
    .inlineBox .actionBar h1{
        text-indent:0px;
        /*padding:19px 288px 4px 278px;*/
        padding:19px 300px 18px 300px;
        border-bottom: 1px solid #e4e5ed;
    }
    .noMenuLeftRight .actionBar h1{
        padding:0;
    }
    #orgHome .actionBar h1{
        padding:4px 60px 4px 327px;
    }
    #orgHome.menu .actionBar .backButtonOnly{
        display:none;
    }
    .mainPanel .actionBar .filterControl,
    .mainPanel .actionBar .backButton,
    .inlineBox .actionBar .filterControl,
    .inlineBox .actionBar .backButton{
        padding-left:310px;
    }
    .mainPanel .actionBar .backButton,
    .inlineBox .actionBar .backButton{
        text-indent:20px;
    }
    .inlineBox .actionBar .backButtonTextOnly{
        text-indent:0 !important;
    }
    .mainPanel .actionBar .backButton:before,
    .inlineBox .actionBar .backButton:before{
        content: "";
        position: absolute;
        left: 274px;
        top: 11px;
        width: 24px;
        height: 24px;
        background-position: -87px -1328px;
    }
    .inlineBox .actionBar .backButtonTextOnly:before{
        display: none !important;
    }
    .inlineBox .actionBar .backButtonOnly{
        left:300px;
    }
    .cur_studentSimpleNoStudentAccessView .actionBar .backButtonOnly{
        left:0;
    }
    .contactList .actionBarInput .backButton:before{
        left:20px;
    }
    .inlineBox .actionBar:before{
        left:300px;
    }
    .communityPage .actionBar,
    #orgHome .actionBar .actionButtons.grpSettings{
        background:#ffffff !important; /* Old browsers */
        background:-moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 100%) !important; /* FF3.6+ */
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f5f5f5)) !important; /* Chrome,Safari4+ */
        background:-webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%) !important; /* Chrome10+,Safari5.1+ */
        background:-o-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%) !important; /* Opera 11.10+ */
        background:-ms-linear-gradient(top,  #ffffff 0%,#f5f5f5 100%) !important; /* IE10+ */
        background:linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 100%) !important; /* W3C */
    }
    #orgHome .actionBar .actionButtons.grpSettings{
        display:none !important;
    }




    /*  Make action button menus wider  */
    .actionButtons ul li{
        width:auto;
        padding:24px 30px 24px 50px;
        white-space:nowrap;
        text-align:left;
    }
    .actionButtons ul li:after{
        left:-5px;
        top:7px;
    }
    /* "Add Button" for current section*/
    .addCurSection{
        display:block;
    }
    .addCurSection button{
        right: 310px;
        top: 1px;
        left: auto;
        margin-top: 85px;
    }
    .mainPanel .addCurSection:before{
        content:attr(data-context);
        font-family: 'focoregular', Verdana, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif;
        display: block;
        padding:4px 60px 4px 327px;
        text-align: center;
        font-size: 13px;
        line-height: 16px;
        color: #787878;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .hideSidePanel .addCurSection button {
        right:8px;
    }
    .messagesTab .addCurSection button{
        right:10px;
    }




    /********************************************
    * Main Panel
    ********************************************/
    .mainPanel .contentArea{
        margin-right:300px; /* showChat */
    }
    .firefox .mainPanel .contentArea{
        margin-right:300px; /* showChat */
    }




    /********************************************
    * Filter Controls
    ********************************************/
    /* Put max width on filter control */
    .filterControl{
        margin:15px auto -32px auto;
    }
    /* Put max width on filter control */
    .formLayout .filterControl{
        max-width:none;
    }



    /********************************************
    * Shadow Box
    ********************************************/
    .shadowBox:before{
        content:"";
        background:rgba(37,37,37,.4);
        position:fixed;
        width:100%;
        height:100%;
        top:0;
        left:0;
        display:block;
    }
    /*  Shadow Box */
    .shadowBox .subPage{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        position:relative;
        display:block;
        max-width:720px;
        height:80%;
        top:10%;
        /*left:50%;
        margin-left:-256px;*/
        max-height:700px;
        padding-top:48px;
        box-shadow:0 0px 20px rgba(0,0,0,0.3);
        -moz-border-radius:6px;
        -webkit-border-radius:6px;
        border-radius:6px;
        left:0;
        right:0;
        margin-left:auto;
        margin-right:auto;
        max-width: 1080px;
        height: 90vh;
        /*height: auto;*/
        top: 5vh;
        max-height: 90vh;
    }
    .shadowBox .scrollView { /*max-height: 80vh;*/ height:auto; height:100%; padding:1px 0; }
    .shadowBox .contentArea{
        margin-left:0px;
        padding-top:1px;
    }
    .shadowBox .actionBar{
        position:absolute;
        -moz-border-radius-topleft:7px;
        -webkit-border-radius-topleft:7px;
        border-top-left-radius:7px;
        -moz-top-radius-topright:7px;
        -webkit-border-radius-topright:7px;
        border-top-right-radius:7px;
    }
    .loginScreen .welcomeMsg.scrollView { max-height:inherit; }


    /********************************************
    * Inline Box
    ********************************************/
    .inlineBox .subPage{
        padding-left:300px;
    }
    .inlineBox .subPage .scrollView{
        padding-right:310px; /* showChat */
        overflow-y:scroll;
        /*background: #f2f2f2;*/
        background: #edeef3;
    }
    .inlineBox .lessScrollViewPadding .scrollView{
        /*padding-right:290px;*/
    }
    .inlineBox .actionButtons,
    .inlineBox .nextButton{
        right:310px; /* showChat */
        top:12px;
    }
    .studentProfile .nextButton{
        top: -3px !important;
    }
    .showSidePanel .inlineBox .actionButtons.grpSettings{
        right:268px; /* showChat */
    }
    .hideSidePanel .inlineBox .actionButtons.grpSettings{
        right:75px; /* hideChat */
    }
    .noMenuLeftRight .subPage{
        padding-left: 0;
    }
    .inlineBox .contentArea{
        margin-left:0px;
        margin-right:-10px;
    }
    div.deviceType:not(.studentLayout) .inlineBox .subPage .scrollView::-webkit-scrollbar{
        width: 10px;  /* for vertical scrollbars */
    }
    div.deviceType:not(.studentLayout) .inlineBox .subPage .scrollView::-webkit-scrollbar-track{
        background:#f3f3f3;
    }
    div.deviceType:not(.studentLayout) .inlineBox .subPage .scrollView::-webkit-scrollbar-thumb{
        background: rgba(0, 0, 0, 0.18);
        -moz-border-radius:0px;
        -webkit-border-radius:0px;
        border-radius:0px;
    }
    div.deviceType:not(.studentLayout) .inlineBox .subPage .scrollView::-webkit-scrollbar-thumb:hover{
        background:#7d7d7d;
    }
    .firefox .inlineBox .subPage .scrollView{
        padding-right:310px; /* showChat*/
    }
    .firefox .studentFixHeader .scrollView{
        padding-right: 0 !important;
    }



    /********************************************
    * Slideshow Control
    ********************************************/
    .sliderWrapper{
        padding:30px;
    }
    .sliderWrapper .slide #imageWrapper:after{
        content:"";
        display:block;
        position:absolute;
        width:100%;
        height:100%;
        border:1px solid rgba(255,255,255,.2);
        box-sizing:border-box;
        top:0;
        left:0;
    }
    .sliderWrapper .slide #imageWrapper.video:after{
        display: none;
    }
    .sliderWrapper .arrows .slideClose{
        margin:-10px -10px 0 0;
        /*width:32px;
        height:32px;*/
    }
    .sliderWrapper .arrows .slideClose:after{
        /*border:2px solid #fff;
        box-shadow:0 2px 2px rgba(0,0,0,1);
        background:rgba(0,0,0,.7);*/
    }
    .sliderWrapper .arrows .slidePrev:after,
    .sliderWrapper .arrows .slideNext:after{
        opacity:0.5;
        filter:alpha(opacity=50);
    }
    .sliderWrapper .arrows .slidePrev:after{
        left:10px;
    }
    .sliderWrapper .arrows .slideNext:after{
        right:10px;
    }
    .sliderWrapper .arrows .slidePrev:hover:after,
    .sliderWrapper .arrows .slideNext:hover:after{
        opacity:1;
        filter:alpha(opacity=100);
    }



    /********************************************
    * Content Area
    ********************************************/
    .mainPanel .mainPage{
        padding-top:111px;
        overflow:visible;
    }
    /*  Shift contentArea right for mainNavBar  */
    .contentArea{
        margin-left:300px;
    }
    .contentArea article,
    .contentArea section,
    .formPadding{
        margin-left:auto;
        margin-right:auto;
    }
    .showFullScreen article.fullScreen,
    .showFullScreen .contentArea section,
    .showFullScreen .formPadding{
        padding:30px;
    }
    .postView article.fullScreen .metaInfo, article.fullScreen .metaInfo{
        padding:0;
    }
    .Desktop .showFullScreen .mainPanel .scrollView{
        overflow-y:visible;
    }
    #communityContent .scheduledPostsLink {
        text-align: right;
        margin-top: 10px;
    }



    /*************************************************
    *  Main Pages: Headers
    *************************************************/
    section.updates h1,
    section.calendarEvents h1,
    section.communityCalendarEvents.admin h1,
    section.announcementUpdates.admin h1,
    section.communityMemberListing.admin h1,
    section.circleCardsListing h1,
    section.messages h1,
    section.volunteerAskListing h1.admin,
    section.communityMemberListing.admin h1{
        pointer-events: none;
    }
    section.updates h1:after,
    section.calendarEvents h1:after,
    section.communityCalendarEvents.admin h1:after,
    section.announcementUpdates.admin h1:after,
    section.communityMemberListing.admin h1:after,
    section.circleCardsListing h1:after,
    section.messages h1:after,
    section.volunteerAskListing h1.admin:after,
    section.communityMemberListing.admin h1:after,
    h1#communityEvents_addMember:after,
    .admin h1#communityEvents_addMember:after,
    .orgClasses .admin h1#communityEvents_addMember:after{
        display:none;
    }



    /********************************************
    * Coach Marks: Main Nav Bar
    ********************************************/
    .showCoachMarks .mainNavBar li a:before{
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        left:10px;
        top:0;
        text-indent:-9999px;
    }
    .showCoachMarks .mainNavBar ul:first-of-type li:first-of-type:after{
        display:none;
    }
    .showCoachMarks .mainNavBar li a:after{
        content:attr(data-coachmark);
        font-family:'firetoRain';
        transform: rotate(30deg);
        -ms-transform: rotate(30deg);
        -webkit-transform: rotate(30deg);
        -webkit-transform-origin:0 0;
        transform-origin: 0 0;
        text-shadow:0 1px 3px rgba(0,0,0,1);
        white-space:nowrap;
        font-size:17px;
        text-indent:0;
        color:#fff;
        background:transparent;
        width:auto;
        height:auto;
        left:120px;
        top:6px;
    }
    .showCoachMarks .mainNavBar li:after{
        content:"";
        width:50px;
        height:1px;
        background:rgba(255,255,255,.4);
        display:block;
        position:absolute;
        left:54px;
        top:18px;
    }
    .showCoachMarks .coachMarkClick{
        margin-left:20px;
    }
    .showCoachMarks .mainNavBar li a:after,
    .showCoachMarks .mainNavBar li:after{
        display:none;
    }



    /********************************************
    * Coach Marks: Content Area
    ********************************************/
    .showCoachMarks .scrollView>.contentArea:after{
        top:0;
        box-shadow:inset 0 0 100px rgba(0,0,0,.8);
    }
    .showCoachMarks .mainNavBar .showMoreOpt li.moreNavOpt a:before,
    .showCoachMarks .mainNavBar .showMoreOpt li.moreNavOpt a:after{
        /*display:none;*/
    }
    .showCoachMarks .logo span:after{
        width:20px;
        height:1px;
        top:18px;
        left:65px;
        display:none;
    }
    .showCoachMarks .logo span:before{
        top:12px;
        left:107px;
        transform: rotate(20deg);
        -ms-transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        display:none;
    }
    .showCoachMarks .scrollView section.updates h1:after{
        top:29px;
        margin-left:-12px;
        width:62px;
        height:30px;
        background-position:148px -9px;
        transform: rotate(-60deg);
        -ms-transform: rotate(-60deg);
        -webkit-transform: rotate(-60deg);
    }
    .showCoachMarks .scrollView section.updates h1:before{
        top:18px;
        margin-left:53px;
    }
    .showCoachMarks .scrollView .contentArea>.filterControl li:last-child:before,
    .showCoachMarks .scrollView .contentArea>.filterControl li:last-child:after{
        display:block;
    }



    /********************************************
    * Walk Through
    ********************************************/
    .freWalkthrough .walkthrough{
        padding-top:10px;
        max-width:none;
        margin:0 30px;
    }
    .freWalkthrough .walkthrough section h2{
       font-size: 16px;
       margin-bottom: -3px;
    }
    .freWalkthrough .walkthrough section p{
        font-size: 15px;
        font-family: gotham-book;
    }
    .freWalkthrough .walkthrough>section{
        padding-bottom:8px;
    }



    /********************************************
    * Welcome Messages
    ********************************************/
    .welcomePage .subPage{
        padding-top:0;
        background:transparent;
        background:#fff;
        max-width:800px;
        margin-left:auto;
        margin-right:auto;
        width:100%;
    }
    .welcomeMsg h2{
        margin:40px 0 30px 0;
    }
    .welcomePage .welcome1 .contentWelcome1:after{
        top:75px;
    }



    /*************************************************
    *  Main Calendar
    *************************************************/
    .calendarWrapper{
        padding-left:300px;
        box-sizing:border-box;
    }
    .calendarWrapper .contentArea{
        margin-left:0;
    }



    /********************************************
    * Form Layout
    ********************************************/
    .formLayout section .resharedUpdate p{
        padding:0 15px;
    }
    .formLayout .actionBar{
        position:relative;
        padding:0 15px 0 0;
        margin-left:-15px;
        -moz-border-radius-topleft:7px;
        -webkit-border-radius-topleft:7px;
        border-top-left-radius:7px;
        -moz-border-radius-topright:7px;
        -webkit-border-radius-topright:7px;
        border-top-right-radius:7px;
    }
    .formLayout .actionBar h1{
        text-indent:0;
    }
    .formLayout .actionBar .filterControl,
    .formLayout .actionBar .backButton
    {
        padding-left:0px;
    }
    .formLayout .actionBar .backButton:before{
        left:0px;
    }
    .formLayout .filterControl{
        margin-left:0;
    }
    .shadowBox .formLayout{
        margin-top:0;
        padding-bottom:0px;
    }
    .shadowBox .formLayout.fullWidthBtn{
        padding-bottom:15px;
    }
    .studentList {
        padding-top: 0 !important;
    }
    .studentListPicker {
        padding-top: 45px !important;
    }



    /********************************************
    * Form Layout: Footer
    ********************************************/
    footer.options{
        min-height: 20px;
    }
    footer.options:before{
        left:33px;
    }
    footer.options:after{
        right:33px;
    }



    /********************************************
    * Toasts
    ********************************************/
    #toast{
        bottom:auto;
        top:45px;
        width:300px;
        margin-left:-113px;
        left:50%;
    }
    #toast.toastShadowBox{
        margin-left:-150px;
        top:60px;
    }


    /********************************************
    * Tips:  Recommend Bloomz
    ********************************************/
    .recommendBloomzTip.inlineToolTip,
    .formLayout section.recommendBloomzTip.inlineToolTip{
        padding-left:310px;
    }



    /********************************************
    * Posts: General Styles
    ********************************************/
    /*  Right align loadMorePosts button to posts  */
    a.loadMorePosts{
        width:100%;
        height:50px;
        position:relative;
        display:block;
        margin:-15px auto -50px auto;
        text-indent:-9999px;
        background:none;
        border:none;
    }
    a.loadMorePosts:after{
        content:"";
        width:50px;
        height:50px;
        background-position:-125px -1088px;
        position:absolute;
        right:-15px;
    }



    /********************************************
    * Welcoming Teachers
    ********************************************/
    .welcomingTeacher .btnWrapper{
        display:table;
        width:100%;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
    }
    .welcomingTeacher .btnWrapper div{
        display:table-cell;
        padding-right:8px;
    }
    .welcomingTeacher .btnWrapper div:last-of-type{
        padding-right:0;
    }



    /********************************************
    * Posts: Detail View
    ********************************************/
    .postView .actionBar .backButton{
        text-indent:25px;
    }
    .postView .actionBar .backButton:before{
        width:13px;
        height:13px;
        background:none;
        top:16px;
    }
    .postView .chatInput button.share{
        left:244px;
    }



    /************************************************
    * Posts: Post: Detail View - Inappropriate Flag
    ************************************************/
    .postView.flaggedItem{
        padding-bottom:111px;
    }
    .postView.flaggedItem .actionBar h1{
        padding:4px 40px 4px 260px;
    }
    .postView.flaggedItem .flaggedItemControl{
        left:0;
    }
    .postView.flaggedItem .flaggedItemControl ul{
        padding-left:300px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
    }


    /********************************************
    * Posts: Inline Comments Control
    ********************************************/
    .calendarEventDetails,
    .postView,
    .circleDetails{
        padding-bottom:84px;
    }
    .noCommentInput{
        padding-bottom:0;
    }
    /* Chat Input - inline boxes */
    .inlineBox .subPage .chatInput{
        height:84px;
    }
    .inlineBox .subPage .chatInput>div{
        position:relative;
        margin-top:3px;
        padding-right:315px; /* showChat */
    }
    .cur_studentSimpleNoStudentAccessView .inlineBox .subPage .chatInput>div{
        padding-right:0px;
    }
    .inlineBox .subPage .chatInput input[type='file']{
        left:67px;
    }
    .inlineBox .chatInput>div .editableElement{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing: border-box;
        padding: 9px 8px 5px 8px;
        min-height: 68px;
        max-height: 110px;
        white-space: normal;
        line-height: 1.35;
        text-indent: 0;
    }
    .inlineBox .chatInput>div .editableElement:empty{
        /*background:#fff;*/
        border:1px solid #e4e5ed;
    }
    .inlineBox .chatInput>div .editableElement:focus{
        background:#fff;
        border:1px solid #e4e5ed;
    }
    .inlineBox .chatInput button{
        top:2px;
    }
    .inlineBox .chatInput .placeHolderText{
        top:9px;
    }
    .inlineBox .chatInput article{
        height:69px;
    }
    .inlineBox .chatInput article footer{
        padding:0 0 0 300px;
        height:69px;
    }
    .inlineBox .chatInput article footer li{
        height:69px;
        line-height:69px;
    }
    .inlineBox .chatInput>div>div,
    .inlineBox .chatInput>div>form{
        height:80px;
    }
    .inlineBox .chatInput .buttonWrapper{
        vertical-align:bottom;
    }
    .inlineBox .chatInput .buttonWrapper button{
        top:auto;
    }
    .inlineBox .chatInput input[type='text'],
    .inlineBox .chatInput .editableElement{
        bottom:8px;
    }
    .inlineBox #sendMessage_messageText{
        padding-top:9px;
    }
    .inlineBox .calendarEventDetails .chatInput article footer{
        padding-left:0;
    }



    /********************************************
    * Annotations
    ********************************************/
    #imageDraw .subPage{
        width:650px;
        /*margin-left:-325px;*/
    }
    #imageDraw .imageDrawContent{
        padding:20px;
    }



    /********************************************
    * Calendar Event: Creation
    ********************************************/
    .shadowBox div.eventTag,
    .inlineBox div.eventTag{
        padding-bottom:0;
    }
    .contentEventTitle{
        margin-left:8px;
    }
    .contentEventTitle .formLayout{
        padding-left:0;
    }
    .contentEventTitle .formLayout section{
        margin-left:-5px;
    }



    /********************************************
    * Calendar Event: Share Invite
    ********************************************/
    .createPost .formLayout section .calendarInvite  p{
        padding:0 15px;
    }



    /********************************************
    * Messages: Chat Thread
    ********************************************/
    .chatWindow footer.chatPicker>:first-child{
        margin-top:52px;
    }


    /********************************************
    * Messages: Create New
    ********************************************/
    .newMessage .scrollView .formLayout section .hgroup button.addToMsg,
    .newMessage .scrollView .formLayout section .hgroup button.removeFromMsg{
        left:23px;
    }
    .newMessage .contentSearchResults .formLayout section{
        padding-left:3px;
    }



    /********************************************
    * Circles: Add to Circle
    ********************************************/
    .circles .filterControl{
        margin:1px 0 0 -15px;
    }



    /********************************************
    * Circles: Add to Group
    ********************************************/
    .joinGroup .circles .filterControl{
        margin:1px 0 0 0;
    }



    /********************************************
    * Contact List
    ********************************************/
    #searchMembers.shadowBox .contactList, .inlineBox .contactList,
    #searchMembers.inlineBox .contactList, .inlineBox .contactList{
        padding-top:98px;
    }
    .contactList .scrollView .formLayout{
        margin-top:0px;
    }
    .contactList footer.circles>:first-child{
        margin-top:75px;
    }
    .contentBloomzLoc .hgroup p{
        padding-left:15px;
    }
    .inviteBloomz .scrollView .formLayout{
        margin-top:84px;
    }
    .inviteBloomz .scrollView .formLayout{
        margin-top:0;
    }



    /********************************************
    * Contact Tab
    ********************************************/
    .circlesTab .contentInviteCircles .circleRequests,
    .circlesTab .contentInviteCircles .friendRequests{
        padding:1px 15px 0 15px;
        margin-bottom:-20px;
    }
    .circlesTab .pendingInvitations>section{
        margin-left:300px !important;
        margin-right:258px !important;
    }



    /********************************************
    * User Profiles: Connections
    ********************************************/
    .shadowBox div.userProfileConnections{
        padding-top:100px;
    }



    /********************************************
    * Group Pages
    ********************************************/
    #_communityView{
        position:static;
    }



    /********************************************
    * Org Pages
    ********************************************/

    #orgHome .communityPage{
        padding-top:111px;
    }
    #orgHome .communityPage.hasSubTabs{
        padding-top:112px;
    }
    #orgHome .communityPage .actionBar{
        height: 80px;
        line-height: 80px;
        border-bottom: 1px solid #e0e0e0;
        background:#fff !important;
    }
    #orgHome .communityPage .actionBar h1{
        line-height: 1.55;
        text-align: left;
        font-size: 20px;
        color: #212121;
        font-weight: bold;
        border-color:transparent;
    }
    #orgHome .communityPage .logo{
        display:block;
        left:300px;
        cursor:default;
    }
    #orgHome .communityPage .logo:after{
        display:none;
    }
    #orgHome .communityPage .logo .communityLogo {
        top: 8px;
        left: 10px;
    }
    #orgHome .orgNav{
        position: absolute;
        top: 35px !important;
        height: 1px !important;
        padding:0 217px 0 300px;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        white-space: nowrap;
        width: auto;
        top:32px !important;
    }
    #orgHome .orgNav ul{
        background:transparent;
        box-shadow:none;
        overflow:visible;
        display: inline-block;
        padding:0;
        width:auto;
        height:auto;
    }
    #orgHome .orgNav li{
        display: inline-block !important;
        height: 40px;
        line-height: 40px;
        border: none !important;
    }
    #orgHome .orgNav ul.profileActions li {
    margin-left: 12px;
}
    #orgHome .orgNav li a{
        background: none;
        position:relative;
        line-height: 32px;
        height: 31px;
        margin-top: 0;
        color: #b3b3b3;
        text-shadow: none;
        font-size: 14px;
        text-indent: -9999px !important;
        padding: 0 10px;
        width: 32px !important;
        margin:0 10px;
        margin:0;
    }
    #orgHome .orgNav li.selected a{
        box-shadow:none;
    }
    #orgHome .orgNav li a:before{
        content:attr(data-coachmark);
        pointer-events:none;
        color:#fff !important;
        border:1px solid #212121;
        box-shadow:3px 3px 7px rgba(0,0,0,0.15);
        background:#212121;
        position:absolute;
        display:block !important;
        text-indent:0;
        margin-top:-16px;
        margin-left:20px;
        width:auto;
        padding:0px 10px;
        line-height:22px;
        height:20px;
        z-index:1;
        -webkit-border-radius:10px 10px 10px 0;
        -moz-border-radius:10px 10px 10px 0;
        border-radius:10px 10px 10px 0;
        opacity:0 !important;
        filter:alpha(opacity=0) !important;
        font-size: 13px;
    }
    #orgHome .orgNav li a:hover:before{
        opacity:1 !important;
        filter:alpha(opacity=100) !important;
    }
    #orgHome .communityPage.hasSubTabs{
        padding-top: 126px !important;
    }
    .hasSubTabs .actionBar{
        box-shadow:none !important;
    }
    #orgHome .communityPage.hasSubTabs .subNavTabs{
        background: transparent;
        padding: 0 0 0 300px;
        /*top: 78px;*/
        top:77px;
        left:0;
        height: 48px;
        line-height: 48px;
        box-shadow: none;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
    }
    /*#orgHome .communityPage.hasSubTabs .subNavTabs span{
        line-height: 48px;
        box-shadow: inset 0 -1px rgba(0,0,0,.3);
        background:#198aa9;
    }
    #orgHome .communityPage.hasSubTabs .subNavTabs span.selected:after{
        background: rgba(255,255,255,.32);
        height: 100%;
    }*/
    #orgHome .scrollView .scrollView.peopleListing{
        overflow:auto;
        padding:0;
    }
    #orgHome .scrollView .scrollView.peopleListing:after{
        display:none;
    }
    #orgHome .showMenu + .quickLinks{
        display:inline-block;
    }
    #orgHome .showMenu .orgNavMenu{
        background:#fff;
        width:200px;
        height:auto;
        max-height:400px;
        overflow:auto;
        padding:0;
        right:20px;
        margin-left:0;
        top:60px;
        box-shadow:2px 3px 8px rgba(0,0,0,0.4);
    }
    #orgHome .showMenu .orgNavMenu a{
        background:#fff;
        border-bottom:1px solid #e4e5ed;
        border-top:1px solid #fff;
        color:#000;
    }
    #orgHome .showMenu .orgNavMenu .selected a{
        background:#f1f1f1;
        border-bottom:1px solid #e4e5ed;
        border-top:none;
    }
    #orgHome .showMenu .orgNavMenu ul{
        background:#fff !important;
    }
    #orgHome .showMenu .orgNavMenu li:first-of-type{
        border-top:0;
    }
    #orgHome .showMenu .orgNavMenu li{
        border-top: 1px solid #fff;
        border-bottom: 1px solid rgba(0,0,0,.1);
    }
    #orgHome .showMenu .orgNavMenu li a{
        font-size:16px;
        text-align:left;
        text-indent:20px;
    }
    #orgHome .showMenu .orgNavMenu li.moreOpt{
        display:none;
    }
    #orgHome .showMenu .orgNavMenuDismiss{
        display:block;
        width:100%;
        height:100%;
        position:fixed;
        top:0;
        left:0;
    }
    .orgNavMenu::-webkit-scrollbar{
        width: 10px;  /* for vertical scrollbars */
    }
    .orgNavMenu::-webkit-scrollbar-track{
        background:rgba(255,255,255,.1);
    }
    .orgNavMenu::-webkit-scrollbar-thumb{
        background: rgba(0, 0, 0, 0.25);
        -moz-border-radius:0px;
        -webkit-border-radius:0px;
        border-radius:0px;
    }
    .orgNavMenu::-webkit-scrollbar-thumb:hover{
        background:#7d7d7d;
    }
    #orgHome .showMenu .orgNavMenu{
        left:auto;
        right:auto;
        top:90px;
        margin-left:288px;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .contactList,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .contactList{
        padding-top:0;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView{
        overflow:visible;
    }
    .Desktop .scrollView>section section.orgProfile.hasCover,
    .Desktop .scrollView .contentArea > section.orgProfile.hasCover, 
    .scrollView>section section.orgProfile.hasCover{
        height:284px;
        box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
        background-repeat: no-repeat;
        border-top:none;
        background-color: #fff;
        background-size: cover;
    }
    .orgProfile.hasCover h2,
    .orgSettingsPage .orgProfile.hasCover h2{
        width:84px;
        height:84px;
    }
    .orgProfile h2 img{
        width:80px;
        height:80px;
    }
    .orgProfile.hasCover h2 .profileXL.isLoading:before{
        width:84px;
        height:84px;
    }
    .orgProfile.hasCover .buttonGroup{
        bottom: auto;
        top: 8px;
        right: 8px;
        font-size:14px;
        line-height:24px;
        height:24px;
    }
    .orgProfile.hasCover .buttonGroup button{
        color: #8d8d90;
        font-size: 14px;
        line-height: 22px;
        height: 24px;
        padding: 2px 6px 3px 15px;
    }
    .orgProfile.hasCover .buttonGroup button:last-of-type {
        padding:2px 15px 3px 6px;
    }

 /*********************************************
    * Sponsor logo over cover image
    *********************************************/
    .sponsorLogo {
        height: 100% !important;
        max-height: 110px;
        display: flex !important;
        position: absolute !important;
        left: 120px !important;
        width: auto !important;
    }

    .sponsorLogo img{
        width:84px !important;
        height:84px !important;
    }

    .logoCover {
        margin-left: 5px;
        text-indent: 0;
        color: white;
        font-size: 13.5px;
        font-weight: 800;
    }



    /*********************************************
    * Org Pages: Subgroup ActionBar
    *********************************************/
    #orgHome .isSubgroup .addCurSection button{
        left:262px;
    }
    #orgHome .isSubgroup .quickLinks div.addButton{
        left:32px;
    }
    #orgHome .communityPage .actionBar .backButtonOnly{
        display:none;
    }
    #orgHome .isSubgroup.communityPage .actionBar .backButtonOnly{
        display:inline-block;
    }



    /*********************************************
    * Org Pages: Photo Albums Tab
    *********************************************/
    .photoAlbums{
        padding-top:5px;
    }
    #orgHome .photoAlbums{
        padding-top:15px;
        margin-top: 15px;
    }
    .photoAlbums>div.photoEntry,
    .photoAlbums>div.albumEntry,
    .photoAlbums>div,
    .studentResult>div{
        width:50%;
        padding:0 5px 0 0;
    }

    .studentResult>div{
        width: 33.333333%;
        padding:0 5px 0 0;
    }

    .photoAlbums>div.photoEntry:nth-child(odd),
    .photoAlbums>div.albumEntry:nth-child(odd),
    .studentResult>div.albumEntry:nth-child(odd){
        padding:0 0 0 5px;
        margin-left:-4px;
    }
    .photoAlbums div.persistentEmptyPanelMsg{
        display:block;
        width:100%;
        padding:0;
    }
    article.album p{
        height:160px;
    }
    .contentArea article.photo{
        margin:0 auto 24px auto;
        max-width:445px;
    }
    article.photo p{
        width:100%;
        padding-top:100%;
    }
    article.photo p img{
        display:none;
    }
    .photoAlbums.editMode{
        padding-bottom:0;
    }
    .photoAlbums h1 .add{
        display:none;
    }



    /*********************************************
    * Org Pages: Photo Albums Tab
    *********************************************/
    #orgHome .orgInfoPage .contentArea .formLayout:first-of-type{
        margin-top:-16px;
    }


    /*********************************************
    * Org Pages: Messages Tab
    *********************************************/
    .orgMessagesPage .chatWindow .chatScrollWrapper{
        padding-bottom:84px;
    }



    /********************************************
    * Notification Center
    ********************************************/
    #notificationCenter .orgNav {
        padding: 0;
    }
    #notificationCenter .notificationCenterWithFooter .multiAcceptance .acceptanceControl{
        padding-right:268px;
    }
    .hideSidePanel #notificationCenter .notificationCenterWithFooter .multiAcceptance .acceptanceControl{
        padding-right:0;
    }



    /*************************************************
    *  List Edit Controls
    **************************************************/
    .listEditControls{
        width:240px;
        top:360px;
        margin-left:50px;
        bottom:auto;
        border-top:none;
    }
    .listEditControls .header{
        display:block;
    }
    .listEditControls ul{
        padding:25px 10px 6px 10px;
        box-shadow: 0 0px 20px rgba(0,0,0,0.3);
        border-radius: 6px;
    }
    .listEditControls .close{
        display:block;
    }



    /********************************************
    * Recipients Picker
    ********************************************/
    .shadowBox .recipientPickerCtrl.modeShowTabs{
        /*padding-top:110px !important;*/
        padding-top:108px !important;
    }
    .shadowBox .recipientPickerCtrl.modeHideTabs,
    .shadowBox .recipientPickerCtrl.modeSearchResults{
        padding-top:48px;
    }
    .shadowBox .recipientPickerCtrl.modeHideTabsAndRecipients:not(.nhJoinSearchHousehold){
        padding-top:94px !important;
    }
    .recipientPickerCtrl.modeHideTabsAndRecipients.communityMembers {
        padding-top: 0px !important;
    }
    .shadowBox .getVerified .recipientPickerCtrl.modeHideTabsAndRecipients{
        padding-top:0;
    }
    .shadowBox .recipientPickerCtrl.modeAddPeople{
        padding-top:104px;
    }
    .recipientPickerCtrl.modeMainPanel .scrollView > .formLayout{
        padding:0 257px 0 300px;
    }
    .recipientPickerCtrl.modeMainPanel .actionBar.selectGroups .sourceType{
        padding:0 0 0 300px;
    }
    .recipientPickerCtrl.modeMainPanel .forModeMainPanel.actionBar.selectGroups{
        height:48px;
        top:62px;
    }
    .recipientPickerCtrl .peopleListing .friendRequests,
    .recipientPickerCtrl .peopleListing .circleRequests{
        padding:6px 12px 3px 232px;
        margin-bottom:-20px;
    }
    .recipientPickerCtrl.modeMainPanel .actionButtons{
        padding-left:282px;
        padding-right:282px;
        top:0px;
    }
    .recipientPickerCtrl .formLayout .circles h2 button.circle .circleName{
        width:350px;
    }




    /*************************************************
    * ScrollView: Scroll Bar Styles (Desktop Only)
    *************************************************/
    .Desktop .mainPanel .scrollView::-webkit-scrollbar{
        width: 10px;  /* for vertical scrollbars */
    }
    .Desktop .mainPanel .scrollView::-webkit-scrollbar-track{
        background:#f3f3f3;
    }
    .Desktop .mainPanel .scrollView::-webkit-scrollbar-thumb{
        background: rgba(0, 0, 0, 0.18);
        -moz-border-radius:0px;
        -webkit-border-radius:0px;
        border-radius:0px;
    }
    .Desktop .mainPanel .scrollView::-webkit-scrollbar-thumb:hover{
        background:#7d7d7d;
    }



    /******************************************************************
    *  Recipient Picker Control: position recipients list label on top
    ******************************************************************/
    .recipientPickerCtrl.labelTop.modeAddPeople{
        padding-top:48px;
    }



    /********************************************
    * Recipients Picker: noSearch
    ********************************************/
    .recipientPickerCtrl.modeMainPanel.noSearch .forModeMainPanel.actionBar.selectGroups{
        height:60px;
    }
    .recipientPickerCtrl.modeMainPanel.noSearch .peopleListing .friendRequests,
    .recipientPickerCtrl.modeMainPanel.noSearch .peopleListing .circleRequests{
        padding-top:20px;
        margin-bottom:-20px;
    }
    .recipientPickerCtrl.modeMainPanel.noSearch .scrollView > .formLayout{
        margin-top:20px;
        padding-top:0;
    }
    .recipientPickerCtrl.modeHideTabsAndRecipients.noSearch{
        padding-top:47px !important;
    }
    #_classGroupPicker #recipientPicker .subPage.recipientPickerCtrl, #_inviteToGroups #inviteToPicker .subPage.recipientPickerCtrl {
        padding-top: 48px !important;
    }
    .recipientPickerCtrl.modeHideTabsAndRecipients.noSearch .forModeHideTabs{
        height:auto;
    }
    .recipientPickerCtrl.modeHideTabsAndRecipients.noSearch .forModeHideTabs .searchBar{
        display:none;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs{
        background:none !important;
        min-height: 49px;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .searchBar,
    #communityMembersView .recipientPickerCtrl.modeHideTabsAndRecipients .actionBar,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .searchBar,
    .mainPanelSearchBar .forModeHideTabs .forModeHideTabs .searchBar{
        height:48px !important;
    }
    #communityMembersView .recipientPickerCtrl.modeHideTabsAndRecipients .actionBar{
        min-height: 48px !important;
        margin-top: 70px;
    }
    .hideSidePanel #communityMembersView .recipientPickerCtrl.modeHideTabsAndRecipients .actionBar{
        margin-top: 55px;
    }
    #communityMembersView .membersContainer{
        margin-top:45px;
    }
    #communityMembersView .recipientPickerCtrl.modeMainPanel .scrollView > .formLayout{
        padding-left: 0;
        margin-bottom: 0px;
        width: 487px;
    }
    #communityMembersView.inlineBox .scrollView:after{
        background: transparent !important;
    }
    #communityMembersView .recipientPickerCtrl.modeMainPanel .actionButtons{
        padding-left: 15px !important;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .actionButtons.searchBar,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .actionButtons.searchBar,
    .mainPanelSearchBar .forModeHideTabs .forModeHideTabs .actionButtons.searchBar{
        right:0;
    }
    #communityMembersView .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView .formLayout,
    #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .scrollView .formLayout{
        margin-top:0;
    }



    /********************************************
    * Recipients Picker: noTabs
    ********************************************/
    .recipientPickerCtrl.modeMainPanel.noTabs .forModeMainPanel.actionBar.selectGroups{
        height:48px;
    }
    .recipientPickerCtrl.modeMainPanel.noTabs .peopleListing .friendRequests,
    .recipientPickerCtrl.modeMainPanel.noTabs .peopleListing .circleRequests{
        padding-top:20px;
        margin-bottom:-20px;
    }
    .recipientPickerCtrl.modeMainPanel.noTabs .scrollView > .formLayout{
        margin-top:0;
        padding-top:0;
    }

    /********************************************
    * Create Class
    ********************************************/
    .labelEnableStudentTimeline {
        padding-left: 14px !important;
    }

    /********************************************
    * Behavior Management
    ********************************************/
    .ie .behaviorManagementContent,
    .ie .awardsWrapper{
        zoom:1;
    }
    .behaviorManagementSelectMultiple .subNavTabs{
        display:none !important;
    }
    .tPromptForBehaviorManagementFeature{
        width:400px;
    }
    .behaviorManagementHeader .fullscreen{
        display:inline-block;
    }



    /********************************************
    * Profile Page
    ********************************************/
    .profilePage .contentArea{
        padding-top:10px;
    }

    .tInlineTooltipNotification{
        padding-top: 70px !important;
    }


}



@media screen
and (min-width:1200px){
    .photoAlbums>div.photoEntry,
    .photoAlbums>div.albumEntry,
    .photoAlbums>div{
        width:33.333333%;
    }

    .studentResult>div{
        width: 19.333333%;
    }
}

/*************************************************
*
*  840- RESOLUTIONS
*
*************************************************/
@media screen
and (max-width:840px)
and (min-width:768px){
    .showSidePanel .scrollView h1.subInlineTabs .edit,
    .scrollView h1.subInlineTabs .edit{
        display:none;
    }
    .hideSidePanel .scrollView h1.subInlineTabs .edit{
        display:inline-block;
    }
}
@media screen
and (max-width:930px)
and (min-width:768px){
    .showSidePanel .scrollView h1.subInlineTabs .edit:before,
    .scrollView h1.subInlineTabs .edit:before{
        content:attr(data-selectShort);
    }
    .hideSidePanel .scrollView h1.subInlineTabs .edit:before{
        content:attr(data-selectLong);
    }
}




/*************************************************
*
*  1024+ RESOLUTIONS:  For displaying side chat
*
*************************************************/
@media screen
and (min-width:1024px){

    /********************************************
    * Loader
    ********************************************/
    .loadMoreEntries.bottom{
        width:507px;
        margin-left:-247px;
    }
    .postsTab .loadMoreEntries,
    .messagesTab .loadMoreEntries{
        margin-top:-1px;
    }
    .communityPage .loadMoreEntries{
        margin-left:-395px;
    }
    .ie .communityPage .loadMoreEntries{
        margin-top:117px;
        width: 785px;
    }
    .ie .loadingCommunity{
        margin-top:131px !important;
    }



    /********************************************
    * Recipients Picker
    ********************************************/
    .recipientPickerCtrl.modeMainPanel .actionBar.selectGroups .sourceType{
        padding:0 245px 0 235px;
        bottom:0;
    }
    .recipientPickerCtrl.modeMainPanel .actionButtons{
        padding-left:297px;
        padding-right:268px;
        top:0px;
    }
    #mainPanel .recipientPickerCtrl.modeMainPanel .forModeMainPanel .actionButtons{
        padding-left: 0;
        padding-right: 0;
        top: 0px;
        position: relative;
        margin-top: 0;
    }
    #mainPanel .recipientPickerCtrl.modeMainPanel .forModeMainPanel .actionButtons li.searchBox div {
        border-radius:50px;
    }
    .recipientPickerCtrl.modeMainPanel .scrollView > .formLayout{
        padding:47px 257px 0 300px;
    }

    .recipientPickerCtrl.modeMainPanel .forModeMainPanel.actionBar.selectGroups{
        height:48px;
        min-height:0;
        right:15px;
        left:auto;
    }
    .recipientPickerCtrl.modeMainPanel{
        padding-top:0;
    }
    .recipientPickerCtrl .peopleListing .friendRequests,
    .recipientPickerCtrl .peopleListing .circleRequests{
        padding:20px 262px 3px 232px;
        margin-bottom:-20px;
    }
    .recipientPickerCtrl .peopleListing .friendRequests + .formLayout,
    .recipientPickerCtrl .peopleListing .circleRequests + .formLayout{
        padding-top:20px;
    }

    /********************************************
    * Recipients Picker: noSearch
    ********************************************/
    .recipientPickerCtrl.modeMainPanel.noSearch .scrollView > .formLayout{
        margin-top:20px;
        padding-top:0;
    }



    /********************************************
    * Animations (Removed all panel animations)
    ********************************************/
    .Desktop .fade-hide,
    .Desktop .fade-hide.fade-hide-active,
    .Desktop .fade-show,
    .Desktop .fade-show.fade-show-active,
    .Desktop .slideLeftIn-show,
    .Desktop .slideLeftIn-show.slideLeftIn-show-active,
    .Desktop .slideLeftOut-hide,
    .Desktop .slideLeftOut-hide.slideLeftOut-hide-active,
    .Desktop .slideRightIn-show,
    .Desktop .slideRightIn-show.slideRightIn-show-active,
    .Desktop .slideRightOut-hide,
    .Desktop .slideRightOut-hide.slideRightOut-hide-active,
    .Desktop .slideUpIn-show,
    .Desktop .slideUpIn-show.slideUpIn-show-active,
    .Desktop .slideUpOut-hide,
    .Desktop .slideUpOut-hide.slideUpOut-hide-active,
    .Desktop .slideDownIn-show,
    .Desktop .slideDownIn-show.slideDownIn-show-active,
    .Desktop .slideDownOut-hide,
    .Desktop .slideDownOut-hide.slideDownOut-hide-active{
        -webkit-transition:none;
        -moz-transition:none;
        -ms-transition:none;
        -o-transition:none;
        transition:none;
        -webkit-transition:none;
    }



    /********************************************
    * Coachmarks
    ********************************************/
    .showCoachMarks .scrollView section.updates h1:after{
        top:36px;
        margin-left:-14px;
        right:auto;
        background-position:-82px -8px;
        transform: rotate(-60deg);
        -ms-transform: rotate(-60deg);
        -webkit-transform: rotate(-60deg);
    }
    .showCoachMarks .scrollView section.updates h1:before{
        top:27px;
        margin-left:48px;
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    .showCoachMarks .coachMarkClick{
        margin-left:-75px;
    }
    .showCoachMarks .mainNavBar li a:after,
    .showCoachMarks .mainNavBar li:after{
        display:none;
    }
    /* Coachmarks (Desktop Only) */
    .Desktop .showCoachMarks .scrollView>.contentArea:after{
        right:263px;
    }
    .Desktop .sidePanel .showCoachMarks .scrollView{
        border-color:#000;
    }
    .Desktop .sidePanel .showCoachMarks .scrollView:hover{
        overflow-x:hidden;
        overflow-y:hidden;
    }
    .Desktop .sidePanel .showCoachMarks{
        border-left:1px solid #000;
    }



    /********************************************
    * Action Bar
    ********************************************/
    #orgHome.menu .actionBar h1,
    .mainPanel .actionBar h1,
    .inlineBox .actionBar h1{
        text-indent:0px;
    }
    #orgHome .actionBar h1{
        padding:4px 60px 4px 315px !important;
    }



    /********************************************
    * Action Bar: Form Styles
    ********************************************/
    .inlineBox .actionBar .formLayout{
        margin:0 0 0 200px;
        padding:0;
    }
    .inlineBox .contactList .scrollView .formLayout{
        margin-top:144px;
    }
    .orgManagePage .scrollView .formLayout{
        margin-top: 0px !important;
    }



    /********************************************
    * Main Nav Bar
    ********************************************/
    nav.mainNavBar ul li.selected:before{
        margin-left: -252px;
    }



    /********************************************
    * Sub Inline Tabs
    ********************************************/
    .photoAlbums .multiSelectPhotos{
        display: block;
        text-align: right;
    }
    .photoAlbums .edit:before{
        content:attr(data-selectlong);
        font-size: 14px;
        color: #53c8e6;
        text-decoration: underline;
        padding: 10px;
        display:inline-block;
    }
    .mobileTabs{
        display:none !important;
    }


    /********************************************
    * Main Panel
    ********************************************/
    .mainPanel{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
        padding-right:300px;
        overflow:visible;
    }
    .mainPanel .contentArea .filterControl,
    .contentArea article,
    .contentArea section, .formPadding,
    .viewCircleFilters,
    a.loadMorePosts{
        margin-left:0;
        margin-right:auto;
    }





    /********************************************
    * Inline Box
    ********************************************/
    .inlineBox .subPage{
        /*padding-top:63px;*/
        padding-top:75px;
    }
    .inlineBox .subPage.hasSubTabs{
        padding-top:112px !important;
    }
    .inlineBox .subPage.hasSubTabs .orgNav{
        top:63px;
    }
    .noMenuLeftRight .subPage .scrollView{
        padding-right:0;
    }
    .inlineBox .scrollView{
        overflow-y:scroll;
    }
    .inlineBox .scrollView:after{
        content:"";
        background:#e8e8e8;
        display:block;
        width:50px;
        height:100%;
        position:fixed;
        top:0;
        right:0;
        z-index:1;
    }
    .firefox .inlineBox .scrollView:after{
        display:none; /* issue: https://app.asana.com/0/36593142165366/184443860473340/f */
    }
    .noMenuLeftRight .scrollView:after{
        width:0;
    }
    .ie .inlineBox .scrollView:after{
        display:none;
    }
    .noMenuLeftRight .contentArea{
        margin-right:0;
    }



    /********************************************
    * Tips:  Recommend Bloomz
    ********************************************/
    .mainPage .inlineToolTip,
    .recommendBloomzTip.inlineToolTip,
    .formLayout section.recommendBloomzTip.inlineToolTip{
        padding-right:268px;
    }
    .hideSidePanel .mainPage .inlineToolTip,
    .hideSidePanel.recommendBloomzTip.inlineToolTip,
    .hideSidePanel .formLayout section.recommendBloomzTip.inlineToolTip{
        padding-right:10px;
    }
    .recommendBloomzTip.inlineToolTip .dismissInlineToolTip,
    .formLayout section.recommendBloomzTip.inlineToolTip .dismissInlineToolTip{
        right:260px;
    }
    .hideSidePanel .recommendBloomzTip.inlineToolTip .dismissInlineToolTip,
    .hideSidePanel .formLayout section.recommendBloomzTip.inlineToolTip .dismissInlineToolTip{
        right:2px;
    }
    .inlineTooltipMainView{
        right: 0 !important;
    }



    /************************************************
    * Posts: Post: Detail View - Inappropriate Flag
    ************************************************/
    .postView.flaggedItem .flaggedItemControl ul{
        padding:0 260px 0 300px;
    }
    .postView.flaggedItem .flaggedItemControl ul:after{
        content:"";
        display:block;
        width:50px;
        height:50px;
        position:absolute;
        right:0;
        background:#f5f5f5;
        margin-top:5px;
        z-index:1;
    }


    /********************************************
    * Posts: Inline Comments Control
    ********************************************/
    .inlineBox .subPage .chatInput input[type='file']{
        left:201px;
    }




    /*************************************************
    *  Main Calendar
    *************************************************/
    .calendarWrapper{
        padding-left:256px;
        padding-right:260px;
        box-sizing:border-box;
    }
    .Desktop .calendarWrapper .contentArea{
        margin-left:0;
        margin-right:0;
    }



    /********************************************
    * Quick Links
    ********************************************/
    .volunteerHeader.actionBar {
        z-index:200
    }



    /********************************************
    * Contact Tab
    ********************************************/
    .circlesTab .contentInviteCircles .circleRequests,
    .circlesTab .contentInviteCircles .friendRequests{
        padding:52px 15px 0 15px;
        margin-bottom:-77px;
    }
    .circlesTab .pendingInvitations>section{
        margin-left:256px !important;
        margin-right:257px !important;
    }
    .circlesTab .pendingInvitations>section:first-of-type h1{
        padding-top:56px !important;
    }



    /********************************************
    * Org Pages
    ********************************************/
    label.mutedStatus{
        width:100%;
    }


    #genericControls>div>div:not(.shadowBox) .inlineToolTip,
    #genericControls>div>div:not(.shadowBox) .formLayout section.inlineToolTip{
        width:100%;
    }
    #orgHome .actionBar .actionButtons li:last-of-type{
        margin-right:-4px;
    }
    #orgHome .actionBar .actionButtons.grpSettings{
        right:68px;
        top:0;
    }
    #orgHome .actionBar .actionButtons.grpSettings button.orgEdit{
        padding:2px 4px 3px 4px;
    }
    #orgHome .actionBar .actionButtons.grpSettings button.orgEdit:after{
        margin-top:24px;
    }



    /*********************************************
    * Org Pages: Messages Tab
    *********************************************/
    .orgMessagesPage .contentArea{
        margin-right:0;
    }
    .orgMessagesPage #messageThreadNotificationBar{
        padding-right: 217px;
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
    }



    /********************************************
    * Photo Albums
    ********************************************/
    .photoAlbumGallery .ui-progressbar{
        right:233px;
    }
    .studentListPicker {
        padding-top: 0 !important;
    }
    .showSidePanel .scrollView h1.subInlineTabs .edit:before{
        content:attr(data-selectLong);
    }
}


.addCurSection { background:#fff; border:0; border-radius:0; }
/*************************************************
*
*  iOS Devices
*
*************************************************/



/****************************
* Using wkWebView control
****************************/
.iPhone .wkWebView .mainPanel .mainPage,
.iPhone .wkWebView .shadowBox .subPage,
.iPhone .wkWebView .inlineBox .subPage{
    padding-top:68px !important;
    background:#fff !important;
}
.iPhone .wkWebView .mainPanel .mainPage.hasSubTabs,
.iPhone .wkWebView .shadowBox .subPage.hasSubTabs,
.iPhone .wkWebView .inlineBox .subPage.hasSubTabs{
    padding-top:106px !important;
}
.iPhone .wkWebView .subNavTabs{
    top:70px;
}
.iPhone .wkWebView .recipientPickerCtrl.modeShowTabs{
    padding-top:130px !important;
}
.iPhone .wkWebView .recipientPickerCtrl.modeHideTabsAndRecipients,
.iPhone .wkWebView .shadowBox .subPage.hasSearchBar{
    padding-top:114px !important;
}
.iPhone .wkWebView .recipientPickerCtrl.modeHideTabsAndRecipients.noSearch{
    padding-top:67px !important;
}
.iPhone .wkWebView #orgHome .orgMembersPage .recipientPickerCtrl.browseOnly{
    padding-top:0px !important;
}
.iPhone .wkWebView .recipientPickerCtrl.modeHideTabsAndRecipients .actionButtons,
.iPhone .wkWebView .recipientPickerCtrl.modeMainPanel .actionButtons{
    top:68px !important;
}
.iPhone .wkWebView #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs{
    padding-top:0 !important;
}
.iPhone .wkWebView #orgHome .orgMembersPage .recipientPickerCtrl.modeHideTabsAndRecipients .forModeHideTabs .actionButtons.searchBar{
    top:0 !important;
}
.iPhone .wkWebView .welcomePage .subPage,
.iPhone .wkWebView .actionBar{
    padding-top:20px !important;
}
.iPhone .wkWebView .actionBar .backButtonOnly{
    margin-top:-1px !important;
}
.iPhone .wkWebView .actionBar .backButton{
    margin-top:1px !important;
}
.iPhone .wkWebView div.recommendIcon{
    top:22px;
}
.iPhone .wkWebView h1,
.iPhone .wkWebView .logo{
    top:20px !important;
}
.iPhone .wkWebView .actionBar .actionButtons{
    top:20px !important;
}
.iPhone .wkWebView #addUpdateEvent .eventForm .actionBar h1#addEvent_eventTag,
.iPhone .wkWebView #addUpdateEvent .eventForm .actionBar h1#addEvent_calendarSwitcher{
    top:21px !important;
}
.iPhone .wkWebView .actionBar .nextButton{
    top:18px !important;
}
.iPhone .wkWebView .navDrawer .subNavBar ul.trayActions{
    margin-top:143px !important;
}
.iPhone .wkWebView .orgNavMenu{
    top:119px !important;
}
.iPhone .wkWebView .orgEdit{
    top:69px !important;
}
.iPhone .wkWebView .sliderWrapper{
    background-color:transparent !important;
}
.iPhone .wkWebView .sliderWrapper .arrows .slideClose{
    top:20px !important;
}
.iPhone .wkWebView .sliderWrapper .slide #imageWrapper{
    background:#0d1a1e !important;
}
.iPhone .wkWebView div#messageTrayIcon{
    top:21px;
}
.iPhone .wkWebView .sidePanel{
    padding-top:69px;
}
.iPhone .wkWebView .sidePanel:before{
    padding-top:20px;
}




/*********************
* Main Area
*********************/
.iPad #orgHome .communityPage{
    padding-top:97px;
}
.iPad .inlineBox .contentArea{
    margin-right:0;
}
.iPhone .loadMoreEntries,
.iPad .loadMoreEntries{
    margin-top:-10px;
}
.iPhone .postsTab .loadMoreEntries,
.iPhone .messagesTab .loadMoreEntries,
.iPad .postsTab .loadMoreEntries,
.iPad .messagesTab .loadMoreEntries{
    margin-top:-1px;
}
.iPad .circlesTab .pendingInvitations>section{
    margin-right: 267px !important;
}
.iPad .mainPanel .contentArea{
    margin-right:268px;
}



/*************************************************
*  Side Panel
*************************************************/
.iPhone .sidePanel .mainPage .scrollView,
.iPad .sidePanel .mainPage .scrollView{
    -webkit-overflow-scrolling: touch !important;
}



/*************************************************
*  Hide/Show Message Tray
*************************************************/
.iPad.hideSidePanel .mainPanel .contentArea{
    margin-right:0;
}

.iPad.hideSidePanel .circlesTab .pendingInvitations>section{
    margin-right:0 !important;
}
.iPhone.showSidePanelMobile .displayingMainPanel ~ #genericControls .sidePanel .mainPage .scrollView{
    -webkit-overflow-scrolling: touch !important;
}
.iPhone.showSidePanelMobile .scrollView{
    -webkit-overflow-scrolling: auto;
}



/*********************
* Main: Tab Bar
*********************/
.iPad nav.mainNavBar ul.navFilters li ul li span{
    width:5px;
}

.iPad .mainSideBar .userHeader {
    display: block !important;
}

/*********************
* Action Bar
*********************/
.iPhone .actionBar,
.iPad .actionBar{
    -webkit-transform: translate3d(0,0,0);
}


/*********************************************
* SubNav Tabs
*********************************************/
.iPhone .subNavTabs{
    height:37px;
}
.iPhone .subNavTabs span{
    line-height:37px;
}
.iPhone .mainPage .subNavTabs{
    height:38px;
}
.iPhone .mainPage .subNavTabs span{
    line-height:38px;
}




/*********************
* Form Design
*********************/
.iPhone div.formPadding,
.iPhone form.formPadding,
.iPad div.formPadding,
.iPad form.formPadding{
    padding:0;
    margin-top:-1px;
    border-bottom:1px solid transparent;
}
.iPhone div.formPadding h1,
.iPhone form.formPadding h1,
.iPad div.formPadding h1,
.iPad form.formPadding h1{
    margin-top:0px;
    padding:25px 15px 0 15px;
    text-indent:0;
    margin-bottom:1px;
}
.iPhone div.formPadding h1.taskListingHeader,
.iPad div.formPadding h1.taskListingHeader{
    margin-bottom:5px;
    background:#e8e8e8;
    margin-top:-30px;
}
.iPhone div.formPadding section.formLayout+h1,
.iPhone form.formPadding section.formLayout+h1,
.iPad div.formPadding section.formLayout+h1,
.iPad form.formPadding section.formLayout+h1{
    margin-top:-30px;
}
.iPhone div.formPadding>.formLayout>section,
.iPhone form.formPadding>.formLayout>section,
.iPhone div.formPadding>.formLayout>div>section,
.iPhone form.formPadding>.formLayout>div>section,
.iPhone div.formPadding .formLayout section.autoSuggest label,
.iPhone form.formPadding .formLayout section.autoSuggest label,
.iPad div.formPadding>.formLayout>section,
.iPad form.formPadding>.formLayout>section,
.iPad div.formPadding>.formLayout>div>section,
.iPad form.formPadding>.formLayout>div>section,
.iPad div.formPadding .formLayout section.autoSuggest label,
.iPad form.formPadding .formLayout section.autoSuggest label{
    text-indent:0;
}
.iPhone .formLayout section,
.iPad .formLayout section{
    border-bottom:1px solid #e6e6e6;
}
.iPhone div.formPadding>.formLayout,
.iPhone form.formPadding>.formLayout,
.iPhone div.formPadding>div>.formLayout,
.iPhone .accountSettingsCalendarSubscribe div.formPadding .formLayout,
.iPhone .accountSettingsCalendarSubscribe form.formPadding .formLayout,
.iPad div.formPadding>.formLayout,
.iPad form.formPadding>.formLayout,
.iPad div.formPadding>div>.formLayout,
.iPad .accountSettingsCalendarSubscribe div.formPadding .formLayout,
.iPad .accountSettingsCalendarSubscribe form.formPadding .formLayout{
    margin-bottom:35px;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:solid #d9d9d9;
    border-width:1px 0;
    box-shadow:none;
    padding-left:15px;
}
.iPhone div.formPadding>.formLayout:last-of-type,
.iPhone form.formPadding>.formLayout:last-of-type,
.iPhone div.formPadding>div>.formLayout:last-of-type,
.iPhone .accountSettingsCalendarSubscribe div.formPadding .formLayout:last-of-type,
.iPhone .accountSettingsCalendarSubscribe form.formPadding .formLayout:last-of-type,
.iPad div.formPadding>.formLayout:last-of-type,
.iPad form.formPadding>.formLayout:last-of-type,
.iPad div.formPadding>div>.formLayout:last-of-type,
.iPad .accountSettingsCalendarSubscribe div.formPadding .formLayout:last-of-type,
.iPad .accountSettingsCalendarSubscribe form.formPadding .formLayout:last-of-type{
    margin-bottom:0;
}
.iPhone div.formPadding>.formLayout.showPassword:last-of-type,
.iPhone div.formPadding>.formLayout.hidePassword:last-of-type,
.iPad div.formPadding>.formLayout.showPassword:last-of-type,
.iPad div.formPadding>.formLayout.hidePassword:last-of-type{
    margin-bottom:35px;
}
.iPhone div.formPadding>.formLayout:first-of-type,
.iPhone form.formPadding>.formLayout:first-of-type,
.iPhone div.formPadding>div>.formLayout:first-of-type,
.iPhone .accountSettingsCalendarSubscribe div.formPadding .formLayout:first-of-type,
.iPhone .accountSettingsCalendarSubscribe form.formPadding .formLayout:first-of-type,
.iPad div.formPadding>.formLayout:first-of-type,
.iPad form.formPadding>.formLayout:first-of-type,
.iPad div.formPadding>div>.formLayout:first-of-type,
.iPad .accountSettingsCalendarSubscribe div.formPadding .formLayout:first-of-type,
.iPad .accountSettingsCalendarSubscribe form.formPadding .formLayout:first-of-type,
.iPhone div.formPadding>.formLayout.showPassword:first-of-type,
.iPhone div.formPadding>.formLayout.hidePassword:first-of-type,
.iPad div.formPadding>.formLayout.showPassword:first-of-type,
.iPad div.formPadding>.formLayout.hidePassword:first-of-type{
    margin-top:0;
}


.iPhone div div.formPadding>.showPasswordControl,
.iPhone div div.formPadding>.showPasswordControl,
.iPad div div.formPadding>.showPasswordControl,
.iPad div div.formPadding>.showPasswordControl{
    margin-top: -35px;
    border: none;
}
.iPhone .formPadding .formLayout.defaultBtn button,
.iPhone .formPadding .formLayout button.defaultBtn,
.iPhone .formPadding .formLayout.cautiousBtn button,
.iPhone .formPadding .formLayout button.cautiousBtn,
.iPad .formPadding .formLayout.defaultBtn button,
.iPad .formPadding .formLayout button.defaultBtn,
.iPad .formPadding .formLayout.cautiousBtn button,
.iPad .formPadding .formLayout button.cautiousBtn{
    padding:0 8px 0 7px;
    width:100%;
    margin-left:-15px;
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border: none;
}
.iPhone .eventForm .contentEventForm .cautiousBtn,
.iPad .eventForm .contentEventForm .cautiousBtn{
    margin-top:0;
}
.iPhone div.formPadding>.formLayout.formBtn,
.iPad div.formPadding>.formLayout.formBtn{
    padding:0 15px;
    margin-top:-20px;
    border:none;
    background:transparent;
}
.iPhone .formLayout .selectStyles.noDrillDown select,
.iPad .formLayout .selectStyles.noDrillDown select{
    padding-right:10px;
}
.iPhone div.formPadding>.formLayout,
.iPad div.formPadding>.formLayout{
    margin-top:35px;
}
.iPhone div.formPadding>.behaviorSettings,
.iPad div.formPadding>.behaviorSettings{
    margin-top:0;
}
.iPhone .behaviorSettingsWrapper,
.iPad .behaviorSettingsWrapper{
    margin-top:35px;
}
.iPhone div.formPadding>.communitySettings,
.iPad div.formPadding>.communitySettings{
    margin-top:0;
}
.iPhone div.studentAwards>.formLayout,
.iPad div.studentAwards>.formLayout{
    margin-top:35px !important;
}
.iPhone .dialogBox .formPadding>.formLayout:first-of-type,
.iPad .dialogBox .formPadding>.formLayout:first-of-type{
    margin-top:0;
}
.iPhone .dialogBox .formPadding>h1 + .formLayout:first-of-type,
.iPad .dialogBox .formPadding>h1 + .formLayout:first-of-type{
    margin-top:35px;
}
.iPhone .formLayout section .switchLabel,
.iPad .formLayout section .switchLabel{
    padding-left:0;
}





/**********************************************
* Form Design: Org Settings Page
**********************************************/
.iPhone .orgSettingsPage .scrollView>.formLayout,
.iPad .orgSettingsPage .scrollView>.formLayout{
    margin-top:-45px;
}
.iPhone .orgSettingsPage .scrollView>.optionsSort,
.iPad .orgSettingsPage .scrollView>.optionsSort{
    margin-top:0;
}
.iPhone .orgSettingsPage .formLayout section .formPadding h1,
.iPad .orgSettingsPage .formLayout section .formPadding h1{
    margin-bottom:-35px;
    margin-top:-30px;
    text-indent:15px;
}
.iPhone .orgSettingsPage .orgNav,
.iPad .orgSettingsPage .orgNav{
    margin-top:0;
    top:0;
}
.iPhone .orgSettingsPage .orgNav + section,
.iPad .orgSettingsPage .orgNav + section{
    margin-top:94px;
}
.iPhone .orgSettingsPage .addCalHeader + .formLayout{
    margin-top:0;
}
.iPhone .orgSettingsPage .orgNav ~ div.formPadding,
.iPad .orgSettingsPage .orgNav ~ div.formPadding{
    margin-top:35px;
}
.iPhone .orgSettingsPage .orgProfile+section,
.iPad .orgSettingsPage .orgProfile+section{
    margin-top:-35px;
}
.iPhone .orgSettingsPage .formLayout .inputProfile,
.iPad .orgSettingsPage .formLayout .inputProfile{
    margin-top:52px;
}
.iPhone .orgSettingsPage .orgNav li.selected a,
.iPad .orgSettingsPage .orgNav li.selected a{
    background-color:rgba(230,230,230,.4) !important;
}
.iPhone .orgSettingsPage .scrollView>section section.orgProfile,
.iPad .orgSettingsPage .scrollView>section section.orgProfile{
    margin-top:94px;
}
.iPhone .orgSettingsPage div.formPadding,
.iPad .orgSettingsPage div.formPadding{
    margin-top:30px;
}




/*******************************************
* Form Design: Create Class and Org Settings
********************************************/
.iPhone .orgSettingsPage .formLayout section .formPadding h1,
.iPhone .formPadding .parentcommunicationsettings h1,
.iPad .orgSettingsPage .formLayout section .formPadding h1,
.iPad .formPadding .parentcommunicationsettings h1{
    margin-bottom:0;
}




/**********************************************
* Form Design: Event Creation footer actions
**********************************************/
.iPhone footer.options,
.iPad footer.options{
    background:#fff;
    margin-bottom:-1px;
    border:solid #d9d9d9;
    border-width:1px 0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    margin-top:35px;
}
.iPhone footer.options li,
.iPad footer.options li{
    border-right:none;
}



/**********************************
* Form Design: Volunteer Tasks
**********************************/
.iPhone div.formPadding>div>.formLayout.taskListing,
.iPad div.formPadding>div>.formLayout.taskListing{
    padding-left:0;
    margin-bottom:20px;
}
.iPhone .taskListing .taskOptions,
.iPad .taskListing .taskOptions{
    padding-bottom:35px;
}
.iPhone .taskListing .taskOptions .taskOptionButtons:after,
.iPad .taskListing .taskOptions .taskOptionButtons:after{
    margin-top:0;
    border-bottom:1px solid #d9d9d9;
    height:35px;
    padding:0 5px;
}
.iPhone .taskListing .taskOptions .taskOptionButtons ul,
.iPad .taskListing .taskOptions .taskOptionButtons ul{
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    box-shadow:none;
    border-bottom:1px solid #d9d9d9;
}



/**********************************
* Form Design: Segmented Control
**********************************/
.iPhone .formLayout .inputGroupH,
.iPad .formLayout .inputGroupH{
    padding:4px 15px;
}
.iPhone .formLayout.numCircles .inputGroupH label,
.iPad .formLayout.numCircles .inputGroupH label{
    line-height:30px;
}
.iPhone .formLayout .inputGroupH label,
.iPad .formLayout .inputGroupH label{
    line-height:30px;
    background:#fff;
    border:1px solid #019bd0;
    border-right:none;
    color:#019bd0;
}
.iPhone .formLayout .inputGroupH label:last-of-type,
.iPad .formLayout .inputGroupH label:last-of-type{
    border-right:1px solid #019bd0;
}
.iPhone .formLayout .inputGroupH input:checked + label,
.iPhone .formLayout .inputGroupH label.genderSelected,
.iPad .formLayout .inputGroupH input:checked + label,
.iPad .formLayout .inputGroupH label.genderSelected{
    background:#019bd0;
    border:1px solid #019bd0;
}
.iPhone .numCircles,
.iPad .numCircles{
    padding:10px 0;
}
.iPhone div.formPadding>.formLayout.numCircles:last-of-type,
.iPad div.formPadding>.formLayout.numCircles:last-of-type{
    margin-bottom:35px;
}



/*****************************
* Form Design: Create Events
*****************************/
.iPhone .eventForm .contentEventForm .tags,
.iPad .eventForm .contentEventForm .tags{
    margin:20px 0 0 15px;
    display:inline-block;
}
.iPhone .contentEventForm .formPadding .formLayout.taskListing,
.iPad .contentEventForm .formPadding .formLayout.taskListing{
    padding-bottom:0;
}
.iPhone .contentEventForm .signatureWrapper,
.iPad .contentEventForm .signatureWrapper{
    margin-top:0 !important;
}
.iPhone .contentEventForm .signatureWrapper + .formLayout,
.iPad .contentEventForm .signatureWrapper + .formLayout{
    margin-top:0;
}
.iPhone .contentEventForm .volunteerTop,
.iPhone .contentEventForm .volunteerBottom,
.iPad .contentEventForm .volunteerTop,
.iPad .contentEventForm .volunteerBottom{
    border:#d9d9d9 solid;
    border-width:1px 0 2px 0;
}
.iPhone .contentEventForm .volunteerBottom,
.iPad .contentEventForm .volunteerBottom{
    margin-bottom:35px;
}



/*****************************
* Form Design: Create Post
*****************************/
.iPhone #addPost .formLayout,
.iPhone #communityInfoCardEdit .formLayout,
.iPad #addPost .formLayout,
.iPad #communityInfoCardEdit .formLayout{
    padding:0;
}
.iPhone #addPost .formLayout .formLayout,
.iPhone #communityInfoCardEdit .formLayout .formLayout,
.iPhone #addPost .formLayout .subjectLine,
.iPhone #communityInfoCardEdit .createPost .subjectLine,
.iPhone #communityInfoCardEdit .formLayout .formLayout .subjectLine,
.iPhone #addPost .formLayout .createPostBody,
.iPhone #communityInfoCardEdit .formLayout .createPostBody,
.iPad #addPost .formLayout .formLayout,
.iPad #communityInfoCardEdit .formLayout .formLayout,
.iPad #addPost .formLayout .subjectLine,
.iPad #communityInfoCardEdit .createPost .subjectLine,
.iPad #communityInfoCardEdit .formLayout .formLayout .subjectLine,
.iPad #addPost .formLayout .createPostBody,
.iPad #communityInfoCardEdit .formLayout .createPostBody{
    margin-bottom:35px;
    box-shadow:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    border:solid #d9d9d9;
    border-width:1px 0;
    padding-left:15px;
}
.iPhone #addPost .formLayout .subjectLine,
.iPad #addPost .formLayout .subjectLine{
    margin-bottom:-1px;
    border-bottom:1px solid #fff;
    padding-right:0;
}
.iPhone #communityInfoCardEdit .createPost .subjectLine,
.iPad #communityInfoCardEdit .createPost .subjectLine{
    margin-bottom:0;
    border:none;
    padding-right:0;
}
.iPhone #communityInfoCardEdit .createPost .subjectLine input,
.iPad #communityInfoCardEdit .createPost .subjectLine input{
    border-bottom:1px solid #d9d9d9;
    padding-right:10px;
}
.iPhone #communityInfoCardEdit .createPost .subjectLine ~ .createPostBody,
.iPad #communityInfoCardEdit .createPost .subjectLine ~ .createPostBody{
    border-top:none;
}
.iPhone #addPost .formLayout .subjectLine + .createPostBody,
.iPad #addPost .formLayout .subjectLine + .createPostBody{
    border-top:1px solid #fff;
}
.iPhone #addPost .formLayout .subjectLine input,
.iPad #addPost .formLayout .subjectLine input{
    border-bottom:1px solid #e6e6e6;
}
.iPhone #addPost .formLayout .createPostBody,
.iPhone #communityInfoCardEdit .createPost .createPostBody,
.iPad #addPost .formLayout .createPostBody,
.iPad #communityInfoCardEdit .createPost .createPostBody{
    margin-bottom:0;
    border-bottom:none;
    min-height:420px;
}
.iPhone #addPost .formLayout .createPostBody.announcementType,
.iPad #addPost .formLayout .createPostBody.announcementType{
    min-height:280px;
}
.iPhone #addPost .formLayout .formLayout>section:last-child,
.iPhone #communityInfoCardEdit .formLayout .formLayout>section:last-child,
.iPhone #addPost .formLayout .subjectLine>section:last-child,
.iPhone #communityInfoCardEdit .formLayout .formLayout .subjectLine>section:last-child,
.iPhone #addPost .formLayout .createPostBody>section:last-child,
.iPhone #communityInfoCardEdit .formLayout .createPostBody>section:last-child,
.iPad #addPost .formLayout .formLayout>section:last-child,
.iPad #communityInfoCardEdit .formLayout .formLayout>section:last-child,
.iPad #addPost .formLayout .subjectLine>section:last-child,
.iPad #communityInfoCardEdit .formLayout .formLayout .subjectLine>section:last-child,
.iPad #addPost .formLayout .createPostBody>section:last-child,
.iPad #communityInfoCardEdit .formLayout .createPostBody>section:last-child{
    border-bottom:1px solid transparent;
}
.iPhone #addPost .formLayout section.separateTime,
.iPhone #communityInfoCardEdit .formLayout section.separateTime,
.iPad #addPost .formLayout section.separateTime,
.iPad #communityInfoCardEdit .formLayout section.separateTime{
    border-bottom:1px solid #e6e6e6;
}
.iPhone #addPost .createPost .tags,
.iPad #addPost .createPost .tags{
    margin-left:10px;
    display:inline-block;
}
.iPhone #addPost .formLayout section.separateTime,
.iPhone #communityInfoCardEdit .formLayout section.separateTime,
.iPad #addPost .formLayout section.separateTime,
.iPad #communityInfoCardEdit .formLayout section.separateTime{
    padding-left:0;
}
.iPhone .postOptions,
.iPad .postOptions{
    background:#f6f7f7;
}
.iPhone .postOptions li,
.iPad .postOptions li{
    border:none;
}



/*****************************
* Form Design: Create Group
*****************************/
.iPhone .removeFormGroup,
.iPad .removeFormGroup{
    margin-top:-37px;
}
.iPhone #signUpScreenChildren .childInfo .removeFormGroup,
.iPad #signUpScreenChildren .childInfo .removeFormGroup{
    margin-top:-20px;
}
.iPhone .numCircles,
.iPad .numCircles{
    padding-left:0 !important;
}
.iPhone .createCirclePage .formLayout section,
.iPad .createCirclePage .formLayout section{
    text-indent:0;
}



/*****************************
* Form Design: Add Child
*****************************/
.iPhone .profilePage.newChild .scrollView>.formLayout,
.iPad .profilePage.newChild .scrollView>.formLayout{
    padding:10px 0 40px 0;
}
.iPhone .profilePage.newChild .scrollView>.formLayout>section,
.iPad .profilePage.newChild .scrollView>.formLayout>section{
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    margin-top:46px;
    box-shadow:none;
    border-bottom:1px solid #d9d9d9;
    padding-left:15px;
}
.iPhone .profilePage.newChild .formLayout section.editMyChildProfile,
.iPad .profilePage.newChild .formLayout section.editMyChildProfile{
    padding:3px 0 0 0;
    margin:-10px 0 0 0;
    border-bottom:none;
}
.iPhone .profilePage.newChild .newOnly.knownAs h1,
.iPhone .profilePage.newChild section.autoSuggest>label,
.iPad .profilePage.newChild .newOnly.knownAs h1,
.iPad .profilePage.newChild section.autoSuggest>label{
    background:#e8e8e8;
    text-indent:0;
    line-height:32px;
    border-bottom:1px solid #d9d9d9;
    margin-top:-29px;
    margin-left:-15px;
    padding:0 0 0 15px;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
}
.iPhone .profilePage.newChild .newOnly.knownAs .descript,
.iPhone .profilePage.newChild p.descript,
.iPad .profilePage.newChild .newOnly.knownAs .descript,
.iPad .profilePage.newChild p.descript{
    padding:15px 15px 15px 0;
    margin-bottom:0;
}
.iPhone .profilePage.newChild .newOnly.knownAs label,
.iPad .profilePage.newChild .newOnly.knownAs label{
    border-top:1px solid #e6e6e6;
}
.iPhone .profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type,
.iPad .profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type{
    /*padding-left:15px;*/
}
.iPhone .profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span,
.iPad .profilePage.newChild section.autoSuggest .selectedList .selectedItemWrapper:last-of-type span{
    padding-left:0;
}



/***********************************************
* Form Design: Accept Group Invite - Add Child
***********************************************/
.iPhone .invitationGroup .removeFormGroup,
.iPad .invitationGroup .removeFormGroup{
    margin-top: -9px;
    margin-right: 7px;
}



/*****************************
* Form Design: Invite Others
*****************************/

.iPhone .recipientPickerCtrl.labelTop.modeAddPeople,
.iPad .recipientPickerCtrl.labelTop.modeAddPeople{
    padding-top:48px;
}
.iPhone .recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout,
.iPad .recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout{
    border:solid #d9d9d9;
    border-width:0 0 1px 0;
    margin-top:1px;
}
.iPhone .recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout.ptaSwitches,
.iPad .recipientPickerCtrl.labelTop .scrollView .formPadding>.formLayout.ptaSwitches{
    margin-top:35px;
    border-top:1px solid #d9d9d9;
}
.iPhone .inviteCircles .contentInviteCircles div:first-of-type h1,
.iPad .inviteCircles .contentInviteCircles div:first-of-type h1{
    text-indent:15px;
}
.iPhone #inviteTeachers .formLayout textarea,
.iPad #inviteTeachers .formLayout textarea{
    padding:15px 8px 15px 0;
    height:388px;
}
.iPhone #inviteTeachers .formLayout .formPadding,
.iPad #inviteTeachers .formLayout .formPadding{
    padding-top:0;
}
.iPhone .recipientPickerCtrl.labelTop.modeAddPeople .actionBar.selectGroups,
.iPad .recipientPickerCtrl.labelTop.modeAddPeople .actionBar.selectGroups{
    height:48px;
}
.iPhone .recipientPickerCtrl.labelTop .recipientsListLabel,
.iPad .recipientPickerCtrl.labelTop .recipientsListLabel{
    top:0;
    margin:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.iPhone .recipientPickerCtrl.labelTop .circlesBox:before,
.iPad .recipientPickerCtrl.labelTop .circlesBox:before{
    top:-45px;
}
.iPhone .recipientPickerCtrl.labelTop.modeAddPeople .actionBar .actionButtons,
.iPad .recipientPickerCtrl.labelTop.modeAddPeople .actionBar .actionButtons{
    height:60px;
    top:98px;
}
.iPhone #inviteTeachers .recipientPickerCtrl.labelTop.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox,
.iPad #inviteTeachers .recipientPickerCtrl.labelTop.modeAddPeople .actionBarCircles ul.actionButtons li.circlesBox{
    padding:0;
}
.iPhone .recipientPickerCtrl.labelTop .recipients,
.iPad .recipientPickerCtrl.labelTop .recipients{
    padding:10px 15px 0 15px;
    box-shadow:none;
    border:none;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
    margin:0;
    min-height:37px;
}
.iPhone .recipientPickerCtrl .recipients .placeHolderText,
.iPad .recipientPickerCtrl .recipients .placeHolderText{
    margin-left:5px;
    top:1px;
}
.iPhone .recipients .textInput,
.iPad .recipients .textInput{
    padding-left:0;
}
.iPhone .inviteSubject,
.iPad .inviteSubject{
    padding-left:0;
    border-top:1px solid #dbdbdb;
}
.iPhone div.searchResultsOverlay,
.iPad div.searchResultsOverlay{
    margin-top:10px;
}
.iPhone .recipientPickerCtrl .inviteCircles .contentInviteCircles .recipientsWrapper,
.iPad .recipientPickerCtrl .inviteCircles .contentInviteCircles .recipientsWrapper{
    margin:0;
    padding:0;
}
.iPhone .recipientPickerCtrl .recipientsWrapper .recipients .placeHolderText,
.iPad .recipientPickerCtrl .recipientsWrapper .recipients .placeHolderText{
    padding:8px 8px 0 0;
    margin-left:0;
    top:0;
}



/**************************************
* Form Design: Inline Recipient Picker
**************************************/
.iPhone .inlineRecipientListing .recipients,
.iPad .inlineRecipientListing .recipients{
    padding-left:26px;
}

.iPhone .inlineRecipientListing .recipients>label,
.iPad .inlineRecipientListing .recipients>label{
    left:0;
    text-indent:0;
}
.iPhone .labelSearchStudents,
.iPad .labelSearchStudents{
    margin-top:6px;
}



/*****************************
* Form Design: FRE Forms
*****************************/
.iPhone .profilePage div.formPadding>.formLayout.acceptanceButtons,
.iPad .profilePage div.formPadding>.formLayout.acceptanceButtons{
    padding:0 15px;
}
.iPhone .formPadding .acceptanceButtons button.defaultBtn,
.iPad .formPadding .acceptanceButtons button.defaultBtn{
    border:1px solid;
    border-color:#e1e1e1 #dcdcdc #c7c7c7 #dcdcdc;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    background:#F7F7F7 !important;
    margin-left:0;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
.iPhone .insertLink,
.iPad .insertLink{
    margin-top:0;
}

.iPhone .linkImportClassMessenger,
.iPad .linkImportClassMessenger{
    margin-top:10px;
}



/*****************************
* Form Design: PT Conference
*****************************/
.iPhone .slotListing .dayHeader,
.iPad .slotListing .dayHeader{
    padding:0 10px 0 0;
    margin-top:0;
    padding-top:26px;
    margin-bottom:-27px;
}
.iPhone .slotListing label.slotTimes.lunchSlot div,
.iPad .slotListing label.slotTimes.lunchSlot div{
    text-indent:3px;
}
.iPhone section.dayHeaderWrapper.formLayout,
.iPad section.dayHeaderWrapper.formLayout {
    border: 0;
    margin-top: 0;
}
.iPhone .dayHeaderWrapper .undoAll,
.iPad .dayHeaderWrapper .undoAll{
    top: 26px;
}
.iPhone .dayHeaderWrapper .bulkActions,
.iPad .dayHeaderWrapper .bulkActions{
    top: 11px;
}



/************************************
* Form Design: Email Notifications
************************************/
.iPhone #emailSettings div.formPadding>.formLayout>section>label,
.iPad #emailSettings div.formPadding>.formLayout>section>label{
    padding-left:0;
}



/************************************
* Form Design: Reset Password
************************************/
.iPhone .resetPasswordBtn,
.iPad .resetPasswordBtn{
    background:#e8e8e8!important;
    border:none !important;
    padding:16px 10px;
}



/*****************************
* Dialog Box
*****************************/
.iPhone .alertBox .dialogBox .dialogMessage .formPadding:first-of-type,
.iPad .alertBox .dialogBox .dialogMessage .formPadding:first-of-type{
    padding-top:10px;
}
.iPhone .alertBoxAwards .dialogBox .dialogMessage .formPadding:first-of-type,
.iPad .alertBoxAwards .dialogBox .dialogMessage .formPadding:first-of-type{
    padding-top:0;
}
.iPhone .alertBox .dialogBox .dialogMessage .formPadding,
.iPad .alertBox .dialogBox .dialogMessage .formPadding{
    margin-bottom:-12px;
}
.iPhone .alertBox .dialogBox .dialogMessage .formPadding + .formPadding,
.iPad .alertBox .dialogBox .dialogMessage .formPadding + .formPadding{
    margin-top:12px;
}
.iPhone .actionSheet .dialogBox h1,
.iPhone .alertBox .dialogBox h1,
.iPad .actionSheet .dialogBox h1,
.iPad .alertBox .dialogBox h1{
    padding-top:0;
    padding-bottom:0;
}
.iPhone .actionSheet .dialogBox h1 strong,
.iPhone .alertBox .dialogBox h1 strong,
.iPad .actionSheet .dialogBox h1 strong,
.iPad .alertBox .dialogBox h1 strong{
    padding:5px 10px 0 10px;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
.iPhone .alertBox .dialogBox h1 strong.noBottomGap,
.iPad .alertBox .dialogBox h1 strong.noBottomGap{
    margin-bottom:5px;
}



/*****************************
* Walk through Page
*****************************/
.iPhone .freWalkthrough .walkthrough>section,
.iPad .freWalkthrough .walkthrough>section{
    border-bottom:none;
}




/*************************************************
*  Create Account Page
*************************************************/
.iPhone #getInvited .createAccountPage .formLayout,
.iPhone #accessCodeEnter .createAccountPage .formLayout,
.iPhone #signUpGroupCode .createAccountPage .formLayout,
.iPhone #signUpScreen .createAccountPage .formLayout,
.iPad #getInvited .createAccountPage .formLayout,
.iPad #accessCodeEnter .createAccountPage .formLayout,
.iPad #signUpGroupCode .createAccountPage .formLayout,
.iPad #signUpScreen .createAccountPage .formLayout,
.iPhone #login .createAccountPage .formLayout,
.iPad #login .createAccountPage .formLayout{
    padding-left:15px;
}
.iPhone #signUpGroupCode .createAccountPage .showPasswordControl,
.iPhone #signUpScreen .createAccountPage .showPasswordControl,
.iPad #signUpGroupCode .createAccountPage .showPasswordControl,
.iPad #signUpScreen .createAccountPage .showPasswordControl,
.iPhone #login .createAccountPage .showPasswordControl,
.iPad #login .createAccountPage .showPasswordControl{
    padding:0;
    margin-top:-35px;
    margin-bottom:8px;
}
.iPhone #signUpGroupCode .createAccountPage footer.formLayout,
.iPhone #signUpScreen .createAccountPage footer.formLayout,
.iPad #signUpGroupCode .createAccountPage footer.formLayout,
.iPad #signUpScreen .createAccountPage footer.formLayout,
.iPhone #login .createAccountPage footer.formLayout,
.iPad #login .createAccountPage footer.formLayout{
    padding:15px 15px 0 15px;
    background:transparent;
    border:none;
}
.iPhone #signUpGroupCode .createAccountPage .formLayout .leadInput,
.iPhone #signUpScreen .createAccountPage .formLayout .leadInput,
.iPad #signUpGroupCode .createAccountPage .formLayout .leadInput,
.iPad #signUpScreen .createAccountPage .formLayout .leadInput,
.iPhone #login .createAccountPage .formLayout .leadInput,
.iPad #login .createAccountPage .formLayout .leadInput{
    border:none;
    padding-left:0;
}
.iPhone #signUpGroupCode .createAccountPage .inlineToolTip,
.iPhone #signUpScreen .createAccountPage .inlineToolTip,
.iPad #signUpGroupCode .createAccountPage .inlineToolTip,
.iPad #signUpScreen .createAccountPage .inlineToolTip{
    border-bottom:none !important;
}


/*************************************************
*  Student Avatar
*************************************************/
.iPhone .pickStudentAvatarWrap,
.iPad .pickStudentAvatarWrap{
    margin-top:16px !important;
}


/*************************************************
*  Group Access Code Settings
*************************************************/
.iPhone div#inviteByGroupCode .downloadInstructions,
.iPad div#inviteByGroupCode .downloadInstructions{
    margin-top:-10px;
}



/*****************************
* Create Post
*****************************/
.iPhone section.scheduledFor #addAnnouncement_Start,
.iPad section.scheduledFor #addAnnouncement_Start{
    margin-top:-56px;
}



/*****************************
* Import Class Messenger
*****************************/
.iPhone #importClassMessenger .formLayout .classMessenger h3,
.iPad #importClassMessenger .formLayout .classMessenger h3{
    padding-left:40px;
}


/********************************************
* iPad Landscape
********************************************/
@media screen
and (min-width:1024px){



    /********************************************
    * Main Panel
    ********************************************/
    .iPad .loadMoreEntries{
        margin-left:-253px;
        margin-top:-10px;
    }
    .iPhone .postsTab .loadMoreEntries,
    .iPhone .messagesTab .loadMoreEntries,
    .iPad .postsTab .loadMoreEntries,
    .iPad .messagesTab .loadMoreEntries{
        margin-top:-1px;
    }




}
/*! jQuery UI - v1.11.2 - 2014-10-16
* http://jqueryui.com
* Includes: core.css, accordion.css, autocomplete.css, button.css, datepicker.css, dialog.css, draggable.css, menu.css, progressbar.css, resizable.css, selectable.css, selectmenu.css, slider.css, sortable.css, spinner.css, tabs.css, tooltip.css, theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana%2CArial%2Csans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=highlight_soft&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=flat&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=glass&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=glass&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=glass&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=glass&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
* Copyright 2014 jQuery Foundation and other contributors; Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-clearfix {
	min-height: 0; /* support: IE7 */
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
	z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
	cursor: default !important;
}


/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
}


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-accordion .ui-accordion-header {
	display: block;
	cursor: pointer;
	position: relative;
	margin: 2px 0 0 0;
	padding: .5em .5em .5em .7em;
	min-height: 0; /* support: IE7 */
	font-size: 100%;
}
.ui-accordion .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-icons .ui-accordion-icons {
	padding-left: 2.2em;
}
.ui-accordion .ui-accordion-header .ui-accordion-header-icon {
	position: absolute;
	left: .5em;
	top: 50%;
	margin-top: -8px;
}
.ui-accordion .ui-accordion-content {
	padding: 1em 2.2em;
	border-top: 0;
	overflow: auto;
}
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
}
.ui-button {
	display: inline-block;
	position: relative;
	padding: 0;
	line-height: normal;
	margin-right: .1em;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;
	overflow: visible; /* removes extra width in IE */
}
.ui-button,
.ui-button:link,
.ui-button:visited,
.ui-button:hover,
.ui-button:active {
	text-decoration: none;
}
/* to make room for the icon, a width needs to be set here */
.ui-button-icon-only {
	width: 2.2em;
}
/* button elements seem to need a little more width */
button.ui-button-icon-only {
	width: 2.4em;
}
.ui-button-icons-only {
	width: 3.4em;
}
button.ui-button-icons-only {
	width: 3.7em;
}

/* button text element */
.ui-button .ui-button-text {
	display: block;
	line-height: normal;
}
.ui-button-text-only .ui-button-text {
	padding: .4em 1em;
}
.ui-button-icon-only .ui-button-text,
.ui-button-icons-only .ui-button-text {
	padding: .4em;
	text-indent: -9999999px;
}
.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 1em .4em 2.1em;
}
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
	padding: .4em 2.1em .4em 1em;
}
.ui-button-text-icons .ui-button-text {
	padding-left: 2.1em;
	padding-right: 2.1em;
}
/* no icon support for input elements, provide padding by default */
input.ui-button {
	padding: .4em 1em;
}

/* button icon element(s) */
.ui-button-icon-only .ui-icon,
.ui-button-text-icon-primary .ui-icon,
.ui-button-text-icon-secondary .ui-icon,
.ui-button-text-icons .ui-icon,
.ui-button-icons-only .ui-icon {
	position: absolute;
	top: 50%;
	margin-top: -8px;
}
.ui-button-icon-only .ui-icon {
	left: 50%;
	margin-left: -8px;
}
.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-icons-only .ui-button-icon-primary {
	left: .5em;
}
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-secondary,
.ui-button-icons-only .ui-button-icon-secondary {
	right: .5em;
}

/* button sets */
.ui-buttonset {
	margin-right: 7px;
}
.ui-buttonset .ui-button {
	margin-left: 0;
	margin-right: -.3em;
}

/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}
.ui-dialog {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	padding: .2em;
	outline: 0;
}
.ui-dialog .ui-dialog-titlebar {
	padding: .4em 1em;
	position: relative;
}
.ui-dialog .ui-dialog-title {
	float: left;
	margin: .1em 0;
	white-space: nowrap;
	width: 90%;
	overflow: hidden;
	text-overflow: ellipsis;
}
.ui-dialog .ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 50%;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
}
.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
}
.ui-dialog .ui-dialog-buttonpane {
	text-align: left;
	border-width: 1px 0 0 0;
	background-image: none;
	margin-top: .5em;
	padding: .3em 1em .5em .4em;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
	float: right;
}
.ui-dialog .ui-dialog-buttonpane button {
	margin: .5em .4em .5em 0;
	cursor: pointer;
}
.ui-dialog .ui-resizable-se {
	width: 12px;
	height: 12px;
	right: -5px;
	bottom: -5px;
	background-position: 16px 16px;
}
.ui-draggable .ui-dialog-titlebar {
	cursor: move;
}
.ui-draggable-handle {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: block;
	outline: none;
}
.ui-menu .ui-menu {
	position: absolute;
}
.ui-menu .ui-menu-item {
	position: relative;
	margin: 0;
	padding: 3px 1em 3px .4em;
	cursor: pointer;
	min-height: 0; /* support: IE7 */
	/* support: IE10, see #8844 */
	list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
}
.ui-menu .ui-menu-divider {
	margin: 5px 0;
	height: 0;
	font-size: 0;
	line-height: 0;
	border-width: 1px 0 0 0;
}
.ui-menu .ui-state-focus,
.ui-menu .ui-state-active {
	margin: -1px;
}

/* icon support */
.ui-menu-icons {
	position: relative;
}
.ui-menu-icons .ui-menu-item {
	padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
	position: absolute;
	top: 0;
	bottom: 0;
	left: .2em;
	margin: auto 0;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
	left: auto;
	right: 0;
}
.ui-progressbar {
	height: 2em;
	text-align: left;
	overflow: hidden;
}
.ui-progressbar .ui-progressbar-value {
	margin: -1px;
	height: 100%;
}
.ui-progressbar .ui-progressbar-overlay {
	background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
	height: 100%;
	filter: alpha(opacity=25); /* support: IE8 */
	opacity: 0.25;
}
.ui-progressbar-indeterminate .ui-progressbar-value {
	background-image: none;
}
.ui-resizable {
	position: relative;
}
.ui-resizable-handle {
	position: absolute;
	font-size: 0.1px;
	display: block;
	-ms-touch-action: none;
	touch-action: none;
}
.ui-resizable-disabled .ui-resizable-handle,
.ui-resizable-autohide .ui-resizable-handle {
	display: none;
}
.ui-resizable-n {
	cursor: n-resize;
	height: 7px;
	width: 100%;
	top: -5px;
	left: 0;
}
.ui-resizable-s {
	cursor: s-resize;
	height: 7px;
	width: 100%;
	bottom: -5px;
	left: 0;
}
.ui-resizable-e {
	cursor: e-resize;
	width: 7px;
	right: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-w {
	cursor: w-resize;
	width: 7px;
	left: -5px;
	top: 0;
	height: 100%;
}
.ui-resizable-se {
	cursor: se-resize;
	width: 12px;
	height: 12px;
	right: 1px;
	bottom: 1px;
}
.ui-resizable-sw {
	cursor: sw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	bottom: -5px;
}
.ui-resizable-nw {
	cursor: nw-resize;
	width: 9px;
	height: 9px;
	left: -5px;
	top: -5px;
}
.ui-resizable-ne {
	cursor: ne-resize;
	width: 9px;
	height: 9px;
	right: -5px;
	top: -5px;
}
.ui-selectable {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-selectable-helper {
	position: absolute;
	z-index: 100;
	border: 1px dotted black;
}
.ui-selectmenu-menu {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
.ui-selectmenu-menu .ui-menu {
	overflow: auto;
	/* Support: IE7 */
	overflow-x: hidden;
	padding-bottom: 1px;
}
.ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
	font-size: 1em;
	font-weight: bold;
	line-height: 1.5;
	padding: 2px 0.4em;
	margin: 0.5em 0 0 0;
	height: auto;
	border: 0;
}
.ui-selectmenu-open {
	display: block;
}
.ui-selectmenu-button {
	display: inline-block;
	overflow: hidden;
	position: relative;
	text-decoration: none;
	cursor: pointer;
}
.ui-selectmenu-button span.ui-icon {
	right: 0.5em;
	left: auto;
	margin-top: -8px;
	position: absolute;
	top: 50%;
}
.ui-selectmenu-button span.ui-selectmenu-text {
	text-align: left;
	padding: 0.4em 2.1em 0.4em 1em;
	display: block;
	line-height: 1.4;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.ui-slider {
	position: relative;
	text-align: left;
}
.ui-slider .ui-slider-handle {
	position: absolute;
	z-index: 2;
	width: 1.2em;
	height: 1.2em;
	cursor: default;
	-ms-touch-action: none;
	touch-action: none;
}
.ui-slider .ui-slider-range {
	position: absolute;
	z-index: 1;
	font-size: .7em;
	display: block;
	border: 0;
	background-position: 0 0;
}

/* support: IE8 - See #6727 */
.ui-slider.ui-state-disabled .ui-slider-handle,
.ui-slider.ui-state-disabled .ui-slider-range {
	filter: inherit;
}

.ui-slider-horizontal {
	height: .8em;
}
.ui-slider-horizontal .ui-slider-handle {
	top: -.3em;
	margin-left: -.6em;
}
.ui-slider-horizontal .ui-slider-range {
	top: 0;
	height: 100%;
}
.ui-slider-horizontal .ui-slider-range-min {
	left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
	right: 0;
}

.ui-slider-vertical {
	width: .8em;
	height: 100px;
}
.ui-slider-vertical .ui-slider-handle {
	left: -.3em;
	margin-left: 0;
	margin-bottom: -.6em;
}
.ui-slider-vertical .ui-slider-range {
	left: 0;
	width: 100%;
}
.ui-slider-vertical .ui-slider-range-min {
	bottom: 0;
}
.ui-slider-vertical .ui-slider-range-max {
	top: 0;
}
.ui-sortable-handle {
	-ms-touch-action: none;
	touch-action: none;
}
.ui-spinner {
	position: relative;
	display: inline-block;
	overflow: hidden;
	padding: 0;
	vertical-align: middle;
}
.ui-spinner-input {
	border: none;
	background: none;
	color: inherit;
	padding: 0;
	margin: .2em 0;
	vertical-align: middle;
	margin-left: .4em;
	margin-right: 22px;
}
.ui-spinner-button {
	width: 16px;
	height: 50%;
	font-size: .5em;
	padding: 0;
	margin: 0;
	text-align: center;
	position: absolute;
	cursor: default;
	display: block;
	overflow: hidden;
	right: 0;
}
/* more specificity required here to override default borders */
.ui-spinner a.ui-spinner-button {
	border-top: none;
	border-bottom: none;
	border-right: none;
}
/* vertically center icon */
.ui-spinner .ui-icon {
	position: absolute;
	margin-top: -8px;
	top: 50%;
	left: 0;
}
.ui-spinner-up {
	top: 0;
}
.ui-spinner-down {
	bottom: 0;
}

/* TR overrides */
.ui-spinner .ui-icon-triangle-1-s {
	/* need to fix icons sprite */
	background-position: -65px -16px;
}
.ui-tabs {
	position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
	padding: .2em;
}
.ui-tabs .ui-tabs-nav {
	margin: 0;
	padding: .2em .2em 0;
}
.ui-tabs .ui-tabs-nav li {
	list-style: none;
	float: left;
	position: relative;
	top: 0;
	margin: 1px .2em 0 0;
	border-bottom-width: 0;
	padding: 0;
	white-space: nowrap;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
	float: left;
	padding: .5em 1em;
	text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
	margin-bottom: -1px;
	padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
.ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
	cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
	cursor: pointer;
}
.ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding: 1em 1.4em;
	background: none;
}
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 300px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}
body .ui-tooltip {
	border-width: 2px;
}

/* Component containers
----------------------------------*/
.ui-widget {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1.1em;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1em;
}
.ui-widget-content {
	border: 1px solid #aaaaaa;
	background: #ffffff url("/images/ui-bg_flat_75_ffffff_40x100.png") 50% 50% repeat-x;
	color: #222222;
}
.ui-widget-content a {
	color: #222222;
}
.ui-widget-header {
	border: 1px solid #aaaaaa;
	background: #cccccc url("images/ui-bg_highlight-soft_75_cccccc_1x100.png") 50% 50% repeat-x;
	color: #222222;
	font-weight: bold;
}
.ui-widget-header a {
	color: #222222;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
	border: 1px solid #d3d3d3;
	background: #e6e6e6 url("images/ui-bg_glass_75_e6e6e6_1x400.png") 50% 50% repeat-x;
	font-weight: normal;
	color: #555555;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
	color: #555555;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
	border: 1px solid #999999;
	background: #dadada url("images/ui-bg_glass_75_dadada_1x400.png") 50% 50% repeat-x;
	font-weight: normal;
	color: #212121;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
	color: #212121;
	text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
	border: 1px solid #aaaaaa;
	background: #ffffff url("images/ui-bg_glass_65_ffffff_1x400.png") 50% 50% repeat-x;
	font-weight: normal;
	color: #212121;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #212121;
	text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid #fcefa1;
	background: #fbf9ee url("images/ui-bg_glass_55_fbf9ee_1x400.png") 50% 50% repeat-x;
	color: #363636;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #363636;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid #cd0a0a;
	background: #fef1ec url("images/ui-bg_glass_95_fef1ec_1x400.png") 50% 50% repeat-x;
	color: #cd0a0a;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #cd0a0a;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #cd0a0a;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: .7;
	filter:Alpha(Opacity=70); /* support: IE8 */
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: .35;
	filter:Alpha(Opacity=35); /* support: IE8 */
	background-image: none;
}
.ui-state-disabled .ui-icon {
	filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	width: 16px;
	height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url("images/ui-icons_222222_256x240.png");
}
.ui-widget-header .ui-icon {
	background-image: url("images/ui-icons_222222_256x240.png");
}
.ui-state-default .ui-icon {
	background-image: url("images/ui-icons_888888_256x240.png");
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
	background-image: url("images/ui-icons_454545_256x240.png");
}
.ui-state-active .ui-icon {
	background-image: url("images/ui-icons_454545_256x240.png");
}
.ui-state-highlight .ui-icon {
	background-image: url("images/ui-icons_2e83ff_256x240.png");
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
	background-image: url("images/ui-icons_cd0a0a_256x240.png");
}

/* positioning */
.ui-icon-blank { background-position: 16px 16px; }
.ui-icon-carat-1-n { background-position: 0 0; }
.ui-icon-carat-1-ne { background-position: -16px 0; }
.ui-icon-carat-1-e { background-position: -32px 0; }
.ui-icon-carat-1-se { background-position: -48px 0; }
.ui-icon-carat-1-s { background-position: -64px 0; }
.ui-icon-carat-1-sw { background-position: -80px 0; }
.ui-icon-carat-1-w { background-position: -96px 0; }
.ui-icon-carat-1-nw { background-position: -112px 0; }
.ui-icon-carat-2-n-s { background-position: -128px 0; }
.ui-icon-carat-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -64px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -64px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 4px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 4px;
}

/* Overlays */
.ui-widget-overlay {
	background: #aaaaaa url("images/ui-bg_flat_0_aaaaaa_40x100.png") 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30); /* support: IE8 */
}
.ui-widget-shadow {
	margin: -8px 0 0 -8px;
	padding: 8px;
	background: #aaaaaa url("images/ui-bg_flat_0_aaaaaa_40x100.png") 50% 50% repeat-x;
	opacity: .3;
	filter: Alpha(Opacity=30); /* support: IE8 */
	border-radius: 8px;
}.imageDrawContent {
    width: 100%;
    overflow-y: hidden;
    overflow-x: hidden;
}
#imageDrawCanvas {
    margin: 0 auto;
    width: 100%;
}
.imageDrawCanvasWrap {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
}
#imageDraw .subPage {
    padding-bottom:165px;
}
.Desktop #imageDraw .subPage, .iPad #imageDraw .subPage {
    height: 90%;
    max-height: 90%;
    /*margin-top: -5%;*/
}
@media screen
and (max-width:767px) {
    #imageDraw .subPage{
        height:100% !important;
        max-height:100% !important;
        margin-top:0 !important;
    }
}
#imageDraw .colorPicker {
    display: block;
    width: 100%;
    height: 56px;
    overflow-y:hidden;
    overflow-x:auto;
    white-space: nowrap;
    -webkit-overflow-scrolling:touch;
}
#imageDraw .loadMoreEntries{
    margin-left:-8px !important;
    left:auto !important;
    width:100% !important;
    top: 10px;
    position: absolute;
}






.Desktop #imageDraw .colorPicker::-webkit-scrollbar{
    height: 10px;
}
.Desktop #imageDraw .colorPicker::-webkit-scrollbar-track{
    background:rgba(255,255,255,.1);
}
.Desktop #imageDraw .colorPicker::-webkit-scrollbar-thumb{
    background: rgba(0, 0, 0, 0.18);
    -moz-border-radius:0;
    -webkit-border-radius:0;
    border-radius:0;
}
.Desktop #imageDraw .colorPicker,
.Desktop #imageDraw .colorPicker button{
    height:66px;
}
.Desktop #imageDraw .subPage{
    padding-bottom: 176px;
}





#imageDraw .imageDrawContent{
    padding:8px;
}
#imageDraw .colorPicker button {
    border: 0;
    display:inline-block;
    padding: 10px;
    width:56px;
    height:56px;
    vertical-align:top;
    box-shadow:inset 0 1px 0 rgba(0,0,0,.1);
}
#imageDraw .colorPicker button:active {
    opacity:0.8;
}

#imageDraw .colorPicker .selector {
    opacity: 0;
}

#imageDraw .colorPicker button:last-child .selector {
    border: 1px solid #666;
}

#imageDraw .colorPicker .colorSelected .selector {
    display: block;
    background: #fff;
    border-radius: 100%;
    opacity: .5;
    height: 35px;
    width: 35px;
    margin: 0 auto 50% auto;
}





/*****************************
* Audio
*****************************/
#imageDraw .audio {
    width: 100%;
    height: 59px;
    overflow: hidden;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
#imageDraw audio {
    margin-top: 5px;
    width:100%;
}
#imageDraw .audioControls {
    background: #eaeaea;
    margin: 8px;
    border-bottom: 1px solid #dadada;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position:relative;
    padding-right:32px;
}
#imageDraw audio::-webkit-media-controls-panel {
    background: none;
}
#imageDraw audio::-webkit-media-controls-volume-slider-container,
#imageDraw audio::-webkit-media-controls-volume-slider,
#imageDraw audio::-webkit-media-controls-mute-button {
    display: none !important;
}
#imageDraw audio::-webkit-media-controls-play-button{
    width:42px;
    height:42px;
    margin:0 -6px 0 6px;
}
#imageDraw audio::-webkit-media-controls-timeline {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #cdcdcd;
    height: 3px;
    margin-top: -5px;
    border-bottom-width: 2px;
    border-color: #cdcdcd;
}
#imageDraw audio::-webkit-media-controls-current-time-display {
    position: absolute;
    display: block;
    margin-top: 10px;
    left: 62px;
    color: #b0b0b0;
    font-size: 10px;
}
#imageDraw audio::-webkit-media-controls-time-remaining-display {
    position: absolute;
    display: block;
    margin-top: 10px;
    right: 18px;
    color: #b0b0b0;
    font-size: 10px;
}
#imageDraw .audioControls::after {
    position: absolute;
    content: " ";
    display: block;
    height: 10px;
    width: 10px;
    background: #eaeaea;
    right: 70px;
    margin-top: -15px;
}
#imageDraw audio::-webkit-media-controls-timeline-container,
#imageDraw audio::-webkit-media-controls-timeline {
    width: 100%;
}
#imageDraw .audio .remove {
    width:42px;
    height:42px;
    text-indent:-9999px;
    position:absolute;
    top:0;
    right:0;
    border:none;
    background-position:-652px -1679px;
    background-color:transparent;
}










body > textarea {
    border: 3px solid white;
    border-radius: 8px;
    outline: none;
    padding: 5px;
    transform: scale(.9);
}

.imageDrawActive {
    cursor: pointer;
}

.postOptions li .annotationRecordOption.selected::before {
    opacity: 1;
    animation: fadeRecord 4s linear;
    animation-iteration-count: infinite;
}

@keyframes fadeRecord {
    0% {opacity:.1}
    5%{opacity:1}
    85%{opacity:1}
    90%{opacity:0.1}
    100%{opacity:0.1}
}

.imageDrawDelete {
    height: 47px;
    width: 48px;
    background: url(/images/imageDraw-trash.png) no-repeat;
    background-size: contain;
    position: absolute;
    z-index: 3003;
    float: right;
    right: 0;
    margin-right: 8px;
    border: none;
}

.imageDrawUndo, .imageDrawRedo {
    height: 40px;
    width: 40px;
    position: absolute;
    z-index: 3003;
    border: none;
    background: green;
}

.imageDrawRedo {
    left: 50px;
}

.imageDrawUndo.disabled, .imageDrawRedo.disabled {
    background: red;
}
/*! angularjs-slider - v6.3.0 - 
 (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervieu.me>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> - 
 https://github.com/angular-slider/angularjs-slider - 
 2017-08-11 */
.rzslider {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 4px;
  margin: 35px 0 15px 0;
  vertical-align: middle;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.rzslider.with-legend {
  margin-bottom: 40px;
}

.rzslider[disabled] {
  cursor: not-allowed;
}

.rzslider[disabled] .rz-pointer {
  cursor: not-allowed;
  background-color: #d8e0f3;
}

.rzslider[disabled] .rz-draggable {
  cursor: not-allowed;
}

.rzslider[disabled] .rz-selection {
  background: #8b91a2;
}

.rzslider[disabled] .rz-tick {
  cursor: not-allowed;
}

.rzslider[disabled] .rz-tick.rz-selected {
  background: #8b91a2;
}

.rzslider span {
  position: absolute;
  display: inline-block;
  white-space: nowrap;
}

.rzslider .rz-base {
  width: 100%;
  height: 100%;
  padding: 0;
}

.rzslider .rz-bar-wrapper {
  left: 0;
  z-index: 1;
  width: 100%;
  height: 32px;
  padding-top: 16px;
  margin-top: -16px;
  box-sizing: border-box;
}

.rzslider .rz-draggable {
  cursor: move;
}

.rzslider .rz-bar {
  left: 0;
  z-index: 1;
  width: 100%;
  height: 4px;
  background: #d8e0f3;
  border-radius: 2px;
}

.rzslider .rz-bar-wrapper.rz-transparent .rz-bar {
  background: transparent;
}

.rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar {
  background: #df002d;
}

.rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar {
  background: #03a688;
}

.rzslider .rz-selection {
  z-index: 2;
  background: #0db9f0;
  border-radius: 2px;
}

.rzslider .rz-pointer {
  top: -14px;
  z-index: 3;
  width: 32px;
  height: 32px;
  cursor: pointer;
  background-color: #0db9f0;
  border-radius: 16px;
}

.rzslider .rz-pointer:after {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 4px;
  content: '';
}

.rzslider .rz-pointer:hover:after {
  background-color: #ffffff;
}

.rzslider .rz-pointer.rz-active {
  z-index: 4;
}

.rzslider .rz-pointer.rz-active:after {
  background-color: #451aff;
}

.rzslider .rz-bubble {
  bottom: 16px;
  padding: 1px 3px;
  color: #55637d;
  cursor: default;
}

.rzslider .rz-bubble.rz-limit {
  color: #55637d;
}

.rzslider .rz-ticks {
  position: absolute;
  top: -3px;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 0;
  margin: 0;
  list-style: none;
  box-sizing: border-box;
}

.rzslider .rz-ticks-values-under .rz-tick-value {
  top: auto;
  bottom: -32px;
}

.rzslider .rz-tick {
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  margin-left: 11px;
  text-align: center;
  cursor: pointer;
  background: #d8e0f3;
  border-radius: 50%;
}

.rzslider .rz-tick.rz-selected {
  background: #0db9f0;
}

.rzslider .rz-tick-value {
  position: absolute;
  top: -30px;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

.rzslider .rz-tick-legend {
  position: absolute;
  top: 24px;
  max-width: 50px;
  white-space: normal;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

.rzslider.rz-vertical {
  position: relative;
  width: 4px;
  height: 100%;
  padding: 0;
  margin: 0 20px;
  vertical-align: baseline;
}

.rzslider.rz-vertical .rz-base {
  width: 100%;
  height: 100%;
  padding: 0;
}

.rzslider.rz-vertical .rz-bar-wrapper {
  top: auto;
  left: 0;
  width: 32px;
  height: 100%;
  padding: 0 0 0 16px;
  margin: 0 0 0 -16px;
}

.rzslider.rz-vertical .rz-bar {
  bottom: 0;
  left: auto;
  width: 4px;
  height: 100%;
}

.rzslider.rz-vertical .rz-pointer {
  top: auto;
  bottom: 0;
  left: -14px !important;
}

.rzslider.rz-vertical .rz-bubble {
  bottom: 0;
  left: 16px !important;
  margin-left: 3px;
}

.rzslider.rz-vertical .rz-ticks {
  top: 0;
  left: -3px;
  z-index: 1;
  width: 0;
  height: 100%;
}

.rzslider.rz-vertical .rz-tick {
  margin-top: 11px;
  margin-left: auto;
  vertical-align: middle;
}

.rzslider.rz-vertical .rz-tick-value {
  top: auto;
  left: 24px;
  -webkit-transform: translate(0, -28%);
          transform: translate(0, -28%);
}

.rzslider.rz-vertical .rz-tick-legend {
  top: auto;
  right: 24px;
  max-width: none;
  white-space: nowrap;
  -webkit-transform: translate(0, -28%);
          transform: translate(0, -28%);
}

.rzslider.rz-vertical .rz-ticks-values-under .rz-tick-value {
  right: 24px;
  bottom: auto;
  left: auto;
}
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJ6c2xpZGVyLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O2NBR2M7QUFDZDtFQUNFLG1CQUFtQjtFQUNuQixzQkFBc0I7RUFDdEIsWUFBWTtFQUNaLFlBQVk7RUFDWixzQkFBc0I7RUFDdEIsdUJBQXVCO0VBQ3ZCLDBCQUFrQjtLQUFsQix1QkFBa0I7TUFBbEIsc0JBQWtCO1VBQWxCLGtCQUFrQjtDQUNuQjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLG9CQUFvQjtFQUNwQiwwQkFBMEI7Q0FDM0I7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLFlBQVk7RUFDWixhQUFhO0VBQ2IsV0FBVztDQUNaOztBQUVEO0VBQ0UsUUFBUTtFQUNSLFdBQVc7RUFDWCxZQUFZO0VBQ1osYUFBYTtFQUNiLGtCQUFrQjtFQUNsQixrQkFBa0I7RUFDbEIsdUJBQXVCO0NBQ3hCOztBQUVEO0VBQ0UsYUFBYTtDQUNkOztBQUVEO0VBQ0UsUUFBUTtFQUNSLFdBQVc7RUFDWCxZQUFZO0VBQ1osWUFBWTtFQUNaLG9CQUFvQjtFQUdaLG1CQUFtQjtDQUM1Qjs7QUFFRDtFQUNFLHdCQUF3QjtDQUN6Qjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLFdBQVc7RUFDWCxvQkFBb0I7RUFHWixtQkFBbUI7Q0FDNUI7O0FBRUQ7RUFDRSxXQUFXO0VBQ1gsV0FBVztFQUNYLFlBQVk7RUFDWixhQUFhO0VBQ2IsZ0JBQWdCO0VBQ2hCLDBCQUEwQjtFQUdsQixvQkFBb0I7Q0FDN0I7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsVUFBVTtFQUNWLFdBQVc7RUFDWCxXQUFXO0VBQ1gsWUFBWTtFQUNaLG9CQUFvQjtFQUdaLG1CQUFtQjtFQUMzQixZQUFZO0NBQ2I7O0FBRUQ7RUFDRSwwQkFBMEI7Q0FDM0I7O0FBRUQ7RUFDRSxXQUFXO0NBQ1o7O0FBRUQ7RUFDRSwwQkFBMEI7Q0FDM0I7O0FBRUQ7RUFDRSxhQUFhO0VBQ2IsaUJBQWlCO0VBQ2pCLGVBQWU7RUFDZixnQkFBZ0I7Q0FDakI7O0FBRUQ7RUFDRSxlQUFlO0NBQ2hCOztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFVBQVU7RUFDVixRQUFRO0VBQ1IsV0FBVztFQUNYLFlBQVk7RUFDWixVQUFVO0VBQ1YsVUFBVTtFQUNWLGlCQUFpQjtFQUNqQix1QkFBdUI7Q0FDeEI7O0FBRUQ7RUFDRSxVQUFVO0VBQ1YsY0FBYztDQUNmOztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLE9BQU87RUFDUCxRQUFRO0VBQ1IsWUFBWTtFQUNaLGFBQWE7RUFDYixrQkFBa0I7RUFDbEIsbUJBQW1CO0VBQ25CLGdCQUFnQjtFQUNoQixvQkFBb0I7RUFDcEIsbUJBQW1CO0NBQ3BCOztBQUVEO0VBQ0Usb0JBQW9CO0NBQ3JCOztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFdBQVc7RUFDWCxzQ0FBOEI7VUFBOUIsOEJBQThCO0NBQy9COztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFVBQVU7RUFDVixnQkFBZ0I7RUFDaEIsb0JBQW9CO0VBQ3BCLHNDQUE4QjtVQUE5Qiw4QkFBOEI7Q0FDL0I7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsV0FBVztFQUNYLGFBQWE7RUFDYixXQUFXO0VBQ1gsZUFBZTtFQUNmLHlCQUF5QjtDQUMxQjs7QUFFRDtFQUNFLFlBQVk7RUFDWixhQUFhO0VBQ2IsV0FBVztDQUNaOztBQUVEO0VBQ0UsVUFBVTtFQUNWLFFBQVE7RUFDUixZQUFZO0VBQ1osYUFBYTtFQUNiLG9CQUFvQjtFQUNwQixvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxVQUFVO0VBQ1YsV0FBVztFQUNYLFdBQVc7RUFDWCxhQUFhO0NBQ2Q7O0FBRUQ7RUFDRSxVQUFVO0VBQ1YsVUFBVTtFQUNWLHVCQUF1QjtDQUN4Qjs7QUFFRDtFQUNFLFVBQVU7RUFDVixzQkFBc0I7RUFDdEIsaUJBQWlCO0NBQ2xCOztBQUVEO0VBQ0UsT0FBTztFQUNQLFdBQVc7RUFDWCxXQUFXO0VBQ1gsU0FBUztFQUNULGFBQWE7Q0FDZDs7QUFFRDtFQUNFLGlCQUFpQjtFQUNqQixrQkFBa0I7RUFDbEIsdUJBQXVCO0NBQ3hCOztBQUVEO0VBQ0UsVUFBVTtFQUNWLFdBQVc7RUFDWCxzQ0FBOEI7VUFBOUIsOEJBQThCO0NBQy9COztBQUVEO0VBQ0UsVUFBVTtFQUNWLFlBQVk7RUFDWixnQkFBZ0I7RUFDaEIsb0JBQW9CO0VBQ3BCLHNDQUE4QjtVQUE5Qiw4QkFBOEI7Q0FDL0I7O0FBRUQ7RUFDRSxZQUFZO0VBQ1osYUFBYTtFQUNiLFdBQVc7Q0FDWiIsImZpbGUiOiJyenNsaWRlci5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKiEgYW5ndWxhcmpzLXNsaWRlciAtIHY2LjMuMCAtIFxuIChjKSBSYWZhbCBaYWphYyA8cnphamFjQGdtYWlsLmNvbT4sIFZhbGVudGluIEhlcnZpZXUgPHZhbGVudGluQGhlcnZpZXUubWU+LCBKdXNzaSBTYWFyaXZpcnRhIDxqdXNhc2lAZ21haWwuY29tPiwgQW5nZWxpbiBTaXJidSA8YW5nZWxpbi5zaXJidUBnbWFpbC5jb20+IC0gXG4gaHR0cHM6Ly9naXRodWIuY29tL2FuZ3VsYXItc2xpZGVyL2FuZ3VsYXJqcy1zbGlkZXIgLSBcbiAyMDE3LTA4LTExICovXG4ucnpzbGlkZXIge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogNHB4O1xuICBtYXJnaW46IDM1cHggMCAxNXB4IDA7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xufVxuXG4ucnpzbGlkZXIud2l0aC1sZWdlbmQge1xuICBtYXJnaW4tYm90dG9tOiA0MHB4O1xufVxuXG4ucnpzbGlkZXJbZGlzYWJsZWRdIHtcbiAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbn1cblxuLnJ6c2xpZGVyW2Rpc2FibGVkXSAucnotcG9pbnRlciB7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG4gIGJhY2tncm91bmQtY29sb3I6ICNkOGUwZjM7XG59XG5cbi5yenNsaWRlcltkaXNhYmxlZF0gLnJ6LWRyYWdnYWJsZSB7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG59XG5cbi5yenNsaWRlcltkaXNhYmxlZF0gLnJ6LXNlbGVjdGlvbiB7XG4gIGJhY2tncm91bmQ6ICM4YjkxYTI7XG59XG5cbi5yenNsaWRlcltkaXNhYmxlZF0gLnJ6LXRpY2sge1xuICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xufVxuXG4ucnpzbGlkZXJbZGlzYWJsZWRdIC5yei10aWNrLnJ6LXNlbGVjdGVkIHtcbiAgYmFja2dyb3VuZDogIzhiOTFhMjtcbn1cblxuLnJ6c2xpZGVyIHNwYW4ge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbn1cblxuLnJ6c2xpZGVyIC5yei1iYXNlIHtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMTAwJTtcbiAgcGFkZGluZzogMDtcbn1cblxuLnJ6c2xpZGVyIC5yei1iYXItd3JhcHBlciB7XG4gIGxlZnQ6IDA7XG4gIHotaW5kZXg6IDE7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDMycHg7XG4gIHBhZGRpbmctdG9wOiAxNnB4O1xuICBtYXJnaW4tdG9wOiAtMTZweDtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbn1cblxuLnJ6c2xpZGVyIC5yei1kcmFnZ2FibGUge1xuICBjdXJzb3I6IG1vdmU7XG59XG5cbi5yenNsaWRlciAucnotYmFyIHtcbiAgbGVmdDogMDtcbiAgei1pbmRleDogMTtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogNHB4O1xuICBiYWNrZ3JvdW5kOiAjZDhlMGYzO1xuICAtd2Via2l0LWJvcmRlci1yYWRpdXM6IDJweDtcbiAgICAgLW1vei1ib3JkZXItcmFkaXVzOiAycHg7XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogMnB4O1xufVxuXG4ucnpzbGlkZXIgLnJ6LWJhci13cmFwcGVyLnJ6LXRyYW5zcGFyZW50IC5yei1iYXIge1xuICBiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcbn1cblxuLnJ6c2xpZGVyIC5yei1iYXItd3JhcHBlci5yei1sZWZ0LW91dC1zZWxlY3Rpb24gLnJ6LWJhciB7XG4gIGJhY2tncm91bmQ6ICNkZjAwMmQ7XG59XG5cbi5yenNsaWRlciAucnotYmFyLXdyYXBwZXIucnotcmlnaHQtb3V0LXNlbGVjdGlvbiAucnotYmFyIHtcbiAgYmFja2dyb3VuZDogIzAzYTY4ODtcbn1cblxuLnJ6c2xpZGVyIC5yei1zZWxlY3Rpb24ge1xuICB6LWluZGV4OiAyO1xuICBiYWNrZ3JvdW5kOiAjMGRiOWYwO1xuICAtd2Via2l0LWJvcmRlci1yYWRpdXM6IDJweDtcbiAgICAgLW1vei1ib3JkZXItcmFkaXVzOiAycHg7XG4gICAgICAgICAgYm9yZGVyLXJhZGl1czogMnB4O1xufVxuXG4ucnpzbGlkZXIgLnJ6LXBvaW50ZXIge1xuICB0b3A6IC0xNHB4O1xuICB6LWluZGV4OiAzO1xuICB3aWR0aDogMzJweDtcbiAgaGVpZ2h0OiAzMnB4O1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIGJhY2tncm91bmQtY29sb3I6ICMwZGI5ZjA7XG4gIC13ZWJraXQtYm9yZGVyLXJhZGl1czogMTZweDtcbiAgICAgLW1vei1ib3JkZXItcmFkaXVzOiAxNnB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDE2cHg7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlcjphZnRlciB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxMnB4O1xuICBsZWZ0OiAxMnB4O1xuICB3aWR0aDogOHB4O1xuICBoZWlnaHQ6IDhweDtcbiAgYmFja2dyb3VuZDogI2ZmZmZmZjtcbiAgLXdlYmtpdC1ib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogNHB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgY29udGVudDogJyc7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlcjpob3ZlcjphZnRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmZmZmY7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlci5yei1hY3RpdmUge1xuICB6LWluZGV4OiA0O1xufVxuXG4ucnpzbGlkZXIgLnJ6LXBvaW50ZXIucnotYWN0aXZlOmFmdGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzQ1MWFmZjtcbn1cblxuLnJ6c2xpZGVyIC5yei1idWJibGUge1xuICBib3R0b206IDE2cHg7XG4gIHBhZGRpbmc6IDFweCAzcHg7XG4gIGNvbG9yOiAjNTU2MzdkO1xuICBjdXJzb3I6IGRlZmF1bHQ7XG59XG5cbi5yenNsaWRlciAucnotYnViYmxlLnJ6LWxpbWl0IHtcbiAgY29sb3I6ICM1NTYzN2Q7XG59XG5cbi5yenNsaWRlciAucnotdGlja3Mge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogLTNweDtcbiAgbGVmdDogMDtcbiAgei1pbmRleDogMTtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMDtcbiAgbWFyZ2luOiAwO1xuICBsaXN0LXN0eWxlOiBub25lO1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xufVxuXG4ucnpzbGlkZXIgLnJ6LXRpY2tzLXZhbHVlcy11bmRlciAucnotdGljay12YWx1ZSB7XG4gIHRvcDogYXV0bztcbiAgYm90dG9tOiAtMzJweDtcbn1cblxuLnJ6c2xpZGVyIC5yei10aWNrIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIGxlZnQ6IDA7XG4gIHdpZHRoOiAxMHB4O1xuICBoZWlnaHQ6IDEwcHg7XG4gIG1hcmdpbi1sZWZ0OiAxMXB4O1xuICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgYmFja2dyb3VuZDogI2Q4ZTBmMztcbiAgYm9yZGVyLXJhZGl1czogNTAlO1xufVxuXG4ucnpzbGlkZXIgLnJ6LXRpY2sucnotc2VsZWN0ZWQge1xuICBiYWNrZ3JvdW5kOiAjMGRiOWYwO1xufVxuXG4ucnpzbGlkZXIgLnJ6LXRpY2stdmFsdWUge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogLTMwcHg7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIDApO1xufVxuXG4ucnpzbGlkZXIgLnJ6LXRpY2stbGVnZW5kIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDI0cHg7XG4gIG1heC13aWR0aDogNTBweDtcbiAgd2hpdGUtc3BhY2U6IG5vcm1hbDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTUwJSwgMCk7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCB7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgd2lkdGg6IDRweDtcbiAgaGVpZ2h0OiAxMDAlO1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IDAgMjBweDtcbiAgdmVydGljYWwtYWxpZ246IGJhc2VsaW5lO1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LWJhc2Uge1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBwYWRkaW5nOiAwO1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LWJhci13cmFwcGVyIHtcbiAgdG9wOiBhdXRvO1xuICBsZWZ0OiAwO1xuICB3aWR0aDogMzJweDtcbiAgaGVpZ2h0OiAxMDAlO1xuICBwYWRkaW5nOiAwIDAgMCAxNnB4O1xuICBtYXJnaW46IDAgMCAwIC0xNnB4O1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LWJhciB7XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogYXV0bztcbiAgd2lkdGg6IDRweDtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LXBvaW50ZXIge1xuICB0b3A6IGF1dG87XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogLTE0cHggIWltcG9ydGFudDtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIC5yei1idWJibGUge1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDE2cHggIWltcG9ydGFudDtcbiAgbWFyZ2luLWxlZnQ6IDNweDtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIC5yei10aWNrcyB7XG4gIHRvcDogMDtcbiAgbGVmdDogLTNweDtcbiAgei1pbmRleDogMTtcbiAgd2lkdGg6IDA7XG4gIGhlaWdodDogMTAwJTtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIC5yei10aWNrIHtcbiAgbWFyZ2luLXRvcDogMTFweDtcbiAgbWFyZ2luLWxlZnQ6IGF1dG87XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotdGljay12YWx1ZSB7XG4gIHRvcDogYXV0bztcbiAgbGVmdDogMjRweDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMCwgLTI4JSk7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotdGljay1sZWdlbmQge1xuICB0b3A6IGF1dG87XG4gIHJpZ2h0OiAyNHB4O1xuICBtYXgtd2lkdGg6IG5vbmU7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlKDAsIC0yOCUpO1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LXRpY2tzLXZhbHVlcy11bmRlciAucnotdGljay12YWx1ZSB7XG4gIHJpZ2h0OiAyNHB4O1xuICBib3R0b206IGF1dG87XG4gIGxlZnQ6IGF1dG87XG59Il19 *//*!
 * FullCalendar v3.4.0 Stylesheet
 * Docs & License: https://fullcalendar.io/
 * (c) 2017 Adam Shaw
 */


.fc {
	direction: ltr;
	text-align: left;
}

.fc-rtl {
	text-align: right;
}

body .fc { /* extra precedence to overcome jqui */
	font-size: 1em;
}


/* Colors
--------------------------------------------------------------------------------------------------*/

.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-content, /* for gutter border */
.fc-unthemed .fc-popover,
.fc-unthemed .fc-list-view,
.fc-unthemed .fc-list-heading td {
	border-color: #ddd;
}

.fc-unthemed .fc-popover {
	background-color: #fff;
}

.fc-unthemed .fc-divider,
.fc-unthemed .fc-popover .fc-header,
.fc-unthemed .fc-list-heading td {
	background: #eee;
}

.fc-unthemed .fc-popover .fc-header .fc-close {
	color: #666;
}

.fc-unthemed td.fc-today {
	background: #fcf8e3;
}

.fc-highlight { /* when user is selecting cells */
	background: #bce8f1;
	opacity: .3;
}

.fc-bgevent { /* default look for background events */
	background: rgb(143, 223, 130);
	opacity: .3;
}

.fc-nonbusiness { /* default look for non-business-hours areas */
	/* will inherit .fc-bgevent's styles */
	background: #d7d7d7;
}

.fc-unthemed .fc-disabled-day {
	background: #d7d7d7;
	opacity: .3;
}

.ui-widget .fc-disabled-day { /* themed */
	background-image: none;
}


/* Icons (inline elements with styled text that mock arrow icons)
--------------------------------------------------------------------------------------------------*/

.fc-icon {
	display: inline-block;
	height: 1em;
	line-height: 1em;
	font-size: 1em;
	text-align: center;
	overflow: hidden;
	font-family: "Courier New", Courier, monospace;

	/* don't allow browser text-selection */
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	}

/*
Acceptable font-family overrides for individual icons:
	"Arial", sans-serif
	"Times New Roman", serif

NOTE: use percentage font sizes or else old IE chokes
*/

.fc-icon:after {
	position: relative;
}

.fc-icon-left-single-arrow:after {
	content: "\02039";
	font-weight: bold;
	font-size: 200%;
	top: -7%;
}

.fc-icon-right-single-arrow:after {
	content: "\0203A";
	font-weight: bold;
	font-size: 200%;
	top: -7%;
}

.fc-icon-left-double-arrow:after {
	content: "\000AB";
	font-size: 160%;
	top: -7%;
}

.fc-icon-right-double-arrow:after {
	content: "\000BB";
	font-size: 160%;
	top: -7%;
}

.fc-icon-left-triangle:after {
	content: "\25C4";
	font-size: 125%;
	top: 3%;
}

.fc-icon-right-triangle:after {
	content: "\25BA";
	font-size: 125%;
	top: 3%;
}

.fc-icon-down-triangle:after {
	content: "\25BC";
	font-size: 125%;
	top: 2%;
}

.fc-icon-x:after {
	content: "\000D7";
	font-size: 200%;
	top: 6%;
}


/* Buttons (styled <button> tags, normalized to work cross-browser)
--------------------------------------------------------------------------------------------------*/

.fc button {
	/* force height to include the border and padding */
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;

	/* dimensions */
	margin: 0;
	height: 2.1em;
	padding: 0 .6em;

	/* text & cursor */
	font-size: 1em; /* normalize */
	white-space: nowrap;
	cursor: pointer;
}

/* Firefox has an annoying inner border */
.fc button::-moz-focus-inner { margin: 0; padding: 0; }
	
.fc-state-default { /* non-theme */
	border: 1px solid;
}

.fc-state-default.fc-corner-left { /* non-theme */
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.fc-state-default.fc-corner-right { /* non-theme */
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

/* icons in buttons */

.fc button .fc-icon { /* non-theme */
	position: relative;
	top: -0.05em; /* seems to be a good adjustment across browsers */
	margin: 0 .2em;
	vertical-align: middle;
}
	
/*
  button states
  borrowed from twitter bootstrap (http://twitter.github.com/bootstrap/)
*/

.fc-state-default {
	background-color: #f5f5f5;
	background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
	background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
	background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
	background-repeat: repeat-x;
	border-color: #e6e6e6 #e6e6e6 #bfbfbf;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	color: #333;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fc-state-hover,
.fc-state-down,
.fc-state-active,
.fc-state-disabled {
	color: #333333;
	background-color: #e6e6e6;
}

.fc-state-hover {
	color: #333333;
	text-decoration: none;
	background-position: 0 -15px;
	-webkit-transition: background-position 0.1s linear;
	   -moz-transition: background-position 0.1s linear;
	     -o-transition: background-position 0.1s linear;
	        transition: background-position 0.1s linear;
}

.fc-state-down,
.fc-state-active {
	background-color: #cccccc;
	background-image: none;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fc-state-disabled {
	cursor: default;
	background-image: none;
	opacity: 0.65;
	box-shadow: none;
}


/* Buttons Groups
--------------------------------------------------------------------------------------------------*/

.fc-button-group {
	display: inline-block;
}

/*
every button that is not first in a button group should scootch over one pixel and cover the
previous button's border...
*/

.fc .fc-button-group > * { /* extra precedence b/c buttons have margin set to zero */
	float: left;
	margin: 0 0 0 -1px;
}

.fc .fc-button-group > :first-child { /* same */
	margin-left: 0;
}


/* Popover
--------------------------------------------------------------------------------------------------*/

.fc-popover {
	position: absolute;
	box-shadow: 0 2px 6px rgba(0,0,0,.15);
}

.fc-popover .fc-header { /* TODO: be more consistent with fc-head/fc-body */
	padding: 2px 4px;
}

.fc-popover .fc-header .fc-title {
	margin: 0 2px;
}

.fc-popover .fc-header .fc-close {
	cursor: pointer;
}

.fc-ltr .fc-popover .fc-header .fc-title,
.fc-rtl .fc-popover .fc-header .fc-close {
	float: left;
}

.fc-rtl .fc-popover .fc-header .fc-title,
.fc-ltr .fc-popover .fc-header .fc-close {
	float: right;
}

/* unthemed */

.fc-unthemed .fc-popover {
	border-width: 1px;
	border-style: solid;
}

.fc-unthemed .fc-popover .fc-header .fc-close {
	font-size: .9em;
	margin-top: 2px;
}

/* jqui themed */

.fc-popover > .ui-widget-header + .ui-widget-content {
	border-top: 0; /* where they meet, let the header have the border */
}


/* Misc Reusable Components
--------------------------------------------------------------------------------------------------*/

.fc-divider {
	border-style: solid;
	border-width: 1px;
}

hr.fc-divider {
	height: 0;
	margin: 0;
	padding: 0 0 2px; /* height is unreliable across browsers, so use padding */
	border-width: 1px 0;
}

.fc-clear {
	clear: both;
}

.fc-bg,
.fc-bgevent-skeleton,
.fc-highlight-skeleton,
.fc-helper-skeleton {
	/* these element should always cling to top-left/right corners */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.fc-bg {
	bottom: 0; /* strech bg to bottom edge */
}

.fc-bg table {
	height: 100%; /* strech bg to bottom edge */
}


/* Tables
--------------------------------------------------------------------------------------------------*/

.fc table {
	width: 100%;
	box-sizing: border-box; /* fix scrollbar issue in firefox */
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 1em; /* normalize cross-browser */
}

.fc th {
	text-align: center;
}

.fc th,
.fc td {
	border-style: solid;
	border-width: 1px;
	padding: 0;
	vertical-align: top;
}

.fc td.fc-today {
	border-style: double; /* overcome neighboring borders */
}


/* Internal Nav Links
--------------------------------------------------------------------------------------------------*/

a[data-goto] {
	cursor: pointer;
}

a[data-goto]:hover {
	text-decoration: underline;
}


/* Fake Table Rows
--------------------------------------------------------------------------------------------------*/

.fc .fc-row { /* extra precedence to overcome themes w/ .ui-widget-content forcing a 1px border */
	/* no visible border by default. but make available if need be (scrollbar width compensation) */
	border-style: solid;
	border-width: 0;
}

.fc-row table {
	/* don't put left/right border on anything within a fake row.
	   the outer tbody will worry about this */
	border-left: 0 hidden transparent;
	border-right: 0 hidden transparent;

	/* no bottom borders on rows */
	border-bottom: 0 hidden transparent; 
}

.fc-row:first-child table {
	border-top: 0 hidden transparent; /* no top border on first row */
}


/* Day Row (used within the header and the DayGrid)
--------------------------------------------------------------------------------------------------*/

.fc-row {
	position: relative;
}

.fc-row .fc-bg {
	z-index: 1;
}

/* highlighting cells & background event skeleton */

.fc-row .fc-bgevent-skeleton,
.fc-row .fc-highlight-skeleton {
	bottom: 0; /* stretch skeleton to bottom of row */
}

.fc-row .fc-bgevent-skeleton table,
.fc-row .fc-highlight-skeleton table {
	height: 100%; /* stretch skeleton to bottom of row */
}

.fc-row .fc-highlight-skeleton td,
.fc-row .fc-bgevent-skeleton td {
	border-color: transparent;
}

.fc-row .fc-bgevent-skeleton {
	z-index: 2;

}

.fc-row .fc-highlight-skeleton {
	z-index: 3;
}

/*
row content (which contains day/week numbers and events) as well as "helper" (which contains
temporary rendered events).
*/

.fc-row .fc-content-skeleton {
	position: relative;
	z-index: 4;
	padding-bottom: 2px; /* matches the space above the events */
}

.fc-row .fc-helper-skeleton {
	z-index: 5;
}

.fc-row .fc-content-skeleton td,
.fc-row .fc-helper-skeleton td {
	/* see-through to the background below */
	background: none; /* in case <td>s are globally styled */
	border-color: transparent;

	/* don't put a border between events and/or the day number */
	border-bottom: 0;
}

.fc-row .fc-content-skeleton tbody td, /* cells with events inside (so NOT the day number cell) */
.fc-row .fc-helper-skeleton tbody td {
	/* don't put a border between event cells */
	border-top: 0;
}


/* Scrolling Container
--------------------------------------------------------------------------------------------------*/

.fc-scroller {
	-webkit-overflow-scrolling: touch;
}

/* TODO: move to agenda/basic */
.fc-scroller > .fc-day-grid,
.fc-scroller > .fc-time-grid {
	position: relative; /* re-scope all positions */
	width: 100%; /* hack to force re-sizing this inner element when scrollbars appear/disappear */
}


/* Global Event Styles
--------------------------------------------------------------------------------------------------*/

.fc-event {
	position: relative; /* for resize handle and other inner positioning */
	display: block; /* make the <a> tag block */
	font-size: .85em;
	line-height: 1.3;
	border-radius: 3px;
	border: 1px solid #3a87ad; /* default BORDER color */
	font-weight: normal; /* undo jqui's ui-widget-header bold */
}

.fc-event,
.fc-event-dot {
	background-color: #3a87ad; /* default BACKGROUND color */
}

/* overpower some of bootstrap's and jqui's styles on <a> tags */
.fc-event,
.fc-event:hover,
.ui-widget .fc-event {
	color: #fff; /* default TEXT color */
	text-decoration: none; /* if <a> has an href */
}

.fc-event[href],
.fc-event.fc-draggable {
	cursor: pointer; /* give events with links and draggable events a hand mouse pointer */
}

.fc-not-allowed, /* causes a "warning" cursor. applied on body */
.fc-not-allowed .fc-event { /* to override an event's custom cursor */
	cursor: not-allowed;
}

.fc-event .fc-bg { /* the generic .fc-bg already does position */
	z-index: 1;
	background: #fff;
	opacity: .25;
}

.fc-event .fc-content {
	position: relative;
	z-index: 2;
}

/* resizer (cursor AND touch devices) */

.fc-event .fc-resizer {
	position: absolute;
	z-index: 4;
}

/* resizer (touch devices) */

.fc-event .fc-resizer {
	display: none;
}

.fc-event.fc-allow-mouse-resize .fc-resizer,
.fc-event.fc-selected .fc-resizer {
	/* only show when hovering or selected (with touch) */
	display: block;
}

/* hit area */

.fc-event.fc-selected .fc-resizer:before {
	/* 40x40 touch area */
	content: "";
	position: absolute;
	z-index: 9999; /* user of this util can scope within a lower z-index */
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	margin-left: -20px;
	margin-top: -20px;
}


/* Event Selection (only for touch devices)
--------------------------------------------------------------------------------------------------*/

.fc-event.fc-selected {
	z-index: 9999 !important; /* overcomes inline z-index */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.fc-event.fc-selected.fc-dragging {
	box-shadow: 0 2px 7px rgba(0, 0, 0, 0.3);
}


/* Horizontal Events
--------------------------------------------------------------------------------------------------*/

/* bigger touch area when selected */
.fc-h-event.fc-selected:before {
	content: "";
	position: absolute;
	z-index: 3; /* below resizers */
	top: -10px;
	bottom: -10px;
	left: 0;
	right: 0;
}

/* events that are continuing to/from another week. kill rounded corners and butt up against edge */

.fc-ltr .fc-h-event.fc-not-start,
.fc-rtl .fc-h-event.fc-not-end {
	margin-left: 0;
	border-left-width: 0;
	padding-left: 1px; /* replace the border with padding */
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.fc-ltr .fc-h-event.fc-not-end,
.fc-rtl .fc-h-event.fc-not-start {
	margin-right: 0;
	border-right-width: 0;
	padding-right: 1px; /* replace the border with padding */
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

/* resizer (cursor AND touch devices) */

/* left resizer  */
.fc-ltr .fc-h-event .fc-start-resizer,
.fc-rtl .fc-h-event .fc-end-resizer {
	cursor: w-resize;
	left: -1px; /* overcome border */
}

/* right resizer */
.fc-ltr .fc-h-event .fc-end-resizer,
.fc-rtl .fc-h-event .fc-start-resizer {
	cursor: e-resize;
	right: -1px; /* overcome border */
}

/* resizer (mouse devices) */

.fc-h-event.fc-allow-mouse-resize .fc-resizer {
	width: 7px;
	top: -1px; /* overcome top border */
	bottom: -1px; /* overcome bottom border */
}

/* resizer (touch devices) */

.fc-h-event.fc-selected .fc-resizer {
	/* 8x8 little dot */
	border-radius: 4px;
	border-width: 1px;
	width: 6px;
	height: 6px;
	border-style: solid;
	border-color: inherit;
	background: #fff;
	/* vertically center */
	top: 50%;
	margin-top: -4px;
}

/* left resizer  */
.fc-ltr .fc-h-event.fc-selected .fc-start-resizer,
.fc-rtl .fc-h-event.fc-selected .fc-end-resizer {
	margin-left: -4px; /* centers the 8x8 dot on the left edge */
}

/* right resizer */
.fc-ltr .fc-h-event.fc-selected .fc-end-resizer,
.fc-rtl .fc-h-event.fc-selected .fc-start-resizer {
	margin-right: -4px; /* centers the 8x8 dot on the right edge */
}


/* DayGrid events
----------------------------------------------------------------------------------------------------
We use the full "fc-day-grid-event" class instead of using descendants because the event won't
be a descendant of the grid when it is being dragged.
*/

.fc-day-grid-event {
	margin: 1px 2px 0; /* spacing between events and edges */
	padding: 0 1px;
}

tr:first-child > td > .fc-day-grid-event {
	margin-top: 2px; /* a little bit more space before the first event */
}

.fc-day-grid-event.fc-selected:after {
	content: "";
	position: absolute;
	z-index: 1; /* same z-index as fc-bg, behind text */
	/* overcome the borders */
	top: -1px;
	right: -1px;
	bottom: -1px;
	left: -1px;
	/* darkening effect */
	background: #000;
	opacity: .25;
}

.fc-day-grid-event .fc-content { /* force events to be one-line tall */
	white-space: nowrap;
	overflow: hidden;
}

.fc-day-grid-event .fc-time {
	font-weight: bold;
}

/* resizer (cursor devices) */

/* left resizer  */
.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer,
.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer {
	margin-left: -2px; /* to the day cell's edge */
}

/* right resizer */
.fc-ltr .fc-day-grid-event.fc-allow-mouse-resize .fc-end-resizer,
.fc-rtl .fc-day-grid-event.fc-allow-mouse-resize .fc-start-resizer {
	margin-right: -2px; /* to the day cell's edge */
}


/* Event Limiting
--------------------------------------------------------------------------------------------------*/

/* "more" link that represents hidden events */

a.fc-more {
	margin: 1px 3px;
	font-size: .85em;
	cursor: pointer;
	text-decoration: none;
}

a.fc-more:hover {
	text-decoration: underline;
}

.fc-limited { /* rows and cells that are hidden because of a "more" link */
	display: none;
}

/* popover that appears when "more" link is clicked */

.fc-day-grid .fc-row {
	z-index: 1; /* make the "more" popover one higher than this */
}

.fc-more-popover {
	z-index: 2;
	width: 220px;
}

.fc-more-popover .fc-event-container {
	padding: 10px;
}


/* Now Indicator
--------------------------------------------------------------------------------------------------*/

.fc-now-indicator {
	position: absolute;
	border: 0 solid red;
}


/* Utilities
--------------------------------------------------------------------------------------------------*/

.fc-unselectable {
	-webkit-user-select: none;
	 -khtml-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}



/* Toolbar
--------------------------------------------------------------------------------------------------*/

.fc-toolbar {
	text-align: center;
}

.fc-toolbar.fc-header-toolbar {
	margin-bottom: 1em;
}

.fc-toolbar.fc-footer-toolbar {
	margin-top: 1em;
}

.fc-toolbar .fc-left {
	float: left;
}

.fc-toolbar .fc-right {
	float: right;
}

.fc-toolbar .fc-center {
	display: inline-block;
}

/* the things within each left/right/center section */
.fc .fc-toolbar > * > * { /* extra precedence to override button border margins */
	float: left;
	margin-left: .75em;
}

/* the first thing within each left/center/right section */
.fc .fc-toolbar > * > :first-child { /* extra precedence to override button border margins */
	margin-left: 0;
}
	
/* title text */

.fc-toolbar h2 {
	margin: 0;
}

/* button layering (for border precedence) */

.fc-toolbar button {
	position: relative;
}

.fc-toolbar .fc-state-hover,
.fc-toolbar .ui-state-hover {
	z-index: 2;
}
	
.fc-toolbar .fc-state-down {
	z-index: 3;
}

.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active {
	z-index: 4;
}

.fc-toolbar button:focus {
	z-index: 5;
}


/* View Structure
--------------------------------------------------------------------------------------------------*/

/* undo twitter bootstrap's box-sizing rules. normalizes positioning techniques */
/* don't do this for the toolbar because we'll want bootstrap to style those buttons as some pt */
.fc-view-container *,
.fc-view-container *:before,
.fc-view-container *:after {
	-webkit-box-sizing: content-box;
	   -moz-box-sizing: content-box;
	        box-sizing: content-box;
}

.fc-view, /* scope positioning and z-index's for everything within the view */
.fc-view > table { /* so dragged elements can be above the view's main element */
	position: relative;
	z-index: 1;
}



/* BasicView
--------------------------------------------------------------------------------------------------*/

/* day row structure */

.fc-basicWeek-view .fc-content-skeleton,
.fc-basicDay-view .fc-content-skeleton {
	/* there may be week numbers in these views, so no padding-top */
	padding-bottom: 1em; /* ensure a space at bottom of cell for user selecting/clicking */
}

.fc-basic-view .fc-body .fc-row {
	min-height: 4em; /* ensure that all rows are at least this tall */
}

/* a "rigid" row will take up a constant amount of height because content-skeleton is absolute */

.fc-row.fc-rigid {
	overflow: hidden;
}

.fc-row.fc-rigid .fc-content-skeleton {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

/* week and day number styling */

.fc-day-top.fc-other-month {
	opacity: 0.3;
}

.fc-basic-view .fc-week-number,
.fc-basic-view .fc-day-number {
	padding: 2px;
}

.fc-basic-view th.fc-week-number,
.fc-basic-view th.fc-day-number {
	padding: 0 2px; /* column headers can't have as much v space */
}

.fc-ltr .fc-basic-view .fc-day-top .fc-day-number { float: right; }
.fc-rtl .fc-basic-view .fc-day-top .fc-day-number { float: left; }

.fc-ltr .fc-basic-view .fc-day-top .fc-week-number { float: left; border-radius: 0 0 3px 0; }
.fc-rtl .fc-basic-view .fc-day-top .fc-week-number { float: right; border-radius: 0 0 0 3px; }

.fc-basic-view .fc-day-top .fc-week-number {
	min-width: 1.5em;
	text-align: center;
	background-color: #f2f2f2;
	color: #808080;
}

/* when week/day number have own column */

.fc-basic-view td.fc-week-number {
	text-align: center;
}

.fc-basic-view td.fc-week-number > * {
	/* work around the way we do column resizing and ensure a minimum width */
	display: inline-block;
	min-width: 1.25em;
}


/* AgendaView all-day area
--------------------------------------------------------------------------------------------------*/

.fc-agenda-view .fc-day-grid {
	position: relative;
	z-index: 2; /* so the "more.." popover will be over the time grid */
}

.fc-agenda-view .fc-day-grid .fc-row {
	min-height: 3em; /* all-day section will never get shorter than this */
}

.fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton {
	padding-bottom: 1em; /* give space underneath events for clicking/selecting days */
}


/* TimeGrid axis running down the side (for both the all-day area and the slot area)
--------------------------------------------------------------------------------------------------*/

.fc .fc-axis { /* .fc to overcome default cell styles */
	vertical-align: middle;
	padding: 0 4px;
	white-space: nowrap;
}

.fc-ltr .fc-axis {
	text-align: right;
}

.fc-rtl .fc-axis {
	text-align: left;
}

.ui-widget td.fc-axis {
	font-weight: normal; /* overcome jqui theme making it bold */
}


/* TimeGrid Structure
--------------------------------------------------------------------------------------------------*/

.fc-time-grid-container, /* so scroll container's z-index is below all-day */
.fc-time-grid { /* so slats/bg/content/etc positions get scoped within here */
	position: relative;
	z-index: 1;
}

.fc-time-grid {
	min-height: 100%; /* so if height setting is 'auto', .fc-bg stretches to fill height */
}

.fc-time-grid table { /* don't put outer borders on slats/bg/content/etc */
	border: 0 hidden transparent;
}

.fc-time-grid > .fc-bg {
	z-index: 1;
}

.fc-time-grid .fc-slats,
.fc-time-grid > hr { /* the <hr> AgendaView injects when grid is shorter than scroller */
	position: relative;
	z-index: 2;
}

.fc-time-grid .fc-content-col {
	position: relative; /* because now-indicator lives directly inside */
}

.fc-time-grid .fc-content-skeleton {
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	right: 0;
}

/* divs within a cell within the fc-content-skeleton */

.fc-time-grid .fc-business-container {
	position: relative;
	z-index: 1;
}

.fc-time-grid .fc-bgevent-container {
	position: relative;
	z-index: 2;
}

.fc-time-grid .fc-highlight-container {
	position: relative;
	z-index: 3;
}

.fc-time-grid .fc-event-container {
	position: relative;
	z-index: 4;
}

.fc-time-grid .fc-now-indicator-line {
	z-index: 5;
}

.fc-time-grid .fc-helper-container { /* also is fc-event-container */
	position: relative;
	z-index: 6;
}


/* TimeGrid Slats (lines that run horizontally)
--------------------------------------------------------------------------------------------------*/

.fc-time-grid .fc-slats td {
	height: 1.5em;
	border-bottom: 0; /* each cell is responsible for its top border */
}

.fc-time-grid .fc-slats .fc-minor td {
	border-top-style: dotted;
}

.fc-time-grid .fc-slats .ui-widget-content { /* for jqui theme */
	background: none; /* see through to fc-bg */
}


/* TimeGrid Highlighting Slots
--------------------------------------------------------------------------------------------------*/

.fc-time-grid .fc-highlight-container { /* a div within a cell within the fc-highlight-skeleton */
	position: relative; /* scopes the left/right of the fc-highlight to be in the column */
}

.fc-time-grid .fc-highlight {
	position: absolute;
	left: 0;
	right: 0;
	/* top and bottom will be in by JS */
}


/* TimeGrid Event Containment
--------------------------------------------------------------------------------------------------*/

.fc-ltr .fc-time-grid .fc-event-container { /* space on the sides of events for LTR (default) */
	margin: 0 2.5% 0 2px;
}

.fc-rtl .fc-time-grid .fc-event-container { /* space on the sides of events for RTL */
	margin: 0 2px 0 2.5%;
}

.fc-time-grid .fc-event,
.fc-time-grid .fc-bgevent {
	position: absolute;
	z-index: 1; /* scope inner z-index's */
}

.fc-time-grid .fc-bgevent {
	/* background events always span full width */
	left: 0;
	right: 0;
}


/* Generic Vertical Event
--------------------------------------------------------------------------------------------------*/

.fc-v-event.fc-not-start { /* events that are continuing from another day */
	/* replace space made by the top border with padding */
	border-top-width: 0;
	padding-top: 1px;

	/* remove top rounded corners */
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.fc-v-event.fc-not-end {
	/* replace space made by the top border with padding */
	border-bottom-width: 0;
	padding-bottom: 1px;

	/* remove bottom rounded corners */
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}


/* TimeGrid Event Styling
----------------------------------------------------------------------------------------------------
We use the full "fc-time-grid-event" class instead of using descendants because the event won't
be a descendant of the grid when it is being dragged.
*/

.fc-time-grid-event {
	overflow: hidden; /* don't let the bg flow over rounded corners */
}

.fc-time-grid-event.fc-selected {
	/* need to allow touch resizers to extend outside event's bounding box */
	/* common fc-selected styles hide the fc-bg, so don't need this anyway */
	overflow: visible;
}

.fc-time-grid-event.fc-selected .fc-bg {
	display: none; /* hide semi-white background, to appear darker */
}

.fc-time-grid-event .fc-content {
	overflow: hidden; /* for when .fc-selected */
}

.fc-time-grid-event .fc-time,
.fc-time-grid-event .fc-title {
	padding: 0 1px;
}

.fc-time-grid-event .fc-time {
	font-size: .85em;
	white-space: nowrap;
}

/* short mode, where time and title are on the same line */

.fc-time-grid-event.fc-short .fc-content {
	/* don't wrap to second line (now that contents will be inline) */
	white-space: nowrap;
}

.fc-time-grid-event.fc-short .fc-time,
.fc-time-grid-event.fc-short .fc-title {
	/* put the time and title on the same line */
	display: inline-block;
	vertical-align: top;
}

.fc-time-grid-event.fc-short .fc-time span {
	display: none; /* don't display the full time text... */
}

.fc-time-grid-event.fc-short .fc-time:before {
	content: attr(data-start); /* ...instead, display only the start time */
}

.fc-time-grid-event.fc-short .fc-time:after {
	content: "\000A0-\000A0"; /* seperate with a dash, wrapped in nbsp's */
}

.fc-time-grid-event.fc-short .fc-title {
	font-size: .85em; /* make the title text the same size as the time */
	padding: 0; /* undo padding from above */
}

/* resizer (cursor device) */

.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer {
	left: 0;
	right: 0;
	bottom: 0;
	height: 8px;
	overflow: hidden;
	line-height: 8px;
	font-size: 11px;
	font-family: monospace;
	text-align: center;
	cursor: s-resize;
}

.fc-time-grid-event.fc-allow-mouse-resize .fc-resizer:after {
	content: "=";
}

/* resizer (touch device) */

.fc-time-grid-event.fc-selected .fc-resizer {
	/* 10x10 dot */
	border-radius: 5px;
	border-width: 1px;
	width: 8px;
	height: 8px;
	border-style: solid;
	border-color: inherit;
	background: #fff;
	/* horizontally center */
	left: 50%;
	margin-left: -5px;
	/* center on the bottom edge */
	bottom: -5px;
}


/* Now Indicator
--------------------------------------------------------------------------------------------------*/

.fc-time-grid .fc-now-indicator-line {
	border-top-width: 1px;
	left: 0;
	right: 0;
}

/* arrow on axis */

.fc-time-grid .fc-now-indicator-arrow {
	margin-top: -5px; /* vertically center on top coordinate */
}

.fc-ltr .fc-time-grid .fc-now-indicator-arrow {
	left: 0;
	/* triangle pointing right... */
	border-width: 5px 0 5px 6px;
	border-top-color: transparent;
	border-bottom-color: transparent;
}

.fc-rtl .fc-time-grid .fc-now-indicator-arrow {
	right: 0;
	/* triangle pointing left... */
	border-width: 5px 6px 5px 0;
	border-top-color: transparent;
	border-bottom-color: transparent;
}



/* List View
--------------------------------------------------------------------------------------------------*/

/* possibly reusable */

.fc-event-dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 5px;
}

/* view wrapper */

.fc-rtl .fc-list-view {
	direction: rtl; /* unlike core views, leverage browser RTL */
}

.fc-list-view {
	border-width: 1px;
	border-style: solid;
}

/* table resets */

.fc .fc-list-table {
	table-layout: auto; /* for shrinkwrapping cell content */
}

.fc-list-table td {
	border-width: 1px 0 0;
	padding: 8px 14px;
}

.fc-list-table tr:first-child td {
	border-top-width: 0;
}

/* day headings with the list */

.fc-list-heading {
	border-bottom-width: 1px;
}

.fc-list-heading td {
	font-weight: bold;
}

.fc-ltr .fc-list-heading-main { float: left; }
.fc-ltr .fc-list-heading-alt { float: right; }

.fc-rtl .fc-list-heading-main { float: right; }
.fc-rtl .fc-list-heading-alt { float: left; }

/* event list items */

.fc-list-item.fc-has-url {
	cursor: pointer; /* whole row will be clickable */
}

.fc-list-item:hover td {
	background-color: #f5f5f5;
}

.fc-list-item-marker,
.fc-list-item-time {
	white-space: nowrap;
	width: 1px;
}

/* make the dot closer to the event title */
.fc-ltr .fc-list-item-marker { padding-right: 0; }
.fc-rtl .fc-list-item-marker { padding-left: 0; }

.fc-list-item-title a {
	/* every event title cell has an <a> tag */
	text-decoration: none;
	color: inherit;
}

.fc-list-item-title a[href]:hover {
	/* hover effect only on titles with hrefs */
	text-decoration: underline;
}

/* message when no events */

.fc-list-empty-wrap2 {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.fc-list-empty-wrap1 {
	width: 100%;
	height: 100%;
	display: table;
}

.fc-list-empty {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

.fc-unthemed .fc-list-empty { /* theme will provide own background */
	background-color: #eee;
}
.flex-row {
    display: flex;
}

.wrap {
    flex-wrap: wrap;
}

.flex-col {
    display: flex;
    flex-flow: column;
}

.stretch {
    flex: 1 1 auto;
    min-height: 0;
}

.full {
    position: absolute;
    left: 0;
    right: 0;
    top: 0px;
    bottom: 0;
}

.undo-bar {
    position: absolute;
    left: 10px;
    top: 40px;
    right: 0;
    pointer-events: none;
}

.undo-bar button {
    pointer-events: auto;
}

.toolbar {
    background: #eee;
}

zwibbler button, [z-popup] button {
    border: none;
    border-radius: 5px;
    margin: 5px;
    border: none;
    padding: 0;
    flex: 0 0 auto;
    background: transparent;
}

zwibbler button img {
    width: 40px;
    padding: 10px;
}

.show-toolbar {
    display: none;
}

.hide-toolbar {
    display: initial;
}

.blue-text {
    color: #8cc1e0;
}

[z-canvas]:focus {
    outline: none;
}

.top-bar {
    font-family: sans-serif;
    font-size: 25px;
    padding: 5px;
    box-shadow: 0 2px 3px rgba(0,0,0,0.2);
}

.pen-bar {
    position: absolute;
    overflow: hidden;
    justify-content: center;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
}

.keyboard-shown .pen-bar, .keyboard-shown .pages-button {
    visibility: hidden;
}

.pen-bar.hidden {
    display: none;
}

.pen-bar img {
    margin: 0 15px;
    height: 120px;
    position: relative;
    bottom: -30px;
    transition: bottom 200ms;
    pointer-events: auto;
    filter: grayscale(100%);
}

.pen-bar > div {
    position: relative;
}

.pen-bar .pen-color {
    position: absolute;
    bottom: 0;
    height: 20px;
    width: 30px;
    left: 16px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    box-shadow: 0 0 5px rgba(255,255,255,1.0);
}

@media screen and (max-height: 700px) {
    .pen-bar img {
        height: 80px;
    }

    .pen-bar .pen-color {
        left: 11px;
    }
}

.pen-bar img.selected {
    bottom: 0;
}

.fader {
    position: absolute;
    height: 20px;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to bottom, transparent, white);
    pointer-events: none;
}

.colour-bar {
    position: absolute;
    left: 0;
    top: 70px;
    margin-left: -9px;
}


.faded {
    opacity: 0.3;
}

.no-select {
    -webkit-user-select: none;
    user-select: none;
}

.right-bar {
    position: absolute;
    justify-content: center;
    display: flex;
    flex-flow: column nowrap;
    top: 0;
    right: 20px;
    bottom: 0;
    pointer-events:none;
}

zwibbler .right-bar button {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin: 10px 0 10px 10px;
    box-shadow: 0 0 3px rgba(0,0,0,0.2);
    background: white;
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    pointer-events: auto;
}

zwibbler .right-bar button.selected {
    background: #52c8e6;
}

.right-bar button img {
    max-width: 90%;
    max-height: 90%;
    height: auto;
    width: auto;
}

.horizontal-popup {
    box-shadow: 0 0 3px rgba(0,0,0,0.2);
    display: flex;
    flex-flow: row nowrap;
    border-radius: 25px;
    height: 50px;
    background: white;
    justify-content: center;
}

.horizontal-popup button {
    width: 50px;
    margin: 5px 10px;
}

.horizontal-popup img {
    width: auto;
    height: 40px;
    padding: 0;
}

.vertical-text-options{
    box-shadow: 0 0 3px rgba(0,0,0,0.2);
    display: flex;
    flex-flow: column nowrap;
    background: white;
    justify-content: center;
}

.vertical-text-options button {
    width: -webkit-fill-available !important;
    padding: 5px;
    font-size: 12px;
    margin: 0;
    border-radius: 0;
    line-height: 2em;
}

.vertical-text-options:after{
    content: '';
    width: 15px;
    height: 15px;
    border-bottom: 1px solid #e4e5ed;
    border-right: 1px solid #e4e5ed;
    position: absolute;
    transform: rotate(45deg);
    bottom: -9px;
    background: #fff;
    left: 20%;
    left: 0;
    right: 0;
    margin: auto;
}

.vertical-text-options button:not(:last-child) {
    border-bottom: 1px solid rgba(0,0,0,0.2);
}

.shape-popup {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 50%;
    border-top-left-radius: 30px;
    box-shadow: 0 0 4px rgba(0,0,0,0.4);
    background: white;
}

.shape-popup .inside-shape-scroll {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-flow: row wrap;
    overflow-y: scroll;
    justify-content: flex-start;
    align-items: flex-start;
    overflow-y: scroll;
}

.shape-popup img {
    margin: 20px;
    width: 80px;
}

.overlay {
    background-color: rgba(0,0,0,0.3);
}

.shape-popup .swatch {
    width: 60px;
    height: 60px;
    border: 5px solid #c2c8d2;
    margin: 15px;
    border-radius: 50%;
}

.shape-popup input[type="text"] {
    font-size: 30px;
    border: none;
    border-bottom: 1px solid black;
}

.recording-overlay {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    text-align: center;
    font-family: "sans-serif";
    font-size: 30px;
    color: white;
    font-weight: bold;
    align-items: center;
}

.recording-overlay div {
    margin: 30px;
}

.blue-button {
    background: #52c8e6;
    color: white;
    font-family: sans-serif;
    font-weight: bold;
    padding: 10px;
    border-radius: 25px;
    margin: 10px;
    pointer-events: auto;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}

.red-button {
    background: #d93c1e;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}


.context-menu, .text-style {
    box-shadow: 0 0 3px rgba(0,0,0,0.3);
    font-family: sans-serif;
    font-size: 15px;
    background: white;
}

.context-menu > div {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    padding: 5px 10px;
    cursor: pointer;
}


.context-menu > div:hover {
    color: #52c8e6;
}

.context-menu img {
    max-width: 30px;
    max-height: 30px;
    margin-right: 10px;
}

.text-style {
    max-width: 300px;
    padding: 10px;
}

.text-style  button{
    border-radius: 50%;
    border: 2px solid #444;
    border-radius: 20px;
    line-height: 0;
    padding: 15px;
    font-size: 20px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
}

.text-style button img {
    max-height: 20px;
}

.text-style button.selected {
    border-color: black;
}

.pages-button {
    position: absolute;
    top: 20px;
    right: 20px;
    height: 30px;
    border-radius: 25px;
    background: white;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    padding: 10px;
    font-weight: bold;
    color: black;
    font-family: sans-serif;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    cursor: pointer;
}

.pages-button img {
    max-width: 30px;
    margin: 0 5px;
}

.page-selector {
    background: #f2f2f2;
    width: 120px;
}

.add-page-button {
    height: 50px;
    background: #f2f2f2;
    text-align: center;
    border: 2px solid black;
    cursor: pointer;
    background: #ccc;
}

.add-page-button:hover {
    background: #eee;
}

.add-page-button img {
    width: 40px;
}

.page {
    flex: 0 1 auto;
    margin: 10px;
    align-items: center;
    font-family: sans-serif;
    font-size: 11px;
    position: relative;
}

.page-close-button {
    position: absolute;
    right: -7px;
    top: -7px;
    border-radius: 50%;
    background: #ccc;
    padding: 5px;
    font-size: 15px;
    font-weight: bold;
    width: 15px;
    height: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: default;
}

.page-close-button:hover {
    background: #eee;
}

[z-page] {
   border-radius: 5px;
   border: 2px solid white;
}

[z-page].selected {
    border: 2px solid #92c0e1;
}

.page-scroller {
    display: flex;
    flex-flow: column nowrap;
    overflow-y: scroll;
    align-items: center;
    overflow-x: hidden;
}

.hidden {
    display: none;
}

.record-buttons {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
}

.record-buttons button {
    font-size: 30px;
    padding: 20px;
    flex: 1 1 auto;
}

.fullscreen.selected {
    background: #92c0e1;
}

/** things relating to video-pages */
.page-video-holder {
    position: relative;
}

.page-video {
    min-height: 0;
}

.text-style-buttons img {
    margin: 10px;
    max-width: 60px;
}

.text-align-buttons button {
    margin: 10px;
}

.prompt {
    background: white;
    border-radius: 5px;
    padding: 20px;
    box-shadow: 0 0 3px rgba(0,0,0,0.5);
    text-align: center;
    font-family: sans-serif;
}

.prompt button {
    background: #ccc;
    padding: 5px;
    margin-top: 20px;
}

.hint-text {
    position: absolute;
    left: 64px;
    top: 50px;
}

@keyframes flashing {
    0% {opacity: 1.0;}
    50% {opacity: 0.0;}
    100% {opacity: 1.0;}
}

.flashing {
    animation-name: flashing;
    animation-duration: 1.0s;
    animation-iteration-count: infinite;
}


.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}/*!
 * froala_editor v4.2.0 (https://www.froala.com/wysiwyg-editor)
 * License https://froala.com/wysiwyg-editor/terms/
 * Copyright 2014-2024 Froala Labs
 */

.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-element,.fr-element:focus{outline:0 solid transparent}.fr-view.fr-element-scroll-visible{overflow-x:visible !important}.fr-box.fr-basic{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-basic .fr-element{font-family:sans-serif;color:#414141;font-size:14px;line-height:1.6;padding:20px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow-x:auto;min-height:60px;text-align:left}.fr-box.fr-basic.fr-rtl .fr-element{text-align:right}.fr-element{background:transparent;position:relative;z-index:2;-webkit-user-select:auto}.fr-element a{user-select:auto;-o-user-select:auto;-moz-user-select:auto;-khtml-user-select:auto;-webkit-user-select:auto;-ms-user-select:auto}.fr-element.fr-disabled{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-element [contenteditable="true"]{outline:0 solid transparent}.fr-box a.fr-floating-btn{-webkit-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;height:40px;width:40px;text-align:center;background:#FFF;color:#333333;-webkit-transition:background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;-moz-transition:background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;-ms-transition:background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;-o-transition:background 0.2s ease 0s, color 0.2s ease 0s, transform 0.2s ease 0s;outline:none;left:0;top:0;line-height:40px;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);text-align:center;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:none}.fr-box a.fr-floating-btn svg{-webkit-transition:transform 0.2s ease 0s;-moz-transition:transform 0.2s ease 0s;-ms-transition:transform 0.2s ease 0s;-o-transition:transform 0.2s ease 0s;fill:#333333}.fr-box a.fr-floating-btn i,.fr-box a.fr-floating-btn svg{font-size:14px;line-height:40px}.fr-box a.fr-floating-btn.fr-btn+.fr-btn{margin-left:10px}.fr-box a.fr-floating-btn:hover{background:#ebebeb;cursor:pointer}.fr-box a.fr-floating-btn:hover svg{fill:#333333}.fr-box .fr-visible a.fr-floating-btn{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1)}iframe.fr-iframe{width:100%;border:none;position:relative;display:block;z-index:2;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-wrapper{position:relative;z-index:1}.fr-wrapper::after{clear:both;display:block;content:"";height:0}.fr-wrapper .fr-placeholder{position:absolute;font-size:14px;color:#AAA;font-family:sans-serif;z-index:1;display:none;top:0;left:0;right:0;overflow:hidden}.fr-wrapper.show-placeholder .fr-placeholder{display:block;white-space:nowrap;text-overflow:ellipsis}.fr-wrapper ::-moz-selection{background:rgba(181,214,253,0.8);color:#000}.fr-wrapper ::selection{background:rgba(181,214,253,0.8);color:#000}.fr-box.fr-basic .fr-wrapper{background:#FFF;border:1px solid #CCCCCC;border-bottom-color:#efefef;top:0;left:0}.fr-box.fr-basic.fr-top .fr-wrapper{border-top:0}.fr-box.fr-basic.fr-bottom .fr-wrapper{border-bottom:0;border-radius:10px 10px 0 0;-moz-border-radius:10px 10px 0 0;-webkit-border-radius:10px 10px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}@media (min-width: 992px){.fr-box.fr-document{min-width:21cm}.fr-box.fr-document .fr-wrapper{text-align:left;padding:30px;min-width:21cm;background:#efefef}.fr-box.fr-document .fr-wrapper .fr-element{text-align:left;background:#FFF;width:21cm;margin:auto;min-height:26cm !important;padding:1cm 2cm;overflow:visible;z-index:auto}.fr-box.fr-document .fr-wrapper .fr-element hr{margin-left:-2cm;margin-right:-2cm;background:#efefef;height:1cm;outline:none;border:none}.fr-box.fr-document .fr-wrapper .fr-element img{z-index:1}}.fr-tooltip{position:absolute;top:0;left:0;padding:0 8px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background:#222222;color:#FFF;font-size:11px;line-height:22px;font-family:Arial, Helvetica, sans-serif;-webkit-transition:opacity 0.2s ease 0s;-moz-transition:opacity 0.2s ease 0s;-ms-transition:opacity 0.2s ease 0s;-o-transition:opacity 0.2s ease 0s;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";left:-3000px;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;z-index:2147483647;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fr-tooltip.fr-visible{-webkit-opacity:1;-moz-opacity:1;opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-toolbar .fr-btn-wrap,.fr-popup .fr-btn-wrap,.fr-modal .fr-btn-wrap{float:left;white-space:nowrap;position:relative}.fr-toolbar .fr-btn-wrap.fr-hidden,.fr-popup .fr-btn-wrap.fr-hidden,.fr-modal .fr-btn-wrap.fr-hidden{display:none}.fr-toolbar .fr-command.fr-btn,.fr-popup .fr-command.fr-btn,.fr-modal .fr-command.fr-btn{background:transparent;color:#333333;-moz-outline:0;outline:none;border:0;line-height:1;cursor:pointer;text-align:left;margin:4px 2px;padding:0;-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;z-index:2;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-decoration:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;float:left;height:40px}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-options,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-options,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-options{border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;-webkit-border-radius:0 4px 4px 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar .fr-command.fr-btn.fr-btn-hover,.fr-popup .fr-command.fr-btn.fr-btn-hover,.fr-modal .fr-command.fr-btn.fr-btn-hover{border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;-webkit-border-radius:4px 0 0 4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar .fr-command.fr-btn::-moz-focus-inner,.fr-popup .fr-command.fr-btn::-moz-focus-inner,.fr-modal .fr-command.fr-btn::-moz-focus-inner{border:0;padding:0}.fr-toolbar .fr-command.fr-btn.fr-btn-text,.fr-popup .fr-command.fr-btn.fr-btn-text,.fr-modal .fr-command.fr-btn.fr-btn-text{width:auto}.fr-toolbar .fr-command.fr-btn i,.fr-toolbar .fr-command.fr-btn svg,.fr-popup .fr-command.fr-btn i,.fr-popup .fr-command.fr-btn svg,.fr-modal .fr-command.fr-btn i,.fr-modal .fr-command.fr-btn svg{display:block;text-align:center;float:none;margin:8px 7px;width:24px}.fr-toolbar .fr-command.fr-btn svg.fr-svg,.fr-popup .fr-command.fr-btn svg.fr-svg,.fr-modal .fr-command.fr-btn svg.fr-svg{height:24px}.fr-toolbar .fr-command.fr-btn svg path,.fr-popup .fr-command.fr-btn svg path,.fr-modal .fr-command.fr-btn svg path{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;fill:#333333}.fr-toolbar .fr-command.fr-btn span.fr-sr-only,.fr-popup .fr-command.fr-btn span.fr-sr-only,.fr-modal .fr-command.fr-btn span.fr-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-toolbar .fr-command.fr-btn span,.fr-popup .fr-command.fr-btn span,.fr-modal .fr-command.fr-btn span{font-size:14px;display:block;line-height:17px;min-width:30px;float:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;height:17px;font-weight:bold;padding:0 4px}.fr-toolbar .fr-command.fr-btn img,.fr-popup .fr-command.fr-btn img,.fr-modal .fr-command.fr-btn img{margin:8px 7px;width:24px}.fr-toolbar .fr-command.fr-btn.fr-btn-active-popup,.fr-popup .fr-command.fr-btn.fr-btn-active-popup,.fr-modal .fr-command.fr-btn.fr-btn-active-popup{background:#d6d6d6}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-selection span,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-selection span,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-selection span{font-weight:normal}.fr-toolbar .fr-command.fr-btn.fr-dropdown i,.fr-toolbar .fr-command.fr-btn.fr-dropdown span,.fr-toolbar .fr-command.fr-btn.fr-dropdown img,.fr-toolbar .fr-command.fr-btn.fr-dropdown svg,.fr-popup .fr-command.fr-btn.fr-dropdown i,.fr-popup .fr-command.fr-btn.fr-dropdown span,.fr-popup .fr-command.fr-btn.fr-dropdown img,.fr-popup .fr-command.fr-btn.fr-dropdown svg,.fr-modal .fr-command.fr-btn.fr-dropdown i,.fr-modal .fr-command.fr-btn.fr-dropdown span,.fr-modal .fr-command.fr-btn.fr-dropdown img,.fr-modal .fr-command.fr-btn.fr-dropdown svg{margin-left:3px;margin-right:11px}.fr-toolbar .fr-command.fr-btn.fr-dropdown:after,.fr-popup .fr-command.fr-btn.fr-dropdown:after,.fr-modal .fr-command.fr-btn.fr-dropdown:after{position:absolute;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid #333333;right:2px;top:18px;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;content:""}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-active{fill:#333333;background:#d6d6d6;-webkit-transition:0.5s ease;-moz-transition:0.5s ease;-ms-transition:0.5s ease;-o-transition:0.5s ease}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:hover,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:hover,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-active:hover{background:#ebebeb;fill:#333333}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:hover::after,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:hover::after,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-active:hover::after{border-top-color:#333333}.fr-toolbar .fr-command.fr-btn.fr-dropdown.fr-active:after,.fr-popup .fr-command.fr-btn.fr-dropdown.fr-active:after,.fr-modal .fr-command.fr-btn.fr-dropdown.fr-active:after{border-top:0;border-bottom:4px solid #222222}.fr-toolbar .fr-command.fr-btn.fr-disabled,.fr-popup .fr-command.fr-btn.fr-disabled,.fr-modal .fr-command.fr-btn.fr-disabled{color:#bdbdbd;cursor:default;-webkit-opacity:0.3;-moz-opacity:0.3;opacity:0.3;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-toolbar .fr-command.fr-btn.fr-disabled::after,.fr-popup .fr-command.fr-btn.fr-disabled::after,.fr-modal .fr-command.fr-btn.fr-disabled::after{border-top-color:#bdbdbd}.fr-toolbar .fr-command.fr-btn.fr-hidden,.fr-popup .fr-command.fr-btn.fr-hidden,.fr-modal .fr-command.fr-btn.fr-hidden{display:none}.fr-toolbar .fr-tabs .fr-command.fr-btn,.fr-popup .fr-tabs .fr-command.fr-btn,.fr-modal .fr-tabs .fr-command.fr-btn{margin:0;width:46px;height:40px;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active,.fr-toolbar .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active-tab,.fr-popup .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active,.fr-popup .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active-tab,.fr-modal .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active,.fr-modal .fr-tabs .fr-command.fr-btn:not(:hover):not(:focus).fr-active-tab{background:#FFF}.fr-toolbar .fr-tabs .fr-command.fr-btn span,.fr-popup .fr-tabs .fr-command.fr-btn span,.fr-modal .fr-tabs .fr-command.fr-btn span{height:27px}.fr-toolbar .fr-tabs .fr-command.fr-btn img,.fr-toolbar .fr-tabs .fr-command.fr-btn svg,.fr-popup .fr-tabs .fr-command.fr-btn img,.fr-popup .fr-tabs .fr-command.fr-btn svg,.fr-modal .fr-tabs .fr-command.fr-btn img,.fr-modal .fr-tabs .fr-command.fr-btn svg{margin:8px 11px;width:24px;height:24px}.fr-toolbar .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-toolbar .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-toolbar .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-popup .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-popup .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-popup .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-modal .fr-btn-grp .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-modal .fr-more-toolbar .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path,.fr-modal .fr-buttons:not(.fr-tabs) .fr-command.fr-btn.fr-active:not(.fr-dropdown) svg path{fill:#0098f7}.fr-toolbar.fr-disabled .fr-btn,.fr-toolbar.fr-disabled .fr-btn.fr-active,.fr-popup.fr-disabled .fr-btn,.fr-popup.fr-disabled .fr-btn.fr-active,.fr-modal.fr-disabled .fr-btn,.fr-modal.fr-disabled .fr-btn.fr-active{color:#bdbdbd;-webkit-opacity:0.3;-moz-opacity:0.3;opacity:0.3;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-toolbar.fr-disabled .fr-btn.fr-dropdown::after,.fr-toolbar.fr-disabled .fr-btn.fr-active.fr-dropdown::after,.fr-popup.fr-disabled .fr-btn.fr-dropdown::after,.fr-popup.fr-disabled .fr-btn.fr-active.fr-dropdown::after,.fr-modal.fr-disabled .fr-btn.fr-dropdown::after,.fr-modal.fr-disabled .fr-btn.fr-active.fr-dropdown::after{border-top-color:#bdbdbd}.fr-toolbar.fr-rtl .fr-btn-grp.fr-float-left,.fr-popup.fr-rtl .fr-btn-grp.fr-float-left,.fr-modal.fr-rtl .fr-btn-grp.fr-float-left{float:right}.fr-toolbar.fr-rtl .fr-btn-grp.fr-float-right,.fr-popup.fr-rtl .fr-btn-grp.fr-float-right,.fr-modal.fr-rtl .fr-btn-grp.fr-float-right{float:left}.fr-toolbar.fr-rtl .fr-command.fr-btn,.fr-toolbar.fr-rtl .fr-btn-wrap,.fr-popup.fr-rtl .fr-command.fr-btn,.fr-popup.fr-rtl .fr-btn-wrap,.fr-modal.fr-rtl .fr-command.fr-btn,.fr-modal.fr-rtl .fr-btn-wrap{float:right}.fr-toolbar.fr-rtl .fr-command.fr-btn.fr-dropdown.fr-options,.fr-toolbar.fr-rtl .fr-btn-wrap.fr-dropdown.fr-options,.fr-popup.fr-rtl .fr-command.fr-btn.fr-dropdown.fr-options,.fr-popup.fr-rtl .fr-btn-wrap.fr-dropdown.fr-options,.fr-modal.fr-rtl .fr-command.fr-btn.fr-dropdown.fr-options,.fr-modal.fr-rtl .fr-btn-wrap.fr-dropdown.fr-options{border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;-webkit-border-radius:4px 0 0 4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-rtl .fr-command.fr-btn.fr-btn-hover,.fr-toolbar.fr-rtl .fr-btn-wrap.fr-btn-hover,.fr-popup.fr-rtl .fr-command.fr-btn.fr-btn-hover,.fr-popup.fr-rtl .fr-btn-wrap.fr-btn-hover,.fr-modal.fr-rtl .fr-command.fr-btn.fr-btn-hover,.fr-modal.fr-rtl .fr-btn-wrap.fr-btn-hover{border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;-webkit-border-radius:0 4px 4px 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-inline>.fr-command.fr-btn:not(.fr-hidden),.fr-toolbar.fr-inline>.fr-btn-wrap:not(.fr-hidden){display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;float:none}.fr-desktop .fr-command:hover,.fr-desktop .fr-command:focus,.fr-desktop .fr-command.fr-btn-hover,.fr-desktop .fr-command.fr-expanded{outline:0;color:#333333}.fr-desktop .fr-command:hover:not(.fr-table-cell),.fr-desktop .fr-command:focus:not(.fr-table-cell),.fr-desktop .fr-command.fr-btn-hover:not(.fr-table-cell),.fr-desktop .fr-command.fr-expanded:not(.fr-table-cell){background:#ebebeb}.fr-desktop .fr-command:hover::after,.fr-desktop .fr-command:focus::after,.fr-desktop .fr-command.fr-btn-hover::after,.fr-desktop .fr-command.fr-expanded::after{border-top-color:#333333}.fr-desktop .fr-command.fr-selected:not(.fr-table-cell),.fr-desktop .fr-command:active{color:#333333;background:#d6d6d6}.fr-desktop .fr-command.fr-active:hover,.fr-desktop .fr-command.fr-active:focus,.fr-desktop .fr-command.fr-active.fr-btn-hover,.fr-desktop .fr-command.fr-active.fr-expanded{background:#ebebeb}.fr-desktop .fr-command.fr-active:active{background:#d6d6d6}.fr-desktop .fr-command.fr-disabled:hover,.fr-desktop .fr-command.fr-disabled:focus,.fr-desktop .fr-command.fr-disabled.fr-selected{background:transparent}.fr-desktop.fr-disabled .fr-command:hover,.fr-desktop.fr-disabled .fr-command:focus,.fr-desktop.fr-disabled .fr-command.fr-selected{background:transparent}.fr-toolbar.fr-mobile .fr-command.fr-blink,.fr-popup.fr-mobile .fr-command.fr-blink{background:#d6d6d6}.fr-command.fr-btn.fr-options{width:16px;margin-left:-5px}.fr-command.fr-btn.fr-options.fr-btn-hover,.fr-command.fr-btn.fr-options:hover,.fr-command.fr-btn.fr-options:focus{border-left:solid 1px #FAFAFA;-webkit-transition:border-left 0s, background-color 0.5s;-moz-transition:border-left 0s, background-color 0.5s;-ms-transition:border-left 0s, background-color 0.5s;-o-transition:border-left 0s, background-color 0.5s}.fr-command.fr-btn+.fr-dropdown-menu{background:#FFF;display:inline-block;position:absolute;right:auto;bottom:auto;height:auto;z-index:4;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;-webkit-overflow-scrolling:touch;overflow:hidden;zoom:1;-webkit-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12)}.fr-command.fr-btn+.fr-dropdown-menu.test-height .fr-dropdown-wrapper{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;height:auto;max-height:275px}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper{padding:0;margin:auto;display:inline-block;text-align:left;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:height 0.3s;-moz-transition:height 0.3s;-ms-transition:height 0.3s;-o-transition:height 0.3s;margin-top:0;float:left;height:0;margin-top:0 !important}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content{position:relative}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list{list-style-type:none;margin:0;padding:8px 0;min-width:72px}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li{padding:0;margin:0;font-size:15px}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a{padding:0 20px;line-height:200%;display:flex;cursor:pointer;white-space:nowrap;color:inherit;text-decoration:none;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a svg{width:24px;height:24px;margin:3px 4px}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a svg path{fill:#333333}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-active{background:#d6d6d6}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a.fr-disabled{color:#bdbdbd;cursor:default}.fr-command.fr-btn+.fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li a .fr-shortcut{margin-left:20px;font-weight:bold;-webkit-opacity:0.75;-moz-opacity:0.75;opacity:0.75}.fr-command.fr-btn.fr-active+.fr-dropdown-menu{display:inline-block;-webkit-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12);box-shadow:0 3px 1px -2px rgba(0,0,0,0.2),0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12)}.fr-bottom>.fr-command.fr-btn+.fr-dropdown-menu{border-radius:2px 2px 0 0;-moz-border-radius:2px 2px 0 0;-webkit-border-radius:2px 2px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-rtl .fr-dropdown-wrapper,.fr-popup.fr-rtl .fr-dropdown-wrapper{text-align:right !important}body.fr-prevent-scroll{overflow:hidden}body.fr-prevent-scroll.fr-mobile{position:fixed;-webkit-overflow-scrolling:touch}.fr-modal{color:#222222;font-family:Arial, Helvetica, sans-serif;position:fixed;overflow-x:auto;overflow-y:scroll;top:0;left:0;bottom:0;right:0;width:100%;z-index:2147483640;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;line-height:1.2}.fr-modal.fr-middle .fr-modal-wrapper{margin-top:0;margin-bottom:0;margin-left:auto;margin-right:auto;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-o-transform:translate(-50%, -50%);position:absolute}.fr-modal .fr-modal-wrapper{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background-clip:padding-box;margin:20px auto;display:inline-block;background:#FFF;min-width:300px;-webkit-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);border:0;overflow:hidden;width:90%;position:relative}@media (min-width: 768px) and (max-width: 991px){.fr-modal .fr-modal-wrapper{margin:30px auto;width:70%}}@media (min-width: 992px){.fr-modal .fr-modal-wrapper{margin:50px auto;width:960px}}.fr-modal .fr-modal-wrapper .fr-modal-head{background:#FFF;overflow:hidden;position:absolute;width:100%;min-height:42px;z-index:3;border-bottom:solid #efefef 1px;-webkit-transition:all 0.2s ease 0s;-moz-transition:all 0.2s ease 0s;-ms-transition:all 0.2s ease 0s;-o-transition:all 0.2s ease 0s}.fr-modal .fr-modal-wrapper .fr-modal-head .fr-modal-head-line{height:56px;padding:0 10px}.fr-modal .fr-modal-wrapper .fr-modal-head .fr-modal-close{margin:10px;position:absolute;top:0;right:0}.fr-modal .fr-modal-wrapper .fr-modal-head h4{font-size:20px;padding:19px 10px;margin:0;font-weight:400;line-height:18px;display:inline-block;float:left}.fr-modal .fr-modal-wrapper div.fr-modal-body{height:100%;min-height:150px;overflow-y:auto;padding-bottom:20px}.fr-modal .fr-modal-wrapper div.fr-modal-body:focus{outline:0}.fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command{height:36px;line-height:1;color:#0098f7;padding:10px;cursor:pointer;text-decoration:none;border:none;background:none;font-size:16px;outline:none;-webkit-transition:background 0.2s ease 0s;-moz-transition:background 0.2s ease 0s;-ms-transition:background 0.2s ease 0s;-o-transition:background 0.2s ease 0s;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command+button{margin-left:24px}.fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:hover,.fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:focus{background:#ebebeb;color:#0098f7}.fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command:active{background:#d6d6d6;color:#0098f7}.fr-modal .fr-modal-wrapper div.fr-modal-body button::-moz-focus-inner{border:0}.fr-desktop .fr-modal-wrapper .fr-modal-head i:hover{background:#ebebeb}.fr-overlay{position:fixed;top:0;bottom:0;left:0;right:0;background:#000;-webkit-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";z-index:2147483639}ol.decimal_type{counter-reset:item}ol.decimal_type>li{display:block;position:relative}ol.decimal_type>li:before{content:counters(item,".") ". ";counter-increment:item;position:absolute;margin-right:100%;right:10px}.fr-popup{position:absolute;display:none;color:#222222;background:#FFF;-webkit-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);font-family:Arial, Helvetica, sans-serif;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;margin-top:10px;z-index:2147483635;text-align:left;border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.2}.fr-popup .fr-icon{text-align:center;vertical-align:middle;font-size:20px;line-height:1;cursor:pointer;font-weight:400;box-sizing:content-box;padding:6px}.fr-popup .fr-icon-container{padding:20px;max-height:200px;overflow:auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}@supports not (-ms-high-contrast: none){.fr-popup .fr-icon-container{grid-template-columns:repeat(auto-fill, minmax(36px, 36px));display:grid}}@media (min-width: 768px){.fr-popup .fr-icon-container{min-width:276px}}@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){.fr-popup .fr-icon-container{display:inline-flex;-ms-flex-flow:row wrap}}@media screen and (-ms-high-contrast: active) and (max-width: 768px), (-ms-high-contrast: none) and (max-width: 768px){.fr-popup .fr-icon-container{width:236px}}.fr-popup .fr-input-focus{background:whitesmoke}.fr-popup.fr-above{margin-top:-10px;border-top:0}.fr-popup.fr-active{display:block}.fr-popup.fr-hidden{display:none !important}.fr-popup.fr-empty{display:none !important}.fr-popup .fr-hs{display:block !important}.fr-popup .fr-hs.fr-hidden{display:none !important}.fr-popup .fr-input-line{position:relative;padding:15px 0}.fr-popup .fr-input-line input[type="text"],.fr-popup .fr-input-line input[type="number"],.fr-popup .fr-input-line textarea{width:100%;margin-bottom:1px;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;border:solid 1px #999999;color:#222222;font-size:14px;background:#FFF;position:relative;z-index:2;padding:4px 12px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:border 0.5s, padding 0.5s;-moz-transition:border 0.5s, padding 0.5s;-ms-transition:border 0.5s, padding 0.5s;-o-transition:border 0.5s, padding 0.5s}.fr-popup .fr-input-line input[type="text"]:hover,.fr-popup .fr-input-line input[type="number"]:hover,.fr-popup .fr-input-line textarea:hover{border:solid 1px #515151}.fr-popup .fr-input-line input[type="text"]:focus,.fr-popup .fr-input-line input[type="number"]:focus,.fr-popup .fr-input-line textarea:focus{border:solid 2px #0098f7;padding:3px 11px}.fr-popup .fr-input-line input[type="text"],.fr-popup .fr-input-line input[type="number"]{height:46px}.fr-popup .fr-input-line input+label,.fr-popup .fr-input-line textarea+label{position:absolute;top:29px;left:12px;font-size:14px;color:grey;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;z-index:3;display:block;background:#FFF;padding:0;cursor:text}.fr-popup .fr-input-line input.fr-not-empty+label,.fr-popup .fr-input-line textarea.fr-not-empty+label{color:gray;width:auto;left:4px;padding:0 4px;font-size:11px;top:9px}.fr-popup input,.fr-popup textarea{user-select:text;-o-user-select:text;-moz-user-select:text;-khtml-user-select:text;-webkit-user-select:text;-ms-user-select:text;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;outline:none}.fr-popup textarea{resize:none}.fr-popup .fr-buttons{white-space:nowrap;line-height:0}.fr-popup .fr-buttons .fr-btn{margin-left:4px;margin-right:4px;display:inline-block;float:none}.fr-popup .fr-buttons .fr-btn i{float:left}.fr-popup .fr-buttons .fr-separator{display:inline-block;float:none}.fr-popup .fr-buttons.fr-tabs{border-radius:6px 6px 0 0;-moz-border-radius:6px 6px 0 0;-webkit-border-radius:6px 6px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background-color:#f5f5f5;overflow:hidden}@media (max-width: 768px){.fr-popup .fr-buttons.fr-tabs.fr-tabs-scroll{overflow:scroll;overflow-y:hidden;width:276px}}.fr-popup .fr-buttons:not(.fr-tabs){padding:5px}.fr-popup .fr-layer{border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;width:195px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:20px;display:none}@media (min-width: 768px){.fr-popup .fr-layer{width:260px}}.fr-popup .fr-layer.fr-active{display:inline-block}.fr-popup .fr-action-buttons{z-index:7;height:36px;text-align:right}.fr-popup .fr-action-buttons button.fr-command{height:36px;line-height:1;color:#0098f7;padding:10px;cursor:pointer;text-decoration:none;border:none;background:none;font-size:16px;outline:none;-webkit-transition:background 0.2s ease 0s;-moz-transition:background 0.2s ease 0s;-ms-transition:background 0.2s ease 0s;-o-transition:background 0.2s ease 0s;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-popup .fr-action-buttons button.fr-command+button{margin-left:24px}.fr-popup .fr-action-buttons button.fr-command:hover,.fr-popup .fr-action-buttons button.fr-command:focus{background:#ebebeb;color:#0098f7}.fr-popup .fr-action-buttons button.fr-command:active{background:#d6d6d6;color:#0098f7}.fr-popup .fr-action-buttons button::-moz-focus-inner{border:0}.fr-popup .fr-checkbox{position:relative;display:inline-block;width:18px;height:18px;padding:10px;border-radius:100%;line-height:1;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;vertical-align:middle}.fr-popup .fr-checkbox svg{margin-left:2px;margin-top:2px;display:none;width:10px;height:10px}.fr-popup .fr-checkbox span{border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;width:18px;height:18px;display:inline-block;position:relative;z-index:1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-moz-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-ms-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-o-transition:background 0.2s ease 0s, border-color 0.2s ease 0s}.fr-popup .fr-checkbox input{position:absolute;z-index:2;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";border:0 none;cursor:pointer;height:18px;margin:0;padding:0;width:18px;top:7px;left:7px}.fr-popup .fr-checkbox input:not(:checked)+span{border:solid 2px #999999}.fr-popup .fr-checkbox input:not(:checked):active+span{background-color:#f5f5f5}.fr-popup .fr-checkbox input:not(:checked):focus+span,.fr-popup .fr-checkbox input:not(:checked):hover+span{border-color:#515151}.fr-popup .fr-checkbox input:checked+span{background:#0098f7;border:solid 2px #0098f7}.fr-popup .fr-checkbox input:checked+span svg{display:block}.fr-popup .fr-checkbox input:checked:active+span{background-color:#EcF5Ff}.fr-popup .fr-checkbox input:checked:focus+span,.fr-popup .fr-checkbox input:checked:hover+span{-webkit-opacity:0.8;-moz-opacity:0.8;opacity:0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-popup .fr-checkbox-line{font-size:14px;line-height:1.4px;margin-top:10px}.fr-popup .fr-checkbox-line label{cursor:pointer;margin:0 5px;vertical-align:middle}.fr-popup.fr-rtl{direction:rtl;text-align:right}.fr-popup.fr-rtl .fr-action-buttons{text-align:left}.fr-popup.fr-rtl .fr-input-line input+label,.fr-popup.fr-rtl .fr-input-line textarea+label{left:auto;right:0}.fr-popup.fr-rtl .fr-buttons .fr-separator.fr-vs{float:right}.fr-text-edit-layer{width:250px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:block !important}.fr-toolbar{color:#222222;background:#FFF;position:relative;font-family:Arial, Helvetica, sans-serif;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;text-align:left;border:1px solid #CCCCCC;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.2;padding-bottom:0;-webkit-transition:padding-bottom 0.5s;-moz-transition:padding-bottom 0.5s;-ms-transition:padding-bottom 0.5s;-o-transition:padding-bottom 0.5s}.fr-toolbar::after{clear:both;display:block;content:"";height:0}.fr-toolbar::after{height:0}.fr-toolbar .fr-newline{clear:both;display:block;content:"";margin-left:9px;margin-right:9px;background:#efefef;height:1px;-webkit-transition:height 0.5s;-moz-transition:height 0.5s;-ms-transition:height 0.5s;-o-transition:height 0.5s}.fr-toolbar.fr-toolbar-open .fr-newline{height:0}.fr-toolbar .fr-float-right{float:right}.fr-toolbar .fr-float-left{float:left}.fr-toolbar .fr-more-toolbar{float:left;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background-color:#f5f5f5;-webkit-transition:height 0.5s;-moz-transition:height 0.5s;-ms-transition:height 0.5s;-o-transition:height 0.5s;height:0;overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%}.fr-toolbar .fr-more-toolbar.fr-expanded{height:48px}.fr-toolbar .fr-more-toolbar.fr-overflow-visible{overflow:visible}.fr-toolbar .fr-more-toolbar>.fr-command.fr-btn{margin-left:4px;margin-right:4px}.fr-toolbar .fr-btn-grp{display:inline-block;margin:0 17px 0 12px}@media (max-width: 768px){.fr-toolbar .fr-btn-grp{margin:0 7px 0 6px}}.fr-toolbar .fr-command.fr-btn.fr-open{margin-top:10px;margin-bottom:-1px;border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;-webkit-border-radius:4px 4px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar .fr-command.fr-btn.fr-open:not(:hover):not(:focus):not(:active){background:#f5f5f5}.fr-toolbar.fr-rtl{text-align:right}.fr-toolbar.fr-inline{display:none;-webkit-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);-moz-box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);box-shadow:0 3px 5px -1px rgba(0,0,0,0.2),0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12);border:0;white-space:nowrap;position:absolute;margin-top:5px;z-index:2147483630}.fr-toolbar.fr-inline.fr-above{margin-top:-10px;border-top:0}.fr-toolbar.fr-inline .fr-newline{height:0}.fr-toolbar.fr-inline .fr-more-toolbar{position:absolute !important}.fr-toolbar.fr-inline .fr-more-toolbar.fr-expanded{position:relative !important}.fr-toolbar.fr-top{top:0;border-bottom:0;border-radius:10px 10px 0 0;-moz-border-radius:10px 10px 0 0;-webkit-border-radius:10px 10px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-bottom{bottom:0;border-top:0;padding-bottom:0;border-radius:0 0 10px 10px;-moz-border-radius:0 0 10px 10px;-webkit-border-radius:0 0 10px 10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-bottom .fr-newline{padding-top:0;-webkit-transition:padding-top 0.5s;-moz-transition:padding-top 0.5s;-ms-transition:padding-top 0.5s;-o-transition:padding-top 0.5s}.fr-toolbar.fr-bottom.fr-toolbar-open .fr-newline{padding-top:48px;background:#FFF}.fr-toolbar.fr-bottom .fr-command.fr-btn.fr-open{margin-top:-1px;margin-bottom:10px;border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;-webkit-border-radius:0 0 4px 4px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-toolbar.fr-sticky-on{border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-separator{background:#ebebeb;display:block;vertical-align:top;float:left}.fr-separator+.fr-separator{display:none}.fr-separator.fr-vs{height:32px;width:1px;margin:8px 4px}.fr-separator.fr-hs{clear:both;width:calc(100% - (2 * 4px));margin:0 4px;height:1px}.fr-separator.fr-hidden{display:none !important}.fr-rtl .fr-separator{float:right}.fr-toolbar.fr-inline .fr-separator.fr-hs{float:none}.fr-toolbar.fr-inline .fr-separator.fr-vs{display:inline-block}.fr-second-toolbar{border:1px solid #CCCCCC;border-top:0;background:#FFF;line-height:1.4;border-radius:0 0 10px 10px;-moz-border-radius:0 0 10px 10px;-webkit-border-radius:0 0 10px 10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-second-toolbar::after{clear:both;display:block;content:"";height:0}.fr-second-toolbar:empty{min-height:calc(10px);position:relative;margin-top:calc(-1px);z-index:2}#fr-logo{float:left;outline:none}#fr-logo>span{display:inline-block;float:left;font-family:sans-serif;padding:11px 5px 10px 15px;font-size:12px;font-weight:500;color:#b1b2b7;-webkit-transition:color 0.3s;-moz-transition:color 0.3s;-ms-transition:color 0.3s;-o-transition:color 0.3s}#fr-logo>svg{height:20px;width:47px;margin:7px 0;cursor:pointer}#fr-logo>svg *{-webkit-transition:fill 0.3s;-moz-transition:fill 0.3s;-ms-transition:fill 0.3s;-o-transition:fill 0.3s}#fr-logo:hover>span,#fr-logo:focus>span{color:#0098f7}#fr-logo:hover>svg .fr-logo,#fr-logo:focus>svg .fr-logo{fill:#0098f7}.fr-visibility-helper{display:none;margin-left:0 !important}@media (min-width: 768px){.fr-visibility-helper{margin-left:1px !important}}@media (min-width: 992px){.fr-visibility-helper{margin-left:2px !important}}@media (min-width: 1200px){.fr-visibility-helper{margin-left:3px !important}}.fr-opacity-0{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-box{position:relative}.fr-sticky{position:-webkit-sticky;position:-moz-sticky;position:-ms-sticky;position:-o-sticky;position:sticky}.fr-sticky-off{position:relative}.fr-sticky-on{position:fixed;z-index:10}.fr-sticky-on.fr-sticky-ios{position:-webkit-sticky;left:0;right:0;width:auto !important}.modal .fr-sticky-on{position:sticky}.fr-sticky-dummy{display:none}.fr-sticky-on+.fr-sticky-dummy,.fr-sticky-box>.fr-sticky-dummy{display:block}span.fr-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-view .fr-highlight-change,.fr-highlight-change>img,.fr-highlight-change>.fr-video>video,.fr-highlight-change>.fr-video>embed,.fr-highlight-change>.fr-video>iframe,.fr-highlight-change>.fr-embedly>.embedly-card>.embedly-card-hug>iframe,.fr-highlight-change>p,.fr-view .fr-highlight-change>span:not(.fr-tracking-deleted){background-color:#f3eec3;opacity:0.5}.fr-highlight-change.fr-highlight-change>table td,.fr-highlight-change.fr-highlight-change>hr{border-color:#f3eec3}.fr-tracking-deleted.fr-tracking-deleted>table td,.fr-tracking-deleted.fr-tracking-deleted>hr{border-color:#dc3545}.fr-tracking-deleted img,.fr-tracking-deleted>.fr-video>video,.fr-tracking-deleted>.fr-video>iframe,.fr-tracking-deleted>.fr-embedly>.embedly-card>.embedly-card-hug>iframe{opacity:0.5;background-color:#dc3545}.fr-view .fr-tracking-deleted{background-color:#dc3545;text-decoration:line-through;pointer-events:none;user-select:none;opacity:1}.fr-highlight-change>.fr-video>iframe,.fr-tracking-deleted>.fr-video>iframe,.fr-highlight-change>.fr-video>video,.fr-tracking-deleted>.fr-video>video,.fr-highlight-change>.fr-video>embed,.fr-highlight-change>.fr-embedly>.embedly-card>.embedly-card-hug>iframe,.fr-tracking-deleted>.fr-embedly>.embedly-card>.embedly-card-hug>iframe{padding:10px !important}.fr-tracking-deleted img,.fr-highlight-change img{border:2px solid #f3eec3}.fr-highlight-change #isPasted *:not(table):not(tbody):not(tr):not(td){opacity:0.5;background-color:#f3eec3}.fr-highlight-change #isPasted>table td{opacity:0.5;border-color:#f3eec3}.fr-track-hide{display:none}.fr-track-hide-mobile{width:0;height:0;overflow:hidden;position:absolute}.fr-ios-mobile-disable-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.fr-bottom-extended{flex-wrap:wrap;display:flex;box-sizing:border-box}.position-relative{position:relative !important}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-box .fr-counter{padding:10px;float:right;color:#999999;content:attr(data-chars);font-size:14px;font-family:sans-serif;z-index:1;border-radius:2px 0 0 0;-moz-border-radius:2px 0 0 0;-webkit-border-radius:2px 0 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-rtl .fr-counter{left:0;right:auto;border-left:none;border-radius:0 2px 0 0;-moz-border-radius:0 2px 0 0;-webkit-border-radius:0 2px 0 0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-code-view .fr-counter{display:none}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}textarea.fr-code{display:none;width:100%;resize:none;-moz-resize:none;-webkit-resize:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:none;padding:10px;margin:0;font-family:"Courier New",monospace;font-size:14px;background:#FFF;color:#000;outline:none}.fr-box.fr-rtl textarea.fr-code{direction:rtl}.fr-box .CodeMirror{display:none}.fr-box.fr-code-view textarea.fr-code{display:block}.fr-box.fr-code-view .fr-element,.fr-box.fr-code-view .fr-placeholder,.fr-box.fr-code-view .fr-iframe{display:none}.fr-box.fr-code-view .CodeMirror{display:block}.fr-box.fr-inline.fr-code-view .fr-command.fr-btn.html-switch{display:block}.fr-box.fr-inline .fr-command.fr-btn.html-switch{display:none;position:absolute;top:0;right:0;display:none;background:#FFF;color:#333333;-moz-outline:0;outline:0;border:0;line-height:1;cursor:pointer;text-align:left;padding:8px 7px;-webkit-transition:background 0.2s ease 0s;-moz-transition:background 0.2s ease 0s;-ms-transition:background 0.2s ease 0s;-o-transition:background 0.2s ease 0s;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;z-index:2;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-decoration:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-box.fr-inline .fr-command.fr-btn.html-switch i{font-size:24px;width:24px;text-align:center}.fr-box.fr-inline .fr-command.fr-btn.html-switch.fr-desktop:hover{background:#ebebeb}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-popup .fr-layer.fr-color-hex-layer{margin:0;padding:20px;padding-top:0;float:left}.fr-popup .fr-layer.fr-color-hex-layer .fr-input-line{float:left;width:calc(100% - 50px);padding:15px 0 0}.fr-popup .fr-layer.fr-color-hex-layer .fr-action-buttons{float:right;width:38px;height:40px;padding:17px 0 0;margin:0}.fr-popup .fr-layer.fr-color-hex-layer .fr-action-buttons button.fr-command{border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;font-size:13px;height:40px;width:38px}.fr-popup .fr-separator+.fr-colors-tabs{margin-left:2px;margin-right:2px}.fr-popup .fr-color-set{line-height:0;display:none}.fr-popup .fr-color-set.fr-selected-set{display:block;padding:20px;padding-bottom:0}.fr-popup .fr-color-set>span{display:inline-block;width:32px;height:32px;position:relative;z-index:1}.fr-popup .fr-color-set>span>i,.fr-popup .fr-color-set>span>svg{text-align:center;line-height:32px;height:24px;width:24px;margin:4px;font-size:13px;position:absolute;bottom:0;cursor:default;left:0}.fr-popup .fr-color-set>span>i path,.fr-popup .fr-color-set>span>svg path{fill:#222222}.fr-popup .fr-color-set>span .fr-selected-color{color:#FFF;font-family:FontAwesome;font-size:13px;font-weight:400;line-height:32px;position:absolute;top:0;bottom:0;right:0;left:0;text-align:center;cursor:default}.fr-popup .fr-color-set>span:hover,.fr-popup .fr-color-set>span:focus{outline:1px solid #222222;z-index:2}.fr-rtl .fr-popup .fr-colors-tabs .fr-colors-tab.fr-selected-tab[data-param1="text"] ~ [data-param1="background"]::after{-webkit-transform:translate3d(100%, 0, 0);-moz-transform:translate3d(100%, 0, 0);-ms-transform:translate3d(100%, 0, 0);-o-transform:translate3d(100%, 0, 0)}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-drag-helper{background:#0098f7;height:2px;margin-top:-1px;-webkit-opacity:0.2;-moz-opacity:0.2;opacity:0.2;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";position:absolute;z-index:2147483640;display:none}.fr-drag-helper.fr-visible{display:block}.fr-dragging{-webkit-opacity:0.4;-moz-opacity:0.4;opacity:0.4;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-popup .fr-emoticon{width:24px;height:24px;font-family:"Apple Color Emoji", "Segoe UI Emoji", NotoColorEmoji, "Segoe UI Symbol", "Android Emoji", EmojiSymbols}.fr-popup .fr-emoticon img{height:24px;width:24px}.fr-popup .fr-command.fr-btn.fr-tabs-unicode{padding:0 0 0 14px}@media screen and (-ms-high-contrast: active) and (min-width: 768px), (-ms-high-contrast: none) and (min-width: 768px){.fr-popup .fr-icon-container.fr-emoticon-container{width:368px}}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-popup .fr-file-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;margin:20px;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;text-align:center}.fr-popup .fr-file-upload-layer:hover{background:#ebebeb}.fr-popup .fr-file-upload-layer.fr-drop{background:#ebebeb;border-color:#0098f7}.fr-popup .fr-file-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0 !important;padding:0 !important;width:100% !important}.fr-popup .fr-file-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-file-progress-bar-layer{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-popup .fr-file-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:normal}.fr-popup .fr-file-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-file-progress-bar-layer>div.fr-loader{background:#b3e0fd;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-file-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0%;background:#0098f7;-webkit-transition:width 0.2s ease 0s;-moz-transition:width 0.2s ease 0s;-ms-transition:width 0.2s ease 0s;-o-transition:width 0.2s ease 0s}.fr-popup .fr-file-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30% !important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-file-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-file-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}@keyframes loading{from{left:-25%}to{left:100%}}@-webkit-keyframes loading{from{left:-25%}to{left:100%}}@-moz-keyframes loading{from{left:-25%}to{left:100%}}@-o-keyframes loading{from{left:-25%}to{left:100%}}@keyframes loading{from{left:-25%}to{left:100%}}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-element img{cursor:pointer;padding:0 1px}.fr-height-auto{height:auto !important}.fr-file-loader{border:4px solid #f3f3f3;border-radius:50%;border-top:4px solid #53777a;display:inline-block !important;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;width:20px;height:20px;display:block !important;align-items:center}.fr-trim-button{margin-top:5px;height:36px;line-height:1;color:#0098f7;padding:10px;cursor:pointer;text-decoration:none;border:none;background:none;font-size:16px;border-radius:5px;background-color:#eff5fa;outline:none}.fr-trim-button:hover{background:#ebebeb}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.fr-image-resizer{position:absolute;border:solid 1px #0098f7;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-image-resizer.fr-active{display:block}.fr-image-resizer .fr-handler{display:block;position:absolute;background:#0098f7;border:solid 1px #FFF;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;z-index:4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-image-resizer .fr-handler.fr-hnw{cursor:nw-resize}.fr-image-resizer .fr-handler.fr-hne{cursor:ne-resize}.fr-image-resizer .fr-handler.fr-hsw{cursor:sw-resize}.fr-image-resizer .fr-handler.fr-hse{cursor:se-resize}.fr-image-resizer .fr-handler{width:12px;height:12px}.fr-image-resizer .fr-handler.fr-hnw{left:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hne{right:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hsw{left:-6px;bottom:-6px}.fr-image-resizer .fr-handler.fr-hse{right:-6px;bottom:-6px}@media (min-width: 1200px){.fr-image-resizer .fr-handler{width:10px;height:10px}.fr-image-resizer .fr-handler.fr-hnw{left:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hne{right:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hsw{left:-5px;bottom:-5px}.fr-image-resizer .fr-handler.fr-hse{right:-5px;bottom:-5px}}.fr-image-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483640;display:none}.fr-by-url-padding{padding:11.5px 0}.fr-popup .fr-upload-progress-layer{border-radius:0;box-sizing:border-box;padding-left:20px;padding-top:15px;margin:auto !important;max-height:100%;overflow-y:auto;overflow-x:hidden;width:100% !important;overscroll-behavior:contain}.fr-popup .fr-files-by-url-layer{width:calc(100% - 40px) !important}.fr-popup .fr-files-embed-layer{width:calc(100% - 40px) !important}.fr-popup .fr-files-upload-layer{border:dashed 2px #bdbdbd;margin:20px;position:relative;font-size:10px;letter-spacing:1px;line-height:140%;text-align:center;width:calc(100% - 40px) !important}.fr-popup .fr-files-upload-layer:hover{background:#ebebeb}.fr-popup .fr-files-upload-layer.fr-drop{background:#ebebeb;border-color:#0098f7}.fr-popup .fr-files-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0 !important;padding:0 !important;width:100% !important}.fr-popup .fr-files-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-files-progress-bar-layer{width:calc(100% - 40px);width:-moz-available;width:-webkit-stretch;width:stretch}.fr-popup .fr-files-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:normal}.fr-popup .fr-files-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-files-progress-bar-layer>div.fr-loader{background:#b3e0fd;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-files-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0%;background:#0098f7;-webkit-transition:width 0.2s ease 0s;-moz-transition:width 0.2s ease 0s;-ms-transition:width 0.2s ease 0s;-o-transition:width 0.2s ease 0s}.fr-popup .fr-files-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30% !important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-files-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-files-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}.fr-image-size-layer .fr-image-group .fr-input-line{width:calc(50% - 5px);display:inline-block}.fr-image-size-layer .fr-image-group .fr-input-line+.fr-input-line{margin-left:10px}.fr-progress-bar-style{width:calc(100% - 40px)}.fr-progress-bar{position:relative;background-color:#4CAF50;height:8px;margin-bottom:8px;margin-left:20px;margin-right:20px;width:100%;width:-moz-available;width:-webkit-stretch;width:stretch}.fr-uploading{-webkit-opacity:0.4;-moz-opacity:0.4;opacity:0.4;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}@-webkit-keyframes loading{from{left:-25%}to{left:100%}}@-moz-keyframes loading{from{left:-25%}to{left:100%}}@-o-keyframes loading{from{left:-25%}to{left:100%}}@keyframes loading{from{left:-25%}to{left:100%}}.fr-pull-left{float:left}.fr-pull-right{float:right}.fr-icons{padding:10px 20px 0;display:inline}.fr-transform-135{transform:rotate(135deg)}.fr-icons i{margin:4px;padding:2px;cursor:pointer;color:#999588;font-size:20px}.fr-blue-decorator{background:#4a7fba;color:white;display:grid;padding:5px}.fr-upload-progress{padding:1px}.fr-upload-section{position:relative;width:100%;width:-moz-available;width:-webkit-stretch;width:stretch}@media screen and (max-width: 399px){.fr-upload-section{margin-left:7px;margin-right:7px}.fr-files-upload-layer{padding-top:7px;padding-bottom:7px}}@media screen and (min-width: 400px) and (max-width: 469px){.fr-upload-section{margin-left:7px;margin-right:7px}.fr-files-upload-layer{padding-top:7px;padding-bottom:7px}}@media screen and (min-width: 470px) and (max-width: 680px){.fr-upload-section{margin-left:7px;margin-right:7px}.fr-files-upload-layer{padding-top:7px;padding-bottom:7px}}@media screen and (min-width: 681px){.fr-upload-section{margin-left:35px;margin-right:35px}.fr-files-upload-layer{padding-top:20px;padding-bottom:20px}}.fr-half-circle{width:60px;height:25px;background-color:white;border-top-left-radius:110px;border-top-right-radius:110px;transform:rotate(180deg);border-bottom:0;position:relative;left:50%;z-index:1;left:50%;margin-top:-1px;margin-left:-25px}.fr-decorated{overflow:hidden;text-align:center}.fr-decorated>span{position:relative;display:inline-block}.fr-decorated>span:before,.fr-decorated>span:after{content:'';position:absolute;top:50%;border-bottom:2px solid #ffffff;width:100%;margin:0 20px}.fr-decorated>span:before{right:100%}.fr-decorated>span:after{left:100%}.fr-align-right{float:right}.fr-checkbox-container{display:inline-block;position:relative;padding-left:20px;margin-bottom:12px;cursor:pointer;font-size:13px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fr-files-checkbox-line{display:flex;align-items:center;font-size:10px}.fr-files-checkbox-line label{cursor:pointer;vertical-align:middle}.fr-insert-checkbox input{height:13px !important;width:13px !important}.fr-autoplay-checkbox input{height:13px !important;width:13px !important}button[data-cmd="insertFiles"]{padding-left:2px !important;padding-top:2.7px !important}button[data-cmd="autoplay"] svg{position:relative !important;top:3.2px !important}button[data-cmd="insertAll"]{padding-left:4px !important}button[data-cmd="insertAll"] svg{position:relative !important;top:3.2px !important}.fr-checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.fr-checkmark{position:absolute;top:0;left:0;height:15px;width:15px;background-color:#eee}.fr-file-list-item{display:flex;justify-content:space-between;align-items:center;padding-top:7px;flex-wrap:wrap;position:relative;top:-20px;border-bottom:1px solid #ddd;padding-bottom:7px}.fr-file-item-left{display:flex;flex-wrap:wrap}.fr-file-item-icon{display:flex;align-items:center;padding-left:7px}.fr-file-item-description{display:flex;flex-wrap:wrap;flex-direction:column;justify-content:center;max-width:400px;margin-left:5px}.fr-cloud-icon{height:30px;width:32px;background-color:white;border-radius:50%;display:flex;justify-content:center;position:relative;margin:0 auto;margin-top:-18px}.fr-files-checkbox{position:relative;display:inline-block;width:13px;height:13px;padding-right:5px;border-radius:100%;line-height:1;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;vertical-align:middle}.fr-files-checkbox svg{margin-left:0px;margin-top:0px;display:none;width:10px;height:10px}.fr-files-checkbox span{border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;width:15px;height:15px;display:inline-block;position:relative;z-index:1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-moz-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-ms-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-o-transition:background 0.2s ease 0s, border-color 0.2s ease 0s}.fr-files-checkbox input{position:absolute;z-index:2;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";border:0 none;cursor:pointer;height:18px;margin:0;padding:0;width:18px}.fr-files-checkbox input:not(:checked)+span{border:solid 2px #999999}.fr-files-checkbox input:not(:checked):active+span{background-color:#f5f5f5}.fr-files-checkbox input:not(:checked):focus+span,.fr-files-checkbox input:not(:checked):hover+span{border-color:#515151}.fr-files-checkbox input:checked+span{background:#0098f7;border:solid 2px #0098f7}.fr-files-checkbox input:checked+span svg{display:block}.fr-files-checkbox input:checked:active+span{background-color:#EcF5Ff}.fr-files-checkbox input:checked:focus+span,.fr-files-checkbox input:checked:hover+span{-webkit-opacity:0.8;-moz-opacity:0.8;opacity:0.8;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-checkbox-disabled{opacity:0.4;position:relative;display:inline-block;width:13px !important;height:13px !important;padding-right:5px;border-radius:100%;line-height:1;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;vertical-align:middle}.fr-checkbox-disabled svg{margin-left:2px;margin-top:2px;display:none;width:10px;height:10px}.fr-checkbox-disabled span{border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;width:15px;height:15px;display:inline-block;position:relative;z-index:1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-moz-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-ms-transition:background 0.2s ease 0s, border-color 0.2s ease 0s;-o-transition:background 0.2s ease 0s, border-color 0.2s ease 0s}.fr-checkbox-disabled input{position:absolute;z-index:2;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";border:0 none;cursor:default;height:13px !important;margin:0;padding:0;width:13px !important;top:7px;left:7px}.fr-checkbox-disabled input:not(:checked)+span{border:solid 2px #999999}.fr-checkbox-disabled input:not(:checked):active+span{background-color:#f5f5f5}.fr-checkbox-disabled input:checked+span{background:#0098f7;border:solid 2px #0098f7}.fr-checkbox-disabled input:checked+span svg{display:block}.fr-checkbox-disabled input:checked:active+span{background-color:#EcF5Ff}.fr-file-view{position:absolute;max-width:60%;right:10%;z-index:2147483642}.fr-file-item-thumbnail-hover{transition:transform .2s}.fr-file-item-thumbnail-hover:hover{-ms-transform:scale(1.3);-webkit-transform:scale(1.3);transform:scale(1.3)}.fr-file-name{padding-top:5px;font-size:12px;font-weight:bold}.fr-margin-16{margin-bottom:16px}.fr-none{display:none}.fr-display-block{display:block}.fr-files-manager-tooltip{position:relative}.padding-top-15{padding-top:15px !important;padding-bottom:0px !important}.fr-files-manager-tooltip .tooltiptext{visibility:hidden;width:max-content;max-width:250px;word-break:break-word;word-wrap:break-word;background-color:black;color:#fff;text-align:left;padding:4px;border-radius:2px;font-weight:100;font-size:10px;position:absolute;top:80%;left:50%;z-index:2147483647}.fr-files-manager-tooltip:hover .tooltiptext{visibility:visible}.fr-file-details{display:flex;flex-wrap:wrap;font-size:10px}.fr-file-date{word-break:break-word;word-wrap:break-word;max-width:110px;color:#444;padding-top:2px;padding-bottom:2px}.fr-file-size{color:#444;padding-top:2px;padding-bottom:2px}.dot{width:20px;height:20px;background-image:radial-gradient(circle, grey 1px, transparent 2px);background-size:100% 33.33%;margin-left:2px;margin-right:2px}.fr-file-action-icons{margin-right:5px;margin-left:5px !important;color:#999;height:25px !important;padding:5px !important}@media screen and (max-width: 700px){.fr-files-manager-tooltip .tooltiptext{max-width:250px;visibility:hidden;word-break:break-word;word-wrap:break-word;top:90%;left:0%;font-size:8px}}@media screen and (max-width: 500px){.fr-files-manager-tooltip .tooltiptext{max-width:100px;visibility:hidden;word-break:break-word;word-wrap:break-word;top:90%;left:0%}.fr-file-item-description{width:130px}.fr-file-item-right{width:100%}.progress-circle{font-size:6px}}@media screen and (max-width: 320px){.fr-files-manager-tooltip .tooltiptext{max-width:100px;visibility:hidden;word-break:break-word;word-wrap:break-word;top:90%;left:-50%;font-size:8px}.dot{width:20px;margin-left:0px;margin-right:3px}.fr-file-item-description{width:80px}.fr-file-details{display:flex;flex-wrap:wrap;font-size:9px}.fr-file-name{font-size:10px}.fr-file-action-icons{padding:0px !important}}@media screen and (min-width: 501px){.progress-circle{font-size:9px}}.fr-file-view-modal{display:block;position:fixed;position:-ms-page;z-index:2147483641;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:black;background-color:rgba(0,0,0,0.7)}.fr-file-view-modal-content{display:inline-block;text-align:center}.fr-file-view-image{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;max-width:80%;max-height:70%}.fr-file-view-close{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:bold;transition:0.3s}.fr-file-view-close:hover,.fr-file-view-close:focus{color:#bbb;text-decoration:none;cursor:pointer}.fr-file-error{color:red;font-weight:200;font-size:12px;padding-bottom:5px}.fr-file-error-h5{margin:0}.fr-file-item-right{display:flex;align-items:center;justify-content:flex-end;margin-right:20px}.fr-file-item-action-buttons{display:flex;align-items:center;justify-content:space-around}.fr-file-item-autoplay-checkbox{align-items:center;margin:0px;padding:0px;margin-right:5px}.fr-autoplay-checkbox-label{margin:0;cursor:default !important}.fr-checkbox-container:hover input ~ .fr-checkmark{background-color:#ccc}.fr-checkbox-container input:checked ~ .fr-checkmark{background-color:#2196F3}.fr-checkmark:after{content:"";position:absolute;display:none}.fr-checkbox-container input:checked ~ .fr-checkmark:after{display:block}.fr-container .fr-checkmark:after{left:5px;top:2px;width:3px;height:7px;border:solid white;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}.fr-file-item-details .file-name{font-weight:bold;display:inline}.fr-file-item-details .file-description{font-weight:300;font-size:11px;display:inline}.fr-width-10{width:10%;display:inline-block}.fr-width-20{width:20%;display:inline-block}.fr-width-30{width:30%;display:inline-block}.fr-width-40{width:40%;display:inline-block}.fr-width-50{width:50%;display:inline-block}.fr-width-60{width:60%;display:inline-block}.fr-width-100{width:100%;display:inline-block}.fr-width-80{width:80%;display:inline-block}.fr-width-90{width:90%;display:inline-block}.fr-width-85{width:85%;display:inline-block}.fr-width-5{width:5%;display:inline-block}.fr-width-7{width:7%;display:inline-block}.fr-img-icon{color:#aaaaaa;font-size:16px;padding:0px 4px}.fr-position-content{position:relative;top:10px}.file-error{color:red}#myprogressBar{width:10%;height:5px;background-color:#4CAF50;position:relative;top:-30px}.fr-files-manager{z-index:2147483641 !important}.progress-circle{margin:0px;margin-left:10px;position:relative;padding:0;width:5em;height:5.1em;background-color:#f2e9e1;border-radius:50%;line-height:5em}.progress-circle:after{border:none;position:absolute;top:0.35em;left:0.35em;text-align:center;display:block;border-radius:50%;width:4.3em;height:4.3em;background-color:white;content:" "}.progress-circle span{position:absolute;line-height:5em;width:5em;text-align:center;display:block;color:#53777a;z-index:2}.progress-circle.over50 .left-half-clipper{clip:rect(auto, auto, auto, auto)}.progress-circle.over50 .first50-bar{position:absolute;clip:rect(0, 5em, 5em, 2.5em);background-color:#53777a;border-radius:50%;width:5em;height:5em}.progress-circle:not(.over50) .first50-bar{display:none}.progress-circle.p0 .value-bar{display:none}.progress-circle.p1 .value-bar{transform:rotate(4deg)}.progress-circle.p2 .value-bar{transform:rotate(7deg)}.progress-circle.p3 .value-bar{transform:rotate(11deg)}.progress-circle.p4 .value-bar{transform:rotate(14deg)}.progress-circle.p5 .value-bar{transform:rotate(18deg)}.progress-circle.p6 .value-bar{transform:rotate(22deg)}.progress-circle.p7 .value-bar{transform:rotate(25deg)}.progress-circle.p8 .value-bar{transform:rotate(29deg)}.progress-circle.p9 .value-bar{transform:rotate(32deg)}.progress-circle.p10 .value-bar{transform:rotate(36deg)}.progress-circle.p11 .value-bar{transform:rotate(40deg)}.progress-circle.p12 .value-bar{transform:rotate(43deg)}.progress-circle.p13 .value-bar{transform:rotate(47deg)}.progress-circle.p14 .value-bar{transform:rotate(50deg)}.progress-circle.p15 .value-bar{transform:rotate(54deg)}.progress-circle.p16 .value-bar{transform:rotate(58deg)}.progress-circle.p17 .value-bar{transform:rotate(61deg)}.progress-circle.p18 .value-bar{transform:rotate(65deg)}.progress-circle.p19 .value-bar{transform:rotate(68deg)}.progress-circle.p20 .value-bar{transform:rotate(72deg)}.progress-circle.p21 .value-bar{transform:rotate(76deg)}.progress-circle.p22 .value-bar{transform:rotate(79deg)}.progress-circle.p23 .value-bar{transform:rotate(83deg)}.progress-circle.p24 .value-bar{transform:rotate(86deg)}.progress-circle.p25 .value-bar{transform:rotate(90deg)}.progress-circle.p26 .value-bar{transform:rotate(94deg)}.progress-circle.p27 .value-bar{transform:rotate(97deg)}.progress-circle.p28 .value-bar{transform:rotate(101deg)}.progress-circle.p29 .value-bar{transform:rotate(104deg)}.progress-circle.p30 .value-bar{transform:rotate(108deg)}.progress-circle.p31 .value-bar{transform:rotate(112deg)}.progress-circle.p32 .value-bar{transform:rotate(115deg)}.progress-circle.p33 .value-bar{transform:rotate(119deg)}.progress-circle.p34 .value-bar{transform:rotate(122deg)}.progress-circle.p35 .value-bar{transform:rotate(126deg)}.progress-circle.p36 .value-bar{transform:rotate(130deg)}.progress-circle.p37 .value-bar{transform:rotate(133deg)}.progress-circle.p38 .value-bar{transform:rotate(137deg)}.progress-circle.p39 .value-bar{transform:rotate(140deg)}.progress-circle.p40 .value-bar{transform:rotate(144deg)}.progress-circle.p41 .value-bar{transform:rotate(148deg)}.progress-circle.p42 .value-bar{transform:rotate(151deg)}.progress-circle.p43 .value-bar{transform:rotate(155deg)}.progress-circle.p44 .value-bar{transform:rotate(158deg)}.progress-circle.p45 .value-bar{transform:rotate(162deg)}.progress-circle.p46 .value-bar{transform:rotate(166deg)}.progress-circle.p47 .value-bar{transform:rotate(169deg)}.progress-circle.p48 .value-bar{transform:rotate(173deg)}.progress-circle.p49 .value-bar{transform:rotate(176deg)}.progress-circle.p50 .value-bar{transform:rotate(180deg)}.progress-circle.p51 .value-bar{transform:rotate(184deg)}.progress-circle.p52 .value-bar{transform:rotate(187deg)}.progress-circle.p53 .value-bar{transform:rotate(191deg)}.progress-circle.p54 .value-bar{transform:rotate(194deg)}.progress-circle.p55 .value-bar{transform:rotate(198deg)}.progress-circle.p56 .value-bar{transform:rotate(202deg)}.progress-circle.p57 .value-bar{transform:rotate(205deg)}.progress-circle.p58 .value-bar{transform:rotate(209deg)}.progress-circle.p59 .value-bar{transform:rotate(212deg)}.progress-circle.p60 .value-bar{transform:rotate(216deg)}.progress-circle.p61 .value-bar{transform:rotate(220deg)}.progress-circle.p62 .value-bar{transform:rotate(223deg)}.progress-circle.p63 .value-bar{transform:rotate(227deg)}.progress-circle.p64 .value-bar{transform:rotate(230deg)}.progress-circle.p65 .value-bar{transform:rotate(234deg)}.progress-circle.p66 .value-bar{transform:rotate(238deg)}.progress-circle.p67 .value-bar{transform:rotate(241deg)}.progress-circle.p68 .value-bar{transform:rotate(245deg)}.progress-circle.p69 .value-bar{transform:rotate(248deg)}.progress-circle.p70 .value-bar{transform:rotate(252deg)}.progress-circle.p71 .value-bar{transform:rotate(256deg)}.progress-circle.p72 .value-bar{transform:rotate(259deg)}.progress-circle.p73 .value-bar{transform:rotate(263deg)}.progress-circle.p74 .value-bar{transform:rotate(266deg)}.progress-circle.p75 .value-bar{transform:rotate(270deg)}.progress-circle.p76 .value-bar{transform:rotate(274deg)}.progress-circle.p77 .value-bar{transform:rotate(277deg)}.progress-circle.p78 .value-bar{transform:rotate(281deg)}.progress-circle.p79 .value-bar{transform:rotate(284deg)}.progress-circle.p80 .value-bar{transform:rotate(288deg)}.progress-circle.p81 .value-bar{transform:rotate(292deg)}.progress-circle.p82 .value-bar{transform:rotate(295deg)}.progress-circle.p83 .value-bar{transform:rotate(299deg)}.progress-circle.p84 .value-bar{transform:rotate(302deg)}.progress-circle.p85 .value-bar{transform:rotate(306deg)}.progress-circle.p86 .value-bar{transform:rotate(310deg)}.progress-circle.p87 .value-bar{transform:rotate(313deg)}.progress-circle.p88 .value-bar{transform:rotate(317deg)}.progress-circle.p89 .value-bar{transform:rotate(320deg)}.progress-circle.p90 .value-bar{transform:rotate(324deg)}.progress-circle.p91 .value-bar{transform:rotate(328deg)}.progress-circle.p92 .value-bar{transform:rotate(331deg)}.progress-circle.p93 .value-bar{transform:rotate(335deg)}.progress-circle.p94 .value-bar{transform:rotate(338deg)}.progress-circle.p95 .value-bar{transform:rotate(342deg)}.progress-circle.p96 .value-bar{transform:rotate(346deg)}.progress-circle.p97 .value-bar{transform:rotate(349deg)}.progress-circle.p98 .value-bar{transform:rotate(353deg)}.progress-circle.p99 .value-bar{transform:rotate(356deg)}.progress-circle.p100 .value-bar{transform:rotate(360deg)}.left-half-clipper{border-radius:50%;width:5em;height:5em;position:absolute;clip:rect(0, 5em, 5em, 2.5em)}.value-bar{position:absolute;clip:rect(0, 2.5em, 5em, 0);width:5em;height:5em;border-radius:50%;border:0.45em solid #53777a;box-sizing:border-box}.align-autoplay{align-items:flex-end;margin-right:7px}.fr-hovered-over-file{background-color:#F0F0F0}.fr-thumbnail-padding{padding-right:4px}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}body.fr-fullscreen{overflow:hidden;height:100%;width:100%;position:fixed}.fr-box.fr-fullscreen{margin:0 !important;position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483630 !important;width:auto !important}.fr-box.fr-fullscreen .fr-wrapper{background-color:#FFF}.fr-box.fr-fullscreen.fr-basic.fr-top .fr-wrapper{border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-fullscreen.fr-basic.fr-bottom .fr-wrapper{border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-fullscreen .fr-toolbar{border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-box.fr-fullscreen .fr-toolbar.fr-top{top:0 !important}.fr-box.fr-fullscreen .fr-toolbar.fr-bottom{bottom:0 !important}.fr-box.fr-fullscreen .fr-second-toolbar{margin-top:0;border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-fullscreen-wrapper{z-index:2147483640 !important;width:100% !important;margin:0 !important;padding:0 !important;overflow:visible !important}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal{text-align:left;padding:20px 20px 10px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table{border-collapse:collapse;font-size:14px;line-height:1.5;width:100%}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table+table{margin-top:20px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tr{border:0}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table th{text-align:left}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table th,.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table td{padding:6px 0 4px}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody tr{border-bottom:solid 1px #ebebeb}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:first-child{width:60%;color:#646464}.fr-modal .fr-modal-wrapper .fr-modal-body .fr-help-modal table tbody td:nth-child(n+2){letter-spacing:0.5px}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-element img{cursor:pointer;padding:0 1px}.fr-image-resizer{position:absolute;border:solid 1px #0098f7;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-image-resizer.fr-active{display:block}.fr-image-resizer .fr-handler{display:block;position:absolute;background:#0098f7;border:solid 1px #FFF;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;z-index:4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-image-resizer .fr-handler.fr-hnw{cursor:nw-resize}.fr-image-resizer .fr-handler.fr-hne{cursor:ne-resize}.fr-image-resizer .fr-handler.fr-hsw{cursor:sw-resize}.fr-image-resizer .fr-handler.fr-hse{cursor:se-resize}.fr-image-resizer .fr-handler{width:12px;height:12px}.fr-image-resizer .fr-handler.fr-hnw{left:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hne{right:-6px;top:-6px}.fr-image-resizer .fr-handler.fr-hsw{left:-6px;bottom:-6px}.fr-image-resizer .fr-handler.fr-hse{right:-6px;bottom:-6px}@media (min-width: 1200px){.fr-image-resizer .fr-handler{width:10px;height:10px}.fr-image-resizer .fr-handler.fr-hnw{left:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hne{right:-5px;top:-5px}.fr-image-resizer .fr-handler.fr-hsw{left:-5px;bottom:-5px}.fr-image-resizer .fr-handler.fr-hse{right:-5px;bottom:-5px}}.fr-image-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483640;display:none}.fr-popup .fr-image-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;margin:20px;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;text-align:center}.fr-popup .fr-image-upload-layer:hover{background:#ebebeb}.fr-popup .fr-image-upload-layer.fr-drop{background:#ebebeb;border-color:#0098f7}.fr-popup .fr-image-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0 !important;padding:0 !important;width:100% !important}.fr-popup .fr-image-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-image-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:normal}.fr-popup .fr-image-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-image-progress-bar-layer>div.fr-loader{background:#b3e0fd;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-image-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0%;background:#0098f7;-webkit-transition:width 0.2s ease 0s;-moz-transition:width 0.2s ease 0s;-ms-transition:width 0.2s ease 0s;-o-transition:width 0.2s ease 0s}.fr-popup .fr-image-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30% !important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-image-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-image-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}.fr-image-size-layer .fr-image-group .fr-input-line{width:calc(50% - 5px);display:inline-block}.fr-image-size-layer .fr-image-group .fr-input-line+.fr-input-line{margin-left:10px}.fr-uploading{-webkit-opacity:0.4;-moz-opacity:0.4;opacity:0.4;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}@-webkit-keyframes loading{from{left:-25%}to{left:100%}}@-moz-keyframes loading{from{left:-25%}to{left:100%}}@-o-keyframes loading{from{left:-25%}to{left:100%}}@keyframes loading{from{left:-25%}to{left:100%}}img.fr-draggable{user-select:none}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-modal .fr-modal-head .fr-modal-head-line::after{clear:both;display:block;content:"";height:0}.fr-modal .fr-modal-head .fr-modal-head-line .fr-modal-more{margin-top:10px}.fr-modal .fr-modal-head .fr-modal-head-line .fr-modal-more.fr-not-available{opacity:0;width:0;padding:12px 0}.fr-modal .fr-modal-head .fr-modal-tags{padding:0 20px;display:none;text-align:left}.fr-modal .fr-modal-head .fr-modal-tags a{display:inline-block;opacity:0;padding:6px 12px;margin:8px 0 8px 8px;text-decoration:none;border-radius:32px;-moz-border-radius:32px;-webkit-border-radius:32px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;-webkit-transition:opacity 0.2s ease 0s, background 0.2s ease 0s;-moz-transition:opacity 0.2s ease 0s, background 0.2s ease 0s;-ms-transition:opacity 0.2s ease 0s, background 0.2s ease 0s;-o-transition:opacity 0.2s ease 0s, background 0.2s ease 0s;cursor:pointer;background-color:#f5f5f5}.fr-modal .fr-modal-head .fr-modal-tags a:focus{outline:none;background-color:#ebebeb}.fr-modal .fr-modal-head .fr-modal-tags a:hover{background-color:#ebebeb}.fr-modal .fr-modal-head .fr-modal-tags a:active{background-color:#d6d6d6}.fr-modal .fr-modal-head .fr-modal-tags a.fr-selected-tag{background-color:#EcF5Ff;color:#0098f7}.fr-modal .fr-modal-head .fr-modal-tags a.fr-selected-tag:focus{outline:none;background-color:#ebebeb}.fr-modal .fr-modal-head .fr-modal-tags a.fr-selected-tag:hover{background-color:#ebebeb}.fr-modal .fr-modal-head .fr-modal-tags a.fr-selected-tag:active{background-color:#d6d6d6}.fr-show-tags .fr-modal-more svg path{fill:#0098f7}div.fr-modal-body{-webkit-transition:background 0.2s ease 0s;-moz-transition:background 0.2s ease 0s;-ms-transition:background 0.2s ease 0s;-o-transition:background 0.2s ease 0s}div.fr-modal-body .fr-preloader{display:block;margin:50px auto}div.fr-modal-body div.fr-image-list{text-align:center;margin:0 20px;padding:0}div.fr-modal-body div.fr-image-list .fr-list-column{float:left;width:calc((100% - 20px) / 2)}@media (min-width: 768px) and (max-width: 1199px){div.fr-modal-body div.fr-image-list .fr-list-column{width:calc((100% - 40px) / 3)}}@media (min-width: 1200px){div.fr-modal-body div.fr-image-list .fr-list-column{width:calc((100% - 60px) / 4)}}div.fr-modal-body div.fr-image-list .fr-list-column+.fr-list-column{margin-left:20px}div.fr-modal-body div.fr-image-list div.fr-image-container{position:relative;width:100%;display:block;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;overflow:hidden}div.fr-modal-body div.fr-image-list div.fr-image-container:first-child{margin-top:20px}div.fr-modal-body div.fr-image-list div.fr-image-container+div{margin-top:20px}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::after{position:absolute;-webkit-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transition:opacity 0.2s ease 0s;-moz-transition:opacity 0.2s ease 0s;-ms-transition:opacity 0.2s ease 0s;-o-transition:opacity 0.2s ease 0s;background:#000;content:"";top:0;left:0;bottom:0;right:0;z-index:2}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::before{content:attr(data-deleting);color:#FFF;top:0;left:0;bottom:0;right:0;margin:auto;position:absolute;z-index:3;font-size:15px;height:20px}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty{height:95px;background:#CCCCCC;z-index:1}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-empty::after{position:absolute;margin:auto;top:0;bottom:0;left:0;right:0;content:attr(data-loading);display:inline-block;height:20px}div.fr-modal-body div.fr-image-list div.fr-image-container img{width:100%;vertical-align:middle;position:relative;z-index:2;-webkit-opacity:1;-moz-opacity:1;opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transition:opacity 0.2s ease 0s, filter 0.2s ease 0s;-moz-transition:opacity 0.2s ease 0s, filter 0.2s ease 0s;-ms-transition:opacity 0.2s ease 0s, filter 0.2s ease 0s;-o-transition:opacity 0.2s ease 0s, filter 0.2s ease 0s;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0)}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected img{-webkit-opacity:0.75;-moz-opacity:0.75;opacity:0.75;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-delete-img,div.fr-modal-body div.fr-image-list div.fr-image-container.fr-mobile-selected .fr-insert-img{display:inline-block}div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img,div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img{display:none;top:50%;border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;-webkit-transition:background 0.2s ease 0s, color 0.2s ease 0s;-moz-transition:background 0.2s ease 0s, color 0.2s ease 0s;-ms-transition:background 0.2s ease 0s, color 0.2s ease 0s;-o-transition:background 0.2s ease 0s, color 0.2s ease 0s;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;position:absolute;cursor:pointer;margin:0;line-height:40px;text-decoration:none;z-index:3}div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img{background:#B8312F;fill:#FFF;padding:8px;left:50%;-webkit-transform:translateY(-50%) translateX(25%);-moz-transform:translateY(-50%) translateX(25%);-ms-transform:translateY(-50%) translateX(25%);-o-transform:translateY(-50%) translateX(25%)}div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img{background:#FFF;fill:#0098f7;padding:8px;left:50%;-webkit-transform:translateY(-50%) translateX(-125%);-moz-transform:translateY(-50%) translateX(-125%);-ms-transform:translateY(-50%) translateX(-125%);-o-transform:translateY(-50%) translateX(-125%)}.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover img{-webkit-opacity:0.75;-moz-opacity:0.75;opacity:0.75;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-delete-img,.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container:hover .fr-insert-img{display:inline-block;width:40px;height:40px}.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-delete-img:hover{background:#bf4644;color:#FFF}.fr-desktop .fr-modal-wrapper div.fr-modal-body div.fr-image-list div.fr-image-container .fr-insert-img:hover{background:#ebebeb}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-line-breaker{cursor:text;border-top:1px solid #0098f7;position:fixed;z-index:2;display:none}.fr-line-breaker.fr-visible{display:block}.fr-line-breaker a.fr-floating-btn{position:absolute;left:calc(50% - (40px / 2));top:-20px}.fr-line-breaker a.fr-floating-btn svg{margin:8px;height:24px;width:24px}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-wrapper-markdown{display:flex}.fr-markdown-view{width:calc(52% - 1px);box-sizing:inherit}.fr-markdown-editor{width:calc(48% - 1px);box-sizing:inherit;background-color:#eee}.fr-markdown-editor>p{margin:0}.fr-markdown-view>p{margin-top:0}.gutter-horizontal{display:flex;z-index:9;background-color:#dadada;cursor:col-resize;width:2px}.e-resize-handler{z-index:9;width:1px;display:flex;justify-content:center;align-items:center;align-self:center;position:relative;font-size:10px;color:#c5c5c5}.fr-markdown-view>dl{margin-top:0;margin-bottom:1rem}.fr-markdown-view>dt{font-weight:700}.fr-markdown-view>dd{margin-bottom:.5rem;margin-left:0}.fr-markdown-view>pre{white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word;background-color:#f8f8f8;border:1px solid #dfdfdf;margin-top:1.5em;margin-bottom:1.5em;padding:0.125rem 0.3125rem 0.0625rem}.fr-markdown-view>code{background-color:#f8f8f8;border-color:#dfdfdf;border-style:solid;border-width:1px;color:#333;font-family:Consolas,"Liberation Mono",Courier,monospace;font-weight:normal;padding:0.125rem 0.3125rem 0.0625rem}.fr-markdown-view>pre code{background-color:transparent;border:0;padding:0}.fr-markdown-view>sup{top:-.5em}.footnote-a{color:#007bff;text-decoration:none;background-color:transparent}.fr-markdown-view>hr{margin-top:1rem;margin-bottom:1rem;border:0;border-top:1px solid rgba(0,0,0,0.1)}.blockquote{margin:0 0 1rem;border-left:5px solid #eee;padding:10px 20px;font-size:1.25rem}.fr-markdown-view>table{width:100%;max-width:100%;margin-bottom:20px;background-color:transparent;border-spacing:0;border-collapse:collapse}.fr-markdown-view>table>tbody>tr>td,.fr-markdown-view>table>tbody>tr>th,.fr-markdown-view>table>thead>tr>td,.fr-markdown-view>table>thead>tr>th{padding:8px;line-height:1.42857143;vertical-align:top;border:1px solid #ddd}.fr-markdown-view>table>thead>tr>td,.fr-markdown-view>table>thead>tr>th{border-bottom-width:2px}.fr-markdown-view>table>tbody>tr:nth-of-type(odd){background-color:#f9f9f9}.fr-markdown-view>a{color:#337ab7;text-decoration:none}.fr-markdown-view>h1{font-size:2em !important}.fr-markdown-view>h2{font-size:1.5em !important}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-quick-insert{position:absolute;z-index:2147483639;white-space:nowrap;padding-right:10px;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-quick-insert a.fr-floating-btn svg{margin:8px;width:24px;height:24px}.fr-quick-insert.fr-on a.fr-floating-btn svg{-webkit-transform:rotate(135deg);-moz-transform:rotate(135deg);-ms-transform:rotate(135deg);-o-transform:rotate(135deg)}.fr-quick-insert.fr-hidden{display:none}.fr-qi-helper{position:absolute;z-index:3;padding-left:20px;white-space:nowrap}.fr-qi-helper a.fr-btn.fr-floating-btn{text-align:center;padding:6px 10px 10px 10px;display:inline-block;color:#222222;background:#FFF;-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0)}.fr-qi-helper a.fr-btn.fr-floating-btn svg{fill:#222222}.fr-qi-helper a.fr-btn.fr-floating-btn.fr-size-1{-webkit-opacity:1;-moz-opacity:1;opacity:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1)}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-popup .fr-buttons.fr-tabs .fr-special-character-category{padding:10px 15px}.fr-popup .fr-buttons.fr-tabs .fr-special-character-category span{font-weight:normal;font-size:16px}.fr-popup .fr-special-character{width:24px;height:24px}@media screen and (-ms-high-contrast: active) and (min-width: 768px), (-ms-high-contrast: none) and (min-width: 768px){.fr-popup .fr-icon-container.fr-sc-container{width:368px}}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-element table td.fr-selected-cell,.fr-element table th.fr-selected-cell{border:1px double #0098f7}.fr-element table td,.fr-element table th{user-select:text;-o-user-select:text;-moz-user-select:text;-khtml-user-select:text;-webkit-user-select:text;-ms-user-select:text}.fr-element .fr-no-selection table td,.fr-element .fr-no-selection table th{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-table-resizer{cursor:col-resize;position:absolute;z-index:3;display:none}.fr-table-resizer.fr-moving{z-index:2}.fr-table-resizer div{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";border-right:1px solid #0098f7}.fr-no-selection{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-popup .fr-table-size{margin:20px}.fr-popup .fr-table-size .fr-table-size-info{text-align:center;font-size:14px}.fr-popup .fr-table-size .fr-select-table-size{line-height:0;padding:5px;white-space:nowrap}.fr-popup .fr-table-size .fr-select-table-size>span{display:inline-block;padding:0 4px 4px 0;background:transparent}.fr-popup .fr-table-size .fr-select-table-size>span>span{display:inline-block;width:18px;height:18px;border:1px solid #DDD}.fr-popup .fr-table-size .fr-select-table-size>span.hover{background:transparent}.fr-popup .fr-table-size .fr-select-table-size>span.hover>span{background:rgba(0,152,247,0.3);border:solid 1px #0098f7}.fr-popup .fr-table-size .fr-select-table-size .new-line::after{clear:both;display:block;content:"";height:0}.fr-popup.fr-above .fr-table-size .fr-select-table-size>span{display:inline-block !important}.fr-popup .fr-table-colors{display:block;padding:20px;padding-bottom:0}.fr-popup.fr-desktop .fr-table-size .fr-select-table-size>span>span{width:12px;height:12px}.fr-insert-helper{position:absolute;z-index:9999;white-space:nowrap}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}#fr-form-container{margin:auto;position:relative;top:10%;background-color:#f5f5f5;width:60%;border-radius:5px;z-index:9002;overflow:auto;background-color:#fefefe}.fr-trim-video-name{font-family:Arial, Helvetica, sans-serif;padding-top:15px}.fr-file-loader{border:4px solid #f3f3f3;border-radius:50%;border-top:4px solid #53777a;display:inline-block !important;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;width:20px;height:20px;display:block !important;align-items:center}.fr-trim-button{margin-top:5px;height:36px;line-height:1;color:#0098f7;padding:10px;cursor:pointer;text-decoration:none;border:none;background:none;font-size:16px;border-radius:5px;background-color:#eff5fa;outline:none}.fr-trim-button:hover{background:#ebebeb}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.fr-slidecontainer{width:100%}.fr-slider{-webkit-appearance:none;width:100%;height:15px;background:#d3d3d3}.fr-video-trim-buttons{text-align:right;padding-bottom:5px;padding-right:15px;margin-top:10px}.fr-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;border-radius:50%;cursor:pointer}.fr-slider::-moz-range-thumb{width:15px;height:15px;background:#3498db;border-radius:50%;cursor:pointer}.fr-range-value-start{position:absolute}.fr-range-value-start>span{width:60px;height:24px;line-height:24px;text-align:center;background:#03a9f4;color:#fff;font-size:12px;display:block;position:absolute;left:50%;transform:translate(-85%, 0);border-radius:6px}.fr-range-value-start>span:before{content:"";position:absolute;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;left:86%;margin-left:-5px;margin-top:-1px}.fr-range-value-end{position:absolute}.fr-range-value-end>span{width:60px;height:24px;line-height:24px;text-align:center;background:#03a9f4;color:#fff;font-size:12px;display:block;position:absolute;left:14%;transform:translate(-8%, 0);border-radius:6px}.fr-range-value-end>span:before{content:"";position:absolute;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;left:14%;margin-left:-5px;margin-top:-1px}#startTimeValue{top:-153% !important}#startTimeValue span:before{border-top:10px solid #03a9f4;top:100%}#endTimeValue{top:-153% !important}#endTimeValue span:before{border-top:10px solid #03a9f4;top:100%}.fr-range-slider{position:relative;width:80%;height:15px}.fr-range-slider>input{pointer-events:none;position:absolute;left:0;top:10px;width:100%;outline:none;height:6px;border-radius:10px}.fr-range-slider>input::-webkit-slider-thumb{pointer-events:all;position:relative;z-index:1;-webkit-appearance:none;appearance:none;width:15px;height:15px;background:#3498db;cursor:pointer;border-radius:7px;margin-top:-3.6px}.fr-range-slider>input::-moz-range-thumb{pointer-events:all;position:relative;z-index:10;-moz-appearance:none;width:9px;height:15px;border-radius:7px;margin-top:-3.6px}.fr-range-slider>input::-moz-range-track{position:relative;z-index:-1;background-color:black;border:0;height:15px;border-radius:50%;margin-top:-3.6px}.fr-range-slider>input:last-of-type::-moz-range-track{-moz-appearance:none;background:none transparent;border:0}.fr-range-slider>input[type="range"]::-moz-focus-outer{border:0}@media screen and (max-width: 430px){.range-value span{width:40px;font-size:10px}#fr-form-container{top:20%}}#fr-video-edit{width:80%;text-align:center;height:50%;margin-bottom:20px;padding-top:8px;padding-bottom:8px}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-element .fr-video{user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-element .fr-video::after{position:absolute;content:'';z-index:1;top:0;left:0;right:0;bottom:0;cursor:pointer;display:block;background:transparent}.fr-element .fr-video.fr-active>*{z-index:2;position:relative}.fr-element .fr-video>*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;max-width:100%;border:none}.fr-box .fr-video-resizer{position:absolute;border:solid 1px #0098f7;display:none;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none}.fr-box .fr-video-resizer.fr-active{display:block}.fr-box .fr-video-resizer .fr-handler{display:block;position:absolute;background:#0098f7;border:solid 1px #FFF;z-index:4;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-box .fr-video-resizer .fr-handler.fr-hnw{cursor:nw-resize}.fr-box .fr-video-resizer .fr-handler.fr-hne{cursor:ne-resize}.fr-box .fr-video-resizer .fr-handler.fr-hsw{cursor:sw-resize}.fr-box .fr-video-resizer .fr-handler.fr-hse{cursor:se-resize}.fr-box .fr-video-resizer .fr-handler{width:12px;height:12px}.fr-box .fr-video-resizer .fr-handler.fr-hnw{left:-6px;top:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hne{right:-6px;top:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hsw{left:-6px;bottom:-6px}.fr-box .fr-video-resizer .fr-handler.fr-hse{right:-6px;bottom:-6px}@media (min-width: 1200px){.fr-box .fr-video-resizer .fr-handler{width:10px;height:10px}.fr-box .fr-video-resizer .fr-handler.fr-hnw{left:-5px;top:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hne{right:-5px;top:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hsw{left:-5px;bottom:-5px}.fr-box .fr-video-resizer .fr-handler.fr-hse{right:-5px;bottom:-5px}}.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line{width:calc(50% - 5px);display:inline-block}.fr-popup .fr-video-size-layer .fr-video-group .fr-input-line+.fr-input-line{margin-left:10px}.fr-popup .fr-video-upload-layer{border:dashed 2px #bdbdbd;padding:25px 0;margin:20px;position:relative;font-size:14px;letter-spacing:1px;line-height:140%;text-align:center}.fr-popup .fr-video-upload-layer:hover{background:#ebebeb}.fr-popup .fr-video-upload-layer.fr-drop{background:#ebebeb;border-color:#0098f7}.fr-popup .fr-video-upload-layer .fr-form{-webkit-opacity:0;-moz-opacity:0;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2147483640;overflow:hidden;margin:0 !important;padding:0 !important;width:100% !important}.fr-popup .fr-video-upload-layer .fr-form input{cursor:pointer;position:absolute;right:0;top:0;bottom:0;width:500%;height:100%;margin:0;font-size:400px}.fr-popup .fr-video-progress-bar-layer>h3{font-size:16px;margin:10px 0;font-weight:normal}.fr-popup .fr-video-progress-bar-layer>div.fr-action-buttons{display:none}.fr-popup .fr-video-progress-bar-layer>div.fr-loader{background:#b3e0fd;height:10px;width:100%;margin-top:20px;overflow:hidden;position:relative}.fr-popup .fr-video-progress-bar-layer>div.fr-loader span{display:block;height:100%;width:0%;background:#0098f7;-webkit-transition:width 0.2s ease 0s;-moz-transition:width 0.2s ease 0s;-ms-transition:width 0.2s ease 0s;-o-transition:width 0.2s ease 0s}.fr-popup .fr-video-progress-bar-layer>div.fr-loader.fr-indeterminate span{width:30% !important;position:absolute;top:0;-webkit-animation:loading 2s linear infinite;-moz-animation:loading 2s linear infinite;-o-animation:loading 2s linear infinite;animation:loading 2s linear infinite}.fr-popup .fr-video-progress-bar-layer.fr-error>div.fr-loader{display:none}.fr-popup .fr-video-progress-bar-layer.fr-error>div.fr-action-buttons{display:block}.fr-video-overlay{position:fixed;top:0;left:0;bottom:0;right:0;z-index:2147483640;display:none}.fr-autoplay-margin{margin-top:0px !important}.fr-clearfix::after{clear:both;display:block;content:"";height:0}.fr-hide-by-clipping{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.fr-view img.fr-rounded,.fr-view .fr-img-caption.fr-rounded img{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-view img.fr-shadow,.fr-view .fr-img-caption.fr-shadow img{-webkit-box-shadow:10px 10px 5px 0px #cccccc;-moz-box-shadow:10px 10px 5px 0px #cccccc;box-shadow:10px 10px 5px 0px #cccccc}.fr-view img.fr-bordered,.fr-view .fr-img-caption.fr-bordered img{border:solid 5px #CCC}.fr-view img.fr-bordered{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.fr-view .fr-img-caption.fr-bordered img{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.fr-view li img.fr-dii.fr-fil{margin-right:20px}.fr-view{word-wrap:break-word}.fr-view span[style~="color:"] a{color:inherit}.fr-view strong{font-weight:700}.fr-view table[border='0'] td:not([class]),.fr-view table[border='0'] th:not([class]),.fr-view table[border='0'] td[class=""],.fr-view table[border='0'] th[class=""]{border-width:0px}.fr-view table{border:none;border-collapse:collapse;empty-cells:show;max-width:100%}.fr-view table td{min-width:5px}.fr-view table.fr-dashed-borders td,.fr-view table.fr-dashed-borders th{border-style:dashed}.fr-view table.fr-alternate-rows tbody tr:nth-child(2n){background:whitesmoke}.fr-view table td,.fr-view table th{border:1px solid #DDD}.fr-view table td:empty,.fr-view table th:empty{height:20px}.fr-view table td.fr-highlighted,.fr-view table th.fr-highlighted{border:1px double red}.fr-view table td.fr-thick,.fr-view table th.fr-thick{border-width:2px}.fr-view table th{background:#ececec}.fr-view table tfoot td{background:#ececec}.fr-view hr{clear:both;user-select:none;-o-user-select:none;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;break-after:always;page-break-after:always}.fr-view .fr-file{position:relative}.fr-view .fr-file::after{position:relative;content:"\1F4CE";font-weight:normal}.fr-view pre{white-space:pre-wrap;word-wrap:break-word;overflow:visible}.fr-view[dir="rtl"] blockquote{border-left:none;border-right:solid 2px #5E35B1;margin-right:0;padding-right:5px;padding-left:0}.fr-view[dir="rtl"] blockquote blockquote{border-color:#00BCD4}.fr-view[dir="rtl"] blockquote blockquote blockquote{border-color:#43A047}.fr-view blockquote{border-left:solid 2px #5E35B1;margin-left:0;padding-left:5px;color:#5E35B1}.fr-view blockquote blockquote{border-color:#00BCD4;color:#00BCD4}.fr-view blockquote blockquote blockquote{border-color:#43A047;color:#43A047}.fr-view span.fr-emoticon{font-weight:normal;font-family:"Apple Color Emoji","Segoe UI Emoji","NotoColorEmoji","Segoe UI Symbol","Android Emoji","EmojiSymbols";display:inline;line-height:0}.fr-view span.fr-emoticon.fr-emoticon-img{background-repeat:no-repeat !important;font-size:inherit;height:1em;width:1em;min-height:20px;min-width:20px;display:inline-block;margin:-.1em .1em .1em;line-height:1;vertical-align:middle}.fr-view .fr-text-gray{color:#AAA !important}.fr-view .fr-text-bordered{border-top:solid 1px #222;border-bottom:solid 1px #222;padding:10px 0}.fr-view .fr-text-spaced{letter-spacing:1px}.fr-view .fr-text-uppercase{text-transform:uppercase}.fr-view .fr-class-highlighted{background-color:#ffff00}.fr-view .fr-class-code{border-color:#cccccc;border-radius:2px;-moz-border-radius:2px;-webkit-border-radius:2px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background:#f5f5f5;padding:10px;font-family:"Courier New", Courier, monospace}.fr-view .fr-class-transparency{opacity:0.5}.fr-view img{position:relative;max-width:100%}.fr-view img.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}.fr-view img.fr-dib.fr-fil{margin-left:0;text-align:left}.fr-view img.fr-dib.fr-fir{margin-right:0;text-align:right}.fr-view img.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px));min-width:10px}.fr-view img.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px);min-width:5px}.fr-view img.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px);min-width:5px}.fr-view span.fr-img-caption{position:relative;max-width:100%}.fr-view span.fr-img-caption.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}.fr-view span.fr-img-caption.fr-dib.fr-fil{margin-left:0;text-align:left}.fr-view span.fr-img-caption.fr-dib.fr-fir{margin-right:0;text-align:right}.fr-view span.fr-img-caption.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px));min-width:10px}.fr-view span.fr-img-caption.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px);min-width:5px}.fr-view span.fr-img-caption.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px);min-width:5px}.fr-view .fr-video{text-align:center;position:relative}.fr-view .fr-video.fr-rv{padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden}.fr-view .fr-video.fr-rv>iframe,.fr-view .fr-video.fr-rv object,.fr-view .fr-video.fr-rv embed{position:absolute !important;top:0;left:0;width:100%;height:100%}.fr-view .fr-video>*{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;max-width:100%;border:none}.fr-view .fr-video.fr-dvb{display:block;clear:both}.fr-view .fr-video.fr-dvb.fr-fvl{text-align:left}.fr-view .fr-video.fr-dvb.fr-fvr{text-align:right}.fr-view .fr-video.fr-dvi{display:inline-block}.fr-view .fr-video.fr-dvi.fr-fvl{float:left}.fr-view .fr-video.fr-dvi.fr-fvr{float:right}.fr-view a.fr-strong{font-weight:700}.fr-view a.fr-green{color:green}.fr-view .fr-img-caption{text-align:center}.fr-view .fr-img-caption .fr-img-wrap{padding:0;margin:auto;text-align:center;width:100%}.fr-view .fr-img-caption .fr-img-wrap a{display:block}.fr-view .fr-img-caption .fr-img-wrap img{display:block;margin:auto;width:100%}.fr-view .fr-img-caption .fr-img-wrap>span{margin:auto;display:block;padding:5px 5px 10px;font-size:14px;font-weight:initial;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-opacity:0.9;-moz-opacity:0.9;opacity:0.9;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";width:100%;text-align:center}.fr-view button.fr-rounded,.fr-view input.fr-rounded,.fr-view textarea.fr-rounded{border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box}.fr-view button.fr-large,.fr-view input.fr-large,.fr-view textarea.fr-large{font-size:24px}.fr-view span.fr-img-caption.fr-dii.fr-fil,.fr-view p img.fr-dii.fr-fil{margin-right:15px}a.fr-view.fr-strong{font-weight:700}a.fr-view.fr-green{color:green}img.fr-view{position:relative;max-width:100%}img.fr-view.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}img.fr-view.fr-dib.fr-fil{margin-left:0;text-align:left}img.fr-view.fr-dib.fr-fir{margin-right:0;text-align:right}img.fr-view.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px));min-width:10px}img.fr-view.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px);min-width:5px}img.fr-view.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px);min-width:5px}span.fr-img-caption.fr-view{position:relative;max-width:100%}span.fr-img-caption.fr-view.fr-dib{margin:5px auto;display:block;float:none;vertical-align:top}span.fr-img-caption.fr-view.fr-dib.fr-fil{margin-left:0;text-align:left}span.fr-img-caption.fr-view.fr-dib.fr-fir{margin-right:0;text-align:right}span.fr-img-caption.fr-view.fr-dii{display:inline-block;float:none;vertical-align:bottom;margin-left:5px;margin-right:5px;max-width:calc(100% - (2 * 5px));min-width:10px}span.fr-img-caption.fr-view.fr-dii.fr-fil{float:left;margin:5px 5px 5px 0;max-width:calc(100% - 5px);min-width:5px}span.fr-img-caption.fr-view.fr-dii.fr-fir{float:right;margin:5px 0 5px 5px;max-width:calc(100% - 5px);min-width:5px}