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

html ::-webkit-scrollbar { 
    display:none; 
    transition:ease .2s;
}
body {
    transition:ease .2s;
    background-color:#f5f5f5;
    background-size: 1800px;
    background-position: center;
    background-attachment: fixed;
    font-family:Product Sans, Segoe UI, Arial, sans-serif;
    top:0;
    left:0;
    margin:0;
    transition:ease .2s;
}
header {
    transition:ease .2s;
    margin-left:auto;
    margin-right:auto;
    width:100%;
    padding:0;
	color:#fafafa;
}
#navlogo {
    margin-left:auto;
    margin-right:auto;
    position:fixed;
    left:50%;
    transform: translateX(-50%);
    z-index: 2;
    transition:ease .2s;
}
#navlogoimg {
    height:75px;
    z-index:9999999999;
    border-radius:0px 0px 10px 10px;
    background:#eeeeee;
    padding:5px;
    box-shadow: 0 2px 2px rgba(0,0,0,.3);
    transition:ease .2s;
}
#navlogoimg:hover {
    filter:brightness(110%);
    box-shadow: 0 5px 5px rgba(0,0,0,.3);
    transition:ease .2s;
}
#bannerlogo {
    width:100%;
    margin:auto;
    float: none;
    transition:ease .2s;
}
#bannerlogo img {
    width:100%;
    margin:auto;
    float: none;
    transition:ease .2s;
}
.bannerlogo {
    width:100%;
    transition:ease .2s;
    float: none;
    margin-top:-1px;
}
#banner {
    z-index:1;
    float: none;
    transition:ease .2s;
}
.banner {
    width:100%;
    height:80.575px;
    padding:2px;
    margin-right:20px;
    transition:ease .2s;
}
.footleft {
    width:20%;
    font-size:12px;
    margin:0;
    transition:ease .2s;
}
footer {
    width:100%;
    background: #212121;
    position: fixed;
    bottom:0;
    text-align:right;
    color:#ffffff;
    margin:0;
    height:50px;
    transition:ease .2s;
    padding:10px;
}
.foot {
    width:45%;
    position:fixed;
    bottom:11px;
    right:10px;
    transition:ease .2s;
}
#main {
    background:rgba(255,255,255,0.7);
    height:auto;
    margin-left:auto;
    margin-right:auto;
    width:100%;
    margin-bottom:70px;
    transition:ease .2s;
}
#left {
    height:auto;
    width:100%;
    margin:auto;
    position: relative;
    text-align: center;
    padding:auto;
    display:inline-block;
    float:none;
    transition:ease .2s;
}
#right {
    height:auto;
    width:100%;
    margin:auto;
    position: relative;
    text-align: center;
    padding:auto;
    display:inline-block;
    float:none;
    transition:ease .2s;
}
.welcome { 
    background:#64c8cf;
    text-align:center;
    margin:0;
    margin-top:-7px;
    width:100%;
    padding-top:9px;
    padding-bottom:1px;
    color:#fafafa;
    border-top:1px solid #f5f5f5;
    border-top:1px solid #e0e0e0;
    transition:ease .2s;
}
.message {
    background:#eeeeee;
    text-align:center;
    width:100%;
    margin:auto;
    border-radius:10px;
    padding-top:9px;
    padding-bottom:1px;
    border-top:1px solid #f5f5f5;
    border-top:1px solid #e0e0e0;
    font-size:24px;
    transition:ease .2s;
}
.map {
    width:100%;
    height:400px;
    transition:ease .2s;
}
#leftmap {
    height:auto;
    transition:ease .2s;
}
.paramap { 
    background:#eeeeee;
    text-align:center;
    width:40%;
    margin-left:auto;
    border-radius:10px;
    padding-top:9px;
    padding-bottom:1px;
    transition:ease .2s;
}
@media (max-width: 1200px) {
    .paramap {
        margin-top:0px;
        transition:ease .2s;
    }
}
@media (max-width: 767px) {
    .paramap {
        margin-top:450px;
        width:100%;
        transition:ease .2s;
    }
}
/**********************/
/*******FORM CSS*******/
/**********************/
#main form {
    background:#eeeeee;
    height:380px;
    padding:10px;
    border-radius:20px;
    margin-left:auto;
    width:40%;
    transition:ease .2s;
}
#main form label {
    background:#d50000;
    float:left;
    font-weight:bold;
    width:70px;
    text-align:right;
    border-radius:20px;
    padding:5px;
    color:white;
	box-shadow:0 2px 5px rgba(0,0,0,0.26) inset;
    transition:ease .2s;
}
#main form input {
    background:#448AFF;
    float:right;
    border-radius:20px;
    height:29px;
    color:white;
    padding-left:10px;
    padding-right:10px;
	box-shadow:0 2px 5px rgba(0,0,0,0.26) inset;
    border-width:0;
    width:85%;
    transition:ease .2s;
}
#main form textarea {
    font-family:"Segoe UI";
    background:#448AFF;
    float:right;
    border-radius:20px;
    height:90px;
    color:white;
    padding-top:10px;
    padding-left:10px;
    padding-right:10px;
	box-shadow:0 2px 5px rgba(0,0,0,0.26) inset;
    border-width:0;
    width:85%;
    resize:none;
    transition:ease .2s;
}
#main form input.btn {
    font-weight:bold;
    background:#d50000;
    box-shadow: 0 2px 5px rgba(0,0,0,0.26);
    width:102px;
    margin:10px;
    float:right;
    transition:ease .2s;
}
#main form input.btn:active {
	box-shadow:0 2px 5px rgba(0,0,0,0.26) inset;
    transition:ease .2s;
}
center {
    height:0;
    transition:ease .2s;
}
.pageimg {
    width:100%;
    margin-bottom:-6px;
    transition:ease .2s;
}
#clickers {
    height:100px;
    transition:ease .2s;
}
.leftbox {
    width:50%;
    height:100px;
    margin:0;
    background-color:#FFEB3B;
    filter: saturate(70%);
    position:absolute;
    left:0;
    transition:ease .2s;
}
.leftbox:hover {
    filter: saturate(100%);
    box-shadow:0 2px 2px rgba(0,0,0,.3);
    z-index:1;
    transition:ease .2s;
}
.rightbox {
    width:50%;
    height:100px;
    margin:0;
    background-color:#4CAF50;
    filter: saturate(70%);
    position:absolute;
    right:0;
    transition:ease .2s;
}
.rightbox:hover {
    filter: saturate(100%);
    box-shadow:0 2px 2px rgba(0,0,0,.3);
    z-index:1;
    transition:ease .2s;
}
.clickerstext {
    width:100px;
    background:rgba(255,255,255,.7);
    text-align: center;
    line-height: 30px;
    padding-bottom:0;
    padding-left:0;
    padding-right:0;
    padding-top:0;
    top:70px;
    width:100%;
    position:absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    transition:ease .2s;
}
.pageimgalt {
    height:300px;
    margin:0;
    transition:ease .2s;
}
.imgexample img {
    height:300px;
    width:300px;
    margin-left:-10px;
    transition:ease .2s;
}
#randimgs {
    width:100%;
    height:auto;
    margin:0;
    padding:0;
    transition:ease .2s;
}
.imgexample {
    width:100%;
    padding-top:10px;
    padding-bottom:10px;
    background-color:#358186;
    border-bottom:solid 1px rgba(0,0,0,.3);
    position:relative;
    transition:ease .2s;
}
.imgtext {
    width:70%;
    height:300px;
    background:rgba(255,255,255,.7);
    text-align: left;
    line-height: 30px;
    padding-bottom:0;
    padding-left:5px;
    padding-right:5px;
    padding-top:0;
    position:absolute;
    right: 0;
    margin: 0 auto;
    box-shadow: 0 2px 2px rgba(0,0,0,0.3);
    transition:ease .2s;
}
.imgexample:hover {
    filter:brightness(110%);
    box-shadow: 0 2px 2px rgba(0,0,0,0.3);
    transition:ease .2s;
}
.smlink {
    width:35px;
    filter: saturate(10%);
    transition:ease .2s;
}
.smlink:hover {
    filter: saturate(100%);
    transition:ease .2s;
}
.welcome2 { 
    background:#64c8cf;
    text-align:center;
    margin:0;
    width:100%;
    padding-top:9px;
    padding-bottom:1px;
    color:#fafafa;
    box-shadow: 0 2px 2px rgba(0,0,0,1);
    transition:ease .2s;
}
#text {
    background-color:#358186;
    color:#fafafa;
    padding:10px;
    padding-left:100px;
    padding-right:100px;
    transition:ease .2s;
}
.buybut {
    text-align:center;
    position:absolute;
    right:0px;
    bottom:30px;
    padding:5px;
    padding-top:8px;
    width:100px;
    background-color:#00C853;
    color:#fff;
    box-shadow: 0 2px 2px rgba(0,0,0,0.3);
    transition:ease .2s;
}
.buybut:hover {
    padding-left:10px;
    filter:brightness(150%);
    transition:ease .2s;
}
a {
    text-decoration: none;
}
@media (max-width:1189px) {
    .imgtext {
        width:60%;
    }
}
@media (max-width:990px) {
    .imgtext {
        width:50%;
    }
}
@media (max-width:710px) {
    .imgtext {
        width:45%;
    }
    #text {
        padding-left:10px;
        padding-right:10px;
        font-size:12px;
    }
}
@media (max-width:618px) {
    .imgtext {
        width:37%;
    }
}