/* * Author: Damian Dadswell * URL: http://kmi.open.ac.uk * * Theme Name: OU Linked Data * URL: https://data.open.ac.uk/ * Version: 2.0 */ /*------------------------------------------------ # # import fonts # --------------------------------------------------*/ @import url("https://fonts.googleapis.com/css?family=Montserrat:400,500,700,900&subset=latin-ext"); @import url("hoverex-all.css") screen; @font-face { font-family:"social-box"; src:url("../fonts/social-box.eot"); src:url("../fonts/social-box.eot?#iefix") format("embedded-opentype"), url("../fonts/social-box.woff") format("woff"), url("../fonts/social-box.ttf") format("truetype"), url("../fonts/social-box.svg#social-box") format("svg"); font-weight:normal; font-style:normal; } [data-icon]:before { font-family: "social-box" !important; content: attr(data-icon); font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "social-box" !important; font-style: normal !important; font-weight: normal !important; font-variant: normal !important; text-transform: none !important; speak: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /*------------------------------------------------ # # general # --------------------------------------------------*/ *{margin:0;padding:0px;font-family:'Montserrat', sans-serif;box-sizing:border-box;} body{background:#171628;height:100%;margin:0;color:#181729;overflow-x:hidden;} h1, h2, h3, h4, h5, h6{font-family:'Montserrat', sans-serif;font-weight:400;margin:10px 0 20px 0;line-height:1.4;} h1{font-size:30px;} h3{margin:0 10px 20px 10px;/*text-indent:20px;*/text-transform:uppercase;font-weight:700;color:#181729;font-size:18px;font-size:1.8rem;} h3.line{position:relative;z-index:1;} h3.line:before{border-top:2px solid #123740;content:"";margin:0 auto; /* this centers the line to the full width specified */ position:absolute; /* positioning must be absolute here, and relative positioning must be applied to the parent */ top:50%;left:0;right:0;bottom:0;width:100%;z-index:-1;} h3.line span{/* to hide the lines from behind the text, you have to set the background color the same as the container */ background:#fff;padding:0 5px;} *:focus, *:active{outline:none !important;} p{padding:0;margin:10px 10px 12px 10px;font-family:'Montserrat', sans-serif;font-weight:400;font-size:17px;font-size:1.7rem;line-height:1.8;} html,body,#hero{width:100%;height:100%;} .alignleft{float:left;margin:8px 40px 0 0;} .alignright{float:right;margin:8px 0 0 40px;} .aligncenter{margin-left:auto;margin-right:auto;display:block;clear:both;} .centered{text-align:center} hr{background:#253659;border:none;color:#253659;display:block;height:2px;margin-bottom:60px;width:25%;text-align:center;margin-left:auto;margin-right:auto;} .clear{clear:both;display:block;font-size:0;height:0;line-height:0;width:100%;} .pointer{cursor:pointer;} .fullwidth{width:100%;margin-bottom:20px;} .nopadding{padding:0px !important;margin:0px;} .margin-top-20{margin-top:20px;} .margin-top-40{margin-top:40px;} .margin-bottom-10{margin-bottom:10px;} .margin-bottom-20{margin-bottom:20px;} .margin-bottom-40{margin-bottom:40px;} .margin-bottom-80{margin-bottom:80px;} .margin-right-20{margin-right:20px;} .desktop{display:block;} .mobile, .phone, .ipadl, .ipadp{display:none;} .fixed{position:fixed;} .absolute{position:relative !important;} .underline{border-bottom:2px solid #253659;} ::-moz-selection{color:#fff;text-shadow:none;background:#312b39;} ::selection{color:#fff;text-shadow:none;background:#312b39;} *, *:after, *:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0;margin:0;} a{color:#253659;background-image:linear-gradient(120deg, #ebb034 0%, #ebb034 100%);background-repeat:no-repeat;background-size:100% 0.2em;background-position:0 88%;transition:background-size 0.25s ease-in;text-decoration:none;padding:8px 3px 6px 3px;} a:hover{color:#253659;background-size:100% 90%;text-decoration:none;} /*a{color:#de833c;text-decoration:none;} a:hover{color:#d66620;text-decoration:none;}*/ a.noborder{color:#171628;background-image:none;text-decoration:none;padding:8px 2px 6px 2px;} a.noborder:hover{background-size:none;text-decoration:none;} /*a.button{clear:both;display:block;background:#fff;padding:10px;margin:20px 0 0 0;color:#000;text-align:center;font-weight:700;border:none;} a.button:hover{background:#dbe0d9;}*/ a.button{background:#ebb034;color:#253659;padding:5px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;line-height:1.0;/* These are technically the same, but use both */overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;/* This is the dangerous one in WebKit, as it breaks things wherever */word-break:break-all;/* Instead use this non-standard one: */word-break:break-word;} a.button span{padding:5px;-webkit-box-decoration-break:clone;box-decoration-break:clone;} a.button:hover{background:#de833c;} button{background:#ebb034;color:#253659;padding:11px 12px 9px 12px;/*margin-right:5px;margin-bottom:5px;*/border:none;border-radius:0;font-size:14px;} button:hover, button:focus{/*background:#c47335;*/background:#de833c;} button .icon{margin-right:5px;} button.copycode i{font-size:20px;} button em, button i{color:#fff !important;} .codeicons a{background:#ebb034;color:#fff;padding:9px 12px 8px 12px;/*margin-right:5px;margin-bottom:5px;*/border:none;border-radius:0;font-size:20px;} .codeicons a:hover{background:#de833c;} .tooltip.top .tooltip-inner{background-color:#fdf6de;color:#171628 !important;} .tooltip.top .tooltip-arrow{border-top-color:#fdf6de;} /*------------------------------------------------ # # colours # --------------------------------------------------*/ .black{color:#181818 !important;} .white{color:#fff !important;} .grey{color:#6b708c !important;} .blue{color:#253659 !important;} .orange{color:#de833c !important;} .yellow{color:#fdf6de !important;} .beige{color:#f2c48c !important;} .blackbg{background-color:#181818 !important;} .whitebg{background-color:#fff !important;} .greybg{background-color:#6b708c !important;} .bluebg{background-color:#253659 !important;} .orangebg{background-color:#de833c !important;} .yellowbg{background-color:#fdf6de !important;} .beigebg{background-color:#f2c48c !important;} /*------------------------------------------------ # # mobile navigation # --------------------------------------------------*/ .scroll-list{} .navbar-toggle{border-color:#000 !important;border-radius:0;} .navbar-toggle:hover,.navbar-toggle:focus{background-color:#f3f3f1 !important;} .navbar-toggle .icon-bar{background-color:#000 !important;border-radius:0;} /*------------------------------------------------ # # modal # --------------------------------------------------*/ .modal{z-index:99999 !important;} .modal-content{border-radius:0;} h4.modal-title{color:#000;font-size:18px;font-size:1.8em;margin:0 10px;font-weight:700;} .modal-header .close{color:#000;} /*------------------------------------------------ # # video/audio iframe responsive design # --------------------------------------------------*/ .video-wrapper{margin-left:auto;margin-right:auto;width:640px;max-width:100%;} .video-container{position:relative;padding-bottom:50%;padding-top:6.25%;height:0;overflow:hidden; } .video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;} .embed-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:100%;margin-left:10px;margin-right:15px;} .embed-container iframe, .embed-container object, .embed-container embed{position:absolute;top:0;left:0;width:100%;height:100%;} /* Responsive IFRAME Embed Encoding Adapts fixed pixel IFRAME sizes and makes them responsive. */ /* First, define the common wrapper elements Padding-top is for the fixed height header of the embedded content */ .youtubeWrapper, .vimeoWrapper, .instagramWrapper{position:relative;padding-top:0;height:0;overflow:hidden;margin-top:10px;} /* Set the padding-bottom for 16:9 aspect ratio video from YouTube & Vimeo */ .youtubeWrapper, .vimeoWrapper{padding-bottom:56.25%;} /* Set padding-bottom for 5:6 aspect ratio Instagram content */ .instagramWrapper{padding-bottom:120%;} /* For each content source, set the IFRAME to be top left and occupy 100% of width and height of the containing DIV wrapper */ .youtubeWrapper iframe, .youtubeWrapper object, .youtubeWrapper embed, .vimeoWrapper iframe, .vimeoWrapper object, .vimeoWrapper embed, .instagramWrapper iframe, .instagramWrapper object, .instagramWrapper embed{position:absolute;top:0;left:0;width:100%;height:100%;} /*------------------------------------------------ # # icons # --------------------------------------------------*/ .icon-fb-02:before{content:"f";} .icon-youtube-07:before{content:"y";} .icon-vimeo-08:before{content:"v";} .icon-twitter-03:before{content:"t";} .icon-slideshare-05:before{content:"s";} .icon-pinterest-09:before{content:"p";} .icon-linkedin-04:before{content:"l";} .icon-g-plus-06:before{content:"g";} /*------------------------------------------------ # # forms # --------------------------------------------------*/ input, textarea{font-size:17px;min-height:40px;border-radius:none;line-height:20px;padding:10px;border:none;margin-bottom:10px;background:#fff;-webkit-transition:background-color 0.2s;transition:background-color 0.2s;} .btn-download{background:#fde3a7;} .btn-conf{border-radius:50px;margin-right:15px;font-size:11px;letter-spacing:1px;text-transform:uppercase;padding:14px 28px 13px 28px;} .btn-clear{background:transparent;color:white;border:2px solid white;} .btn-clear:hover{background:white;color:#2f2f2f;} .dmbutton:hover, .dmbutton:active, .dmbutton:focus{color:#ffffff;background-color:#470d43;border-color:#ffffff;} .dmbutton{background:rgba(0, 0, 0, 0);border:1px solid #ffffff;color:#ffffff;-webkit-border-radius:2px;border-radius:2px;padding-top:1.025rem;padding-right:2.25rem;letter-spacing:0.85px;padding-bottom:1.0875rem;padding-left:2.25rem;font-size:1.55rem;cursor:pointer;/*font-weight:normal;*/line-height:normal;margin:0 0 1.25rem;text-decoration:none;text-align:center;display:inline-block;-webkit-transition:background-color 300ms ease-out;-moz-transition:background-color 300ms ease-out;transition:background-color 300ms ease-out;-webkit-appearance:none;font-weight:normal !important;} /*------------------------------------------------ # # navigation # -------------------------------------------------- .navbar-default{background:#fff;border:none;width:100%;border-radius:0;z-index:9999;position:fixed;padding:5px 0;box-shadow:0px 0px 8px 1px #f9f2aa;} .navbar-default img{margin-top:-7px;} .nav .open > a{background-color:transparent;} .nav .open > a:hover{background-color:transparent;} .nav .open > a:focus{background-color:transparent;} .cr-icon{height:55px;} .cr-icon a{border:none;margin:0;padding:0;} .cr-icon img{height:55px;padding-top:10px;margin-right:20px;} #wrapper{-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;-webkit-transition:all 0.5s ease;padding-left:0;transition:all 0.5s ease;} #wrapper.toggled{padding-left:220px;} #wrapper.toggled #sidebar-wrapper{width:220px;} #wrapper.toggled #page-content-wrapper{margin-right:0px;position:absolute;} #sidebar-wrapper{-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;-webkit-transition:all 0.5s ease;background:#253659;height:100%;left:220px;margin-left:-220px;overflow-x:hidden;overflow-y:auto;transition:all 0.5s ease;width:0;z-index:1000;} #sidebar-wrapper::-webkit-scrollbar{display:none;} #page-content-wrapper{padding-top:70px;width:100%;} .sidebar-nav{list-style:none;margin:0;padding:0;position:absolute;top:0;width:220px;} .sidebar-nav li{display:inline-block;line-height:20px;position:relative;width:100%;padding-top:5px;padding-bottom:5px;} .sidebar-nav li:before{background-color:#253659;content:'';height:100%;left:0;position:absolute;top:0;transition:width 0.2s ease-in;width:3px;z-index:-1;} .sidebar-nav li:first-child a{background-color:#253659;color:#ffffff;} .sidebar-nav li:first-child:before{background-color:#253659;} .sidebar-nav li:before{background-color:#de833c;} .sidebar-nav li:hover:before{transition:width 0.2s ease-in;width:100%;} .sidebar-nav li a{color:#fff;display:block;padding:10px 15px 10px 30px;text-decoration:none;border:none;background-image:none;font-size:17px;font-size:1.7rem;font-weight:300;} .sidebar-nav li a i{margin-right:8px;} .sidebar-nav li.open:hover before{transition:width 0.2s ease-in;width:100%;} .sidebar-nav .dropdown-menu{background-color:#253659;border-radius:0;border:none;box-shadow:none;margin:0;padding:0;position:relative;width:100%;} .sidebar-nav li a:hover, .sidebar-nav li a:active, .sidebar-nav li a:focus, .sidebar-nav li.open a:hover, .sidebar-nav li.open a:active, .sidebar-nav li.open a:focus{background-color:transparent;color:#ffffff;text-decoration:none;} .sidebar-nav > .sidebar-brand{font-size:20px;height:65px;line-height:44px;} button.hamburger{position:fixed;margin:0;top:40px;right:20px;border-radius:50%;} .hamburger{background:#de833c;border:none;display:block;height:60px;position:relative;width:60px;z-index:9999;} ul.sidebar-nav .hamburger{background:#253659;border:none;display:block;height:60px;position:relative;width:60px;z-index:9999;} .hamburger:hover{outline:none;} .hamburger:focus{outline:none;} .hamburger:active{outline:none;} .hamburger.is-closed:before{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:all 0.35s ease-in-out;color:#de833c;content:'';display:block;font-size:14px;line-height:20px;opacity:0;text-align:center;width:100px;} .hamburger.is-closed:hover before{-webkit-transform:translate3d(-100px, 0, 0);transform:translate3d(-100px, 0, 0);-webkit-transition:all 0.35s ease-in-out;display:block;opacity:1;} .hamburger.is-closed:hover .hamb-top{-webkit-transition:all 0.35s ease-in-out;top:10px;} .hamburger.is-closed:hover .hamb-bottom{-webkit-transition:all 0.35s ease-in-out;bottom:10px;} .hamburger.is-closed .hamb-top{-webkit-transition:all 0.35s ease-in-out;background-color:#fff;top:15px;} .hamburger.is-closed .hamb-middle{background-color:#fff;margin-top:-2px;top:50%;} .hamburger.is-closed .hamb-bottom{-webkit-transition:all 0.35s ease-in-out;background-color:#fff;bottom:15px;} .hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom, .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom{height:4px;left:20%;position:absolute;width:60%;} .hamburger.is-open .hamb-top{-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);background-color:#fff;margin-top:-2px;top:50%;} .hamburger.is-open .hamb-middle{background-color:#fff;display:none;} .hamburger.is-open .hamb-bottom{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);background-color:#fff;margin-top:-2px;top:50%;} .hamburger.is-open:before{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:all 0.35s ease-in-out;color:#ffffff;content:'';display:block;font-size:14px;line-height:32px;opacity:0;text-align:center;width:100px;} .hamburger.is-open:hover before{-webkit-transform:translate3d(-100px, 0, 0);transform:translate3d(-100px, 0, 0);-webkit-transition:all 0.35s ease-in-out;display:block;opacity:1;} ul.sidebar-nav .hamburger.is-open .hamb-top, ul.sidebar-nav .hamburger.is-open .hamb-middle, ul.sidebar-nav .hamburger.is-open .hamb-bottom{height:4px;left:20%;position:absolute;width:60%;} ul.sidebar-nav .hamburger.is-open .hamb-top{-webkit-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);background-color:#fff;margin-top:-2px;top:50%;} ul.sidebar-nav .hamburger.is-open .hamb-middle{background-color:#fff;display:none;} ul.sidebar-nav .hamburger.is-open .hamb-bottom{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08);background-color:#fff;margin-top:-2px;top:50%;} ul.sidebar-nav .hamburger.is-open:before{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);-webkit-transition:all 0.35s ease-in-out;color:#ffffff;content:'';display:block;font-size:14px;line-height:32px;opacity:0;text-align:center;width:100px;} .overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0, 0, 0, 0.4);z-index:1;}*/ /*------------------------------------------------ # # navigation # --------------------------------------------------*/ *, *::after, *::before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} *::after, *::before{content:'';} .cd-logo, .cd-nav-trigger{position:fixed;display:inline-block;} .cd-logo{top:28px;left:5%;} .cd-logo img{display:block;} .cd-nav-trigger{top:10px;right:5%;height:40px;width:40px;z-index:999;/* image replacement */overflow:hidden;text-indent:100%;white-space:nowrap;background-image:none;} .cd-nav-trigger .cd-icon{/* icon created in CSS */position:absolute;left:50%;top:50%;bottom:auto;right:auto;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);-o-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);display:inline-block;width:18px;height:3px;background-color:#fff;z-index:10;} .cd-nav-trigger .cd-icon::before, .cd-nav-trigger .cd-icon:after{/* upper and lower lines of the menu icon */position:absolute;top:0;right:0;width:100%;height:100%;background-color:#fff;/* Force Hardware Acceleration in WebKit */-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;/* apply transition to transform property */-webkit-transition:-webkit-transform .3s;-moz-transition:-moz-transform .3s;transition:transform .3s;} .cd-nav-trigger .cd-icon::before{-webkit-transform:translateY(-6px) rotate(0deg);-moz-transform:translateY(-6px) rotate(0deg);-ms-transform:translateY(-6px) rotate(0deg);-o-transform:translateY(-6px) rotate(0deg);transform:translateY(-6px) rotate(0deg);} .cd-nav-trigger .cd-icon::after{-webkit-transform:translateY(6px) rotate(0deg);-moz-transform:translateY(6px) rotate(0deg);-ms-transform:translateY(6px) rotate(0deg);-o-transform:translateY(6px) rotate(0deg);transform:translateY(6px) rotate(0deg);} .cd-nav-trigger::before, .cd-nav-trigger::after{/* 2 rounded colored backgrounds for the menu icon */position:absolute;top:0;left:0;border-radius:50%;height:100%;width:100%;/* Force Hardware Acceleration in WebKit */-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;} .cd-nav-trigger::before{background-color:#de833c;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-delay:0.4s;-moz-transition-delay:0.4s;transition-delay:0.4s;} .cd-nav-trigger::after{background-color:#de833c;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transition-duration:0s;-moz-transition-duration:0s;transition-duration:0s;-webkit-transition-delay:0s;-moz-transition-delay:0s;transition-delay:0s;} .cd-nav-trigger.close-nav::before{/* user clicks on the .cd-nav-trigger element - 1st rounded background disappears */-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);} .cd-nav-trigger.close-nav::after{/* user clicks on the .cd-nav-trigger element - 2nd rounded background appears */-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;transition-duration:0.3s;-webkit-transition-delay:0.4s;-moz-transition-delay:0.4s;transition-delay:0.4s;} .cd-nav-trigger.close-nav .cd-icon{/* user clicks on the .cd-nav-trigger element - transform the icon */background-color:rgba(24, 23, 41, 0);} .cd-nav-trigger.close-nav .cd-icon::before, .cd-nav-trigger.close-nav .cd-icon::after{background-color:#fff;} .cd-nav-trigger.close-nav .cd-icon::before{-webkit-transform:translateY(0) rotate(45deg);-moz-transform:translateY(0) rotate(45deg);-ms-transform:translateY(0) rotate(45deg);-o-transform:translateY(0) rotate(45deg);transform:translateY(0) rotate(45deg);} .cd-nav-trigger.close-nav .cd-icon::after{-webkit-transform:translateY(0) rotate(-45deg);-moz-transform:translateY(0) rotate(-45deg);-ms-transform:translateY(0) rotate(-45deg);-o-transform:translateY(0) rotate(-45deg);transform:translateY(0) rotate(-45deg);} .cd-primary-nav{/* by default it's hidden */position:fixed;left:0;top:0;height:100%;width:100%;padding:80px 5%;z-index:3;background-color:#fde7b8;overflow:auto;/* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */-webkit-overflow-scrolling:touch;visibility:hidden;opacity:0;-webkit-transition:visibility 0s, opacity 0.3s;-moz-transition:visibility 0s, opacity 0.3s;transition:visibility 0s, opacity 0.3s;} .cd-primary-nav li{margin:1.6em 0;text-align:center;text-transform:capitalize;font-weight:700;color:#253659 !important;} .cd-primary-nav a{font-size:20px;font-size:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-transition:color 0.2s;-moz-transition:color 0.2s;transition:color 0.2s;font-weight:400;} .no-touch .cd-primary-nav a:hover{color:#fff;} .cd-primary-nav.fade-in{/* navigation visible at the end of the circle animation */visibility:visible;opacity:1;} @media only screen and (min-width: 768px){ .cd-primary-nav li{margin:1.5em 0;} .cd-primary-nav a{font-size:22px;font-size:2.2rem;} } @media only screen and (min-width: 1170px){ .cd-primary-nav li{margin:1.5em 0;} .cd-primary-nav a {font-size:24px;font-size:2.4rem;} } .cd-overlay-nav, .cd-overlay-content{ /* containers of the 2 main rounded backgrounds - these containers are used to position the rounded bgs behind the menu icon */position:fixed;top:18px;right:5%;height:4px;width:4px;-webkit-transform:translateX(-20px) translateY(20px);-moz-transform:translateX(-20px) translateY(20px);-ms-transform:translateX(-20px) translateY(20px);-o-transform:translateX(-20px) translateY(20px); transform:translateX(-20px) translateY(20px);} .cd-overlay-nav span, .cd-overlay-content span{display:inline-block;position:absolute;border-radius:50%;/* Force Hardware Acceleration in WebKit */-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform;-webkit-transform-origin:50% 50%;-moz-transform-origin:50% 50%;-ms-transform-origin:50% 50%;-o-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);} .cd-overlay-nav.is-hidden, .cd-overlay-content.is-hidden{/* background fades out at the end of the animation */opacity:0;visibility:hidden;-webkit-transition:opacity .3s 0s, visibility 0s .3s;-moz-transition:opacity .3s 0s, visibility 0s .3s;transition:opacity .3s 0s, visibility 0s .3s;} .cd-overlay-nav{/* main rounded colored bg 1 */z-index:2;} .cd-overlay-nav span{background-color:#fde7b8;} .cd-overlay-content{/* main rounded colored bg 2 */z-index:4;} .cd-overlay-content span{background-color:#de833c;} .cd-content {padding:80px 0;width:90%;max-width:768px;margin:0 auto;z-index:1;} .cd-content .cd-intro{height:200px;padding-top:4.6em;} .cd-content h1{text-align:center;font-size:20px;font-size:1.25rem;} .cd-content p{line-height:1.5;color:#a76500;} @media only screen and (min-width:768px){ .cd-content .cd-intro{height:250px;padding-top:6em;} .cd-content h1{font-size:28px;font-size:1.75rem;} .cd-content p{font-size:18px;font-size:1.125rem;line-height:1.8;} } nav li{list-style:none;font-size:26px;font-size:2.6rem;} nav li em{margin-right:5px;} nav li a{color:#de833c;background-image:none;text-decoration:none;padding:8px 2px 6px 2px;} nav li a:hover{color:#181729;text-decoration:none;} /*------------------------------------------------ # # sidebar # --------------------------------------------------*/ .cubes{position:absolute;top:-38.9px;left:20px;} #content .cubes img{margin:0;} #footer .cubes{position:absolute;top:-119px;left:auto;right:225px;} #sidebar{margin-top:10px;} #sidebar video{max-width:100% !important;border:1px solid #e6e6e6;} #sidebar blockquote{position:relative;padding-bottom:1px !important;} #sidebar img{position:relative;width:100%;margin:0 10px 0 10px;} #sidebar a#playvideo{background:none;padding:0;} #content #sidebar .play{position:absolute;z-index:1;top:30%;left:50%;} #sidebar a .play .icon{font-size:50px;color:#de833c;} /*#sidebar strong{margin:10px 0 0 10px;}*/ #sidebar p{margin:0 10px;} #sidebar h3{line-height:1.6;text-indent:0;} #sidebar a.eventimg,#sidebar a.eventimg:hover{border:none;background:none;} #sidebar p.small{color:#000;text-weight:300;} /*#sidebar a{background:#de833c;color:#fff !important;padding:3px 5px;border:none !important;font-weight:400;} #sidebar a:hover{background:#ff8001;}*/ #what .cubes{position:absolute;top:-38.9px;left:auto;right:15px;} #sidebarmobile{background:#56b1e0;padding:20px 0;} #sidebarmobile video{max-width:100% !important;border:1px solid #e6e6e6;} #sidebarmobile blockquote{position:relative;padding-bottom:1px !important;} #sidebarmobile img{position:relative;width:100%;margin:0 10px 0 10px;} #sidebarmobile a#playvideo{background:none;padding:0;} #sidebarmobile .play{position:absolute;z-index:1;top:30%;left:50%;} #sidebarmobile a .play .icon{font-size:50px;color:#de833c;} /*#sidebar strong{margin:10px 0 0 10px;}*/ #sidebarmobile p{margin:0 10px;} #sidebarmobile h3{line-height:1.6;text-indent:0;} #sidebarmobile a.eventimg,#sidebar a.eventimg:hover{border:none;background:none;} #sidebarmobile p.small{color:#000;text-weight:300;} /*#sidebarmobile a{background:#de833c;color:#fff !important;padding:3px 5px;border:none !important;font-weight:400;} #sidebarmobile a:hover{background:#ff8001;}*/ #sidebarmobile .highlight{background:#56b1e0;padding:5px 10px 20px 10px;margin:0 10px 40px 10px;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} #sidebarmobile .highlight small{background:#253659;font-size:12px;font-size:1.2rem;display:inline-block;margin:15px 10px 15px 10px;padding:10px;color:#fff;text-transform:uppercase;} #sidebarmobile .highlight h1{font-size:20px;font-size:2.0rem;} #sidebarmobile .highlight blockquote{margin-left:10px;border-left:3.5px solid #de833c;padding:1px 10px 10px 10px;} #sidebarmobile .highlight blockquote footer{color:#222;} #sidebarmobile .highlight blockquote footer a{color:#222;border-bottom:1px solid #222;} #sidebarmobile video{max-width:100% !important;border:1px solid #e6e6e6;} /*------------------------------------------------ # # banner # --------------------------------------------------*/ #banner{position:relative;padding:0;margin:0;top:0;left:0;background-attachment:fixed;background-size:cover;height:550px;overflow:hidden} #banner .alignleft{margin:0;} #banner .imgtxt{width:680px;margin:auto;position:absolute;top:70%;left:0;right:0;margin-left:auto;margin-right:auto;} #banner .imgicon{width:150px;margin:auto;position:absolute;top:42%;left:0;right:0;margin-left:auto;margin-right:auto;} #banner .imgicon img{position:relative;margin-left: auto;margin-right: auto;} #banner h1{top:0;padding:5px 10px;color:#ebb034;margin:20px auto 0 auto;font-size:35px;font-weight:300;text-align:center;position:relative;text-transform:uppercase;line-height:1.4;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;/*text-shadow:0 2px 3px #fdf6de;filter:progid:DXImageTransform.Microsoft.Glow(Color=#fdf6de,Strength=2);*/} #banner h2{top:1px;color:#ebb034;margin:0 auto;line-height:1.2;font-size:20px;font-weight:300;text-align:center;position:relative;/*text-transform:uppercase;*/-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;/*text-shadow:0 2px 3px #6b708c;filter:progid:DXImageTransform.Microsoft.Glow(Color=#6b708c,Strength=2);*/} /*#banner h2{position:relative;display:inline;padding:0 5px 0 8px;margin:0;background:#d4c691;color:#003772;font-size:16px;font-size:1.6em;font-weight:300;text-transform:uppercase;letter-spacing:0.0625em;line-height:1.4;}*/ #banner p.line{width:100px;border-top:1px solid #333534;margin:0 auto 10px auto;padding:0;} #banner h3{position:relative;display:inline;padding:0 5px 0 8px;background:#003772;color:#e2d39b;font-size:14px;font-size:1.4em;margin:0;font-weight:300;text-transform:uppercase;line-height:1.4;} #banner ul, #banner ul li{margin:0 !important;padding:0 !important;} #banner .hero{margin-top:-14px;} #banner #video-background{position:fixed;right:0;bottom:0;max-width:100%;min-width:100%;min-height:100%;width:auto;height:auto;z-index:-1;background-color:#fff; overflow:hidden;} #banner article{position:absolute;top:0;left:0;right:0;bottom:0;margin:10px;} #rotate div{display:none;} #sub-banner{position:fixed;background:#fff;height:60px;width:100%;z-index:99;-webkit-box-shadow:0 4px 4px -2px #ccc;-moz-box-shadow:0 4px 4px -2px #ccc;box-shadow:0 4px 4px -2px #ccc;} #sub-banner img{display:block;max-height:80%;margin-top:6px;margin-left:auto;margin-right:auto;} #sub-banner a{padding:0 !important;} /*Sentence .sentence{color:#000;font-size:30px;} .wrapper{margin:100px auto;padding:0;position:relative;width:100%;} .slidingVertical{display:inline;text-indent:0;} .slidingVertical span{animation:topToBottom 12.5s linear infinite 0s;-ms-animation:topToBottom 12.5s linear infinite 0s;-webkit-animation:topToBottom 12.5s linear infinite 0s;color:#fff;opacity:0;overflow:hidden;position:absolute;margin-top:40px;text-align:center;width:100%;font-size:40px;font-size:4.0rem;} .slidingVertical span:nth-child(2){animation-delay:2.5s;-ms-animation-delay:2.5s;-webkit-animation-delay:2.5s;} .slidingVertical span:nth-child(3){animation-delay:5s;-ms-animation-delay:5s;-webkit-animation-delay:5s;} .slidingVertical span:nth-child(4){animation-delay:7.5s;-ms-animation-delay:7.5s;-webkit-animation-delay:7.5s;} .slidingVertical span:nth-child(5){animation-delay:10s;-ms-animation-delay:10s;-webkit-animation-delay:10s;} @-moz-keyframes topToBottom{ 0%{opacity:0;} 5%{opacity:0;-moz-transform:translateY(-50px);transform:translateY(-50px);} 10%{opacity:1;-moz-transform:translateY(0px);transform:translateY(0px);} 25%{opacity:1;-moz-transform:translateY(0px);transform:translateY(0px);} 30%{opacity:0;-moz-transform:translateY(50px);transform:translateY(50px);} 80%{opacity:0;} 100%{opacity:0;} } @-webkit-keyframes topToBottom{ 0%{opacity:0;} 5%{opacity:0;-webkit-transform:translateY(-50px);transform:translateY(-50px);} 10%{opacity:1;-webkit-transform:translateY(0px);transform:translateY(0px);} 25%{opacity:1;-webkit-transform:translateY(0px);transform:translateY(0px);} 30%{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px);} 80%{opacity:0;} 100%{opacity:0;} }*/ /*@-ms-keyframes topToBottom{ 0%{opacity:0;} 5%{opacity:0;-ms-transform:translateY(-50px);transform:translateY(-50px);} 10%{opacity:1;-ms-transform:translateY(0px);transform:translateY(0px);} 25%{opacity:1;-ms-transform:translateY(0px);transform:translateY(0px);} 30%{opacity:0;-ms-transform:translateY(50px);transform:translateY(50px);} 80%{opacity:0;} 100%{opacity:0;} }*/ /*------------------------------------------------ # # content # --------------------------------------------------*/ #pattern{background:url("../img/pattern.png") top left repeat-x #fff;height:87px;} #content{background:#253659;padding:60px 0 80px 0;color:#fff;} #content h1{margin-left:20px;margin-right:20px;text-transform:uppercase;text-align:center;} #content h2{margin-top:40px;} #content .highlight{background:#56b1e0;padding:5px 10px 20px 10px;margin:0 10px 40px 10px;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} #content .highlight small{background:#253659;font-size:12px;font-size:1.2rem;display:inline-block;margin:15px 10px 15px 10px;padding:10px;color:#fff;text-transform:uppercase;} #content .highlight h1{font-size:20px;font-size:2.0rem;} #content .highlight blockquote{margin-left:10px;border-left:3.5px solid #de833c;padding:1px 10px 10px 10px;} #content .highlight blockquote footer{color:#222;} #content .highlight blockquote footer a{color:#222;border-bottom:1px solid #222;} #content video{max-width:100% !important;border:1px solid #e6e6e6;} #content h3{text-indent:0;} #content .play{position:absolute;z-index:1;top:25%;left:42%;} #content img{display:block;position:relative;width:100%;margin:10px 10px 10px 10px;} #content .icon{font-size:50px;} #cotnent .experiments a{border:none;display:block;} #content .experiments img{display:block;position:relative;width:95%;margin:0 0 10px 0;border:1px solid #e6e6e6;} #content .experiments strong{display:block;margin:0 0 40px 0;} #content #media hr, #content #talks hr{background:#e6e6e6;border:none;color:#e6e6e6;display:block;height:1px;margin:30px 0 30px 10px;width:96%;z-index:999;} #content #publications ul li{list-style:none;font-family:'Montserrat', sans-serif;font-weight:400;font-size:16px;font-size:1.6rem;line-height:1.6;border-top: 1px solid #e6e6e6;padding: 20px 0 20px 0;} #content #publications ul li:first-child{border-top:none;} #content #links small{display:block;margin:0 10px 20px 10px;padding:20px 0;border-bottom:1px solid #e6e6e6;} #content #events article{background:#ffe5d5;border:none;padding:15px;margin:0 10px 20px 10px;} #events article a{/* These are technically the same, but use both */overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;/* This is the dangerous one in WebKit, as it breaks things wherever */word-break:break-all;/* Instead use this non-standard one: */word-break:break-word;/* Adds a hyphen where the word breaks, if supported (No Blink) */-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto;} #content ul.noliststyle{padding:0px 10px 20px 10px;list-style:none;} #content ul.noliststyle li{display:inline-block;list-style:none;margin-right:5px;margin-bottom:10px;line-height:1.6;} #content section{margin-bottom:25px;} #content section header{background:#1B2740;color:#fff;border:1px solid #1B2740;padding:10px;margin:0;} #content section header h1{font-size:20px;font-size:2.0rem;margin:0;padding:0;text-align:left;font-weight:700;} #content section header p{font-size:14px;font-size:1.4rem;margin:10px 0 0 0;padding:0;} #content section ul{background:#fff;border:1px solid #253659;padding:25px 10px 20px 10px;list-style:none;} #content section ul li{list-style:none;display:inline-block;margin-right:5px;line-height:2.0;margin-bottom:5px;} #content section ul li a{background:#ebb034;color:#253659;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;padding:5px 0;} #content section ul li a span{padding:5px;-webkit-box-decoration-break:clone;box-decoration-break:clone;} #content section ul li a:hover{background:#de833c;} ul li, ol li{font-size:17px;font-size:1.7rem;} /*#content section ul li a::before, #content section ul li a::after{ content: ''; position: absolute; width: 10px; height: 10px; transition: all 0.3s ease; } #content section ul li a::before{ top: -2.5%; left: -1%; border-top: 2px solid 000; border-left: 2px solid 000; } #content section ul li a::after{ bottom: -2.5%; right: -1%; border-bottom: 2px solid 000; border-right: 2px solid 000; } #content section ul li a:hover:before, #content section ul li a:hover:after{ width: 100%; height: 100%; transition: all 0.3s ease; }*/ /*------------------------------------------------ # # changelog # --------------------------------------------------*/ #changelog{background:#253659;padding:60px 0 80px 0;color:#fff;} #changelog h1{margin:10px;} #changelog h2{margin:10px 10px 0 10px;} #changelog h1 a{padding-bottom:10px !important;padding-left:10px;padding-right:8px;} time{display:block;margin:0 10px 20px 10px;} pre{display:block;padding:15px;margin:10px;font-size:14px !important;line-height:1.42857143;color:#312b39;word-break:break-all;word-wrap:break-word;background-color:#f7f7f7;border:1px solid #312b39;border-radius:5;} .codeicons{font-size:20px;text-align:right;} .codeicons a{padding-left:8px;padding-right:8px;padding-bottom:9px !important;} .codeicons a:hover{} #changelog ul{margin-left:40px;} #changelog ul li{margin:10px 0;} #results{background:#253659;padding:60px 0 80px 0;color:#fff;} #results h1{margin:10px;} #results h2{margin:10px 10px 0 10px;} #results h1 a{padding-bottom:10px !important;padding-left:10px;padding-right:8px;} #results p.dataurl{margin:-10px 10px 0 10px;} #results p.dataurl a{color:#fff;/*border-bottom:2px solid #fff;background-size:100% 90%;*/text-decoration:none;} /*------------------------------------------------ # # social # --------------------------------------------------*/ #social{background:#123740;padding:18px 0 10px 0;} #social .icon{display:inline;color:#253659;font-size:30px;margin-right:20px;-webkit-transition:background-color .4s linear, color .4s linear;-moz-transition:background-color .4s linear, color .4s linear;-o-transition:background-color .4s linear, color .4s linear;-ms-transition:background-color .4s linear, color .4s linear;transition:background-color .4s linear, color .4s linear;} #social .icon:hover{color:#56b1e0;} /*------------------------------------------------ # # what is open blockchain # --------------------------------------------------*/ #general{background:#fff;padding:0 0 25px 0;} #pubsmedia{background:#d5bfb2;padding:100px 0 25px 0;} #lnktlkvnts{background:#d5bfb2;padding:50px 0 50px 0;} #publications p{padding:15px 0 10px 0;border-top:3px solid #ccb7aa;} #publications h3.widget-title{display:none;} #publications ul{margin:0 10px;padding:0;} #publications ul li{list-style:none;font-family:'Montserrat', sans-serif;font-weight:400;font-size:16px;font-size:1.6rem;line-height:1.6;border-top: 3px solid #ccb7aa;padding: 13px 0 15px 0;} #publications ul li:first-child{border-top:none;} #publications .rss-date{display:block;font-weight:400;font-size:12px;font-size:1.2rem;text-transform:uppercase;} #publications a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #publications a.read-more:hover{background:#ff8001;border:none;} #links h3{display:block;text-indent:0;margin:0 10px 10px 10px;} #links p{margin:10px;} #links small{display:block;margin:0 10px 20px 10px;padding-bottom:20px;border-bottom:3px solid #ccb7aa;} #links a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #links a.read-more:hover{background:#d66620;border:none;} #media h3, #talks h3{background-color:#ffe5d5;color:#333;display:inline;font-size:20px;margin:0 10px 20px 10px;padding:4px;line-height:1.6;} #media hr, #talks hr{background:#ccb7aa;border:none;color:#ccb7aa;display:block;height:3px;margin:30px 0 30px 10px;width:96%;z-index:999;} #media em,#talks em{font-weight:300;font-size:16px;} #media article.feeds{padding:0 10px;} #media article.feeds h1{font-size:16px;font-size:1.6rem;} #media article.feeds time{display:block;font-size:12px;font-size:1.2rem;font-weight:400;text-transform:uppercase;} #media article.feeds p{margin:0;font-size:16px;font-size:1.6rem;} #media article.feeds img{display:none;} #media a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #media a.read-more:hover{background:#d66620;border:none;} #talks{font-size:16px;font-size:1.6rem;} #talks ul{margin:0 0 0 40px;list-style:square;} #talks ul li{font-size:16px;font-size:1.6rem;} #talks h3 .icon{text-indent:1px; padding-left:0;margin-left:0;margin-right:10px;} #talks iframe{width:95% !important;margin:15px 10px 0 10px;border:none;} #talks .twitter-tweet{margin-left:10px !important;} #talks .embed-container{margin-left:0;margin-right:0;} #talks a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #talks a.read-more:hover{background:#d66620;border:none;} #talks blockquote footer{margin-top:10px;color:#000;} #events a.eventimg{border:none;} #events article{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAKElEQVQIW2NkQANPzx34z4gsBhKQNnJghAvCBECKwILIAmBBdAGQIADi1hN4BpM+TgAAAABJRU5ErkJggg==) repeat;border:1px solid #ffe5d5;padding:15px;} #events article a{/* These are technically the same, but use both */overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;/* This is the dangerous one in WebKit, as it breaks things wherever */word-break:break-all;/* Instead use this non-standard one: */word-break:break-word;/* Adds a hyphen where the word breaks, if supported (No Blink) */-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto;} #events .icon{margin-left:3px;} #event img{width:100% !important;height:auto;} #events a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #events a.read-more:hover{background:#d66620;border:none;} #courses h3{background-color:#ffe5d5;color:#333;display:inline;font-size:20px;margin:0 10px;padding:4px;line-height:1.6;} #courses .row{max-width:100%;margin-left:0;margin-right:0;overflow:hidden;} /*#courses .col-lg-6, #content .col-md-6, #content .col-sm-6{padding-left:0;padding-right:0;}*/ #courses a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #courses a.read-more:hover{background:#d66620;border:none;} /*------------------------------------------------ # # what is open blockchain # --------------------------------------------------*/ #what{background:#fff;padding:20px 0 40px 0;border-bottom:1px solid #e6e6e6;} #what h1{margin:0 10px;} #what h2{font-size:20px;text-transform:uppercase;font-weight:700;text-align:center;} #what p{font-size:16px;font-size:1.6rem;font-weight:400;line-height:1.8;} #what .highlight{background:#56b1e0;padding:5px 10px 20px 10px;margin:0 10px 40px 10px;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} #what .highlight small{background:#253659;font-size:12px;font-size:1.2rem;display:inline-block;margin:15px 10px 0 10px;padding:10px;color:#fff;text-transform:uppercase;} #what .highlight h1{font-size:20px;font-size:2.0rem;} #what .highlight blockquote{margin-left:10px;border-left:3.5px solid #de833c;padding:1px 10px 10px 10px;} #what .highlight blockquote footer{color:#222;} #what .highlight blockquote footer a{color:#222;border-bottom:1px solid #222;} #what a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;} #what a.read-more:hover{background:#d66620;border:none;} #what video{max-width:100% !important;border:1px solid #e6e6e6;} #what .highlight-ioc{background:#de833c;color:#fff;padding:5px 10px 20px 10px;margin:0 10px 40px 10px;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} #what .highlight-ioc small{background:#de833c;font-size:12px;font-size:1.2rem;display:inline-block;margin:15px 10px 0 10px;padding:10px;color:#fff;text-transform:uppercase;} #what .highlight-ioc a{color:#fff;} #what .highlight-ioc h1{color:#fff;font-size:20px;font-size:2.0rem;margin-top:20px;margin-bottom:10px;} #what .highlight-ioc blockquote{margin-left:10px;border-left:3.5px solid #de833c;padding:1px 10px 10px 10px;color:#fff;} #what .highlight-ioc blockquote footer{color:#222;} #what .highlight-ioc blockquote footer a{color:#222;border-bottom:1px solid #222;} .highlight-sidebar{background:#dbe0d9;padding:1px 10px 20px 10px;margin:0 10px 40px 10px;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} .highlight-sidebar small{background:#253659;font-size:12px;font-size:1.2rem;display:inline-block;margin:15px 10px 0 10px;padding:10px;color:#fff;text-transform:uppercase;} .highlight-sidebar small a{color:#fff;border-bottom:1px solid #fff;} .highlight-sidebar h1{font-size:20px;font-size:2.0rem;} .highlight-sidebar a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;font-size:14px;font-size:1.4rem;} .highlight-sidebar a.read-more:hover{background:#d66620;border:none;} /*------------------------------------------------ # # about # --------------------------------------------------*/ #about{background:#fff;padding:60px 0 80px 0;} #about h1{margin:10px 10px 15px 10px;} #about h2{text-align:center;} #about .imgtxt{position:absolute;top:70%;left:5%;text-align:left;} #about .imgtxt h2{background:#253659;font-size:15px;font-size:1.5rem;text-align:left;display:inline;color:#fdf6de;text-transform:uppercase;padding:2px 5px;line-height:1.5;cursor:pointer;} /*------------------------------------------------ # # demos # --------------------------------------------------*/ #demos{background:#fff;padding:100px 0;} #demos h2{font-size:20px;text-transform:uppercase;font-weight:700;} /*#demos .wp-video{width:100% !important;height:auto !important;margin:40px 10px 10px 10px}*/ #demos .play{position:absolute;z-index:1;top:35%;left:50%;} #demos img{position:relative;width:100%;margin:10px 10px 10px 10px;} #demos strong{display:block;text-align:center;margin-top:10px;margin-bottom:40px;} #demos a .play .icon{font-size:50px !important;} #demos a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #demos a.read-more:hover{background:#d66620;border:none;} #demos a .icon{font-size:14px;font-size:1.4rem;} /*------------------------------------------------ # # consultancy # --------------------------------------------------*/ #feeds{background:#253659;margin-top:0px;padding:100px 0;color:#fff;} #feeds h1{font-size:16px;font-size:1.6rem;} #feeds h2{font-size:20px;text-transform:uppercase;font-weight:700;} #feeds h3{font-size:18px;text-transform:none;text-indent:0;font-weight:700;text-align:left;padding:0;margin:30px 10px 10px 10px;color:#fff;} #feeds h3.widget-title{display:none;} #feeds ul{margin:0 10px;list-style:none;} /*#feeds li a{background:#de833c;color:#fff;border:none;font-size:18px;font-size:1.8rem;padding:3px;} #feeds li a:hover{background:#ff8001;}*/ #feeds li .rss-date{display:block;font-size:12px;font-size:1.2rem;font-weight:400;text-transform:uppercase;margin:5px 0 10px 0;} #feeds li .rssSummary{margin:0 0 40px 0;font-size:16px;font-size:1.6rem;} #feeds img{display:none;} /*------------------------------------------------ # # team # --------------------------------------------------*/ #team{background:#e1efff;padding:100px 0;font-size:16px;font-size:1.6rem;} #team a{z-index:9999 !important;border-bottom:none;} #team h2{/*font-size:20px;*/text-transform:uppercase;font-weight:700;} #team h3{text-indent:0;} #team p{margin:10px 0;} #team strong{font-size:20px;font-size:2.0rem;} #team .subteam{margin-top:20px;} #team .subteam strong{font-size:16px;font-size:1.6rem;} #team .subteam em{font-size:14px;font-size:1.4rem;} #team .icon{display:inline;margin-right:5px;font-size:20px;} #team a.social{display:inline;margin-right:5px;font-size:20px;} #team p a:empty{display:none !important;} #team ul{margin-top:0;} #team ul li{list-style:none;display:inline-block;} #team ul li a {border:none !important;} #team .member{margin-bottom:60px;} #team img{-webkit-filter:grayscale(1);filter:grayscale(1);max-width:100%;} #team a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:18px;font-size:1.8rem;} #team a.read-more:hover{background:#d66620;border:none;} #team a.read-more .icon{font-size:14px;font-size:1.4rem;} #fullteam{padding:10px 0;font-size:16px;font-size:1.6rem;} #fullteam a{z-index:9999 !important;border-bottom:none;} #fullteam h2{/*font-size:20px;*/text-transform:uppercase;font-weight:700;} #fullteam h3{text-indent:0;} #fullteam p{margin:10px 0;} #fullteam strong{font-size:20px;font-size:2.0rem;} #fullteam .subteam{margin-top:20px;} #fullteam .subteam strong{font-size:16px;font-size:1.6rem;} #fullteam .subteam em{font-size:14px;font-size:1.4rem;} #fullteam .icon{display:inline;margin-right:5px;font-size:20px;} #fullteam a.social{display:inline;margin-right:5px;font-size:20px;} #fullteam p a:empty{display:none !important;} #fullteam ul{margin-top:30px;} #fullteam ul li{list-style:none;display:inline-block;} #fullteam ul li a {border:none !important;} #fullteam .member{margin-bottom:60px;} #fullteam img{-webkit-filter:grayscale(1);filter:grayscale(1);border:none;padding:0;margin:0;} #fullteam a.read-more{background:#de833c;color:#fff;padding:5px 10px;float:right;border:none;font-size:14px;font-size:1.4rem;} #fullteam a.read-more:hover{background:#d66620;border:none;} #fullteam a.read-more .icon{font-size:14px;font-size:1.4rem;} /*------------------------------------------------ # # impact # --------------------------------------------------*/ #impact{background:#171628;padding:60px 0 80px 0;} #impact h1{color:#fff;} #impact a{padding:0;} th, td{padding:20px;color:#fff;/*border:2px solid #fff;*/font-size:16px;font-size:1.6rem;} th{border-top:none !important;font-weight:normal;} th:first-child{border-left:none !important;} td:first-child{border-left:none !important;} div.vertical{margin-left:-45px;margin-top:-20px;position:absolute;width:95px;-webkit-transform:rotate(-90deg);/* Safari/Chrome */-moz-transform:rotate(-90deg);/* Firefox */-o-transform:rotate(-90deg);/* Opera */-ms-transform:rotate(-90deg);/* IE 9 */transform:rotate(-90deg);} th.vertical{height:100px;line-height:14px;padding-bottom:20px;text-align:left;} .pie-wrap{height:20px;position:relative;} .pie-wrap:before{content:"";display:block;background-color:#de833c;position:absolute;border-radius:50%;width:20px;height:20px;top:0;left:-3px;} /*------------------------------------------------ # # search # --------------------------------------------------*/ #search{background:#171628;padding:30px 0 40px 0;} #search form{position:relative;width:50%;margin:0 auto;} #search input[type="search"]{background:none;border:none;width:100%;border-bottom:3px solid #fff;font-size:20px;font-size:2.0rem;color:#fff;line-height:1.4;} input[type="search"]::placeholder{color:#fff;font-weight:700;} #search .form-control-feedback{line-height:4;color:#fff;} /*------------------------------------------------ # # cards # --------------------------------------------------*/ .wrimagecard{margin-top:0;margin-bottom:1.5rem;text-align:left;position:relative;background:#fff;box-shadow:6px 7px 10px 0px rgba(46,61,73,0.15);border-radius:0px;transition:all 0.3s ease;} .wrimagecard .fas{position:relative;font-size:70px;color:#171628;} .wrimagecard-topimage_header{padding:30px 20px;} a.wrimagecard:hover, .wrimagecard-topimage:hover{box-shadow:2px 4px 8px 0px rgba(46,61,73,0.2);} .wrimagecard-topimage a{width:100%;height:100%;display:block;} .wrimagecard-topimage_title{padding:20px 24px;padding-bottom:0.75rem;position:relative;} .wrimagecard-topimage a{border-bottom:none;text-decoration:none;color:#525c65;transition:color 0.3s ease;} .badge{background:#171628;} .accordion{margin-top:20px;margin-bottom:10px;} .accordion .card.projects{background:#0A2E45;} .accordion .card.publications{background:#0f476c;} .accordion .card.courses{background:#1772ab;} .accordion .card h5{margin-top:0;margin-bottom:2px;} .accordion .card button{width:100%;color:#fff;font-weight:700;text-decoration:none;text-align:left;} .accordion .card .badge{top:2px;background:#fff;color:#171628;} .accordion .card ul{background:#fff;list-style:none;} .accordion .card ul li{padding:10px 5px;list-style:none;} .accordion .card p{background:#fff;margin:0;padding:10px 5px;font-size:14px;font-size:1.4rem;} .accordion .card a{display:inline;color:#171628;background-image:linear-gradient(120deg, #de833c 0%, #de833c 100%);background-repeat:no-repeat;background-size:100% 0.2em;background-position:0 88%;transition:background-size 0.25s ease-in;text-decoration:none;padding:8px 2px 6px 2px;} .accordion .card a:hover{color:#171628;background-size:100% 90%;text-decoration:none;} /*------------------------------------------------ # # news # --------------------------------------------------*/ #news{background:#fff;padding:100px 0;} #news h2{font-size:20px;text-transform:uppercase;font-weight:700;text-align:center;margin-bottom:40px;} .first-news{background:#ffcc98;} .second-news{background:#a4bad2;} .third-news{background:#fff9b9;} article{margin-bottom:40px;padding:30px;} article img{width:100%;margin-top:10px;} #events article img{max-width:300px !important;margin-top:0px;} article h1{font-size:20px;font-size:2.0rem;font-weight:700;padding:0;margin:0 0 5px 0;} article time{font-size:14px;font-size:1.4rem;padding:0;margin:0;} article p{/*margin:10px;*/font-size:16px;font-size:1.6rem;padding:0;margin:10px 0;} article a{font-weight:400;} /*------------------------------------------------ # # contact # --------------------------------------------------*/ #contact{background:#dbe0d9;padding:100px 0;} #contact h2{font-size:20px;text-transform:uppercase;font-weight:700;text-align:center;} #contact a{border:none;} #contact form{margin:0 auto;} #contact ::-webkit-input-placeholder{color:#3a4149;} #contact :-moz-placeholder{/* Firefox 18- */color:#3a4149;} #contact ::-moz-placeholder{/* Firefox 19+ */color:#3a4149;} #contact :-ms-input-placeholder{color:#fff;} #contact label{position:absolute;top:-9999px;left:-9999px;} #contact input[type=text], #contact input[type=email], #contact textarea{display:block;background:#dbe0d9;color:#000;border:2px solid #000;margin:10px auto 20px auto;width:30%;} #contact input:focus, #contact textarea:focus{outline:none;background:#ffcc98;} #contact input[type=submit]{display:block;background:#000;color:#fff;font-weight:400;border-radius:none;border:none;-webkit-transition:.3s ease-out;-moz-transition:.1s linear;-o-transition:.1s ease-out;-ms-transition:.1s ease-out;transition:.1s linear;margin:10px auto;text-align:center;} #contact input[type=submit]:hover{background:#3a4149;} #contact input[type=submit]:focus{outline:none;} #contact input, #contact textarea{-webkit-appearance:none;border-radius:0;} #contact h3.sent{margin:0 0 30px 0;text-indent:0;text-transform:uppercase;font-weight:700;color:#000;font-size:16px;font-size:1.6rem;} .alert{background:#fff;color:#ff8000;border-radius:0;font-size:16px;font-size:1.6rem;} .g-recaptcha{margin:0 10px 40px 0;} /*------------------------------------------------ # # social # --------------------------------------------------*/ #social{background:#dbe0d9;padding:100px 0;} /*------------------------------------------------ # # twitter # --------------------------------------------------*/ #twitter{background:#dbe0d9;} #twitter h2{font-size:20px;text-transform:uppercase;font-weight:700;text-align:left;padding:30px;margin-bottom:0;margin-top:0;} #twitter article{padding:0 30px 30px 30px;margin:0;} #twitter article strong a{font-weight:700;} .twitter{width:100% !important;} .twitter-bird{margin-right:5px;width:16px;} .twitter a{outline:none;} .twitter p{margin:0} .twitter .twitter-article{width:100%;margin-bottom:0px;} .twitter .item{display:block;padding:0 0 0 0;} .twitter .twitter-pic{float:left;margin:0 10px 0 0;} .twitter .tweet-media img{width:90%;margin-top:20px;} .twitter .twitter-text{margin:0;line-height:1.8;} .twitter .tweetprofilelink a.tweetuser{display:none; /*display:block;font-size:17px;font-size:1.7rem;margin:0;padding:0;*/} .twitter .tweet-time{display:block;font-size:14px;font-size:1.4rem;margin-bottom:10px;} .twitter .tweet-content{clear:both;width:100%;float:left;} .twitter #retweet-indicator:after{font-family:'ionicons';color:#ce363c;font-size:21px;float:right;content:"\f201";} /*------------------------------------------------ # # forms # --------------------------------------------------*/ /*form{margin:0 0 5px 0;padding:10px 0 5px 0;text-align:center;background:#f7f7f7;border:1px solid #e6e6e6;}*/ form{margin:0 0 5px 0;padding:10px 0 5px 0;text-align:center;background:#fff;border:none;} form#limit{margin:0 0 5px 0;padding:0;text-align:center;background:none;border:none;} form#queryForm{margin:0 0 5px 0;padding:10px 0 5px 0;background:none !important;border:none;} form label{border-right:2px solid #253659;padding-right:15px;margin-right:15px;width:220px !important;text-align:right;} form input[type=text]{background:#fff;border:none;border:1px solid #e6e6e6;} form input[type=submit]{background:#de833c;color:#fff;padding:11px 12px 9px 12px;/*margin-right:5px;margin-bottom:5px;*/border:none;border-radius:0;font-size:18px;margin-bottom:0;} form input[type=submit]:hover, form input[type=submit]:focus{/*background:#c47335;background:#de833c;*/} /*------------------------------------------------ # # tables # --------------------------------------------------*/ table{background:#fff;width:80%;margin-left:10%;margin-right:10%;color:#fff;border:none !important;} table#query{background:#fff;width:100%;margin-left:0;margin-right:0;color:#171628;border:none !important;} table#downloads{background:#fff;width:100%;margin-left:0;margin-right:0;color:#171628;border:none !important;} table#results{background:#fff;width:100%;margin-left:0;margin-right:0;color:#171628;border:none !important;} table#results td, table#results th{border:2px solid #253659 !important;} table#results thead th{text-align:center;} table#results tbody th{text-align:right;vertical-align:top;} table thead, table tfoot{background:#253659;border:none !important;} .vtext{writing-mode:vertical-rl;} a.vtext{color:#fff;background-image:none;} table thead tr th{font-weight:bold;} table tbody tr:nth-child(odd){background:#53607c;} table tbody tr:nth-child(even){background:#7c869b;} table tbody tr:hover{background:#de833c;} table#query tbody tr:nth-child(odd):hover{background:#53607c;} table#query tbody tr:nth-child(even):hover{background:#7c869b;} table#downloads tbody tr:nth-child(odd):hover{background:#53607c;} table#downloads tbody tr:nth-child(even):hover{background:#7c869b;} table#downloads tbody tr td:hover{background:#de833c;} table tbody a{color:#fff;/*border-bottom:2px solid #fff;*/} table tbody a:hover{color:#fff;} table tbody td a{/* These are technically the same, but use both */overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;/* This is the dangerous one in WebKit, as it breaks things wherever */word-break:break-all;/* Instead use this non-standard one: */word-break:break-word;} table *::after, table *::before{content:none;} table#query select{color:#171628;border-radius:0 !important;padding:10px 20px;font-size:20px;font-size:2.0rem;-webkit-appearance:none;-moz-appearance:none;background-position:right 50%;background-repeat:no-repeat;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);} table#query textarea{color:#171628;width:100%;text-align:left !important;margin-bottom:0;} table#query td{text-align:left !important;} table ul{margin-left:20px;} table ul li{margin:10px 0;} .tabletitle{background:#de833c;} /*------------------------------------------------ # # footer # --------------------------------------------------*/ #footer{color:#fff;padding-top:60px;margin:0 0 0 -1px;background:url("../img/footer.png") no-repeat;height:269px;} #footer h3{margin-left:20px;} #footer p{margin:10px 20px;} #footer .ou{width:100px;} #footer .kmi{width:150px;} #footer a{color:#fff;background-image:linear-gradient(120deg, #de833c 0%, #de833c 100%);background-repeat:no-repeat;background-size:100% 0.2em;background-position:0 88%;transition:background-size 0.25s ease-in;text-decoration:none;padding:8px 3px 6px 3px;} #footer a:hover{color:#fff;background-size:100% 90%;text-decoration:none;} #footer a.noborder{color:#171628;background-image:none;text-decoration:none;padding:8px 2px 6px 2px;} #footer a.noborder:hover{background-size:none;text-decoration:none;} #footer h3{color:#fff;} #eu-cookie-law{position:fixed !important;padding-top:30px !important;padding-bottom:30px !important;font-size:16px !important;font-size:1.6rem !important;z-index:99999;bottom:0;width:100%;background-color:#56b1e0 !important;color:#000 !important;border:none !important;} #eu-cookie-law a{text-decoration:none !important;} #eu-cookie-law input{border-radius:0 !important;background-color:#de833c !important;font-size:18px !important;font-size:1.8rem !important;font-weight:400 !important;border:none !important;color:#fff !important;} #eu-cookie-law input:hover{background-color:#ff8001 !important;} /* ----------- Retina Screens ----------- */ @media only screen and (min-device-width : 600px) and (max-device-width : 1200px) { /*------------------------------------------------ # # hero # --------------------------------------------------*/ #hero h1{top:160px;width:80%;color:#fff;margin:0 auto;line-height:1;font-size:60px;font-weight:700;text-align:center;position:relative;text-transform:uppercase;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;text-shadow:0 0 3px #17549e; /* Firefox 3.5+, Opera 9+, Safari 1+, Chrome, IE10 */filter:progid:DXImageTransform.Microsoft.Glow(Color=#17549e,Strength=2); /* IE<10 */} } /* Smartphones (portrait and landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /*------------------------------------------------ # # body # --------------------------------------------------*/ .desktop{display:none;} .mobile{display:block;} .phone{display:block;} .ipadp{display:none;} .cube{display:none;} /*------------------------------------------------ # # navigation # --------------------------------------------------*/ button.hamburger{margin-right:-15px !important;} ul.sidebar-nav button.hamburger{margin-right:5px !important;} /*------------------------------------------------ # # hero # --------------------------------------------------*/ #banner h1{top:20px;width:100%;color:#fff;margin:0 auto;line-height:1.4;font-size:42px;font-size:4.2rem;font-weight:700;text-align:center;position:relative;text-transform:uppercase;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;text-shadow:0 2px 3px #000;filter:progid:DXImageTransform.Microsoft.Glow(Color=#000,Strength=2);} #banner h2{top:150px;width:100%;color:#000;margin:0 auto;line-height:1;font-size:30px !important;font-size:3.0rem !important;font-weight:700;text-align:center;position:relative;text-transform:uppercase;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;text-shadow:0 2px 3px #fff;filter:progid:DXImageTransform.Microsoft.Glow(Color=#fff,Strength=2);} /*------------------------------------------------ # # twitter # --------------------------------------------------*/ /*#social h2{display:none !important;} #social #twitter{display:none !important;}*/ /*------------------------------------------------ # # search # --------------------------------------------------*/ #search form{width:80%;} /*------------------------------------------------ # # demos # --------------------------------------------------*/ #demos{padding:50px 0;} /*------------------------------------------------ # # publications, media, links etc... # --------------------------------------------------*/ #pubsmedia{padding:50px 0;} /*------------------------------------------------ # # team # --------------------------------------------------*/ #team{padding:50px 0;} /*------------------------------------------------ # # social # --------------------------------------------------*/ #social{background:#dbe0d9;padding:50px 0;} /*------------------------------------------------ # # footer # --------------------------------------------------*/ #eu-cookie-law{position:fixed !important;padding-top:100px !important;padding-bottom:30px !important;font-size:14px !important;font-size:1.4rem !important;z-index:99999;bottom:0;width:100%;background-color:#56b1e0 !important;color:#000 !important;border:none !important;} #eu-cookie-law form{position:absolute !important;top:80px !important;right:10px !important;} } /* iPads (portrait) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { /*------------------------------------------------ # # body # --------------------------------------------------*/ .desktop{display:none;} .mobile{display:block;} .ipadp{display:block;} .phone{display:none;} /*------------------------------------------------ # # hero # --------------------------------------------------*/ #banner h1{top:100px;width:80%;color:#fff;margin:0 auto;line-height:1;font-size:50px;font-weight:700;text-align:center;position:relative;text-transform:uppercase;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;text-shadow:0 2px 3px #000;filter:progid:DXImageTransform.Microsoft.Glow(Color=#000,Strength=2);} /*------------------------------------------------ # # navigation # --------------------------------------------------*/ /*------------------------------------------------ # # about # --------------------------------------------------*/ /*------------------------------------------------ # # twitter # --------------------------------------------------*/ /*------------------------------------------------ # # demos # --------------------------------------------------*/ #demos .play{position:absolute;z-index:1;top:30%;left:50%;} /*------------------------------------------------ # # contact # --------------------------------------------------*/ #contact input[type=text],#contact input[type=email]{width:60%;} #contact textarea{width:60%;} /*------------------------------------------------ # # footer # --------------------------------------------------*/ #footer .cubes{position:absolute;top:-119px;left:auto;right:15px;} #eu-cookie-law{position:fixed !important;padding-top:30px !important;padding-bottom:30px !important;font-size:14px !important;font-size:1.4rem !important;z-index:99999;bottom:0;width:100%;background-color:#56b1e0 !important;color:#000 !important;border:none !important;} } /* iPads (landscape) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { /*------------------------------------------------ # # body # --------------------------------------------------*/ .mobile{display:none;} .ipadl{display:none;} .ipadp{display:none;} .phone{display:none;} /*------------------------------------------------ # # navigation # --------------------------------------------------*/ /*------------------------------------------------ # # hero # --------------------------------------------------*/ /*------------------------------------------------ # # about # --------------------------------------------------*/ /*------------------------------------------------ # # demos # --------------------------------------------------*/ #demos .play{position:absolute;z-index:1;top:25%;left:50%;} #demos img{height:auto;} /*------------------------------------------------ # # team # --------------------------------------------------*/ #team a.social{margin-right:0 !important;} } /*------------------------------------------------ # # clear different height columns # -------------------------------------------------- @media (min-width:1200px){ .auto-clear .col-lg-1:nth-child(12n+1){clear:left;} .auto-clear .col-lg-2:nth-child(6n+1){clear:left;} .auto-clear .col-lg-3:nth-child(4n+1){clear:left;} .auto-clear .col-lg-4:nth-child(3n+1){clear:left;} .auto-clear .col-lg-6:nth-child(odd){clear:left;} } @media (min-width:992px) and (max-width:1199px){ .auto-clear .col-md-1:nth-child(12n+1){clear:left;} .auto-clear .col-md-2:nth-child(6n+1){clear:left;} .auto-clear .col-md-3:nth-child(4n+1){clear:left;} .auto-clear .col-md-4:nth-child(3n+1){clear:left;} .auto-clear .col-md-6:nth-child(odd){clear:left;} } @media (min-width:768px) and (max-width:991px){ .auto-clear .col-sm-1:nth-child(12n+1){clear:left;} .auto-clear .col-sm-2:nth-child(6n+1){clear:left;} .auto-clear .col-sm-3:nth-child(4n+1){clear:left;} .auto-clear .col-sm-4:nth-child(3n+1){clear:left;} .auto-clear .col-sm-6:nth-child(odd){clear:left;} } @media (max-width:480px){ .auto-clear .col-xs-1:nth-child(12n+1){clear:left;} .auto-clear .col-xs-2:nth-child(6n+1){clear:left;} .auto-clear .col-xs-3:nth-child(4n+1){clear:left;} .auto-clear .col-xs-4:nth-child(3n+1){clear:left;} .auto-clear .col-xs-6:nth-child(odd){clear:left;} }*/