body {
	background: #FFF;
	margin: 0;
	padding: 0;
	text-align: center;
	/*
	*background: url(images/indeed.jpg) no-repeat center 100px;
	background-size: 100% auto;
	*/
	
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;	
}

a {
	transition: color 0.5s ease-out;
	text-decoration: none;
        outline: 0;
        color: #3399CC    
}


a:hover {
	text-decoration: none;
        outline: 0;
        color: #B8B8B8    
}

.blue {color: #3399CC}

.border {
	border: 1px solid #E8E8E8
}

abbr[title], acronym[title] { border-bottom: none; }


#content {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	position: relative;
	z-index: 2;
}

.navigation {
	width: 100%;
	background: #FFF;
	height: 155px;
}

.navigation-masthed {
	max-width: 980px;
	margin: 0 auto 20px;
	padding: 0;
	text-decoration: none;
	color: #CCC;
	text-align: left;
	-webkit-font-smoothing: antialiased;

}


h1.masthead {
	margin: 0 0 0 -3px;
	padding: 30px 0 0;
	/*font: normal 25px/20px 'caecilia_lt_std46LtIt';*/
	font: normal 25px/20px 'CaeciliaLTStdLightRegular';
	text-decoration: none;
	color: #CCC;
	font-weight: 100;
	-webkit-font-smoothing: antialiased;
}

h1.masthead a {
	text-decoration: none;
	color: #5F5F5F;
}

h1.masthead span {
	color: #3399CC; 
}


.navigation-content {
	width: 100%;
	margin: 0 auto;
	padding: 20px 0 0;
	text-decoration: none;
	color: #CCC;
	-webkit-font-smoothing: antialiased;
}

.fixed {
	position: fixed;
	top:0;
	width: 100%;
	height: 50px;
	border-bottom: 1px solid #E8E8E8;
	margin: 0;
	padding: 20px 0 15px;
	background: rgba(255,255,255,1);
	z-index: 3
}

.navigation-content-text {
	max-width: 980px;
	margin: 0 auto;
	padding: 0;
}

#mobile-menu {
		display: none;
	}

.col {
	position: relative;
	width: 25%;
	float: left;
	text-align: left;
        font: 17px/23px "CaeciliaLTStdLightRegular";
}

.col p.porfolio-description {
	margin: 0 0 30px 0;
	padding: 0;
	text-align: center;
	height: 40px;
}


.col-threequarts {
	position: relative;
	width: 75%;
	float: left;
	text-align: left;
}

.col-third {
	position: relative;
	width: 33.3%;
	float: left;
	text-align: left;
}

.col-third.spacer {
	position: relative;
	/*clear: left;*/
	width: 33.3%;
	float: left;
	text-align: left;
	}

.col-half {
	position: relative;
	width: 50%;
	float: left;
	text-align: left;
}

.col-twothird {
	position: relative;
	width: 66.6%;
	float: left;
	text-align: left;
}

.col-twothird p {
	padding-left: 5px;
}


.image {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 453px;
	text-align: center;
	display: table;
	-webkit-font-smoothing: antialiased;
}


.image-txt {
	margin: 0;
	padding: 0;
	display: table-cell; 
	vertical-align: middle; 
	text-align: center;
	text-transform:uppercase;
	
	font: 96px/86px 'CaeciliaLTStdLightBold';
	text-decoration: none;
	color: #FFF;
	
	text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
}

.image-txt a, .image-txt a:hover {
        font: 96px/86px 'CaeciliaLTStdLightBold';
	text-decoration: none;
	color: #FFF;
}


br.mobbr {
            display:none;
        }

.image span.smallhead {
	margin: 0;
	padding: 0;
	display: block;
	font: 15px/16px 'CaeciliaLTStdLightRegular';
	text-decoration: none;
	color: #FFF;
}

.image-txt p.fade span.u {
	margin: 0 0 0 -5px !important;
}
.image-txt p.fade span.a {
	margin: 0 0 0 7px !important;
}

.image-txt p.fade span.a-5 {
	margin: 0 0 0 -5px !important;
}

.image-txt p.fade span.a-minmus {
	margin: 0 0 0 -15px !important;
}

.image-txt p.fade span.t {
	margin: 0 0 0 -10px !important;
}
.image-txt p.fade span.o {
	margin: 0 0 0 -5px !important;
}

.minus5 {margin: 0 0 0 -5px !important;}
.minus10 {margin: 0 0 0 -10px !important;}
.minus15 {margin: 0 0 0 -15px !important;}
.minus20 {margin: 0 0 0 -20px !important;}


.image p {
	margin: 0;
	padding: 0;
}

.formob {
	display: none;
}


.landing {
	background: url(../images/wht_square.png) center 7px,
	url(../images/indeed_full.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.about {
	background: url(../images/wht_square.png) center 7px,
	url(../images/about_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.penguin {
	background: url(../images/wht_square.png) center 7px,
	url(../images/penguin.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}



.why {
	background: url(../images/wht_square.png) center 7px,
	url(../images/why_full.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.infocus-photo2frame {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/infocus_photo2frame_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.penguinclassics {
	background: /*url(../images/wht_square.png) center 7px,*/
	url(../portfolio/images/penguinclassics_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.dandad {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/dandad_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}

.pel {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/pel_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}


.lego {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/lego_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}

.digitaljournal {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/infocus_digitaljournal_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}

.gretel {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/gretel_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}

.blueprint {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/blueprint_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
}

.puffindesigner{
        background: url(../images/wht_square.png) center 7px,
        url(../portfolio/images/puffin_designer_banner.jpg) no-repeat center 3px,
        url(../images/blk_square.png) 0 7px;		
    }

.penguindesigner{
        background: url(../images/wht_square.png) center 7px,
        url(../portfolio/images/penguin_designer_banner.jpg) no-repeat center 3px,
        url(../images/blk_square.png) 0 7px;		
    }
    
.digitalcanvasjane {
    background: url(../images/wht_square.png) center 7px,
        url(../portfolio/images/digital_canvas_banner.jpg) no-repeat center 3px,
        url(../images/blk_square.png) 0 7px;	    
}

.youthapparel {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/tshirts_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;	    
}

.penguincubator {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/virtual_vending_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;	    
}

.devilmaycare {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/devilmaycare_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;	    
}

.thetshirt {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/thetshirt_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;
}

.lesleypearse {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/lesleypearse_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;
}

.jamieamerica {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/jamieamerica_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;
}

.cruk {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/cruk_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;
}

.rosewood {
    background: url(../images/wht_square.png) center 7px,
    url(../portfolio/images/rosewood_banner.jpg) no-repeat center 3px,
    url(../images/blk_square.png) 0 7px;
}

.airbus {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/airbus_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.bbcadvertsingawards {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/bbcadvertisingawards_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.ethicalinvestor {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/ethicalinvestor_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.mandofootloose {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/footloose_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.pagebuilder {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/pagebuilder_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}


.futureproof {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/futureproof_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.lengthswegoto {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/lengthswegoto_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.dassaultsystems {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/dassaultsystems_banner.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
}

.cathaypacific {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/cathaypacific_banner.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
.optus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/optus_banner.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}	

h2 {
	margin: 0;
	padding: 0;
	font: normal 18px 'CaeciliaLTStdLightRegular';
}

.nav-txt {
	margin: 0;
	padding: 0;
	font: normal 13px/15px 'Georgia';     
}

a.nav-link {text-decoration: none;color: #8F8F8F;}
a.nav-link:hover {text-decoration: none; color: #3399CC;}



.navigation-content ul.contact-menu {
	list-style-type: none;	
	margin: 0;
	padding: 2px 0 0 2px;		
}

.navigation-content ul.contact-menu li {
	float: left;
	margin: 0 22px 0 0;
	padding: 0;
	width: 14px;
	height: 13px;
}


.arrow, .arrow1, .arrow2, .arrow3, .arrow4 {
	display: inline-block;
	position: relative;
	text-indent: -9999px;
	background: url(../images/sprite_contact.png) no-repeat;
}

.arrow span, .arrow1 span, .arrow2 span, .arrow3 span, .arrow4 span {
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	background: url(../images/sprite_contact.png) no-repeat;
}

.arrow {
	width: 13px;
	height: 13px;
}


.arrow span {
	background-position: 0 -13px;
}

.arrow1 {
	width: 13px;
	height: 13px;
	background-position: -13px 0;
}
.arrow1 span {
	background-position: -13px -13px;
}

.arrow2 {
	width: 26px;
	height: 13px;
	background-position: -26px 0;
}
.arrow2 span {
	background-position: -26px -13px;
}

.arrow3 {
	width: 13px;
	height: 13px;
	background-position: -52px 0;
}
.arrow3 span {
	background-position: -52px -13px;
}

.arrow4 {
	width: 13px;
	height: 13px;;
	background-position: -65px 0;
}
.arrow4 span {
	background-position: -65px -13px;
}


.content-text-content {
	margin: 0 auto;
	padding: 0;
	width: 980px;
	color: #B8B8B8;
	text-align: left;
	font: normal 17px/25px 'Georgia'; 
}


h2.maintitle-txt {
	margin: 0;
	padding: 0;
	font: 45px/55px 'CaeciliaLTStdLightRegular';
	color: #A8A8A8;
	text-align: left;
}

h3.subtitle {
	margin: 0;
	padding: 0;
	font: 35px/45px 'CaeciliaLTStdLightRegular';
	color: #A8A8A8;
	text-align: left;
}


.sectiontitle {
	margin: 0 0 30px;
	padding: 0;
	
}

.hp-description {
    font: 25px/27px 'CaeciliaLTStdLightRegular';
}

/*
.firstline::first-line {
	font-family: 'CaeciliaLTStdLightBold';
	-webkit-font-smoothing: antialiased;	
}
*/

.description {
	margin: 0;
	padding: 0 15px 0 0;
	font: normal 16px/20px 'CaeciliaLTStdLightRegular'; 
}


.scroll-arrow {
	/*margin: 70px 0 40px 0;*/
        margin:25px 0px 60px 0;
        padding:0;
	
}

.img-holder {
	display: inline-block;
	margin: 0 5px 5px;
	padding:0;
}

.content-text-content p:first-child {
	margin: 0;
	padding: 0;
}

.content-text-content p {
	margin:  10px 0 0 0;
	padding: 0;
}

p.project-requirements-title {
    font: 20px/24px 'CaeciliaLTStdLightRegular';
    text-align: left;
    text-decoration: none;
    color: #8F8F8F;
    margin: 0 0 10px 0 !important;
    padding: 0;
}

p.project-requirements-types {
    font: 16px/20px 'CaeciliaLTStdLightRegular';
    text-align: left;
    text-decoration: none;
    color: #B8B8B8;
    margin: 0 0 15px 0 !important;
    padding: 0;
}





p.footerprojectdescriptions {
    font-size: 13px;
    margin: 0 0 20px 0 !important;
    padding: 0;
}

.footer {
	width: 100%;
	margin: 0;
	padding: 80px 0 80px;
        background: #F4F4F4;
	display: block;        
}

.footer-content {
        width: 980px;
        margin: 0 auto;
	padding: 0;
}

.footer-copy {
        width: 825px;
        margin: 0;
	padding: 0;
        float: left;
	font: 15px/16px 'CaeciliaLTStdLightRegular';
        text-align: left;
	text-decoration: none;
	color: #B8B8B8;
}

.footer-connect {
        width: 155px;
        margin: -22px 0 0;
	padding: 0;
        float: left;
}

.footer-connect ul {
        list-style-type: none;	
	margin: 0;
        padding: 0;
}

.footer-connect ul li {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;
}

.clrrule {
	display: block;
	clear: both;
        height: 1px;
        border-top: 1px solid #E8E8E8;
}


.clr {
	display: block;
	clear: both;
}

.clr10 {
	display: block;
	clear: both;
	height: 10px;
}

.clr20 {
	display: block;
	clear: both;
	height: 20px;
}

.clr30 {
	display: block;
	clear: both;
	height: 30px;
}

.clr50 {
	display: block;
	clear: both;
	height: 50px;
}


/* Smartphones (portrait) iPad portrait  ----------- */
@media only screen and (max-width : 768px) {
	.navigation-masthed {
		width: 748px;
		margin: 0 auto 20px;
		padding: 0;
		text-decoration: none;
		color: #CCC;
		text-align: left;
		-webkit-font-smoothing: antialiased;
	
	}
	
	.navigation-content-text {
		max-width: 748px;
		margin: 0 auto;
		padding: 0;
	}
}


/* Smartphones (portrait) iPad portrait  ----------- */
@media only screen and (max-width : 768px) {
	.blank { display: none;	}
	
	.navigation-content ul.contact-menu  {
	list-style-type: none;	
	margin: 0 0 0 -4px;
	padding: 2px 0 0 0;		
	}
	
	.navigation-content ul.contact-menu li {
	float: left;
	margin: 0 5px 0;
	padding: 0;
	width: 14px;
	height: 13px;
	}
	
	#arrow2 {
	margin-right: 15px;
	}
	
	.image {
	height: 327px;
	}
	
	.landing {
	background: url(../images/wht_square.png) center 7px,
	url(../images/indeed_full_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
	}
	
        
        .about {
                background: url(../images/wht_square.png) center 7px,
                url(../images/about_banner_768.jpg) no-repeat center 3px,
                url(../images/blk_square.png) 0 7px;
        }
        
        
	.penguin {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/penguin_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
	}
	
	.why {
	background: url(../images/wht_square.png) center 7px,
	url(../images/why_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
	}
	
        .infocus-photo2frame {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/infocus_photo2frame_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
        }
        
        .penguinclassics {
	background: /*url(../images/wht_square.png) center 7px,*/
	url(../portfolio/images/penguinclassics_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;
        }
	
        .dandad {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/dandad_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }
        
        
        .pel {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/pel_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }
        
        
        .lego {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/lego_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }
        
        .digitaljournal {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/infocus_digitaljournal_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }   
        
        .gretel {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/gretel_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }
        
        .blueprint {
	background: url(../images/wht_square.png) center 7px,
	url(../portfolio/images/blueprint_banner_768.jpg) no-repeat center 3px,
	url(../images/blk_square.png) 0 7px;		
        }
        
        .puffindesigner{
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/puffin_designer_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .digitalcanvasjane {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/digital_canvas_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .youthapparel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/tshirts_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .penguincubator {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/virtual_vending_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        
        .devilmaycare {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/devilmaycare_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .thetshirt {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/thetshirt_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .lesleypearse {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/lesleypearse_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .jamieamerica {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/jamieamerica_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.cruk {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/cruk_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.rosewood {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/rosewood_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.airbus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/airbus_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.bbcadvertsingawards {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/bbcadvertisingawards_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.ethicalinvestor {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/ethicalinvestor_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.mandofootloose {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/footloose_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.pagebuilder {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/pagebuilder_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.futureproof {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/futureproof_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.lengthswegoto {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/lengthswegoto_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.dassaultsystems {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/dassaultsystems_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.cathaypacific {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/cathaypacific_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.optus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/optus_banner_768.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}

}



/* Smartphones (portrait) iPad portrait  ----------- */
@media only screen and (max-width : 768px) {
	.content-text-content {
		margin: 0 auto;
		padding: 0;
		width: 748px;
		color: #B8B8B8;
		text-align: left;
		font: normal 17px/25px 'Georgia'; 
	}
        
        
        .footer-content {
                width: 748px;
                margin: 0 auto;
                padding: 0;
            }
        
        .footer-copy {
                width: 593px;
                margin: 0;
                padding: 0;
                float: left;
                font: 15px/16px 'CaeciliaLTStdLightRegular';
                text-align: left;
                text-decoration: none;
                color: #B8B8B8;
        }
        
        .footer-connect {
                width: 155px;
                margin: -22px 0 0;
                padding: 0;
                float: left;
        }


	.image-txt {
		font: 74px/68px  'CaeciliaLTStdLightBold';
	}
	
	.image span.smallhead {
		font: 15px/16px 'CaeciliaLTStdLightRegular';
	}
        
        br.mobbr {
            display:none;
        }
}


/* Smartphones (portrait) iPhone portrait  ----------- */
@media only screen and (min-width : 359px) and (max-width: 360px) {
	
	h1.masthead {
		margin: 0 0 0 10px;
		padding: 20px 0 0;
		/*font: normal 25px/20px 'caecilia_lt_std46LtIt';*/
		font: normal 20px/20px 'CaeciliaLTStdLightRegular';
	}
	
	.navigation {
		height: 55px;	
	}
	
	.navigation-masthed {
		width: 360px;
		margin: 0 auto 20px;
		padding: 0;
		text-decoration: none;
		color: #CCC;
		text-align: left;
		-webkit-font-smoothing: antialiased;
	
	}
	
	.navigation-content {
		display: none;
	}
	
	
	#mobile-menu {
		display: inline-block;
		position: absolute;
		right: 0px;
		z-index: 999
	}

	
	.image {
		height: 300px;
	}
	
	.landing {
		background: url(../images/wht_square.png) 17px,
		url(../images/wht_square.png) center 7px,
		url(../images/welcome_full_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
        
        .about {
                background: url(../images/wht_square.png) center 7px,
                url(../images/about_banner_320.jpg) no-repeat center 3px,
                url(../images/blk_square.png) 0 7px;
        }
	
	.penguin {
		background: /*url(../images/wht_square.png) 17px,
		url(../images/wht_square.png) center 7px,*/
		url(../images/penguinbooks_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
	
	.dandad {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/dandad_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
	
	.why {
		background: url(../images/wht_square.png) center 7px,
		url(../images/why_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
        
        .infocus-photo2frame {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/infocus_photo2frame_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .penguinclassics {
            background: /*url(../images/wht_square.png) center 7px,*/
            url(../portfolio/images/penguinclassics_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
	.pel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/pel_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .lego {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/lego_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .digitaljournal {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/infocus_digitaljournal_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        } 
        
        .gretel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/gretel_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .blueprint {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/blueprint_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .puffindesigner{
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/puffin_designer_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .digitalcanvasjane {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/digital_canvas_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .youthapparel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/tshirts_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .penguincubator {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/virtual_vending_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .devilmaycare {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/devilmaycare_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .thetshirt {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/thetshirt_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .lesleypearse {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/lesleypearse_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .jamieamerica {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/jamieamerica_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.cruk {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/cruk_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
	.rosewood {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/rosewood_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.airbus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/airbus_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.bbcadvertsingawards {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/bbcadvertisingawards_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.ethicalinvestor {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/ethicalinvestor_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.mandofootloose {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/footloose_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.pagebuilder {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/pagebuilder_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.futureproof {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/futureproof_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.lengthswegoto {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/lengthswegoto_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.dassaultsystems {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/dassaultsystems_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.cathaypacific {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/cathaypacific_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.optus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/optus_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.image-txt {
		margin: 0;
		padding: 0;
		display: table-cell; 
		vertical-align: middle; 
		text-align: center;
		text-transform:uppercase;
		
		font: 52px/45px 'CaeciliaLTStdLightBold';
		text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
		
		text-decoration: none;
		color: #FFF;
	}
	
	.image span.smallhead {
		display: none;
	}
        
        br.mobbr {
            display:block;
        }
	
	.fade {
		display: none;
	}
	
        .fordesktop {
            display: none
        }
        
	.formob {
		display: block;
	}
		
	.col {
		width: 100%;	
	}
	
	.col p.porfolio-description {
		margin: -20px 0 30px 0;
		padding: 0;
		text-align: center
	}
	
	
	.col-threequarts {
		width: 100%;
	}
	
	.col-third {
		position: relative;
		width: 100%;
		float: left;
		text-align: left;
	}
	
	.col-third.spacer {
		display: none;
	}
	
	.img-holder {
		display: none;
		/*
		margin: 0 0 25px;
		padding: 0;
		*/
	}
	
	.img-holder.hold {
                display: inline-block;
		margin: 0 0 25px;
		padding: 0;
	}
	
	.col-half {
		width: 100%;
	}
	
	.col-twothird {
		width: 100%;
	}
	
	.content-text-content {
		margin: 0 auto;
		padding: 0 10px 0;
		width: 340px;
		/*color: #B8B8B8;*/
                color: #999;
		text-align: left;
		font: 16px/24px 'CaeciliaLTStdLightRegular'; 
	}
	
        .footer-content {
                width: 340px;
                margin: 0 auto;
                padding: 0 0 80px 0;
                text-align: center
            }
        
        .footer-copy {
                width: 340px;
                margin: 0 0 40px;
                padding: 0;
                font: 15px/16px 'CaeciliaLTStdLightRegular';
                text-align: center;
                text-decoration: none;
                color: #B8B8B8;
        }
        
        .footer-connect {
                width: 155px;
                margin: 0px 85px 0;
                padding: 0;
        }
        
        
	.scroll-arrow {
		margin: 30px 0 20px 0;
		padding:0;
	}
	
	.scroll-arrow img {
		/*display: none;*/
		width: 30px;
		
	}
	
	.firstline {
		text-align: center;
		margin-bottom: 10px;
	}
	
	.firstline::first-line {
		font-family: 'CaeciliaLTStdLightRegular';
	}
	
	.description {
		display: none;
	}
	
	
	h2.maintitle-txt {
		margin: 0;
		font: 28px/30px 'CaeciliaLTStdLightRegular';
		text-align: center;
	}
	
	h3.subtitle {
		margin: 6px 0 0;
		font: 24px/24px 'CaeciliaLTStdLightRegular';
		text-align: center;
	}
	
	
	.sectiontitle {
		margin: 0 0 20px;
		padding: 0;
		
	}
	
	.content-text-content p:first-child {
		margin: 0;
		padding: 0 15px 0 15px;
	}
	
	.content-text-content p {
		margin: 0 0 15px;
		padding: 0 15px 0 15px;
	}
	
	.clr50 {
		display: block;
		clear: both;
		height: 30px;
	}
	
}






/* Smartphones (portrait) iPhone portrait  ----------- */
/* @media only screen and (max-width : 320px) { --- CHANGED 1 MAY 2020*/
@media only screen and (max-width : 500px) { 	
	h1.masthead {
		margin: 0 0 0 10px;
		padding: 20px 0 0;
		/*font: normal 25px/20px 'caecilia_lt_std46LtIt';*/
		font: normal 20px/20px 'CaeciliaLTStdLightRegular';
	}
	
	.navigation {
		height: 55px;	
	}
	
	.navigation-masthed {
		width: 320px;
		margin: 0 auto 20px;
		padding: 0;
		text-decoration: none;
		color: #CCC;
		text-align: left;
		-webkit-font-smoothing: antialiased;
	
	}
	
	.navigation-content {
		display: none;
	}
	
	
	#mobile-menu {
		display: inline-block;
		position: absolute;
		right: 0px;
		z-index: 999
	}

	
	.image {
		height: 300px;
	}
	
	.landing {
		background: url(../images/wht_square.png) 17px,
		url(../images/wht_square.png) center 7px,
		/*url(../images/welcome_full_320.jpg) no-repeat center 3px,*/
		url(../images/about_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
	
        .about {
                background: url(../images/wht_square.png) center 7px,
                url(../images/about_banner_320.jpg) no-repeat center 3px,
                url(../images/blk_square.png) 0 7px;
        }
        
	.penguin {
		background: /*url(../images/wht_square.png) 17px,
		url(../images/wht_square.png) center 7px,*/
		url(../images/penguinbooks_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
	
	.why {
		background: /*url(../images/wht_square.png) 17px,*/
		url(../images/wht_square.png) center 7px,
		url(../images/why_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) center 7px;
	}
        
        .infocus-photo2frame {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/infocus_photo2frame_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .dandad {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/dandad_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .penguinclassics {
            background: /*url(../images/wht_square.png) center 7px,*/
            url(../portfolio/images/penguinclassics_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
        .pel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/pel_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .lego {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/lego_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .digitaljournal {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/infocus_digitaljournal_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .gretel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/gretel_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .blueprint {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/blueprint_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .puffindesigner{
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/puffin_designer_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;		
        }
        
        .digitalcanvasjane {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/digital_canvas_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .youthapparel {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/tshirts_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .penguincubator {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/virtual_vending_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .devilmaycare {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/devilmaycare_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;	    
        }
        
        .thetshirt {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/thetshirt_banner_768.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .lesleypearse {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/lesleypearse_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
        .jamieamerica {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/jamieamerica_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.cruk {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/cruk_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
        
	.airbus {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/airbus_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.bbcadvertsingawards {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/bbcadvertisingawards_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.ethicalinvestor {
            background: url(../images/wht_square.png) center 7px,
            url(../portfolio/images/ethicalinvestor_banner_320.jpg) no-repeat center 3px,
            url(../images/blk_square.png) 0 7px;
        }
	
	.mandofootloose {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/footloose_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.pagebuilder {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/pagebuilder_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.futureproof {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/futureproof_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.lengthswegoto {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/lengthswegoto_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.dassaultsystems {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/dassaultsystems_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.cathaypacific {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/cathaypacific_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.optus {
		background: url(../images/wht_square.png) center 7px,
		url(../portfolio/images/optus_banner_320.jpg) no-repeat center 3px,
		url(../images/blk_square.png) 0 7px;
	}
	
	.image-txt {
		margin: 0;
		padding: 0;
		display: table-cell; 
		vertical-align: middle; 
		text-align: center;
		text-transform:uppercase;
		
		font: 52px/45px 'CaeciliaLTStdLightBold';
		text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
		
		text-decoration: none;
		color: #FFF;
	}
	
	.image span.smallhead {
		display: none;
	}
        
        br.mobbr {
            display:block;
        }
	
	.fade {
		display: none;
	}
	
        .fordesktop {
            display: none
        }
        
	.formob {
		display: block;
	}
		
	.col {
		width: 100%;	
	}
	
	.col p.porfolio-description {
		margin: -20px 0 30px 0;
		padding: 0;
		text-align: center
	}
	
	.col-threequarts {
		width: 100%;
	}
	
	.col-third {
		position: relative;
		width: 100%;
		float: left;
		text-align: left;
	}
	
	.col-third.spacer {
		display: none;
	}
	
	.img-holder {
		display: none;
		/*
		margin: 0 0 25px;
		padding: 0;
		*/
	}
	
	.img-holder.hold {
                display: inline-block;
		margin: 0 0 25px;
		padding: 0;
	}
	
	.col-half {
		width: 100%;
	}
	
	.col-twothird {
		width: 100%;
	}
	
	.content-text-content {
		margin: 0 auto;
		padding: 0 10px 0;
		width: 300px;
		/*color: #B8B8B8;*/
                color: #666;
		text-align: left;
		font: 16px/24px 'CaeciliaLTStdLightRegular'; 
	}
	
        .footer-content {
                width: 300px;
                margin: 0 auto;
                padding: 0 0 80px 0;
                text-align: center
            }
        
        .footer-copy {
                width: 300px;
                margin: 0 0 40px;
                padding: 0;
                font: 15px/16px 'CaeciliaLTStdLightRegular';
                text-align: center;
                text-decoration: none;
                color: #B8B8B8;
        }
        
        .footer-connect {
                width: 155px;
                margin: 0px 72px 0;
                padding: 0;
        }
        
	.scroll-arrow {
		margin: 30px 0 20px 0;
		padding:0;
	}
	
	.scroll-arrow img {
		/*display: none;*/
		width: 30px;
		
	}
	
	.firstline {
		text-align: center;
		margin-bottom: 10px;
	}
	
	.firstline::first-line {
		font-family: 'CaeciliaLTStdLightRegular';
	}
	
	.description {
		display: none;
	}
	
	
	h2.maintitle-txt {
		margin: 0;
		font: 28px/30px 'CaeciliaLTStdLightRegular';
		text-align: center;
	}
	
	h3.subtitle {
		margin: 6px 0 10px 0;
		font: 24px/24px 'CaeciliaLTStdLightRegular';
		text-align: center;
	}
	
	h3.subtitle.left {
		margin: 6px 0 10px 0;
		font: 24px/24px 'CaeciliaLTStdLightRegular';
		text-align: left;
	}
	
	
	.sectiontitle {
		margin: 0 0 20px;
		padding: 0;
		
	}
	
	.content-text-content p:first-child {
		margin: 0;
		padding: 0 10px 0 10px;
		margin: 30px 0 0;
	}
	
	.content-text-content p {
		margin: 0 0 15px;
		padding: 0 10px 0 10px;
	}
	
	.clr50 {
		display: block;
		clear: both;
		height: 30px;
	}		
	
}




.content-text {
	margin: 0;
	padding: 0;
	width: 100%;
	/*background: #FFF;*/
}


.content-text-content img {
	width: 100%;
}



a.article-image {
	display: inline-block;
	/*height: 315px;*/
	width: 100%;
	position: relative;
	transition: all 0.4s ease-in-out;
}

.article-x {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 25px;
	height: 25px;

}

.article-x span {
	position: absolute;
	width: 120px;
	z-index: 10;
	top: 15px;
	right: 5px;
	font: 13px/16px 'CaeciliaLTStdLightRegular';
	color: #FFF;
	
	opacity: 0;
	
	transition: all 0.4s ease-in-out;
    
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease;
	
}

.mdiv {
	height:25px;
	width:1px;
	margin-left:12px;
	background:#FFF;
	
	transform: rotate(90deg);
	-ms-transform: rotate(90deg); /* IE 9 */
	-webkit-transform: rotate(90deg); /* Safari and Chrome */
	Z-index:1;
	
	transition: all 0.4s ease-in-out;
    
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease;
}



.md {
	height:25px;
	width:1px;
	background:#FFF;
	
	transform: rotate(90deg);
	-ms-transform: rotate(90deg); /* IE 9 */
	-webkit-transform: rotate(90deg); /* Safari and Chrome */
	Z-index:2;
	
	transition: all 0.4s ease-in-out;
    
	-webkit-transition: all .8s ease;
	-moz-transition: all .8s ease;
	-ms-transition: all .8s ease;
	-o-transition: all .8s ease;
	transition: all .8s ease;
}

a.article-image:hover > .article-x > .mdiv  {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
	background:#39C;
}

a.article-image:hover > .article-x > .mdiv > .md  {
	background:#39C;
}

a.article-image:hover > .article-x > span {
	opacity: 1;
}


.sorry-msg {
	display: none;
}

/* Smartphones (portrait) iPhone landscape  ----------- */
@media only screen and (max-width : 480px) and (orientation:landscape) {
	#content {
		display: none;
	}
	
        .footer {
            display: none
        }
        
	.sorry-msg {
		display: table;
		height: 320px;
		margin: 0; 
		padding: 0;
		text-align: left;
		font: 27px/30px 'CaeciliaLTStdLightBold';
		text-decoration: none;
		color: #CCC;
	}
	
	p {
		margin: 0;
		padding: 30px;
		display: table-cell; 
		vertical-align: middle; 
	}
}

/* Smartphones (portrait) mobile landscape  ----------- */
@media only screen and (min-width : 639px) and (max-width : 640px) and (orientation:landscape) {

	#mobile-menu {
		display: none;
	}
	
	#sidr {
		display: none;
	}
	
	#content {
		display: none;
	}
	
        .footer {
            display: none
        }
        
	.sorry-msg {
		display: table;
		height: 320px;
		margin: 0; 
		padding: 0;
		text-align: left;
		font: 27px/30px 'CaeciliaLTStdLightBold';
		text-decoration: none;
		color: #CCC;
	}
	
	p {
		margin: 0;
		padding: 30px;
		display: table-cell; 
		vertical-align: middle; 
	}
}

/* Smartphones (portrait) iPhone portrait  ----------- */
@media only screen and (min-width : 567px) and (max-width : 568px) and (orientation:landscape) {

	
	#mobile-menu {
		display: none;
	}
	
	#sidr-right {
		display: none;
	}
	
	#content {
		display: none;
	}
        
        .footer {
            display: none
        }
	
	.sorry-msg {
		display: table;
		height: 320px;
		margin: 0; 
		padding: 0;
		text-align: left;
		font: 27px/30px 'CaeciliaLTStdLightBold';
		text-decoration: none;
		color: #CCC;
	}
	
	p {
		margin: 0;
		padding: 30px;
		display: table-cell; 
		vertical-align: middle; 
	}
}