/*
CSS for Gwenty.com
*/
/* html5doctor.com/html-5-reset-stylesheet/ */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,time,mark,audio,video { margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent; }
body { line-height:1; }
ol,ul { list-style:none; }
blockquote,q { quotes:none; }
blockquote:before,blockquote:after,q:before,q:after { content:'';content:none; }
ins { text-decoration:none; }
del { text-decoration:line-through; }
table { border-collapse:collapse;border-spacing:0; }
a {
font-weight: normal;
font-family: 'Exo 2', helvetica, sans-serif;
color: black;
}
a:link {
color: black;
text-decoration: none;
}
a:visited {
color: black;
text-decoration: none;
}
body {
background-color: white;
}
h1 {
font-size: 35px;
}
h2 {
font-size: 30px;
}
h3 {
font-size: 25px;
}
p {
font-size: 18px
}
#page {
width: 100%;
margin: auto;
}
#header {
overflow: hidden;
background-color: white;
position: fixed;
top: 0;
width: 100%;
z-index: 100;
opacity: 0.93;
left: 0.001px;
right: 0.001px;
}
#container {
width: 100%;
}
#logo {
float: left;
padding-left: 10px;
width: 125px;
}
#logo img {
width: 100%;
}
.nb, .nc { font-weight: 700; text-transform: uppercase; position: absolute; right: 1.5em; top: 1.75em; z-index: 4; }
.nb:active, .nc:active { background: rgb(153, 153, 153); }
.nc { display: none; z-index: 3; }
.nav:target + .nc { display: block; z-index: 5; padding: 15px; }
.nav { position: absolute; display: block; width: 100%; height: 0px; max-height: 0px; padding-top: 0px; opacity: 0; transition: none; }
.nav ul { display: none; margin: 0px; }
.nav li { line-height: 1.65; padding: 0px 0.3275em; }
.nav a { display: block; padding: 0px; width: 0px; height: 0px; }
.nav:target { position: relative; top: -10em; z-index: 2; padding-top: 10em; margin-bottom: -10em; height: 100%; max-height: 62.5em; opacity: 1; transition: opacity 0.4s ease-out, max-height 0.4s ease-out; }
.nav:target ul { display: block; margin-top: 70px; text-align: center; }
.nav:target a { width: auto; height: 100%; padding: 0.3875em 0px 0.3875em 0.5475em; }
.nav:target a:hover, .nav:target a:focus { background-color: black; }
.nav:target a:active { color: rgb(153, 153, 153); }
:target::before { content: ""; display: block; height: 80px; margin: -80px 0px 0px; }
.intro {
width: 75%;
margin: auto;
}
.intro h1 {
text-align: center;
width: 100%;
margin: auto;
padding: 20px 0px;
}
.intro p {
margin: 0px 0px 15px 0px;
text-align: center;
color: #fff;
font-family: sans-serif;
}
.intro .btn {
display: block;
background-color: aliceblue;
border-color: rgba(0, 0, 0, 0);
color: black;
font-size: 25px;
padding: 18px 32px;
font-family: 'Montserrat', sans-serif;
text-transform: uppercase;
text-align: center;
margin: 20px auto;
max-width: 135px;
font-weight: bolder;
border-radius: 4px;
}
.checkbox {
display: none;
}
.label {
float: right;
padding-right: 10px;
line-height: 79px;
}
#mobiledropmenu:checked ~ .title {
margin-top: 100px;
width: 100%;
height: auto;
opacity: 1;
}
.title {
width: 0%;
height: 0px;
opacity: 0;
}
.title a {
font-weight: bold;
}
.button {
text-decoration:none;
border-top:1px solid #fff;
text-align:center;
padding: 14px;
}
.button:hover {
cursor:pointer;
color: white;
border-radius: 5px;
background: black;
}
#purple {
background: #384041;
margin-top: 130px;
}
.headtitle {
color:#f0f8ff;
font-size: 40px;
text-align: center;
padding: 5%;
font-family: cursive;
}
.headtitle strong {
color: #FFFACD;
}
.headtitle2 {
font-family: 'Open Sans';
font-size: 25px;
padding: 1% 5%;
color: #9c6d62;
text-align: center;
font-weight: bolder;
}
.headtitle-info {
font-family: 'Open Sans';
text-align: center;
font-size: 1.35em;
line-height: 1.7em;
color: #f5f5f5;
padding: 0 5%;
}
#bullets { color: rgb(102, 102, 102); font-family: 'Open Sans'; padding-top: 10px; padding-bottom: 10px; text-align: center; width: 85%; margin: auto; }
#bullets li { list-style-type: none; }
#bullets li b { color: rgb(28, 28, 30); padding-bottom: 10px; text-align: left; font-size: medium; }
#bullets li p { color: rgb(91, 103, 112); font-size: medium; text-align: left; }
#bullets .fa-ul { padding-left: 0px; margin-left: 0px; list-style-type: none; color: black; }
#bullets .fa { display: inline-flex; margin-top: 25px; padding-right: 10px; padding-bottom: 7px; }
#bullets1 { color: rgb(102, 102, 102); font-family: 'Open Sans'; padding-bottom: 45px; text-align: center; width: 100%; margin: auto; }
#bullets1 li { list-style-type: none; }
#bullets1 li b { color: rgb(28, 28, 30); padding-bottom: 10px; text-align: left; font-size: medium; }
#bullets1 li p { color: rgb(91, 103, 112); font-size: medium; text-align: left; }
#bullets1 .fa-ul { padding-left: 0px; margin-left: 0px; list-style-type: none; color: black; }
#bullets1 .fa { display: inline-flex; margin-top: 25px; padding-bottom: 7px; }
#homess {
width: 100%;
}
#homess img {
width: 100%;
}
#footer {
clear: both;
padding: 10px 0px 0px 0px;
}
#footer-logo img {
width: 180px;
display: block;
margin: auto;
padding: 30px 0px 20px 0px;
}
#footer-info {
padding-bottom: 25px;
}
#footer-info h1 {
width: 50%;
text-align: center;
margin: auto;
}
#footer-info h4 {
color: black;
font-size: small;
text-align: center;
padding: 20px 10px;
}
#footer-info .intro .btn {
background-color: black;
font-weight: bold;
font-size: large;
color: #f5f5f5;
}
#footer-info .intro .btn a:visited {
color: #f5f5f5;
}
#footerlinks .btn {
display: block;
background-color: #f06544;
border-color: rgba(0, 0, 0, 0);
color: white;
font-size: 25px;
padding: 5% 2%;
font-family: 'Montserrat', sans-serif;
text-transform: uppercase;
text-align: center;
margin: auto 1px;
width: 28.8%;
font-weight: bolder;
border-radius: 4px;
float: left;
}
#pemlogo {
float: left;
width: 32%;
margin-left: 1%;
}
#pemlogo img {
max-width: 60%;
height: auto;
}
#contact {
width: 32%;
margin-left: 1%;
color: white;
}
#contact p {
font-size: .8em;
}
.concolour {
color: #e31b23;
font-weight: bold;
font-family: "Open Sans";
font-size: 1em;
}
#circle {
float: left;
width: 34%;
text-align: center;
}
.menu {
margin: auto;
display:block;
width:80px;
height:80px;
border-radius:40px;
color: #e31b23;
background: #e31b23;
}
.contactme {
display: block;
padding-top: 30px;
font-size: 15px;
font-weight: bold;
text-align: center;
text-decoration: none;
}
.menu:hover {
color: white;
text-decoration: none;
border-radius: 5px;
background: black;
}
#social {
}
#social strong {
color: black;
text-align: center;
display: block;
}
#social ul {
text-align: center;
}
#social ul li {
display: inline-block;
background: black;
border: 1px;
border-radius: 5px;
}
.connectcolour {
display: block;
color: #e31b23;
font-weight: bold;
padding-bottom: 3px;
font-size: 1em;
font-family: "Open Sans";
}
#rldesign {
clear: both;
width: 100%;
}
#rldesign p {
margin-right: auto;
margin-left: auto;
text-align: center;
font-size: .6em;
}
/************** Listing Page **************/
#container2 {
width: 100%;
background: whitesmoke;
}
#listings {
width: 95%;
margin: auto;
padding-top: 20px;
}
hr {
height:0;
border:0;
border-top:1px solid;
}
#listingsummary {
width: 100%;
margin-top: 15px;
text-align: center;
}
#listingsummary a:link {
color: #e31b23;
}
#listingsummary a:visited {
color: #e31b23;
}
#listingsummary h3 {
color: #e31b23;
padding-bottom: 3px;
}
#listingsummary img {
max-width: 100%;
border: 1px solid #999;
border-radius: 3px;
}
.forsale {
font-size: 20px;
color: #e31b23;
font-style: bold;
}
/*****************************************
Listing Full
******************************************/
#photothumbs {
}
#listingpage {
width: 100%;
margin-top: 15px;
text-align: center;
}
#listingpage p {
text-align: justify;
}
#listingpage h3 {
color: #e31b23;
padding-bottom: 3px;
}
#listingpage img {
max-width: 100%;
border-radius: 3px;
}
.photofull img {
display: block;
max-width: 100%;
margin: auto;
}
/*****************************************
Contact us
******************************************/
#container2 h1, h2 {
color: #e31b23;
padding-top: 10px;
}
#ray {
width: 90%;
margin: auto;
padding: 10px 0;
}
#ray img {
width: 100%;
margin: auto;
display: block;
border-radius: 2px;
}
#raytext {
margin: 0px;
text-align: center;
}
#ray a:link {
color: #000;
}
#ray a:visited {
color: #000;
}
iframe {
width: 90%;
height: 350px;
margin: auto;
display: block;
padding-top: 5px;
padding-bottom: 10px;
}
/*****************************************
Form style
******************************************/
form,input,select,textarea {
margin:0;
padding:0;
color:#000;
}
.box {
clear: both;
margin: auto;
margin-bottom: 10px;
width: 95%;
background-color: #EBEBEB;
border: 2px solid #A8A8A8;
border-radius: 5px;
}
.box label {
width: 100%;
display: block;
background-color: #EBEBEB;
border-top: 1px solid #A8A8A8;
border-bottom: 1px solid #A8A8A8;
padding: 10px 0 10px 0px;
}
.box label span {
display: block;
color: #000;
font-size: .75em;
float: left;
width: 25%;
text-align: left;
padding: 5px 2% 0 1%;
}
.box h3 {
color: #e31b23;
}
.textarea {
width: 90%;
height: 90px;
margin-left: 15px;
margin-top: 15px;
}
.textarea1 {
width: 60%;
}
.box .button {
margin: 2px 10px;
padding: 4px 7px;
background-color: #e31b23;
width: 16%;
border: 0px;
border-radius: 2px;
font-weight:bold;
line-height: 50px;
}
@media only screen and (min-width: 1024px) {
#page {
margin: auto;
}
.nb, .nc { display: none; }
.nb:active, .nc:active { all: unset;}
.nc { all: initial; }
.nav:target + .nc { all: unset; }
.nav { opacity: 1; }
.nav ul {
display: block;
line-height: 80px;
margin: auto;
float: right;
}
.nav li {
line-height: 80px;
padding: 20px;
float: left;
}
.nav a {
font-size: larger;
line-height: 50px;
display: block;
border-radius: 5px;
width: auto;
height: auto; }
.nav:target { position: auto; top: auto; z-index: auto; padding-top: auto; margin-bottom: auto; height: auto; max-height: auto; opacity: auto; transition: opacity 0.4s ease-out, max-height 0.4s ease-out; }
.nav:target ul { display: block; margin-top: auto; text-align: center; }
.nav:target a { width: auto; height: 100%; padding: auto; }
.nav a:hover, .nav a:focus { background-color: black;
color: white; }
.nav a:active { color: rgb(153, 153, 153); }
#purple {
margin: 125px auto auto auto;
}
.intro h1 {
margin-top: 25px;
margin-left: auto;
margin-right: auto;
margin-bottom: 25px;
text-align: center;
width: 50%;
font-size: 50px;
}
.title {
width: auto;
height: 79px;
opacity: 1;
text-align: center;
}
.button {
display: inline-block;
border: 0px;
padding: 0 14px;
line-height: 79px;
}
.label {
display: none;
}
.headtitle {
font-size: 44px;
max-width: 75%;
margin: auto;
}
.headtitle2 {
font-size: 38px;
border-width: 1px;
border-radius: 10px;
width: 50%;
margin: auto;
}
.headtitle-info {
font-size: 28px;
width: 70%;
margin: auto;
}
.headtitle-info1 {
width: 70%;
margin: 30px auto auto auto;
}
#about p {
width: 80%;
}
#bullets {
}
#bullets li {
width: 50%;
float: left;
padding-top: 30px;
}
#bullets li b {
}
#bullets li p {
padding: 0px 25px 25px 25px;
}
}