*, *:before, *:after { margin: 0px; padding: 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body, html { font-family: Arial, sans-serif; font-size: 15px; color: #666666; height: 100%; background-color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } a:focus {outline: none;} a:hover {text-decoration: none;} h1,h2,h3,h4,h5,h6,p {margin: 0px;} ul, li { margin: 0px; list-style-type: none; } .logo-img { border: 2px solid #3c99b9; border-radius: 50%; } .p-t-24 {padding-top: 24px;} .p-t-34 {padding-top: 34px;} .p-b-10 {padding-bottom: 10px;} .p-b-45 {padding-bottom: 45px;} .p-b-60 {padding-bottom: 60px;} .p-b-175 {padding-bottom: 175px;} .p-l-80 {padding-left: 80px;} .p-r-74 {padding-right: 74px;} .p-r-200 {padding-right: 200px;} .m-t-10 {margin-top: 10px;} .m-b-10 {margin-bottom: 10px;} .m-r-6 {margin-right: 6px;} .m-r-30 {margin-right: 30px;} .bo-cir {border-radius: 50%;} .of-hidden {overflow: hidden;} .visible-false {visibility: hidden;} .visible-true {visibility: visible;} .trans-04 { -webkit-transition: all 0.4s; -o-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s; } .flex-w, .flex-sa, .flex-c-m, .flex-sb-m, .dis-flex { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .flex-w { -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap; } .flex-sa { justify-content: space-around; } .flex-c-m { justify-content: center; -ms-align-items: center; align-items: center; } .flex-sb-m { justify-content: space-between; -ms-align-items: center; align-items: center; } .flex-row { -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; -o-flex-direction: row; flex-direction: row; } @font-face { font-family: Poppins-Regular; src: url('fonts/Poppins-Regular.ttf'); } @font-face { font-family: Poppins-Bold; src: url('fonts/Poppins-Bold.ttf'); } @font-face { font-family: Aldrich-Regular; src: url('fonts/Aldrich-Regular.ttf'); } .container {max-width: 1200px;} .cl0 {color: #fff;} .s1-txt1 { font-family: Poppins-Bold; font-size: 15px; color: #555; line-height: 1.2; } .s1-txt2 { font-family: Poppins-Bold; font-size: 15px; color: #fff; line-height: 1.2; } .s1-txt3 { font-family: Poppins-Regular; font-size: 13px; color: #999; line-height: 1.5; } .l1-txt1 { font-family: Poppins-Regular; font-size: 30px; color: #fff; line-height: 1.2; text-transform: uppercase; } .l1-txt2 { font-family: Poppins-Bold; font-size: 70px; color: #fff; line-height: 1.1; text-transform: uppercase; } .l1-txt3 { font-family: Poppins-Bold; font-size: 30px; color: #333; line-height: 1.2; text-transform: uppercase; } .size1 { width: 100%; min-height: 100vh; } .size2 { width: 100%; height: 50px; } .size3 { width: 36px; height: 36px; } .wsize1 { width: 390px; max-width: 100%; } .bg0 {background-color: #fff;} .bg-img1 { background-position: center; background-repeat: no-repeat; background-size: cover; } .bor1 { border-radius: 10px; } .overlay1 { position: relative; z-index: 1; } .overlay1::before { content: ""; display: block; position: absolute; z-index: -1; width: 100%; height: 100%; top: 0; left: 0; background: #30bab6; background: -webkit-linear-gradient(top, #00B4DB, #240b36); background: -o-linear-gradient(top, #00B4DB, #240b36); background: -moz-linear-gradient(top, #00B4DB, #240b36); background: linear-gradient(top, #00B4DB, #240b36); opacity: 0.8; } .how-btn1 { border-radius: 25px; background-color: #240b36; padding-right: 20px; padding-left: 20px; } .how-btn1:hover { background-color: #333333; } .wrappic1 { display: block; flex-grow: 1; } .wrappic1 img { max-width: 100%; } .how-social { color: #fff; font-size: 22px; background-color: transparent; border: 2px solid #fff; border-radius: 2px; } .how-social:hover { background-color: #240b36; color: #fff; } .focus-in0:focus::-webkit-input-placeholder { color:transparent; } .focus-in0:focus:-moz-placeholder { color:transparent; } .focus-in0:focus::-moz-placeholder { color:transparent; } .focus-in0:focus:-ms-input-placeholder { color:transparent; } .hov-cl0:hover {color: #fff;} .hov-bg0:hover {background-color: #fff;} @media (max-width: 1400px) { .respon1 { padding: 15px; } } @media (max-width: 1200px) { .m-0-xl {margin: 0;} .m-lr-0-xl {margin-left: 0; margin-right: 0;} .m-lr-15-xl {margin-left: 15px; margin-right: 15px;} .m-l-0-xl {margin-left: 0;} .m-r-0-xl {margin-right: 0;} .m-l-15-xl {margin-left: 15px;} .m-r-15-xl {margin-right: 15px;} .p-0-xl {padding: 0;} .p-lr-0-xl {padding-left: 0; padding-right: 0;} .p-lr-15-xl {padding-left: 15px; padding-right: 15px;} .p-l-0-xl {padding-left: 0;} .p-r-0-xl {padding-right: 0;} .p-l-15-xl {padding-left: 15px;} .p-r-15-xl {padding-right: 15px;} .w-full-xl {width: 100%;} .respon1 { flex-direction: column; align-items: center; } .respon2 { text-align: center; } .respon3 { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-direction: column; align-items: center; } } @media (max-width: 992px) { .m-0-lg {margin: 0;} .m-lr-0-lg {margin-left: 0; margin-right: 0;} .m-lr-15-lg {margin-left: 15px; margin-right: 15px;} .m-l-0-lg {margin-left: 0;} .m-r-0-lg {margin-right: 0;} .m-l-15-lg {margin-left: 15px;} .m-r-15-lg {margin-right: 15px;} .p-0-lg {padding: 0;} .p-lr-0-lg {padding-left: 0; padding-right: 0;} .p-lr-15-lg {padding-left: 15px; padding-right: 15px;} .p-l-0-lg {padding-left: 0;} .p-r-0-lg{padding-right: 0;} .p-l-15-lg {padding-left: 15px;} .p-r-15-lg {padding-right: 15px;} .w-full-lg {width: 100%;} } @media (max-width: 768px) { .m-0-md {margin: 0;} .m-lr-0-md {margin-left: 0; margin-right: 0;} .m-lr-15-md {margin-left: 15px; margin-right: 15px;} .m-l-0-md {margin-left: 0;} .m-r-0-md {margin-right: 0;} .m-l-15-md {margin-left: 15px;} .m-r-15-md {margin-right: 15px;} .p-0-md {padding: 0;} .p-lr-0-md {padding-left: 0; padding-right: 0;} .p-lr-15-md {padding-left: 15px; padding-right: 15px;} .p-l-0-md {padding-left: 0;} .p-r-0-md{padding-right: 0;} .p-l-15-md {padding-left: 15px;} .p-r-15-md {padding-right: 15px;} .w-full-md {width: 100%;} } @media (max-width: 576px) { .m-0-sm {margin: 0;} .m-lr-0-sm {margin-left: 0; margin-right: 0;} .m-lr-15-sm {margin-left: 15px; margin-right: 15px;} .m-l-0-sm {margin-left: 0;} .m-r-0-sm {margin-right: 0;} .m-l-15-sm {margin-left: 15px;} .m-r-15-sm {margin-right: 15px;} .p-0-sm {padding: 0;} .p-lr-0-sm {padding-left: 0; padding-right: 0;} .p-lr-15-sm {padding-left: 15px; padding-right: 15px;} .p-l-0-sm {padding-left: 0;} .p-r-0-sm{padding-right: 0;} .p-l-15-sm {padding-left: 15px;} .p-r-15-sm {padding-right: 15px;} .w-full-sm {width: 100%;} .respon4 { font-size: 50px; } .respon5 { padding-left: 20px; padding-right: 14px; padding-bottom: 50px; } } @media (max-width: 480px) { .m-0-ssm {margin: 0;} .m-lr-0-ssm {margin-left: 0; margin-right: 0;} .m-lr-15-ssm {margin-left: 15px; margin-right: 15px;} .m-l-0-ssm {margin-left: 0;} .m-r-0-ssm {margin-right: 0;} .m-l-15-ssm {margin-left: 15px;} .m-r-15-ssm {margin-right: 15px;} .p-0-ssm {padding: 0;} .p-lr-0-ssm {padding-left: 0; padding-right: 0;} .p-lr-15-ssm {padding-left: 15px; padding-right: 15px;} .p-l-0-ssm {padding-left: 0;} .p-r-0-ssm{padding-right: 0;} .p-l-15-ssm {padding-left: 15px;} .p-r-15-ssm {padding-right: 15px;} .w-full-ssm {width: 100%;} }