/* ============================================================================
Ciena Corporation
Copyright, 2016 
Title: prx-german-styles.css
============================================================================ */

#hero .story-one {
	max-width: 85%;
}

.story-one .title {
	font-size: 50px;
}

.no-results-title {
	font-size: 37px;
}

.alt-search-terms a {
	font-size: 21px;
}

.story-bar .story-item {
	height: 120px;
}

.story-bar .story-item .story-title {
	padding: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 100%;
}

.pinned-slide .pin-content {
	padding: 32px;
}

.slider-title {
	font-size: 34px;
	margin: 15px 0;
}

.slider-subtitle {
	font-size: 17px;
}

.resize-bg .pin-content p:first-child::first-letter {
	font-size: 35px;
}

.pinned-slide .pin-content .btn-container {
	margin-top: 20px;
}

/* 650 height */
@media only screen and (max-height: 650px) {
	.slider-title {
		font-size: 32px;
	}

	.slider-subtitle {
		font-size: 16px;
	}
}

/* 1599 */
@media only screen and (max-width: 1599px) {

	.story-one.an-robot .right-title {
		font-size: 38px;
	}

	.story-one.an-robot .left-title {
		font-size: 41px;
	}

	.slider-subtitle {
		font-size: 16px;
		margin: 12px 0;
	}
}

/* 1360 */
@media only screen and (max-width: 1360px) {
	.story-one.an-robot .right-title {
		font-size: 35px;
	}

	.story-one.an-robot .left-title {
		font-size: 38px;
	}
}


@media screen and (max-width: 1360px) and (max-height: 650px) {

	.pinned-slide .pin-content {
		padding: 0 30px;
	}

	.slider-title {
		font-size: 30px;
	}

	.slider-subtitle {
		font-size: 16px;
	}
}

/* 1239 */
@media only screen and (max-width: 1239px) {
	.story-one .title {
		font-size: 40px;
	}

	.pinned-slide .pin-content {
		padding: 30px;
	}

	.slider-title {
		font-size: 31px;
	}

	.story-one.an-robot .right-title {
		font-size: 32px;
	}

	.story-one.an-robot .left-title {
		font-size: 35px;
	}
}

@media screen and (max-width: 1239px) and (max-height: 650px) {

	.slider-title {
		font-size: 29px;
		margin: 0 0 12px;
	}

	.slider-subtitle {
		font-size: 15px;
		margin: 8px 0;
	}

	.resize-bg .pin-content p:first-child::first-letter {
		font-size: 30px;
	}

	.pinned-slide .pin-content .btn-container {
		margin-top: 10px;
	}
}

/* 1152 */
@media only screen and (max-width: 1152px) {
	
	#header-icons {
		width: 110px;
	}

	#header-icons a {
		margin-left: 12px;
	}

	#main-nav li {
		margin-right: 20px;
	}

	#header-icons a:first-child {
		margin-left: 12px;
	}

	.slider-title {
		font-size: 26px;
	}

	.slider-subtitle {
		font-size: 15px;
		margin: 8px 0;
	}

	.story-one.an-robot .right-title {
		font-size: 29px;
	}

	.story-one.an-robot .left-title {
		font-size: 32px;
	}
}

@media screen and (max-width: 1152px) and (max-height: 650px) {
	.slider-subtitle {
		font-size: 14px;
	}
}

/* 1024 */
@media only screen and (max-width: 1024px) {
	#hero .story-one {
		max-width: 100%;
	}
	
	.canvas-stories .story .title {
		font-size: 20px;
	}

	.story-one.an-robot .right-title {
		font-size: 24px;
	}

	.story-one.an-robot .left-title {
		font-size: 26px;
	}
}

/* 767 */
@media only screen and (max-width: 767px) {
	.story-bar .story-item {
		height: 60px;
	}		
}

/* 440 */
@media only screen and (max-width: 440px) {

	#search-input input {
		font-size: 12px;
		padding: 10px 40px 8px 15px;
	}
}

/* min 1299 */
@media only screen and (min-width: 1299px) {

	#main-nav li {
		margin-right: 20px;
	}

	#main-nav span, #main-nav a {
		font-size: 15px;
	}
}

/* min 1240 */
@media only screen and (min-width: 1240px) {

	#main-nav li {
		margin-right: 15px;
	}

	#site-search-container {
		width: 352px;
	}

	#search-input input {
		font-size: 14px;
		padding: 10px 55px 8px 20px;
	}

	#main-nav span, #main-nav a {
		font-size: 15px;
	}
}

/* Added when we went from 3 top nav items to 4 CNSD-1234 */
@media (min-width: 1240px) and (max-width: 1360px) {

	#main-nav-container {
		padding-right: 15px;
	}

	#site-search-container {
		margin-right: 10px;
	}

	#header-icons {
		width: 110px;
	}

	#header-icons a {
		margin-left: 10px;
	}

	#main-nav span, #main-nav a {
		font-size: 14px;
	}
}