@import "/Common/global/css/about_us/gbl_corp.css";
@import "gbl_corp_nav_2012.css"; /* replacing "http://www.att.com/Common/global/css/about_us/gbl_corp_nav.css" for nav fix */
@import "/Common/newsroom/css/att_cq5.css";
@import "/Common/newsroom/css/att_responsive.css";


/*** SEE ALSO: ar2012_ie.css for IE specific styles/that can't read media queries. ***/

/* ==========================================
	OVERRIDING CQ5 FRAME STYLES
 ========================================== */
body {
	background: none;
	color: #808080;
	font-family: Arial, Helvetica, sans-serif;
	min-width: auto!important;
	padding: 0;
}
#wrapper, #ie, #container, #page, #mainNavigation {
	max-width: 975px;
	width: 100%;
}
#header {
	display: none;
}
ul#universalNav {
	max-width: 377px;
	top: 0;
	width: 100%;
}
#content-container, #content {
	border-radius: 0;
}
#content-container {
	box-shadow: none;
	margin: 0 auto;
	padding: 0;
	width: 100%;
}
.ie8 #content-container, .ie7 #content-container {
	background-image: none;
	width: 100%;
}
#content {
	margin: 0;
	width: 100%;
}
.ie7 #content, .ie8 #content {
	padding: 0;
	width: 100%;
}
.ie7 .ie-top-shadow, .ie7 .ie-bottom-shadow, .ie8 .ie-top-shadow, .ie8 .ie-bottom-shadow {
	background-image: none;
}
/* ==========================================
	ANNUAL REPORT STYLES:
========================================== */
h2 {
	margin: 0 0 20px;
}
h3 {
	color: #808080;
	font-size: 15px;
	font-weight: 700;
	line-height: 20px;
	margin: 0 0 20px;
	padding: 0;
}
h3.ltblue, h4 {
	font-size: 20px;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.3px;
	line-height: 26px;
}
/*h4 {
	color: blue;
	font-weight: 700;
	font-size: 15px;
	padding-top: 0;
}*/
#content h3.exclusive {
	font-size: 11px;
	font-weight: normal;
	/*margin: -40px 0 0;
	*/font-style: normal;
	/*padding: 0 0 15px;*/
	margin: 0;
	padding: 0 0 10px;
}
h5, h6, #content h5, #content h6 {
	font-size: 12px;
	line-height: 20px;
	padding: 0 0 25px;
	margin: 20px 0 0;
	text-indent: 35px!important;
	background: url(../_images/intro.png) no-repeat left 4px!important;
	font-weight: normal;
}
h6 {
	/*color: #ff7200;*/
}
p, li {
	color: #808080;
	font-size: 12px;
	line-height: 20px;
	margin: 0 0 20px;
}
figure {
	float: none;
	margin: 5px 0;
	text-align: center;
}
figure.right {
	float: none;
	text-align: center!important;
}
figcaption {
	text-align: left;
}
img {
	height: auto;
	max-width: 100%;
}
#content {
	overflow: visible;
}
#main {
	margin: auto;
	max-width: 975px;
/* 	overflow: hidden; */
	padding: 0;
	width: 100%;
}
.header {
	margin: 0;
	padding: 35px 0 25px;
	width: 100%;
	z-index: 10;
}
.header .floatbox {
	margin: 0 auto;
	width: 90%;
}
.header p.title, .header h1, .header p, .header h2 {
	margin: 0;
	width: 90%;
}
.header h1 {
	color: #808080;
	font-size: 11px;
	line-height: 20px;
	left: 5%;
	position: absolute;
	top: 10px;
}
.header h2 {
	background-color: transparent;
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
	height: 75px;
	margin: 10px 0 0 -2%;
	text-indent: -9999px;
	width: 320px;
}
.header p.title {
	color: #ff7200;
	font-size: 35px;
	font-style: italic;
	line-height: 1;
}
.header p {
	line-height: 20px;
	margin-bottom: 20px;
}
.header p.title {
	margin-bottom: 15px;
}
.header p.title .small {
	margin-top: 10px;
}
div.banner img {
	margin:auto;
}
 section, [class^=section] {
 margin-bottom:15px;
 position:relative;
 zoom:1;
}
.copy {
	border-top: 1px solid #333;
	margin: 0 auto;
	/*padding-top: 5px;*/
	padding-top: 15px;
	position: relative;
	width: 90%;
	z-index: 100;
}
.fullwidth .copy {
}
.copy h2 {
	font-size: 17px;
	font-style: italic;
	font-weight: 400;
	line-height: 20px;
}
#wrapper #content .copy ul {
	list-style: none outside;
	margin-left: 0;
	padding-left: 0;
}
#wrapper #content .copy ul li {
	background: url("../_images/bkg_li.png") no-repeat scroll left 4px transparent !important;
	list-style: none outside none;
	margin-left: 0;
	text-indent: 12px !important;
}
.small-text {
	background: transparent url(../_images/small_divider.jpg) no-repeat 0 0;
	padding-top: 20px;
}
.small-text, p.small-text, .small-text p, section.footnotes p {
	font-size: 10px;
	line-height: 15px;
	max-width: 90%;
}
/*.copy a {
	color: #6ebb1f;
	text-decoration: none;
}*/
.copy .subhead {
	display: block;
}
.col-2 {
	margin-left: 40px;
}
.copy .col-2 p {
	margin-bottom: 5px;
}
.copy .col-2 p strong {
	color: #7cc6ff;
	display: block;
	margin-top: 15px;
}
.copy .col-2 p strong img {
	margin-bottom: -25px;
	margin-left: -46px;
	padding-right: 10px;
	vertical-align: top;
}
.sidebar {
	display: none;
}
.sidebar h3 {
	display: none;
}
.section-1 .copy, .section-1 .sidebar {
	margin-top: 35px;
}
.quote {
	display: none;
}
.circles {
	display: block;
	height: auto;
	margin: 0 auto;
	max-width: 100%;
	text-align: center;
}
#back-to-top {
	display: none;
}
/* PAGE SPECIFIC */
#page_business .header h2 {
	background-image: url(../_images/business/h2_improving_the_business_mobile.png);
}
/*
#page_business .section-5 h2 {
	display: none;
}
*/
#page_connect .header h2 {
	background-image: url(../_images/connect/h2_most_powerful_network_mobile.png);
}
#page_connect .section-2 h2 {
	display: none;
}
#page_inhome .header h2 {
	background-image: url(../_images/hometech/h2_changing_mobile.png);
}
#page_innovation .header h2 {
	background-image: url(../_images/innovation/h2_we_ask_how_mobile.png);
}
#page_investors figure.banner figcaption {
	margin-left: 5%;
}
#page_mobile .header h2 {
	background-image: url(../_images/living_mobile/h2_alwaysonthemove_mobile.png);
}
/* RESUABLE CLASSES */
.orange {
	color: #ff7200;
}
.ltblue {
	color: #7cc6ff;
}
.green, .copy p strong, .copy p strong.featured, .featured {
	color: #6ebb1f;
}
.copy p strong.featured, .copy strong.featured {
	font-weight: normal;
}
.desktop-only {
	display: none;
}
.tablet-mobile {
	display: block
}
/* HELPER CLASSES */
section:before, section:after, .clearfix:before, .clearfix:after {
	content: " ";
	display: table;
}
section:after, .clearfix:after {
	clear: both;
}
.clearfix {
 *zoom:1;
}

/* ==========================================
	MEDIA QUERIES:
========================================== */
@media only screen and (max-width: 767px) {
.header p.title .small {
	font-size: 15px;
	font-style: normal;
	margin-top: 10px;
}
.header p.title .small {
	display: block;
}
figure + .copy {
	margin-top: 30px;
}
/* REUSABLE */
.hidden-phone {
	display: none !important;
}
.hidden-desktop {
	display: block !important;
}
.visible-phone {
	display: block !important;
}
.visible-desktop {
	display: none !important;
}
}
 @media only screen and (min-width: 767px) {
html, .ie-corner-shadow-left {
	background-position: right top!important;
}
h3 {
	font-size: 18px;
	font-style: italic;
	letter-spacing: .3px;
	line-height: 24px;
}
.header {
	/*background: transparent url(../_images/gradient.png) repeat-x 0 0;*/
	display: block;
	position: relative;
	margin-top: 0;
	max-width: 975px;
	background: #fcb314;
	background: -moz-linear-gradient(top, #fcb314 0%, #fca911 21%, #fe8004 74%, #ff7200 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcb314), color-stop(21%, #fca911), color-stop(74%, #fe8004), color-stop(100%, #ff7200));
	background: -webkit-linear-gradient(top, #fcb314 0%, #fca911 21%, #fe8004 74%, #ff7200 100%);
	background: -o-linear-gradient(top, #fcb314 0%, #fca911 21%, #fe8004 74%, #ff7200 100%);
	background: -ms-linear-gradient(top, #fcb314 0%, #fca911 21%, #fe8004 74%, #ff7200 100%);
	background: linear-gradient(to bottom, #fcb314 0%, #fca911 21%, #fe8004 74%, #ff7200 100%);
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcb314', endColorstr='#ff7200', GradientType=0);
}
.header p.title, .header h1 {
	background-color: transparent;
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
}
.header p.title, .header h1, .header h2, .header h2 em {
	text-indent: -9999px;
}
.header p.title, .header h2 {
	top: 30px;
}
.header h1 {
	position: static;
	margin-top: 25px;
	margin-bottom: 5px;
}
.header h2 {
	margin: 0;
}
.header p {
	color: #FFF;
}
#main img.banner {
	margin-bottom: 20px;
}
.header .banner {
	margin: 260px 0 0;
	padding: 0;
	display: block;
}
.header .floatbox {
	width: 581px;
	float: right;
	margin-right: 120px;
}
.copy {
	float: right;
	/*margin: 48px 14% 0 3%;*/
	margin: 48px 14% 0 2%;
	max-width: 580px;
	padding-top: 20px;
	width: 58%;
}
.fullwidth .copy {
	max-width: 815px;
	margin-left: 5%;
	float: none;
	width: 100%;
}
.copy h2 {
/*background-color: transparent;#
		background-position: 0 0;
		background-repeat: no-repeat;
		display: block;
		overflow: auto;
		text-indent: -9999px;*/
}
.copy .subhead, .copy h2.subhead {
	display: none !important;
}
.col-2 {
	float: left;
	margin-left: 15%;
	width: 42%;
}
.col-2.first {
	margin-left: 0;
}
.sidebar {
	border-top: 1px solid #fcb314;
	display: block;
	float: left;
	margin: 48px 0 0 5%;
	padding: 20px 0 0;
	/*	max-width: 190px;*/
	max-width: 195px;
	/*width: 25%;*/
	width: 21%;
}
.sidebar h2, .sidebar h3, .sidebar p.quote {
	display: block;
	text-align: right;
}
.section-1 .copy, .section-1 .sidebar {
	margin-top: 35px;
}
.quote {
	display:block;
}
.sidebar .quote {
	margin-top:50px;
}
.arrows {
	background: transparent url(../_images/three_arrows.jpg) no-repeat 0 3px;
	text-indent: 33px;
}
.circles {
	bottom: 0;
	margin-right: -45px;
	position: absolute;
	right: 0;
	z-index: 1;
}
.callout {
	margin-left: -230px;
}
.blue-bar {
	height: 1px;
}
#back-to-top {
	background: transparent url(../_images/btn_back_to_top.png) no-repeat 0 0;
	bottom: 5px;
	display: block;
	height: 43px;
	overflow: auto;
	position: fixed;
	right: 5px;
	text-indent: -9999px;
	width: 43px;
	z-index: 10;
}
figcaption {
	font-size: 10px;
	display: block;
	margin: 8px 16px;
	text-align: left;
}
figure.right {
	float: right;
	padding: 0 0 20px 20px;
	width: 355px;
}
figure.right figcaption {
	text-align: left;
}
/* PAGE SPECIFIC */
/*
#page_business .sidebar {
	padding-top: 70px;
}
*/
#page_business .header h2 {
	background-image: url(../_images/business/h2_improving_the_business.png);
	height: 86px;
	width: 581px;
}
#page_business .header h1 {
	background-image: url(../_images/business/h1_open_for_business.png);
	height: 15px;
	width: 190px;
}
#page_business .section-2 {
	/*padding-bottom: 180px;*/
}
/*
#page_business .section-5 h2 {
	display: block;
}
*/
#page_connect .header h2 {
	background-image: url(../_images/connect/h2_most_powerful_network.png);
	height: 81px;
	width: 384px;
}
#page_connect .header h1 {
	background-image: url(../_images/connect/h1_where_we_connect.png);
	height: 15px;
	width: 200px;
}
#page_connect .section-2 h2 {
	display: block;
}
#page_inhome .header h1 {
	height: 15px;
	width: 190px;
	background-image: url(../_images/hometech/h1_homesweethub.png);
}
#page_inhome .header h2 {
	background-image: url(../_images/hometech/h2_changing.png);
	height: 94px;
	width: 373px;
}
#page_innovation .header h2 {
	background-image: url(../_images/innovation/h2_we_ask_how.png);
	height: 82px;
	width: 334px;
}
#page_innovation .header h1 {
	background-image: url(../_images/innovation/h1_future_first.png);
	height: 15px;
	width: 130px;
}
#page_innovation .circles {
	margin-right: 0;
}
#page_investors figure.banner figcaption {
	display: inline;
	float: left;
	text-align: right;
	width: 20%;
}
#page_investors .section-2 h3, #content h3.exclusive {
	margin: -55px 0 30px;
}
#page_investors .section-4 figcaption p {
	margin-left: 30px;
	max-width: 665px;
	width: 70%;
}
/*
#page_mobile .section-2 {
	background: url(../_images/living_mobile/mobile_circles.png) no-repeat scroll 0 40% transparent;
}
*/

#page_innovation .section-3 {
	padding-bottom: 220px;
}
#page_mobile .header h2 {
	background-image: url(../_images/living_mobile/h2_alwaysonthemove.png);
	height: 93px;
	width: 537px;
}
#page_mobile .section-4 .small-text {
	width: 220px;
}
/* REUSABLE */
.hidden-phone {
	display: block !important;
}
.hidden-desktop {
	display: none !important;
}
.visible-phone {
	display: none !important;
}
.visible-desktop {
	display: block !important;
}
}
 @media only screen and (min-width: 1024px) {
#content {
	overflow: visible;
}
.scrollbox {
	display: block;
	width: 100%;
	left: 0;
	max-width: 975px;
}
div.banner {
	z-index: 1;
	height: 473px;
	overflow: hidden;
}
.sidebar {
	position: relative;
	z-index: 10;
}
#back-to-top {
	display: none;
}
.header p.title, .header h2, .header h1, .header p {
	left: 272px;
}
.circles {
	margin-right: -80px;
}
.desktop-only {
	display: block;
}
.tablet-mobile {
	display: none;
}
/*
	#page_business .section-2 .circles {
		float: right;
		margin: -400px -49px 0 0;
		z-index: 0;
	}
	*/
}
@media only screen and (min-width: 1140px) {
#main {
	overflow: visible;
}
}
