figure.wp-block-video video {
max-width: 100%;
height: auto;
margin: 0 auto;
}
.button,
a.button,
a.button:visited,
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
background: #214f66;
}
a,
a:visited,
.main-navigation a:hover,
.main-navigation li.current_page_item > a,
.main-navigation.toggled a:hover {
color: #214f66;
}
.dropdown-toggle:hover path,
.dropdown-toggle-toggled path {
fill: #214f66;
}
.button:hover,
a.button:hover,
a.button:focus,
button:focus,
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background: #2a6380;
color: #fff;
}
a:hover, a:focus, a:active {
color: #2a6380;
} .products311:before,
.avenir-demi {
font-family: "Avenir Next LT W01 Demi", sans-serif;
} .main-navigation .menu a:after,
button.play-video:before,
button,
.site-title img,
.post-navigation .nav-previous a:after,
.post-navigation .nav-next a:after,
button.accordion .plus {
transition: .2s all ease;
}  .site-header {
position: fixed;
width: 100%;
transition: all 0.2s ease;
z-index: 999;
}
.header-scroll {
background: #c0dbf8;
}
.header-scroll .site-header-wrapper {
padding: 5px 0;
}
.header-scroll #sivututka-svg-logokuva {
height: 40px;
width: 40px;
}
.entry-header {
padding-top: 10em;
}
.frontpage-header {
padding-top: 7.5em;
} .main-navigation .lang-menu {
margin: 0 0 0 0.25em;
padding: 0 0.9em;
position: relative;
z-index: 999;
}
.main-navigation .lang-menu a {
text-transform: uppercase;
padding: 0.4em 0.3em;
color: rgba(0,0,0,0.4);
margin: 0;
}
.main-navigation .lang-menu li.current-lang a {
color: #111;
}
.main-navigation .lang-menu li a:hover {
color: #214f66;
} .header1 {
display: flex;
flex-wrap: wrap;
}
.header11 {
width: 50%;
padding: 2.5em 3.5em 3.75em 0;
box-sizing: border-box;
}
.header12 {
width: 50%;
}
button.play-video {
background: transparent;
color: #214f66;
padding: 0.75em 0 0.75em 3.25em;
box-shadow: none;
position: relative;
}
button.play-video:before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 2.5em;
height: 2.5em;
background-color: #214f66;
background-image: url(//rayo3d.fi/wp-content/themes/rayo/images/play.svg);
background-size: 0.75em 0.75em;
background-position: 55% center;
background-repeat: no-repeat;
transform: translate(0,-50%);
border-radius: 50%;
}
button.play-video:hover,
button.play-video:focus,
button.play-video:active {
transform: none;
}
button.play-video:hover:before,
button.play-video:focus:before,
button.play-video:active:before {
background-color: #c0dbf8;
}
.video {
left: 0;
top: 0;
opacity: 0;
visibility: hidden;
position: fixed;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, 0.9);
text-align: center;
z-index: -1;
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
.video1 {
left: 0;
opacity: 1;
z-index: 99999;
visibility: visible;
}
.videowrap {
z-index: 1;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
.video-close {
position: absolute;
top: 0;
right: 0;
cursor: pointer;
z-index: 1000;
transform: translate(0,-125%);
background: #214f66;
border-radius: 50%;
width: 2.8125em;
height: 2.8125em;
padding: 0;
font-size: 1rem;
}
.video-close:before,
.video-close:after {
content: "";
position: absolute;
top: 50%;
left: 50%;
width: 1.5em;
height: 2px;
background: #c0dbf8;
transform: translate(-50%,-50%) rotate(45deg);
}
.video-close:hover,
.video-close:focus {
transform: translate(0,-125%);
background: #c0dbf8;
}
.video-close:hover:before,
.video-close:focus:before,
.video-close:hover:after,
.video-close:focus:after {
background: #214f66;
}
.video-close:after {
transform: translate(-50%,-50%) rotate(-45deg);
}
.header1 h1,
.contact-header h1 {
margin: 0.5em 0 0.75em 0;
}
.header11 p {
max-width: 460px;
}
.header-news {
padding: 1.875em 0;
box-sizing: border-box;
margin: 5.75em 0 0 0;
background: #fff;
box-shadow: 0px 0px 2.5em rgba(0, 0, 0, 0.1);
border-radius: 10px;
position: relative;
z-index: 1;
width: 125%;
}
.square-bottom-left,
.square-bottom-right {
position: relative;
z-index: 1;
}
.square-bottom-left:before,
.square-bottom-right:before {
content: "";
position: absolute;
left: -2em;
bottom: -2em;
width: 7.5em;
height: 7.5em;
box-sizing: border-box;
border: 2px solid #c0dbf8;
border-radius: 10px;
z-index: -2;
}
.square-bottom-right:before {
left: auto;
right: -2em;
}
.header-news.square-bottom-left:after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #fff;
box-sizing: border-box;
border-radius: 10px;
z-index: -1;
}
.header-news a {
text-decoration: none;
}
.header-news a:hover {
text-decoration: underline;
}
.news-header {
position: relative;
padding: 0 0 0.5em 2.75rem;
border-bottom: 2px solid #c0dbf8;
margin: 0;
display: inline-block;
}
.news-header span {
margin: 0 0 0 1.5em;
color: #c0dbf8;
}
.small-text {
font-size: 0.875em;
}
.header-news1 {
padding: 1.25em 0 0 2.75rem;
}
.header-news .small-text {
color: #c0dbf8;
margin: 0;
}
.header-news1 p {
margin: 0;
}
.header12 img {
border-radius: 10px;
}
.link-down {
font-size: 1.125em;
color: #c0dbf8;
text-decoration: none;
position: absolute;
right: 0;
transform: translate(-50%,0) rotate(-90deg);
bottom: 0;
}
.link-down:after {
content: "";
position: absolute;
bottom: 0;
right: 0;
height: 2px;
width: 150px;
background: #c0dbf8;
}
.link-down:hover:after {
background: #214f66;
}
.frontpage1 {
padding: 12em 0;
background-color: #214f66;
background-image: url(//rayo3d.fi/wp-content/themes/rayo/images/restorative-dentistry-background.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
overflow: hidden;
}
.white-text,
.white-text h1,
.white-text h2,
.white-text h3,
.white-text p,
.white-text li {
color: #fff;
}
.container2 { display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.container2--form {
max-width: 37.5em;
}
.frontpage1 h2 {
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}
.frontpage11 {
background: #fff;
padding: 2.25em 2.25em 1em 0;
position: relative;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
margin: 0 0 1.5em 0;
width: 50%;
}
.frontpage11:before {
content: "";
position: absolute;
top: 0;
left: 0;
background: #fff;
height: 100%;
width: 2000px;
transform: translate(-100%,0);
}
.frontpage12 { width: 50%;
padding: 0 0 0 30px;
box-sizing: border-box;
color: #fff;
text-shadow: 1px 1px 3px #000;
} .frontpage1__cols {
display: flex;
flex-wrap: wrap;
margin: 30px 0 0 0;
max-width: 100%;
color: #fff;
text-shadow: 1px 1px 3px #000;
}
.frontpage1__col {
width: 50%;
padding: 0 30px 30px 0;
box-sizing: border-box;
}
.frontpage1__col:nth-child(even) {
padding: 0 0 30px 30px;
}
.frontpage2 {
padding: 10em 0 0 0;
}
.frontpage21 {
display: flex;
flex-wrap: wrap;
margin: 6em 0 3em 0;
padding: 0;
list-style-type: none;
counter-reset: numbers;
}
.frontpage2 li {
width: 50%;
font-size: 1em;
padding: 0 3em 3.5em 0;
box-sizing: border-box;
}
.frontpage2 li:nth-child(even) {
padding: 0 0 3.5em 3.5em;
}
.frontpage2 li div {
background: #fff;
padding: 0.5em 0.25em 0.5em 3.5em;
box-shadow: 0px 0px 2.5em rgba(0, 0, 0, 0.1);
position: relative;
border-radius: 10px;
margin: 0;
}
.frontpage2 li div:before {
counter-increment: numbers;
content: counter(numbers);
position: absolute;
top: 50%;
left: -1rem;
width: 6.25rem;
height: 6.25rem;
background: #c0dbf8;
border: 0.625rem solid #fff;
box-sizing: border-box;
line-height: 0;
border-radius: 50%;
font-size: 3rem;
display: flex;
justify-content: center;
align-items: center;
transform: translate(0,-50%);
}
.frontpage3 {
padding: 12em 0 2em 0;
overflow: hidden;
}
.frontpage31 {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.frontpage31 > * {
width: 50%;
box-sizing: border-box;
}
.frontpage31 h2 {
padding-left: 8%;
margin: 0;
}
.frontpage32 {
margin-top: 80px !important;
}
.block-left,
.block-right {
position: relative;
}
.block-left:before,
.block-right:before {
content: "";
position: absolute;
top: 50%;
left: 13rem;
height: 16rem;
width: 2000px;
background: #c0dbf8;
border-radius: 10px;
transform: translate(-100%,-50%);
z-index: -1;
}
.block-right:before {
left: auto;
right: 13rem;
transform: translate(100%,-50%);
}
.frontpage311 {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
}
.frontpage311 li {
margin: 0 0 1em 1em;
font-size: 1em;
}
.frontpage311 img {
display: block;
}
.frontpage32 {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 6em 0 0 0;
}
.frontpage321 {
width: 33.333333%;
text-align: center;
padding: 1.5em;
box-sizing: border-box;
}
.frontpage3211 {
min-height: 80px;
display: flex;
align-items: flex-end;
}
.frontpage32 img {
display: block;
margin: 0 auto;
}
.frontpage32 h3 {
margin: 0.75em 0;
}
.centered {
text-align: center;
}
.frontpage4 {
padding: 15em 0 2em 0;
overflow: hidden;
}
.frontpage41 {
padding: 2em 0 0 0;
}
.customer-comments {
text-align: center;
margin: 4em 0 0 0;
}
.container3 {
max-width: 48em;
}
.centered-container {
margin: 0 auto;
}
.customer-comments h2 {
margin: 0 auto 1em auto;
}
.customer-comments1 {
padding: 0 25px;
}
.customer-comments11 {
padding: 100px 2em 2em 2em;
position: relative;
box-shadow: 0 0 3.125em rgba(0,0,0,0.15);
box-sizing: border-box;
text-align: left;
border-radius: 10px;
}
.customer-comments1 img {
position: absolute;
width: auto!important;
height: auto;
left: 50%;
top: 0;
transform: translate(-50%,-50%);
border-radius: 50%;
border: 0.625em solid #fff;
box-sizing: border-box;
}
.customer-comments1 h4 {
margin: 0;
}
.frontpage5 {
}
.frontpage51 {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.frontpage511 {
width: 50%;
padding: 0 3.75em 0 0;
box-sizing: border-box;
}
.frontpage511 p {
max-width: 460px;
}
.frontpage511 .button {
margin: 1.5em 0 0 0;
}
.frontpage512 {
width: 50%;
}
.frontpage512 img {
display: block;
border-radius: 10px;
} .lightheader .hamburger-inner, .lightheader .hamburger-inner:after, .lightheader .hamburger-inner:before {
background: #c0dbf8;
}
.lightheader .header-scroll .hamburger-inner, .lightheader .header-scroll .hamburger-inner:after, .lightheader .header-scroll .hamburger-inner:before {
background: #214f66;
}
.lightheader .site-title img {
filter: brightness(0) invert(1);
}
.lightheader .header-scroll .site-title img {
filter: none;
}
.lightheader.no-scroll .header-scroll .site-title img {
filter: brightness(0) invert(1);
}
.lightheader .main-navigation .lang-menu a {
color: rgba(255,255,255,0.4);
}
.lightheader .main-navigation a,
.lightheader .main-navigation .lang-menu li.current-lang a,
.lightheader.no-scroll .header-scroll .main-navigation a {
color: #fff;
}
.lightheader .header-scroll .main-navigation a,
.lightheader .header-scroll .main-navigation .lang-menu li.current-lang a {
color: rgba(0,0,0,0.8);
}
.lightheader .main-navigation a:hover,
.lightheader .main-navigation li.current_page_item > a,
.lightheader .main-navigation.toggled a:hover,
.lightheader .main-navigation .lang-menu li.current-lang a:hover,
.lightheader .main-navigation .lang-menu li a:hover {
color: #c0dbf8;
}
.lightheader .main-navigation .menu a:after {
background: #c0dbf8;
}
.lightheader .header-scroll .main-navigation .menu a:after {
background: #214f66;
}
.lightheader .header-scroll .main-navigation .lang-menu a {
color: rgba(0,0,0,0.4);
}
.lightheader .header-scroll .main-navigation .lang-menu li.current-lang a {
color: rgba(0,0,0,0.8);
}
.lightheader .header-scroll .main-navigation .lang-menu li a:hover {
color: #214f66;
}
.lightheader.no-scroll .header-scroll .main-navigation .lang-menu li a:hover {
color: #c0dbf8;
}
.lightheader.no-scroll .header-scroll .main-navigation .lang-menu li.current-lang a {
color: #fff;
}
.lightheader.no-scroll .header-scroll .main-navigation .lang-menu a {
color: rgba(255,255,255,0.4);
}
.lightheader .main-navigation a.button {
background: #c0dbf8;
color: #214f66;
}
.lightheader .main-navigation a.button:hover {
background: #214f66;
color: #fff;
}
.lightheader .header-scroll .main-navigation a.button {
background: #214f66;
color: #fff;
}
.lightheader.no-scroll .header-scroll .main-navigation a.button,
.lightheader.no-scroll .header-scroll .main-navigation a.button:hover,
.lightheader .header-scroll .main-navigation a.button:hover,
.lightheader .main-navigation a.button:hover,
.lightheader.no-scroll .main-navigation.toggled a.button:hover {
background: #c0dbf8;
color: #214f66;
}
.lightheader .header-scroll .main-navigation a:hover,
.lightheader .header-scroll .main-navigation li.current_page_item > a,
.lightheader .header-scroll .main-navigation.toggled a:hover,
.lightheader .header-scroll .main-navigation .lang-menu li.current-lang a:hover {
color: #214f66;
}
.lightheader.no-scroll .main-navigation a:hover,
.lightheader.no-scroll .main-navigation li.current_page_item > a,
.lightheader.no-scroll .main-navigation.toggled a:hover,
.lightheader.no-scroll .main-navigation .lang-menu li.current-lang a:hover {
color: #c0dbf8;
}
.hero {
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
padding: 3em;
min-height: 25em;
display: flex;
align-items: center;
border-radius: 10px;
margin: 0 0 2em 0;
}
.hero__content {
color: #fff;
}
.hero__content h1,
.hero__content h2,
.hero__content h3,
.hero__content h4,
.hero__content p {
color: #fff;
text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
}
.hero__content>*:last-child {
margin-bottom: 0;
}
.hero-alt {
background-color: #214f66;
padding: 12em 0 8em 0;
}
.page-template-products .hero-alt {
background-position: center top;
}
.hero-alt h1,
.hero-alt p {
color: #fff;
}
.hero-alt .header11 {
padding: 0;
}
.page-links {
display: flex;
flex-wrap: wrap;
margin: 2em 0 0 0;
padding: 0;
list-style-type: none;
}
.page-links li {
margin: 0 1.5em 0.25em 0;
padding: 0;
}
.page-links li a {
color: #214f66;
text-decoration: none;
}
.page-template-products .page-links li a,
.page-template-contact .page-links li a {
color: #c0dbf8;
}
.page-links li a:hover {
text-decoration: underline;
}
.products1 {
padding: 8em 0 0 0;
text-align: center;
}
.products11 {
padding: 0 0 6em 0;
}
.products11 h2 {
color: #214f66;
}
.products12 {
padding: 0;
display: flex;
flex-wrap: wrap;
}
.products121 {
width: 33.333333%;
padding: 0 3.5em 3.5em 0;
box-sizing: border-box;
}
.products121:nth-child(3n-1) {
padding: 0 1.75em 3.5em 1.75em;
}
.products121:nth-child(3) {
padding: 0 0 3.5em 3.5em;
}
.products121-img {
margin: 0 auto;
min-height: 80px;
display: flex;
align-items: flex-end;
justify-content: center;
}
.products121 h3 {
color: #214f66;
}
.products1211 {
background: #214f66;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
padding: 2em 1.5em;
position: relative;
display: flex;
flex-wrap: wrap;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 145px;
}
.products1211 p,
.products1211 li {
color: #fff;
max-width: 100%;
}
.products1211 p:last-child {
margin: 0;
}
.products1212 {
background: #c0dbf8;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
padding: 3em 1.5em;
position: relative;
display: flex;
flex-wrap: wrap;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 213px;
}
.products1212 p {
color: rgba(0, 0, 0, 0.6);
margin: 0 0 0.5em 0;
max-width: 100%;
}
.products1212 p:last-child {
margin: 0;
}
.products1211:after,
.products1212:after {
content: "";
position: absolute;
top: 50%;
right: 0;
background-image: url(//rayo3d.fi/wp-content/themes/rayo/images/arrow-right-dark.svg);
background-size: 2.25em 2.25em;
background-position: center center;
background-repeat: no-repeat;
width: 2.25em;
height: 2.25em;
transform: translate(3.75em,-50%);
}
.products121:last-child .products1211:after,
.products121:last-child .products1212:after {
content: none;	
}
.content1 {
padding: 8em 0;
text-align: center;
}
.content111 {
display: flex;
flex-wrap: wrap;
text-align: left;
padding: 2.4em 0;
position: relative;
z-index: 1;
}
.content111:after {
content: "";
position: absolute;
left: 50%;
bottom: -2.4em;
width: 9.375em;
height: 9.375em;
box-sizing: border-box;
border: 2px solid #c0dbf8;
border-radius: 10px;
z-index: -2;
transform: translate(-50%,25%);
}
.content111:last-child:after {
content: none;
}
.content111:nth-child(even) {
direction: rtl;
}
.content1111 {
width: 50%;
padding: 0 4em 0 0;
box-sizing: border-box;
direction: ltr;
display: flex;
flex-direction: column;
justify-content: center;
}
.content111:nth-child(even) .content1111 {
padding: 0 0 0 4em;
}
.container-460 {
max-width: 29em;
}
.content1112 {
width: 50%;
}
.content1112 img {
border-radius: 10px;
display: block;
}
.products3 {
padding: 6em 0 4em 0;
counter-reset: numbers1;
overflow: hidden;
}
.products31 {
display: flex;
flex-wrap: wrap;
padding: 3em 0 0 0;
}
.products311 {
width: 50%;
padding: 6em 4em 0 4em;
box-sizing: border-box;
position: relative;
}
.products311:before {
counter-increment: numbers1;
content: counter(numbers1);
position: absolute;
color: #e1e5f1;
top: 0.2em;
left: -0.05em;
line-height: 1;
font-size: 12.5em;
z-index: -1;
}
.products4 {
padding: 8em 0;
overflow: hidden;
}
.products41 {
padding: 8em 0 0 0;
}
.products411 {
display: flex;
flex-wrap: wrap;
padding: 2em 0;
text-align: left;
}
.products4111 {
width: 23%;
}
.products4112 {
width: 77%;
padding: 0 0 0 2em;
box-sizing: border-box;
}
.products4112 .h2 {
margin-top: 0;
}
.products42 {
padding: 6em 0 0 0;
} .image-gallery__desc {
max-width: 600px;
margin: 0 auto;
}
.image-gallery__images {
list-style-type: none;
margin: 40px auto 60px auto;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.image-gallery__image {
margin: 0;
width: 50%;
box-sizing: border-box;
padding: 0 20px 40px 0;
}
.image-gallery__image:nth-child(even) {
padding: 0 0 40px 20px;
}
.image-gallery__img {
max-width: 100%;
height: auto;
border-radius: 10px;
display: block;
} .faq {
padding: 6em 0 2em 0;
overflow: hidden;
}
.faq1 {
display: flex;
flex-wrap: wrap;
padding: 4em 0 0 0;
text-align: left;
}
.faq11 {
width: 50%;
padding: 0 0 4em 0;
box-sizing: border-box;
}
.faq12 {
width: 50%;
padding: 0 0 0 12%;
box-sizing: border-box;
}
button.accordion {
background: transparent;
border-radius: 0;
padding: 0.5em 1.5em 0.5em 0;
margin: 0;
box-shadow: none;
border-top: 2px solid #c0dbf8;
position: relative;
width: 100%;
text-align: left;
box-sizing: border-box;
}
.kysymys:first-child button.accordion {
border-top: none;
}
button.accordion.active,
button.accordion:hover,
button.accordion:focus {
transform: none;
color: #333;
background: #c0dbf8;
}
button.accordion .plus,
button.accordion .plus:after {
position: absolute;
right: 0;
top: 50%;
width: 1em;
height: 2px;
background: #214f66;
transform: translate(0,-50%);
}
button.accordion .plus:after  {
content: "";
right: 50%;
transform: translate(50%,-50%) rotate(90deg);
}
button.accordion.active .plus {
transform: translate(0,-50%) rotate(-45deg);
}
div.panel {
padding: 0;
max-height: 0;
overflow: hidden;
transition: 0.6s ease-in-out;
opacity: 0;
}
.panel1 {
padding: 1em 0 2em 0;
}
div.panel.show {
opacity: 1;
max-height: 2500px;
margin: 0;
}
.faq12 .h2 {
margin-top: 0.5em;
}
.faq12 a {
text-decoration: none;
}
.faq12 a:hover {
text-decoration: underline;
} .page-template-about-us .header11 {
display: flex;
flex-direction: column;
justify-content: center;
}
.page-template-about-us .products3 {
padding: 8em 0;
}
.team {
padding: 6em 0 0 0;
text-align: center;
}
.team .container-460,
.team .container3 {
margin: 0 auto;
}
.team .content11 {
padding: 2em 0 0 0;
}
.team .content11 .container-460 {
margin: 0;
}
.team .content11 .h2 {
margin: 1em 0 0 0;
}
.dark-text {
color: #333;
}
.team .dark-text {
margin: 0.5em 0 1.5em 0;
}
.team svg {
display: inline-block;
width: 43px;
height: 43px;
}
.team .content1111 a:hover path:first-child,
.contact21 a:hover path:first-child {
fill: #c0dbf8;
}
.team .content1111 a {
align-self: flex-start;
display: block;
line-height: 0;
}
.investors {
padding: 8em 0 0 0;
}
.investors .h1 {
margin: 0;
}
.story {
padding: 10em 0;
text-align: center;
overflow: hidden;
}
.story .h1 {
margin: 0 0 0.25em 0;
}
.timeline {
position: relative;
padding: 8em 0 5em 0;
}
.timeline * {
box-sizing: border-box;
}
.timeline::after { 
content: '';
position: absolute;
width: 3px;
background-color: #c0dbf8;
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
span.loppu {
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-50%,100%);
border-top: 3px solid #c0dbf8;
line-height: 100%;
margin: 0;
padding: 0.25em 1em 0 1em;
}
.timeline1 {
padding: 0.75em 2em;
position: relative;
background-color: inherit;
width: 50%;
}
.timeline1:after {
content: '';
position: absolute;
width: 1.25em;
height: 1.25em;
right: 0;
background-color: white;
border: 3px solid #c0dbf8;
top: 2em;
border-radius: 50%;
z-index: 1;
transform: translate(45%,0);
}
.left {
left:0;
}
.right {
left:50%;
}
.left:before,
.right:before {
content: "";
height: 0;
position: absolute;
top: 2em;
width: 0;
z-index: 1;
right: 2em;
border: medium solid white;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent white;
transform: translate(100%,0);
}
.right:before {
right: auto;
left: 2em;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
transform: translate(-100%,0);
}
.right:after {
right: auto;
left: 0;
transform: translate(-55%,0);
}
.timeline11 {
padding: 1.5em 2.5em;
background-color: #fff;
position: relative;
border-radius: 10px;
box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.1);
text-align: left;
}
.timeline11 p:last-of-type {
margin: 0;
}
.time-heading {
text-transform: uppercase;
color: #c0dbf8;
margin: 0;
}
.timeline11 .h2 {
margin: 0 0 1em 0;
}
.present-day {
padding: 0 2em;
box-sizing: border-box;
text-align: left;
width: 100%;
display: block;
margin: 3.5em 0 5em 0;
}
.present-day p {
border-bottom: 4px dashed #c0dbf8;
color: #c0dbf8;
margin: 0;
padding: 0.25em 0;
}
.news {
overflow: hidden;
padding: 8em 0 0 0;
}
.news1 {
display: flex;
flex-wrap: wrap;
padding: 2em 0;
}
.news11 {
width: 50%;
padding: 0 2em 4em 0;
box-sizing: border-box;
}
.news11:nth-child(even) {
padding: 0 0 4em 2em;
}
.news111 {
position: relative;
background: #fff;
box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.1);
padding: 1.5em 2.5em;
border-radius: 10px;
}
.news111:before {
width: 9em;
height: 9em;
}
.news111:after {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: #fff;
border-radius: 10px;
z-index: -1;
}
.news1 h3 {
margin: 0 0 1em 0;
}
.news1 h3 a {
color: #333;
text-decoration: none;
}
.news1 h3 a:hover {
color: #214f66;
}
.news1 time {
font-size: 0.875em;
color: #777;
}
.arrow-link {
position: absolute;
bottom: 1.5em;
right: 2.5em;
}
.arrow-link svg {
display: block;
width: 12px;
height: 22px;
}
.arrow-link:hover path {
stroke: #c0dbf8;
} #all-news {
overflow: hidden;
}
.blog .news1 {
padding: 4em 0;
}
.breadcrumbs {
margin: 0 0 1em 0;
}
.breadcrumbs a,
.breadcrumbs span {
font-size: 1.125em;
color: #555;
margin: 0 0.5em;
text-decoration: none;
}
.breadcrumbs *:first-child {
margin-left: 0;
}
.breadcrumbs a:hover {
text-decoration: underline;
}
.single-post .entry-content,
.single-post .post {
margin-top: 3em;
}
.entry-footer {
margin: 5em 0;
text-align: center;
}
.footer2 a {
color: rgba(0,0,0,0.6);
text-decoration: none;
} .contact-header {
background-color: #214f66;
background-image: url(//rayo3d.fi/wp-content/themes/rayo/images/rayo-bg.png);
background-repeat: no-repeat;
background-position: right bottom;
background-size: auto;
}
.contact-header .container2 {
margin: 0 auto;
}
.contact-header .page-links {
margin: 0 0 1em 0;
}
.contact-header p {
max-width: 29em;
}
.contact-header .gform_wrapper {
margin: 2em 0 0 0;
}
.form-cols ul {
display: flex;
flex-wrap: wrap;
}
.form-cols li {
width: 50%;
box-sizing: border-box;
padding: 0 0.5em 0 0;
}
.form-cols li:nth-child(even) {
padding: 0 0 0 0.5em;
}
.invisible-block {
margin: 0;
display: none;
}
.gform_body p {
font-size: 0.875em;
text-align: center;
color: rgba(255,255,255,0.7);
margin: 0 auto;
}
.gform_body p a {
color: rgba(255,255,255,0.7);
}
.gform_footer {
text-align: center;
}
input[type="submit"].gform_button {
background: #c0dbf8;
color: #214f66;
padding: 0.75em 4em;
}
.contact1 p {
margin: 1em 0;
}
.contact2 {
text-align: center;
padding: 15em 0 0 0;
overflow: hidden;
}
.contact21 {
padding: 0 0 5em 0;
}
.contact21:last-child {
padding: 0;
}
.contact21 .h2 {
margin: 0 0 1em 0;
}
.contact21 ul {
margin: 0;
padding: 0;
list-style-type: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.contact21 li {
margin: 0;
width: 25%;
padding: 2em 1em;
box-sizing: border-box;
font-size: 1em;
}
.contact21 img {
border-radius: 50%;
display: block;
margin: 0 auto 1em auto;
}
.contact21 h3 {
margin: 0 0 0.25em 0;;
}
.contact21 p {
margin: 0.75em 0;
}
.contact21 p.small-text {
margin: 0;
line-height: 1.3;
}
.contact21 p a {
text-decoration: none;
color: #555;
}
.contact21 p a:hover {
text-decoration: underline;
}
ul.footer-logos {
margin: 0;
padding: 2em 0 0 0;
}
.footer-logos li {
margin: 0;
padding: 1em 1.5em 0 0;
list-style-type: none;
max-width: 9em;
}
.gform_submission_error {
font-size: 1rem;
color: inherit;
}
.text-block {
max-width: 600px;
margin: 80px auto;
}  @media only screen and (min-width: 125em) {
body {
font-size: 110%;
}
} @media only screen and (min-width: 150em) {
body {
font-size: 120%;
}
} @media only screen and (min-width: 87.5625em) {
} @media only screen and (max-width: 87.5em) {
.footer22 {
padding: 0 60px 0 0;
}
} @media only screen and (max-width: 75em) {
.contact21 li {
width: 50%;
}
} @media only screen and (max-width: 62em) {
.link-down {
display: none;
}
.main-navigation a:hover, .main-navigation li.current_page_item > a, .main-navigation.toggled a:hover {
color: #c0dbf8;
}
.header11 {
padding-right: 2em;
}
.frontpage2 li {
padding: 0 1.5em 3.5em 0;
}
.frontpage2 li:nth-child(even) {
padding: 0 0 3.5em 1.5em;
}
.frontpage321 {
padding: 1em;
}
.products121 {
padding: 0 1em 3.5em 0;
}
.products121:nth-child(3n-1) {
padding: 0 0.5em 3.5em 0.5em;
}
.products121:nth-child(3) {
padding: 0 0 3.5em 1em;
}
.products1211:after, .products1212:after, .content111:after {
content: none;
}
.news11 {
padding: 0 1em 2em 0;
}
.news11:nth-child(even) {
padding: 0 0 2em 1em;
}	 
.main-navigation.toggled .menu a, .main-navigation.toggled ul.menu ul a {
padding: 0.5em 1em;
}
.videowrap {
width: 90%;
}
.image-gallery__image {
padding: 0 15px 30px 0;
}
.image-gallery__image:nth-child(even) {
padding: 0 0 30px 15px;
}
} @media only screen and (max-width: 48em) {
.header11 {
width: 100%;
padding: 2.5em 0;
}
.header-news {
width: auto;
}
.header-news11 {
padding-right: 4em;
}
.news-header,
.header-news1 {
padding-left: 1.5rem;
}
.hero {
padding: 3em 1.5em;
}
.frontpage11,
.frontpage12 {
width: 100%;
padding-left: 0;
}
.frontpage2 li:nth-child(even) {
padding: 0 0 3.5em 0;
}
.frontpage321 {
width: 100%;
padding: 2em 0;
}
.frontpage31 h2 {
padding-left: 0;
}
.frontpage51 {
padding: 4em 0 0 0;
}
.frontpage511 {
width: 100%;
padding: 0 0 4em 0;
}
.footer12 {
width: 100%;
text-align: center;
max-width: 450px;
margin: 3em auto 0 auto;
} .products121,
.products121:nth-child(3n-1),
.products121:nth-child(3) {
width: 100%;
padding: 0 0 3.5em 0;
}
.products1211, .products1212 {
min-height: 0;
}
.content1111 {
width: 100%;
padding: 0;
order: 2;
}
.content1112 {
order: 1;
direction: ltr;
}
.content1112 img {
margin: 0 0 16px 0;
}
.content111:nth-child(even) .content1111 {
padding: 0;
}
.products311 {
width: 100%;
padding: 6em 0 0 4em;
}
.faq12 {
width: 100%;
padding: 0;
}
.timeline::after {
left: 0;
transform: translate(-50%,0);
}
.timeline1 {
width: 100%;
padding: 0.75em 0 0.75em 2em;
}
.left:before {
right: auto;
left: 2em;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
transform: translate(-100%,0);
}
.left:after,
.right:after {
right: auto;
left: -2px;
transform: translate(-55%,0);
}
.right {
left: 0;
}
.present-day {
padding: 0;
}
span.loppu {
left: 2em;
}
.news11, .news11:nth-child(even) {
padding: 0 0 4em 0;
}
.frontpage2 li {
padding: 0 0 3.5em 0;
}
.header12, .frontpage2 li, .frontpage512, .footer11, .content1112, .faq11, .news11 {
width: 100%;
}
.frontpage1__col {
padding: 0 15px 30px 0;
}
.frontpage1__col:nth-child(even) {
padding: 0 0 30px 15px;
}
} @media only screen and (max-width: 37.5em) {
.frontpage311 li {
margin: 1em 0;
}
.frontpage31 > * {
width: 100%;
justify-content: center;
margin: 11em 0 0 0;
}
.frontpage32 {
margin: 2em 0 0 0;
}
.contact21 li {
width: 100%;
padding: 2em 0;
}
.frontpage311 {
width: 100%;
}
.frontpage1__col {
width: 100%;
padding: 0 0 40px 0;
}
.frontpage1__col:nth-child(even) {
padding: 0 0 40px 0;
}
} @media only screen and (min-width: 30em) {
} @media only screen and (max-width: 30em) {	
.footer11 {
flex-wrap: wrap;
text-align: center;
justify-content: center;
}
.footer11 ul {
padding: 0;
justify-content: center;
margin: 2em 0 0 0;
}
.comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous {
width: 100%;
float: none;
margin: 3em 0;
}
.lightheader .main-navigation a.button, .lightheader.no-scroll .header-scroll .main-navigation a.button, .lightheader.no-scroll .header-scroll .main-navigation a.button:hover, .lightheader .header-scroll .main-navigation a.button:hover, .lightheader .main-navigation a.button:hover, .lightheader.no-scroll .main-navigation.toggled a.button:hover {
background: transparent;
color: #fff;
}
.lightheader .header-scroll .main-navigation a.button {
background: transparent;
color: rgba(0,0,0,0.8);
}
.lightheader .header-scroll .main-navigation a.button:hover {
color: rgba(0,0,0,0.8);
}
.frontpage2 li div:before {
width: 5.25rem;
height: 5.25rem;
font-size: 3rem;
}
.videowrap iframe {
height: 350px;
}
h1,	.h1 {
font-size: 2.5em;
}
.image-gallery__image {
width: 100%;
padding: 0 0 20px 0;
}
.image-gallery__image:nth-child(even) {
padding: 0 0 20px 0;
}
} @media only screen and (max-width: 25em) {
.footer21, .footer22 {
width: 100%;
text-align: center;
margin: 1em 0;
justify-content: center;
padding: 0;
}
.form-cols li, .form-cols li:nth-child(even) {
width: 100%;
padding: 0;
}
.frontpage2 li div:before {
width: 4.25rem;
height: 4.25rem;
font-size: 2rem;
}
} @media only screen and (max-width: 20em) {
}