// Create presentation popups all in one

.cpw{
	width:900px;
		.presentation-inputs{
			width:250px;
			float:left;
			font-size:12px;
			margin-right:30px;
				.input-text{
					margin: 5px 0;
				}
				input[type="text"]{
					font-size: 11px;
					color: #666666;
					padding: 6px 9px;
					width: 99%;
					font-style: italic;
				}
		}
		.input-line{
			margin:10px 0 20px;
			input[type="checkbox"]{
				float: left;
			}
			.input-text {
				float: left;
				margin-left: 10px;
			}
		}
		h3{
			&.h3-simple{
				text-transform: uppercase;
				margin-bottom: 10px;
			}
		}
		.accordian-arrow{
			border-right: 1px solid;
			padding: 6px;
			margin-right: 10px;
				i{
					&.fa-angle-right{
						width:8px;
						text-align:center;
					}
				}
		}
		.include-option{
			margin: 0px 0 25px;
			.report-text{
			  margin: 8px 0;
			  font-size: 11px;
			}
			select{
			  float: left;
			  margin-left: 15px;
			  font-size: 11px;
			  color: #000;
			  padding: 6px 9px;
			  width: 175px;
				option{
					font-size: 12px;
					&:nth-of-type(even){
						background-color: #ddd;
					}
				}
			}
			.filter-area{
				background: #efefef;
				padding:10px;
				margin-bottom:15px;
				.filter-heading{
					color: #000;
					font-size:13px;
					text-transform: uppercase;
					margin-bottom:15px;
				}
				.fa-filter{
					font-size:14px;
				}
				.filter-elements{
					float: left;
					width: 221px;
					margin-right: 15px;
					.for-search{
						position: relative;
						.search-icon{
							background-color: #2881c1;
							background-image: url("../img/sprite.svg");
							background-position: -137px -65px;
							cursor:pointer;
							height: 26px;
							position: absolute;
							right: 1px;
							top: 6px;
							width: 20px;
						}
						@-moz-document url-prefix() {
							.search-icon{
								height: 27px;
							}
						}
						@media screen and (-webkit-min-device-pixel-ratio:0) {
						 .search-icon{
								height: 25px;
							}
						}

					}
					input[type="text"]{
						font-size: 11px;
						color: #000;
						padding: 6px 30px 7px 6px;
						width:100%;
						font-size:11px;
						color:#666666;
						font-style: italic;
						margin:5px 0;
					}
					select{
						font-size: 11px;
						color: #000;
						padding: 6px 9px;
						width:100%;
						float:none;
						margin:5px 0;
						height:21px;
						line-height:21px;
							option{
								font-size: 12px;
								&:nth-of-type(even){
									background-color: #ddd;
								}
							}
					}
					@-moz-document url-prefix() {						
							select{
								height: 29px;
							}						
					}
					@media screen and (-webkit-min-device-pixel-ratio:0) {
						select{
							height: 27px;
						}
					}
					.btn{
						width: 100%;
						margin: 18px 0 0;
						height: 28px;
					}
					&:nth-of-type(5){
						margin-right: 0px;
						width: 130px;
						float: right;
					}
				}
				
			}
			.available-section{
				float: left;
				width: 43%;
				margin-bottom:10px;										
			}
			.center-arrows{
				float: left;
				width: 7%;
				margin-top: 75px;
				.right-side-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position: -84px -1px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: -84px -52px;
					}
				}
				.left-side-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position: -41px -1px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: -41px -52px;
					}
				} 
			}
			.include-section{
				float: left;
				width: 44%;
				margin-bottom:10px;							
			}
			.right-arrows{
				width:5%;
				float:right;
				margin-top: 16px;
				.top-double-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position:-81px -105px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: -81px -156px;
					}
				}
				.top-single-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position:0px -105px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: 0px -156px;
					}
				}
				.bottom-single-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position:-41px -105px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: -41px -156px;
					}
				}
				.bottom-double-arrow{
					background-image: url("../img/sprite.svg");
					width: 35px;
					height: 50px;
					background-position:-122px -105px;
					cursor: pointer;
					margin: 1px auto;
					&:hover{
						background-position: -122px -156px;
					}
				}
			}			
			.select-all-set {
				margin: 10px 0;
				input[type="checkbox"] {
					float: left;
				}
				.select-all-text {
					float: left;
					font-size: 11px;
					color: #000;
					margin: 0 5px;
				}
			}
		}
		.indicator-detail-outer{
			.indicator-detail-four{
				thead{
					width:100%;
					float:left;
						tr{
							width:100%;
						}
						tr:nth-of-type(1){
							background:$main-blue;
							color:#FFF;
							text-transform: uppercase;
						}
						td{
							padding:3px;
							i{
								cursor: pointer;
							}
							.info-white{
								background-image: url("../img/sprite.svg");
								background-repeat: no-repeat;
								background-position: -139px -22px;
								height: 16px;
								width: 17px;
								display: inline-block;
								top: 2px;
								position: relative;
							}
							&:nth-of-type(1){
								width:396px;
							}
							&:nth-of-type(2){
								text-align:left;
								width:99px;
							}
							&:nth-of-type(3){
								width:111px;
								text-align:center;
							}
							&:nth-of-type(4){
								width:112px;
								text-align:right;
							}
							&:last-child{
								padding-right:20px;
								width:142px;
								text-align:right;
							}
						}
				}
				tbody{
					max-height: 200px;
					overflow-y: scroll;
					float: left;
					width: 100%;
						tr{
							width: 100%;
						}
					td{
						height: 25px;
						vertical-align: middle;
						padding: 0 3px;
						font-size:12px;
						color:#000;
						&:nth-of-type(1){
							background-color: rgba(216, 216, 216, 0.8);
						}
						&:nth-of-type(2){
							background-color: rgba(229, 229, 229, 0.6);
							  max-width: 145px;								
						}
						&:nth-of-type(3){
							overflow: hidden;
							text-align: left;
							text-overflow: ellipsis;
							white-space: nowrap;
							max-width: 338px;
							width: 338px;
								@media only screen and (max-width:$standard-target-width){
									max-width:45px;
								}
								span{
									&.pres_loc{
										width: 338px;
										display: block;
									}
								}
						}
						&:nth-of-type(4), &:nth-of-type(5), &:nth-of-type(6), &:nth-of-type(7){
							text-align:right;
							width:125px;
						}
						&.indi-icon-default{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							width: 24px;
							background-position: -137px 2px;
						}
						&.indi-icon-yoy-per{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -165px 2px;
							width:24px;
						}
						&.indi-icon-yoy{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -192px 2px;
							width:24px;
						}
						&.indi-icon-mom-per{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -220px 2px;
							width:24px;
						}
						&.indi-icon-mom{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -247px 2px;
							width:24px;
						}
						&.icon-seasonal {
							width: 21px;
							text-align: center;
							img{
								width: 11px;
							}
						}
						select{
							width:88%;
							float:right;
							height:17px;
							font-size:11px;
								option{
									font-size: 12px;
									&:nth-of-type(even){
										background-color: #ddd;
									}
								}
						}
						input[type="text"]{
							width:85%;
							float:right;
							height:17px;
							font-size:11px;
							padding:0 3px;
						}
					}
					tr{
						&:hover{
							background-color: #B2E0FF;
						}
						&:nth-of-type(odd) {
							background-color: rgba(237, 237, 237, 0.6);
						}
						&:nth-of-type(even) {
							background-color: rgba(221, 221, 221, 0.6);
						}
					}
				}				
			}
			.indicator-detail-two{
				margin-bottom:10px;
				thead{
					width:100%;
					float:left;
						tr{
							width:100%;
						}
						tr:nth-of-type(1){
							background:$main-blue;
							color:#FFF;
							text-transform: uppercase;
						}
						td{
							padding:3px;
							.info-white{
								background-image: url("../img/sprite.svg");
								background-repeat: no-repeat;
								background-position: -139px -22px;
								height: 16px;
								width: 17px;
								display: inline-block;
								top: 2px;
								position: relative;
							}
							&:nth-of-type(1){
								width:505px;
							}
							&:nth-of-type(2){
								text-align:left;
								width:139px;
							}							
							&:last-child{
								padding-right:20px;
								width:217px;
								text-align:right;
							}
						}
				}
				tbody{
					max-height: 200px;
					overflow-y: scroll;
					float: left;
					width: 100%;
						tr{
							width:100%;
						}
					td{
						height: 25px;
						vertical-align: middle;
						padding: 0 3px;
						font-size:12px;
						color:#000;
						&:nth-of-type(1){
							background-color: rgba(216, 216, 216, 0.8);
						}
						&:nth-of-type(2){
							background-color: rgba(229, 229, 229, 0.6);
							  max-width: 145px;    
						}
						&:nth-of-type(3){
							overflow: hidden;
							text-align: left;
							text-overflow: ellipsis;
							white-space: nowrap;
							max-width:408px;
							width:408px;
								@media only screen and (max-width:$standard-target-width){
									max-width:225px;
									width:225px;
								}
						}
						&:nth-of-type(4), &:nth-of-type(5){
							text-align:right;
							width:200px;
						}
						&.indi-icon-default{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							width: 24px;
							background-position: -135px 2px;
						}
						&.indi-icon-yoy-per{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -163px 2px;
							width:24px;
						}
						&.indi-icon-yoy{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -190px 2px;
							width:24px;
						}
						&.indi-icon-mom-per{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -218px 2px;
							width:24px;
						}
						&.indi-icon-mom{
							background-color: rgba(216, 216, 216, 0.8);
							background-image: url("../img/sprite.svg");
							background-repeat: no-repeat;
							text-align: center;
							background-position: -245px 2px;
							width:24px;
						}
						&.icon-seasonal {
							width: 17px;
							text-align: center;
							img{
								width: 95%;
							}
						}
						select{
							width:70%;
							float:right;
							height:17px;
							font-size:11px;
								option{
									font-size: 12px;
									&:nth-of-type(even){
										background-color: #ddd;
									}
								}
						}
						input[type="text"]{
							width:70%;
							float:right;
							height:17px;
							font-size:11px;
							padding:0 3px;
						}
					}
					tr{
						&:nth-of-type(odd) {
							background-color: rgba(237, 237, 237, 0.6);
						}
						&:nth-of-type(even) {
							background-color: rgba(221, 221, 221, 0.6);
						}
					}
				}				
			}
			.show-input{
				background-color:#949393;
				padding:7px;
				margin-bottom:10px;
					input[type="checkbox"]{
						float:left;
					}
					.show-text{
						float:left;
						font-size:12px;
						color:#FFF;
						font-style:italic;
						margin-left:5px;
					}
			}
		}
		.indicator-detail-two{
			margin-bottom:10px;
			thead{
				tr:nth-of-type(1){
					background:$main-blue;
					color:#FFF;
					text-transform: uppercase;
				}
				td{
					padding:3px;
					.info-white{
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						background-position: -139px -22px;
						height: 16px;
						width: 17px;
						display: inline-block;
						top: 2px;
						position: relative;
					}
					&:nth-of-type(2), &:nth-of-type(3), &:nth-of-type(4), &:nth-of-type(5){
						text-align:right;
						width:19%;
					}
				}
			}
			tbody{
				td{
					height: 25px;
					vertical-align: middle;
					padding: 0 3px;
					font-size:12px;
					color:#000;
					&:nth-of-type(1){
						background-color: rgba(216, 216, 216, 0.8);
					}
					&:nth-of-type(2){
						background-color: rgba(229, 229, 229, 0.6);
						  max-width: 145px;    
					}
					&:nth-of-type(3){
						overflow: hidden;
						text-align: left;
						text-overflow: ellipsis;
						white-space: nowrap;
						max-width:145px;
					}
					&.indi-icon-default{
						background-color: rgba(216, 216, 216, 0.8);
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						text-align: center;
						width: 24px;
						background-position: -135px 2px;
					}
					&.indi-icon-yoy-per{
						background-color: rgba(216, 216, 216, 0.8);
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						text-align: center;
						background-position: -163px 2px;
						width:24px;
					}
					&.indi-icon-yoy{
						background-color: rgba(216, 216, 216, 0.8);
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						text-align: center;
						background-position: -190px 2px;
						width:24px;
					}
					&.indi-icon-mom-per{
						background-color: rgba(216, 216, 216, 0.8);
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						text-align: center;
						background-position: -218px 2px;
						width:24px;
					}
					&.indi-icon-mom{
						background-color: rgba(216, 216, 216, 0.8);
						background-image: url("../img/sprite.svg");
						background-repeat: no-repeat;
						text-align: center;
						background-position: -245px 2px;
						width:24px;
					}
					&.icon-seasonal {
						width: 17px;
						text-align: center;
						img{
							width: 95%;
						}
					}
					select{
						width:70%;
						float:right;
						height:17px;
						font-size:11px;
							option{
								font-size: 12px;
								&:nth-of-type(even){
									background-color: #ddd;
								}
							}
					}
					input[type="text"]{
						width:70%;
						float:right;
						height:17px;
						font-size:11px;
						padding:0 3px;
					}
				}
				tr{
					&:nth-of-type(odd) {
					background-color: #ededed;
					}
					&:last-child{
						
					}
					.show-input{
						input[type="checkbox"]{
							float:left;
						}
						.show-text{
							float:left;
							font-size:12px;
							color:#FFF;
							font-style:italic;
							margin-left:5px;
						}
					}
				}
			}		
		}
		
	&.ccp{
		width: 1250px;
		.err-message-show{
			margin-bottom: 10px;
		}
		.ccp-left{
			float: left;
			width: 860px;
				&.full-width{
					width: 100%;
						.filter-elements{
							width: 291px;
						}
				}
				.indicator-detail-outer {
					.btn {
						margin-top:15px;
					}
				}
		}
		.ccp-right{
			float: right;
			width: 350px;
			.info-pop{
				background-color: #888888;
				padding: 10px;
				font-size: 12px;
				color: $white;
				position: relative;
				.icon-size{
					font-size: 20px;
				}
				.info-pop-cross{
					position: absolute;
					right: 6px;
					top: 1px;
					color: #fff;
					font-size: 25px;
					&:hover{
						color: #ccc;
					}
				}
				h5{
					font-size: 13px;
					text-transform: uppercase;
					margin: 10px 0 3px;
				}
				p{
					font-size: 12px;
					line-height: 15px;
					margin-bottom: 20px;
				}
				ul {
					padding-left: 22px;
					li {
						margin-bottom:5px;
						list-style:disc;
						line-height: 16px;
					}
				}
			}
		}
		&.popup-area {
			.white-bar {
				.body-title {
					&.p-set {
						padding: 20px 0 10px;
						text-transform: none;
						color:#acacac;
						font-size:24px;
					}
				}
			}
		}
		.presentation-section {
			.ccp-left {
				width:100%;
				float:right;
			}
			.ccp-right {
				width:100%;
				float:left;
				.info-pop {
					.icon-size {
						float: left;
						margin-right: 20px;
						line-height: 44px;
					}
				}
				.single-sec {
					margin-right: 35px;
					float:left;
					p {
						margin-bottom:0;
						i {
							color:#000;
								&.fa-plus{
									    background-color: #000;
										color: #fff;
										font-size: 9px;
										padding: 3px;
								}
						}
						img {
							width:12px;
							position:relative;
							top:-2px;
						}
					}
				}
			}
		}
		.template-section {
			.ccp-left {
				width:100%;
				float:right;
					.upload-section{
						margin: 10px 0;
						padding: 10px;
						background-color: #efefef;
							h3{
								text-transform: uppercase;
								font-weight: normal;
								margin-bottom: 15px;
								font-size: 13px;
								color: #000;
							}
							.new-ad{
								float: left;
								width: 330px;
								.up-t{
									float: left;
									margin: 0 0 5px 0;
								}
								.up-area{
									float: left;
									position: relative;
										input[type="file"]{
											border: 1px solid $main-blue;
										}
										button{
											&.btn{
												background-color: #1c81c7;
												color: #fff;
												font-size: 11px;
												position: absolute;
												left: 0;
												top: 0;
												width: auto;
												padding: 5px 15px;
												line-height: initial;
												height: auto;
												text-transform: none;
												pointer-events: none;
												cursor: pointer;
													@-moz-document url-prefix() {
														padding: 5px 8px;
													}
											}
										}
								}
							}
							.btn-area{
								float: right;
									.btn{
										height: 23px;
										margin-top: 19px;
											@-moz-document url-prefix() {
												height: 26px;
												margin-top: 20px;
											}
									}
							}
					}
					.temp-areas-outer{
						.default-area{
							width: 370px;
							float: left;
							margin: 10px 0 10px 0;
							padding-bottom: 10px;
							background-color: #efefef;
								ul{
									height: 435px;
									overflow-y: scroll;
										li{
											padding: 10px 5px 5px;
											list-style: none;
												&:hover, &.active{
													background-color: #B2E0FF;
												}
												.input-use{
													float: left;
													width: 20px;
													text-align: left;
													margin: 70px 0 0 0;
												}
												.image-area{
													float: left;
													width: 297px;
														.image-area-left{
															width: 197px;
															float: left;
																img{
																	width: 100%;
																	border: 1px solid #000;
																	height: 148px;
																}
														}
														.image-area-right{
															width: 95px;
															float: right;
																img{
																	width: 100%;
																	border: 1px solid #000;
																	height: 71.65px;
																}
																.bottom{
																	margin-top: 5px;
																}
														}
														h3{
															margin: 10px 0 5px;
														}
														p{
															font-style: italic;
															line-height: 15px;
														}
												}
												.btns{
													float: right;
													width: 20px;
														span{
															background-color: #aaaaaa;
															display: block;
															color: #FFF;
															padding: 8px 0;
															text-align: center;
															margin-bottom: 5px;
															cursor: pointer;
																&:hover{
																	background-color: #666766;
																}
														}
												}
										}
								}
								.upload-template-btn{
									    background-color: #aaaaaa;
										width: 96%;
										margin: 0 auto;
										height: 42px;
										color: #fff;
										text-transform: uppercase;
										font-size: 14px;
										line-height: 42px;
										text-align: center;
										cursor: pointer;
										margin-top: 10px;
											&:hover{
												background-color: #949393;
											}
								}
						}
						.upload-area{
							width: 800px;
							float: right;
							margin: 10px 0 10px 0;
								.gray-head{
									color: #acacac;
									font-size: 24px;
									margin-bottom: 20px;
								}
								.upload-list{
									margin: 0 0 40px 0;
										ul{
											li{
												float: left;
												list-style: none;
												width: 240px;
													&:nth-of-type(2){
														margin: 0 20px;
													}
													.slide-type{
														color: #000;
														font-size: 15px;
														text-align: center;
													}
													.slide-img-type{
														margin: 10px 0;
															img{
																width: 100%;
																height: 180px;
															}
													}
													.image-upload{
														label{
															background-color: #efefef;
															font-size: 13px;
															color: #000;
															text-align: center;
															height: 35px;
															line-height: 35px;
															width: 100%;
															display: block;
															cursor: pointer;
																&:hover{
																	background-color: #1b78b9;
																	color: #FFF;
																}
														}														
														input{
															display: none;
														}
													}
											}
										}
								}
								.upload-fields{
									label{
										margin: 5px 0;
										display: block;
									}
									input[type="text"]{
										font-size: 11px;
										color: #666666;
										padding: 6px 9px;
										width: 50%;
										font-style: italic;
										margin-bottom: 10px;
									}
									textarea{
										font-size: 11px;
										color: #666666;
										padding: 6px 9px;
										width: 50%;
										font-style: italic;
										border: 1px solid #1c81c7;
										min-height: 60px;
										margin-bottom: 10px;
										font-family: Arial, Helvetica, sans-serif;
									}
								}
						}
						.temp-areas-left{
							float: left;
							width: 225px;
						}
						.bx-wrapper{
							.bx-viewport{
								width: 88.3% !important;
								margin: 0 auto;
							}
							.bx-controls{
								.bx-controls-direction{
									a{
										width: 35px;
										height: 35px;
										background-image: url("../img/slider-controls.png");
										background-repeat: no-repeat;
										transition: initial;
										z-index: 19;
											&.bx-prev{
												background-position: 0 0;
													&:hover{
														background-position: 0 bottom;
													}
											}
											&.bx-next{
												background-position: right top;
													&:hover{
														background-position: bottom right;
													}
											}
									}
								}
							}
						}
						.temp-areas-right{
							width: 995px;
						}
						.temp-areas{
							margin: 10px 15px 10px 0;
							width: 210px !important;
							float: left;
							position: relative;
								.type-bar{
									background-color: $main-blue;
									color: $white;
									font-size: 12px;
									text-transform: uppercase;
									padding: 5px 10px;
									height: 24px;
									position: relative;
										.input-type{
											float: left;
										}
										.t-names{
											float: left;
											font-size: 12px;
											font-weight: normal;
											margin: 0 5px;
											text-transform: none;
											width: 145px;
												input[type="text"]{
													width: 95%;
													background: none;
													border: 1px solid #fff;
													margin-top: -2px;
													font-size: 12px;
													color: #fff;
													padding: 0 5px;
												}
										}
										.right-icon{
											width: 20px;
											color: #fff;
											text-align: center;
											height: 24px;
											font-size: 15px;
											padding: 3px 4px;
											margin: -5px 0 0 0;
												&:hover{
													cursor: pointer;
												}
											&.edit{
												width: 21px;
												float: left;
											}
										}									
								}
								.temp-types{
									background-color: #f2f2f2;
									padding: 15px 5px 0 5px;
									border: 1px solid #d3d3d3;
									min-height: 122px;
									ul{
										li{										
											list-style: none;
											margin: 0 0 15px 0;
												&.default{
													text-align: center;
													width: 169px;
													margin: 0 auto 15px;
													h5{
														color: $black;
														font-size: 11px;
														font-weight: normal;
														margin: 3px 0 0;
														text-align: center;
													}
													.img-set{
														height: 128px;
															img{
																border: 1px solid $main-blue;
																max-width: 100%;
															}
													}
													img{
														border: 1px solid $main-blue;
														max-width: 100%;
													}
												}
												.temp-side{
													float: left;
													width: 170px;
														h5{
															color: $black;
															font-size: 11px;
															font-weight: normal;
															margin: 3px 0 0;
															text-align: center;
														}
														.img-set{
															height: 128px;
																img{
																	border: 1px solid $main-blue;
																	max-width: 100%;
																}
														}
														
												}
												.temp-edit{
													float: right;
													margin: 30px 0 0 0;
														span{
															i{
																background-color: #a9aaaa;
																padding: 5px;
																margin: 1px 0;
																cursor: pointer;
																color: $white;
																font-size: 15px;
																display: block;																
																	&:hover{
																		background-color: #666766;
																	}
															}
															.image-upload{
																input{
																	display: none;
																}
															}
														}
												}
												
										}
									}
								}
						}
						.slide-panel-right{
							float: right;
							margin-top: 230px;
								span{
									font-size: 40px;
									color: #a9aaaa;
										&:hover{
											color: $main-blue;
											cursor: pointer;
										}
								}
						}
						.slide-panel-left{
							float: left;
							margin-top: 230px;
							margin-right: 20px;
								span{
									font-size: 40px;
									color: #a9aaaa;
										&:hover{
											color: $main-blue;
											cursor: pointer;
										}
								}
						}
					}
			}
			.ccp-right {
				width:100%;
				float:left;
				.info-pop {
					.icon-size {
						float: left;
						margin-right: 20px;
					}
				}
				.single-sec {
					float:left;
					margin-top: -10px;
					p {
						margin-bottom:0;
						i {
							color:#000;
						}
						img {
							width:12px;
							position:relative;
							top:-2px;
						}
					}
				}				
			}
		}
		.ppt-name {
			.ccp-left {
				width: 50%;
				.presentation-inputs {
					width:95%;
					margin-right:50px;
					&:first-child {
						margin-bottom: 20px;
					}
				}
				.h30{
					height: 30px;
				}
				.btn{
					&.gray-btn{
						&.w112{
							width: 112px;
						}
					}
				}
				.form-element{
					margin-bottom: 15px;
					.template_image_del{
						width: 95%;
						border-bottom: 1px solid #000;
						padding-bottom: 10px;
							.temp-select{
								float: left;
								width: 200px; 
								cursor:pointer;
									label{
										font-size: 16px;
										padding-bottom: 10px;
										display: block;
									}
							}
							.browse-right{
								float: left;
								margin: 70px 0 0 30px;
									input{
										padding: 7px;
										border: 1px solid #999;
									}
									.img_upload_pres {
										color: red;
										font-size: 10px;
										margin: 5px 0 0 0;
									}
							}
					}
				}
			}
			.ccp-right {
				float:left;
				width: 50%;
			}
		}
	}
}
.manage-slide-custom-overlay{
	position:fixed;
	background: rgba(0, 0, 0, 0.9);
	z-index:10000;
	width:100%;
	height:100%;
	top:0;
	left:0;
		.manage-slide-custom{
			position: relative;
			width:90%;
			left:0;
			top:0;
			background-color:#FFF;
			margin:30px auto;
				.ms-head{
					background-color: $main-blue;
					padding: 5px 10px;
					height:50px;
					color: $white;
						.ms-title{
						    color: #ffffff;
							font-size: 16px;
							text-transform: uppercase;
							line-height: 40px;
								span{
									&.go-back{
										float: left;
										background-image: url("../img/sprite.svg");
										width: 35px;
										height: 50px;
										background-position: -41px -1px;
										cursor: pointer;
										margin-top: -5px;
										padding: 0px;
										margin-left: -10px;
										border-right: 1px solid #FFF;
										margin-right: 10px;
											&:hover{
												background-position: -41px -52px;
											}
									}
								}
						}
						.ms-close{
							position: absolute;
							top: 0px;
							right: 0px;
							display: block;
							background: url(../img/popup-cross-sprite.svg) no-repeat top left;
							width: 34px;
							height: 50px;
							text-indent: -9999px;
							cursor:pointer;
								&:hover{
									background-position: bottom left;
								}
						}
				}
				.ms-body{
					background-color: $white;
					padding: 10px;
					color: #000000;
					font-size: 12px;
					position: relative;
						.manage-slides{
							margin:5px 0;
							.slide-option{
								float:left;
								margin-right:30px;
								.number{
									font-size: 12px;
									font-weight: bold;
									padding: 0 9px;
									border: 2px solid #000;
									float: left;
									border-radius: 50%;
									height: 30px;
									width: 30px;
									line-height: 25px;
								}
								.slide-text{
									float:left;
									margin-left:5px;
									.slide-heading{
										font-size:12px;
										text-transform: uppercase;
										font-weight:bold;
									}
									.slide-description{
										font-size:11px;
										color:#000;
									}
								}
							}
							.coloum-outer{
								.coloum-outer{
									max-height:700px;
									overflow-y:auto;
										@media only screen and (max-width:1366px){
											max-height:400px;
										}
								}
								.column{
									.portlet{
										.portlet-header{
											background: #ccc;
										}
									}
								}
							}
						}
						.mb30{
							margin-bottom:30px;
						}
						.btn{
						  font-size: 14px;
						  color: #FFFFFF;
						  border: none;
						  width: 215px;
						  text-transform: uppercase;
						  height: 42px;
						  cursor: pointer;
						  position:relative;
						  &.wizard-btn{
							width:330px;
						  }
						  &.btn-right-margin{
								margin-right: 15px;
							}
						  &.blue-btn{
							background: $main-blue;
							&:hover{
							  background: #1b78b9;
							}
						  }
						  &.gray-btn{
							background: #aaaaaa;
							&:hover{
							  background: #949393;
							}
						  }
						  .btn-loader{
							position:absolute;
							right:11px;
							top:11px;
							z-index:20;
						  }
						}
						.btn-margin{
						  margin: 0 15px;
						}
						p{
							line-height:20px;
						}
				}
		}
}
@media screen and (max-width:$ipad){
	.cpw{
		width: 700px;
		.include-option{
			.filter-area{
				.filter-elements{
					width:150px;
					margin-right:10px;
				}
			}
		}
		.manage-slides{
			.slide-option{
				float: none;
				margin-bottom: 20px;
			}
		}
	}
}  

.top-breadcrumb {
	list-style: none; 
	overflow: hidden; 
	li { 
		float: left; 
		a {
			text-decoration: none; 
			padding:10px 0 10px 5px;
			background-color: #efefef; 
			position: relative; 
			display: block;
			float: left;
			color:#666666;
			width:213px;
			text-align:center;
			b {
				position:relative;
				z-index:3;
			}
			&:after { 
				content: " "; 
				display: block; 
				width: 0; 
				height: 0;
				border-top: 50px solid transparent;
				border-bottom: 50px solid transparent;
				border-left: 30px solid #efefef;
				position: absolute;
				top: 50%;
				margin-top: -50px; 
				left: 90%;
				z-index: 2; 
			}
			&:before { 
				content: " "; 
				display: block; 
				width: 0; 
				height: 0;
				border-top: 50px solid transparent;
				border-bottom: 50px solid transparent;
				border-left: 30px solid white;
				position: absolute;
				top: 50%;
				margin-top: -50px; 
				margin-left: 9px;
				left: 88%;
				z-index: 1; 
			}	
		}
		&:first-child {
			a {
				padding-left:10px;
			}
		}
		&.active {
			a {
				background-color: #7eafd0;
				color:#fff;
				&:after {
					border-left-color: #7eafd0;
				}
			}
		}
	}
}