.header-course
{
    background-image: url('../images/header-course.jpg');
    background-size: cover;    
    background-position: 80% 30%;
    margin-bottom: 40px;
}

.wp-user-avatar{width: 200px; height: 200px;}

.services-macros a{color:#8c5426 !important;}

#primary { padding: 0; }

.row-flex {
    display: flex;
    flex-flow: row wrap;
}

.vtac
{
    top: 50%; 
    transform: translateY(90%);
}

.leaking:before 
{
    margin-left: 60px;
    content: " ";width: 30px;
    height: 400px;
    background: #fff;
    animation-delay: 0.05s;
    position: absolute;
    left: -40px;top: -150px;
    animation-timing-function: ease-in-out;
    transition: all 0.1s;
    -moz-transition: all 0.1s;
    -webkit-transition: all 0.1s;
    -o-transition: all 0.1s;
    -khtml-transition: all 0.1s;
    -ms-transition: all 0.1s;
    animation-name: slideme;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -khtml-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
} 

/* нужно для  .leaking */
@keyframes shakeme {0%   {transform: rotate(-7deg);}50%   {transform: rotate(7deg);}100% {transform: rotate(-7deg);}}
@keyframes slideme {0%   {left:-30px;margin-left: 0px;}30%   {left:110%;margin-left: 80px;}100% {left:110%;margin-left: 80px;}}
/* //////////// */

.animate {
    -webkit-animation:ripple 0.65s linear;
   -moz-animation:ripple 0.65s linear;
    -ms-animation:ripple 0.65s linear;
     -o-animation:ripple 0.65s linear;
        animation:ripple 0.65s linear;
}
 
.this-veil {
  position: relative;
  z-index: 0;
}

.this-veil::before {
  content: "";
  position: absolute;
  top: 0; 
  left: 0;
  width: 100%; 
  height: 100%;  
  opacity: .2; 
  z-index: -1;
 /* background: url(path/to/your/image);*/
}

@-webkit-keyframes ripple {
    100% {opacity: 0; -webkit-transform: scale(2.5);}
}
@-moz-keyframes ripple {
    100% {opacity: 0; -moz-transform: scale(2.5);}
}
@-o-keyframes ripple {
    100% {opacity: 0; -o-transform: scale(2.5);}
}
@keyframes ripple {
    100% {opacity: 0; transform: scale(2.5);}
}

.mySector { padding-top: 40px !important; padding-bottom: 50px !important; }

.row {  margin: 0 !important; }
.mrgn0 { margin: 0 !important;}


@media screen and (max-width: 1660px)/*, screen and (max-width: 1330px)*/{
    .fz450prc { font-size: 350%; }
    
}
@media screen and (max-width: 1366px){

}
@media screen and (max-width: 1430px){

}
@media screen and (max-width: 1330px){

}
@media screen and (max-width: 1200px) {
    .fz110prc { font-size: 90% !important; }
    .fz120prc { font-size: 100%; }
    .fz450prc { font-size: 280%; }       
}
@media screen and (max-width: 1015px), screen and (max-width: 1025px){
    .fz300prc { font-size: 250%; }
    .fz250prc { font-size: 200%; }
    .fz200prc { font-size: 150% !important; }
    .fz120prc { font-size: 100%; }
    .fz450prc { font-size: 200%; }
    .text-md-center { text-align: center !important; }  
    .text-md-right{ text-align: right !important; }  

}
@media screen and (max-width: 840px){
    
}

@media screen and (min-width: 1430px) {
    
}

@media screen and (min-width: 1660px) {
    
}

@media screen and (min-width: 1200px) {
    .text-lg-left{ text-align: left !important; }
      

}
@media screen and (min-width: 992px) {
    .text-md-left{ text-align: left !important; }    

}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .text-sm-left{ text-align: left !important; }  
    .text-sm-center { text-align: center !important; }
    .text-sm-right{ text-align: right !important; }
    .fz110prc { font-size: 90% !important; }

}

@media screen and (max-width: 240px), screen and (max-width: 480px), screen and (max-width: 540px), screen and (max-width: 768px)  {
    .fz300prc { font-size: 150% !important; }
    .fz250prc { font-size: 150% !important; }
    .fz200prc { font-size: 110% !important; }
    .fz150prc { font-size: 100% !important; }
    .fz110prc { font-size: 90% !important; }
    .fz350prc { font-size: 200% !important; }
    .fz400prc { font-size: 250% !important; }
    .fz500prc { font-size: 250% !important; }
    .text-xs-center { text-align: center !important; }
    .text-xs-right{ text-align: right !important; }
    .mrgn-xs-auto { margin: auto !important; }
     	
}

@media screen and (max-width: 200px), screen and (max-width: 240px), screen  and (max-width: 480px), screen and (max-width: 540px)
{
    .text-xs-center { text-align: center !important; }    
    .mrgn-xs-auto { margin: auto !important; }
    .nw-xs { white-space: normal; }
    
}

