/*   
Theme Name: Peninsula Digital
Theme URI: http://peninsuladigital.com.au
Description: Peninsula Digital Marketing
Author: Peninsula Digital - Amy, Lead Web Developer
Author URI: 
License:
Version: 2.2.3
*/

/* Global */
/* ---------------------------------------------------------- */
body { font-family: 'Roboto', sans-serif;  margin: 0px; padding: 0px;}
html {padding: 0px; margin: 0px;}

/* Flex Grid */
.outer_wrap {width:100%;}
.inner_wrap {width:450px; text-align:center; padding-top:8%; margin:0 auto;}
.flex_10,
.flex_20,
.flex_25,
.flex_33,
.flex_40,
.flex_50,
.flex_60,
.flex_66,
.flex_75,
.flex_80,
.flex_90,
.flex_100 {display: inline; float: left; position: relative;}
.flex_10 {width: 10%;}
.flex_20 {width: 250px; padding:25px;}
.flex_25 {width: 25%;}
.flex_40 {width: 40%;}
.flex_50 {width: 50%; }
.flex_60 {width: 60%;}
.flex_66 {width: 66%;}
.flex_75 {width: 75%;}
.flex_80 {width: 80%;}
.flex_90 {width: 90%;}
.flex_100 {width: 100%;}
.clear {clear: both;}
#clearing {clear: both;}



/* Header */
/* ---------------------------------------------------------- */
#header {padding: 30px;}
.outer_header_wrap {width:100%;}
.inner_header_wrap {width:100%;}


/* Navigation */
/* ---------------------------------------------------------- */
nav a#pull {display: none;}

#navigation {
	display: inline-block;
	float: right;
	margin: 0px;
	padding: 0px;
	position:relative;
	padding-bottom:10px;
	margin-top:85px;
}

#navigation a {color:#3b3c3c;}
#navigation li li a {color:#3b3c3c;}
#navigation ul {font-size: 16pt; font-weight:500; letter-spacing:1px; list-style: none; margin: 0px 0px 0px 0px; padding-left: 0;}
#navigation li {float: left; position: relative;}

#navigation a { 
	display: block;
	line-height: 3.333em;
	padding: 0 1.2125em;
	padding-right:60px;
	text-decoration: none;
	}

#navigation ul ul { background: rgba(255, 255, 255, 0.2); display: none; float: left; margin: 0; position: absolute; top: 3.333em; left: 25px; z-index: 99999;}
#navigation ul ul ul {left: 100%; top: 0;}
#navigation ul ul a {background: none; color:#3b3c3c; font-size: 12pt; font-weight: 500; height: auto; line-height: 1.4em; padding: 10px 10px; width:280px; text-align: left; }
#navigation li:hover > a,
#navigation ul ul :hover > a,
#navigation a:focus {}
#navigation li:hover > a,
#navigation a:focus {}
#navigation ul li:hover > ul {display: block;}
#navigation .current_page_item > a,
#navigation .current_page_ancestor > a {}

/* Home */
/* ---------------------------------------------------------- */
.header_image {  margin:0 auto; padding-top:300px; height:100%;}
.hd1_wrap {width:90%; margin:0 auto;}

.header_image_home {
  background-repeat:no-repeat;
  background-position: center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:650px;
}

.header_image_wrap { position:relative;}
.button_wrap {width:220px; margin: 0 auto; padding-top:50px;}

.button {
    border: none;
    font-weight:300;
    padding: 20px 50px;
    text-align: center;
    text-decoration: none;
    color:#3b3c3c;
    font-size: 15pt;
    cursor: pointer;}

.button5 {background-color:#fff; color:#3b3c3c;}
#white {color:#3b3c3c;}    

.white_wrap_home {background:#fff; width:100%;  padding:50px 0px;}
.white_text_wrap_home {width:80%; margin:0 auto; } 
.white_text_wrap_home h1 {line-height: 1.5; font-size:29pt; text-align:center;  }

/*Home NEW section*/
.containerh{  display: flex;
  flex-direction: row;
  background-color: #56b8ac;
  justify-content: center;}


.texth { text-align:center; color:#fff;
 width:55%;
 margin:30px;
 padding:60px;
}

.backgroundimageh { 
    margin:30px;
    width:650px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;}


.yellow_wrap_hm {width:100%; background:#f7db6b; }
.yellow_inner {width:80%; margin:0 auto;  padding:50px 0px 0px 0px; }

.yellow_inner_text {width:55%; margin:0 auto; position:relative; top:-110px;}

.yellow_inner_text p {text-align:center; font-size:26pt!important; line-height:1.6em; font-weight:300;}

.img_1 {width:20%; float:left; padding:0px 20px;}
.img_2 {width:20%; float:left; padding:0px 20px;}
.img_border {border-bottom:10px solid #56b8ac; float:left; width:54%; padding-top:120px;}

/*Home Stories*/
.aqua_wrap_home {width:100%; background:#56b8ac;}
.aqua_heading {width:90%; margin:0 auto; padding:20px 0px;}


.story_wrap { padding:25px 0px; display: flex;
  justify-content: center; }

.story_image {  background-repeat:no-repeat;
  background-position: center center; 
  background-size: cover;
  position:relative;
	margin: 25px;
    flex: 1 0 auto;
    height:auto;}

.story_image:before {
    content: "";
    display: block;
    padding-top: 100%;
    float: left;
}

.yellow_overlay {  
	height:450px; 
	background-color: rgba(247, 219, 107, 0.0);   
	position:absolute;
    width:100%;
    height:100%;
    z-index:9999; }

.yellow_overlay h3 {font-size:26pt!important;}

a:hover .yellow_overlay {background-color: rgba(247, 219, 107, 0.8);}
a:hover .yellow_text {opacity:1;}

.yellow_text {padding:20% 20px 20px 20px; text-align:center; opacity:0; }

/*animations*/
.animation-element.slide-left {
  opacity: 0;
  -moz-transition: all 750ms linear;
  -webkit-transition: all 750ms linear;
  -o-transition: all 750ms linear;
  transition: all 750ms linear;
  -moz-transform: translate3d(-100px, 0px, 0px);
  -webkit-transform: translate3d(-100px, 0px, 0px);
  -o-transform: translate(-100px, 0px);
  -ms-transform: translate(-100px, 0px);
  transform: translate3d(-100px, 0px, 0px);
}

.animation-element.slide-left.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

.hideme{opacity:0;}


/* about V2 */
/* ---------------------------------------------------------- */

.header_image_about {height:100%;}

.header_image_back_about{
  background-repeat:no-repeat;
  background-position: center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:450px;
}

.blue_header_outer_wrap {background:#56b8ac;}
.blue_header_wrap {width:950px; margin:0 auto; padding:40px 0px;}
.blue_header_wrap_h2 {width:950px; margin:0 auto; padding:20px 0px;}

.blue_header_wrap h1 {color:#3b3c3c; font-size:32pt; line-height:1.4em; text-align:center; font-weight:normal;}
#hd2 {color:#3b3c3c; font-size:32pt!important; line-height:30pt; text-align:center; font-weight:normal;}

.outer_text_about_wrap {width:100%;}
.intro_about {width:920px; margin:0 auto; padding:50px 0px;}
.intro_about_buttons {width:700px; margin:0 auto;}

.abButton1 { width:300px; float:left; border:4px solid #f7db6b; text-align:center; padding: 20px 0px;}
#ab1 {font-size:16pt;  font-weight:bold; color:#f7db6b;}
.abButton2 {width:300px; float:right; background:#f7db6b; text-align:center; padding: 24px 0px;}
#ab2 {font-size:16pt; font-weight:bold; color:#fff;}

.abButton3 {width:300px; float:left; background:#f7db6b; text-align:center; padding: 24px 0px;}
#ab3 {font-size:16pt; font-weight:bold; color:#fff;}

.contact_button_wrapper {width:305px; margin:0 auto; padding:20px 0px;}

/*about icons*/
.process_icons {display: flex; justify-content: center; width:80%; margin:0 auto; padding-top:50px;}
.icon {margin:2%; width:20%; }
.icon h3 {text-align:center; font-weight:normal;}

.breakab {height:100px; clear:both;}

/* Services */
/* ---------------------------------------------------------- */
.header_image_services { height:100%;}

.services_outer_wrap {width:80%; margin:0 auto; padding:50px 0px;}
.services_inner_wrap_l {float:left; width:50%;}

.flex_service_img {float:right; width:45%; }

.background_red {background: rgba(219, 39, 49, 0.75); position:absolute; z-index:1; }

.flex_service_img {  
  background-repeat:no-repeat;
  background-position: center center; 
  background-size: cover;
  position:relative;
  height:360px;
}
.redbackground {
    position:absolute;
    width:90%;
    height:85%;
    background-color: #f7db6b;
    right:-40px;
    bottom:-40px;
    z-index:-9999;
}
.servicebreak {height:100px;}

/* blog */
/* ---------------------------------------------------------- */
.yellow_header_outer_wrap {background:#f7db6b;}
.outer_wrap_blog {width:100%; height:100%; }

.intro_blog {width:800px; margin:0 auto; padding-top:50px;}
.intro_blog p,
.intro_blog h2 {color:#3d3e3e;}

.blog_image_wrap {width:300px; margin:0 auto;}

.blog_thumb{
  background-repeat:no-repeat;
  background-position: center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:350px;

}

.panels_outer {width:1950px; margin:0 auto;}

.column {
    box-sizing: border-box;
    float: left;
    width: 29%;
    margin:2%;   
	min-height:600px;
    background:#56b8ac;
}


.row:after {
    content: "";
    display: table;
    clear: both;
}

.blog_text_wrap {width:80%; margin:0 auto; }
.date {text-align:center; }

.view_post {border:3px solid #e2525a; text-transform:uppercase; text-align:center; padding:15px 25px; width:150px; margin:0 auto; margin-top:25px; font-weight:500; }
.readmorebreak {height:30px;}

.view_post a {color:#e2525a!important; font-size:14pt;}




/*select*/
.breakcat {height:50px;}
.select_wrap_outer {width:700px; margin:0 auto; padding:50px 0px;}
.select_wrap {width:350px; float:left; padding:15px 0px;}
.category_title {width:140px; float:left;}
.select-style {
    border: none;
    width: 100%;
    border-radius: none;
    overflow: hidden;
    background: #fff;
}

.select-style select {
	color:#3b3c3c;
	font-weight:500;
    padding: 15px 15px;
    width: 100%;
    border: none;
    box-shadow: none;
    background: transparent;
	background-image: url("http://peninsuladigital.com.au/wp-content/uploads/2018/06/peninsula-digital-arrow.png");
    background-repeat:no-repeat;
	background-size: 25px auto;
	background-position: 97% 50%; 
    -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.select-style select:focus {outline: none;}

#cate {font-weight:500; font-size:15pt; color:#3d3e3e;}

/*blog mail*/
.mail_outer_wrap {width:97%; background:#535454; margin:30px auto; }
.mail_wrap {width:1250px; margin:0 auto; text-align:center; color:#fff; padding:50px 0px;}
#mail_text_wrap {float:left; margin-right:20px; }
#mail_submit_wrap {float:right; }

.mail_wrap input[type=submit] {
    font-weight:600;
	font-size: 18pt; 
	color: #fff;
	background: #2d4858;
	border: 0px;
	padding:25px 40px;
	}

.mail_wrap input[type="email"],
.mail_wrap input[type="text"]
{ 
	font-size:14pt!important; 
	padding:15px;
    border: 10px solid #2d4858;
    background-color: #fff;
    color: #000;
}


#mail {text-transform:uppercase; text-align:center; font-size:1.9em;}
/*posts*/
.outer_wrap_posts {background-color: #56b8ac; width:100%;}
.inner_wrap_posts {width:950px; margin:0 auto; background:#fff; padding:30px 0px;}
.bread-crumb {padding:50px 0px; color:#fff;}
.bread-crumb a {color:#fff!important;}
.inner_wrap_post_text {width:85%; margin:50px auto; }

#blog { font-size:26pt!important;}
#blog-title {line-height:1.3em; font-size:36pt; text-align:center; padding:0px 20px 10px 20px; margin:0px; color:#3b3c3c; font-weight:500; }


/*portfolio*/
/* ---------------------------------------------------------- */
.blue_text_wrap {width:100%;}
.blue_text {width:95%; margin:0 auto; padding-bottom:70px;}

.portfolio_outer_wrap {width:100%;}
.portfolio_inner_wrap  {width:98%; margin:0 auto;}

.parentp {  
position: relative;
float:left;
width:33%;
height:450px;
display: flex;
flex-wrap: wrap;
margin:15px;
	
}

.parentport { 
  position: relative;
  flex: 1 0 33%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}

.overlayp:before {
  position: absolute;
  content:" ";
  top:0;
  left:0;
  width:100%;
  height:100%;
  display: block;
  z-index:1;
  background-color: rgba(219,39,49,0.8);}

.childport { 
  position: relative;
  z-index:4;
  width:100%; 
  height:450px;	
}

#porth3 {padding-top:15%;}
.childport h3 {color:#fff; font-size:40pt!important; text-align:center;  line-height:1.3em; font-weight:700;}
.childport p {color:#fff; text-align:center; }

.hidemep {width:100%; height:100%; position:absolute; top:0; left:0; opacity:0;}
.hidemep p { font-weight:600; font-size:16pt!important; position:absolute; bottom:45px; left: 0;
right: 0;
margin: auto; letter-spacing:1px;}
.hidemep:hover {opacity:1;  }

.overlayp:hover {background-color: rgba(219,39,49,1);}


/* Contact */
/* ---------------------------------------------------------- */
.header_image_contact{
  background-repeat:no-repeat;
  background-position: 50% 20%; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height:450px;}


.outer_wrap_contact {width:100%; background:#fff;}
.inner_wrap_contact {padding:40px 0px; width:900px; margin: 0 auto;  }

.inner_wrap_contactform {width:1300px; margin:0 auto;}
#contactform_contact {width:100%; }
.contact_phone {width:100%; padding-top:20px;}

#name_contact_wrap {width:50%; float:left; display:inline-block; position:relative; }
#email_contact_wrap {width:50%; float:left; display:inline-block; position:relative;}
#email_contact_wrap input[type="email"] {width:95%; margin-left:20px; margin-bottom:20px; border:4px solid #56b8ac; font-size:12pt!important; color:#535454; text-transform:lower; padding:5px;}
#email_contact_wrap input[type="text"] {width:95%; margin-left:20px;  margin-bottom:20px;  border:4px solid #56b8ac; font-size:12pt!important; color:#535454; text-transform:lower;}
#contactform_contact input[type="text"] {width:95%; border:4px solid #56b8ac;  margin-bottom:20px;  font-size:12pt!important; padding:5px; color:#535454; text-transform:lower;}
#contactform_contact textarea { border:4px solid #56b8ac; width: 100%; height:200px; max-height:800px; width:100%; color:#535454; text-transform:lower; padding:5px;}
#contactform_contact  input[type=submit] {
    font-weight:300;
	font-size: 1.0em; 
	background: #56b8ac;
	padding:7px 40px;
	margin-right:-10px;
	color: #fff;
	text-transform: uppercase;
	border: 0px;
	float: right;}



.social_contact img {width:30px; padding:10px 10px 0px 10px; display:inline; position:relative;}



.wpcf7-form .wpcf7-response-output.wpcf7-validation-errors {
    color: #D8000C;
    background-color: #FFBABA;
    border: 0;
    padding: 10px;
}
.wpcf7-form .wpcf7-response-output.wpcf7-mail-sent-ok {
    color: #4F8A10;
    background-color: #DFF2BF;
    border: 0;
    padding: 10px;
}
div.wpcf7-mail-sent-ok:before,div.wpcf7-validation-errors:before {
    font: 26px/30px dashicons;
    margin-right: 16px;
    vertical-align: middle;
}
span.wpcf7-not-valid-tip {color:#fff; font-size:10pt; font-weight:normal; display:none;}


/* Sidebar */
/* ---------------------------------------------------------- */
#sidebar {margin: 0px 0px 0px 20px;}
#sidebar img {max-width: 100%; height: auto;}
#pages,
#archives,
#categories,
#feeds,
#sidebarmeta,
#blogroll {margin: 0px;}
.sidebaritem {padding: 0px 0px 10px 0px; margin: 0px 0px 10px 0px; border-bottom: 1px dotted #ccc;}

/* Post */
/* ---------------------------------------------------------- */
.postmetadata {padding: 0px 0px 5px 0px; color: #777777; font-size: 12px; line-height: 18px; text-transform: capitalize; clear: both;}
.meta {padding: 0px 0px 10px 0px;}
object,
video {max-width: 100%; width: 100%;}
.wp-caption {max-width: 95%; height: auto;}
img {max-width: 100%; height: auto;}
.wp-caption img,
.gallery-icon img {max-width: 98%; height: auto;}
.content {padding: 30px;}
.archive .post,
.blog .post {padding: 0px 0px 50px 0px;}
.post,
.type-post,
.type-page {padding: 0px 0px 10px 0px;}
.textcenter {text-align: center;}
.textleft {text-align: left;}
.textright {text-align: right;}
.aligncenter {display: block; margin-left: auto; margin-right: auto;}
.alignleft {float: left; margin: 0px 20px 20px 0px; clear: both;}
.alignright {float: right; margin: 0px 0px 20px 20px; clear: both;}

.attachment-post-thumbnail {
	float: left;
	min-width: inherit;
	border: 5px solid #fff;
	-moz-box-shadow: 0 0 5px #888;
	-webkit-box-shadow: 0 0 5px #888;
	box-shadow: 0 0 2px #888;
	overflow: hidden;
	margin: 0px 20px 20px 0px;}

/* Meta */
/* ---------------------------------------------------------- */
.time {background: url(images/swpf_icons.png) no-repeat left -88px; margin: 0px; padding: 0px 0px 0px 23px;}
.post-comments {background: url(images/swpf_icons.png) no-repeat left -66px; margin: 0px; padding: 0px 0px 0px 23px;}
.categories {background: url(images/swpf_icons.png) no-repeat left -108px; margin: 0px; padding: 0px 0px 0px 23px;}
.tags {background: url(images/swpf_icons.png) no-repeat left -24px; margin: 0px; padding: 0px 0px 0px 23px;}
.meta_author {background: url(images/swpf_icons.png) no-repeat left -45px; margin: 0px; padding: 0px 0px 0px 25px;}
.author {background: #f3f3f3; padding: 20px 20px 0px 0px;margin: 0px 0px 20px 0px;}
.author img {float: left; margin: 0px 20px 10px 0px;}
.authorinfo h3 {margin: 0px 0px 10px 0px; padding: 0px;}
.authorinfo p {margin: 0px; padding: 0px 0px 20px 20px; font-size: 12px;}

/* Footer */
/* ---------------------------------------------------------- */

.outer_footer_wrap {width:100%; background:#73a7ba;}
.inner_footer_wrap {width:90%; margin:0 auto;}

.flex_logo {float:left; width:200px; margin-top:50px;}
.flex_copy {width:340px;  margin:0 auto; position:relative; bottom:-90px;}
.flex_copy a,
.flex_copy p{color:#3d3e3e; font-weight:300; font-size:13pt!important;}
.social_wrap { display:inline; position:relative; float:right; margin-top:10px;}
.social  {width:35px; display:inline; position:relative; float:left; padding:20px 0px 0px 40px;}
.space {height:25px;}


/* Pagination */
/* ---------------------------------------------------------- */
.pagenavi {margin: 0 auto 20px auto; width: 400px; padding: 5px; background: #f3f3f3; border: 1px solid #ccc; -moz-box-shadow: inset 0 0 5px #fff; -webkit-box-shadow: inset 0 0 5px #fff; box-shadow: inset 0 0 5px #fff;}
.pagenavi a {padding: 5px 6px 4px 6px; margin: 3px; text-decoration: none; color: #666; background-color: inherit;}
.pagenavi a:hover {color: #000;}
.pagenavi span.pages {padding: 5px 6px 4px 6px; margin: 3px; color: #333; font-weight: bold; background-color: inherit;}
.pagenavi span.current {padding: 5px 6px 4px 6px; margin: 3px; font-weight: bold; color: #fff; background-color: #ccc;}

/* Typography Framework */
/* ---------------------------------------------------------- */
.white {color:#fff;}
#header h1 {font-weight: 600; margin: 0px; line-height: 36px;}
#header h1 a {color: black; font-size: 36px; letter-spacing: -.5px; text-decoration: none;}
#header h1 a:hover {color:#3d3e3e; text-decoration: none;}
.description {color: #777777;}
a,
a:visited {text-decoration: none; color:#3d3e3e;}
a:hover {text-decoration: none; color:#3d3e3e;}
thead {display: table-header-group;}
tr,
img {page-break-inside: avoid;}

img {max-width: 100% !important;}

h2,
h3 {page-break-after: avoid;}

p,
h2,
h3 {orphans: 3; widows: 3;}

p {font-size:15pt !important; font-weight:400; line-height:1.3em; color:#3d3e3e;}

small {font-size: 85%;}
strong {font-weight: bold;}
em {font-style: italic;}
.left {text-align: left;}
.right {text-align: right;}
.center {text-align: center;}

h1,
h3,
h3,
h6 {margin: 10px 0; font-family: inherit; line-height: 20px; color: inherit; text-rendering: optimizelegibility;}

h2 {color:#3b3c3c; line-height:1.6em; font-size:30pt!important; font-weight:normal;}


h4 {font-size:36pt; line-height:1.6em; font-weight:600; text-align:center; color:#fff;}

h5 {font-weight:400; font-size:16pt; line-height:1.6em; text-align:left;}

.entry-title { line-height:1.3em; font-size:26pt !important; text-align:center; padding:0px; margin:0px; }
.entry-title a {color:#3b3c3c; font-weight:500;}

.headline {padding-bottom: 9px; margin: 20px 0 30px; border-bottom: 1px solid #eeeeee;}

ul.blogs {font-size:14pt; line-height: 27px; color: #000; padding: 0; margin: 0 0 10px 25px;}

ul,
ol { padding: 0; margin: 0 0 10px 25px;}

ul ul,
ul ol,
ol ol,
ol ul {margin-bottom: 0;}

li {line-height: 27px;}
h1.home_header_h1  { color:#3b3c3c; line-height:1.0em; padding-top:0px;  font-size:50pt; text-align:center; font-weight:300;}
#header2 {color:#3b3c3c; line-height:1.6em; font-size:30pt !important; text-align:center; font-weight:300; }

.brown_text h2 { color:#fff; line-height:1.6em; font-size:29pt !important; text-align:center; font-weight:500;}

.brown_text p,
.brown_text a {font-size:16pt !important;  color:#fff; line-height:1.6em; font-weight:400; letter-spacing:1px; text-align:center;}
/*service headings*/
h3 {color:#3d3e3e; font-size:28pt!important; font-weight:500; line-height:1.3em; margin:0px; padding:0px; }
.blue {color:#2d4858; font-size:26pt; margin:0px; margin-bottom:10px; padding:0px; line-height:1.3em;}
.serviceh4 {color:#3d3e3e; font-size:16pt; text-transform:none; text-align:left; font-weight:500; line-height:1.3em;}