/*
Theme Name: Tutoriales PAD 
Author: MU Marketing & Content Lab, Javier Yamashita
Author URI: http://www.lavacamu.pe/
Description: Tema personalizado para el sitio web de Tutoriales PAD
Version: 1.0
*/


@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,700|Open+Sans:300,300i,400,400i,600,600i,700,700i');

@font-face {
  font-family:'Material Icons'; 
  src:url(fonts/MaterialIcons-Regular.eot);
  src:url(fonts/MaterialIcons-Regular.eot#iefix) format('embedded-opentype'),
      url(fonts/MaterialIcons-Regular.ttf) format('truetype'),
      url(fonts/MaterialIcons-Regular.woff) format('woff'),
      url(fonts/MaterialIcons-Regular.woff2) format('woff2');
  font-weight:normal;
  font-style:normal;
}
.material-icons-ico, [class*="material-icons-"]:before { font-family:'Material Icons'; speak:none; font-weight:normal; font-style:normal; font-size:inherit; font-variant:normal; text-transform:none; line-height:1; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.material-icons-lock_open:before { content:"\e898"; }
.material-icons-exit_to_app:before { content:"\e879"; }

/*------------------------------------
  Default Styles
------------------------------------*/
* { margin:0; padding:0; border:0; outline:0; }
html, body { width:100%; height:100%; }
body { font-weight:400; font-size:14px; line-height:1.6; font-family:'Open Sans', sans-serif; color:#333; background:#EFEFEF; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

img::selection { background:transparent; }
img::-moz-selection { background:transparent; }
img { max-width:100%; height:auto; }

a { color:#AC1f2D; outline:none; -webkit-transition:all .25s ease !important; transition:all .25s ease !important; }
a:focus, a:hover, a:active, a.active { color:#AC1f2D; text-decoration:none; }
b, strong { font-weight:700; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-weight:600; font-family:'Montserrat'; line-height:1.1; color:#23282D; margin:0 0 10px; }
.h2, h2 { font-size:30px; letter-spacing:2px; }
.h3, h3 { font-size:22px; letter-spacing:2px; }
.h4, h4 { font-size:20px; letter-spacing:1.5px; }
.h5, h5 { font-size:15px; letter-spacing:1.2px; }
.h5, h5, p { margin-bottom:15px; }

ol, ul { list-style:none; }

input[type=date], input[type=text], input[type=email], input[type=password], input[type=tel], input[type=number], input[type=search], select, textarea { width: 100%; font-size: 13px; color: #777; background: #efefef; border: 3px solid #efefef; box-shadow: none !important; outline: 0 !important; padding: 12px 13px; height: 44px; -webkit-transition: none; transition: none; border-radius: 0; vertical-align: top; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
input[type=submit] { outline:0 !important; }

.color { color:#AC1F2D; }

/* borderless table */
.table.table-borderless td, .table.table-borderless th, .table.table-borderless>tbody+tbody { border:0 !important; }
.table-condensed>tbody>tr>td, .table-condensed>tbody>tr>th, .table-condensed>tfoot>tr>td, .table-condensed>tfoot>tr>th, .table-condensed>thead>tr>td, .table-condensed>thead>tr>th { padding:0; }

.uppercase { text-transform:uppercase; }

.container-full { position:relative; width:100%; margin:0 auto; }

.vertical-top { vertical-align:top; }
.vertical-middle { vertical-align:middle; }
.vertical-bottom { vertical-align:bottom; }
.vertical-align { display:flex; align-items:center; }

.dp-table { display:table; table-layout:fixed; width:100%; height:100%; }
.dp-tablecell { display:table-cell; width:100%; height:100%; vertical-align:middle; }


.no-margin { margin:0 !important; }
.no-padding { padding:0 !important; }
.no-mb { margin-bottom:0 !important; }
.hideAll { display:none; }

.videoWrapper { position:relative; padding-bottom:56.25%; /* 16:9 */ /*padding-top:25px;*/ height:0; margin-bottom:15px; }
.videoWrapper iframe { position:absolute; top:0; left:0; width:100%; height:100%; }

/* BOOTSTRAP */
/* Buttons */

.btn { position:relative; transition:.2s ease; cursor:pointer; padding:10px; border:1px solid transparent; }

/* Panel */
.panel { margin:0; padding:15px; background:#FFF; }
.panel-default { border-color:transparent; }
.panel-default>* { background-color:transparent; border:0px none; }
.panel-default>.panel-heading { color:#333; background-color:transparent; }
.panel-heading { padding:10px 15px; }


/***************************
========== HEADER ==========
****************************/
.navbar-custom { min-height:0; background:#FFF; border-width:0px; margin:0; border-radius:0; }
.navbar-custom:before { display:none; position:absolute; left:0; top:0; width:100%; height:60px; content:''; background:#ae1930; z-index:0; }
.navbar-custom .container { position:relative; background:transparent; }
.navbar-custom .navbar-fixed-top { border:0px; }
.navbar-custom .navbar-brand { height:auto; padding-top:0;  }
.navbar-custom .navbar-brand img { height:100px; transition:all 0.3s ease; }
.navbar-custom .navbar-toggle { /*display:block;*/ width:36px; height:36px; line-height:32px; font-size:18px; color:#FFF; color:#AC1f2D; margin:15px 15px 0 0; margin-top:25px; padding:0; background:transparent; border:0 none; }
.navbar-custom .navbar-toggle:hover, .navbar-custom .navbar-toggle:focus { color:#AC1f2D; background:transparent; }

/*
.navbar-custom .usuario a { color:rgba(255,255,255,0.7); }
.navbar-custom .usuario a:hover { color:rgba(255,255,255,1); }
*/
.navbar-custom .usuario { position:absolute; right:0; top:0; margin-top:5px; padding:15px; }

.navbar-custom .navbar-collapse { max-height:none; margin:0; padding:0; background:transparent; border:0px; -webkit-box-shadow:none; box-shadow:none; }
.navbar-custom .navbar-nav { margin-top:50px; }
.navbar-custom .navbar-nav > li { font:400 13px/1 'Montserrat'; letter-spacing:1px; text-transform:uppercase; text-align:left; margin:0 15px; }
.navbar-custom .navbar-nav > li:first-child { margin-left:0 }
.navbar-custom .navbar-nav > li:last-child { margin-right:0 }
.navbar-custom .navbar-nav > li > a { color:#333; }
.navbar-custom .navbar-nav > li > a:hover, .navbar-custom .navbar-nav > li > a:focus, .navbar-custom .navbar-nav > li > a:active, 
.navbar-custom .navbar-nav>.active>a, .navbar-custom .navbar-nav>.active>a:focus, .navbar-custom .navbar-nav>.active>a:hover, 
.navbar-custom .navbar-nav li.current-menu-item > a, .navbar-custom .navbar-nav li.current_page_item > a, .navbar-custom .navbar-nav li.current-page-ancestor > a { color:#AC1f2D; background-color:transparent; }
.navbar-custom .navbar-nav li.current-menu-item, .navbar-custom .navbar-nav li.current_page_item, .navbar-custom .navbar-nav li.current-page-ancestor { font-weight:600; }
/****************************
========== CONTENT ==========
*****************************/
#content { border-top:5px solid #d8d8d8; background:#EFEFEF; }

/* INTRO */
#login { position:relative; width:100%; height:100%; background:url('images/login-bg-2.jpg') no-repeat right top; background-size:cover; overflow:hidden; }
#login #content { height:100%; border:0px none; background:transparent none; } 
#login:before { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; content:''; background:rgba(35,40,45,0.9);  }

.franja { width:100%; height:10px; background:#000; display:none; }

#login-header { position:fixed; left:0; top:0; width:100%; height:100px; background:transparent url('images/logo-pad.png') no-repeat center top; background-size:100px auto; }


#login-footer { position:fixed; left:0; bottom:0; width:100%; color:#FFF; text-align:center; padding:20px; }
#login-footer a { color:#AC1f2D; webkit-transition: all .25s ease !important; transition: all .25s ease !important; }
#login-footer a:hover { color:#FFF; opacity:0.6; }

#loginbox { position:relative; width:100%; height:100%; }
#loginbox .container, #loginbox .row, #loginbox .row > div { height:100%; }
#loginbox .bg { position:absolute; left:0; top:0; width:100%; height:100%; content:'';  }
#loginbox .panel { padding:0; border:0px none; }
#loginbox .panel-heading { padding:40px 10px 30px; }
#loginbox .panel-heading h2 { font-size:18px; line-height:24px; font-family:'Montserrat'; text-transform:uppercase; text-align:center; margin-bottom:30px; }
#loginbox .panel-heading h2 span { display:block; }
#loginbox .panel-heading .icono { text-align:center; }
#loginbox .panel-heading .icono i { display:inline-block; width:60px; height:60px; font-size:60px; line-height:60px; color:#000; text-align:center; }

#loginbox .panel-body { padding:0; }
#loginbox .panel-body form p { margin-bottom:10px; padding:0 20%; }
#loginbox .panel-body .login-password { margin-bottom:60px; }
#loginbox .panel-body p:last-child, #loginbox .panel-body p.login-submit { margin-bottom:0; padding:0; }
#loginbox .btn { text-transform:uppercase; color:#FFF; font-weight:600; font-family:'Montserrat'; }
#loginbox .btn-rounded { border-radius:4px; border-top-left-radius:0; border-top-right-radius:0; }
#loginbox .btn-primary { color:#fff; background-color: #AC1f2D; }
#loginbox .btn-primary:hover, #loginbox .btn-primary:focus, #loginbox .btn-primary:active { background-color:#000; border-color:#000; }

#loginbox input[type="text"], #loginbox input[type='password'] { position:relative; background:transparent; border:0; border-radius:0; padding:6px 10px 6px 0; border-bottom:1px solid #30353A; font-size:15px; color:#000; z-index:10; webkit-transition: all .25s ease !important; transition: all .25s ease !important; }

#loginbox form > div { margin-bottom:20px; }

#loginform label { display:none; }

.navbar-brand img, .navbar-brand span { display:inline-block; vertical-align:bottom; }
.navbar-brand span { margin:0 0 27px 20px; font-size:28px; color:#333; text-transform:uppercase; }

.page-heading { position:relative; text-align:center; padding:60px 0; background:url('images/page-heading-bg.jpg') no-repeat center center; background-size:cover; }
.page-heading * { color:#FFF; }
.page-heading h3 { font-size:30px; line-height:1; margin:0; }
.page-heading h4 { display:none; font-weight:300; font-size:16px; line-height:20px; letter-spacing:1.2; opacity:0.7; }
.page-heading h4 { display:none; }
.page-heading:before { position:absolute; top:0; left:0; width:100%; height:100%; content:''; background:rgba(35,40,45,0.9); }

.page-content { padding:60px 0; min-height:500px; }
.categoria { display:block; color:#333; background:#FFF; padding:20px 20px 15px; text-align:center; border-bottom:4px solid #30353A; webkit-transition: all .25s ease !important; transition: all .25s ease !important; }
.categoria-icono { display:block; height:100px; color:#FFF; background-color:#AC1f2D; background-repeat:no-repeat; background-position:center; background-size:auto 50%; }
.categoria-contabilidad .categoria-icono { background-image:url('images/icons/contabilidad.png'); }
.categoria-imagen { position:relative; width:100%; overflow:hidden; }
.categoria-imagen > div { position:absolute; top:0; left:0; width:100%; }
.categoria-imagen img { width:100%; -webkit-transition:0.4s ease; transition: 0.4s ease; }

.categoria-texto { padding-top:15px; }
.categoria-texto > * { margin:0; }
.categoria-texto h5 { letter-spacing:1px; text-transform:uppercase; margin-bottom:10px; }
.categoria-texto small { color:#4b5b68; }
.categoria:hover .categoria-icono { background-color:#30353A; webkit-transition: all .25s ease !important; transition: all .25s ease !important; }
.categoria:hover, .categoria:hover h5 { color:#AC1f2D; border-color:#AC1f2D; }
.categoria:hover .categoria-imagen img { -webkit-transform: scale(1.2); transform: scale(1.2); }

.categoria.no-pad { padding:2px;}
.categoria.no-pad .categoria-texto { padding:15px 20px; }

.page-heading.breadcrumb { position:relative; text-align:left; margin-bottom:0; padding:20px 0 10px; background:url('images/page-heading-bg.jpg') no-repeat center center; background-size:cover; }
.page-heading.breadcrumb h5 { margin-bottom:3px; }
.page-heading.breadcrumb a { color:#AC1f2D; }
.page-heading.breadcrumb a:hover { color:#FFF; }
.page-heading.breadcrumb h3 { font-size:24px; }
.page-heading:before { position:absolute; top:0; left:0; width:100%; height:100%; content:''; background:rgba(35,40,45,0.9); }

.page#contabilidad .page-content { padding:30px 0 60px; }
.row.video { margin-bottom:30px; }
.video-content { padding-top:30px; padding-bottom:15px; background:#FFF; border-top:4px solid #AC1f2D; }
.video-content h5 { font-size:18px; letter-spacing:1px; text-transform:uppercase; margin-bottom:0; }

.content h2, .content h3, .content h4, .content h5, .content table, .content ol, .content ul, .content p { margin-bottom:20px; }
.content ul > li { position:relative; padding-left:24px; }
.content ul > li:before { position:absolute; left:0; top:3px; content:'\f058'; font-size:16px; line-height:1; font-family:'FontAwesome'; color:#AC1F2D; }
.content ol { list-style:decimal; margin-left:25px; }
.content ol > li {  }
.content .h5 { margin-bottom:5px; }

/****************************
========== FOOTER ==========
*****************************/
#footer { font-size:13px; color:#FFF; background-color:#30353A; padding:20px 0; }
#footer a { color:#FFF; }
#footer p, #footer ul { margin-bottom:0; }
#footer ul { list-style:none; margin:0; padding:0; font-size:0; }
#footer ul li { display:inline-block; text-align:center; font-size:13px; margin:0 10px; }
#footer ul li:first-child { margin-left:0; /*float:left;*/ }
#footer ul li:last-child { margin-right:0; /*float:right;*/ }

#login #footer { position:fixed; bottom:0; width:100%; }

@media (min-width: 768px) and (max-width: 992px) {
  .container { width:90%; }
}

@media (max-width: 768px) {
  .navbar-brand { padding-bottom:5px }
  .navbar-custom .navbar-brand img { height:70px; }
  .navbar-brand span { font-size:20px; margin:0 0 15px 10px; }
  .navbar-custom .usuario { position:absolute; top:27px; right:60px; margin-top:0; padding:0; }   
  .navbar-custom .navbar-toggle { margin:18px 10px 0 0; }
  .navbar-custom .navbar-nav { margin:0 0 15px; }
  .navbar-custom .navbar-nav > li { margin:0; text-align:center; }
  .navbar-custom .navbar-nav > li > a { padding:10px 0; }

  #content { border-top:0 none; }
  .page-heading { padding:30px 0; }
  .page-content { min-height:0; padding:30px 0; }
}

@media (max-width:575px) { 
  body { font-size:14px; }
  .h2, h2 { font-size:22px; letter-spacing:1px; }
  .h3, h3 { font-size:18px; letter-spacing:1px; }
  .h4, h4 { font-size:16px; letter-spacing:.5px; }
  .h5, h5 { font-size:14px; letter-spacing:0; }

  #login-header { background-size:80px auto; }
  #login #content {  }
  #loginbox .panel-heading { padding:20px 10px 0; }
  #loginbox .panel-heading h2 { font-size:14px; line-height:18px; letter-spacing:1px; margin-bottom:15px; }
  #loginbox .panel-heading .icono { margin-bottom:0; }
  #loginbox .panel-body form p { padding:0 20px; }
  #loginbox .panel-body .login-password { margin-bottom:40px; }
  #login-footer { font-size:11px; padding:15px; }
  #login-footer p { margin-bottom:0; }
}

.break #login-header, .break #login-footer { position:relative; }
.break#login #content, .break#loginbox { height:auto; }