/*
 * Author: Damian Dadswell
 * URL: http://kmi.open.ac.uk
 *
 * Theme Name: Enrico Motta
 * URL: http://people.kmi.open.ac.uk/motta/
 * Version: 1.0
 */

/*	################################################################
	1. GENERAL STRUCTURES
################################################################# */

/* Import fonts */
@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,900);
@import url("hoverex-all.css") screen;
@font-face {
  font-family: 'ionicons';
  src: url('../fonts/ionicons.eot'); /* IE9 Compat Modes */
  src: url('../fonts/ionicons.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ionicons.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/ionicons.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ionicons.svg#svgFontName') format('svg'); /* Legacy iOS */
}

*{margin:0;padding:0px;font-family:'Lato', sans-serif;} 
body{background:#2c4170;margin:0;color:#000;}

h1, h2, h3, h4, h5, h6{font-family:'Lato',sans-serif;font-weight:400;margin-left:10px;margin-right:10px;margin-bottom:40px;}

p{padding:0;margin:10px 10px 12px 10px;font-family:'Lato', sans-serif;font-weight:400;font-size:16px;font-size:1.6rem;line-height:1.8;}

html,
body{height:100%;}

.alignleft{float:left;}
.alignright{float:right;}
.aligncenter{margin-left:auto;margin-right:auto;display:block;clear:both;}
.centered{text-align:center}
.mt {margin-top:50px;}
.mb {margin-bottom:50px;}
.mtb {margin-top:50px;margin-bottom:50px;}
.mtb2 { margin-top:100px;margin-bottom:100px;}
.ptb {padding-top:80px;padding-bottom:80px;}
hr{background:#000;border:none;color:black;display:block;height:1px;margin-top:30px;width:100%;}
.clear{clear:both;display:block;font-size:0;height:0;line-height:0;width:100%;}

::-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{ 
	padding:0;
	margin:0;
	text-decoration:none; 
	-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;
	color:#2c4170;
}
a:hover,
a:focus{text-decoration:none;color:#2c4170;}

a.button{background:#2c4170;padding:5px;color:#fff;margin:0;font-weight:400;font-size:12px;font-size:1.2rem;text-transform:uppercase;}
a.button:hover{background:#a7c5d9;color:#fff;}

.nopadding{padding:0px !important;margin:0px;}
.bortop{}
.right{float:right;}
.slideshareWrapper{position:relative;padding-top:0;height:0;overflow:hidden;margin-top:10px;}
.slideshareWrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;}

/* FORMS */
input, textarea{font-size:17px;min-height:40px;border-radius:none;line-height:20px;padding:10px;border:1px solid #b9b9af;margin-bottom:10px;background-color:#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;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;}


/* HEADER SECTION */
#header{background:#a7c5d9;color:#2c4170;}
#header .photo{background:url(../img/enrico-image2.jpg) no-repeat top left #a7c5d9;width:100%;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;margin:45px 0 0 -15px;padding:0;height:544px;}
#header .bio p{margin:40px 10px;font-size:18px;font-size:1.8rem;font-family:'Lato', sans-serif;font-weight:400;}
#header .bio a{border-bottom:1px solid #2c4170;}

/*#header .search{text-align:right;margin-top:15px;margin-right:40px;}
#header .search .screen-reader-text{display:none;}
#header .search input{font-size:14px;min-height:30px;border-radius:2px;line-height:1.4;padding:9px 12px 11px;border:none;margin-bottom:10px;background-color:#fff;-webkit-transition:background-color 0.2s;transition:background-color 0.2s;color:#000;}
#header .search input[type=submit]{content:"Search";color:#000;font-weight:700;margin-left:2px;}
#header .search input[type=submit]:hover{background:#ffc23d;}
#header h1{font-weight:400;line-height:1.4;text-shadow:2px 2px 0px rgba(0, 33, 88, 1);}
#header h3{margin-top:10px;}
#header i{font-size:30px;margin-left:15px;}
#header a i{color:#fff;-webkit-transition:all 0.5s ease-out;-moz-transition:all 0.5s ease-out;-o-transition:all 0.5s ease-out;-ms-transition:all 0.5s ease-out;transition:all 0.5s ease-out;}
#header a:hover i{color:#ffc23d;}*/

#navigation{background:#2c4170;opacity:20;}
#navigation .enrico{}
#navigation .prof{font-weight:300;}
#navigation ul.left{width:49%;float:left;margin:0;padding:13px 0;}
#navigation ul.left li{list-style:none;display:inline;margin:0 -3px 0 0;padding:20px 0;font-size:16px;font-size:1.6rem;font-weight:400;color:#fff;}
#navigation ul.right{float:right;margin:11px 0 0 0;padding:13px 0;}
#navigation ul.right li{list-style:none;display:inline;margin:0 -3px 0 0;padding:15px 20px;font-size:16px;font-size:1.6rem;font-weight:400;}
#navigation ul.right li a{color:#fff;-webkit-transition:none;-moz-transition:none;-o-transition:none;-ms-transition:none;transition:none;}
#navigation ul.right li:hover,#navigation ul.right li.current-menu-item{background:#a7c5d9;}
#navigation u.rightl li:hover a,#navigation ul.right li a:hover{color:#fff;}
#navigation ul.right li.current-menu-item a{color:#000;}


/* NEWS */
#news{background:#ede6e3;padding:80px 0 60px 0;}
.newsimg{max-height:190px !important;overflow:hidden;}
#news h3{margin:0 0 20px 0;padding-bottom:5px;border-bottom:1px solid #000;}
article img{width:100%;margin-top:10px;}
article header{font-size:20px;font-size:2.0rem;margin-top:10px;}
article time{font-size:14px;font-size:1.4rem;}
article p{margin:10px 0;font-size:16px;font-size:1.6rem;}
article a{color:#2c4170;font-weight:400;}


/* TWITTER */
.twitter{-moz-column-width:18em;-webkit-column-width:18em;column-width:18em;-moz-column-gap:.5rem;-webkit-column-gap:.5rem;column-gap:.5rem;width:100% !important;}
.twitter a{outline:none;}
.twitter p{margin:0}
.twitter .twitter-article{width:100%;margin-bottom:20px;}
.twitter .item{display:block;padding:0 0 10px 0;}
.twitter .twitter-pic{float:left;margin:10px 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";}


/* PROJECTS */
#projects{background:#fff;padding:80px 0 0 0;}
#projects img{width:100%;padding:20px 40px;padding:10px;border:1px solid #e6e6e6;}


/* PUBLICATIONS */
#publications{background:#fff;padding:80px 0 60px 0;}
.imageflowpub{float:right;padding:5px 0 0 0;display:block;}
#publications p{margin-bottom:15px;}
#publications a{font-weight:bold;}
.slideshare{margin-top:20px;}


/* TEAM */
#team{background:#fff;padding:80px 0 60px 0;}
.staff{margin:0 auto 60px auto;width:150px;border:1px solid #e6e6e6;padding:20px 0;min-height:280px !important;}
.staff strong{margin-top:10px;display:block;}
.staff p{margin:0 20px;font-size:12px;font-size:1.2rem;}


/* CV */
#cv{background:#fff;padding:80px 0 100px 0;}
#cv a{border-bottom:1px solid #2c4170;}


/* CONTACT */
#contact{background:#fff;padding:80px 0 100px 0;}
#contact label{display:block !important;}
#contact input[type=submit]{background:#2c4170;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;}
#contact input[type=submit]:hover{background:#2c4170;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";filter: alpha(opacity=90);-moz-opacity:0.9;-khtml-opacity:0.9;opacity:0.9;}
#contact input[type=submit]:focus{outline:none;}
.g-recaptcha{margin:30px 10px 40px 10px;}
.alert{background:#ce363c;color:#fff;}


/* FOOTER */
#footer{padding-top:60px;padding-bottom:80px;background-color:#2c4170;}
#footer .kmi{margin:0 25px 0 0;padding:10px 0;}
#footer .ou{margin:0;padding:10px 0;}




/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
	/*------------------------------------------------
	#
	# navigation
	#
	--------------------------------------------------*/
	#navigation ul.left li{display:block;padding:10px 10px 20px 10px;}
	.prof{display:none;}
	/*------------------------------------------------
	#
	# header
	#
	--------------------------------------------------*/
    #header .photo{margin:0 0 0 -15px;}
	.mobile{display:none;}
	/*------------------------------------------------
	#
	# article
	#
	--------------------------------------------------*/
	article{margin-bottom:60px;}
	/*------------------------------------------------
	#
	# projects/technologies
	#
	--------------------------------------------------*/
	#projects img{width:100%;padding:20px 10px;}
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	/*------------------------------------------------
	#
	# navigation
	#
	--------------------------------------------------*/
	#navigation ul.right li{padding:15px 20px 14px 20px;}
	/*------------------------------------------------
	#
	# header
	#
	--------------------------------------------------*/
	#header .photo{background:url(../img/enrico-image2.jpg) no-repeat top left #a7c5d9;width:100%;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;margin:0 0 0 -15px;padding:0;height:544px;}
	#header .bio p{margin:40px 10px;font-size:16px;font-size:1.6rem;font-family:'Lato', sans-serif;font-weight:400;}
	/*------------------------------------------------
	#
	# article
	#
	--------------------------------------------------*/
	article{margin-bottom:60px;}
	/*------------------------------------------------
	#
	# staff
	#
	--------------------------------------------------*/
	.staff{margin:0 auto 60px auto;width:200px;border:1px solid #e6e6e6;padding:20px 0;}
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	/*------------------------------------------------
	#
	# navigation
	#
	--------------------------------------------------*/
	#navigation ul.right li{padding:15px 20px 14px 20px;}
	/*------------------------------------------------
	#
	# header
	#
	--------------------------------------------------*/
	#header .photo{background:url(../img/enrico-image2.jpg) no-repeat top left #a7c5d9;width:100%;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;margin:0 0 0 -15px;padding:0;height:544px;}
	/*------------------------------------------------
	#
	# projects/technologies
	#
	--------------------------------------------------*/
	#projects img{width:100%;padding:20px 60px;}
}