body {
	width: 100%;
}


.panel {
	width: 100%;
	margin: 35px auto;
	background-color: white;
	box-shadow: 2px 2px 10px #888;
}

.panel h1 {
	height: 70px;
	line-height: 70px;
	color: white;
	background-color: #6DB102;
	text-align: center;
	font-size: 45px;
	font-weight: normal;
}

.panel .copy {
	padding: 20px;
}

.big {
	font-size: 24px;
}

.medium {
	font-size: 18px;
}

.button {
	display: inline-block;
	line-height: 31px;
	padding-left: 14px;
	padding-right: 14px;
	color: white;
/*	background-image: url("/assets/images/index-button.gif");
	background-repeat: repeat-x;*/
	white-space: nowrap;
}

/* RR ADD BELOW */ 
#intro-wrapper:before {
  content: "";
  background-color : #0e2D6B;
	
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -2;  
}

#intro-wrapper {
	width: 100%;
	position : relative;
	background-position:center top;
/*	background-size: 2000px 1000px;
	background-color: rgba(0, 100, 200, 0.28);
	-webkit-background-size: 2000px 1000px;*/
	/*height : 2000px;*/
	height : 1000px;
	height : calc(100vh - 82px);
	height : -webkit-calc(100vh - 82px);
}
#intro-wrapper:after {
  content: "";
  background: url("//assets.artofproblemsolving.com/images/background_try.jpg");
  opacity: 0.07;
  background-size : cover; 
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;   
}

/*
#intro-wrapper {
	width: 100%;
	background-position:center top;
	background-size: 2000px 1000px;
	-webkit-background-size: 2000px 1000px;
	height : 2000px;
}
*/

#intro-wrapper .aops-scroll-outer {
	height: 200px;
	width: 1040px;
	margin: auto;
	overflow: hidden;
}

#intro-wrapper .aops-scroll-bar {
	height : 100%;
	width : 10px;
	background-color : #aaa;
	right : 0px;
}

#intro-wrapper .aops-scroll-slider {
	width : 10px;
	background-color : #f88;
}

#intro-wrapper .aops-scroll-inner {
	height : 200px;
	overflow: hidden;
}

#intro-wrapper .aops-scroll-content {
	overflow: hidden;
}

#intro {
	max-width: 1040px;
	margin: auto;
	padding: 15px;
	overflow: hidden;
	position : relative;
}

#intro-wrapper .shout-box {
	margin-left: 3%;
	margin-right: 2%;
	background-color: white;
	width: 300px;
	display : inline-block;
	vertical-align : top;
	text-align : left;
	box-shadow: 5px 5px 10px rgba(6, 20, 60, 1);
}

@media( max-width : 680px ) {
	#intro-wrapper .shout-box {
		margin-left: 2%;
		margin-right: 1%;
	}
}

/* The front page needs a darker shadow on the dropdowns */
.dropdown-menu {
	box-shadow: 5px 5px 10px rgba(6, 20, 60, 1) !important;
}



#first-line {
	font-size : 60px;
	position : absolute;
	font-weight : bold;
	line-height : 70px;
	top : 8%;
	width : 100%;
	color : #9fcfff;
	text-align : center;
	text-shadow : 5px 5px 10px rgba(6, 20, 60, 1);
}

#second-line {
	top : 19%;
	width : 100%;
	font-size:36px;
	line-height:42px;
	position : absolute;
	text-align : center;
	
}

#second-line .subtext {
	color:white;
	text-align:center;
	position : relative;
	text-shadow: 5px 5px 10px rgba(6, 20, 60, 1);
}

#shout-boxes {
	top : 40%;
	width : 100%;
	position : absolute;
	text-align : center;
}

#intro-wrapper a.heading-link:hover,
#school-wrapper a.heading-link:hover,
#store-wrapper a.heading-link:hover,
#community-wrapper a.heading-link:hover {
	text-decoration : none;
}

#intro-wrapper .shout-box h1 {
	height: 50px;
	text-align: center;
	background-color: #6CB001;
	line-height: 50px;
	color: white;
	font-size: 20px;
	margin: 0;
	font-weight: bold;
}

#intro-wrapper .shout-box.textbooks h1 {
	background-color: #018345;
}
#intro-wrapper .shout-box.community h1 {
	background-color: #356CB5;
}

#intro-wrapper .shout-box .inner {
	height: 190px;
	padding: 15px;
}

#intro-wrapper .shout-box .copy {
	height: 120px;
	font-size: 16px;
}

#intro-wrapper .shout-box a.button {
	display: block;
	line-height: 40px;
	color: white;
	text-align: center;
	font-weight: bold;
	width: 93%;
	margin: auto;
	background-color: #214BA1;
	font-size: 15px;
	padding: 0;
}

#intro-wrapper .shout-box a.button:hover {
	background-color : #3276b1;
	text-decoration : none;
}

#intro-wrapper .shout-box.school a.button:after {
	content: "LEARN ABOUT OUR SCHOOL"
}

#intro-wrapper .shout-box.textbooks a.button:after {
	content: "EXPLORE OUR BOOKSTORE"
}

#intro-wrapper .shout-box.community a.button:after {
	content: "VISIT OUR COMMUNITY"
}


#intro-wrapper .shout-box.resources {
	display: none;
}

#intro-wrapper .shout-box.resources h1 {
	background-color: #1F3D7B;
}

@media (max-width : 720px) {
	#first-line {
		font-size : 50px;
	}
	
	#second-line { 
		font-size : 32px;
		line-height : 38px;
	}


}

@media (max-width: 660px) {
	#intro-wrapper .shout-box {
		display : block;
		width: 80%;
		margin: 0 auto;
	}
	#intro-wrapper .shout-box .inner {
		display: none;
	}
	
	#first-line {
		font-size : 44px;
		line-height : 52px;
	}
	
	#second-line { 
		font-size : 28px;
		line-height : 32px;
	}
	
	#intro .line2, #intro .line3 {
		font-size: 32px;
	}
	
	#intro-wrapper .shout-box.resources {
		display: block;
	}
}



@media (max-width : 520px) {
	#first-line {
		font-size : 38px;
		line-height : 44px;
	}
	
	#second-line { 
		font-size : 24px;
		line-height : 28px;
	}
}



@media (max-width : 450px) {
	#first-line {
		font-size : 34px;
		line-height : 40px;
		top : 5%;
	}
	
	#shout-boxes {
		top : 30%;
	}
	
	#second-line { 
		font-size : 20px;
		line-height : 24px;
		top : 15%;
	}
}


@media (max-width : 410px) {
	#first-line {
		font-size : 30px;
	}
	
	#second-line { 
		font-size : 18px;
		line-height : 22px;
	}
	
	#shout-boxes {
		top : 28%;
	}
}


@media (max-width : 375px) {
	#first-line {
		font-size : 24px;
	}
	
	#second-line { 
		font-size : 14px;
		line-height : 18px;
	}
	
}


#intro-wrapper .shout-box .icon {
	float: right;
	background-image: url("/assets/images/sprite-sheet.gif");
	margin-left: 5px;
}

#intro-wrapper .icon {
	width : 100px;
	height : 100px;
}

#intro-wrapper .shout-box .school-icon {
	background-image: url("//assets.artofproblemsolving.com/images/school.png");
}

#intro-wrapper .shout-box .textbooks-icon {
	background-image: url("//assets.artofproblemsolving.com/images/bookstack.png");
}

#intro-wrapper .shout-box .community-icon {
	background-image: url("//assets.artofproblemsolving.com/images/community.png");
}

#intro-wrapper .footer {
	margin-top: 25px;
	text-align: center;
	color : white; /*#dae7f6;*/
	font-weight: bold;
	left : 50%;
	width : 200px;
	margin-left : -100px;
	position : absolute;
	bottom : 18px;
	cursor : pointer;
}

#intro-wrapper .footer:hover {
	text-decoration: underline;
}

.hide-arrow .footer {
	display : none;
}

#intro-wrapper .scroll-more {
	background-image : url("//assets.artofproblemsolving.com/images/scroll_for_more.png");
	width : 120px;
	height : 15px;
	margin : 0 auto;
}


@media (max-width:1024px) {
	#books-carousel li {
		margin-right: 15px;
	}
}




#community-panel-wrapper {
	
}

.community-top-content {
	margin : 0 28px;
}

#community-panel {
	background-color : white;
	padding-bottom : 15px;
}

#community-panel .copy {
	padding : 0 14px 8px 14px;
}

#community-panel h1 {
	background-color: #1e6cce;
}

#community-panel .medium {
	font-size : 15px;
	margin-top : 14px;
}

#community-panel .contests-block {
	position : relative;
}

#community-panel .contests-block div {
	display : inline-block;
	vertical-align : top;
	position : relative;
}

#community-panel .contests-block .copy{
	width : calc(100% - 160px);
}

#community-panel .cmty-folder-grid .cmty-category-cell {
	width : 564px;
}

@media (max-width : 1270px) {
	#community-panel .cmty-folder-grid .cmty-category-cell {
		width : 439px;
	}
	
	.cmty-category-cell-num-users {
		display : none;
	}
}

@media (max-width : 1020px) {
	#community-panel .cmty-folder-grid .cmty-category-cell {
		width : 394px;
	}
	

}

@media (max-width : 930px) {
	#community-panel .cmty-folder-grid .cmty-category-cell {
		width : 349px;
	}
	.cmty-category-cell-num-posts {
		display : none;
	}
	
	.cmty-category-cell-num-users {
		display : inline-block;
	}
}

@media (max-width : 840px) {
	#community-panel .cmty-folder-grid .cmty-category-cell {
		width : calc(100% - 20px);
		width : -webkit-calc(100% - 20px);
	}
	
	.cmty-category-cell-num-posts {
		display : inline-block;
	}
	
	.cmty-category-cell-num-users {
		display : inline-block;
	}
}

#community-panel .cmty-category-cell-numbers {
	width : 100%;
}

@media (max-width : 570px) {
	.cmty-category-cell-num-users,
	.cmty-category-cell-last_post_time{
		display : none;
	}
	
	.community-top-content {
		margin : 0 14px;
	}
}


#community-panel .cmty-category-cell-last_post_time {
	float : right;
	margin-right : 6px;
}

#community-panel .cmty-category-cell-bottom {
	height : 48px;
}

#community-panel .cmty-category-cell-num-users {
	margin-right : 10px;
}

#community-panel .comm-c3 .cmty-category-cell-heading {
	background-color : #f90;
	color : #fff5d4;
}


#community-panel .comm-c4 .cmty-category-cell-heading {
	background-color : #e75400;
	color : #ffe7cc;
}


#community-panel .comm-c5 .cmty-category-cell-heading {
	background-color : #008fd5;
	color : #d9effd;
}

#community-panel .comm-c6 .cmty-category-cell-heading {
	background-color : #029386;
	color : #e1fff2;
}


#community-panel .comm-c7 .cmty-category-cell-heading {
	background-color : #511e8f;
	color : #f2e6fe;
}

#community-panel .comm-c10 .cmty-category-cell-heading {
	background-color : #a90008;
	color : #ffe4e1;
}


#community-panel .comm-c3 .aops-font,
#community-panel .comm-c3 .cmty-category-cell-number  {
	color : #f90;
}

#community-panel .comm-c4 .aops-font,
#community-panel .comm-c4 .cmty-category-cell-number {
	color : #e75400;
}

#community-panel .comm-c5 .aops-font,
#community-panel .comm-c5 .cmty-category-cell-number {
	color : #008fd5;
}

#community-panel .comm-c6 .aops-font,
#community-panel .comm-c6 .cmty-category-cell-number {
	color : #029386;
}

#community-panel .comm-c7 .aops-font,
#community-panel .comm-c7 .cmty-category-cell-number {
	color : #511e8f;
}

#community-panel .comm-c10 .aops-font,
#community-panel .comm-c10 .cmty-category-cell-number {
	color : #a90008;
}


#community-panel .cmty-category-cell-heading:hover {
	color : #fff;
}

#community-panel .header {
	position : relative;
}

#community-panel .header .button {
	position : absolute;
	right : 5px;
	top : 10px;
	margin-right:5px;
}

#community-panel .header .header-copy {
	margin-left: 8px;
	text-align : left;
	margin-bottom:18px;	
	position : relative;
	width : calc(100% - 228px);
	width : -webkit-calc(100% - 228px);
}

@media (max-width: 570px) {
	#community-panel .header .button {
		text-align: center;
		position : relative;
		right : auto;
		top : auto;
		margin-bottom: 15px;
	}
	
	#community-panel .header {
		text-align : center;
	}
	#community-panel .header .header-copy {
		margin: 0;
		margin-bottom: 10px;
		margin-top : 10px;
		/*text-align: center;*/
		width: 100%;
		float: none;
	}	
}

#community-panel .cmty-front-data-row {
	text-align : center;
	font-size : 18px;
}


#other-panel-wrapper {
	background-color: #757A80;
}

#other-panel {
	margin: 30px auto;
	width: 100%;
	max-width: 1000px;
}

#other-panel h2 {
	padding-top: 10px;
	color: white;
	font-size: 20px;
}

#other-panel .col1 {
	float: left;
	width: 640px;
	margin-right: 40px;
}

#other-panel .col2 {
	float: left;
	width: 320px;
}

#other-panel .quote-wrapper {
	color: white;
	font-size: 20px;
	float: left;
	width: 100%;
	text-align: center;
	margin: 20px auto;
}

#other-panel .quote {
	width: 60%;
	margin: auto;
}


.select2-container .select2-choice {
	height : 32px;
	line-height: 32px;
}

.select2-container .select2-choice .select2-arrow b {
	background-position : 0 3px;
}

/** START RR add-ons **/

/**
 * E: Main content
 */
.header-box {
	margin-top : 20px; 
}

.shadow-wrapper {
	max-width : 1230px;
	width : 1230px;
	margin: 0 auto;
	box-shadow : 2px 2px 10px #888;
}

.index-content {
	width : 100%;
	max-width : 100%;
}

.index-content .aops-panel {
	margin-top : 0px;
	border-top : 0px;
	box-shadow : none;
}

.index-content .title {
	display : none;
}

.index-content .button {
	background-image : none;
}

.header-box:hover .header-title {
	text-decoration : underline;
}

.header-box.no-hover .header-title {
	text-decoration: none;
}

.community-box .round-dropdown:before {
	content : "";
	color : #356cb5;
	cursor : default;
	font-size : 16px;
	transform : none;
}

/** Also in community_common.css **/
.cmty-user-admin:before {
	content : 'X';
	font-family : AoPS !important;
	margin-right : 1px;
	font-style : normal;
	font-weight : normal;
}
.cmty-hidden-user {
	font-style : italic;
}



@media (max-width : 1270px ) {
	.shadow-wrapper {
		max-width : 980px;
		width : 980px;
	}
}


@media (max-width : 1130px) {
	#intro-wrapper .shout-box {
		width : 250px;
	}
	#intro-wrapper .icon {
		width : 80px;
		height : 80px;
		background-size : 80px 80px;
	}
	#intro-wrapper .shout-box .copy {
		font-size : 15px;
	}
	#intro-wrapper .shout-box .inner {
		padding : 12px;
	}
	
	#intro-wrapper .shout-box.school a.button:after {
		content : "TOUR OUR SCHOOL";
	}
	
	#intro-wrapper .shout-box.textbooks a.button:after {
		content : "BROWSE OUR STORE";
	}
}


@media (max-width : 930px) {
	#intro-wrapper .shout-box {
		width : 200px;
	}
	#intro-wrapper .icon {
		width : 60px;
		height : 60px;
		background-size : 60px 60px;
	}
	#intro-wrapper .shout-box .copy {
		font-size : 15px;
	}
	#intro-wrapper .shout-box .inner {
		padding : 12px;
	}
	
	#intro-wrapper .shout-box.school a.button:after {
		content : "LEARN";
	}
	
	#intro-wrapper .shout-box.textbooks a.button:after {
		content : "READ";
	}
	
	#intro-wrapper .shout-box.community a.button:after {
		content : "DISCUSS";
	}
}

@media (max-width : 768px) {
	#intro-wrapper .shout-box {
		width : 180px;
	}
	#intro-wrapper .shout-box .inner {
		height : 210px;
	}
	#intro-wrapper .shout-box .copy {
		height : 140px;
	}
	#intro-wrapper .icon {
		width : 50px;
		height : 50px;
		background-size : 50px 50px;
	}
}

@media ( max-width : 1020px ) {
	.shadow-wrapper {
		max-width : 890px;
		width : 890px;
	}
}

@media ( max-width : 930px ) {
	.shadow-wrapper {
		max-width : 800px;
		width : 800px;
	}
}

@media ( max-width : 840px ) {
	.shadow-wrapper {
		max-width : 99.9%;
		width : 99.9%;
	}
}

/** If the limits change in index.phtml, we need to change these :( **/
#intro-wrapper {
	min-height : 600px;
}


@media (max-width : 600px) {
	#intro-wrapper {
		min-height : 500px;
	}	
}

@media (max-width : 600px) {
	#intro-wrapper {
		min-height : 464px;
	}	
}
