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

 	@font-face {
		
		font-family:"outward block";
		src: url("../../fonts/outward-block-webfont.woff2") format('woff2'),
			 url("../../fonts/outward-block-webfont.woff") format('woff'),
			 url("../../fonts/outward-block.ttf") format('ttf');
		font-weight: normal;
		font-style: normal;

	}

	@font-face {
		
		font-family:"outward block";
		src: url("../fonts/outward-block-webfont.woff2") format('woff2'),
			 url("../fonts/outward-block-webfont	.woff") format('woff'),
			 url("../fonts/outward-block.ttf") format('ttf');
		font-weight: normal;
		font-style: normal;
	
	}







	@media screen and (min-width: 1px) and (max-width: 354px) {


		#bar_top {
	    
			background-color: rgb(226,31,38);
			z-index: 999999999999999999999999999;
			height: 10px;
			width: 100%;
			position: fixed;
			display: block;
			margin-top: 0px;
			  
		}
		
		#bar_right {
			
			background-color: rgb(226,31,38);
			height: 25700px;
			width: 10px;
			display: none;
			margin-top: 0px;
			position: relative;
			float: right;
			margin-right: -10.1px;
			z-index: 999999999999999999999999999;
			  
		}
		
		body {	
			
			background: rgb(226,31,38);
			padding-bottom: 0px;
			height: 100%px;
	
		}
		
		#grad {
			
			z-index: 0;
			position: fixed;
			margin-top: -50px;
			width: 3000px;
			margin-left: -800px;
			height:200px;
			background: rgb(226,31,38); /* For browsers that do not support gradients */ /* FF3.6-15 */
			background: -webkit-linear-gradient(rgb(226,31,38) 60%, rgba(255,255,255,0) 100%);
			background: -o-linear-gradient(rgb(226,31,38) 10%, rgb5(255,255,255,0) 100%);
			background: linear-gradient(rgb(226,31,38)) 10%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
		}
		
		h1.style2 {
			
			display: none;
			color: yellow;
			margin-top: 70px;
			z-index: -1;
			font-size: 82vw;
			text-align: center;
			margin: 0px;
			padding-top: 135px;
			padding-bottom: 50px;
			margin-left: 1.2%
			
		}
		
		#footer_logo {
		
			font-family: "outward block";
				letter-spacing: .006em;
				color: red;
				font-size: 20vw;
				font-weight: 100;
				text-align: center;
				padding-top: 70px;
				margin-top: 0;
				margin-bottom: 50px;
				margin: auto;
				text-align: center;
		
		}
		
		#home {
			
			margin-left: 3.5%;
			
		}
		
		#arrow {
			
			display: none;
			font-size: 30px;
			line-height: 1.2;
			
		}
		
		.arrow_hover {
			
			display: none;
			width: 32%;
			margin-bottom: -1px;
			margin-left: -10px;
			
		}
		
		.arrow_hover:hover {
			
			display: none; 
			width: 32%;
			 margin-bottom: -1px;
			 margin-left: -10px;
			 content: url("../../images/Portfolio/Home page/millantv-return-to-top-arrow-hover.png");
			
		}	
		
	
		#millantv_navbar_red {
	
			display: none;
			position: relative;
			width: 63px;
			float: right;
			margin-right: -113px;
			margin-top: 10px;
			float: right;
	
		}
	
		#Brand_Identity_title_navbar {

			display: none;
	
		}

		#Nuestra_Boda_Client {

			display: block;
			margin: auto;
			width: 60%;
			padding-top: 90px;
			padding-bottom: 120px;

		}
			
		#Umqombothi_Title {
	
			display: block;
			width: 70%;
			margin: auto;
			padding-top: 15px;
	
		}
	
		#Umqombothi_Client  {
	
			display: block;
			margin: auto;
			width: 70%;
			padding-top:15px;
			padding-bottom: 150px;
	
		}
	
		#KiffGifComix_Client {
	
			display: block;
			margin: auto;
			width: 60%;
			padding-top: 10px;
			padding-bottom: 120px;
	
		}
	
		#KiffGifComix_Title {
	
			display: block;
			margin: auto;
			width: 60%;
			margin-bottom: 25px;
			margin-top: 40px;
	
		}
	
		#millantv_Client {
	
			display: block;
			width: 50%;
			margin: auto;
			margin-bottom: 160px;
			margin-top: 70px;
	
		}
	
		#Parallelogram_Client {

			display: block; 
			margin-left: 12.1%;
			width: 80%;
			padding-top: 30px;
			padding-bottom: 40px;

		}
		
		#Parallelogram_Client_Bespoke {

			display: block; 
			margin-left: 15%;
			width: 80%;
			padding-top: 30px;
			padding-bottom: 40px;

		}

		#Parallelogram_Title {
	
			display: block;
			margin-left: 12.1%;
			width: 80%;
			padding-top: 30px;
			padding-bottom: 40px;
	
		}

		#Nuestra_Boda_Title {
	
			display: block;
			width: 60%;
			margin: auto;
			margin-bottom: -30px;
	
		}
		
		.Title_Top_Bar {
	
			padding-bottom: 50px; 
			padding-top: 140px; 
			width: 93%; 
			height: 100%; 
			display: block; 
			margin: auto;
	
		}
		
		#Nuestra_Boda_title_board {
	
			display: block;
			margin: auto;
			width: 96%;
	
		}
		
		/* The navigation bar */

		.navbar {
			
			z-index: 3;
			overflow: hidden;
			background-color: white;
			border-top: solid;
			color: rgb(226,31,38);
			position: fixed;
			top: 0;
			width: 94%;
			font-family: "outward block";
			font-size: 50px;
			letter-spacing: .02em;
			margin: auto;
			padding-left: 0px;
			margin: 0px 0px 0px 0px;
			margin-top: 0px;
			border-top-width: 8px;
			margin-left: 0px;
			padding-bottom: 7px;
	
		}

		/* Links inside the navbar */
		
		.navbar a {
			
			letter-spacing: .03em;
			float: left;
			display: block;
			color: red;
			margin: auto;
			margin: 10px 0px 0px 0px;
			word-spacing: 0.03em;
			text-decoration: none;
			margin-left: 24px;
			margin-right: -16px;
		
		}
	
		/* Change background on mouse-over */
		
		.navbar a:hover {
			
			background-color: white;
			color: black;
		
		}
	
		/* Main content */
		
		.main {
		  
			margin-top: 30px; /* Add a top margin to avoid content overlay */
		
		}
	
		#master {		
			
			width: 100%; 
			height: 100%;
			margin: 0 auto; 
			background: rgb(226,31,38);	
			
		}
		
		h1 {
			
            font-family: "outward block";
            letter-spacing: .006em;
            color: red;
            font-size: 45vw;
            font-weight: 100;
            margin-left: 3.5%;
            padding-top: 70px;
            margin-top: 10px;
            margin-bottom: 50px;
            line-height: .86;	
			
		}
			
		.font1 {
			
			
			font-family: Cambria, "Hoefler Text";
		}
		
		#credits {
						
			padding-left: -105px;
			font-family: "tenso", sans-serif;
			font-weight: 350;
			font-style: normal;
			max-width: 1100px;
			width:1200px;
			font-size: 18px;
			letter-spacing: .05em;
			word-spacing: .5px;
			line-height: 1.8;
			color: black;
			margin-left: -70px;
			margin-top: 60px;
			margin-bottom: 60px;
			padding-top: 0;
			transform: scale(.8,1);
				
		}
		
		p {
							
			font-family: "tenso", sans-serif;
			font-weight: 350;
			font-style: normal;
			max-width: 892px;
			font-size: 18px;
			letter-spacing: .05em;
			word-spacing: 0.5px;
			line-height: 1.8;
			color: black;
			margin-left: -3%;
			margin-top: 60px;
			margin-bottom: 60px;
			padding-top: 0;
			transform: scale(.8,1);
			float: left;
	
		}

		.align_horizontal {
		
			display: block;
			margin: auto;
			width: 96%;
			margin-top: 0;
			padding-top: 0;
			
		}
	
		#millantv_logo_red_on_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 280px;
			padding-bottom: 200px;
	
		}
	
		#millantv_logo_black_on_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_large {
			
			display: block;
			width: 85%;
			position: relative;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin: auto;
			margin-top: 180px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_small {
			
			display: block;
			width: 92px;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_large_red {
			
			display: block;
			width: 85%;
			position: relative;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 100px;
			padding-top: 0;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_small_red {
			
			display: block;
			width: 92px;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: ;
			padding-top: 100px;
			padding-bottom: 200px;
	
		}
	
		#millantv_logo_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 150px;
			padding-bottom: 200px;
	
		}
		
		#colour_board_1 {
			
			display: block;
			background-color: rgb(225, 31, 38);
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 1000px;
			padding-top: 0;
			padding-bottom: 40px;
	
		}
	
		#colour_board_2 {
			
			display: block;
			background-color: rgb(225, 31, 38);
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 180px;
			padding-top: 150px;
			padding-bottom: 100px;
	
		}
	
		#homepage_animation {
	
			display: none;
			position: absolute;
			margin: 24%;
			z-index: 1;
			margin-top: 86%;
			width: 54%;
	
		}
		
		.cascade {
			
			display: block;
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			
		}

		#Umqombotho_Logo_1 {

			display: block;
			width: 200px;
			margin: auto;
			margin-bottom: 60px;
			padding-top: 100px;
			margin-top: 0px;
	
		}
	
		#Umqombotho_Logo_2 {
	
			display: block;
			width: 200px;
			margin: auto;
			margin-bottom: 190px;
			margin-top: 50px;
	
		}	
		
		#Umqombothi_Logo_1 {
		
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 25%;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;
			
		}
		
		#Umqombothi_Logo_2 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 98%;

			
		}

		#Umqombothi_Logo_3 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;

			
		}

		#Umqombothi_Logo_4 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;

			
		}
		
		.Umqombothi {
			display: block;
			position: inherit;
			width: 94%;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 8px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Digital_Invite_1 {
			
			width: 98%;
			overflow: auto;
			clear: both;
			display: block;
			position:inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 8px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Digital_Invite_2 {
			
			overflow: auto;
			clear: both;
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 150px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			width: 96.5%;
			
		}
		
		#Umqombothi_Website_Mobile_Display {
			
			display: block;
			width: 98%;
			position: inherit;
			margin: auto;
			margin-bottom: 50px;
			margin-top: 100px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Website_Desktop_Display {
			
			width: 96.5%;
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			padding-top: 60px;
			padding-bottom: 0px;
		
		}
		
		#KiffGifComix_Logo_Square_Gif_1_Mobile {
			
			display: none;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_1_Tablet {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 105px;
			width: 92%;
			
		}
			
		#KiffGifComix_Logo_Square_Gif_1 {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 100px;
			padding-bottom: 105px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_2 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-bottom: 105px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_3 {
	
			display:none;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 10px;
			margin:auto;
			padding-top: 100px;
			padding-bottom: 10px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_4 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 10px;
			margin:auto;
			padding-top: 20px;
			padding-bottom: 10px;
			width:98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_5 {
	
			display:none;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-bottom: 50px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_5_Tablet {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 15px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-top: 0px;
			padding-bottom: 20px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6_1 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 5px;
			margin:auto;
			padding-top: 90px;
			padding-bottom: 0px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6_2 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 100px;
			margin-bottom: 50px;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 90px;
			width: 98%;
		}
		
		#KiffGifComix_Logo_Square_Gif_7_1 {
	
			display:block;
			position: inherit;
			overflow: auto;
			padding-top: 170px;
			padding-bottom: 30px;
			width: 80%;
			margin: auto;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_2 {
	
			display: block;
			overflow:auto;
			padding-top: 150px;
			padding-bottom: 150px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 110%);
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_3 {
	
			display:block;
			position: inherit;
			overflow: auto;
			padding-top: 80px;
			padding-bottom: 150px;
			width: 80%;
			margin: auto;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_4 {
	
			display: block;
			overflow:auto;
			padding-top: 100px;
			padding-bottom: 100px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 85%);
		
		}
			
		#KiffGifComix_Logo_Square_Gif_7_5 {
	
			display: block;
			overflow:auto;
			padding-top: 0px;
			padding-bottom: 150px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 110%);
			
		}
			
		#KiffGifComix_Logo_Square_Gif_8 {
			
			display:block;
			clear: both;
			position: inherit;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			width:100px;
			height: 165px;
			
			transform:          rotate(810deg);
			-ms-transform:      rotate(810deg);
			-moz-transform:     rotate(810deg);
			-webkit-transform:  rotate(810deg);
			-o-transform:       rotate(810deg);
			
		}
			
		nav li a {		
			
			margin: 0;
			color: rgb(241,228,10); 	
			font-weight: normal; 
			line-height: 24px;
			font-size: 17.5px;
			font-weight: bold;
			letter-spacing: 2px;
			word-spacing: -3px;
			font-family: Arial;
			background: rgb(226,31,38);
				
		}
		
		#gifs_1 {
			
			display: block;
			text-align: center;
			margin-top: 0px;
		}
		
		#gifs_2 {
			
			display:block;
			text-align: center;
			margin-top: 10px;
		}
		
		#Next_1 {
			
			display: block;
			width: 70%;
			margin: auto;
			margin-bottom: 100px;
			
		}
		
		#Next_2 {
			
			display: block;
			width: 70%;
			margin: auto;
			margin-bottom: 50px;
			
		}
		
		#Next_Grid {
			
			display: block;
			width: 70%;
			margin: auto;
			margin-top: 0px;
			margin-bottom: 60px;
			
		}
		
		#KiffGifComix_Umqombothi_Animated_Logo {
	
			display: block;
			margin-top: 0px;
			margin-bottom: 0px;
			padding: 0;
			width: 98%;
			
		}
			
		#KiffGifComix_Connor_Goliath_Gif_1 {
			
			clear: both;
			width: 92%;
			margin-top: 0px;
			margin-bottom: 6px;
			text-align: center;
			padding-top: 0px;
			padding-bottom: 0px;
	
		}
		
		#KiffGifComix_Connor_Goliath_Gif_2 {
			
			display: block;
			width: 92%;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			
		}
		
		#KiffGifComix_Connor_Goliath_Gif_3 {
			
			display: block;
			width: 98%;
			margin-top: 10px;
			margin: auto;
				
		}
		
		#KiffGifComix_Animation_Sculpture {
			
			display: block;
			margin-top: 10px;
			margin: auto;
			margin-top: 120px;
			width: 92%;
			
		}
		
		#Gifs_Type_1 {
			
			display: block;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			margin-top: 120px;
			
		}
		
		#Gifs_Type_2 {
			
			display: block;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			margin-top: 0px;
			
		}
		
		#Type_1 {
			
			display: block;
			width: 92%;
			margin: auto;
			margin-bottom: 10px;
			
		}
		
		#Type_2 {
			
			display: block;
			width: 92%;
			margin: auto;
			margin-bottom: 10px;
					
		}
		
		#Second_Row {
			
			text-align: center;
			margin-top: 10px;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_12 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 100px;
			margin-bottom: 50px;
			margin: auto;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_11 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 50px;
			margin-bottom: 0px;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 90px;
			width: 98%;
			
		}

		#Parallelogram_Logo {

			padding-bottom: 0;
			padding-top: 0px;
			width: 97%;
			display: block;
			margin: auto;
			margin-top: 8px;
		
		}	

		#Parallelogram_Logo: hover {

			width: none;
		
		}	
	
		#Parallelogram_1_3_1 {
	
				display: none;
		}
		
		#Parallelogram_1_2 {
				
			padding-bottom: 0;
			padding-top: 0px;
			width: 94%;
			display: block;
			margin: auto;
			margin-top: 8px;
				
		}
			
		#Parallelogram_1_3 {
				
			display: none;
				
		}
			
		#Parallelogram_1_3_Mobile {
				
			padding-bottom: 8px; 
			padding-top: 0px; 
			width: 94%; 
			display: block; 
			margin: auto; 
			margin-top: 8px;
				
		}
	
		#Parallelogram_Urban_Dystopia_Logo {
	
			padding-bottom: 0;
			padding-top: 0px;
			width: 94%;
			display: block;
			margin: auto;
			margin-top: 160px;
			
		}
		
		#Parallelogram_Strip {

			display: block;
			width: 94%;
			margin: auto;
			margin-top: 8px;

		}
		
		#white_background {
			
			z-index: -99px;
			overflow:hidden;
			width: 100%;
			background-color: white;
			margin: auto;
			margin-top: 0px;
			position: relative;
			padding-bottom: 150px;
			
			
			/*To create the bevelled edge on the white rectangle
			
			The main idea is to have 4 gradients that each occupy a quarter of the element's area (one for the bottom left, one for the bottom, on of the top right and one for the top left). Then you set the background to 4 linear gradients with the same color stops (in this case we wanted the corner size to be 10px*, so it was transparent until 10px and then the color we want from 10px) except the corners that are 45deg, 135deg, 225deg and 315deg respectively.
	
			*Actually not exactly 10px, it's the length of the hypotenuse of an isosceles right-angled triangle, which is around 14px*/
			
			
			background: #c00; /* fallback */
			background:
				
				linear-gradient(130deg, transparent 25px, white 0) top left,
				linear-gradient(225deg, transparent 0px, white 0) top right,
				linear-gradient(315deg, transparent 0px, white 0) bottom right,
				linear-gradient(45deg,  transparent 00px, white 0) bottom left;
			
			background-size: 60% 60%;
			background-repeat: no-repeat;
			
			
			border-radius: 0px 0px 30px 30px;
		}
	
		
	}









	@media screen and (min-width: 354px) and (max-width: 490px) {


		#bar_top {
	    
			background-color: rgb(226,31,38);
			z-index: 999999999999999999999999999;
			height: 10px;
			width: 100%;
			position: fixed;
			display: block;
			margin-top: 0px;
			  
		}
		
		#bar_right {
			
			background-color: rgb(226,31,38);
			height: 25700px;
			width: 10px;
			display: none;
			margin-top: 0px;
			position: relative;
			float: right;
			margin-right: -10.1px;
			z-index: 999999999999999999999999999;
			  
		}
		
		body {	
			
			background: rgb(226,31,38);
			padding-bottom: 0px;
			height: 100%px;
	
		}
		
		#grad {
			
			z-index: 0;
			position: fixed;
			margin-top: -50px;
			width: 3000px;
			margin-left: -800px;
			height:200px;
			background: rgb(226,31,38); /* For browsers that do not support gradients */ /* FF3.6-15 */
			background: -webkit-linear-gradient(rgb(226,31,38) 60%, rgba(255,255,255,0) 100%);
			background: -o-linear-gradient(rgb(226,31,38) 10%, rgb5(255,255,255,0) 100%);
			background: linear-gradient(rgb(226,31,38)) 10%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
		}
		
		h1.style2 {
			
			display: none;
			color: yellow;
			margin-top: 70px;
			z-index: -1;
			font-size: 82vw;
			text-align: center;
			margin: 0px;
			padding-top: 135px;
			padding-bottom: 50px;
			margin-left: 1.2%
			
		}
		
		#footer_logo {
		
			font-family: "outward block";
				letter-spacing: .006em;
				color: red;
				font-size: 20vw;
				font-weight: 100;
				text-align: center;
				padding-top: 70px;
				margin-top: 0;
				margin-bottom: 50px;
				margin: auto;
				text-align: center;
		
		}
		
		#home {
			
			margin-left: 3.5%;
			
		}
		
		#arrow {
			
			display: none;
			font-size: 30px;
			line-height: 1.2;
			
		}
		
		.arrow_hover {
			
			display: inline;
			width: 32%;
			margin-bottom: -1px;
			margin-left: -10px;
			
		}
		
		.arrow_hover:hover {
			
			 width: 32%;
			 margin-bottom: -1px;
			 margin-left: -10px;
			 content: url("../../images/Portfolio/Home page/millantv-return-to-top-arrow-hover.png");
			
		}		
	
		#millantv_navbar_red {
	
			display: none;
			position: relative;
			width: 63px;
			float: right;
			margin-right: -113px;
			margin-top: 10px;
			float: right;
	
		}
	
		#Brand_Identity_title_navbar {

			display: none;
	
		}

		#Nuestra_Boda_Client {

            display: block;
            margin: auto;
            width: 40%;
            padding-top: 90px;
            padding-bottom: 120px;

		}
			
		#Umqombothi_Title {
	
			display: block;
			width: 50%;
			margin: auto;
			padding-top: 15px;
	
		}
	
		#Umqombothi_Client  {
	
            display: block;
            margin: auto;
            width: 50%;
            padding-top: 15px;
            padding-bottom: 150px;
	
		}
	
		#KiffGifComix_Client {
	
			display: block;
            margin: auto;
            width: 40%;
            padding-top: 10px;
            padding-bottom: 120px;
	
		}
	
		#KiffGifComix_Title {
	
			display: block;
			margin: auto;
			width: 40%;
			margin-bottom: 25px;
			margin-top: 40px;
	
		}
	
		#millantv_Client {
	
            display: block;
            width: 40%;
            margin: auto;
            margin-bottom: 160px;
            margin-top: 70px;
	
		}
	
		#Parallelogram_Client {

    		display: block;
            margin: auto;
            width: 65%;
            padding-left: 0px;
            padding-top: 50px;
            padding-bottom: 40px;

		}
		
		#Parallelogram_Client_Bespoke {

            display: block;
            margin-left: 20%;
            width: 67%;
            padding-top: 30px;
            padding-bottom: 40px;

		}

	
		#Parallelogram_Title {
	
			display: block;
			margin: auto;
			width: 65%;
			padding-top: 30px;
			padding-bottom: 40px;
	
		}

		#Nuestra_Boda_Title {
	
			display: block;
			width: 40%;
			margin: auto;
			margin-bottom: -30px;
	
		}

		#millantv_Title {

			display: block;
			margin: auto;
			width: 40%;
			margin-top: 28px;
			margin-bottom: 20px;

		}
		
		.Title_Top_Bar {
	
			padding-bottom: 50px; 
			padding-top: 160px; 
			width: 93%; 
			height: 100%; 
			display: block; 
			margin: auto;
	
		}
		
		#Nuestra_Boda_title_board {
	
			display: block;
			margin: auto;
			width: 96%;
	
		}
		
		/* The navigation bar */

		.navbar {
			
			z-index: 3;
			overflow: hidden;
			background-color: white;
			border-top: solid;
			color: rgb(226,31,38);
			position: fixed;
			top: 0;
			width: 95.39%;
			font-family: "outward block";
			font-size: 50px;
			letter-spacing: .02em;
			margin: auto;
			padding-left: 0px;
			margin: 0px 0px 0px 0px;
			margin-top: 0px;
			border-top-width: 8px;
			margin-left: 0px;
			padding-bottom: 7px;
	
		}

		/* Links inside the navbar */
		
		.navbar a {
			
			letter-spacing: .03em;
			float: left;
			display: block;
			color: red;
			margin: auto;
			margin: 10px 0px 0px 0px;
			word-spacing: 0.03em;
			text-decoration: none;
			margin-left: 24px;
			margin-right: -16px;
		
		}
	
		/* Change background on mouse-over */
		
		.navbar a:hover {
			
			background-color: white;
			color: black;
		
		}
	
		/* Main content */
		
		.main {
		  
			margin-top: 30px; /* Add a top margin to avoid content overlay */
		
		}
	
		#master {		
			
			width: 100%; 
			height: 100%;
			margin: 0 auto; 
			background: rgb(226,31,38);	
			
		}
		
		h1 {
			
			font-family: "outward block";
			letter-spacing: .006em;
			color: red;
			font-size: 43vw;
			font-weight: 100;
			margin-left: 3.5%;
			padding-top: 70px;
			margin-top: 0;
			margin-bottom: 50px;	
			
		}
			
		.font1 {
					
			font-family: Cambria, "Hoefler Text";

		}
		
		#credits {
						
			padding-left: -105px;
			font-family: "tenso", sans-serif;
			font-weight: 350;
			font-style: normal;
			max-width: 1100px;
			width:1200px;
			font-size: 18px;
			letter-spacing: .05em;
			word-spacing: .5px;
			line-height: 1.8;
			color: black;
			margin-left: -70px;
			margin-top: 60px;
			margin-bottom: 60px;
			padding-top: 0;
			transform: scale(.8,1);
				
		}

		.align_horizontal {
		
			display: block;
			margin: auto;
			width: 96%;
			margin-top: 0;
			padding-top: 0;
			
		}
	
		#millantv_logo_red_on_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 280px;
			padding-bottom: 200px;
	
		}
	
		#millantv_logo_black_on_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_large {
			
			display: block;
			width: 85%;
			position: relative;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin: auto;
			margin-top: 180px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_small {
			
			display: block;
			width: 92px;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 100px;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_large_red {
			
			display: block;
			width: 85%;
			position: relative;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 100px;
			padding-top: 0;
			padding-bottom: 150px;
	
		}
	
		#millantv_logo_black_on_white_small_red {
			
			display: block;
			width: 92px;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: ;
			padding-top: 100px;
			padding-bottom: 200px;
	
		}
	
		#millantv_logo_white {
			
			display: block;
			width: 85%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding-top: 150px;
			padding-bottom: 200px;
	
		}
		
		#colour_board_1 {
			
			display: block;
			background-color: rgb(225, 31, 38);
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 910px;
			padding-top: 150px;
			padding-bottom: 150px;
	
		}
	
		#colour_board_2 {
			
			display: block;
			background-color: rgb(225, 31, 38);
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 180px;
			padding-top: 150px;
			padding-bottom: 100px;
	
		}
	
		#homepage_animation {
	
			display: none;
			position: absolute;
			margin: 24%;
			z-index: 1;
			margin-top: 86%;
			width: 54%;
	
		}
		
		.cascade {
			
			display: block;
			width: 96%;
			position: inherit;
			margin: auto;
			float: inherit;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			
		}
		
		p {
							
			font-family: "tenso", sans-serif;
			font-weight: 350;
			font-style: normal;
			max-width: 892px;
			font-size: 18px;
			letter-spacing: .05em;
			word-spacing: 0.5px;
			line-height: 1.8;
			color: black;
			margin-left: -3%;
			margin-top: 60px;
			margin-bottom: 60px;
			padding-top: 0;
			transform: scale(.8,1);
			float: left;
	
		}

		#Umqombotho_Logo_1 {

			display: block;
			width: 200px;
			margin: auto;
			margin-bottom: 60px;
			padding-top: 100px;
			margin-top: 0px;
	
		}
	
		#Umqombotho_Logo_2 {
	
			display: block;
			width: 200px;
			margin: auto;
			margin-bottom: 190px;
			margin-top: 50px;
	
		}	
		
		#Umqombothi_Logo_1 {
		
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 25%;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;
			
		}
		
		#Umqombothi_Logo_2 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 98%;
			
		}

		#Umqombothi_Logo_3 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;
			
		}

		#Umqombothi_Logo_4 {
			
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: -15px;
			padding: 0px;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 65%;
		
		}
		
		.Umqombothi {

			display: block;
			position: inherit;
			width: 94%;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 8px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Digital_Invite_1 {
			
			width: 98%;
			overflow: auto;
			clear: both;
			display: block;
			position:inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 8px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Digital_Invite_2 {
			
			overflow: auto;
			clear: both;
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 0px;
			margin-top: 150px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			width: 96.5%;
			
		}
		
		#Umqombothi_Website_Mobile_Display {
			
			display: block;
			width: 98%;
			position: inherit;
			margin: auto;
			margin-bottom: 50px;
			margin-top: 100px;
			padding: 0px;
			padding-top: 0px;
			padding-bottom: 0px;
			
		}
		
		#Umqombothi_Website_Desktop_Display {
			
			width: 96.5%;
			display: block;
			position: inherit;
			margin: auto;
			margin-bottom: 8px;
			margin-top: 0px;
			padding: 0px;
			padding-top: 60px;
			padding-bottom: 0px;
		
		}
		
		#KiffGifComix_Logo_Square_Gif_1_Mobile {
			
			display: none;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_1_Tablet {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 105px;
			width: 80%;
			
		}		
		
		#KiffGifComix_Logo_Square_Gif_1 {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 100px;
			padding-bottom: 105px;
			width: 80%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_2 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-bottom: 105px;
			width: 80%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_3 {
	
			display:none;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 10px;
			margin:auto;
			padding-top: 100px;
			padding-bottom: 10px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_4 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 10px;
			margin:auto;
			padding-top: 20px;
			padding-bottom: 10px;
			width:98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_5 {
	
			display:none;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-bottom: 50px;
			width: 92%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_5_Tablet {
			
			clear: both;
			position: relative;
			display: block;
			overflow: auto;
			margin: auto;
			padding-top: 30px;
			padding-bottom: 15px;
			width: 80%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin:auto;
			padding-top: 50px;
			padding-bottom: 20px;
			width: 80%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6_1 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 10px;
			margin-bottom: 5px;
			margin:auto;
			padding-top: 90px;
			padding-bottom: 0px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_6_2 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 100px;
			margin-bottom: 50px;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 90px;
			width: 98%;

		}
		
		#KiffGifComix_Logo_Square_Gif_7_1 {
	
			display:block;
			position: inherit;
			overflow: auto;
			padding-top: 170px;
			padding-bottom: 30px;
			width: 80%;
			margin: auto;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_2 {
	
			display: block;
			overflow:auto;
			padding-top: 150px;
			padding-bottom: 150px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 110%);
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_3 {
	
			display:block;
			position: inherit;
			overflow: auto;
			padding-top: 80px;
			padding-bottom: 150px;
			width: 80%;
			margin: auto;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_7_4 {
	
			display: block;
			overflow:auto;
			padding-top: 100px;
			padding-bottom: 100px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 85%);
		
		}
			
		#KiffGifComix_Logo_Square_Gif_7_5 {
	
			display: block;
			overflow:auto;
			padding-top: 0px;
			padding-bottom: 150px;
			margin: auto;
			width: 80%;
			transform: scale(100%, 110%);
			
		}	
		
		#KiffGifComix_Logo_Square_Gif_8 {
			
			display:block;
			clear: both;
			position: inherit;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			width:100px;
			height: 165px;
			
			transform:          rotate(810deg);
			-ms-transform:      rotate(810deg);
			-moz-transform:     rotate(810deg);
			-webkit-transform:  rotate(810deg);
			-o-transform:       rotate(810deg);
			
		}
		
		nav li a {		
			
			margin: 0;
			color: rgb(241,228,10); 	
			font-weight: normal; 
			line-height: 24px;
			font-size: 17.5px;
			font-weight: bold;
			letter-spacing: 2px;
			word-spacing: -3px;
			font-family: Arial;
			background: rgb(226,31,38);
				
		}
		
		#gifs_1 {
			
			display: block;
			text-align: center;
			margin-top: 0px;
		}
		
		#gifs_2 {
			
			display:block;
			text-align: center;
			margin-top: 10px;
		}
		
		#Next_1 {
			
			display: block;
			width: 50%;
			margin: auto;
			margin-bottom: 100px;
			
		}
		
		#Next_2 {
			
			display: block;
			width: 50%;
			margin: auto;
			margin-bottom: 50px;
			
		}
		
		#Next_Grid {
			
			display: block;
			width: 50%;
			margin: auto;
			margin-top: 0px;
			margin-bottom: 60px;
			
		}
		
		#KiffGifComix_Umqombothi_Animated_Logo {
	
			display: block;
			margin-top: 0px;
			margin-bottom: 0px;
			padding: 0;
			width: 98%;
			
		}
			
		#KiffGifComix_Connor_Goliath_Gif_1 {
			
			clear: both;
			width: 92%;
			margin-top: 0px;
			margin-bottom: 6px;
			text-align: center;
			padding-top: 0px;
			padding-bottom: 0px;
	
		}
		
		#KiffGifComix_Connor_Goliath_Gif_2 {
			
			display: block;
			width: 92%;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			
		}
		
		#KiffGifComix_Connor_Goliath_Gif_3 {
			
			display: block;
			width: 98%;
			margin-top: 10px;
			margin: auto;
					
		}
		
		#KiffGifComix_Animation_Sculpture {
			
			display: block;
			margin-top: 10px;
			margin: auto;
			margin-top: 120px;
			width: 92%;
			
		}
		
		#Gifs_Type_1 {
			
			display: block;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			margin-top: 120px;
			
		}
		
		#Gifs_Type_2 {
			
			display: block;
			text-align: center;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 0px;
			margin-bottom: 0px;
			margin-top: 0px;
			
		}
		
		#Type_1 {
			
			display: block;
			width: 92%;
			margin: auto;
			margin-bottom: 10px;
			
		}
		
		#Type_2 {
			
			display: block;
			width: 92%;
			margin: auto;
			margin-bottom: 10px;
					
		}
		
		#Second_Row {
			
			text-align: center;
			margin-top: 10px;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_12 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 100px;
			margin-bottom: 50px;
			margin: auto;
			padding-top: 100px;
			padding-bottom: 0px;
			width: 98%;
			
		}
		
		#KiffGifComix_Logo_Square_Gif_11 {
	
			display:block;
			position: inherit;
			overflow: auto;
			margin-top: 50px;
			margin-bottom: 0px;
			margin: auto;
			padding-top: 0px;
			padding-bottom: 90px;
			width: 98%;
			
		}

		#Parallelogram_Logo {

			padding-bottom: 0;
			padding-top: 0px;
			width: 97%;
			display: block;
			margin: auto;
			margin-top: 8px;
		
		}	

		#Parallelogram_Logo: hover {

			width: none;
		
		}	
	
		#Parallelogram_1_3_1 {
	
				display: none;
		}
		
		#Parallelogram_1_2 {
				
			padding-bottom: 0;
			padding-top: 0px;
			width: 94%;
			display: block;
			margin: auto;
			margin-top: 8px;
				
		}
			
		#Parallelogram_1_3 {
				
			display: none;
				
		}
			
		#Parallelogram_1_3_Mobile {
				
			padding-bottom: 8px; 
			padding-top: 0px; 
			width: 94%; 
			display: block; 
			margin: auto; 
			margin-top: 8px;
				
		}
	
		#Parallelogram_Urban_Dystopia_Logo {
	
			padding-bottom: 0;
			padding-top: 0px;
			width: 94%;
			display: block;
			margin: auto;
			margin-top: 160px;
			
		}
		
		#Parallelogram_Strip {

			display: block;
			width: 94%;
			margin: auto;
			margin-top: 8px;

		}
		
		#white_background {
			
			z-index: -99px;
			overflow:hidden;
			width: 100%;
			background-color: white;
			margin: auto;
			margin-top: 0px;
			position: relative;
			padding-bottom: 150px;
			
			
			/*To create the bevelled edge on the white rectangle
			
			The main idea is to have 4 gradients that each occupy a quarter of the element's area (one for the bottom left, one for the bottom, on of the top right and one for the top left). Then you set the background to 4 linear gradients with the same color stops (in this case we wanted the corner size to be 10px*, so it was transparent until 10px and then the color we want from 10px) except the corners that are 45deg, 135deg, 225deg and 315deg respectively.
	
			*Actually not exactly 10px, it's the length of the hypotenuse of an isosceles right-angled triangle, which is around 14px*/
			
			
			background: #c00; /* fallback */
			background:
				
				linear-gradient(130deg, transparent 25px, white 0) top left,
				linear-gradient(225deg, transparent 0px, white 0) top right,
				linear-gradient(315deg, transparent 0px, white 0) bottom right,
				linear-gradient(45deg,  transparent 00px, white 0) bottom left;
			
			background-size: 60% 60%;
			background-repeat: no-repeat;
			
			
			border-radius: 0px 0px 30px 30px;

		}
	
		
	}






/*mini-medium resolution media query for small tablets and large phones, 490px to 749px*/

@media screen and (min-width: 490px) {
	
	#bar_top {
	    
        background-color: rgb(226,31,38);
        z-index: 999999999999999999999999999;
        height: 10px;
        width: 100%;
        position: fixed;
        display: block;
        margin-top: 0px;
          
    }
    
    #bar_right {
	    
        background-color: rgb(226,31,38);
        height: 25700px;
        width: 10px;
        display: none;
        margin-top: 0px;
        position: relative;
        float: right;
        margin-right: -10.1px;
        z-index: 999999999999999999999999999;
          
    }
	
	body {	
		
		background: rgb(226,31,38);
		padding-bottom: 0px;
		height: 100%px;

	}
	
	#grad {
		
		z-index: 0;
		position: fixed;
		margin-top: -50px;
		width: 3000px;
		margin-left: -800px;
		height:200px;
		background: rgb(226,31,38); /* For browsers that do not support gradients */ /* FF3.6-15 */
		background: -webkit-linear-gradient(rgb(226,31,38) 60%, rgba(255,255,255,0) 100%);
		background: -o-linear-gradient(rgb(226,31,38) 10%, rgb5(255,255,255,0) 100%);
		background: linear-gradient(rgb(226,31,38)) 10%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
	
	}
	
	h1.style2 {
		
		display: none;
		color: yellow;
		margin-top: 70px;
		z-index: -1;
		font-size: 82vw;
		text-align: center;
		margin: 0px;
		padding-top: 135px;
		padding-bottom: 50px;
		margin-left: 1.2%
		
	}
	
	#footer_logo {
	
		font-family: "outward block";
	    letter-spacing: .006em;
	    color: red;
	    font-size: 20vw;
	    font-weight: 100;
	    text-align: center;
	    padding-top: 70px;
	    margin-top: 0;
	    margin-bottom: 50px;
	    margin: auto;
	    text-align: center;
	
	}
	
	#home {
	    
	    margin-left: 3.5%;
	    
	}
	
	#arrow {
		
	    display: none;
		font-size: 30px;
    	line-height: 1.2;
		
	}
	
	.arrow_hover {
		
        display: inline;
        width: 32%;
        margin-bottom: -1px;
        margin-left: -10px;
		
	}
	
	.arrow_hover:hover {
		
		 width: 32%;
         margin-bottom: -1px;
         margin-left: -10px;
	     content: url("../../images/Portfolio/Home page/millantv-return-to-top-arrow-hover.png");
		
	}	
	
	#Nuestra_Boda_Client  {

        display: block;
        width: 200px;
        margin: auto;
        margin-bottom: 0px;
        padding-top: 110px;

	}

	#Nuestra_Boda_Title {

        display: block;
        width: 200px;
        margin: auto;
        margin-bottom: -30px;

	}

	#Nuestra_Boda_title_board {

		display: none;
		margin: auto;
		width: 96%;

	}

	#millantv_navbar_red {

		display: none;
        position: relative;
        width: 116px;
        margin-top: 19px;
        float: right;
        margin-left: 0;
        margin-right: 0;

	}

	#Brand_Identity_title_navbar {

		display: inline;
        position: relative;
        width: 116px;
        margin-top: 22px;
        float: right;
        margin-left: 0;
        margin-right: 10px;

	}

    #Umqombothi_Client  {

		display: block;
        width: 200px;
        margin: auto;
        margin-bottom: -15px;
        margin-top: 120px;

	}

	#Umqombothi_Title {

        display: block;
        width: 200px;
        margin: auto;
        margin-bottom: -30px;

	}

	#KiffGifComix_Client {

		display: block;
        width: 180px;
        margin: auto;
        margin-bottom: 50px;
        padding-top: 160px;

	}

	#KiffGifComix_Title {

        display: block;
        width: 180px;
        margin: auto;
        margin-bottom: 10px;
        padding-top: 25px;

	}

	#millantv_Client {

		display: block;
        width: 170px;
        margin: auto;
        margin-bottom: 50px;
        padding-top: 140px;

	}

	#millantv_Title {

        display: block;
        margin: auto;
        width: 170px;
        margin-top: 28px;
        margin-bottom: 20px;
	
	}

	#Parallelogram_Client {

		display: block;
        width: 280px;
        margin: auto;
        padding-bottom: 0px;
        padding-top: 150px;
        padding-left: 4%;

	}
	
 	#Parallelogram_Client_Bespoke {

		display: block;
        width: 280px;
        margin: auto;
        padding-bottom: 0px;
        padding-top: 150px;
        padding-left: 4%;

	}   

	#Parallelogram_Title {

		display: block;
        width: 280px;
        margin: auto;
		margin-bottom: 30px;
        padding-top: 20px;

	}

	.Title_Top_Bar {

		padding-bottom: 50px; 
		padding-top: 200px; 
		width: 93%; 
		height: 100%; 
		display: block; 
		margin: auto;

	}

	/* The navigation bar */

	.navbar {
		
    	z-index: 3;
        overflow: hidden;
        background-color: white;
        border-top: solid;
        color: rgb(226,31,38);
        position: fixed;
        top: 0;
        width: 95.39%;
        font-family: "outward block";
        font-size: 50px;
        letter-spacing: .02em;
        margin: auto;
        padding-left: 0px;
        margin: 0px 0px 0px 0px;
        margin-top: 0px;
        border-top-width: 8px;
        margin-left: 0px;
        padding-bottom: 7px;

	}

	/* Links inside the navbar */
	
	.navbar a {
		
	    letter-spacing: .03em;
        float: left;
        display: block;
        color: red;
        margin: auto;
        margin: 10px 0px 0px 0px;
        word-spacing: 0.03em;
        text-decoration: none;
        margin-left: 24px;
        margin-right: -16px;
	
	}

	/* Change background on mouse-over */
	
	.navbar a:hover {
		
    	background-color: white;
	    color: black;
	
	}

	/* Main content */
	
	.main {
	  
		margin-top: 30px; /* Add a top margin to avoid content overlay */
	
	}

	#master {		
		
		width: 100%; 
		height: 100%;
		margin: 0 auto; 
		background: rgb(226,31,38);	
		
	}
	
	h1 {
		
		font-family: "outward block";
		letter-spacing: .006em;
		color: red;
		font-size: 44vw;
		font-weight: 100;
		margin-left: 3.5%;
		padding-top: 70px;
		margin-top: 0;
		margin-bottom: 50px;
			
	}
		
	.font1 {
		
		font-family: Cambria, "Hoefler Text";
	
	}
	
	#credits {
					
		padding-left: -105px;
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		max-width: 1100px;
		width:1200px;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: .5px;
		line-height: 1.8;
		color: black;
		margin-left: -70px;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
			
	}
	
	p {			
			
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		max-width: 892px;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: 0.5px;
		line-height: 1.8;
		color: black;
		margin-left: -3%;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
		float: left;

	}

	#Nuestra_Boda_title_board {

		display: block;
		margin: auto;
		width: 96%;

	}

	.align_horizontal {
		
		display: block;
		margin: auto;
		width: 96%;
		margin-top: 0;
		padding-top: 0;
		
	}

	#millantv_logo_red_on_white {
		
		display: block;
		width: 392px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 280px;
		padding-bottom: 200px;

	}

	#millantv_logo_black_on_white {
		
		display: block;
		width: 392px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 100px;
		padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large {
		
		display: block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin: auto;
        margin-top: 180px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small {
		
        display: block;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large_red {
		
        display: block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 100px;
        padding-top: 0;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small_red {
		
        display: block;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-top: ;
        padding-top: 100px;
        padding-bottom: 200px;

	}

	#millantv_logo_white {
		
		display: block;
        width: 392px;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-top: 0px;
        padding-bottom: 150px;

	}
	
	#colour_board_1 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 96%;
        margin: auto;
        position: relative;
        margin-bottom: 8px;
        margin-top: 700px;
        padding-top: 210px;
        padding-bottom: 100px;

	}

	#colour_board_2 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 96%;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 180px;
        padding-top: 215px;
        padding-bottom: 100px;

	}

	#homepage_animation {

		display: none;
		position: absolute;
        margin: 24%;
        z-index: 1;
        margin-top: 86%;
        width: 54%;

	}
	
	.cascade {
		
		display: block;
		width: 96%;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		
	}	

	#Umqombotho_Logo_1 {

        display: block;
        width: 200px;
        margin: auto;
        margin-bottom: 60px;
        padding-top: 100px;
        margin-top: 0px;

	}

	#Umqombotho_Logo_2 {

		display: block;
        width: 200px;
        margin: auto;
        margin-bottom: 190px;
        margin-top: 50px;

	}		
	
	#Umqombothi_Logo_1 {
	
		display: block;
		position: inherit;
		float: none;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 180px;
		padding: 0px;
		padding-top: 30px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Logo_2 {
		
		display: block;
		float: none;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 30px;
		padding: 0px;
		padding-top: 50px;
		padding-bottom: 0px;
		
	}

	#Umqombothi_Logo_3 {
		
		display: block;
		float: none;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 30px;
		padding: 0px;
		padding-top: 55px;
		padding-bottom: 0px;
		
	}

	#Umqombothi_Logo_4 {
		
		display: block;
		float: none;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 30px;
		padding: 0px;
		padding-top:110px;
		padding-bottom: 100px;
		
	}
	
	.Umqombothi {

		display: block;
		position: inherit;
		width:96%;
		margin: auto;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 8px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Digital_Invite_1 {
		
		width: 98%;
		overflow: auto;
		clear: both;
		display: block;
		position:inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 8px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Digital_Invite_2 {
		
		overflow: auto;
		clear: both;
		display: block;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 150px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		width: 96.5%;
		
	}
	
	#Umqombothi_Website_Mobile_Display {
		
		display: block;
		width: 98%;
		position: inherit;
		margin: auto;
		margin-bottom: 50px;
		margin-top: 100px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Website_Desktop_Display {
		
		width: 96.5%;
		display: block;
		position: inherit;
		margin: auto;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		padding-top: 60px;
		padding-bottom: 0px;
	
	}
	
	#KiffGifComix_Logo_Square_Gif_1_Mobile {
		
		display: none;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_1_Tablet {
		
		clear: both;
		position: relative;
		display: block;
		overflow: auto;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 105px;
		width: 72%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_1 {
		
		clear: both;
		position: relative;
		display: block;
		overflow: auto;
		margin: auto;
		padding-top: 100px;
		padding-bottom: 105px;
		width: 70%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_2 {

		display:block;
		position: inherit;
		overflow: auto;
		margin:auto;
		padding-bottom: 105px;
		width: 72%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_3 {

		display:none;
		position: inherit;
		overflow: auto;
		margin-top: 10px;
		margin-bottom: 10px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 10px;
		width: 98%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_4 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 10px;
		margin-bottom: 10px;
		margin:auto;
		padding-top: 20px;
		padding-bottom: 10px;
		width:98%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_5 {

		display:none;
		position: inherit;
		overflow: auto;
		margin:auto;
		padding-bottom: 50px;
		width: 92%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_5_Tablet {
		
		clear: both;
		position: relative;
		display: block;
		overflow: auto;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 15px;
		width: 82%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6 {

		display:block;
		position: inherit;
		overflow: auto;
		margin:auto;
		padding-top: 0px;
		padding-bottom: 20px;
		width: 82%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6_1 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 10px;
		margin-bottom: 5px;
		margin:auto;
		padding-top: 90px;
		padding-bottom: 0px;
		width: 98%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6_2 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 50px;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 90px;
		width: 98%;

	}
	
	#KiffGifComix_Logo_Square_Gif_7_1 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 170px;
		padding-bottom: 30px;
		width: 70%;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_2 {

		display: block;
		overflow:auto;
		padding-top: 150px;
		padding-bottom: 150px;
		margin: auto;
		width: 80%;
		transform: scale(100%, 110%);
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_3 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 80px;
		padding-bottom: 150px;
		width: 80%;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_4 {

		display: block;
		overflow:auto;
		padding-top: 100px;
		padding-bottom: 100px;
		margin: auto;
		width: 80%;
		transform: scale(100%, 85%);
	
	}
	
	#KiffGifComix_Logo_Square_Gif_7_5 {

		display: block;
		overflow:auto;
		padding-top: 0px;
		padding-bottom: 150px;
		margin: auto;
		width: 80%;
		transform: scale(100%, 110%);
		
	}

	#KiffGifComix_Logo_Square_Gif_8 {
		
		display:block;
		clear: both;
		position: inherit;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 0px;
		width:100px;
		height: 165px;
		
		transform:          rotate(810deg);
		-ms-transform:      rotate(810deg);
		-moz-transform:     rotate(810deg);
		-webkit-transform:  rotate(810deg);
		-o-transform:       rotate(810deg);
		
	}

	nav li a {		
		
		margin: 0;
		color: rgb(241,228,10); 	
		font-weight: normal; 
		line-height: 24px;
		font-size: 17.5px;
		font-weight: bold;
		letter-spacing: 2px;
		word-spacing: -3px;
		font-family: Arial;
		background: rgb(226,31,38);
			
	}
	
	#gifs_1 {
		
		display: block;
		text-align: center;
		margin-top: 0px;
	}
	
	#gifs_2 {
		
		display:block;
		text-align: center;
		margin-top: 10px;
	}
	
	#Next_1 {
		
		display: block;
		width: 30%;
		margin: auto;
		margin-bottom: 100px;
		
	}
	
	#Next_2 {
		
		display: block;
		width: 30%;
		margin: auto;
		margin-bottom: 50px;
		
	}
	
	#Next_Grid {
		
		display: block;
		width: 30%;
		margin: auto;
		margin-top: 0px;
		margin-bottom: 60px;
		
	}
	
	#KiffGifComix_Umqombothi_Animated_Logo {

		display: block;
		margin-top: 0px;
		margin-bottom: 0px;
		padding: 0;
		width: 98%;
		
	}
		
	#KiffGifComix_Connor_Goliath_Gif_1 {
		
		clear: both;
		width: 92%;
		margin-top: 0px;
		margin-bottom: 6px;
		text-align: center;
		padding-top: 0px;
		padding-bottom: 0px;

	}
	
	#KiffGifComix_Connor_Goliath_Gif_2 {
		
		display: block;
		width: 92%;
		text-align: center;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 0px;
		margin-bottom: 0px;
		
	}
	
	#KiffGifComix_Connor_Goliath_Gif_3 {
		
		display: block;
		width: 98%;
		margin-top: 10px;
		margin: auto;
		
	}
	
	#KiffGifComix_Animation_Sculpture {
		
		display: block;
		margin-top: 10px;
		margin: auto;
		margin-top: 120px;
		width: 82%;
		
	}
	
	#Gifs_Type_1 {
		
		display: block;
		text-align: center;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 0px;
		margin-bottom: 0px;
		margin-top: 120px;
		
	}
	
	#Gifs_Type_2 {
		
		display: block;
		text-align: center;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 0px;
		margin-bottom: 0px;
		margin-top: 0px;
		
	}
	
	#Type_1 {
		
		display: block;
		width: 92%;
		margin: auto;
		margin-bottom: 10px;
		
	}
	
	#Type_2 {
		
		display: block;
		width: 92%;
		margin: auto;
		margin-bottom: 10px;
				
	}
	
	#Second_Row {
		
		text-align: center;
		margin-top: 10px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_12 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 50px;
		margin: auto;
		padding-top: 100px;
		padding-bottom: 0px;
		width: 98%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_11 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 50px;
		margin-bottom: 0px;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 90px;
		width: 98%;
		
	}

	#Parallelogram_Logo {

		padding-bottom: 0;
		padding-top: 0px;
		width: 98%;
		display: block;
		margin: auto;
		margin-top: 8px;
	
	}	

	#Parallelogram_Logo: hover {

		width: none;
	
	}	

	#Parallelogram_1_3_1 {

			display: none;
	}
	
	#Parallelogram_1_2 {
			
		padding-bottom: 0;
        padding-top: 0px;
        width: 96%;
        display: block;
        margin: auto;
        margin-top: 8px;
			
	}
		
	#Parallelogram_1_3 {
			
		display: none;
			
	}
		
	#Parallelogram_1_3_Mobile {
			
		padding-bottom: 8px; 
		padding-top: 0px; 
		width: 96%; 
		display: block; 
		margin: auto; 
		margin-top: 10px;
			
	}

	#Parallelogram_Urban_Dystopia_Logo {

		padding-bottom: 0;
        padding-top: 0px;
        width: 96%;
        display: block;
        margin: auto;
        margin-top: 160px;
		
	}

	#Parallelogram_Strip {

		display: block;
		width: 96%;
		margin: auto;
		margin-top: 8px;

	}
	
	#white_background {
		
		z-index: -99px;
		overflow:hidden;
		width: 100%;
		background-color: white;
		margin: auto;
		margin-top: 0px;
		position: relative;
		padding-bottom: 150px;
		
		
		/*To create the bevelled edge on the white rectangle
		
		The main idea is to have 4 gradients that each occupy a quarter of the element's area (one for the bottom left, one for the bottom, on of the top right and one for the top left). Then you set the background to 4 linear gradients with the same color stops (in this case we wanted the corner size to be 10px*, so it was transparent until 10px and then the color we want from 10px) except the corners that are 45deg, 135deg, 225deg and 315deg respectively.

		*Actually not exactly 10px, it's the length of the hypotenuse of an isosceles right-angled triangle, which is around 14px*/
		
		
		background: #c00; /* fallback */
		background:
			
			linear-gradient(130deg, transparent 25px, white 0) top left,
			linear-gradient(225deg, transparent 0px, white 0) top right,
			linear-gradient(315deg, transparent 0px, white 0) bottom right,
			linear-gradient(45deg,  transparent 00px, white 0) bottom left;
		
		background-size: 60% 60%;
		background-repeat: no-repeat;
		
		
		border-radius: 0px 0px 30px 30px;
	}

	
}
















/*medium resolution media query for tablets, 658px to 1023px*/

@media only screen and (min-width: 658px) {
	
	html {

		max-height: 100%;
        overflow: auto;
		
	}
    
	body {	
		
        background: rgb(226, 31, 38);
        padding-bottom: 0px;
        height: 100%;
        display: block;
        overflow: auto;
		
	}
	
	#grad {
	    
	    display: none;
	    
	}
	
	#bar_right {
	    
		background-color: rgb(226, 31, 38);
        height: 79350px;
        width: 10px;
        display: contents;
        overflow: visible;
        margin-top: 0px;
        position: fixed;
        float: right;
        padding-right: -500px;
        z-index: 999999999999999999999999999;
          
    }
	
	#bar_top {
	    
		display: block;
        position: fixed;
        width: 9999999px;
        height: 10px;
        top: -1px;
        z-index: 9999999999;
        margin-right: 500px;
        margin: auto;
        background-color: rgb(226, 31, 38);
	    
	}

	h1.style2 {
		
		display: none;
		color: yellow;
		margin-top: 70px;
		font-size: 82vw;
		text-align: center;
		margin: 0px;
		padding-top: 180px;
		padding-bottom: 50px;
		margin-left: 1.2%
		
	}
	
	#home {
	    
	    margin-left: 0.2%;
	    
	}
	
	#arrow {
		
		font-size: 50px;
    	line-height: 1.1;
		
	}
	
	.arrow_hover {
		
    	display: inline;
        width: 74%;
        margin-bottom: -1px;
        margin-left: -45px;
		
	}
	
	.arrow_hover:hover {
		
		 width: 74%;
         margin-bottom: -1px;
         margin-left: -45px;
	     content: url("../../images/Portfolio/Home page/millantv-return-to-top-arrow-hover.png");
		
	}

	#millantv_navbar_red {

		display: inline;
        position: relative;
        width: 82px;
        margin-right: -238px;
        margin-top: 16.87px;
        float: right;

	}


	#millantv_navbar_red:hover {

		display: inline;
        position: relative;
        width: 82px;
        margin-right: -238px;
        margin-top: 16.87px;
        float: right;
		content: url("../../images/millantv-logo-navbar-hover-black.svg");
		
	}

	#Brand_Identity_title_navbar {

        display: inline;
        position: relative;
        width: 142px;
        margin-top: 23.3px;
        float: right;
        margin-left: 0;
        margin-right: 105px;

	}
	
	/* The navigation bar */

	.navbar {
		
        z-index: 1;
        overflow: hidden;
        background-color: white;
        border-top: solid;
        color: rgb(226, 31, 38);
        position: fixed;
        top: 0;
        width: 95.1%;
        font-family: "outward block";
        font-size: 60px;
        letter-spacing: .02em;
        padding-left: 16px;
        margin: 0px 0px 0px 0px;
        margin-top: 0px;
        border-top-width: 8px;
        margin-left: 0px;
        padding-bottom: 5px;

	}

	/* Links inside the navbar */
	
	.navbar a {
		  
        font-family: "outward block";
        font-size: 60px;
        letter-spacing: .03em;
        float: left;
        display: block;
        color: red;
        text-align: center;
        margin: 10px 0px 0px 0px;
        word-spacing: .03em;
        text-decoration: none;
        margin-left: 31px;
        margin-right: -16px;
	
	}

	/* Change background on mouse-over */
	
	.navbar a:hover {
		
		  background-color: white;
		  color: black;
	
	}

	/* Main content */

	.main {
	  
			margin-top: 30px; /* Add a top margin to avoid content overlay */
	
	}
		
	#master {		
		
		overflow: auto;
		width: 100%; 
		margin: 0 auto; 
		/*border: dotted thin cyan;*/
		background: rgb(226,31,38);	
		margin-top: 8px;
		margin-bottom: 0px;
		padding-bottom: 8px;
		border-radius: 0px 0px 38px 38px;
		
	}
	
	h1 {
			font-family: "outward block";
			letter-spacing: .006em;
			color: red;
			font-size: 240px;
			font-weight: 100;
			margin-left: 16px;
			padding-top: 70px;
			margin-top: 0;
			margin-bottom: 0px;

	}
		
	.font1 {
			
		font-family: Cambria, "Hoefler Text";

	}
	
	
	#credits {
		
		padding-left: 101px;
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		max-width: 892px;
		float:left;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: .5px;
		line-height: 1.8;
		color: black;
		margin-left: 9.7px;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
		
	}
	
	p {
	
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		max-width: 892px;
		float:left;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: .5px;
		line-height: 1.8;
		color: black;
		margin-left: 9.7px;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
			
	}
	
	.body_copy {
		
		margin-left:-5%;
		max-width: 180%;
		
	}
	
	#Umqombothi_Title {

        display: inline-block;
        width: 143px;
        margin-left: 50px;
        margin-bottom: -30px;

	}

	#Umqombothi_Client  {

        display: inline-block;
        width: 14.5%;
        margin-left: 5%;
        margin-bottom: -30px;
        margin-top: 0;

	}

    #Nuestra_Boda_Client  {

		display: inline-block;
        width: 12%;
        margin-left: 4%;
        margin-bottom: -30px;
        margin-top: 0;
        padding-top: 60px;

	}

	#Nuestra_Boda_Title {

        display: inline-block;
        width: 115px;
        margin-left: 40px;
        margin-bottom: -30px;

	}

	#KiffGifComix_Client {

        display: inline;
        width: 11%;
        margin-left: 6%;
        margin-bottom: -5px;
        margin-top: -200px;
        padding-top: 100px;

	}

	#KiffGifComix_Title {

        display: inline;
        width: 106px;
        margin-left: 50px;
        margin-bottom: 10px;
        margin-top: 10px;

	}

	#millantv_Client {

		display: inline;
        width: 10%;
        margin-left: 6%;
        margin-bottom: 8px;
        margin-top: 0;
        padding-top: 0;

	}

	#millantv_Title {

		width:100px; 
		margin-left: 60px; 
		margin-top: 25px;
	
	}

	#Parallelogram_Client {

		display: inline;
        width: 19.4%;
        margin-left: 2%;
        margin-bottom: 8px;
        margin-top: 0;
        padding-top: 0;

	}

    #Parallelogram_Client_Bespoke {
    
		display: inline;
        width: 19.4%;
        margin-left: 2%;
        margin-bottom: 8px;
        margin-top: 0;
        padding-top: 0;
        
    }
	
	.Title_Top_Bar {

		padding-bottom: 50px; 
		padding-top: 200px; 
		width: 93%; 
		height: 100%; 
		display: block; 
		margin: auto;

	}
	
	#Nuestra_Boda_title_board {

		display: block;
		margin: auto;
		width: 96%;

	}

	#Parallelogram_Title {

        display: inline;
        width: 185px;
        margin-left: 5%;
        margin-bottom: 22px;

	}

	.align_horizontal {
		
		display: block;
		margin: auto;
		width: 96%;
		margin-top: 0;
		padding-top: 0;
		
	}

	#millantv_logo_red_on_white {
		
		display: block;
		width: 492px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 280px;
		padding-bottom: 200px;

	}

	#millantv_logo_black_on_white {
		
		display: block;
		width: 492px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 100px;
		padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large {
		
		display: block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin: auto;
        margin-top: 180px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small {
		
        display: block;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large_red {
		
        display: block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 100px;
        padding-top: 0;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small_red {
		
        display: block;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-top: ;
        padding-top: 100px;
        padding-bottom: 200px;

	}

	#millantv_logo_white {
		
		display: block;
        width: 492px;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-top: 150px;
        padding-bottom: 200px;

	}
	
	#colour_board_1 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 96%;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 560px;
        padding-top: 150px;
        padding-bottom: 100px;

	}

	#colour_board_2 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 96%;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 180px;
        padding-top: 150px;
        padding-bottom: 100px;

	}

	#homepage_animation {

		display: block;
		position: absolute;
        margin: 24%;
        z-index: 1;
        margin-top: 86%;
        width: 54%;

	}
	
	.cascade {
		
		display: block;
		width: 96%;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		
	}

	#Umqombotho_Logo_1 {

        display: block;
        width: 200px;
        margin: auto;
        margin-bottom: 60px;
        padding-top: 100px;
        margin-top: 0px;

	}

	#Umqombotho_Logo_2 {

		display: block;
        width: 200px;
        margin: auto;
        margin-bottom: 190px;
        margin-top: 50px;

	}		
	
	.Umqombothi_Logo_1 {
	
		display: block;
		position: inherit;
		float: none;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 100px;
		padding: 0px;
		padding-top: 30px;
		padding-bottom: 0px;
		
	}
	
	.Umqombothi_Logo_2 {
		
		display: block;
		float: none;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 30px;
		padding: 0px;
		padding-top: 60px;
		padding-bottom: 100px;
		
	}
	
	.Umqombothi {
		display: block;
		position: inherit;
		margin: auto;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 8px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		    width: 96%;
		
	}
	
	#Umqombothi_Digital_Invite_1 {
		
		width: 96.5%;
		overflow: auto;
		clear: both;
		display: block;
		position:inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 8px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Digital_Invite_2 {
		
		overflow: auto;
		clear: both;
		display: block;
		position: inherit;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 150px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		width: 96.5%;
		
	}
	
	#Umqombothi_Website_Mobile_Display {
		
		display: block;
		width: 46%;
		position: inherit;
		margin: auto;
		margin-bottom: 50px;
		margin-top: 200px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Umqombothi_Website_Desktop_Display {
		
		width: 96.5%;
		display: block;
		position: inherit;
		margin: auto;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		padding-top: 60px;
		padding-bottom: 0px;
	
	}
	
	#KiffGifComix_Logo_Square_Gif_1_Mobile {
		
		
		display: none;
			
	}
	
	#KiffGifComix_Logo_Square_Gif_1 {
		
		clear: both;
		position: relative;
		width: 423px;
		height: 306px;
		display:block;
		overflow: auto;
		margin:auto;
		padding-top: 150px;
		padding-bottom: 100px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_1_Tablet {
		
		clear: both;
		position: relative;
		width: 423px;
		display:block;
		overflow: auto;
		margin:auto;
		padding-top: 0px;
		padding-bottom: 100px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_2 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 0px;
		margin-bottom: 100px;
		margin:auto;
		padding-top: 0px;
		padding-bottom: 100px;
		width: 423px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_3 {

		display:none;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 100px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 100px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_4 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 100px;
		margin:auto;
		padding-top: 200px;
		padding-bottom: 100px;
		width:700px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_5 {

		display:none;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 100px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 100px;
		width:915px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_5_Tablet {

		display: block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 100px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 100px;
		width: 92%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 0px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 30px;
		width:92%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6_1 {

		display: block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 50px;
		margin:auto;
		padding-top: 100px;
		padding-bottom: 0px;
		width: 96.5%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_6_2 {

		display: block;
		position: inherit;
		overflow: auto;
		margin-top: 50px;
		margin-bottom: 100px;
		margin:auto;
		padding-bottom: 60px;
		width: 96.5%;
		
	}

	
	#KiffGifComix_Logo_Square_Gif_7_1 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 200px;
		padding-bottom: 30px;
		width: 350px;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_2 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 150px;
		padding-bottom: 150px;
		width: 350px;
    	height: 700px;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_3 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 150px;
		padding-bottom: 150px;
		width: 350px;
    	height: 700px;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_4 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 150px;
		padding-bottom: 150px;
		width: 350px;
		height: 700px;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_7_5 {

		display:block;
		position: inherit;
		overflow: auto;
		padding-top: 0px;
		padding-bottom: 150px;
		width: 350px;
		height: 700px;
		margin: auto;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_8 {
		
		display:block;
		clear: both;
		position: inherit;
		overflow: auto;
		margin:auto;
		padding-top: 0px;
		padding-bottom: 0px;
		width:400px;
		height: 700px;
		text-align: center;
		
		transform:          rotate(810deg);
		-ms-transform:      rotate(810deg);
		-moz-transform:     rotate(810deg);
		-webkit-transform:  rotate(810deg);
		-o-transform:       rotate(810deg);
		
	}
	
	#gifs_1 {
		
		display:block;
		text-align: center;
		margin-top:0px;
		padding-bottom: 0;
	}
	
	#gifs_2 {
		
		display:block;
		text-align: center;
		margin-top: 100px;
	
	}
	
	#Next_1 {
		
		display: block;
		width: 220px;
		margin: auto;
		margin-bottom: 100px;
		
	}
	
	#Next_2 {
		
		display: block;
		width: 220px;
		margin: auto;
		margin-bottom: 0px;
		
	}
	
	#Next_Grid {
		
		display: block;
		width: 220px;
		margin: auto;
		margin-top: 0px;
		margin-bottom: 60px;
		
	}
	
	#KiffGifComix_Umqombothi_Animated_Logo {

		display: block;
		margin-top: -70px;
		margin-bottom: 0px;
		margin-left: auto;
		padding: 0;
		width: 50%;
		margin-right: auto;
		
	}
		
	#KiffGifComix_Connor_Goliath_Gif_1 {
		
		display: inline;
		width: 400px;
		margin-right: 0px;
		margin-top: 0px;
		margin-bottom: 0;
		padding: 4px;
			
	}
	
	#KiffGifComix_Connor_Goliath_Gif_2 {
		
		display: inline;
		width: 400px;
		margin-top: 0px;
		margin-bottom: 0;
		padding: 4px;
		
	}
	
	#KiffGifComix_Connor_Goliath_Gif_3 {
		
		display: block;
		width: 813px;
		margin-top: 10px;
		margin: auto;
	
	}
	
	#KiffGifComix_Animation_Sculpture {
		
		display: block;
		margin-top: 10px;
		margin: auto;
		margin-top: 150px;
		width: 75%;
		
	}
	
	#Gifs_Type_1 {
			
		text-align: center;
		margin-top: 150px;
		margin-bottom: 0px;
		padding-bottom: 0px;
		
	}
	
	#Gifs_Type_2 {
		
		text-align: center;
		margin-top: 0px;
		margin-bottom: 0px;
		padding-bottom: 0px;
		
	}
	
	#Type_1 {
		
		display: inline;
		width: 400px;
		margin-right: 0px;
		margin-bottom: 0px;
		padding: 4px;
		
	}
	
	#Type_2 {
		
		display: inline;
		width: 400px;
		margin-right: 0px;
		margin-bottom: 0px;
		padding: 4px;
				
	}
	
	#Second_Row {
		
		text-align: center;
		margin-top: 0px;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_12 {

		display: block;
		position: inherit;
		overflow: auto;
		margin-top: 100px;
		margin-bottom: 50px;
		margin: auto;
		padding-top: 100px;
		padding-bottom: 0px;
		width: 96.5%;
		
	}
	
	#KiffGifComix_Logo_Square_Gif_11 {

		display:block;
		position: inherit;
		overflow: auto;
		margin-top: 50px;
		margin-bottom: 100px;
		margin: auto;
		padding-top: 0px;
		padding-bottom: 60px;
		width: 96.5%;
		
	}

	#Parallelogram_Logo {

        padding-bottom: 0;
        padding-top: 0px;
        width: 98%;
        display: block;
        margin: auto;
        margin-top: 8px;
        margin-bottom: 8px;
	
	}	

	#Parallelogram_Logo: hover {

		width: none;
	
	}

	#Parallelogram_1_3_1 {

        display: inline;
        position: relative;
        margin-left: 8px;
        width: 31.45%;

	}

	#Parallelogram_1_3 {
		
		display: block;
		margin: auto;
		float: left;
		margin-left: 8px;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-left: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}

	#Parallelogram_1_3_Mobile {
		
		display: none;
		
	}

	#Umqombothi_Logo_1 {

		display: block;
		position: relative;
		margin: auto;
		width: 268px;
		margin-bottom: 70px;
		margin-top: 180px;

	}

	#Umqombothi_Logo_2 {

		display: block;
		position: relative;
		margin: auto;
		width: 392px;

	}

	#Umqombothi_Logo_3 {

		display: block;
		position: relative;
		margin: auto;
		width: 268px;
		margin-bottom: 48px;
		margin-top: 70px;

	}

	#Umqombothi_Logo_4 {

		display: block;
		position: relative;
		margin: auto;
		width: 268px;
		padding-bottom: 80px;
		margin-top: 100px;

	}

	#Parallelogram_1_2 {
		
        display: block;
        position: relative;
        margin: auto;
        float: left;
        margin-left:2%;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-left: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        width: 63.5%;
		
	}

	#Parallelogram_Strip {
		
        padding-bottom: 0;
        padding-top: 8px;
        width: 96%;
        display: block;
        margin: auto;
		
	}

	#white_background {
		
		z-index: -99px;
		overflow:auto;
		width: 100%;
		max-height: inherit;
		background-color: white;
		margin: auto;
		margin-top: 0px;
		position: relative;
		padding-bottom: 150px;
		
		
		/*To create the bevelled edge on the white rectangle
		
		The main idea is to have 4 gradients that each occupy a quarter of the element's area (one for the bottom left, one for the bottom, on of the top right and one for the top left). Then you set the background to 4 linear gradients with the same color stops (in this case we wanted the corner size to be 10px*, so it was transparent until 10px and then the color we want from 10px) except the corners that are 45deg, 135deg, 225deg and 315deg respectively.

		*Actually not exactly 10px, it's the length of the hypotenuse of an isosceles right-angled triangle, which is around 14px*/
		
		
		background: #c00; /* fallback */
		background:
			
			linear-gradient(130deg, transparent 25px, white 0) top left,
			linear-gradient(225deg, transparent 0px, white 0) top right,
			linear-gradient(315deg, transparent 0px, white 0) bottom right,
			linear-gradient(45deg,  transparent 00px, white 0) bottom left;
		
		background-size: 60% 60%;
		background-repeat: no-repeat;
		
		
		border-radius: 0px 0px 30px 30px;
	}
	
}	
	
	












	
/*high resolution media query for desktop computers, 1024px and above*/

@media only screen and (min-width: 1024px) {
	
    #hide {
		
		display: block;
		
	}
	
	#bar_top {
	    
	    background-color: white;
        z-index: 999999999999999999999999999;
        height: 10px;
        width: 9999999999px;
        position: fixed;
        display: block;
        margin-top: 0px;
        text-align: -webkit-center;
      
    }

    #bar_right {
	    
        background-color: rgb(226, 31, 38);
        height: 25700px;
        width: 10px;
        display: none;
        margin-top: 0px;
        position: relative;
        float: right;
        margin-right: -10.1px;
        z-index: 999999999999999999999999999;
          
    }
	
	body {	
		
		background: white;
		padding-bottom: 150px;
		height: 100%;
		
	}
	
	#grad {
		
		display: none;
		z-index: 0;
		position: fixed;
		margin-top: -50px;
		width: 3000px;
		margin-left: -800px;
		height:270px;
		background: rgb(226,31,38); /* For browsers that do not support gradients */ /* FF3.6-15 */
		background: -webkit-linear-gradient(rgb(226,31,38) 50%, rgba(255,255,255,0) 100%);
		background: -o-linear-gradient(rgb(226,31,38) 10%, rgb5(255,255,255,0) 100%);
		background: linear-gradient(rgb(226,31,38)) 10%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
		
	}
	
	h1.style2 {
		
		display: none;
		color: yellow;
		margin-top: 70px;
		float: right;
		font-size: 500px;
		text-align: center;
		margin-right: 24px;
		padding-top: 130px;
		padding-bottom: 50px;
		
	}
	
	#home {
	    
	    margin-left:32px;
	    
	}
	
	.arrow_hover {
		
    	display: inline;
        width: 74%;
        margin-bottom: -1px;
        margin-left: -45px;
		
	}
	
	.arrow_hover:hover {
		
		 width: 74%;
         margin-bottom: -1px;
         margin-left: -45px;
	     content: url("../../images/Portfolio/Home page/millantv-return-to-top-arrow-hover.png");
		
	}
	
	#millantv_navbar_red {

		display: inline;
        width: 82px;
        float: left;
        margin-right: 34px;
        margin-top: 16.87px;
        float: right;

	}

	#millantv_navbar_red:hover {

		display: inline;
        width: 82px;
        float: left;
        margin-right: 34px;
        margin-top: 16.87px;
        float: right;
		content: url("../../images/millantv-logo-navbar-hover-black.svg");
		
	}

	#Brand_Identity_title_navbar {

        display: inline;
        position: absolute;
        width: 142px;
        margin-left: 306px;
        margin-top: 23.3px;

	}
	
	/* The navigation bar */

	.navbar {
			
		z-index: 2;
        overflow: visible;
        background-color: white;
        border-top: solid;
        color: rgb(226, 31, 38);
        position: fixed;
        top: 0;
        width: 958px;
        font-family: "outward block";
        font-size: 60px;
        letter-spacing: .02em;
        padding-left: 0px;
        margin: 0px 0px 0px 0px;
        margin-top: 8px;
        border-top-width: 9px;
        margin-left: 8.5px;
        padding-bottom: 5px;

	} 

	/* Links inside the navbar */
	
	.navbar a {
		 
		font-family: "outward block";
    	font-size: 60px;
    	letter-spacing: .03em;
		float: left;
		display: block;
		color: red;
		text-align: center;
		margin: 10px 0px 0px 0px;
		word-spacing: .03em;
		text-decoration: none;
		margin-left: 31px;
        margin-right: -16px;
	
	}

	/* Change background on mouse-over */
	
	.navbar a:hover {
		
		  background-color: white;
		  color: black;
	
	}

	/* Main content */

	.main {
	  
			margin-top: 30px; /* Add a top margin to avoid content overlay */
	
	}
    
	#master {		
		
		overflow: auto;
		width: 975px; 
		margin: 0 auto; 
		/*border: dotted thin cyan;*/
		background: rgb(226,31,38);	
		margin-top: 8px;
		margin-bottom: 0px;
		padding-bottom: 10px;
		border-radius: 0px 0px 38px 38px;
		
	}

	h1 {
			font-family: "outward block";
			letter-spacing: .006em;
			color: red;
			font-size: 240px;
			font-weight: 100;
			margin-left: 32px;
			padding-top: 70px;
			margin-top: 10px;
			margin-bottom: 0px;
		
	}
		
	.font1 {	
		
		font-family: Cambria, "Hoefler Text";

	}
	
	#Umqombothi_Title {

        display: inline-block;
        width: 143px;
        margin-left: 55px;
        margin-bottom: -30px;

	}

	#Umqombothi_Client  {

		display: inline-block;
        width: 15%;
        margin-left: 50px;
        margin-bottom: -30px;
        margin-top: 0;

	}

    #Nuestra_Boda_Client  {

        display: inline-block;
        width: 12%;
        margin-left: 45px;
        margin-bottom: -30px;
        padding-top: 0;

	}

	#Nuestra_Boda_Title {

        display: inline-block;
        width: 12%;
        margin-left: 40px;
        margin-bottom: -30px;

	}

	#KiffGifComix_Client {

        display: inline;
        width: 11%;
        margin-left: 50px;
        margin-bottom: -5px;
        margin-top: 0;
        padding-top: 0;

	}

	#KiffGifComix_Title {

        display: inline;
        width: 11%;
        margin-left: 50px;
        margin-bottom: 10px;
        margin-top: 0px;

	}

	#millantv_Client {

        display: inline;
        width: 10%;
        margin-left: 48px;
        margin-bottom: 8px;
        margin-top: 0;
        padding-top: 0;

	}

	#millantv_Title {

		width:100px; 
		margin-left: 60px; 
		margin-top:25px;
	
	}

	#Parallelogram_Client {

        display: inline;
        width: 20%;
        margin-left: 20px;
        margin-bottom: 8px;
        padding-top: 120px;
        margin-top: 0;

	}
	
	#Parallelogram_Client_Bespoke {
    
	    display: inline;
        width: 20%;
        margin-left: 20px;
        margin-bottom: 8px;
        padding-top: 120px;
        margin-top: 0;
        
    }

	#Parallelogram_Title {

        display: inline;
        width: 185px;
        margin-left: 5%;
        margin-bottom: 20px;

    }

	.Title_Top_Bar {

		padding-bottom: 50px; 
		padding-top: 65px; 
		width: 93%; 
		height: 100%; 
		display: block; 
		margin: auto;

	}
	
	p {
					
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		max-width: 1100px;
		width:1200px;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: .5px;
		line-height: 1.8;
		color: black;
		margin-left: -70px;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
			
	}
	
	.body_copy {
					
		font-family: "tenso", sans-serif;
		font-weight: 350;
		font-style: normal;
		width: 1092px;
		font-size: 18px;
		letter-spacing: .05em;
		word-spacing: .5px;
		line-height: 1.8;
		color: black;
		margin-left: -77px;
		margin-top: 60px;
		margin-bottom: 60px;
		padding-top: 0;
		transform: scale(.8,1);
			
	}
	
	.Cascade {
			
		display: block;
		margin: auto;
		padding-bottom: 8px;
	
	}

	.cascade {
			
		display: block;
		width: 892px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		padding-bottom: 0px;
	}

	.align_horizontal {
		
		display: block;
		margin: auto;
		width: 892px;
		margin-top: 0;
		padding-top: 0;
		
	}

	#millantv_logo_red_on_white {
		
		display: block;
		width: 592px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 280px;
		padding-bottom: 200px;

	}

	#millantv_logo_black_on_white {
		
		display: block;
		width: 592px;
		position: inherit;
		margin: auto;
		float: inherit;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-top: 100px;
		padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large {
		
        display: inline-block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-left: 100px;
        margin-top: 180px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small {
		
		display: inline;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-left: 150px;
        margin-top: 0px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_large_red {
		
		display: inline-block;
        width: 392px;
        position: relative;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-left: 100px;
        margin-top: 50px;
        padding-top: 0;
        padding-bottom: 150px;

	}

	#millantv_logo_black_on_white_small_red {
		
		display: inline;
        width: 92px;
        position: inherit;
        margin: auto;
        margin-bottom: 8px;
        margin-left: 150px;
        margin-top: 0px;
        padding-top: 100px;
        padding-bottom: 150px;

	}

	#millantv_logo_white {
		
		display: block;
        width: 592px;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-top: 150px;
        padding-bottom: 200px;

	}
	
	#colour_board_1 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 892px;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 480px;
        padding-top: 150px;
        padding-bottom: 100px;

	}

	#colour_board_2 {
		
        display: block;
        background-color: rgb(225, 31, 38);
        width: 892px;
        position: inherit;
        margin: auto;
        float: inherit;
        margin-bottom: 8px;
        margin-top: 180px;
        padding-top: 150px;
        padding-bottom: 100px;

	}

	#homepage_animation {

        position: absolute;
        margin-left: 190px;
        z-index: 1;
        margin-top: 756px;
        width: 600px;

	}

	#Nuestra_Boda_title_board {

		display: block;
		position: relative;
		margin: auto;
		width: 93%;

	}
	
	.Umqombothi {

		display: block;
		position: inherit;
		width: 892px;
		margin: auto;
		margin-bottom: 8px;
		margin-top: 0px;
		padding: 0px;
		margin: auto;
		margin-bottom: 0px;
		margin-top: 80px;
		padding: 0px;
		padding-top: 0px;
		padding-bottom: 100px;
		
	}

	#Umqombotho_Logo_1 {

		display: inline-block; 
		width: 200px; 
		margin-left: 210px; 
		margin-bottom: 160px; 
		margin-top: 50px;

	}

	#Umqombotho_Logo_2 {

		display: inline; 
		width: 200px; 
		margin-left: 132px; 
		margin-bottom: 160px; 
		margin-top: 50px;

	}

	#GenV_Website {

		padding-bottom: 50px;
		padding-top: 50px;
		width: 53%; 
		height: 100%; 
		display: block; 
		margin: auto;

	}

	#Parallelogram_Logo {

		padding-bottom: 4px;
        padding-top: 0px;
        width: 96.45%;
        display: block;
        margin: auto;
        margin-top: 10px;

	}

	#Parallelogram_Logo:hover {

		padding-bottom: 8px;
        padding-top: 0px;
        width: 892px;
        display: block;
        margin: auto;
        margin-top: 10px;
        content: url("../../images/Portfolio/Teaching/millantv-vega-school-parallelogram-publication-design-1-hover.png");

    }

	#Parallelogram_Urban_Dystopia_Logo {

        display: block;
		width: 892px;

	}

	#Parallelogram_Urban_Dystopia_Logo:hover {

        display: block;
        content: url("../../images/Portfolio/Brand Identity/millantv-vega-school-parallelogram-2-publication-design-1-hover.png");

	}

    #Parallelogram_1_3_1 {

        display: inline;
        margin-left: 8px;
        width: 30.45%;

    }

	#Parallelogram_1_2 {
		
        display: block;
        margin: auto;
        float: left;
        margin-left: 33px;
        margin-bottom: 8px;
        margin-top: 0px;
        padding-left: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        width: 61.6%;
		
	}

	#Parallelogram_Strip {
		
        padding-bottom: 0;
        padding-top: 8px;
        width: 892px;
        display: block;
        margin: auto;
		
	}
	
	#Parallelogram_1_3 {
		
		display: block;
		margin: auto;
		float: left;
		margin-left: 8px;
		margin-bottom: 8px;
		margin-top: 0px;
		padding-left: 0px;
		padding-top: 0px;
		padding-bottom: 0px;
		
	}
	
	#Parallelogram_1_3_Mobile {
		
		display: none;
		
	}

	#white_background {
		
		z-index: -99px;
		overflow: hidden;	
		width: 958px;
		padding-bottom: 150px;
		background-color: white;
		margin: auto;
		margin-top: 0;
		position: relative;
		
		
		/*To create the bevelled edge on the white rectangle
		
		The main idea is to have 4 gradients that each occupy a quarter of the element's area (one for the bottom left, one for the bottom, on of the top right and one for the top left). Then you set the background to 4 linear gradients with the same color stops (in this case we wanted the corner size to be 10px*, so it was transparent until 10px and then the color we want from 10px) except the corners that are 45deg, 135deg, 225deg and 315deg respectively.

		*Actually not exactly 10px, it's the length of the hypotenuse of an isosceles right-angled triangle, which is around 14px*/
		
		
		background: #c00; /* fallback */
		background:
			
			linear-gradient(130deg, transparent 25px, white 0) top left,
			linear-gradient(225deg, transparent 0px, white 0) top right,
			linear-gradient(315deg, transparent 0px, white 0) bottom right,
			linear-gradient(45deg,  transparent 00px, white 0) bottom left;
		
		background-size: 60% 60%;
		background-repeat: no-repeat;
		
		
		border-radius: 0px 0px 30px 30px;

	}
	
}