@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed);
@import url(http://fonts.googleapis.com/css?family=Roboto);


html, body, ul, ol, li, div, span, p, h1, h2, h3, h5, h4, h3, h2, h1{
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: auto;
	color: #2c2c2c;
}

body{
	background:#fff url(../images/background.jpg) top left repeat-y;
}

a{
	text-decoration:none;
	color:#2c2c2c;
}

a:hover{
	text-decoration:none;
	color: #ED3E6D;
}

a img{
	border:0px;
}

/* font styles */

@font-face {
    font-family: 'RobotoCondensedRegular';
    src: url('../fonts/robotocondensed-regular.eot');
    src: url('../fonts/robotocondensed-regular.eot') format('embedded-opentype'),
         url('../fonts/robotocondensed-regular.woff') format('woff'),
         url('../fonts/robotocondensed-regular.ttf') format('truetype'),
         url('../fonts/robotocondensed-regular.svg#RobotoCondensedRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RobotoCondensedBold';
    src: url('../fonts/robotocondensed-bold.eot');
    src: url('../fonts/robotocondensed-bold.eot') format('embedded-opentype'),
         url('../fonts/robotocondensed-bold.woff') format('woff'),
         url('../fonts/robotocondensed-bold.ttf') format('truetype'),
         url('../fonts/robotocondensed-bold.svg#RobotoCondensedBold') format('svg');
}


@font-face {
    font-family: 'CarroisGothicRegular';
    src: url('../fonts/carroisgothic-regular.eot');
    src: url('../fonts/carroisgothic-regular.eot') format('embedded-opentype'),
         url('../fonts/carroisgothic-regular.woff') format('woff'),
         url('../fonts/carroisgothic-regular.ttf') format('truetype'),
         url('../fonts/carroisgothic-regular.svg#CarroisGothicRegular') format('svg');
		font-weight: normal;
    font-style: normal;
}


.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

.container{
  width:958px;
  margin:0 auto;
  position:relative;
}

.call-requests{
	float:right;
	width:41%;
}

.onlinehelp{
	background:url(../images/online-call-icon.jpg) 0 0 no-repeat;
	width:167px;
	height:63px;
	float:left;
	text-indent:-9999999px;
	margin:20px 10px 0 0;
}

.callback{
	background:url(../images/request-call-img2.jpg) 0 0 no-repeat;
	width:189px;
	height:63px;
	float:left;
	text-indent:-9999999px;
	margin:20px 10px 0 0;
}


h2{
	color: #08080c;    
  font-family: 'Roboto Condensed',sans-serif;
  font-size: 35px;
  font-weight: normal;
  line-height: 35px;
  text-transform: uppercase;
  padding:0 0 15px 0;
}

.status-meter img{
	margin:20px 0 -20px 0px;
}

.nav-sidebar{
	width:220px;
	background:#ed6c8f;
	float:left;	
	position:fixed;
}

.sidebar-title{
	color: #fff;  
  font-family: 'Roboto Condensed',sans-serif;
  font-size: 32px;
  font-weight: normal;
  line-height: 32px;
  background:#ed3e6d;
  padding:20px;  
}

.sidebar-title a{
	color: #fff;  
}

.nav-sidebar nav ul li{	
	border-bottom:1px solid #ed3e6d;
}

.nav-sidebar nav ul li a{
	color: #fff;  
  font-family: 'Roboto',sans-serif;
  font-size: 21px;
  font-weight: normal;
  line-height: 24px;  
  padding:12px 20px;
  display:block;  
}

.nav-sidebar nav ul li a:hover{
	background:#373737;
}

.content-area{
	padding:0 60px;
	overflow:hidden;
	margin-left:220px;	
}

header{
	border-bottom:1px solid #c8c8c8;
	display:inline-block;
	width:100%;
	padding:40px 0 20px 0;
}

.logo{
	float:left;
}

header nav{
	float:right;
}

header nav ul li{
	display:inline-block;
	padding:11px 20px 0 20px;
}

header nav ul li a{
	color: #333333;
  font-family: RobotoCondensedRegular;
  font-size:20px;  
}

header nav ul li a:hover{
	color: #ED3E6D;
}

header nav ul li a img{
	margin:7px 0 -7px 10px;
}

.table-list-view{
	float:left;
	width:100%;
	margin:40px 0;
}

.view-all-order{
	float:left;
}

.status-label{
	float:right;
	width:41%;
	text-transform:uppercase;
	color:#ed3e6d;
	font-size:26px;
	font-family: RobotoCondensedRegular;
	border-bottom:1px solid #08080c;
}

.table-list-view ul li{
	border-bottom:1px dashed #b6b6b6;
	padding:10px 0;
	float:left;
	width:100%;
}

.table-list-view ul li:first-child{
	border-bottom:0px;
}

.table-list-view ul li .order-number,
.table-list-view ul li .order-number a{
	width:25%;	
	display:inline-block;
	text-transform:uppercase;
	font-size:18px;
	color:#ed3e6d;
}

.table-list-view ul li .order-item-name{
	width:33%;
	display:inline-block;
	font-size:18px;
}

.table-list-view ul li .order-status{
	width:41%;
	display:inline-block;
}

.table-list-view ul li .order-status .order-status-stage{
	background:url(../images/order-status-stage.png) center left no-repeat;
	padding:0 0 0 20px;
	margin:0 0 0 20px;
}

.table-list-view ul li .order-details{
	display:none;
	margin:8px 0 0 0;
	padding:8px 0 0 24%;
	border-top:1px dashed #b6b6b6;
}

.table-list-view ul li .order-details ul{
	padding:0 0 10px 0;
	display:inline-block;
}

.table-list-view ul li .order-details ul li{
	padding:3px 13px;		
	border-bottom:0px;
	width:94%;
}

.table-list-view ul li .order-details ul li.odd{
	background:#ebebeb;
}


.table-list-view ul li .order-details ul li label{
	width:100px;
	display:inline-block;
	font-size:15px;
}

.table-list-view ul li .order-details ul li span{
	font-size:15px;
}

.table-list-view ul li .address-location,
.table-list-view ul li .payment-label{
	width:25%;	
	display:inline-block;	
	font-size:18px;
	color:#ed3e6d;
	vertical-align:top;
}

.table-list-view ul li .address,
.table-list-view ul li .payment-by{
	width:33%;
	display:inline-block;
	font-size:18px;
}

.table-list-view ul li .address-edit,
.table-list-view ul li .payment-status{
	width:41%;
	display:inline-block;
}

.table-list-view ul li .address-edit-form,
.table-list-view ul li .payment-details{
	display:none;
	width:100%;
	margin:8px 0 0 0;
	padding:8px 0 0 0;
	border-top:1px dashed #b6b6b6;
}

.table-list-view ul li .payment-details{
	background:#efefef;
	padding:15px 2%;
	width:96%;
}

.table-list-view ul li .address-edit-form .address-location,
.table-list-view ul li .address-edit-form .address,
.table-list-view ul li .payment-details .address-location,
.table-list-view ul li .payment-details .address{
	display:table-cell;
	vertical-align:top;
}

.table-list-view ul li .payment-details .address span{
	margin:0 10px 0 0;
}

.table-list-view ul li .address-edit-form .address-location,
.table-list-view ul li .payment-details .address-location{
	width:11.5%;
}

.form-text-entry,
.form-text-area{
	border:1px solid #c6c6c6;
	width:75%;
	padding:7px 10px;
	margin:0 0 10px 0;
	font-family: 'Roboto',sans-serif;
  font-size: 18px;
}

.form-text-entry.form-text-entry-auto{
	width:auto;
}

.form-text-entry.dt{
	width:60px;
}

.form-text-entry.ccv-number,
.form-text-entry.zipcode,
.form-text-entry.address1,
.form-text-entry.address2{
	width:100px;
}

.form-select{
	width:85%;
	border:1px solid #c6c6c6;
	padding:6px 10px;
	font-size:18px;  
  float:left; 
  font-family: RobotoCondensedRegular;  
  margin: 0 0 10px 0;
}

.form-button:hover,
.form-button{
	padding:7px 25px;
	font-size:18px;
	border-radius:3px;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	border:1px solid #ed3e6d;
	background:#ed3e6d;
	color:#fff;
	font-family:RobotoCondensedRegular;
	text-transform:uppercase;
	margin:0 10px 10px 0;	
	cursor:pointer;
	background-image:none;
	border-radius:0px;
	-webkit-border-radius:0px;
	-moz-border-radius:0px;
	text-shadow:none;
	display:inline-block;
}

.form-button.download{
	background:#393939;
	border:1px solid #393939;
}

.rewards, .daily-coupons{
	float:left;
	width:40%;
	margin:0 10% 40px 0;
}

.reward-points{
	color:#ed3e6d;
	font-size:40px;
	font-family: RobotoCondensedRegular;
	text-transform:uppercase;
	margin:0 0 2px 0;
	line-height:40px;
}

.coupon-date{
	font-size:20px;
	margin:0 0 0 0px;
}

.coupon-offer{
	color:#ed3e6d;
	font-size:22px;
	font-family: RobotoCondensedRegular;
	text-transform:uppercase;
	border-bottom:1px dashed #b6b6b6;
	margin:0 0 10px 0;
}

.coupon-code{
	text-transform:uppercase;
	font-size:18px;
}

.request-call{
}

.md-perspective,
.md-perspective body {
	height: 100%;
	overflow: hidden;
}

.md-perspective body  {
	background: #222;
	-webkit-perspective: 600px;
	-moz-perspective: 600px;
	perspective: 600px;
}

.container {
	background: #e74c3c;
	min-height: 100%;
}

.md-modal {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 50%;
	max-width: 630px;
	min-width: 320px;
	height: auto;
	z-index: 2000;
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

.md-show {
	visibility: visible;
}

.md-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity:0;
	background:#ebebeb;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.md-show ~ .md-overlay {
	opacity: 0.8;
	visibility: visible;
}

/* Content styles */
.md-content {
	color: #2C2C2C;
	background: #fff;
	position: relative;
	border-radius: 3px;
	margin: 0 auto;
}

.md-content h3 {
	margin: 0;
	padding: 0.4em;
	text-align: center;	
	opacity:1;
	background:#ED3E6D;
	border-radius: 3px 3px 0 0;
	color:#fff;
	font-family: 'Roboto Condensed',sans-serif;
  font-size: 35px;
  font-weight: normal;
  line-height: 35px;  
  text-transform: uppercase;
}

.md-content > div {
	padding: 15px 40px 30px;
	margin: 0;
	font-weight: 300;
	font-size: 1.15em;
}

.md-content > div p {
	margin: 0;
	padding: 10px 0;
}

.md-content > div ul {
	margin: 0;
	padding: 0 0 30px 20px;
}

.md-content > div ul li {
	padding: 5px 0;
}

.md-content button, .md-content button:hover {
	display: block;
	margin: 0 auto;
	font-size: 0.8em;
}

/* Effect 9: 3D flip vertical */
.md-effect-9.md-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.md-effect-9 .md-content {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-70deg);
	-moz-transform: rotateX(-70deg);
	-ms-transform: rotateX(-70deg);
	transform: rotateX(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.md-show.md-effect-9 .md-content {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

.accordian-list-view{
	float:left;
	width:100%;
	margin:40px 0;
}

.accordian-list-view ul li{
	border-bottom:1px dashed #b6b6b6;
	padding:10px 0;
	float:left;
	width:100%;
}

.accordian-list-view ul ul li,
.accordian-list-view ul ul ul li{
	border-bottom:0px dashed #b6b6b6;
	padding:0 0 5px 0;
}

.accordian-list-view ul li a{
	color: #ED3E6D;
  display: inline-block;
  font-size: 18px;
}

.accordian-list-view .accordian-list-details{
	padding:5px 5% 0;
	display:none;
}

.accordian-list-view .accordian-list-details .accordian-trigger{
	display:block;
	background:#ed3e6d;
	color:#fff;
	padding:0 20px;
}

.accordian-list-view .accordian-list-details .accordian-trigger.active{
	background:#262626;
}

.accordian-list-view ul ul ul li{
	display:inline-block;
	width:auto;
	margin:0 30px 0 0;
	text-align:center;
}

.accordian-list-view ul ul ul li a{
	color:#08080C;
	font-size:14px;
}

.order-detail-view{
	float:left;
	width:100%;
	margin:-20px 0 40px 0;
}

.order-item-details{
	float:left;
	width:40%;
	margin:0 0 30px 0;
}

.order-item-details h3{
	font-family:RobotoCondensedRegular;
	font-size:18px;
	font-weight:normal;
	margin:0 0 15px 0;
}

.order-item-details label{
	display:inline-block;
	width:100px;
	line-height:28px;
	font-size:15px;
}

.order-cost-details{
	float:left;
	width:60%;
	margin:0 0 30px 0;
}

.order-cost-details ul li{
	float:left;
	width:25%;
	margin:0 0 30px 0;
	font-size:18px;
}

.order-cost-details ul li label{
	font-weight:bold;
	display:block;
	font-size:16px;
}

.order-cost-details .order-discount label{
	color:#ED3E6D
}

.shipping-options{
	float:left;
	width:40%;
	margin:0 0 30px 0;
}

.shipping-options h3{
	font-family:RobotoCondensedRegular;
	font-size:18px;
	font-weight:normal;	
}

.shipping{
	background:url(../images/shipping-icon.png) no-repeat;
	padding:5px 0 5px 45px;
	margin:0 0 30px 0;
}

.shipping-address{
	margin:15px 0 40px 0;
}

.next-service{
	color:#ED3E6D
}

.reward-earned{
	float:left;
	width:60%;
	margin:0 0 30px 0;
}

.reward-earned h3{
	color:#ED3E6D
}

.green-banner{
	display:inline-block;
	margin:70px 0 0 0;	
}

/* responsive css */

@media only screen and (max-width : 1150px) {	
	.content-area{padding:0 20px;}
	.table-list-view ul li .order-status{width:40%;}
	.table-list-view ul li .address-edit{width:40%;}
}

@media only screen and (max-width : 1023px) {		
	.call-requests {width:100%; float:left;}	
}

@media only screen and (max-width : 950px) {
	.table-list-view ul li .order-number,
	.table-list-view ul li .order-item-name,
	.table-list-view ul li .order-status{width:49%; padding:5px 0;}	
	.table-list-view ul li .address-location,
	.table-list-view ul li .address,
	.table-list-view ul li .address-edit{width:49%; padding:5px 0;}	
	.status-label{display:none;}	
}

@media only screen and (max-width : 880px) {
	header nav{display:none;}
	.dl-menuwrapper{display:inline-block !important;}	
	.order-item-details, .order-cost-details, .shipping-options, .reward-earned{width:100%;}
	.green-banner{margin:20px 0;}
}

@media only screen and (max-width : 767px) {	
	.table-list-view ul li .order-number,
	.table-list-view ul li .order-item-name,
	.table-list-view ul li .order-status{width:99%; padding:5px 0;}		
	.table-list-view ul li .address-location,
	.table-list-view ul li .address,
	.table-list-view ul li .address-edit,	
	.table-list-view ul li .payment-label,
	.table-list-view ul li .payment-by,
	.table-list-view ul li .payment-status,	
	.table-list-view ul li .address-edit-form .address-location, 
	.table-list-view ul li .address-edit-form .address,
	.table-list-view ul li .payment-details .address-location, 
	.table-list-view ul li .payment-details .address,
	.table-list-view ul li .order-details{width:99%; padding:5px 0;}
	.table-list-view ul li .address-edit-form .address-location, 
	.table-list-view ul li .address-edit-form .address,
	.table-list-view ul li .payment-details .address-location, 
	.table-list-view ul li .payment-details .address{display:block;}	
	.rewards, .daily-coupons{width:100%; margin:0 0 40px 0;}		
}

@media only screen and (max-width : 700px) {
	.nav-sidebar{display:none;}	
	.content-area{margin-left:0px;}
	body{background:#fff;}	
}

@media only screen and (max-width : 480px) {	
	h2{font-size:32px; line-height:32px; margin:20px 0 0 0; display:inline-block;}	
	.green-banner{width:100%;}
	.order-cost-details ul li{width:50%;}
}

@media only screen and (max-width : 320px) {	
	.table-list-view ul li .payment-details .address span{width:100%; display:inline-block;}
}