
	/* • Concept Development (CD)
	------------------------------------------------------------------------- */
	.cd-main-container  { overflow:hidden; background-color:#d7d7d7}
	.cd-content-blk	h1  { color:#666; z-index:10 }

					  .cd-content-wrapper { top:200px; left:150px; height:280px; overflow:hidden;
											  width:600px; background-color:#fff; padding:10px 20px; color:#666; z-index:10; transition: all 0.3s ease-out;
											}



					  .cd-content-blk, .cd-triangle-blk  { right:0; top:0; position:absolute}

					  .cd-content-blk  {  right:0; top:0; position:absolute; z-index:30}
					  .cd-content-blk .cd-content { float:left; padding:20px; transition: all 0.3s ease-out;}
					  .cd-content-blk .cd-content .cd-content-pos { padding-right:50px;}

					  .cd-triangle-blk { width:220px; z-index:5;
					                      transition: all 0.3s ease-out; z-index:5}
					  .cd-triangle-blk .cd-triangle { width:0; height:0;
										                border-style: solid;
										                border-width: 0 220px 220px 0;
										                border-color: transparent #809f1a transparent transparent; opacity:0.8;
										            	}


					  .cd-white-bg { width:640px; height:220px; background-color:#fff; position:absolute; top:0; left:0; z-index:2}				            


	.tri-m-hidden       { display:block}
	.tri-right-m-hidden { display:block}

	.tri { width:0; height:0; border-style:solid; transition: all 0.3s ease-out;}

	.tri-1 		{ border-width: 652px 652px 0 0; border-color: #ccc transparent transparent transparent;}
	.tri-1-pos  { position:absolute; top:0; left:-200px; z-index:10}
	.tri-2 	    { border-width: 630px 0 0 630px; border-color: transparent transparent transparent #b8b8b8;}
	.tri-2-pos  { position:absolute; bottom:0; left:0;z-index:7}
	.tri-3  	{ border-width: 652px 652px 0 0; border-color: #999 transparent transparent transparent;}
	.tri-3-pos  { position:absolute; top:0; margin-left:-300px; z-index:6}
	.tri-4		{ border-width: 0 0 201px 201px; border-color: transparent transparent #15948b transparent;}			 
	.tri-4-pos  { position:absolute; top:0; left:150px; z-index:5}
	.tri-5      { border-width: 0 0 220px 220px; border-color: transparent transparent #ba2950 transparent;}
	.tri-5-pos  { position:absolute; top:200px; margin-left:-70px; z-index:5;}
	.tri-6      { border-width: 100px 0 0 100px; border-color: transparent transparent transparent #795b97;}
	.tri-6-pos	{ position:absolute; top:101px; left:350px; z-index:5}   
	.tri-7  	{ border-width: 0 0 350px 350px; border-color: transparent transparent #795b97 transparent;}
	.tri-7-pos	{ position:absolute; top:-149px; left:440px; z-index:5} 
	.tri-8 		{ border-width: 680px 0 0 680px; border-color: transparent transparent transparent #15948b;}
	.tri-8-pos 	{ position:absolute; top:-260px; left:790px; z-index:5}
	.tri-9	 	{ border-width: 500px 500px 0 0; border-color: #eac074 transparent transparent transparent;}
	.tri-9-pos	{ position:absolute; top:201px; left:692px; z-index:2}
	.tri-10 	{ border-width: 700px 0 0 700px; border-color: transparent transparent transparent #999;}	
	.tri-10-pos { position:absolute; top:200px; left:692px; z-index:1}
	.tri-11 	{ border-width: 0 300px 300px 0; border-color: transparent #ba2950 transparent transparent; opacity:0.8}
	.tri-11-pos { position:absolute; bottom:0px; left:373px; z-index:5; top:0px;
				 -webkit-animation-delay: 0.5s; animation-delay: 0.5s;}
	.tri-12 	{ border-width: 150px 0 0 150px; border-color: transparent transparent transparent #999999;}
	.tri-12-pos	{ position:absolute; bottom:19px; left:504px; z-index:5;
				  -webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
	.tri-13 	{ border-width: 0 900px 900px 0;border-color: transparent #ccc transparent transparent;}
	.tri-13-pos { position:absolute; top:0; right:0; z-index:5}
	.tri-14     { border-width: 700px 0 0 700px; border-color: transparent transparent transparent #809f1a;}
	.tri-14-pos { position:absolute; top:-100px; left:68px; z-index:1}

	.tri-15     { border-width: 0 600px 600px 0; border-color: transparent #fff transparent transparent;}
	.tri-15-pos { position:absolute; top:0; left:92px; z-index:1;}



	.tri-delay-03  	{-webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
	.tri-delay-04  	{-webkit-animation-delay: 0.4s; animation-delay: 0.4s;}
	.tri-delay-05  	{-webkit-animation-delay: 0.5s; animation-delay: 0.5s;}
	.tri-delay-06  	{-webkit-animation-delay: 0.6s; animation-delay: 0.6s;}
	.tri-delay-08  	{-webkit-animation-delay: 0.8s; animation-delay: 0.8s;}
	.tri-delay-1    {-webkit-animation-delay: 1s; animation-delay: 1s;}
	.tri-delay-1-2  {-webkit-animation-delay: 1.2s; animation-delay: 1.2s;}
	.tri-delay-1-4  {-webkit-animation-delay: 1.4s; animation-delay: 1.4s;}
	.tri-delay-1-6  {-webkit-animation-delay: 1.6s; animation-delay: 1.6s;}
	.tri-delay-1-8  {-webkit-animation-delay: 1.8s; animation-delay: 1.8s;}
	.tri-delay-2  	{-webkit-animation-delay: 2s; animation-delay: 2s;}
	.tri-delay-2-2  {-webkit-animation-delay: 2.2s; animation-delay: 2.2s;}
	.tri-delay-2-4  {-webkit-animation-delay: 2.4s; animation-delay: 2.4s;}
	.tri-delay-2-6  {-webkit-animation-delay: 2.6s; animation-delay: 2.6s;}
	.tri-delay-2-8  {-webkit-animation-delay: 2.8s; animation-delay: 2.8s;}
	.tri-delay-3  	{-webkit-animation-delay: 3s; animation-delay: 3s;}
	.tri-delay-3-4  {-webkit-animation-delay: 3.4s; animation-delay: 3.4s;}

	.tri-delay-4  	{-webkit-animation-delay: 4s; animation-delay: 4s;}

    .s-tri  {display:none;}
    
	/* ==========================================================================
		Media Styles
	============================================================================= */

  	@media only screen and (max-width:1500px) {
	.tri-1   { border-width: 300px 300px 0 0; border-color: #ccc transparent transparent transparent;}
	.tri-2	 { border-width: 300px 0 0 300px; border-color: transparent transparent transparent #b8b8b8;}
 	.tri-13 { border-width: 0 700px 700px 0;border-color: transparent #ccc transparent transparent;transition: all 0.3s ease-out;}
  	}

  	@media only screen and (max-width:1300px) {
 	.tri-13 { border-width: 0 500px 500px 0;border-color: transparent #ccc transparent transparent;transition: all 0.3s ease-out;}
  	}

    @media only screen and (max-device-width: 1024px){
        .s-tri  {display:block;}
    }   
    
        
  	@media only screen and (max-width:1024px) {
	.tri-1   { border-width: 200px 200px 0 0; border-color: #ccc transparent transparent transparent;}
	.tri-8-pos 	{ top:-260px; left:780px;}
	.tri-9	 	{ border-width: 0 150px 150px 0; border-color:transparent #eac074 transparent transparent;}
	.tri-9-pos	{ position:absolute; top:270px; left:630px; z-index:2}
	.tri-10  { display:none}	
  	.tri-13  { border-width: 0 235px 235px 0;border-color: transparent #ccc transparent transparent;transition: all 0.3s ease-out;}
	.tri-11 	{ border-width: 0 350px 350px 0;}
	.tri-11-pos { left:430px; }
	.tri-12-pos	{ position:absolute; bottom:-60px; left:530px;}
	.tri-12 	{ border-width: 180px 0 0 180px; border-color: transparent transparent transparent #999999;}

		.cd-content-blk .cd-content .cd-content-pos { padding-right:20px;}
	  	.cd-content-wrapper { top:100px; height:200px; left:40px; width:450px;}
					  .cd-triangle-blk { width:180px;}
					  .cd-triangle-blk .cd-triangle { border-width: 0 180px 180px 0;}
  	}

	@media only screen and (max-width: 479px) {
	.tri-right-m-hidden       { display:none}


	.tri-5      { display:none}

	.tri-m-hidden       { display:none}
  	.cd-content-wrapper { top:62px; left:20px; height:320px; width:calc(100% - 40px); ; padding:0;}
  	.cd-content-blk .cd-content .cd-content-pos		{ padding-right: 0px;}
    }
 