﻿
.landing-wrapper { background-image: url('../../_assets/banner.jpg'); background-position: center; background-size: cover; background-repeat: no-repeat; padding: 40px 10px; }

.landing-wrapper .inner,
.spotlight-wrapper .inner,
section.contacts .inner { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 10px; font-size: 0; }

.landing-wrapper .left { display: inline-block; width: 50%; vertical-align: top; padding: 0 20px 0 0; margin-bottom: 30px; }
.landing-wrapper .right { display: inline-block; width: 50%; vertical-align: top; padding: 0 0 0 20px; margin-bottom: 30px; }

.landing-wrapper .left h1 { color: #ffffff; font-size: 32px; font-family: berlingske_sans_roundmedium, sans-serif; display: block; margin-bottom: 14px; }
.landing-wrapper .left h1:after { content: ""; display: block; margin-top: 10px; width: 80px; height: 2px; background-color: #ffffff; margin-bottom: 14px; }

.landing-wrapper .left .intro { font-family: berlingske_sans_roundmedium, sans-serif; font-size: 25px; color: #ffffff; line-height: 1.3em; }

.landing-wrapper .left p { font-family: berlingske_sans_roundregular, sans-serif; font-size: 17px; color: #ffffff; line-height: 1.3em; margin-bottom: 0.75em; }

.landing-wrapper .left .buttons { margin-top: 30px; }

.btn-access { display: block; width: 100%; text-align: center; border: 1px solid #bed400; background-color: #bed400; color: #000000; font-family: berlingske_sans_roundregular, sans-serif; font-size: 18px; padding: 10px 20px; transition: all 0.2s; line-height: 1.4em; text-decoration: none; }
.btn-access:hover { background-color: transparent; color: #ffffff; }

.btn-talk { margin-top: 20px; width: 100%; border: 1px solid #bed400; background-color: transparent; color: #ffffff; font-family: berlingske_sans_roundregular, sans-serif; font-size: 18px; padding: 10px 20px; transition: all 0.2s; display: block; text-align: center; text-decoration: none; line-height: 1.4em; }
.btn-talk:hover { background-color: #bed400; color: #000000; }

.landing-wrapper .right img { width: 100%; }


.spotlight-wrapper { margin: 40px 0; }

.spotlight-wrapper .left { display: inline-block; width: 50%; vertical-align: top; padding: 0 20px 0 0; }
.spotlight-wrapper .right { display: inline-block; width: 50%; vertical-align: top; padding: 0 0 0 20px; }

.spotlight-wrapper .left .panel { background-color: #eef3f7; }

.spotlight-wrapper .right .panel { background-color: #5482ab; }

.spotlight-wrapper .panel { padding: 30px; width: 100%; margin: 0; }

.spotlight-wrapper .panel h2 { font-family: berlingske_sans_roundlight, sans-serif; font-size: 25px; margin-bottom: 30px; line-height: 1.2em; }
.spotlight-wrapper .left .panel h2 { color: #5482ab; }
.spotlight-wrapper .right .panel h2 { color: #ffffff; }

.spotlight-wrapper .left p { font-family: berlingske_sans_roundregular, sans-serif; font-size: 19px; color: #000000; line-height: 1.4em; margin-bottom: 0.75em; }
.spotlight-wrapper .left p:last-child { margin-bottom: 0; }

.spotlight-wrapper .left p.point { padding-left: 20px; position: relative; }
.spotlight-wrapper .left p.point:before { content: ""; position: absolute; left: 0; top: 13px; height: 1px; width: 10px; background-color: #000000;  }

.spotlight-wrapper .right p { color: #ffffff; font-family: berlingske_sans_roundregular, sans-serif; font-size: 19px; line-height: 1.3em; margin-bottom: 30px; position: relative; padding: 0 0 0 50px; }

.spotlight-wrapper .right p:before { background-image: url('../../_assets/tick.png'); content: ""; position: absolute; width: 32px; height: 32px; top: 4px; left: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }


section.contacts { margin-top: 50px; }
section.contacts h4 { font-family: berlingske_sans_roundregular, sans-serif; font-size: 25px; color: #5482ab; display: block; margin-bottom: 20px; }

section.contacts contact-list { font-size: 0; margin: 0 -10px; }

section.contacts .contact { display: inline-block; width: 33.33%; vertical-align: top; padding: 10px; background-color: transparent;  }

section.contacts .contact .image { display: inline-block; width: 35%; padding-top: 40%; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; }
section.contacts .contact .details { display: inline-block; width: 65%; padding-left: 20px; vertical-align: bottom; }

section.contacts .contact a { text-decoration: none; border-bottom: 0 ; }
section.contacts .contact p { font-family: berlingske_sans_roundregular, sans-serif; font-size: 18px; line-height: 1.4em; margin-bottom: 0.75em; color: #000000; }

section.contacts .contact p.name { font-family: berlingske_sans_roundmedium, sans-serif; color: #5482ab; }
section.contacts .contact p:last-child { margin-bottom: 0; }



@media (max-width: 1024px) {
   .left { display: block!important; width: 100%!important; padding-right: 0!important; }
   .right { display: block!important; width: 100%!important; padding-left: 0!important; }

   .buttons { text-align: center;  }

   .buttons a,
   .buttons button { display: inline-block; max-width: 300px; margin-right: 10px; }

   .buttons a:last-child,
   .buttons button:last-child { margin-right: 0; }

   .spotlight-wrapper .left { margin-bottom: 20px; }

   section.contacts .contact { width: 50%; }
}

@media (max-width: 680px) {
   .buttons a,
   .buttons button { margin-right: 0; margin: 0 auto 10px 0; }

   .buttons a:last-child,
   .buttons button:last-child { margin-bottom: 0; }
}
