/*--------------------------------------------*\
$FONTFACE
\*--------------------------------------------*/

@font-face {
    font-family: 'leelawadeeregular';
    src: url('../fonts/leelawad-webfont.eot');
    src: url('../fonts/leelawad-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/leelawad-webfont.woff') format('woff'),
         url('../fonts/leelawad-webfont.ttf') format('truetype'),
         url('../fonts/leelawad-webfont.svg#leelawadeeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'leelawadeebold';
    src: url('../fonts/leelawdb-webfont.eot');
    src: url('../fonts/leelawdb-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/leelawdb-webfont.woff') format('woff'),
         url('../fonts/leelawdb-webfont.ttf') format('truetype'),
         url('../fonts/leelawdb-webfont.svg#leelawadeebold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'FontAwesome';
    src: url('../fonts/fontawesome-webfont.eot');
    src: url('../fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/fontawesome-webfont.woff') format('woff'),
         url('../fonts/fontawesome-webfont.ttf') format('truetype'),
         url('../fonts/fontawesome-webfont.svg#fontawesome') format('svg');
    font-weight: normal;
    font-style: normal;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {

  @font-face {
    font-family: 'leelawadeeregular';
    src: url('../fonts/leelawad-webfont.svg#leelawadeeregular') format('svg');
  }

    @font-face {
    font-family: 'leelawadeebold';
    src: url('../fonts/leelawdb-webfont.svg#leelawadeebold') format('svg');
  }
}

/*--------------------------------------------*\
$RESET
\*--------------------------------------------*/

img{
	border:none;
}

.fontArial{
	font-family: 'Arial', sans-serif;
}

.fontLew{
	font-family: 'leelawadeeregular', sans-serif;
}

.fontLewBold{
  font-family: 'leelawadeebold', sans-serif;
}

.fontAwesome{
  font-family: 'FontAwesome', sans-serif;
}

.fontPTSans{
  font-family: 'PT Sans Narrow', sans-serif;
}

body{
  background-color: #eceff4;
  background: url("../images/raster.jpg");
}

footer{
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  padding: 10px 30px;
  z-index: 999;
}

/**CENTRADO DE CONTENIDO*/

.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
}

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

/* ==========================================================================
HEADER
========================================================================== */


.barraTop{
	padding: 0px;
}
.headerB{
  background-color: #fff;
  padding: 15px 0px;
  height: 100px;
}

.logoTial img{
  float: right;
}

/* ==========================================================================*/


/* ==========================================================================
MENU
========================================================================== */

.mainMenu{
  background-color: ##241E4A;
  height: 50px;
  color: #d0d1d2;
}

.mainMenu_appicon{
  color: #8f99a3;
  font-size: 1.3em;
  float: left;
  margin-right: 10px;
  margin-top: 12px;
}

.mainMenu_appText{
  font-size: 1.3em;
  line-height: 1.2em;
    margin-top: 13px;
}

.mainMenu ul > li {
  display: inline-block;
  padding: 14px 5px;
  margin-top: 0px;
}


.mainMenu ul > li:hover {
  background-color: #18222c;
  cursor: pointer;
}

.profile{
    margin-top: 12px;
    font-size: 1em;
    color: #fff;
}

.profilePic{
  float: left;
  margin-right: 5px;
}

.profileName{
    float: left;
  margin-right: 5px;
  padding-right: 5px;
  border-right: 1px solid #fff;
}


/* ==========================================================================
CONTENIDOS
========================================================================== */


.grayBox{
  background: none;
  border-top: solid 3px #e6e6e6;
  margin-top: 10px;
  width: 100%;
}

.infoTabs{
  margin-top: 30px;
}

.tabText{
  font-size: 1.2em;
  text-transform: uppercase;
}

.iconTab{
  font-size: 1.5em;
  float: left;
  margin-right: 10px;
  color: #a3a3a3;
}

.nav-tabs>li {
    float: left;
    margin-bottom: -1px;
    width: 150px;
}

.nav-tabs>li>a{
      border-radius: 0px;
      background-color: #f1f1f1;
      margin-right: 0px;
      border-right: 2px solid #dbdbdb;
}

.nav-tabs.active{
  background-color: #fff;
  margin-top: 5px;
}

.entradaTab{
  border-top: 3px solid #045086;
}

.parcialesTab{
  border-top: 3px solid #fdbf18;
}

.tramitadosTab{
  border-top: 3px solid #8eba4f;
}

.archivadosTab{
  border-top: 3px solid #93d4cd;
}

.eliminadosTab{
  border-top: 3px solid #b4000d;
}


.infoBox{
  background-color: #fff;
}

.actionsIcons{
  margin-top: 20px;
}

.actionsIcons ul{
  margin-left: -30px;
}

.actionsIcons ul > li {
  display: inline-block;
  padding: 4px 6px;
  font-size: 1.2em;
  border-radius: 4px;
  color: #8c8c8c;
  cursor: pointer;
  margin: 0 5 0 0;
     position: relative;
}

.actionsIcons li.save{
  background-color: #39a349;
  color: #fff;
}

.actionsIcons li.pqr{
  background-color: #fcb501;
  color: #fff;
}


.actionsIcons li.forward{
  background-color: #00a1a4;
  color: #fff;
}


.actionsIcons li.down{
  background-color: #299ee3;
  color: #fff;
}


.actionsIcons li.delete{
  background-color: #eb3738;
  color: #fff;
}

.actionsIcons li:hover:after{
    background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 1px;
    bottom: 31px;
    color: #fff;
    content: attr(title);
    left: 0%;
    padding: 5px 10px;
    position: absolute;
    z-index: 98;
    font-family: 'leelawadeeregular', sans-serif;
    font-size: .7em;
}

.actionsIcons li:hover:before{
    border: solid;
    border-color: #333 transparent;
    border-width: 6px 6px 0 6px;
    bottom: 26px;
    content: "";
    position: absolute;
    z-index: 99;
}

.actionsIcons li.pqr:hover:after, .actionsIcons li.excel:hover:after{
  width: 110px;
  text-align: center;
}


/*TABLES*/

.headerTable{
  font-family: 'leelawadeeregular', sans-serif;
  background-color: #57b6d5;
  font-size: .8em;
  text-transform: uppercase;
  font-weight: normal;
  color: #fff;

}

.headerTable tr>th{
    padding: 14px 8px !important;
    text-align: center;
}

.bodyTable{
  font-family: 'leelawadeeregular', sans-serif;
  font-size: .8em;
}

.bodyTable tr>td{
  padding: 14px 8px !important;
  text-align: center;
}

.bodyTable tr>th{
  padding: 14px 8px !important;
}

.bodyTable .activeTable{
  background-color: #ededed;
}

.tablebottom{
  margin-bottom: 50px;
}




/* ==========================================================================*/

 /* ==========================================================================
FOOTER
   ========================================================================== */


.logoFoot{
  text-align: right;
  font-size: .8em;
}

.logoFoot img{
  margin-top: -10px;
}

.textFoot{
  font-size: .8em;
}


.textFoot a{
  color: #aa0000;
  text-decoration: none;
  font-size: .9em;
}


/* ==========================================================================*/

.titleForm_votacion{
  border-left: 6px solid #1c8dcd; /* #76BD1D; */
  padding: 0 15px;
  margin-top: 15px;
  margin-bottom: 15px;
}

.titleForm_votacion h1{
  /* margin-top: 10px; */
  color: #1c8dcd;
  font-family: 'leelawadeeregular', sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 2em;
}

.textForm_votacion{
  text-transform: uppercase;
  margin-bottom: 20px;
  font-size: 1.1em;
  color: #242424;
}

.picForm_votacion img{
  right: 0;
  bottom: 0;
  float: left;
}


.leftForm_votacion {
  padding-left: 24px;
  padding-right: 0px;
  text-transform: uppercase;
  font-size: 1em;
}

.rightForm_votacion {
  padding-left: 24px;
  padding-right: 0px;
  text-transform: uppercase;
  font-size: 1em;
}

.timerForm_votacion{
  margin-top: 53px;
  text-align: center;
}

.picForm_votacion{
  margin-top: 45px;
}

a.hiddenanchor{
  display: none;
}
/** The wrapper that will contain our two forms **/
#wrapper{
  min-height: 560px;
  margin: 0px auto;
  width: 900px;
  position: relative;
}

#wrapper p label{
  color:#5b5b5b;
  margin-bottom: 10px;
}

#wrapper .form-control{
  height: 43px;
  font-family: 'leelawadeeregular', sans-serif;

}
/**** Styling the form elements **/

/*styling both submit buttons */
#wrapper p.button input{
  width: 50%;
  cursor: pointer;
  background: #fff;
  padding: 14px 5px;
  color: #9c9c9c;
  text-transform: uppercase;
  font-size: 1.1em;
  border: 1px solid #c3c3c3;
  margin: 10px auto 10px;
  font-family: 'leelawadeebold', sans-serif;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
       -o-transition: all 0.2s linear;
          transition: all 0.2s linear;
}
#wrapper p.button input:hover{
  background: #00A1DF;
  color: #fff;
}
#wrapper p.button input:active,
#wrapper p.button input:focus{
  background: rgb(40, 137, 154);
  top: 1px;
  border: 1px solid rgb(12, 76, 87);
  -webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
     -moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
          box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
}
p.login.button, p.signin.button{
  float: left;
  text-align: center;
  width: 100%;
  margin-bottom: 0px;
}

p.login_forgotPass{
  text-align: center;
  margin-bottom: 25px;
  text-decoration:underline;
}

.change_link{
  background: #012a36;
  float: left;
  width: 100%;
  /* height: 110px; */
  color: #fff;
  padding: 10px 30px;
  /* margin-bottom: 10px; */
  background: -moz-repeating-linear-gradient(-45deg,
  rgb(7, 57, 71) ,
  rgb(7, 57, 71) 15px,
  rgb(1, 42, 54) 15px,
  rgb(1, 42, 54) 30px,
  rgb(7, 57, 71) 30px
  );
  background: -webkit-repeating-linear-gradient(-45deg,
  rgb(7, 57, 71) ,
  rgb(7, 57, 71) 15px,
  rgb(1, 42, 54) 15px,
  rgb(1, 42, 54) 30px,
  rgb(7, 57, 71) 30px
  );
  background: -o-repeating-linear-gradient(-45deg,
  rgb(7, 57, 71) ,
  rgb(7, 57, 71) 15px,
  rgb(1, 42, 54) 15px,
  rgb(1, 42, 54) 30px,
  rgb(7, 57, 71) 30px
  );
  background: repeating-linear-gradient(-45deg,
  rgb(7, 57, 71) ,
  rgb(7, 57, 71) 15px,
  rgb(1, 42, 54) 15px,
  rgb(1, 42, 54) 30px,
  rgb(7, 57, 71) 30px
  );
}

.change_link a{
  color: #8df3ed;
}

.iconPostular_votacion{
  color: #fff;
  float: left;
  font-size: 35px;
  margin-right: 5px;
  }

.textPostular_votacion{
  float: left;
}


.titleTimer{
  font-size: 1.4em;
  text-align: center;
  font-weight: bold;
  margin-bottom: 10px;
}

.timerContainer{
  background: #030303;
  width: 170px;
  color: #fff;
  padding: 15px 0px;
  margin: auto;
  font-size: 1.3em;
}



/** Styling both forms **/
#register, #plogin{
  position: absolute;
  top: 0px;
  width: 100%;
  margin: 20 0 35px 0;
  background: none;
  -moz-border-radius: 5px;
     border-radius: 5px;

}
#register{
  z-index: 21;
  opacity: 0;
}
#plogin{
  z-index: 22;
}
#toregister:target ~ #wrapper #register,
#tologin:target ~ #wrapper #plogin{
  z-index: 22;
  -webkit-animation-name: fadeInLeft;
  -moz-animation-name: fadeInLeft;
  -ms-animation-name: fadeInLeft;
  -o-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
  -webkit-animation-delay: .1s;
  -moz-animation-delay: .1s;
  -o-animation-delay: .1s;
  -ms-animation-delay: .1s;
  animation-delay: .1s;
}
#toregister:target ~ #wrapper #plogin,
#tologin:target ~ #wrapper #register{
  -webkit-animation-name: fadeOutLeftBig;
  -moz-animation-name: fadeOutLeftBig;
  -ms-animation-name: fadeOutLeftBig;
  -o-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

/** the actual animation, credit where due : http://daneden.me/animate/ ***/
.animate{
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: both;

  -moz-animation-duration: 1s;
  -moz-animation-timing-function: ease;
  -moz-animation-fill-mode: both;

  -o-animation-duration: 1s;
  -o-animation-timing-function: ease;
  -o-animation-fill-mode: both;

  -ms-animation-duration: 1s;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: both;

  animation-duration: 1s;
  animation-timing-function: ease;
  animation-fill-mode: both;
}

/** yerk some ugly IE fixes 'cause I know someone will ask "why does it look ugly in IE?", no matter how many warnings I will put in the article */

.lt8 #wrapper input{
  padding: 10px 5px 10px 32px;
    width: 92%;
}
.lt8 #wrapper input[type=checkbox]{
  width: 10px;
  padding: 0;
}
.lt8 #wrapper h1{
  color: #066A75;
}
.lt8 #register{
  display: none;
}
.lt8 p.change_link,
.ie9 p.change_link{
  position: absolute;
  /* height: 90px; */
  background: transparent;
}


.error_Title {
    font-size: 1.2em;
    text-align: center;
    color: #af1337;
    margin: 15px 0 5px;
}
.error_Text {
    text-align: center;
    color: #af1337;
}
.success_Title {
    font-size: 1.2em;
    text-align: center;
    color: #13af30;
    margin: 15px 0 5px;
}
.success_Text {
    text-align: center;
    color: #13af30;
}

img {
    max-height: 100%;
    max-width: 100%;
}