@charset "UTF-8";

@import url('https://fonts.googleapis.com/css?family=Lobster|Source+Sans+Pro:400,600,600i,700&subset=latin-ext');


#myVideo {
   
    right: 0;
    bottom: 0;
    min-width: 100%; 
    min-height: 100%;
}

.hr-theme-slash-2 {
  display: flex;

}
  .hr-line {
    width: 100%;
    position: relative;
    margin: 15px;
    border-bottom: 1px solid #000;
  }
  .hr-icon {
    position: relative;
    top: 3px;
    color: #ff0000;
  }

#btn {
   display: inline-block;
  vertical-align: top;
  position: relative;
  overflow: hidden;
text-align: center;

  font-size: 18px;
 font-family: 'Source Sans Pro', sans-serif;
   font-weight: 600;
  width: 180px;
  line-height: 46px;
  padding: 0 24px;

  color: white;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px #154c86;
  background-color: #247edd;
  background-clip: padding-box;
  border: 1px solid;
  border-color: #1c65b2 #18589c #18589c;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
}

div {
    font-family:"Courier New";
}


.italic {
    font-style: italic;
}


#preot {
    /*position: fixed;*/
   
    margin:auto;
    width: 70%;
    
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700;
    /*display: inline-block;*/
}
.preot {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700;
      font-size: 20px;
}  
.preot span{
    font-family: 'Lobster', cursive;
    color:#000033;
     font-size: 25px;
}

.descriere {
   font-size: 20px;
   font-family: 'Source Sans Pro', sans-serif;
    position: fixed;
      position: absolute;
     font-weight: 400;
    margin-left:5%;
    width: 90%;

}

.rugaciune {
     font-style:italic; 
     font-family: initial; 
     font-size: 17px;
}

ul.a {
    list-style-type: circle;
    
}

.wrapper {
  width:80%;
  max-width:600px;
  height:100%;
  margin:0 auto;
  background-color:#cfcfcf;
  border:1px solid red;
}

.h_iframe {
  position:relative;
  padding-top: 56%;
}

.h_iframe iframe {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
 


.button { display: inline-block;
  vertical-align: top;
  position: relative;
  overflow: hidden;
text-align: center;
  font-size: 20px;
 
  width: 180px;
  line-height: 46px;
  padding: 0 24px;
  
  color: white;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px #154c86;
  background-color: #247edd;
  background-clip: padding-box;
  border: 1px solid;
  border-color: #1c65b2 #18589c #18589c;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
}



.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\2020';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -15px;
  transition: 0.5s;
}

.button:hover span {
 
  padding-right: 20px;
}

.button:hover span:after {
  opacity: 1;
  right: 1px;
}


i {
/*   positioning */
		position: absolute;
		opacity: 0;
		top: 0;
		left: 0;
  
/*   gradient   */
		background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.03) 1%, rgba(255,255,255,0.6) 30%, rgba(255,255,255,0.85) 50%, rgba(255,255,255,0.85) 70%, rgba(255,255,255,0.85) 71%, rgba(255,255,255,0) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(1%,rgba(255,255,255,0.03)), color-stop(30%,rgba(255,255,255,0.85)), color-stop(50%,rgba(255,255,255,0.85)), color-stop(70%,rgba(255,255,255,0.85)), color-stop(71%,rgba(255,255,255,0.85)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.03) 1%,rgba(255,255,255,0.6) 30%,rgba(255,255,255,0.85) 50%,rgba(255,255,255,0.85) 70%,rgba(255,255,255,0.85) 71%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.03) 1%,rgba(255,255,255,0.6) 30%,rgba(255,255,255,0.85) 50%,rgba(255,255,255,0.85) 70%,rgba(255,255,255,0.85) 71%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.03) 1%,rgba(255,255,255,0.6) 30%,rgba(255,255,255,0.85) 50%,rgba(255,255,255,0.85) 70%,rgba(255,255,255,0.85) 71%,rgba(255,255,255,0) 100%); /* IE10+ */
		background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.03) 1%,rgba(255,255,255,0.6) 30%,rgba(255,255,255,0.85) 50%,rgba(255,255,255,0.85) 70%,rgba(255,255,255,0.85) 71%,rgba(255,255,255,0) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
    
/*  forming the shine element
    play around with the width, skew and gradient to get different effects
  */
		width: 15%;
		height: 100%;
     transform: skew(-10deg,0deg);
		-webkit-transform: skew(-10deg,0deg);
     -moz-transform: skew(-10deg,0deg);
     -ms-transform: skew(-10deg,0deg);
     -o-transform: skew(-10deg,0deg);
  
/*  animating it  */
     animation: move 2s;
		animation-iteration-count: infinite;
		animation-delay: 1s;
		-webkit-animation: move 2s;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-delay: 1s;
		-moz-transform: skew(-10deg,0deg);
		-moz-animation: move 2s;
		-moz-animation-iteration-count: infinite;
		-moz-animation-delay: 1s;
		-ms-transform: skew(-10deg,0deg);
		-ms-animation: move 2s;
		-ms-animation-iteration-count: infinite;
		-ms-animation-delay: 1s;
		-o-transform: skew(-10deg,0deg);
		-o-animation: move 2s;
		-o-animation-iteration-count: infinite;
		-o-animation-delay: 1s;
	}

/*  */
@keyframes move {
	0%  { left: 0; opacity: 0; }
	5% {opacity: 0.0}
	48% {opacity: 0.2}
	80% {opacity: 0.0}
	100% { left: 82%}
}

@-webkit-keyframes move {
	0%  { left: 0; opacity: 0; }
	5% {opacity: 0.0}
	48% {opacity: 0.2}
	80% {opacity: 0.0}
	100% { left: 82%}
}

@-moz-keyframes move {
	0%  { left: 0; opacity: 0; }
	5% {opacity: 0.0}
	48% {opacity: 0.2}
	80% {opacity: 0.0}
	100% { left: 88%}
}

@-ms-keyframes move {
	0%  { left: 0; opacity: 0; }
	5% {opacity: 0.0}
	48% {opacity: 0.2}
	80% {opacity: 0.0}
	100% { left: 82%}
}

@-o-keyframes move {
	0%  { left: 0; opacity: 0; }
	5% {opacity: 0.0}
	48% {opacity: 0.2}
	80% {opacity: 0.0}
	100% { left: 82%}
}