/*
VERDE: #1ABC9C
VERDE HOVER: #53B7FA

AZUL: #5CA0B6
AZUL TONO CLARO: #5CA0B6
VERDE-AZUL: #5CA0B6 //actual

AZUL BOTON: #587b9f
AZUL BOTON HOVER: #46627e

VERDE BOTON: #3fba9c //actual 
VERDE BOTON HOVER: #2e8771 //actual
*/

html {
  overflow-y: scroll;
  overflow-x: hidden;
}

body{
	background-color: #f2f2f2;
    cursor: default;
}

p{
	line-height: 25px;
	/*margin-bottom: 25px;*/
}

b{
	color: #2E2E2E !important;
}

ul{
	list-style-type: none;
	margin-bottom: 0px;
}

#products{
	overflow:hidden;
	height:350px;
}

del{
	color: rgba(231, 76, 60, 0.8);
}

select.form-error, input.form-error, input.form-error:FOCUS, select.form-error:FOCUS{
	border: 1px solid rgba(231, 76, 60, 0.65);
}

input.form-correct{
	border: 1px solid rgba(26, 188, 156, 0.65);
}

.logo{
	background-color: #fff;
}

.logo img{
	padding: 12px 0;
}

.container{
	
}

.complete-width{
	width: 100% !important;
}

.logout{
	color: #337ab7;
}

.main-purchase{
	padding-top: 100px;
}

.panel{
	border-radius: 0px;
	padding-bottom: 6px;
	margin-bottom: 0px;
	border: 0px;
}

.panel-content{
	padding: 10px;
}

.left-margin{
	margin-left: 10px;
}

/*
@media (min-width: 768px) {
  .panel-right {
    width: 0px;
    transition: all 1s ease;
  }
}
@media (min-width: 992px) {
  .panel-right {
    width: 50px;
    transition: all 1s ease;
  }
}
@media (min-width: 1200px) {
  .panel-right {
    width: 260px;
    transition: all 1s ease;
  }
}
*/

.vertical-list-course{
	margin-left: -20px;
}

.vertical-list-items{
	margin-left: -35px;
}

.sub-horizontal-list{
	margin-left: 30px;
	font-size: 14px;
	/*font-style: italic;*/
}

input[type=radio], input[type=checkbox]{
    display:none;
}

input[type=radio] + label:before, input[type=checkbox] + label:before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align:middle;
    margin-right: 8px;
    background-color: #f2f2f2;
    border-radius: 8px;
    border: 2px solid #5CA0B6;

}

input[type=checkbox] + label:before {
	border-radius: 0px;
}

table input[type=radio] + label:before, input[type=checkbox] + label:before {
	margin-right: 0px;
}

table input[type=radio] + label:before, input[type=checkbox] + label:before {
	
}

/*CHROME & SAFARI*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	table input[type=radio] + label:before,  table input[type=checkbox] + label:before{
		text-indent: 0px;
	}
}

input[type=radio] + label, input[type=checkbox] + label{
	font-weight: normal;
	-webkit-transition: color 0.5s ease;
	-moz-transition: color 0.5s ease;
	-o-transition: color 0.5s ease;
	-ms-transition: color 0.5s ease;
	transition: color 0.5s ease;
}

input[type=radio]:checked + label:before, input[type=checkbox]:checked + label:before {
    content: "\2022";
    color: #5CA0B6;
    background-color: #f2f2f2;
    font-size: 23px;
    text-align: center;
    line-height: 10px;
}

input[type=checkbox]:checked + label:before{
	content: "✔";
	font-size: 12px;
	line-height: 12px;
}

table input[type=radio]:checked + label:before{
    line-height: 12px;
    margin-right: -1px;
}

table label{
	margin-bottom: 0px;
}

input[type=radio]:checked + label, input[type=checkbox]:checked + label{
	color: #222;
}

input[type=radio]:disabled + label:before, input[type=checkbox]:disabled + label:before{
    background: #ddd;
    cursor: not-allowed;
}

.course-title{
	color: #5CA0B6;
	text-transform:uppercase;
	margin-top: 10px;
	margin-bottom: 12px;
}

.course-instructions{
	font-size: 16px;
}


/***********TABLE COURSE***********/
.course-table {
	width: 100%;
	font-family: sans-serif;
	-webkit-font-smoothing: antialiased;
	font-size: 15px;
	overflow: auto;
	/*display: block;*/
}

.course-table th {
	background-color: #5CA0B6;
	font-weight: normal;
	font-size: 16px;
	color: #fff;
	padding: 12px 30px;
	text-align: center;
}

.course-table td {
	background-color: rgb(238, 238, 238);
	color: rgb(111, 111, 111);
	text-align: center;
	border: 1px #fff solid;
}

.course-table tr td:first-child{
	padding: 12px 30px;
	text-align: left;
}

.course-table td{
	/*padding: 7px;*/
}

.course-table-total{
	background-color: #5CA0B6 !important;
	text-align: right !important;
	color: #fff !important; 
}
.table-course-name{
	color: #fff;
}

.table-course-price{
	color: #fff;
	-webkit-transition: color 1s ease;
	-moz-transition: color 1s ease;
	-o-transition: color 1s ease;
	-ms-transition: color 1s ease;
	transition: color 1s ease;
}

.checkbox input:disabled{
	cursor: default;
}

.table-course-price-new{
	color: #BC451A;
}

.table-checkbox-column{
	width: 100%;
	-webkit-transition: all 0.7s ease;
	-moz-transition: all 0.7s ease;
	-o-transition: all 0.7s ease;
	-ms-transition: all 0.7s ease;
	transition: all 0.7s ease;
}

.table-select-column{
	display: none;
	margin-right: 5px;
}

.table-left-column{
	float: left;
	width: 20%;
}

.table-right-column{
	float: left;
	width: 75%;
	display: block;
}

.course-table select{
	height: 30px;
	padding-left: 0px;
	padding-top: 5px;
}

.geneng-table select{
	font-size: 12px;
	padding-top: 7px;
}

/*******END TABLE COURSE***********/


/*******START TABLE DATA PAYMENT***********/

table.data-payment{
	margin-bottom: 10px;	
}

td.data-payment{
	background-color: #5CA0B6 !important;
	color: #fff !important;
}

/*******END TABLE DATA PAYMENT***********/


/***********PURCHASE BOX***********/
.title-box-purchase{
	background-color: #5CA0B6;
	color: #fff;
	width: inherit;
	padding: 12px 12px;
	font-size: 16px;
}

.total-box-purchase{
	background-color: #fff;
	border-top: 1px solid #eee;
	width: inherit;
	padding: 12px 10px;
	font-size: 14px;
}

.total-box-purchase p{
	margin: 0;
}

.price-product{
	font-weight: bold;
	font-size: 15px;
	text-align: right;
}

.total-price{
	float: right;
	color: #5CA0B6;
	font-size: 20px;
}

.name-product{

}

.title-elements-purchase{
	text-decoration: underline;
	padding-left: 5px;
	font-size: 16px;
	margin-left: -15px;
}

select.currency-selector{
	height: 25px;
	padding: 0 2px;
	font-size: 13px;
}

/*******END PURCHASE BOX***********/

.special-list{

}

.special-list-course.ng-hide-add, .special-list-items.ng-hide-add {
  animation: fadeOut 0.5s;
  -webkit-animation: fadeOut 0.5s;
  -moz-animation: fadeOut 0.5s;
  -ms-animation: fadeOut 0.5s;
}

.special-list-course.ng-hide-remove, .special-list-items.ng-hide-remove {
  animation: fadeIn 1s;
  -webkit-animation: fadeIn 1s;
  -moz-animation: fadeIn 1s;
  -ms-animation: fadeIn 1s;
}

.loading-image{
	position: absolute;
	width: 100%;
}

.loading-image img{
	display:block;
    margin:auto;
}

/*when the special-panel disappear*/
.loading-image.ng-hide-add {
  animation: fadeOutUp 1s;
  -webkit-animation: fadeOutUp 1s;
  -moz-animation: fadeOutUp 1s;
  -ms-animation: fadeOutUp 1s;
}

/*when the special-panel disappear*/
.special-panel.ng-hide-add {
  animation: fadeOutLeft 1s;
  -webkit-animation: fadeOutLeft 1s;
  -moz-animation: fadeOutLeft 1s;
  -ms-animation: fadeOutLeft 1s;
}

/*when the spacial-panel appear*/
.special-panel.ng-hide-remove {
  animation: fadeInLeft 1s;
  -webkit-animation: fadeInLeft 1s;
  -moz-animation: fadeInLeft 1s;
  -ms-animation: fadeInLeft 1s;
}

/*when the toggle-panel disappear
.toggle-panel.ng-hide-add {
  animation: fadeOut 1s;
  -webkit-animation: fadeOut 1s;
  -moz-animation: fadeOut 1s;
  -ms-animation: fadeOut 1s;
}*/

/*when the toggle-panel appear*/
.container.ng-hide-remove, .toggle-panel.ng-hide-remove {
  animation: fadeIn 1s;
  -webkit-animation: fadeIn 1s;
  -moz-animation: fadeIn 1s;
  -ms-animation: fadeIn 1s;
}

.item-list:not(:last-child){
	border-bottom: dotted 1px #ccc;
}

.item-list{
	margin-bottom: 5px;
	padding: 6px;
}

.item-list.ng-enter, .extra-tutorial.ng-enter{
    animation: fadeIn 1s;
    -webkit-animation: fadeIn 1s;
    -moz-animation: fadeIn 1s;
    -ms-animation: fadeIn 1s;
}
.item-list.ng-leave, .extra-tutorial.ng-leave {
    animation: fadeOut 0.5s;
    -webkit-animation: fadeOut 0.5s;
    -moz-animation: fadeOut 0.5s;
    -ms-animation: fadeOut 0.5s;
}

.nopadding {
   	padding: 0 !important;
   	margin: 0 !important;
}

.nopadding-left{
	padding-left: 0 !important;
}

.nopadding-right{
	padding-right: 0 !important;
}

.center {
     float: none;
     margin-left: auto;
     margin-right: auto;
}

.center-text{
	text-align: center;
}

/********FORM ELEMENTS**********/
.row-form{
	padding: 0 20px;
	margin-bottom: 10px;
}

.no-padding{
	padding: 0 !important;
}

.no-padding-left{
	padding-left: 0 !important;
}

.no-padding-right{
	padding-right: 0 !important;
}

.input-group{
	margin-bottom: 10px;
	margin-top: 5px;
	width: 100%;
}

.form-control{
	box-shadow: none;
	border: 1px solid rgba(159, 159, 159, 0.2);
	font-size: 15px;
	font-weight: normal;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.input-valid{
	background-color: rgba(26, 188, 156, 0.2);
}

.input-no-valid{
	background-color: rgba(231, 76, 60, 0.2);
}

.form-control:focus{
	border: 1px solid rgba(92, 160, 182, 0.5);
	box-shadow: none;
}

.input-group-addon{
	background-color: #5CA0B6;
	color: #fff;
	border: 1px solid rgba(159, 159, 159, 0.2);
}

.btn{
	width: inherit;
}

.btn-default, .btn-default:hover, .btn-default:active, .btn-default:focus{
	background-color: #3fba9c;
	border: 1px solid rgba(159, 159, 159, 0.2);
	color: #fff;
	font-weight: bold;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.btn-default:hover{
	/*background-color: #53B7FA;*/
	background-color: #2E8771;
}

.btn[disabled]{
	background-color: #f3f3f3;
	color: #c3c3c3;
}

.alert-box{
	animation: fadeIn 0.5s;
  	-webkit-animation: fadeIn 0.5s;
  	-moz-animation: fadeIn 0.5s;
  	-ms-animation: fadeIn 0.5s;
	margin-bottom: 9px;
	padding: 7px;
}

.alert-box p{
	color: #555555;
}

.alert-box.ng-enter,
.alert-box.ng-leave.ng-leave-active {
  animation: fadeIn 0.5s;
  -webkit-animation: fadeIn 0.5s;
  -moz-animation: fadeIn 0.5s;
  -ms-animation: fadeIn 0.5s;
}

.alert-box.ng-enter.ng-enter-active,
.alert-box.ng-leave {
  transition: all 1s ease-out;
  opacity: 1;
}

.sweet-alert ul{
	text-align: left;
	margin-top: 14px;
	margin-left: 50px;
}

.sweet-alert li{
	margin: 4px 0;
	color: #797979;
}


/********END FORM ELEMENTS**********/

.purchase-level-test{
	height: 0px;
	width: 750px;
	border: 0px;
	-webkit-transition: height 1s ease;
	-moz-transition: height 1s ease;
	-o-transition: height 1s ease;
	-ms-transition: height 1s ease;
	transition: height 1s ease;
}

.show-level-test{
	height: 550px;
	width: 730px;
}

.recover-background{
	width: 100%;
	height: 100%;
	background: red;
}



















