Your IP : 10.10.0.253


Current Path : /var/www/media/plg_social2s/css/
Upload File :
Current File : /var/www/media/plg_social2s/css/s2sv4_backend.scss

@media (max-width: 768px) {

}

@media (min-width: 768px) {

	.s2s_version h4{
		padding: 0;
		margin: 0;
	}
	.form-horizontal .accordion-body .control-label{
		//text-align: right;
		//width: 150px;
		label{
			//display:inline-flex;
			//align-items:center;
		}       
	}
	/*
	.accordion-group{
		transition: all 300ms;
		&.s2s_acc_open{
			border:solid 1px #b7cde2;
			box-shadow: 1px 5px 16px 0px rgba(95, 132, 167, 0.66);
		}
	}
	*/


}

.btn-jtotal{
	background: rgb(241,102,156);
	background: -moz-linear-gradient(45deg, rgb(241,102,156) 0%, rgb(229,170,97) 21%, rgb(206,197,89) 46%, rgb(125,185,232) 80%, rgb(94,145,241) 100%);
	background: -webkit-linear-gradient(45deg, rgb(241,102,156) 0%,rgb(229,170,97) 21%,rgb(206,197,89) 46%,rgb(125,185,232) 80%,rgb(94,145,241) 100%);
	background: linear-gradient(45deg, rgb(241,102,156) 0%,rgb(229,170,97) 21%,rgb(206,197,89) 46%,rgb(125,185,232) 80%,rgb(94,145,241) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1669c', endColorstr='#5e91f1',GradientType=1 );

	border:none;
	color:#333;
	box-shadow: 0 3px 10px #333;
	
	&:hover{
		background: linear-gradient(45deg, rgb(251,202,256) 0%,rgb(259,220,97) 21%,rgb(206,197,89) 46%,rgb(225,185,232) 80%,rgb(144,145,241) 100%);
	}
}

/*ACCORDIONS*/
.accordion-body >div {
  padding-left: 10px;
}

.accordion-heading a.accordion-toggle{
  //background: #ECECEC;
}
 
.accordion-heading a:hover{
  text-decoration: none;
}

ul.s2s_order li.fo-plus_q, ul.s2s_order li.fo-plus_s, ul.s2s_order li.fo-rplus_q, ul.s2s_order li.fo-rplus_s{
	background-image: linear-gradient(to bottom,#BDDEFF,#fff);
}
ul.s2s_order li.fo-plus_q:hover, ul.s2s_order li.fo-plus_s:hover, ul.s2s_order li.fo-rplus_q:hover, ul.s2s_order li.fo-rplus_s:hover{
	background-image: linear-gradient(to bottom,#BDDEFF,#E6E6E6);
}
ul.s2s_order li.fo-plus_q ~ li, ul.s2s_order li.fo-plus_s ~ li, ul.s2s_order li.fo-rplus_q ~ li, ul.s2s_order li.fo-rplus_s ~ li{
	background-image: linear-gradient(to bottom,#B1B1B1,#E6E6E6);
}

/*V4*/
.s2-btn-mini .btn{
	padding-left: 6px;
	padding-right: 6px;
	padding-top: 2px;
	padding-bottom: 2px;
}






label.hasPopover{
	font-weight: bold;
}



.accordion-heading,.accordion-heading a,.accordion-heading h3,.accordion-group *{
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;

  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;

}

/*********************/

/*****ACCORDION*******/

/*********************/

div.accordion-group{
	transition: all 300ms;
	//HEADING
	div.accordion-heading{
		position: relative;

		a.accordion-toggle{
			
			background-color: #fff;
			color: #4d4d4d;
			text-decoration: none !important;
			transition: all 300ms;
			&:hover {
				background-color: #f7ebe7;
			}
			&:after {
				content: "\f055";
				font-family: 'Font Awesome\ 5 Free';
				position: absolute;
				right: 20px;
				top: 14px;
				font-size: 1.6rem;
				transition: transform 400ms, color 350ms;
				transform-origin: center center;
				transform: rotateZ(0deg) scale(0.6);
				color: #8295a9;
				-webkit-backface-visibility: hidden;
			}
			h3 {
				margin: 4px 0px;
				transform: translateX(0px);
				transition: margin 300ms, transform 300ms;
			}
		}
	} //OPEN
	&.s2s_acc_open {
		//border:solid 1px #fbc9b9;
		box-shadow: 1px 5px 16px 0px rgba(95, 132, 167, 0.66);
		border-radius: 10px 10px 2px 2px;
		div.accordion-heading {

			a.accordion-toggle {
				background-color: #efe0db;
				background-color: #bc2d00;
				color: #bc2d00;
				color: #fff;
				border-radius: 10px 10px 2px 2px;
				&:after {
					transform: rotateZ(135deg);
					color: #7b2525;
					color: #fff;
				}
			}
		}
	}

	//BODY
	.accordion-body {
		//z-index: 99999;
		opacity: 0;
		transform-origin: top; //transform:translateY(-100px);
		transform: scaleY(0);
		transition: transform 400ms, height 400ms, opacity 400ms !important;
		background:#ececec;
		box-shadow: 0 0 4px rgba(0,0,0,0.2) inset;
		&.in {
			opacity: 1;
			transform: scaleY(1);
			z-index: 1;
		}
		.s2sfo{
			display: inline-block;
			font-style: normal;
			font-variant: normal;
			text-rendering: auto;
			line-height: 1;
		}
		>.control-group{
			display: flex;
			align-items: stretch;
			//justify-items:stretch;
			border-top: solid 1px #dedede;
			border-bottom:solid 1px #f9f9f9;
			margin:0px;
			padding-top: 0px;
			padding-bottom: 0px;    

			&:nth-child(2n-1) {
				//background: #fafafa;
				//padding-left: 10px;
			}


			>div{
				display: flex;
				align-items: stretch;
				align-items: center;
			}
			.control-label{
				padding-top: 0px;
				padding-right: 10px;
				padding-bottom: 0px;
				label {
					.s2sfo, .fa{
						color:#666;
						padding-right:4px;
					}
					&#jform_params_s2s_order-lbl{
						display: inline-block;
					}
				}
			}
			.controls{
				padding-left: 10px;
				margin-left:0px;
				padding-top: 15px;
				padding-bottom: 15px;
				background:yellow; 
				width:100%;
				background: #fafafa;
				height:100%;
				align-self:center;

			}

			&.field-spacer{
				padding:4px 0px;
				.controls{
					padding:0px;
				}
				.control-label{
					hr{
						display:none;
					}
				}
			}

		}
	}
}



#attrib-SOCIAL2S_SOCIAL > div.control-group > div.control-group > div.control-label{
		display: none !important;
}

#attrib-SOCIAL2S_SOCIAL > div.control-group  div.accordion-heading a{
		display: flex;
		align-items: center;
}
#attrib-SOCIAL2S_SOCIAL > div.control-group  div.accordion-heading a >span{
		padding-right: 6px;
}



body.s2s_j3 div.span12 > #style-form > div.form-horizontal > ul.nav.nav-tabs{
	position: sticky;
	top:82px;
	background: white;
	z-index: 1000;
}  


/**********************/
/*   Joomla V3.x      */
/**********************/
body.s2s_j3{

	//general
	div#general{
		div.row-fluid{
			div.span9{
				>hr{
					display:none;
				}
				>h3{
					display:none;
				}
				div.info-labels{
					display:none;
				}
			}
		}
	}

	.modal-backdrop{
		z-index:-1;
	}

}





/**********************/
/**********************/
/*   Joomla V4.x      */
/**********************/
/**********************/

body.s2s_j4{

	img.s2s_logo_portada{
		max-width: 100%;
	}



	div.card{
		> a.card-header{
			+ div > div.card-body{
				opacity:1;
				transform-origin:top;
				transform:scaleY(1);
				transition: transform 400ms, height 400ms, opacity 400ms !important;
			}
			&.collapsed{
				+ div > div.card-body{
					opacity:0;
					//transform:translateY(-100px);
					transform:scaleY(0);
				}
			}
		}

		.custom-select{
			width:inherit;
		}
	}
	.control-group > .control-label{
		margin-left: 0px;
		width: 0px;
	}
	.control-label > div.alert.alert-info{
		display:none;
	}


	//ELEMENTS OUT OF CARDS
	section > div.control-group{
		display: flex;
		flex-direction: column;
		>div.control-label{
			width: 100%;
		}
		>div.controls{
			margin-left: 0px;
		}
	}









	//HEADING
	div.card{
		position: relative;
		max-width: 1000px;

		a.card-header{
			box-shadow: 1px 5px 16px 0px rgba(95, 132, 167, 0.66);
			border-radius: 10px 10px 2px 2px;
			background-color: #efe0db;
			background-color: #bc2d00;
			color: #bc2d00;
			color: #fff;
			border-radius: 10px 10px 2px 2px;
			transition: all 300ms;
			display: flex;
			align-items: center;
    		justify-content: space-between;
    		padding: 2px 10px;

			> span{
					padding-right:10px;
			}
			>b, strong{
				    flex-grow: 1;
			}
			&:after {

				font-family: 'Font Awesome\ 5 Free';
				content: "\f057";
				//position: absolute;
				right: 20px;
				top: 14px;
				font-size: 1.6rem;
				transition: transform 400ms, color 350ms;
				transform-origin: center center;
				transform: rotateZ(0deg);
				color: #8295a9;
				-webkit-backface-visibility: hidden;
				color: #fff;
			}

			h3 {
				margin: 4px 0px;
				transform: translateX(0px);
				transition: margin 300ms, transform 300ms;
				display: flex;
				align-items: center;
				> span{
					    width: auto;
						padding-right:10px;
				}
			}

			&.collapsed {
				//border:solid 1px #fbc9b9;
				background-color: #fff;
				color: #4d4d4d;
				text-decoration: none !important;

				border-radius: 10px;
				box-shadow: 0px 0px 1px 0px rgba(95, 132, 167, 0.66);

				&:hover {
					background-color: #f7ebe7;
				}

				&:after {
					//transform: rotateZ(135deg);
					color: #7b2525;
					color: #8295a9;
					transform: rotateZ(135deg) scale(0.6);

					
				}
			}
		}



		//BODY
		.card-body {
			//z-index: 99999;
			opacity: 0;
			transform-origin: top; //transform:translateY(-100px);
			transform: scaleY(0);
			transition: transform 400ms, height 400ms, opacity 400ms !important;
			background:#ececec;
			background:#f9f9f9;
			box-shadow: 0 0 4px rgba(0,0,0,0.2) inset;
/*
			&.in {
				opacity: 1;
				transform: scaleY(1);
				z-index: 1;
			}*/
			.s2sfo{
				display: inline-block;
				font-style: normal;
				font-variant: normal;
				text-rendering: auto;
				line-height: 1;
			}
			>.control-group{
				flex-direction: column;
				display: flex;
				align-items: stretch;
				//justify-items:stretch;
				border-top: solid 1px #dedede;
				border-bottom:solid 1px #f9f9f9;
				margin:0px;
				padding-top: 0px;
				padding-bottom: 0px;
				align-items: center;

				>div{
					display: flex;
					align-items: stretch;
					align-items: center;
				}

				.control-label{
					padding-top: 0px;
					padding-right: 10px;
					padding-bottom: 0px;
					width: 100%;
					//max-width: inherit;

					text-align:right;
					padding-right:20px;
					
					label {
						.s2sfo, .fa{
							color:#666;
							padding-right:4px;
						}
						&#jform_params_s2s_order-lbl{
							display: inline-block;
						}
					}
				}
				
				.controls{
					padding-left: 10px;
					margin-left:0px;
					padding-top: 15px;
					padding-bottom: 15px;
					width:100%;
					//background: #fafafa;
					height:100%;
					align-self:center;
				}

				//DESCRIPTION
				[id*="-desc"]{
					right: 15px;
					background:#fafafa;
					padding: 5px;
					text-align: right;
					//z-index: 9;
					transition:all 300ms;
					z-index: 0;
					flex: 0 0 40%;
   					display: block;
					img{
						max-height: 60px;
						transition: all 300ms;
						position:relative;
						&:hover{
							z-index: 999;
							max-height: 400px;
							
						}
					}
					&.hover{
							z-index: 99999;
							color:red !important;
							opacity:1;
							visibility: visible;
					}
				}
				

				&.field-spacer{
					padding:4px 0px;
					.controls{
						padding:0px;
					}
					.control-label{
						hr{
							display:none;
						}
					}
				}

			}
		}
	} 



	div.card-light{
		div.card-body{
			opacity: 1;
			transform: inherit;
			background:inherit;
			box-shadow:inherit;
		}
	}


}



.jtotal_license_ok{
	width: inherit;
}





//LITE DASHBOARD
div.s2s_lite_dashboard{
	.btn{
		display:none;
	}
}


div.jtotal_license_ok{
	
}






//TABLET AND UP
@media (min-width: 768px) {
	//J4
	body.s2s_j4{


			//ELEMENTS OUT OF CARDS
	section > div.control-group{
		display: inherit;

		>div.control-label{
			width: 0%;
			 display: inline-table;
			>label{
				min-width:200px;
			}
		}
		>div.controls{
			margin-left: 0px;
		}
	}


		div.card-body {
			>.control-group{
				flex-direction: row !important;


				//LABEL
				.control-label{
					    width: 100%;
					    max-width:200px;
					    flex:0 0 20%;
					        justify-content: flex-end;
				}

				//DESCRIPTION
				[id*="-desc"]{
					right: 15px;
					background:#fafafa;
					padding: 5px;
					text-align: right;
					//z-index: 9;
					transition:all 300ms;
					z-index: 0;
					flex: 0 0 40%;
   					display: block;
					img{
						max-height: 60px;
						transition: all 300ms;
						position:relative;
						&:hover{
							z-index: 999;
							max-height: 400px;
							
						}
					}
					&.hover{
							z-index: 99999;
							color:red !important;
							opacity:1;
							visibility: visible;
					}
				}
			}
		}

	}


}