body {
	background-color:black;
	color: white;
	font-family:Helvetica;
}

.gif {
	margin-top:-5%;
	margin-left:-85%

}

.class_body_dark {
	background-color:black;
	color: white;
	font-family:Helvetica;
}
.class_body_bright {
	background-color:white;
	color: black;
	font-family:Helvetica;
}

.dark_elements {
	background-color: #212324;
	color:white;
}

.bright_elements {
	background-color: #f0f2f5;
	color:black;
}


/*columns sizes*/
.col_sides_dark {
	width: 1%;
	background-color: black;
	height: 600px;
	float:left;
    margin-top:-5px;
	text-align:center;
}
.col_center_green {
	width: 100%;
	background-color: #1c7c54;
	height: auto;
	float:left;
    margin:-5px;
	text-align: center;
}
.col_center_transparente {
	width: 100%;
	height: auto;
	margin:-5px;
	text-align: center;
    display: inline-block;
}


.col_center_dark {
	width: 100%;
	background-color: black;
	height: auto;
	float:left;
    margin:-5px;
	text-align: center;
}

.col_sides_bright {
	width: 1%;
	background-color: white;
	height: 600px;
	float:left;
    margin-top:-5px;
	text-align:center;
}

.col_center_bright {
	width: 100%;
	background-color: white;
	height: auto;
	float:left;
    margin:-5px;
	text-align: center;
}

.left_align {
	text-align:left;
	width:80%;
	display:inline-block;
	margin-top:12px;
	border-radius:8px;
	padding-left:5px;
}

.right_align {
	text-align:right;
	width:100%;
	display:inline-block;
	margin-top:12px;
	border-radius:8px;
}

.center_align_register {
	text-align: center;
	width:100%;
	display:inline-block;
	margin-top:5px;
	border-radius:8px;
}


.left_align_with_padding {
	text-align:left;
	width:70%;
	display:inline-block;
	margin-top:12px;
	padding-left:15px;
}

.login {
	display:none;
	background-color:#212324;
	border-radius:8px;
	width:98%;
	padding-top:10px;
	padding-left:10px;
	
}

/*panel de estilos*/

.radio_style_white:after {
	width: 15px;
	height: 15px;
	border-radius: 15px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: #ffffff;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 2px solid black;
}

.radio_style_white:checked:after {
	width: 15px;
	height: 15px;
	border-radius: 15px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: black;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 2px solid black;
}

.border_button_white {
	width: 75px;
	height: 25px;
	border-radius: 6px;
	position: relative;
	background-color: white;
	display: inline-block;
	border: 2px solid black;
	color:black;
}

.border_button_black {
	width: 75px;
	height: 25px;
	border-radius: 6px;
	position: relative;
	background-color: black;
	display: inline-block;
	border: 2px solid white;
	color:white;
}

.radio_style_black:after {
	width: 15px;
	height: 15px;
	border-radius: 15px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: black;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 2px solid white;
}

.radio_style_black:checked:after {
	width: 15px;
	height: 15px;
	border-radius: 15px;
	top: -2px;
	left: -1px;
	position: relative;
	background-color: white;
	content: '';
	display: inline-block;
	visibility: visible;
	border: 2px solid white;
}



.style_gray{
	padding-top: 20px;
	height:40px;
	width:78%;
	display: inline-block;
	position: fixed;
	bottom: 0;
	z-index: 5000;
	left:10%;
	text-align:center;
}

.style_gray_up{
	background-color:#212324;		
	padding-top: 20px;
	height:100px;
	border-radius: 6px;
	width:78%;
	margin-top: -5%;
	display: inline-block;
	position: fixed;
	bottom: 0;
	z-index: 5000;
	left:10%;
}

.style_show {
	display:none;
}

.arrow {
	width: 25px;
	height:25px;
	border-radius: 25px;
	left:95%;
	top:5%;
	position:absolute;
	background-color: "#414141";
}
.icon {
	width: 30px;
	height:30px;
	border-radius: 30px;
	margin-top:-15px;
}

/*elementos de la página*/
.profile_elements {
	width:110%;
	height:40%;
	display: inline-block;
}
.profile_elements_edit {
		width:95%;
		display: inline-block;
		margin-left:10px;		
		border-radius:8px;
		text-align:left;
		height:130px;
	}
.skills_bubble_dark {
	width: 50px;
	height: 15px;
	background: -prefix-linear-gradient(top, darkgray, #414141, #393737 );
	background: linear-gradient(to bottom,  darkgray, #414141, #393737 );
	border-radius:10px;
	font-size:10px;
	color:white;
	margin-top: 5px;
	text-align:center;
	float:left;
	margin-right:5px;	
	padding-top:5px;
}
.skills_bubble_bright {
	width: 50px;
	height: 15px;
	background: -prefix-linear-gradient(top, lightgray, white );
	background: linear-gradient(to bottom,  lightgray, white );
	border-radius:10px;
	font-size:10px;
	color:#414141;
	text-align:center;
	float:left;
	margin-right:5px;
	padding-top:5px;

}

.elemento {
	width: 89%;
	height: 70px;
	border-radius: 10px;
	text-align:left;
	margin-left: 10px;
	
}

.elemento .seleccionado {
    transform: scale(1.02) rotate(-1deg);
}


.elemento_edit {
	width: 90%;
	border-radius: 10px;
	text-align:left;
	margin-left: 15px;
		
}
.internal_element {
	width:55%;
	float:left;
	margin-top:5px;
	position: inline-block;
	margin-left: 10px;
}

.internal_element_edit {
	width:100%;
	float:left;
	margin-top:1px;
	position: inline-block;
	margin-left: 10px;
}

.internal_element_link {
	width:55%;
	float:left;
	margin-top:1px;
	position: inline-block;
	margin-left: 70px;
}

.icon_element {
	width:50px;
	height: 50px;
	border-radius: 55px;
	border: none;
	float:left;
	margin-top:5px;
	position: inline-block;
	margin-left: 10px;

}
.link_icon_element {
	width:50px;
	height: 50px;
	border-radius: 70px;
	border: none;
	float:left;
	margin-top:5px;
	position: inline-block;
	margin-left: 1px;

}

.large_icon_element {
	width:35px;
	height: 35px;
	border-radius: 40px;
	border: none;
	float:left;
	margin-top:5px;
	position: inline-block;
	margin-left: 5px;

}

.extra_large_icon_element {
	width:40px;
	height: 40px;
	border-radius: 45px;
	border: none;
	float:left;
	margin-top:5px;
	position: inline-block;
	margin-left: 5px;

}


.mas_button {
	width:35px;
	height: 35px;
	border-radius: 35px;
	border: none;
	float:left;
	margin-top:0px;
	position: inline-block;
	margin-left: 10px;

}

.back_button {
	width:35px;
	height: 35px;
	border-radius: 40px;
	border: none;
	float:left;
	margin-top:10px;
	position: inline-block;
	margin-left: 10%;

}

.back_button_link {
	width:55px;
	height: 35px;
	border-radius: 60px;
	border: none;
	float:left;
	margin-top:10px;
	position: inline-block;
	margin-left: 10%;

}
.link_element_edit {
	width: 25%;
    height: 15px;
    text-align:center;
	margin-left: 10px;	
    margin-top: 10px;	
    
}

.link_element_delete {
	width: 25%;
	text-align:center;
	margin-left: 40px;	
    margin-top: 10px;	
}


.link_element_test {
	width: 25%;
	text-align:center;
	margin-left: 70px;	
    margin-top: 10px;		
}


.arrow_button {
	width: 45px;
	height:45px;
	float:left;
	margin-top:10px;
	position: inline-block;
	margin-left: 1px;
}

.arrow_button_edit {
	width: 45px;
	height:45px;
	position: inline-block;
	margin-left: 1px;
}

.basic_button {
	width: 60%;
	height: 35px;
	border-radius: 6px;
	position: relative;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:16px;
	font-weight:bold;
	border:none;
}

.basic_button_disabled {
	width: 60%;
	height: 35px;
	border-radius: 6px;
	position: relative;
	background-color: #414141;
	display: inline-block;	
	color:#9b9b9b;
	font-size:16px;
	font-weight:bold;
	border:none;
}


.basic_button_saveshare {
	width: 45%;
	height: 35px;
	border-radius: 6px;
	position: relative;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:16px;
	font-weight:bold;
	border:none;
}
.link_basic_button_add {
	width: 80px;
	height: 25px;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:14px;
	font-weight:bold;
	border:none;
    margin-left:5px;
    text-align:center;
    margin-top:15px;
}

.link_basic_button {
	width: 80px;
	height: 25px;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:14px;
	font-weight:bold;
	border:none;
    margin-left:5px;
    text-align:center;
    margin-top:15px;
}

.link_basic_button_test {
	width: 80px;
	height: 25px;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:14px;
	font-weight:bold;
	border:none;
    margin-left:165px;
    text-align:center;
     margin-top:18px;
}

.delete_button_dark {
	width: 85px;
	height: 20px;
	border-radius: 6px;
	background-color: #212324;
	display: inline-block;	
	color:red;
	font-size:12px;
	border:1px solid red;
	margin-top:35px;
	margin-left:-90px;
	font-size:9px;
}

.delete_button_bright {
	width: 85px;
	height: 20px;
	border-radius: 6px;
	background-color: #f0f2f5;
	display: inline-block;	
	color:red;
	font-size:12px;
	border:1px solid red;	
	margin-top:35px;
	margin-left:-90px;
	font-size:9px;

}
.test_button_dark {
	width: auto;
	height: 20px;
	border-radius: 6px;
	display: inline-block;	
	font-size:10px;
	margin-left:3px;	
	font-size:9px;
}

.test_button_bright {
	width: auto;
	height: 20px;
	border-radius: 6px;
	display: inline-block;	
	font-size:10px;
	margin-left:3px;
	font-size:9px;
}


.basic_button_small {
	width: auto;
	height: 25px;
	border-radius: 6px;
	position: relative;
	background-color: #414141;
	display: inline-block;	
	color:white;
	font-size:14px;
	font-weight:bold;
	border:none;
}
/* 	rojo #e23b4c
	amarillo #ffc107
	verde #74d674
	turquesa #50ccbd
	azul #4fa9ed
	morado #7b61ff
	gris #414141
*/
.colors {
	width:25px;
	height:25px;
	border-radius:30px;
	position: relative;
	
}

.elemento_existe {
	width:12px;
	height:12px;
	border-radius:12px;
	position: absolute;    
    z-index: 1;	
}

.ojo {
	width:30px;
	height:30px;
	border-radius:30px;
	position: absolute;    
    z-index: 1;	
}


.colors_selected {
	width:30px;
	height:30px;
	border-radius:35px;
	position: relative;
	border: 2px solid black;
}

.small_logo {
	width:30px;
	height:30px;
	
}
.large_logo {
	width:100px;
	height:100px;
	
}
.long_img {
	width:100%;
	height:110px;
	border-radius:10px;
	border: 2px solid #414141;
    position:center;
    left: 6%;
}
.banner_abajo {
	width:100%;
	height:100px;
	position:center;
    left: 6%;
}

.profile_img { 
	border-radius: 110px;
	border: 2px solid #414141;
	position:absolute;
	height:110px;
	width:110px;
	z-index: 1;
	top: 50px;
	left: 5%;
}

.profile_img_centered { 
	border-radius: 115px;
	border: 2px solid #414141;
	position:absolute;
	height:115px;
	width:115px;
	z-index: 1;
	top: 70px;
	left: 5%;
}

.right_element {
	margin-right:10%;
}

.extra_large_text {
	font-size: 24px;
	font-weight:bold;	
}
.large_text {
	font-size: 18px;
	font-weight:bold;	
}
.text_data {
	font-size: 18px;
    font-weight:normal;
    font-style: Italic;
}

.nombre {
	font-size: 16px;
	font-weight:bold;	
}

.large_text_2 {
	font-size: 18px;
	font-weight:bold;	
}

.large_text_register {
	font-size: 16px;
	font-weight:bold;	
}

.medium_text {
	font-size: 14px;	
}

.medium_text_internal {
	font-size: 10px;	
}

.regular_text {
	font-size: 12px;	
}
.mini_text {
	font-size:9px;
}

.regular_text_internal {
	font-size: 8px;	
}
.small_input_text {
	font-size:12px;
}

.no_border {
	border: none;
	padding: 1px;
	width: 95%;
	height: 60px;
	font-family: "Helvetica";
	display: block !important; 
	padding: 0 !important; 
	margin: 0 !important;  
	line-height: 1 !important;
	outline:none;
}
.no_border:focus{
	outline: none;
}
.no_border_internal {
	border: none;
	padding: 5px;
	width: 90%;
	height: 25px;
	font-family: "Helvetica";
	display: block !important; 
	padding: 0 !important; 
	margin: 0 !important;  
	line-height: 1 !important;
	outline:none;
}

.no_border_internal:focus{
	outline: none;
}
.no_border_gray {
	border: 2px solid white;
	border-radius: 8px;
	padding: 5px;
	width: 70%;
	height: 30px;
	background-color: #212324;
	color:white;
	font-family: "Helvetica";
	padding: 3 !important; 
	line-height: 1 !important;
}

.no_border_gray_register {
	border: 2px solid white;
	border-radius: 5px;
	padding: 5px;
	width: 70%;
	height: 5px;
	background-color: #212324;
	color:white;
	font-family: "Helvetica";
	padding: 3 !important; 
	line-height: 1 !important;
}

.element_edit {
	width: 70%;
	border-radius: 10px;
	border: 2px solid #414141;
	text-align:left;
	margin-left: 10px;
	margin-top:20px;
	display: inline-block;
	font-size:12px;
}
.element_edit_name {
	width: 45%;
	border-radius: 10px;
	border: 2px solid #414141;
	text-align:left;
	margin-left: 10px;
	margin-top:20px;
	display: inline-block;
	font-size:12px;
}


.link_fieldset_edit {
	width: 68%;
    height: 30px;
	border-radius: 10px;
	border: 2px solid #414141;
	text-align:left;
	margin-left: 5px;
	margin-top:1px;
	display: inline-block;
	font-size:14px;
}

.fieldset_edit {
	width: 68%;
    height: 30px;
	border-radius: 10px;
	border: 2px solid #414141;
	text-align:left;
	margin-left: 5px;
	margin-top:1px;
	display: inline-block;
	font-size:14px;
}

.element_width {
	width:100%;
}


.ee_height {
	height:240px;
}

.element_edit_internal {
	width: 90%;
	height: 30px;
	border-radius: 10px;
	border: 2px solid #414141;
	text-align:left;
	margin-top:10px;
	display: inline-block;
	font-size:12px;
	padding-top:3px;
}

.no_border_edit_internal {
	
	width: 70%;
	height: 15px;
	font-family: "Helvetica";
	padding: 3 !important; 
	border:none;
	top: 3px;
}

.no_border_edit_internal_name {
	width: 90%;
	height: 15px;
	font-family: "Helvetica";
	padding: 3 !important; 
	border:none;
	top: 3px;
    text-align:left;
    margin-left: 1px;
}


.no_border_edit_internal:focus{
	outline: none;
}

.no_border_edit_fieldset {
	width: 80%;
	height: 20px;
	font-family: "Helvetica";
	padding: 0px 0px 0px 0px !important; 
	border:none;
    font-size:14px;
	top: 1px;
    
}

.no_border_edit_fieldset_link {
	width: 100%;
	height: 15px;
	font-family: "Helvetica";
	padding: 0px 0px 0px 0px !important; 
	border:none;
    font-size:12px;
	top: 1px;
} 

.no_border_edit_fieldset_custom {
	width: 100%;
	height: 15px;
	font-family: "Helvetica";
	padding: 0px 0px 0px 0px !important; 
	border:none;
    font-size:13px;
	top: 1px;
} 


.no_border_edit_fieldset:focus{
	outline: none;
	border:none;
}

.no_border_edit {
	width: 100%;
	height: 20px;
	font-family: "Helvetica";
	padding: 3 !important; 
    font-size:14px;
	border:none;
	top: 1px;
}

.no_border_edit:focus{
	outline: none;
}


.jm-loadingpage {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 999999999;
    background: url(img/gif.mp4) center no-repeat #fff;
}

.p_width {
	width:80px;
    margin-left: 15px;
}


@media screen and (min-width: 1025px) {
    body {
	    background-color:black;
    }
	
	.gif {
		margin-top:30%;
		margin-left:-25%

	}
	/*columns sizes*/
	.col_sides_dark {
		width: 35%;
		background-color: black;
		height: 900px;
		float:left;
	}

	.col_center_dark {
		text-align:center;
		width: 30%;
		background-color: black;
		height:900px;
		float:left;
		
	}
	.col_sides_bright {
		width: 35%;
		background-color: white;
		height: 900px;
		float:left;
	}

	.col_center_bright {
		text-align:center;
		width: 30%;
		background-color: white;
		height:900px;
		float:left;
		
	}
	
	.style_gray{
		height:40px;
		width:23%;
		display: inline-block;
		position:fixed;
		bottom: 0;
		z-index: 5000;
		left:39%;
		text-align:center;
	}
	
	.style_gray_up{
		background-color:#212324;		
		padding-top: 20px;
		height:100px;
		border-radius: 6px;
		width:20%;
		margin-top: -5%;
		display: inline-block;
		position:fixed;
		bottom: 0;
		z-index: 5000;
		left:39%;
	}
	.border_button_black {
		width: 105px;
		height: 25px;
		border-radius: 6px;
		position: relative;
		background-color: black;
		display: inline-block;
		border: 2px solid white;
		color:white;
	}
	
	.border_button_white {
		width: 105px;
		height: 25px;
		border-radius: 6px;
		position: relative;
		background-color: white;
		display: inline-block;
		border: 2px solid black;
		color:black;
	}
	
	.style_gray_position {
		margin-top: 3px;
	}	
	
	.colors {
		width:25px;
		height:25px;
		border-radius:25px;
		position: relative;
		
	}

	.colors_selected {
		width:30px;
		height:30px;
		border-radius:30px;
		position: relative;
		border: 2px solid black;
	}
	
	.left_align {
		text-align:left;
		width:150%;
		display:inline-block;
		margin-top:8px;
		border-radius:8px;
		padding-left:5px;
	}
	.small_logo {
		width:40px;
		height:40px;
		
	}
	.large_logo {
		width:100px;
		height:100px;
		
	}
	.long_img {
		width:70%;
		height:120px;
		border-radius:10px;
		border: 2px solid #414141;
	}
	.profile_img { 
		border-radius: 110px;
		border: 2px solid #414141;
		position:absolute;
		height:110px;
		width:110px;
		z-index: 1;
		top: 70px;
		left: 760px;
	}
	
	.profile_img_centered { 
		border-radius: 110px;
		border: 2px solid #414141;
		position:absolute;
		height:110px;
		width:110px;
		z-index: 1;
		top: 90px;
		left: 870px;
	}
	
	.arrow {
		width: 25px;
		height:25px;
		border-radius: 25px;
		left:95%;
		top:-7%;
		position:absolute;
		background-color="#414141";
	}
	
	
	.elemento {
		width: 90%;
		height: 60px;
		border-radius: 10px;
		text-align:left;
		margin-left: 10px;
		
	}
	.elemento_edit {
		width: 90%;
		border-radius: 10px;
		text-align:left;
		margin-left: 10px;
		
	}	
	.internal_element {
		width:60%;
		float:left;
		margin-top:5px;
		left:20px;
		position: inline-block;
		margin-left: 10px;
	}
	
	.internal_element_edit {
		width:70%;
		float:left;
		margin-top:5px;
		position: inline-block;
		margin-left: 10px;
	}

    .link_element_edit {
		width:50%;
		margin-top:5px;
		margin-left: 500%;
	}
	
	.icon_element {
		width: 50px;
		height: 50px;
		border-radius: 50px;
		border: none;
		float:left;
		margin-top:5px;
		position: inline-block;
		margin-left: 10px;

	}
	.large_icon_element {
		width:95px;
		height: 95px;
		border-radius: 75px;
		border: none;
		float:left;
		margin-top:5px;
		position: inline-block;
		margin-left: 10px;

	}
	
    .link_icon_element {
		width:95px;
		height: 95px;
		border-radius: 25px;
		border: none;
		float:left;
		margin-top:5px;
		position: inline-block;
		margin-left: 10px;

	}

	.arrow_button {
		width: 35px;
		height:35px;
		float:left;
		margin-top:15px;
		margin-left: 5px;
		position: inline-block;
	}
	
	.arrow_button_edit {
		width: 35px;
		height:35px;
		margin-left: 5px;
		position: inline-block;
	}
	
	.extra_large_text {
		font-size: 28px;
		font-weight:bold;	
	}
	
	.large_text_2 {
		font-size: 24px;
		font-weight:bold;	
	}
	
	.medium_text_internal {
		font-size: 16px;	
	}
	.regular_text_internal {
		font-size: 12px;
	}
	.small_input_text {
		font-size:14px;
	}
	
	.no_border_internal {
		border: none;
		padding: 5px;
		width: 70%;
		height: 25px;
		font-family: "Helvetica";
		display: block !important; 
		padding: 0 !important; 
		margin: 0 !important;  
		line-height: 1 !important;
		outline:none;
	}
	.profile_elements {
		width:75%;
		height:50%;
		display: inline-block;
		margin-left:30px;
	}
	.profile_elements_edit {
		width:85%;
		display: inline-block;
		margin-left:30px;
		border-radius:8px;
		text-align:left;
		height:180px;
	}
	.ee_height {
		height:250px;
	}
	.back_button {
		width:25px;
		height:25px;
		border-radius: 25px;
		border: none;
		float:left;
		margin-top:10px;
		position: inline-block;
		margin-left: 10%;

	}
	.delete_button_dark {
		width: 120px;
		height: 35px;
		border-radius: 6px;
		background-color: #212324;
		display: inline-block;	
		color:red;
		font-size:14px;
		border:1px solid red;
		margin-left:-120px;
		margin-top:50px;
	}

	.delete_button_bright {
		width: 120px;
		height: 35px;
		border-radius: 6px;
		background-color: #f0f2f5;
		display: inline-block;	
		color:red;
		font-size:14px;
		border:1px solid red;
		margin-left:-120px;
		margin-top:50px;
	}
	.test_button_dark {
		width: auto;
		height: 35px;
		border-radius: 6px;
		display: inline-block;
		font-size:14px;
		margin-left:5px;
	}

	.test_button_bright {
		width: auto;
		height: 35px;
		border-radius: 6px;
		display: inline-block;
		font-size:14px;
		margin-left:5px;
	}
	.element_width {
		width:90%;
	}
	.element_edit {
		width: 70%;
		border-radius: 10px;
		border: 2px solid #414141;
		text-align:left;
		margin-left: 10px;
		margin-top:20px;
		display: inline-block;
		font-size:16px;
	}
	.p_width {
		width:120px;
	}
	.fieldset_edit {
		width: 75%;
		border-radius: 10px;
		border: 2px solid #414141;
		text-align:left;
		margin-left: 10px;
		margin-top:20px;
		display: inline-block;
		font-size:12px;
	}
    .link_fieldset_edit {
		width: 70%;
		border-radius: 10px;
		border: 2px solid #414141;
		text-align:left;
		margin-left: 10px;
		margin-top:30px;
		display: inline-block;
		font-size:10px;
	}
}

