/* Author: Glasshouse */
/* responsive version */

#facebox, #opaque {	
	top: 0;
	left: 0;
}
#opaque {
	position: fixed;	
	width: 100%;
	height: 100%;
	z-index: 99;
	display: none;
	background-color: black;
	filter: alpha(opacity=40);
	opacity: 0.4;
}
#facebox {
	position: absolute; /* was fixed */
	z-index: 400;
	text-align: left;
}
#facebox:focus {outline: none}
#facebox .popup {
	position: relative;
	padding: 10px 0 5px 10px;
	background: #fff;		
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.2);
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.2);
	box-shadow: 0 0 10px rgba(0,0,0,.2);	
}
#facebox .content {
	display: inline-block;	
}
#facebox #ResourceLibraryFilterWrapper .content {
	display: block;	
}
#facebox .add-existing-more {
  padding: 15px 0;
  text-align: center;
}
#facebox .loading {text-align: center;}
#facebox .image {text-align: center; max-width: 100%;}
#facebox .image img{max-width: 100%; box-sizing: border-box}
#facebox img {
	border: 0;
	margin: 0;
}
#facebox p, #facebox fieldset {padding: 5px 0}
#facebox .header {	
	width: 100%;
	min-height: 31px;
	position: relative;
	margin: -10px 0 0 -10px;
	padding: 10px 0 3px 10px;
	overflow: hidden;
	z-index: 10;
	float: left; /* FF */
}
#facebox .header + p {
	clear: both;
	margin-bottom: 0 0 -10px;
}
#facebox .facebox-content {
	padding: 10px 10px 5px 0;
	overflow-y: auto;
	clear: both; 	
	-webkit-overflow-scrolling: touch;
}
#facebox .facebox-content p:first-child {
	margin-top: 0;
}

#facebox .facebox-content p img:not(.icon):not(.captcha):not(.close_image), .logoWrapper img {
	float: left;
	margin: 0 15px 10px 3px;	
	max-width: 100%;
	height: auto;
}
#facebox .facebox-content p img.avatar {
	height: 48px;
	width: 48px;
}
#facebox .facebox-content .optionsRibbon {left: 0;}
#facebox .facebox-content .optionsRibbon img {margin: 0;}
#facebox .facebox-content .optionsRibbon a:not(.pickfiles) {height: 16px;}
/* Android default browser sprite overflow fix */
#facebox .facebox-content i {position: relative; z-index: 2; overflow: hidden;} 
#facebox .facebox-content .mce-listbox .mce-caret {position:absolute}
#facebox .facebox-content i:after {overflow: auto}

.mobile-app .facebox-content * {overflow: hidden}

/* Definition Lists */
#facebox .facebox-content dl {
	margin: 10px 15px 10px 10px;
}
#facebox .facebox-content dl dt {
	margin-top: 8px;
}
/* Error, Warning and Info Alerts */
#facebox .facebox-content.loginPopup .alert_block, .mobileLogin .frmLogin .alert_block {margin-bottom: 10px !important}
#facebox .alert_block {clear: both; margin: 0 10px 0 0; border-top: 10px solid #fff}
#facebox .alert_block p {padding: 0}

 /* FORMS */
#facebox .facebox-content label, #facebox .facebox-content fieldset legend, #facebox .labelGap {display: inline-block; width: 110px}
#facebox .labelGap {margin-right: 14px}
#facebox .facebox-content input[type="checkbox"] + label,
#facebox .facebox-content input[type="radio"] + label {
	width: auto;
}
#facebox .facebox-content input[type="text"], #facebox .facebox-content textarea, #facebox .facebox-content .optionsRibbon {
	width: 500px;	
}
#facebox .facebox-content input[type="text"].hasDatepicker { /* List separately for IE8 */
	width: 200px;	
}
#facebox .facebox-content hr {
	margin: 5px 0;
}
#facebox .footer {	
	background: #F4F4F4;
    clear: both;
    float: left;
    margin: 2px 0 -5px -10px;
    overflow: hidden;
    padding: 6px 10px 5px 0;
    position: relative;
    width: 100%;
	text-align: right;
}
#facebox .footer table {
	box-shadow: none;
	margin: 0;
}
#facebox .footer table th, #facebox .footer table td {
	border: 0;
	padding: 0;
}
#facebox .footer input + label {
	margin: 1px 0 0 11px;	
}
#facebox .footer input, #facebox .footer label {
	padding: 0;
	line-height: 17px;
	float: left;
	margin: 7px 0 0 0;
}
#facebox .footer label {
	margin: 0 10px; /* was 9px 10px 0 5px */
}
#facebox .footer span {
	margin: 6px 10px 0 5px;
	display: inline-block;
	float: left;
}
#facebox button:not(.not-btn), #facebox .link_button {
	margin: 0 0 0 3px;
	border-radius: 0;
	display: inline;
	padding: 0 6px;
	height: 28px;
	line-height: 28px
}
#facebox .footer .table-right input {float: right;}
#facebox .footer .table-right label {float: right; margin-right: 0;}
#facebox .footer table .button      {float: none;  margin: 0 2px;}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
	height: 10px;
	width: 10px;
	overflow: hidden;
	padding: 0;
}
#facebox_overlay_modal,
#facebox_overlay {
	position: fixed;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
}
.facebox_hide {
	z-index:-100;
}
.facebox_overlayBG {
	background-color: #1a517c;
	z-index: 100;
}
* html #facebox_overlay_modal,
* html #facebox_overlay {
	position: absolute;
 	height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#facebox .close {
	position: absolute;
	top: 5px;   right: 5px;	
	width: 15px; height: 15px;
	z-index: 15;
	border: 9px solid transparent;
}
#facebox .close {background: url('../images/icons/icons.svg') no-repeat top right}
#facebox .header h4, #facebox .header span {
	color: #fff;
}
#facebox .header h4 {
	padding: 0 0 7px 0;	
	max-width: 268px;
}
#facebox .header h4 span {
    /*margin-right: -40px;
	padding: 0 40px 0 0;*/
	max-width: 470px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;	
	display: block;
	-moz-box-sizing: border-box;
		 box-sizing: border-box;
}

#facebox #coupon_form select {position: relative; top: 1px}
#facebox #coupon_form select#coupon_discount_type {width: auto !important; display: inline-block !important}

/* Main site portal search form */
#facebox .searchPortalForm {overflow: hidden; padding: 3px}
#facebox .searchPortalForm input[type="text"] {width: 100%}
#facebox .searchPortalForm input[type="button"] {float: right; margin-right: 0}

/* Catalog page access code */
#facebox .facebox-content.xsml_popup input[type="password"] {width:100%; margin: 0}

/* Main Site Sign Up Form */
#facebox form#signup_form .facebox-content input[type="text"], #facebox form#signup_form .facebox-content select {
	width: 100%;
	-moz-box-sizing: border-box;
		 box-sizing: border-box;
	margin-right: 0;
}
#facebox form#signup_form .facebox-content input#captcha {width: 65%;}
#facebox form#signup_form .facebox-content input#captcha ~ img {vertical-align: middle;}

/* Portal Sign Up Form */
#facebox form#join_form .facebox-content label, #facebox form#join_form .facebox-content input[type="text"] {
	width: auto;
}

/* Add Resources Form */
#facebox div.facebox-resources-filter {width: 260px; clear: both; text-align: left; overflow: hidden;}
#facebox div.facebox-resources-filter p {margin: 0;}
#facebox div.facebox-resources-filter label {width: 115px; line-height: 36px; float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#facebox div.facebox-resources-filter select {margin: 4px 0; width: 50%; padding: 1px 4px; height: 28px;}
#facebox form#resources_form .facebox-content label {display: inline; margin-left: -2px;}	
#facebox form#resources_form .facebox-content.no-mlol label {margin-left: 0px;}	
#facebox form#resources_form .search-item i {margin: -3px 5px 0 0;}

/* User Listing Table */
#facebox .facebox-content table.userListingTable {
	margin: 0 0 -5px;
}
#facebox .facebox-content table.userListingTable td {
	border: 0;
}
#facebox .facebox-content table.userListingTable td img {
	float: none;
	margin: auto
}

/* Share */
#facebox .facebox-content.facebox_share a {word-wrap: break-word;}

/* Member Popup */
#facebox .name_search {
	background: url("../images/search-btn.gif") no-repeat 2px 1px #F4F4F4;
    border: 1px solid #d6d6d6;
    cursor: pointer;
    outline: none;
    width: 24px;
	height: 19px;
}
#facebox .member_block_heading td {
	border: 1px solid #d6d6d6;
	border-collapse: collapse;
	vertical-align: middle;
	padding: 3px;
}
#facebox .member_block_heading + .member_block_heading td {
	border-left: 0;
}
#facebox .member_block_heading td a {
	line-height: 15px; 
	display: inline-block;
    padding: 0 0 1px;
	margin: 0;
	width: 16px;
	float: left;
}
#facebox table.member_table + table.member_table td {
	border-left: 0;
	padding-left: 6px;
}
#facebox table.member_table td {
	border: 1px solid #d6d6d6;
	border-top: 0;
	border-collapse: collapse;
	padding: 5px;
	vertical-align: middle;
}
#facebox .member_table tr td:nth-child(2) {
	border-right: 0; 
	padding-right: 0;
}
#facebox .member_table tr td:nth-child(3) {
	border-left: 0; 
	padding-left: 0;
}
#facebox table.member_table td a {
	display: block;
	width: 113px;
    word-wrap: break-word;
	float: right;
}
#facebox table.member_table td img {
	float: left;
}
#facebox table.member_table input[type="checkbox"] {
	width: 13px;
	height: 13px;
}

/* School Portal Search Popup */
#facebox .schoolsFacebox.facebox-content {
	max-width: 400px;
}
	#facebox .schoolsFacebox.facebox-content .schoolsHolder {
		display: table;
		width: 100%;
	}
	#facebox .schoolsFacebox.facebox-content a {
		display: table-row;
	}
	#facebox .schoolsFacebox.facebox-content a > div {
		display: table-cell;
		vertical-align: middle;
		border-bottom: 1px solid #e2e0e0;
		padding: 13px 13px 9px 3px;
	}
	#facebox .schoolsFacebox.facebox-content a div.logoWrapper {
		max-width: 90px;
		height: 50px;
		text-align: center;			
	}
	#facebox .schoolsFacebox.facebox-content a div.logoWrapper img {
		margin: auto;
		box-shadow: none;	
		float: none;
	}
	#facebox .schoolsFacebox.facebox-content a div.logoWrapper + div {
		padding-right: 15px;
		padding-top: 9px;
		word-break: break-all;
		margin-top: -1px;
	}	
	#facebox .schoolsFacebox.facebox-content a:first-child > div {
		padding-top: 3px !important;
	}
	#facebox .schoolsFacebox.facebox-content a:last-child > div {
		border-bottom: 0;
		padding-bottom: 2px;
	}
	#facebox .schoolsFacebox.facebox-content + .footer span {
		font-size: 15px;
		margin: 2px 12px 3px;
	}

/* Toggle Expand / Contract */
a.toggleForm {
	display: inline-block;
	width: 100%;
	text-align: center;
	position: relative;
}
	a.toggleForm:before {
		border-top: 1px solid #C6C5C5;
		content: "";
		left: 0; top: 50%;
		position: absolute;    
		width: 99%;
	}
	a.toggleForm span {
		display: inline-block;
		background: #fff;
		position: relative;
		padding: 0 20px;
	}
	a.toggleForm i {
		margin-top: -4px;
	}
#remaining_toggleForm {
	display: none;
}

/* Help Centre */
#facebox .facebox-content.help_centre {overflow: hidden}
#facebox .help_centre .help_center_flex {display: flex; flex-flow: row wrap; justify-content: space-between}
#facebox .help_centre .contentBlock {width: 48.7%; margin-bottom: 20px; float: none; display: flex; align-items: center}
#facebox .help_centre .contentBlock:nth-child(1), #facebox .help_centre .contentBlock:nth-child(2) {margin-top: 10px}
#facebox .help_centre .contentBlock .sideImg img {vertical-align: bottom}
#facebox .help_centre .contentBlock .sideText *:first-child {line-height: 1.1; margin-bottom: 5px}

#facebox .facebox-content.help_centre form {
	text-align: right;
	padding-bottom: 12px;
}
#facebox .facebox-content.help_centre form input[type="text"] {
	width: 261px;
	margin: 0;
	padding: 3px 5px 2px;
	-webkit-border-radius: 0;
}
#facebox .facebox-content.help_centre form.search-form button:not(.not-btn) {
	margin: 0 0 0 -4px;
	border-radius: 0 3px 3px 0;
	height: 29px;
	vertical-align: top;
	position: relative;
}
#facebox .facebox-content.help_centre form i:after {left: -40px;}
#facebox .facebox-content.help_centre img.screenshot {float: none !important; border: 1px solid #cccccc; display: block; margin: 0 auto !important; box-shadow: none}

#facebox .facebox-content.help_centre .optionsRibbon {width: auto; left: 3px; top:0;}
#facebox .facebox-content.help_centre .optionsRibbon.mr0 {margin: 0;}
#facebox .facebox-content.help_centre .optionsRibbon a {height:auto;}
#facebox .facebox-content.help_centre .optionsRibbon + .clearfix.mobile_only {display: none;}

#facebox .facebox-content.help_centre .help_centre_content {overflow-y: auto; margin: 13px 0;}
#facebox:not(.portal):not(.edu2) .facebox-content.help_centre .help_centre_content p {padding-right: 8px; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box;}
#facebox .facebox-content.help_centre .help_centre_content p:last-child {margin-bottom: 0;}

/* Game */
.preview-game-badge {
  /*text-align: center;*/
}

.preview-game-badge div {
  display: inline-block;
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 5px;
  border: 1px solid #C6C5C5;
}

/* Tabbed nav */
#facebox ul.tabnav {margin: 1px 0 10px -7px; padding: 0 0 7px}
#facebox #Uploader ul.tabnav {margin-left: 0}/* upload file and upload image facebox */
#facebox #Uploader.uploader ul.tabnav {margin-right: 10px}/* upload image facebox */
#facebox #Uploader ul.tabnav .file_upload_settings a {margin-right: 0}

/* ------------------------ Badge creator ------------------------- */
#facebox #badge_form > div {position:relative;}
#facebox .badgeWrapper {min-height: 270px}
#facebox .badgeWrapper > p {
  height: 22px;
  text-align: center;
  padding: 0 0 10px 0 !important;
  margin-bottom: 0;
  border-bottom: 1px solid #e2e0e0;
}
.badgeHolder {
  width: 220px;
  position: relative;
  padding: 10px 0 0 0;
}
  .badgeHolder .finalMessage {margin: 220px 0 0 0;}
  .badgeHolder > div:not(.finalMessage), .badgeHolder .finalBanner p, .badgeHolder .finalBanner img, .badgeHolder .finalBanner div {
    position: absolute;
    width: 220px;
  }
  .badgeHolder .finalBanner p {
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-align: center;
    top: 170px;
    font-size: 15px;
    z-index: 3;
    padding: 5px 0 !important;
  }
  .badgeHolder .finalBanner img {z-index: 2; width: auto;}
  .badgeHolder .finalBanner div {z-index: 1}
  #facebox .badgeHolder .finalMessage p {
    height: 155px;
    padding: 0 15px;
    margin: 15px 0 0;
    overflow: auto;
  }

.badgeOptions {padding: 10px 15px;}
  .badgeOptions:not(.badgeOverview) {display: none;}
  .badgeOptions .owl-item {text-align: center;}
  .badgeOptions .owl-item a {
    display: inline-block;
    width: 90px; height: 90px;
    border-radius: 6px;
    overflow: hidden;
  }
  .badgeOptions .owl-item a img {
    width: 100%;
  }
  #facebox .badgeImages .owl-item a img {
    width: 126px; height: 126px;
    margin: -16px 0 0 -19px;
  }
  .badgeOptions .owl-theme .owl-controls .owl-buttons div {
    border-radius: 0;
    border: 1px solid #c8c8c8;
    background-color: transparent;
    padding: 5px 10px;
  }
  .badgeColors input {
    width: 200px;
    border: 1px solid #7e7e7e;
    padding: 4px 5px 5px;
  }
  #facebox .facebox-content .badgeText textarea {height: 123px; resize: none;}
  .badgeLibraryCheckboxes label:nth-child(7) {margin-left: 126px}

/* ------------------------ Assignment popup form------------------------- */
#facebox .assignment_pop .toggleForm { display: block; margin-top: -5px; margin-bottom: 3px; }
#facebox .assignment_pop label, #facebox .facebox-content.assignment_pop legend { width: auto; min-width: 50px; }
#facebox .assignment_pop .title_container label,
#facebox .assignment_pop label.min-w-80,
#facebox .assignment_pop legend.min-w-80 { min-width: 80px; }
#facebox .assignment_pop label.min-w-76,
#facebox .assignment_pop legend.min-w-76 { min-width: 76px; }
#facebox .assignment_pop #assignment_name { width: 688px; margin-right: 0; }
#facebox .assignment_pop span.max-info { margin-right: 21px; }
#facebox .assignment_pop #timer input { padding: 0px 5px; }
#facebox .assignment_pop .modal-textarea {}
#facebox .assignment_pop .modal-textarea p { padding: 0; margin: 0 0 5px; }
#facebox .class_pop hr, #facebox .assignment_pop hr { display: block; height: 1px; border: 0; border-top: 1px dashed #C6C5C5; padding: 0; margin-bottom: 0; }
#facebox .class_pop hr { margin-bottom: 8px; }
input#randomize + label { min-width: 20px !important; }
#facebox .assignment_pop #assignment_width, #facebox .assignment_pop #assignment_height {width: 100px;}
#facebox .assignment_pop label[for*="items_to_sync_"] { width: 200px !important;}
#facebox .assignment_pop input#assignment_gateway {width: 20px}

#facebox table.attendance span {display: none}

.oneLine {
  clear: both;
  overflow: hidden;
  margin-top: 15px;
}
	.oneLine p {
	  display: block;
	  float: left;
	  margin-top: 0;
	}

/* ----------------- Minor tweak for the Import Qty/Ccf popup ----------------- */
#UploadCCF {
  min-width: 0 !important;
}
#UploadCCF .optionsRibbon, #UploadQTI .optionsRibbon {
  width: 99%!important;
  margin: 0 auto;
  display: block;
  height: auto;
}

/* ----------------- Language Selection Form ----------------- */
#facebox form.langForm .facebox-content {		
	padding-left: 5px;
}
#facebox form.langForm .facebox-content div {	
	padding: 4px 0;
	height: 24px;
	position: relative;
}
#facebox form.langForm .facebox-content img {
	margin: 7px 0 0 22px;
	position: absolute;
	width: 16px;
}
#facebox form.langForm .facebox-content input[type="radio"] + label:before {
    margin-right: 28px;
}

/* ----------------- New Tool Provider select overwrite default 180px width ----------------- */
.tp-select-facebox { width: auto; }

/* ----------------- People Picker ----------------- */
#facebox #PeoplePicker .people_scroller {overflow: auto}
#facebox #PeoplePicker .half#people_selected {overflow: hidden}
#facebox .section-intro {padding: 0 10px; overflow: hidden}
#facebox .section-intro .contentBlock {margin-bottom: 10px}
#facebox .section-intro .contentBlock .sideText p {width: auto}
#facebox .section-intro .contentBlock .sideText p.number {line-height: 1.3; width: 30px; margin-top: -15px !important}
#facebox .section-intro .contentBlock .sideText p:not(.number) {padding-left: 50px}
#facebox .section-intro .contentBlock .sideImg {margin-bottom: 4px}
#facebox .section-intro .contentBlock .sideImg img {border: 1px solid #c7c7c7}

/* ----------------- Proficiency Picker ----------------- */
#facebox #ProficiencyPicker .proficiency_scroller {overflow: auto}
#facebox #ProficiencyPicker .half#proficiency_selected {overflow: hidden}

/* ----------------- Assignment three columns ----------------- */
#facebox .columns-display { overflow: hidden; clear: both; padding: 0 4px; /* spacing for focus shadow */}
#facebox .columns-display br { display: none; }
#facebox .columns-display label { width: 100%; margin-bottom: 2px; font-size: 14px; }
#facebox .columns-display .title_container input { width: 100% !important; }

#facebox .columns-display .column { height: 135px; float: left; border-right: 1px solid #E2E0E0; }
#facebox .columns-display .column.auto-height { height: auto; }
#facebox .columns-display .column > div { margin-bottom: 10px; height: 55px; }
#facebox .columns-display .column > div#duration { margin-bottom: 0; height: auto; }
#facebox .columns-display .column > div#duration > div { margin-bottom: 10px; height: 55px; }
#facebox .columns-display .column p { margin: 0; padding: 0; }
#facebox .columns-display .column div.half { width: 45%; margin-right: 5%; float: left; }
#facebox .class_pop .columns-display .column div.half:nth-child(2) { width: 45%; margin-right: 0%; margin-left: 4%; float: left; }
#facebox .columns-display .column div.half.max-submissions { width: 53%; margin-right: 4%; float: left; }
#facebox .columns-display .column div.half.max-submissions + div.half { width: 42%; margin-right: 0; float: left; }
#facebox .columns-display .column select { width: 100%; margin-right: 0; }
#facebox .columns-display .column input { width: 100%; margin-right: 0; }
#facebox .columns-display .column textarea { width: 100%; margin-right: 0; }

#facebox .columns-display .column input + label { margin-top: 5px; }
#facebox .columns-display .column #threshold input { height: 27px; }

#facebox .columns-display .column div .half label { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

#facebox .columns-display .column.one input { width: 80px; margin-right: 0; }
#facebox .columns-display .column.one div:nth-child(2) p label { display: block; width: 100%; }
#facebox .columns-display .column.three input#assignment_begin_at,
#facebox .columns-display .column.three input#assignment_end_at { width: 100%; }
#facebox .columns-display .column.four div p { margin: 0; padding: 0; }

#facebox .columns-display .column.one { width: 23%; padding-right: 1.5%; }
#facebox .columns-display .column.two { width: 21%; padding-left: 1.5%; padding-right: 1.5%; }
#facebox .columns-display .column.three { width: 23%; padding-left: 1.5%; padding-right: 1.5%; }
#facebox .columns-display .column.four { width: 23%; padding-left: 1.5%; border-right: 0 none; }

#facebox .columns-display .column.indie { height: auto; }
#facebox .columns-display .column.one.cols1 { width: 100%; border: 0; }

#facebox .columns-display .column.one.cols2 { width: 46%; padding-right: 3.8%; }
#facebox .columns-display .column.two.cols2 { width: 46%; padding-left: 3.8%; padding-right: 0; border-right: 0 none; }

#facebox .columns-display .column.one.cols3 { width: 30%; padding-right: 3%; }
#facebox .columns-display .column.two.cols3 { width: 27%; padding-left: 3%; padding-right: 3%; }
#facebox .columns-display .column.two.cols2 input[type="text"].hasDatepicker,
#facebox .columns-display .column.two.cols3 input[type="text"].hasDatepicker { width: 100%; }
#facebox .columns-display .column.three.cols3,
#facebox .columns-display .column.four.cols3 { width: 30%; padding-left: 3%; padding-right: 0; border-right: 0 none; }

#facebox .columns-display + .modal-textarea p { font-size: 14px; }

#facebox .columns-display .group-name p,
#facebox .columns-display .group-description p {
  padding-top: 0;
}

#facebox .columns-display .group-description p {
  margin-bottom: 5px;
}

#facebox .columns-display .group-name input,
#facebox .columns-display .group-description textarea {
  width: 100%;
}

/* Gradebook popup */
#facebox .gradebook_column_width input {width: auto !important}

#facebox .grading-thread-comment-list {margin: 0 0 10px !important}
#facebox .grading-thread-comment-list .comment .content {display: block}
#facebox .grading-thread-comment-textarea {margin: 0 0 3px}
#facebox .avatarHolder img.avatar {border-radius: 50%; border: 1px solid #e2e2e2}
#facebox  table.rubric tr td {font-size: 13px}

@media only screen and (max-width: 459px) {
	#facebox, #facebox.popup, #faceboxContent {width: 100%;}
	
	#facebox #complete_signup input#school_subdomain {width: 139px !important}
	#login-form-popup .difSignIn, #facebox .frmLogin .difSignIn {
		padding-right: 0;
	}

	.badgeHolder {margin: auto;}
	.badgeOptions {padding: 10px 0;}
  .badgeOptions .owl-item a {width: 50px; height: 50px;}
  #facebox .badgeImages .owl-item a img {width: 70px; height: 70px; margin: -8px 0 0 -10px;}
}
@media only screen and (min-width: 460px) { 	
	#facebox .facebox-content, #facebox div.error {width: 420px;}
	#facebox .facebox-content.help_centre .help_centre_content.help_overview {padding-right: 8px;}

	/* Main Site */
	#facebox form#signup_form .facebox-content, #facebox .header.signup_form ~ #alerts, #facebox .header.signup_form ~ div.error {width: 400px;}
	#facebox form#signup_form .facebox-content input#captcha {width: 310px;}
	
  .badgeHolder {width: auto; height: 240px; padding: 10px 15px 0;}
  .badgeHolder .finalMessage {margin: 30px 0 0 250px}
  #facebox .facebox-content .badgeOptions input, #facebox .facebox-content .badgeOptions textarea {width: 290px; margin-right: 0;}

	#facebox .row.col-2 > div {width: 48%; display: inline-block}
	#facebox .row.col-2 > div:first-child {margin-right: 4%}
	#facebox .row.col-2 > div:last-child {margin-left: -4px}
}
@media only screen and (max-width: 479px) {
	/* People Picker */
	#facebox .section-intro .contentBlock .sideText {margin-top: -123px}
	#facebox .section-intro .contentBlock .sideText p.number {margin: 42px 0 60px 210px !important}
	#facebox .section-intro .contentBlock .sideText p:not(.number) {padding: 0}
}
@media screen and (min-width: 560px) {		
	/* Global */
	#facebox .facebox-content, #facebox #alerts, #facebox div.error {width: 500px;}
	#facebox .loginPopup #alerts{width: auto}
	#facebox .header h4 {font-size: 19px; max-width: 468px;}	
	#facebox form.langForm .facebox-content div {width: 50%; float: left;}
	#facebox ul.tabnav li .dropDown {right: 5px;}
	/* Logged In */
	#facebox form#enroll_form .facebox-content, #facebox form#group_join_form .facebox-content,
	#facebox .header.access_code ~ #alerts, #facebox .header.access_code ~ div.error {width: 342px;}
	#facebox .header.access_code h4 {width: 310px}
	#facebox .facebox-content.facebox_share, #facebox div.facebox-resources-filter {width: 500px;}
}
@media screen and (min-width: 769px) {  
	/* Global */
	#facebox .facebox-content, #facebox #alerts, #facebox div.error, #facebox div.facebox-resources-filter {width: 700px;}  
	#facebox .loginPopup #alerts{width: auto}
	#facebox .header h4 {max-width: 668px;}
	#facebox form.langForm .facebox-content div {width: 33%;}
	#facebox .facebox-content.sml_popup {width:500px}
    #facebox .facebox-content.xsml_popup {width:400px !important}
	#facebox .facebox-content.xl_popup, #facebox .facebox-content.xxl_popup {width:700px;}
	#facebox .header.sml_popup h4 {width: 468px}
    #facebox .header.xsml_popup h4 {width: 368px}
	/* Portal */
	#facebox form#join_form .facebox-content, #facebox .header.join_form ~ #alerts, #facebox .header.join_form ~ div.error {width: 615px;}  
	/* Logged In */
	#facebox form#class_list .facebox-content, #facebox .header.class_list ~ #alerts, #facebox .facebox-content select.fullWidth {width: 500px;}
	#facebox .header.class_list h4 {width: 468px;}
	#facebox form#class_form .facebox-content, #facebox .header.class_form ~ #alerts, #facebox .header.class_form ~ div.error {width: 730px;}
	#facebox .header.class_form h4 {width: 638px;}
	#facebox .facebox-content.assignment_list, #facebox form#enroll_form .facebox-content, #facebox form#group_join_form .facebox-content {width:600px;}

	#facebox #badge_form ul.tabnav {padding-right: 240px;}
	.badgeWrapper {position: absolute; top: 10px; right: 0;}
	body:not(.portal):not(.edu2) #facebox .facebox-content .badgeWrapper > p {padding: 4px 15px 13px !important; width: auto !important; border-bottom: 0;} 
	.badgeWrapper .badgeHolder {width: 220px; height: 400px; border-left: 1px solid #e2e0e0;}
	.badgeWrapper .badgeHolder .finalMessage {margin: 230px 0 0 0;}
	.badgeOptions {height: 374px; margin-right: 230px;}
}
@media screen and (max-width: 600px) {
  #facebox .assignment_pop .columns-display .column.one,
  #facebox .assignment_pop .columns-display .column.two,
  #facebox .assignment_pop .columns-display .column.three,
  #facebox .assignment_pop .columns-display .column.four { width: 45%; padding: 0; border: 0; }
  
  #facebox .assignment_pop .columns-display .column.one,
  #facebox .assignment_pop .columns-display .column.three { padding-right: 4% }
  
  #facebox .assignment_pop .columns-display .column.two,
  #facebox .assignment_pop .columns-display .column.four { padding-right: 4% }
}
@media screen and (max-width: 979px) {
	/* Resets for tags in logged-in view */
	body:not(.portal):not(.edu2) #facebox .facebox-content label, #facebox .labelGap,
    body:not(.portal):not(.edu2) #facebox .facebox-content legend {display: block; width: 100% !important;}
	body:not(.portal):not(.edu2) #facebox .facebox-content input[type="checkbox"]:not(.emptyLabel) + label, 
	body:not(.portal):not(.edu2) #facebox .facebox-content input[type="radio"]:not(.emptyLabel, [name="language"]) + label {line-height: 30px;}
	body:not(.portal):not(.edu2) #facebox .facebox-content .search-item input[type="radio"]:not(.emptyLabel) + label {line-height: 21px;}
	#facebox #faceboxContent span.max-info + label,
	body:not(.portal):not(.edu2) #facebox .facebox-content select + label, 			
	body:not(.portal):not(.edu2) #facebox .facebox-content [type="checkbox"] + label + label,
	body:not(.portal):not(.edu2) #facebox .facebox-content input[type="hidden"] + label {margin-top: 10px;}	/* type=hidden for Lesson and Quiz assignment popups */
	
	body:not(.portal):not(.edu2) #facebox #complete_signup input[type="password"] {width: 500px;}
	body:not(.portal):not(.edu2) #facebox #complete_signup input[type="password"],
	body:not(.portal):not(.edu2) #facebox .facebox-content input[type="text"], 
	body:not(.portal):not(.edu2) #facebox .facebox-content input[type="file"],
	body:not(.portal):not(.edu2) #facebox .facebox-content textarea,
	body:not(.portal):not(.edu2) #facebox .facebox-content legend,
	#facebox .facebox-content:not(.help_centre) .optionsRibbon {max-width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; margin: 0;}
	body:not(.portal):not(.edu2) #facebox .facebox-content select, #facebox .facebox-content input[type="text"].hasDatepicker {width: 100% !important; display: block;}
	body:not(.portal):not(.edu2) #facebox .facebox-content p, #facebox #complete_signup p {width: 100% !important; padding: 0;}
	
	#facebox form label br{display:none}
	
	#facebox .facebox-content p.mb0 + p.mt0, 
	#facebox .facebox-content #assignmentScore + label, 
	#facebox form#resources_form .facebox-content .search-item {margin-top: 10px}
	/*#facebox .facebox-content .optionsRibbon {margin-left: 3px; width: auto;}	*/

	.tabnav_stripe #facebox ul.tabnav {margin-left: 0}

	/* Attendance Table */
	#facebox table.attendance, #facebox table.attendance tr, #facebox table.attendance td, #facebox table.attendance span {display: block; text-align: left;}
	#facebox table.attendance th, #facebox table.attendance td.highlight {display: none;}
	#facebox table.attendance td {line-height: 20px; height: auto; border-width: 0; padding: 5px 0;}

	#facebox .help_centre .contentBlock {padding: 10px 15px; width: 100%;}
	#facebox .help_centre .contentBlock:nth-child(1), #facebox .help_centre .contentBlock:nth-child(2) {margin-top: 0;}
	#facebox .help_centre .contentBlock, #facebox .help_centre .contentBlock:nth-child(2n+2), #facebox .help_centre .contentBlock:nth-last-child(2) {margin-bottom: 10px}
	#facebox .help_centre .contentBlock:last-child {margin-bottom: 0}
	#facebox .help_centre .help_centre_content img {height: auto !important}
	
	/* People Picker */
	#facebox .section-intro .contentBlock .sideText p.number {width: 30px !important; line-height: 30px; display: block}
	#facebox .section-intro .contentBlock .sideText p:not(.number) {width: auto !important}
}
@media screen and (min-width: 980px) {
	/* Global */
	#facebox .facebox-content {overflow-y: auto; -webkit-overflow-scrolling: touch; max-height: 585px}
    #facebox .facebox-content.no_max_height {max-height: 100%}
	#facebox #faceboxContent, #facebox #alerts, #facebox div.error {width: auto;}
	#facebox .header h4 {max-width: 100%;}
	#facebox form.langForm .facebox-content {width: 820px;}
	#facebox form.langForm .facebox-content div {width: 205px;}	
	#facebox ul.tabnav {margin: 1px 0 10px; padding: 0 7px 7px;}
	.tabnav_stripe #facebox ul.tabnav {padding-left: 0; padding-right: 0}
	#facebox .facebox-content.xl_popup {width:820px}
	#facebox .facebox-content.xxl_popup {width:950px;}
	
	/* Logged In */
	#facebox form#assignment_form .facebox-content {width:850px;}
	#facebox .facebox-content.help_centre {width:940px;}
	#facebox .facebox-content.help_centre .hc-topic-icon-title {margin-bottom: 0}
	#facebox .facebox-content.help_centre .hc-topic-icon-title i {margin-top: -8px;}
	#facebox .facebox-content.help_centre .hc-topic-icon-title a {font-size: 20px;}
	#facebox .facebox-content.help_centre .hc-topic-description {padding-left: 24px; height: 42px; overflow: hidden;}
	#facebox .facebox-content.help_centre form.search-form {margin: 0 17px 0 0; float: right;}
	#facebox .facebox-content.help_centre form.search-form input[type="text"] {width: 145px;}
	#facebox .facebox-content.help_centre .help_centre_heading {padding: 13px 17px;}
	#facebox .facebox-content.help_centre .help_centre_content {margin: 13px 17px;}
	#facebox .facebox-content.help_centre .help_centre_content.help_overview {margin: 13px 0; padding: 0 17px 5px;}
	#facebox .facebox-content.help_centre .help_centre_content .optionsRibbon {margin-left: -2px;}
	#facebox .facebox-content.help_centre .help_centre_content .hc-edit {text-align: left !important; width: 99.5%;}

	#facebox div.facebox-resources-filter, #facebox form#resources_form .facebox-content {width: 775px;}
	#facebox div.facebox-resources-filter label {width: auto; margin: 0 3px 0 0;}
	#facebox div.facebox-resources-filter select {width: 140px; margin-bottom: 12px; float: left}
	#facebox div.facebox-resources-filter select:not(#resource_library) {margin-right: 19px;}

    #facebox .facebox-content .row.col-2 input[type="text"], #facebox .facebox-content .row.col-2 label {width: 100%; margin-right: 0}
	
	#facebox .halfColumnForm {width: 323px; float: left; margin-top: 0;}
	#facebox .halfColumnForm input[type="text"] {width: 180px;}
  
	#facebox #ResourceLibraryFilterWrapper .facebox-content {max-height: 435px; width: auto; max-width: 775px;}
}
@media screen and (min-width: 1280px) {
	#facebox .facebox-content.help_centre {width:1033px;}
	#facebox .facebox-content.xxl_popup {width:1100px;}
}