﻿/* ==========================================================================
   $RESPONSIVE DESIGN
   ========================================================================== */

@media (max-width: 1080px) {

	.primary-nav li.active:after {
		margin: -3px 10px 0;
	}

	.primary-nav a {
		padding: 10px 10px;
	}

	.footer-social li {
		width: 32%;
		margin-bottom: 20px;
	}
}

@media (max-width: 980px) {

	.primary-nav {
		margin-top: 0;
		text-align: center;
	}

	.tabs li {
		font-size: 15px;
	}

	.primary-nav li a {
		padding: 10px;
	}

	.secondary-nav li {
		margin-left: 0;
	}

	.featured-articles {
		font-size: .8em;
	}

	.user-tools {
		margin-top: 20px;
	}
}

@media (max-width: 768px) {

    /* Added to fix the youtube responsive iframe issue */
    iframe { max-width: 100% !important;}

	.main {
		padding-top: 12px;
	}

	/* Header */
	.branding {
		min-height: 0;
	}

	.user-tools {
		position: static;
	}

	.quick-nav {
		display: block;
		margin: 20px 0 0;
		text-align: center;
	}

	.site-search,
	.region-selector {
		display: block;
	}

	.show-search,
	.show-region-selector {
		background: #f0f0f0;
		border-radius: 30px;
		display: block;
		line-height: 50px;
		height: 50px;
		overflow: hidden;
		position: absolute;
		right: 0;
		text-align: center;
		top: 15px;
		width: 50px;
	}

	.show-search {
		right: 60px;
	}

		.show-search i {
			margin-top: -3px;
		}

	.show-region-selector:before {
		margin-right: 0;
	}

	.search-field {
		border-radius: 18px;
		height: 0;
		overflow: hidden;
		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-o-transition: all 0.5s;
		transition: all 0.5s;
	}

		.search-field.open {
			height: 36px;
			margin: 15px 0;
		}

	.site-search input[type=search],
	.site-search input[type=search]:focus {
		height: 36px;
		width: 100%;
	}

	.site-search .btn-search {
		padding: 6px 8px;
	}


	/* Footer */
	.footer-useful-links {
		border: none;
		border-bottom: solid 1px #fff;
		border-top: solid 1px #fff;
		margin-left: 0;
		padding: 20px 0;
	}

	.footer-copyright .horizontal-list li {
		margin-left: 8px;
		padding-left: 8px;
	}

	.footer-social li {
		width: 15.5%;
		margin-bottom: 0;
	}


	/* Mobile Navigation */
	a.show-nav {
		background: #eaeaeb;
		color: #231f20;
		font-size: 14px;
		position: relative;
		text-transform: none;
	}

		.show-nav:after {
			content: '+';
			display: block;
			font-family: Courier, Monaco, monospace;
			font-size: 24px;
			line-height: 35px;
			position: absolute;
			right: 10px;
			top: 0;
		}

		.open .show-nav:after {
			content: '-';
		}

	.side-navigation > ul {
		border-top: solid 1px #fff;
		display: none;
		overflow: hidden;
		padding-left: 4px;
	}

	.side-navigation ul a {
		padding-left: 25px;
	}
	
	.side-navigation .parent > a {
		display: block;
		text-transform: uppercase;
	}

		.side-navigation .parent > a:before {
			content: '\2039';
			display: inline-block;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 1.2em;
			line-height: 1;
			margin-left: -10px;
			margin-right: 4px;
		}

	.side-navigation .sibling:not(.active):not(.document-type) {
		display: none;
	}

	.homepage .main-nav,
	.homepage .primary-nav li,
    .microsite-contentpages .main-nav,
    .microsite-contentpages .primary-nav li {
		display: block;
	}

	.homepage .primary-nav {
		margin-top: 12px;
	}

	.homepage .primary-nav ul,
    .microsite-contentpages .primary-nav ul {
		display: none;
		margin: 0;
		overflow: hidden;
	}

	.homepage .primary-nav a,
    .microsite-contentpages .primary-nav a {
		background: #eaeaeb;
		border-bottom: solid 1px #fff;
		padding: 8px 14px;
		text-align: left;
	}


	/* Home Page */
	.home-panel .full-background-img {
		-webkit-transform: skewY(0deg);
		-moz-transform: skewY(0deg);
		-ms-transform: skewY(0deg);
		-o-transform: skewY(0deg);
		transform: skewY(0deg);
		-webkit-backface-visibility: visible;
		-moz-backface-visibility: visible;
		backface-visibility: visible;
	}

		.home-panel .full-background-img img {
			margin-top: 0;
			-webkit-transform: skewY(0deg);
			-moz-transform: skewY(0deg);
			-ms-transform: skewY(0deg);
			-o-transform: skewY(0deg);
			transform: skewY(0deg);
		}

	.home-panel:first-of-type {
		margin-bottom: 0;
		padding-bottom: 0;
	}

		.home-panel:first-of-type .full-background-img {
			bottom: 0;
			top:0;
		}

	.home-panel {
		padding-bottom: 90px;
	}

	.homepage .site-footer {
		margin-top: -170px;
	}

	.featured-articles article p {
		display: none;
	}

	.featured-articles article h3 {
		height: auto;
	}

	.featured-news li {
		display: none;
	}

		.featured-news li:nth-child(-n+3) {
			display: block;
		}


	/* Tabs */
	.tabs li {
		display: block;
		margin: 0;
	}

		.tabs .active a:after {
			display: none;
		}
		
		.tabs li.contact-us a {
			background: #ededee;
			color: #4a465b;
		}

			.tabs li.contact-us a:hover,
			.tabs li.contact-us a:active,
			.tabs li.contact-us a:focus {
				background: #d4d4d4;			
			}

			.tabs .active.contact-us a,
			.tabs .active.contact-us a:hover,
			.tabs .active.contact-us a:active,
			.tabs .active.contact-us a:focus {
				background: #4a465b;
				color: #fff;
			}


	/* Catalog Carousel Tabs */
	.catalog-carousel .tabs li {
		display: inline-block;
	}

		.catalog-carousel .tabs .active a:after {
			display: block;
		}

	
	/* Catalog Table */
	.catalog-table-title {
		float: none;
		width: auto;
	}

	.catalog-table-description {
		margin-left: 0;
	}

    #region-selector .modal-content {
        margin: 0;
        margin-top: 145px;
    }

    #region-selector .modal-content h2:first-child, #region-selector .modal-content .dismiss-region-selector {
        display: none;
    }

    header .menu-links .navbar-collapse .location-tab a:hover {
        color: #3d3834 !important;
    }
	
	/* Subscription form */
	.interest-group .col-2 {
		margin-bottom: 0;
	}

	/* Customer experience survey */
	.survey-rating li {
		display: block;
		padding-left: 20px;
		position: relative;
		text-align: left;
		width: auto;
	}

	.survey-rating input {
		left: 2px;
		position: absolute;
		top: 2px;
	}

    /* Unit switcher */
   .units-control {
       float: none;
   }


   /* CTA */
   .cta {
	   padding-top: 110px;
   }

	   .cta:before {
		   bottom: -60px;
		   top: 60px;
	   }

    .footer-content:before {
        border-top: none;
        top: 10px;
    }
    .footer-content:before {
        -webkit-transform: skewY(0deg);
        -moz-transform: skewY(0deg);
        -ms-transform: skewY(0deg);
        -o-transform: skewY(0deg);
        transform: skewY(0deg);
    }


}


@media (max-width: 480px) {

	.footer-copyright .horizontal-list li {
		margin-left: 3px;
		padding-left: 3px;
	}

	.footer-social li {
		width: 32%;
		margin-bottom: 20px;
	}

	.units-control p {
		display: none;
	}

}


@media (max-width: 320px) {

	.story-summary .thumb {
		float: none;
		height: 100px;
		margin-bottom: 10px;
		margin-right: -10px;
		width: auto;
	}

		.story-summary .thumb img {
			height: auto;
		}

	.story-summary h3, 
	.story-summary .dateline, 
	.story-summary a {
		margin-left: 0;
	}

}