/* Global */
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
a, em, img, strong, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, embed, footer, header, hgroup,
menu, nav, output, section, summary,
time, mark, audio, video
{
margin: 0;
padding: 0;F
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, footer, header, hgroup, menu, nav, section {display: block;
}
body {line-height: 1;
}
ol, ul {list-style: none;
}
blockquote, q {quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none;
}
table {border-collapse: collapse; border-spacing: 0; width:100%;
}
strong {font-weight:500;
}
#phone-text a{color:#fff; text-decoration:none;
}
img {vertical-align:bottom;
}
i {font-style:italic;
}
/*--reset--*/
html { }
body {margin: 0 !important; padding: 0 !important; background-color:#fff;
}
a:link {text-decoration:none; color:#177051; font-weight:400;
}
a:visited {text-decoration:none; color:red;
}
a:hover {color:#1d6f69;
}
a:active {color:red;
}
a.x:link {text-decoration:none; color:#000;
}
a.x:visited {text-decoration:none; color:#000;
}
a.x:hover {color:#1d6f69;
}
a.x:active {color:red;
}
a.y:link {text-decoration:none; color:#fff; font-weight:600;
}
a.y:visited {text-decoration:none; color:#fff;
}
a.y:hover {text-decoration:none; color:#fff;
}
a.y:active {text-decoration:none; color:#fff;
}
a.bl:link {text-decoration:none; color:#0013b9;
}
a.bl:visited {text-decoration:none; color:blue;
}
a.t:link {text-decoration:none; color:#0013b9;
}
a.t:visited {text-decoration:none; color:blue;
}
a.t:hover {text-decoration:none; color:red;
}
a.t:active {text-decoration:none; color:#0013b9;
}
a.w:link {text-decoration:none; color:#fff;
}
a.w:visited {text-decoration:none; color:#fff;
}
a.w:hover {text-decoration:none; color:#fff;
}
a.w:active {text-decoration:none; color:#fff;
}
#phone-text a {color:#fff; text-decoration:none;
}
.wrapper {max-width:1920px; width:100%; margin:0 auto; position:relative;
}
.header {width:100%; float:left; background:url('blue.jpg'); background-size:cover;
}
.header-2 {width:100%; float:left; background:url('blue.jpg'); background-size:cover;
}
.shad {width:100%; float:left; height:2px; background:rgba(46.06, 47.4, 48.3, 0.3);
}
.mad {width:10%; float:right; margin:1% 2% 0 0;
}
.title {width:70%; margin:2% 0 6% 6%; float:left;
}
.title-2 {width:90%; margin:2% 0 3% 6%; float:left;
}
.title-2 h1 {font-family: "Prosto One", sans-serif; font-weight:400; font-style:normal; color:#fff; font-size:60px;
}
.title-2 h4 {font-family: "Roboto", sans-serif; font-weight:300; font-style:normal; font-size:29px; color:#fff; margin:0; padding:0;
}
.logo {width:200px; float:left; width:90px; margin-right:5px;
}
.basic-100 {width:100%; float:left;
}
.basic-100blk {width:100%; float:left; padding:2% 0; background:#0f0f0f;
}
.basic-80 {width:80%; float:left;
}
.ac-100m {width:50%; float:left; background:url('mech.jpg'); margin-left:30%;
}
.ac-100blk {width:100%; float:left; margin:0; background:#000; padding:0.3% 0;
}
.ac-96 {width:96%; float:left; margin:2%;
}
.ac-70 {width:60%; float:left; margin:3% 0 1% 18%; padding:2%; border:1px #94b4d3 solid; background:#f9f9f9;
}
.app-70 {width:70%; float:left; margin:2% 15%;
}
.s-70 {width:64%; float:left; margin:2% 18%;
}
.nopad-70 {width:64%; float:left; margin:3% 0 3% 18%; border:2px #94b4d3 solid;
}
.s-outer {width:100%; float:left; margin:2% 0; background:#6d95b8;
}
.studio-70 {width:1100px; margin:2% auto; background:#35557b; padding:0; border-radius:6px; border:2px #8bb8ec solid; height:200px;
}
.stud-L {width:220px; float:left; border-right: 2px #fff solid; margin:14px 40px 0 10px; padding:74px 25px;
}
.studio-70 h4 {font-size:24px; font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; color:#fff; margin:4px 0 0 0;
}
.stud-R {width:600px; float:left; margin:14px 0 0 0; text-align:justify;
}
.stud-R p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:14px; color:#fff; line-height:140%; padding-bottom:10px;
}
.stud-RR {width:80px; float:right; margin:10px 10px 0 0;
}
.disp {width:46%; float:left; margin:0 2%;
}
.d-top {width:96%; float:left;
}
.d-btm {width:96%; float:left; padding:2% 2% 0 2%; text-align:justify;
}
.ac-50 {width:50%; float:left;
}
.tx-50 {width:50%; float:left; margin:2% 25%;
}
.hd-60 {width:60%; float:left; margin:2% 10% 2% 18%;
}
.hd-60 h3 {font-family: "Roboto", sans-serif; font-weight:500; font-style: normal; font-size:160%; color:#000; line-height:140%; padding-bottom:4%;
}
.f60 {width:60%; float:left; margin:0 20%;
}
.ac-60 {width:52%; float:left; margin:3% 0 0 6%; text-align:left;
}
.ac-40-outer {width:30%; float:right; margin-right:6%; background:#6d95b8; position:relative; z-index:500; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.ac-40 {width: 86%; float:left; margin:6% 4% 6% 4%; background:#35557b; padding:2%; border-radius:6px; border:2px #8bb8ec solid;
}
.ac-40 h2 {font-family: "Prosto One", sans-serif; font-weight:400; font-style: normal; color:#fff; font-size:160%; padding:4% 0;
}
.ac-40 p {font-family: 'Times New Roman', serif; font-size:120%; color:#fff; line-height:140%; padding-bottom:4%
}
.ac-40-pic {width:100%; float:left; margin-top:2%;
}
.vL {width:100%; float:left; margin:1% 0 0 0; text-align:justify;
}
.v40p1 {width:40%; float:left; margin:1% 2% 0 0;
}
.inset {width:92%; float:left; margin-left:8%;
}
.marker {width:100%; float:left; height:40px; position:relative; z-index:10;
}
.band {width:100%; position:absolute; left:0; top:-98%; background:linear-gradient(to right, #35557b, #92c8f7, #35557b); z-index:20;
}
.band-in {width:90%; float:left; margin:4% 0 3% 6%;
}
.band-in h4 {font-family: 'Georgia', serif; font-style:italic; font-size:190%; color:red; line-height:120%; padding-bottom:1%;
text-shadow: 1px 1px 0 white, -1px -1px 0 white, 1px -1px 0 white, -1px 1px 0 white; letter-spacing:2px;
}
.band-in p {font-family: 'Georgia', serif; font-style:italic; font-size:120%; color:#fff; line-height:140%; padding:0;
}
.loudout {width:100%; float:right; margin:3% 0; background:#8ebbe3;
}
.loud {width:100%%; float:left; margin:0.5% 0 0.5% 0; background:linear-gradient(to right,#70aaef, #bfe0fe, #70aaef); padding:2% 0;
border-top:1px #fff solid; border-bottom:1px #fff solid;
}
.loudin-L {width:30%; float:left; padding:2%; background:linear-gradient(#4f4f4f, #000); margin:2% 4% 2% 11%;
}
.loudin-R {width:30%; float:left; padding:2%; background:linear-gradient(#4f4f4f, #000); margin:2% 4% 2% 6%;
}
.loud h6 {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:100%; color:#fff; line-height:140%; padding-bottom:2%;
}
.container-stretch {width:100%; float:left; display:flex; align-items:stretch;
}
.video-30 {width:40%; float:left; margin:2% 30% 2% 30%;
}
.menu {width:100%; float:left; border-bottom: 1px #626264 solid;
}
.menu-outer {width:100%; float:left; background:#4a74a2;
}
.just {width:100%; text-align:justify;
}
.badges {width:280px; float:left; padding:3px; border:1px #000 solid; display:flex; align-items:center; margin:30px 30px 30px 0; text-align:center;
}
.bad-L {width:80px; float:left;
}
.bad-R {width:195px; float:left; margin-left:5px;
}
.why {width:60%; float:left; margin:2% 20% 0 20%; text-align:center;
}
.why h3 {color:#fff; font-size:140%; line-height:140%; font-style:italic; margin:0; padding:0 0 2% 0;
}
.just {width:100%; text-align:justify;
}
.pad {width: 96%; float:left; margin:2% 2% 0 2%;
}
.topex {width:96%; float:left; margin:0; padding:1.5% 2%; background:linear-gradient(to right, #afe1d4, #82cab8);
}
.price {width:96%; float:left; margin:1% 0 0 0; padding:1% 2%; background:#3c5b7f;
}
.price p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:100%; color:#fff; line-height:140%; padding-bottom:0;
}
.price h6 {font-family: "Roboto", sans-serif; font-weight:600; font-style: normal; font-size:120%; color:#fff; line-height:140%; padding-bottom:0;
}
.footer {width:100%; float:left; background:#000; padding:0.5% 0; background:url('blue.jpg');
}
.flog {width:3%; float:left; margin:1% 2% 1% 4%;
}
.how {width:99%; float:left; margin:2% 0; border:2px #a0b2b8 solid; border-radius:5px; background:#cbdde3; display:flex; align-items:center;
}
.how:hover {background:#fff;
}
.how-L {width:6%; float:left; margin:1%; background:green;
}
.how-R {width:90%; float:left;
}
.how h6 {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:120%; color:#2d4969; line-height:100%; padding:0; margin:0;
}
.f-1 {width:16%; float:left; margin: 1% 0 0 2%;
}
.f-2 {width:20%; float:left; margin:1.8% 3.3% 0 0; text-align:left;
}
.f-2 p {font-family: "Prosto One", sans-serif; font-weight: 400; font-style: normal; color:#fff; font-size:160%;
}
.f-2in {width:10%; float:left; margin-right:8%;
}
.f-3 {width:240px; float:left; margin:1% 4% 0 0;
}
.f-3 p {font-family: 'Roboto', sans-serif; font-size:20px; font-weight:300; color:#fff; margin:0; padding-bottom:20px;
}
.f-4 {width:10%; float:left; margin:0.8% 0 0 6%;
}
.footin {width:70%; float:left; text-align:center; margin:0.5% 15%;
}
.footin h2 {color:#fff; font-size:150%; font-weight:300; line-height:130%;
}
.footin p {color:#fff; font-size:120%; font-weight:300; line-height:130%; padding:1% 0; font-style:italic;
}
.footer-2 {width:100%; float:left; position:relative; display:none;
}
.footer-3 {width:100%; float:left; position:relative;
}
.blast {width:73%; position:absolute; left:27%; top:37%;
}
.blast h3 {font-family: "Roboto", sans-serif; font-weight:500; font-style: normal; font-size:130%; color:#fff;
}
.purpo {width:100%; float:left; background:#ff0085; padding:1.4% 0; margin:2% 0;
}
.purp {width: 60%; margin:0 auto; border-radius:8px; border:2px #fff solid; padding:2%; background:#830044;
}
.purp h3 {font-family: "Roboto", sans-serif; font-weight:600; font-style:normal; font-size:160%; color:#fff; line-height:140%; padding-bottom:4%;
}
.purp p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:110%; color:#fff; line-height:140%; padding-bottom:2%;
}
.clear {clear:both;
}
.freeze {width:15%; float:right;
}
.spacer {width:100%; height:5px; margin:2% 0; float:left;
}
.spacer-sp {width:100%; height:5px; margin:4% 0; float:left;
}
.spacer-sm {width:100%; height:5px; margin:1% 0; float:left;
}
.spacer-adjust {width:100%; height:15px; margin:6%; display:none;
}
.spacer-2 {width:100%; height:15px; margin:3% 0; float:left;
}
.cent {width:100%; float:left; text-align:center;
}
.line {width:100%; float:left; height:1px; background:#000; margin:2% 0;
}
.line-w {width:100%; float:left; height:1px; background:#fff; margin:2% 0;
}
.but {float:left; border-radius:4px; border:1px #000 solid; padding:3px 6px; background:#37889a; margin:0 0 10px 10px;
}
.but:hover {border:1px red solid;
}
.but p {font-family: 'Raleway', sans-serif; color:#fff; font-size:115%; font-weight:300; line-height:100%; margin:0; padding:0;
}
.butt-2 {float:left; border-radius:4px; border:1px #000 solid; padding:3px 6px; background:#fff; margin:0 0 10px 10px;
}
.f-line {width:100%; float:left; margin:1% 0; height:1px; background:#fff;
}
.line-a {width:100%; float:left; margin:0; height:2px; background:#175781;
}
.cred {width:90%; float:left; margin:0 0 1% 6%;
}
.cred p {font-family:'Arial', sans-serif; font-size:80%; color:#e3e3e3; margin:0; padding:0;
}
.sitemap {width:26%; float:left; margin:2% 0 2% 4%;
}
p.site {font-family: "Raleway", sans-serif; font-size:100%; color:#000; line-height:110%; margin:2% 0 0 0;
}
.line-sitemap {width:100%; float:left; background:#cccccc; height:1px; margin:0;
}
.splash {width:16%; float:left; margin:1% 0 0 4%;
}
.vid {width:32%; float:left; margin:1% 0 0 6%
}
.logol {width:10%; float:right; margin:0; background:#93b0cf;
}
.side {width:20%; float:right; margin:0; background:#93b0cf;
}
.ind {width:90%; float:left; margin:0.5% 0 0 6%; padding-left:2%; border-left:2px red solid;
}
.bb-outer {width:100%; float:left;
}
.buybut { display: inline-flex; float:none; border:1px #fff solid; border-radius:4px; margin:1% 0; padding:1%; background:#4f77a6;
}
.buybut h6 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:100%; color:#fff; line-height:140%; padding-bottom:0;
}
.stux {width:1020px; margin:2% auto; background:#000; height:700px; border:1px #353535 solid;
}
.stux p {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:100%; color:#cdcdcd; line-height:140%; margin:0; padding:0;
}
.stL {width:200px; height:700px; border-right:1px #353535 solid; display:flex; align-items:center; float:left;
}
.butL {width:180px; float:left; margin:0 0 0 20px;
}
.butR {width:600px; float:left; border:1px #353535 solid; margin:25px 0 20px 40px; padding:12px;
}
.butR:hover {border:1px yellow solid;
}
.table {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:100%; line-height:140%; padding-bottom:2%;
}
td, th {
border: 1px solid #ddd;
padding: 8px;
}
tr:nth-child(even){background-color: #f2f2f2;
}
tr:hover {background-color: #ddd;
}
th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #4a74a2;
color: #fff;
}
.scrollToTop{
width:5%;
height:auto;
padding:1%;
position:fixed;
top:85%;
right:2%;
display:none;
z-index:1500;
}
.scrollToTop:hover {text-decoration:none;
}
.container-70 {width:70%; float:left; margin:3% 15%; display:flex; align-items:center;
}
.container-cent, .container-cent-2 {width:100%; float:left; display:flex; align-items:center;
}
.container-port-3 {width:100%; padding:2% 0; float:left; border-bottom:2px #adbfbf solid; border-top:2px #adbfbf solid;
background:linear-gradient(to right, rgba(173,191,191,1), rgba(173,191,191,0.1), rgba(173,191,191,1));
}
.container {width:100%; float:left; display:flex; align-items:center;
}
.container-stretch-70 {width:70%; float:left; display:flex; align-items:stretch; margin:0 15%;
}
.portfolio {width:80%; margin:3% 0 3% 10%; float:left;
}
.build-50 {width:28%; margin:0 0 0 10%; float:left;
}
.build-60 {width:40%; margin-left:8%; float:left;
}
.build-80 {width:70%; margin-left:2%; float:left;
}
.build-20 {width:20%; margin:2% 0 0 2%; float:left;
}
.build-40 {width:35%; margin:2% 0 0 2%; float:left;
}
.third-port {width:24%; margin:1% 0 1% 1%; float:left;
}
.mail {width:59%; margin:1% 0 3% 20%; border:1px #000 solid; border-radius:3px; background:lime; text-align:center;
float:left; padding-top:1%;
}
#contact-area textarea {
height: 90px;
}
#contact-area textarea:focus, #contact-area input:focus {
border: 2px solid #900;
}
#contact-area input.submit-button {
width: 100px;
float: right;
}
label {
float: left;
text-align: left;
margin-right: 15px;
width: 10%;
padding-top: 5px;
font-size: 100%;
}
h1.marko {font-family: "Marko One", serif; font-weight:400; font-style: italic; color:#6d95b8; font-size:500%; padding-bottom:4%;
}
h1 {font-family: "Prosto One", sans-serif; font-weight: 400; font-style: normal; color:#fff; font-size:400%;
}
h2 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:170%; color:#304f72; padding-bottom:1%;
}
h2.m {font-family: "Roboto", sans-serif; font-weight:400; font-style:italic; font-size:160%; color:#35557b; line-height:120%; padding-bottom:2%;
}
h2.marko {font-family: "Marko One", serif; font-weight:400; font-style: italic; color:#000; font-size:300%; padding-bottom:4%;
}
h3 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:160%; color:#2d4969; line-height:140%; padding-bottom:4%;
}
h4 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:150%; color:#fff;
}
h5 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:140%; color:#304f72; padding-bottom:1%;
}
h6 {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:120%; color:#333333; line-height:140%; padding-bottom:2%;
}
h6.s {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:120%; color:#fff; line-height:140%; padding-bottom:2%;
}
h6.list {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:120%; color:#2d4969; line-height:110%; padding-bottom:0.5%;
}
p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:100%; color:#4a4c40; line-height:140%; padding-bottom:2%;
}
p.m {font-family: "Roboto", sans-serif; font-weight:400; font-style:normal; font-size:110%; color:#2d4969; line-height:130%; padding-bottom:2%;
}
p.w {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:100%; color:#fff; line-height:140%; padding:0;
}
.img-100 {width:100%; height:auto;
}
.img-disp {width:20%; float:left; margin-right:20px
}
.img-px {width:40px; float:none;
}
.img-L {width:30%; margin:3% 2% 0.3% 0; float:left;
}
.img-LL {width:30%; margin:0 1% 0 0; float:left;
}
.img-L1 {width:15%; margin:0 10px 5px 0; float:left;
}
.img-L2 {width:30%; margin:0 10px 5px 0; float:left;
}
.img-L3 {width:30%; margin:0 30px 5px 0; float:left;
}
.img-L4 {width:30%; margin:0 10px 5px 0; float:left;
}
.img-L5 {width:12%; margin:0 10px 5px 0; float:left;
}
.img-R1 {width:15%; margin:0 0 5px 10px; float:right;
}
.img-R2 {width:36%; margin:0 0 5px 20px; float:right;
}
.img-R3 {width:8%; margin:0 0 5px 20px; float:right;
}
img-p1 {width:24%; height:auto; margin:5px 3px 5px 0;
}
.img-p2 {width:31%; height:auto; margin:5px 3px 5px 0;
}
.img-P2a, .img-P2b {width:32%; height:auto; margin:5px 2px 5px 3px;
}
.img-P3 {width:23.8%; height:auto; margin:5px 2px 5px 3px;
}
.img-P4, .img-P4c {width:47%; height:auto; margin:5px 3px 5px 3px;
}
.img-P5 {width:57%; height:auto; margin:5px 3px 5px 3px;
}
.img-P6 {width:42.2%; height:auto; margin:5px 3px 5px 3px;
}
.img-p6a {width:48%; height:auto; margin:5px 3px 5px 3px;
}
.img-mid {width:70%; margin:0 15%;
}
.img-fxd {width:120px; margin:10px 0;
}
.img-fxd-2 {width:120px; margin:10px 0 30px 0;
}
.thumb {width:10%; float:left; margin:2%;
}
.apple-img {width:15%; float:left; margin:2% 0 2% 34%;
}
.micro-img {width:15%; float:left; margin:2% 30% 2% 4%;
}
@media screen and (max-width: 1440px) {
}
@media screen and (max-width: 1366px) {
.vL {width:100%; float:left; margin:6% 0 0 0;
}
.v40p1 {width:50%; float:left; margin:1% 2% 0 0;
}
h1.marko {font-size:300%; padding-bottom:4%;
}
h2.m { font-size:140%; line-height:120%; padding-bottom:2%;
}
}
@media screen and (max-width: 1280px) {
.vL {width:100%; float:left; margin:8% 0 0 0;
}
.vid {width:32%; float:left; margin:1% 0 0 2%
}
.splash {width:24%; float:left; margin:2% 0 0 4%;
}
.video-30 {width:50%; float:left; margin:2% 25% 2% 25%;
}
.why {width:70%; float:left; margin:2% 20% 0 15%; text-align:center;
}
.why h3 {color:#fff; font-size:120%;
}
.loudin-L {width:35%; margin:2% 4% 2% 6%;
}
.loudin-R {width:35%; margin:2% 0 2% 6%;
}
.logol {width:14%; float:right; margin:0; background:#93b0cf;
}
.blast {width:73%; position:absolute; left:27%; top:33%;
}
.blast h3 {font-family: "Roboto", sans-serif; font-weight:500; font-style: normal; font-size:120%; color:#fff;
}
.f-2 { width:30%; margin:1.5% 4% 0 0;
}
h3 {font-size:120%;
}
}
@media screen and (max-width: 1200px) {
.app-70 {width:90%; float:left; margin:2% 5%;
}
.band-in h4 {font-size:150%; letter-spacing:3px;
}
h6, h6.list {font-size:100%; color:#2d4969; line-height:140%; padding-bottom:4%;
}
.buybut h6 {font-size;100%;
}
h6.list {font-size:100%;
}
.img-R3 {width:12%;
}
.img-L5 {width:18%; margin:0 10px 5px 0; float:left;
}
}
@media screen and (max-width: 1190px) {
.purp {width: 50%;
}
.purp p {font-size:100%;
}
.studio-70 {width:740px; margin:2% auto; background:#35557b; padding:0; border-radius:6px; border:2px #8bb8ec solid; height:200px;
}
.stud-L {width:170px; float:left; border-right: 2px #fff solid; margin:14px 20px 0 10px; padding:74px 25px;
}
.studio-70 h4 {font-size:16px; margin:4px 0 0 0;
}
.stud-R {width:400px; float:left; margin:14px 0 0 0; text-align:justify;
}
.stud-R p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:12px; color:#fff; line-height:140%; padding-bottom:10px;
}
.stud-RR {width:60px; float:right; margin:10px 10px 0 0;
}
}
@media screen and (max-width: 1024px) {
.marker {width:100%; float:left; height:40px; position:relative; z-index:10; margin-top:2%;
}
.band {left:0; top:-96%;
}
.band-in {width:90%; float:left; margin:7% 0 3% 6%;
}
.loudin-L {width:37%; margin:2% 4% 2% 5%;
}
.loudin-R {width:37%; margin:2% 0 2% 4%;
}
.tx-50 {width:70%; float:left; margin:2% 15%;
}
.blast {width:73%; position:absolute; left:27%; top:30%;
}
.video-30 {width:60%; float:left; margin:2% 20% 2% 20%;
}
.f-2 p {font-size:120%;
}
.f-3 p {font-size:16px; padding-bottom:20px;
}
.ac-40 p {font-size:100%; color:#fff; line-height:140%; padding-bottom:4%
}
.ac-70 {width:90%; float:left; margin:5% 0 2% 2%; padding:4% 2% 2% 2%; border:2px #94b4d3 solid;
}
.nopad-70 {width:94%; margin:6% 2%;
}
.mad {width:14%; float:right; margin:1% 2% 0 0;
}
.title {margin:4% 0 4% 2%;
}
.band-in h4 {font-size:140%; letter-spacing:3%;
}
.apple-img {width:20%; float:left; margin:2% 0 2% 28.4%;
}
.micro-img {width:20%; float:left; margin:2% 20% 2% 4%;
}
h1 {font-size:260%;
}
h4 {font-size:110%;
}
.aut {width:760px; margin:3% auto;
}
#contact-area {
width: 96%;
margin-top: 25px;
}
#contact-area input, #contact-area textarea {
padding: 5px;
width: 90%;
font-family: Helvetica, sans-serif;
font-size: 100%;
margin: 0px 0px 10px 0px;
border: 2px solid #ccc;
}
label {
float: left;
text-align:left;
margin-right: 15px;
width: 30%;
padding-top: 5px;
font-size: 100%;
}
.scrollToTop{
width:10%;
height:auto;
padding:1%;
position:fixed;
top:85%;
right:2%;
z-index:1500;
}
}
@media screen and (max-width: 1020px) {
.s-70 {width:80%; float:left; margin:2% 10%;
}
.vid {width:36%; float:left; margin:1% 0 0 2%
}
.splash {width:22%; float:left; margin:2% 0 0 4%;
}
.ac-40-outer {width:70%; float:left; margin:2% 15%; background:#6d95b8;
}
.ac-40 {width: 86.3%; float:left; margin:4% 4% 4% 4%; background:#35557b; padding:2%; border-radius:6px; border:2px #8bb8ec solid;
}
.ac-60 {width:70%; float:left; margin:5% 0 0 15%;
}
.stux {width:430px; margin:2% auto; background:#000; height:700px; border:1px #353535 solid;
}
.stux p {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:100%; color:#cdcdcd; line-height:140%; margin:0; padding:0;
}
.stL {width:120px; height:700px; border-right:1px #353535 solid; display:flex; align-items:center; float:left;
}
.butL {width:110px; float:left; margin:0 0 0 5px;
}
.butR {width:290px; float:left; border:1px #353535 solid; margin:15px 0 8px 5px; padding:5px;
}
.ac-40 h2 {font-family: "Prosto One", sans-serif; font-weight:400; font-style: normal; color:#fff; font-size:160%; padding-bottom:2%;
}
.ac-40 h2 {font-size:120%;
}
.footin h2 {color:#fff; font-size:120%;
}
}
@media screen and (max-width: 800px) {
.title-2 {width:94%; margin:2% 0 6% 4%; float:left;
}
.title-2 h1 {font-size:40px;
}
.title-2 h4 {font-size:20px;
}
.logo {float:left; width:60px;
}
.ac-96 {width:96%; float:left; margin:6% 0 4% 2%;
}
.purp {width: 80%;
}
.how {width:99%; margin:2% 0; padding:1% 0; border:2px #a0b2b8 solid; border-radius:5px;
}
.how-L {width:10%; float:left; margin:1%;
}
.how-R {width:88%; float:left;
}
.how h6 {font-family: "Roboto", sans-serif; font-size:100%;
}
.footin {width:90%; float:left; text-align:center; margin:1.5% 5%;
}
.footin h2 {color:#fff; font-size:110%; font-weight:300; line-height:130%;
}
.footin p {color:#fff; font-size:110%; font-weight:300; line-height:130%; padding:1% 0; font-style:italic;
}
p {font-size:100%;
}
.img-R3 {width:20%;
}
.img-L5 {width:22%; margin:0 10px 5px 0; float:left;
}
}
@media screen and (max-width: 790px) {
.hd-60 {width:80%; float:left; margin:2% 8% 2% 10%;
}
.studio-70 {width:380px; margin:2% auto; background:#35557b; padding:0; border-radius:6px; border:2px #8bb8ec solid; height:300px;
}
.stud-L {width:80px; margin:14px 10px 0 5px; padding:118px 0px;
}
.studio-70 h4 {font-size:14px; margin:4px 0 0 0;
}
.s-70 {width:90%; float:left; margin:2% 5%;
}
.stud-R {width:270px; float:left; margin:14px 0 0 0; text-align:justify;
}
.stud-R p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:12px; color:#fff; line-height:140%; padding-bottom:10px;
}
.stud-RR {width:60px; float:right; margin:10px 10px 0 0;
}
.freeze {width:25%; float:right;
}
.container-cent {display:initial;
}
.vid {width:80%; float:left; margin:1% 0 2% 10%
}
.splash {width:30%; float:left; margin:2% 0 0 4%;
}
.sitemap {width:56%; float:left; margin:2% 0 2% 4%;
}
.app-70 {width:100%; float:left; margin:2% 0;
}
.disp {width:90%; margin:4% 5%;
}
.footer-3 {display:none;
}
.footer-2 {display:inline;
}
.blast {width:62%; position:absolute; left:28%; top:40%;
}
.blast h3 {font-size:100%;
}
.container-stretch {display:initial;
}
.loudin-L {width:90%; margin:2% 4% 2% 3%;
}
.loudin-R {width:90%; margin:2% 0 2% 3%;
}
.ac-50 {width:100%;
}
.apple-img {width:28%; float:left; margin:2% 0 2% 22%;
}
.micro-img {width:28%; float:left; margin:2% 10% 2% 4%;
}
.band-in h4 {font-size:130%; letter-spacing:2%; text-align:center;
}
.band-in p {text-align:center;
}
.band-in h4 {color:#fff; text-shadow:none;
}
h1.marko {font-size:200%; padding-bottom:4%;
}
h2.m { font-size:120%; line-height:120%; padding-bottom:2%;
}
}
@media screen and (max-width: 600px) {
.hd-60 h3 {font-size:130%; font-weight:400;
}
.spacer-sp {width:100%; height:5px; margin:10% 0; float:left;
}
.video-30 {width:80%; float:left; margin:2% 10% 2% 10%;
}
.flog {width:8%; float:left; margin: 1% 0 0 2%;
}
.logol {width:18%; float:right; margin:0; background:#93b0cf;
}
.how {width:99%; margin:2% 0; padding:1% 0; border:2px #a0b2b8 solid; border-radius:5px;
}
.how-L {width:16%; float:left; margin:1%;
}
.how-R {width:82%; float:left;
}
.f-2 p {font-size:160%;
}
.f-2 {width:60%; margin:2.8% 0 0 2%;
}
.f-3 {width:100%; float:left; margin:4% 0; text-align:center;
}
.f-4 {width:16%; margin:2% 0 0 2%;
}
.blast h3 {font-size:90%;
}
.blast {width:98%; position:absolute; left:1%; top:42%; text-align:center;
}
h1 {font-size:200%;
}
.title-2 {width:98%; margin:2% 0 6% 2%; float:left;
}
.title-2 h1 {font-size:30px;
}
.title-2 h4 {font-size:12px;
}
.logo {float:left; width:40px;
}
p.m {font-size:100%;
}
}
@media screen and (max-width: 440px) {
.studio-70 {width:86%; margin:2% auto; padding:0; border-radius:4px; border:2px #8bb8ec solid; height:300px;
}
.stud-L {width:20%; margin:14px 10px 0 5px; padding:118px 0px;
}
.studio-70 h4 {font-size:14px; margin:4px 0 0 0;
}
.stud-R {width:72%; float:left; margin:14px 0 0 0; text-align:justify;
}
.stud-R p {font-family: "Roboto", sans-serif; font-weight:400; font-style: normal; font-size:12px; color:#fff; line-height:140%; padding-bottom:10px;
}
.stud-RR {width:60px; float:right; margin:10px 10px 0 0;
}
.vid {width:100%; float:left; margin:2% 0;
}
.inset {width:96%; float:left; margin-left:4%;
}
.title {width:90%; margin:1% 0 6% 4%;
}
.tx-50 {width:90%; float:left; margin:2% 5%;
}
.marker {width:100%; float:left; height:auto; position:relative;
}
.band {width:100%; position:initial; float:left;
}
.logol {width:22%;
}
.ac-40-outer {width:100%; float:left; margin:0; background:#6d95b8;
}
.mad {width:22%; float:right; margin:1% 2% 0 0;
}
.blast {width:98%; position:absolute; left:2%; top:44%; background:rgba(0,0,0,0.4); text-align:center;
}
.why {width:90%; float:left; margin:6% 20% 0 5%;
}
.why h3 {color:#fff; font-size:110%; margin-bottom:8%;
}
.ac-60 {width:90%; float:left; margin:10% 0 0 5%;
}
.splash {width:34%; float:left; margin:2% 0 0 2%;
}
.footin {width:90%; float:left; text-align:center; margin:2.5% 5%;
}
.footin h2 {color:#fff; font-size:100%; font-weight:300; line-height:130%;
}
.stux {width:290px; margin:2% auto; background:#000; height:700px; border:1px #353535 solid;
}
.stux p {font-family: "Roboto", sans-serif; font-weight:300; font-style: normal; font-size:100%; color:#cdcdcd; line-height:140%; margin:0; padding:0;
}
.stL {width:90px; height:700px; border-right:1px #353535 solid; display:flex; align-items:center; float:left;
}
.butL {width:80px; float:left; margin:0 0 0 5px;
}
.butR {width:180px; float:left; border:1px #353535 solid; margin:15px 0 8px 5px; padding:5px;
}
h1 {font-size:190%;
}
h4 {font-size:100%;
}
h5 {font-size:115%; color:#304f72; padding-bottom:3%; line-height:180%;
}
h6, h6.list {font-size:105%;
}
.f-2 {width:60%; margin:1.8% 0 0 2%;
}
.img-L5 {width:30%; margin:0 10px 5px 0; float:left;
}
}
@media screen and (max-width: 370px) {
.hd-60 {width:90%; float:left; margin:2% 0 2% 9%;
}
.studio-70 {width:80%; margin:2% auto; padding:0; border-radius:4px; border:2px #8bb8ec solid; height:300px;
}
.stud-L {width:90%; margin:1% 5%; padding:0; border:none;
}
.studio-70 h4 {font-size:14px; margin:4px 0 0 0;
}
.stud-R {width:90%; float:left; margin:2% 5%;
}
.stud-R p {font-size:12px; color:#fff; line-height:140%; padding-bottom:10px;
}
.stud-RR {width:60px; float:right; margin:10px 10px 0 0;
}
.title-2 {width:98%; margin:2% 0 6% 2%; float:left;
}
.title-2 h1 {font-size:26px;
}
.title-2 h4 {font-size:12px;
}
.logo {float:left; width:36px;
}
.blast {width:100%; position:absolute; left:0; top:40%; background:rgba(0,0,0,0.4);
}
h1.marko {font-size:180%; padding-bottom:4%;
}
h2.m, .footin h2 {font-size:100%;
}
h3 {font-size:120%;
}
h6, h6.list {font-size:100%;
}
}
@media screen and (max-width: 330px) {
.f-4 {display:none;
}
.f-2 {width:86%;
}
.blast h3 {font-size:80%; font-eight:300;
}