body {
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	line-height: 1.8em;
	font-size: 1.3rem;
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
	color: #3f3f3f;
}
hr {
	border-bottom-color: #70c6d7;
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}
.top-gradient {
	width: 100%;
	position: absolute;
	height: 120px;
    z-index: 1;
}
.rinc .animate-boot .responsive {
	-ms-transform: scale(1.3, 1.3);
    -webkit-transform: scale(1.3, 1.3);
    transform: scale(1.3, 1.3);
}
.rinc .responsive {
	-webkit-transition: all 30s;
	-moz-transition: all 30s;
	-o-transition: all 30s;
	-ms-transition: all 30s;
	transition: all 30s;
}
.rinc .no-pointer-event {
	pointer-events: none;
}
.sivua-muokattu {
	color: rgb(255, 255, 255);
    padding: 10px;
    font-size: 12px;
}
#page-name {
	display: none;
}
.rinc .container {
	position: relative;
}
#wrapper ul li {
	list-style-type: none;
    padding-left: 0px;
    margin-left: 20px;
}
#wrapper ul li:before {
	content: "•";
    color: #70c6d7;
    margin-left: -18px;
    position: absolute;
}
.rinc {
	position: relative;
	overflow: hidden;
}
.rinc .teal {
	background-color: #70c6d7!important;
}
.rinc .teal-text {
	color: #70c6d7!important;
}
.rinc .navbar-fixed-trust .santen-navigation a {
	color: #70c6d7;
}
.rinc h1 a, .rinc h2 a, .rinc h3 a, .rinc h4 a, .rinc h5 a, .rinc h6 a {
	font-weight: inherit;
}
.rinc h1 {
	font-size: 3.7rem;
	font-weight: 300;
	line-height: 110%;
	margin: 2.1rem 0 1.68rem 0;
	font-family: 'Varela Round', sans-serif;
}

.rinc h2 {
	font-size: 2.5rem;
	font-weight: 300;
	line-height: 110%;
	margin: 1.78rem 0 1.424rem 0;
	font-family: 'Varela Round', sans-serif;
}

.rinc h3 {
	font-size: 2.92rem;
	font-weight: 300;
	line-height: 110%;
	margin: 1.46rem 0 1.168rem 0;
	font-family: 'Varela Round', sans-serif;
}

.rinc h4 {
	font-size: 2rem;
	font-weight: 300;
	line-height: 110%;
	margin: 1.14rem 0 0.912rem 0;
	font-family: 'Varela Round', sans-serif;
}

.rinc h5 {
	font-size: 1.9rem;
	font-weight: 400;
	line-height: 110%;
	margin: 0.82rem 0 0.656rem 0;
	font-family: 'Lato', sans-serif;
}

.rinc h6 {
	font-size: 1.3rem;
	font-weight: 600;
	line-height: 110%;
	margin: 2rem 0 0.4rem 0;
	font-family: 'Varela Round', sans-serif;
}
.rinc .bigger-text {
	font-size: 1.3rem;
	font-weight: 300;
	line-height: 1.7em;
}
.rinc .extra-padding {
	padding-left: 25%;
	padding-right: 25%;
}
.rinc em {
	font-style: italic;
}

.rinc strong {
	font-weight: 700;
}

.rinc small {
	font-size: 75%;
}
.rinc img {
	max-width: 100%;
    height: auto;
}
.rinc .rinc-alue-1 {
	background-color: #ffffff;
	padding-top: 80px;
	padding-bottom: 80px;
}
.rinc .full-height {
	display: table;
	width: 100%;
}
#wrapper .white-bullets ul li::before {
    content: "•";
    color: rgb(255, 255, 255);
    margin-left: -18px;
    position: absolute;
}
.rinc .navbar-absolute {
	-webkit-transition: background-color 0.1s ease-in-out;
    -moz-transition: background-color 0.1s ease-in-out;
    -o-transition: background-color 0.1s ease-in-out;
    -ms-transition: background-color 0.1s ease-in-out;
    transition: background-color 0.1s ease-in-out;
}
.rinc .navbar-absolute .nav-wrapper {
	padding-top: 25px;
}
.rinc .button-collapse {
	margin-top: -93px;
}
.rinc .navbar-fixed-trust {
    position: fixed;
    margin: 0px;
    top: 0px;
    background-color: #ffffff;
    box-shadow: 0px 10px 90px rgba(0, 0, 0, 0.1);
}
.rinc .navbar-fixed-trust>.container {
    width: 100%;
    max-width: 100%;
}
.rinc .full-height:after {
	content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    z-index: 2;
    bottom: 40px;
    left: 50%;
    margin-left: -25px;
    background-image: url('arrow.png');
}
.rinc .rinc-nosto {
	border-radius: 10px;
    overflow: hidden;
    background-color: #ffffff;
    padding-bottom: 23px;
    margin-bottom: 30px;
    box-shadow: 0px 10px 90px rgba(0, 0, 0, 0.1);
    position: relative;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
.rinc .rinc-nosto:hover {
	transform: scale(1.1);
	z-index: 2;
}
.rinc .rinc-nosto h5 {
	margin-top: 33px;
}
.rinc .rinc-nosto-padding {
	padding-left: 30px;
	padding-right: 30px;
}
.rinc footer.page-footer {
    border-top: solid 1px #dadada;
}
.rinc footer.page-footer p {
	color: #6e6e6e;
	line-height: 1.8em;
}
.rinc footer.page-footer .footer-copyright {
	background-color: transparent;
    margin-top: 60px;
    text-align: center;
    font-size: 0.9em;
    opacity: 0.5;
}
.rinc .rinc-painike {
	margin-bottom: 8px;
}
.rinc .rinc-painike a {
	font-size: 1em;
	font-weight: 400;
}
.rinc .rinc-painike a .material-icons {
	-webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
}
.rinc .rinc-painike a:hover .material-icons {
	margin-left: 17px;
	margin-right: -2px;
}
.rinc .btn, .rinc .btn-large {
	font-weight: 400;
}
.rinc .hyprosan a {
    color: #ffffff!important;
    background-color: #90a0e2!important;
    font-weight: 400;
}
.rinc .oftagel a {
	color: #ffffff!important;
	background-color: #0097bf!important;
	font-weight: 400;
}
.rinc .oftan-apant a {
	color: #ffffff!important;
	background-color: #ab72e5!important;
	font-weight: 400;
}
.rinc .cationorm a {
	color: #ffffff!important;
	background-color: #ffb400!important;
	font-weight: 400;
}
.rinc .lecrolyn a {
	color: #ffffff!important;
	background-color: #349d01!important;
	font-weight: 400;
}
.rinc .otiborin a {
	color: #ffffff!important;
	background-color: #e37a1e!important;
	font-weight: 400;
}
.rinc .ocutears a {
	color: #ffffff!important;
	background-color: #70c6d7!important;
	font-weight: 400;
}
.rinc .santen-navigation p {
	line-height: 5px;
}
.rinc .santen-navigation a {
	color: #ffffff;
	font-size: 1.1em;
    font-weight: 400;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
    letter-spacing: -0.6px;
    line-height: 1.1em;
}
.rinc .side-nav a {
	font-size: 0.9em;
	font-weight: 400;
}
.rinc .page-active {
	opacity: 0.4;
}
.boot {
    opacity: 0;
    transform: translateY(20px);
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}
.animate-boot {
    opacity: 1;
    transform: translateY(0px);
}
.rinc .over {
	position: absolute;
    bottom: -140px;
    width: 100%;
    z-index: 2;
}
.rinc .over2 {
	position: absolute;
    bottom: 0px;
    width: 100%;
    z-index: -1;
    right: -400px;
    text-align: right;
}
.rinc .banner-wrapper {
	position: relative;
}
.rinc .santen-content {
	display: table;
    padding-top: 90px;
    padding-bottom: 90px;
    width: 100%;
    position: relative;
}
.rinc .rinc-painike {
	position: relative;
}
.rinc .roihu-haitari-paneeli {
	display: block;
    position: absolute;
    background-color: white;
    z-index: 2;
    padding: 40px;
    border: solid 1px #eaeaea;
    border-radius: 25px;
    top: 25px;
    box-shadow: 0px 10px 90px rgba(0, 0, 0, 0.1);
}
.rinc .haitari {
	position: relative;
	z-index: 3;
}
.rinc .logo2 {
	display: none;
}
.rinc .eyenimate h1 {
	display: none;
}
.rinc .eyenimate:after {
	content: "Sen näkee silmistä";
    animation-duration: 20s;
    animation-name: eyenimation;
    animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in-out;

    font-size: 3.7rem;
    font-weight: 300;
    line-height: 110%;
    margin: 2.1rem 0 1.68rem 0;
    font-family: 'Varela Round', sans-serif;
    text-align: center;
    width: 100%;
    display: table;
}
.rinc .full-height .rinc-painike .waves-light.btn {
	border-width: 2px;
}
 @-webkit-keyframes eyenimation {
    0% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Kutiseeko?";
    }
    5% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    }
    10% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    }
	    11% {
	    	transform: rotate(0deg);
	    }
	    12% {
	    	transform: rotate(3deg);
	    }
	    13% {
	    	transform: rotate(-3deg);
	    }
	    14% {
	    	transform: rotate(3deg);
	    }
    15% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    	transform: rotate(-3deg);
    }
    	16% {
	    	transform: rotate(3deg);
	    }
	    17% {
	    	transform: rotate(-3deg);
	    }
	    18% {
	    	transform: rotate(3deg);
	    }
	    19% {
	    	transform: rotate(0deg);
	    }
    20% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    }
    25% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Kutiseeko?";
    }
    30% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Punoittaako?";
    	color: #ffffff;
    }
    35% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    	color: #ff9393;
    	text-shadow: 0 0 0px red;
    	transform:translateY(0px);
    }
	    36% {
	    	text-shadow: 0 0 10px red;
	    }
	    37% {
	    	text-shadow: 0 0 20px red;
	    }
	    38% {
	    	text-shadow: 0 0 20px red;
	    }
	    39% {
	    	text-shadow: 0 0 10px red;
	    }
    40% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    	color: #ff9393;
    	text-shadow: 0 0 0px red;
    }
    45% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;
    	color: #ff9393;
    }
    50% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Punoittaako?";
    	color: #ffffff;
    }
    55% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Vetistääkö?";
    	filter: blur(0px);
    }
    60% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;

    }
	    61% {

	    }
	    62% {

	    }
	    63% {

	    }
	    64% {

	    }
   	65% {
   		-webkit-transform: translate(0, 0px);
   		opacity: 1;
   		filter: blur(5px);
   	}
   		66% {

	    }
	    67% {

	    }
	    68% {

	    }
	    69% {

	    }
    70% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 1;

    }
    75% {
    	-webkit-transform: translate(0, 0px);
    	opacity: 0;
    	content: "Vetistääkö?";
    	filter: blur(0px);
    }
    80% {
    	opacity: 0;
    	content: "Sen näkee silmistä";
    	transform:translateY(0px);
    }
    85% {
    	opacity: 1;
    }
    90% {
    	opacity: 1;
    }
    95% {
    	opacity: 1;
    }
    100% {
    	opacity: 1;
    }

}
@media only screen and (max-width: 1780px) {
	.rinc .over2 {
		right: -100px;
	}
	.rinc .over2 img {
	    opacity: 0.2;
	}
}
@media only screen and (max-width: 992px) {
	.rinc .navbar-absolute .nav-wrapper {
    	padding-top: 0px;
	}
	.rinc nav .button-collapse i {
    	line-height: 64px;
	}
}
@media only screen and (max-width: 900px) {
	.rinc .parallax img {
		-ms-transform: scale(1.4)translate3d(-30%, -10%, 0px)!important;
	    -webkit-transform: scale(1.4)translate3d(-30%, -10%, 0px)!important;
	    transform: scale(1.4)translate3d(-30%, -10%, 0px)!important;
    }
}
@media only screen and (max-width: 700px) {
	.rinc .parallax img {
		-ms-transform: scale(2)translate3d(-10%, -10%, 0px)!important;
	    -webkit-transform: scale(2)translate3d(-10%, -10%, 0px)!important;
	    transform: scale(2)translate3d(-10%, -10%, 0px)!important;
    }
}
@media only screen and (max-width: 600px) {
	.rinc .extra-padding {
		padding-left: 0px;
		padding-right: 0px;
	}
	.rinc .parallax-container {
		min-height: 350px;
	}
	.rinc .parallax img {
		-ms-transform: scale(2.4)translate3d(-2%, -5%, 0px)!important;
	    -webkit-transform: scale(2.4)translate3d(-2%, -5%, 0px)!important;
	    transform: scale(2.4)translate3d(-2%, -5%, 0px)!important;
    }

}

.rinc .floating {
    -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;

    -moz-animation-name: Floating;
    -moz-animation-duration: 4s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;

    animation-name: Floating;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@-webkit-keyframes Floatingx {
    from {-webkit-transform: translate(0, 0px);}
    65% {-webkit-transform: translate(0, 15px);}
    to {-webkit-transform: translate(0, -0px);}
}

@-moz-keyframes Floating {
    from {-moz-transform: translate(0, 0px);}
    65% {-moz-transform: translate(0, 15px);}
    to {-moz-transform: translate(0, -0px);}
}

@keyframes Floating {
    from {transform: translate(0, 0px);}
    65% {transform: translate(0, 15px);}
    to {transform: translate(0, -0px);}
}

.rinc .scaling {
    -webkit-animation-name: scalex;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;

    -moz-animation-name: scale;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;

    animation-name: scale;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

@-webkit-keyframes scalex {
    from {-webkit-transform: scale(0.9);}
    65% {-webkit-transform: scale(1.0);}
    to {-webkit-transform: scale(0.9);}
}

@-moz-keyframes scale {
    from {-moz-transform: scale(0.9);}
    65% {-moz-transform: scale(1.0);}
    to {-moz-transform: scale(0.9);}
}

@keyframes scale {
    from {transform: scale(0.9);}
    65% {transform: scale(1.0);}
    to {transform: scale(0.9);}
}
