/* 
Vivida Office series
****************************************/

/* General styles */
	.section-title { display: none; }
	.section-title .pad { padding: 0; }

/* Office series - header */
	.office-series { background-position: center top; }

	/*.office-series .banner .pic {
		width: auto;
		height: auto;
		line-height: 18px;
		padding-top: 46px;
		max-height: none;
	}*/
	.office-series .banner .pic {
		position: relative;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}
	.office-series .banner .info{
		position: absolute;
		top:0;
		left:0;
	}
	
	section.office-series .container { 
		border-left: 1px solid transparent; 
		border-right: 1px solid transparent; 
		height: 460px; 
	}
	
	.office-series h2 { display: none; }
	.office-series .banner .info { padding-top: 216px;  }
	.office-series .banner .info .inner { vertical-align: baseline; }
	.office-series .desc { width: 235px; }
	.office-series .inner .pad { padding: 0; }
	
	/* Office series - tabs */

	.color-tabs .tab-nav {
		position: absolute;
		width: 100%;
		top: -18px;
		left: 0;
		z-index: 1000;
	}
	.color-tabs .tab-nav li { 
		display: block;
		float: left;
	}
	.color-tabs .tab-nav li a {
		padding: 0 0 0 5px;
		background: url("vivida-color-tabs.png") no-repeat transparent;
		display: block;
		line-height: 36px;
		height: 36px;
		text-indent: -9999px;
	}
	.color-tabs .tab-nav li a:hover,
	.color-tabs .tab-nav li.active a {
		background: url("vivida-color-tabs.png") no-repeat transparent;
		height: 57px;
		margin-top: -15px;
	}
	.color-tabs .tab-nav li.black a { 
		background-position: 0 0; 
	}

	.color-tabs .tab-nav li.blue a {	background-position: 0 -129px; }
	.color-tabs .tab-nav li.red a {		background-position: 0 -258px; }
	.color-tabs .tab-nav li.green a {	background-position: 0 -387px; }
	.color-tabs .tab-nav li.yellow a {	background-position: 0 -516px; }
	.color-tabs .tab-nav li.white a {	background-position: 0 -645px; }

	.color-tabs .tab-nav li.active.black a,
	.color-tabs .tab-nav li.black a:hover {		background-position: 0 -55px;  }
	.color-tabs .tab-nav li.active.blue a,
	.color-tabs .tab-nav li.blue a:hover {		background-position: 0 -184px; }
	.color-tabs .tab-nav li.active.red a,
	.color-tabs .tab-nav li.red a:hover {		background-position: 0 -313px;  }
	.color-tabs .tab-nav li.active.green a,
	.color-tabs .tab-nav li.green a:hover {		background-position: 0 -442px;  }
	.color-tabs .tab-nav li.active.yellow a,
	.color-tabs .tab-nav li.yellow a:hover {	background-position: 0 -571px;  }
	.color-tabs .tab-nav li.active.white a,
	.color-tabs .tab-nav li.white a:hover {		background-position: 0 -700px;  }

	/* color tabs - Title on the product grid */
	.color-tabs.cblock.no-border {
		border-top: 1px solid #eeeeed; 
	}
	.color-tabs .bg-dark { 
		background: transparent; 
		border-bottom: 1px solid #eeeeed; 
		border-top: 1px solid #eeeeed; 
	}

	.color-tabs section.cblock .section-title { 
		position: static;
		display: block;
		padding: 60px 0 35px 24px !important; /* so wrong. !important bad */
		border-bottom: 1px solid #eeeeed;
	}
	.color-tabs section.cblock .section-title .upperline { 
		border-top: none;
		width: 300px;
		font-family: "pragmaticabold", sans-serif;
		font-size: 28px;
		line-height: 36px;
	}
	.color-tabs section.cblock .section-title .upperline a { 
		color: #e71e00;
	}
	
	.color-tabs .label {  
		background: transparent;
		border-radius: 0;
		color: #e71e00;
		display: block;
		font-family: "pragmaticabold", sans-serif;
		font-size: 28px;
		font-weight: normal;
		line-height: 35px;
		padding: 67px 0 62px 21px;
		text-shadow: none;
		vertical-align: top;
		white-space: normal;
		width: 240px;
	}

	/* office series - image showcase */
	.image-showcase .showcase-block { margin-top: 65px; }

	.vivida-image-showcase .row-1 .txt-block-left .txt-container { padding: 0 163px 20px 0; }
	.vivida-image-showcase.image-showcase .block-row:last-child { margin-bottom: 5px; }

	.vivida-image-showcase .row-2 { padding-right: 0; }
	.vivida-image-showcase .row-2 .img-block-left { margin-right: 10px; }

	.vivida-image-showcase .txt-block-left h1 {
		color: #e71e00;
		font-family: "pragmaticabold", sans-serif;
		font-size: 28px;
		line-height: 36px;
	}
	.vivida-image-showcase .txt-block-left p { font-size: 12px; line-height: 20px; }
	
	.vivida-image-showcase #new-surface {
		position: absolute;
		right: 240px;
		bottom: 75px;
	}

	.vivida-image-showcase #filter-by-colour {
		position: absolute;
		bottom: 40px;
		left: 230px;
	}

	.image-showcase .showcase-block .row-1 .txt-block.txt-block-left{
        width: 447px;
        height: 275px;     
	}

	 .image-showcase .showcase-block .row-1 .img-block.img-block-right{
	        width: 487px; 
	        height: 275px;   
	}


	.image-showcase .showcase-block .row-2 .img-block.img-block-left{
	        width: 529px;
	        height: 455px     
	}

	.image-showcase .showcase-block .row-2 .img-block.img-block-right{
	        width: 410px;
	        height: 455px   
	}

	/* product grid - custom styles */
	.product-grid .grid .item { padding: 25px 10px; }
	.product-grid .grid .item .btn-more { bottom: 25px; }
	.product-grid .grid .span6:first-of-type .item,
	.product-grid .grid .span6:nth-child(4n+1) .item{ border-left: none; }
	.product-grid .grid .cta h2 {
		font-family: pragmatica, sans-serif;
		color: #e71e00;
		font-size: 28px;
		line-height: 35px;
	}
	
	.cblock.footer-links.accordion.bg-dark { border-top: none; }
	
/* Ipad mod */

@media (max-width: 985px) and (min-width: 768px) {

	/* office serries simple banner */
	.office-series .banner .pic img { width: 100%; }
	.office-series .banner .info{
		position: absolute;
		top:0;
		left:0;
	}
	/* showcase blocks */
	.vivida-image-showcase .row-1 .txt-block-left { width: 280px !important; }
	.vivida-image-showcase .row-1 .txt-block-left .txt-container { padding-right: 0; }
	.vivida-image-showcase .row-1 .img-block-right { width: 434px !important; }
	.vivida-image-showcase.image-showcase .block-row:last-child { margin-bottom: 5px; }

	.vivida-image-showcase .row-2 { padding-right: 0; }
	.vivida-image-showcase .row-2 .img-block { width: 321px !important; height: 370px !important; }
	.vivida-image-showcase .row-2 .img-block-left { width: 411px !important; margin-right: 17px; }

	.vivida-image-showcase .txt-block-left h1,
	.vivida-image-showcase .txt-block-left p { width: 255px; }
	.vivida-image-showcase .txt-block-left h1 {
		color: #e71e00;
		font-family: "pragmaticabold", sans-serif;
		font-size: 28px;
		line-height: 36px;
	}
	.vivida-image-showcase .txt-block-left p { font-size: 12px; line-height: 20px; }
	
	.vivida-image-showcase #new-surface	{ right: 195px; }
	
	/* Office series - tabs */

	.color-tabs .tab-nav { top: -18px; }
	.color-tabs .tab-nav li { 
		display: block;
		float: left;
		width: 128px !important;
	}
	.color-tabs .tab-nav li a {
		background: url("vivida-color-tabs-tablet.png") no-repeat transparent;
		height: 26px;
		line-height: 26px;
		padding: 0 5px 0 5px;
		width: 118px;
	}
	.color-tabs .tab-nav li a:hover,
	.color-tabs .tab-nav li.active a {
		background: url("vivida-color-tabs-tablet.png") no-repeat transparent;
		margin-top: -12px;
		height: 42px;
	}
	.color-tabs .tab-nav li.black a { 
		background-position: 0 0; 
		width: 118px; 
	}

	.color-tabs .tab-nav li.blue a {	background-position: 1px -94px; }
	.color-tabs .tab-nav li.red a {		background-position: 1px -189px; }
	.color-tabs .tab-nav li.green a {	background-position: 1px -284px; }
	.color-tabs .tab-nav li.yellow a {	background-position: 1px -379px ; }
	.color-tabs .tab-nav li.white a {	background-position: 1px -474px; }

	.color-tabs .tab-nav li.active.black a,
	.color-tabs .tab-nav li.black a:hover {		background-position: 1px -40px;  }
	.color-tabs .tab-nav li.active.blue a,
	.color-tabs .tab-nav li.blue a:hover {		background-position: 1px -135px; }
	.color-tabs .tab-nav li.active.red a,
	.color-tabs .tab-nav li.red a:hover {		background-position: 1px -229px;  }
	.color-tabs .tab-nav li.active.green a,
	.color-tabs .tab-nav li.green a:hover {		background-position: 1px -324px;  }
	.color-tabs .tab-nav li.active.yellow a,
	.color-tabs .tab-nav li.yellow a:hover {	background-position: 1px -419px;  }
	.color-tabs .tab-nav li.active.white a,
	.color-tabs .tab-nav li.white a:hover {		background-position: 1px -514px;  }
	
	.tabbed-block-content .tab-nav.tabs6 li a,
	.tabbed-block-content .tab-nav.tabs5 li a, 
	.tabbed-block-content .tab-nav.tabs4 li a, 
	.tabbed-block-content .tab-nav.tabs3 li a, 
	.tabbed-block-content .tab-nav.tabs6 li>span, 
	.tabbed-block-content .tab-nav.tabs5 li>span, 
	.tabbed-block-content .tab-nav.tabs4 li>span, 
	.tabbed-block-content .tab-nav.tabs3 li>span {
		padding:0;
	}
	.vivida-image-showcase #filter-by-colour{
		left: 170px;
	}
	
}

@media (max-width: 767px){
	.office-series .banner .info { padding-top: 0px; }
	.color-tabs { display: none; }
	.vivida-image-showcase .row-1 .txt-block-left .txt-container { padding-right: 0; }
/*	.vivida-image-showcase .row-2 .img-block-left { height: 50% !important; overflow: hidden;  }*/

	.vivida-image-showcase #filter-by-colour { display: none; }
	.vivida-image-showcase #new-surface { right: 195px; }
	
	.office-series .banner .pic {
		position: relative;
		top: 0;
		left: 0;
		height: auto;
		width: auto;
	}
	
	.office-series .banner .info{
		position: relative;
	}
}
