html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
ol,ul {list-style: none;margin: 0px;padding: 0px;}
blockquote,q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
a {text-decoration: none;}
.txt-rt {text-align: right;}
.txt-lt {text-align: left;}
.txt-center {text-align: center;}
.float-rt {float: right;}
.float-lt {float: left;}
.clear {clear: both;}
.pos-relative {position: relative;}
.pos-absolute {position: absolute;}
.vertical-base {vertical-align: baseline;}
.vertical-top {vertical-align: top;}
nav.vertical ul li {display: block;}
nav.horizontal ul li {display: inline-block;}
img {max-width: 100%;}
body {font-family: 'Open Sans', sans-serif;font-size: 100%;background: #559f9f;}
h1 {font-size: 3.5em;color: #fff;letter-spacing: 3px;text-align: center;font-style: italic;margin: 3vw 1vw;font-family: 'Josefin Sans', sans-serif;}
h1 span,h2 i {color: #fc0;}
h2 {color: #fff;font-size: 22px;font-weight: 500;letter-spacing: 1px;text-transform: capitalize;margin-bottom: 1em;}
.sub-main-w3 {display: -webkit-flex;display: -webkit-box;display: -moz-flex;display: -moz-box;display: -ms-flexbox;display: flex;align-items: center;-webkit-box-pack: center;-moz-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;}
.sub-main-w3 form {max-width: 600px;margin: 0 5vw;background: rgba(10, 10, 10, 0.17);padding: 3.5vw;box-sizing: border-box;display: -webkit-flex;display: flex;flex-wrap: wrap;justify-content: center;border-bottom: 8px solid #fc0;border-radius: 30px 30px 50px 50px;}
.form-style-agile {margin-bottom: 1.5em;flex-basis: 100%;-webkit-flex-basis: 100%;}
.sub-main-w3 label {font-size: 14px;color: #fff;display: inline-block;font-weight: 500;margin-bottom: 12px;text-transform: capitalize;letter-spacing: 1px;}
.sub-main-w3 label i {font-size: 15px;margin-left: 5px;color: #fc0;border-radius: 50%;line-height: 1.9;text-align: center;}
.form-style-agile input[type="text"],.form-style-agile input[type="password"] {width: 100%;color: #000;outline: none;font-size: 14px;letter-spacing: 1px;padding: 15px 15px;box-sizing: border-box;border: none;border: 1px solid #000;background: #fff;}
.sub-main-w3 input[type="submit"] {color: #fff;background: #fc0;border: none;padding: 13px 0;margin-top: 30px;outline: none;width: 36%;font-size: 16px;cursor: pointer;letter-spacing: 2px;-webkit-transition: 0.5s all;-o-transition: 0.5s all;-moz-transition: 0.5s all;-ms-transition: 0.5s all;transition: 0.5s all;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.49);}
.sub-main-w3 input[type="submit"]:hover {background: #1989f9;-webkit-transition: 0.5s all;-o-transition: 0.5s all;-moz-transition: 0.5s all;-ms-transition: 0.5s all;transition: 0.5s all;}
.wthree-text {width: 100%;}
.wthree-text ul li:nth-child(1) {float: left;}
.wthree-text ul li:nth-child(2) {float: right;}
.wthree-text ul li {display: inline-block;}
.wthree-text ul li a {color: #fff;font-size: 14px;letter-spacing: 1px;font-weight: 500;}
.wthree-text label {font-size: 15px;color: #fff;cursor: pointer;position: relative;}
.wthree-text {text-align: center;}
input.checkbox {background: #fc0;cursor: pointer;width: 1.2em;height: 1.2em;vertical-align: text-bottom;}
input.checkbox:before {content: "";position: absolute;width: 1.2em;height: 1.2em;background: inherit;cursor: pointer;}
input.checkbox:after {content: "";position: absolute;top: 4px;left: 4px;z-index: 1;width: 1em;height: 1em;border: 1px solid #fff;-webkit-transition: .4s ease-in-out;-moz-transition: .4s ease-in-out;-o-transition: .4s ease-in-out;transition: .4s ease-in-out;}
input.checkbox:checked:after {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);height: .5rem;border-color: #fff;border-top-color: transparent;border-right-color: transparent;}
.anim input.checkbox:checked:after {-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);height: .5rem;border-color: transparent;border-right-color: transparent;animation: .4s rippling .4s ease;animation-fill-mode: forwards;}
@keyframes rippling {
    50% {border-left-color: #fff;}
    100% {border-bottom-color: #fff;border-left-color: #fff;}
}
::-webkit-input-placeholder {color: #000;}
:-moz-placeholder {color: #000;}
::-moz-placeholder {color: #000;}
:-ms-input-placeholder {color: #000;}
.footer {margin: 4vw .3vw 2vw;}
.footer p {font-size: 14px;color: #fff;letter-spacing: 2px;text-align: center;line-height: 1.8;}
.footer p a {color: #fff;-webkit-transition: 0.5s all;-o-transition: 0.5s all;-moz-transition: 0.5s all;-ms-transition: 0.5s all;transition: 0.5s all;}
.footer p a:hover {color: #fc0;-webkit-transition: 0.5s all;-o-transition: 0.5s all;-moz-transition: 0.5s all;-ms-transition: 0.5s all;transition: 0.5s all;}
#bg {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;}
#bg canvas {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
@media(max-width:1920px) {
    h1 {font-size: 3vw;font-style: normal;font-weight: 500;margin-top: 7.5vw;}
}
@media(max-width:1024px) {
    h1 {font-size: 2.5vw;}
}
@media(max-width:800px) {
    h1 {font-size: 2em;}
}
@media(max-width:480px) {
    h1 {font-size: 1.8em;letter-spacing: 1px;}
    .sub-main-w3 form {padding: 7.5vw;}
    .footer p {letter-spacing: 1px;}
}
@media(max-width:414px) {
    .form-style-agile input[type="text"],.form-style-agile input[type="password"] {font-size: 13px;padding: 13px 15px;}
    .wthree-text ul li:nth-child(1),.wthree-text ul li:nth-child(2) {float: none;}
    .wthree-text ul li:nth-child(2) {margin-top: 10px;}
    .sub-main-w3 input[type="submit"] {width: 56%;}
    .wthree-text ul li {display: block;}
}
@media(max-width:320px) {
    h1 {font-size: 1.8em;margin: 5vw 1vw;}
    .sub-main-w3 form {padding: 25px 14px;}
}
