/* --------------------------------------
=========================================
LandX - Responsive App Landing Page
Version: 1.0 (Initial Release)
Designed By: Mizanur Rahman
=========================================
-----------------------------------------*/
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic|Raleway:500,600,700);

@font-face { 
 font-family: "tipografia_light"; src: url('../fonts/PROXIMANOVAA-LIGHT.OTF')format("truetype"); }

@font-face { 
 font-family: "tipografia_regular"; src: url('../fonts/PROXIMANOVAA-REGULAR_0.OTF')format("truetype"); }

@font-face { 
 font-family: "tipografia_semibold"; src: url('../fonts/PROXIMANOVAA-SEMIBOLD.OTF')format("truetype"); }

/* --------------------------------------
=========================================
GLOBAL STYLES
=========================================
-----------------------------------------*/
html {
	font-size: 100%;
}

body {
	background: #ffffff;
	font-family: 'tipografia_regular', sans-serif;
	font-size: 18px;
	color: #727272;
	line-height: 25px;
	text-align: center;
	overflow-x: hidden !important;
	margin: auto !important;
}

/* PRE LOADER */
.preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fefefe;
	z-index: 99999;
	height: 100%;
	width: 100%;
	overflow: hidden !important;
}


.status {
    width: 220px;
    height: 140px;
    position: relative;
    margin: 0 auto;
    top: 30%;
    background-image: url(../images/loading.gif);
    /*
	width: 220px;
    height: 140px;
    position: absolute;
    left: 42%;
    top: 42%;
	background-image: url(../images/loading.gif);
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover;
	background-size: cover;
	margin: -20px 0 0 -20px;*/
}

/* DEFAULT HYPERLINK / HOVER */
a {
	text-decoration: none;
	-webkit-transition: all ease 0.25s;
	transition: all ease 0.25s;
}

a:hover {
	text-decoration: underline;
}

strong {
	font-weight: 700;
}

.strong {
	font-weight: 700;
}

/* IE10 IN WINDOWS 8 AND WINDOWS PHONE 8 BUG FIX FOR BOOTSTRAP */
@-webkit-viewport {
	width: device-width;
}

@-moz-viewport {
	width: device-width;
}

@-ms-viewport {
	width: device-width;
}

@-o-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

/* OTHER FIXES */
a:focus {
	outline: inherit;
	color: inherit;
}

.btn:focus,
.btn:active,
.btn,
.open .dropdown-toggle.btn {
	outline: inherit;
	border-color: inherit;
}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ul,
ol {
	/*padding-left: 0 !important;*/
}

li {
	list-style: none;
}
/* --------------------------------------
=========================================
   COMPONENTS 
=========================================
-----------------------------------------*/
.dark-bg {
	background: #008ed6;
	color: #ffffff;
}

.color-bg {
	color: #ffffff;
}

.bgcolor-2 {
	background: #f7f8fa;
}

.bgcolor-white {
	background: #ffffff;
}

.colored-line {
	height: 3px;
	width: 70px;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 10px;
}


/*---------------------------------------
   Typography                
-----------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'tipografia_regular', sans-serif;
	color: #323232;
	margin-bottom: 0;
	margin-top: 0;
}

h1 {
	font-size: 2.813rem;
	line-height: 3.75rem;
	font-weight: 500;
}

h2 {
	font-size: 2.188rem;
	line-height: 3.125rem;
	font-weight: 500;
}

h3 {
	font-size: 1.5rem;
	line-height: 2.375rem;
	font-weight: 600;
}

h4 {
	font-size: 1.25rem;
	line-height: 2rem;
	font-weight: 600;
}

h5 {
	font-size: 18px;
	line-height: 28px;
	font-weight: 700;
}

h6 {
	font-size: 16px;
	line-height: 25px;
	font-weight: 700;
}


/*---------------------------------------
   BUTTONS               
-----------------------------------------*/
.standard-button {
	font-family: 'tipografia_regular', sans-serif;
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	border-radius: 3px;
	padding: 15px 30px;
	border: 0;
	margin: 5px;
	line-height: inherit;
	-webkit-transition: all ease 0.25s;
	transition: all ease 0.25s;
}

.secondary-button {
	font-family: 'tipografia_regular', sans-serif;
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	border-radius: 3px;
	padding: 15px 30px;
	border: 0;
	margin: 5px;
	border: 1px solid #727272;
	color: #323232;
	background: #ffffff;
	line-height: inherit;
	-webkit-transition: all ease 0.25s;
	transition: all ease 0.25s;
}


/* --------------------------------------
=========================================
   SECTION SPECIFIC CSS
=========================================
-----------------------------------------*/
.section1,
.section2,
.section3,
.section4,
.section5,
.section6,
.section7 {
	padding-top: 80px;
	padding-bottom: 80px;
}

.section1{
	padding-top: 150px;
}

.color-white{
	background: white;
}

.color-overlay {
	background: rgba(0, 0, 0, 0.01);
}


/*---------------------------------------
   HEADER / HOME                
-----------------------------------------*/
header {
	background: url(../images/banner-interno-gris.png) no-repeat center top fixed;
	-webkit-background-size: cover;
	background-size: cover;
    min-height: 700px;
    padding-top: 18px;
}

header .vertical-registration-form {
	margin-top: 60px;
}

.navigation-header {
	padding-top: 120px;
	padding-bottom: 2px;
}

.intro-section {
	/*margin-top: 50px;*/
	margin-bottom: 137px;
}

.intro {
	color: #ffffff;
}

.navbar-header img {
	max-height: 50px;
}


/*---------------------------------------
   Navigation                
-----------------------------------------*/
/* NAV RESETS */
.navbar-nav > li > a:hover {
	background: inherit;
}

/* NORMAL NAVIGATION WITH SOCIAL ICON AND LOGO ONLY */
.non-sticky .navbar-nav.navbar-right:last-child {
	margin-right: 0;
}

.non-sticky .navbar-nav > li > a {
	font-size: 25px;
	padding: 0;
	padding-left: 5px;
	padding-top: 3px;
	color: #ffffff;
}

/* STICKY NAVIGATION */
.sticky-navigation {
	min-height: 75px;
	background: #ffffff;
	-webkit-backface-visibility: hidden;
	border: 0;
	-webkit-box-shadow: 0px 2px 8px 0px rgba(50, 50, 50, 0.08);
	box-shadow: 0px 2px 8px 0px rgba(50, 50, 50, 0.08);
}

.sticky-navigation .navbar-header {
	padding-top: 8px;
}

.sticky-navigation .main-navigation {
	padding-top: 13px;
}

.sticky-navigation .main-navigation .current a {
	-webkit-backface-visibility: hidden;
	outline: inherit;
	position: relative;
}

.sticky-navigation .navbar-nav > li > a {
	font-family: 'tipografia_regular', sans-serif;
	font-size: 13px;
	text-transform: uppercase;
	font-weight: 600;
	color: #323232;
}


/*---------------------------------------
   FEATURE LIST 1               
-----------------------------------------*/
.feature-list-1 {
	margin-top: 40px;
	margin-bottom: 20px;
}

.feature-list-1 li {
	margin-top: 25px;
	margin-bottom: 25px;
	position: relative;
	left: -38px;
}

.feature-list-1 li .icon-container {
	width: 32px;
	height: 67px;
	border-radius: 3px;
	color: #ffffff;
	line-height: 32px;
	margin-right: 15px;
	margin-top: 8px;
}

.feature-list-1 li p {
	color: #ffffff;
	font-size: 18px;
	line-height: 30px;
	text-align: justify;
}


/*---------------------------------------
   VERTICAL REGISTRATION FORM               
-----------------------------------------*/
.vertical-registration-form {
	background: #555555;
	padding-left: 30px;
	padding-right: 30px;
	width: 100%;
	max-width: 390px;
	margin: auto;
	padding-bottom: 30px;
}

.vertical-registration-form .colored-line {
	margin-top: 0;
}

.vertical-registration-form h3 {
	color: #ffffff;
	text-transform: uppercase;
	margin-top: 30px;
	margin-bottom: 30px;
}

.vertical-registration-form .input-box {
	width: 100%;
	margin-top: 25px;
	margin-bottom: 25px;
	height: 45px;
	background: #fff;
	border-radius: 3px;
	font-size: 16px;
	color: #323232;
	box-shadow: inherit;
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding;
	background-clip: padding-box;
}

.vertical-registration-form .input-box:focus,
.vertical-registration-form .input-box:active {
	box-shadow: inherit;
	color: #323232;
}

.vertical-registration-form .btn {
    background: #F76C15;
	color: #fff;
	font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 3px;
    padding: 15px 30px;
}

.vertical-registration-form .btn:hover {
    background: #F9A420;
}

/*---------------------------------------
   SECTION WITH LEFT / RIGHT SCREENSHOT             
-----------------------------------------*/
.side-screenshot,
.side-screenshot2 {
	max-width: 532px;
}

.brief h2 {
	margin-top: 0;
	margin-bottom: 10px;
}

.brief p {
	margin-top: 45px;
}

.feature-list-2 {
	margin-top: 25px;
}

.feature-list-2 li {
	overflow: auto;
	padding-top: 12px;
	padding-bottom: 12px;
}

.feature-list-2 li .icon-container {
	width: 32px;
	height: 32px;
	border-radius: 3px;
	color: #ffffff;
	line-height: 32px;
	margin-right: 15px;
	margin-top: 5px;
	text-align: center;
}

.feature-list-2 li .details {
	width: 89%;
}

.feature-list-2 li .details p {
	margin-top: 5px;
}


/*---------------------------------------
   FEATURES SECTION            
-----------------------------------------*/
.features {
	margin-top: 35px;
}

.feature {
	margin-top: 40px;
    margin-bottom: 35px;
    max-width: 300px;
    /*margin: 0 auto;*/
    padding-bottom: 50px;
}

/*
.feature .icon {
	font-size: 50px;
	margin-bottom: 30px;
}

.feature h4 {
	margin-bottom: 10px;
}

*/




/*---------------------------------------
   PACKAGES SECTION            
-----------------------------------------*/
.pricing-table {
	margin-top: 35px;
}

.package {
	overflow: auto;
	border: 1px solid #e5e5e5;
	border-radius: 3px;
	margin-top: 40px;
}

.package .header {
	/*padding-top: 20px;
	padding-bottom: 20px;*/
}

.package .header h3 {
	color: #ffffff;
}

.package-features .column-9p {
	width: 90%;
	float: left;
	text-align: left;
}

.package-features .column-1p {
	width: 10%;
	float: right;
	text-align: right;
	color: #323232;
}

.package-features .column-7p {
	width: 60%;
	float: left;
	text-align: left;
}

.package-features .column-3p {
	width: 40%;
	float: right;
	text-align: right;
}

.package-features ul li {
	overflow: auto;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-right: 35px;
	padding-left: 35px;
	border-bottom: 1px dotted #e3e3e3;
}

.package-features .bottom-row {
	overflow: auto;
	padding-top: 8px;
	padding-bottom: 17px;
	padding-right: 35px;
	padding-left: 35px;
}

.package-features .bottom-row h6 {
	padding-top: 5px;
}

.package-features .bottom-row .secondary-button,
.package-features .bottom-row .standard-button {
	margin: 0;
	padding: 7px 15px;
	vertical-align: middle;
}


/*---------------------------------------
   VIDEO SECTION            
-----------------------------------------*/
video {
	max-width: 100%;
	height: auto;
}

iframe,
embed,
object {
	max-width: 100%;
}

.video-container {
	width: 100%;
	background: #ffffff !important;
	margin-top: 75px;
}

.video {
	background: #ffffff !important;
}

.bg-video{
    background-image:url(../images/banner-login.jpg);
}


/*---------------------------------------
   VIDEO SECTION FEATURES          
-----------------------------------------*/
.video-features {
	margin-top: 40px;
}

.video-features .inline-icon {
	padding-right: 5px;
}


/*---------------------------------------
   SCREENSHOT SECTION          
-----------------------------------------*/
.screenshots {
	margin-top: 68px;
}

.shot {
	margin: 10px;
	border-radius: 3px;
	border: 5px solid #ffffff;
}

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

.shot img:hover {
	cursor: crosshair;
	opacity: 0.8;
}


/*---------------------------------------
   CLIENTS / TESTIMONIALS SECTION          
-----------------------------------------*/
.clients {
	margin-top: 35px;
}

.client-logos li {
	display: inline-block;
    display: -moz-inline-stack;
	vertical-align: middle;
	margin: 15px;
}

.testimonials {
	margin-top: 15px;
}

.single-feedback {
	position: relative;
	margin-top: 20px;
}

.single-feedback .client-pic {
	width: 48px;
	height: 48px;
	margin: auto;
	position: relative;
	margin-bottom: -24px;
	z-index: 999;
	border: 3px solid #ffffff;
	box-shadow: 0px 0px 0px 3px #f7f8fa;
}

.single-feedback .client-pic img {
	max-width: 100%;
}

.single-feedback .box {
	margin-right: 15px;
	margin-left: 15px;
	border-radius: 3px;
	position: relative;
	background: #f7f8fa;
	padding-top: 20px;
	-webkit-box-shadow: 0px 1px 0px 0px rgba(229, 229, 229, 0.75);
	-moz-box-shadow: 0px 1px 0px 0px rgba(229, 229, 229, 0.75);
	box-shadow: 0px 1px 0px 0px rgba(229, 229, 229, 0.75);
}

.single-feedback .box .message {
	padding: 25px;
	font-style: italic;
}

.single-feedback .box:after,
.single-feedback .box:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.single-feedback .box:after {
	border-color: rgba(247, 248, 250, 0);
	border-top-color: #f7f8fa;
	border-width: 15px;
	margin-left: -15px;
}

.single-feedback .box:before {
	border-color: rgba(229, 229, 229, 0);
	border-top-color: #e5e5e5;
	border-width: 16px;
	margin-left: -16px;
}

.single-feedback .client-info {
	margin-top: 30px;
}

.single-feedback .client-info .client-name {
	line-height: 20px;
}

.single-feedback .client-info .company {
	font-size: 13px;
}


/*---------------------------------------
   CALL TO ACTION SECTION          
-----------------------------------------*/
.cta-section {
	background: url(../images/bg-image-2.jpg) no-repeat center fixed;
	-webkit-background-size: cover;
	background-size: cover;
}

.cta-section h4 {
	color: #ffffff;
}

.cta-section h2 {
	color: #ffffff;
	font-weight: 700;
	margin-top: 15px;
	margin-bottom: 40px;
}

.cta-section h3 {
	color: #ffffff;
}

.cta-section .color-overlay {
	padding-top: 125px;
	padding-bottom: 125px;
}


/*---------------------------------------
   SUBSCRIBE FORM           
-----------------------------------------*/
.subscribe-section {
	margin-top: 75px;
}

.subscription-form .input-box {
	width: 300px;
	margin-top: 25px;
	margin-bottom: 25px;
	height: 55px;
	border-radius: 3px;
	font-size: 16px;
	color: #000000;
	box-shadow: inherit;
}

.subscription-success,
.subscription-error {
    color: #FFFFFF;
}

/*---------------------------------------
   CONTACT US SECTION         
-----------------------------------------*/
.contact-us {
	padding-top: 75px;
	padding-bottom: 75px;
}

.contact-us .heading {
	margin-bottom: 10px;
}

.contact-link {
	font-weight: 700;
	text-transform: uppercase;
	margin-top: 50px;
	font-family: 'tipografia_regular', sans-serif;
}

.contact-link:hover {
	text-decoration: none;
}

.contact-link span {
	margin-right: 10px;
}


/*---------------------------------------
   CONTACT FORM             
-----------------------------------------*/
.contact-form {
	margin-top: 25px;
}

.contact-form .success,
.contact-form .error {
	display: none;
}

.contact-form .input-box,
.contact-form .textarea-box {
	margin-bottom: 15px;
	margin-top: 15px;
	outline: 0;
	border: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 1px solid #e3e3e3;
	border-radius: 3px;
	color: #727272;
	padding-left: 12px;
	font-size: inherit;
	line-height: auto;
}

.contact-form .input-box {
	min-height: 50px;
}

.contact-form .textarea-box {
	min-height: 200px;
	-webkit-backface-visibility: hidden;
}

.contact-form .input-box:active,
.contact-form .textarea-box:active,
.contact-form .input-box:focus,
.contact-form .textarea-box:focus {
	color: #323232;
}

.contact-form .btn {
	margin-top: 25px;
}


/*---------------------------------------
   FOOTER SECTION          
-----------------------------------------*/
footer {
	padding-top: 75px;
}

.footer-logo {
	margin: auto;
}

.brand {float: left; width: 50%; text-align: center; height: 100px; max-width: 500px;}
.main-liner {border-right: 2px solid #00f; margin-right: -2px;}

.copyright {
	/*margin-top: 15px;*/
	margin-bottom: 42px;
}

.social-icons li {
	display: inline;
	margin: 2px;
}

.social-icons li a {
	font-size: 25px;
	color: #919191;
}

.social-icons li a:hover {
	text-decoration: none;
}



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

.m_title {display:inline-block; display: -moz-inline-stack; color: white;}
.m_title:first-letter {text-transform: uppercase}


.fixed-pay{
	position: fixed;
    top: 160px;
    right: 0px;
    z-index: 50000;
    /*max-width: 50px;*/
}

.fixed-pay img{
    max-width: 60px;
}

.orange{
	color: #f05e50;
}



.popup-suscriptor {
    display: block;
    width: 100%;
    position: fixed;
    z-index: 1500;
    height: 100%;
    background: rgba(0, 0, 0, 0.48);
}

.popup-suscriptor .popup-suscriptor-content {
    margin: 0 auto;
    width: 100%;
    /*max-width: 850px;*/
}

.popup-suscriptor-close {
    width: 20px;
    float: right;
    top: 25px;
    position: relative;
    cursor: pointer;
}

.popup-suscriptor-close {
    width: 20px;
    float: right;
    top: 25px;
    position: relative;
    cursor: pointer;
}


.footer-green {
    width: 100%;
    height: 12px;
    background: #526A6F;
}

.footer-black{
	text-align: center;
    background: #EB5728;
    padding-bottom: 50px;
}

#head {
    background: #fff;
    padding: 17px 0 17px 0;
    padding: 20px 0 40px;
}

#head .tittle h2 {
    text-align: left;
    color: #fff;
}

.logo-header{
    max-width: 130px;
}

/****************************
 *        VIDEO
****************************/
.videoWrapper {
  position: relative;
  width: 100%;
  height: 0;
  background-color: #000;
}
.videoWrapper43 {
  padding-top: 75%;
}
.videoWrapper169 {
  padding-top: 56%;
}

.videoIframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
}

.videoPoster {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  cursor: pointer;
  border: 0;
  outline: none;
  background-position: 50% 50%;
  background-size: 100% 100%;
  background-size: cover;
  text-indent: -999em;
  overflow: hidden;
  opacity: 1;
  -webkit-transition: opacity 800ms, height 0s;
  -moz-transition: opacity 800ms, height 0s;
  transition: opacity 800ms, height 0s;
  -webkit-transition-delay: 0s, 0s;
  -moz-transition-delay: 0s, 0s;
  transition-delay: 0s, 0s;
}
.videoPoster:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50.15%;
  width: 80px;
  height: 80px;
  margin: -40px 0 0 -40px;
  border: 5px solid #fff;
  border-radius: 100%;
  -webkit-transition: border-color 300ms;
  -moz-transition: border-color 300ms;
  transition: border-color 300ms;
}
.videoPoster:after {
  content: '';
  position: absolute;
  top: 49.5%;
  left: 50%;
  width: 0;
  height: 0;
  margin: -20px 0 0 -10px;
  border-left: 40px solid #fff;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  -webkit-transition: border-color 300ms;
  -moz-transition: border-color 300ms;
  transition: border-color 300ms;
}
.videoPoster:hover:before, .videoPoster:focus:before {
  border-color: #f00;
}
.videoPoster:hover:after, .videoPoster:focus:after {
  border-left-color: #f00;
}
.videoWrapperActive .videoPoster {
  opacity: 0;
  height: 0;
  -webkit-transition-delay: 0s, 800ms;
  -moz-transition-delay: 0s, 800ms;
  transition-delay: 0s, 800ms;
}

body {
  font-family: 'tipografia_regular',sans-serif;
}

#video {
  max-width: 100%;
  /*margin: 20px auto;*/
}

.video-before-section{
	position: relative;
    top: 35px;
    z-index: 50;
    background: white;
}

/****************************
 *       END VIDEO
****************************/


/****************************
 *       INDEX SECTION
****************************/
#login{
	position: relative;
    top: -45px;
    color: #9a9898;
    /*BACKGROUND: #fff;*/
}
#login .line-orange {
    width: 100%;
    height: 2px;
    background: #F9A420;
    position: relative;
    /*top: -80px;*/
}

.bg-plomo{
    background: #EDEDED;
}

#login a{
	color: #fff;
}

.content-line {
    position: relative;
}

.line-left {
    width: 3px;
    height: 200px;
    background: #59D79F;
    position: absolute;
    left: -30px;
}

.line-right {
    width: 3px;
    height: 200px;
    background: #59D79F;
    position: absolute;
    right: -30px;
}

/****************************
 *       END INDEX SECTION
****************************/


/****************************
 *       AVATAR SECTION
****************************/
#avatar {
    cursor: pointer;
}

.card.hovercard {
    position: absolute;
    margin: 0 auto;
	width: 100%;
	z-index: 99;
	margin-bottom: 50px;
}

.card.hovercard .avatar {
    position: relative;
    top: -50px;
    margin-bottom: -50px;
}

.card.hovercard .avatar img {
    width: 100px;
    height: 100px;
    max-width: 100px;
    max-height: 100px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    border: 5px solid #4DB050;
}

/****************************
 *       END AVATAR SECTION
****************************/


/****************************
 *       COURS BOX
****************************/
/*
.feature .icon {
    font-size: 50px;
    margin-bottom: 30px; 
    padding: 0 100px 0 100px;
}
*/

.section-courses{
	padding-bottom: 80px;
}

@media (max-width: 1024px) {
    /*
    .feature .icon {
        padding: 0 20px 0 20px;
    }*/
}

/****************************
 *       END COURS BOX
****************************/

.title-index{
	text-align:center;
	overflow:hidden;
}

.title-index .lines{
	display:inline-block;

	position:relative;
}

.title-index .lines:after, .title-index .lines:before {
	content:" ";
	display:block;
	height:1px;
	width:1000px;
	background:#818181;;
	position:absolute;
	top:50%;
}

.title-index .lines:before{
	left:-1010px;
}

.title-index .lines:after{
	right:-1010px;
}

.orange-title{
    background: #FF9900;
    padding: 10px 17px 10px 17px;
    border-radius: 17px;
    text-align: center;
}

.orange-title h2{
    color: #fff;
    text-align: -webkit-center;
}

.section-admin{
    margin: 100px 0 100px 0;
}


/****************************
 *   DASHBOARD TOOL BOX
****************************/
#dashboard-tools-box{
    list-style: none outside none; 
    margin:0; 
    padding: 50px 0 50px 0;
}

#dashboard-tools-box li{
    display: inline-block;
    display: -moz-inline-stack;
    text-align: -webkit-center;
    max-width: 200px;
    margin: 5px;
    align-content: center;
}

#dashboard-tools-box li img{
    position: relative;
    margin: 0 auto;
}
/****************************
 *  END DASHBOARD TOOL BOX
****************************/


/****************************
 *   COURSE TOOL BOX
****************************/
#course-tools-box{
    list-style: none outside none; 
    margin:0; 
    padding: 50px 0 50px 0;
}

#course-tools-box img{
    max-width: 80px;
}

#course-tools-box li{
    /*display: inline-block;*/
    text-align: -webkit-center;
    max-width: 200px;
    margin: 5px;
}

#course-tools-box h6{
    color:#F36800;
    margin: 3px 0 3px 0;
    font-size: 14px;
}
/****************************
 *  END COURSE TOOL BOX
****************************/




/****************************
 *      COURSES BOX
****************************/

#home .tipo{
    position: relative;
    /* top: 0px; */
    margin: 0 auto;
    text-align: center;
    font-size: 120px;
    top: 50px;
    color: azure;
    text-shadow: 2px 2px #99999959;
}

.bg-box-green{
    height: 200px;
    background: #5EAE91;
    padding: 10px;
}

.courses-box{
    margin-top: 40px;
    margin-bottom: 35px;
    
    background: #fff;
    margin: 20px;
    border: 2px dashed #FF1725;
    border-radius: 10px;
    padding-bottom: 21px;
}

.courses-box .icon {
    font-size: 50px;
    /* margin-bottom: 30px;
    padding: 0 50px 0 50px; */
}

.courses-box button{
    margin-top: 25px;
}

.progress{
    margin-top: 25px;
    height: 25px;
    border: 0;
}

.progress-bar-green{
    background-color: #EB5727;
}
/****************************
 *  END COURSES BOX
****************************/



iframe {
	/*position: absolute;
	top: 0;
	left: 0;
	width: 100%;*/
}

/****************************
 *  HORIZONTAL TIME LINE
****************************/
.section-header, .steps-header, .steps-name {
  color: #5DAD90;
  font-weight: 400;
  font-size: 1.4em;
}

.steps-header {
  margin-bottom: 20px;
  text-align: center;
}

.steps-timeline {
  outline: 1px dashed rgba(255, 0, 0, 0);
}
@media screen and (max-width: 500px) {
  .steps-timeline {
    /* border-top: 4px solid #5DAD90; */
    padding-top: 11px;
    /* margin-top: 40px; */
    /* margin-left: 16.65%; */
    /* margin-right: 16.65%; */
    position: relative;
    top: 80px;
  }
}

.steps-timeline:after {
  content: "";
  display: table;
  clear: both;
}

.steps-one,
.steps-two,
.steps-three {
  outline: 1px dashed rgba(0, 128, 0, 0);
}
@media screen and (max-width: 500px) {
  .steps-one,
  .steps-two,
  .steps-three {
    margin-left: -25px;
  }
}
@media screen and (min-width: 500px) {
  .steps-one,
  .steps-two,
  .steps-three {
    float: left;
    width: 33%;
    margin-top: -50px;
  }
}

@media screen and (max-width: 500px) {
  .steps-one,
  .steps-two {
    padding-bottom: 40px;
  }
}

@media screen and (min-width: 500px) {
  .steps-one {
    margin-left: -16.65%;
    margin-right: 16.65%;
  }
}

@media screen and (max-width: 500px) {
  .steps-three {
    margin-bottom: -100%;
  }
}
@media screen and (min-width: 500px) {
  .steps-three {
    margin-left: 16.65%;
    margin-right: -16.65%;
  }
}

.steps-img {
  display: block;
  margin: auto;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

.steps-img.active {
  width: 60px;
  height: 60px;
  top: 5px;
  position: relative;
}

@media screen and (max-width: 500px) {
  .steps-img {
    float: left;
    margin-right: 20px;
  }
}

.steps-name,
.steps-description {
  margin: 0;
}


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

.steps-description {
  overflow: hidden;
}
@media screen and (min-width: 500px) {
  .steps-description {
    text-align: center;
  }
}




@media screen and (min-width: 500px) {
    .line-course-content {
        list-style: none outside none;
        margin: 0;
        padding: 0;
        position: relative;
        top: 50px;
    }


    .line-course-content li {
        display: -moz-inline-stack;
        text-align: -webkit-center;
        max-width: 200px;
        /*margin: 5px;*/
        width: 19%;
        margin-bottom: 9px;
    }


    .line-course-content li img {
        cursor: pointer;
    }
}

@media (max-width: 991px){

    .steps-timeline{
        top: -50px;
    }

    .line-course-content li {
        display: inline-block;

    }

}
/****************************
 *  END HORIZONTAL TIME LINE
****************************/


/****************************
 *    MODAL ORANGE
****************************/
.modal-header-orange{
    background: #F19600;
    color: #fff;
}

.modal-header-orange .modal-title{
    color: #fff;
}

/****************************
 *  END MODAL ORANGE
****************************/


/****************************
 *    MODAL ORANGE
****************************/
.modal-header-red{
    background: #D9534F;
    color: #fff;
}

.modal-header-red .modal-title{
    color: #fff;
}

/****************************
 *  END MODAL ORANGE
****************************/


/****************************
 *    MODAL GREEN
****************************/
.modal-header-green{
    background: #5DAD90;
    color: #fff;
}

.modal-header-green .modal-title{
    color: #fff;
}

/****************************
 *  END MODAL GREEN
****************************/

.btn-custom-orange{
    background: #f0ad4e;
    color: white;
    padding: 10px;
}

.btn-custom-orange:hover{
    background: #ef9e2b;
}

a, a:hover{
    text-decoration: none;
}

.dashboard-clases{
    border: 2px dashed #FF9900;
    border-radius: 10px;
}

/*****************DASHBOARD******************/
.feature.ser h4, .feature.jugar h4, .feature.expresar h4, .feature.indagar h4{
    padding: 3px;
    font-weight: 800;
}

.feature.ser p, .feature.jugar p, .feature.expresar p, .feature.indagar p{
   padding: 10px 3px 3px 3px;
}

.feature.ser .border{
   border: 2px dashed #FF9900;
   border-radius: 10px;
   padding-bottom: 21px;
}
.feature.jugar .border{
   border: 2px dashed rgb(0, 110, 225);
   border-radius: 10px;
   padding-bottom: 21px;
}
.feature.expresar .border{
   border: 2px dashed #FF1725;
   border-radius: 10px;
   padding-bottom: 21px;
}
.feature.indagar .border{
   border: 2px dashed #00B147;
   border-radius: 10px;
   padding-bottom: 21px;
}



.ser .border {
    border: 2px dashed #FF9900;
    border-radius: 10px;
    /*padding-bottom: 21px;*/
    margin-top: 50px;
}

.ser h4 {
    background: #FF9900;
    color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
}



.feature.ser h4{
    background: #FF9900;
    color: #fff;
}

.feature.jugar h4{
    background: rgb(0, 110, 225);
    color: #fff;
}

.feature.expresar h4{
    background: #FF1725;
    color: #fff;
}

.feature.indagar h4{
    background: #00B147;
    color: #fff;
}

#dashboard-tools-box h6{
    color:#F36800;
    margin: 3px 0 3px 0;
    font-size: 13px;
}



/******************DASHBOARD****************/
   


/******************COURSE****************/


.course-Induction {
    background: url(/Content/themes/default/images/time-0.png) no-repeat transparent;
    background-position: 0px 0px;
    height: 60px;
    width: 60px;
    position: relative;
    top: 5px;
    cursor: pointer;
}

.course-Induction.active, .course-Induction:hover{
    background: url(/Content/themes/default/images/time-0.png) no-repeat transparent;
    background-position: 0px -60px;
    color: #44bc34;
}

.course-SimpleHTML {
    background: url(/Content/themes/default/images/video_sprite.png) no-repeat transparent;
    background-position: 0px 0px;
    height: 60px;
    width: 60px;
    position: relative;
    top: 5px;
}

.course-SimpleHTML span{
    position: absolute;
    top: 18px;
    color: #ffffff;
    margin-left: -5px;
    font-size: 20px;
}

.course-SimpleHTML.active, .course-SimpleHTML:hover{
    /*background: url(/Content/themes/default/images/video_sprite.png) no-repeat scroll left 4px transparent;*/
    background-position: 0px -60px;
    color: #44bc34;
}

.course-SimpleHTML.active span, .course-SimpleHTML:hover span{
    color: #3FA985;
}


.course-Evaluacion {
    background: url(/Content/themes/default/images/evaluacion_sprite.png) no-repeat transparent;
    background-position: 0px 0px;
    height: 60px;
    width: 60px;
    position: relative;
    top: 5px;
}

.course-Evaluacion.active, .course-Evaluacion:hover{
    background-position: 0px -60px;
}

/******************COURSE****************/


#myModalAlert.alert .modal-content{
    border: 7px solid #eecd14;
}

#myModalAlert.alert .modal-body img{
    max-width: 200px;
    padding: 5px;
    margin:0 auto;
}

#myModalAlert.alert .modal-footer{
    text-align: center;
}

#myModalAlert.alert .modal-footer{
    text-align: center;
}

#myModalAlert.alert .modal-footer button{
    background: #eecd14;
    width: 100%;
    padding: 15px;
    color: white;
    font-weight: 600;
    font-size: 17px;
}



#question-letter {
    background: #8C8C8C;
    padding: 10px 10px 10px 15px;
    border-radius: 10px;
    text-align: left;
    color: #fff;
    font-weight: 400;
    width: 100%;
    margin-bottom: 12px;
}

#question-numbers{
    text-align: center;
}

#question-numbers li{
    background: #ABABAB;
    border-radius: 100%;
    text-align: center;
    padding: 10px 15px 10px 14px;
    color: white;
    font-weight: 600;
    display: inline;
    margin: 10px;
    top: 10px;
    position: relative;
    cursor: pointer;
}

#question-numbers li.active, #question-numbers li:hover{
    background: #F19800;
}



#list-feedback .question-respuesta .Correcto{
    background-color: #dff0d8;
    border-color: #d6e9c6;
    padding: 15px 10px 3px 23px;
    margin: 12px;
}

#list-feedback .question-respuesta .Incorrecto{
    background-color: #f2dede;
    border-color: #ebccd1;
    padding: 15px 10px 3px 23px;
    margin: 12px;
}

#list-feedback .question-respuesta .Default{
    padding: 1px 10px 3px 23px;
    margin: 12px;
}

#question-content #question {
    margin-top: 14px;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 36px;
}

#finalizar-evaluacion{
    margin-right: 25px;
}



#list-feedback .question-letter{
    background: #8C8C8C;
    padding: 10px 10px 10px 15px;
    border-radius: 10px;
    text-align: left;
    color: #fff;
    font-weight: 400;
    width: 100%;
    padding: 15px 10px 3px 23px;
    margin: 12px;
}

.gree-note{
    background: #00b147;
    color: white;
    text-align: center;
    font-size: 30px;
    height: 80px;
    display: table;
    margin-bottom: 10px;
}

.gree-note p{
    display: table-cell;
    vertical-align: middle;
}

#foroContainer .bloque-1, #blogContainer .bloque-1{
    text-align: left;
    background: #efefef;
    padding: 15px;
    margin-bottom: 10px;
}

#foroContainer .bloque-1 .col-md-1, #blogContainer .bloque-1 .col-md-1{
    text-align: right;
}



/* TOOL COMMENTS NIVEL 1 */
.toll-comments{
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    float: right;
    top: -12px;
    right: -31px;
}

.toll-comments li{
    float: left;
    margin-right: 9px;
}


.toll-comments .comentar, .toll-comments .comentar-update, .toll-comments .comentar-delete {
    cursor: pointer;
}

.toll-comments .comentar:hover, .toll-comments .comentar-update:hover, .toll-comments .comentar-delete:hover {
    color: #008ed6;
}


.comentar-update{
    display: none;
}

/* END TOOL COMMENTS NIVEL 1 */




/* TOOL COMMENTS NIVEL 2 */

.comment-replies .toll-comments{
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
    float: right;
    top: -4px;
    right: -17px;
}

.comment-replies .toll-comments li{
    float: left;
    margin-right: 9px;
}

/* END TOOL COMMENTS NIVEL 2 */

.comment-replies{
    margin-bottom: 24px;
    text-align: left;
    padding: 15px;
    margin-bottom: 10px;
}

.comment-replies .col-md-2{
    text-align: right;
}


.bs-callout-warning {
    border-left-color: #aa6708;
}

.bs-callout {
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #eee;
    border-left-width: 5px;
    border-radius: 3px;
}

.blogContainer{
    text-align: left;
}


#nino{
    position: relative;
    left: -160px;
    top: -50px;
    z-index: 100;
    float: right;
    width:60px;
}

#mono{
    position: relative;
    left: 150px;
    top: 150px;
    z-index: 100;
    width:70px;
}

.fnd_verde{
    background:#DADADA;
    position:absolute;
    width:100%;
    height:200px
}


@media screen and (max-width: 1200px) {
    #nino{
        left: -130px;
    }

    #mono{
        left: 110px;
    }
}

@media screen and (max-width: 1000px) {
    #nino{
        left: -90px;
    }

    #mono{
        left: 70px;
    }

    #course-tools-box{
        /*display:none;*/
    }

    #course-tools-box li{
      display: inline-block;
    }
}

@media screen and (max-width: 700px) {
    #nino{
        left: -75px;
    }

    #mono{
        left: 55px;
    }
}

@media screen and (max-width: 650px) {
    #nino{
        display: none;
    }

    #mono{
        display: none;
    }

    #home .tipo{
        font-size: 45px;
    }
}


@media screen and (max-width: 800px) {
    #question-numbers li {
        display: grid;
        height: 44px;
        width: 48px;
        float: left; 
    }

    .feature {
        margin: 0 auto;
    }

    .dashboard-features{
        margin-top: 50px;
    }

    .ser{
        max-width: 300px;
        position:relative;
        margin: 0 auto;
    }
}


#myModalMessage .notify_error{
    border: 7px solid #d82c08;
}

#myModalMessage .info{
    border: 7px solid #05add0;
}

#myModalMessage .warning{
    border: 7px solid #f9d017;
}

#myModalMessage .success{
    border: 7px solid #41ad07;
}

.avatar-tumbaild{
    max-width: 40px;
    border-radius: 100%;
    position: relative;
    float: left;
    border: 2px solid #4c4c4c;
    margin: 5px;
}

.autor-post{
    font-size: 14px;
    color: #008ed6;
}

#alternatives, #question{
    text-align: left;
}




/* =================================
===  STARS QUALIFICATION                 ====
=================================== */

.starrr {
  display: inline-block; }
  .starrr a {
    font-size: 36px;
    padding: 0 8px;
    cursor: pointer;
    color: #FFD119;
    text-decoration: none; 
}


.course-radius{
    border-radius: 10px;
        padding: 0px;
        -moz-box-shadow: inset 0 0 10px #000000;
        -webkit-box-shadow: inset 0 0 10px #000000;
        box-shadow: 0 0 12px 1px #b3b2b2;
}