{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"CAAA,KACI,8BACA,eACA,qBACA,iBAGJ,KACI,oBACA,eACA,oBACA,cACA,sBACA,gBACA,cACA,uBAGJ,QACI,2BAGJ,cACI,2BACA,8CAGJ,4BACI,gBACA,gBACA,cAGJ,cACI,eACA,iBACA,iBACA,oBAGJ,yBACE,2CACE,eAIJ,cACI,iBACA,oBAGJ,4BACI,iBAGJ,SACI,kBACA,kBACA,kBAGJ,UAEI,YACA,aACA,cACA,kBACA,iBAMJ,mBAEI,iBACA,gBACA,WACA,mBAIJ,mBAEI,eACA,gBACA,sBACA,gBAIJ,gBACI,YACA,gBACA,UACA,qBACA,gBAGJ,iBACI,kBAGJ,gBACI,WAGJ,UACI,UACA,WACA,wBACA,sBACA,cACA,iBACA,kBACA,kBACA,QACA,SACA,gCAGJ,WACI,kBAGJ,gCACI,gBAGJ,0CACI,WACI,aAEJ,gBACI,WACA,oBACA,mBACA,eACA,uBACA,gBACA,UAEJ,gCACI,gBAKR,GACI,kBAGJ,GACI,gBACA,kBAGJ,OACI,iBAGJ,OACI,iBAGJ,EACI,aACA,mBAGJ,mBACI,sBAGJ,UACI,eAGJ,eACI,eACA,kBACA,gBAGJ,uBACI,YACA,gBACA,aACA,kBACA,iBACA,iBACA,kBACA,gBACA,kBAGJ,kCACI,eAGJ,eACI,kBAGJ,gBACI,kBAGJ,kBACI,oBACA,mBACA,eACA,uBACA,gBACA,UACA,SAGJ,mBACI,kBACA,iBAGJ,8BACI,yBAGJ,wBACI,YAGJ,gBACI,oBACA,mBACA,eAGF,eACD,kBACA,gBACA,cAGC,iBACD,cACA,kBACO,kBAGN,cACD,WAIC,sBACD,cACA,kBACA,yBACA,iBACA,WAEA,iBAEA,gBACA,cACA,kBACA,mBACA,wBACA,2BAEC,0BACD,WACA,mBACA,aAEC,6BACD,gBACO,aAIN,mCACD,kBACA,aACA,sBACA,cACA,UACA,gBACA,QACA,YACA,aACA,sBACA,wBACA,2BACA,mBACA,qBACA,gBACA,iBACA,sBACA,sBACA,UACA,mCAEC,0CACD,cAEC,6CACD,cACA,mBAEC,2CACD,cACA,kBAEC,mCACD,cACA,UACA,UAEC,mCACD,cACA,mCAkBC,cACD,cACA,kBACA,QACA,SACA,mBACA,kBACA,WACA,YACA,YACA,gBACA,sBACA,WACA,kBACA,eACA,iBAGC,iCACD,kBACA,YACA,WAGC,mBACA,2BACD,8BACO,oBAGN,WACD,gBAKC,oCACD,0BACA,YACA,iBACA,mCAEC,oDACD,0BACA,YACA,iBACA,mCAEC,yDACD,0BACA,YACA,iBACA,mCAEC,mDACD,4BACA,gBACA,YACA,iBACA,mCAKC,uBACD,0BACA,YACA,iBACA,mCAEC,qCACD,0BACA,YACA,iBACA,mCAEC,qCACD,0BACA,YACA,iBACA,mCAEC,uDACD,0BACA,YACA,iBACA,mCAEC,qCACD,0BACA,gBACA,YACA,iBACA,mCAEC,mDACD,0BACA,gBACA,YACA,iBACA,mCAEC,8DACD,0BACA,gBACA,YACA,iBACA,mCAEC,0DACD,0BACA,gBACA,YACA,iBACA,mCAEC,iDACD,0BACA,YACA,iBACA,mCAEC,wDACD,0BACA,YACA,iBACA,mCAEC,kDACD,0BACA,YACA,iBACA,mCAEC,iDACD,0BACA,YACA,iBACA,mCAGC,4BACD,0BACA,YACA,kBACA,UACA,YACA,eACA,gBACA,WACA,WACA,YACA,kBACA,iBACA,kBACA,wBAGD,aACI,eAGJ,gBACI,qBACA,mBAGJ,wBACI,YACA,0BACA,mBAGJ,mCACI,YAGJ,2BACI,oBACA,mBACA,eAEJ,uBACI,eACA,sBAEJ,kBACI,eACA,sBAGJ,WACI,eAGJ,cACI,qBACA,mBAGJ,sBACI,YACA,0BACA,mBAGJ,iCACI,YAGJ,yBACI,oBACA,mBACA,eAEJ,qBACI,eACA,sBAEJ,wBACI,eACA,sBAGJ,iBACI,kBACA,WACA,SACA,sBACA,gBACA,mBAEJ,OACI,kBACA,MACA,OACA,WACA,YAIJ,KACE,sBAGF,yBACE,yBACA,2BACA,kBACA,QACA,UACA,aACA,mBACA,uBACA,kBACA,WACA,YACA,gBACA,sBACA,WACA,eACA,iBAMF,yBACE,yBACE,WACA,UAKJ,SACI,qBAGJ,eACI,YAGJ,UACI,gBACA,mBAGJ,0CACE,wBACE,kBAIJ,YACE,cACA,kBACA,iBACA,iBACA,kBACA,WAMF,eACE,mBAIF,+CAEI,4FACI,kBACA,MACA,gBACA,WACA,cACA,oBAGR,+CAEI,6EACI,kBACA,MACA,WACA,WACA,cACA,oBAGR,yBACI,eACI,eAGJ,uCACI,cAEJ,iMAEI,gBAEJ,oCACI,kBACA,+BAGJ,6LAGI,kBACA,mCACA,mBAGJ,wDACI,kBACA,MACA,OACA,WACA,cACA,mBAGJ,iMAGI,kBACA,kCACA,mBACA,cACA,oBAIR,yBAEI,sDACI,cAEJ,uHACI,gBAEJ,oCACI,kBACA,+BAGJ,oFACI,kBACA,mCACA,mBAGJ,qFACI,kBACA,kCACA,mBACA,cACA,oBAIR,yBAEI,qEACI,cAEJ,sIACI,gBAGJ,2GACI,kBACA,MACA,WACA,WACA,cACA,mBAGJ,mGACI,kBACA,mCACA,mBAGJ,oGACI,kBACA,kCACA,mBACA,cACA,oBAMR,cACM,gBACA,iBAEN,YACE,kBACA,YAEF,OACE,kBACA,YACA,MACA,YACA,eACA,mBACA,WACA,UAGF,aACE,eACA,aACA,cACA,gBAGF,oCACI,kBACA,SACA,WAGJ,oCACI,kBACA,SACA","sourcesContent":["html {\n    font-family: Roboto,sans-serif;\n    font-size: 16px;\n    color: rgba(0,0,0,.8);\n    line-height: 1.65;\n}\n\nbody {\n    font-family: inherit;\n    font-size: 1rem;\n    line-height: inherit;\n    color: inherit;\n    background-color: #fff;\n    margin-top: 70px;\n    padding-top: 0;\n    counter-reset: captions;\n}\n\n.navbar {\n    min-height: 70px !important;\n}\n\n.navbar-light {\n    background: #fff !important;\n    box-shadow: 0 .125rem .25rem 0 rgba(0,0,0,.11);\n}\n\n.navbar-light .navbar-brand {\n    font-weight: 700;\n    font-size: 1.2em;\n    color: #2b2b2b;\n}\n\n.navbar-brand {\n    height: inherit;\n    line-height: 50px;\n    padding-top: 10px;\n    padding-bottom: 10px;\n}\n\n@media (min-width:992px){\n  ul.nav li.dropdown:hover div.dropdown-menu {\n    display: block;\n  }\n}\n\n.home-section {\n    padding-top: 50px;\n    padding-bottom: 30px;\n}\n\n.home-section:first-of-type {\n    padding-top: 50px;\n}\n\n#profile {\n    text-align: center;\n    padding: 30px 10px;\n    position: relative;\n}\n\n.portrait {\n\n    width: 200px;\n    height: 200px;\n    margin: 0 auto;\n    border-radius: 50%;\n    object-fit: cover;\n    //border: 1px solid #ccc;\n    //border-radius: 10px;\n\n}\n\n.portrait-title h2 {\n\n    font-size: 1.75em;\n    font-weight: 300;\n    color: #000;\n    margin: 20px 0 10px;\n\n}\n\n.portrait-title h3 {\n\n    font-size: 1rem;\n    font-weight: 300;\n    color: rgba(0,0,0,.54);\n    margin: 0 0 10px;\n\n}\n\nul.network-icon {\n    margin: 30px;\n    list-style: none;\n    padding: 0;\n    justify-content: left;\n    text-align: left;\n}\n\n.network-icon li {\n    margin-right: 10px;\n}\n\n.network-icon i {\n    width: 30px;\n}\n\n.icon-img {\n    width: 50%;\n    height: 50%;\n    background-position: 50%;\n    background-size: cover;\n    display: block;\n    margin-left: auto;\n    margin-right: auto;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%,-50%);\n}\n\n.link-text {\n    padding-left: 10px;\n}\n\nul.network-icon > li:last-of-type {\n    margin-top: 30px;\n}\n\n@media only screen and (max-width: 992px) {\n    .link-text {\n        display: none;\n    }\n    ul.network-icon {\n        margin: 0px;\n        display: inline-flex;\n        flex-direction: row;\n        flex-wrap: wrap;\n        justify-content: center;\n        list-style: none;\n        padding: 0;\n    }\n    ul.network-icon > li:last-of-type {\n        margin-top: 0px;\n    }\n}\n\n\nh1 {\n    font-size: 2.25rem;\n}\n\nh2 {\n    margin-top: 2rem;\n    font-size: 1.75rem;\n}\n\nh3, .h3 {\n    font-size: 1.5rem;\n}\n\nh4, .h4 {\n    font-size: 1.5rem;\n}\n\np {\n    margin-top: 0;\n    margin-bottom: 1rem;\n}\n\n*, ::before, ::after {\n    box-sizing: border-box;\n}\n\n.big-icon {\n    font-size: 2rem;\n}\n\n.people-widget {\n    font-size: 1rem;\n    text-align: center;\n    margin-top: 30px;\n}\n\n.people-widget .avatar {\n    width: 150px;\n    max-width: 150px;\n    height: 150px;\n    border-radius: 50%;\n    object-fit: cover;\n    margin-left: auto;\n    margin-right: auto;\n    margin-top: 24px;\n    margin-bottom: 8px;\n}\n\n.people-widget .portrait-title h3 {\n    font-size: 1rem;\n}\n\n.team-member p {\n    margin-bottom: 0px;\n}\n\n.team-member h4 {\n    margin-bottom: 0px;\n}\n\nul.social-buttons {\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: wrap;\n    justify-content: center;\n    list-style: none;\n    padding: 0;\n    margin: 0;\n}\n\n.social-buttons li {\n    margin-right: 10px;\n    font-size: 1.2rem;\n}\n\n.home-section:nth-of-type(2n) {\n    background-color: #f7f7f7;\n}\n\n.middot-divider::before {\n    content: \"\\00B7\";\n}\n\n.middot-divider {\n    padding-right: .25em;\n    padding-left: .25em;\n    font-size: 15px;\n}\n\n  .highlights h5 {\n\tline-height:\t\t1.2em;\n\tmargin-bottom:\t\t0;\n\tcolor:\t\t\t#334279;\n  }\n\n  .highlight-venue {\n\tdisplay:\t\tblock;\n\tmargin-bottom:\t\t6pt;\n        font-style:\t\titalic;\n  }\n\n  .publications {\n\tclear:\t\t\tboth;\n  }\n\n  /* Publications class */\n  .publications article {\n\tdisplay:\t\tblock;\n\tposition:\t\trelative;\n\tmargin:\t\t\t10px 0px 10px 0px;\n\tpadding:\t\t0px 10px;\n\tclear:\t\t\tboth;\n\t//border:\t\t\t1px solid #ccc;\n\tmin-height:\t\t140px;\n\t//background-color:\t#eee;\n\ttext-align:\t\tleft;\n\tfont-size:\t\t1em;\n\tline-height:\t\t1.2em;\n\tborder-radius:\t\t10px;\n\t-moz-border-radius:\t10px;\n\t-webkit-border-radius:\t10px;\n  }\n  .publications article img {\n\tfloat:\t\t\tleft;\n\tpadding-right:\t\t20px;\n\theight:\t\t\t120px;\n  }\n  .publications article > header {\n\tmargin:\t\t\t-3px 0 0;\n        padding:\t\t14px;\n  }\n\n  /* Publications details */\n  .publications article .pub-details {\n\tposition:\t\trelative;\n\tdisplay:\t\tnone;\n\tbackground-color:\t#ddd;\n\toverflow:\t\tauto;\n\twidth:\t\t\t90%;\n\tmargin-top:\t\t30px;\n\tleft:\t\t\t5%;\n\theight:\t\t\tauto;\n\tpadding:\t\t10px;\n\tborder:\t\t\t5px solid #000;\n\t-moz-border-radius:\t10px;\n\t-webkit-border-radius:\t10px;\n\tborder-radius:\t\t10px;\n\t-moz-box-shadow:\tnone;\n\tbox-shadow:\t\tnone;\n\ttext-shadow:\t\tnone;\n\t-moz-text-shadow:\tnone;\n\tcolor:\t\t\t#000 !important;\n\topacity:\t\t1;\n\t-moz-transition:\topacity 0.4s linear;\n  }\n  .publications article .pub-details .title {\n\tdisplay:\t\tblock;\n  }\n  .publications article .pub-details .abstract {\n\tdisplay:\t\tblock;\n\ttext-align:\t\tjustify;\n  }\n  .publications article .pub-details .author {\n\tdisplay:\t\tblock;\n\tfont-style:\t\titalic\n  }\n  .publications article .showDetails {\n\tdisplay:\t\tblock;\n\topacity:\t\t1;\n\tz-index:\t\t1;\n  }\n  .publications article .showDetails {\n\tdisplay:\t\tblock;\n\t-moz-transition:\topacity 0.4s linear;\n  }\n\n  /* \n    This code snippet uses the CSS3 selectors to highlight\n    the currently active target article. This works so that \n    the id of the 'article' in the URL address.htm#id is\n    highlighted. The second selector highlights the hovered\n    article (will not work on iPads and other touch devices)\n  */\n  /*\n  article:target, article:hover {\n\t-moz-box-shadow:\tinset 0 0 5px #00f;\n\t-webkit-box-shadow:\tinset 0 0 5px #00f;\n\tbox-shadow:\t\tinner 0 0 5px #00f;  \n  }\n  */\n\n  .numberCircle {\n\tdisplay:\t\tblock;\n\tposition:\t\tabsolute;\n\ttop:\t\t\t4px;\n\tleft:\t\t\t4px;\n\tbox-sizing:\t\tinitial;\n\tborder-radius:\t\t50%;\n\twidth:\t\t\t13px;\n\theight:\t\t\t13px;\n\tpadding:\t\t6px;\n\tbackground:\t\t#fff;\n\tborder:\t\t\t3px solid #000;\n\tcolor:\t\t\t#000;\n\ttext-align:\t\tcenter;\n\tfont-size:\t\t12px;\n\tfont-weight:\t\tbold;\n  }\n\n  .publications article .linkIcons {\n\tposition:\t\tabsolute;\n\tbottom:\t\t\t10px;\n\tright:\t\t\t10px;\n  }\n\n  .publications .btn {\n \tfont-size:\t\t0.8rem !important;\n\tline-height:\t\t1.2rem !important;\n        padding:\t\t0.1rem 0.4rem;\n  }\n  \n  .pub-title {\n\tfont-weight: \t\t600;\n  }\n\n  /* Custom link url rendering with icons - using CSS selectors.\n     These are for each protocol that is used (mail/telephone/skype). */\n  .publications a[href^=\"skype\"]:before {\n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f17e\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://twitter.com\"]:before {\n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f099\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://www.linkedin.com\"]:before {\n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f0e1\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://github.com\"]:before {  \n\tfont-family:\t\t\"FontAwesome 6\";\n\tfont-weight:\t\t900;\n\tcontent:\t\t\"\\f09b\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n\n  /* Custom link url rendering with icons - using CSS selectors.\n     These are for each document type that is used (pdf/bib). */\n  .publications a:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f14c\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href$=\".pdf\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f1c1\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href$=\".bib\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f02e\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"http://docs.google.com\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f3aa\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href$=\".zip\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tfont-weight:\t\t900;\n\tcontent:\t\t\"\\f1c6\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://github.com\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tfont-weight:\t\t900;\n\tcontent:\t\t\"\\f092\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://aaltovision.github.io\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tfont-weight:\t\t900;\n\tcontent:\t\t\"\\f092\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://aaltoml.github.io\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tfont-weight:\t\t900;\n\tcontent:\t\t\"\\f092\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://youtu.be\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f166\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://www.youtube.com\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f166\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"https://arxiv.org\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f15b\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n  .publications a[href^=\"http://arxiv.org\"]:before {  \n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f15b\";\n\tmargin-right:\t\t5px;\n\t-webkit-font-smoothing:\tantialiased;\n  }\n\n  .publications .winner:after {\n\tfont-family:\t\t\"FontAwesome\";\n\tcontent:\t\t\"\\f091\";\n\tposition:\t\tabsolute;\n\ttop:\t\t\t-10px;\n\tright:\t\t\t-10px;\n\tfont-size:\t\t18px;\n\tbackground:\t\tgold;\n\tcolor:\t\t\twhite;\n\twidth:\t\t\t32px;\n\theight:\t\t\t32px;\n\ttext-align:\t\tcenter;\n\tline-height:\t\t32px;\n\tborder-radius:\t\t50%;\n\tbox-shadow:\t\t0 0 1px #333;\n  }\n\nul.talk-list {\n    padding-left: 0;\n}\n\nul.talk-list li {\n    list-style-type: none;\n    padding-bottom: 1em;\n}\n\nul.talk-list li::before {\n    content: \"\\f073\";\n    font-family: \"FontAwesome\";\n    padding: 0 10px 0 0;\n}\n\n.talk-list .middot-divider::before {\n    content: \"\\00B7\";\n}\n\n.talk-list .middot-divider {\n    padding-right: .45em;\n    padding-left: .45em;\n    font-size: 15px;\n}\n.talk-list .start-date {\n    font-size: 15px;\n    color: rgba(0,0,0,.54);\n}\n.talk-list .venue {\n    font-size: 15px;\n    color: rgba(0,0,0,.54);\n}\n\nul.courses {\n    padding-left: 0;\n}\n\nul.courses li {\n    list-style-type: none;\n    padding-bottom: 1em;\n}\n\nul.courses li::before {\n    content: \"\\f19d\";\n    font-family: \"FontAwesome\";\n    padding: 0 10px 0 0;\n}\n\n.courses .middot-divider::before {\n    content: \"\\00B7\";\n}\n\n.courses .middot-divider {\n    padding-right: .45em;\n    padding-left: .45em;\n    font-size: 15px;\n}\n.courses .start-date {\n    font-size: 15px;\n    color: rgba(0,0,0,.54);\n}\n.courses .course-detail {\n    font-size: 15px;\n    color: rgba(0,0,0,.54);\n}\n\n.video-container {\n    position: relative;\n    width: 100%;\n    height: 0;\n    padding-bottom: 56.25%;\n    margin-top: 36px;\n    margin-bottom: 36px;\n}\n.video {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n}\n\n/* Counter for numbering books, journal papers, and conference publications. */\nbody {\n  counter-reset: pub 114;\n}\n\n.counted article::before {\n  counter-increment: pub -1; \n  content: \"\" counter(pub) \"\";\n  position: absolute;\n  top: 2px;\n  left: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 50%;\n  width: 31px;        /* final outer size */\n  height: 31px;       /* final outer size */\n  background: #fff;\n  border: 3px solid #000;\n  color: #000;\n  font-size: 12px;\n  font-weight: bold;\n}\n\n\n\n/* Counter if width is xs */\n@media (max-width:576px){\n  .counted article::before {\n    left: \t\t-10px;\n    top:\t\t16px;\n  }\n}\n\n\n.newsimg {\n    filter: opacity(0.75);\n}\n\n.newsimg:hover {\n    filter: none;\n}\n\n.newsitem {\n    margin-top: 40px;\n    margin-bottom: 60px;\n}\n\n@media only screen and (min-width: 768px) {\n  .newsitem:nth-child(2n) {\n    padding-top: 80px;\n  }\n}\n\n.url-anchor {\n  display: block;\n  position: relative;\n  margin-top: -80px; \n  padding-top: 80px;\n  visibility: hidden;\n  height: 0px;\n}\n\n\n\n\n.carousel-item {\n  line-height: 1.2rem;\n}\n\n\n@media (min-width: 768px) and (max-width: 991px) {\n    /* Show 4th slide on md if col-md-4*/\n    .carousel-inner .active.col-md-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {\n        position: absolute;\n        top: 0;\n        right: -33.3333%;  /*change this with javascript in the future*/\n        z-index: -1;\n        display: block;\n        visibility: visible;\n    }\n}\n@media (min-width: 576px) and (max-width: 768px) {\n    /* Show 3rd slide on sm if col-sm-6*/\n    .carousel-inner .active.col-sm-6.carousel-item + .carousel-item + .carousel-item {\n        position: absolute;\n        top: 0;\n        right: -50%;  /*change this with javascript in the future*/\n        z-index: -1;\n        display: block;\n        visibility: visible;\n    }\n}\n@media (min-width: 576px) {\n    .carousel-item {\n        margin-right: 0;\n    }\n    /* show 2 items */\n    .carousel-inner .active + .carousel-item {\n        display: block;\n    }\n    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),\n    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {\n        transition: none;\n    }\n    .carousel-inner .carousel-item-next {\n        position: relative;\n        transform: translate3d(0, 0, 0);\n    }\n    /* left or forward direction */\n    .active.carousel-item-left + .carousel-item-next.carousel-item-left,\n    .carousel-item-next.carousel-item-left + .carousel-item,\n    .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(-100%, 0, 0);\n        visibility: visible;\n    }\n    /* farthest right hidden item must be also positioned for animations */\n    .carousel-inner .carousel-item-prev.carousel-item-right {\n        position: absolute;\n        top: 0;\n        left: 0;\n        z-index: -1;\n        display: block;\n        visibility: visible;\n    }\n    /* right or prev direction */\n    .active.carousel-item-right + .carousel-item-prev.carousel-item-right,\n    .carousel-item-prev.carousel-item-right + .carousel-item,\n    .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(100%, 0, 0);\n        visibility: visible;\n        display: block;\n        visibility: visible;\n    }\n}\n/* MD */\n@media (min-width: 768px) {\n    /* show 3rd of 3 item slide */\n    .carousel-inner .active + .carousel-item + .carousel-item {\n        display: block;\n    }\n    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {\n        transition: none;\n    }\n    .carousel-inner .carousel-item-next {\n        position: relative;\n        transform: translate3d(0, 0, 0);\n    }\n    /* left or forward direction */\n    .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(-100%, 0, 0);\n        visibility: visible;\n    }\n    /* right or prev direction */\n    .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(100%, 0, 0);\n        visibility: visible;\n        display: block;\n        visibility: visible;\n    }\n}\n/* LG */\n@media (min-width: 991px) {\n    /* show 4th item */\n    .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {\n        display: block;\n    }\n    .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {\n        transition: none;\n    }\n    /* Show 5th slide on lg if col-lg-3 */\n    .carousel-inner .active.col-lg-3.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {\n        position: absolute;\n        top: 0;\n        right: -25%;  /*change this with javascript in the future*/\n        z-index: -1;\n        display: block;\n        visibility: visible;\n    }\n    /* left or forward direction */\n    .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(-100%, 0, 0);\n        visibility: visible;\n    }\n    /* right or prev direction //t - previous slide direction last item animation fix */\n    .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {\n        position: relative;\n        transform: translate3d(100%, 0, 0);\n        visibility: visible;\n        display: block;\n        visibility: visible;\n    }\n}\n\n\n\n.modal-dialog {\n      max-width: 800px;\n      margin: 30px auto;\n}\n.modal-body {\n  position:relative;\n  padding:0px;\n}\n.close {\n  position:absolute;\n  right:-30px;\n  top:0;\n  z-index:999;\n  font-size:2rem;\n  font-weight: normal;\n  color:#fff;\n  opacity:1;\n}\n\n.video-title {\n  margin-top: 6px;\n  height: 3.6em;\n  display: block;\n  overflow: hidden;\n}\n\n#videos .carousel-control-next-icon {\n    position: absolute;\n    top: 80px;\n    right: 40px;\n}\n\n#videos .carousel-control-prev-icon {\n    position: absolute;\n    top: 80px;\n    Left: 40px;\n}"],"file":"styles.css"}