

input, textarea, cfinput { padding: 3px; font-size:16px;  

  border: solid 2px #979797;

  transition: box-shadow 0.3s, border 0.3s;}



input[type="radio"]{ 

width: 14px;

	height: 14px; vertical-align: bottom;

    position: relative;

    top: 3px;

margin-top:4px; margin-bottom:5px;

}

 

input[type="checkbox"]{ 

width: 18px;

	height: 18px;  vertical-align: bottom;

    position: relative;

    top: 4px;

}




.red{ color:#990000; }
#red{ color:#990000; }

.blu{ color:#4177b4; }

.grn{ color:#006200; }



select{ padding: 3px;  font-size:14px;  

  border: solid 2px #979797;

  transition: box-shadow 0.3s, border 0.3s;}



a {text-decoration: none; color:black;}



.wrapper {width:100%; min-height:300px; margin:0 auto; max-width:1260px;}

.top {width:100%; min-height:50px;}

header {width:100%; min-height:40px; padding-top:80px; z-index: 99;}

td {font-size:14px;}



.logo { min-height:40px; float:left; width: 410px; margin-top:-60px;;}

.logodrop {margin-right:80px;}



.frame_show{display:none;} .verify{display:none;}

.ph_contact{display:none;}

nav {width:835px; min-height:40px;  float: right;}

nav li {float:left; margin-right:20px; font-size:20px;}

.stand {width:100%; min-height:100px; margin-top:40px; margin-bottom:80px;}

.inner-stand {width:835px; float: right; min-height:100px; }

.footercol1 {width:410px; float:left; min-height:50px; margin-right: 15px;}

.footercol2 {width:410px; float:left; min-height:50px; margin-right: 15px;}

.footercol3 {width:410px; float:left; min-height:50px;  }

section {width:100%; height:80%;}



h2 {font-size: 26px; line-height: 32px; width:90%; font-weight:normal;}



.loop {width:1260px; min-height:10px;}

.profile {width:100%; min-height:300px; margin-top:3px; border-top:1px solid white;}

.magazine {width:100%; min-height:300px; margin-top:15px; border-top:1px solid #8b8b8c; padding-bottom:100px;}

.section-left {width:410px; float:left; min-height:300px;}

.section-right {width:835px; float:right; min-height:300px;}

h5 {margin-top:10px;}

.magazine-image {width:100%; margin-top:15px;}

.magazine-image img {width:100%; height:auto;}

.contact {

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

	position: relative;

	width:100%;

	font-weight:bold;

	z-index: 5;}

	

.nob {

	position:relative;

}	



.page-content {margin-top:30px;margin-bottom:30px;}

.excerpt {margin-top:30px;}

.logo {font-weight:600; font-size:17px; }

.post {width:410px; height:295px; float:left; margin-bottom:15px; position: relative; overflow: hidden;}

.postlogo img{width:450px;  float:left;  position: relative; overflow: hidden; margin-bottom:4px;}

.loop1 {width:100%; min-height:10px; float:left;}

.loop1-left {width:410px; float:left;}

.loop1-right {width:837px; float:right}

.big {width:837px; height:605px; overflow:hidden;}

.big img {height:100%; width:auto; }



.loop2 {width:850px; margin-left:-15px; float:left;}

.loop2 .post {margin-left:15px;}

.loop3 {width:410px; float:right;}

.post img {width:100%; height:auto;}





 .post-title {padding:15px;}

.blue {width: 100%; height:90%; background-color: rgba(38,131,192,1); position: absolute; bottom:0px; }

.blue h2 {color:#fff; font-weight:600;}

#top-pad { width:100%;}



header {background-color: #fff; z-index: 999; }

#inner-header {width:1260px; margin:0 auto;}

.inner-blue {width:1260px; min-height:300px; margin: 0 auto;}

.contact-inner {margin-top:30px; color:#fff; border-top:1px solid #fff;}

.post-container {width:100%;}

.post-container img {max-width: 100%; height:Auto!important;}

.post-second {border-top:1px solid #8b8b8c; margin-top:15px; width:100%;}

.post-container li {list-style-type: none; margin-bottom:10px;}

footer {padding-bottom:30px; margin-top:15px;}

.project-info {width:100%; border-top:1px solid #8b8b8c; margin-top:15px;}

.project-stand-first {width:100%; border-top:none;}

.contact  {-moz-column-count:1; /* Firefox */

-webkit-column-count:1; /* Safari and Chrome */

column-count:1; 

}

.contact a {color:#fff;}



.thumbnail {position: relative;}

.thumbnail img {width:100%; height:auto;}



.blue footer {position: absolute; bottom:10px;}

.child-pages {width:835px; min-height:100px; }

.child1 {width:410px; float:left; min-height:100px; }

.child2 {width:410px; float:right; min-height:100px; }

h4 {border-bottom:1px solid #8b8b8c; margin-bottom:15px; padding-bottom:10px;}

.child-pages {font-size: 15px; line-height: 18px; margin-bottom:0px;}



.stick {position: fixed; top:-62px;}

.sticky {

	position: fixed;

	top: -55px;

}

.image-pad{background: url(images/bottomweb.jpg) no-repeat center center fixed; 

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

	position: relative;

	width:100%; height:250px; z-index: -1;}





.project-stand-first .section-left {min-height: 100px; margin-bottom:30px;}

.project-stand-first .section-right {min-height: 100px;margin-bottom:30px;}

#up-arrow {position: fixed; bottom:30px; right:30px; width:40px; z-index:6;}

#up-arrow img {width:100%; height:auto; z-index:6;}

.project-stand-first h5 {margin-top: 30px!important;}

.project-title {line-height: 22px; padding-bottom: 2px; width:Auto;}

.lower-nav {width:835px; min-height: 200px; background-color:red; float: right;}

.related {width:100%; margin-bottom:30px; margin-top: 15px; border-top:1px solid #8b8b8c; }

.nav-box {width:410px; float:right;}

.next {margin-left:15px;}

.related .section-right {margin-top:15px;}

.nav-box img {width:100%; height:auto;}

.related {margin-top:0px;}

.related p {margin-top:10px;}

.related h5 {margin-top:10px;}



.side-nav {width:100%; height:20px; position: fixed; top:50%; left:0px;}

.side-nav a:hover {border: 0px;}

.nav-left {width:10px; height:20px; float:left; margin-left:30px; }

.nav-right {width:10px; height:20px; float:right; margin-right:30px; }

.nav-left img {width:15px; height:auto;}

.nav-right img {width:15px; height:auto;}



img {border:0px!important; z-index:6;}

.images img {margin-bottom:5px; z-index:6;}

#arrow-button {cursor: pointer; border: 0px; z-index:6;}



.input {

    border: 1px solid #006;

    background: #ffc;

}



.colour-image {position:absolute; top:0px; left:0px; width:100%; }

.colour-image img {width:100%; height:auto;}

.grey-image {position: absolute; top:0px; left:0px; z-index:99; width:100%; height:100%; display:none;}

.phone-nav {display: none;}

.mobile-hide {display:none;}





/* Archive page */





/* timed screensaver styles */



/* OVERLAY */

.blue-overlay {width:100%; height:100%; background-color: rgba(255,255,255,0.92); position: fixed; bottom:0px; z-index:5; }

.no-overlay {width:0; height:0;}



/* Test Styles */



.post-big {width:835px; height:605px; background-color:red; float:right;}

.post-small {width:410px; height:295px; background-color:red; float:left;}

.post-small2 {width:410px; height:295px; background-color:red; float:left; margin-top:15px;}







/*  Ipad+ ----------- */

/* 12px gutters 333 px column */

@media screen and (max-width: 1240px)

{

.wrapper {width:1023px; min-height:1164px;}

.logo {width:333px;}

nav li {float:left; margin-right:18px; font-size:17px;}

.logodrop {margin-right:1px;}

nav {width:678px;}

.inner-stand {width:678px;}

.footercol1 {width:333px; margin-right: 12px;}

.footercol2 {width:333px; margin-right: 12px;}

.footercol3 {width:333px;}

.section-left {width:333px;}

.section-right {width:678px;}

.post {width:333px; height:241px; float:center; margin-bottom:12px;}



.postlogo img{width:450px;  float:center;  position: relative; overflow: hidden; margin-bottom:4px;}



#up-arrow img {display:none;}



.loop {width:1023px; min-height:10px; }

.loop1 {width:100%; min-height:10px; float:left;}

.loop1-left {width:333px; float:left;}

.loop1-right {width:678px; float:right}

.big {width:678px; height:494px;}

.loop2 .post {margin-left:12px;}

.loop2 {width:690px; margin-left:-12px;}

.loop3 {width:333px; }

#inner-header {width:1023px; }

.inner-blue {width:1023px;}

.footercol1 {width:333px; margin-right: 12px;}

.footercol2 {width:333px; margin-right: 12px;}

.footercol3 {width:333px; }

.child-pages {width:678px;}

.child1 {width:333px; }

.child2 {width:333px; }

.nav-box {width:333px; float:left;}

.next {margin-left:12px;}

.related .section-right {margin-top:12px;}

.related {margin-top: 12px; }



.nav-left {width:20px; height:20px; float:left; margin-left:30px;}

.nav-right {width:20px; height:20px; float:right; margin-right:30px;}

.post-previous { width:333px; float:left;}

.post-next { width:333px; float:right; }

.inner-loop {width:1035px;}





/* Force Type size */

h2 {font-size: 26px!important; line-height: 32px!important; width:90%;}



}









/* iPads (landscape) ----------- */

@media only screen 

and (min-device-width : 768px) 

and (max-device-width : 1024px) 

and (orientation : landscape) {

html, body {zoom:0.95;}

}









/* Iphone Landscape */

@media screen and (max-width: 1024px) {
html, body {width:100%; color:black; font-size:14px; line-height:16px; height:610px;}
input, textarea, cfinput { padding: 3px; font-size:16px; border: solid 2px #979797; transition: box-shadow 0.3s, border 0.3s;}
.wrapper {width:490px; height:1025px;}
.inner-stand {width:100%; position: relative; }
.logo {width:100%;}
.logodrop {width:100%; position: relative; }
nav {width:90%;}
nav li {float:left; margin-right:15px; font-size:16px;}
.footercol1 {width:235px; float:left; margin:0px;}
.footercol2 {width:235px; float:right; margin:0px;}
h2 {font-size: 16px!important; line-height: 34px!important; width:235px; float:right;}
.profile {width:100%; min-height:300px; margin-top:-206px; border-top:0px solid white;}



.section-left {width:490px; float:left; min-height:1px; font-size: 16px!important; line-height: 18px!important; }
.section-right {width:490px; float:left; min-height:1px; font-size: 16px!important; line-height: 18px!important; }

.opening {font-size: 20px!important; line-height: 18px!important; width:490px; float:left}
.exerpt {font-size: 20px!important; line-height: 18px!important; width:490px; float:left}

.postlogo img{width:100%; overflow: hidden;}
#up-arrow img {display:none;}
.loop {width:490px; min-height:10px; }
.loop1-left {width:490px; float:none;}
.loop1-right {width:490px; float:none;}
pinmap{display:none;}
.loop3 {width:490px; float:left; }
.post {width:490px; height:348px;}
#inner-header {width:980px; }
.inner-blue  {width:980px; }
.child-pages {display:none }
.child1 {display:none }
.child2 {display:none }
.nav-left {width:10px;}
.nav-right {width:10px; }
.footercol3 {display:none;}
.inner-loop {width:490px;}
.blue {display:none;}

.verify{display:inline; width:100%;  display:visible;  margin-top:106px; font-size:12px; min-height:20px;}

.frame_show{display:inline; }

.ph_contact{display:inline; width:390px; display:visible; min-height:26px; margin-top:106px; }
}


/* Iphone Portrait */

@media screen and (max-width: 480px) {
html, body {min-height:10px; ;}
.wrapper {width:350px; height:auto;}
.profile {width:100%; min-height:0px; margin-top:-8px; border-top:1px solid white;}
.logo img{width:300px; margin-top:21px; float:left;  position: relative;  overflow: hidden;}
.postlogo img{display: none;}
nav li {width:100%; float:none; border-bottom:1px solid #828283; padding:0px 0;}
nav ul {border-top:1px solid #828283;}
nav {display:none;}
h2 {font-size: 8px; line-height: 10px;}
.loop {width:350px; min-height:0px; margin-bottom:1px; margin-top:0px;}
#up-arrow img {display:none;}
.post {display:none }
.inner-stand {display: none;  margin-bottom:0px; margin-top:0px;}
.nav-box {width:135px; float:left; }

.logodrop {width:100%; position: relative; margin-top:1px; margin-bottom:23px; float:right; }


.opening {font-size: 16px!important; line-height: 18px!important; width:350px; float:left}

.page-content {width:350px; float:right; }
.section-left {width:350px; float:left; margin-top:-82px; min-height:1px;}
.section-right {width:350px; float:left; margin-top:-82px; min-height:1px;}

.phone-nav {display: block;}
.phone-nav li {float:left; margin-right:10px;}
.stick {position: relative; top:0px;}
header {position: relative; margin-top:-60px; margin-bottom:0px;}
#top-pad {display: none;}
.wrapper {margin-top:0px;}
.stand {margin-top:1px; margin-bottom:1px;}
.blue-overlay2 {display:none;}
.inner-loop {width:350px;}
h2 {font-size: 18px!important; line-height: 24px!important; width:90%;}
.project-info {display:none;}
.child-pages {display:none;}
.child1 {display:none }
.child2 {display:none }
.image-pad {display: none;}
.mobile-hide {width:100%; min-height:1px; display:block;}
.mobile-hide img {width:100%; height:auto;}
.blue {padding-top:0px;}
.nav-left { width:8px;}
.nav-right { width:8px;}
.blue {display:none;}

.verify{display:inline; width:360px; float:left; margin-left:2px; display:visible; margin-top:12px; font-size:12px; height:46px;}
.frame_show{display:inline;}

.ph_contact{display:inline; font-size:18px; width:360px; float:left; margin-left:2px; margin-top:204px; padding-bottom:4px;  display:visible; font-size:14px; height:16px;}
}



/* iPads (portrait and landscape) ----------- */

@media only screen 

and (min-device-width : 768px) 

and (max-device-width : 1024px) {



.image-pad{display:none;}	

.contact {background:none; position: absolute;}

.mobile-hide {display: block; width:100%; min-height: 10px;}

.mobile-hide img {width:150%; position: fixed; z-index: -100;}



}





/* make keyframes that tell the start state and the end state of our object */

@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }







.colour-next-thumb img {

-webkit-transition:all .4s;

    -moz-transition:all .4s;

    -ms-transition:all .4s;

    -o-transition:all .4s;

    transition:all .4s;}

    

    

.colour-next-thumb img:hover {

-webkit-filter:  saturate(100%);

}



.colour-next-thumb img:not(:hover) {

-webkit-filter:  saturate(0%);

 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */

    filter: grayscale(100%);

    filter: gray; /* IE6-9 */

}





.colour-image img { /* Universal settings */

    -webkit-transition:all .4s;

    -moz-transition:all .4s;

    -ms-transition:all .4s;

    -o-transition:all .4s;

    transition:all .4s;

}

.colour-image img:not(:hover) {

-webkit-filter:  saturate(0%);

 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'https://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */

    filter: grayscale(100%);

    filter: gray; /* IE6-9 */

}

.colour-image img:hover {

-webkit-filter:  saturate(100%);

}

.side-nav {display:none;}
