/*

=============================================================
ORIENTATION & TRANSITION PROGRAMS @ COLORADO STATE UNIVERSITY
=============================================================

Developed by the Department of Web Communications

NOTE: this file only contains the RWD CSS for the OTP
website. The base CSS lives in styles.css

=============================================================

*/



/* ======= iPhone-SPECIFIC STYLES ======= */

	@media (width: 320px) {

		/* --- feature area --- */
			.jumbotron {
				padding: 80px 10px 200px 10px;
			}
			.jumbotron h1 {
				font-size: 42px;
			}
		/* --- end feature area --- */

		/* --- page content --- */
			.page-content {
				padding: 15px 0px 15px 0px;
			}
		/* --- end page content --- */

		/* --- footer --- */
			footer.subfooter .subfooter-right .social-media img {
				display: none;
			}
			footer.subfooter .subfooter-right .social-media a.text-link {
				float: right;
				margin-left: 5px;
			}
		/* --- end footer --- */

	}

/* ======= END iPhone-SPECIFIC STYLES ======= */



/* ======= MOBILE DEVICES/TABLETS SMALLER THAN iPad (portrait orientation) ======= */

	@media (max-width: 767px) {
		
		/* --- logos --- */
			.otp-logo {
				display: block;
				float: none;
				margin: 0px auto;
				padding: 5px 10px 10px 10px;
			}
			.csu-logo {
				display: block;
				float: none;
				margin: 0px auto;
				padding: 5px 0px 0px 0px;
			}
			.otp-logo img, .csu-logo img {
				margin: 0px auto;
			}
		/* --- end logos --- */

		/* --- menu --- */
			.navbar-nav {
				margin-left: 0px;
			}
			.container > .navbar-collapse {
				padding-left: 0px;
			}
			.navbar-collapse {
				max-height: inherit !important;
			}
		/* --- end menu --- */

		/* --- feature area --- */
			.image-grid img {
				width: 100%;
				margin: 0px auto 20px;
			}
		/* --- end feature area --- */

		/* --- collapsible sidebar --- */
			.secondary-toggle {
				color: #FFCF01;
				font-family: 'OTP_slab_face', Georgia, serif;
				font-size: 14px;
				text-transform: uppercase;
				display: block;
				text-align: left;
				width: 100%;
				border: none;
				background-color: #104C32;
				padding: 8px 0px 8px 0px;
			}
			.secondary-toggle-icon {
				float: right;
				margin-top: 2px;
				margin-right: 0px;
			}
			.secondary-toggle .icon-bar {
				display: block;
				width: 18px;
				height: 2px;
				background-color: #FFCF01;
			}
			.secondary-toggle .icon-bar + .icon-bar {
				margin-top: 4px;
			}
			.secondary-toggle:focus {
				outline: none;
			}
			.collapse {
				display: none;
			}
			.sidebar .offset {
				display: none !important;
			}
			.sidebar {
				padding: 0px;
				margin-left: -15px;
				margin-right: -15px;
                padding-left: 15px;
			}
			.sidebar h3 {
				display: none;
			}
		/* --- end collapsible sidebar --- */

		/* --- page content --- */
			.content-wrap {
				margin-top: 55px;
			}
			.page-content .offset {
				margin-top: 0px;
			}
		/* --- end page content --- */

		/* --- footer --- */
			footer.subfooter .subfooter-right .social-media {
				
			}
			footer.subfooter .subfooter-right .contact {
				float: left;
			}
			footer.subfooter .subfooter-right .social-media {
				margin-left: 0px;
			}
			footer.subfooter .subfooter-right .social-media img {
				max-width: 16px;
			}
			footer.subfooter .subfooter-right .social-media .text-link {
				display: none;
			}
			footer.subfooter .subfooter-right .social-media, footer.subfooter .subfooter-right .contact p {
				font-size: 10px;
			}
		/* --- end footer --- */

	}

/* ======= END MOBILE DEVICES/TABLETS SMALLER THAN iPad (portrait orientation) ======= */



/* ======= "TWEENER" DISPLAYS - larger than iPad, smaller than wide(r) desktops; i.e. 11" laptop ======= */

	@media (min-width: 768px) and (max-width: 991px) {

		/* --- logos --- */
			.rams-logo {
				width: 80px;
				height: 80px;
			}
			.csu-logo {
				float: left;
				margin-left: 75px;
				padding: 15px 0px 0px 0px;
			}
			.otp-logo {
				margin-left: 75px;
				padding: 0px 0px 15px 0px;
			}
		/* --- end logos --- */

		/* --- menu --- */
			.navbar-nav {
				margin-left: -100px;
			}
            .goog-te-gadget-simple{
                width:90%;
                float:none;
            }
		/* --- end menu --- */

		/* --- feature area --- */
			.jumbotron {
				padding-bottom: 200px;
			}
			.image-grid {
				min-height: 210px;
				margin-top: -180px;
			}
			.image-grid h3 {
				font-size: 16px;
			}
			.image-grid img {
				width: 100%;
				margin: 0px auto 20px;
			}
			.image-tile .heading-wrap h4 {
				font-size: 12px;
			}
		/* --- end feature area --- */

		/* --- collapsible sidebar --- */
			.secondary-toggle {
				color: #FFCF01;
				font-family: 'OTP_slab_face', Georgia, serif;
				font-size: 14px;
				text-transform: uppercase;
				display: block;
				text-align: left;
				width: 100%;
				border: none;
				background-color: #104C32;
				padding: 8px 0px 8px 0px;
			}
			.secondary-toggle-icon {
				float: right;
				margin-top: 2px;
				margin-right: 0px;
			}
			.secondary-toggle .icon-bar {
				display: block;
				width: 18px;
				height: 2px;
				background-color: #FFCF01;
			}
			.secondary-toggle .icon-bar + .icon-bar {
				margin-top: 4px;
			}
			.secondary-toggle:focus {
				outline: none;
			}
			.collapse {
				display: none;
			}
			.sidebar {
				padding: 0px;
				margin-left: -15px;
				margin-right: -15px;
                padding-left: 15px;
			}
			.sidebar .offset {
				display: none !important;
                margin-top: 0px !important;
			}
			.sidebar h3 {
				display: none;
			}
		/* --- end collapsible sidebar --- */

		/* --- page content --- */
			.content-wrap {
				margin-top: 55px;
			}
			.page-content .offset {
				margin-top: 0px;
			}
		/* --- end page content --- */

		/* --- footer --- */
			footer.subfooter .subfooter-right {
				float: right;
			}
			/*footer.subfooter .subfooter-right .social-media, footer.subfooter .subfooter-right .contact {
				float: left;
			}*/
			footer.subfooter .subfooter-right .social-media, footer.subfooter .subfooter-right .contact p {
				font-size: 11px;
			}
			footer.subfooter .subfooter-right .social-media {
				margin-left: 0px;
			}
			footer.subfooter .subfooter-right .social-media img {
				max-width: 16px;
			}
			footer.subfooter .subfooter-right .social-media .text-link {
				display: none;
			}
		/* --- end footer --- */

	}

/* ======= END "TWEENER" DISPLAYS - larger than iPad, smaller than wide(r) desktops; i.e. 11" laptop ======= */



/* ======= MEDIUM DESKTOP/LAPTOP DISPLAYS ======= */

	@media (min-width: 992px) and (max-width: 1199px) {
		
		/* --- feature area --- */
			.image-tile .heading-wrap h4 {
				font-size: 14px;
			}
		/* --- end feature area --- */

		/* --- footer --- */
			footer.subfooter .subfooter-right .social-media {
				font-size: 11px;
			}
			footer.subfooter .subfooter-right .contact p {
				font-size: 10px;
				line-height: 20px;
			}
		/* --- end footer --- */

	}

/* ======= END MEDIUM DESKTOP/LAPTOP DISPLAYS ======= */



/* ======= RANDOM FORMATTING OF SOCIAL MEDIA ICONS/CONTACT INFO ======= */

	@media (max-width: 480px) {

		/* --- footer --- */
			footer.subfooter .subfooter-right h4 {
				margin-left: -15px;
			}
			footer.subfooter .subfooter-right .social-media {
				margin-left: 0px;
				border-left: none;
				float: right;
				display: block;
				padding: 0px;
			}
			footer.subfooter .subfooter-right .social-media img {
				max-width: 12px;
				margin: 0px 3px 0px 3px;
			}
			footer.subfooter .subfooter-right .social-media .clearfix {
				display: none;
			}
			footer.subfooter .subfooter-right .social-media a.text-link {
				display: inline-block;
				margin-right: 0px;
			}
			footer.subfooter .subfooter-right .contact {
				padding-right: 0px;
				float: right !important;
			}
			footer.subfooter .subfooter-left {
				/*display: none;*/
			}
		/* --- end footer */

	}

	@media (min-width: 481px) and (max-width: 767px) {
		/* --- footer --- */
			footer.subfooter .subfooter-right .social-media h4 {
				display: none !important;
			}
		/* --- end footer */
	}

/* ======= END RANDOM FORMATTING OF SOCIAL MEDIA ICONS/CONTACT INFO ======= */