﻿@charset "iso-8859-1";

/* CSS Document */

/* 
PIT Assets

Colors 
blue: #04c2f2; | rgba(4,194,242,1)
Grey: #231f20 | rgba(35,31,32,1)
Gradient:  47.3° | rgba(71,191,209,1) > rgba(40,110,209,.5);


Font
font-family: 'Maven Pro', sans-serif; 

*/


body{
	min-height: 100vh;
}

hr{
  border:  1px dotted rgba(255, 255, 255, .2);
}

article{
  margin: 7px 0;
}

#logo{
  position: fixed;
  top: 2px;
  left: 5px;

  width: 80px;
  height: 80px;
  
  border-radius:100%;

  background-color: #fff;
  background-image: url("../img/logo_PIT_R.svg");
  background-repeat: no-repeat;
  background-position: center -2px;
  background-size: 95%;
  
  border: solid 4px rgba(35,31,32,1);
  
  z-index: 100;
}

#menu{
  background-color: #231f20;
  background-image: radial-gradient(circle at 70% 35%, rgba(80,75,74,1) 15%,  rgba(35,31,32,1) 60%);
  
  position:  fixed;
  top: 0;

  width: 100vw;
  height: 56px;

  z-index: 90;
}

#header{
  min-height: 30vh;

  padding-top: 56px;
  
  background-image:url("../img/bck.head.svg");
  background-size:  30vw;
  background-position: left;
  background-repeat: no-repeat;
  
  border-bottom: rgba(35,31,32,.8) 2px solid;
}

#headerRow{
  min-height: 30vh;
  background-image:url("../img/logo_PIT.svg");
  background-size: 45%;
  background-position: 90% 60%;
  background-repeat: no-repeat;
}

#sections>.row{
  min-height: 30vh;
}

#contact{
  min-height: 20vh;

  color: #fff;
  background-color: #231f20;
  background-image: radial-gradient(circle at 70% 30%, rgba(80,75,74,1) 15%,  rgba(35,31,32,1) 60%);

  border-top: 1px solid rgba(255,255,255,.4);

  /*padding: 4vh, 3vw;*/
}

#ubicacion{
  background-image: url("../img/icn-location.svg");
  background-size: 40%;
  background-repeat: no-repeat;
  background-position: bottom right;

  padding-left: 25px;
  margin-bottom: 15px;
}

#blog{
  background-image: url("../img/icn-wsap.svg");
  background-size: 40%;
  background-repeat: no-repeat;
  background-position: bottom right;

  padding-left: 25px;
  margin-bottom: 15px;
}

#social{
  background-image: url("../img/icn-social.svg");
  background-size: 40%;
  background-repeat: no-repeat;
  background-position: bottom right;

  padding-left: 25px;
  margin-bottom: 15px;
}


.rowBorder{
  border-bottom: rgba(35,31,32,.8) 2px solid;
}

.gradPill{
  background-image: linear-gradient(47.3deg, rgba(4,194,242,1), rgba(40,110,209,.8));
}




.padV7{
  padding-top: 7px;
  padding-bottom: 7px;
}

.padV10{
  padding-top: 10px;
  padding-bottom: 10px;
}




.tabCol{
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin-bottom: 15px;
}


.tab{
  background-color: #231f20;
  background-image: radial-gradient(circle at 80% 30%, rgba(80,75,74,1) 15%,  rgba(35,31,32,1) 60%);
  
  color: rgba(255, 255, 255, .9);
  text-shadow: 2px 2px 3px rgba(0,0,0,.8);
  
  display: inline-block ;

  padding:  0px 60px 15px 60px;

  clip-path: polygon(0% 0%,100% 0%,85% 100%,15% 100%);

  font-size: 2.5rem;
}

.tabWrap {
  filter: drop-shadow(-1px 1px 5px rgba(0, 0, 0, .7));
}


.cntItem{
  color: #231f20;
  background-color: #fff;
  border-radius: 5px;
  text-align: center;
  padding: 20px;
  margin-top: 15px;
  margin-bottom: 15px;
}

  
  .img80{
    width: 80%;
  }

  .img65{
    width: 65%;
  }

  .img30{
    width: 30%;
  }

  .img16{
    width: 16%;
  }

.bckVU{
  background-image:url("../img/bck-vu.jpg");
  background-position: left top;
}

.bckVG{
  background-image:url("../img/bck-vg.jpg");
  background-size: cover;
  color: #fff;
  text-shadow:0px 0px 3px rgba(3, 145, 255, 1);
  background-position: right bottom;
}

.bckVC{
  background-image:url("../img/bck-vc.jpg");
  background-size: cover;
  background-position: right center;
}

.cirImg{
  border-radius: 50%;
  border: 10px rgba(4,194,242,.8) solid;
  margin-bottom: 5px;
}


.warnTX{
  font-size: xx-large;
  color: #04c2f2;
  margin-top: 12px;
  margin-bottom: 15px;
  padding: 7px 20px;
  border-radius: 5px;
  background-color: rgba(255,255,255,.2);

}

a.btnPIT:link, a.btnPIT:visited{
  color: #04c2f2;
  text-decoration: none;
  padding: 7px;
  border-radius: 3px;
  background-color: rgba(255, 255, 255, .1);
  transition: all;
  transition-duration: .5s;
}
a.btnPIT:hover {
  color: #fff;
  background-color: rgba(4,194,242,.4);
}

a.btnBLG:link, a.btnBLG:visited{
  color: #04c2f2;
  text-decoration: none; 
  transition: all;
  transition-duration: .5s;
}
a.btnBLG:hover {
  color: #fff;
  padding-left: 7px;
}


.mov{
  cursor: pointer;
}

.cntItem:hover .overlay {
  bottom: 0;
  height: 100%;
}

.overlay {
  position: absolute;
  bottom: 100%;
  left: 15px;
  right: 0;
  border-radius: 5px;
  background-color: rgba(32,82,153,.9);
  overflow: hidden;
  width: 96%;
  height:0;
  transition: .5s ease;
}

.hovText {
  color: white;
  font-size: 1rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}


/* SM */
@media (min-width: 576px) {
  #header{
    /*background-image:url("../img/bck-l-s.jpg");*/
    background-size: cover;
  }

  #headerRow{
    background-size: 40%;
    background-position: 90% 60%;
  }
}


/* MD */
@media (min-width: 768px) {
  #header{
    /*background-image:url("../img/bck-l-m.jpg");*/
    background-size: cover;
  }

  #headerRow{
    background-size: 35%;
    background-position: 90% 65%;
  }
}

/* L */
@media (min-width: 992px) {
  #header{
    /*background-image:url("../img/bck-head.jpg");*/
  }

  #headerRow{
    background-size: 30%;
    background-position: 90% 75%;
  }
}

/* XL  */
@media (min-width: 1200px) {
  #header{
    /*background-image:url("../img/bck-head.jpg");*/

  }

  #headerRow{
    background-size: 25%;
    background-position: 95% 75%;
  }
}

/* XXL  */
@media (min-width: 1500px) {
  #headerRow{
    background-size: 30%;
    background-position: 95% 70%;
  }
}