@charset "utf-8";
/* CSS Document */

body {font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; height: 100%; margin: 0;}
html {height: 100%; margin: 0;}

/* Create full screen background image */
.bgimg {position: relative;opacity: 0.8;background-position: center;background-repeat: no-repeat;background-size: cover;background-image: url("it_bg_01.jpg");height: 100%;}

/* Wrapper div to define content width and centred position */
.wrapper {width: 700px;margin: auto;}

/* Setup the buttons size, shape and other parameters */
.btn {border: 3px solid black;background-color: white;color: black;font-size: 1.2em;font-weight: bold;cursor: pointer;border-radius: 5px;height:120px;width: 210px;float: left;margin: 5px;text-align: center;vertical-align: middle;line-height: 120px;}
.btn a {display: block;height: 120px;width: 210px;text-decoration: none;}

/* Page title block - recoloured by .green, .red, .blue and .orange for individual pages */
.banner {border: 3px solid black;background-color: white;color: black;font-size: 1.2em;font-weight: bold;border-radius: 5px;height:80px;width: 662px;float: left;margin: 10px 5px;text-align: center;vertical-align: middle;line-height: 80px;}

/* UoC footer box */
.footer {border: 3px solid black;background-color: white;color: black;font-size: 1em;border-radius: 5px;height:20px;width: 644px;float: left;margin: 5px;padding:10px;text-align: center;}

/* Holding div for displaying video on individual pages */
.video {border: 3px solid black;background-color: white;color: black;font-size: 1em;font-weight: bold;border-radius: 5px;width: 642px;float: left;padding: 10px;margin: 5px;text-align: center;}	

/* Useful links block - recoloured links defined by .green, .red, .blue and .orange for individual pages */
.info {border: 3px solid black;background-color: white;color: black;font-size: 1em;border-radius: 5px;height:110px;width: 426px;float: left;padding:5px;margin: 5px;text-align: center;}	

/* Rotate arrow to point left on BACK buttons */
span.rotate {transform: rotate(180deg);display: inline-block; font-size: 1.2em;}

/* Grey buttons and boxes */
.default {border-color: #666;color: #333;background: #e7e7e7;}
.default:hover {background: #e7e7e7;}
.default a {color:#333;}
.default a:hover {background: #666;color: #fff;}

/* Green buttons */
.green, .green a {border-color: #4CAF50;color: #008000;}
.green a:visited {color:#666;}
.green:hover, .green a:hover {background-color: #4CAF50;color: #fff;}
.greenheading, .greenbtn a {color:#4CAF50;}
.greenbtn {font-size: 0.9em;}
.greeninfo p a:hover {text-decoration: none;color: #4CAF50; background: white;padding:3px; border: 2px solid #4CAF50;}

/* Blue buttons */
.blue, .blue a {border-color: #2196F3;color: #1E90FF;}
.blue a:visited {color:#666;}
.blue:hover, .blue a:hover {background-color: #2196F3;color: #fff;}
.blueheading, .bluebtn a {color:#2196F3;}
.bluebtn {font-size: 0.9em;}
.blueinfo p a:hover {text-decoration: none;color: #2196F3; background: white;padding:3px; border: 2px solid #2196F3;}

/* Orange buttons */
.orange, .orange a {border-color: #f60;color: #f60;}
.orange a:visited {color:#666;}
.orange:hover, .orange a:hover {background-color: #f60;color: #fff;}
.orangeheading, .orangebtn a {color:#f60;}
.orangebtn {font-size: 0.9em;}
.orangeinfo p a:hover {text-decoration: none;color: #f60; background: white;padding:3px; border: 2px solid #f60;}

/* Red buttons */
.red, .red a {border-color: #f44336;color: #f44336;}
.red a:visited {color:#666;}
.red:hover, .red a:hover {background: #f44336;color: #fff;}
.redheading, .redbtn a {color:#f44336;}
.redbtn {font-size: 0.9em;}
.redinfo p a:hover {text-decoration: none;color: #f44336; background: white;padding:3px; border: 2px solid #f44336;}