﻿/*#region fonts*/
/*@font-face {
  font-family: 'Raleway';
  src: url('/fonts/Raleway-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'Raleway-Bold';
  src: url('/fonts/Raleway-Bold.ttf') format('truetype');
}
@font-face {
  font-family: 'Raleway-ExtraBold';
  src: url('/fonts/Raleway-ExtraBold.ttf') format('truetype');
}*/
/*#region general*/

/*#region general*/
html,body {margin:0;padding:0;height:100%;}
body {font-family:Raleway; font-weight:400; background-color:#e8eaec;}
body.main-page{ text-align:center;}
h1, h2, h3, h4, h5, h6{margin:0;  font-weight: 400;}
*, *:before, *:after{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.clearfix:before,
.clearfix:after {display: table;content: " ";}
.clearfix:after {clear: both;}
a{text-decoration:none;}
b{font-weight:700;}

.content{max-width:960px; margin:0 auto;}
.main-title{font-size:36px; color:#303a44;font-weight:800;}
.main-title.white{color:#fff;}
.link-text{font-weight:700; font-size:18px; color:#3399af;}
.link-text:hover{color:#455264;}
/*#endregion*/

/*#region header*/
.header{height: 120px;  background-color:#455264; border-bottom:5px solid #f7bd0b;}
.header .content{display:table; height:100%; width:100%;}
.header h1{ font-size:30px; font-weight:800; display:table-cell; vertical-align:middle;}
.header .site-header{color:#fff;}
.header-info .nav{vertical-align:middle; text-align:right;}
.header-info .links-holder{padding-top:10px; height:31px;}
.header-info .link:first-child{margin-left:0;}
.header-info .link:last-child{margin-right:0;}
.header-info .link-text{color:#fff; text-decoration:underline;}
.header-info .link-text:hover{text-decoration:none;font-weight:700;}
/*#endregion*/

/*#region intro*/
.intro{height:605px; background-color:transparent; border-bottom:5px solid #f7bd0b; background-color:#000;}
.intro .text{position:absolute; z-index:3; width:100%; margin:0 auto; padding-top:20px;}
.intro .header-info{text-align:left;}
.intro h1{color:#fff; font-size:82px; font-weight:800; text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.11); margin:125px 0 15px;height:192px;}

.intro .video{position:relative; height:600px;}
.intro .video-holder{position:absolute; bottom:0; top:0; left:0; right:0; overflow:hidden;}
.intro .video-playing{position:absolute; bottom:0; left:0; height:auto; width:100%; display:inline-block;}

.slideshow{display:none; height:600px; width:100%; position:relative;-ms-transform:translateZ(0); -webkit-transform:translateZ(0); transform:translateZ(0);}
.slideshow .slide{position:absolute; right:0; left:0; top:0; bottom:0; width:100%; height:100%;}
.slideshow .active{z-index:1;}
/*#endregion*/

/*#region topics*/
.topics{min-height:380px; background:url('../img/pattern_light.png');padding-top:55px; position:relative;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.topics > h2{margin-bottom:40px;}
.topics-holder{list-style-type: none;padding:0;white-space:nowrap;padding-bottom:68px;}
.topic{width:174px; height:174px; cursor:pointer; float:left; margin-right:22.5px; position:relative; background-repeat:no-repeat;}
.topic:hover, .topic.selected{background-position: 100% 0;}
.topic:hover .link-text, .topic.selected .link-text{color:#455264;}
.topic.selected:after{content:"";background:url('../img/arrow_light.png') no-repeat center; height:15px; width:100%; display:block; position:absolute; bottom:-69px; sleft:67.5px; z-index:2;}
.topic1{background-image:url('../img/1.png');}
.topic2{background-image:url('../img/2.png');}
.topic3{background-image:url('../img/3.png');}
.topic4{background-image:url('../img/4.png');}
.topic5{background-image:url('../img/5.png'); margin-right:0;}
.topic-name{position:absolute; bottom:-40px; width:100%; text-align:center; }
.topic-content{height:0; width:100%; background-color:#fff; text-align:left;display:none;}
.topic-content.open{height:260px;border-top:1px solid #dddddd;}
.topic-content > .content{position:relative;}
.topic-close{position:absolute; top:47px; right:0; cursor:pointer; display:none;}
.topic-content.open .topic-close{display:block;}
.topic-title{padding:35px 0 5px;}
.topic-text{font-size:24px; padding-right:80px; overflow:auto; height:155px;}
/*#endregion*/

/*#region info*/
.info{height:480px;border-bottom:5px solid #f7bd0b; font-weight:700; font-size:18px; background-color:#000; color:#fff;}
.info-bg{height:100%;background:url('../img/img_bg.jpg') no-repeat;background-size:cover; background-attachment:fixed; overflow:hidden;}
.info .main-title{padding-top:105px;}
.info .video-play{background:url('../img/video_icon.png') no-repeat; width:113px; height:114px; border:0; cursor:pointer; position:relative; top:50px; outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.info .video-play:hover{background-position: 0 100%;}
.dialog{width:100%; height:100%; position:fixed; top:0; left:0;opacity:0;z-index:-1;-webkit-transition: opacity .3s ease-in-out; transition: opacity .3s ease-in-out;}
.dialog.show{opacity:1;z-index:20; }
.dialog-opacity{background-color:#000; opacity:.8; width:100%; height:100%;}
.dialog-inner{position:fixed; top:0; bottom:0; left:calc((100% - 960px)/2); right:calc((100% - 960px)/2); width:960px; height:80vh; display:table; margin:10vh auto; border:8px solid #232730; background-color:#465466;}
.dialog-text{font-size:36px; color:#FFF;font-weight:700; display:table-cell; vertical-align:middle;}
.dialog-btn-close{width:32px; height:32px; background:url('../img/close_dialog.png') no-repeat; position:absolute; right:-25px; top:-25px; color:#fff; cursor:pointer;}
/*#endregion*/

/*#region units*/
.units{height:760px; background:url('../img/pattern_dark.png');}
.units-title{height:110px; background:#647285; position:relative;}
.units-title:after{content:''; background:url('../img/arrow.png') no-repeat center; height:15px; display:block; position:absolute; bottom:-15px; width:100%;}
.units-title > h2{padding:35px 0;}
.units-holder{list-style-type: none;padding:0; margin-top:70px;}
.unit{float:left; margin-right:22.5px; width:305px;}
.unit:last-child{margin-right:0;}
.unit-link{width:100%; height:100%; display:block;}
.unit-img{display:block;}
.unit-name{height:75px; background-color:#fff; border-top:5px solid #f7bd0b; line-height:25px; padding:22px 10px;}
.unit:first-child .unit-name{padding:10px;}
.course-btn{display:inline-block; width:217px; height:72px; padding:26px 0; -webkit-border-radius:36px; border-radius:36px; background-color:#f7bd0b; border:0; cursor:pointer; font-size:18px; color:#fff; font-weight:700; margin:40px 0 70px; outline:none;}
.course-btn:hover{background-color:#ffa304;}
/*#endregion*/

/*#region footer*/
.footer{min-height:245px; background-color:#fff; text-align:center;}
.logos-holder{padding-top:35px;}
.logo{display:inline-block; margin:0 25px;}
.logo-sabje, .logo-pincus{margin:0; position:relative; top:10px;}
.logo-makom{position:relative; top:5px;}
.footer-supported{padding-top:20px;}
.footer-supported .heb{font-family: Arial; font-size: 14px;}
.footer-info{padding-top:20px; padding-bottom:20px; display:table; width:100%;}
.links-holder{list-style-type: none;padding:0;white-space:nowrap; margin:0; display:inline-block;}
.link{float:left; margin-right:20px;}
.nav{display:table-cell; text-align:left; vertical-align:top;}
.copyrights{display:table-cell; text-align:right;}
/*#endregion*/

/*#region page*/
.page-content{min-height:100%;position:relative;}
.main-content{font-size:24px; margin:35px auto 0; padding-bottom:220px;}
.prolog{font-size:36px; margin:20px 0 0 0}
.course-info-holder{list-style-type: none;padding:0;margin:50px 0 0 0;}
.course-info-holder h3{margin:0; position:relative; padding-left:33px; font-weight:700;}
.course-info-holder h3:before{content:""; display:block; width:23px; height:23px; -webkit-border-radius:50%; border-radius:50%; background-color:#F7BD0B; position:absolute; left:0; top:4px;}
.course-info{margin-bottom:50px;}
.course-info h3 + p{margin-top:15px;}
.course-topics-info{background-color:#fff; padding:10px 30px;}
.course-topics-holder{list-style-type: none;padding:0;margin:0;}
.course-topic{border-bottom:2px solid #e8eaec; padding:10px 0;}
.course-topic:last-child{border-bottom:0;}
.course-topic-img{float:left; padding:15px 20px 0 10px;}
.course-topic-content{float:left; width:calc(100% - 130px); padding-top:15px; min-height:140px;}
.course-topic h4{margin-bottom:5px; font-weight:700;}
.mail{font-size:24px;}
.page-content .footer{height:220px; position:absolute; bottom:0; width:100%;}
/*#endregion*/


@media (max-width: 538px){
.main-content{padding-bottom:365px;}
.page-content .footer{height:365px;}
}

@media (min-width: 538px) and (max-width: 768px) {
 .main-content{padding-bottom:315px;}
.page-content .footer{height:315px;}
}

@media (max-width: 768px){
 .intro{height:405px;}
 .intro .video{height:400px;}
 .intro h1{margin-top:50px; font-size:52px; height:122px;}
}

@media (max-width: 960px){
  .content{padding-right:10px; padding-left:10px;}
  .units{height:auto;}
  .topics{padding-bottom:0; min-height:0;}
  .topic {width: 18%;height: 0;padding-bottom: 18%;background-size: 200%; margin:0 1%;}
  .unit{width:31.33%; margin:0 1%;}
  .unit-img{width:100%;}
  .unit-name{font-size:1.6vw;}
  .logo{margin:0 1%;}
}

@media (max-width: 1100px){
 .intro .video-playing{height:100%; width:auto;}
 .dialog-inner {width: 90%; right:5%; left:5%;}
}

@media screen and (max-device-width: 1024px){
.info-bg{background-attachment:scroll;}
}

