/* RESET*/
/* html5doctor.com Reset v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
/*END OF RESET*/

.outerwrapper {
    /*background: -webkit-linear-gradient(#34341e, #888e78); 
    background: -o-linear-gradient(#34341e, #888e78);
    background: -moz-linear-gradient(#34341e, #888e78); 
    background: linear-gradient(#34341e, #888e78); 
    background: url(5-Seamless-Fabric-Patterns01.png);*/
    background: #434C58;
    background-image:url("vitoshaNight.png");
    background-repeat:no-repeat;
    background-position:50% 95%; /* or 0% 100% */
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    font-family:Arial,Helvetica,sans-serif;
}

.wrapper {

    
    width: 1061px;
    margin-left: auto;
    margin-right: auto;
}
.roofWrapper {   
    position: relative;
    width: 1060px;
    margin-left: auto;
    margin-right: auto;
}
.formacia {
    position: absolute;
    width: 165px;
    height: 177px;
    top: 10px;
    left: 700px;
    background-image: url("kanban2.png");
}

.shkola {
    position: absolute;
    width: 165px;
    height: 165px;
    top: 10px;
    left: 450px;
    background-image: url("shopluka_shkola.png");
}

    
.butterfly {
    visibility: hidden;
    position: absolute;
        background-image: url("butterfly.png"); 
        height: 30px;
        width: 36px;
        left: 550px;
        top:-00px;
    -webkit-animation: playD .4s steps(4) infinite, fly 30s ease-in-out infinite ;
       -moz-animation: playD .4s steps(4) infinite, fly 30s ease-in-out infinite ; 
        -ms-animation: playD .4s steps(4) infinite, fly 30s ease-in-out infinite ; 
         -o-animation: playD .4s steps(4) infinite, fly 30s ease-in-out infinite ; 
            animation: playD .4s steps(4) infinite, fly 30s ease-in-out infinite ; 
}
@-webkit-keyframes playD {   
    0% { background-position:    0px; }
     100% { background-position: -148px; }
}
@-moz-keyframes playD {
    0% { background-position:    0px; }
     100% { background-position: -148px; }

}
@-ms-keyframes playD {
    0% { background-position:    0px; }
     100% { background-position: -148px; }

}
@-o-keyframes playD {
    0% { background-position:    0px; }
     100% { background-position: -148px; }
}
@keyframes playD {
    0% { background-position:    0px; }
     100% { background-position: -148px; }
}
@-webkit-keyframes fly {
    0% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }
    
    11%{
        -webkit-transform:rotate(90deg);  
        -moz-transform:rotate(90deg);  
        -o-transform:rotate(90deg);  
        -ms-transform:rotate(90deg);  
        transform:rotate(90deg);  
    
    }
      25% {
        -webkit-transform: translate(360px, 10px);
        -moz-transform: translate(360px, 10px);
        -o-transform: translate(360px, 10px);
        -ms-transform: translate(360px,10px);
        transform: translate(360px, 10px);
      }

              45% {
         -webkit-transform:rotate(-90deg);  
        -moz-transform:rotate(-90deg);  
        -o-transform:rotate(-90deg);  
        -ms-transform:rotate(-90deg);  
        transform:rotate(-90deg);  
      }


      95% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }            
    
    
    }

@-moz-keyframes fly {
        0% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }
    
    11%{
        -webkit-transform:rotate(90deg);  
        -moz-transform:rotate(90deg);  
        -o-transform:rotate(90deg);  
        -ms-transform:rotate(90deg);  
        transform:rotate(90deg);  
    
    }
      25% {
        -webkit-transform: translate(360px, 10px);
        -moz-transform: translate(360px, 10px);
        -o-transform: translate(360px, 10px);
        -ms-transform: translate(360px,10px);
        transform: translate(360px, 10px);
      }

              45% {
         -webkit-transform:rotate(-90deg);  
        -moz-transform:rotate(-90deg);  
        -o-transform:rotate(-90deg);  
        -ms-transform:rotate(-90deg);  
        transform:rotate(-90deg);  
      }


      95% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }            
    
    
    }
   @-o-keyframes fly {
        0% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }
    
    11%{
        -webkit-transform:rotate(90deg);  
        -moz-transform:rotate(90deg);  
        -o-transform:rotate(90deg);  
        -ms-transform:rotate(90deg);  
        transform:rotate(90deg);  
    
    }
      25% {
        -webkit-transform: translate(360px, 10px);
        -moz-transform: translate(360px, 10px);
        -o-transform: translate(360px, 10px);
        -ms-transform: translate(360px,10px);
        transform: translate(360px, 10px);
      }

              45% {
         -webkit-transform:rotate(-90deg);  
        -moz-transform:rotate(-90deg);  
        -o-transform:rotate(-90deg);  
        -ms-transform:rotate(-90deg);  
        transform:rotate(-90deg);  
      }


      95% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }            
    
    
    }
    @keyframes fly {
             0% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }
    
    11%{
        -webkit-transform:rotate(90deg);  
        -moz-transform:rotate(90deg);  
        -o-transform:rotate(90deg);  
        -ms-transform:rotate(90deg);  
        transform:rotate(90deg);  
    
    }
      25% {
        -webkit-transform: translate(360px, 10px);
        -moz-transform: translate(360px, 10px);
        -o-transform: translate(360px, 10px);
        -ms-transform: translate(360px,10px);
        transform: translate(360px, 10px);
      }

              45% {
         -webkit-transform:rotate(-90deg);  
        -moz-transform:rotate(-90deg);  
        -o-transform:rotate(-90deg);  
        -ms-transform:rotate(-90deg);  
        transform:rotate(-90deg);  
      }


      95% { 
        -webkit-transform: translate(0px, 0px);
        -moz-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
      }            
    
    
    }
.chan {
    height: 45px;
    width: 24px;
    position: absolute;
    top: 193px;
    left: 60px;
    background-image: url(chan2.png);
    -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
     /* Chrome, Safari, Opera */
    -webkit-animation-name: ChanMovement;
    -webkit-animation-duration: 2s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    -webkit-animation-direction: alternate;
    /* Standard syntax */
    animation-name: ChanMovement;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
    animation-direction: alternate;
    z-index: 1;
}
/* Chrome, Safari, Opera*/ 
@-webkit-keyframes ChanMovement {
    0%{ 
        -webkit-transform:rotate(-10deg);   
    }
    100%{ 
        -webkit-transform:rotate(10deg);  
}
}

 /*Standard syntax */
@keyframes ChanMovement {
 
    0%{ 
        transform:rotate(-10deg);   
    }
    50%{ 
        transform:rotate(10deg);  
}
    100%{ 
        transform:rotate(-10deg);  
}
}

.chan2 {
    height: 89px;width: 48px;position: absolute;top: 193px;background-image: url(chan.png);
    -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
         /* Chrome, Safari, Opera */
    -webkit-animation-name: ChanMovement;
    -webkit-animation-duration: 4s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    -webkit-animation-direction: alternate;
    /* Standard syntax */
    animation-name: ChanMovement;
    animation-duration: 4s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
    animation-direction: alternate;
      z-index: 1;
}
.chan3 {
    height: 45px;
    width: 24px;
    position: absolute;
    top: 193px;
    left: 960px;
    background-image: url(chan2.png);
        -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
     /* Chrome, Safari, Opera */
    -webkit-animation-name: ChanMovement;
    -webkit-animation-duration: 2s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    -webkit-animation-direction: alternate;
    /* Standard syntax */
    animation-name: ChanMovement;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
    animation-direction: alternate;
      z-index: 1;
}
.chan4 {
    height: 67px;
    width: 36px;
    position: absolute;
    top: 193px;
    left: 1000px;
    background-image: url(chan3.png);
        -webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
-o-transform-origin: 50% 0;
transform-origin: 50% 0;
         /* Chrome, Safari, Opera */
    -webkit-animation-name: ChanMovement;
    -webkit-animation-duration: 4s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    -webkit-animation-direction: alternate;
    /* Standard syntax */
    animation-name: ChanMovement;
    animation-duration: 4s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
    animation-direction: alternate;
      z-index: 1;
}
/*.Cat {*/
    height: 64px;
    width: 88px;
    float: right;
    position: absolute;
    top: 10px;
    left: 30px;
    background-image: url("catFrames.png");  
     /*visibility: hidden; */
}
.Cat:hover {
    height: 64px;
    width: 88px;
    float: right;
    position: absolute;
    top: 10px;
    left: 30px;
    background-image: url("catFrames.png");
     /*visibility: hidden; */
    -webkit-animation: playC 0.5s steps(3) 2;
       -moz-animation: playC 0.5s steps(3) 2;
        -ms-animation: playC 0.5s steps(3) 2;
         -o-animation: playC 0.5s steps(3) 2;
            animation: playC 0.5s steps(3) 2;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;       
}
@-webkit-keyframes playC {
   from { background-position:    0px; }
     to { background-position: -263px; }
}

@-moz-keyframes playC {
   0% { background-position:    0px; }
     50% { background-position: -263px; }
}

@-ms-keyframes playC {
   from { background-position:    0px; }
     to { background-position: -263px; }
}

@-o-keyframes playC {
   from { background-position:    0px; }
     to { background-position: -263px; }
}

@keyframes playC {
   from { background-position:    0px; }
     to { background-position: -263px; }
}

.Pokriv {
    background: url("actives/spring:summer/roofNight.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    height: 195px;
    width: 1061px;
    margin-left: auto;
    margin-right: auto;
    /*position: relative;*/
    }
.Bottom { 
    background: url(base.png);
      background-size: 100% 100%;
     height: 161px;
    width: 1050px;
         margin-left: auto;
    margin-right:auto;
    position: relative;
    top: 30px;
}
#navWrap {
    position: relative;
    background-color: #313131;
    width: 860px;
    height: 103px;
    box-shadow: 0px 5px 5px #888888;
    padding-left: 50px;
}
.navContainer {
    width: 850px;
    margin: 0 auto;
}
.navContainer2 {
    width: 520px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 25px;
    padding: 5px;
    
    text-align: center;
}
.nav {
    /*border:1px solid #ccc;
    border-width:1px 0;*/
    list-style:none;
    margin:0 auto;
    padding:0;
    text-align:center;
}
.nav li{
    display:inline;
    float:left;
}
.nav a{
    display:inline-block;
    padding:10px;
}
.nav  a:link,a:visited
{
display:block;
width:150px;
font-weight:bold;
color:#FFFFFF;
background-color:#313131;
text-align:center;
padding:10px;
text-decoration:none;
text-transform:uppercase;    
}
.nav2 {
    /*border:1px solid #ccc;
    border-width:1px 0;*/
    margin-left: auto;
    margin-right: auto;
    text-align:center;
}
.nav2 li{
    display:inline;
    float:left;
}
.nav2 a{
    display:inline-block;
    padding:10px;
}
.nav2  a:link,a:visited
{
display:block;
width:500px;
font-weight:bold;
color:#FFFFFF;
background-color:#313131;
text-align:center;
padding:10px;
text-decoration:none;
text-transform:uppercase;

    
}
.nav a:hover,a:active
{
background-color:#212121;
}
.nav2 a:hover,a:active
{
background-color:#212121;
}

.Main {
    max-width: 930px;
    background-color: #f2e6da;
    padding-left: 20px;
    padding-right: 20px;
    margin-left: auto;
    margin-right: auto;
    
}
.shevica {
    margin-left: auto;
    margin-right: auto;
    width: 47px;
}

.example {
        color: black;
 padding-top: 30px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 20px;
        border-radius: 5px;
    box-shadow:2px 2px 3px #454545;
    background-image: url(paperBG.jpg);
    line-height: 140%;
    position: relative;
}



.Wheel {
    background:  url(wheel.png);
    background-size: 100% 100%;
    height: 280px;
    width: 280px;
    float: right;
    position: relative;
    top: -390px;
    left: -860px;
    

      /* Chrome, Safari, Opera */
    -webkit-animation-name: rotation;
    -webkit-animation-duration: 10s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: rotation;
    animation-duration: 10s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state: running;   
}
/* Chrome, Safari, Opera*/ 
@-webkit-keyframes rotation {
    from{ 
        -webkit-transform:rotate(0deg);  
    }
    to{ 
        -webkit-transform:rotate(360deg);
    }
}
 /*Standard syntax */
@keyframes rotation {
 
       from{ 
        transform:rotate(0deg);  
        }
    to{ 
        transform:rotate(360deg);
        }
}
/*.duck {*/
    /*visibility: hidden; */
    background:  url(duck.png);
    background-size: 100% 100%;
    position: absolute;
    height: 47px;
    width: 79px;
    top: 204px;
    left: 570px;
              /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovement;
    -webkit-animation-duration: 8s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovement;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
}

/*.duckling {*/
    /*visibility: hidden; */
        background:  url(duckling.png);
    background-size: 100% 100%;
    position: absolute;
    width: 28px;
    height: 26px;
    top:221px;
    left: 710px;
              /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovement;
    -webkit-animation-duration: 8s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovement;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;

}
/*.duckling1 {*/
     /*visibility: hidden; */
        background:  url(duckling.png);
    background-size: 100% 100%;
    position: absolute;
    width: 28px;
    height: 26px;
    top:223px;
    left: 740px;
              /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovement;
    -webkit-animation-duration: 10s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovement;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;

}
/*.duckling2 {*/
     /*visibility: hidden; */
        background:  url(duckling.png);
    background-size: 100% 100%;
    position: absolute;
    width: 28px;
    height: 26px;
    top:225px;
    left: 770px;
              /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovementC;
    -webkit-animation-duration: 8s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovementC;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;

}
.Water {
    background:  url(waves.png);
    background-repeat: repeat-x;
    height: 88px;
    width: 100%;
     opacity: 0.7;
    position: absolute;
    top: 230px;
              /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovementB;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovementB;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
}
.WaterB {
    background:  url(wavesB.png);
    background-repeat: repeat-x;
    height: 88px;
    width: 100%;
    opacity: 1;
    position: absolute;
    top: 232px;
    
          /* Chrome, Safari, Opera */
    -webkit-animation-name: wavesMovement;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-play-state: running;
    /* Standard syntax */
    animation-name: wavesMovement;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
}
/* Chrome, Safari, Opera*/ 
@-webkit-keyframes wavesMovement {
    0%{ 
        -webkit-transform:translateY(0px);

    }
    50%{ 
        -webkit-transform:translateY(5px);

}
    100%{ 
        -webkit-transform:translateY(0px);

}
}

 /*Standard syntax */
@keyframes wavesMovement {
 
    0%{ 
       transform:translateY(0px);  

    }
    50%{ 
        transform:translateY(5px);

}
    100%{ 
        transform:translateY(0px);

}
}

/* Chrome, Safari, Opera*/ 
@-webkit-keyframes wavesMovementB {
    0%{ 
        -webkit-transform:translateY(5px);  
    }
    50%{ 
        -webkit-transform:translateY(0px);
}
    100%{ 
        -webkit-transform:translateY(5px);
}
}

 /*Standard syntax */
@keyframes wavesMovementB {
 
    0%{ 
       transform:translateY(5px);  
    }
    50%{ 
        transform:translateY(0px);
}
    100%{ 
        transform:translateY(5px);
}
}


/*From here*/


/* Chrome, Safari, Opera*/ 
@-webkit-keyframes wavesMovementC {
    0%{ 
        -webkit-transform:translateY(0px);
        -webkit-transform:translateX(0px);
    }
    50%{ 
        -webkit-transform:translateY(3px);
        -webkit-transform:translateX(5px);
}
    100%{ 
        -webkit-transform:translateY(0px);
        -webkit-transform:translateX(0px);
}
}

 /*Standard syntax */
@keyframes wavesMovementC {
 
    0%{ 
       transform:translateY(0px);  
       transform:translateX(0px);
    }
    50%{ 
        transform:translateY(3px);
        transform:translateX(15px);
}
    100%{ 
        transform:translateY(0px);
        transform:translateX(0px);
}
}


.separator {
    height: 500px;

}

.BottomWrapper {
       width: 1050px;
    margin-left: auto;
    margin-right: auto; 
    position: relative;
    top: -30px;
}

.waterClipper {
    position: relative;
    width: 1061;
    height: 270px;
    margin-left: auto;
    margin-right: auto;
    overflow-y: hidden
}

.filler {
    height: 90px;
    width: 860px;
    margin-left: auto;
    margin-right: auto;
    background-color: grey;
    padding-left: 100px;
    position: relative;
}

.footer {
    background:  url(footeBG.png);
    height: 90px;
    text-align: center;
    font-size: 12px;
    color: #d0d0d0;
}

#bottomText {
    padding-top: 20px;
}

#separator {
    height: 20px;
}

.walls {
    position: relative;
    padding-left: 50px;
    padding-right: 50px;
    background: url("beam.png");
    /*   border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    -webkit-border-image: url('beam.png') 30 30 round; /* Safari */
   /* -o-border-image: url('beam.png') 30 30 round; /* Opera */
 /*   border-image: url('beam.png') 30 30 round;*/
}



.innerWrap {
    background-color: #f2e6da;
    margin-left: 50.5px;
    margin-right: 50.5px;
}

.innerClipper {
    width: 1061px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.foam {
    position: relative;
    top:-180px;
    left: 140px;
    width: 92px;
    height: 50px;
    background-image: url("foamSprite.png");
    
    -webkit-animation: play .5s steps(3) infinite;
       -moz-animation: play .5s steps(3) infinite;
        -ms-animation: play .5s steps(3) infinite;
         -o-animation: play .5s steps(3) infinite;
            animation: play .5s steps(3) infinite;
}
@-webkit-keyframes play {
   from { background-position:    0px; }
     to { background-position: -276px; }
}

@-moz-keyframes play {
   from { background-position:    0px; }
     to { background-position: -276px; }
}

@-ms-keyframes play {
   from { background-position:    0px; }
     to { background-position: -276px; }
}

@-o-keyframes play {
   from { background-position:    0px; }
     to { background-position: -276px; }
}

@keyframes play {
   from { background-position:    0px; }
     to { background-position: -276px; }
}

.water {
        position: relative;
    top:-130px;
    left: 134px;
    width: 84.3px;
    height: 171px;
    background-image: url("waterFall.png");
    
    -webkit-animation: playB .5s steps(3) infinite;
       -moz-animation: playB .5s steps(3) infinite;
        -ms-animation: playB .5s steps(3) infinite;
         -o-animation: playB .5s steps(3) infinite;
            animation: playB .5s steps(3) infinite;
}
@-webkit-keyframes playB {
   from { background-position:    0px; }
     to { background-position: -253px; }
}

@-moz-keyframes playB {
   from { background-position:    0px; }
     to { background-position: -253px; }
}

@-ms-keyframes playB {
   from { background-position:    0px; }
     to { background-position: -253px; }
}

@-o-keyframes playB {
   from { background-position:    0px; }
     to { background-position: -253px; }
}

@keyframes playB {
   from { background-position:    0px; }
     to { background-position: -253px; }
}

/*.pot {*/
    position: absolute; background-image: url(saksiya.png); width: 124px; height: 42px;
    top:50px;
    left: 300px;
}
/*.pot1 {*/
    position: absolute; background-image: url(saksiya.png); width: 124px; height: 42px;
    top:50px;
    left: 400px;
}
/*.pot2 {*/
    position: absolute; background-image: url(saksiya.png); width: 124px; height: 42px;
    top:50px;
    left: 500px;
}
/*.pot3 {*/
    position: absolute; background-image: url(saksiya.png); width: 124px; height: 42px;
    top:50px;
    left: 600px;
}
.pot4 {
    position: absolute; background-image: url(saksiya.png); width: 124px; height: 42px;
    top:50px;
    left: 200px;
}

.lWall {
    width: 50px;
    position: absolute;
    left:0px;
    height: 100%;
    background: url(beam.png);
}

.rWall {
     width: 50px;
    position: absolute;
    left:910px;
    height: 100%;
    background: url(beam.png);
}

.bWall {
    width: 960px;
    position: absolute;
    height: 25px;
    top: 78px;
    left: 0px;
    background: url(beam2.png);
}

.articleIMG {
    display: block;
    margin-left: auto;
    margin-right: auto;
    
}

.intextLink:visited {
    color: gray;
}

.intextLink:link {
    color: gray;
}
.intextLink:hover {
    color: black;
}

.formaciya {

    position: absolute;
    width: 200px;
    height: 189px;
    top: -14px;
    left: 425px;
    background-image: url("formacia.png");

}

.formLink {
    position: absolute;
    width: 180px;
    height:200px;
}

.works1 {
    font-size: 180%;
    font-weight: bold;
}

.works2 {
    font-size: 140%;
    font-weight: bold;
}

.pic {
    float: left;
    margin-right: 20px;
}

.works3 {
    font-weight: bold;
}

.jcarousel {
    position: relative;
    overflow: hidden;
    width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.jcarousel ul {
    width: 32400px;
    position: relative;

    /* Optional, required in this case since it's a <ul> element */
    list-style: none;
    margin: 0;
    padding: 0;
}
.jcarousel li {
    /* Required only for block elements like <li>'s */
    float: left;
}

.jcarousel-wrapper {
    position: relative;
}

.jcarousel-control-prev {
    position: absolute;
    top: 50%;
}

.jcarousel-control-next {
    position: absolute;
    top: 50%;
    right:0%;
}

.butonformation {
    background-image: url(formation_button_1.png);
    background-size: 100% 100%;
    height: 50px;
    width: 450px;
    position: absolute;
    top:40px;
    left: 250px;
}

.butonshkola {
    background-image: url(shkola_button_1.png);
    background-size: 100% 100%;
    height: 50px;
    width: 370px;
    position: absolute;
    top:40px;
    left: 290px;  
}

.photoindex {
    position: relative;
    float: left;
    width: 230px;
    height: 160px;
        margin-right: 20px;
    background-color: rgba(1,1,1,0);
    color: white;
        color: white;
    padding: 0px;
    font-size: x-small;
    margin-bottom: 15px;
      border-radius: 7px;
    overflow: hidden;
}

.exampleINDEX {
        color: black;
 padding-top: 30px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 20px;
        border-radius: 5px;
    box-shadow:2px 2px 3px #454545;
    background-image: url(paperBG.jpg);
    line-height: 140%;
    position: relative;
     height: 1300px;
}

.textINDEX {
    padding-top: 5px;
    position: absolute;
    top:162px;
    left: 8px;
    width: 220px;
    line-height: 150%;
    color: black;
    font-size: 95%;
    line-height: 105%;
}

.examplePF {
            color: black;
 padding-top: 30px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 20px;
        border-radius: 5px;
    box-shadow:2px 2px 3px #454545;
    background-image: url(paperBG.jpg);
    line-height: 140%;
    position: relative;
     height: 950px;
}

.imageContainer {
        height: 240px;
    width: 230px;
    float: left;
    margin-right: 20px;
    position: relative;
}

.photosLink {
        width: 155px;
    height: 58px;
    background-image: url("button_photos.png");
    background-size: 100% 100%;
}

.videoLink {
        width: 155px;
    height: 58px;
    background-image: url("button_video.png");
    background-size: 100% 100%;
}

.linkButton {
    width: 160px;
    float:left;
    margin-left: 20px;
}

.centerer {
    margin-left: auto;
    margin-right: auto;
    width: 380px;
    height: 100px;
}
  .centerer a:link,.centerer a:visited {
    color: black;
}



.videoContainer {
    width: 560px;
    height: 315px;
    margin-left: auto;
    margin-right: auto;
}

.partners {

    background-image: url(button_partners_online.png);
     background-size: 100% 100%;
    width: 150px;
    height: 40px;
    position: absolute;
    right:20px;
}

.buttonMarek {
            width: 300px;
    height: 90px;
    background-image: url("buttonMarek.jpg");
    background-size: 100% 100%;
}

.centererP {
    height: 90px;
    width: 300px;
   margin-left: auto;
    margin-right: auto;
}

.linkButtonP {
     width: 270px;
}

.navContainer3 {
    width: 40px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 22px;
    padding: 5px;
    text-align: center;
}

.flag2 {
     height: 26px;
    width: 39px;
    float: right;
    position: absolute;
    top: 55px;
    right: 108px;
    background-size: 100% 100%;
    background-image: url("flagJP.png"); 
}

.flag1 {
    height: 26px;
    width: 39px;
    float: right;
    position: absolute;
    top: 22px;
    right: 108px;
    background-size: 100% 100%;
    background-image: url("flagGB.png");
}